@import 'https://fonts.googleapis.com/css?family=Montserrat:400,700|PT+Serif|Frank+Ruhl+Libre|Julius+Sans+One';
/*$dark-grey: #191d1d;*/
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  font-weight: normal; }

body {
  margin: 0;
  padding: 0;
  background-color: #fff;
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent; }

h1, h2 {
  font-family: "Frank Ruhl Libre", "PT Serif", Georgia, "Times New Roman", Times, serif;
  letter-spacing: 0.05em; }

h3, h4 {
  font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.2em; }

p {
  font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.4em;
  font-weight: 400; }

/*.hide {
    opacity:0;
}*/
#rotate-screen {
  width: 100vw;
  height: 100vh;
  position: absolute;
  z-index: 999;
  background-color: #a41029;
  display: none;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  /*@media only screen and (min-width:741px) and (max-height:550px) {
       display:block;
        
    }*/ }
  #rotate-screen.show {
    display: block; }
  #rotate-screen .holder {
    width: 280px;
    height: 130px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 30%;
    top: calc(50% - 65px); }
    #rotate-screen .holder span {
      font-size: 64px;
      margin-bottom: 20px; }

#resize-screen {
  width: 100vw;
  height: 100vh;
  position: absolute;
  z-index: 999;
  background-color: #a41029;
  display: none;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  /* @media only screen and (min-width:741px) and (max-height:550px) {
       display:block;
        
    }*/ }
  #resize-screen.show {
    display: block; }
  #resize-screen .holder {
    width: 280px;
    height: 130px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 30%;
    top: calc(50% - 65px); }
    #resize-screen .holder span {
      font-size: 64px;
      margin-bottom: 20px; }

#update-browser {
  display: none; }

#comingsoon {
  display: none; }

#load {
  width: 89px;
  height: 99px;
  position: absolute;
  top: 40%;
  top: calc(50% - 99px);
  left: 46%;
  left: calc(50% - 44px);
  z-index: 998;
  text-align: center;
  /*-webkit-animation: slideDown 1s;
         animation: slideDown  1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;*/ }
  #load:before {
    content: "";
    position: absolute;
    bottom: 8px;
    height: 15px;
    width: 40px;
    left: 24px;
    -webkit-transform: scale(0.5, 0.5);
    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -webkit-filter: blur(5px);
    /* Chrome, Safari, Opera */
    filter: blur(5px);
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='5');
    /* IE lte 9 */
    display: block;
    background-color: #ddd;
    border-radius: 50%;
    -webkit-animation: pulse 0.8s;
    animation: pulse 0.8s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate; }
  #load #loader {
    width: 59px;
    height: 69px;
    position: relative;
    top: 0;
    -webkit-animation: upDown 0.8s;
    animation: upDown 0.8s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-play-state: running;
    animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }
  #load p {
    font-size: 11px;
    text-transform: uppercase;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #949494;
    margin-top: 30px;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn  1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }
  #load.no-svg {
    background-image: url("../img/loader.png");
    background-repeat: no-repeat;
    background-size: 70%;
    background-position: top center; }
    #load.no-svg p {
      margin-top: 30px; }

#load-alt {
  width: 89px;
  height: 99px;
  position: absolute;
  top: 40%;
  top: calc(50% - 99px);
  left: 46%;
  left: calc(50% - 44px);
  z-index: 998;
  text-align: center;
  /*-webkit-animation: slideDown 1s;
         animation: slideDown  1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;*/ }
  #load-alt:before {
    content: "";
    position: absolute;
    bottom: 8px;
    height: 15px;
    width: 40px;
    left: 24px;
    -webkit-transform: scale(0.5, 0.5);
    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -webkit-filter: blur(5px);
    /* Chrome, Safari, Opera */
    filter: blur(5px);
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='5');
    /* IE lte 9 */
    display: block;
    background-color: #ddd;
    border-radius: 50%;
    -webkit-animation: pulse 0.8s;
    animation: pulse 0.8s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    background-color: #000; }
  #load-alt #loader-alt {
    width: 59px;
    height: 69px;
    position: relative;
    top: 0;
    -webkit-animation: upDown 0.8s;
    animation: upDown 0.8s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-play-state: running;
    animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }
    #load-alt #loader-alt #pick {
      fill: #ffffff; }
    #load-alt #loader-alt #figure {
      fill: #020e1a; }
  #load-alt p {
    font-size: 11px;
    text-transform: uppercase;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #949494;
    margin-top: 30px;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn  1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }
  #load-alt.no-svg {
    background-image: url("../img/loader-alt.png");
    background-repeat: no-repeat;
    background-size: 70%;
    background-position: top center; }
    #load-alt.no-svg p {
      margin-top: 30px; }

#top-nav-logo {
  height: 50px;
  width: 100%;
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  z-index: 998; }
  #top-nav-logo.hideUntilLoaded {
    display: none; }
  #top-nav-logo .mainlogo {
    width: 136px;
    position: relative;
    top: 30px;
    left: 30px; }
    @media only screen and (max-width: 630px) {
      #top-nav-logo .mainlogo {
        top: 25px;
        left: 18px; } }
    #top-nav-logo .mainlogo.introAnimate {
      -webkit-transform: translateY(-100px);
      -moz-transform: translateY(-100px);
      transform: translateY(-100px);
      -webkit-animation: slideDown 0.6s;
      animation: slideDown  0.6s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 1.5s;
      animation-delay: 1.5s;
      -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      /* custom */ }
    #top-nav-logo .mainlogo.hide {
      -webkit-transition: top 0.3s ease;
      -moz-transition: top 0.3s ease;
      -ms-transition: top 0.3s ease;
      transition: top 0.3s ease;
      top: -35px; }
    #top-nav-logo .mainlogo #logo {
      width: 136px;
      height: 30px; }
      @media only screen and (max-width: 630px) {
        #top-nav-logo .mainlogo #logo {
          width: 130px;
          height: 24px; } }
      #top-nav-logo .mainlogo #logo #shape {
        fill: #fff; }
      #top-nav-logo .mainlogo #logo #first {
        fill: #fff; }
      #top-nav-logo .mainlogo #logo #second {
        fill: #020e1a; }
      #top-nav-logo .mainlogo #logo #first, #top-nav-logo .mainlogo #logo #second {
        opacity: 0;
        -webkit-animation: fadeIn 0.8s;
        animation: fadeIn  0.8s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 2.3s;
        animation-delay: 2.3s; }
    @media only screen and (max-width: 630px) {
      #top-nav-logo .mainlogo.active #logo #shape {
        fill: #020e1a; } }
    @media only screen and (max-width: 630px) {
      #top-nav-logo .mainlogo.active #logo #first {
        fill: #020e1a; } }
    @media only screen and (max-width: 630px) {
      #top-nav-logo .mainlogo.active #logo #second {
        fill: #fff; } }
    #top-nav-logo .mainlogo.dark #logo #shape {
      fill: #020e1a; }
    #top-nav-logo .mainlogo.dark #logo #first {
      fill: #020e1a; }
    #top-nav-logo .mainlogo.dark #logo #second {
      fill: #fff; }
    #top-nav-logo .mainlogo:hover {
      cursor: pointer; }
    #top-nav-logo .mainlogo.no-svg {
      background-image: url("../img/2016logo.png");
      background-repeat: no-repeat;
      background-size: contain;
      background-position: top center;
      width: 136px;
      height: 30px; }
      @media only screen and (max-width: 630px) {
        #top-nav-logo .mainlogo.no-svg {
          width: 130px;
          height: 24px; } }
      #top-nav-logo .mainlogo.no-svg.dark, #top-nav-logo .mainlogo.no-svg.active {
        background-image: url("../img/2016logoalt.png"); }
  #top-nav-logo #navtoggle {
    position: absolute;
    width: 25px;
    height: 25px;
    top: 30px;
    right: 40px;
    /*@include black;*/
    z-index: 999;
    cursor: pointer;
    overflow-x: visible;
    overflow-y: hidden;
    opacity: 1;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    -webkit-transform: translateY(-100px);
    -moz-transform: translateY(-100px);
    transform: translateY(-100px);
    -webkit-animation: slideDown 0.6s;
    animation: slideDown  0.6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s; }
    @media only screen and (max-width: 630px) {
      #top-nav-logo #navtoggle {
        top: 27px; } }
    #top-nav-logo #navtoggle span {
      background-color: #ffffff;
      height: 3px;
      width: 100%;
      position: absolute;
      top: 16px;
      left: 0;
      -webkit-transition: all .35s ease;
      -moz-transition: all .35s ease;
      -o-transition: all .35s ease;
      transition: all .35s ease; }
      #top-nav-logo #navtoggle span:nth-of-type(2) {
        top: 8px;
        /*left:-50%;*/ }
      #top-nav-logo #navtoggle span:nth-of-type(3) {
        top: 0px; }
    #top-nav-logo #navtoggle:hover {
      opacity: 1; }
    #top-nav-logo #navtoggle.introAnimation span:nth-of-type(2) {
      top: 16px;
      /*left:-50%;*/
      -webkit-animation: navRevealSecond 0.8s;
      animation: navRevealSecond 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 2.3s;
      animation-delay: 2.3s; }
    #top-nav-logo #navtoggle.introAnimation span:nth-of-type(3) {
      top: 16px;
      -webkit-animation: navRevealFirst 0.8s;
      animation: navRevealFirst 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 2.3s;
      animation-delay: 2.3s; }
    #top-nav-logo #navtoggle.active {
      right: 340px; }
      @media only screen and (min-width: 1280px) {
        #top-nav-logo #navtoggle.active {
          right: 420px; } }
      @media only screen and (max-width: 630px) {
        #top-nav-logo #navtoggle.active {
          right: 40px; } }
      #top-nav-logo #navtoggle.active span {
        background-color: #ffffff;
        height: 3px;
        width: 100%;
        position: absolute;
        top: 16px;
        left: 0;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease; }
        @media only screen and (max-width: 630px) {
          #top-nav-logo #navtoggle.active span {
            background-color: #020e1a; } }
        #top-nav-logo #navtoggle.active span:nth-of-type(1) {
          top: 16px;
          -webkit-animation: navBottom 0.4s;
          animation: navBottom 0.4s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
        #top-nav-logo #navtoggle.active span:nth-of-type(2) {
          top: 8px;
          -webkit-animation: fadeOut 0.2s;
          animation: fadeOut 0.2s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
        #top-nav-logo #navtoggle.active span:nth-of-type(3) {
          top: 0px;
          -webkit-animation: navTop 0.4s;
          animation: navTop 0.4s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
    #top-nav-logo #navtoggle.activeAlt {
      right: 40px; }
      #top-nav-logo #navtoggle.activeAlt span {
        background-color: #ffffff;
        height: 3px;
        width: 100%;
        position: absolute;
        top: 16px;
        left: 0;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease; }
        @media only screen and (max-width: 630px) {
          #top-nav-logo #navtoggle.activeAlt span {
            background-color: #fff; } }
        #top-nav-logo #navtoggle.activeAlt span:nth-of-type(1) {
          top: 16px;
          -webkit-animation: navBottom 0.4s;
          animation: navBottom 0.4s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
        #top-nav-logo #navtoggle.activeAlt span:nth-of-type(2) {
          top: 8px;
          -webkit-animation: fadeOut 0.2s;
          animation: fadeOut 0.2s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
        #top-nav-logo #navtoggle.activeAlt span:nth-of-type(3) {
          top: 0px;
          -webkit-animation: navTop 0.4s;
          animation: navTop 0.4s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
    #top-nav-logo #navtoggle.dark span {
      background-color: #020e1a; }

#nav-menu-holder {
  width: 300px;
  height: 100%;
  position: absolute;
  display: block;
  z-index: 100;
  background-color: #fff;
  right: -300px;
  top: 0;
  border-top: 8px solid #a41029;
  overflow-y: auto;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }
  @media only screen and (min-width: 1280px) {
    #nav-menu-holder {
      width: 380px;
      right: -380px; } }
  @media only screen and (max-width: 630px) {
    #nav-menu-holder {
      top: 100%;
      right: 0px;
      width: 100%; } }
  #nav-menu-holder.show {
    right: 0px; }
    @media only screen and (max-width: 630px) {
      #nav-menu-holder.show {
        top: 0%; } }
  #nav-menu-holder .nav-menu-content {
    padding: 20px 40px 0px;
    text-align: right;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    /* .breakdefault {
            background-color:$red;
        opacity:1;
        height:1px;
        width:30px;
        margin:0 0 60px 0;
        display:block;
            float:right;
             position:relative;
             right:0;
        
        }*/ }
    @media only screen and (max-width: 630px) {
      #nav-menu-holder .nav-menu-content {
        margin-top: 60px; } }
    #nav-menu-holder .nav-menu-content .nav-title {
      font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-bottom: 40px; }
      @media only screen and (max-width: 630px) {
        #nav-menu-holder .nav-menu-content .nav-title {
          display: none; } }
    #nav-menu-holder .nav-menu-content .nav-items {
      margin: 0 0 60px 0;
      display: block;
      width: 100%;
      height: auto;
      clear: both; }
      @media only screen and (min-width: 1280px) {
        #nav-menu-holder .nav-menu-content .nav-items {
          font-size: 22px; } }
      #nav-menu-holder .nav-menu-content .nav-items:after {
        content: "";
        background-color: #a41029;
        opacity: 1;
        height: 1px;
        width: 30px;
        margin: 0 0 60px 0;
        display: block;
        float: right;
        position: relative;
        right: 0; }
      #nav-menu-holder .nav-menu-content .nav-items a {
        font-weight: 700;
        display: block;
        width: 100%;
        margin: 0 0 40px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        text-decoration: none;
        color: #020e1a; }
        @media only screen and (min-width: 1280px) {
          #nav-menu-holder .nav-menu-content .nav-items a {
            margin: 0 0 50px; } }
        #nav-menu-holder .nav-menu-content .nav-items a:hover, #nav-menu-holder .nav-menu-content .nav-items a:focus {
          color: #a41029; }
        #nav-menu-holder .nav-menu-content .nav-items a:active, #nav-menu-holder .nav-menu-content .nav-items a:visited {
          color: #020e1a; }
    #nav-menu-holder .nav-menu-content .nav-social {
      display: block;
      width: 100%;
      height: auto;
      clear: both;
      margin-bottom: 40px; }
      #nav-menu-holder .nav-menu-content .nav-social li {
        display: inline-block;
        list-style: none;
        margin-left: 40px;
        font-size: 34px; }
        @media only screen and (min-width: 1280px) {
          #nav-menu-holder .nav-menu-content .nav-social li {
            font-size: 44px; } }
        #nav-menu-holder .nav-menu-content .nav-social li a {
          color: #020e1a;
          border: 0;
          text-decoration: none; }
          #nav-menu-holder .nav-menu-content .nav-social li a:hover {
            color: #a41029; }
          #nav-menu-holder .nav-menu-content .nav-social li a:focus {
            outline: none; }
          #nav-menu-holder .nav-menu-content .nav-social li a:active {
            color: #a41029; }
        #nav-menu-holder .nav-menu-content .nav-social li:nth-of-type(1) {
          margin-left: 0px; }
    #nav-menu-holder .nav-menu-content .nav-credits {
      font-size: 12px;
      line-height: 22px;
      display: block;
      width: 100%;
      height: auto;
      clear: both; }

#content-wrapper {
  width: 100%;
  overflow: hidden;
  position: relative;
  /* font-size:0;*/ }
  #content-wrapper.hideUntilLoaded {
    display: none; }

.flash {
  height: 100%;
  width: 30%;
  position: absolute;
  z-index: -1;
  background: #a41029;
  -webkit-animation: wipeRight 0.8s;
  animation: wipeRight 0.8s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165); }

