/* @include animation(animation-name 2s ease 1s 1 normal forwards paused); */
/* line 5, ../sass/main.scss */
html, body {
  width: 100%;
  height: 100%;
  margin: 0px;
}

/* line 11, ../sass/main.scss */
.ad {
  width: 150px;
  height: 850px;
  overflow: hidden;
  position: absolute;
  background-color: #000;
  -moz-transform: translateZ(0px) perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -ms-transform: translateZ(0px) perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -webkit-transform: translateZ(0px) perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  transform: translateZ(0px) perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  -moz-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 22, ../sass/main.scss */
.sprite {
  position: absolute;
  background: url("../img/spritesheet.png") no-repeat;
}

/* line 27, ../sass/main.scss */
.copyright {
  width: 150px;
  height: 127px;
  background-position: -152px -240px;
}

/* line 28, ../sass/main.scss */
.cta {
  width: 150px;
  height: 193px;
  background-position: -0px -305px;
}

/* line 29, ../sass/main.scss */
.cta-glow {
  width: 150px;
  height: 193px;
  background-position: -304px -195px;
}

/* line 30, ../sass/main.scss */
.cta-over {
  width: 150px;
  height: 193px;
  background-position: -304px -0px;
}

/* line 31, ../sass/main.scss */
.pre {
  width: 150px;
  height: 238px;
  background-position: -152px -0px;
}

/* line 32, ../sass/main.scss */
.sun {
  width: 150px;
  height: 303px;
  background-position: -0px -0px;
}

/* line 33, ../sass/main.scss */
.wand {
  width: 94px;
  height: 102px;
  background-position: -152px -390px;
}

/* line 35, ../sass/main.scss */
.container {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: none;
}

/* line 44, ../sass/main.scss */
.exit {
  cursor: pointer;
}

/* line 48, ../sass/main.scss */
.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/background.jpg") no-repeat;
  opacity: 0;
  -moz-transition: opacity 2s linear 0s;
  -o-transition: opacity 2s linear 0s;
  -webkit-transition: opacity 2s linear;
  -webkit-transition-delay: 0s;
  transition: opacity 2s linear 0s;
}

/* line 60, ../sass/main.scss */
.fog {
  position: absolute;
  top: 0;
  left: 0;
  width: 450px;
  height: 100%;
  background: url("../img/fog.png") repeat-x;
  -moz-transform: translateX(-300px);
  -ms-transform: translateX(-300px);
  -webkit-transform: translateX(-300px);
  transform: translateX(-300px);
}

/* Position and animate sprites */
/* line 73, ../sass/main.scss */
.bottom {
  bottom: 0;
}

/* line 77, ../sass/main.scss */
.cta-container {
  position: absolute;
  height: 193px;
  width: 100%;
  pointer-events: none;
  -moz-transform: translateY(193px);
  -ms-transform: translateY(193px);
  -webkit-transform: translateY(193px);
  transform: translateY(193px);
  -moz-transition: -moz-transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1.5s;
  -o-transition: -o-transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1.5s;
  -webkit-transition: -webkit-transform 2s cubic-bezier(0, 0.05, 0.32, 1);
  -webkit-transition-delay: 1.5s;
  transition: transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1.5s;
}
/* line 87, ../sass/main.scss */
.cta-container:hover .cta-over {
  opacity: 1;
}

/* line 93, ../sass/main.scss */
.pre {
  -moz-transform: translateY(238px);
  -ms-transform: translateY(238px);
  -webkit-transform: translateY(238px);
  transform: translateY(238px);
  -moz-transition: -moz-transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1s;
  -o-transition: -o-transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1s;
  -webkit-transition: -webkit-transform 2s cubic-bezier(0, 0.05, 0.32, 1);
  -webkit-transition-delay: 1s;
  transition: transform 2s cubic-bezier(0, 0.05, 0.32, 1) 1s;
}

/* line 99, ../sass/main.scss */
.copyright {
  opacity: 0;
  -moz-transition: opacity 2s linear 2.5s;
  -o-transition: opacity 2s linear 2.5s;
  -webkit-transition: opacity 2s linear;
  -webkit-transition-delay: 2.5s;
  transition: opacity 2s linear 2.5s;
}

/* line 105, ../sass/main.scss */
.cta-over {
  opacity: 0;
  -moz-transition: opacity 0.25s linear;
  -o-transition: opacity 0.25s linear;
  -webkit-transition: opacity 0.25s linear;
  transition: opacity 0.25s linear;
}

/* line 115, ../sass/main.scss */
.cta-hit {
  position: absolute;
  background-color: rgba(255, 255, 255, 0);
  height: 50px;
  width: 100%;
  top: 35px;
  pointer-events: all;
}

