@font-face {
  font-family: "LifeLTStd-Roman";
  src: url('../webFonts/LifeLTStdRoman/font.woff2') format('woff2'), url('../webFonts/LifeLTStdRoman/font.woff') format('woff');
}
@font-face {
  font-family: "HelveticaNeueLTPro-Md";
  src: url('../webFonts/HelveticaNeueLTProMd/font.woff2') format('woff2'), url('../webFonts/HelveticaNeueLTProMd/font.woff') format('woff');
}

body {
   /*background: #ecece8;*/
   background: #f3eeec;
   font-family: "HelveticaNeueLTPro-Md";
}
h2 {
   font-family: "LifeLTStd-Roman";
   font-size: 8vw;
   line-height: .8;
   margin-top: 15px;
}
a:link, a:visited {
   color: #000;
   text-decoration: none;
}
a:hover, a:active {
   text-decoration: underline;
}
.lower {
   position: absolute;
   bottom: 2%;
   right: 0;
   padding-right: 15px;
   width: 100%;
   z-index: 2;
}
.photo-container {
   width: 100%;
   margin-bottom: 9%;
}
.photo-container img {
   width: 33%;
   width: 25%;
}
.logo {
   position: absolute;
   bottom: 54px;
   margin-left: -15px;
   width: 100%;
}
.logo img {
   width: 50%;
}
.logo-end {
   position: absolute;
   width: 100%;
   bottom: 54px;
   
}
.logo-end img {
   width: 408px;
}
.footer p {
   margin-bottom: 0;
   line-height: 1;
}

.logo > div {width: 50%}
.logo > div img {height:auto;}
.logoanimation-left {float: left; text-align: right;}
.logoanimation-right {float: right;}


/* ANIMATIONS */

.hidden, .hidden-2 {
   opacity: 0;
   animation-duration: 6s;
   animation-name: appear-fade;
   animation-iteration-count: 1;
   animation-fill-mode: forwards;
}
.hidden-2 {animation-duration: 5s;}
@keyframes appear-fade {
   75% {
      opacity: 0;
   }
   100% {
      opacity: 100;
   }
}

#overlay {
   position: absolute; 
   top: 0;
   left: 0;
   height: 100%; 
   width: 100%; 
   /*background: #ecece8;*/
   background: #f3eeec;
   animation-duration: 6s;
   animation-name: overlay-fade;
   animation-iteration-count: 1;
   animation-fill-mode: forwards;
}
@keyframes overlay-fade {
   75% {
      opacity: 100;
   }
   100% {
      opacity: 0;
   }
}

.logo-shrink-move img {
  animation-duration: 2s;
  animation-name: logo-shrink-move;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes logo-shrink-move {
  0% {
    width: 50%;
  }
  50% {
   width: 204px;opacity: 100;
  }
  70% {
   width: 204px;
   opacity: 0;
  }
  100% {
   width: 204px;
   opacity: 0;
  }
}

@media (max-width: 991px) {
   h2 {
      font-size: 10vw;
      line-height: .85;
   }
   .photo-container {
      margin-bottom: 12%;
   }
   .photo-container img {
      width: 40%;
   }
   .logo, .logo-end {
      bottom: 65px;
   }
   .logo img {
      width: 75%;
   }
   .logo-end img {
      width: 300px;
   }
   @keyframes logo-shrink-move {
     0% {
       width: 75%;opacity: 100;
     }
     50% {
       width: 150px;opacity: 100;
     }
     70% {
       width: 150px;
       opacity: 0;
     }
     100% {
      width: 150px;
      opacity: 0;
     }
   }
}
@media (max-width: 767px) {
   .footer p {
      font-size: 12px;
   }
   .photo-container {
      margin-bottom: 18%;
   }
   .photo-container img {
      width: 66%;
   }
   .logo, .logo-end {
      bottom: 52px;
   }
   .logo img {
      width: 75%;
   }
   .logo-end img {
      width: 200px;
   }
   @keyframes logo-shrink-move {
     0% {
       width: 75%;opacity: 100;
     }
     50% {
       width: 100px;opacity: 100;
     }
     70% {
       width: 100px;
       opacity: 0;
     }
     100% {
      width: 100px;
      opacity: 0;
     }
   }
}

@media only screen and (max-height: 575.98px) and (orientation: landscape) {
   h2 {
      font-size: 7vw;
   }
   .photo-container {
      margin-bottom: 8%;
   }
   .photo-container img {
      width: 25%;
   }
   .logo, .logo-end {
      bottom: 55px;
   }
   .logo img {
      width: 55%;
   }
   .logo-end img {
      width: 200px;
   }
   @keyframes logo-shrink-move {
     0% {
       width: 55%;opacity: 100;
     }
     50% {
       width: 100px;opacity: 100;
     }
     70% {
       width: 100px;
       opacity: 0;
     }
     100% {
      width: 100px;
      opacity: 0;
     }
   }
}