.lead-photo {
  height: 100%;
  width: 30%;
  margin-left: -4%;
  position: absolute;
  display: inline-block;
  overflow: hidden;
  z-index: 10;
  left: 0;
  -webkit-transition: left 2s ease-out;
  -moz-transition: left 2s ease-out;
  -ms-transition: left 2s ease-out;
  -o-transition: left 2s ease-out;
  transition: left 2s ease-out;
  -webkit-transform: skewX(-5deg);
  -moz-transform: skewX(-5deg);
  -o-transform: skewX(-5deg);
  transform: skewX(-5deg);
  /*.fourth-image {
        background: url('../img/img15.jpg');
        opacity:0;
        z-index: 4;
        background-position: 0 0;
        background-size: cover;
        &.show {opacity:1;}
    }*/ }
  @media only screen and (max-width: 1040px) {
    .lead-photo {
      display: none; } }
  .lead-photo .photo-holder span {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    position: relative;
    display: block;
    z-index: 2;
    top: 0;
    bottom: 0;
    opacity: 0;
    -webkit-animation: fadeOut 1.5s;
    animation: fadeOut 1.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .lead-photo .photo-holder {
    opacity: 0.8;
    height: 100%;
    width: 100%;
    position: absolute;
    right: -120%;
    top: 0;
    z-index: 1;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
    -webkit-animation: wipeLeft 0.8s;
    animation: wipeLeft 0.8s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
    -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
    -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
    animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
    /* custom */
    -webkit-transform: skewX(5deg);
    -moz-transform: skewX(5deg);
    -o-transform: skewX(5deg);
    transform: skewX(5deg); }
  .lead-photo .first-image {
    background: url("../img/img1.jpg");
    opacity: 0;
    z-index: 1;
    background-position: 0 0;
    background-size: cover; }
    .lead-photo .first-image.show {
      opacity: 1; }
  .lead-photo .second-image {
    background: url("../img/img12.jpg");
    opacity: 0;
    z-index: 2;
    background-position: 0 0;
    background-size: cover; }
    .lead-photo .second-image.show {
      opacity: 1; }
  .lead-photo .third-image {
    background: url("../img/img12.jpg");
    opacity: 0;
    z-index: 3;
    background-position: 0 0;
    background-size: cover; }
    .lead-photo .third-image.show {
      opacity: 1; }

.lead-photo-alt {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 50%;
  z-index: 1;
  margin-left: -3%;
  opacity: 1;
  -webkit-transition: opacity 2s ease-out;
  -moz-transition: opacity 2s ease-out;
  -ms-transition: opacity 2s ease-out;
  -o-transition: opacity 2s ease-out;
  transition: opacity 2s ease-out; }
  @media only screen and (max-width: 1040px) {
    .lead-photo-alt {
      /*width:90%;
        margin-left:5%;*/
      width: 100%;
      margin-left: 0; } }
  @media only screen and (min-width: 1020px) and (orientation: portrait) {
    .lead-photo-alt {
      width: 100%;
      margin-left: 0; } }
  @media only screen and (max-width: 630px) {
    .lead-photo-alt {
      /*margin-left:-50%;*/
      margin-left: -49%; } }
  .lead-photo-alt .lead-photo-fg {
    position: relative;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%; }
    .lead-photo-alt .lead-photo-fg img.feature-bg {
      width: auto;
      /*height:auto;*/
      height: 95%;
      max-height: 95%;
      position: absolute;
      left: 0;
      bottom: 0;
      z-index: 0; }
      .lead-photo-alt .lead-photo-fg img.feature-bg.show {
        opacity: 0;
        -webkit-animation: fadeIn 1.5s;
        animation: fadeIn 1.5s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 1s;
        animation-delay: 1s; }
        @media only screen and (max-width: 1040px) {
          .lead-photo-alt .lead-photo-fg img.feature-bg.show {
            -webkit-animation: fadeInSemi 1.5s;
            animation: fadeInSemi 1.5s;
            -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
            -webkit-animation-delay: 1s;
            animation-delay: 1s; } }
      .lead-photo-alt .lead-photo-fg img.feature-bg.hide {
        opacity: 0.6;
        -webkit-animation: fadeOut 1.5s;
        animation: fadeOut 1.5s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 0s;
        animation-delay: 0s; }
        @media only screen and (max-width: 1040px) {
          .lead-photo-alt .lead-photo-fg img.feature-bg.hide {
            -webkit-animation: fadeOutSemi 1.5s;
            animation: fadeOutSemi 1.5s;
            -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
            -webkit-animation-delay: 0s;
            animation-delay: 0s; } }
    .lead-photo-alt .lead-photo-fg img.feature-fg {
      width: auto;
      /*height:auto;*/
      height: 95%;
      max-height: 95%;
      position: absolute;
      left: 0;
      bottom: 0;
      z-index: 1; }
      .lead-photo-alt .lead-photo-fg img.feature-fg.show {
        opacity: 0;
        -webkit-animation: fadeIn 2s;
        animation: fadeIn 2s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 3s;
        animation-delay: 3s;
        /*@media only screen and (max-width:$breakpointMobilePortrait) and (min-height:$breakpointMinHeight){display:none;}*/ }
        @media only screen and (max-width: 1040px) {
          .lead-photo-alt .lead-photo-fg img.feature-fg.show {
            -webkit-animation: fadeInSemi 2s;
            animation: fadeInSemi 2s;
            -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
            -webkit-animation-delay: 3s;
            animation-delay: 3s; } }
      .lead-photo-alt .lead-photo-fg img.feature-fg.hide {
        opacity: 0.6;
        -webkit-animation: fadeOut 1.5s;
        animation: fadeOut 1.5s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 0s;
        animation-delay: 0s; }
        @media only screen and (max-width: 1040px) {
          .lead-photo-alt .lead-photo-fg img.feature-fg.hide {
            -webkit-animation: fadeOutSemi 1.5s;
            animation: fadeOutSemi 1.5s;
            -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
            -webkit-animation-delay: 0s;
            animation-delay: 0s; } }
        @media only screen and (max-width: 630px) {
          .lead-photo-alt .lead-photo-fg img.feature-fg.hide {
            display: none; } }

.lead-content {
  height: 100%;
  width: 100%;
  position: relative;
  display: block;
  z-index: 0;
  overflow: hidden;
  background-color: #020e1a;
  -webkit-animation: wipeRight 1s;
  animation: wipeRight 1s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
  /* custom */ }
  .lead-content .bgmask {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #000;
    opacity: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("../img/responsiveface.jpg");
    background-position: 0 0;
    background-size: cover; }
    @media only screen and (max-width: 1040px) {
      .lead-content .bgmask.show {
        /*  -webkit-animation: fadeIn 1s;
           animation: fadeIn 1s;
           -webkit-animation-delay: 1s;
            animation-delay: 1s;
           -webkit-animation-fill-mode: forwards;
             animation-fill-mode: forwards;*/ } }
    @media only screen and (max-width: 1040px) {
      .lead-content .bgmask.hide {
        -webkit-animation: fadeOut 1s;
        animation: fadeOut 1s;
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards; } }
  .lead-content .lead-content-holder {
    width: 50%;
    /*height: auto;*/
    height: 100%;
    position: absolute;
    top: 0%;
    right: 10%;
    /*bottom:0;*/
    text-align: center;
    overflow: hidden;
    z-index: 2;
    background-image: url("../img/linebg.png");
    background-repeat: repeat;
    /* @media only screen and (max-height:$breakpointMinHeight){top: 0%;}*/ }
    @media only screen and (max-width: 1040px) {
      .lead-content .lead-content-holder {
        /*top:22%;*/
        top: 0%;
        width: 100%;
        right: 0%;
        background-image: none; } }
    @media only screen and (max-width: 630px) {
      .lead-content .lead-content-holder {
        top: 0%;
        background-image: none; } }
    .lead-content .lead-content-holder.animateIntro {
      top: -100%;
      opacity: 0;
      -webkit-animation: leadReveal 2s;
      animation: leadReveal 2s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 1.5s;
      animation-delay: 1.5s;
      -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      /* custom */ }
    .lead-content .lead-content-holder.hide {
      -webkit-animation: fadeOut 2s;
      animation: fadeOut 2s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards; }
    .lead-content .lead-content-holder .lead-art {
      display: block;
      position: relative;
      margin-top: 20%;
      margin-top: 20vh;
      margin-bottom: 40px;
      margin-bottom: 6%;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      padding-top: 40%;
      opacity: 1;
      /* width:360px;
            height:auto;*/
      -webkit-transition: opacity 0.3s ease;
      -moz-transition: opacity 0.3s ease;
      -ms-transition: opacity 0.3s ease;
      transition: opacity 0.3s ease; }
      @media only screen and (max-width: 1040px) {
        .lead-content .lead-content-holder .lead-art {
          margin-bottom: 3%;
          padding-top: 20%; } }
      @media only screen and (max-width: 1040px) and (min-height: 720px) {
        .lead-content .lead-content-holder .lead-art {
          margin-top: 34%;
          margin-top: 25vh;
          margin-bottom: 4%;
          padding-top: 30%; } }
      @media only screen and (max-width: 630px) {
        .lead-content .lead-content-holder .lead-art {
          margin-top: 36%;
          margin-top: 24vh;
          margin-bottom: 5%;
          padding-top: 40%; } }
      .lead-content .lead-content-holder .lead-art #fifteenyears {
        /*width:360px;
            height:312px;*/
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 27%;
        display: block; }
        @media only screen and (max-width: 1040px) {
          .lead-content .lead-content-holder .lead-art #fifteenyears {
            width: 23%;
            left: 38%; } }
        @media only screen and (max-width: 1040px) and (min-height: 720px) {
          .lead-content .lead-content-holder .lead-art #fifteenyears {
            width: 46%;
            left: 32%; } }
        @media only screen and (max-width: 630px) {
          .lead-content .lead-content-holder .lead-art #fifteenyears {
            width: 43%;
            left: 27%; } }
        .lead-content .lead-content-holder .lead-art #fifteenyears #fifteen {
          /* position:relative;
                top:0;
                left:0;
                width:100%;
                height:auto;*/ }
        .lead-content .lead-content-holder .lead-art #fifteenyears #year {
          /*position:absolute;
                top:0;
                left:0;
                width:100%;
                height:auto;*/ }
      .lead-content .lead-content-holder .lead-art.animateIntro {
        opacity: 0;
        -webkit-animation: fadeIn 1s;
        animation: fadeIn 1s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 4s;
        animation-delay: 4s; }
      .lead-content .lead-content-holder .lead-art.hide {
        -webkit-animation: fadeOut 2s;
        animation: fadeOut 2s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards; }
      .lead-content .lead-content-holder .lead-art.no-svg {
        background-image: url("../img/fifteenyears.png");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: top center; }
    .lead-content .lead-content-holder .lead-title {
      height: auto;
      width: 100%;
      text-align: center;
      overflow: hidden;
      position: relative;
      top: 0;
      left: 0;
      margin-bottom: 40px; }
      .lead-content .lead-content-holder .lead-title h1 {
        color: #fff;
        opacity: 1; }
        .lead-content .lead-content-holder .lead-title h1.introLyric {
          color: #fff;
          opacity: 0;
          visibility: hidden;
          font-size: 64px;
          -webkit-animation: textFadeIn 1s;
          animation: textFadeIn 1s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          /*-webkit-animation-delay: 2s;
          animation-delay: 2s;*/
          -webkit-animation-delay: 3s;
          animation-delay: 3s; }
          @media only screen and (max-width: 1280px) {
            .lead-content .lead-content-holder .lead-title h1.introLyric {
              font-size: 49px; } }
          @media only screen and (max-width: 630px) {
            .lead-content .lead-content-holder .lead-title h1.introLyric {
              font-size: 38px; } }
        .lead-content .lead-content-holder .lead-title h1.lyricAnimate {
          font-size: 64px; }
          @media only screen and (max-width: 1280px) {
            .lead-content .lead-content-holder .lead-title h1.lyricAnimate {
              font-size: 49px; } }
          @media only screen and (max-width: 630px) {
            .lead-content .lead-content-holder .lead-title h1.lyricAnimate {
              font-size: 38px; } }
    .lead-content .lead-content-holder .breakdefault {
      background-color: #a41029;
      opacity: 1;
      height: 2px;
      width: 50px;
      margin-bottom: 6%;
      display: block;
      position: relative;
      left: 50%;
      left: calc(50% - 25px); }
      @media only screen and (max-width: 1040px) {
        .lead-content .lead-content-holder .breakdefault {
          margin-bottom: 3%; } }
      @media only screen and (max-width: 1040px) and (min-height: 720px) {
        .lead-content .lead-content-holder .breakdefault {
          margin-bottom: 6%; } }
      @media only screen and (max-width: 630px) {
        .lead-content .lead-content-holder .breakdefault {
          margin-bottom: 8%; } }
    .lead-content .lead-content-holder .hidebreak {
      -webkit-animation: fadeOut 0.6s;
      animation: fadeOut 0.6s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      /* custom */ }
    .lead-content .lead-content-holder .break {
      opacity: 0;
      -webkit-animation: fadeIn 0.6s;
      animation: fadeIn 0.6s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.5s;
      animation-delay: 3.5s;
      -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      /* custom */ }
    .lead-content .lead-content-holder .breakNoDelay {
      opacity: 0;
      -webkit-animation: fadeIn 0.6s;
      animation: fadeIn 0.6s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -moz-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      -o-animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      animation-timing-function: cubic-bezier(0.935, 0.07, 0.905, 0.165);
      /* custom */ }
    .lead-content .lead-content-holder h4 {
      opacity: 0;
      margin-bottom: 80px;
      margin-bottom: 6%;
      color: #fff;
      font-size: 12px; }
      @media only screen and (max-width: 1040px) {
        .lead-content .lead-content-holder h4 {
          margin-bottom: 3%; } }
      @media only screen and (max-width: 1040px) and (min-height: 720px) {
        .lead-content .lead-content-holder h4 {
          margin-bottom: 6%; } }
      @media only screen and (max-width: 630px) {
        .lead-content .lead-content-holder h4 {
          margin-bottom: 8%; } }
      .lead-content .lead-content-holder h4.introTitle {
        -webkit-animation: fadeIn 0.6s;
        animation: fadeIn 0.6s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 4.2s;
        animation-delay: 4.2s; }

.feature-btn-holder {
  text-align: center;
  width: 100%;
  position: relative;
  height: auto;
  display: block;
  visibility: hidden;
  /* width:auto;
    position:absolute;
    bottom:20%;
    left: calc(50% - 140px);*/
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  -webkit-animation: toggleVisibility 0s;
  animation: toggleVisibility 0s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 3.4s;
  animation-delay: 3.4s; }

