.embed { width: 100%; overflow: hidden; }
    .hero {
      overflow: hidden;
      position: relative;
      height: 0;
      margin-bottom: 3em;
      margin-top: -2px;
      opacity:0;
     /* transform: scale(1.05);*/
      background-image: url('http://stmedia.stimg.co/mooseCover2.jpg?w=2500');
      background-position: center top;
      background-size: cover;
      background-repeat: no-repeat;
      background-color: #000;
      animation: introFade 5s 3s ease-out forwards;
  }

  @keyframes introFade {
    from {opacity:0;}
    to {opacity:1;}
  }

 /* hero kerning*/
  .av {letter-spacing: -8px;}

  .scroll-label {
      color: #fff;
      text-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
      font-family: 'Benton Sans';
      font-size: 1em!important;
      text-align: center;
      margin-top: 36px!important;
      position: absolute;
      bottom: 20px;
      left:50px;
      width: 15%;
      z-index: 2;
      opacity: 0;
      animation: introScrollFade 5s 7s ease-out forwards;
  }
  @keyframes introScrollFade {
    from {opacity:0;}
    to {opacity:.65;}
  }

  .scroll-label img {
      display: block;
      margin: 6px auto 0 auto;
      width: 30px;
  }
  .project-body {
      visibility: hidden;
      padding: 0 2%;
  }
  .intro {
      width: 853px;
      font-size: 2.35em;
      margin-top: 0;
      margin-bottom: .5em;
      font-family: 'Whitman Display', serif;
      line-height: 140%;
  }
  .article-byline-mod {
      padding-bottom: 35px;
  }
  .article-byline {
      border-right: none;
      margin-top: 8px;
  }
  .article-byline a:hover {
      color: #999;
  }
  .article-byline-mod:before {
      display: none;
  }
  .article-byline-mod {
      margin-top: 0;
  }
  .article-byline.notes {
      font-size: .95em;
  }
  .article-dateline {
      margin-top: 6px;
  }
  h1 {
      font-weight: bold;
      text-transform:uppercase;
      color: #fff;
      font-family: "Whitman Display", sans-serif;
      font-size: 5.55em;
      line-height: 90%;
      letter-spacing: -2px;
      position: absolute;
      top: 50px;
      left:50px;
      z-index: 2;
      text-align: center;
      width: 25%;
      text-shadow: 2px 2px 20px rgba(0, 0, 0, 1),2px 2px 5px rgba(0, 0, 0, .5);
      opacity:0;
      animation: introFade 2s 4s ease-in forwards;
  }


  .project-body h3 {
      font-family: 'Whitman Display';
      font-weight: 400;
      margin-top: 60px;
      margin-bottom: 16px;
      font-size: 2.2em;
  }
  .crop-gradient {
      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+100,000000+100&0+30,0.65+76,1+100 */
      
      background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 76%, rgba(0, 0, 0, 1) 100%);
      /* FF3.6+ */
      
      background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, rgba(0, 0, 0, 0)), color-stop(76%, rgba(0, 0, 0, 0.65)), color-stop(100%, rgba(0, 0, 0, 1)));
      /* Chrome,Safari4+ */
      
      background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 76%, rgba(0, 0, 0, 1) 100%);
      /* Chrome10+,Safari5.1+ */
      
      background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 76%, rgba(0, 0, 0, 1) 100%);
      /* Opera 11.10+ */
      
      background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 76%, rgba(0, 0, 0, 1) 100%);
      /* IE10+ */
      
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 76%, rgba(0, 0, 0, 1) 100%);
      /* W3C */
      
      filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000', GradientType=0);
      /* IE6-9 */
      
      position: absolute;
      width: 100%;
      bottom: 0;
      z-index: 1;
      height: 70%;
  }

  .crop-gradient { position: absolute;
      width: 100%;
      bottom: 0;
      z-index: 1;
      height: 0;}


  #fixed_leader {
      display: none;
  }
  .mobile-hero {
      display: none;
  }
  .isMobile .hero {
      display: none;
  }
  .isMobile .mobile-hero {
      display: block;
      position: relative;
      background: url('http://stmedia.stimg.co/mooseCover2.jpg?w=1500') center top no-repeat;
      background-size: cover;
      height: 600px;
      margin-top: 0 !important;
      top: 0 !important;
  }
  .topCaption {
      z-index: 2;
      width: 190px;
      position: absolute;
      right: -300px;
      margin-top: 24px;
  }
  .related-caption,
  .related-caption.package-caption {
      padding-top: 12px;
      clear: both;
  }
  .related-media.size-m,
  .related-media.size-l,
  .related-media.size-xl {
      margin-top: 0;
  }
  .related-media.size-xl {
      margin-left: -116px;
  }
  .photo-package {
      float: left;
      margin-bottom: 24px;
  }
  .photo-package .related-media {
      padding-bottom: 0;
  }
  .photo-package-1 {
      width: 853px;
  }
