@-webkit-keyframes hideDiv {
  0% {
    opacity: 1;
    pointer-events: auto;
  }
  80% {
    opacity: 1;
    pointer-events: auto;
  }
  100% {
    opacity: 0;
    pointer-events: none;
  }
}
@keyframes hideDiv {
  0% {
    opacity: 1;
    pointer-events: auto;
  }
  80% {
    opacity: 1;
    pointer-events: auto;
  }
  100% {
    opacity: 0;
    pointer-events: none;
  }
}
body.s1-1 div.s1-1 {
  opacity: 1;
  visibility: visible;
}
body.s1-1 .scene-1 {
  opacity: 1;
  -webkit-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  pointer-events: all;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  z-index: 4;
  visibility: visible;
}
body.s1-2 div.s1-2 {
  opacity: 1;
  visibility: visible;
}
body.s1-2 .scene-1 {
  opacity: 1;
  -webkit-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  pointer-events: all;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  z-index: 4;
  visibility: visible;
}
body.s1-2 .bubble-container {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}
body.s1-3 div.s1-3 {
  opacity: 1;
  visibility: visible;
}
body.s1-3 .scene-1 {
  opacity: 1;
  -webkit-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  pointer-events: all;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  z-index: 4;
  visibility: visible;
}
body.s1-3 .bubble-container {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}
body.s2-1 div.s2-1 {
  opacity: 1;
  visibility: visible;
}
body.s2-1 .scene-1 {
  opacity: 1;
  -webkit-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
  pointer-events: all;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  z-index: 4;
  visibility: visible;
}
body.s2-1 .bubble-container {
  opacity: 1;
  visibility: visible;
}

body.s2-3 .scene-1 .bubble-1 {
  -webkit-transform: translate3d(-50%, -50%, 0) scale(2.7);
  transform: translate3d(-50%, -50%, 0) scale(2.7);
  left: 50%;
  top: 50%;
  -webkit-transition: all 2s ease-in-out;
  transition: all 2s ease-in-out;
  margin: 0 !important;
}
body.s2-3 .scene-6 .video-1,
body.s2-3 .scene-1 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}
body.s2-3 .scene-2,
body.s2-3 .video-2 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 1.5s;
  transition-delay: 1.5s;
  pointer-events: all;
}
body.s2-3 .scene-2 {
  z-index: 3;
}

body.s2-4 .video-3 {
  opacity: 1;
  visibility: visible;
}

body.s2-5 .scene-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s2-5 .scene-4 .part-1 {
  opacity: 1;
  visibility: visible;
}
body.s2-5 .video-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-6 .scene-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.4);
}
body.s2-6 .scene-4 .part-2 {
  opacity: 1;
  visibility: visible;
}
body.s2-6 .video-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-7 .scene-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.4);
}
body.s2-7 .scene-4 .part-3 {
  opacity: 1;
  visibility: visible;
}
body.s2-7 .video-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-8 .scene-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.4);
}
body.s2-8 .scene-4 .part-4 {
  opacity: 1;
  visibility: visible;
}
body.s2-8 .video-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-9 .scene-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.4);
}
body.s2-9 .scene-4 .part-5 {
  opacity: 1;
  visibility: visible;
}
body.s2-9 .video-4 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

body.s2-10 .scene-5 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s2-10 .video-5 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-11 .scene-5 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s2-11 .video-5 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s2-11 .s2-11.icon-S2-11-text,
body.s2-11 .s2-11.bottom-btn {
  opacity: 1;
  visibility: visible;
}

body.s3-1 .scene-6 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s3-1 .video-1 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s3-2 .scene-6 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s3-2 .video-1 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s3-2 .bubble-container {
  opacity: 1;
  visibility: visible;
}
body.s3-2 .scene-1,
body.s3-2 .scene-11 {
  display: none;
}

