.fade-in-bottom {
	-webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
	        animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
}
.puff-out-center {
	-webkit-animation: puff-out-center 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) both !important;
	        animation: puff-out-center 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) both !important;
}
.fade-in-bottom-reverse {
	-webkit-animation: fade-in-bottom 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both !important;
	        animation: fade-in-bottom 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both !important;
}
.fade-out-bottom {
	-webkit-animation: fade-out-bottom 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
	        animation: fade-out-bottom 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
}
.fade-in-reverse {
	-webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both !important;
	        animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both !important;
}
.fade-in {
	-webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
	        animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
}

.scale-out-center {
	-webkit-animation: scale-out-center 0.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
	        animation: scale-out-center 0.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
}
.slide-out-fwd-center {
	-webkit-animation: slide-out-fwd-center 0.3s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
	        animation: slide-out-fwd-center 0.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
}
.text-blur-out {
	-webkit-animation: text-blur-out 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
	        animation: text-blur-out 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
}
.tracking-in-expand {
	-webkit-animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both !important;
	        animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both !important;
}
.scale-in-center {
	-webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
	        animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
}

.text-focus-in {
	-webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
.fade-out {
	-webkit-animation: fade-out 1s ease-out both !important;
	        animation: fade-out 1s ease-out both !important;
}

.page-change {
  -webkit-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
}
@-webkit-keyframes fade-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
}
@keyframes fade-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
}

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

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

@-webkit-keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: translateZ(1);
            transform: translateZ(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
}
@keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: translateZ(1);
            transform: translateZ(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
}
@-webkit-keyframes scale-out-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
}
@keyframes scale-out-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
}


@-webkit-keyframes text-blur-out {
  0% {
    -webkit-filter: blur(0.01);
            filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
            filter: blur(12px) opacity(0%);
  }
}
@keyframes text-blur-out {
  0% {
    -webkit-filter: blur(0.01);
            filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
            filter: blur(12px) opacity(0%);
  }
}

@-webkit-keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}
@keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}

@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes tracking-in-expand {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes tracking-in-expand {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}


@-webkit-keyframes animate-in-upwards {
  0% {
    opacity: 0;
    transform: translateY(15%) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
@keyframes animate-in-upwards {
  0% {
    opacity: 0;
    transform: translateY(15%) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
[data-beat-topper] {
  -webkit-animation: animate-in-upwards 0.35s ease-in-out 1 forwards;
  animation: animate-in-upwards 0.35s ease-in-out 1 forwards;
  transform: scale(1.1) translateY(15%);
  will-change: transform, opacity;
}
@-webkit-keyframes animate-in-downwards {
  0% {
    opacity: 0;
    transform: translate(-1%, -10%) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
@keyframes animate-in-downwards {
  0% {
    opacity: 0;
    transform: translate(-1%, -10%) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
@-webkit-keyframes animate-in-jumping-downwards {
  0% {
    opacity: 0;
    transform: translate(-1%, -10%) scale(1.1);
  }
  30% {
    transform: translateY(3%) scale(1.05);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
@keyframes animate-in-jumping-downwards {
  0% {
    opacity: 0;
    transform: translate(-1%, -10%) scale(1.1);
  }
  30% {
    transform: translateY(3%) scale(1.05);
  }
  to {
    opacity: 1;
    transform: translate(0) scale(1);
  }
}
@-webkit-keyframes fade-in-from-left {
  0% {
    opacity: 0;
    transform: translate(25%);
  }
  to {
    opacity: 1;
    transform: translate(0);
  }
}
@keyframes fade-in-from-left {
  0% {
    opacity: 0;
    transform: translate(-25%);
  }
  to {
    opacity: 1;
    transform: translate(0);
  }
}
@-webkit-keyframes animate-in-via-flipscaling {
  0% {
    opacity: 0;
    transform: translateY(-5%) rotateX(20deg) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) rotateX(0) scale(1);
  }
}
@keyframes animate-in-via-flipscaling {
  0% {
    opacity: 0;
    transform: translateY(-5%) rotateX(20deg) scale(1.1);
  }
  to {
    opacity: 1;
    transform: translate(0) rotateX(0) scale(1);
  }
}

[data-beat-topper] {
  -webkit-animation-timing-function: cubic-bezier(0.3, 0.7, 0.4, 1);
  animation-timing-function: cubic-bezier(0.3, 0.7, 0.4, 1);
  opacity: 0;
  perspective: 3000px;
}

[data-beat='0'] {
  -webkit-animation-delay: 0s !important;
  animation-delay: 0s !important;
}
[data-beat='1'] {
  -webkit-animation-delay: 0.15s !important;
  animation-delay: 0.15s !important;
}
[data-beat='2'] {
  -webkit-animation-delay: 0.3s !important;
  animation-delay: 0.3s !important;
}
[data-beat='3'] {
  -webkit-animation-delay: 0.45s !important;
  animation-delay: 0.45s !important;
}
[data-beat='4'] {
  -webkit-animation-delay: 0.6s !important;
  animation-delay: 0.6s !important;
}
[data-beat='5'] {
  -webkit-animation-delay: 0.75s !important;
  animation-delay: 0.75s !important;
}
[data-beat='6'] {
  -webkit-animation-delay: 0.9s !important;
  animation-delay: 0.9s !important;
}
[data-beat='7'] {
  -webkit-animation-delay: 1.05s !important;
  animation-delay: 1.05s !important;
}
[data-animate-children] > div {
  opacity: 0;
}

.move-right-animate {
  transition: transform 0.35s cubic-bezier(0.3, 0.76, 0.47, 1.15);
}

.move-right-animate:hover {
  transform: translateX(4px);
}