.related-media.church-photo.size-xl {
margin-bottom: 0;
}
.related-media.home-photo.size-l {
margin-bottom: 0;
margin-top: 24px;
}
.home-photo .related-caption,
.photo-package-1 .related-media .related-caption,
.church-photo .related-caption,
.stands-photo .related-caption,
.photo-package-3 .photo1 .related-caption,
.photo-package-3 .photo2 .related-caption,
.photo-package-4 .photo1 .related-caption,
.photo-package-4 .photo2 .related-caption,
.photo-package-4 .photo3 .related-caption {
display: none;
}

  .photo-package-1 {
      margin-bottom: 36px;
  }
  .photo-package-1 .related-media.size-m {
      width: 100px;
      float: left;
      margin-top: 0;
      width: 49%;
      clear: none;
  }
  .photo-package-1 .related-media.size-m.right {
      width: 100px;
      float: right;
      margin-top: 0;
      width: 49%;
      clear: none;
  }
  .photo-package-1 .expand-icn-wrapper {
      max-height: 265px;
      overflow: hidden;
  }
  .photo-package-1 .left .related-caption {
      width: 853px;
  }


.related-media.coach-photo.size-m,
.related-media.washington-photo.size-m {
    float: right;
    width: 524px;
    margin: 24px -329px 24px 60px;
}


  .photo-package-2,
  .photo-package-3 {
      width: 970px;
      float: left;
      margin-left: -116px;
      position: relative;
  }
  .photo-package-2 .photo1 {
      float: left;
      width: 620px;
  }
  .photo-package-2 .photo2 {
      position: absolute;
      top: 0;
      right: 0;
      width: 320px;
  }
  .photo-package-2 .photo3 {
      position: absolute;
      top: 252px;
      right: 0;
      width: 320px;
  }
  .photo-package-2 .photo2 .expand-icn-wrapper,
  .photo-package-2 .photo3 .expand-icn-wrapper {
      height: 225px;
      overflow: hidden;
  }
  .photo-package-3 .photo1 {
      float: left;
      width: 49%;
      clear: none;
  }
  .photo-package-3 .photo2 {
      float: right;
      width: 49%;
      clear: none;
  }
  .photo-package-3 .photo1 .expand-icn-wrapper,
  .photo-package-3 .photo2 .expand-icn-wrapper {
      overflow: hidden;
  }
  .photo-package-4 .photo1 {
      float: right;
      width: 620px;
      position: relative;
      margin-left: 350px;
  }
  .photo-package-4 .photo2 {
      position: absolute;
      top: 0;
      left: 0;
      width: 330px !important;
  }
  .photo-package-4 .photo3 {
      position: absolute;
      top: 218px !important;
      left: 0;
      width: 330px !important;
  }
  .photo-package-4 .photo2 .expand-icn-wrapper,
  .photo-package-4 .photo3 .expand-icn-wrapper {
      overflow: hidden;
      height: 199px !important;
  }
  .map.size-xl {
      width: 200px;
      position: absolute;
      right: -300px;
  }
  .related-byline {
      display: none;
  }
  aside.article-share {
      margin-top: 230px;
  }
  .photo-package.photo-package-3 {
      margin-top: 24px !important;
      margin-bottom: 0 !important;
      clear: both !important;
  }


.related-media.church-photo.size-xl {
margin-bottom: 0 !important;
margin-top: 12px !important;
clear: both;
}
.walk-photo .related-caption,
.stands-photo .related-caption {
display: block !important;
padding-top: 18px;
margin-bottom: 24px;
}


  .article-featured-gallery-mod {
      width: 220px;
      position: absolute;
      right: -330px;
      top: -220px;
  }
  #photo-zilla-1,
  #photo-zilla-2 {
      position: relative;
  }


