Server : Apache System : Linux ls31.server.ly 3.10.0-962.3.2.lve1.5.68.el7.x86_64 #1 SMP Wed Apr 6 11:12:23 UTC 2022 x86_64 User : medchoco ( 2906) PHP Version : 8.3.16 Disable Function : mail Directory : /home/medchoco/public_html/wp-content/themes/puca/css/ |
Upload File : |
/*! * animate.css -http://daneden.me/animate * Version - 3.5.0 * Licensed under the MIT license - http://opensource.org/licenses/MIT * * Copyright (c) 2016 Daniel Eden */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY { -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes a { 0%,20%,53%,80%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%,43% { -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06); animation-timing-function: cubic-bezier(.755,.05,.855,.06); -webkit-transform: translate3d(0,-30px,0); transform: translate3d(0,-30px,0); } 70% { -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06); animation-timing-function: cubic-bezier(.755,.05,.855,.06); -webkit-transform: translate3d(0,-15px,0); transform: translate3d(0,-15px,0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } @keyframes a { 0%,20%,53%,80%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%,43% { -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06); animation-timing-function: cubic-bezier(.755,.05,.855,.06); -webkit-transform: translate3d(0,-30px,0); transform: translate3d(0,-30px,0); } 70% { -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06); animation-timing-function: cubic-bezier(.755,.05,.855,.06); -webkit-transform: translate3d(0,-15px,0); transform: translate3d(0,-15px,0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } .bounce { -webkit-animation-name: a; animation-name: a; -webkit-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes b { 0%,50%,to { opacity: 1; } 25%,75% { opacity: 0; } } @keyframes b { 0%,50%,to { opacity: 1; } 25%,75% { opacity: 0; } } .flash { -webkit-animation-name: b; animation-name: b; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes c { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05,1.05,1.05); transform: scale3d(1.05,1.05,1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes c { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05,1.05,1.05); transform: scale3d(1.05,1.05,1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .pulse { -webkit-animation-name: c; animation-name: c; } @-webkit-keyframes d { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 30% { -webkit-transform: scale3d(1.25,.75,1); transform: scale3d(1.25,.75,1); } 40% { -webkit-transform: scale3d(.75,1.25,1); transform: scale3d(.75,1.25,1); } 50% { -webkit-transform: scale3d(1.15,.85,1); transform: scale3d(1.15,.85,1); } 65% { -webkit-transform: scale3d(.95,1.05,1); transform: scale3d(.95,1.05,1); } 75% { -webkit-transform: scale3d(1.05,.95,1); transform: scale3d(1.05,.95,1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes d { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 30% { -webkit-transform: scale3d(1.25,.75,1); transform: scale3d(1.25,.75,1); } 40% { -webkit-transform: scale3d(.75,1.25,1); transform: scale3d(.75,1.25,1); } 50% { -webkit-transform: scale3d(1.15,.85,1); transform: scale3d(1.15,.85,1); } 65% { -webkit-transform: scale3d(.95,1.05,1); transform: scale3d(.95,1.05,1); } 75% { -webkit-transform: scale3d(1.05,.95,1); transform: scale3d(1.05,.95,1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .rubberBand { -webkit-animation-name: d; animation-name: d; } @-webkit-keyframes e { 0%,to { -webkit-transform: translateZ(0); transform: translateZ(0); } 10%,30%,50%,70%,90% { -webkit-transform: translate3d(-10px,0,0); transform: translate3d(-10px,0,0); } 20%,40%,60%,80% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } } @keyframes e { 0%,to { -webkit-transform: translateZ(0); transform: translateZ(0); } 10%,30%,50%,70%,90% { -webkit-transform: translate3d(-10px,0,0); transform: translate3d(-10px,0,0); } 20%,40%,60%,80% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } } .shake { -webkit-animation-name: e; animation-name: e; } @-webkit-keyframes f { 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 f { 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); } } .headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: f; animation-name: f; } @-webkit-keyframes g { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes g { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: g; animation-name: g; } @-webkit-keyframes h { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%,20% { -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg); transform: scale3d(.9,.9,.9) rotate(-3deg); } 30%,50%,70%,90% { -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg); transform: scale3d(1.1,1.1,1.1) rotate(3deg); } 40%,60%,80% { -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg); transform: scale3d(1.1,1.1,1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes h { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%,20% { -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg); transform: scale3d(.9,.9,.9) rotate(-3deg); } 30%,50%,70%,90% { -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg); transform: scale3d(1.1,1.1,1.1) rotate(3deg); } 40%,60%,80% { -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg); transform: scale3d(1.1,1.1,1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .tada { -webkit-animation-name: h; animation-name: h; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes i { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%,0,0) rotate(-5deg); transform: translate3d(-25%,0,0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%,0,0) rotate(3deg); transform: translate3d(20%,0,0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%,0,0) rotate(-3deg); transform: translate3d(-15%,0,0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%,0,0) rotate(2deg); transform: translate3d(10%,0,0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%,0,0) rotate(-1deg); transform: translate3d(-5%,0,0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } } @keyframes i { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%,0,0) rotate(-5deg); transform: translate3d(-25%,0,0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%,0,0) rotate(3deg); transform: translate3d(20%,0,0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%,0,0) rotate(-3deg); transform: translate3d(-15%,0,0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%,0,0) rotate(2deg); transform: translate3d(10%,0,0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%,0,0) rotate(-1deg); transform: translate3d(-5%,0,0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: i; animation-name: i; } @-webkit-keyframes j { 0%,11.1%,to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg); } 77.7% { -webkit-transform: skewX(.390625deg) skewY(.390625deg); transform: skewX(.390625deg) skewY(.390625deg); } 88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg); } } @keyframes j { 0%,11.1%,to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg); } 77.7% { -webkit-transform: skewX(.390625deg) skewY(.390625deg); transform: skewX(.390625deg) skewY(.390625deg); } 88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg); } } .jello { -webkit-animation-name: j; animation-name: j; -webkit-transform-origin: center; transform-origin: center; } @-webkit-keyframes k { 0%,20%,40%,60%,80%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } 20% { -webkit-transform: scale3d(1.1,1.1,1.1); transform: scale3d(1.1,1.1,1.1); } 40% { -webkit-transform: scale3d(.9,.9,.9); transform: scale3d(.9,.9,.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03,1.03,1.03); transform: scale3d(1.03,1.03,1.03); } 80% { -webkit-transform: scale3d(.97,.97,.97); transform: scale3d(.97,.97,.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes k { 0%,20%,40%,60%,80%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } 20% { -webkit-transform: scale3d(1.1,1.1,1.1); transform: scale3d(1.1,1.1,1.1); } 40% { -webkit-transform: scale3d(.9,.9,.9); transform: scale3d(.9,.9,.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03,1.03,1.03); transform: scale3d(1.03,1.03,1.03); } 80% { -webkit-transform: scale3d(.97,.97,.97); transform: scale3d(.97,.97,.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } } .bounceIn { -webkit-animation-name: k; animation-name: k; } @-webkit-keyframes l { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(0,-3000px,0); transform: translate3d(0,-3000px,0); } 60% { opacity: 1; -webkit-transform: translate3d(0,25px,0); transform: translate3d(0,25px,0); } 75% { -webkit-transform: translate3d(0,-10px,0); transform: translate3d(0,-10px,0); } 90% { -webkit-transform: translate3d(0,5px,0); transform: translate3d(0,5px,0); } to { -webkit-transform: none; transform: none; } } @keyframes l { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(0,-3000px,0); transform: translate3d(0,-3000px,0); } 60% { opacity: 1; -webkit-transform: translate3d(0,25px,0); transform: translate3d(0,25px,0); } 75% { -webkit-transform: translate3d(0,-10px,0); transform: translate3d(0,-10px,0); } 90% { -webkit-transform: translate3d(0,5px,0); transform: translate3d(0,5px,0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: l; animation-name: l; } @-webkit-keyframes m { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px,0,0); transform: translate3d(-3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(25px,0,0); transform: translate3d(25px,0,0); } 75% { -webkit-transform: translate3d(-10px,0,0); transform: translate3d(-10px,0,0); } 90% { -webkit-transform: translate3d(5px,0,0); transform: translate3d(5px,0,0); } to { -webkit-transform: none; transform: none; } } @keyframes m { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px,0,0); transform: translate3d(-3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(25px,0,0); transform: translate3d(25px,0,0); } 75% { -webkit-transform: translate3d(-10px,0,0); transform: translate3d(-10px,0,0); } 90% { -webkit-transform: translate3d(5px,0,0); transform: translate3d(5px,0,0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: m; animation-name: m; } @-webkit-keyframes n { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px,0,0); transform: translate3d(3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px,0,0); transform: translate3d(-25px,0,0); } 75% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } 90% { -webkit-transform: translate3d(-5px,0,0); transform: translate3d(-5px,0,0); } to { -webkit-transform: none; transform: none; } } @keyframes n { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px,0,0); transform: translate3d(3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px,0,0); transform: translate3d(-25px,0,0); } 75% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } 90% { -webkit-transform: translate3d(-5px,0,0); transform: translate3d(-5px,0,0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: n; animation-name: n; } @-webkit-keyframes o { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(0,3000px,0); transform: translate3d(0,3000px,0); } 60% { opacity: 1; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0); } 75% { -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); } 90% { -webkit-transform: translate3d(0,-5px,0); transform: translate3d(0,-5px,0); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes o { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(0,3000px,0); transform: translate3d(0,3000px,0); } 60% { opacity: 1; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0); } 75% { -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); } 90% { -webkit-transform: translate3d(0,-5px,0); transform: translate3d(0,-5px,0); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .bounceInUp { -webkit-animation-name: o; animation-name: o; } @-webkit-keyframes p { 20% { -webkit-transform: scale3d(.9,.9,.9); transform: scale3d(.9,.9,.9); } 50%,55% { opacity: 1; -webkit-transform: scale3d(1.1,1.1,1.1); transform: scale3d(1.1,1.1,1.1); } to { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } } @keyframes p { 20% { -webkit-transform: scale3d(.9,.9,.9); transform: scale3d(.9,.9,.9); } 50%,55% { opacity: 1; -webkit-transform: scale3d(1.1,1.1,1.1); transform: scale3d(1.1,1.1,1.1); } to { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } } .bounceOut { -webkit-animation-name: p; animation-name: p; } @-webkit-keyframes q { 20% { -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); } 40%,45% { opacity: 1; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0); } to { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } } @keyframes q { 20% { -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); } 40%,45% { opacity: 1; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0); } to { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } } .bounceOutDown { -webkit-animation-name: q; animation-name: q; } @-webkit-keyframes r { 20% { opacity: 1; -webkit-transform: translate3d(20px,0,0); transform: translate3d(20px,0,0); } to { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } } @keyframes r { 20% { opacity: 1; -webkit-transform: translate3d(20px,0,0); transform: translate3d(20px,0,0); } to { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } } .bounceOutLeft { -webkit-animation-name: r; animation-name: r; } @-webkit-keyframes s { 20% { opacity: 1; -webkit-transform: translate3d(-20px,0,0); transform: translate3d(-20px,0,0); } to { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } } @keyframes s { 20% { opacity: 1; -webkit-transform: translate3d(-20px,0,0); transform: translate3d(-20px,0,0); } to { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } } .bounceOutRight { -webkit-animation-name: s; animation-name: s; } @-webkit-keyframes t { 20% { -webkit-transform: translate3d(0,-10px,0); transform: translate3d(0,-10px,0); } 40%,45% { opacity: 1; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0); } to { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } } @keyframes t { 20% { -webkit-transform: translate3d(0,-10px,0); transform: translate3d(0,-10px,0); } 40%,45% { opacity: 1; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0); } to { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } } .bounceOutUp { -webkit-animation-name: t; animation-name: t; } @-webkit-keyframes u { 0% { opacity: 0; } to { opacity: 1; } } @keyframes u { 0% { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: u; animation-name: u; } @-webkit-keyframes v { 0% { opacity: 0; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes v { 0% { opacity: 0; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: v; animation-name: v; } @-webkit-keyframes w { 0% { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes w { 0% { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: w; animation-name: w; } @-webkit-keyframes x { 0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes x { 0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: x; animation-name: x; } @-webkit-keyframes y { 0% { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes y { 0% { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: y; animation-name: y; } @-webkit-keyframes z { 0% { opacity: 0; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes z { 0% { opacity: 0; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: z; animation-name: z; } @-webkit-keyframes A { 0% { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes A { 0% { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: A; animation-name: A; } @-webkit-keyframes B { 0% { opacity: 0; -webkit-transform: translate3d(0,50%,0); transform: translate3d(0,50%,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes B { 0% { opacity: 0; -webkit-transform: translate3d(0,5%,0); transform: translate3d(0,50%,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: B; animation-name: B; } @-webkit-keyframes C { 0% { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes C { 0% { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: C; animation-name: C; } @-webkit-keyframes D { 0% { opacity: 1; } to { opacity: 0; } } @keyframes D { 0% { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: D; animation-name: D; } @-webkit-keyframes E { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } } @keyframes E { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } } .fadeOutDown { -webkit-animation-name: E; animation-name: E; } @-webkit-keyframes F { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } } @keyframes F { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,2000px,0); transform: translate3d(0,2000px,0); } } .fadeOutDownBig { -webkit-animation-name: F; animation-name: F; } @-webkit-keyframes G { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } } @keyframes G { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } } .fadeOutLeft { -webkit-animation-name: G; animation-name: G; } @-webkit-keyframes H { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } } @keyframes H { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px,0,0); transform: translate3d(-2000px,0,0); } } .fadeOutLeftBig { -webkit-animation-name: H; animation-name: H; } @-webkit-keyframes I { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } } @keyframes I { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } } .fadeOutRight { -webkit-animation-name: I; animation-name: I; } @-webkit-keyframes J { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } } @keyframes J { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px,0,0); transform: translate3d(2000px,0,0); } } .fadeOutRightBig { -webkit-animation-name: J; animation-name: J; } @-webkit-keyframes K { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } } @keyframes K { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } } .fadeOutUp { -webkit-animation-name: K; animation-name: K; } @-webkit-keyframes L { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } } @keyframes L { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0,-2000px,0); transform: translate3d(0,-2000px,0); } } .fadeOutUpBig { -webkit-animation-name: L; animation-name: L; } @-webkit-keyframes M { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95,.95,.95); transform: perspective(400px) scale3d(.95,.95,.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes M { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95,.95,.95); transform: perspective(400px) scale3d(.95,.95,.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: M; animation-name: M; } @-webkit-keyframes N { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes N { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: N; animation-name: N; } @-webkit-keyframes O { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes O { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: O; animation-name: O; } @-webkit-keyframes P { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes P { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: P; animation-name: P; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes Q { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes Q { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: Q; animation-name: Q; } @-webkit-keyframes R { 0% { -webkit-transform: translate3d(100%,0,0) skewX(-30deg); transform: translate3d(100%,0,0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes R { 0% { -webkit-transform: translate3d(100%,0,0) skewX(-30deg); transform: translate3d(100%,0,0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: R; animation-name: R; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes S { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%,0,0) skewX(30deg); transform: translate3d(100%,0,0) skewX(30deg); opacity: 0; } } @keyframes S { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%,0,0) skewX(30deg); transform: translate3d(100%,0,0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: S; animation-name: S; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes T { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes T { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: T; animation-name: T; } @-webkit-keyframes U { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes U { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: U; animation-name: U; } @-webkit-keyframes V { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes V { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: V; animation-name: V; } @-webkit-keyframes W { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes W { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: W; animation-name: W; } @-webkit-keyframes X { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes X { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: X; animation-name: X; } @-webkit-keyframes Y { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes Y { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: Y; animation-name: Y; } @-webkit-keyframes Z { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } } @keyframes Z { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: Z; animation-name: Z; } @-webkit-keyframes ab { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } @keyframes ab { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: ab; animation-name: ab; } @-webkit-keyframes bb { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } @keyframes bb { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: bb; animation-name: bb; } @-webkit-keyframes cb { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes cb { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: cb; animation-name: cb; } @-webkit-keyframes db { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%,60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%,80% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -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 db { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%,60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%,80% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -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; } } .hinge { -webkit-animation-name: db; animation-name: db; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes eb { 0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0) rotate(-120deg); transform: translate3d(-100%,0,0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes eb { 0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0) rotate(-120deg); transform: translate3d(-100%,0,0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: eb; animation-name: eb; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes fb { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%,0,0) rotate(120deg); transform: translate3d(100%,0,0) rotate(120deg); } } @keyframes fb { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%,0,0) rotate(120deg); transform: translate3d(100%,0,0) rotate(120deg); } } .rollOut { -webkit-animation-name: fb; animation-name: fb; } @-webkit-keyframes gb { 0% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } 50% { opacity: 1; } } @keyframes gb { 0% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: gb; animation-name: gb; } @-webkit-keyframes hb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0); transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0); transform: scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes hb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0); transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0); transform: scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomInDown { -webkit-animation-name: hb; animation-name: hb; } @-webkit-keyframes ib { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0); transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0); transform: scale3d(.475,.475,.475) translate3d(10px,0,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes ib { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0); transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0); transform: scale3d(.475,.475,.475) translate3d(10px,0,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomInLeft { -webkit-animation-name: ib; animation-name: ib; } @-webkit-keyframes jb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0); transform: scale3d(.1,.1,.1) translate3d(1000px,0,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0); transform: scale3d(.475,.475,.475) translate3d(-10px,0,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes jb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0); transform: scale3d(.1,.1,.1) translate3d(1000px,0,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0); transform: scale3d(.475,.475,.475) translate3d(-10px,0,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomInRight { -webkit-animation-name: jb; animation-name: jb; } @-webkit-keyframes kb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0); transform: scale3d(.1,.1,.1) translate3d(0,1000px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes kb { 0% { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0); transform: scale3d(.1,.1,.1) translate3d(0,1000px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } 60% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomInUp { -webkit-animation-name: kb; animation-name: kb; } @-webkit-keyframes lb { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } to { opacity: 0; } } @keyframes lb { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3); transform: scale3d(.3,.3,.3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: lb; animation-name: lb; } @-webkit-keyframes mb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } to { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0); transform: scale3d(.1,.1,.1) translate3d(0,2000px,0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes mb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); transform: scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } to { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0); transform: scale3d(.1,.1,.1) translate3d(0,2000px,0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomOutDown { -webkit-animation-name: mb; animation-name: mb; } @-webkit-keyframes nb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0); transform: scale3d(.475,.475,.475) translate3d(42px,0,0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px,0,0); transform: scale(.1) translate3d(-2000px,0,0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes nb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0); transform: scale3d(.475,.475,.475) translate3d(42px,0,0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px,0,0); transform: scale(.1) translate3d(-2000px,0,0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: nb; animation-name: nb; } @-webkit-keyframes ob { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0); transform: scale3d(.475,.475,.475) translate3d(-42px,0,0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px,0,0); transform: scale(.1) translate3d(2000px,0,0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes ob { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0); transform: scale3d(.475,.475,.475) translate3d(-42px,0,0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px,0,0); transform: scale(.1) translate3d(2000px,0,0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: ob; animation-name: ob; } @-webkit-keyframes pb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0); transform: scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } to { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0); transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } @keyframes pb { 40% { opacity: 1; -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0); transform: scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19); animation-timing-function: cubic-bezier(.55,.055,.675,.19); } to { opacity: 0; -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0); transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1); animation-timing-function: cubic-bezier(.175,.885,.32,1); } } .zoomOutUp { -webkit-animation-name: pb; animation-name: pb; } @-webkit-keyframes qb { 0% { -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes qb { 0% { -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInDown { -webkit-animation-name: qb; animation-name: qb; } @-webkit-keyframes rb { 0% { -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes rb { 0% { -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInLeft { -webkit-animation-name: rb; animation-name: rb; } @-webkit-keyframes sb { 0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes sb { 0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInRight { -webkit-animation-name: sb; animation-name: sb; } @-webkit-keyframes tb { 0% { -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes tb { 0% { -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInUp { -webkit-animation-name: tb; animation-name: tb; } @-webkit-keyframes ub { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } } @keyframes ub { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } } .slideOutDown { -webkit-animation-name: ub; animation-name: ub; } @-webkit-keyframes vb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } } @keyframes vb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); } } .slideOutLeft { -webkit-animation-name: vb; animation-name: vb; } @-webkit-keyframes wb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } } @keyframes wb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); } } .slideOutRight { -webkit-animation-name: wb; animation-name: wb; } @-webkit-keyframes xb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } } @keyframes xb { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); } } .slideOutUp { -webkit-animation-name: xb; animation-name: xb; }