.feature-btn {
  background-color: transparent;
  padding: 0 50px;
  border: 0;
  border-width: 0;
  border-style: solid;
  border-color: #fff;
  border-image: none;
  position: relative;
  width: 280px;
  height: 54px;
  text-align: center;
  display: block;
  margin: 0 auto;
  overflow: hidden;
  cursor: pointer;
  z-index: 1;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  /*@media only screen and (max-width:$breakpointDesktopSmall) {
                width:180px;
                padding: 0 30px;
              }*/
  /*&:active {
           background-color: $red;        
           }*/ }
  @media only screen and (max-width: 630px) {
    .feature-btn {
      width: 220px; } }
  @media only screen and (max-width: 320px) {
    .feature-btn {
      width: 180px;
      padding: 0 30px; } }
  .feature-btn:focus {
    outline: 0; }
  .feature-btn.smaller {
    width: 160px; }
  .feature-btn:before {
    content: '';
    width: 280px;
    height: 54px;
    top: 0;
    left: 320px;
    position: absolute;
    background-color: #fff;
    display: block;
    z-index: -1;
    opacity: 1;
    -webkit-transform: skewX(50deg);
    -moz-transform: skewX(50deg);
    -o-transform: skewX(50deg);
    transform: skewX(50deg);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease; }
  .feature-btn:hover:before {
    left: 0px;
    -webkit-transform: skewX(0deg);
    -moz-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    transform: skewX(0deg); }
  .touchevents .feature-btn:hover:before {
    left: 320px; }
  .feature-btn.animate:before {
    /*opacity: 0;
         -webkit-animation: fadeIn 0.8s;
         animation: fadeIn 0.8s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 3.6s;
             animation-delay: 3.6s;*/ }
  .feature-btn.animate:hover:before {
    left: 0px;
    -webkit-transform: skewX(0deg);
    -moz-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    transform: skewX(0deg); }
  .touchevents .feature-btn.animate:hover:before {
    left: 320px; }
  .feature-btn.animate-no-delay:before {
    opacity: 0;
    -webkit-animation: fadeIn 0.8s;
    animation: fadeIn 0.8s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-transform-style: preserve-3d; }
  .feature-btn.animate-no-delay:hover:before {
    left: 0px;
    -webkit-transform: skewX(0deg);
    -moz-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    transform: skewX(0deg); }
  .touchevents .feature-btn.animate-no-delay:hover:before {
    left: 320px; }
  .feature-btn .btn-top {
    width: 100%;
    height: 1px;
    top: 0;
    left: 0;
    background-color: #fff;
    display: block;
    position: absolute;
    -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-top.animate {
      width: 0%;
      -webkit-animation: featureBtnTop 0.8s;
      animation: featureBtnTop 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.6s;
      animation-delay: 3.6s;
      -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-top.animate-no-delay {
      width: 0%;
      -webkit-animation: featureBtnTop 0.8s;
      animation: featureBtnTop 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-transform-style: preserve-3d; }
  .feature-btn .btn-right {
    width: 1px;
    height: 100%;
    top: 0;
    right: 0;
    background-color: #fff;
    display: block;
    position: absolute;
    -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-right.animate {
      height: 0%;
      -webkit-animation: featureBtnRight 0.8s;
      animation: featureBtnRight 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.6s;
      animation-delay: 3.6s;
      -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-right.animate-no-delay {
      height: 0%;
      -webkit-animation: featureBtnRight 0.8s;
      animation: featureBtnRight 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-transform-style: preserve-3d; }
  .feature-btn .btn-bottom {
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #fff;
    display: block;
    position: absolute;
    -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-bottom.animate {
      width: 0%;
      -webkit-animation: featureBtnBottom 0.8s;
      animation: featureBtnBottom 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.6s;
      animation-delay: 3.6s;
      -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-bottom.animate-no-delay {
      width: 0%;
      -webkit-animation: featureBtnBottom 0.8s;
      animation: featureBtnBottom 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-transform-style: preserve-3d; }
  .feature-btn .btn-left {
    width: 1px;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #fff;
    display: block;
    position: absolute;
    -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-left.animate {
      height: 0%;
      -webkit-animation: featureBtnLeft 0.8s;
      animation: featureBtnLeft 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.6s;
      animation-delay: 3.6s;
      -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-left.animate-no-delay {
      height: 0%;
      -webkit-animation: featureBtnLeft 0.8s;
      animation: featureBtnLeft 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-transform-style: preserve-3d; }
  .feature-btn .btn-text {
    color: #fff;
    font-size: 14.4px;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    line-height: 54px;
    letter-spacing: 0.2em;
    opacity: 1;
    -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-text.animate {
      opacity: 0;
      -webkit-animation: fadeIn 0.8s;
      animation: fadeIn 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 3.8s;
      animation-delay: 3.8s;
      -webkit-transform-style: preserve-3d; }
    .feature-btn .btn-text.animate-no-delay {
      opacity: 0;
      -webkit-animation: fadeIn 0.8s;
      animation: fadeIn 0.8s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      -webkit-animation-delay: 0s;
      animation-delay: 0s;
      -webkit-transform-style: preserve-3d; }
  .feature-btn:hover .btn-text {
    color: #020e1a; }
  .touchevents .feature-btn:hover .btn-text {
    color: #fff; }
  .feature-btn.btnHide {
    cursor: default; }
  .feature-btn.btnHide:before {
    display: none; }
  .feature-btn.btnHide .btn-top {
    -webkit-animation: featureBtnTopHide 1s;
    animation: featureBtnTopHide 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }
  .feature-btn.btnHide .btn-right {
    -webkit-animation: featureBtnRightHide 1s;
    animation: featureBtnRightHide 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }
  .feature-btn.btnHide .btn-bottom {
    -webkit-animation: featureBtnBottomHide 1s;
    animation: featureBtnBottomHide 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }
  .feature-btn.btnHide .btn-left {
    -webkit-animation: featureBtnLeftHide 1s;
    animation: featureBtnLeftHide 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }
  .feature-btn.btnHide .btn-text {
    opacity: 1;
    -webkit-animation: none;
    animation: none;
    -webkit-animation: fadeOut 0.2s;
    animation: fadeOut 0.2s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }

#discoverLoad {
  height: 0;
  width: 100%;
  position: relative;
  display: block;
  z-index: 4;
  overflow: hidden;
  top: 0;
  opacity: 0; }
  #discoverLoad.show {
    height: 100%;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }

#discover {
  height: 0;
  width: 100%;
  position: absolute;
  display: block;
  z-index: 5;
  overflow: hidden; }
  #discover.show {
    /*background-color:#890017;*/
    background-color: #a41029;
    display: block;
    height: 100%;
    top: 100%;
    -webkit-animation: wipeBottom 1s;
    animation: wipeBottom 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    -moz-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    -o-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    /* custom */ }
  #discover.hide {
    height: 100%; }
    @media only screen and (min-width: 630px) {
      #discover.hide {
        top: 0%;
        -webkit-animation: wipeTopOpacity 1s;
        animation: wipeTopOpacity 1s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
        -webkit-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
        -moz-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
        -o-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
        animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
        /* custom */ } }
    @media only screen and (max-width: 630px) {
      #discover.hide {
        top: 100%; } }
  #discover .discover-container {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 0;
    /*removes the whitespace between divs*/
    position: absolute;
    /* &.active {
            opacity:0.6;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease;
            -webkit-transform:scale(0.9, 0.9);
            -moz-transform:scale(0.9, 0.9);
            -ms-transform:scale(0.9, 0.9);
            transform:scale(0.9, 0.9);
        }*/ }
    #discover .discover-container .slide-container {
      overflow: hidden;
      position: relative;
      display: block;
      width: 100%;
      height: 100%;
      z-index: 1;
      /*overflow-x:scroll;*/
      /* scrollbar */
      /* make it smooth on iOS */
      -webkit-overflow-scrolling: touch;
      opacity: 1;
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease; }
      #discover .discover-container .slide-container.scale {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        transform: scale(1, 1);
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease; }
        #discover .discover-container .slide-container.scale.active {
          opacity: 0.6;
          -webkit-transition: all 1s ease;
          -moz-transition: all 1s ease;
          -ms-transition: all 1s ease;
          transition: all 1s ease;
          -webkit-transform: scale(0.9, 0.9);
          -moz-transform: scale(0.9, 0.9);
          -ms-transform: scale(0.9, 0.9);
          transform: scale(0.9, 0.9); }
      #discover .discover-container .slide-container.active-fix {
        opacity: 1; }
      #discover .discover-container .slide-container .slide-holder {
        /*position: relative;*/
        position: absolute;
        display: block;
        left: 0;
        -webkit-transition: all 0.8s ease;
        -moz-transition: all 0.8s ease;
        -ms-transition: all 0.8s ease;
        transition: all 0.8s ease;
        /*width: 100%;*/
        height: 100%;
        /*cursor:move;
            cursor:grab;
            cursor:-moz-grab;
            cursor:-webkit-grab;
            touch-action: pan-x;
            -webkit-user-select: none;  
            -moz-user-select: none;     
            -ms-user-select: none;      
            user-select: none;*/ }
        #discover .discover-container .slide-container .slide-holder .col {
          position: relative;
          vertical-align: top;
          top: 0;
          width: 33.333%;
          width: 33.333vw;
          display: inline-block;
          text-align: center;
          overflow: hidden;
          /* @media only screen and (max-width:$breakpointMobilePortrait) {
            width:100%;
            width:100vw;
            }*/ }
          @media only screen and (max-width: 1040px) {
            #discover .discover-container .slide-container .slide-holder .col {
              width: 33.2%;
              width: 100vw; } }
          #discover .discover-container .slide-container .slide-holder .col.col-one {
            background-color: #890017;
            /* background-image: url('../img/discover-bg-1v2.png');*/
            background-image: none;
            background-size: cover; }
            @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
              #discover .discover-container .slide-container .slide-holder .col.col-one {
                margin-left: -1px; } }
            @media only screen and (max-width: 1040px) {
              #discover .discover-container .slide-container .slide-holder .col.col-one {
                /*background-image: url('../img/discover-bg-1v2mobile.png');*/ } }
            #discover .discover-container .slide-container .slide-holder .col.col-one .col-img {
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              display: block; }
              #discover .discover-container .slide-container .slide-holder .col.col-one .col-img.animate {
                opacity: 0;
                -webkit-animation: fadeIn 1s;
                animation: fadeIn 1s;
                -webkit-animation-fill-mode: forwards;
                animation-fill-mode: forwards;
                -webkit-animation-delay: 1s;
                animation-delay: 1s; }
              #discover .discover-container .slide-container .slide-holder .col.col-one .col-img img {
                width: 100%;
                height: auto;
                min-height: 100%; }
          #discover .discover-container .slide-container .slide-holder .col.col-two {
            background-color: #6f0214;
            /*background-image: url('../img/discover-bg-2v2.png');*/
            background-size: cover; }
            @media only screen and (max-width: 1040px) {
              #discover .discover-container .slide-container .slide-holder .col.col-two {
                /*background-image: url('../img/discover-bg-2v2mobile.png');*/ } }
            #discover .discover-container .slide-container .slide-holder .col.col-two .col-img {
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              display: block; }
              #discover .discover-container .slide-container .slide-holder .col.col-two .col-img.animate {
                opacity: 0;
                -webkit-animation: fadeIn 1s;
                animation: fadeIn 1s;
                -webkit-animation-fill-mode: forwards;
                animation-fill-mode: forwards;
                -webkit-animation-delay: 1s;
                animation-delay: 1s; }
              #discover .discover-container .slide-container .slide-holder .col.col-two .col-img img {
                width: 100%;
                height: auto;
                min-height: 100%; }
          #discover .discover-container .slide-container .slide-holder .col.col-three {
            background-color: #890017;
            /*background-image: url('../img/discover-bg-3v2.png');*/
            background-size: cover; }
            @media only screen and (max-width: 1040px) {
              #discover .discover-container .slide-container .slide-holder .col.col-three {
                /*background-image: url('../img/discover-bg-3v2mobile.png');*/ } }
            #discover .discover-container .slide-container .slide-holder .col.col-three .col-img {
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              display: block; }
              #discover .discover-container .slide-container .slide-holder .col.col-three .col-img.animate {
                opacity: 0;
                -webkit-animation: fadeIn 1s;
                animation: fadeIn 1s;
                -webkit-animation-fill-mode: forwards;
                animation-fill-mode: forwards;
                -webkit-animation-delay: 1s;
                animation-delay: 1s; }
              #discover .discover-container .slide-container .slide-holder .col.col-three .col-img img {
                width: 100%;
                height: auto;
                min-height: 100%; }
          #discover .discover-container .slide-container .slide-holder .col.col-four {
            background-color: black; }
          #discover .discover-container .slide-container .slide-holder .col.col-five {
            background-color: #0e2d36; }
          #discover .discover-container .slide-container .slide-holder .col.col-six {
            background-color: #4f101d; }
          #discover .discover-container .slide-container .slide-holder .col .col-content {
            position: absolute;
            /*top:20%;*/
            top: 35%;
            width: 100%;
            height: auto; }
            @media only screen and (max-width: 630px) {
              #discover .discover-container .slide-container .slide-holder .col .col-content {
                top: 45%; } }
            #discover .discover-container .slide-container .slide-holder .col .col-content h3 {
              color: #fff;
              font-size: 24px;
              padding: 20px;
              margin: 20px 0; }
              @media only screen and (min-width: 830px) and (orientation: portrait) {
                #discover .discover-container .slide-container .slide-holder .col .col-content h3 {
                  font-size: 34px; } }
              @media only screen and (max-width: 1280px) and (min-width: 1040px) {
                #discover .discover-container .slide-container .slide-holder .col .col-content h3 {
                  font-size: 20px; } }
              @media only screen and (max-width: 630px) {
                #discover .discover-container .slide-container .slide-holder .col .col-content h3 {
                  font-size: 24px; } }
            #discover .discover-container .slide-container .slide-holder .col .col-content img {
              width: 70%;
              margin: 0 auto;
              height: auto;
              display: block;
              border: 0; }
              @media only screen and (max-width: 1040px) {
                #discover .discover-container .slide-container .slide-holder .col .col-content img {
                  width: auto;
                  height: 40vh; } }
      #discover .discover-container .slide-container .slide-control {
        font-family: 'FontAwesome';
        width: 50px;
        height: 50px;
        border-radius: 50%;
        position: absolute;
        top: 40%;
        display: none;
        color: #ffffff;
        font-size: 18px;
        text-align: center;
        padding-top: 15px;
        opacity: 1;
        -webkit-transition: opacity 0.8s ease;
        -moz-transition: opacity 0.8s ease;
        -ms-transition: opacity 0.8s ease;
        transition: opacity 0.8s ease; }
        @media only screen and (min-width: 830px) and (orientation: portrait) {
          #discover .discover-container .slide-container .slide-control {
            height: 70px;
            font-size: 38px; } }
        @media only screen and (max-width: 1040px) {
          #discover .discover-container .slide-container .slide-control {
            display: block; } }
        @media only screen and (max-width: 630px) {
          #discover .discover-container .slide-container .slide-control {
            font-size: 20px; } }
        #discover .discover-container .slide-container .slide-control.left {
          content: "\f053";
          left: 3%; }
          #discover .discover-container .slide-container .slide-control.left:before {
            content: "\f053"; }
        #discover .discover-container .slide-container .slide-control.right {
          right: 3%; }
          #discover .discover-container .slide-container .slide-control.right:before {
            content: "\f054"; }
        #discover .discover-container .slide-container .slide-control.active {
          opacity: 1; }
          #discover .discover-container .slide-container .slide-control.active:hover {
            cursor: pointer; }
        #discover .discover-container .slide-container .slide-control.unactive {
          opacity: 0.3; }
          #discover .discover-container .slide-container .slide-control.unactive:hover {
            cursor: default; }
      #discover .discover-container .slide-container .indicator-holder {
        width: 100%;
        height: 10px;
        position: absolute;
        bottom: 0;
        left: 0;
        display: none; }
        @media only screen and (max-width: 1040px) and (min-height: 510px) {
          #discover .discover-container .slide-container .indicator-holder {
            /*display:block;*/
            display: none; } }
        #discover .discover-container .slide-container .indicator-holder .indicator {
          height: 100%;
          display: inline-block;
          background-color: #fff;
          border-right: 3px solid #020e1a;
          opacity: 1; }
          #discover .discover-container .slide-container .indicator-holder .indicator:last-child {
            border-right: none; }
          #discover .discover-container .slide-container .indicator-holder .indicator.active {
            opacity: 1;
            background-color: #a41029;
            -webkit-transition: opacity 2s ease;
            -moz-transition: opacity 2s ease;
            -ms-transition: opacity 2s ease;
            transition: opacity 2s ease; }
        #discover .discover-container .slide-container .indicator-holder .indicator-spacer {
          width: 1px;
          height: 100%;
          display: inline-block; }
    #discover .discover-container .music-container {
      display: block;
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: #020e1a;
      top: 100%;
      left: 0;
      z-index: 2;
      overflow-x: hidden;
      overflow-y: scroll;
      -webkit-overflow-scrolling: touch;
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease;
      /*.slick-slider {
              height:60%;
                
                .slick-list {
                    height:100%;
                    
                    .slick-track {
                        height:100%;
                    }
                }
            }*/ }
      #discover .discover-container .music-container.active {
        top: 0%;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease; }
      #discover .discover-container .music-container .video-holder {
        margin-top: 10vh; }
        @media only screen and (min-width: 1020px) and (orientation: portrait) {
          #discover .discover-container .music-container .video-holder {
            margin-top: 25vh; } }
        #discover .discover-container .music-container .video-holder .slick-prev {
          left: 5%;
          z-index: 1; }
        #discover .discover-container .music-container .video-holder .slick-next {
          right: 5%;
          z-index: 1; }
        #discover .discover-container .music-container .video-holder .slick-dots li button:before {
          color: #fff;
          font-family: 'FontAwesome';
          content: '\f111'; }
        #discover .discover-container .music-container .video-holder .slick-dots li.slick-active button:before {
          color: #fff; }
        #discover .discover-container .music-container .video-holder .slick-prev, #discover .discover-container .music-container .video-holder .slick-next {
          width: 40px;
          height: 50px;
          bottom: 35%;
          top: auto; }
        #discover .discover-container .music-container .video-holder .slick-prev:before, #discover .discover-container .music-container .video-holder .slick-next:before {
          font-family: 'FontAwesome';
          font-size: 50px;
          line-height: 1;
          opacity: .75;
          color: white;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale; }
        #discover .discover-container .music-container .video-holder .slick-prev:before {
          content: '\f104'; }
        #discover .discover-container .music-container .video-holder .slick-next:before {
          content: '\f105'; }
        #discover .discover-container .music-container .video-holder .slicktest {
          /*width:200px;*/
          margin: 20px;
          height: auto;
          display: block;
          opacity: 0.3;
          pointer-events: none;
          outline: none; }
          @media only screen and (max-width: 1040px) {
            #discover .discover-container .music-container .video-holder .slicktest {
              pointer-events: all; } }
          #discover .discover-container .music-container .video-holder .slicktest .ui.embed {
            background-color: #020e1a; }
          #discover .discover-container .music-container .video-holder .slicktest .ui.embed > .icon {
            position: absolute;
            font-family: 'FontAwesome';
            font-style: normal;
            font-weight: normal;
            width: 100px;
            height: 100px;
            display: block;
            font-size: 50px;
            color: #fff;
            opacity: 0;
            top: 40%;
            top: calc(50% - 50px);
            left: 0%;
            -webkit-transition: background-color 0.5s ease;
            -moz-transition: background-color 0.5s ease;
            -ms-transition: background-color 0.5s ease;
            transition: background-color 0.5s ease;
            background-color: #020e1a; }
            #discover .discover-container .music-container .video-holder .slicktest .ui.embed > .icon:after {
              position: relative;
              top: 22px;
              left: 25px;
              z-index: 3;
              content: '\f01d';
              background: none;
              opacity: 1;
              -webkit-transition: opacity 0.5s ease;
              -moz-transition: opacity 0.5s ease;
              -ms-transition: opacity 0.5s ease;
              transition: opacity 0.5s ease; }
          #discover .discover-container .music-container .video-holder .slicktest .ui.embed:hover .icon {
            /*background-color:$red;*/ }
          #discover .discover-container .music-container .video-holder .slicktest .ui.embed.active > .icon {
            opacity: 0; }
          #discover .discover-container .music-container .video-holder .slicktest .video-title {
            width: 100%;
            height: auto;
            display: block;
            text-align: center;
            opacity: 0;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease; }
            #discover .discover-container .music-container .video-holder .slicktest .video-title h3 {
              color: #fff;
              font-size: 18px;
              line-height: 24px;
              text-transform: none;
              margin-bottom: 4%; }
            #discover .discover-container .music-container .video-holder .slicktest .video-title .redline {
              background-color: #a41029;
              opacity: 1;
              height: 2px;
              width: 50px;
              display: block;
              position: relative;
              left: 50%;
              left: calc(50% - 25px);
              margin-bottom: 4%;
              /* @media only screen and (max-height:$breakpointMinHeight) {display:none;}
                           @media only screen and (max-width:$breakpointDesktopSmall) and (min-height:$breakpointMinHeight) {margin-bottom:3%;}
                             @media only screen and (max-width: $breakpointDesktopSmall) and (min-height:$breakpointMidHeight){
                             margin-bottom:6%; 
                                }
                               @media only screen and (max-width: $breakpointMobilePortrait) and (min-height:$breakpointMinHeight){
                                 margin-bottom:8%;  
                                }*/ }
          #discover .discover-container .music-container .video-holder .slicktest.slick-center {
            opacity: 1;
            pointer-events: all; }
            #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed > .icon {
              position: absolute;
              font-family: 'FontAwesome';
              font-style: normal;
              font-weight: normal;
              width: 100px;
              height: 100px;
              display: block;
              font-size: 50px;
              color: #fff;
              opacity: 1;
              top: 40%;
              top: calc(50% - 50px);
              left: 0%;
              -webkit-transition: background-color 0.5s ease;
              -moz-transition: background-color 0.5s ease;
              -ms-transition: background-color 0.5s ease;
              transition: background-color 0.5s ease;
              background-color: #020e1a; }
              #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed > .icon:hover {
                background-color: #a41029; }
              #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed > .icon:after {
                position: relative;
                top: 22px;
                left: 25px;
                z-index: 3;
                content: '\f01d';
                background: none;
                opacity: 1;
                -webkit-transition: opacity 0.5s ease;
                -moz-transition: opacity 0.5s ease;
                -ms-transition: opacity 0.5s ease;
                transition: opacity 0.5s ease; }
              #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed > .icon:hover:after {
                opacity: 1; }
            #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed:hover .icon {
              background-color: #a41029; }
            #discover .discover-container .music-container .video-holder .slicktest.slick-center .ui.embed.active > .icon {
              opacity: 0; }
            #discover .discover-container .music-container .video-holder .slicktest.slick-center .video-title {
              opacity: 1; }
        #discover .discover-container .music-container .video-holder.mobile .slicktest {
          opacity: 1;
          pointer-events: all; }
          @media only screen and (min-width: 1040px) {
            #discover .discover-container .music-container .video-holder.mobile .slicktest {
              max-width: 75%;
              margin: 0 auto; } }
          #discover .discover-container .music-container .video-holder.mobile .slicktest .video-title {
            opacity: 1; }
            @media only screen and (max-width: 630px) {
              #discover .discover-container .music-container .video-holder.mobile .slicktest .video-title {
                text-align: left; } }
            @media only screen and (max-width: 630px) {
              #discover .discover-container .music-container .video-holder.mobile .slicktest .video-title h3 {
                font-size: 15px;
                line-height: 22px; } }
            @media only screen and (max-width: 630px) {
              #discover .discover-container .music-container .video-holder.mobile .slicktest .video-title .redline {
                left: 0; } }
          #discover .discover-container .music-container .video-holder.mobile .slicktest .ui.embed {
            margin-bottom: 15%;
            margin-bottom: 10vh; }
            #discover .discover-container .music-container .video-holder.mobile .slicktest .ui.embed .icon {
              visibility: visible;
              top: 0%;
              top: calc(100% - 60px);
              opacity: 1;
              width: 60px;
              height: 60px;
              font-size: 40px;
              background-color: #a41029; }
              #discover .discover-container .music-container .video-holder.mobile .slicktest .ui.embed .icon:hover {
                background-color: #a41029; }
              #discover .discover-container .music-container .video-holder.mobile .slicktest .ui.embed .icon:after {
                top: 15%;
                left: 20%; }
          #discover .discover-container .music-container .video-holder.mobile .slicktest .ui.embed.active > .icon {
            opacity: 0;
            visibility: hidden; }
    #discover .discover-container .listen-container {
      /* background-image:url('../img/listenbg.gif');
            background-size:cover;
            background-position: 0 0;*/
      display: block;
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: #020e1a;
      top: 100%;
      left: 0;
      z-index: 2;
      overflow-x: hidden;
      overflow-y: auto;
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease; }
      #discover .discover-container .listen-container .mask {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-color: #fff;
        opacity: 0;
        z-index: 3;
        overflow: hidden; }
        #discover .discover-container .listen-container .mask .stampholder {
          display: block;
          position: relative;
          background-color: #fff;
          width: 100%;
          height: 100%;
          background: url(../img/fifteenyearsalt.png);
          background-size: 100px 87px;
          background-attachment: fixed;
          background-repeat: no-repeat;
          background-position: center center; }
      #discover .discover-container .listen-container .bg-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0.6;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease; }
        #discover .discover-container .listen-container .bg-img img {
          width: 100%;
          height: 100%;
          -webkit-filter: blur(0px);
          -moz-filter: blur(0px);
          -ms-filter: blur(0px);
          filter: blur(0px); }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .listen-container .bg-img img {
              display: none; } }
          #discover .discover-container .listen-container .bg-img img.active {
            -webkit-filter: blur(2px);
            -moz-filter: blur(2px);
            -ms-filter: blur(2px);
            filter: blur(2px);
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -ms-transition: all 0.5s ease;
            transition: all 0.5s ease;
            -webkit-transition-delay: 1.5s;
            -moz-transition-delay: 1.5s;
            -ms-transition-delay: 1.5s;
            transition-delay: 1.5s; }
      #discover .discover-container .listen-container .year-select-container {
        width: 100%;
        height: 25%;
        position: absolute;
        top: 37%;
        left: 0;
        text-align: center;
        z-index: 2;
        display: block;
        visibility: visible; }
        @media only screen and (max-width: 1040px) {
          #discover .discover-container .listen-container .year-select-container {
            display: none;
            visibility: hidden; } }
        #discover .discover-container .listen-container .year-select-container.active {
          left: 100%;
          -webkit-transition: left 0s ease;
          -moz-transition: left 0s ease;
          -ms-transition: left 0s ease;
          transition: left 0s ease;
          -webkit-transition-delay: 1s;
          -moz-transition-delay: 1s;
          -ms-transition-delay: 1s;
          transition-delay: 1s; }
          #discover .discover-container .listen-container .year-select-container.active .year-nav .year-red-line .line {
            opacity: 0;
            -webkit-transition: opacity 0.5s ease;
            -moz-transition: opacity 0.5s ease;
            -ms-transition: opacity 0.5s ease;
            transition: opacity 0.5s ease;
            -webkit-transition-delay: 0.5s;
            -moz-transition-delay: 0.5s;
            -ms-transition-delay: 0.5s;
            transition-delay: 0.5s; }
        #discover .discover-container .listen-container .year-select-container .label {
          position: relative;
          top: 0;
          left: 0;
          height: auto;
          margin-bottom: 25px;
          overflow: hidden; }
          #discover .discover-container .listen-container .year-select-container .label h4 {
            position: relative;
            top: 0;
            color: #fff;
            font-size: 12px;
            font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
            text-transform: uppercase;
            letter-spacing: 0.2em; }
            #discover .discover-container .listen-container .year-select-container .label h4.active {
              top: 20px;
              -webkit-transition: top 0.5s ease-in-out;
              -moz-transition: top 0.5s ease-in-out;
              -ms-transition: top 0.5s ease-in-out;
              transition: top 0.5s ease-in-out;
              -webkit-transition-delay: 0.5s;
              -moz-transition-delay: 0.5s;
              -ms-transition-delay: 0.5s;
              transition-delay: 0.5s; }
        #discover .discover-container .listen-container .year-select-container .year-nav {
          width: 100%;
          height: auto;
          display: block; }
          #discover .discover-container .listen-container .year-select-container .year-nav .year-red-line {
            width: 100%;
            height: 2px;
            position: relative;
            display: block;
            margin-bottom: 20px;
            overflow: hidden; }
            #discover .discover-container .listen-container .year-select-container .year-nav .year-red-line .line {
              opacity: 1;
              width: 100%;
              height: 1px;
              position: absolute;
              top: 0;
              left: 0;
              z-index: 1;
              background-color: #ffffff;
              display: block; }
            #discover .discover-container .listen-container .year-select-container .year-nav .year-red-line .active-red-line {
              position: absolute;
              width: 25%;
              height: 2px;
              display: block;
              background-color: #a41029;
              top: 0;
              left: 37.5%;
              opacity: 1;
              z-index: 2;
              -webkit-transition: all 0.5s ease-in-out;
              -moz-transition: all 0.5s ease-in-out;
              -ms-transition: all 0.5s ease-in-out;
              transition: all 0.5s ease-in-out; }
          #discover .discover-container .listen-container .year-select-container .year-nav .year-link-holder {
            width: 100%;
            height: auto;
            display: block;
            overflow: hidden; }
            #discover .discover-container .listen-container .year-select-container .year-nav .year-link-holder a {
              position: relative;
              top: 0px;
              display: inline-block;
              width: 25%;
              height: 50px;
              color: #fff;
              font-size: 24px;
              font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
              text-transform: uppercase;
              letter-spacing: 0.2em;
              text-decoration: none; }
              #discover .discover-container .listen-container .year-select-container .year-nav .year-link-holder a.active {
                top: -40px;
                -webkit-transition: top 0.5s ease-in-out;
                -moz-transition: top 0.5s ease-in-out;
                -ms-transition: top 0.5s ease-in-out;
                transition: top 0.5s ease-in-out;
                -webkit-transition-delay: 0.5s;
                -moz-transition-delay: 0.5s;
                -ms-transition-delay: 0.5s;
                transition-delay: 0.5s; }
      #discover .discover-container .listen-container .alt-year-select-container {
        width: 50%;
        height: 100px;
        position: absolute;
        top: 4%;
        left: 0;
        text-align: left;
        z-index: 2;
        display: block; }
        #discover .discover-container .listen-container .alt-year-select-container .label {
          position: relative;
          top: 0;
          left: 6%;
          width: 94%;
          height: auto;
          margin-bottom: 25px;
          overflow: hidden; }
          #discover .discover-container .listen-container .alt-year-select-container .label h4 {
            position: relative;
            top: 0;
            color: #fff;
            font-size: 12px;
            font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
            text-transform: uppercase;
            letter-spacing: 0.2em; }
            @media only screen and (max-width: 1040px) {
              #discover .discover-container .listen-container .alt-year-select-container .label h4 {
                font-size: 10px; } }
            @media only screen and (min-width: 1020px) and (orientation: portrait) {
              #discover .discover-container .listen-container .alt-year-select-container .label h4 {
                font-size: 15px; } }
        #discover .discover-container .listen-container .alt-year-select-container .year-nav {
          width: 100%;
          height: auto;
          display: block; }
          #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-red-line {
            width: 100%;
            height: 2px;
            position: relative;
            display: block;
            margin-bottom: 20px;
            overflow: hidden; }
            #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-red-line .line {
              opacity: 0.3;
              width: 100%;
              height: 1px;
              position: absolute;
              top: 0;
              left: 0;
              z-index: 1;
              background-color: #ffffff;
              display: block; }
            #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-red-line .active-red-line {
              position: absolute;
              width: 120px;
              height: 2px;
              display: block;
              background-color: #a41029;
              top: 0;
              left: 37.5%;
              opacity: 1;
              z-index: 2;
              -webkit-transition: all 0.5s ease-in-out;
              -moz-transition: all 0.5s ease-in-out;
              -ms-transition: all 0.5s ease-in-out;
              transition: all 0.5s ease-in-out; }
              @media only screen and (max-width: 1040px) {
                #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-red-line .active-red-line {
                  left: 6%; } }
              @media only screen and (max-width: 630px) {
                #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-red-line .active-red-line {
                  width: 66px; } }
          #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-link-holder {
            width: 94%;
            height: auto;
            display: block;
            overflow: hidden;
            left: 6%;
            position: relative; }
            #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-link-holder a {
              position: relative;
              top: 0px;
              display: inline-block;
              width: 33%;
              height: 50px;
              color: #fff;
              font-size: 17px;
              font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
              text-transform: uppercase;
              letter-spacing: 0.2em;
              text-decoration: none; }
              @media only screen and (max-width: 1040px) {
                #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-link-holder a {
                  font-size: 15px; } }
              @media only screen and (min-width: 1020px) and (orientation: portrait) {
                #discover .discover-container .listen-container .alt-year-select-container .year-nav .year-link-holder a {
                  font-size: 22px; } }
        #discover .discover-container .listen-container .alt-year-select-container.animated {
          top: -100px;
          -webkit-transition: top 1s ease;
          -moz-transition: top 1s ease;
          -ms-transition: top 1s ease;
          transition: top 1s ease; }
          @media only screen and (max-width: 1040px) {
            #discover .discover-container .listen-container .alt-year-select-container.animated {
              top: 4%;
              width: 100%; } }
          #discover .discover-container .listen-container .alt-year-select-container.animated.active {
            top: 4%;
            -webkit-transition: top 1s ease;
            -moz-transition: top 1s ease;
            -ms-transition: top 1s ease;
            transition: top 1s ease;
            -webkit-transition-delay: 2s;
            -moz-transition-delay: 2s;
            -ms-transition-delay: 2s;
            transition-delay: 2s; }
      #discover .discover-container .listen-container #playlist {
        height: 100%;
        width: 100%;
        position: relative;
        left: 0;
        top: 0;
        display: block;
        overflow: hidden;
        z-index: 1; }
        #discover .discover-container .listen-container #playlist .playlist-strip {
          height: 100%;
          display: block;
          position: absolute;
          left: 0;
          top: 0;
          -webkit-transition: left 1s ease;
          -moz-transition: left 1s ease;
          -ms-transition: left 1s ease;
          transition: left 1s ease; }
          #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder {
            width: 33.2%;
            width: 100vw;
            height: 100%;
            z-index: 1;
            display: inline-block;
            position: relative;
            overflow: hidden;
            left: 0; }
            #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder.currentplaylist {
              /*left:0;
                    position:absolute;*/ }
            #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container {
              /* position:relative;*/
              position: absolute;
              top: 40%;
              left: 6%;
              display: block;
              width: 40%;
              height: auto; }
              @media only screen and (max-width: 1040px) {
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container {
                  width: 100px;
                  top: 20%;
                  height: 500px; } }
              @media only screen and (max-width: 320px) {
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container {
                  top: 16%; } }
              #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title {
                color: #fff;
                font-size: 64px;
                font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
                text-transform: uppercase;
                letter-spacing: 0.1em;
                margin-bottom: 20px; }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title .redslash {
                  color: #a41029; }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title.animated {
                  opacity: 0; }
                  @media only screen and (max-width: 1040px) {
                    #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title.animated {
                      position: relative;
                      width: 100%;
                      opacity: 1;
                      -webkit-transform: rotate(-90deg);
                      -moz-transform: rotate(-90deg);
                      -ms-transform: rotate(-90deg);
                      transform: rotate(-90deg);
                      -webkit-transform-origin: 210% 290%;
                      -moz-transform-origin: 210% 290%;
                      -ms-transform-origin: 210% 290%;
                      transform-origin: 210% 290%; } }
                  @media only screen and (max-width: 630px) {
                    #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title.animated {
                      font-size: 38px;
                      position: relative;
                      width: 100%;
                      opacity: 1;
                      -webkit-transform: rotate(-90deg);
                      -moz-transform: rotate(-90deg);
                      -ms-transform: rotate(-90deg);
                      transform: rotate(-90deg);
                      -webkit-transform-origin: 140% 325%;
                      -moz-transform-origin: 140% 325%;
                      -ms-transform-origin: 140% 325%;
                      transform-origin: 140% 325%; } }
                  #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-title.animated.active {
                    opacity: 1;
                    -webkit-transition: all 1s ease;
                    -moz-transition: all 1s ease;
                    -ms-transition: all 1s ease;
                    transition: all 1s ease;
                    -webkit-transition-delay: 1.5s;
                    -moz-transition-delay: 1.5s;
                    -ms-transition-delay: 1.5s;
                    transition-delay: 1.5s; }
              #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-info {
                color: #fff;
                font-size: 12px;
                font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
                text-transform: none;
                letter-spacing: 0.1em;
                line-height: 1.8em;
                opacity: 0; }
                @media only screen and (min-width: 1280px) {
                  #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-info {
                    font-size: 16px;
                    letter-spacing: 0; } }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-info.animated {
                  opacity: 0; }
                  @media only screen and (max-width: 1040px) {
                    #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-info.animated {
                      opacity: 0;
                      visibility: hidden;
                      display: none; } }
                  #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .year-info-container .year-info.animated.active {
                    opacity: 1;
                    -webkit-transition: all 1s ease;
                    -moz-transition: all 1s ease;
                    -ms-transition: all 1s ease;
                    transition: all 1s ease;
                    -webkit-transition-delay: 2s;
                    -moz-transition-delay: 2s;
                    -ms-transition-delay: 2s;
                    transition-delay: 2s; }
            #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container {
              position: absolute;
              z-index: 3;
              top: 20%;
              left: 55%;
              background-color: #a41029;
              -webkit-border-radius: 5px;
              -moz-border-radius: 5px;
              -ms-border-radius: 5px;
              border-radius: 5px;
              width: 40%;
              height: 70%;
              display: block; }
              @media only screen and (max-width: 1040px) {
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container {
                  width: 80%;
                  left: 10%; } }
              @media only screen and (max-width: 630px) {
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container {
                  top: 25%;
                  height: 65%; } }
              #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container.animated {
                left: 100%;
                -webkit-transition: all 1s ease;
                -moz-transition: all 1s ease;
                -ms-transition: all 1s ease;
                transition: all 1s ease; }
                @media only screen and (max-width: 1040px) {
                  #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container.animated {
                    left: 20%; } }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container.animated.active {
                  left: 55%;
                  -webkit-transition: all 1s ease;
                  -moz-transition: all 1s ease;
                  -ms-transition: all 1s ease;
                  transition: all 1s ease;
                  -webkit-transition-delay: 2s;
                  -moz-transition-delay: 2s;
                  -ms-transition-delay: 2s;
                  transition-delay: 2s; }
                  @media only screen and (max-width: 1040px) {
                    #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container.animated.active {
                      left: 20%; } }
              #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed {
                height: 100%;
                padding-bottom: 0;
                -webkit-border-radius: 6px;
                -moz-border-radius: 6px;
                -ms-border-radius: 6px;
                border-radius: 6px;
                border-width: 1px;
                border-color: #ffffff;
                border-style: solid; }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed .icon {
                  position: absolute;
                  font-family: 'FontAwesome';
                  font-style: normal;
                  font-weight: normal;
                  width: 120px;
                  height: 120px;
                  display: block;
                  -webkit-border-radius: 60px;
                  -moz-border-radius: 60px;
                  -ms-border-radius: 60px;
                  border-radius: 60px;
                  -webkit-box-shadow: 0px 0px 10px #020e1a;
                  -moz-box-shadow: 0px 0px 10px #020e1a;
                  -ms-box-shadow: 0px 0px 10px #020e1a;
                  box-shadow: 0px 0px 10px #020e1a;
                  font-size: 60px;
                  color: #fff;
                  opacity: 1;
                  visibility: visible;
                  top: 38%;
                  top: calc(50% - 60px);
                  left: 41%;
                  left: calc(50% - 60px);
                  -webkit-transition: all 0.5s ease;
                  -moz-transition: all 0.5s ease;
                  -ms-transition: all 0.5s ease;
                  transition: all 0.5s ease;
                  background-color: #a41029; }
                  @media only screen and (max-width: 630px) {
                    #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed .icon {
                      width: 70px;
                      height: 70px;
                      top: 72%;
                      left: 11%;
                      font-size: 40px; } }
                  #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed .icon:after {
                    position: relative;
                    top: 30px;
                    left: 35px;
                    z-index: 3;
                    content: '\f01d';
                    background: none;
                    opacity: 1;
                    -webkit-transition: opacity 0.5s ease;
                    -moz-transition: opacity 0.5s ease;
                    -ms-transition: opacity 0.5s ease;
                    transition: opacity 0.5s ease; }
                    @media only screen and (max-width: 630px) {
                      #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed .icon:after {
                        top: 15px;
                        left: 18px; } }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed.active > .icon {
                  opacity: 0;
                  visibility: hidden; }
                #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed .placeholder {
                  left: auto;
                  top: auto;
                  bottom: 0;
                  right: 0;
                  width: auto;
                  height: auto;
                  max-height: 100%; }
              #discover .discover-container .listen-container #playlist .playlist-strip .playlist-holder .soundcloud-container .ui.embed:hover .icon {
                background-color: #a41029;
                -webkit-box-shadow: 0px 0px 20px #020e1a;
                -moz-box-shadow: 0px 0px 20px #020e1a;
                -ms-box-shadow: 0px 0px 20px #020e1a;
                box-shadow: 0px 0px 20px #020e1a;
                -webkit-transition: box-shadow 0.5s ease;
                -moz-transition: box-shadow 0.5s ease;
                -ms-transition: box-shadow 0.5s ease;
                transition: box-shadow 0.5s ease; }
      #discover .discover-container .listen-container.active {
        top: 0%;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease; }
        #discover .discover-container .listen-container.active .mask {
          opacity: 1;
          -webkit-animation: wipeClearTop 1s;
          animation: wipeClearTop 1s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 1s;
          animation-delay: 1s; }
    #discover .discover-container .gallery-container {
      position: absolute;
      display: block;
      width: 100%;
      height: 100%;
      top: 100%;
      z-index: 2;
      background-color: #020e1a;
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease; }
      #discover .discover-container .gallery-container .mask {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-color: #fff;
        opacity: 0;
        z-index: 3;
        overflow: hidden; }
        #discover .discover-container .gallery-container .mask .stampholder {
          display: block;
          position: relative;
          background-color: #fff;
          width: 100%;
          height: 100%;
          background: url(../img/fifteenyearsalt.png);
          background-size: 100px 87px;
          background-attachment: fixed;
          background-repeat: no-repeat;
          background-position: center center;
          /*.svgbg {
                        position:absolute;
                        width:100%;
                        height:100%;
                        background: url(../img/fifteenyearsalt.svg);
                        background-size: 100px 100px;
                        background-attachment: fixed;
                        background-repeat: no-repeat;
                        background-position: center center;    
                        } */ }
      #discover .discover-container .gallery-container .bg-img {
        width: 100%;
        height: 100%;
        position: relative;
        top: 0; }
        #discover .discover-container .gallery-container .bg-img img {
          width: 100%;
          height: 100%;
          opacity: 1;
          -webkit-transition: all 1s ease;
          -moz-transition: all 1s ease;
          -ms-transition: all 1s ease;
          transition: all 1s ease; }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container .bg-img img {
              width: auto;
              position: relative;
              left: -15%;
              opacity: 0.5; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container .bg-img img {
              left: -50%; } }
          #discover .discover-container .gallery-container .bg-img img.fade {
            opacity: 0.1;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease; }
      #discover .discover-container .gallery-container .gallery-holder {
        width: 100%;
        height: 70%;
        display: block;
        position: absolute;
        top: 15%;
        /* @media only screen and (max-width:$breakpointMobilePortrait) {
                      height:93%;
                      top:6%;
                  }*/ }
        #discover .discover-container .gallery-container .gallery-holder.mobile {
          height: auto; }
        @media only screen and (max-width: 830px) {
          #discover .discover-container .gallery-container .gallery-holder {
            height: 87%;
            top: 10%; } }
        #discover .discover-container .gallery-container .gallery-holder .gallery-img:focus {
          outline: none; }
        #discover .discover-container .gallery-container .gallery-holder .gallery-img > img {
          /*width:100%;
                    height:auto;*/
          height: 100%;
          width: 100%; }
        #discover .discover-container .gallery-container .gallery-holder .slick-prev {
          left: -40px;
          margin-right: 45px;
          z-index: 1;
          opacity: 1;
          margin-left: 92%;
          overflow: hidden; }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev {
              /* margin-left:87%; */
              /*margin-left:83%; 
                         left:-42px;*/
              left: auto;
              right: 0;
              margin-left: auto;
              margin-right: 13%; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev {
              /*left:-35px;*/
              margin-right: 18%; } }
          @media only screen and (max-width: 320px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev {
              margin-right: 18%; } }
          #discover .discover-container .gallery-container .gallery-holder .slick-prev:after {
            width: 40px;
            height: 50px;
            background-color: #020e1a;
            display: block;
            content: '';
            position: absolute;
            top: 0;
            z-index: -1;
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            transform: translateX(100%);
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease; }
          #discover .discover-container .gallery-container .gallery-holder .slick-prev:hover:after {
            left: 0%;
            -webkit-transform: translateX(0%);
            -moz-transform: translateX(0%);
            -ms-transform: translateX(0%);
            transform: translateX(0%);
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease; }
        #discover .discover-container .gallery-container .gallery-holder .slick-next {
          right: auto;
          z-index: 1;
          margin-left: 92%;
          overflow: hidden; }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-next {
              /* margin-left:87%; */
              /*margin-left:83%; */
              left: auto;
              right: 0;
              margin-left: auto;
              margin-right: 6%; } }
          @media only screen and (max-width: 320px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-next {
              /*margin-left:86%; */ } }
          #discover .discover-container .gallery-container .gallery-holder .slick-next:after {
            width: 40px;
            height: 50px;
            background-color: #a41029;
            display: block;
            content: '';
            position: absolute;
            top: 0;
            z-index: -1;
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            transform: translateX(-100%);
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease; }
          #discover .discover-container .gallery-container .gallery-holder .slick-next:hover:after {
            left: 0%;
            -webkit-transform: translateX(0%);
            -moz-transform: translateX(0%);
            -ms-transform: translateX(0%);
            transform: translateX(0%);
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease; }
        #discover .discover-container .gallery-container .gallery-holder .slick-prev, #discover .discover-container .gallery-container .gallery-holder .slick-next {
          width: 40px;
          height: 50px;
          bottom: 42%;
          top: auto;
          background-color: #fff;
          text-align: center; }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev, #discover .discover-container .gallery-container .gallery-holder .slick-next {
              bottom: 0%; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev, #discover .discover-container .gallery-container .gallery-holder .slick-next {
              width: 33px;
              height: 40px;
              display: none; } }
          @media only screen and (max-width: 320px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev, #discover .discover-container .gallery-container .gallery-holder .slick-next {
              width: 25px;
              height: 30px;
              display: none; } }
          #discover .discover-container .gallery-container .gallery-holder .slick-prev.disable, #discover .discover-container .gallery-container .gallery-holder .slick-next.disable {
            opacity: 0.5;
            cursor: default; }
            #discover .discover-container .gallery-container .gallery-holder .slick-prev.disable:hover:before, #discover .discover-container .gallery-container .gallery-holder .slick-next.disable:hover:before {
              color: #020e1a;
              opacity: .75; }
            #discover .discover-container .gallery-container .gallery-holder .slick-prev.disable:hover:after, #discover .discover-container .gallery-container .gallery-holder .slick-next.disable:hover:after {
              display: none; }
        #discover .discover-container .gallery-container .gallery-holder .slick-prev:before, #discover .discover-container .gallery-container .gallery-holder .slick-next:before {
          font-family: 'FontAwesome';
          font-size: 22px;
          line-height: 1;
          opacity: .75;
          color: #020e1a;
          z-index: 2;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale; }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-prev:before, #discover .discover-container .gallery-container .gallery-holder .slick-next:before {
              font-size: 19px; } }
        #discover .discover-container .gallery-container .gallery-holder .slick-prev:before {
          content: '\f0d9'; }
        #discover .discover-container .gallery-container .gallery-holder .slick-next:before {
          content: '\f0da'; }
        #discover .discover-container .gallery-container .gallery-holder .slick-prev:hover:before, #discover .discover-container .gallery-container .gallery-holder .slick-next:hover:before {
          color: #fff;
          opacity: 1; }
        #discover .discover-container .gallery-container .gallery-holder .slick-list {
          width: 55%;
          height: 100%;
          margin-left: 37%; }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-list {
              width: 88%;
              height: auto;
              margin-left: 6%; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container .gallery-holder .slick-list {
              width: 100%;
              height: auto;
              margin-left: 0; } }
          @media only screen and (min-width: 830px) and (orientation: portrait) {
            #discover .discover-container .gallery-container .gallery-holder .slick-list {
              width: 88%;
              height: auto;
              margin-left: 6%; } }
          #discover .discover-container .gallery-container .gallery-holder .slick-list .slick-track {
            height: 100%; }
            #discover .discover-container .gallery-container .gallery-holder .slick-list .slick-track .first img {
              -webkit-transform: translateX(100%);
              -moz-transform: translateX(100%);
              -ms-transform: translateX(100%);
              transform: translateX(100%);
              -webkit-transition: all 1s ease;
              -moz-transition: all 1s ease;
              -ms-transition: all 1s ease;
              transition: all 1s ease; }
      #discover .discover-container .gallery-container #gallery-indicator-holder {
        position: absolute;
        display: block;
        top: 35%;
        left: -390px;
        width: 390px;
        height: auto;
        -webkit-transition: left 1s ease;
        -moz-transition: left 1s ease;
        -ms-transition: left 1s ease;
        transition: left 1s ease; }
        @media only screen and (min-width: 1280px) {
          #discover .discover-container .gallery-container #gallery-indicator-holder {
            left: -30%;
            width: 30%; } }
        @media only screen and (max-width: 830px) {
          #discover .discover-container .gallery-container #gallery-indicator-holder {
            top: 58%;
            margin-left: 6%;
            width: 88%;
            left: -100%; } }
        @media only screen and (min-width: 830px) and (orientation: portrait) {
          #discover .discover-container .gallery-container #gallery-indicator-holder {
            top: 58%;
            margin-left: 6%;
            width: 88%;
            left: -100%; } }
        #discover .discover-container .gallery-container #gallery-indicator-holder.active {
          left: 0%; }
          @media only screen and (min-width: 830px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder.active {
              left: 0%;
              -webkit-transition: left 1s ease;
              -moz-transition: left 1s ease;
              -ms-transition: left 1s ease;
              transition: left 1s ease; } }
        #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers {
          position: relative;
          color: #ffffff;
          width: 100%;
          height: auto;
          top: 10%;
          left: 0;
          text-align: left;
          display: block;
          font-size: 15px;
          border-bottom: 1px solid #949494;
          margin-bottom: 30px; }
          @media only screen and (min-width: 1280px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers {
              font-size: 17px; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers {
              font-size: 12px;
              margin-bottom: 20px; } }
          @media only screen and (max-width: 320px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers {
              margin-bottom: 22px; } }
          #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p {
            display: inline-block;
            padding: 1.6rem 1.1rem;
            cursor: pointer; }
            @media only screen and (max-width: 630px) {
              #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p {
                padding: 1.2rem 0.8rem; } }
            @media only screen and (max-width: 320px) {
              #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p {
                padding: 1.3rem 0.6rem; } }
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p.current {
              color: #a41029; }
            @media only screen and (min-width: 830px) {
              #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p:nth-of-type(1) {
                margin-left: 6%; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-numbers p:nth-of-type(1) {
                margin-left: 0; } }
        #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
          position: relative;
          color: #ffffff;
          width: 90%;
          height: 100px;
          top: 40%;
          left: 0;
          text-align: left;
          display: block;
          font-size: 21px;
          margin-left: 10%; }
          @media only screen and (min-width: 1280px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
              font-size: 26px; } }
          @media only screen and (max-width: 830px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
              margin-left: 0; } }
          @media only screen and (max-width: 630px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
              font-size: 18px;
              width: 75%; } }
          @media only screen and (max-width: 320px) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
              font-size: 14px; } }
          @media only screen and (min-width: 830px) and (orientation: portrait) {
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles {
              margin-left: 0;
              font-size: 28px; } }
          #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles p {
            text-transform: uppercase;
            position: absolute;
            top: 0;
            left: 0;
            /*display:none;*/
            opacity: 0;
            -webkit-transition: opacity 0.3s ease;
            -moz-transition: opacity 0.3s ease;
            -ms-transition: opacity 0.3s ease;
            transition: opacity 0.3s ease; }
            #discover .discover-container .gallery-container #gallery-indicator-holder #gallery-titles p.current {
              /*display:block;*/
              opacity: 1;
              -webkit-transition: opacity 0.3s ease;
              -moz-transition: opacity 0.3s ease;
              -ms-transition: opacity 0.3s ease;
              transition: opacity 0.3s ease; }
      #discover .discover-container .gallery-container.active {
        top: 0%;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease; }
        #discover .discover-container .gallery-container.active .mask {
          opacity: 1;
          -webkit-animation: wipeClearTop 1s;
          animation: wipeClearTop 1s;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          -webkit-animation-delay: 1s;
          animation-delay: 1s; }

#aboutwrapper {
  height: 100%;
  width: 100%;
  position: absolute;
  display: block;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease; }
  #aboutwrapper.show {
    /*background-color:#890017;*/
    /* background-color:transparent;
        display:block;
        height:100%;
        top:100%;
        -webkit-animation: wipeBottom 1s;
         animation: wipeBottom 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
           -webkit-animation-timing-function: cubic-bezier(0.960, 0.050, 0.910, 0.085);
   -moz-animation-timing-function: cubic-bezier(0.960, 0.050, 0.910, 0.085);
     -o-animation-timing-function: cubic-bezier(0.960, 0.050, 0.910, 0.085);
        animation-timing-function: cubic-bezier(0.960, 0.050, 0.910, 0.085); /* custom */
    opacity: 1;
    height: 100%;
    top: 0;
    z-index: 5; }
  #aboutwrapper.hide {
    /*height:100%;
        top:0%;*/
    -webkit-animation: wipeTop 1s;
    -moz-animation: wipeTop 1s;
    -ms-animation: wipeTop 1s;
    animation: wipeTop 1s;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s;
    -webkit-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    -moz-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    -o-animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    animation-timing-function: cubic-bezier(0.96, 0.05, 0.91, 0.085);
    /* custom */
    opacity: 0;
    height: 100%;
    z-index: 5; }
  #aboutwrapper.away {
    height: 0; }
    #aboutwrapper.away #about-container .intro-section .scrollprompt {
      display: none; }
  #aboutwrapper #about-container {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    display: block;
    -webkit-overflow-scrolling: touch;
    background-image: url("../img/sidefaceme.jpg");
    background-repeat: no-repeat;
    /*background-attachment: fixed;*/
    background-size: cover; }
    #aboutwrapper #about-container:focus {
      outline: 0; }
    #aboutwrapper #about-container .arrow-controls-holder {
      position: fixed;
      bottom: 5%;
      right: 3%;
      height: auto;
      width: 50px;
      opacity: 0;
      z-index: 10;
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      transition: all 0.6s ease; }
      @media only screen and (max-width: 830px) {
        #aboutwrapper #about-container .arrow-controls-holder {
          right: 5%; } }
      @media only screen and (max-width: 630px) {
        #aboutwrapper #about-container .arrow-controls-holder {
          right: 8%; } }
      #aboutwrapper #about-container .arrow-controls-holder.active {
        opacity: 1; }
      #aboutwrapper #about-container .arrow-controls-holder .up, #aboutwrapper #about-container .arrow-controls-holder .down {
        width: 50px;
        height: 50px;
        background-color: #ca1e3b;
        position: relative;
        font-family: 'FontAwesome';
        font-size: 28px;
        color: #fff;
        overflow: hidden;
        -webkit-backface-visibility: hidden; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverbg, #aboutwrapper #about-container .arrow-controls-holder .down .hoverbg {
          width: 100%;
          height: 200%;
          position: absolute;
          background-color: #fff;
          -webkit-backface-visibility: hidden; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverarrow, #aboutwrapper #about-container .arrow-controls-holder .down .hoverarrow {
          width: 100%;
          height: 100%;
          position: absolute;
          background-color: transparent;
          color: #020e1a;
          opacity: 0; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverarrow:before, #aboutwrapper #about-container .arrow-controls-holder .down .hoverarrow:before {
          padding-left: 32%;
          padding-top: 21%;
          position: absolute; }
        #aboutwrapper #about-container .arrow-controls-holder .up:hover, #aboutwrapper #about-container .arrow-controls-holder .down:hover {
          cursor: pointer; }
        #aboutwrapper #about-container .arrow-controls-holder .up:focus, #aboutwrapper #about-container .arrow-controls-holder .down:focus {
          outline: none; }
        #aboutwrapper #about-container .arrow-controls-holder .up.endpoint, #aboutwrapper #about-container .arrow-controls-holder .down.endpoint {
          color: #a41029; }
          #aboutwrapper #about-container .arrow-controls-holder .up.endpoint:hover, #aboutwrapper #about-container .arrow-controls-holder .down.endpoint:hover {
            cursor: default; }
      #aboutwrapper #about-container .arrow-controls-holder .up {
        top: 0; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverbg {
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px);
          -webkit-transition: transform 0.3s ease-out;
          -moz-transition: transform 0.3s ease-out;
          -ms-transition: transform 0.3s ease-out;
          transition: transform 0.3s ease-out; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverarrow {
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px);
          -webkit-transition: all 0.4s ease-out;
          -moz-transition: all 0.4s ease-out;
          -ms-transition: all 0.4s ease-out;
          transition: all 0.4s ease-out; }
        #aboutwrapper #about-container .arrow-controls-holder .up .hoverarrow:before {
          content: "\f106"; }
        #aboutwrapper #about-container .arrow-controls-holder .up:hover .hoverbg {
          -webkit-transform: translateY(-50px);
          -moz-transform: translateY(-50px);
          -ms-transform: translateY(-50px);
          transform: translateY(-50px); }
        #aboutwrapper #about-container .arrow-controls-holder .up:hover .hoverarrow {
          opacity: 1;
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          transform: translateY(0); }
        .touchevents #aboutwrapper #about-container .arrow-controls-holder .up:hover .hoverbg {
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px); }
        .touchevents #aboutwrapper #about-container .arrow-controls-holder .up:hover .hoverarrow {
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px); }
        #aboutwrapper #about-container .arrow-controls-holder .up.endpoint:hover .hoverbg {
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px); }
        #aboutwrapper #about-container .arrow-controls-holder .up.endpoint:hover .hoverarrow {
          opacity: 0;
          -webkit-transform: translateY(50px);
          -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
          transform: translateY(50px); }
      #aboutwrapper #about-container .arrow-controls-holder .down {
        margin-top: 10px; }
        #aboutwrapper #about-container .arrow-controls-holder .down .hoverbg {
          -webkit-transform: translateY(-100px);
          -moz-transform: translateY(-100px);
          -ms-transform: translateY(-100px);
          transform: translateY(-100px);
          -webkit-transition: transform 0.3s ease-out;
          -moz-transition: transform 0.3s ease-out;
          -ms-transition: transform 0.3s ease-out;
          transition: transform 0.3s ease-out; }
        #aboutwrapper #about-container .arrow-controls-holder .down .hoverarrow {
          -webkit-transform: translateY(-50px);
          -moz-transform: translateY(-50px);
          -ms-transform: translateY(-50px);
          transform: translateY(-50px);
          -webkit-transition: all 0.4s ease-out;
          -moz-transition: all 0.4s ease-out;
          -ms-transition: all 0.4s ease-out;
          transition: all 0.4s ease-out; }
        #aboutwrapper #about-container .arrow-controls-holder .down .hoverarrow:before {
          content: "\f107"; }
        #aboutwrapper #about-container .arrow-controls-holder .down:hover .hoverbg {
          -webkit-transform: translateY(0px);
          -moz-transform: translateY(0px);
          -ms-transform: translateY(0px);
          transform: translateY(0px); }
        #aboutwrapper #about-container .arrow-controls-holder .down:hover .hoverarrow {
          opacity: 1;
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          transform: translateY(0); }
        .touchevents #aboutwrapper #about-container .arrow-controls-holder .down:hover .hoverbg {
          -webkit-transform: translateY(-100px);
          -moz-transform: translateY(-100px);
          -ms-transform: translateY(-100px);
          transform: translateY(-100px); }
        .touchevents #aboutwrapper #about-container .arrow-controls-holder .down:hover .hoverarrow {
          -webkit-transform: translateY(-50px);
          -moz-transform: translateY(-50px);
          -ms-transform: translateY(-50px);
          transform: translateY(-50px); }
        #aboutwrapper #about-container .arrow-controls-holder .down.endpoint:hover .hoverbg {
          -webkit-transform: translateY(-100px);
          -moz-transform: translateY(-100px);
          -ms-transform: translateY(-100px);
          transform: translateY(-100px); }
        #aboutwrapper #about-container .arrow-controls-holder .down.endpoint:hover .hoverarrow {
          opacity: 0;
          -webkit-transform: translateY(-50px);
          -moz-transform: translateY(-50px);
          -ms-transform: translateY(-50px);
          transform: translateY(-50px); }
      #aboutwrapper #about-container .arrow-controls-holder .up:before, #aboutwrapper #about-container .arrow-controls-holder .down:before {
        content: "\f106";
        padding-left: 32%;
        padding-top: 21%;
        position: absolute; }
      #aboutwrapper #about-container .arrow-controls-holder .down:before {
        content: "\f107"; }
    #aboutwrapper #about-container .marker-holder {
      position: fixed;
      right: 3%;
      top: 45%;
      top: calc(50% - 100px);
      width: 30px;
      height: auto;
      z-index: 10;
      color: #fff;
      background-color: transparent;
      opacity: 0;
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      transition: all 0.6s ease; }
      @media only screen and (max-width: 830px) {
        #aboutwrapper #about-container .marker-holder {
          right: 5%; } }
      @media only screen and (max-width: 630px) {
        #aboutwrapper #about-container .marker-holder {
          right: 7%; } }
      #aboutwrapper #about-container .marker-holder.active {
        opacity: 1; }
      #aboutwrapper #about-container .marker-holder .marker {
        font-size: 40px;
        display: block;
        text-align: center;
        width: 100%;
        position: relative;
        line-height: 30px;
        line-height: 0.75em;
        overflow: hidden;
        opacity: 0.3; }
        #aboutwrapper #about-container .marker-holder .marker.active {
          opacity: 1; }
        #aboutwrapper #about-container .marker-holder .marker:hover {
          cursor: pointer; }
    #aboutwrapper #about-container .backtotop {
      position: fixed;
      height: auto;
      width: auto;
      color: #fff;
      z-index: 10;
      bottom: 3%;
      left: 3%;
      opacity: 0;
      overflow: hidden;
      -webkit-transform: rotate(-90deg);
      -moz-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      -webkit-transform-origin: 0% 70%;
      -moz-transform-origin: 0% 70%;
      -ms-transform-origin: 0% 70%;
      transform-origin: 0% 70%;
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      transition: all 0.6s ease; }
      @media only screen and (max-width: 830px) {
        #aboutwrapper #about-container .backtotop {
          left: 5%; } }
      @media only screen and (max-width: 630px) {
        #aboutwrapper #about-container .backtotop {
          left: 8%; } }
      #aboutwrapper #about-container .backtotop.active {
        opacity: 1; }
      #aboutwrapper #about-container .backtotop .text {
        font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
        text-transform: uppercase;
        font-size: 12px;
        display: inline-block;
        position: relative;
        vertical-align: top;
        height: 15px; }
        #aboutwrapper #about-container .backtotop .text .text-default {
          display: block;
          position: relative;
          top: 0;
          left: 0;
          -webkit-transition: all 0.3s ease;
          -moz-transition: all 0.3s ease;
          -ms-transition: all 0.3s ease;
          transition: all 0.3s ease; }
        #aboutwrapper #about-container .backtotop .text .text-hover {
          display: block;
          position: relative;
          top: 2px;
          left: 0;
          -webkit-transition: all 0.3s ease;
          -moz-transition: all 0.3s ease;
          -ms-transition: all 0.3s ease;
          transition: all 0.3s ease; }
      #aboutwrapper #about-container .backtotop .direction {
        vertical-align: top;
        display: inline-block;
        width: 30px;
        height: 15px;
        position: relative;
        margin-left: 5px;
        overflow: hidden;
        -webkit-transition: all 0.6s ease;
        -moz-transition: all 0.6s ease;
        -ms-transition: all 0.6s ease;
        transition: all 0.6s ease; }
        #aboutwrapper #about-container .backtotop .direction .one, #aboutwrapper #about-container .backtotop .direction .two, #aboutwrapper #about-container .backtotop .direction .three {
          height: 1px;
          background-color: #fff;
          position: absolute; }
        #aboutwrapper #about-container .backtotop .direction .one {
          width: 100%;
          top: 7px;
          opacity: 1; }
        #aboutwrapper #about-container .backtotop .direction .two {
          width: 100%;
          top: 7px;
          -webkit-transform: rotate(-45deg);
          -moz-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
          -webkit-transform-origin: 100% 0%;
          -moz-transform-origin: 100% 0%;
          -ms-transform-origin: 100% 0%;
          transform-origin: 100% 0%; }
        #aboutwrapper #about-container .backtotop .direction .three {
          width: 100%;
          top: 7px;
          -webkit-transform: rotate(45deg);
          -moz-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
          -webkit-transform-origin: 100% 0%;
          -moz-transform-origin: 100% 0%;
          -ms-transform-origin: 100% 0%;
          transform-origin: 100% 0%; }
      #aboutwrapper #about-container .backtotop:hover {
        cursor: pointer; }
        #aboutwrapper #about-container .backtotop:hover .direction {
          width: 40px; }
        #aboutwrapper #about-container .backtotop:hover .text .text-default, #aboutwrapper #about-container .backtotop:hover .text .text-hover {
          top: -15px; }
    #aboutwrapper #about-container .about-bg {
      width: 100%;
      display: block;
      z-index: 1;
      /* background-image:url(../img/aboutbg.gif);
        background-size:cover;
        background-attachment: fixed;*/
      position: absolute;
      /* -webkit-transition:all 1s ease;
         -moz-transition:all 1s ease;
         -ms-transition:all 1s ease;
         transition:all 1s ease;*/
      background-color: #a41029;
      height: 100%; }
      #aboutwrapper #about-container .about-bg.hide {
        opacity: 0; }
      #aboutwrapper #about-container .about-bg.show {
        opacity: 1; }
    #aboutwrapper #about-container .intro-section {
      height: 100vh;
      width: 100%;
      position: relative;
      z-index: 2;
      top: 0;
      text-align: center;
      opacity: 1; }
      #aboutwrapper #about-container .intro-section .scrollprompt {
        width: 45px;
        height: 80px;
        position: fixed;
        bottom: 3%;
        left: calc(50% - 23px);
        color: #fff; }
        #aboutwrapper #about-container .intro-section .scrollprompt .scrollicon {
          display: block;
          margin-bottom: 5px; }
        #aboutwrapper #about-container .intro-section .scrollprompt .scrolltext {
          text-transform: uppercase;
          font-size: 10px; }
      #aboutwrapper #about-container .intro-section .intro-content-holder {
        position: absolute;
        width: 100%;
        top: 10%;
        height: 80%; }
        #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner {
          position: relative;
          width: 100%;
          top: 30%;
          opacity: 1; }
          @media only screen and (max-width: 630px) {
            #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner {
              top: 30%; } }
          #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner.active {
            opacity: 0;
            -webkit-transform: translateY(-50px);
            -moz-transform: translateY(-50px);
            -ms-transform: translateY(-50px);
            transform: translateY(-50px); }
          #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title {
            color: #fff;
            margin-bottom: 18px;
            width: 100%;
            height: 39px;
            overflow: hidden; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title {
                height: 49px;
                margin-bottom: 28px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title {
                height: auto;
                padding: 0 5%; } }
            #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title h3 {
              text-transform: uppercase;
              font-size: 30px;
              letter-spacing: 0.1em;
              position: relative;
              -webkit-transition: all 0.8s ease-out;
              -moz-transition: all 0.8s ease-out;
              -ms-transition: all 0.8s ease-out;
              transition: all 0.8s ease-out;
              -webkit-transition-delay: 1s;
              -moz-transition-delay: 1s;
              -ms-transition-delay: 1s;
              transition-delay: 1s; }
              @media only screen and (min-width: 1280px) {
                #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title h3 {
                  font-size: 44px; } }
              @media only screen and (max-width: 630px) {
                #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title h3 {
                  font-size: 25px; } }
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title h3.hide {
                -webkit-transform: translateY(100%);
                -moz-transform: translateY(100%);
                -ms-transform: translateY(100%);
                transform: translateY(100%); }
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-title h3.show {
                -webkit-transform: translateY(0%);
                -moz-transform: translateY(0%);
                -ms-transform: translateY(0%);
                transform: translateY(0%); }
          #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle {
            color: #fff;
            width: 100%; }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle {
                padding: 0 5%; } }
            #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle h4 {
              font-size: 11px;
              -webkit-transition: all 0.3s ease-out;
              -moz-transition: all 0.3s ease-out;
              -ms-transition: all 0.3s ease-out;
              transition: all 0.3s ease-out;
              -webkit-transition-delay: 1s;
              -moz-transition-delay: 1s;
              -ms-transition-delay: 1s;
              transition-delay: 1s; }
              @media only screen and (max-width: 630px) {
                #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle h4 {
                  font-size: 10px; } }
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle h4.hide {
                opacity: 0; }
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner .intro-subtitle h4.show {
                opacity: 1; }
          #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner #we-all-start {
            width: 306px;
            height: 166px; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner #we-all-start {
                width: 386px;
                height: 210px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner #we-all-start {
                width: 256px;
                height: 139px; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section .intro-content-holder .intro-content-inner #we-all-start {
                width: 506px;
                height: 275px; } }
      #aboutwrapper #about-container .intro-section .content-holder {
        position: absolute;
        width: 100%;
        top: 10%;
        height: 80%; }
        @media only screen and (max-width: 830px) {
          #aboutwrapper #about-container .intro-section .content-holder {
            top: 10%; } }
        #aboutwrapper #about-container .intro-section .content-holder .big-year {
          position: absolute;
          top: 20%;
          z-index: 1;
          margin: 0 15%;
          width: 70%; }
          @media only screen and (max-width: 830px) {
            #aboutwrapper #about-container .intro-section .content-holder .big-year {
              top: 0;
              width: 66%;
              margin: 0 14%; } }
          #aboutwrapper #about-container .intro-section .content-holder .big-year img {
            width: 100%; }
          #aboutwrapper #about-container .intro-section .content-holder .big-year.animated {
            top: 5%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .big-year.animated {
                top: 1%; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .big-year.animated {
                top: 5%; } }
          #aboutwrapper #about-container .intro-section .content-holder .big-year.hide {
            opacity: 0; }
        #aboutwrapper #about-container .intro-section .content-holder .photo {
          position: absolute;
          top: 15%;
          z-index: 3;
          width: 31%;
          height: auto; }
          @media only screen and (max-width: 830px) {
            #aboutwrapper #about-container .intro-section .content-holder .photo {
              width: 55%; } }
          @media only screen and (max-width: 630px) {
            #aboutwrapper #about-container .intro-section .content-holder .photo {
              width: 70%; } }
          #aboutwrapper #about-container .intro-section .content-holder .photo img {
            width: 100%; }
          #aboutwrapper #about-container .intro-section .content-holder .photo.animated {
            top: 40%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.animated {
                top: 20%; } }
          #aboutwrapper #about-container .intro-section .content-holder .photo.first, #aboutwrapper #about-container .intro-section .content-holder .photo.third, #aboutwrapper #about-container .intro-section .content-holder .photo.fifth {
            margin-left: 23%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.first, #aboutwrapper #about-container .intro-section .content-holder .photo.third, #aboutwrapper #about-container .intro-section .content-holder .photo.fifth {
                margin-left: 20%; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.first, #aboutwrapper #about-container .intro-section .content-holder .photo.third, #aboutwrapper #about-container .intro-section .content-holder .photo.fifth {
                margin-left: 13%; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.first, #aboutwrapper #about-container .intro-section .content-holder .photo.third, #aboutwrapper #about-container .intro-section .content-holder .photo.fifth {
                margin-left: 10%;
                width: 47%; } }
          #aboutwrapper #about-container .intro-section .content-holder .photo.second, #aboutwrapper #about-container .intro-section .content-holder .photo.fourth {
            right: 20%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.second, #aboutwrapper #about-container .intro-section .content-holder .photo.fourth {
                right: 25%; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.second, #aboutwrapper #about-container .intro-section .content-holder .photo.fourth {
                right: 17%; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section .content-holder .photo.second, #aboutwrapper #about-container .intro-section .content-holder .photo.fourth {
                right: 10%;
                width: 47%; } }
        #aboutwrapper #about-container .intro-section .content-holder .info-panel {
          width: 35%;
          height: auto;
          background-color: #020e1a;
          position: absolute;
          z-index: 2;
          top: 40%; }
          @media only screen and (max-width: 830px) {
            #aboutwrapper #about-container .intro-section .content-holder .info-panel {
              width: 70%;
              z-index: 3;
              top: 80%; } }
          @media only screen and (max-width: 630px) {
            #aboutwrapper #about-container .intro-section .content-holder .info-panel {
              width: 60%;
              z-index: 3;
              top: 70%; } }
          #aboutwrapper #about-container .intro-section .content-holder .info-panel.first, #aboutwrapper #about-container .intro-section .content-holder .info-panel.third, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fifth {
            text-align: left;
            right: 14%;
            padding: 20px 20px 20px 10%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel.first, #aboutwrapper #about-container .intro-section .content-holder .info-panel.third, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fifth {
                right: 15%;
                padding: 30px 30px 30px 30px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel.first, #aboutwrapper #about-container .intro-section .content-holder .info-panel.third, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fifth {
                right: 27%; } }
          #aboutwrapper #about-container .intro-section .content-holder .info-panel.second, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fourth {
            text-align: right;
            left: 14%;
            padding: 20px 10% 20px 20px; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel.second, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fourth {
                left: 15%;
                text-align: left;
                padding: 30px 30px 30px 30px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel.second, #aboutwrapper #about-container .intro-section .content-holder .info-panel.fourth {
                left: 13%;
                text-align: left; } }
          #aboutwrapper #about-container .intro-section .content-holder .info-panel h4 {
            font-size: 28px;
            color: #a41029;
            display: block;
            font-weight: 700; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel h4 {
                font-size: 33px; } }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel h4 {
                font-size: 28px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel h4 {
                font-size: 24px; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel h4 {
                font-size: 34px; } }
          #aboutwrapper #about-container .intro-section .content-holder .info-panel p {
            font-size: 14px;
            color: #fff;
            display: block;
            font-weight: 400; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel p {
                font-size: 19px; } }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel p {
                font-size: 14px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel p {
                font-size: 11px; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section .content-holder .info-panel p {
                font-size: 20px; } }
      #aboutwrapper #about-container .intro-section.first {
        /*background-color: transparent;*/
        background: #020e1a;
        z-index: 2;
        background: -webkit-radial-gradient(center, ellipse cover, #123a65 0%, #020e1a 100%);
        background: -moz-radial-gradient(center, ellipse cover, #123a65 0%, #020e1a 100%);
        background: -o-radial-gradient(center, ellipse cover, #123a65 0%, #020e1a 100%);
        background: -ms-radial-gradient(center, ellipse cover, #123a65 0%, #020e1a 100%);
        background: radial-gradient(center, ellipse cover, #123a65 0%, #020e1a 100%); }
        #aboutwrapper #about-container .intro-section.first span {
          width: 100%;
          height: 100%;
          display: block;
          z-index: -1;
          position: absolute;
          top: 0;
          left: 0;
          opacity: 1;
          visibility: visible;
          /* -webkit-filter: blur(95px); /* Chrome, Safari, Opera */
          /* filter: blur(95px);
                   filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='95'); /* IE lte 9 */ }
          #aboutwrapper #about-container .intro-section.first span img {
            width: 100%;
            height: auto; }
          #aboutwrapper #about-container .intro-section.first span.hide {
            opacity: 0;
            visibility: hidden; }
        #aboutwrapper #about-container .intro-section.first .bg {
          /* width:100%;
               height:100%;
               position:absolute;
               top:0;
               left:0;*/
          width: 80%;
          height: 100%;
          position: fixed;
          left: 39%;
          left: calc(50% - 40%);
          padding-top: 4%;
          opacity: 1;
          z-index: 1;
          -webkit-transition: opacity 0.8s ease-out;
          -moz-transition: opacity 0.8s ease-out;
          -ms-transition: opacity 0.8s ease-out;
          transition: opacity 0.8s ease-out; }
          @media only screen and (max-width: 830px) {
            #aboutwrapper #about-container .intro-section.first .bg {
              padding-top: 12%; } }
          @media only screen and (max-width: 630px) {
            #aboutwrapper #about-container .intro-section.first .bg {
              padding-top: 20%; } }
          #aboutwrapper #about-container .intro-section.first .bg img {
            /*height:95%;
                   width:auto;
                   margin: 5% auto 0;
                   display:block;
                   z-index: 1;*/
            height: 100%;
            width: auto;
            margin: 0;
            display: block;
            z-index: 1;
            max-width: 100%;
            position: relative;
            left: 38%; }
            @media only screen and (max-width: 830px) {
              #aboutwrapper #about-container .intro-section.first .bg img {
                left: 24%; } }
            @media only screen and (min-width: 830px) and (orientation: portrait) {
              #aboutwrapper #about-container .intro-section.first .bg img {
                left: 23%; } }
            #aboutwrapper #about-container .intro-section.first .bg img.telecaster {
              -webkit-transform: translateY(20%);
              transform: translateY(20%);
              opacity: 0;
              -webkit-transition: all 0.8s ease-out;
              -moz-transition: all 0.8s ease-out;
              -ms-transition: all 0.8s ease-out;
              transition: all 0.8s ease-out; }
              #aboutwrapper #about-container .intro-section.first .bg img.telecaster.show {
                opacity: 1;
                -webkit-transform: translateY(0%);
                transform: translateY(0%); }
          #aboutwrapper #about-container .intro-section.first .bg.hide {
            opacity: 0; }
          #aboutwrapper #about-container .intro-section.first .bg.away {
            position: relative; }
        #aboutwrapper #about-container .intro-section.first .intro-content-holder, #aboutwrapper #about-container .intro-section.first .scrollprompt {
          z-index: 2; }
      #aboutwrapper #about-container .intro-section.second {
        background-color: rgba(191, 63, 191, 0.1);
        background-color: #a41029;
        background-image: url("../img/timelinebg.png");
        background-repeat: repeat;
        z-index: 3; }
      #aboutwrapper #about-container .intro-section.third {
        background-color: rgba(191, 63, 63, 0.1);
        background-color: #a41029;
        z-index: 3;
        /*.content-holder .big-year {top:-20%;}*/ }
      #aboutwrapper #about-container .intro-section.fourth {
        background-color: rgba(191, 63, 191, 0.1);
        background-color: #a41029;
        background-image: url("../img/timelinebg.png");
        background-repeat: repeat;
        z-index: 3; }
      #aboutwrapper #about-container .intro-section.fifth {
        background-color: rgba(191, 63, 191, 0.1);
        background-color: #a41029;
        /*background-color:#08335e;*/
        z-index: 3; }
      #aboutwrapper #about-container .intro-section.sixth {
        background-color: rgba(191, 63, 191, 0.1);
        background-color: #a41029;
        background-image: url("../img/timelinebg.png");
        background-repeat: repeat;
        /* background-image: url('../img/medakota.jpg');
            background-repeat:no-repeat;
            background-attachment: fixed;
            background-size: cover;
           background-position: 0 0;*/
        z-index: 3; }
      #aboutwrapper #about-container .intro-section.seventh {
        /* background-color: rgba(191,63,191,0.1);
           background-color: $maroon;*/
        /*background-image: url('../img/sidefaceme.jpg');
            background-repeat:no-repeat;
            background-attachment: fixed;
            background-size: cover;*/
        background: transparent;
        z-index: 2;
        overflow: hidden;
        /*background-color:#08335e;*/ }
        #aboutwrapper #about-container .intro-section.seventh .cover {
          background-color: rgba(37, 37, 37, 0.4);
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          opacity: 0;
          -webkit-transition: all 1s ease;
          -moz-transition: all 1s ease;
          -ms-transition: all 1s ease;
          transition: all 1s ease; }
          #aboutwrapper #about-container .intro-section.seventh .cover.active {
            opacity: 1; }
          #aboutwrapper #about-container .intro-section.seventh .cover .overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            height: 0;
            width: 80%;
            padding-top: 60%;
            overflow: hidden; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section.seventh .cover .overlay {
                padding-top: 50%; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section.seventh .cover .overlay {
                width: 100%; } }
            #aboutwrapper #about-container .intro-section.seventh .cover .overlay #swipeholder {
              height: 100%;
              width: 100%;
              opacity: 0.5;
              position: absolute;
              top: 0;
              display: block; }
        #aboutwrapper #about-container .intro-section.seventh .endcontent {
          /*width:35%;*/
          width: 45%;
          position: absolute;
          right: 10%;
          top: 10%;
          text-align: right;
          color: #fff; }
          @media only screen and (min-width: 1280px) {
            #aboutwrapper #about-container .intro-section.seventh .endcontent {
              width: 45%; } }
          @media only screen and (max-width: 1040px) {
            #aboutwrapper #about-container .intro-section.seventh .endcontent {
              width: 70%;
              right: 15%; } }
          @media only screen and (max-width: 630px) {
            #aboutwrapper #about-container .intro-section.seventh .endcontent {
              width: 70%;
              right: 20%; } }
          @media only screen and (max-width: 320px) {
            #aboutwrapper #about-container .intro-section.seventh .endcontent {
              top: 12%;
              right: 25%;
              width: 60%; } }
          #aboutwrapper #about-container .intro-section.seventh .endcontent .year {
            margin-bottom: 50px;
            height: 154px;
            overflow: hidden; }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section.seventh .endcontent .year {
                margin-bottom: 25px;
                height: 70px; } }
            @media only screen and (max-width: 320px) {
              #aboutwrapper #about-container .intro-section.seventh .endcontent .year {
                margin-bottom: 15px;
                height: 42px; } }
            #aboutwrapper #about-container .intro-section.seventh .endcontent .year h3 {
              font-size: 154px;
              letter-spacing: normal;
              position: relative;
              -webkit-transform: translateY(100%);
              transform: translateY(100%);
              -webkit-transition: transform 1s ease;
              -moz-transition: transform 1s ease;
              -ms-transition: transform 1s ease;
              transition: transform 1s ease; }
              @media only screen and (max-width: 630px) {
                #aboutwrapper #about-container .intro-section.seventh .endcontent .year h3 {
                  font-size: 70px; } }
              @media only screen and (max-width: 320px) {
                #aboutwrapper #about-container .intro-section.seventh .endcontent .year h3 {
                  font-size: 42px; } }
              #aboutwrapper #about-container .intro-section.seventh .endcontent .year h3.active {
                -webkit-transform: translateY(0%);
                transform: translateY(0%); }
          #aboutwrapper #about-container .intro-section.seventh .endcontent .text p {
            font-size: 16px;
            margin-bottom: 20px;
            opacity: 0;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease; }
            @media only screen and (min-width: 1280px) {
              #aboutwrapper #about-container .intro-section.seventh .endcontent .text p {
                font-size: 18px; } }
            @media only screen and (max-width: 630px) {
              #aboutwrapper #about-container .intro-section.seventh .endcontent .text p {
                font-size: 12px; } }
            @media only screen and (max-width: 320px) {
              #aboutwrapper #about-container .intro-section.seventh .endcontent .text p {
                font-size: 11px;
                margin-bottom: 14px; } }
            #aboutwrapper #about-container .intro-section.seventh .endcontent .text p.active {
              opacity: 1; }

