.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;
} @-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;
} @-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;
} @-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;
} @-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;
}