@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,900');
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.cover-el {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
body {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  font-weight: 300;
  color: #fff;
  background: #17181e;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.img-responsive {
  display: block;
  max-width: 100%;
  max-height: 100%;
}
body {
  overflow: hidden;
}
.main-container-outer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #202020;
  transform: translateX(0);
  transition: transform 800ms;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
  z-index: 2;
}
.main-container-outer .video-container {
  opacity: 1;
  transition: opacity 0.3s 800ms ease;
}
.main-container-outer .video-container:nth-child(2) {
  transition-delay: 850ms;
}
.main-container-outer .video-container:nth-child(3) {
  transition-delay: 900ms;
}
.main-container-outer .video-container:nth-child(4) {
  transition-delay: 950ms;
}
.main-container-outer .video-container:nth-child(5) {
  transition-delay: 1000ms;
}
.main-container-outer .video-container:nth-child(6) {
  transition-delay: 1050ms;
}
.main-container-outer .video-container:nth-child(7) {
  transition-delay: 1100ms;
}
.main-container-outer .video-container:nth-child(8) {
  transition-delay: 1150ms;
}
.main-container-outer .video-container:nth-child(9) {
  transition-delay: 1200ms;
}
.intro--on .main-container-outer {
  transform: translateX(-100%);
}
.intro--on .main-container-outer .video-container {
  opacity: 0;
}
.intro--on .toolbar-container {
  transform: translateY(115%);
}
.main-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  bottom: 80px;
  transition: bottom 0.3s ease;
}
.main-container .video-container {
  float: left;
  width: 33.333%;
  height: 33.333%;
  overflow: hidden;
  position: relative;
}
.main-container .video-container video {
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.close-fullscreen-container {
  transform: translateX(100%);
  transition: transform 0.3s ease;
}
.fullscreen--on .main-container {
  bottom: 0;
}
.fullscreen--on .close-fullscreen-container {
  transform: translateX(0);
}
.credits-body {
  font-size: 18px;
  line-height: 36px;
}
.credits-titles {
  display: inline-block;
  text-transform: uppercase;
  font-size: 50px;
  font-weight: 900;
  position: relative;
}
.credits-titles span {
  position: relative;
  display: inline-block;
  padding: 0 40px;
}
.credits-titles:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../content/assets/pallini-gradient.png);
  background-repeat: no-repeat;
  width: 291px;
  height: 92px;
}
.credits-titles span,
.credits-titles:before {
  transform: translate(0);
}
@font-face {
  font-family: 'icomoon';
  src: url('fonts/icomoon.eot?r2j54x');
  src: url('fonts/icomoon.eot?r2j54x#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?r2j54x') format('truetype'), url('fonts/icomoon.woff?r2j54x') format('woff'), url('fonts/icomoon.svg?r2j54x#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/*.icon-fullscreen{
    transform: rotate(90deg);
}
.icon-share, .icon-fullscreen, .icon-sound, .icon-arrow{
    font-size: 70%;    
}*/
.icon-copy {
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}
.icon-copy:before,
.icon-copy:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  border: 1px solid;
  background: #fff;
}
.icon-copy:before {
  top: -2px;
  left: -2px;
}
.icon-copy:after {
  top: 2px;
  left: 2px;
}
.icon-restart:before {
  content: "\e900";
}
.icon-share:before {
  content: "\e901";
}
.icon-fullscreen:before {
  content: "\e902";
}
.icon-pause:before {
  content: "\e905";
}
.icon-play:before {
  content: "\e906";
}
.icon-arrow:before {
  content: "\e907";
}
.icon-close:before {
  content: "\e904";
}
.icon-sound:before {
  content: "\e903";
}
.icon-fullscreen-off:before {
  content: "\e908";
}
.btn {
  background: none;
  display: inline-block;
  line-height: 38px;
  border: 1px solid;
  text-align: center;
  text-transform: uppercase;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
  outline: 0 none;
}
.btn-primary {
  background: #fff;
  color: #17181e;
  border-color: #fff;
}
.btn-primary:hover {
  background: #ff65ff;
  color: #fff;
  border-color: #ff65ff;
}
.btn-outline-primary {
  background: transparent;
  color: #fff;
  border-color: #fff;
}
.btn-outline-primary:hover {
  background: #fff;
  color: #17181e;
}
.btn-outline-primary.btn-normal {
  padding: 0 46px;
  text-decoration: none;
}
.btn-small {
  min-width: 125px;
}
.btn-large {
  min-width: 250px;
}
.round-btn {
  display: block;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
  transition: background 0.3s ease;
}
.round-btn:hover {
  background: #ff65ff;
}
.round-btn:hover .icon {
  color: #fff;
}
.round-btn .icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 9px;
  color: #17181e;
  transition: color 0.3s ease;
}
.close-fullscreen-container {
  position: absolute;
  right: 0;
  bottom: 10px;
  padding: 20px;
  z-index: 2;
}
.close-fullscreen-btn {
  /*span{
        display: block;
        width: 4px;
        height: 18px;
        .centered;
        background: @main-color;
        position: relative;
        transition: background 0.3s ease;
        &:before, &:after{
            content: "";
            width: 4px;
            background: inherit;
            position: absolute;
            bottom: 0;
        }
        &:before{
            left: -7px;
            height: 14px;
        }
        &:after{
            left: 7px;
            height: 10px;
        }
    }
    &:hover{
        span{background: #fff;}
    }*/
}
.close-fullscreen-btn .icon {
  font-size: 31px;
  color: #ff65ff;
}
.tutorial--on .close-fullscreen-btn {
  opacity: 0;
}
.tutorial {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  bottom: 80px;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
  z-index: 4;
}
.tutorial .tile-focus {
  position: absolute;
  top: 33.333%;
  right: 0;
  width: 33.333%;
  height: 33.333%;
  background: linear-gradient(to right, #6665ff 0%, #ff65ff 100%);
}
.tutorial .ocean {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 180px;
  overflow: hidden;
}
.tutorial .ocean div {
  background: url(../content/assets/wave1.svg);
  background-repeat: repeat-x;
  background-position: 0 top;
  position: absolute;
  bottom: 0;
  width: 2296px;
  height: 100%;
  animation: wave 3s linear infinite;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.tutorial .ocean .wave2 {
  animation-duration: 4s;
  animation-delay: 1s;
}
.tutorial .ocean .wave3 {
  animation-duration: 2s;
  animation-delay: 1.5s;
}
.tutorial .main-container {
  display: flex;
  align-items: center;
  padding-left: 16.66%;
  overflow: hidden;
  bottom: 0;
}
.tutorial .tutorial-content {
  position: relative;
  z-index: 1;
  max-width: 490px;
}
.tutorial .tutorial-content > p {
  line-height: 1.6;
}
.tutorial .tutorial-content .buttons-container {
  margin-top: 60px;
}
.tutorial h3 {
  font-weight: 900;
  font-size: 50px;
  text-transform: uppercase;
  margin: 0 0 20px;
}
.tutorial .pulse {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
}
.tutorial .pulse > div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  width: 750px;
  height: 750px;
  border-radius: 50%;
  margin-top: -375px;
  margin-left: -375px;
  opacity: 0.5;
  transform: scale(0);
  animation: pulse 4s infinite;
}
.tutorial .pulse > div.circle1 {
  animation-delay: 1s;
}
.tutorial .pulse > div.circle2 {
  animation-delay: 1.5s;
}
.tutorial .pulse > div.circle3 {
  animation-delay: 2s;
}
.tutorial .step2,
.tutorial .step1 {
  transform: translateY(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.tutorial .step2 {
  transform: translateY(20px);
  opacity: 0;
  pointer-events: none;
}
.tutorial--on .tutorial {
  opacity: 1;
  pointer-events: auto;
}
.tutorial--on.step2--on .tutorial .step1 {
  opacity: 0;
  transform: translateY(-20px);
  pointer-events: none;
}
.tutorial--on.step2--on .tutorial .step2 {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
@keyframes pulse {
  0% {
    opacity: 0.5;
    transform: scale(0);
  }
  70% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
@keyframes wave {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -2296px 0;
  }
}
.video-container:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #000;
  opacity: 0.8;
  transition: opacity 0.3s ease;
}
.video-container .video-info {
  opacity: 0;
  cursor: url(../content/assets/cursor.png), auto;
  background: linear-gradient(to right, rgba(102, 101, 255, 0.7) 0%, rgba(255, 101, 255, 0.7) 100%);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  /*&:hover{
            span{transform: translate(20px, -20px)}
            h3:before{transform: translate(-20px, 20px)}
        }*/
}
.video-container .video-info h3 {
  display: inline-block;
  text-transform: uppercase;
  font-size: 46px;
  font-weight: 900;
  position: relative;
}
.video-container .video-info h3 span {
  position: relative;
  background: #ff65ff;
  display: inline-block;
  padding: 0 15px;
}
.video-container .video-info h3:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../content/assets/pallini.png);
  background-size: 20px;
}
.video-container .video-info h3 span,
.video-container .video-info h3:before {
  transform: translate(0);
}
@media (min-width: 1400px) {
  .video-container .video-info h3 {
    font-size: 68px;
  }
}
.video-container:not(.unmuted):hover:after {
  opacity: 0.4;
}
.video-container.unmuted:after {
  opacity: 0;
}
.video-container.unmuted .video-info {
  animation: fade 1.2s;
  cursor: url(../content/assets/cursor-off.png), auto;
}
.video-container.unmuted span {
  animation: translates1 1.2s;
}
.video-container.unmuted h3:before {
  animation: translates2 1.2s;
}
.video-container.unmuted:before {
  content: "";
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: url(../content/assets/audio-on.gif) no-repeat center center;
  z-index: 1;
}
@keyframes fade {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes translates1 {
  0% {
    transform: translate(0);
  }
  40% {
    transform: translate(10px, -10px);
  }
  60% {
    transform: translate(10px, -10px);
  }
  100% {
    transform: translate(0);
  }
}
@keyframes translates2 {
  0% {
    transform: translate(0);
  }
  40% {
    transform: translate(-10px, 10px);
  }
  60% {
    transform: translate(-10px, 10px);
  }
  100% {
    transform: translate(0);
  }
}
.toolbar-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 80px;
  top: auto;
  transform: translateY(0);
  transition: transform 0.3s 800ms ease;
}
.toolbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 80px;
  top: auto;
  background: #3d3f50;
  transform: translateY(0);
  transition: transform 0.3s ease;
  z-index: 1;
}
.toolbar .progress {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 12px;
  background: rgba(255, 255, 255, 0.5);
  transform: translateY(-12px);
  transition: transform 0.3s ease;
}
.toolbar .progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  right: auto;
  width: 0;
  background: linear-gradient(to right, #6665ff 0%, #ff65ff 100%);
  transition: width 0.3s ease;
}
.toolbar .toolbar-menu {
  height: 100%;
}
.toolbar .main-nav {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
}
.toolbar .main-nav .nav-item {
  display: flex;
  width: 240px;
  height: 100%;
}
.toolbar .main-nav .nav-item .nav-button {
  cursor: pointer;
  height: 100%;
  text-align: center;
  opacity: 0.5;
  background: transparent;
  transition: opacity 0.3s ease, background 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
}
.toolbar .main-nav .nav-item .nav-button:hover {
  opacity: 1;
  background: #2f303e;
}
.toolbar .main-nav .about-btn {
  flex-basis: 66.66%;
  font-size: 13px;
  text-transform: uppercase;
}
.toolbar .main-nav .share-btn {
  flex-basis: 33.33%;
  border-left: 2px solid #4c4f64;
}
.toolbar .main-nav .logo-fb {
  flex: 1;
}
.toolbar .main-nav .logo-fb,
.toolbar .main-nav .logo-fb img {
  display: block;
}
.toolbar .audio-player {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  left: 240px;
  right: 240px;
  z-index: 1;
  background: #4c4f64;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: right 0.3s ease, left 0.3s ease, background 0.3s ease;
}
.toolbar .audio-player > span {
  cursor: pointer;
  display: block;
  margin: 0 20px;
  font-size: 26px;
  color: #fff;
  transition: color 0.3s ease;
}
.toolbar .audio-player > span:hover {
  color: #ff65ff;
}
.toolbar .audio-player .play-btn.off,
.toolbar .audio-player .audio-btn.off {
  color: lime;
}
.toolbar .audio-player .play-btn.playing .icon-play {
  width: 22.5px;
}
.toolbar .audio-player .play-btn.playing .icon-play:before {
  content: "\e905";
}
.tutorial--on .toolbar {
  opacity: 0.2;
}
.tutorial--on .toolbar .progress {
  transform: translateY(0);
}
.tutorial--on .toolbar .audio-player {
  left: 0;
  right: 0;
}
.tutorial--on .toolbar .audio-player > span {
  pointer-events: none;
}
.tutorial--on.step2--on .toolbar {
  opacity: 1;
}
.tutorial--on.step2--on .toolbar .audio-player {
  background: linear-gradient(to right, #6665ff 0%, #ff65ff 100%);
}
.fullscreen--on .toolbar {
  transform: translateY(80px);
}
.share-content {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s 1s ease;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}
.share-content .column {
  position: relative;
  float: left;
  width: 33.33%;
  height: 100%;
  overflow: hidden;
}
.share-content textarea {
  opacity: 0;
  height: 0;
  width: 0;
  overflow: hidden;
  position: absolute;
}
.share-content .share-btn {
  cursor: url(../content/assets/cursor.png), auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateX(-100%);
  transition: transform 0.8s 0.3s;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}
.share-content .share-btn:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.share-content .share-btn .share-btn-content {
  position: relative;
  left: -10px;
  opacity: 0;
  transition: all 0.3s ease;
}
.share-content .share-btn span {
  margin-left: 10px;
  font-weight: 400;
}
.share-content .share-btn > * {
  position: relative;
}
.share-content .share-btn:hover:before {
  opacity: 1;
}
.share-content .share-btn.share-link {
  background: #222222;
  transition-delay: 0.5s;
}
.share-content .share-btn.share-link:before {
  background: linear-gradient(-150deg, #ec3e56 0%, #a6222a 100%);
}
.share-content .share-btn.share-tw {
  background: #202020;
  transition-delay: 0.4s;
}
.share-content .share-btn.share-tw:before {
  background: linear-gradient(-150deg, #1da1f2 0%, #106ebb 100%);
}
.share-content .share-btn.share-fb {
  background: #1e1e1e;
}
.share-content .share-btn.share-fb:before {
  background: linear-gradient(-150deg, #4867aa 0%, #103468 100%);
}
.share-content .close-share-container {
  position: absolute;
  top: 10px;
  right: 0;
  padding: 20px;
}
.share--on .share-content {
  opacity: 1;
  transition-delay: 0s;
  pointer-events: auto;
}
.share--on .share-content .share-btn {
  transform: translateX(0);
}
.share--on .share-content .share-btn .share-btn-content {
  left: 0;
  opacity: 1;
  transition-delay: 1.2s;
}
.credits-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #202020;
  z-index: 9;
  transform: translateX(-100%);
  transition: transform 800ms;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
  transition-delay: 500ms;
}
.credits-content .credits-inner {
  overflow: hidden;
  height: 100%;
}
.credits-content .credits-container {
  max-width: 800px;
  margin: 0 auto;
  opacity: 0;
  position: relative;
  left: -20px;
  transition: opacity 500ms ease, left 500ms ease;
  /*&.scene1 {
            transition: opacity 800ms 400ms, left 800ms 400ms;
            transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
        }
        &.scene2 {
            transition: opacity 800ms 800ms, left 800ms 800ms;
            transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
        }
        &.scene3 {
            transition: opacity 800ms 1200ms, left 800ms 1200ms;
            transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
        }*/
}
.credits-content .credits-container .credits-text-container {
  margin: 90px 0;
}
.credits-content .credits-close-container {
  position: fixed;
  top: 10px;
  opacity: 0;
  right: 40px;
  padding: 20px;
  transition: opacity 800ms 400ms, right 800ms 400ms;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}
.credits-content .credits-text-inner {
  padding-left: 40px;
}
.credits-content .credits-text-inner .credits-links {
  list-style-type: none;
  padding-left: 0;
}
.credits-content .credits-text-inner .credits-links > li {
  line-height: 32px;
}
.credits-content .credits-text-inner .credits-links > li > a {
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 18px;
}
.credits-content .credits-text-inner .credits-links > li > a > i {
  margin-left: 8px;
  color: #ff65ff;
}
.credits--on .credits-content {
  transform: translateX(0);
  transition-delay: 0s;
}
.credits--on .credits-content .credits-container {
  transition-delay: 800ms;
}
.credits--on .credits-content .credits-container.scene1,
.credits--on .credits-content .credits-container.scene2,
.credits--on .credits-content .credits-container.scene3 {
  opacity: 1;
  left: 0;
}
.credits--on .credits-content .credits-close-container {
  opacity: 1;
  right: 20px;
}
.loading-intro-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to right, #6665ff 0%, #ff65ff 100%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
.loading-intro-content .loading-intro-centered {
  width: 964px;
  padding-top: 370px;
}
.loading-intro-content .static-gif-content {
  opacity: 0;
  position: relative;
  left: -40px;
  transition: opacity 800ms 400ms, left 800ms 400ms;
}
.loading-intro-content .loading-intro-progress-bar {
  width: 0;
  height: 28px;
  background-color: #fff;
  margin-top: 20px;
  opacity: 0;
  position: relative;
  left: -40px;
  transition: opacity 800ms 800ms, left 800ms 800ms;
}
.loading-intro-content .loading-intro-disclaimer-outer {
  display: flex;
  min-height: 98px;
  margin-top: 20px;
  opacity: 0;
  position: relative;
  left: -40px;
  transition: opacity 800ms 1200ms, left 800ms 1200ms;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-left,
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right {
  min-height: 98px;
  display: flex;
  align-content: center;
  align-items: center;
  border-color: #fff;
  border-style: solid;
  padding: 20px 40px;
  box-sizing: border-box;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-left {
  width: 66.66667%;
  border-width: 1px 0 1px 1px;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-left > span {
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right {
  font-size: 14px;
  border-width: 1px 1px 1px 1px;
  width: 33.33333%;
  justify-content: space-around;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right .loading-intro-audio-text {
  float: left;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right .loading-intro-audio-text > a {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right .loading-intro-audio-icon {
  float: right;
}
.loading-intro-content .loading-intro-disclaimer-outer .loading-intro-disclaimer-inner-right .loading-intro-audio-icon > i {
  font-size: 22px;
}
.loading-intro-content _::-webkit-:not(:root:root),
.loading-intro-content .safari_only_not {
  display: none !important;
}
.loading-intro-content _::-webkit-:not(:root:root),
.loading-intro-content .safari_only_yes {
  display: block !important;
  margin-top: -230px;
}
.loading-intro-content .static-gif-content {
  display: none;
}
.loading-intro-content .snow-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.loading-intro-content .snow-container .parallax {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}
.loading-intro-content .snow-container .parallax::before {
  content: ' ';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center center;
  will-change: transform;
  image-rendering: optimizeSpeed;
}
.loading-intro-content .snow-container .snow2 {
  width: 104%;
  height: 100%;
}
.loading-intro-content .snow-container .snow2::before {
  background-image: url(../content/assets/stelle2.png);
}
.loading-intro-content .snow-container .snow1 {
  width: 102%;
  height: 100%;
}
.loading-intro-content .snow-container .snow1::before {
  background-image: url(../content/assets/stelle1.png);
}
.no-svgclippaths .loading-intro-content .safari_only_not {
  display: none;
}
.no-svgclippaths .loading-intro-content .safari_only_yes {
  display: block;
  margin-top: -230px;
}
.intro--on .static-gif-content {
  opacity: 1;
  left: 0;
}
.intro--on .loading-intro-progress-bar {
  opacity: 1;
  left: 0;
}
.intro--on .loading-intro-disclaimer-outer {
  opacity: 1;
  left: 0;
}
@media screen and (max-width: 1023px) {
  html,
  body {
    overflow: hidden;
  }
}
.gifmas-mobile-version {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to right, #6665ff 0%, #ff65ff 100%);
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gifmas-mobile-version:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../content/assets/stelle2.png) repeat center center, url(../content/assets/stelle1.png) repeat center top;
}
.gifmas-mobile-version .gifmas-mobile-inner {
  position: relative;
  z-index: 1;
  padding: 60px 40px;
}
.gifmas-mobile-version .gifmas-mobile-inner .gifmas-mobile-disclaimer {
  margin-top: 20px;
  padding: 20px;
  border: 1px solid #fff;
}
.gifmas-mobile-version .gifmas-mobile-inner .gifmas-mobile-disclaimer .disclaimer-title {
  display: block;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: 0.07em;
  font-weight: 700;
  text-transform: uppercase;
}
.gifmas-mobile-version .gifmas-mobile-inner .gifmas-mobile-disclaimer .disclaimer-text {
  display: block;
  margin-top: 15px;
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
}
.gifmas-mobile-version .mobile-share-link {
  display: block;
  width: 100%;
  padding: 13px 0;
  font-size: 13px;
  font-weight: 300;
  line-height: 1;
  margin-top: 20px;
  background: #fff;
  border: 0;
  box-shadow: none;
  color: #3d3f50;
}
.gifmas-mobile-version .mobile-share-link .icon-copy {
  color: #3d3f50;
  width: 12px;
  height: 14px;
  margin-right: 20px;
}
.gifmas-mobile-version .mobile-share-link span {
  display: inline-block;
  vertical-align: middle;
}
.gifmas-mobile-version .gifmas-text {
  margin-top: 30px;
}
@media screen and (min-width: 1025px) {
  .gifmas-mobile-version {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .desktop-view {
    display: none;
  }
}
/*# sourceMappingURL=style.css.map */