#contactwrapper {
  height: 0;
  width: 100%;
  position: absolute;
  display: block;
  z-index: 5;
  top: 0;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease; }
  #contactwrapper.show {
    height: 100%; }
  #contactwrapper.hide {
    height: 0; }
  #contactwrapper #contact-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block; }
    #contactwrapper #contact-container .contact-section {
      height: 100%;
      height: 100vh;
      width: 100%;
      width: 100vw;
      position: relative;
      top: 0; }
      #contactwrapper #contact-container .contact-section.first {
        position: absolute;
        text-align: center;
        background-color: #a41029;
        background: -webkit-radial-gradient(center, ellipse cover, #fd4d50 0%, #a41029 100%);
        background: -moz-radial-gradient(center, ellipse cover, #fd4d50 0%, #a41029 100%);
        background: -o-radial-gradient(center, ellipse cover, #fd4d50 0%, #a41029 100%);
        background: -ms-radial-gradient(center, ellipse cover, #fd4d50 0%, #a41029 100%);
        background: radial-gradient(center, ellipse cover, #fd4d50 0%, #a41029 100%); }
        #contactwrapper #contact-container .contact-section.first .content {
          position: relative;
          top: 30%;
          left: 0; }
          #contactwrapper #contact-container .contact-section.first .content #say-hello {
            width: 635px;
            height: 263px;
            -webkit-transform: scale(1, 1);
            -moz-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            transform: scale(1, 1);
            -webkit-transition: all 3s ease;
            -moz-transition: all 3s ease;
            -ms-transition: all 3s ease;
            transition: all 3s ease;
            /*@media only screen and (min-width:$breakpointDesktopLarge) {
                       width:386px;
                   height:auto;
                  }
                     @media only screen and (max-width:$breakpointMobilePortrait) {
                       width:256px;
                   height:139px;
                  }*/ }
            @media only screen and (max-width: 830px) {
              #contactwrapper #contact-container .contact-section.first .content #say-hello {
                width: 500px;
                height: 207px; } }
            @media only screen and (max-width: 630px) {
              #contactwrapper #contact-container .contact-section.first .content #say-hello {
                width: 300px;
                height: 124px; } }
            @media only screen and (max-width: 320px) {
              #contactwrapper #contact-container .contact-section.first .content #say-hello {
                width: 250px;
                height: 104px; } }
            #contactwrapper #contact-container .contact-section.first .content #say-hello.active {
              -webkit-transform: scale(0.9, 0.9);
              -moz-transform: scale(0.9, 0.9);
              -ms-transform: scale(0.9, 0.9);
              transform: scale(0.9, 0.9); }
            #contactwrapper #contact-container .contact-section.first .content #say-hello #hello {
              /*stroke:#ffffff;
                    stroke-dasharray: 0;
                          stroke-width: 1;*/
              fill: #fff; }
          #contactwrapper #contact-container .contact-section.first .content.no-svg {
            margin: 0 auto;
            width: 635px;
            height: 263px;
            background-image: url("../img/sayhello.png");
            background-repeat: no-repeat;
            background-size: contain;
            background-position: top center; }
            @media only screen and (max-width: 830px) {
              #contactwrapper #contact-container .contact-section.first .content.no-svg {
                width: 500px;
                height: 207px; } }
            @media only screen and (max-width: 630px) {
              #contactwrapper #contact-container .contact-section.first .content.no-svg {
                width: 300px;
                height: 124px; } }
            @media only screen and (max-width: 320px) {
              #contactwrapper #contact-container .contact-section.first .content.no-svg {
                width: 250px;
                height: 104px; } }
      #contactwrapper #contact-container .contact-section.second {
        position: absolute;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transform: translateY(-100%);
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease;
        background-color: #fff;
        background: -webkit-radial-gradient(center, ellipse cover, white 0%, #ededed 100%);
        background: -moz-radial-gradient(center, ellipse cover, white 0%, #ededed 100%);
        background: -o-radial-gradient(center, ellipse cover, white 0%, #ededed 100%);
        background: -ms-radial-gradient(center, ellipse cover, white 0%, #ededed 100%);
        background: radial-gradient(center, ellipse cover, white 0%, #ededed 100%); }
        #contactwrapper #contact-container .contact-section.second.active {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          transform: translateY(0); }
        #contactwrapper #contact-container .contact-section.second .photo-holder {
          width: 30%;
          height: 100%;
          position: absolute;
          top: 0;
          right: 0;
          background-image: url("../img/closeupface.png");
          background-size: cover;
          background-repeat: none; }
          @media only screen and (max-width: 1040px) {
            #contactwrapper #contact-container .contact-section.second .photo-holder {
              width: 45%; } }
          @media only screen and (max-width: 830px) {
            #contactwrapper #contact-container .contact-section.second .photo-holder {
              width: 50%; } }
          @media only screen and (max-width: 630px) {
            #contactwrapper #contact-container .contact-section.second .photo-holder {
              width: 65%; } }
        #contactwrapper #contact-container .contact-section.second .content {
          position: relative;
          top: 25%;
          left: 0;
          width: 100%;
          text-align: left;
          padding: 0 6%; }
          @media only screen and (min-width: 1280px) {
            #contactwrapper #contact-container .contact-section.second .content {
              width: 70%;
              text-align: left;
              padding: 0 6%;
              top: 20%; } }
          @media only screen and (max-width: 1040px) {
            #contactwrapper #contact-container .contact-section.second .content {
              width: 100%;
              text-align: left;
              padding: 0 4%;
              top: 25%; } }
          @media only screen and (max-width: 830px) {
            #contactwrapper #contact-container .contact-section.second .content {
              width: 100%;
              text-align: left;
              padding: 0 4%;
              top: 25%; } }
          @media only screen and (max-width: 630px) {
            #contactwrapper #contact-container .contact-section.second .content {
              text-align: left;
              padding: 0 6%;
              top: 25%; } }
          @media only screen and (max-width: 320px) {
            #contactwrapper #contact-container .contact-section.second .content {
              top: 25%;
              padding: 0 8%; } }
          #contactwrapper #contact-container .contact-section.second .content h3 {
            font-size: 18px;
            color: #020e1a;
            text-transform: none;
            letter-spacing: 0.1em;
            line-height: 1.5em;
            margin-bottom: 20px; }
            @media only screen and (min-width: 1280px) {
              #contactwrapper #contact-container .contact-section.second .content h3 {
                font-size: 28px;
                margin-bottom: 30px; } }
            @media only screen and (min-width: 1040px) {
              #contactwrapper #contact-container .contact-section.second .content h3 {
                font-size: 23px;
                margin-bottom: 20px; } }
            @media only screen and (max-width: 630px) {
              #contactwrapper #contact-container .contact-section.second .content h3 {
                width: 100%;
                font-size: 18px; } }
            @media only screen and (max-width: 320px) {
              #contactwrapper #contact-container .contact-section.second .content h3 {
                width: 100%;
                font-size: 16px; } }
          #contactwrapper #contact-container .contact-section.second .content .card {
            width: 190px;
            height: 150px;
            display: inline-block;
            color: #020e1a;
            /*border: 1px solid #222222;*/
            box-shadow: 0px 0px 25px #bebebe;
            text-align: center;
            margin: 20px;
            background-color: #fff;
            overflow: hidden;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease; }
            @media only screen and (max-width: 1280px) {
              #contactwrapper #contact-container .contact-section.second .content .card:nth-of-type(1) {
                margin-left: 0px; } }
            @media only screen and (max-width: 830px) {
              #contactwrapper #contact-container .contact-section.second .content .card {
                width: 120px;
                height: 125px;
                margin: 10px; } }
            @media only screen and (max-width: 630px) {
              #contactwrapper #contact-container .contact-section.second .content .card {
                width: 75px;
                height: 63px;
                margin: 5px; } }
            @media only screen and (max-width: 320px) {
              #contactwrapper #contact-container .contact-section.second .content .card {
                width: 75px;
                height: 63px;
                margin: 5px; } }
            #contactwrapper #contact-container .contact-section.second .content .card:hover {
              box-shadow: 0px 20px 45px #acacac;
              transform: translateY(-5px);
              background-color: #a41029;
              color: #fff;
              cursor: pointer; }
            #contactwrapper #contact-container .contact-section.second .content .card:before {
              font-family: 'FontAwesome';
              font-size: 60px;
              display: block;
              line-height: 2.5em; }
              @media only screen and (max-width: 830px) {
                #contactwrapper #contact-container .contact-section.second .content .card:before {
                  font-size: 50px; } }
              @media only screen and (max-width: 630px) {
                #contactwrapper #contact-container .contact-section.second .content .card:before {
                  font-size: 26px;
                  line-height: 2.4em; } }
              @media only screen and (max-width: 320px) {
                #contactwrapper #contact-container .contact-section.second .content .card:before {
                  font-size: 26px;
                  line-height: 2.4em; } }
            #contactwrapper #contact-container .contact-section.second .content .card.soundcloud-icon:before {
              content: '\f1be'; }
            #contactwrapper #contact-container .contact-section.second .content .card.facebook-icon:before {
              content: '\f09a'; }
            #contactwrapper #contact-container .contact-section.second .content .card.twitter-icon:before {
              content: '\f099'; }
          #contactwrapper #contact-container .contact-section.second .content .connect-holder {
            margin-bottom: 3%;
            width: 389px;
            height: 231px;
            overflow: hidden; }
            @media only screen and (min-width: 1280px) {
              #contactwrapper #contact-container .contact-section.second .content .connect-holder {
                /*width:489px;
                    height:290px;*/
                width: 559px;
                height: 331px;
                margin-bottom: 5%; } }
            @media only screen and (max-width: 1040px) {
              #contactwrapper #contact-container .contact-section.second .content .connect-holder {
                margin-bottom: 5%; } }
            @media only screen and (max-width: 630px) {
              #contactwrapper #contact-container .contact-section.second .content .connect-holder {
                width: 259px;
                height: 154px;
                margin-bottom: 6%; } }
            @media only screen and (max-width: 320px) {
              #contactwrapper #contact-container .contact-section.second .content .connect-holder {
                width: 229px;
                height: 136px; } }
            @media only screen and (min-width: 1020px) and (orientation: portrait) {
              #contactwrapper #contact-container .contact-section.second .content .connect-holder {
                width: 549px;
                height: 326px; } }
            #contactwrapper #contact-container .contact-section.second .content .connect-holder #connect-feature {
              width: 100%; }
            #contactwrapper #contact-container .contact-section.second .content .connect-holder.no-svg {
              background-image: url("../img/connect.png");
              background-repeat: no-repeat;
              background-size: contain;
              background-position: top center; }
          #contactwrapper #contact-container .contact-section.second .content .connect-icons {
            color: #020e1a;
            font-family: 'FontAwesome';
            font-size: 38px; }
            @media only screen and (min-width: 1040px) {
              #contactwrapper #contact-container .contact-section.second .content .connect-icons {
                font-size: 54px; } }
            @media only screen and (min-width: 1020px) and (orientation: portrait) {
              #contactwrapper #contact-container .contact-section.second .content .connect-icons {
                font-size: 54px; } }
            #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
              border: 0;
              color: #020e1a;
              display: inline-block;
              position: relative;
              top: 0;
              left: 0;
              padding: 0 2% 0 2%; }
              @media only screen and (min-width: 1280px) {
                #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
                  padding: 0 5% 0 5%; } }
              @media only screen and (max-width: 830px) {
                #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
                  padding: 0 4% 0 4%; } }
              @media only screen and (max-width: 630px) {
                #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
                  padding: 0 6% 0 6%; } }
              @media only screen and (max-width: 320px) {
                #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
                  padding: 0 7% 0 7%; } }
              @media only screen and (min-width: 1020px) and (orientation: portrait) {
                #contactwrapper #contact-container .contact-section.second .content .connect-icons a {
                  padding: 0 5% 0 5%; } }
              #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                padding: 0 2% 0 0; }
                @media only screen and (min-width: 1280px) {
                  #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                    padding: 0 5% 0 0; } }
                @media only screen and (max-width: 830px) {
                  #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                    padding: 0 4% 0 0; } }
                @media only screen and (max-width: 630px) {
                  #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                    padding: 0 6% 0 0; } }
                @media only screen and (max-width: 320px) {
                  #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                    padding: 0 7% 0 0; } }
                @media only screen and (min-width: 1020px) and (orientation: portrait) {
                  #contactwrapper #contact-container .contact-section.second .content .connect-icons a:nth-of-type(1) {
                    padding: 0 5% 0 0; } }
              #contactwrapper #contact-container .contact-section.second .content .connect-icons a:hover {
                color: #a41029; }
              #contactwrapper #contact-container .contact-section.second .content .connect-icons a:focus {
                outline: none; }
              #contactwrapper #contact-container .contact-section.second .content .connect-icons a:active {
                color: #a41029; }
              #contactwrapper #contact-container .contact-section.second .content .connect-icons a span {
                display: inline-block;
                position: relative;
                top: 0;
                left: 0;
                /* padding:0 2% 0 2%;
                         @media only screen and (min-width:$breakpointDesktopLarge) {
                         padding:0 5% 0 5%;
                         }
                        @media only screen and (max-width:$breakpointMobileLandscape) {
                        padding:0 4% 0 4%;
                        }
                         @media only screen and (max-width:$breakpointMobilePortrait) {
                        padding:0 6% 0 6%;
                        }
                         @media only screen and (max-width:$breakpointMobileSmall) {
                        padding:0 7% 0 7%;
                        }
                         @media only screen and (min-width:$breakpointDesktopSmall - 20) and (orientation:portrait) {
                       padding:0 5% 0 5%;
                        } */
                /* &:nth-of-type(1) {
                           padding:0 2% 0 0;
                            @media only screen and (min-width:$breakpointDesktopLarge) {
                         padding:0 5% 0 0;
                         }
                            @media only screen and (max-width:$breakpointMobileLandscape) {
                        padding:0 4% 0 0;
                        }
                             @media only screen and (max-width:$breakpointMobilePortrait) {
                        padding:0 6% 0 0;
                        }
                         @media only screen and (max-width:$breakpointMobileSmall) {
                        padding:0 7% 0 0;
                        }
                        @media only screen and (min-width:$breakpointDesktopSmall - 20) and (orientation:portrait)   {padding:0 5% 0 0;
                          }
                        }*/ }
        #contactwrapper #contact-container .contact-section.second .motif {
          width: 35px;
          height: 30px;
          position: absolute;
          bottom: 5%;
          right: 3%;
          background-color: transparent; }
          @media only screen and (max-width: 1040px) {
            #contactwrapper #contact-container .contact-section.second .motif {
              bottom: 12%;
              right: 4%; } }
          @media only screen and (max-width: 630px) {
            #contactwrapper #contact-container .contact-section.second .motif {
              right: 7%; } }
          @media only screen and (max-width: 320px) {
            #contactwrapper #contact-container .contact-section.second .motif {
              bottom: 16%;
              right: 8%; } }
          @media only screen and (min-width: 1020px) and (orientation: portrait) {
            #contactwrapper #contact-container .contact-section.second .motif {
              width: 55px;
              height: 48px; } }
          #contactwrapper #contact-container .contact-section.second .motif #fifteenyears {
            width: 100%; }
          #contactwrapper #contact-container .contact-section.second .motif.no-svg {
            background-image: url("../img/fifteenyears.png");
            background-repeat: no-repeat;
            background-size: contain;
            background-position: top center; }
        #contactwrapper #contact-container .contact-section.second .email {
          position: absolute;
          bottom: 5%;
          left: 3%;
          font-size: 18px;
          color: #020e1a; }
          @media only screen and (max-width: 1040px) {
            #contactwrapper #contact-container .contact-section.second .email {
              bottom: 12%;
              left: 4%; } }
          @media only screen and (max-width: 630px) {
            #contactwrapper #contact-container .contact-section.second .email {
              left: 7%; } }
          @media only screen and (max-width: 320px) {
            #contactwrapper #contact-container .contact-section.second .email {
              bottom: 16%;
              left: 8%; } }
          #contactwrapper #contact-container .contact-section.second .email p {
            display: inline-block;
            font-size: 12px;
            color: #020e1a; }
            @media only screen and (min-width: 1020px) and (orientation: portrait) {
              #contactwrapper #contact-container .contact-section.second .email p {
                font-size: 20px; } }
            #contactwrapper #contact-container .contact-section.second .email p a {
              text-decoration: none;
              color: #020e1a; }
          #contactwrapper #contact-container .contact-section.second .email:before {
            margin-right: 10px;
            content: '\f0e0';
            font-family: 'FontAwesome'; }