body.s3-4 .scene-6 .bubble-1 {
  -webkit-transform: translate3d(-50%, -50%, 0) scale(2.7);
  transform: translate3d(-50%, -50%, 0) scale(2.7);
  left: 50%;
  top: 50%;
  -webkit-transition: all 2s ease-in-out;
  transition: all 2s ease-in-out;
  margin: 0 !important;
}
body.s3-4 .video-6,
body.s3-4 .scene-1 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}
body.s3-4 .scene-7,
body.s3-4 .video-7 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 2s;
  transition-delay: 2s;
  pointer-events: all;
}
body.s3-4 .scene-7 {
  z-index: 3;
}
body.s3-4 .s3-4.square {
  -webkit-animation: hideDiv 2s forwards;
  animation: hideDiv 2s forwards;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
body.s3-5 .s3-4.square {
  display: none;
}

body div.s3-5 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-5 div.s3-5 {
  opacity: 1;
  visibility: visible;
}
body.s3-5 .scene-8,
body.s3-5 .video-8 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body div.s3-6 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-6 div.s3-6 {
  opacity: 1;
  visibility: visible;
}
body.s3-6 .scene-8,
body.s3-6 .video-8 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body div.s3-7 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-7 div.s3-7 {
  opacity: 1;
  visibility: visible;
}
body.s3-7 .scene-8,
body.s3-7 .video-8 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s3-7 .s3-6.s3-7.icon-S3-6-clock {
  pointer-events: all;
}

body div.s3-8 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-8 div.s3-8 {
  opacity: 1;
  visibility: visible;
}
body.s3-8 .scene-9,
body.s3-8 .video-10 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

body div.s3-9 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-9 div.s3-9 {
  opacity: 1;
  visibility: visible;
}
body.s3-9 .scene-10,
body.s3-9 .video-11 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body div.s3-10 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s3-10 div.s3-10 {
  opacity: 1;
  visibility: visible;
}
body.s3-10 .scene-10,
body.s3-10 .video-11 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

body.s4-1 .scene-11 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s4-1 .video-1 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s4-2 .scene-11 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  z-index: 3;
}
body.s4-2 .video-1 {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
body.s4-2 .bubble-container {
  opacity: 1;
  visibility: visible;
}
body.s4-2 .scene-1,
body.s4-2 .scene-6 {
  display: none;
}

body.s4-4 .scene-11 .bubble-1 {
  -webkit-transform: translate3d(-50%, -50%, 0) scale(2.7);
  transform: translate3d(-50%, -50%, 0) scale(2.7);
  left: 50%;
  top: 50%;
  -webkit-transition: all 2s ease-in-out;
  transition: all 2s ease-in-out;
  margin: 0 !important;
}
body.s4-4 .video-11,
body.s4-4 .scene-1 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 2s;
  transition-delay: 2s;
}
body.s4-4 .scene-12 {
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.4);
}
body.s4-4 .s4-4.square {
  -webkit-animation: hideDiv 2s forwards;
  animation: hideDiv 2s forwards;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
body.s4-5 .s4-4.square {
  display: none;
}
body.s4-5 .scene-12 {
  background-color: rgba(0, 0, 0, 0);
}
body div.s4-4 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-4 div.s4-4 {
  opacity: 1;
  visibility: visible;
}
body div.s4-5 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-5 div.s4-5 {
  opacity: 1;
  visibility: visible;
}
body div.s4-6 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-6 div.s4-6 {
  opacity: 1;
  visibility: visible;
}
body.s4-4 .scene-12,
body.s4-4 .video-12, body.s4-5 .scene-12,
body.s4-5 .video-12, body.s4-6 .scene-12,
body.s4-6 .video-12 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  pointer-events: all;
}
body.s4-4 .scene-12 {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

body div.s4-7 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-7 div.s4-7 {
  opacity: 1;
  visibility: visible;
}
body.s4-7 .scene-13,
body.s4-7 .video-13 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}
body div.s4-8 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-8 div.s4-8 {
  opacity: 1;
  visibility: visible;
}
body.s4-8 .scene-13,
body.s4-8 .video-13 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}
body div.s4-9 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-9 div.s4-9 {
  opacity: 1;
  visibility: visible;
}
body.s4-9 .scene-13,
body.s4-9 .video-13 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}

body div.s4-10 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-10 div.s4-10 {
  opacity: 1;
  visibility: visible;
}
body.s4-10 .scene-14,
body.s4-10 .video-14 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}
body div.s4-11 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-11 div.s4-11 {
  opacity: 1;
  visibility: visible;
}
body.s4-11 .scene-14,
body.s4-11 .video-14 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}
body div.s4-12 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-12 div.s4-12 {
  opacity: 1;
  visibility: visible;
}
body.s4-12 .scene-14,
body.s4-12 .video-14 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}
body div.s4-13 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s4-13 div.s4-13 {
  opacity: 1;
  visibility: visible;
}
body.s4-13 .scene-14,
body.s4-13 .video-14 {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  pointer-events: all;
}

body.s5-1 .video-14,
body.s5-1 .video-15 {
  position: absolute;
  top: 34%;
  border-radius: 4000px;
  width: 50.8393285372vw;
  height: 63.5491606715vw;
}
@media (min-width: 720px) {
  body.s5-1 .video-14,
  body.s5-1 .video-15 {
    width: 50.9722222222vw;
    height: 65.1388888889vw;
  }
}
body.s5-1 .video-1,
body.s5-1 .video-14 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s5-1 .video-15 {
  opacity: 1;
  visibility: visible;
}
body.s5-1 .scene-15 {
  opacity: 1;
  visibility: visible;
}
body.s5-1 .scene-15 .sprite-img,
body.s5-1 .scene-15 .title,
body.s5-1 .scene-15 .qr-code,
body.s5-1 .scene-15 .s5-1.icon-restart,
body.s5-1 .scene-15 .s5-1.icon-restart-mp {
  opacity: 1;
  visibility: visible;
}
body.s1-1 .video-15 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
body.s1-1 .scene-15 {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}/*# sourceMappingURL=transitions.css.map */