.walking-photo {
background-image: url(http://stmedia.stimg.co/CM2_4650.jpg?w=2500);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 100%;
margin-bottom: 90px;
}
.sidelines-photo {
background-image: url(http://stmedia.stimg.co/CM2_5149.jpg?w=2500);
background-repeat: no-repeat;
background-position: center bottom;
background-size: 100%;
margin-bottom: 90px;
margin-top: 42px;
}
.walking-photo .related-caption.package-caption,
.sidelines-photo .related-caption.package-caption {
position: relative;
top: 100%;
margin: 0 36px 0 36px;
}


  .dropCap {
      float: left;
      font-size: 5.3em;
      line-height: 70%;
      padding-right: 6px;
      font-family: 'Whitman Display'!important;
      margin-top: 6px;
  }
.no-project{display:none;}

/*MOOSE 1 Photo Package*/
.photo-package.photo-package-moose1 {
  margin-top: 90px !important;
  margin-bottom: 0 !important;
  /*clear: both !important;*/
}

.photo-package-moose1 .photo1 .related-caption,
.photo-package-moose1 .photo2 .related-caption
{
 /* display: none;*/
}

.photo-package-moose1 {
  width:400px;
  float:right;
  position: relative;
  margin-right:-329px;
  margin-left:30px;
}

.photo-package-moose1 .photo1 {
  float: none;
  width: 100%;
  clear: none;
}

.photo-package-moose1 .photo2 {
  margin-top:0px;
  margin-bottom:15px;
  float: none;
  width: 100%;
  clear: none;
}

.photo-package-moose1 .photo1 .expand-icn-wrapper,
.photo-package-moose1 .photo2 .expand-icn-wrapper {
  overflow: hidden;
}

.photo-package-moose1 .related-caption.package-caption {
  padding-top:0;
}
/*END MOOSE 1 Photo Package*/

/*MOOSE 2 Photo Package*/
.photo-package.photo-package-moose2 {
/*  margin-top: 5px !important;
  margin-bottom: 0 !important;*/
  /*clear: both !important;*/
}


.photo-package-moose2 .photo1 .related-caption,
.photo-package-moose2 .photo2 .related-caption,
.photo-package-moose2 .photo3 .related-caption
{
  display: none;
}


.photo-package-moose2 {
    position: relative;
    margin-bottom: 16px;
    width: 970px;
    margin-left: -117px;
    margin-top: 14px;
}

.photo-package-moose2 .photo1 {
  float: left;
  width: 485px;
  clear: none;
}

.photo-package-moose2 .photo2 {
  margin-top:0;
  margin-bottom:0;
  float: right;
  width: 470px;
  clear: none;
}

.photo-package-moose2 .photo3 {
  margin-top:15px;
  margin-bottom:0;
  float: right;
  width: 470px;
  clear: none;
}
.photo-package-moose2 .photo1 .expand-icn-wrapper,
.photo-package-moose2 .photo2 .expand-icn-wrapper,
.photo-package-moose2 .photo3 .expand-icn-wrapper {
  overflow: hidden;
}

.photo-package-moose2 .related-caption.package-caption {
  padding-top:0;
}
.package-byline {
  font-family: "Benton Sans",Helvetica,Arial,sans-serif;
  font-size: 9px;
  text-align: right;
  text-transform: uppercase;
  color: #909090;
  letter-spacing: 0.5px;
  margin-top: 4px;
}
/*END MOOSE 2 Photo Package*/

   .projectGraphic.barChart {
    width:220px;
    right:0;
    float: right;
    margin: 10px -329px 10px 29px;
    position: relative;
    padding-bottom: 16px;
    clear: both;
  }

   .projectGraphic.mooseMap {
    width:425px;
    right:0;
    float: right;
    margin: 10px -329px 10px 29px;
    position: relative;
    padding-bottom: 16px;
    clear: both;
    /*overflow:hidden;*/
  }

 .projectGraphic.mooseMap .rangeKeyBox {margin-bottom:7px;}

 .projectGraphic.mooseMap  span.rangeKey {
    display:block;
    float:left;
    width: 20px;
    height:20px;
    border-radius: 50%;
    background-color: #bbb095;
    margin-right: 10px;
    margin-top:-2px;
} 
.moose-interactive {
  margin-left: -116px;
    margin-top: 30px;
   /* border-bottom: solid 1px #ccc;
    padding-bottom: 32px;*/
    margin-bottom: 40px;
    width:970px;
}


 .projectGraphic.moosePie  span.rangeKey1 {
    display:block;
    float:left;
    width: 20px;
    height:20px;
    border-radius: 50%;
    background-color: #95c0cd;
    margin-right: 10px;
    margin-top:-2px;
} 
 .projectGraphic.moosePie  span.rangeKey2 {
    display:block;
    float:left;
    width: 20px;
    height:20px;
    border-radius: 50%;
    background-color: #b4a88c;
    margin-right: 10px;
    margin-top:-2px;
} 
    .projectGraphic.moosePie {

  }

   .projectGraphic.moosePie .project-table {margin:-10px 0 12px 0;}


  .related-media.ticks-photo.size-m {
      float: right;
      width: 400px;
      margin: 24px -329px 24px 60px;
  }

  .source {font-size:.85em;color:#666666;}


  @media only screen and (min-device-width: 320px) and (max-device-width: 640px) {
     .av {letter-spacing: -6px;}
      .package-byline {line-height:110%;}
      .project-body {
          visibility: visible;
          position: relative;
          display: block;
      }
      .project-body h3{
        margin-top: 30px;
        font-size: 2em;
      }
      .isMobile .mobile-hero {
          background: url('http://stmedia.stimg.co/mobileMooseCover2.jpg') center center no-repeat;
          background-size: cover;
          top: -70px !important;
          height: 450px;
          background-color:#000;
      }
      section.mobile-hero {
          display: block;
          width: 100%;
          top: -70px;
      }
      .desktop {
          display: none;
      }
      h1 {font-size:5em;} 
      .topCaption,
      .article-featured-gallery-mod {
          display: none;
      }


.related-media.map.size-xl {
position: relative;
width: 70%;
margin: 18px auto;
right: auto;
clear: both;
float: none;
}
.related-media.coach-photo.size-m {
position: relative;
width: 100%;
margin: 24px auto 18px auto;
right: auto;
clear: both;
float: none;
}


      .intro {
          width: 100%;
      }


.related-media.home-photo.size-l,
.related-media.church-photo.size-xl,
.related-media.coach-photo.size-m {
float: none;
width: 100%;
margin-left: 0;
}


      .related-media.size-l,
      .photo-package.photo-package-1,
      .photo-package.photo-package-2,
      .photo-package.photo-package-3 {
          width: 100%;
          margin-left: 0;
      }
      #photo-zilla-1,
      #photo-zilla-2 {
          width: 100% !important;
          margin-left: 0 !important;
      }


.walking-photo,
.sidelines-photo {
margin-bottom: 140px;
}


      #photo-zilla-1 .related-caption.package-caption,
      #photo-zilla-2 .related-caption.package-caption {
          margin: 0 !important;
      }
      #photo-zilla-1 .related-caption.package-caption p,
      #photo-zilla-2 .related-caption.package-caption p {
          text-align: left !important;
          font-size: 1em !important;
      }


.church-caption {
width: 100% !important;
font-size: 1em !important;
margin-left: 0 !important;
margin-top: 0;
}

      
      aside.article-share {
          margin-top: 0;
      }
      h4.mobile.home-logo{
        clear: both;
        margin-top:-50px

        }
      h1 {
          font-size: 3.10em;
          color:#000;
    line-height: 100%;
    top: 360px;
     left: 0px; 
     color:#fff;
    width: 100%;
    text-shadow: 2px 2px 7px rgba(0, 0, 0, .9);
      }
      .intro{font-size:1.85em;}
      #photo-zilla-1,#photo-zilla-2{display:none;}

/*MOBILE moose1 and MOOSE2*/
.photo-package.photo-package-moose1, .photo-package.photo-package-moose2 {
  width:100%;
  float:none;
  position: relative;
  margin:2.5em 0 0 0 !important;
}

.photo-package.photo-package-moose2 .photo1, .photo-package.photo-package-moose2 .photo2,.photo-package.photo-package-moose2 .photo3{
  width:100%;
  float:none;
  position: relative;
  margin:1em 0 0 0 !important;
}

.photo-package-moose2 .package-byline {display:none;}
 /*MOBILE moosemap*/ 
  .projectGraphic.mooseMap, .projectGraphic.moosePie, .projectGraphic.barChart {
    width:100%;
    left:0;
    float: none;
    margin: 2em 0;
    position: relative;
    padding-bottom: 16px;
    clear: both;
    overflow:hidden;
    text-align:center;
  }
  /* MOBILE tick */
      .related-media.ticks-photo.size-m {
          position: relative;
          width: 100%;
          margin: 24px auto 18px auto;
          right: auto;
          clear: both;
          float: none;
      }
      .moose-interactive {
    margin-left: 0;
    border:none;
    padding-top: 0;
    margin-top: 20px;
    margin-bottom: 40px;
    width:100%;}

 .crop-gradient {     /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+100,000000+100&0+30,0.65+75,1+100 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 30%, rgba(0,0,0,0.65) 75%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 75%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 75%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

  height: 35%;

   /* IE6-9 */
}

.projectGraphic h4 {
  font-size: 1.25em;
margin-bottom: 9px;
line-height: 120%
}
.projectGraphic h4.label, .projectGraphic .rangeKeyBox {
  text-align:left;
  font-size:1em;
  left:0;
}

  }
  @media only screen and (min-device-width: 320px) and (max-device-width: 640px) and (orientation: landscape) {} 
  @media only screen and (min-device-width: 768px) and (orientation: portrait) {
    .mfp-bg { width: 1200px;  min-width: 100%; }
    .mfp-wrap { width: 1200px;  min-width: 100%; }
    .mobile-hero.mobile{
        height: 600px;
        min-width: 1024px;
    }
  }