@-webkit-keyframes toggleVisibility {
  0% {
    visibility: visible; }
  100% {
    visibility: visible; } }

@keyframes toggleVisibility {
  0% {
    visibility: visible; }
  100% {
    visibility: visible; } }

@-webkit-keyframes wipeRight {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

@keyframes wipeRight {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

@-webkit-keyframes wipeLeft {
  0% {
    right: -120%; }
  100% {
    right: -12%; } }

@keyframes wipeLeft {
  0% {
    right: -120%; }
  100% {
    right: -12%; } }

@-webkit-keyframes wipeBottom {
  0% {
    top: 100%; }
  100% {
    top: 0%; } }

@keyframes wipeBottom {
  0% {
    top: 100%; }
  100% {
    top: 0%; } }

@-webkit-keyframes wipeTop {
  0% {
    top: 0%; }
  100% {
    top: 100%; } }

@keyframes wipeTop {
  0% {
    top: 0%; }
  100% {
    top: 100%; } }

@-webkit-keyframes wipeTopOpacity {
  0% {
    opacity: 1;
    top: 0%; }
  95% {
    opacity: 0;
    top: 0%; }
  100% {
    opacity: 0;
    top: 100%; } }

@keyframes wipeTopOpacity {
  0% {
    opacity: 1;
    top: 0%; }
  95% {
    opacity: 0;
    top: 0%; }
  100% {
    opacity: 0;
    top: 100%; } }

@-webkit-keyframes wipeClearTop {
  0% {
    top: 0%; }
  100% {
    top: -100%; } }

@keyframes wipeClearTop {
  0% {
    top: 0%; }
  100% {
    top: -100%; } }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes fadeInSemi {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.6; } }

@keyframes fadeInSemi {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.6; } }