/* line 124, ../sass/main.scss */
.wand-sun-container {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -moz-transition: opacity 2s linear 1s;
  -o-transition: opacity 2s linear 1s;
  -webkit-transition: opacity 2s linear;
  -webkit-transition-delay: 1s;
  transition: opacity 2s linear 1s;
}

/* line 133, ../sass/main.scss */
.wand {
  left: -2px;
  top: 178px;
}

/* line 139, ../sass/main.scss */
.sync .background {
  opacity: 1;
}
/* line 142, ../sass/main.scss */
.sync .wand-sun-container {
  opacity: 1;
}
/* line 145, ../sass/main.scss */
.sync .pre {
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}
/* line 149, ../sass/main.scss */
.sync .cta-container {
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}
/* line 153, ../sass/main.scss */
.sync .copyright {
  opacity: 1;
}
/* line 157, ../sass/main.scss */
.sync .legal {
  opacity: 1;
}
/* line 161, ../sass/main.scss */
.sync .cta-glow {
  -moz-animation: glow-animation 5s linear 0s infinite normal forwards;
  -webkit-animation: glow-animation 5s linear 0s infinite normal forwards;
  animation: glow-animation 5s linear 0s infinite normal forwards;
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
/* line 166, ../sass/main.scss */
.sync .fog {
  -moz-animation: fog-animation 5s linear 0s infinite normal forwards;
  -webkit-animation: fog-animation 5s linear 0s infinite normal forwards;
  animation: fog-animation 5s linear 0s infinite normal forwards;
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
/* line 171, ../sass/main.scss */
.sync .wand {
  -moz-animation: wand-animation 5s linear 0s infinite normal forwards;
  -webkit-animation: wand-animation 5s linear 0s infinite normal forwards;
  animation: wand-animation 5s linear 0s infinite normal forwards;
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
/* line 176, ../sass/main.scss */
.sync .sun {
  -moz-animation: sun-animation 4s linear 0s infinite normal forwards;
  -webkit-animation: sun-animation 4s linear 0s infinite normal forwards;
  animation: sun-animation 4s linear 0s infinite normal forwards;
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

@-moz-keyframes fog-animation {
  0% {
    -moz-transform: translateX(-300px);
    transform: translateX(-300px);
  }
  100% {
    -moz-transform: translateX(0px);
    transform: translateX(0px);
  }
}
@-webkit-keyframes fog-animation {
  0% {
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px);
  }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}
@keyframes fog-animation {
  0% {
    -moz-transform: translateX(-300px);
    -ms-transform: translateX(-300px);
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px);
  }
  100% {
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}
@-moz-keyframes glow-animation {
  0% {
    -moz-transform: translateX(-150px);
    transform: translateX(-150px);
  }
  100% {
    -moz-transform: translateX(150px);
    transform: translateX(150px);
  }
}
@-webkit-keyframes glow-animation {
  0% {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px);
  }
  100% {
    -webkit-transform: translateX(150px);
    transform: translateX(150px);
  }
}
@keyframes glow-animation {
  0% {
    -moz-transform: translateX(-150px);
    -ms-transform: translateX(-150px);
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px);
  }
  100% {
    -moz-transform: translateX(150px);
    -ms-transform: translateX(150px);
    -webkit-transform: translateX(150px);
    transform: translateX(150px);
  }
}
@-moz-keyframes wand-animation {
  0% {
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: .6;
  }
  10% {
    opacity: .4;
  }
  20% {
    opacity: .8;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
    opacity: .4;
  }
}
@-webkit-keyframes wand-animation {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: .6;
  }
  10% {
    opacity: .4;
  }
  20% {
    opacity: .8;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    opacity: .4;
  }
}
@keyframes wand-animation {
  0% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: .6;
  }
  10% {
    opacity: .4;
  }
  20% {
    opacity: .8;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    opacity: .4;
  }
}
@-moz-keyframes sun-animation {
  0% {
    opacity: .2;
  }
  10% {
    opacity: .8;
  }
  20% {
    opacity: .3;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    opacity: .4;
  }
}
@-webkit-keyframes sun-animation {
  0% {
    opacity: .2;
  }
  10% {
    opacity: .8;
  }
  20% {
    opacity: .3;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    opacity: .4;
  }
}
@keyframes sun-animation {
  0% {
    opacity: .2;
  }
  10% {
    opacity: .8;
  }
  20% {
    opacity: .3;
  }
  30% {
    opacity: .5;
  }
  40% {
    opacity: .1;
  }
  50% {
    opacity: .6;
  }
  60% {
    opacity: .2;
  }
  70% {
    opacity: 1;
  }
  80% {
    opacity: .3;
  }
  90% {
    opacity: .9;
  }
  100% {
    opacity: .4;
  }
}