.scroll-animation.hide:not(.active) {
  opacity: 0;
}

.scroll-animation.hidden {
  opacity: 0;
}

.comp.hidden {
  opacity: 0;
}

.comp2.hidden {
  opacity: 0;
}

.loaded.slideInMenu {
  animation: slide-in-menu 1s linear 0s 1 normal none;
}

.autoTextFocus {
  animation: text-focus-in 0.5s linear 0s 1 normal none;
}

.autoSlideBot {
  animation: slide-in-bck-bottom 0.5s linear 0s 1 normal none;
}

.autoSlideTop {
  animation: slide-in-bck-top 0.5s linear 0s 1 normal none;
}

.autoScaleUpCenter {
  animation: scale-up-center 1s linear 0s 1 normal none;
}

.autoSlitInHorizontal {
  animation: slit-in-horizontal 1s linear 0s 1 normal none;
}

.autoTiltInTop1 {
  animation: tilt-in-top-1 1s linear 0s 1 normal none;
}

.autoFadeInLeft {
  animation: fade-in-left 1s linear 0s 1 normal none;
}

.autoFadeInTop {
  animation: fade-in-top 1s linear 0s 1 normal none;
}

.autoSwirlInZoomIn {
  animation: swirl-in-zoomin 1s linear 0s 1 normal none;
}

.autoShutterInTop {
  animation: shutter-in-top 1s linear 0s 1 normal none;
}

.autoFocusInExpand {
  animation: focus-in-expand-top 1s linear 0s 1 normal none;
}

.autoSlitInVertical {
  animation: slit-in-vertical 1s linear 0s 1 normal none;
}

.autoFadeIn {
  animation: fade-in 2s linear 0s 1 normal none;
}

.autoShutterInBottom {
  animation: shutter-in-bottom 1s linear 0s 1 normal none;
}

.autoSlideInBckBottom {
  animation: slide-in-bck-bottom 1s linear 0s 1 normal none;
}

.loaded.flipInX {
  animation: flipinx 1s linear 0s 1 normal none;
}

.loaded.flipScaleUpVer {
  animation: flip-scale-up-ver 1s linear 0s 1 normal none;
}

.loaded.flipVertical {
  animation: flip-vertical 1s linear 0s 1 normal none;
}

.loaded.focusInContract.active {
  animation: focus-in-contract 1s linear 0s 1 normal none;
}

.loaded.fadeIn.active {
  animation: fade-in 2s linear 0s 1 normal none;
}

.loaded.focusInExpand.active {
  animation: focus-in-expand-top 1s linear 0s 1 normal none;
}

.loaded.slideInRight.active {
  animation: slide-in-right 1s linear 0s 1 normal none;
}

.loaded.slideInLeft.active {
  animation: slide-in-left 1s linear 0s 1 normal none;
}

.loaded.slitInHorizontal.active {
  animation: slit-in-horizontal 1s linear 0s 1 normal none;
}

.loaded.fadeIn.active {
  animation: fade-in 2s linear 0s 1 normal none;
}

.loaded.slideInBckRight.active {
  animation: slide-in-bck-right 1s linear 0s 1 normal none;
}

.loaded.slideInBckLeft.active {
  animation: slide-in-bck-left 1s linear 0s 1 normal none;
}

.loaded.shutterInTop.active {
  animation: shutter-in-top 1s linear 0s 1 normal none;
}

.loaded.slitInVertical.active {
  animation: slit-in-vertical 1s linear 0s 1 normal none;
}

.loaded.slitInVerticalD1.active {
  animation: slit-in-vertical 1s linear 2s 1 normal none;
}

.loaded.swirlInZoomIn.active {
  animation: swirl-in-zoomin 1s linear 0s 1 normal none;
}

.loaded.puffInHorizontal.active {
  animation: puff-in-horizontal 1s linear 0s 1 normal none;
}

.loaded.fadeInLeft.active {
  animation: fade-in-left 1s linear 0s 1 normal none;
}

.loaded.fadeInLeftD1 {
  animation: fade-in-left 1s linear 0.25s 1 normal none;
}

.loaded.fadeInLeftD2 {
  animation: fade-in-left 1s linear 0.5s 1 normal none;
}

.loaded.fadeInLeftD3 {
  animation: fade-in-left 1s linear 0.75s 1 normal none;
}

.loaded.fadeInLeftD4 {
  animation: fade-in-left 1s linear 1.0s 1 normal none;
}

.loaded.fadeInLeftD5 {
  animation: fade-in-left 1s linear 1.25s 1 normal none;
}

.loaded.fadeInRight.active {
  animation: fade-in-right 1s linear 0s 1 normal none;
}

.loaded.shutterInLeft.active {
  animation: shutter-in-left 1s linear 0s 1 normal none;
}

.loaded.shutterInRight.active {
  animation: shutter-in-right 1s linear 0s 1 normal none;
}

.loaded.fadeInTop.active {
  animation: fade-in-top 1s linear 0s 1 normal none;
}

.loaded.fadeInTopD1.active {
  animation: fade-in-top 1s linear 0.5s 1 normal none;
}

.loaded.fadeInTopD2.active {
  animation: fade-in-top 1s linear 1.5s 1 normal none;
}