@-webkit-keyframes fadeOutSemi {
  0% {
    opacity: 0.6; }
  100% {
    opacity: 0; } }

@keyframes fadeOutSemi {
  0% {
    opacity: 0.6; }
  100% {
    opacity: 0; } }

@-webkit-keyframes upDown {
  0% {
    top: 0px; }
  100% {
    top: 10px; } }

@keyframes upDown {
  0% {
    top: 0px; }
  100% {
    top: 10px; } }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0.5, 0.5);
    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5); }
  100% {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1); } }

@keyframes pulse {
  0% {
    -webkit-transform: scale(0.5, 0.5);
    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5); }
  100% {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1); } }

@-webkit-keyframes fadeSlideDown {
  0% {
    transform: translateY(-50px);
    opacity: 0; }
  100% {
    transform: translateY(0px);
    opacity: 1; } }

@keyframes fadeSlideDown {
  0% {
    transform: translateY(-50px);
    opacity: 0; }
  100% {
    transform: translateY(0px);
    opacity: 1; } }

@-webkit-keyframes slideDown {
  0% {
    -webkit-transform: translateY(-100px);
    -moz-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px); }
  100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px); } }

@keyframes slideDown {
  0% {
    -webkit-transform: translateY(-100px);
    -moz-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px); }
  100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px); } }

