@charset "UTF-8";
.layer-navigation {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 4;
    overflow: hidden;
    -moz-transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), opacity 2000ms;
    -ms-transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), opacity 2000ms;
    -webkit-transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), opacity 2000ms;
    transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), opacity 2000ms;
    left: ;
    opacity: 0;
}
@media (max-width: 1050px) {
    .layer-navigation {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 4;
        overflow: hidden;
        height: 60%;
        opacity: 1;
        background: radial-gradient(ellipse at -15vw -50vw, #ebc1c1 0%, rgba(52,40,73, 0) 100%);
        -moz-animation: gradient 5000ms infinite;
        -ms-animation: gradient 5000ms infinite;
        -webkit-animation: gradient 5000ms infinite;
        animation: gradient 5000ms infinite;
    }
}
@-moz-keyframes gradient {
    0% {
        filter: hue-rotate(0deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}
@-ms-keyframes gradient {
    0% {
        filter: hue-rotate(0deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}
@-webkit-keyframes gradient {
    0% {
        filter: hue-rotate(0deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}
@keyframes gradient {
    0% {
        filter: hue-rotate(0deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}
.layer-navigation.moved {
    opacity: 1;
}
.layer-navigation:after {
    content: '';
    position: absolute;
    right: -1px;
    top: 0;
    bottom: 0;
    background: linear-gradient(to right, rgba(52,40,73, 0) 0%, #342849 100%);
    width: 25vw;
}
@media (max-width: 1050px) {
    .layer-navigation:after {
        display: none;
    }
}
.layer-navigation:before {
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    background: linear-gradient(to right, #342849 0%, rgba(52,40,73, 0) 100%);
    width: 25vw;
    z-index: 4;
}
@media (max-width: 1050px) {
    .layer-navigation:before {
        display: none;
    }
}
.state-article .layer-navigation {
    -moz-transform: translateX(50vw);
    -ms-transform: translateX(50vw);
    -webkit-transform: translateX(50vw);
    transform: translateX(50vw);
    cursor: e-resize;
}
@media (max-width: 1050px) {
    .state-article .layer-navigation {
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
.navigation-wrapper {
    -moz-transition: transform 60ms;
    -ms-transition: transform 60ms;
    -webkit-transition: transform 60ms;
    transition: transform 60ms;
    position: absolute;
    left: 4vw;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    top: 36vh;
  }
@media (max-width: 1050px) {
    .navigation-wrapper {
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -webkit-transform: translateX(0);
        transform: translateX(0);
        left: 0;
        top: 17vh;
        right: 0;
        text-align: center;
        color: #fff;
    }
}
.navigation-inner {
    -moz-transition: transform 2200ms cubic-bezier(0.645, 0.045, 0.355, 1);
    -ms-transition: transform 2200ms cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transition: transform 2200ms cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 2200ms cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.browser-chrome .circle-wrapper {
    animation: rotate 30s infinite linear;
}
@media (max-width: 1050px) {
    .browser-chrome .circle-wrapper {
        animation: none;
    }
}
@keyframes rotate {
    0% {
        transform: rotate(0deg) translate(20px) rotate(0deg);
    }
    100% {
        transform: rotate(360deg) translate(20px) rotate(-360deg);
    }
}
.background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:#342849;
}
@media (max-width: 1050px) {
    .background {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: none;
    }
}
.gradient {
    position: absolute;
    -moz-transition: -webkit-filter 1200ms, top 1200ms, left 1200ms, right 1200ms, bottom 1200ms;
    -ms-transition: -webkit-filter 1200ms, top 1200ms, left 1200ms, right 1200ms, bottom 1200ms;
    -webkit-transition: -webkit-filter 1200ms, top 1200ms, left 1200ms, right 1200ms, bottom 1200ms;
    transition: -webkit-filter 1200ms, top 1200ms, left 1200ms, right 1200ms, bottom 1200ms;
}
.gradient-1 {
    width: 150vw;
    height: 70vw;
    bottom: -35vw;
    left: -25vw;
    background: radial-gradient(ellipse at bottom center, RGBA(197,163,218, 0.7) 0%, RGBA(52,40,73, 0) 50%);
}
.gradient-2 {
    width: 100vw;
    height: 110vw;
    bottom: -50vw;
    left: 0vw;
    background: radial-gradient(ellipse at center left, RGBA(255,221,150, 1) 0%, RGBA(52,40,73, 0) 50%);
}
.gradient-3 {
    width: 100vw;
    height: 200vw;
    bottom: -50vw;
    left: 0vw;
    background: radial-gradient(ellipse at center right, RGBA(61,198,160, 1) 0%, RGBA(52,40,73, 0) 50%);
}
.marks {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  pointer-events: none; }

.mark {
  position: absolute;
  cursor: default;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: block;
  width: 200px;
  height: 200px;
  border-radius: 500px;
  -webkit-filter: blur(1px);
  -moz-filter: blur(1px);
  -o-filter: blur(1px);
  -ms-filter: blur(1px);
  filter: blur(1px);
  font-size: 2.5vw;
  text-align: center;
  color: #fff;
  font-weight: 500;
  background: linear-gradient(45deg, RGBA(255,221,150, 0.6) 10%, RGBA(255,221,150, 0.1) 80%);
  mix-blend-mode: overlay;
  -moz-animation: markFadeOut 5000ms;
  -ms-animation: markFadeOut 5000ms;
  -webkit-animation: markFadeOut 5000ms;
  animation: markFadeOut 5000ms;
  opacity: 0; }

@-moz-keyframes markFadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }
@-ms-keyframes markFadeOut {
  0% {
    opacity: 1; }

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

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

  100% {
    opacity: 0; } }