@keyframes fade-in-top {

  0% {
    transform: translateY(-50px);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes shutter-in-right {

  0% {
    transform: rotateY(-100deg);
    transform-origin: right;
    opacity: 0;
  }

  100% {
    transform: rotateY(0);
    transform-origin: right;
    opacity: 1;
  }
}

@keyframes shutter-in-left {

  0% {
    transform: rotateY(100deg);
    transform-origin: left;
    opacity: 0;
  }

  100% {
    transform: rotateY(0);
    transform-origin: left;
    opacity: 1;
  }
}

@keyframes fade-in-right {

  0% {
    transform: translateX(50px);
    opacity: 0;
  }

  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes shutter-in-bottom {

  0% {
    transform: rotateX(100deg);
    transform-origin: bottom;
    opacity: 0;
  }

  100% {
    transform: rotateX(0);
    transform-origin: bottom;
    opacity: 1;
  }
}

@keyframes puff-in-horizontal {

  0% {
    transform: scaleX(2);
    filter: blur(4px);
    opacity: 0;
  }

  100% {
    transform: scaleX(1);
    filter: blur(0);
    opacity: 1;
  }
}

@keyframes slit-in-vertical {

  0% {
    transform: translateZ(-800px) rotateY(90deg);
    opacity: 0;
  }

  50% {
    transform: translateZ(-160px) rotateY(87deg);
    opacity: 1;
  }

  100% {
    transform: translateZ(0) rotateY(0);
  }
}

@keyframes slide-in-bck-right {

  0% {
    transform: translateZ(700px) translateX(400px);
    opacity: 0;
  }

  100% {
    transform: translateZ(0) translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-bck-left {

  0% {
    transform: translateZ(700px) translateX(-400px);
    opacity: 0;
  }

  100% {
    transform: translateZ(0) translateX(0);
    opacity: 1;
  }
}

@keyframes fade-in {

  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes slide-right {

  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(100px);
  }
}

@keyframes slide-in-left {

  0% {
    transform: translateX(-1000px);
    opacity: 0;
  }

  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-right {

  0% {
    transform: translateX(1000px);
    opacity: 0;
  }

  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes shutter-in-top {

  0% {
    transform: rotateX(-100deg);
    transform-origin: top;
    opacity: 0;
  }

  100% {
    transform: rotateX(0deg);
    transform-origin: top;
    opacity: 1;
  }
}

@keyframes flipinx {

  0% {
    transform: rotateY(-180deg);
  }

  100% {
    transform: rotateY(0deg);
  }
}

@keyframes swirl-in-zoomin {

  0% {
    transform: rotate(-540deg) scale(0);
    opacity: 0;
  }

  100% {
    transform: rotate(0) scale(1);
    opacity: 1;
  }
}

@keyframes flip-vertical {

  0% {
    transform: rotateY(0);
  }

  100% {
    transform: rotateY(360deg);
  }
}

@keyframes flip-scale-up-ver {

  0% {
    transform: scale(1) rotateY(0);
  }

  50% {
    transform: scale(2.5) rotateY(90deg);
  }

  100% {
    transform: scale(1) rotateY(180deg);
  }
}

@keyframes fade-in-left {

  0% {
    transform: translateX(-50px);
    opacity: 0;
  }

  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes tilt-in-top-1 {

  0% {
    transform: rotateY(30deg) translateY(-300px) tiltY(-30deg);
    opacity: 0;
  }

  100% {
    transform: rotateY(0deg) translateY(0) tiltY(0deg);
    opacity: 1;
  }
}

@keyframes scale-up-center {

  0% {
    transform: scale(.2);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes slide-in-menu {

  0% {
    transform: translateX(-50px);
    opacity: 0;
  }

  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-bck-bottom {

  0% {
    transform: translateZ(700px) translateY(300px);
    opacity: 1;
  }

  100% {
    transform: translateZ(0) translateY(0);
    opacity: 1;
  }
}

@keyframes focus-in-contract {

  0% {
    letter-spacing: 1em;
    filter: blur(12px);
    opacity: 0;
  }

  100% {
    filter: blur(0);
    opacity: 1;
  }
}

@keyframes focus-in-expand-top {

  0% {
    letter-spacing: -.5em;
    transform: translateY(-300px);
    filter: blur(12px);
    opacity: 0;
  }

  0% {
    transform: translateY(0);
    filter: blur(0);
    opacity: 1;
  }
}

@keyframes text-focus-in {

  0% {
    filter: blur(12px);
    opacity: 0;
  }

  100% {
    filter: blur(0);
    opacity: 1;
  }
}

@keyframes slide-in-bck-top {

  0% {
    transform: translateZ(700px) translateY(-300px);
    opacity: 0;
  }

  100% {
    transform: translateZ(0) translateY(0);
    opacity: 1;
  }
}

@keyframes slit-in-horizontal {

  0% {
    transform: translateZ(-800px) rotateX(90deg);
    opacity: 0;
  }

  50% {
    transform: translateZ(-160px) rotateX(87deg);
    opacity: 1;
  }

  100% {
    transform: translateZ(0) rotateX(0);
  }
}