@-webkit-keyframes navRevealFirst {
  0% {
    top: 16px; }
  100% {
    top: 0; } }

@keyframes navRevealFirst {
  0% {
    top: 16px; }
  100% {
    top: 0; } }

@-webkit-keyframes navRevealSecond {
  0% {
    top: 16px; }
  100% {
    top: 8px; } }

@keyframes navRevealSecond {
  0% {
    top: 16px; }
  100% {
    top: 8px; } }

@-webkit-keyframes navBottom {
  0% {
    top: 16px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    top: 8px;
    -webkit-transform: rotate(-320deg);
    -moz-transform: rotate(-320deg);
    -ms-transform: rotate(-320deg);
    transform: rotate(-320deg); } }

@keyframes navBottom {
  0% {
    top: 16px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    top: 8px;
    -webkit-transform: rotate(-320deg);
    -moz-transform: rotate(-320deg);
    -ms-transform: rotate(-320deg);
    transform: rotate(-320deg); } }

@-webkit-keyframes navTop {
  0% {
    top: 0px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    top: 8px;
    -webkit-transform: rotate(320deg);
    -moz-transform: rotate(320deg);
    -ms-transform: rotate(320deg);
    transform: rotate(320deg); } }

@keyframes navTop {
  0% {
    top: 0px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    top: 8px;
    -webkit-transform: rotate(320deg);
    -moz-transform: rotate(320deg);
    -ms-transform: rotate(320deg);
    transform: rotate(320deg); } }

@-webkit-keyframes textFadeIn {
  0% {
    opacity: 0;
    visibility: visible;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%); }
  100% {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    transform: translateY(0%); } }

@keyframes textFadeIn {
  0% {
    opacity: 0;
    visibility: visible;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%); }
  100% {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    transform: translateY(0%); } }

@-webkit-keyframes revealBreak {
  0% {
    height: 0px; }
  100% {
    height: 4px; } }

@keyframes revealBreak {
  0% {
    height: 0px; }
  100% {
    height: 4px; } }

@-webkit-keyframes leadReveal {
  0% {
    top: -100%;
    opacity: 0; }
  100% {
    top: 0%;
    opacity: 1; } }

@keyframes leadReveal {
  0% {
    top: -100%;
    opacity: 0; }
  100% {
    top: 0%;
    opacity: 1; } }

@-webkit-keyframes panLeft {
  0% {
    margin-left: 5%; }
  100% {
    margin-left: -50%; } }

@keyframes panLeft {
  0% {
    margin-left: 5%; }
  100% {
    margin-left: -50%; } }

@-webkit-keyframes featureBtnTop {
  0% {
    width: 0%;
    left: 100%; }
  100% {
    width: 100%;
    left: 0; } }

@keyframes featureBtnTop {
  0% {
    width: 0%;
    left: 100%; }
  100% {
    width: 100%;
    left: 0; } }

@-webkit-keyframes featureBtnTopHide {
  0% {
    width: 100%;
    left: 0%; }
  100% {
    width: 0%;
    left: 100%; } }

@keyframes featureBtnTopHide {
  0% {
    width: 100%;
    left: 0%; }
  100% {
    width: 0%;
    left: 100%; } }

@-webkit-keyframes featureBtnBottom {
  0% {
    width: 0%;
    left: -100%; }
  100% {
    width: 100%;
    left: 0; } }

@keyframes featureBtnBottom {
  0% {
    width: 0%;
    left: -100%; }
  100% {
    width: 100%;
    left: 0; } }

@-webkit-keyframes featureBtnBottomHide {
  0% {
    width: 100%;
    left: 0%; }
  100% {
    width: 0%;
    left: -100%; } }

@keyframes featureBtnBottomHide {
  0% {
    width: 100%;
    left: 0%; }
  100% {
    width: 0%;
    left: -100%; } }

@-webkit-keyframes featureBtnRight {
  0% {
    height: 0%;
    top: 100%; }
  100% {
    height: 100%;
    top: 0%; } }

@keyframes featureBtnRight {
  0% {
    height: 0%;
    top: 100%; }
  100% {
    height: 100%;
    top: 0%; } }

@-webkit-keyframes featureBtnRightHide {
  0% {
    height: 100%;
    top: 0%; }
  100% {
    height: 0%;
    top: 100%; } }

@keyframes featureBtnRightHide {
  0% {
    height: 100%;
    top: 0%; }
  100% {
    height: 0%;
    top: 100%; } }

@-webkit-keyframes featureBtnLeft {
  0% {
    height: 0%;
    top: -100%; }
  100% {
    height: 100%;
    top: 0%; } }

@keyframes featureBtnLeft {
  0% {
    height: 0%;
    top: -100%; }
  100% {
    height: 100%;
    top: 0%; } }

@-webkit-keyframes featureBtnLeftHide {
  0% {
    height: 100%;
    top: 0%; }
  100% {
    height: 0%;
    top: -100%; } }

@keyframes featureBtnLeftHide {
  0% {
    height: 100%;
    top: 0%; }
  100% {
    height: 0%;
    top: -100%; } }
