diff --git a/css/libs/animate.min.css b/css/libs/animate.min.css new file mode 100644 index 0000000..0c8ee97 --- /dev/null +++ b/css/libs/animate.min.css @@ -0,0 +1,4385 @@ +@charset "UTF-8"; + +/*! + * animate.css - https://animate.style/ + * Version - 4.1.1 + * Licensed under the MIT license - http://opensource.org/licenses/MIT + * + * Copyright (c) 2020 Animate.css + */ +:root { + --animate-duration: 1s; + --animate-delay: 1s; + --animate-repeat: 1 +} + +.animate__animated { + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-duration: var(--animate-duration); + animation-duration: var(--animate-duration); + -webkit-animation-fill-mode: both; + animation-fill-mode: both +} + +.animate__animated.animate__infinite { + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite +} + +.animate__animated.animate__repeat-1 { + -webkit-animation-iteration-count: 1; + animation-iteration-count: 1; + -webkit-animation-iteration-count: var(--animate-repeat); + animation-iteration-count: var(--animate-repeat) +} + +.animate__animated.animate__repeat-2 { + -webkit-animation-iteration-count: 2; + animation-iteration-count: 2; + -webkit-animation-iteration-count: calc(var(--animate-repeat)*2); + animation-iteration-count: calc(var(--animate-repeat)*2) +} + +.animate__animated.animate__repeat-3 { + -webkit-animation-iteration-count: 3; + animation-iteration-count: 3; + -webkit-animation-iteration-count: calc(var(--animate-repeat)*3); + animation-iteration-count: calc(var(--animate-repeat)*3) +} + +.animate__animated.animate__delay-1s { + -webkit-animation-delay: 1s; + animation-delay: 1s; + -webkit-animation-delay: var(--animate-delay); + animation-delay: var(--animate-delay) +} + +.animate__animated.animate__delay-2s { + -webkit-animation-delay: 2s; + animation-delay: 2s; + -webkit-animation-delay: calc(var(--animate-delay)*2); + animation-delay: calc(var(--animate-delay)*2) +} + +.animate__animated.animate__delay-3s { + -webkit-animation-delay: 3s; + animation-delay: 3s; + -webkit-animation-delay: calc(var(--animate-delay)*3); + animation-delay: calc(var(--animate-delay)*3) +} + +.animate__animated.animate__delay-4s { + -webkit-animation-delay: 4s; + animation-delay: 4s; + -webkit-animation-delay: calc(var(--animate-delay)*4); + animation-delay: calc(var(--animate-delay)*4) +} + +.animate__animated.animate__delay-5s { + -webkit-animation-delay: 5s; + animation-delay: 5s; + -webkit-animation-delay: calc(var(--animate-delay)*5); + animation-delay: calc(var(--animate-delay)*5) +} + +.animate__animated.animate__faster { + -webkit-animation-duration: .5s; + animation-duration: .5s; + -webkit-animation-duration: calc(var(--animate-duration)/2); + animation-duration: calc(var(--animate-duration)/2) +} + +.animate__animated.animate__fast { + -webkit-animation-duration: .8s; + animation-duration: .8s; + -webkit-animation-duration: calc(var(--animate-duration)*0.8); + animation-duration: calc(var(--animate-duration)*0.8) +} + +.animate__animated.animate__slow { + -webkit-animation-duration: 2s; + animation-duration: 2s; + -webkit-animation-duration: calc(var(--animate-duration)*2); + animation-duration: calc(var(--animate-duration)*2) +} + +.animate__animated.animate__slower { + -webkit-animation-duration: 3s; + animation-duration: 3s; + -webkit-animation-duration: calc(var(--animate-duration)*3); + animation-duration: calc(var(--animate-duration)*3) +} + +@media (prefers-reduced-motion:reduce), +print { + .animate__animated { + -webkit-animation-duration: 1ms !important; + animation-duration: 1ms !important; + -webkit-transition-duration: 1ms !important; + transition-duration: 1ms !important; + -webkit-animation-iteration-count: 1 !important; + animation-iteration-count: 1 !important + } + + .animate__animated[class*=Out] { + opacity: 0 + } +} + +@-webkit-keyframes bounce { + + 0%, + 20%, + 53%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1); + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 40%, + 43% { + -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06); + animation-timing-function: cubic-bezier(.755, .05, .855, .06); + -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1); + transform: translate3d(0, -30px, 0) scaleY(1.1) + } + + 70% { + -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06); + animation-timing-function: cubic-bezier(.755, .05, .855, .06); + -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05); + transform: translate3d(0, -15px, 0) scaleY(1.05) + } + + 80% { + -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1); + transition-timing-function: cubic-bezier(.215, .61, .355, 1); + -webkit-transform: translateZ(0) scaleY(.95); + transform: translateZ(0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02); + transform: translate3d(0, -4px, 0) scaleY(1.02) + } +} + +@keyframes bounce { + + 0%, + 20%, + 53%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1); + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 40%, + 43% { + -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06); + animation-timing-function: cubic-bezier(.755, .05, .855, .06); + -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1); + transform: translate3d(0, -30px, 0) scaleY(1.1) + } + + 70% { + -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06); + animation-timing-function: cubic-bezier(.755, .05, .855, .06); + -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05); + transform: translate3d(0, -15px, 0) scaleY(1.05) + } + + 80% { + -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1); + transition-timing-function: cubic-bezier(.215, .61, .355, 1); + -webkit-transform: translateZ(0) scaleY(.95); + transform: translateZ(0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02); + transform: translate3d(0, -4px, 0) scaleY(1.02) + } +} + +.animate__bounce { + -webkit-animation-name: bounce; + animation-name: bounce; + -webkit-transform-origin: center bottom; + transform-origin: center bottom +} + +@-webkit-keyframes flash { + + 0%, + 50%, + to { + opacity: 1 + } + + 25%, + 75% { + opacity: 0 + } +} + +@keyframes flash { + + 0%, + 50%, + to { + opacity: 1 + } + + 25%, + 75% { + opacity: 0 + } +} + +.animate__flash { + -webkit-animation-name: flash; + animation-name: flash +} + +@-webkit-keyframes pulse { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 50% { + -webkit-transform: scale3d(1.05, 1.05, 1.05); + transform: scale3d(1.05, 1.05, 1.05) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +@keyframes pulse { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 50% { + -webkit-transform: scale3d(1.05, 1.05, 1.05); + transform: scale3d(1.05, 1.05, 1.05) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +.animate__pulse { + -webkit-animation-name: pulse; + animation-name: pulse; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out +} + +@-webkit-keyframes rubberBand { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 30% { + -webkit-transform: scale3d(1.25, .75, 1); + transform: scale3d(1.25, .75, 1) + } + + 40% { + -webkit-transform: scale3d(.75, 1.25, 1); + transform: scale3d(.75, 1.25, 1) + } + + 50% { + -webkit-transform: scale3d(1.15, .85, 1); + transform: scale3d(1.15, .85, 1) + } + + 65% { + -webkit-transform: scale3d(.95, 1.05, 1); + transform: scale3d(.95, 1.05, 1) + } + + 75% { + -webkit-transform: scale3d(1.05, .95, 1); + transform: scale3d(1.05, .95, 1) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +@keyframes rubberBand { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 30% { + -webkit-transform: scale3d(1.25, .75, 1); + transform: scale3d(1.25, .75, 1) + } + + 40% { + -webkit-transform: scale3d(.75, 1.25, 1); + transform: scale3d(.75, 1.25, 1) + } + + 50% { + -webkit-transform: scale3d(1.15, .85, 1); + transform: scale3d(1.15, .85, 1) + } + + 65% { + -webkit-transform: scale3d(.95, 1.05, 1); + transform: scale3d(.95, 1.05, 1) + } + + 75% { + -webkit-transform: scale3d(1.05, .95, 1); + transform: scale3d(1.05, .95, 1) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +.animate__rubberBand { + -webkit-animation-name: rubberBand; + animation-name: rubberBand +} + +@-webkit-keyframes shakeX { + + 0%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 10%, + 30%, + 50%, + 70%, + 90% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0) + } + + 20%, + 40%, + 60%, + 80% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0) + } +} + +@keyframes shakeX { + + 0%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 10%, + 30%, + 50%, + 70%, + 90% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0) + } + + 20%, + 40%, + 60%, + 80% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0) + } +} + +.animate__shakeX { + -webkit-animation-name: shakeX; + animation-name: shakeX +} + +@-webkit-keyframes shakeY { + + 0%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 10%, + 30%, + 50%, + 70%, + 90% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0) + } + + 20%, + 40%, + 60%, + 80% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0) + } +} + +@keyframes shakeY { + + 0%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 10%, + 30%, + 50%, + 70%, + 90% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0) + } + + 20%, + 40%, + 60%, + 80% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0) + } +} + +.animate__shakeY { + -webkit-animation-name: shakeY; + animation-name: shakeY +} + +@-webkit-keyframes headShake { + 0% { + -webkit-transform: translateX(0); + transform: translateX(0) + } + + 6.5% { + -webkit-transform: translateX(-6px) rotateY(-9deg); + transform: translateX(-6px) rotateY(-9deg) + } + + 18.5% { + -webkit-transform: translateX(5px) rotateY(7deg); + transform: translateX(5px) rotateY(7deg) + } + + 31.5% { + -webkit-transform: translateX(-3px) rotateY(-5deg); + transform: translateX(-3px) rotateY(-5deg) + } + + 43.5% { + -webkit-transform: translateX(2px) rotateY(3deg); + transform: translateX(2px) rotateY(3deg) + } + + 50% { + -webkit-transform: translateX(0); + transform: translateX(0) + } +} + +@keyframes headShake { + 0% { + -webkit-transform: translateX(0); + transform: translateX(0) + } + + 6.5% { + -webkit-transform: translateX(-6px) rotateY(-9deg); + transform: translateX(-6px) rotateY(-9deg) + } + + 18.5% { + -webkit-transform: translateX(5px) rotateY(7deg); + transform: translateX(5px) rotateY(7deg) + } + + 31.5% { + -webkit-transform: translateX(-3px) rotateY(-5deg); + transform: translateX(-3px) rotateY(-5deg) + } + + 43.5% { + -webkit-transform: translateX(2px) rotateY(3deg); + transform: translateX(2px) rotateY(3deg) + } + + 50% { + -webkit-transform: translateX(0); + transform: translateX(0) + } +} + +.animate__headShake { + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-name: headShake; + animation-name: headShake +} + +@-webkit-keyframes swing { + 20% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg) + } + + 40% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg) + } + + 60% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg) + } + + 80% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg) + } + + to { + -webkit-transform: rotate(0deg); + transform: rotate(0deg) + } +} + +@keyframes swing { + 20% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg) + } + + 40% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg) + } + + 60% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg) + } + + 80% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg) + } + + to { + -webkit-transform: rotate(0deg); + transform: rotate(0deg) + } +} + +.animate__swing { + -webkit-transform-origin: top center; + transform-origin: top center; + -webkit-animation-name: swing; + animation-name: swing +} + +@-webkit-keyframes tada { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 10%, + 20% { + -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg); + transform: scale3d(.9, .9, .9) rotate(-3deg) + } + + 30%, + 50%, + 70%, + 90% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate(3deg) + } + + 40%, + 60%, + 80% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +@keyframes tada { + 0% { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } + + 10%, + 20% { + -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg); + transform: scale3d(.9, .9, .9) rotate(-3deg) + } + + 30%, + 50%, + 70%, + 90% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate(3deg) + } + + 40%, + 60%, + 80% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg) + } + + to { + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +.animate__tada { + -webkit-animation-name: tada; + animation-name: tada +} + +@-webkit-keyframes wobble { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 15% { + -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); + transform: translate3d(-25%, 0, 0) rotate(-5deg) + } + + 30% { + -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); + transform: translate3d(20%, 0, 0) rotate(3deg) + } + + 45% { + -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); + transform: translate3d(-15%, 0, 0) rotate(-3deg) + } + + 60% { + -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); + transform: translate3d(10%, 0, 0) rotate(2deg) + } + + 75% { + -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); + transform: translate3d(-5%, 0, 0) rotate(-1deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes wobble { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 15% { + -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); + transform: translate3d(-25%, 0, 0) rotate(-5deg) + } + + 30% { + -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); + transform: translate3d(20%, 0, 0) rotate(3deg) + } + + 45% { + -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); + transform: translate3d(-15%, 0, 0) rotate(-3deg) + } + + 60% { + -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); + transform: translate3d(10%, 0, 0) rotate(2deg) + } + + 75% { + -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); + transform: translate3d(-5%, 0, 0) rotate(-1deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__wobble { + -webkit-animation-name: wobble; + animation-name: wobble +} + +@-webkit-keyframes jello { + + 0%, + 11.1%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 22.2% { + -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); + transform: skewX(-12.5deg) skewY(-12.5deg) + } + + 33.3% { + -webkit-transform: skewX(6.25deg) skewY(6.25deg); + transform: skewX(6.25deg) skewY(6.25deg) + } + + 44.4% { + -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); + transform: skewX(-3.125deg) skewY(-3.125deg) + } + + 55.5% { + -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); + transform: skewX(1.5625deg) skewY(1.5625deg) + } + + 66.6% { + -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); + transform: skewX(-.78125deg) skewY(-.78125deg) + } + + 77.7% { + -webkit-transform: skewX(.390625deg) skewY(.390625deg); + transform: skewX(.390625deg) skewY(.390625deg) + } + + 88.8% { + -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); + transform: skewX(-.1953125deg) skewY(-.1953125deg) + } +} + +@keyframes jello { + + 0%, + 11.1%, + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + 22.2% { + -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); + transform: skewX(-12.5deg) skewY(-12.5deg) + } + + 33.3% { + -webkit-transform: skewX(6.25deg) skewY(6.25deg); + transform: skewX(6.25deg) skewY(6.25deg) + } + + 44.4% { + -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); + transform: skewX(-3.125deg) skewY(-3.125deg) + } + + 55.5% { + -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); + transform: skewX(1.5625deg) skewY(1.5625deg) + } + + 66.6% { + -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); + transform: skewX(-.78125deg) skewY(-.78125deg) + } + + 77.7% { + -webkit-transform: skewX(.390625deg) skewY(.390625deg); + transform: skewX(.390625deg) skewY(.390625deg) + } + + 88.8% { + -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); + transform: skewX(-.1953125deg) skewY(-.1953125deg) + } +} + +.animate__jello { + -webkit-animation-name: jello; + animation-name: jello; + -webkit-transform-origin: center; + transform-origin: center +} + +@-webkit-keyframes heartBeat { + 0% { + -webkit-transform: scale(1); + transform: scale(1) + } + + 14% { + -webkit-transform: scale(1.3); + transform: scale(1.3) + } + + 28% { + -webkit-transform: scale(1); + transform: scale(1) + } + + 42% { + -webkit-transform: scale(1.3); + transform: scale(1.3) + } + + 70% { + -webkit-transform: scale(1); + transform: scale(1) + } +} + +@keyframes heartBeat { + 0% { + -webkit-transform: scale(1); + transform: scale(1) + } + + 14% { + -webkit-transform: scale(1.3); + transform: scale(1.3) + } + + 28% { + -webkit-transform: scale(1); + transform: scale(1) + } + + 42% { + -webkit-transform: scale(1.3); + transform: scale(1.3) + } + + 70% { + -webkit-transform: scale(1); + transform: scale(1) + } +} + +.animate__heartBeat { + -webkit-animation-name: heartBeat; + animation-name: heartBeat; + -webkit-animation-duration: 1.3s; + animation-duration: 1.3s; + -webkit-animation-duration: calc(var(--animate-duration)*1.3); + animation-duration: calc(var(--animate-duration)*1.3); + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out +} + +@-webkit-keyframes backInDown { + 0% { + -webkit-transform: translateY(-1200px) scale(.7); + transform: translateY(-1200px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +@keyframes backInDown { + 0% { + -webkit-transform: translateY(-1200px) scale(.7); + transform: translateY(-1200px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +.animate__backInDown { + -webkit-animation-name: backInDown; + animation-name: backInDown +} + +@-webkit-keyframes backInLeft { + 0% { + -webkit-transform: translateX(-2000px) scale(.7); + transform: translateX(-2000px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +@keyframes backInLeft { + 0% { + -webkit-transform: translateX(-2000px) scale(.7); + transform: translateX(-2000px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +.animate__backInLeft { + -webkit-animation-name: backInLeft; + animation-name: backInLeft +} + +@-webkit-keyframes backInRight { + 0% { + -webkit-transform: translateX(2000px) scale(.7); + transform: translateX(2000px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +@keyframes backInRight { + 0% { + -webkit-transform: translateX(2000px) scale(.7); + transform: translateX(2000px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +.animate__backInRight { + -webkit-animation-name: backInRight; + animation-name: backInRight +} + +@-webkit-keyframes backInUp { + 0% { + -webkit-transform: translateY(1200px) scale(.7); + transform: translateY(1200px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +@keyframes backInUp { + 0% { + -webkit-transform: translateY(1200px) scale(.7); + transform: translateY(1200px) scale(.7); + opacity: .7 + } + + 80% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } +} + +.animate__backInUp { + -webkit-animation-name: backInUp; + animation-name: backInUp +} + +@-webkit-keyframes backOutDown { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateY(700px) scale(.7); + transform: translateY(700px) scale(.7); + opacity: .7 + } +} + +@keyframes backOutDown { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateY(700px) scale(.7); + transform: translateY(700px) scale(.7); + opacity: .7 + } +} + +.animate__backOutDown { + -webkit-animation-name: backOutDown; + animation-name: backOutDown +} + +@-webkit-keyframes backOutLeft { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateX(-2000px) scale(.7); + transform: translateX(-2000px) scale(.7); + opacity: .7 + } +} + +@keyframes backOutLeft { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateX(-2000px) scale(.7); + transform: translateX(-2000px) scale(.7); + opacity: .7 + } +} + +.animate__backOutLeft { + -webkit-animation-name: backOutLeft; + animation-name: backOutLeft +} + +@-webkit-keyframes backOutRight { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateX(2000px) scale(.7); + transform: translateX(2000px) scale(.7); + opacity: .7 + } +} + +@keyframes backOutRight { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateX(0) scale(.7); + transform: translateX(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateX(2000px) scale(.7); + transform: translateX(2000px) scale(.7); + opacity: .7 + } +} + +.animate__backOutRight { + -webkit-animation-name: backOutRight; + animation-name: backOutRight +} + +@-webkit-keyframes backOutUp { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateY(-700px) scale(.7); + transform: translateY(-700px) scale(.7); + opacity: .7 + } +} + +@keyframes backOutUp { + 0% { + -webkit-transform: scale(1); + transform: scale(1); + opacity: 1 + } + + 20% { + -webkit-transform: translateY(0) scale(.7); + transform: translateY(0) scale(.7); + opacity: .7 + } + + to { + -webkit-transform: translateY(-700px) scale(.7); + transform: translateY(-700px) scale(.7); + opacity: .7 + } +} + +.animate__backOutUp { + -webkit-animation-name: backOutUp; + animation-name: backOutUp +} + +@-webkit-keyframes bounceIn { + + 0%, + 20%, + 40%, + 60%, + 80%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + 20% { + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1) + } + + 40% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(1.03, 1.03, 1.03); + transform: scale3d(1.03, 1.03, 1.03) + } + + 80% { + -webkit-transform: scale3d(.97, .97, .97); + transform: scale3d(.97, .97, .97) + } + + to { + opacity: 1; + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +@keyframes bounceIn { + + 0%, + 20%, + 40%, + 60%, + 80%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + 20% { + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1) + } + + 40% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(1.03, 1.03, 1.03); + transform: scale3d(1.03, 1.03, 1.03) + } + + 80% { + -webkit-transform: scale3d(.97, .97, .97); + transform: scale3d(.97, .97, .97) + } + + to { + opacity: 1; + -webkit-transform: scaleX(1); + transform: scaleX(1) + } +} + +.animate__bounceIn { + -webkit-animation-duration: .75s; + animation-duration: .75s; + -webkit-animation-duration: calc(var(--animate-duration)*0.75); + animation-duration: calc(var(--animate-duration)*0.75); + -webkit-animation-name: bounceIn; + animation-name: bounceIn +} + +@-webkit-keyframes bounceInDown { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -3000px, 0) scaleY(3); + transform: translate3d(0, -3000px, 0) scaleY(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, 25px, 0) scaleY(.9); + transform: translate3d(0, 25px, 0) scaleY(.9) + } + + 75% { + -webkit-transform: translate3d(0, -10px, 0) scaleY(.95); + transform: translate3d(0, -10px, 0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, 5px, 0) scaleY(.985); + transform: translate3d(0, 5px, 0) scaleY(.985) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes bounceInDown { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -3000px, 0) scaleY(3); + transform: translate3d(0, -3000px, 0) scaleY(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, 25px, 0) scaleY(.9); + transform: translate3d(0, 25px, 0) scaleY(.9) + } + + 75% { + -webkit-transform: translate3d(0, -10px, 0) scaleY(.95); + transform: translate3d(0, -10px, 0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, 5px, 0) scaleY(.985); + transform: translate3d(0, 5px, 0) scaleY(.985) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__bounceInDown { + -webkit-animation-name: bounceInDown; + animation-name: bounceInDown +} + +@-webkit-keyframes bounceInLeft { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3); + transform: translate3d(-3000px, 0, 0) scaleX(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(25px, 0, 0) scaleX(1); + transform: translate3d(25px, 0, 0) scaleX(1) + } + + 75% { + -webkit-transform: translate3d(-10px, 0, 0) scaleX(.98); + transform: translate3d(-10px, 0, 0) scaleX(.98) + } + + 90% { + -webkit-transform: translate3d(5px, 0, 0) scaleX(.995); + transform: translate3d(5px, 0, 0) scaleX(.995) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes bounceInLeft { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3); + transform: translate3d(-3000px, 0, 0) scaleX(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(25px, 0, 0) scaleX(1); + transform: translate3d(25px, 0, 0) scaleX(1) + } + + 75% { + -webkit-transform: translate3d(-10px, 0, 0) scaleX(.98); + transform: translate3d(-10px, 0, 0) scaleX(.98) + } + + 90% { + -webkit-transform: translate3d(5px, 0, 0) scaleX(.995); + transform: translate3d(5px, 0, 0) scaleX(.995) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__bounceInLeft { + -webkit-animation-name: bounceInLeft; + animation-name: bounceInLeft +} + +@-webkit-keyframes bounceInRight { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(3000px, 0, 0) scaleX(3); + transform: translate3d(3000px, 0, 0) scaleX(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(-25px, 0, 0) scaleX(1); + transform: translate3d(-25px, 0, 0) scaleX(1) + } + + 75% { + -webkit-transform: translate3d(10px, 0, 0) scaleX(.98); + transform: translate3d(10px, 0, 0) scaleX(.98) + } + + 90% { + -webkit-transform: translate3d(-5px, 0, 0) scaleX(.995); + transform: translate3d(-5px, 0, 0) scaleX(.995) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes bounceInRight { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(3000px, 0, 0) scaleX(3); + transform: translate3d(3000px, 0, 0) scaleX(3) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(-25px, 0, 0) scaleX(1); + transform: translate3d(-25px, 0, 0) scaleX(1) + } + + 75% { + -webkit-transform: translate3d(10px, 0, 0) scaleX(.98); + transform: translate3d(10px, 0, 0) scaleX(.98) + } + + 90% { + -webkit-transform: translate3d(-5px, 0, 0) scaleX(.995); + transform: translate3d(-5px, 0, 0) scaleX(.995) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__bounceInRight { + -webkit-animation-name: bounceInRight; + animation-name: bounceInRight +} + +@-webkit-keyframes bounceInUp { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 3000px, 0) scaleY(5); + transform: translate3d(0, 3000px, 0) scaleY(5) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0) scaleY(.9); + transform: translate3d(0, -20px, 0) scaleY(.9) + } + + 75% { + -webkit-transform: translate3d(0, 10px, 0) scaleY(.95); + transform: translate3d(0, 10px, 0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, -5px, 0) scaleY(.985); + transform: translate3d(0, -5px, 0) scaleY(.985) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes bounceInUp { + + 0%, + 60%, + 75%, + 90%, + to { + -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1); + animation-timing-function: cubic-bezier(.215, .61, .355, 1) + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 3000px, 0) scaleY(5); + transform: translate3d(0, 3000px, 0) scaleY(5) + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0) scaleY(.9); + transform: translate3d(0, -20px, 0) scaleY(.9) + } + + 75% { + -webkit-transform: translate3d(0, 10px, 0) scaleY(.95); + transform: translate3d(0, 10px, 0) scaleY(.95) + } + + 90% { + -webkit-transform: translate3d(0, -5px, 0) scaleY(.985); + transform: translate3d(0, -5px, 0) scaleY(.985) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__bounceInUp { + -webkit-animation-name: bounceInUp; + animation-name: bounceInUp +} + +@-webkit-keyframes bounceOut { + 20% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9) + } + + 50%, + 55% { + opacity: 1; + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } +} + +@keyframes bounceOut { + 20% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9) + } + + 50%, + 55% { + opacity: 1; + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } +} + +.animate__bounceOut { + -webkit-animation-duration: .75s; + animation-duration: .75s; + -webkit-animation-duration: calc(var(--animate-duration)*0.75); + animation-duration: calc(var(--animate-duration)*0.75); + -webkit-animation-name: bounceOut; + animation-name: bounceOut +} + +@-webkit-keyframes bounceOutDown { + 20% { + -webkit-transform: translate3d(0, 10px, 0) scaleY(.985); + transform: translate3d(0, 10px, 0) scaleY(.985) + } + + 40%, + 45% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0) scaleY(.9); + transform: translate3d(0, -20px, 0) scaleY(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0) scaleY(3); + transform: translate3d(0, 2000px, 0) scaleY(3) + } +} + +@keyframes bounceOutDown { + 20% { + -webkit-transform: translate3d(0, 10px, 0) scaleY(.985); + transform: translate3d(0, 10px, 0) scaleY(.985) + } + + 40%, + 45% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0) scaleY(.9); + transform: translate3d(0, -20px, 0) scaleY(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0) scaleY(3); + transform: translate3d(0, 2000px, 0) scaleY(3) + } +} + +.animate__bounceOutDown { + -webkit-animation-name: bounceOutDown; + animation-name: bounceOutDown +} + +@-webkit-keyframes bounceOutLeft { + 20% { + opacity: 1; + -webkit-transform: translate3d(20px, 0, 0) scaleX(.9); + transform: translate3d(20px, 0, 0) scaleX(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2); + transform: translate3d(-2000px, 0, 0) scaleX(2) + } +} + +@keyframes bounceOutLeft { + 20% { + opacity: 1; + -webkit-transform: translate3d(20px, 0, 0) scaleX(.9); + transform: translate3d(20px, 0, 0) scaleX(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2); + transform: translate3d(-2000px, 0, 0) scaleX(2) + } +} + +.animate__bounceOutLeft { + -webkit-animation-name: bounceOutLeft; + animation-name: bounceOutLeft +} + +@-webkit-keyframes bounceOutRight { + 20% { + opacity: 1; + -webkit-transform: translate3d(-20px, 0, 0) scaleX(.9); + transform: translate3d(-20px, 0, 0) scaleX(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0) scaleX(2); + transform: translate3d(2000px, 0, 0) scaleX(2) + } +} + +@keyframes bounceOutRight { + 20% { + opacity: 1; + -webkit-transform: translate3d(-20px, 0, 0) scaleX(.9); + transform: translate3d(-20px, 0, 0) scaleX(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0) scaleX(2); + transform: translate3d(2000px, 0, 0) scaleX(2) + } +} + +.animate__bounceOutRight { + -webkit-animation-name: bounceOutRight; + animation-name: bounceOutRight +} + +@-webkit-keyframes bounceOutUp { + 20% { + -webkit-transform: translate3d(0, -10px, 0) scaleY(.985); + transform: translate3d(0, -10px, 0) scaleY(.985) + } + + 40%, + 45% { + opacity: 1; + -webkit-transform: translate3d(0, 20px, 0) scaleY(.9); + transform: translate3d(0, 20px, 0) scaleY(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0) scaleY(3); + transform: translate3d(0, -2000px, 0) scaleY(3) + } +} + +@keyframes bounceOutUp { + 20% { + -webkit-transform: translate3d(0, -10px, 0) scaleY(.985); + transform: translate3d(0, -10px, 0) scaleY(.985) + } + + 40%, + 45% { + opacity: 1; + -webkit-transform: translate3d(0, 20px, 0) scaleY(.9); + transform: translate3d(0, 20px, 0) scaleY(.9) + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0) scaleY(3); + transform: translate3d(0, -2000px, 0) scaleY(3) + } +} + +.animate__bounceOutUp { + -webkit-animation-name: bounceOutUp; + animation-name: bounceOutUp +} + +@-webkit-keyframes fadeIn { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +@keyframes fadeIn { + 0% { + opacity: 0 + } + + to { + opacity: 1 + } +} + +.animate__fadeIn { + -webkit-animation-name: fadeIn; + animation-name: fadeIn +} + +@-webkit-keyframes fadeInDown { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInDown { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInDown { + -webkit-animation-name: fadeInDown; + animation-name: fadeInDown +} + +@-webkit-keyframes fadeInDownBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInDownBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInDownBig { + -webkit-animation-name: fadeInDownBig; + animation-name: fadeInDownBig +} + +@-webkit-keyframes fadeInLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInLeft { + -webkit-animation-name: fadeInLeft; + animation-name: fadeInLeft +} + +@-webkit-keyframes fadeInLeftBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInLeftBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInLeftBig { + -webkit-animation-name: fadeInLeftBig; + animation-name: fadeInLeftBig +} + +@-webkit-keyframes fadeInRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInRight { + -webkit-animation-name: fadeInRight; + animation-name: fadeInRight +} + +@-webkit-keyframes fadeInRightBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInRightBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInRightBig { + -webkit-animation-name: fadeInRightBig; + animation-name: fadeInRightBig +} + +@-webkit-keyframes fadeInUp { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInUp { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInUp { + -webkit-animation-name: fadeInUp; + animation-name: fadeInUp +} + +@-webkit-keyframes fadeInUpBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInUpBig { + 0% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInUpBig { + -webkit-animation-name: fadeInUpBig; + animation-name: fadeInUpBig +} + +@-webkit-keyframes fadeInTopLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, -100%, 0); + transform: translate3d(-100%, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInTopLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, -100%, 0); + transform: translate3d(-100%, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInTopLeft { + -webkit-animation-name: fadeInTopLeft; + animation-name: fadeInTopLeft +} + +@-webkit-keyframes fadeInTopRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, -100%, 0); + transform: translate3d(100%, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInTopRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, -100%, 0); + transform: translate3d(100%, -100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInTopRight { + -webkit-animation-name: fadeInTopRight; + animation-name: fadeInTopRight +} + +@-webkit-keyframes fadeInBottomLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 100%, 0); + transform: translate3d(-100%, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInBottomLeft { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 100%, 0); + transform: translate3d(-100%, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInBottomLeft { + -webkit-animation-name: fadeInBottomLeft; + animation-name: fadeInBottomLeft +} + +@-webkit-keyframes fadeInBottomRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, 100%, 0); + transform: translate3d(100%, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes fadeInBottomRight { + 0% { + opacity: 0; + -webkit-transform: translate3d(100%, 100%, 0); + transform: translate3d(100%, 100%, 0) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__fadeInBottomRight { + -webkit-animation-name: fadeInBottomRight; + animation-name: fadeInBottomRight +} + +@-webkit-keyframes fadeOut { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +@keyframes fadeOut { + 0% { + opacity: 1 + } + + to { + opacity: 0 + } +} + +.animate__fadeOut { + -webkit-animation-name: fadeOut; + animation-name: fadeOut +} + +@-webkit-keyframes fadeOutDown { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } +} + +@keyframes fadeOutDown { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } +} + +.animate__fadeOutDown { + -webkit-animation-name: fadeOutDown; + animation-name: fadeOutDown +} + +@-webkit-keyframes fadeOutDownBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0) + } +} + +@keyframes fadeOutDownBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0) + } +} + +.animate__fadeOutDownBig { + -webkit-animation-name: fadeOutDownBig; + animation-name: fadeOutDownBig +} + +@-webkit-keyframes fadeOutLeft { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } +} + +@keyframes fadeOutLeft { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } +} + +.animate__fadeOutLeft { + -webkit-animation-name: fadeOutLeft; + animation-name: fadeOutLeft +} + +@-webkit-keyframes fadeOutLeftBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0) + } +} + +@keyframes fadeOutLeftBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0) + } +} + +.animate__fadeOutLeftBig { + -webkit-animation-name: fadeOutLeftBig; + animation-name: fadeOutLeftBig +} + +@-webkit-keyframes fadeOutRight { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } +} + +@keyframes fadeOutRight { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } +} + +.animate__fadeOutRight { + -webkit-animation-name: fadeOutRight; + animation-name: fadeOutRight +} + +@-webkit-keyframes fadeOutRightBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0) + } +} + +@keyframes fadeOutRightBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0) + } +} + +.animate__fadeOutRightBig { + -webkit-animation-name: fadeOutRightBig; + animation-name: fadeOutRightBig +} + +@-webkit-keyframes fadeOutUp { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } +} + +@keyframes fadeOutUp { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } +} + +.animate__fadeOutUp { + -webkit-animation-name: fadeOutUp; + animation-name: fadeOutUp +} + +@-webkit-keyframes fadeOutUpBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0) + } +} + +@keyframes fadeOutUpBig { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0) + } +} + +.animate__fadeOutUpBig { + -webkit-animation-name: fadeOutUpBig; + animation-name: fadeOutUpBig +} + +@-webkit-keyframes fadeOutTopLeft { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, -100%, 0); + transform: translate3d(-100%, -100%, 0) + } +} + +@keyframes fadeOutTopLeft { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, -100%, 0); + transform: translate3d(-100%, -100%, 0) + } +} + +.animate__fadeOutTopLeft { + -webkit-animation-name: fadeOutTopLeft; + animation-name: fadeOutTopLeft +} + +@-webkit-keyframes fadeOutTopRight { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, -100%, 0); + transform: translate3d(100%, -100%, 0) + } +} + +@keyframes fadeOutTopRight { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, -100%, 0); + transform: translate3d(100%, -100%, 0) + } +} + +.animate__fadeOutTopRight { + -webkit-animation-name: fadeOutTopRight; + animation-name: fadeOutTopRight +} + +@-webkit-keyframes fadeOutBottomRight { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 100%, 0); + transform: translate3d(100%, 100%, 0) + } +} + +@keyframes fadeOutBottomRight { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 100%, 0); + transform: translate3d(100%, 100%, 0) + } +} + +.animate__fadeOutBottomRight { + -webkit-animation-name: fadeOutBottomRight; + animation-name: fadeOutBottomRight +} + +@-webkit-keyframes fadeOutBottomLeft { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, 100%, 0); + transform: translate3d(-100%, 100%, 0) + } +} + +@keyframes fadeOutBottomLeft { + 0% { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + opacity: 0; + -webkit-transform: translate3d(-100%, 100%, 0); + transform: translate3d(-100%, 100%, 0) + } +} + +.animate__fadeOutBottomLeft { + -webkit-animation-name: fadeOutBottomLeft; + animation-name: fadeOutBottomLeft +} + +@-webkit-keyframes flip { + 0% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn); + transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out + } + + 40% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg); + transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out + } + + 50% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg); + transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 80% { + -webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg); + transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + to { + -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg); + transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } +} + +@keyframes flip { + 0% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn); + transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out + } + + 40% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg); + transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out + } + + 50% { + -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg); + transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 80% { + -webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg); + transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + to { + -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg); + transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } +} + +.animate__animated.animate__flip { + -webkit-backface-visibility: visible; + backface-visibility: visible; + -webkit-animation-name: flip; + animation-name: flip +} + +@-webkit-keyframes flipInX { + 0% { + -webkit-transform: perspective(400px) rotateX(90deg); + transform: perspective(400px) rotateX(90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0 + } + + 40% { + -webkit-transform: perspective(400px) rotateX(-20deg); + transform: perspective(400px) rotateX(-20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 60% { + -webkit-transform: perspective(400px) rotateX(10deg); + transform: perspective(400px) rotateX(10deg); + opacity: 1 + } + + 80% { + -webkit-transform: perspective(400px) rotateX(-5deg); + transform: perspective(400px) rotateX(-5deg) + } + + to { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } +} + +@keyframes flipInX { + 0% { + -webkit-transform: perspective(400px) rotateX(90deg); + transform: perspective(400px) rotateX(90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0 + } + + 40% { + -webkit-transform: perspective(400px) rotateX(-20deg); + transform: perspective(400px) rotateX(-20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 60% { + -webkit-transform: perspective(400px) rotateX(10deg); + transform: perspective(400px) rotateX(10deg); + opacity: 1 + } + + 80% { + -webkit-transform: perspective(400px) rotateX(-5deg); + transform: perspective(400px) rotateX(-5deg) + } + + to { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } +} + +.animate__flipInX { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipInX; + animation-name: flipInX +} + +@-webkit-keyframes flipInY { + 0% { + -webkit-transform: perspective(400px) rotateY(90deg); + transform: perspective(400px) rotateY(90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0 + } + + 40% { + -webkit-transform: perspective(400px) rotateY(-20deg); + transform: perspective(400px) rotateY(-20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 60% { + -webkit-transform: perspective(400px) rotateY(10deg); + transform: perspective(400px) rotateY(10deg); + opacity: 1 + } + + 80% { + -webkit-transform: perspective(400px) rotateY(-5deg); + transform: perspective(400px) rotateY(-5deg) + } + + to { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } +} + +@keyframes flipInY { + 0% { + -webkit-transform: perspective(400px) rotateY(90deg); + transform: perspective(400px) rotateY(90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0 + } + + 40% { + -webkit-transform: perspective(400px) rotateY(-20deg); + transform: perspective(400px) rotateY(-20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in + } + + 60% { + -webkit-transform: perspective(400px) rotateY(10deg); + transform: perspective(400px) rotateY(10deg); + opacity: 1 + } + + 80% { + -webkit-transform: perspective(400px) rotateY(-5deg); + transform: perspective(400px) rotateY(-5deg) + } + + to { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } +} + +.animate__flipInY { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipInY; + animation-name: flipInY +} + +@-webkit-keyframes flipOutX { + 0% { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } + + 30% { + -webkit-transform: perspective(400px) rotateX(-20deg); + transform: perspective(400px) rotateX(-20deg); + opacity: 1 + } + + to { + -webkit-transform: perspective(400px) rotateX(90deg); + transform: perspective(400px) rotateX(90deg); + opacity: 0 + } +} + +@keyframes flipOutX { + 0% { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } + + 30% { + -webkit-transform: perspective(400px) rotateX(-20deg); + transform: perspective(400px) rotateX(-20deg); + opacity: 1 + } + + to { + -webkit-transform: perspective(400px) rotateX(90deg); + transform: perspective(400px) rotateX(90deg); + opacity: 0 + } +} + +.animate__flipOutX { + -webkit-animation-duration: .75s; + animation-duration: .75s; + -webkit-animation-duration: calc(var(--animate-duration)*0.75); + animation-duration: calc(var(--animate-duration)*0.75); + -webkit-animation-name: flipOutX; + animation-name: flipOutX; + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important +} + +@-webkit-keyframes flipOutY { + 0% { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } + + 30% { + -webkit-transform: perspective(400px) rotateY(-15deg); + transform: perspective(400px) rotateY(-15deg); + opacity: 1 + } + + to { + -webkit-transform: perspective(400px) rotateY(90deg); + transform: perspective(400px) rotateY(90deg); + opacity: 0 + } +} + +@keyframes flipOutY { + 0% { + -webkit-transform: perspective(400px); + transform: perspective(400px) + } + + 30% { + -webkit-transform: perspective(400px) rotateY(-15deg); + transform: perspective(400px) rotateY(-15deg); + opacity: 1 + } + + to { + -webkit-transform: perspective(400px) rotateY(90deg); + transform: perspective(400px) rotateY(90deg); + opacity: 0 + } +} + +.animate__flipOutY { + -webkit-animation-duration: .75s; + animation-duration: .75s; + -webkit-animation-duration: calc(var(--animate-duration)*0.75); + animation-duration: calc(var(--animate-duration)*0.75); + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipOutY; + animation-name: flipOutY +} + +@-webkit-keyframes lightSpeedInRight { + 0% { + -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); + transform: translate3d(100%, 0, 0) skewX(-30deg); + opacity: 0 + } + + 60% { + -webkit-transform: skewX(20deg); + transform: skewX(20deg); + opacity: 1 + } + + 80% { + -webkit-transform: skewX(-5deg); + transform: skewX(-5deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes lightSpeedInRight { + 0% { + -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); + transform: translate3d(100%, 0, 0) skewX(-30deg); + opacity: 0 + } + + 60% { + -webkit-transform: skewX(20deg); + transform: skewX(20deg); + opacity: 1 + } + + 80% { + -webkit-transform: skewX(-5deg); + transform: skewX(-5deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__lightSpeedInRight { + -webkit-animation-name: lightSpeedInRight; + animation-name: lightSpeedInRight; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out +} + +@-webkit-keyframes lightSpeedInLeft { + 0% { + -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg); + transform: translate3d(-100%, 0, 0) skewX(30deg); + opacity: 0 + } + + 60% { + -webkit-transform: skewX(-20deg); + transform: skewX(-20deg); + opacity: 1 + } + + 80% { + -webkit-transform: skewX(5deg); + transform: skewX(5deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes lightSpeedInLeft { + 0% { + -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg); + transform: translate3d(-100%, 0, 0) skewX(30deg); + opacity: 0 + } + + 60% { + -webkit-transform: skewX(-20deg); + transform: skewX(-20deg); + opacity: 1 + } + + 80% { + -webkit-transform: skewX(5deg); + transform: skewX(5deg) + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__lightSpeedInLeft { + -webkit-animation-name: lightSpeedInLeft; + animation-name: lightSpeedInLeft; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out +} + +@-webkit-keyframes lightSpeedOutRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); + transform: translate3d(100%, 0, 0) skewX(30deg); + opacity: 0 + } +} + +@keyframes lightSpeedOutRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); + transform: translate3d(100%, 0, 0) skewX(30deg); + opacity: 0 + } +} + +.animate__lightSpeedOutRight { + -webkit-animation-name: lightSpeedOutRight; + animation-name: lightSpeedOutRight; + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in +} + +@-webkit-keyframes lightSpeedOutLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg); + transform: translate3d(-100%, 0, 0) skewX(-30deg); + opacity: 0 + } +} + +@keyframes lightSpeedOutLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg); + transform: translate3d(-100%, 0, 0) skewX(-30deg); + opacity: 0 + } +} + +.animate__lightSpeedOutLeft { + -webkit-animation-name: lightSpeedOutLeft; + animation-name: lightSpeedOutLeft; + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in +} + +@-webkit-keyframes rotateIn { + 0% { + -webkit-transform: rotate(-200deg); + transform: rotate(-200deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +@keyframes rotateIn { + 0% { + -webkit-transform: rotate(-200deg); + transform: rotate(-200deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +.animate__rotateIn { + -webkit-animation-name: rotateIn; + animation-name: rotateIn; + -webkit-transform-origin: center; + transform-origin: center +} + +@-webkit-keyframes rotateInDownLeft { + 0% { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +@keyframes rotateInDownLeft { + 0% { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +.animate__rotateInDownLeft { + -webkit-animation-name: rotateInDownLeft; + animation-name: rotateInDownLeft; + -webkit-transform-origin: left bottom; + transform-origin: left bottom +} + +@-webkit-keyframes rotateInDownRight { + 0% { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +@keyframes rotateInDownRight { + 0% { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +.animate__rotateInDownRight { + -webkit-animation-name: rotateInDownRight; + animation-name: rotateInDownRight; + -webkit-transform-origin: right bottom; + transform-origin: right bottom +} + +@-webkit-keyframes rotateInUpLeft { + 0% { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +@keyframes rotateInUpLeft { + 0% { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +.animate__rotateInUpLeft { + -webkit-animation-name: rotateInUpLeft; + animation-name: rotateInUpLeft; + -webkit-transform-origin: left bottom; + transform-origin: left bottom +} + +@-webkit-keyframes rotateInUpRight { + 0% { + -webkit-transform: rotate(-90deg); + transform: rotate(-90deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +@keyframes rotateInUpRight { + 0% { + -webkit-transform: rotate(-90deg); + transform: rotate(-90deg); + opacity: 0 + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0); + opacity: 1 + } +} + +.animate__rotateInUpRight { + -webkit-animation-name: rotateInUpRight; + animation-name: rotateInUpRight; + -webkit-transform-origin: right bottom; + transform-origin: right bottom +} + +@-webkit-keyframes rotateOut { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(200deg); + transform: rotate(200deg); + opacity: 0 + } +} + +@keyframes rotateOut { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(200deg); + transform: rotate(200deg); + opacity: 0 + } +} + +.animate__rotateOut { + -webkit-animation-name: rotateOut; + animation-name: rotateOut; + -webkit-transform-origin: center; + transform-origin: center +} + +@-webkit-keyframes rotateOutDownLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } +} + +@keyframes rotateOutDownLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + opacity: 0 + } +} + +.animate__rotateOutDownLeft { + -webkit-animation-name: rotateOutDownLeft; + animation-name: rotateOutDownLeft; + -webkit-transform-origin: left bottom; + transform-origin: left bottom +} + +@-webkit-keyframes rotateOutDownRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } +} + +@keyframes rotateOutDownRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } +} + +.animate__rotateOutDownRight { + -webkit-animation-name: rotateOutDownRight; + animation-name: rotateOutDownRight; + -webkit-transform-origin: right bottom; + transform-origin: right bottom +} + +@-webkit-keyframes rotateOutUpLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } +} + +@keyframes rotateOutUpLeft { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + opacity: 0 + } +} + +.animate__rotateOutUpLeft { + -webkit-animation-name: rotateOutUpLeft; + animation-name: rotateOutUpLeft; + -webkit-transform-origin: left bottom; + transform-origin: left bottom +} + +@-webkit-keyframes rotateOutUpRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(90deg); + transform: rotate(90deg); + opacity: 0 + } +} + +@keyframes rotateOutUpRight { + 0% { + opacity: 1 + } + + to { + -webkit-transform: rotate(90deg); + transform: rotate(90deg); + opacity: 0 + } +} + +.animate__rotateOutUpRight { + -webkit-animation-name: rotateOutUpRight; + animation-name: rotateOutUpRight; + -webkit-transform-origin: right bottom; + transform-origin: right bottom +} + +@-webkit-keyframes hinge { + 0% { + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out + } + + 20%, + 60% { + -webkit-transform: rotate(80deg); + transform: rotate(80deg); + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out + } + + 40%, + 80% { + -webkit-transform: rotate(60deg); + transform: rotate(60deg); + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + opacity: 1 + } + + to { + -webkit-transform: translate3d(0, 700px, 0); + transform: translate3d(0, 700px, 0); + opacity: 0 + } +} + +@keyframes hinge { + 0% { + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out + } + + 20%, + 60% { + -webkit-transform: rotate(80deg); + transform: rotate(80deg); + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out + } + + 40%, + 80% { + -webkit-transform: rotate(60deg); + transform: rotate(60deg); + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + opacity: 1 + } + + to { + -webkit-transform: translate3d(0, 700px, 0); + transform: translate3d(0, 700px, 0); + opacity: 0 + } +} + +.animate__hinge { + -webkit-animation-duration: 2s; + animation-duration: 2s; + -webkit-animation-duration: calc(var(--animate-duration)*2); + animation-duration: calc(var(--animate-duration)*2); + -webkit-animation-name: hinge; + animation-name: hinge; + -webkit-transform-origin: top left; + transform-origin: top left +} + +@-webkit-keyframes jackInTheBox { + 0% { + opacity: 0; + -webkit-transform: scale(.1) rotate(30deg); + transform: scale(.1) rotate(30deg); + -webkit-transform-origin: center bottom; + transform-origin: center bottom + } + + 50% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg) + } + + 70% { + -webkit-transform: rotate(3deg); + transform: rotate(3deg) + } + + to { + opacity: 1; + -webkit-transform: scale(1); + transform: scale(1) + } +} + +@keyframes jackInTheBox { + 0% { + opacity: 0; + -webkit-transform: scale(.1) rotate(30deg); + transform: scale(.1) rotate(30deg); + -webkit-transform-origin: center bottom; + transform-origin: center bottom + } + + 50% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg) + } + + 70% { + -webkit-transform: rotate(3deg); + transform: rotate(3deg) + } + + to { + opacity: 1; + -webkit-transform: scale(1); + transform: scale(1) + } +} + +.animate__jackInTheBox { + -webkit-animation-name: jackInTheBox; + animation-name: jackInTheBox +} + +@-webkit-keyframes rollIn { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); + transform: translate3d(-100%, 0, 0) rotate(-120deg) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes rollIn { + 0% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); + transform: translate3d(-100%, 0, 0) rotate(-120deg) + } + + to { + opacity: 1; + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__rollIn { + -webkit-animation-name: rollIn; + animation-name: rollIn +} + +@-webkit-keyframes rollOut { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); + transform: translate3d(100%, 0, 0) rotate(120deg) + } +} + +@keyframes rollOut { + 0% { + opacity: 1 + } + + to { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); + transform: translate3d(100%, 0, 0) rotate(120deg) + } +} + +.animate__rollOut { + -webkit-animation-name: rollOut; + animation-name: rollOut +} + +@-webkit-keyframes zoomIn { + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + 50% { + opacity: 1 + } +} + +@keyframes zoomIn { + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + 50% { + opacity: 1 + } +} + +.animate__zoomIn { + -webkit-animation-name: zoomIn; + animation-name: zoomIn +} + +@-webkit-keyframes zoomInDown { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomInDown { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomInDown { + -webkit-animation-name: zoomInDown; + animation-name: zoomInDown +} + +@-webkit-keyframes zoomInLeft { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomInLeft { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomInLeft { + -webkit-animation-name: zoomInLeft; + animation-name: zoomInLeft +} + +@-webkit-keyframes zoomInRight { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomInRight { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomInRight { + -webkit-animation-name: zoomInRight; + animation-name: zoomInRight +} + +@-webkit-keyframes zoomInUp { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomInUp { + 0% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomInUp { + -webkit-animation-name: zoomInUp; + animation-name: zoomInUp +} + +@-webkit-keyframes zoomOut { + 0% { + opacity: 1 + } + + 50% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + to { + opacity: 0 + } +} + +@keyframes zoomOut { + 0% { + opacity: 1 + } + + 50% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3) + } + + to { + opacity: 0 + } +} + +.animate__zoomOut { + -webkit-animation-name: zoomOut; + animation-name: zoomOut +} + +@-webkit-keyframes zoomOutDown { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomOutDown { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomOutDown { + -webkit-animation-name: zoomOutDown; + animation-name: zoomOutDown; + -webkit-transform-origin: center bottom; + transform-origin: center bottom +} + +@-webkit-keyframes zoomOutLeft { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0) + } + + to { + opacity: 0; + -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); + transform: scale(.1) translate3d(-2000px, 0, 0) + } +} + +@keyframes zoomOutLeft { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0) + } + + to { + opacity: 0; + -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); + transform: scale(.1) translate3d(-2000px, 0, 0) + } +} + +.animate__zoomOutLeft { + -webkit-animation-name: zoomOutLeft; + animation-name: zoomOutLeft; + -webkit-transform-origin: left center; + transform-origin: left center +} + +@-webkit-keyframes zoomOutRight { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0) + } + + to { + opacity: 0; + -webkit-transform: scale(.1) translate3d(2000px, 0, 0); + transform: scale(.1) translate3d(2000px, 0, 0) + } +} + +@keyframes zoomOutRight { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0) + } + + to { + opacity: 0; + -webkit-transform: scale(.1) translate3d(2000px, 0, 0); + transform: scale(.1) translate3d(2000px, 0, 0) + } +} + +.animate__zoomOutRight { + -webkit-animation-name: zoomOutRight; + animation-name: zoomOutRight; + -webkit-transform-origin: right center; + transform-origin: right center +} + +@-webkit-keyframes zoomOutUp { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +@keyframes zoomOutUp { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19); + animation-timing-function: cubic-bezier(.55, .055, .675, .19) + } + + to { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); + animation-timing-function: cubic-bezier(.175, .885, .32, 1) + } +} + +.animate__zoomOutUp { + -webkit-animation-name: zoomOutUp; + animation-name: zoomOutUp; + -webkit-transform-origin: center bottom; + transform-origin: center bottom +} + +@-webkit-keyframes slideInDown { + 0% { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes slideInDown { + 0% { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__slideInDown { + -webkit-animation-name: slideInDown; + animation-name: slideInDown +} + +@-webkit-keyframes slideInLeft { + 0% { + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes slideInLeft { + 0% { + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__slideInLeft { + -webkit-animation-name: slideInLeft; + animation-name: slideInLeft +} + +@-webkit-keyframes slideInRight { + 0% { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes slideInRight { + 0% { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__slideInRight { + -webkit-animation-name: slideInRight; + animation-name: slideInRight +} + +@-webkit-keyframes slideInUp { + 0% { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +@keyframes slideInUp { + 0% { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + visibility: visible + } + + to { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } +} + +.animate__slideInUp { + -webkit-animation-name: slideInUp; + animation-name: slideInUp +} + +@-webkit-keyframes slideOutDown { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } +} + +@keyframes slideOutDown { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) + } +} + +.animate__slideOutDown { + -webkit-animation-name: slideOutDown; + animation-name: slideOutDown +} + +@-webkit-keyframes slideOutLeft { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } +} + +@keyframes slideOutLeft { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) + } +} + +.animate__slideOutLeft { + -webkit-animation-name: slideOutLeft; + animation-name: slideOutLeft +} + +@-webkit-keyframes slideOutRight { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } +} + +@keyframes slideOutRight { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) + } +} + +.animate__slideOutRight { + -webkit-animation-name: slideOutRight; + animation-name: slideOutRight +} + +@-webkit-keyframes slideOutUp { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } +} + +@keyframes slideOutUp { + 0% { + -webkit-transform: translateZ(0); + transform: translateZ(0) + } + + to { + visibility: hidden; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) + } +} + +.animate__slideOutUp { + -webkit-animation-name: slideOutUp; + animation-name: slideOutUp +} \ No newline at end of file diff --git a/css/libs/reset.css b/css/libs/reset.css new file mode 100644 index 0000000..610ddd7 --- /dev/null +++ b/css/libs/reset.css @@ -0,0 +1,186 @@ +@charset "utf-8"; + +/* CSS Document */ + +html { + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + background-color: #F4F4FC; +} + +body, +div, +dl, +dt, +dd, +ul, +ol, +li, +h1, +h2, +h3, +h4, +h5, +h6, +pre, +code, +form, +fieldset, +legend, +input, +textarea, +p, +blockquote, +th, +td, +hr, +button, +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + margin: 0; + padding: 0; +} + +body, +button, +input, +select, +textarea { + font: 12px arial, "微软雅黑" +} + +input, +select, +textarea { + font-size: 100%; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +th { + text-align: inherit; +} + +fieldset, +img { + border: 0; +} + +iframe { + display: block; +} + +abbr, +acronym { + border: 0; + font-variant: normal; +} + +del { + text-decoration: line-through; +} + +address, +caption, +cite, +code, +dfn, +em, +i, +th, +var { + font-style: normal; + font-weight: 500; +} + +ol, +ul { + list-style: none; +} + +caption, +th { + text-align: left; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: 100%; + font-weight: 500; +} + +q:before, +q:after { + content: ''; +} + +ins, +a { + text-decoration: none; +} + +button { + border: 0; + outline: none; +} + + +/* common +-----------------------------------------------*/ + +.clearfix:after { + content: "\200B"; + display: block; + height: 0; + clear: both; +} + +.clearfix { + zoom: 1; +} + +.clear { + clear: both; + visibility: hidden; +} + +a { + color: #000; + text-decoration: none; +} + +a:hover { + color: #000; + text-decoration: none; +} + +select::-ms-expand { + display: none; +} + +input, +textarea:focus { + outline: none; +} + +select { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; +} \ No newline at end of file diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..bc6de61 --- /dev/null +++ b/css/style.css @@ -0,0 +1,498 @@ +/* 1080*1920 */ +/**滚动条的宽度*/ +::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +/**滚动条的滑块*/ +::-webkit-scrollbar-thumb { + background-color: rgba(0,0,0,.3); + border-radius: 4px; +} + +/**只需要加上这一行*/ +::-webkit-scrollbar-corner { + background-color: transparent; +} + +@font-face { + font-family: "DOUYU-Regular"; + src: url('../fonts/斗鱼追光体.ttf'); + font-weight: normal; + font-style: normal; +} +.lib-wrapper{ + width: 100vw; + height: 100vh; + overflow: hidden; +} +.lib-header{ + width: calc(100% - 40px); + padding: 20px; + background-color: #fff; + box-shadow: 0px 0px 20px 1px rgba(0,0,0,.2); +} +.lib-search{ + display: flex; + justify-content: space-between; + align-items: center; + width: calc(100%); + height: 60px; + border: 1px solid #C6C6E2; + border-radius: 5px; + overflow: hidden; +} +.lib-search input{ + display: block; + flex: 1; + height: 60px; + padding: 0 20px; + font-size: 30px; + border: none; +} +.lib-search button{ + position: relative; + display: block; + font-size: 30px; + width: 130px; + height: 60px; + background-color: #5A86F4; + color: #fff; + text-align: center; + padding-left: 30px; + cursor: pointer; +} +.lib-search button::before{ + content: ""; + position: absolute; + left: 14px; + top: 50%; + width: 30px; + height: 30px; + background: url("../images/icon1.png") no-repeat left center; + background-size: cover; + transform: translateY(-50%) +} +.lending-btn{ + position: fixed; + right: 60px; + top: 50%; + text-align: center; + border-radius: 50%; + transform: translateY(-50%); + z-index: 9999; +} +.lending-btn img{ + display: block; + width: 80px; + height: 80px; +} +.lending-btn span{ + display: block; + font-size: 30px; + padding-top: 20px; + font-family: "DOUYU-Regular"; +} +.lib-search-result { + display: none; + font-size: 28px; + padding: 0 20px 10px 20px; +} +.lib-search-result span{ + display: inline-block; + padding-right: 4px; + color: #5A86F4; +} + +.lib-book{ + display: flex; + justify-content: flex-start; + width: calc(100vw); + height: calc(100vh - 102px); + margin-top: 20px; + overflow: hidden; +} +.lib-book-left{ + width: 180px; + padding: 20px 0 20px 20px; + background-color: #fff; + /* border-radius: 14px; */ +} +.left-item { + height: calc(50% - 40px); + padding-bottom: 40px; +} +.left-item h4{ + position: relative; + font-size: 34px; + padding-left: 16px; + margin-bottom: 10px; + line-height: 46px; + font-weight: bold; + color: #191A1A; +} + +.left-item h4::before{ + content: ""; + position: absolute; + left: 0; + top: 50%; + width: 7px; + height: 30px; + background: #5A86F4; + margin-top: -15px; +} + +.left-filter{ + font-size: 28px; + line-height: 56px; + height: calc(100% - 46px); + overflow: hidden; + overflow-y: scroll; +} + +.left-filter li{ + padding-left: 16px; + color: #191A1A; + cursor: pointer; + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 1; + line-clamp: 1; + -webkit-box-orient: vertical; +} + +.left-filter li:hover, +.left-filter li.active{ + font-weight: bold; + background-color: #F1F4FE; + border-radius: 7px 0 0 7px; +} + +.lib-book-right{ + flex: 1; + height: calc(100% - 40px); + padding: 20px 0; + background-color: #F1F4FE; +} +.book-list-wrapper{ + padding-left: 10px; + width: calc(100% - 10px); + height: calc(100% - 30px); + overflow: hidden; + overflow-y: scroll; +} +.book-list { + display: flex; + justify-content: flex-start; + flex-wrap: wrap; + width: calc(100%); +} +.book-list li{ + display: flex; + justify-content: flex-start; + flex-direction: column; + width: calc(100% / 4 - 50px); + padding: 14px; + margin: 0 10px 20px 10px; + border: 1px solid #C6C6E2; + border-radius: 10px; + background-color: #fff; + overflow: hidden; +} + +.book-list li.active{ + position: relative; + border-color: #5A86F4; +} + +.book-list li.active::after{ + content: ""; + position: absolute; + right: -1px; + bottom: 0; + width: 48px; + height: 48px; + background: url("../images/icon2.png") no-repeat; + background-size: 100% 100%; +} + +.book-list li a{ + display: block; +} + +.book-list-img{ + height: 140px; + margin: 0 auto; + overflow: hidden; +} + +.book-list-img img{ + display: block; + height: 100%; + margin: 0 auto; +} + +.book-list li h4{ + font-size: 30px; + height: 64px; + line-height: 32px; + margin: 14px 0; + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; +} + +.book-list li span{ + display: block; + font-size: 24px; +} +.rack-box{ + padding-top: 10px; + width: 100%; + height: calc(100%); +} +.rack-content{ + position: relative; + height: calc(100% - 40px); + overflow: hidden; + overflow-y: scroll; +} +.rack-box-list{ + display: flex; + justify-content: flex-start; + flex-wrap: wrap; + height: 314px; + padding: 0 40px; + width: calc(100vw - 280px); + background: url('../images/list-rack.png') no-repeat 0 212px; + background-size: contain; + overflow: hidden; + white-space: nowrap; +} + +.rack-box-list .list-item{ + /* margin-right: 2px; */ + display: inline-block; + border: none; + height: 254px; + width: 65px; + position: relative; + background-size: contain; +} + +.rack-box-list .list-item.active{ + position: relative; + /* border:2px solid#5A86F4; */ +} + +.rack-box-list .list-item.active::after{ + content: ""; + position: absolute; + right: -1px; + bottom: 0; + width: 32px; + height: 32px; + background: url("../images/icon2.png") no-repeat; + background-size: 100% 100%; +} + +.box-txt{ + position: absolute; + top: 12%; + left: 50%; + transform: translateX(-40%); + pointer-events: none; +} + +.book-name, +.book-writer{ + writing-mode:vertical-rl; + height: 235px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.book-name{ + font-size: 20px; +} +.book-writer{ + font-size: 16px; +} +.rack-box-list .list-item:nth-child(12n+1){ + background: url('../images/1.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+2){ + background: url('../images/2.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+3){ + background: url('../images/3.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+4){ + background: url('../images/4.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+5){ + background: url('../images/6.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+6){ + background: url('../images/7.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+7){ + background: url('../images/10.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+8){ + background: url('../images/11.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+9){ + background: url('../images/12.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+10){ + background: url('../images/13.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+11){ + background: url('../images/14.png') no-repeat 0 0; +} +.rack-box-list .list-item:nth-child(12n+12){ + background: url('../images/15.png') no-repeat 0 0; +} + +.lib-dialog{ + position: fixed; + left: 0; + top: 0; + bottom: 0; + right: 0; +} +.lib-dialog-mask{ + width: 100%; + height: 100%; + background-color: rgba(0,0,0,.3); +} +.lib-dialog-main{ + position: absolute; + left: 50%; + top: 20%; + width: 860px; + background-color: #fff; + border-radius: 24px; + margin-left: -430px; +} + +.lib-dialog-header{ + padding-bottom: 30px; +} +.lib-dialog-title{ + width: 494px; + height: 76px; + line-height: 76px; + background: url('../images/list-title.png') no-repeat; + background-size: contain; + font-size: 40px; + font-weight: bold; + text-align: center; + margin: 0 auto; +} +.lib-lending-list{ + height: 490px; + margin: 0 40px; + overflow: hidden; + overflow-y: scroll; +} +.lib-lending-item{ + display: flex; + justify-content: flex-start; + flex-wrap: nowrap; + align-items: center; + font-size: 26px; + padding: 16px 0; + border-bottom: 1px solid #C6C6E2; +} +.lending-num{ + display: block; + width: 40px; +} +.lending-img{ + width: 60px; + margin-right: 10px; + /* height: 60px; */ + overflow: hidden; +} + +.lending-img img{ + display: block; + width: 100%; +} +.lib-lending-item h4{ + flex: 1; + padding-left: 10px; +} +.lib-lending-item h4, +.lib-lending-item span.lending-author{ + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 1; + line-clamp: 1; + -webkit-box-orient: vertical; +} + +.lib-lending-item .lending-author{ + flex: 1; +} + +.lib-dialog-bottom{ + display: flex; + justify-content: space-around; + padding: 40px 220px; +} + +.lib-dialog-bottom span{ + display: block; + padding: 0 40px; + font-size: 26px; + height: 56px; + line-height: 56px; + border: 1px solid #C6C6E2; + border-radius: 7px; + cursor: pointer; +} +.confirm-btn{ + color: #fff; + background-color: #5A86F4; + border-color: #5A86F4; +} + +.empty-book-list{ + width: 300px; + margin: 100px auto 0 auto; + text-align: center; +} + +.empty-book-list img{ + display: block; + width: 100%; +} + +.empty-book-list span{ + display: block; + padding-top: 20px; + font-size: 30px; + font-weight: bold; +} + +.book-noData{ + color: #a3a3a3; + font-size: 30px; + text-align: center; + padding: 10px 0 0 0; + margin-bottom: 30px; +} \ No newline at end of file diff --git a/fonts/斗鱼追光体.ttf b/fonts/斗鱼追光体.ttf new file mode 100644 index 0000000..c88514c Binary files /dev/null and b/fonts/斗鱼追光体.ttf differ diff --git a/images/1.png b/images/1.png new file mode 100644 index 0000000..ca6f61a Binary files /dev/null and b/images/1.png differ diff --git a/images/10.png b/images/10.png new file mode 100644 index 0000000..1ccd75e Binary files /dev/null and b/images/10.png differ diff --git a/images/11.png b/images/11.png new file mode 100644 index 0000000..6ff6d6a Binary files /dev/null and b/images/11.png differ diff --git a/images/12.png b/images/12.png new file mode 100644 index 0000000..0447202 Binary files /dev/null and b/images/12.png differ diff --git a/images/13.png b/images/13.png new file mode 100644 index 0000000..e0868b4 Binary files /dev/null and b/images/13.png differ diff --git a/images/14.png b/images/14.png new file mode 100644 index 0000000..1d0384e Binary files /dev/null and b/images/14.png differ diff --git a/images/15.png b/images/15.png new file mode 100644 index 0000000..58f5108 Binary files /dev/null and b/images/15.png differ diff --git a/images/2.png b/images/2.png new file mode 100644 index 0000000..8dcd398 Binary files /dev/null and b/images/2.png differ diff --git a/images/3.png b/images/3.png new file mode 100644 index 0000000..5428761 Binary files /dev/null and b/images/3.png differ diff --git a/images/4.png b/images/4.png new file mode 100644 index 0000000..e3af150 Binary files /dev/null and b/images/4.png differ diff --git a/images/5.png b/images/5.png new file mode 100644 index 0000000..52bda6b Binary files /dev/null and b/images/5.png differ diff --git a/images/6.png b/images/6.png new file mode 100644 index 0000000..f4545e4 Binary files /dev/null and b/images/6.png differ diff --git a/images/7.png b/images/7.png new file mode 100644 index 0000000..b78aca6 Binary files /dev/null and b/images/7.png differ diff --git a/images/8.png b/images/8.png new file mode 100644 index 0000000..25cdbd8 Binary files /dev/null and b/images/8.png differ diff --git a/images/9.png b/images/9.png new file mode 100644 index 0000000..782c1b6 Binary files /dev/null and b/images/9.png differ diff --git a/images/book_03.png b/images/book_03.png new file mode 100644 index 0000000..1c28961 Binary files /dev/null and b/images/book_03.png differ diff --git a/images/default-img.png b/images/default-img.png new file mode 100644 index 0000000..01a60cb Binary files /dev/null and b/images/default-img.png differ diff --git a/images/empty.png b/images/empty.png new file mode 100644 index 0000000..7195cc8 Binary files /dev/null and b/images/empty.png differ diff --git a/images/icon1.png b/images/icon1.png new file mode 100644 index 0000000..5d74cc1 Binary files /dev/null and b/images/icon1.png differ diff --git a/images/icon2.png b/images/icon2.png new file mode 100644 index 0000000..ebfda1c Binary files /dev/null and b/images/icon2.png differ diff --git a/images/icon3.png b/images/icon3.png new file mode 100644 index 0000000..1c0b9cb Binary files /dev/null and b/images/icon3.png differ diff --git a/images/list-rack.png b/images/list-rack.png new file mode 100644 index 0000000..45e5027 Binary files /dev/null and b/images/list-rack.png differ diff --git a/images/list-title.png b/images/list-title.png new file mode 100644 index 0000000..0124410 Binary files /dev/null and b/images/list-title.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..bb1ba8c --- /dev/null +++ b/index.html @@ -0,0 +1,46 @@ + + +
+ + + + + + + + + + +'+(n.content||"")+"
"),n.skin&&(n.anim="up"),"msg"===n.skin&&(n.shade=!1),s.innerHTML=(n.shade?"':"")+'