@charset "UTF-8"; :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:calc(1 * 2); animation-iteration-count:calc(1 * 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:calc(1 * 3); animation-iteration-count:calc(1 * 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:calc(1s * 2); animation-delay:calc(1s * 2); -webkit-animation-delay:calc(var(--animate-delay) * 2); animation-delay:calc(var(--animate-delay) * 2); } .animate__animated.animate__delay-3s{ -webkit-animation-delay:calc(1s * 3); animation-delay:calc(1s * 3); -webkit-animation-delay:calc(var(--animate-delay) * 3); animation-delay:calc(var(--animate-delay) * 3); } .animate__animated.animate__delay-4s{ -webkit-animation-delay:calc(1s * 4); animation-delay:calc(1s * 4); -webkit-animation-delay:calc(var(--animate-delay) * 4); animation-delay:calc(var(--animate-delay) * 4); } .animate__animated.animate__delay-5s{ -webkit-animation-delay:calc(1s * 5); animation-delay:calc(1s * 5); -webkit-animation-delay:calc(var(--animate-delay) * 5); animation-delay:calc(var(--animate-delay) * 5); } .animate__animated.animate__faster{ -webkit-animation-duration:calc(1s / 2); animation-duration:calc(1s / 2); -webkit-animation-duration:calc(var(--animate-duration) / 2); animation-duration:calc(var(--animate-duration) / 2); } .animate__animated.animate__fast{ -webkit-animation-duration:calc(1s * 0.8); animation-duration:calc(1s * 0.8); -webkit-animation-duration:calc(var(--animate-duration) * 0.8); animation-duration:calc(var(--animate-duration) * 0.8); } .animate__animated.animate__slow{ -webkit-animation-duration:calc(1s * 2); animation-duration:calc(1s * 2); -webkit-animation-duration:calc(var(--animate-duration) * 2); animation-duration:calc(var(--animate-duration) * 2); } .animate__animated.animate__slower{ -webkit-animation-duration:calc(1s * 3); animation-duration:calc(1s * 3); -webkit-animation-duration:calc(var(--animate-duration) * 3); animation-duration:calc(var(--animate-duration) * 3); } @media print, (prefers-reduced-motion: reduce){ .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{ from, 20%, 53%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } 40%, 43%{ -webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.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(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.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(0.215, 0.61, 0.355, 1); transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform:translate3d(0, 0, 0) scaleY(0.95); transform:translate3d(0, 0, 0) scaleY(0.95); } 90%{ -webkit-transform:translate3d(0, -4px, 0) scaleY(1.02); transform:translate3d(0, -4px, 0) scaleY(1.02); } } @keyframes bounce{ from, 20%, 53%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } 40%, 43%{ -webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.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(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.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(0.215, 0.61, 0.355, 1); transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform:translate3d(0, 0, 0) scaleY(0.95); transform:translate3d(0, 0, 0) scaleY(0.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{ from, 50%, to{ opacity:1; } 25%, 75%{ opacity:0; } } @keyframes flash{ from, 50%, to{ opacity:1; } 25%, 75%{ opacity:0; } } .animate__flash{ -webkit-animation-name:flash; animation-name:flash; } @-webkit-keyframes pulse{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 50%{ -webkit-transform:scale3d(1.05, 1.05, 1.05); transform:scale3d(1.05, 1.05, 1.05); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } @keyframes pulse{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 50%{ -webkit-transform:scale3d(1.05, 1.05, 1.05); transform:scale3d(1.05, 1.05, 1.05); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 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{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 30%{ -webkit-transform:scale3d(1.25, 0.75, 1); transform:scale3d(1.25, 0.75, 1); } 40%{ -webkit-transform:scale3d(0.75, 1.25, 1); transform:scale3d(0.75, 1.25, 1); } 50%{ -webkit-transform:scale3d(1.15, 0.85, 1); transform:scale3d(1.15, 0.85, 1); } 65%{ -webkit-transform:scale3d(0.95, 1.05, 1); transform:scale3d(0.95, 1.05, 1); } 75%{ -webkit-transform:scale3d(1.05, 0.95, 1); transform:scale3d(1.05, 0.95, 1); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } @keyframes rubberBand{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 30%{ -webkit-transform:scale3d(1.25, 0.75, 1); transform:scale3d(1.25, 0.75, 1); } 40%{ -webkit-transform:scale3d(0.75, 1.25, 1); transform:scale3d(0.75, 1.25, 1); } 50%{ -webkit-transform:scale3d(1.15, 0.85, 1); transform:scale3d(1.15, 0.85, 1); } 65%{ -webkit-transform:scale3d(0.95, 1.05, 1); transform:scale3d(0.95, 1.05, 1); } 75%{ -webkit-transform:scale3d(1.05, 0.95, 1); transform:scale3d(1.05, 0.95, 1); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } .animate__rubberBand{ -webkit-animation-name:rubberBand; animation-name:rubberBand; } @-webkit-keyframes shakeX{ from, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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:rotate3d(0, 0, 1, 15deg); transform:rotate3d(0, 0, 1, 15deg); } 40%{ -webkit-transform:rotate3d(0, 0, 1, -10deg); transform:rotate3d(0, 0, 1, -10deg); } 60%{ -webkit-transform:rotate3d(0, 0, 1, 5deg); transform:rotate3d(0, 0, 1, 5deg); } 80%{ -webkit-transform:rotate3d(0, 0, 1, -5deg); transform:rotate3d(0, 0, 1, -5deg); } to{ -webkit-transform:rotate3d(0, 0, 1, 0deg); transform:rotate3d(0, 0, 1, 0deg); } } @keyframes swing{ 20%{ -webkit-transform:rotate3d(0, 0, 1, 15deg); transform:rotate3d(0, 0, 1, 15deg); } 40%{ -webkit-transform:rotate3d(0, 0, 1, -10deg); transform:rotate3d(0, 0, 1, -10deg); } 60%{ -webkit-transform:rotate3d(0, 0, 1, 5deg); transform:rotate3d(0, 0, 1, 5deg); } 80%{ -webkit-transform:rotate3d(0, 0, 1, -5deg); transform:rotate3d(0, 0, 1, -5deg); } to{ -webkit-transform:rotate3d(0, 0, 1, 0deg); transform:rotate3d(0, 0, 1, 0deg); } } .animate__swing{ -webkit-transform-origin:top center; transform-origin:top center; -webkit-animation-name:swing; animation-name:swing; } @-webkit-keyframes tada{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 10%, 20%{ -webkit-transform:scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform:scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90%{ -webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80%{ -webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } @keyframes tada{ from{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } 10%, 20%{ -webkit-transform:scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform:scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90%{ -webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80%{ -webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to{ -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } .animate__tada{ -webkit-animation-name:tada; animation-name:tada; } @-webkit-keyframes wobble{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } 15%{ -webkit-transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30%{ -webkit-transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45%{ -webkit-transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60%{ -webkit-transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75%{ -webkit-transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes wobble{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } 15%{ -webkit-transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30%{ -webkit-transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45%{ -webkit-transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60%{ -webkit-transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75%{ -webkit-transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__wobble{ -webkit-animation-name:wobble; animation-name:wobble; } @-webkit-keyframes jello{ from, 11.1%, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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(-0.78125deg) skewY(-0.78125deg); transform:skewX(-0.78125deg) skewY(-0.78125deg); } 77.7%{ -webkit-transform:skewX(0.390625deg) skewY(0.390625deg); transform:skewX(0.390625deg) skewY(0.390625deg); } 88.8%{ -webkit-transform:skewX(-0.1953125deg) skewY(-0.1953125deg); transform:skewX(-0.1953125deg) skewY(-0.1953125deg); } } @keyframes jello{ from, 11.1%, to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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(-0.78125deg) skewY(-0.78125deg); transform:skewX(-0.78125deg) skewY(-0.78125deg); } 77.7%{ -webkit-transform:skewX(0.390625deg) skewY(0.390625deg); transform:skewX(0.390625deg) skewY(0.390625deg); } 88.8%{ -webkit-transform:skewX(-0.1953125deg) skewY(-0.1953125deg); transform:skewX(-0.1953125deg) skewY(-0.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:calc(1s * 1.3); animation-duration:calc(1s * 1.3); -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(0.7); transform:translateY(-1200px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } } @keyframes backInDown{ 0%{ -webkit-transform:translateY(-1200px) scale(0.7); transform:translateY(-1200px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -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(0.7); transform:translateX(-2000px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } } @keyframes backInLeft{ 0%{ -webkit-transform:translateX(-2000px) scale(0.7); transform:translateX(-2000px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -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(0.7); transform:translateX(2000px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } } @keyframes backInRight{ 0%{ -webkit-transform:translateX(2000px) scale(0.7); transform:translateX(2000px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -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(0.7); transform:translateY(1200px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } } @keyframes backInUp{ 0%{ -webkit-transform:translateY(1200px) scale(0.7); transform:translateY(1200px) scale(0.7); opacity:0.7; } 80%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -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(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateY(700px) scale(0.7); transform:translateY(700px) scale(0.7); opacity:0.7; } } @keyframes backOutDown{ 0%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } 20%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateY(700px) scale(0.7); transform:translateY(700px) scale(0.7); opacity:0.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(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateX(-2000px) scale(0.7); transform:translateX(-2000px) scale(0.7); opacity:0.7; } } @keyframes backOutLeft{ 0%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } 20%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateX(-2000px) scale(0.7); transform:translateX(-2000px) scale(0.7); opacity:0.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(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateX(2000px) scale(0.7); transform:translateX(2000px) scale(0.7); opacity:0.7; } } @keyframes backOutRight{ 0%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } 20%{ -webkit-transform:translateX(0px) scale(0.7); transform:translateX(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateX(2000px) scale(0.7); transform:translateX(2000px) scale(0.7); opacity:0.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(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateY(-700px) scale(0.7); transform:translateY(-700px) scale(0.7); opacity:0.7; } } @keyframes backOutUp{ 0%{ -webkit-transform:scale(1); transform:scale(1); opacity:1; } 20%{ -webkit-transform:translateY(0px) scale(0.7); transform:translateY(0px) scale(0.7); opacity:0.7; } 100%{ -webkit-transform:translateY(-700px) scale(0.7); transform:translateY(-700px) scale(0.7); opacity:0.7; } } .animate__backOutUp{ -webkit-animation-name:backOutUp; animation-name:backOutUp; } @-webkit-keyframes bounceIn{ from, 20%, 40%, 60%, 80%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } 0%{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } 20%{ -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); } 40%{ -webkit-transform:scale3d(0.9, 0.9, 0.9); transform:scale3d(0.9, 0.9, 0.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(0.97, 0.97, 0.97); transform:scale3d(0.97, 0.97, 0.97); } to{ opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } @keyframes bounceIn{ from, 20%, 40%, 60%, 80%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } 0%{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } 20%{ -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); } 40%{ -webkit-transform:scale3d(0.9, 0.9, 0.9); transform:scale3d(0.9, 0.9, 0.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(0.97, 0.97, 0.97); transform:scale3d(0.97, 0.97, 0.97); } to{ opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); } } .animate__bounceIn{ -webkit-animation-duration:calc(1s * 0.75); animation-duration:calc(1s * 0.75); -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{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.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(0.9); transform:translate3d(0, 25px, 0) scaleY(0.9); } 75%{ -webkit-transform:translate3d(0, -10px, 0) scaleY(0.95); transform:translate3d(0, -10px, 0) scaleY(0.95); } 90%{ -webkit-transform:translate3d(0, 5px, 0) scaleY(0.985); transform:translate3d(0, 5px, 0) scaleY(0.985); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes bounceInDown{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.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(0.9); transform:translate3d(0, 25px, 0) scaleY(0.9); } 75%{ -webkit-transform:translate3d(0, -10px, 0) scaleY(0.95); transform:translate3d(0, -10px, 0) scaleY(0.95); } 90%{ -webkit-transform:translate3d(0, 5px, 0) scaleY(0.985); transform:translate3d(0, 5px, 0) scaleY(0.985); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__bounceInDown{ -webkit-animation-name:bounceInDown; animation-name:bounceInDown; } @-webkit-keyframes bounceInLeft{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.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(0.98); transform:translate3d(-10px, 0, 0) scaleX(0.98); } 90%{ -webkit-transform:translate3d(5px, 0, 0) scaleX(0.995); transform:translate3d(5px, 0, 0) scaleX(0.995); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes bounceInLeft{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.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(0.98); transform:translate3d(-10px, 0, 0) scaleX(0.98); } 90%{ -webkit-transform:translate3d(5px, 0, 0) scaleX(0.995); transform:translate3d(5px, 0, 0) scaleX(0.995); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__bounceInLeft{ -webkit-animation-name:bounceInLeft; animation-name:bounceInLeft; } @-webkit-keyframes bounceInRight{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } from{ 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(0.98); transform:translate3d(10px, 0, 0) scaleX(0.98); } 90%{ -webkit-transform:translate3d(-5px, 0, 0) scaleX(0.995); transform:translate3d(-5px, 0, 0) scaleX(0.995); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes bounceInRight{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } from{ 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(0.98); transform:translate3d(10px, 0, 0) scaleX(0.98); } 90%{ -webkit-transform:translate3d(-5px, 0, 0) scaleX(0.995); transform:translate3d(-5px, 0, 0) scaleX(0.995); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__bounceInRight{ -webkit-animation-name:bounceInRight; animation-name:bounceInRight; } @-webkit-keyframes bounceInUp{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } from{ 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(0.9); transform:translate3d(0, -20px, 0) scaleY(0.9); } 75%{ -webkit-transform:translate3d(0, 10px, 0) scaleY(0.95); transform:translate3d(0, 10px, 0) scaleY(0.95); } 90%{ -webkit-transform:translate3d(0, -5px, 0) scaleY(0.985); transform:translate3d(0, -5px, 0) scaleY(0.985); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes bounceInUp{ from, 60%, 75%, 90%, to{ -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); } from{ 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(0.9); transform:translate3d(0, -20px, 0) scaleY(0.9); } 75%{ -webkit-transform:translate3d(0, 10px, 0) scaleY(0.95); transform:translate3d(0, 10px, 0) scaleY(0.95); } 90%{ -webkit-transform:translate3d(0, -5px, 0) scaleY(0.985); transform:translate3d(0, -5px, 0) scaleY(0.985); } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__bounceInUp{ -webkit-animation-name:bounceInUp; animation-name:bounceInUp; } @-webkit-keyframes bounceOut{ 20%{ -webkit-transform:scale3d(0.9, 0.9, 0.9); transform:scale3d(0.9, 0.9, 0.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(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } } @keyframes bounceOut{ 20%{ -webkit-transform:scale3d(0.9, 0.9, 0.9); transform:scale3d(0.9, 0.9, 0.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(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } } .animate__bounceOut{ -webkit-animation-duration:calc(1s * 0.75); animation-duration:calc(1s * 0.75); -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(0.985); transform:translate3d(0, 10px, 0) scaleY(0.985); } 40%, 45%{ opacity:1; -webkit-transform:translate3d(0, -20px, 0) scaleY(0.9); transform:translate3d(0, -20px, 0) scaleY(0.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(0.985); transform:translate3d(0, 10px, 0) scaleY(0.985); } 40%, 45%{ opacity:1; -webkit-transform:translate3d(0, -20px, 0) scaleY(0.9); transform:translate3d(0, -20px, 0) scaleY(0.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(0.9); transform:translate3d(20px, 0, 0) scaleX(0.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(0.9); transform:translate3d(20px, 0, 0) scaleX(0.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(0.9); transform:translate3d(-20px, 0, 0) scaleX(0.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(0.9); transform:translate3d(-20px, 0, 0) scaleX(0.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(0.985); transform:translate3d(0, -10px, 0) scaleY(0.985); } 40%, 45%{ opacity:1; -webkit-transform:translate3d(0, 20px, 0) scaleY(0.9); transform:translate3d(0, 20px, 0) scaleY(0.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(0.985); transform:translate3d(0, -10px, 0) scaleY(0.985); } 40%, 45%{ opacity:1; -webkit-transform:translate3d(0, 20px, 0) scaleY(0.9); transform:translate3d(0, 20px, 0) scaleY(0.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{ from{ opacity:0; } to{ opacity:1; } } @keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } } .animate__fadeIn{ -webkit-animation-name:fadeIn; animation-name:fadeIn; } @-webkit-keyframes fadeInDown{ from{ opacity:0; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInDown{ from{ opacity:0; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInDown{ -webkit-animation-name:fadeInDown; animation-name:fadeInDown; } @-webkit-keyframes fadeInDownBig{ from{ opacity:0; -webkit-transform:translate3d(0, -2000px, 0); transform:translate3d(0, -2000px, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInDownBig{ from{ opacity:0; -webkit-transform:translate3d(0, -2000px, 0); transform:translate3d(0, -2000px, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInDownBig{ -webkit-animation-name:fadeInDownBig; animation-name:fadeInDownBig; } @-webkit-keyframes fadeInLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInLeft{ -webkit-animation-name:fadeInLeft; animation-name:fadeInLeft; } @-webkit-keyframes fadeInLeftBig{ from{ opacity:0; -webkit-transform:translate3d(-2000px, 0, 0); transform:translate3d(-2000px, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInLeftBig{ from{ opacity:0; -webkit-transform:translate3d(-2000px, 0, 0); transform:translate3d(-2000px, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInLeftBig{ -webkit-animation-name:fadeInLeftBig; animation-name:fadeInLeftBig; } @-webkit-keyframes fadeInRight{ from{ opacity:0; -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInRight{ from{ opacity:0; -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInRight{ -webkit-animation-name:fadeInRight; animation-name:fadeInRight; } @-webkit-keyframes fadeInRightBig{ from{ opacity:0; -webkit-transform:translate3d(2000px, 0, 0); transform:translate3d(2000px, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInRightBig{ from{ opacity:0; -webkit-transform:translate3d(2000px, 0, 0); transform:translate3d(2000px, 0, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInRightBig{ -webkit-animation-name:fadeInRightBig; animation-name:fadeInRightBig; } @-webkit-keyframes fadeInUp{ from{ opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInUp{ from{ opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInUp{ -webkit-animation-name:fadeInUp; animation-name:fadeInUp; } @-webkit-keyframes fadeInUpBig{ from{ opacity:0; -webkit-transform:translate3d(0, 2000px, 0); transform:translate3d(0, 2000px, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInUpBig{ from{ opacity:0; -webkit-transform:translate3d(0, 2000px, 0); transform:translate3d(0, 2000px, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInUpBig{ -webkit-animation-name:fadeInUpBig; animation-name:fadeInUpBig; } @-webkit-keyframes fadeInTopLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, -100%, 0); transform:translate3d(-100%, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInTopLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, -100%, 0); transform:translate3d(-100%, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInTopLeft{ -webkit-animation-name:fadeInTopLeft; animation-name:fadeInTopLeft; } @-webkit-keyframes fadeInTopRight{ from{ opacity:0; -webkit-transform:translate3d(100%, -100%, 0); transform:translate3d(100%, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInTopRight{ from{ opacity:0; -webkit-transform:translate3d(100%, -100%, 0); transform:translate3d(100%, -100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInTopRight{ -webkit-animation-name:fadeInTopRight; animation-name:fadeInTopRight; } @-webkit-keyframes fadeInBottomLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, 100%, 0); transform:translate3d(-100%, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInBottomLeft{ from{ opacity:0; -webkit-transform:translate3d(-100%, 100%, 0); transform:translate3d(-100%, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInBottomLeft{ -webkit-animation-name:fadeInBottomLeft; animation-name:fadeInBottomLeft; } @-webkit-keyframes fadeInBottomRight{ from{ opacity:0; -webkit-transform:translate3d(100%, 100%, 0); transform:translate3d(100%, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes fadeInBottomRight{ from{ opacity:0; -webkit-transform:translate3d(100%, 100%, 0); transform:translate3d(100%, 100%, 0); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__fadeInBottomRight{ -webkit-animation-name:fadeInBottomRight; animation-name:fadeInBottomRight; } @-webkit-keyframes fadeOut{ from{ opacity:1; } to{ opacity:0; } } @keyframes fadeOut{ from{ opacity:1; } to{ opacity:0; } } .animate__fadeOut{ -webkit-animation-name:fadeOut; animation-name:fadeOut; } @-webkit-keyframes fadeOutDown{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); } } @keyframes fadeOutDown{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(0, 2000px, 0); transform:translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(-2000px, 0, 0); transform:translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); } } @keyframes fadeOutRight{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(2000px, 0, 0); transform:translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); } } @keyframes fadeOutUp{ from{ 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{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(0, -2000px, 0); transform:translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig{ from{ 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{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ opacity:0; -webkit-transform:translate3d(-100%, -100%, 0); transform:translate3d(-100%, -100%, 0); } } @keyframes fadeOutTopLeft{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ opacity:0; -webkit-transform:translate3d(100%, -100%, 0); transform:translate3d(100%, -100%, 0); } } @keyframes fadeOutTopRight{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ opacity:0; -webkit-transform:translate3d(100%, 100%, 0); transform:translate3d(100%, 100%, 0); } } @keyframes fadeOutBottomRight{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ opacity:0; -webkit-transform:translate3d(-100%, 100%, 0); transform:translate3d(-100%, 100%, 0); } } @keyframes fadeOutBottomLeft{ from{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } 40%{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } 50%{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 80%{ -webkit-transform:perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform:perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } to{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } } @keyframes flip{ from{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } 40%{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } 50%{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 80%{ -webkit-transform:perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform:perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } to{ -webkit-transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform:perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 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{ from{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 90deg); transform:perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; opacity:0; } 40%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -20deg); transform:perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 60%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 10deg); transform:perspective(400px) rotate3d(1, 0, 0, 10deg); opacity:1; } 80%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -5deg); transform:perspective(400px) rotate3d(1, 0, 0, -5deg); } to{ -webkit-transform:perspective(400px); transform:perspective(400px); } } @keyframes flipInX{ from{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 90deg); transform:perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; opacity:0; } 40%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -20deg); transform:perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 60%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 10deg); transform:perspective(400px) rotate3d(1, 0, 0, 10deg); opacity:1; } 80%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -5deg); transform:perspective(400px) rotate3d(1, 0, 0, -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{ from{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 90deg); transform:perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; opacity:0; } 40%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -20deg); transform:perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 60%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 10deg); transform:perspective(400px) rotate3d(0, 1, 0, 10deg); opacity:1; } 80%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -5deg); transform:perspective(400px) rotate3d(0, 1, 0, -5deg); } to{ -webkit-transform:perspective(400px); transform:perspective(400px); } } @keyframes flipInY{ from{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 90deg); transform:perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; opacity:0; } 40%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -20deg); transform:perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in; } 60%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 10deg); transform:perspective(400px) rotate3d(0, 1, 0, 10deg); opacity:1; } 80%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -5deg); transform:perspective(400px) rotate3d(0, 1, 0, -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{ from{ -webkit-transform:perspective(400px); transform:perspective(400px); } 30%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -20deg); transform:perspective(400px) rotate3d(1, 0, 0, -20deg); opacity:1; } to{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 90deg); transform:perspective(400px) rotate3d(1, 0, 0, 90deg); opacity:0; } } @keyframes flipOutX{ from{ -webkit-transform:perspective(400px); transform:perspective(400px); } 30%{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, -20deg); transform:perspective(400px) rotate3d(1, 0, 0, -20deg); opacity:1; } to{ -webkit-transform:perspective(400px) rotate3d(1, 0, 0, 90deg); transform:perspective(400px) rotate3d(1, 0, 0, 90deg); opacity:0; } } .animate__flipOutX{ -webkit-animation-duration:calc(1s * 0.75); animation-duration:calc(1s * 0.75); -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{ from{ -webkit-transform:perspective(400px); transform:perspective(400px); } 30%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -15deg); transform:perspective(400px) rotate3d(0, 1, 0, -15deg); opacity:1; } to{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 90deg); transform:perspective(400px) rotate3d(0, 1, 0, 90deg); opacity:0; } } @keyframes flipOutY{ from{ -webkit-transform:perspective(400px); transform:perspective(400px); } 30%{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, -15deg); transform:perspective(400px) rotate3d(0, 1, 0, -15deg); opacity:1; } to{ -webkit-transform:perspective(400px) rotate3d(0, 1, 0, 90deg); transform:perspective(400px) rotate3d(0, 1, 0, 90deg); opacity:0; } } .animate__flipOutY{ -webkit-animation-duration:calc(1s * 0.75); animation-duration:calc(1s * 0.75); -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{ from{ -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:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes lightSpeedInRight{ from{ -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:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__lightSpeedInRight{ -webkit-animation-name:lightSpeedInRight; animation-name:lightSpeedInRight; -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } @-webkit-keyframes lightSpeedInLeft{ from{ -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:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes lightSpeedInLeft{ from{ -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:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__lightSpeedInLeft{ -webkit-animation-name:lightSpeedInLeft; animation-name:lightSpeedInLeft; -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out; } @-webkit-keyframes lightSpeedOutRight{ from{ opacity:1; } to{ -webkit-transform:translate3d(100%, 0, 0) skewX(30deg); transform:translate3d(100%, 0, 0) skewX(30deg); opacity:0; } } @keyframes lightSpeedOutRight{ from{ 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{ from{ opacity:1; } to{ -webkit-transform:translate3d(-100%, 0, 0) skewX(-30deg); transform:translate3d(-100%, 0, 0) skewX(-30deg); opacity:0; } } @keyframes lightSpeedOutLeft{ from{ 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{ from{ -webkit-transform:rotate3d(0, 0, 1, -200deg); transform:rotate3d(0, 0, 1, -200deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } @keyframes rotateIn{ from{ -webkit-transform:rotate3d(0, 0, 1, -200deg); transform:rotate3d(0, 0, 1, -200deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } .animate__rotateIn{ -webkit-animation-name:rotateIn; animation-name:rotateIn; -webkit-transform-origin:center; transform-origin:center; } @-webkit-keyframes rotateInDownLeft{ from{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } @keyframes rotateInDownLeft{ from{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } .animate__rotateInDownLeft{ -webkit-animation-name:rotateInDownLeft; animation-name:rotateInDownLeft; -webkit-transform-origin:left bottom; transform-origin:left bottom; } @-webkit-keyframes rotateInDownRight{ from{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } @keyframes rotateInDownRight{ from{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } .animate__rotateInDownRight{ -webkit-animation-name:rotateInDownRight; animation-name:rotateInDownRight; -webkit-transform-origin:right bottom; transform-origin:right bottom; } @-webkit-keyframes rotateInUpLeft{ from{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } @keyframes rotateInUpLeft{ from{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } .animate__rotateInUpLeft{ -webkit-animation-name:rotateInUpLeft; animation-name:rotateInUpLeft; -webkit-transform-origin:left bottom; transform-origin:left bottom; } @-webkit-keyframes rotateInUpRight{ from{ -webkit-transform:rotate3d(0, 0, 1, -90deg); transform:rotate3d(0, 0, 1, -90deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } @keyframes rotateInUpRight{ from{ -webkit-transform:rotate3d(0, 0, 1, -90deg); transform:rotate3d(0, 0, 1, -90deg); opacity:0; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); opacity:1; } } .animate__rotateInUpRight{ -webkit-animation-name:rotateInUpRight; animation-name:rotateInUpRight; -webkit-transform-origin:right bottom; transform-origin:right bottom; } @-webkit-keyframes rotateOut{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 200deg); transform:rotate3d(0, 0, 1, 200deg); opacity:0; } } @keyframes rotateOut{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 200deg); transform:rotate3d(0, 0, 1, 200deg); opacity:0; } } .animate__rotateOut{ -webkit-animation-name:rotateOut; animation-name:rotateOut; -webkit-transform-origin:center; transform-origin:center; } @-webkit-keyframes rotateOutDownLeft{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } } @keyframes rotateOutDownLeft{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg); opacity:0; } } .animate__rotateOutDownLeft{ -webkit-animation-name:rotateOutDownLeft; animation-name:rotateOutDownLeft; -webkit-transform-origin:left bottom; transform-origin:left bottom; } @-webkit-keyframes rotateOutDownRight{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } } @keyframes rotateOutDownRight{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } } .animate__rotateOutDownRight{ -webkit-animation-name:rotateOutDownRight; animation-name:rotateOutDownRight; -webkit-transform-origin:right bottom; transform-origin:right bottom; } @-webkit-keyframes rotateOutUpLeft{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } } @keyframes rotateOutUpLeft{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate3d(0, 0, 1, -45deg); opacity:0; } } .animate__rotateOutUpLeft{ -webkit-animation-name:rotateOutUpLeft; animation-name:rotateOutUpLeft; -webkit-transform-origin:left bottom; transform-origin:left bottom; } @-webkit-keyframes rotateOutUpRight{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 90deg); transform:rotate3d(0, 0, 1, 90deg); opacity:0; } } @keyframes rotateOutUpRight{ from{ opacity:1; } to{ -webkit-transform:rotate3d(0, 0, 1, 90deg); transform:rotate3d(0, 0, 1, 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:rotate3d(0, 0, 1, 80deg); transform:rotate3d(0, 0, 1, 80deg); -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out; } 40%, 80%{ -webkit-transform:rotate3d(0, 0, 1, 60deg); transform:rotate3d(0, 0, 1, 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:rotate3d(0, 0, 1, 80deg); transform:rotate3d(0, 0, 1, 80deg); -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out; } 40%, 80%{ -webkit-transform:rotate3d(0, 0, 1, 60deg); transform:rotate3d(0, 0, 1, 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:calc(1s * 2); animation-duration:calc(1s * 2); -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{ from{ opacity:0; -webkit-transform:scale(0.1) rotate(30deg); transform:scale(0.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{ from{ opacity:0; -webkit-transform:scale(0.1) rotate(30deg); transform:scale(0.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{ from{ opacity:0; -webkit-transform:translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform:translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes rollIn{ from{ opacity:0; -webkit-transform:translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform:translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to{ opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__rollIn{ -webkit-animation-name:rollIn; animation-name:rollIn; } @-webkit-keyframes rollOut{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform:translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut{ from{ opacity:1; } to{ opacity:0; -webkit-transform:translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform:translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .animate__rollOut{ -webkit-animation-name:rollOut; animation-name:rollOut; } @-webkit-keyframes zoomIn{ from{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } 50%{ opacity:1; } } @keyframes zoomIn{ from{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } 50%{ opacity:1; } } .animate__zoomIn{ -webkit-animation-name:zoomIn; animation-name:zoomIn; } @-webkit-keyframes zoomInDown{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInDown{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } .animate__zoomInDown{ -webkit-animation-name:zoomInDown; animation-name:zoomInDown; } @-webkit-keyframes zoomInLeft{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInLeft{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } .animate__zoomInLeft{ -webkit-animation-name:zoomInLeft; animation-name:zoomInLeft; } @-webkit-keyframes zoomInRight{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInRight{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } .animate__zoomInRight{ -webkit-animation-name:zoomInRight; animation-name:zoomInRight; } @-webkit-keyframes zoomInUp{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInUp{ from{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } .animate__zoomInUp{ -webkit-animation-name:zoomInUp; animation-name:zoomInUp; } @-webkit-keyframes zoomOut{ from{ opacity:1; } 50%{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } to{ opacity:0; } } @keyframes zoomOut{ from{ opacity:1; } 50%{ opacity:0; -webkit-transform:scale3d(0.3, 0.3, 0.3); transform:scale3d(0.3, 0.3, 0.3); } to{ opacity:0; } } .animate__zoomOut{ -webkit-animation-name:zoomOut; animation-name:zoomOut; } @-webkit-keyframes zoomOutDown{ 40%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } to{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutDown{ 40%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } to{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.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(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to{ opacity:0; -webkit-transform:scale(0.1) translate3d(-2000px, 0, 0); transform:scale(0.1) translate3d(-2000px, 0, 0); } } @keyframes zoomOutLeft{ 40%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to{ opacity:0; -webkit-transform:scale(0.1) translate3d(-2000px, 0, 0); transform:scale(0.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(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to{ opacity:0; -webkit-transform:scale(0.1) translate3d(2000px, 0, 0); transform:scale(0.1) translate3d(2000px, 0, 0); } } @keyframes zoomOutRight{ 40%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to{ opacity:0; -webkit-transform:scale(0.1) translate3d(2000px, 0, 0); transform:scale(0.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(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } to{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutUp{ 40%{ opacity:1; -webkit-transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform:scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19); } to{ opacity:0; -webkit-transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform:scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1); } } .animate__zoomOutUp{ -webkit-animation-name:zoomOutUp; animation-name:zoomOutUp; -webkit-transform-origin:center bottom; transform-origin:center bottom; } @-webkit-keyframes slideInDown{ from{ -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes slideInDown{ from{ -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__slideInDown{ -webkit-animation-name:slideInDown; animation-name:slideInDown; } @-webkit-keyframes slideInLeft{ from{ -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes slideInLeft{ from{ -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__slideInLeft{ -webkit-animation-name:slideInLeft; animation-name:slideInLeft; } @-webkit-keyframes slideInRight{ from{ -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes slideInRight{ from{ -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__slideInRight{ -webkit-animation-name:slideInRight; animation-name:slideInRight; } @-webkit-keyframes slideInUp{ from{ -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } @keyframes slideInUp{ from{ -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); visibility:visible; } to{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } } .animate__slideInUp{ -webkit-animation-name:slideInUp; animation-name:slideInUp; } @-webkit-keyframes slideOutDown{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ visibility:hidden; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0); } } @keyframes slideOutDown{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ visibility:hidden; -webkit-transform:translate3d(-100%, 0, 0); transform:translate3d(-100%, 0, 0); } } @keyframes slideOutLeft{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ visibility:hidden; -webkit-transform:translate3d(100%, 0, 0); transform:translate3d(100%, 0, 0); } } @keyframes slideOutRight{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 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{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ visibility:hidden; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); } } @keyframes slideOutUp{ from{ -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); } to{ visibility:hidden; -webkit-transform:translate3d(0, -100%, 0); transform:translate3d(0, -100%, 0); } } .animate__slideOutUp{ -webkit-animation-name:slideOutUp; animation-name:slideOutUp; } blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul{ margin:0; padding:0; } h1, h2, h3, h4, h5, h6{ font-size:100%; font-weight:normal; } ul{ list-style:none; } button, input, select, textarea{ margin:0; } html{ box-sizing:border-box; font-family:sans-serif; } *, *::after, *::before{ box-sizing:inherit; } img, video{ height:auto; max-width:100%; } iframe{ border:0; } table{ border-collapse:collapse; border-spacing:0; } td, th{ padding:0; text-align:left; } @font-face{ font-family:"barlow-regular"; font-weight:normal; src:url(/assets/fonts/Barlow-Regular.woff2?18f2f5707779b4ab7d75be55f63b75e9) format("woff2"), url(/assets/fonts/Barlow-Regular.woff?b01be197bee9b9a37cae8069396bf69c) format("woff"); } @font-face{ font-family:"barlow-bold"; font-weight:100; src:url(/assets/fonts/Barlow-Bold.woff2?8bb7d2508e1369c8e08b3da2c21bf55f) format("woff2"), url(/assets/fonts/Barlow-Bold.woff?a8de7b19e6b093ca3c454afe8fcb2019) format("woff"); } @font-face{ font-family:"cocon-regular"; font-weight:normal; src:url(/assets/fonts/cocon-regular-webfont.woff2?d9001c237a5e8ef80d7a13c348871d6e) format("woff2"), url(/assets/fonts/cocon-regular-webfont.woff?577e859a5070520903b40655753164e1) format("woff"); } html{ font-size:100%; } body{ font-size:18px; font-family:"barlow-regular", arial, sans-serif; line-height:1.4; } button{ border:0 none; background-color:transparent; cursor:pointer; } img{ width:100%; max-width:-webkit-max-content; max-width:-moz-max-content; max-width:max-content; } #frise-autoscroll{ position:absolute; width:100%; height:100%; } #frise-autoscroll .img-frise{ position:relative; width:-webkit-max-content; width:-moz-max-content; width:max-content; margin:0 auto; display:flex; flex-direction:column; } #frise-autoscroll .img-frise .svg-mask{ position:-webkit-sticky; position:sticky; width:100%; height:100px; bottom:0; background-image:linear-gradient(to top, #ffffff, #ffffff, #ffffff, transparent); } #backtotop{ display:none; align-items:center; justify-content:center; position:fixed; bottom:20px; right:20px; width:40px; height:40px; border-radius:40px; background-color:#fccf1d; z-index:99; } #backtotop .arrow{ border:solid #fff; border-width:0 3px 3px 0; display:inline-block; padding:3px; } #backtotop .arrow.up{ transform:rotate(-135deg); } #search{ width:28px; height:28px; margin-left:25px; } .product ul.more li{ width:-webkit-max-content; width:-moz-max-content; width:max-content; } .product ul.more li p:first-of-type{ font-size:18px; } .product ul.more li::before{ top:30px; } ul.more{ margin-top:50px; } ul.more li{ align-items:center; position:relative; padding-left:25px; margin-bottom:30px; width:100%; } ul.more li:last-of-type{ margin-bottom:0; } ul.more li p:first-of-type{ position:relative; font-size:26px; } ul.more li::before{ content:""; position:absolute; left:0; top:20px; width:10px; height:10px; background-color:#222f5c; border-radius:50%; } ul.more li .label img{ width:100px; } ul.infos{ display:flex; justify-content:center; } ul.infos li{ justify-content:center; text-align:center; color:#222f5c; font-family:"barlow-bold", arial, sans-serif; } ul.infos span{ display:flex; justify-content:center; align-items:center; width:85px; height:85px; padding:20px; margin:20px auto; background-color:#fccf1d; border-radius:50%; } .offset-anchor{ position:relative; top:-100px; } .banner{ position:absolute; bottom:-1px; height:50px; width:100%; } .banner svg{ position:absolute; bottom:0; } @media screen and (min-width: 800px){ main{ padding-top:100px; } ul.infos li{ flex-basis:20%; } } @media screen and (max-width: 799px){ main{ padding-top:50px; } .product ul.more li::before{ top:10px; } } .container.news .sectiontitle{ margin-bottom:25px; } .container.news .sectiontitle h2{ margin-bottom:0; } .container{ padding-top:60px; padding-bottom:60px; } @media screen and (min-width: 1200px){ .wrapper, .wrapper-m{ margin-left:auto; margin-right:auto; } .wrapper{ width:1170px; max-width:1170px; } .wrapper-m{ width:900px; max-width:900px; } } @media (max-width: 1199px){ .wrapper, .wrapper-m{ width:100%; max-width:100%; padding-left:25px; padding-right:25px; } } .align-center{ text-align:center; } .align-left{ text-align:left; } .align-justify{ text-align:justify; } .bold{ font-weight:bold; } .on-bottom{ z-index:-1; } .ttu{ text-transform:uppercase; } .has-bckg--grey{ background-color:#f5f5f5; } .is-flex{ display:flex; } .is-flex.vertical-center{ align-items:center; } .is-flex.horizontal-center{ justify-content:center; } .is-flex.start{ align-items:flex-start; } .is-flex.wrap{ flex-wrap:wrap; } .is-flex.space-between{ justify-content:space-between; } .is-flex.flex-col{ flex-direction:column; } .mt-5{ margin-top:3rem; } .is-small{ margin-top:35px; margin-bottom:35px; font-size:12px; } .p-rel{ position:relative; } .p-abs{ position:absolute; } .p-abs.dual-center{ padding-left:0 !important; padding-right:0 !important; left:50% !important; top:50% !important; transform:translate(-50%, -50%) !important; } .color-red{ color:#ff0400; } .color-blue{ color:#222f5c; } .color-yellow{ color:#fccf1d; } .font-size-medium{ font-size:45px; } @media screen and (min-width: 800px){ .is-flex .w25{ flex-basis:25%; } .is-flex .w50{ flex-basis:50%; } .is-flex .w50:nth-child(2){ margin-left:35px; } .is-flex .w100{ flex-basis:100%; } .is-flex .w100:nth-child(1){ padding-right:185px; } .is-flex .w100:nth-child(2){ margin-left:35px; } } @media screen and (max-width: 799px){ .is-flex{ flex-direction:column; } .blue-products.is-flex{ flex-direction:initial; justify-content:center; } .smrt-align-center{ text-align:center; } } p{ margin-bottom:10px; } h1, .page-subtitle{ margin-bottom:25px; } h1, .sectiontitle, .page-subtitle{ position:relative; padding-bottom:20px; } .sectiontitle, .sectiontitle h2{ font-size:38px; } h1:not(.maintitle):after, .sectiontitle:after, .page-subtitle:after{ content:""; position:absolute; bottom:0; left:0; right:0; width:20px; height:2px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } h1.blue-line:not(.maintitle):after, .sectiontitle.blue-line:after, .page-subtitle.blue-line:after{ background-color:#222f5c; } h1.white-line:not(.maintitle):after, .sectiontitle.white-line:after, .page-subtitle.white-line:after{ background-color:white; } h1:not(.maintitle){ display:inline-block; position:relative; } .page-subtitle{ display:block; position:relative; margin-left:auto; margin-right:auto; } .maintitle{ font-family:"barlow-bold", arial, sans-serif; } .mascotte:before{ content:url(/assets/images/coq.png?2c2ffbd44b298f35a5b6247e137d2593); position:absolute; left:-450px; bottom:0; } .h2{ margin-bottom:0; font-family:"barlow-regular", arial, sans-serif; } h2:not(.punchline-module__title), h3:not(.product-card__title){ margin-bottom:25px; } h3:not(.product-card__title):not(:first-child){ margin-top:25px; } h3{ font-family:"barlow-bold", arial, sans-serif; } h3.product-card__title{ font-family:"cocon-regular", arial, sans-serif; } @media screen and (min-width: 800px){ h1:not(.title_page), .page-subtitle, h2{ font-size:48px; } h2, .h2, h3:not(.item__title, .product-card__title){ font-size:30px; } } @media screen and (max-width: 799px){ h1:not(.title_page), .page-subtitle{ font-size:32px; } h2{ font-size:18px; } h2, .h2, h3:not(.item__title, .product-card__title){ font-size:24px; } } .cta{ display:inline-block; min-width:180px; margin-top:25px; padding:15px; font-size:15px; font-family:"barlow-bold", arial, sans-serif; text-align:center; text-transform:uppercase; border:1px solid #fccf1d; background-color:#fff; border-radius:30px; } .cta:hover{ color:#fff; background-color:#fccf1d; } .link, .cta{ color:#fccf1d; text-decoration:none; } .breadcrumb{ --margin-breadcrumb:50px; position:absolute; flex-wrap:wrap; margin-left:var(--margin-breadcrumb); top:20px; align-items:center; max-width:25%; text-align:initial; color:#8b4437; font-size:calc(18px * 0.85); z-index:2; } .breadcrumb a:first-of-type{ margin-right:5px; } .breadcrumb a:nth-of-type(2){ margin-right:5px; margin-left:5px; } .breadcrumb:before{ position:absolute; left:calc(var(--margin-breadcrumb) * -1); content:url(/assets/images/arrow-back.jpg?b995a9d20eaaee831944babd9df5bbc4); } @media screen and (max-width: 799px){ .breadcrumb{ max-width:70%; top:-60px; right:0; justify-content:flex-end; flex-direction:initial; } .product-template .breadcrumb{ display:none; } } .site-header{ position:fixed; left:0; right:0; font-family:"barlow-bold", arial, sans-serif; background-color:#fccf1d; box-shadow:0 2px 8px rgba(12, 20, 23, 0.15); z-index:99; } .site-header svg .cls-1{ fill:#000; } .site-header svg .cls-2{ fill:transparent; } .site-header.blue-bg{ background-color:#222f5c; } .site-header.blue-bg svg .cls-1{ fill:#fff; } .site-header .wrapper{ display:flex; align-items:center; } .site-header .logotype{ top:0; left:1em; width:25%; z-index:1; } .site-header .logotype img{ width:200px; } .site-header > span{ width:25%; text-align:right; } .site-header nav li{ display:inline-block; } .site-header nav a{ color:#222f5c; text-decoration:none; } .site-header nav a:hover{ color:#ff0400; } .site-header .traduction{ display:flex; } .site-header .traduction li{ margin-right:15px; } .site-header .traduction li a{ color:#222f5c; text-transform:uppercase; text-decoration:none; } .site-header .traduction li.current a{ color:#ff0400; } .site-header .traduction li:last-of-type{ margin-right:0; } @media screen and (min-width: 800px){ .site-header .wrapper{ justify-content:space-between; height:100px; } .site-header.blue-bg nav a:not(.featured-link), .site-header.blue-bg .traduction li a{ color:white; } .site-header.blue-bg nav a:not(.featured-link):hover, .site-header.blue-bg .traduction li a:hover{ color:#ff0400; } } @media screen and (max-width: 799px){ .site-header .wrapper{ justify-content:flex-end; height:50px; } .site-header .logotype img{ width:100px; } } .menu-overlay__checkbox{ display:none; } #menu_arrow{ display:none; } @media screen and (min-width: 800px){ .menu{ width:40%; margin-left:300px; text-transform:uppercase; } .menu-overlay__btn{ display:none; } .menu .menu__list{ display:flex; justify-content:space-between; } .menu a{ display:inline-block; color:#222f5c; text-decoration:none; } .menu a:hover{ color:#ff0400; } .menu a.active{ position:relative; color:#ff0400; } .menu a.active:before{ content:""; position:absolute; top:-60px; left:0; right:0; width:75px; height:4px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } .menu .only-smrt{ display:none; } } @media screen and (max-width: 799px){ .menu{ order:2; } .menu .only-smrt a{ color:#ff0400; } .menu label{ display:flex; align-items:flex-start; justify-content:center; position:fixed; width:2.8em; height:2.8em; z-index:9999; } .menu__list{ display:none; } .menu__link{ display:flex; justify-content:space-between; padding:1em; border-bottom:solid 1px #0c1417; } .menu__link:last-child{ border-bottom-width:0; } .menu__link #menu_arrow{ display:block; width:50px; height:19px; transition:width 0.3s ease-in-out; } .menu__link:hover #menu_arrow{ width:12px; } .menu__link:hover #menu_arrow .cnt{ fill:#ff0400; } .menu .menu-overlay{ position:fixed; display:flex; right:0; z-index:100; } .menu .menu-overlay__icon{ display:block; position:relative; width:1.5em; height:0.1em; background:#fff; transition:0.4s; } .menu .menu-overlay__icon:after, .menu .menu-overlay__icon:before{ content:""; display:block; position:absolute; width:100%; height:0.1em; background:#fff; border-radius:2em; transition:0.4s; } .menu .menu-overlay__icon:before{ top:-10px; } .menu .menu-overlay__icon:after{ top:10px; } .menu .menu-overlay__btn{ display:flex; justify-content:center; align-items:center; top:0; right:20px; justify-content:center; cursor:pointer; } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon{ background:0 0; } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::before{ transform:rotate(45deg); } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::after{ transform:rotate(-45deg); } .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::after, .menu .menu-overlay__checkbox:checked ~ .menu-overlay__btn .menu-overlay__icon::before{ top:0; } .menu .menu-overlay__checkbox:checked ~ .menu__list{ display:flex; flex-direction:column; position:fixed; top:50px; left:0; width:100%; padding-top:1em; padding-left:1em; padding-right:1em; text-transform:uppercase; background-color:#fff; transition-delay:0s; box-shadow:0 2px 8px rgba(12, 20, 23, 0.2); } } .secondmenu{ display:flex; justify-content:flex-end; position:relative; } .secondmenu .search-form{ display:none; position:absolute; top:40px; } .secondmenu .search-form.is-visible{ display:initial; } @media screen and (max-width: 799px){ .secondmenu{ margin-right:3em; } } #picto-localisation{ left:-40px; width:25px; height:34px; margin-right:30px; } #picto-localisation .cls-1{ fill:#131414; } #picto-localisation .cls-2{ fill:transparent; } .footer-widgets{ align-items:center; } .footer-widgets .footer-widgets__content{ left:20%; right:0; } .footer-widgets .footer-widgets__content.white-color p{ color:white; } .footer-widgets .footer-widgets__content.white-color #picto-localisation .cls-1{ fill:white; } .footer-widgets img{ max-width:100%; } .footer-content{ color:#fff; font-size:15px; background-color:#fccf1d; } .footer-content.blue-bg{ background-color:#222f5c; } .footer-content ul{ margin-bottom:25px; } .footer-content a{ color:#fff; text-decoration:none; } .banner.footer{ top:-1px; transform:rotate(180deg); } @media screen and (min-width: 800px){ .footer-content ul li{ display:inline-block; margin-left:10px; margin-right:10px; } .footer-content ul li:first-child{ margin-left:0; } .footer-content ul li:last-child{ margin-right:0; } } @media screen and (max-width: 799px){ .footer-widgets{ height:200px; } .footer-widgets img{ height:100%; -o-object-fit:cover; object-fit:cover; opacity:0.2; } .footer-widgets .footer-widgets__content{ text-align:center; left:50%; transform:translateX(-50%); bottom:20px; } .footer-widgets .footer-widgets__content #picto-localisation{ top:-40px; left:50%; transform:translateX(-50%); } .footer-widgets .footer-widgets__content.white-color p{ color:black; } .footer-widgets .footer-widgets__content.white-color #picto-localisation .cls-1{ fill:black; } .footer-content ul li{ margin-bottom:10px; } } form{ font-size:16px; } input[type=text]{ border:0 none; } input[type=submit]{ min-width:180px; padding:15px; color:#fccf1d; background-color:transparent; font-weight:bold; text-align:center; text-transform:uppercase; border:1px solid #fccf1d; } .newsletter input[type=text], input[type=submit]{ border-radius:30px; } input[type=submit]{ cursor:pointer; } input[type=submit]:hover{ color:#fff; background-color:#fccf1d; } input[type=text], input[type=number], input[type=mail]{ padding:15px; font-size:15px; border:0 none; outline-color:#efefef; } textarea{ width:100%; max-width:100%; margin-top:30px; margin-bottom:30px; } .form-row{ display:flex; padding-top:30px; padding-bottom:30px; } .form-group{ display:flex; padding-bottom:2px; width:100%; max-width:100%; border-bottom:solid 1px #0c1417; } .form-group input[type=text], .form-group input[type=number], .form-group input[type=mail]{ flex-grow:2; } .form-group:first-of-type{ margin-left:0; } .form-group:last-of-type{ margin-right:0; } fieldset{ margin-top:45px; border:0 none; } fieldset legend{ margin-bottom:30px; font-weight:bold; } .radio-label{ position:relative; padding-left:20px; margin-right:25px; cursor:pointer; } .radio-label input{ -webkit-appearance:none; -moz-appearance:none; appearance:none; } .checkmark{ position:absolute; top:3px; left:0; right:10px; height:12px; width:12px; background-color:#fff; border:solid 1px #fccf1d; border-radius:50%; } .radio-label:hover input ~ .checkmark{ background-color:#fccf1d; } .radio-label input:checked ~ .checkmark{ background-color:#fff; } .checkmark:after{ content:""; position:absolute; display:none; } .radio-label input:checked ~ .checkmark:after{ display:block; } .radio-label .checkmark:after{ top:2px; left:2px; width:6px; height:6px; border-radius:50%; background-color:#fccf1d; } .ck-button{ margin-bottom:45px; } .ck-button label{ margin-right:10px; } .ck-button label:last-child{ margin-right:0; } .ck-button label span{ padding:10px; margin-right:10px; border:1px solid #0c1417; border-radius:40px; cursor:pointer; } .ck-button label span:last-child{ margin-right:0; } .ck-button label span:hover{ color:#fff; border-color:#fccf1d; background-color:#fccf1d; } .ck-button label input{ position:absolute; left:-20px; } .ck-button input:checked + span{ background-color:#fccf1d; color:#fff; border-color:#fff; } .swap{ visibility:hidden; } .swap:after{ cursor:pointer; visibility:visible; content:""; font-size:calc(var(--swap-size) - 2.5rem); display:inline-block; width:var(--swap-size); height:var(--swap-size); padding:0.5rem; border:1px solid #fccf1d; border-radius:0.4em; background-color:#fff; display:flex; justify-content:center; align-items:center; } .swap:checked:after{ content:""; background-color:#fccf1d; } @media screen and (min-width: 800px){ .newsletter input[type=text]{ width:430px; } .form-group{ align-items:center; margin-left:15px; margin-right:15px; } } @media screen and (max-width: 799px){ input[type=text], input[type=submit]{ display:block; margin-left:auto; margin-right:auto; } form, input[type=text]{ width:100%; max-width:100%; } input[type=submit]{ margin-top:25px; } .form-row, .form-group{ flex-direction:column; } .form-group{ margin-bottom:25px; } .form-group:last-child{ margin-bottom:0; } .ck-button label span{ display:inline-block; margin-bottom:5px; } } .product-card, .gamme-card{ display:flex; position:relative; height:375px; margin-bottom:20px; overflow:hidden; } .product-card > img, .gamme-card > img{ display:block; width:100%; height:100%; -o-object-fit:cover; object-fit:cover; max-width:none; } .product-card a, .gamme-card a{ top:0; z-index:9; } .product-card .overlay, .gamme-card .overlay{ display:flex; align-items:center; justify-content:center; position:absolute; width:100%; height:50%; font-weight:bold; transition:bottom 0.4s; } .product-card .product-card__title, .product-card a{ position:absolute; right:0; bottom:0; left:0; } .product-card .product-card__title{ padding:1em 0.2em; background-color:rgba(255, 255, 255, 0.5); } .product-card .overlay{ bottom:-200px; } .product-card .overlay span{ width:50%; padding-top:1em; padding-bottom:1em; background-color:#fff; border-radius:2em; } .product-card:hover .overlay{ bottom:0; } .gamme-card .gamme-card__title, .gamme-card a{ position:absolute; right:0; bottom:0; left:0; } .gamme-card .gamme-card__title{ padding:1em 0.2em; background-color:rgba(255, 255, 255, 0.5); } .gamme-card .overlay{ bottom:-50px; } .gamme-card .overlay span{ color:#fff; font-size:30px; font-family:"barlow-bold", arial, sans-serif; } .gamme-card:hover .overlay{ bottom:50px; } #list .wrapper > div:first-child{ padding-top:0; } #list .title{ color:#fff; font-size:calc(18px * 3.25); } #list .is-flex{ margin-bottom:60px; -moz-column-gap:20px; column-gap:20px; flex-wrap:wrap; flex-direction:initial; } #list .section-header{ margin-bottom:30px; color:#fff; } #list .section-header .title{ margin-bottom:5px; } #list .section-header .content{ top:30px; padding-left:30px; padding-right:30px; } #list .section-header > img{ -o-object-fit:cover; object-fit:cover; max-height:243px; } .overlay span{ color:#8b4437; } #posts{ position:relative; } #posts .sectiontitle:after{ content:""; background-color:#0c1417; } .posts-list{ width:1120px; margin:0 auto; justify-content:center; align-items:center; flex-wrap:wrap; -moz-column-gap:20px; column-gap:20px; } .post-card{ width:360px; margin-bottom:50px; } @media (min-width: 769px){ .product-card{ width:32%; max-width:32%; } .posts-list{ align-items:initial; } .gamme-card:nth-child(n){ width:32%; max-width:32%; } .gammes-3 .gamme-card:nth-child(1), .gammes-3 .gamme-card:nth-child(2), .gammes-3 .gamme-card:nth-child(3), .gammes-3 .gamme-card:nth-child(4), .gammes-3 .gamme-card:nth-child(5), .gammes-3 .gamme-card:nth-child(6), .gammes-3 .gamme-card:nth-child(7), .gammes-3 .gamme-card:nth-child(8), .gammes-3 .gamme-card:nth-child(9), .gammes-6 .gamme-card:nth-child(1), .gammes-6 .gamme-card:nth-child(2), .gammes-6 .gamme-card:nth-child(3), .gammes-6 .gamme-card:nth-child(4), .gammes-6 .gamme-card:nth-child(5), .gammes-6 .gamme-card:nth-child(6), .gammes-6 .gamme-card:nth-child(7), .gammes-6 .gamme-card:nth-child(8), .gammes-6 .gamme-card:nth-child(9), .gammes-9 .gamme-card:nth-child(1), .gammes-9 .gamme-card:nth-child(2), .gammes-9 .gamme-card:nth-child(3), .gammes-9 .gamme-card:nth-child(4), .gammes-9 .gamme-card:nth-child(5), .gammes-9 .gamme-card:nth-child(6), .gammes-9 .gamme-card:nth-child(7), .gammes-9 .gamme-card:nth-child(8), .gammes-9 .gamme-card:nth-child(9){ width:32%; max-width:32%; } .gammes-1 .gamme-card:nth-child(1), .gammes-1 .gamme-card:nth-child(2), .gammes-1 .gamme-card:nth-child(3), .gammes-1 .gamme-card:nth-child(4), .gammes-2 .gamme-card:nth-child(1), .gammes-2 .gamme-card:nth-child(2), .gammes-2 .gamme-card:nth-child(3), .gammes-2 .gamme-card:nth-child(4), .gammes-4 .gamme-card:nth-child(1), .gammes-4 .gamme-card:nth-child(2), .gammes-4 .gamme-card:nth-child(3), .gammes-4 .gamme-card:nth-child(4){ width:49%; max-width:49%; } .gammes-5 .gamme-card:nth-child(4), .gammes-5 .gamme-card:nth-child(5), .gammes-8 .gamme-card:nth-child(4), .gammes-8 .gamme-card:nth-child(5){ width:49%; max-width:49%; } .gammes-7 .gamme-card:nth-child(1), .gammes-7 .gamme-card:nth-child(2), .gammes-7 .gamme-card:nth-child(6), .gammes-7 .gamme-card:nth-child(7){ width:49%; max-width:49%; } #list .section-header .content{ position:absolute; width:100%; padding-top:1rem; padding-bottom:1rem; } #posts > img{ position:absolute; top:0; left:0; z-index:-1; -o-object-fit:cover; object-fit:cover; } } @media (max-width: 1024px){ #list .section-header{ margin-bottom:80px; } #list .is-flex{ justify-content:center; } } @media (max-width: 1200px){ .posts-list{ width:100%; } } @media (max-width: 768px){ #list .section-header .content{ position:relative; } #posts > img{ position:absolute; top:0; left:0; height:14%; z-index:-1; -o-object-fit:cover; object-fit:cover; } .post-card{ width:100%; max-width:360px; } } @media (max-width: 480px){ #posts > img{ height:8%; } } .punchline-module{ color:#fccf1d; } @media screen and (min-width: 800px){ .punchline-module h2{ font-size:42px; } } @media screen and (max-width: 799px){ .punchline-module h2{ font-size:24px; } } .newsletter .wrapper{ justify-content:space-between; align-items:center; } .animate__animated{ opacity:0; } .animate__animated.reveal-visible{ opacity:1; } .jumbotron{ font-family:"barlow-bold", arial, sans-serif; position:relative; z-index:1; overflow:hidden; } .jumbotron img{ transition:scale 0.3s ease-in-out; } .jumbotron img.zoomed{ scale:1.05; } .jumbotron .item__title{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:-webkit-max-content; width:-moz-max-content; width:max-content; display:flex; align-items:center; justify-content:center; color:#fff; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; position:absolute; height:60%; background-color:#fff; box-shadow:0 2px 8px rgba(12, 20, 23, 0.6); } .jumbotron .item__title:before{ left:0; } .jumbotron .item__title:after{ right:0; } #carrousel1 .carrousel{ overflow:hidden; outline-color:transparent; } #carrousel1 .carrousel .carrousel__container{ transition:transform 0.3s; transform:translateZ(0); } #carrousel1 .carrousel .carrousel__container:after{ content:""; clear:both; display:table; } #carrousel1 .carrousel .carrousel__item{ float:left; } #carrousel1 .carrousel .item{ display:flex; align-items:center; justify-content:center; position:relative; } #carrousel1 .carrousel .item img{ display:block; width:100%; height:auto; } #carrousel1 .carrousel .item > a{ position:absolute; top:0; right:0; bottom:0; left:0; } #carrousel1 .carrousel .item:hover .item__link{ background-color:#fccf1d; } #carrousel1 .carrousel .item__image{ width:100%; overflow:hidden; } #carrousel1 .carrousel .item__link{ display:inline-flex; align-items:center; justify-content:center; position:absolute; right:0; top:0; bottom:0; padding:1em; color:#fff; background-color:#fccf1d; font-size:calc(18px * 0.65); font-weight:700; text-transform:uppercase; transition:background-color 0.3s; } #carrousel1 .carrousel .item__link p{ margin-bottom:0; } .carrousel, .items{ position:relative; } .carrousel__next, .carrousel__prev{ position:absolute; width:2.3em; height:2.3em; background:url(/assets/images/caroussel_arrow-right.png?2cdf04a1096a17958e8415beae962d71) 50% no-repeat; background-size:contain; border-radius:50%; top:50%; margin-top:-1.2em; right:1.2em; cursor:pointer; transition:transform 0.3s, opacity 0.3s; } .carrousel__prev{ background-image:url(/assets/images/caroussel_arrow-left.png?a70304ae9c1add15f69f786c16cf5c1c); right:auto; left:1.2em; } .carrousel__next--hidden, .carrousel__prev--hidden{ opacity:0; } .carrousel__next:hover, .carrousel__prev:hover{ transform:scale(1.2); } .carrousel__pagination{ display:block; position:absolute; bottom:100px; left:0; right:0; text-align:center; display:none; } .carrousel__pagination__button{ width:18px; height:18px; border-radius:50%; display:inline-block; margin:0 20px; border:solid 2px #222f5c; cursor:pointer; } .carrousel__pagination__button--active, .carrousel__pagination__button:hover{ background-color:#222f5c; } @media screen and (min-width: 800px){ #carrousel1 .carrousel__pagination{ display:block; } .jumbotron .item__title{ width:770px; font-size:60px; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; width:7px; } } @media screen and (max-width: 799px){ .jumbotron .item__title{ padding-left:1em; padding-right:1em; font-size:26px; } .jumbotron .item__title:before, .jumbotron .item__title:after{ content:""; width:4px; } } #carrousel2{ margin-top:2rem; } #carrousel2 .carrousel{ padding-bottom:1.5em; overflow:hidden; outline-color:transparent; } #carrousel2 .carrousel .carrousel__container{ transition:transform 0.3s; transform:translateZ(0); } #carrousel2 .carrousel .carrousel__container:after{ content:""; clear:both; display:table; } #carrousel2 .carrousel .carrousel__item{ float:left; } #carrousel2 .carrousel .item{ display:flex; align-items:center; justify-content:center; position:relative; } #carrousel2 .carrousel .item img{ display:block; width:100%; height:auto; } #carrousel2 .carrousel .item > a{ position:absolute; top:0; right:0; bottom:0; left:0; } #carrousel2 .carrousel .item:hover .item__link{ background-color:#fccf1d; } #carrousel2 .carrousel .item__body{ flex-basis:60%; padding:90px; color:#fff; background-color:#0c1417; } #carrousel2 .carrousel .item__title{ position:relative; padding-bottom:20px; color:#fccf1d; font-size:16px; } #carrousel2 .carrousel .item__title:after{ content:""; position:absolute; bottom:0; left:0; right:0; width:20px; height:2px; margin-left:auto; margin-right:auto; background-color:#fccf1d; } #carrousel2 .carrousel .item__link{ display:inline-flex; align-items:center; justify-content:center; position:absolute; right:0; top:0; bottom:0; padding:1em; color:#fff; background-color:#fccf1d; font-size:calc(18px * 0.65); font-weight:700; text-transform:uppercase; transition:background-color 0.3s; } #carrousel2 .carrousel .item__link p{ margin-bottom:0; } .carrousel, .items{ position:relative; } .carrousel__next, .carrousel__prev{ position:absolute; width:2.3em; height:2.3em; background:url(/assets/images/caroussel_arrow-right.png?2cdf04a1096a17958e8415beae962d71) 50% no-repeat; background-size:contain; border-radius:50%; top:50%; margin-top:-1.2em; right:0; cursor:pointer; transition:transform 0.3s, opacity 0.3s; } .carrousel__prev{ background-image:url(/assets/images/caroussel_arrow-left.png?a70304ae9c1add15f69f786c16cf5c1c); right:auto; left:0; } .carrousel__next--hidden, .carrousel__prev--hidden{ opacity:0; } .carrousel__next:hover, .carrousel__prev:hover{ transform:scale(1.2); } #carrousel2 .carrousel__pagination{ position:absolute; bottom:30px; right:0; text-align:center; display:none; } #carrousel2 .carrousel__pagination__button{ background-color:rgba(252, 207, 29, 0.5); width:14px; height:14px; border-radius:50%; display:inline-block; margin:0 3px; cursor:pointer; } #carrousel2 .carrousel__pagination__button--active, #carrousel2 .carrousel__pagination__button:hover{ background-color:#fccf1d; } @media screen and (min-width: 800px){ #carrousel2 .carrousel__pagination{ display:block; } } @media screen and (max-width: 799px){ #carrousel2 .carrousel .item__body{ padding:2em; text-align:center; } #carrousel2 .carrousel .item__title .secondtitle{ padding-right:5em; font-size:calc(18px * 0.9); } #carrousel2 .carrousel .item img{ width:70%; margin-left:auto; margin-right:auto; } } .timeline{ position:relative; max-width:1200px; margin:4rem auto 0; } .timeline .year{ display:inline-block; padding:15px 30px; margin-bottom:10px; font-size:43px; color:#fff; border-radius:50px; } .timeline .step > img{ width:50%; } .timeline .step.is-flex{ width:520px; } .timeline .step.is-flex .year{ margin-right:20px; } .timeline .step.special > img{ display:block; width:60%; margin-bottom:20px; margin-left:30%; } .timeline .step .step_content{ background-color:#fff; } .timeline .step .step_title{ margin-bottom:10px; } .timeline .step .step_title:nth-child(odd){ color:#ff0400; } .timeline .step .step_title:nth-child(even){ color:#222f5c; } .timeline .step:not(:last-child){ margin-bottom:2rem; } .timeline .step:nth-child(odd) .step_title{ color:#ff0400; } .timeline .step:nth-child(even) .step_title{ color:#222f5c; } .timeline .step:nth-child(odd) .year{ background-color:#ff0400; } .timeline .step:nth-child(even) .year{ background-color:#222f5c; } @media screen and (min-width: 800px){ .timeline{ z-index:0; } .timeline #frise-autoscroll{ top:3rem; } .timeline .step{ width:400px; } .timeline .step.is-flex{ width:520px; } .timeline .left{ left:0; } .timeline .right{ left:50%; } } @media screen and (max-width: 799px){ .timeline #frise-autoscroll{ display:none; } .timeline .step{ width:100%; } .timeline .step.is-flex{ width:100%; } } .jumbotron{ position:relative; display:flex; align-items:center; justify-content:center; } .jumbotron .maintitle{ position:absolute; color:#fff; text-align:center; text-shadow:0 2px 8px rgba(12, 20, 23, 0.6); z-index:1; } .jumbotron .maintitle .title-icon{ display:flex; align-items:center; justify-content:center; background-color:#fccf1d; width:120px; height:120px; margin-left:auto; margin-right:auto; padding:20px; border-radius:50%; } .jumbotron img{ max-width:100%; } #products, #values{ display:flex; align-items:center; justify-content:center; position:relative; } #products > img, #values > img{ position:absolute; top:0; left:0; z-index:-1; -o-object-fit:cover; object-fit:cover; } #products .sectiontitle h2{ margin-bottom:0; } #products .sectiontitle:after{ content:""; background-color:#0c1417; } #products > img{ height:80%; } #products .product-item{ display:flex; align-items:center; flex:1; margin-right:60px; transition:transform 0.2s; } #products .product-item:last-child{ margin-right:0; } #products .product-item:hover{ transform:scale(1.1); } #products .product-item img{ width:265px; } #products .products-list{ margin-top:20px; } #values .sectiontitle:after{ content:""; background-color:#0c1417; } #values .sectiontitle.white-line:after{ background-color:white; } #values > img{ height:110%; max-width:100%; } #values ul{ display:flex; justify-content:space-between; } #values .values-content{ width:1000px; margin-bottom:50px; } #values .values-list{ margin-top:100px; } #values .values-list .item{ display:inline-flex; flex-direction:column; justify-content:center; align-items:center; flex:1; font-family:"barlow-bold", arial, sans-serif; } #values .values-list .item img{ width:70px; height:70px; margin-bottom:20px; -o-object-fit:contain; object-fit:contain; } #reassurances{ margin-bottom:60px; } #reassurances ul{ display:flex; flex-wrap:wrap; } #reassurances ul li{ display:inline-flex; flex-direction:column; align-items:center; color:#222f5c; font-family:"barlow-bold", arial, sans-serif; } #reassurances img{ max-width:70px; height:auto; margin-right:10px; } #reassurances .number{ color:#ff0400; font-size:calc(18px * 4); } .video-wrapper{ display:none; } .cuisto{ position:absolute; left:0; top:0; } .plan, .phone{ padding-left:80px; } .plan p:first-of-type, .phone p:first-of-type{ font-size:calc(18px * 1.1); } .plan p:nth-of-type(2), .phone p:nth-of-type(2){ color:#999999; font-size:calc(18px * 0.85); line-height:1.5; } .advice-img{ min-width:270px; } .blue header{ background-color:#222f5c; } .blue .cta, .blue .link{ color:#222f5c; } .blue .cta{ border-color:#222f5c; } .blue .cta:hover{ color:#fff; background-color:#222f5c; } .blue #values{ color:#fff; } .blue #values .item:nth-of-type(even){ color:#ff0400; } .blue .product-card .overlay{ background-color:rgba(34, 47, 92, 0.8); } .blue .product-card .overlay span{ color:#222f5c; } .blue .traduction li a{ color:#fff; } .blue .traduction li.current a{ color:#ff0400; } .blue .featured-link{ color:#ff0400; } .blue-bg .featured-link{ background-image:url(/assets/images/food-service-active.png?2e2bf7035544edbac65d65338c1fbd7c); background-position:center top; } .best{ display:flex; align-items:center; font-family:"barlow-bold", arial, sans-serif; } .mt50{ margin-top:50px; } .mb50{ margin-bottom:50px; } .has-label{ position:relative; } .has-label:before{ content:""; position:absolute; right:20px; top:unset; bottom:-280px; width:11vw; height:15vw; max-width:130px; background-image:url(/assets/images/Logo_MadeInFrance.jpg?caa24dd8d843129d80d8cdfc7ccfb1b6); background-repeat:no-repeat; background-size:contain; } @media screen and (min-width: 800px){ .jumbotron .maintitle{ font-size:calc(18px * 3.25); } .blue .menu .menu__item a{ color:#fff; } .has-label:before{ top:25px; bottom:unset; } .has-chicken-path{ position:relative; } .has-chicken-path:before{ content:url(/assets/images/empreintes.png?a2c7cc1a99b8e4e1302c7b327fdafed7); position:absolute; left:20px; top:-20px; } .bckg-illustration:after{ content:url(/assets/images/cuisinier.jpg?baaefbda5b45a25efacd1962934e1ccd); position:absolute; top:-110px; right:60px; width:300px; height:300px; z-index:-1; } .featured-link{ bottom:-63px; right:-250px; width:280px; padding-top:37px; padding-bottom:35px; line-height:1; color:#222f5c; background-image:url(/assets/images/food-service.png?0516f121d7754c28b2cb3055ce991861); background-repeat:no-repeat; background-position:center 12px; } .featured-link:hover{ background-image:url(/assets/images/food-service-active.png?2e2bf7035544edbac65d65338c1fbd7c); background-position:center top; } .featured-link span{ display:block; font-size:12px; } #reassurances ul{ justify-content:space-between; } #reassurances ul li{ width:30%; } #values .values-list{ margin-top:100px; } .desk-mt180{ margin-top:180px; } .desk-mr10{ margin-right:10px; } .desk-mr18{ margin-right:80px; } .desk-mt-n15{ margin-top:-15px; } .desk-mt-n80{ margin-top:-80px; } .desk-mt-n95{ margin-top:-95px; } .desk-ml-150{ margin-left:150px; } .desk-mt-120{ margin-top:120px; } .desk-mt50{ margin-top:50px; } .desk-mb-80{ margin-bottom:80px !important; } .best{ padding-top:100px; padding-left:145px; } .best:before{ content:url(/assets/images/personnage.png?afab50b1fecf5fd0149a8216117dd5a8); position:absolute; left:0; z-index:-1; } .best span:first-of-type{ margin-right:10px; color:#ff0400; font-size:6vw; } .best span:nth-of-type(2){ margin-top:1rem; color:#222f5c; font-size:4vw; } .reduice-img img{ width:65%; max-width:65%; margin-top:-100px; } } @media screen and (min-width: 1200px){ .best span:first-of-type{ font-size:90px; } .best span:nth-of-type(2){ font-size:55px; } } @media screen and (max-width: 799px){ .jumbotron .maintitle{ font-size:calc(18px * 1.8); } .blue > .menu .menu__item a{ color:#fff; } #products .product-item{ margin-right:0; } #products .product-item img{ margin:1rem auto; } #values ul{ flex-direction:column; align-items:center; } .has-label:before{ width:130px; height:190px; right:unset; left:50%; transform:translateX(-50%); top:unset; bottom:-285px; } .featured-link{ display:none; } #reassurances ul{ flex-direction:column; } .reassurance-item:not(:first-child){ margin-top:30px; } #values .values-list{ margin-top:50px; flex-wrap:wrap; } #values .values-list .item{ width:50%; margin-bottom:3em; } .best span:first-of-type{ margin-right:10px; color:#ff0400; font-size:45px; } .best span:nth-of-type(2){ color:#222f5c; font-size:32px; } .smrt-mb-100{ margin-bottom:100px !important; } .smrt-mb-200{ margin-bottom:200px !important; } .smrt-order{ display:flex; flex-direction:column; align-items:flex-start; } .smrt-order img{ order:3; } .smrt-order span{ order:0; } } :root{ --primary-color:#d4021d; --secondary-color:#707070; --background-color:#ffffff; --title-font:"Satisfy", sans-serif; --title-size:30px; --text-font:"Barlow", sans-serif; --text-size:16px; --accept-color:#33aa33; --deny-color:#aa3333; --ck-bg-color:var(--background-color); --ck-w1-bgcolor-title:var(--background-color); --ck-w1-font-family-title:var(--title-font); --ck-w1-font-size-title:var(--title-size); --ck-w1-color-title:#000000; --ck-w1-font-family-txt:var(--text-font); --ck-w1-font-size-txt:var(--text-size); --ck-w1-color-txt:var(--primary-color); --ck-w1-color-href-hover:var(--secondary-color); --ck-w1-color-btn:var(--primary-color); --ck-w1-color-btn-hover:var(--secondary-color); --ck-w1-font-family-btn-txt:var(--text-font); --ck-w1-font-size-btn-txt:var(--text-size); --ck-w1-color-btn-txt:#ffffff; --ck-w1-color-btn-txt-hover:#ffffff; --ck-w1-color-btn-border:transparent; --ck-w1-color-btn-border-hover:transparent; --ck-bg-color-modal-wrapper:#ffffff; --ck-w2-bgcolor-title:var(--primary-color); --ck-w2-font-family-title:var(--title-font); --ck-w2-font-size-title:var(--title-size); --ck-w2-color-title:#ffffff; --ck-w2-font-family-txt:var(--text-font); --ck-w2-font-size-txt:var(--text-size); --ck-w2-color-txt:#ffffff; --ck-w2-color-href-hover:#000000; --ck-color-accept:#808080; --ck-color-accept-hover:var(--accept-color); --ck-color-deny:#808080; --ck-color-deny-hover:var(--deny-color); --ck-color-txt:#ffffff; --ck-color-txt-hover:#ffffff; --ck-bgcolor-list:#e4e4e4; --ck-font-family-list:var(--text-font); --ck-font-size-list:var(--text-size); --ck-color-list:#000000; } #ldcweb-cn *, #ldcweb-cn *::before, #ldcweb-cn *::after{ padding:0; margin:0; box-sizing:border-box; } #template{ display:none; } #ldcweb-cn.open-banner .ldcweb-cn-banner{ display:flex; } #ldcweb-cn.open-modal #ldcweb-cn-modal{ display:flex; } #ldcweb-cn.open-banner, #ldcweb-cn.open-modal{ display:flex; } #ldcweb-cn{ display:none; flex-direction:column; justify-content:flex-end; position:fixed; left:0; right:0; top:0; bottom:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:99999999999; opacity:1; line-height:initial; } #ldcweb-cn p, #ldcweb-cn a{ font-family:var(--ck-w1-font-family-txt); font-size:var(--ck-w1-font-size-txt); color:var(--ck-w1-color-txt); } #ldcweb-cn a{ text-decoration:underline; transition:color 0.5s; } #ldcweb-cn a:hover{ color:var(--ck-w1-color-href-hover); } #ldcweb-cn .ldcweb-cn-banner, #ldcweb-cn-modal .modal-wrapper{ overflow:auto; display:flex; flex-direction:column; align-items:center; } #ldcweb-cn .ldcweb-cn-banner{ display:none; padding:6vw 10vw; max-height:50vh; box-shadow:0px 5px 10px -5px #000 inset; background-color:var(--ck-bg-color); } #ldcweb-cn .ldcweb-cn-banner div:not(:last-child){ margin-bottom:4vw; } #ldcweb-cn .banner-img{ flex:1; max-width:200px; } #ldcweb-cn .banner-img img{ width:100%; } #ldcweb-cn .col{ flex:2; } #ldcweb-cn .banner-title p{ font-family:var(--ck-w1-font-family-title); font-size:var(--ck-w1-font-size-title); font-weight:bold; color:var(--ck-w1-color-title); text-align:center; } #ldcweb-cn .banner-txt{ text-align:center; } #ldcweb-cn .btns{ flex:1; display:flex; flex-direction:column; } #ldcweb-cn .btns .btn{ display:block; padding:1em; text-align:center; min-width:12em; width:100%; line-height:0; background-color:var(--ck-w1-color-btn); text-decoration:none; font-family:var(--ck-w1-font-family-btn-txt); font-size:var(--ck-w1-font-size-btn-txt); color:var(--ck-w1-color-btn-txt); transition:all 0.5s; } #ldcweb-cn .btns .btn:hover{ background-color:var(--ck-w1-color-btn-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); color:var(--ck-w1-color-btn-txt-hover); } #ldcweb-cn-modal{ display:none; align-items:center; justify-content:center; position:fixed; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:200; background:rgba(0, 0, 0, 0.7); opacity:1; } #ldcweb-cn-modal .modal-wrapper{ position:relative; background-color:var(--ck-bg-color-modal-wrapper); max-height:100vh; } #ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type){ width:100%; } #ldcweb-cn-modal .modal-btn-close{ position:absolute; right:0; top:0; width:5vw; height:6vw; display:flex; justify-content:center; align-items:center; } #ldcweb-cn-modal .modal-btn-close a{ width:100%; height:100%; display:flex; justify-content:center; align-items:center; font-family:Arial, Helvetica, sans-serif; font-size:medium; font-weight:bold; color:var(--ck-w2-color-title); background-color:var(--ck-w2-bgcolor-title); text-decoration:none; border-radius:0 0 0 50%; transition:all 0.5s; } #ldcweb-cn-modal .modal-btn-close a:hover{ color:#000000; background-color:#808080; background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); box-shadow:-1px 1px 10px -4px #000; } #ldcweb-cn-modal .modal-title, #ldcweb-cn-modal .modal-all{ background-color:var(--ck-w2-bgcolor-title); } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div, #ldcweb-cn-modal .modal-all{ display:flex; flex-direction:column; align-items:center; } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div a, #ldcweb-cn-modal .modal-all p, #ldcweb-cn-modal .modal-all a{ font-family:var(--ck-w2-font-family-txt); font-size:var(--ck-w2-font-size-txt); color:var(--ck-w2-color-txt); text-align:center; } #ldcweb-cn-modal .modal-title > div a:hover, #ldcweb-cn-modal .modal-all a:hover{ color:var(--ck-w2-color-href-hover); } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:4vw; } #ldcweb-cn-modal .modal-title .title{ font-family:var(--ck-w2-font-family-title); font-size:var(--ck-w2-font-size-title); font-weight:bold; color:var(--ck-w2-color-title); text-align:center; } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ content:""; display:block; width:90%; height:2px; margin:4vw auto; background-color:rgba(255, 255, 255, 0.5); } #ldcweb-cn-modal .modal-title a{ width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 4vw 4vw; } #ldcweb-cn-modal .modal-all .all-buttons{ display:flex; flex-direction:column; align-items:center; } #ldcweb-cn-modal .modal-all .all-buttons > div{ width:calc(100% + 15vw); margin:2vw 0 0; } #ldcweb-cn-modal .modal-all a{ display:block; padding:3vw 0; color:var(--ck-color-txt); text-decoration:none; transition:all 0.5s; } #ldcweb-cn-modal .all-buttons > div.accept > a.active{ background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .all-buttons > div.deny > a.active{ background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-all > div > div:first-of-type a{ background-color:var(--ck-color-accept); } #ldcweb-cn-modal .modal-all > div > div:last-of-type a{ background-color:var(--ck-color-deny); } #ldcweb-cn-modal .modal-all > div > div:first-of-type a:hover{ color:var(--ck-color-txt-hover); background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-all > div > div:last-of-type a:hover{ color:var(--ck-color-txt-hover); background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:2vw 0; } #ldcweb-cn-modal .modal-details ul{ display:flex; flex-direction:column; } #ldcweb-cn-modal .modal-details li > div{ display:flex; flex-direction:column; justify-content:space-between; margin:2vw 0; padding:2vw 4vw; background-color:var(--ck-bgcolor-list); } #ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li a, #ldcweb-cn-modal .modal-details li label{ font-family:var(--ck-font-family-list); font-size:var(--ck-font-size-list); color:var(--ck-color-list); } #ldcweb-cn-modal .modal-details li a:hover{ color:var(--secondary-color); } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos{ display:flex; flex-direction:column; flex:1; } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ font-size:calc(var(--ck-font-size-list) * 1.25); font-weight:bold; } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos a{ width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ display:flex; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type{ transition:all 0.5s; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin-right:2vw; background:var(--ck-color-accept); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type{ background:var(--ck-color-deny); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:25vw; margin:2vw 0; display:table; text-align:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type:hover, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type:hover{ cursor:pointer; background:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:hover > label{ color:var(--ck-color-txt-hover); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input:checked ~ label, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input ~ label.active{ background-color:var(--ck-color-accept-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input:checked ~ label, #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input ~ label.active{ background-color:var(--ck-color-deny-hover); background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5)); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons input{ display:none; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ display:block; padding:1.5vw 0; color:var(--ck-color-txt); transition:color 0.5s; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label:hover{ cursor:pointer; color:var(--ck-color-txt-hover); } @media only screen and (min-width: 768px){ #ldcweb-cn .ldcweb-cn-banner{ padding-top:4vw; padding-bottom:4vw; } #ldcweb-cn .btns{ flex-direction:row; } #ldcweb-cn .btns > div:first-child, #ldcweb-cn .btns > div:last-child{ margin-top:0; } #ldcweb-cn .btns > div:not(:last-child){ margin:0 2vw 0 0; } #ldcweb-cn-modal .modal-wrapper{ width:90vw; } #ldcweb-cn-modal .modal-all{ flex-direction:row; justify-content:space-between; } #ldcweb-cn-modal .modal-all a{ padding:2vw 0; } #ldcweb-cn-modal .modal-all .all-buttons > div{ margin:0; } #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{ margin:1vw 0 0; } #ldcweb-cn-modal .modal-all a{ width:30vw; } #ldcweb-cn-modal .modal-details li > div{ flex-direction:row; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:column; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:20vw; margin:0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 0 1vw; } } @media only screen and (min-width: 1024px){ #ldcweb-cn .ldcweb-cn-banner{ flex-direction:row; align-items:flex-start; justify-content:space-between; padding:2vw 3vw; } #ldcweb-cn .ldcweb-cn-banner div:not(:last-child){ margin:0 0 0.5em 0; } #ldcweb-cn .ldcweb-cn-banner > div:not(:last-child){ margin:0 4vw 0 0; } #ldcweb-cn .ldcweb-cn-banner .banner-img{ height:100%; display:flex; align-items:center; } #ldcweb-cn .banner-img img{ height:-webkit-fit-content; height:-moz-fit-content; height:fit-content; } #ldcweb-cn .banner-txt{ text-align:start; } #ldcweb-cn .btns{ height:100%; flex-direction:column; justify-content:center; } #ldcweb-cn .btns > div:first-child .btn{ margin:0; } #ldcweb-cn-modal .modal-wrapper{ width:80vw; } #ldcweb-cn-modal .modal-btn-close{ width:3vw; height:3vw; } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:2vw; } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ margin:2vw auto; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 2vw 2vw; } #ldcweb-cn-modal .modal-all a{ padding:1.5vw 0; } #ldcweb-cn-modal .modal-all .all-buttons{ flex-direction:row; } #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{ margin:0 1vw 0 0; } #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{ margin:0; } #ldcweb-cn-modal .modal-all a{ width:22vw; } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:1vw 0; } #ldcweb-cn-modal .modal-details li > div{ margin:1vw 0; padding:2vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:row; align-items:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:10vw; margin:0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 1vw 0; } } @media only screen and (min-width: 1440px){ #ldcweb-cn .col{ flex:4; } #ldcweb-cn-modal .modal-wrapper{ width:60vw; } #ldcweb-cn-modal .modal-btn-close{ width:2vw; height:2vw; } #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{ margin:0 1vw 0 0; } #ldcweb-cn-modal .modal-all a{ width:15vw; padding:1vw 0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:8vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ padding:1vw 0; } } @media only screen and (min-width: 1920px){ #ldcweb-cn p{ font-size:calc(var(--ck-w1-font-size-txt) * 1.25); } #ldcweb-cn .banner-title p{ font-size:calc(var(--ck-w1-font-size-title) * 1.25); } #ldcweb-cn .btns .btn{ font-size:calc(var(--ck-w1-font-size-btn-txt) * 1.25); } #ldcweb-cn-modal .modal-wrapper{ width:50vw; } #ldcweb-cn-modal .modal-btn-close{ width:2rem; height:2rem; } #ldcweb-cn-modal .modal-title .description, #ldcweb-cn-modal .modal-title > div a, #ldcweb-cn-modal .modal-all p, #ldcweb-cn-modal .modal-all a{ font-size:calc(var(--ck-w2-font-size-txt) * 1.25); } #ldcweb-cn-modal .modal-wrapper .modal-title{ padding:1vw; } #ldcweb-cn-modal .modal-title .title{ font-size:calc(var(--ck-w2-font-size-title) * 1.25); } #ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title > div::after{ margin:1vw auto; } #ldcweb-cn-modal .modal-wrapper .modal-all{ padding:0 1vw 1vw; } #ldcweb-cn-modal .modal-all a{ width:13vw; padding:0.5vw 0; } #ldcweb-cn-modal .modal-wrapper .modal-details{ padding:0.5vw 0; } #ldcweb-cn-modal .modal-details li > div{ margin:0.5vw 0; padding:1vw; } #ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li a, #ldcweb-cn-modal .modal-details li label{ font-size:calc(var(--ck-font-size-list) * 1.25); } #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ font-size:calc(var(--ck-font-size-list) * 1.5); } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ flex-direction:row; align-items:center; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ width:5vw; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ margin:0 1vw 0; } #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ padding:0.5vw 0; } }