Last active
March 28, 2019 19:52
-
-
Save atbradley/cf14b44876912364be5574e84368fd30 to your computer and use it in GitHub Desktop.
Animates the "Best Bets" search results on Josiah (e.g. https://search.library.brown.edu/?utf8=%E2%9C%93&q=naxos) in case they aren't obvious enough yet.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@charset "UTF-8"; | |
/*! | |
* animate.css -http://daneden.me/animate | |
* Version - 3.5.1 | |
* 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.flipOutX, | |
.animated.flipOutY, | |
.animated.bounceIn, | |
.animated.bounceOut { | |
-webkit-animation-duration: .75s; | |
animation-duration: .75s; | |
} | |
@-webkit-keyframes bounce { | |
from, 20%, 53%, 80%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0); | |
} | |
40%, 43% { | |
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
-webkit-transform: translate3d(0, -30px, 0); | |
transform: translate3d(0, -30px, 0); | |
} | |
70% { | |
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
-webkit-transform: translate3d(0, -15px, 0); | |
transform: translate3d(0, -15px, 0); | |
} | |
90% { | |
-webkit-transform: translate3d(0,-4px,0); | |
transform: translate3d(0,-4px,0); | |
} | |
} | |
@keyframes bounce { | |
from, 20%, 53%, 80%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0); | |
} | |
40%, 43% { | |
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
-webkit-transform: translate3d(0, -30px, 0); | |
transform: translate3d(0, -30px, 0); | |
} | |
70% { | |
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | |
-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: bounce; | |
animation-name: bounce; | |
-webkit-transform-origin: center bottom; | |
transform-origin: center bottom; | |
} | |
@-webkit-keyframes flash { | |
from, 50%, to { | |
opacity: 1; | |
} | |
25%, 75% { | |
opacity: 0; | |
} | |
} | |
@keyframes flash { | |
from, 50%, to { | |
opacity: 1; | |
} | |
25%, 75% { | |
opacity: 0; | |
} | |
} | |
.flash { | |
-webkit-animation-name: flash; | |
animation-name: flash; | |
} | |
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | |
@-webkit-keyframes pulse { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
50% { | |
-webkit-transform: scale3d(1.05, 1.05, 1.05); | |
transform: scale3d(1.05, 1.05, 1.05); | |
} | |
to { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
@keyframes pulse { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
50% { | |
-webkit-transform: scale3d(1.05, 1.05, 1.05); | |
transform: scale3d(1.05, 1.05, 1.05); | |
} | |
to { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
.pulse { | |
-webkit-animation-name: pulse; | |
animation-name: pulse; | |
} | |
@-webkit-keyframes rubberBand { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
30% { | |
-webkit-transform: scale3d(1.25, 0.75, 1); | |
transform: scale3d(1.25, 0.75, 1); | |
} | |
40% { | |
-webkit-transform: scale3d(0.75, 1.25, 1); | |
transform: scale3d(0.75, 1.25, 1); | |
} | |
50% { | |
-webkit-transform: scale3d(1.15, 0.85, 1); | |
transform: scale3d(1.15, 0.85, 1); | |
} | |
65% { | |
-webkit-transform: scale3d(.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: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
@keyframes rubberBand { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
30% { | |
-webkit-transform: scale3d(1.25, 0.75, 1); | |
transform: scale3d(1.25, 0.75, 1); | |
} | |
40% { | |
-webkit-transform: scale3d(0.75, 1.25, 1); | |
transform: scale3d(0.75, 1.25, 1); | |
} | |
50% { | |
-webkit-transform: scale3d(1.15, 0.85, 1); | |
transform: scale3d(1.15, 0.85, 1); | |
} | |
65% { | |
-webkit-transform: scale3d(.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: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
.rubberBand { | |
-webkit-animation-name: rubberBand; | |
animation-name: rubberBand; | |
} | |
@-webkit-keyframes shake { | |
from, to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
10%, 30%, 50%, 70%, 90% { | |
-webkit-transform: translate3d(-10px, 0, 0); | |
transform: translate3d(-10px, 0, 0); | |
} | |
20%, 40%, 60%, 80% { | |
-webkit-transform: translate3d(10px, 0, 0); | |
transform: translate3d(10px, 0, 0); | |
} | |
} | |
@keyframes shake { | |
from, to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
10%, 30%, 50%, 70%, 90% { | |
-webkit-transform: translate3d(-10px, 0, 0); | |
transform: translate3d(-10px, 0, 0); | |
} | |
20%, 40%, 60%, 80% { | |
-webkit-transform: translate3d(10px, 0, 0); | |
transform: translate3d(10px, 0, 0); | |
} | |
} | |
.shake { | |
-webkit-animation-name: shake; | |
animation-name: shake; | |
} | |
@-webkit-keyframes headShake { | |
0% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0); | |
} | |
6.5% { | |
-webkit-transform: translateX(-6px) rotateY(-9deg); | |
transform: translateX(-6px) rotateY(-9deg); | |
} | |
18.5% { | |
-webkit-transform: translateX(5px) rotateY(7deg); | |
transform: translateX(5px) rotateY(7deg); | |
} | |
31.5% { | |
-webkit-transform: translateX(-3px) rotateY(-5deg); | |
transform: translateX(-3px) rotateY(-5deg); | |
} | |
43.5% { | |
-webkit-transform: translateX(2px) rotateY(3deg); | |
transform: translateX(2px) rotateY(3deg); | |
} | |
50% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0); | |
} | |
} | |
@keyframes headShake { | |
0% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0); | |
} | |
6.5% { | |
-webkit-transform: translateX(-6px) rotateY(-9deg); | |
transform: translateX(-6px) rotateY(-9deg); | |
} | |
18.5% { | |
-webkit-transform: translateX(5px) rotateY(7deg); | |
transform: translateX(5px) rotateY(7deg); | |
} | |
31.5% { | |
-webkit-transform: translateX(-3px) rotateY(-5deg); | |
transform: translateX(-3px) rotateY(-5deg); | |
} | |
43.5% { | |
-webkit-transform: translateX(2px) rotateY(3deg); | |
transform: translateX(2px) rotateY(3deg); | |
} | |
50% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0); | |
} | |
} | |
.headShake { | |
-webkit-animation-timing-function: ease-in-out; | |
animation-timing-function: ease-in-out; | |
-webkit-animation-name: headShake; | |
animation-name: headShake; | |
} | |
@-webkit-keyframes swing { | |
20% { | |
-webkit-transform: rotate3d(0, 0, 1, 15deg); | |
transform: rotate3d(0, 0, 1, 15deg); | |
} | |
40% { | |
-webkit-transform: rotate3d(0, 0, 1, -10deg); | |
transform: rotate3d(0, 0, 1, -10deg); | |
} | |
60% { | |
-webkit-transform: rotate3d(0, 0, 1, 5deg); | |
transform: rotate3d(0, 0, 1, 5deg); | |
} | |
80% { | |
-webkit-transform: rotate3d(0, 0, 1, -5deg); | |
transform: rotate3d(0, 0, 1, -5deg); | |
} | |
to { | |
-webkit-transform: rotate3d(0, 0, 1, 0deg); | |
transform: rotate3d(0, 0, 1, 0deg); | |
} | |
} | |
@keyframes swing { | |
20% { | |
-webkit-transform: rotate3d(0, 0, 1, 15deg); | |
transform: rotate3d(0, 0, 1, 15deg); | |
} | |
40% { | |
-webkit-transform: rotate3d(0, 0, 1, -10deg); | |
transform: rotate3d(0, 0, 1, -10deg); | |
} | |
60% { | |
-webkit-transform: rotate3d(0, 0, 1, 5deg); | |
transform: rotate3d(0, 0, 1, 5deg); | |
} | |
80% { | |
-webkit-transform: rotate3d(0, 0, 1, -5deg); | |
transform: rotate3d(0, 0, 1, -5deg); | |
} | |
to { | |
-webkit-transform: rotate3d(0, 0, 1, 0deg); | |
transform: rotate3d(0, 0, 1, 0deg); | |
} | |
} | |
.swing { | |
-webkit-transform-origin: top center; | |
transform-origin: top center; | |
-webkit-animation-name: swing; | |
animation-name: swing; | |
} | |
@-webkit-keyframes tada { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
10%, 20% { | |
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); | |
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); | |
} | |
30%, 50%, 70%, 90% { | |
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); | |
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); | |
} | |
40%, 60%, 80% { | |
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); | |
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); | |
} | |
to { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
@keyframes tada { | |
from { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
10%, 20% { | |
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); | |
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); | |
} | |
30%, 50%, 70%, 90% { | |
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); | |
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); | |
} | |
40%, 60%, 80% { | |
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); | |
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); | |
} | |
to { | |
-webkit-transform: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
.tada { | |
-webkit-animation-name: tada; | |
animation-name: tada; | |
} | |
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | |
@-webkit-keyframes wobble { | |
from { | |
-webkit-transform: none; | |
transform: none; | |
} | |
15% { | |
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); | |
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); | |
} | |
30% { | |
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); | |
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); | |
} | |
45% { | |
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); | |
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); | |
} | |
60% { | |
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); | |
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); | |
} | |
75% { | |
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); | |
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); | |
} | |
to { | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes wobble { | |
from { | |
-webkit-transform: none; | |
transform: none; | |
} | |
15% { | |
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); | |
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); | |
} | |
30% { | |
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); | |
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); | |
} | |
45% { | |
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); | |
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); | |
} | |
60% { | |
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); | |
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); | |
} | |
75% { | |
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); | |
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); | |
} | |
to { | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
.wobble { | |
-webkit-animation-name: wobble; | |
animation-name: wobble; | |
} | |
@-webkit-keyframes jello { | |
from, 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(-0.78125deg) skewY(-0.78125deg); | |
transform: skewX(-0.78125deg) skewY(-0.78125deg); | |
} | |
77.7% { | |
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg); | |
transform: skewX(0.390625deg) skewY(0.390625deg); | |
} | |
88.8% { | |
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); | |
transform: skewX(-0.1953125deg) skewY(-0.1953125deg); | |
} | |
} | |
@keyframes jello { | |
from, 11.1%, to { | |
-webkit-transform: 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(-0.78125deg) skewY(-0.78125deg); | |
transform: skewX(-0.78125deg) skewY(-0.78125deg); | |
} | |
77.7% { | |
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg); | |
transform: skewX(0.390625deg) skewY(0.390625deg); | |
} | |
88.8% { | |
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); | |
transform: skewX(-0.1953125deg) skewY(-0.1953125deg); | |
} | |
} | |
.jello { | |
-webkit-animation-name: jello; | |
animation-name: jello; | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
} | |
@-webkit-keyframes bounceIn { | |
from, 20%, 40%, 60%, 80%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
@keyframes bounceIn { | |
from, 20%, 40%, 60%, 80%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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: scale3d(1, 1, 1); | |
transform: scale3d(1, 1, 1); | |
} | |
} | |
.bounceIn { | |
-webkit-animation-name: bounceIn; | |
animation-name: bounceIn; | |
} | |
@-webkit-keyframes bounceInDown { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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 bounceInDown { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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: bounceInDown; | |
animation-name: bounceInDown; | |
} | |
@-webkit-keyframes bounceInLeft { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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 bounceInLeft { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
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: bounceInLeft; | |
animation-name: bounceInLeft; | |
} | |
@-webkit-keyframes bounceInRight { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
from { | |
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 bounceInRight { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
from { | |
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: bounceInRight; | |
animation-name: bounceInRight; | |
} | |
@-webkit-keyframes bounceInUp { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
from { | |
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: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
@keyframes bounceInUp { | |
from, 60%, 75%, 90%, to { | |
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | |
} | |
from { | |
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: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
.bounceInUp { | |
-webkit-animation-name: bounceInUp; | |
animation-name: bounceInUp; | |
} | |
@-webkit-keyframes bounceOut { | |
20% { | |
-webkit-transform: scale3d(.9, .9, .9); | |
transform: scale3d(.9, .9, .9); | |
} | |
50%, 55% { | |
opacity: 1; | |
-webkit-transform: scale3d(1.1, 1.1, 1.1); | |
transform: scale3d(1.1, 1.1, 1.1); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
} | |
@keyframes bounceOut { | |
20% { | |
-webkit-transform: scale3d(.9, .9, .9); | |
transform: scale3d(.9, .9, .9); | |
} | |
50%, 55% { | |
opacity: 1; | |
-webkit-transform: scale3d(1.1, 1.1, 1.1); | |
transform: scale3d(1.1, 1.1, 1.1); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
} | |
.bounceOut { | |
-webkit-animation-name: bounceOut; | |
animation-name: bounceOut; | |
} | |
@-webkit-keyframes bounceOutDown { | |
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 bounceOutDown { | |
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: bounceOutDown; | |
animation-name: bounceOutDown; | |
} | |
@-webkit-keyframes bounceOutLeft { | |
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 bounceOutLeft { | |
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: bounceOutLeft; | |
animation-name: bounceOutLeft; | |
} | |
@-webkit-keyframes bounceOutRight { | |
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 bounceOutRight { | |
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: bounceOutRight; | |
animation-name: bounceOutRight; | |
} | |
@-webkit-keyframes bounceOutUp { | |
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 bounceOutUp { | |
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: bounceOutUp; | |
animation-name: bounceOutUp; | |
} | |
@-webkit-keyframes fadeIn { | |
from { | |
opacity: 0; | |
} | |
to { | |
opacity: 1; | |
} | |
} | |
@keyframes fadeIn { | |
from { | |
opacity: 0; | |
} | |
to { | |
opacity: 1; | |
} | |
} | |
.fadeIn { | |
-webkit-animation-name: fadeIn; | |
animation-name: fadeIn; | |
} | |
@-webkit-keyframes fadeInDown { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInDown { | |
from { | |
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: fadeInDown; | |
animation-name: fadeInDown; | |
} | |
@-webkit-keyframes fadeInDownBig { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -2000px, 0); | |
transform: translate3d(0, -2000px, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInDownBig { | |
from { | |
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: fadeInDownBig; | |
animation-name: fadeInDownBig; | |
} | |
@-webkit-keyframes fadeInLeft { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInLeft { | |
from { | |
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: fadeInLeft; | |
animation-name: fadeInLeft; | |
} | |
@-webkit-keyframes fadeInLeftBig { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(-2000px, 0, 0); | |
transform: translate3d(-2000px, 0, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInLeftBig { | |
from { | |
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: fadeInLeftBig; | |
animation-name: fadeInLeftBig; | |
} | |
@-webkit-keyframes fadeInRight { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInRight { | |
from { | |
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: fadeInRight; | |
animation-name: fadeInRight; | |
} | |
@-webkit-keyframes fadeInRightBig { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(2000px, 0, 0); | |
transform: translate3d(2000px, 0, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInRightBig { | |
from { | |
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: fadeInRightBig; | |
animation-name: fadeInRightBig; | |
} | |
@-webkit-keyframes fadeInUp { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInUp { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
.fadeInUp { | |
-webkit-animation-name: fadeInUp; | |
animation-name: fadeInUp; | |
} | |
@-webkit-keyframes fadeInUpBig { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 2000px, 0); | |
transform: translate3d(0, 2000px, 0); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes fadeInUpBig { | |
from { | |
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: fadeInUpBig; | |
animation-name: fadeInUpBig; | |
} | |
@-webkit-keyframes fadeOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
} | |
} | |
@keyframes fadeOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
} | |
} | |
.fadeOut { | |
-webkit-animation-name: fadeOut; | |
animation-name: fadeOut; | |
} | |
@-webkit-keyframes fadeOutDown { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
} | |
@keyframes fadeOutDown { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
} | |
.fadeOutDown { | |
-webkit-animation-name: fadeOutDown; | |
animation-name: fadeOutDown; | |
} | |
@-webkit-keyframes fadeOutDownBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 2000px, 0); | |
transform: translate3d(0, 2000px, 0); | |
} | |
} | |
@keyframes fadeOutDownBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, 2000px, 0); | |
transform: translate3d(0, 2000px, 0); | |
} | |
} | |
.fadeOutDownBig { | |
-webkit-animation-name: fadeOutDownBig; | |
animation-name: fadeOutDownBig; | |
} | |
@-webkit-keyframes fadeOutLeft { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
} | |
} | |
@keyframes fadeOutLeft { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
} | |
} | |
.fadeOutLeft { | |
-webkit-animation-name: fadeOutLeft; | |
animation-name: fadeOutLeft; | |
} | |
@-webkit-keyframes fadeOutLeftBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(-2000px, 0, 0); | |
transform: translate3d(-2000px, 0, 0); | |
} | |
} | |
@keyframes fadeOutLeftBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(-2000px, 0, 0); | |
transform: translate3d(-2000px, 0, 0); | |
} | |
} | |
.fadeOutLeftBig { | |
-webkit-animation-name: fadeOutLeftBig; | |
animation-name: fadeOutLeftBig; | |
} | |
@-webkit-keyframes fadeOutRight { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
} | |
} | |
@keyframes fadeOutRight { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
} | |
} | |
.fadeOutRight { | |
-webkit-animation-name: fadeOutRight; | |
animation-name: fadeOutRight; | |
} | |
@-webkit-keyframes fadeOutRightBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(2000px, 0, 0); | |
transform: translate3d(2000px, 0, 0); | |
} | |
} | |
@keyframes fadeOutRightBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(2000px, 0, 0); | |
transform: translate3d(2000px, 0, 0); | |
} | |
} | |
.fadeOutRightBig { | |
-webkit-animation-name: fadeOutRightBig; | |
animation-name: fadeOutRightBig; | |
} | |
@-webkit-keyframes fadeOutUp { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
} | |
} | |
@keyframes fadeOutUp { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
} | |
} | |
.fadeOutUp { | |
-webkit-animation-name: fadeOutUp; | |
animation-name: fadeOutUp; | |
} | |
@-webkit-keyframes fadeOutUpBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -2000px, 0); | |
transform: translate3d(0, -2000px, 0); | |
} | |
} | |
@keyframes fadeOutUpBig { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(0, -2000px, 0); | |
transform: translate3d(0, -2000px, 0); | |
} | |
} | |
.fadeOutUpBig { | |
-webkit-animation-name: fadeOutUpBig; | |
animation-name: fadeOutUpBig; | |
} | |
@-webkit-keyframes flip { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -360deg); | |
-webkit-animation-timing-function: ease-out; | |
animation-timing-function: ease-out; | |
} | |
40% { | |
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); | |
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); | |
-webkit-animation-timing-function: ease-out; | |
animation-timing-function: ease-out; | |
} | |
50% { | |
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); | |
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
80% { | |
-webkit-transform: perspective(400px) scale3d(.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 flip { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -360deg); | |
-webkit-animation-timing-function: ease-out; | |
animation-timing-function: ease-out; | |
} | |
40% { | |
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); | |
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); | |
-webkit-animation-timing-function: ease-out; | |
animation-timing-function: ease-out; | |
} | |
50% { | |
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); | |
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
80% { | |
-webkit-transform: perspective(400px) scale3d(.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: flip; | |
animation-name: flip; | |
} | |
@-webkit-keyframes flipInX { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
opacity: 0; | |
} | |
40% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
60% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 10deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -5deg); | |
} | |
to { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
} | |
@keyframes flipInX { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
opacity: 0; | |
} | |
40% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
60% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 10deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -5deg); | |
} | |
to { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
} | |
.flipInX { | |
-webkit-backface-visibility: visible !important; | |
backface-visibility: visible !important; | |
-webkit-animation-name: flipInX; | |
animation-name: flipInX; | |
} | |
@-webkit-keyframes flipInY { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
opacity: 0; | |
} | |
40% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -20deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
60% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 10deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -5deg); | |
} | |
to { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
} | |
@keyframes flipInY { | |
from { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
opacity: 0; | |
} | |
40% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -20deg); | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
60% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 10deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -5deg); | |
} | |
to { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
} | |
.flipInY { | |
-webkit-backface-visibility: visible !important; | |
backface-visibility: visible !important; | |
-webkit-animation-name: flipInY; | |
animation-name: flipInY; | |
} | |
@-webkit-keyframes flipOutX { | |
from { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
30% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
opacity: 0; | |
} | |
} | |
@keyframes flipOutX { | |
from { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
30% { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | |
opacity: 0; | |
} | |
} | |
.flipOutX { | |
-webkit-animation-name: flipOutX; | |
animation-name: flipOutX; | |
-webkit-backface-visibility: visible !important; | |
backface-visibility: visible !important; | |
} | |
@-webkit-keyframes flipOutY { | |
from { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
30% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
opacity: 0; | |
} | |
} | |
@keyframes flipOutY { | |
from { | |
-webkit-transform: perspective(400px); | |
transform: perspective(400px); | |
} | |
30% { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | |
opacity: 0; | |
} | |
} | |
.flipOutY { | |
-webkit-backface-visibility: visible !important; | |
backface-visibility: visible !important; | |
-webkit-animation-name: flipOutY; | |
animation-name: flipOutY; | |
} | |
@-webkit-keyframes lightSpeedIn { | |
from { | |
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); | |
transform: translate3d(100%, 0, 0) skewX(-30deg); | |
opacity: 0; | |
} | |
60% { | |
-webkit-transform: skewX(20deg); | |
transform: skewX(20deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: skewX(-5deg); | |
transform: skewX(-5deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes lightSpeedIn { | |
from { | |
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); | |
transform: translate3d(100%, 0, 0) skewX(-30deg); | |
opacity: 0; | |
} | |
60% { | |
-webkit-transform: skewX(20deg); | |
transform: skewX(20deg); | |
opacity: 1; | |
} | |
80% { | |
-webkit-transform: skewX(-5deg); | |
transform: skewX(-5deg); | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.lightSpeedIn { | |
-webkit-animation-name: lightSpeedIn; | |
animation-name: lightSpeedIn; | |
-webkit-animation-timing-function: ease-out; | |
animation-timing-function: ease-out; | |
} | |
@-webkit-keyframes lightSpeedOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg); | |
transform: translate3d(100%, 0, 0) skewX(30deg); | |
opacity: 0; | |
} | |
} | |
@keyframes lightSpeedOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg); | |
transform: translate3d(100%, 0, 0) skewX(30deg); | |
opacity: 0; | |
} | |
} | |
.lightSpeedOut { | |
-webkit-animation-name: lightSpeedOut; | |
animation-name: lightSpeedOut; | |
-webkit-animation-timing-function: ease-in; | |
animation-timing-function: ease-in; | |
} | |
@-webkit-keyframes rotateIn { | |
from { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: rotate3d(0, 0, 1, -200deg); | |
transform: rotate3d(0, 0, 1, -200deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes rotateIn { | |
from { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: rotate3d(0, 0, 1, -200deg); | |
transform: rotate3d(0, 0, 1, -200deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.rotateIn { | |
-webkit-animation-name: rotateIn; | |
animation-name: rotateIn; | |
} | |
@-webkit-keyframes rotateInDownLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes rotateInDownLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.rotateInDownLeft { | |
-webkit-animation-name: rotateInDownLeft; | |
animation-name: rotateInDownLeft; | |
} | |
@-webkit-keyframes rotateInDownRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes rotateInDownRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.rotateInDownRight { | |
-webkit-animation-name: rotateInDownRight; | |
animation-name: rotateInDownRight; | |
} | |
@-webkit-keyframes rotateInUpLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes rotateInUpLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.rotateInUpLeft { | |
-webkit-animation-name: rotateInUpLeft; | |
animation-name: rotateInUpLeft; | |
} | |
@-webkit-keyframes rotateInUpRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -90deg); | |
transform: rotate3d(0, 0, 1, -90deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
@keyframes rotateInUpRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -90deg); | |
transform: rotate3d(0, 0, 1, -90deg); | |
opacity: 0; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: none; | |
transform: none; | |
opacity: 1; | |
} | |
} | |
.rotateInUpRight { | |
-webkit-animation-name: rotateInUpRight; | |
animation-name: rotateInUpRight; | |
} | |
@-webkit-keyframes rotateOut { | |
from { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: rotate3d(0, 0, 1, 200deg); | |
transform: rotate3d(0, 0, 1, 200deg); | |
opacity: 0; | |
} | |
} | |
@keyframes rotateOut { | |
from { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
-webkit-transform: rotate3d(0, 0, 1, 200deg); | |
transform: rotate3d(0, 0, 1, 200deg); | |
opacity: 0; | |
} | |
} | |
.rotateOut { | |
-webkit-animation-name: rotateOut; | |
animation-name: rotateOut; | |
} | |
@-webkit-keyframes rotateOutDownLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
} | |
@keyframes rotateOutDownLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 45deg); | |
transform: rotate3d(0, 0, 1, 45deg); | |
opacity: 0; | |
} | |
} | |
.rotateOutDownLeft { | |
-webkit-animation-name: rotateOutDownLeft; | |
animation-name: rotateOutDownLeft; | |
} | |
@-webkit-keyframes rotateOutDownRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
} | |
@keyframes rotateOutDownRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
} | |
.rotateOutDownRight { | |
-webkit-animation-name: rotateOutDownRight; | |
animation-name: rotateOutDownRight; | |
} | |
@-webkit-keyframes rotateOutUpLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
} | |
@keyframes rotateOutUpLeft { | |
from { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: left bottom; | |
transform-origin: left bottom; | |
-webkit-transform: rotate3d(0, 0, 1, -45deg); | |
transform: rotate3d(0, 0, 1, -45deg); | |
opacity: 0; | |
} | |
} | |
.rotateOutUpLeft { | |
-webkit-animation-name: rotateOutUpLeft; | |
animation-name: rotateOutUpLeft; | |
} | |
@-webkit-keyframes rotateOutUpRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 90deg); | |
transform: rotate3d(0, 0, 1, 90deg); | |
opacity: 0; | |
} | |
} | |
@keyframes rotateOutUpRight { | |
from { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
opacity: 1; | |
} | |
to { | |
-webkit-transform-origin: right bottom; | |
transform-origin: right bottom; | |
-webkit-transform: rotate3d(0, 0, 1, 90deg); | |
transform: rotate3d(0, 0, 1, 90deg); | |
opacity: 0; | |
} | |
} | |
.rotateOutUpRight { | |
-webkit-animation-name: rotateOutUpRight; | |
animation-name: rotateOutUpRight; | |
} | |
@-webkit-keyframes hinge { | |
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: rotate3d(0, 0, 1, 80deg); | |
transform: rotate3d(0, 0, 1, 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: rotate3d(0, 0, 1, 60deg); | |
transform: rotate3d(0, 0, 1, 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 hinge { | |
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: rotate3d(0, 0, 1, 80deg); | |
transform: rotate3d(0, 0, 1, 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: rotate3d(0, 0, 1, 60deg); | |
transform: rotate3d(0, 0, 1, 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: hinge; | |
animation-name: hinge; | |
} | |
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | |
@-webkit-keyframes rollIn { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | |
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
@keyframes rollIn { | |
from { | |
opacity: 0; | |
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | |
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | |
} | |
to { | |
opacity: 1; | |
-webkit-transform: none; | |
transform: none; | |
} | |
} | |
.rollIn { | |
-webkit-animation-name: rollIn; | |
animation-name: rollIn; | |
} | |
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | |
@-webkit-keyframes rollOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | |
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | |
} | |
} | |
@keyframes rollOut { | |
from { | |
opacity: 1; | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | |
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | |
} | |
} | |
.rollOut { | |
-webkit-animation-name: rollOut; | |
animation-name: rollOut; | |
} | |
@-webkit-keyframes zoomIn { | |
from { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
50% { | |
opacity: 1; | |
} | |
} | |
@keyframes zoomIn { | |
from { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
50% { | |
opacity: 1; | |
} | |
} | |
.zoomIn { | |
-webkit-animation-name: zoomIn; | |
animation-name: zoomIn; | |
} | |
@-webkit-keyframes zoomInDown { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomInDown { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomInDown { | |
-webkit-animation-name: zoomInDown; | |
animation-name: zoomInDown; | |
} | |
@-webkit-keyframes zoomInLeft { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomInLeft { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomInLeft { | |
-webkit-animation-name: zoomInLeft; | |
animation-name: zoomInLeft; | |
} | |
@-webkit-keyframes zoomInRight { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomInRight { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomInRight { | |
-webkit-animation-name: zoomInRight; | |
animation-name: zoomInRight; | |
} | |
@-webkit-keyframes zoomInUp { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomInUp { | |
from { | |
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(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomInUp { | |
-webkit-animation-name: zoomInUp; | |
animation-name: zoomInUp; | |
} | |
@-webkit-keyframes zoomOut { | |
from { | |
opacity: 1; | |
} | |
50% { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
to { | |
opacity: 0; | |
} | |
} | |
@keyframes zoomOut { | |
from { | |
opacity: 1; | |
} | |
50% { | |
opacity: 0; | |
-webkit-transform: scale3d(.3, .3, .3); | |
transform: scale3d(.3, .3, .3); | |
} | |
to { | |
opacity: 0; | |
} | |
} | |
.zoomOut { | |
-webkit-animation-name: zoomOut; | |
animation-name: zoomOut; | |
} | |
@-webkit-keyframes zoomOutDown { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); | |
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); | |
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomOutDown { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); | |
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); | |
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomOutDown { | |
-webkit-animation-name: zoomOutDown; | |
animation-name: zoomOutDown; | |
} | |
@-webkit-keyframes zoomOutLeft { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | |
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0); | |
transform: scale(.1) translate3d(-2000px, 0, 0); | |
-webkit-transform-origin: left center; | |
transform-origin: left center; | |
} | |
} | |
@keyframes zoomOutLeft { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | |
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0); | |
transform: scale(.1) translate3d(-2000px, 0, 0); | |
-webkit-transform-origin: left center; | |
transform-origin: left center; | |
} | |
} | |
.zoomOutLeft { | |
-webkit-animation-name: zoomOutLeft; | |
animation-name: zoomOutLeft; | |
} | |
@-webkit-keyframes zoomOutRight { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | |
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale(.1) translate3d(2000px, 0, 0); | |
transform: scale(.1) translate3d(2000px, 0, 0); | |
-webkit-transform-origin: right center; | |
transform-origin: right center; | |
} | |
} | |
@keyframes zoomOutRight { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | |
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | |
} | |
to { | |
opacity: 0; | |
-webkit-transform: scale(.1) translate3d(2000px, 0, 0); | |
transform: scale(.1) translate3d(2000px, 0, 0); | |
-webkit-transform-origin: right center; | |
transform-origin: right center; | |
} | |
} | |
.zoomOutRight { | |
-webkit-animation-name: zoomOutRight; | |
animation-name: zoomOutRight; | |
} | |
@-webkit-keyframes zoomOutUp { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); | |
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); | |
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
@keyframes zoomOutUp { | |
40% { | |
opacity: 1; | |
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); | |
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); | |
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | |
} | |
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(0.175, 0.885, 0.320, 1); | |
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | |
} | |
} | |
.zoomOutUp { | |
-webkit-animation-name: zoomOutUp; | |
animation-name: zoomOutUp; | |
} | |
@-webkit-keyframes slideInDown { | |
from { | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
@keyframes slideInDown { | |
from { | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
.slideInDown { | |
-webkit-animation-name: slideInDown; | |
animation-name: slideInDown; | |
} | |
@-webkit-keyframes slideInLeft { | |
from { | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
@keyframes slideInLeft { | |
from { | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
.slideInLeft { | |
-webkit-animation-name: slideInLeft; | |
animation-name: slideInLeft; | |
} | |
@-webkit-keyframes slideInRight { | |
from { | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
@keyframes slideInRight { | |
from { | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
.slideInRight { | |
-webkit-animation-name: slideInRight; | |
animation-name: slideInRight; | |
} | |
@-webkit-keyframes slideInUp { | |
from { | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
@keyframes slideInUp { | |
from { | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
visibility: visible; | |
} | |
to { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
} | |
.slideInUp { | |
-webkit-animation-name: slideInUp; | |
animation-name: slideInUp; | |
} | |
@-webkit-keyframes slideOutDown { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
} | |
@keyframes slideOutDown { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(0, 100%, 0); | |
transform: translate3d(0, 100%, 0); | |
} | |
} | |
.slideOutDown { | |
-webkit-animation-name: slideOutDown; | |
animation-name: slideOutDown; | |
} | |
@-webkit-keyframes slideOutLeft { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
} | |
} | |
@keyframes slideOutLeft { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(-100%, 0, 0); | |
transform: translate3d(-100%, 0, 0); | |
} | |
} | |
.slideOutLeft { | |
-webkit-animation-name: slideOutLeft; | |
animation-name: slideOutLeft; | |
} | |
@-webkit-keyframes slideOutRight { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
} | |
} | |
@keyframes slideOutRight { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(100%, 0, 0); | |
transform: translate3d(100%, 0, 0); | |
} | |
} | |
.slideOutRight { | |
-webkit-animation-name: slideOutRight; | |
animation-name: slideOutRight; | |
} | |
@-webkit-keyframes slideOutUp { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
} | |
} | |
@keyframes slideOutUp { | |
from { | |
-webkit-transform: translate3d(0, 0, 0); | |
transform: translate3d(0, 0, 0); | |
} | |
to { | |
visibility: hidden; | |
-webkit-transform: translate3d(0, -100%, 0); | |
transform: translate3d(0, -100%, 0); | |
} | |
} | |
.slideOutUp { | |
-webkit-animation-name: slideOutUp; | |
animation-name: slideOutUp; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function() { | |
ANIMATE_FIRST = true; | |
ANIMATION_NAME = 'rubberBand'; | |
ANIMATION_DELAY = 4000; //Pause between animations in milliseconds. | |
bbel = document.getElementById('best-bet'); | |
if ( bbel ){ | |
bbel.style.boxShadow = "0 0 1em .25em #FFC72C"; | |
bbel.addEventListener('animationend', function(ev) { bbel.removeAttribute('class'); }); | |
if ( ANIMATE_FIRST) bbel.setAttribute('class', 'animated '+ANIMATION_NAME); | |
window.setInterval(function() { | |
console.log('doing'); | |
//bbel.setAttribute('class', ''); | |
bbel.setAttribute('class', 'animated '+ANIMATION_NAME); | |
}, ANIMATION_DELAY) | |
} | |
})() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"manifest_version": 2, | |
"name": "BestBets Visibility Helper", | |
"description": "Makes damn sure you can see the recommended Best Bets on Josiah.", | |
"version": "1.0", | |
"permissions": [], | |
"content_scripts": [ | |
{ | |
"matches": ["https://search.library.brown.edu/*"], | |
"css": ["animate.css"], | |
"js": ["bb-animate.js"] | |
} | |
] | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment