.bg-section {
color: transparent;
height: 100%;
left: 0;
opacity: 1;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
min-height: 400px
}
.bg-section:after {
content: "";
background-color: rgba(0,0,0,0.7);
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 0
}
.page-theme-section .bg-section {
background-size: cover
}
.bg {
color: transparent;
height: 100%;
left: 0;
opacity: 1;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
min-height: 400px;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover
}
.bg-slideshow {
margin: 0;
padding: 0
}
.bg-slideshow li {
list-style: none
}
.parallax-white .parallax-bg:after {
background-color: rgba(255,255,255,0.9)
}
.parallax-bg:after {
background-color: rgba(0,0,0,0.7);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.parallax-bg {
background-color: rgba(0,0,0,0.7);
height: 100%;
left: 0;
min-height: 400%;
position: absolute;
top: 0;
width: 100%;
z-index: -1
}
{
background-color: transparent!important;
overflow: hidden
}
.parallax-black *, .parallax-black .about-tabs .tab-li-content h4  , .text-white * ,  text-white.about-tabs .tab-li-content h4 {
color: #fff
}
{
color: #fff;
overflow: hidden;
padding: 60px 0
}
.parallax-white .bg-slideshow:after {
background-color: rgba(255,255,255,0.9);
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 0
}
.parallax-black .bg-slideshow:after {
background-color: rgba(0,0,0,0.7);
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 0
}
.bg-slideshow, {
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
z-index:-1
}
.bg-slideshow:after {
content: ''
}
.bg-slideshow li .bg-slide {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
color: transparent;
background-size: cover;
background-position: 50% 50%;
background-repeat: none;
opacity: 0;
z-index: 0
}
.bg-slideshow li .bg-slide {
-webkit-backface-visibility: hidden;
-webkit-animation: imageAnimation 18s linear infinite 0s;
-moz-animation: imageAnimation 18s linear infinite 0s;
-o-animation: imageAnimation 18s linear infinite 0s;
-ms-animation: imageAnimation 18s linear infinite 0s;
animation: imageAnimation 18s linear infinite 0s
}
.bg-slideshow li:nth-child(2) .bg-slide {
-webkit-animation-delay: 9s;
-moz-animation-delay: 9s;
-o-animation-delay: 9s;
-ms-animation-delay: 9s;
animation-delay: 9s
}
@-webkit-keyframes imageAnimation {
1% {
opacity:0;
-webkit-animation-timing-function:ease-in
}
4% {
opacity:0;
-webkit-transform:scale(1);
-webkit-animation-timing-function:ease-out
}
22% {
opacity:1;
-webkit-transform:scale(1.1) rotate(-2deg)
}
44% {
opacity:1;
-webkit-transform:scale(1.1) rotate(1deg)
}
100% {
opacity:0
}
}
@-moz-keyframes imageAnimation {
1% {
opacity:0;
-moz-animation-timing-function:ease-in
}
4% {
opacity:0;
-moz-transform:scale(1);
-moz-animation-timing-function:ease-out
}
22% {
opacity:1;
-moz-transform:scale(1.1) rotate(-2deg)
}
44% {
opacity:1;
-moz-transform:scale(1.1) rotate(1deg)
}
100% {
opacity:0
}
}
@-o-keyframes imageAnimation {
1% {
opacity:0;
-o-animation-timing-function:ease-in
}
4% {
opacity:0;
-o-transform:scale(1);
-o-animation-timing-function:ease-out
}
22% {
opacity:1;
-o-transform:scale(1.1) rotate(-2deg)
}
44% {
opacity:1;
-o-transform:scale(1.1) rotate(1deg)
}
100% {
opacity:0
}
}
@-ms-keyframes imageAnimation {
1% {
opacity:0;
-ms-animation-timing-function:ease-in
}
4% {
opacity:0;
-ms-transform:scale(1);
-ms-animation-timing-function:ease-out
}
22% {
opacity:1;
-ms-transform:scale(1.1) rotate(-2deg)
}
44% {
opacity:1;
-ms-transform:scale(1.1) rotate(1deg)
}
100% {
opacity:0
}
}
@keyframes imageAnimation {
1% {
opacity:0;
animation-timing-function:ease-in
}
4% {
opacity:0;
transform:scale(1);
animation-timing-function:ease-out
}
22% {
opacity:1;
transform:scale(1.1) rotate(-2deg)
}
44% {
opacity:1;
transform:scale(1.1) rotate(1deg)
}
100% {
opacity:0
}
}
.contact-section {
height: 355px;
margin-bottom: -20px;
overflow: hidden
}
.contact-section .icon-line .fa {
background: #f5f5f5!important
}
.contact-section .section-header .fa::after, .contact-section .section-header .fa::before {
background: #f5f5f5!important;
font-size: 50px!important;
margin: 0 auto
}
.cd-background-wrapper {
overflow: hidden;
position: absolute;
left: 0;
top: 0
}
.no-touch .cd-background-wrapper {
-webkit-perspective: 4000px;
-moz-perspective: 4000px;
perspective: 4000px
}
.cd-background-wrapper::before {
content: 'web';
display: none
}
.touch .cd-background-wrapper::before {
content: 'mobile'
}
.cd-floating-background {
position: relative
}
.cd-floating-background img {
display: block;
width: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background-color: rgba(255,255,255,0.01)
}
.cd-floating-background img:not(:first-child) {
position: absolute;
top: 0;
left: 0;
width: auto;
height: auto
}
.no-touch .cd-floating-background {
top: 0;
left: 0;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0)
}
.no-touch .cd-floating-background.is-absolute {
position: absolute
}
.no-touch .cd-floating-background img:first-child {
-webkit-transform: translateZ(50px);
-moz-transform: translateZ(50px);
-ms-transform: translateZ(50px);
-o-transform: translateZ(50px);
transform: translateZ(50px)
}
.no-touch .cd-floating-background img:nth-child(2) {
-webkit-transform: translateZ(290px);
-moz-transform: translateZ(290px);
-ms-transform: translateZ(290px);
-o-transform: translateZ(290px);
transform: translateZ(290px)
}
.no-touch .cd-floating-background img:nth-child(3) {
-webkit-transform: translateZ(400px);
-moz-transform: translateZ(400px);
-ms-transform: translateZ(400px);
-o-transform: translateZ(400px);
transform: translateZ(400px)
}
.no-touch.no-preserve-3d .cd-floating-background {
position: relative
}
body {
-webkit-backface-visibility: hidden
}
.animated-css .animated {
opacity: 0;
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
-o-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.animated-css .animated.animation-done {
opacity: 1
}
.animated.hinge {
-webkit-animation-duration: 2s;
-moz-animation-duration: 2s;
-o-animation-duration: 2s;
animation-duration: 2s
}
@-webkit-keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@-moz-keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@-o-keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
.flash {
-webkit-animation-name: flash;
-moz-animation-name: flash;
-o-animation-name: flash;
animation-name: flash
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px)
}
}
@-moz-keyframes shake {
0%, 100% {
-moz-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-moz-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-moz-transform:translateX(10px)
}
}
@-o-keyframes shake {
0%, 100% {
-o-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-o-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-o-transform:translateX(10px)
}
}
@keyframes shake {
0%, 100% {
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
transform:translateX(10px)
}
}
.shake {
-webkit-animation-name: shake;
-moz-animation-name: shake;
-o-animation-name: shake;
animation-name: shake
}
@-webkit-keyframes bounce {
0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0)
}
40% {
-webkit-transform:translateY(-30px)
}
60% {
-webkit-transform:translateY(-15px)
}
}
@-moz-keyframes bounce {
0%, 100%, 20%, 50%, 80% {
-moz-transform:translateY(0)
}
40% {
-moz-transform:translateY(-30px)
}
60% {
-moz-transform:translateY(-15px)
}
}
@-o-keyframes bounce {
0%, 100%, 20%, 50%, 80% {
-o-transform:translateY(0)
}
40% {
-o-transform:translateY(-30px)
}
60% {
-o-transform:translateY(-15px)
}
}
@keyframes bounce {
0%, 100%, 20%, 50%, 80% {
transform:translateY(0)
}
40% {
transform:translateY(-30px)
}
60% {
transform:translateY(-15px)
}
}
.bounce {
-webkit-animation-name: bounce;
-moz-animation-name: bounce;
-o-animation-name: bounce;
animation-name: bounce
}
@-webkit-keyframes tada {
0% {
-webkit-transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0)
}
}
@-moz-keyframes tada {
0% {
-moz-transform:scale(1)
}
10%, 20% {
-moz-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-moz-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-moz-transform:scale(1.1) rotate(-3deg)
}
100% {
-moz-transform:scale(1) rotate(0)
}
}
@-o-keyframes tada {
0% {
-o-transform:scale(1)
}
10%, 20% {
-o-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-o-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-o-transform:scale(1.1) rotate(-3deg)
}
100% {
-o-transform:scale(1) rotate(0)
}
}
@keyframes tada {
0% {
transform:scale(1)
}
10%, 20% {
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
transform:scale(1.1) rotate(-3deg)
}
100% {
transform:scale(1) rotate(0)
}
}
.tada {
-webkit-animation-name: tada;
-moz-animation-name: tada;
-o-animation-name: tada;
animation-name: tada
}
@-webkit-keyframes swing {
100%, 20%, 40%, 60%, 80% {
-webkit-transform-origin:top center
}
20% {
-webkit-transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg)
}
}
@-moz-keyframes swing {
20% {
-moz-transform:rotate(15deg)
}
40% {
-moz-transform:rotate(-10deg)
}
60% {
-moz-transform:rotate(5deg)
}
80% {
-moz-transform:rotate(-5deg)
}
100% {
-moz-transform:rotate(0deg)
}
}
@-o-keyframes swing {
20% {
-o-transform:rotate(15deg)
}
40% {
-o-transform:rotate(-10deg)
}
60% {
-o-transform:rotate(5deg)
}
80% {
-o-transform:rotate(-5deg)
}
100% {
-o-transform:rotate(0deg)
}
}
@keyframes swing {
20% {
transform:rotate(15deg)
}
40% {
transform:rotate(-10deg)
}
60% {
transform:rotate(5deg)
}
80% {
transform:rotate(-5deg)
}
100% {
transform:rotate(0deg)
}
}
.swing {
-webkit-transform-origin: top center;
-moz-transform-origin: top center;
-o-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
-moz-animation-name: swing;
-o-animation-name: swing;
animation-name: swing
}
@-webkit-keyframes wobble {
0% {
-webkit-transform:translateX(0%)
}
15% {
-webkit-transform:translateX(-25%) rotate(-5deg)
}
30% {
-webkit-transform:translateX(20%) rotate(3deg)
}
45% {
-webkit-transform:translateX(-15%) rotate(-3deg)
}
60% {
-webkit-transform:translateX(10%) rotate(2deg)
}
75% {
-webkit-transform:translateX(-5%) rotate(-1deg)
}
100% {
-webkit-transform:translateX(0%)
}
}
@-moz-keyframes wobble {
0% {
-moz-transform:translateX(0%)
}
15% {
-moz-transform:translateX(-25%) rotate(-5deg)
}
30% {
-moz-transform:translateX(20%) rotate(3deg)
}
45% {
-moz-transform:translateX(-15%) rotate(-3deg)
}
60% {
-moz-transform:translateX(10%) rotate(2deg)
}
75% {
-moz-transform:translateX(-5%) rotate(-1deg)
}
100% {
-moz-transform:translateX(0%)
}
}
@-o-keyframes wobble {
0% {
-o-transform:translateX(0%)
}
15% {
-o-transform:translateX(-25%) rotate(-5deg)
}
30% {
-o-transform:translateX(20%) rotate(3deg)
}
45% {
-o-transform:translateX(-15%) rotate(-3deg)
}
60% {
-o-transform:translateX(10%) rotate(2deg)
}
75% {
-o-transform:translateX(-5%) rotate(-1deg)
}
100% {
-o-transform:translateX(0%)
}
}
@keyframes wobble {
0% {
transform:translateX(0%)
}
15% {
transform:translateX(-25%) rotate(-5deg)
}
30% {
transform:translateX(20%) rotate(3deg)
}
45% {
transform:translateX(-15%) rotate(-3deg)
}
60% {
transform:translateX(10%) rotate(2deg)
}
75% {
transform:translateX(-5%) rotate(-1deg)
}
100% {
transform:translateX(0%)
}
}
.wobble {
-webkit-animation-name: wobble;
-moz-animation-name: wobble;
-o-animation-name: wobble;
animation-name: wobble
}
@-webkit-keyframes pulse {
0% {
-webkit-transform:scale(1)
}
50% {
-webkit-transform:scale(1.1)
}
100% {
-webkit-transform:scale(1)
}
}
@-moz-keyframes pulse {
0% {
-moz-transform:scale(1)
}
50% {
-moz-transform:scale(1.1)
}
100% {
-moz-transform:scale(1)
}
}
@-o-keyframes pulse {
0% {
-o-transform:scale(1)
}
50% {
-o-transform:scale(1.1)
}
100% {
-o-transform:scale(1)
}
}
@keyframes pulse {
0% {
transform:scale(1)
}
50% {
transform:scale(1.1)
}
100% {
transform:scale(1)
}
}
.pulse {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
-o-animation-name: pulse;
animation-name: pulse
}
@-webkit-keyframes flip {
0% {
-webkit-transform:perspective(400px) rotateY(0);
-webkit-animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg);
-webkit-animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) rotateY(360deg) scale(.95);
-webkit-animation-timing-function:ease-in
}
100% {
-webkit-transform:perspective(400px) scale(1);
-webkit-animation-timing-function:ease-in
}
}
@-moz-keyframes flip {
0% {
-moz-transform:perspective(400px) rotateY(0);
-moz-animation-timing-function:ease-out
}
40% {
-moz-transform:perspective(400px) translateZ(150px) rotateY(170deg);
-moz-animation-timing-function:ease-out
}
50% {
-moz-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-moz-animation-timing-function:ease-in
}
80% {
-moz-transform:perspective(400px) rotateY(360deg) scale(.95);
-moz-animation-timing-function:ease-in
}
100% {
-moz-transform:perspective(400px) scale(1);
-moz-animation-timing-function:ease-in
}
}
@-o-keyframes flip {
0% {
-o-transform:perspective(400px) rotateY(0);
-o-animation-timing-function:ease-out
}
40% {
-o-transform:perspective(400px) translateZ(150px) rotateY(170deg);
-o-animation-timing-function:ease-out
}
50% {
-o-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-o-animation-timing-function:ease-in
}
80% {
-o-transform:perspective(400px) rotateY(360deg) scale(.95);
-o-animation-timing-function:ease-in
}
100% {
-o-transform:perspective(400px) scale(1);
-o-animation-timing-function:ease-in
}
}
@keyframes flip {
0% {
transform:perspective(400px) rotateY(0);
animation-timing-function:ease-out
}
40% {
transform:perspective(400px) translateZ(150px) rotateY(170deg);
animation-timing-function:ease-out
}
50% {
transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
animation-timing-function:ease-in
}
80% {
transform:perspective(400px) rotateY(360deg) scale(.95);
animation-timing-function:ease-in
}
100% {
transform:perspective(400px) scale(1);
animation-timing-function:ease-in
}
}
.flip {
-webkit-backface-visibility: visible!important;
-webkit-animation-name: flip;
-moz-backface-visibility: visible!important;
-moz-animation-name: flip;
-o-backface-visibility: visible!important;
-o-animation-name: flip;
backface-visibility: visible!important;
animation-name: flip
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
@-moz-keyframes flipInX {
0% {
-moz-transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-moz-transform:perspective(400px) rotateX(-10deg)
}
70% {
-moz-transform:perspective(400px) rotateX(10deg)
}
100% {
-moz-transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
@-o-keyframes flipInX {
0% {
-o-transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-o-transform:perspective(400px) rotateX(-10deg)
}
70% {
-o-transform:perspective(400px) rotateX(10deg)
}
100% {
-o-transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
@keyframes flipInX {
0% {
transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
transform:perspective(400px) rotateX(-10deg)
}
70% {
transform:perspective(400px) rotateX(10deg)
}
100% {
transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
.flipInX {
-webkit-backface-visibility: visible!important;
-webkit-animation-name: flipInX;
-moz-backface-visibility: visible!important;
-moz-animation-name: flipInX;
-o-backface-visibility: visible!important;
-o-animation-name: flipInX;
backface-visibility: visible!important;
animation-name: flipInX
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
@-moz-keyframes flipOutX {
0% {
-moz-transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
-moz-transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
@-o-keyframes flipOutX {
0% {
-o-transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
-o-transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
@keyframes flipOutX {
0% {
transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
-webkit-backface-visibility: visible!important;
-moz-animation-name: flipOutX;
-moz-backface-visibility: visible!important;
-o-animation-name: flipOutX;
-o-backface-visibility: visible!important;
animation-name: flipOutX;
backface-visibility: visible!important
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateY(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
@-moz-keyframes flipInY {
0% {
-moz-transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-moz-transform:perspective(400px) rotateY(-10deg)
}
70% {
-moz-transform:perspective(400px) rotateY(10deg)
}
100% {
-moz-transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
@-o-keyframes flipInY {
0% {
-o-transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-o-transform:perspective(400px) rotateY(-10deg)
}
70% {
-o-transform:perspective(400px) rotateY(10deg)
}
100% {
-o-transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
@keyframes flipInY {
0% {
transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
transform:perspective(400px) rotateY(-10deg)
}
70% {
transform:perspective(400px) rotateY(10deg)
}
100% {
transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
.flipInY {
-webkit-backface-visibility: visible!important;
-webkit-animation-name: flipInY;
-moz-backface-visibility: visible!important;
-moz-animation-name: flipInY;
-o-backface-visibility: visible!important;
-o-animation-name: flipInY;
backface-visibility: visible!important;
animation-name: flipInY
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
@-moz-keyframes flipOutY {
0% {
-moz-transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
-moz-transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
@-o-keyframes flipOutY {
0% {
-o-transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
-o-transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
@keyframes flipOutY {
0% {
transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
.flipOutY {
-webkit-backface-visibility: visible!important;
-webkit-animation-name: flipOutY;
-moz-backface-visibility: visible!important;
-moz-animation-name: flipOutY;
-o-backface-visibility: visible!important;
-o-animation-name: flipOutY;
backface-visibility: visible!important;
animation-name: flipOutY
}
@-webkit-keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
@-moz-keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
@-o-keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn
}
@-webkit-keyframes fadeInUp {
0% {
opacity:0;
-webkit-transform:translateY(20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInUp {
0% {
opacity:0;
-moz-transform:translateY(20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-o-keyframes fadeInUp {
0% {
opacity:0;
-o-transform:translateY(20px)
}
100% {
opacity:1;
-o-transform:translateY(0)
}
}
@keyframes fadeInUp {
0% {
opacity:0;
transform:translateY(20px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
-moz-animation-name: fadeInUp;
-o-animation-name: fadeInUp;
animation-name: fadeInUp
}
@-webkit-keyframes fadeInDown {
0% {
opacity:0;
-webkit-transform:translateY(-20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInDown {
0% {
opacity:0;
-moz-transform:translateY(-20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-o-keyframes fadeInDown {
0% {
opacity:0;
-o-transform:translateY(-20px)
}
100% {
opacity:1;
-o-transform:translateY(0)
}
}
@keyframes fadeInDown {
0% {
opacity:0;
transform:translateY(-20px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown
}
@-webkit-keyframes fadeInLeft {
0% {
opacity:0;
-webkit-transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInLeft {
0% {
opacity:0;
-moz-transform:translateX(-20px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-o-keyframes fadeInLeft {
0% {
opacity:0;
-o-transform:translateX(-20px)
}
100% {
opacity:1;
-o-transform:translateX(0)
}
}
@keyframes fadeInLeft {
0% {
opacity:0;
transform:translateX(-20px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft
}
@-webkit-keyframes fadeInRight {
0% {
opacity:0;
-webkit-transform:translateX(20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInRight {
0% {
opacity:0;
-moz-transform:translateX(20px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-o-keyframes fadeInRight {
0% {
opacity:0;
-o-transform:translateX(20px)
}
100% {
opacity:1;
-o-transform:translateX(0)
}
}
@keyframes fadeInRight {
0% {
opacity:0;
transform:translateX(20px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
-moz-animation-name: fadeInRight;
-o-animation-name: fadeInRight;
animation-name: fadeInRight
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity:0;
-webkit-transform:translateY(2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInUpBig {
0% {
opacity:0;
-moz-transform:translateY(2000px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-o-keyframes fadeInUpBig {
0% {
opacity:0;
-o-transform:translateY(2000px)
}
100% {
opacity:1;
-o-transform:translateY(0)
}
}
@keyframes fadeInUpBig {
0% {
opacity:0;
transform:translateY(2000px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
-moz-animation-name: fadeInUpBig;
-o-animation-name: fadeInUpBig;
animation-name: fadeInUpBig
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInDownBig {
0% {
opacity:0;
-moz-transform:translateY(-2000px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-o-keyframes fadeInDownBig {
0% {
opacity:0;
-o-transform:translateY(-2000px)
}
100% {
opacity:1;
-o-transform:translateY(0)
}
}
@keyframes fadeInDownBig {
0% {
opacity:0;
transform:translateY(-2000px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
-moz-animation-name: fadeInDownBig;
-o-animation-name: fadeInDownBig;
animation-name: fadeInDownBig
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInLeftBig {
0% {
opacity:0;
-moz-transform:translateX(-2000px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-o-keyframes fadeInLeftBig {
0% {
opacity:0;
-o-transform:translateX(-2000px)
}
100% {
opacity:1;
-o-transform:translateX(0)
}
}
@keyframes fadeInLeftBig {
0% {
opacity:0;
transform:translateX(-2000px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
-moz-animation-name: fadeInLeftBig;
-o-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity:0;
-webkit-transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInRightBig {
0% {
opacity:0;
-moz-transform:translateX(2000px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-o-keyframes fadeInRightBig {
0% {
opacity:0;
-o-transform:translateX(2000px)
}
100% {
opacity:1;
-o-transform:translateX(0)
}
}
@keyframes fadeInRightBig {
0% {
opacity:0;
transform:translateX(2000px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
-moz-animation-name: fadeInRightBig;
-o-animation-name: fadeInRightBig;
animation-name: fadeInRightBig
}
@-webkit-keyframes fadeOut {
0% {
opacity:1
}
100% {
opacity:0
}
}
@-moz-keyframes fadeOut {
0% {
opacity:1
}
100% {
opacity:0
}
}
@-o-keyframes fadeOut {
0% {
opacity:1
}
100% {
opacity:0
}
}
@keyframes fadeOut {
0% {
opacity:1
}
100% {
opacity:0
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
-moz-animation-name: fadeOut;
-o-animation-name: fadeOut;
animation-name: fadeOut
}
@-webkit-keyframes fadeOutUp {
0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-20px)
}
}
@-moz-keyframes fadeOutUp {
0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(-20px)
}
}
@-o-keyframes fadeOutUp {
0% {
opacity:1;
-o-transform:translateY(0)
}
100% {
opacity:0;
-o-transform:translateY(-20px)
}
}
@keyframes fadeOutUp {
0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(-20px)
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
-moz-animation-name: fadeOutUp;
-o-animation-name: fadeOutUp;
animation-name: fadeOutUp
}
@-webkit-keyframes fadeOutDown {
0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(20px)
}
}
@-moz-keyframes fadeOutDown {
0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(20px)
}
}
@-o-keyframes fadeOutDown {
0% {
opacity:1;
-o-transform:translateY(0)
}
100% {
opacity:0;
-o-transform:translateY(20px)
}
}
@keyframes fadeOutDown {
0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(20px)
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
-moz-animation-name: fadeOutDown;
-o-animation-name: fadeOutDown;
animation-name: fadeOutDown
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-20px)
}
}
@-moz-keyframes fadeOutLeft {
0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(-20px)
}
}
@-o-keyframes fadeOutLeft {
0% {
opacity:1;
-o-transform:translateX(0)
}
100% {
opacity:0;
-o-transform:translateX(-20px)
}
}
@keyframes fadeOutLeft {
0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(-20px)
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
-moz-animation-name: fadeOutLeft;
-o-animation-name: fadeOutLeft;
animation-name: fadeOutLeft
}
@-webkit-keyframes fadeOutRight {
0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(20px)
}
}
@-moz-keyframes fadeOutRight {
0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(20px)
}
}
@-o-keyframes fadeOutRight {
0% {
opacity:1;
-o-transform:translateX(0)
}
100% {
opacity:0;
-o-transform:translateX(20px)
}
}
@keyframes fadeOutRight {
0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(20px)
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
-moz-animation-name: fadeOutRight;
-o-animation-name: fadeOutRight;
animation-name: fadeOutRight
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
}
@-moz-keyframes fadeOutUpBig {
0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(-2000px)
}
}
@-o-keyframes fadeOutUpBig {
0% {
opacity:1;
-o-transform:translateY(0)
}
100% {
opacity:0;
-o-transform:translateY(-2000px)
}
}
@keyframes fadeOutUpBig {
0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(-2000px)
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
-moz-animation-name: fadeOutUpBig;
-o-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px)
}
}
@-moz-keyframes fadeOutDownBig {
0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(2000px)
}
}
@-o-keyframes fadeOutDownBig {
0% {
opacity:1;
-o-transform:translateY(0)
}
100% {
opacity:0;
-o-transform:translateY(2000px)
}
}
@keyframes fadeOutDownBig {
0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(2000px)
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
-moz-animation-name: fadeOutDownBig;
-o-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
}
@-moz-keyframes fadeOutLeftBig {
0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(-2000px)
}
}
@-o-keyframes fadeOutLeftBig {
0% {
opacity:1;
-o-transform:translateX(0)
}
100% {
opacity:0;
-o-transform:translateX(-2000px)
}
}
@keyframes fadeOutLeftBig {
0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(-2000px)
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
-moz-animation-name: fadeOutLeftBig;
-o-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px)
}
}
@-moz-keyframes fadeOutRightBig {
0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(2000px)
}
}
@-o-keyframes fadeOutRightBig {
0% {
opacity:1;
-o-transform:translateX(0)
}
100% {
opacity:0;
-o-transform:translateX(2000px)
}
}
@keyframes fadeOutRightBig {
0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(2000px)
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
-moz-animation-name: fadeOutRightBig;
-o-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig
}
@-webkit-keyframes bounceIn {
0% {
opacity:0;
-webkit-transform:scale(.3)
}
50% {
opacity:1;
-webkit-transform:scale(1.05)
}
70% {
-webkit-transform:scale(.9)
}
100% {
-webkit-transform:scale(1)
}
}
@-moz-keyframes bounceIn {
0% {
opacity:0;
-moz-transform:scale(.3)
}
50% {
opacity:1;
-moz-transform:scale(1.05)
}
70% {
-moz-transform:scale(.9)
}
100% {
-moz-transform:scale(1)
}
}
@-o-keyframes bounceIn {
0% {
opacity:0;
-o-transform:scale(.3)
}
50% {
opacity:1;
-o-transform:scale(1.05)
}
70% {
-o-transform:scale(.9)
}
100% {
-o-transform:scale(1)
}
}
@keyframes bounceIn {
0% {
opacity:0;
transform:scale(.3)
}
50% {
opacity:1;
transform:scale(1.05)
}
70% {
transform:scale(.9)
}
100% {
transform:scale(1)
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
-moz-animation-name: bounceIn;
-o-animation-name: bounceIn;
animation-name: bounceIn
}
@-webkit-keyframes bounceInUp {
0% {
opacity:0;
-webkit-transform:translateY(2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(-30px)
}
80% {
-webkit-transform:translateY(10px)
}
100% {
-webkit-transform:translateY(0)
}
}
@-moz-keyframes bounceInUp {
0% {
opacity:0;
-moz-transform:translateY(2000px)
}
60% {
opacity:1;
-moz-transform:translateY(-30px)
}
80% {
-moz-transform:translateY(10px)
}
100% {
-moz-transform:translateY(0)
}
}
@-o-keyframes bounceInUp {
0% {
opacity:0;
-o-transform:translateY(2000px)
}
60% {
opacity:1;
-o-transform:translateY(-30px)
}
80% {
-o-transform:translateY(10px)
}
100% {
-o-transform:translateY(0)
}
}
@keyframes bounceInUp {
0% {
opacity:0;
transform:translateY(2000px)
}
60% {
opacity:1;
transform:translateY(-30px)
}
80% {
transform:translateY(10px)
}
100% {
transform:translateY(0)
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
-moz-animation-name: bounceInUp;
-o-animation-name: bounceInUp;
animation-name: bounceInUp
}
@-webkit-keyframes bounceInDown {
0% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(30px)
}
80% {
-webkit-transform:translateY(-10px)
}
100% {
-webkit-transform:translateY(0)
}
}
@-moz-keyframes bounceInDown {
0% {
opacity:0;
-moz-transform:translateY(-2000px)
}
60% {
opacity:1;
-moz-transform:translateY(30px)
}
80% {
-moz-transform:translateY(-10px)
}
100% {
-moz-transform:translateY(0)
}
}
@-o-keyframes bounceInDown {
0% {
opacity:0;
-o-transform:translateY(-2000px)
}
60% {
opacity:1;
-o-transform:translateY(30px)
}
80% {
-o-transform:translateY(-10px)
}
100% {
-o-transform:translateY(0)
}
}
@keyframes bounceInDown {
0% {
opacity:0;
transform:translateY(-2000px)
}
60% {
opacity:1;
transform:translateY(30px)
}
80% {
transform:translateY(-10px)
}
100% {
transform:translateY(0)
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
-moz-animation-name: bounceInDown;
-o-animation-name: bounceInDown;
animation-name: bounceInDown
}
@-webkit-keyframes bounceInLeft {
0% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(30px)
}
80% {
-webkit-transform:translateX(-10px)
}
100% {
-webkit-transform:translateX(0)
}
}
@-moz-keyframes bounceInLeft {
0% {
opacity:0;
-moz-transform:translateX(-2000px)
}
60% {
opacity:1;
-moz-transform:translateX(30px)
}
80% {
-moz-transform:translateX(-10px)
}
100% {
-moz-transform:translateX(0)
}
}
@-o-keyframes bounceInLeft {
0% {
opacity:0;
-o-transform:translateX(-2000px)
}
60% {
opacity:1;
-o-transform:translateX(30px)
}
80% {
-o-transform:translateX(-10px)
}
100% {
-o-transform:translateX(0)
}
}
@keyframes bounceInLeft {
0% {
opacity:0;
transform:translateX(-2000px)
}
60% {
opacity:1;
transform:translateX(30px)
}
80% {
transform:translateX(-10px)
}
100% {
transform:translateX(0)
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
-moz-animation-name: bounceInLeft;
-o-animation-name: bounceInLeft;
animation-name: bounceInLeft
}
@-webkit-keyframes bounceInRight {
0% {
opacity:0;
-webkit-transform:translateX(2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(-30px)
}
80% {
-webkit-transform:translateX(10px)
}
100% {
-webkit-transform:translateX(0)
}
}
@-moz-keyframes bounceInRight {
0% {
opacity:0;
-moz-transform:translateX(2000px)
}
60% {
opacity:1;
-moz-transform:translateX(-30px)
}
80% {
-moz-transform:translateX(10px)
}
100% {
-moz-transform:translateX(0)
}
}
@-o-keyframes bounceInRight {
0% {
opacity:0;
-o-transform:translateX(2000px)
}
60% {
opacity:1;
-o-transform:translateX(-30px)
}
80% {
-o-transform:translateX(10px)
}
100% {
-o-transform:translateX(0)
}
}
@keyframes bounceInRight {
0% {
opacity:0;
transform:translateX(2000px)
}
60% {
opacity:1;
transform:translateX(-30px)
}
80% {
transform:translateX(10px)
}
100% {
transform:translateX(0)
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
-moz-animation-name: bounceInRight;
-o-animation-name: bounceInRight;
animation-name: bounceInRight
}
@-webkit-keyframes bounceOut {
0% {
-webkit-transform:scale(1)
}
25% {
-webkit-transform:scale(.95)
}
50% {
opacity:1;
-webkit-transform:scale(1.1)
}
100% {
opacity:0;
-webkit-transform:scale(.3)
}
}
@-moz-keyframes bounceOut {
0% {
-moz-transform:scale(1)
}
25% {
-moz-transform:scale(.95)
}
50% {
opacity:1;
-moz-transform:scale(1.1)
}
100% {
opacity:0;
-moz-transform:scale(.3)
}
}
@-o-keyframes bounceOut {
0% {
-o-transform:scale(1)
}
25% {
-o-transform:scale(.95)
}
50% {
opacity:1;
-o-transform:scale(1.1)
}
100% {
opacity:0;
-o-transform:scale(.3)
}
}
@keyframes bounceOut {
0% {
transform:scale(1)
}
25% {
transform:scale(.95)
}
50% {
opacity:1;
transform:scale(1.1)
}
100% {
opacity:0;
transform:scale(.3)
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
-moz-animation-name: bounceOut;
-o-animation-name: bounceOut;
animation-name: bounceOut
}
@-webkit-keyframes bounceOutUp {
0% {
-webkit-transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(20px)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
}
@-moz-keyframes bounceOutUp {
0% {
-moz-transform:translateY(0)
}
20% {
opacity:1;
-moz-transform:translateY(20px)
}
100% {
opacity:0;
-moz-transform:translateY(-2000px)
}
}
@-o-keyframes bounceOutUp {
0% {
-o-transform:translateY(0)
}
20% {
opacity:1;
-o-transform:translateY(20px)
}
100% {
opacity:0;
-o-transform:translateY(-2000px)
}
}
@keyframes bounceOutUp {
0% {
transform:translateY(0)
}
20% {
opacity:1;
transform:translateY(20px)
}
100% {
opacity:0;
transform:translateY(-2000px)
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
-moz-animation-name: bounceOutUp;
-o-animation-name: bounceOutUp;
animation-name: bounceOutUp
}
@-webkit-keyframes bounceOutDown {
0% {
-webkit-transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(-20px)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px)
}
}
@-moz-keyframes bounceOutDown {
0% {
-moz-transform:translateY(0)
}
20% {
opacity:1;
-moz-transform:translateY(-20px)
}
100% {
opacity:0;
-moz-transform:translateY(2000px)
}
}
@-o-keyframes bounceOutDown {
0% {
-o-transform:translateY(0)
}
20% {
opacity:1;
-o-transform:translateY(-20px)
}
100% {
opacity:0;
-o-transform:translateY(2000px)
}
}
@keyframes bounceOutDown {
0% {
transform:translateY(0)
}
20% {
opacity:1;
transform:translateY(-20px)
}
100% {
opacity:0;
transform:translateY(2000px)
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
-moz-animation-name: bounceOutDown;
-o-animation-name: bounceOutDown;
animation-name: bounceOutDown
}
@-webkit-keyframes bounceOutLeft {
0% {
-webkit-transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(20px)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
}
@-moz-keyframes bounceOutLeft {
0% {
-moz-transform:translateX(0)
}
20% {
opacity:1;
-moz-transform:translateX(20px)
}
100% {
opacity:0;
-moz-transform:translateX(-2000px)
}
}
@-o-keyframes bounceOutLeft {
0% {
-o-transform:translateX(0)
}
20% {
opacity:1;
-o-transform:translateX(20px)
}
100% {
opacity:0;
-o-transform:translateX(-2000px)
}
}
@keyframes bounceOutLeft {
0% {
transform:translateX(0)
}
20% {
opacity:1;
transform:translateX(20px)
}
100% {
opacity:0;
transform:translateX(-2000px)
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
-moz-animation-name: bounceOutLeft;
-o-animation-name: bounceOutLeft;
animation-name: bounceOutLeft
}
@-webkit-keyframes bounceOutRight {
0% {
-webkit-transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(-20px)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px)
}
}
@-moz-keyframes bounceOutRight {
0% {
-moz-transform:translateX(0)
}
20% {
opacity:1;
-moz-transform:translateX(-20px)
}
100% {
opacity:0;
-moz-transform:translateX(2000px)
}
}
@-o-keyframes bounceOutRight {
0% {
-o-transform:translateX(0)
}
20% {
opacity:1;
-o-transform:translateX(-20px)
}
100% {
opacity:0;
-o-transform:translateX(2000px)
}
}
@keyframes bounceOutRight {
0% {
transform:translateX(0)
}
20% {
opacity:1;
transform:translateX(-20px)
}
100% {
opacity:0;
transform:translateX(2000px)
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
-moz-animation-name: bounceOutRight;
-o-animation-name: bounceOutRight;
animation-name: bounceOutRight
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(-200deg);
opacity:0
}
100% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateIn {
0% {
-moz-transform-origin:center center;
-moz-transform:rotate(-200deg);
opacity:0
}
100% {
-moz-transform-origin:center center;
-moz-transform:rotate(0);
opacity:1
}
}
@-o-keyframes rotateIn {
0% {
-o-transform-origin:center center;
-o-transform:rotate(-200deg);
opacity:0
}
100% {
-o-transform-origin:center center;
-o-transform:rotate(0);
opacity:1
}
}
@keyframes rotateIn {
0% {
transform-origin:center center;
transform:rotate(-200deg);
opacity:0
}
100% {
transform-origin:center center;
transform:rotate(0);
opacity:1
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
-moz-animation-name: rotateIn;
-o-animation-name: rotateIn;
animation-name: rotateIn
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInUpLeft {
0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(90deg);
opacity:0
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-o-keyframes rotateInUpLeft {
0% {
-o-transform-origin:left bottom;
-o-transform:rotate(90deg);
opacity:0
}
100% {
-o-transform-origin:left bottom;
-o-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpLeft {
0% {
transform-origin:left bottom;
transform:rotate(90deg);
opacity:0
}
100% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
-moz-animation-name: rotateInUpLeft;
-o-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInDownLeft {
0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-o-keyframes rotateInDownLeft {
0% {
-o-transform-origin:left bottom;
-o-transform:rotate(-90deg);
opacity:0
}
100% {
-o-transform-origin:left bottom;
-o-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownLeft {
0% {
transform-origin:left bottom;
transform:rotate(-90deg);
opacity:0
}
100% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
-moz-animation-name: rotateInDownLeft;
-o-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInUpRight {
0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-o-keyframes rotateInUpRight {
0% {
-o-transform-origin:right bottom;
-o-transform:rotate(-90deg);
opacity:0
}
100% {
-o-transform-origin:right bottom;
-o-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpRight {
0% {
transform-origin:right bottom;
transform:rotate(-90deg);
opacity:0
}
100% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
-moz-animation-name: rotateInUpRight;
-o-animation-name: rotateInUpRight;
animation-name: rotateInUpRight
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInDownRight {
0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(90deg);
opacity:0
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-o-keyframes rotateInDownRight {
0% {
-o-transform-origin:right bottom;
-o-transform:rotate(90deg);
opacity:0
}
100% {
-o-transform-origin:right bottom;
-o-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownRight {
0% {
transform-origin:right bottom;
transform:rotate(90deg);
opacity:0
}
100% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
-moz-animation-name: rotateInDownRight;
-o-animation-name: rotateInDownRight;
animation-name: rotateInDownRight
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(200deg);
opacity:0
}
}
@-moz-keyframes rotateOut {
0% {
-moz-transform-origin:center center;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:center center;
-moz-transform:rotate(200deg);
opacity:0
}
}
@-o-keyframes rotateOut {
0% {
-o-transform-origin:center center;
-o-transform:rotate(0);
opacity:1
}
100% {
-o-transform-origin:center center;
-o-transform:rotate(200deg);
opacity:0
}
}
@keyframes rotateOut {
0% {
transform-origin:center center;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:center center;
transform:rotate(200deg);
opacity:0
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
-moz-animation-name: rotateOut;
-o-animation-name: rotateOut;
animation-name: rotateOut
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
}
@-moz-keyframes rotateOutUpLeft {
0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
}
@-o-keyframes rotateOutUpLeft {
0% {
-o-transform-origin:left bottom;
-o-transform:rotate(0);
opacity:1
}
100% {
-o-transform-origin:left bottom;
-o-transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutUpLeft {
0% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:left bottom;
transform:rotate(-90deg);
opacity:0
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
-moz-animation-name: rotateOutUpLeft;
-o-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
}
@-moz-keyframes rotateOutDownLeft {
0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(90deg);
opacity:0
}
}
@-o-keyframes rotateOutDownLeft {
0% {
-o-transform-origin:left bottom;
-o-transform:rotate(0);
opacity:1
}
100% {
-o-transform-origin:left bottom;
-o-transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutDownLeft {
0% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:left bottom;
transform:rotate(90deg);
opacity:0
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
-moz-animation-name: rotateOutDownLeft;
-o-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
}
@-moz-keyframes rotateOutUpRight {
0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(90deg);
opacity:0
}
}
@-o-keyframes rotateOutUpRight {
0% {
-o-transform-origin:right bottom;
-o-transform:rotate(0);
opacity:1
}
100% {
-o-transform-origin:right bottom;
-o-transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutUpRight {
0% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:right bottom;
transform:rotate(90deg);
opacity:0
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
-moz-animation-name: rotateOutUpRight;
-o-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
}
@-moz-keyframes rotateOutDownRight {
0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
}
@-o-keyframes rotateOutDownRight {
0% {
-o-transform-origin:right bottom;
-o-transform:rotate(0);
opacity:1
}
100% {
-o-transform-origin:right bottom;
-o-transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutDownRight {
0% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:right bottom;
transform:rotate(-90deg);
opacity:0
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
-moz-animation-name: rotateOutDownRight;
-o-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight
}
@-webkit-keyframes hinge {
0% {
-webkit-transform:rotate(0);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
40% {
-webkit-transform:rotate(60deg);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
80% {
-webkit-transform:rotate(60deg) translateY(0);
opacity:1;
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
100% {
-webkit-transform:translateY(700px);
opacity:0
}
}
@-moz-keyframes hinge {
0% {
-moz-transform:rotate(0);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
20%, 60% {
-moz-transform:rotate(80deg);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
40% {
-moz-transform:rotate(60deg);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
80% {
-moz-transform:rotate(60deg) translateY(0);
opacity:1;
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
100% {
-moz-transform:translateY(700px);
opacity:0
}
}
@-o-keyframes hinge {
0% {
-o-transform:rotate(0);
-o-transform-origin:top left;
-o-animation-timing-function:ease-in-out
}
20%, 60% {
-o-transform:rotate(80deg);
-o-transform-origin:top left;
-o-animation-timing-function:ease-in-out
}
40% {
-o-transform:rotate(60deg);
-o-transform-origin:top left;
-o-animation-timing-function:ease-in-out
}
80% {
-o-transform:rotate(60deg) translateY(0);
opacity:1;
-o-transform-origin:top left;
-o-animation-timing-function:ease-in-out
}
100% {
-o-transform:translateY(700px);
opacity:0
}
}
@keyframes hinge {
0% {
transform:rotate(0);
transform-origin:top left;
animation-timing-function:ease-in-out
}
20%, 60% {
transform:rotate(80deg);
transform-origin:top left;
animation-timing-function:ease-in-out
}
40% {
transform:rotate(60deg);
transform-origin:top left;
animation-timing-function:ease-in-out
}
80% {
transform:rotate(60deg) translateY(0);
opacity:1;
transform-origin:top left;
animation-timing-function:ease-in-out
}
100% {
transform:translateY(700px);
opacity:0
}
}
.hinge {
-webkit-animation-name: hinge;
-moz-animation-name: hinge;
-o-animation-name: hinge;
animation-name: hinge
}
@-webkit-keyframes rollIn {
0% {
opacity:0;
-webkit-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg)
}
}
@-moz-keyframes rollIn {
0% {
opacity:0;
-moz-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-moz-transform:translateX(0px) rotate(0deg)
}
}
@-o-keyframes rollIn {
0% {
opacity:0;
-o-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-o-transform:translateX(0px) rotate(0deg)
}
}
@keyframes rollIn {
0% {
opacity:0;
transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
transform:translateX(0px) rotate(0deg)
}
}
.rollIn {
-webkit-animation-name: rollIn;
-moz-animation-name: rollIn;
-o-animation-name: rollIn;
animation-name: rollIn
}
@-webkit-keyframes rollOut {
0% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-webkit-transform:translateX(100%) rotate(120deg)
}
}
@-moz-keyframes rollOut {
0% {
opacity:1;
-moz-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-moz-transform:translateX(100%) rotate(120deg)
}
}
@-o-keyframes rollOut {
0% {
opacity:1;
-o-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-o-transform:translateX(100%) rotate(120deg)
}
}
@keyframes rollOut {
0% {
opacity:1;
transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
transform:translateX(100%) rotate(120deg)
}
}
.rollOut {
-webkit-animation-name: rollOut;
-moz-animation-name: rollOut;
-o-animation-name: rollOut;
animation-name: rollOut
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
opacity:1
}
}
@-moz-keyframes lightSpeedIn {
0% {
-moz-transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-moz-transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-moz-transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-moz-transform:translateX(0%) skewX(0deg);
opacity:1
}
}
@-o-keyframes lightSpeedIn {
0% {
-o-transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-o-transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-o-transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-o-transform:translateX(0%) skewX(0deg);
opacity:1
}
}
@keyframes lightSpeedIn {
0% {
transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
transform:translateX(0%) skewX(0deg);
opacity:1
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
-moz-animation-name: lightSpeedIn;
-o-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
-o-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
.animated.lightSpeedIn {
-webkit-animation-duration: .5s;
-moz-animation-duration: .5s;
-o-animation-duration: .5s;
animation-duration: .5s
}
@-webkit-keyframes lightSpeedOut {
0% {
-webkit-transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
-webkit-transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
@-moz-keyframes lightSpeedOut {
0% {
-moz-transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
-moz-transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
@-o-keyframes lightSpeedOut {
0% {
-o-transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
-o-transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
@keyframes lightSpeedOut {
0% {
transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
-moz-animation-name: lightSpeedOut;
-o-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
.animated.lightSpeedOut {
-webkit-animation-duration: .25s;
-moz-animation-duration: .25s;
-o-animation-duration: .25s;
animation-duration: .25s
}
@-webkit-keyframes wiggle {
0% {
-webkit-transform:skewX(9deg)
}
10% {
-webkit-transform:skewX(-8deg)
}
20% {
-webkit-transform:skewX(7deg)
}
30% {
-webkit-transform:skewX(-6deg)
}
40% {
-webkit-transform:skewX(5deg)
}
50% {
-webkit-transform:skewX(-4deg)
}
60% {
-webkit-transform:skewX(3deg)
}
70% {
-webkit-transform:skewX(-2deg)
}
80% {
-webkit-transform:skewX(1deg)
}
100%, 90% {
-webkit-transform:skewX(0deg)
}
}
@-moz-keyframes wiggle {
0% {
-moz-transform:skewX(9deg)
}
10% {
-moz-transform:skewX(-8deg)
}
20% {
-moz-transform:skewX(7deg)
}
30% {
-moz-transform:skewX(-6deg)
}
40% {
-moz-transform:skewX(5deg)
}
50% {
-moz-transform:skewX(-4deg)
}
60% {
-moz-transform:skewX(3deg)
}
70% {
-moz-transform:skewX(-2deg)
}
80% {
-moz-transform:skewX(1deg)
}
100%, 90% {
-moz-transform:skewX(0deg)
}
}
@-o-keyframes wiggle {
0% {
-o-transform:skewX(9deg)
}
10% {
-o-transform:skewX(-8deg)
}
20% {
-o-transform:skewX(7deg)
}
30% {
-o-transform:skewX(-6deg)
}
40% {
-o-transform:skewX(5deg)
}
50% {
-o-transform:skewX(-4deg)
}
60% {
-o-transform:skewX(3deg)
}
70% {
-o-transform:skewX(-2deg)
}
80% {
-o-transform:skewX(1deg)
}
100%, 90% {
-o-transform:skewX(0deg)
}
}
@keyframes wiggle {
0% {
transform:skewX(9deg)
}
10% {
transform:skewX(-8deg)
}
20% {
transform:skewX(7deg)
}
30% {
transform:skewX(-6deg)
}
40% {
transform:skewX(5deg)
}
50% {
transform:skewX(-4deg)
}
60% {
transform:skewX(3deg)
}
70% {
transform:skewX(-2deg)
}
80% {
transform:skewX(1deg)
}
100%, 90% {
transform:skewX(0deg)
}
}
.wiggle {
-webkit-animation-name: wiggle;
-moz-animation-name: wiggle;
-o-animation-name: wiggle;
animation-name: wiggle;
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
.animated.wiggle {
-webkit-animation-duration: .75s;
-moz-animation-duration: .75s;
-o-animation-duration: .75s;
animation-duration: .75s
} .grow {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.grow:hover {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1)
}
.shrink {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.shrink:hover {
-webkit-transform: scale(0.9);
-ms-transform: scale(0.9);
transform: scale(0.9)
}
@-webkit-keyframes pulse {
25% {
-webkit-transform:scale(1.1);
transform:scale(1.1)
}
75% {
-webkit-transform:scale(0.9);
transform:scale(0.9)
}
}
@keyframes pulse {
25% {
-webkit-transform:scale(1.1);
-ms-transform:scale(1.1);
transform:scale(1.1)
}
75% {
-webkit-transform:scale(0.9);
-ms-transform:scale(0.9);
transform:scale(0.9)
}
}
.pulse {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.pulse:hover {
-webkit-animation-name: pulse;
animation-name: pulse;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}
@-webkit-keyframes pulse-grow {
to {
-webkit-transform:scale(1.1);
transform:scale(1.1)
}
}
@keyframes pulse-grow {
to {
-webkit-transform:scale(1.1);
-ms-transform:scale(1.1);
transform:scale(1.1)
}
}
.pulse-grow {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.pulse-grow:hover {
-webkit-animation-name: pulse-grow;
animation-name: pulse-grow;
-webkit-animation-duration: .3s;
animation-duration: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
@-webkit-keyframes pulse-shrink {
to {
-webkit-transform:scale(0.9);
transform:scale(0.9)
}
}
@keyframes pulse-shrink {
to {
-webkit-transform:scale(0.9);
-ms-transform:scale(0.9);
transform:scale(0.9)
}
}
.pulse-shrink {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.pulse-shrink:hover {
-webkit-animation-name: pulse-shrink;
animation-name: pulse-shrink;
-webkit-animation-duration: .3s;
animation-duration: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
@-webkit-keyframes push {
50% {
-webkit-transform:scale(0.8);
transform:scale(0.8)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes push {
50% {
-webkit-transform:scale(0.8);
-ms-transform:scale(0.8);
transform:scale(0.8)
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.push {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.push:hover {
-webkit-animation-name: push;
animation-name: push;
-webkit-animation-duration: .3s;
animation-duration: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes pop {
50% {
-webkit-transform:scale(1.2);
transform:scale(1.2)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes pop {
50% {
-webkit-transform:scale(1.2);
-ms-transform:scale(1.2);
transform:scale(1.2)
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.pop {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.pop:hover {
-webkit-animation-name: pop;
animation-name: pop;
-webkit-animation-duration: .3s;
animation-duration: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
.rotate {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.rotate:hover {
-webkit-transform: rotate(4deg);
-ms-transform: rotate(4deg);
transform: rotate(4deg)
}
.grow-rotate {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.grow-rotate:hover {
-webkit-transform: scale(1.1) rotate(4deg);
-ms-transform: scale(1.1) rotate(4deg);
transform: scale(1.1) rotate(4deg)
}
.float {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.float:hover {
-webkit-transform: translateY(-5px);
-ms-transform: translateY(-5px);
transform: translateY(-5px)
}
.sink {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.sink:hover {
-webkit-transform: translateY(5px);
-ms-transform: translateY(5px);
transform: translateY(5px)
}
@-webkit-keyframes hover {
50% {
-webkit-transform:translateY(-3px);
transform:translateY(-3px)
}
100% {
-webkit-transform:translateY(-6px);
transform:translateY(-6px)
}
}
@keyframes hover {
50% {
-webkit-transform:translateY(-3px);
-ms-transform:translateY(-3px);
transform:translateY(-3px)
}
100% {
-webkit-transform:translateY(-6px);
-ms-transform:translateY(-6px);
transform:translateY(-6px)
}
}
.hover {
display: inline-block;
-webkit-transition-duration: .5s;
transition-duration: .5s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.hover:hover {
-webkit-transform: translateY(-6px);
-ms-transform: translateY(-6px);
transform: translateY(-6px);
-webkit-animation-name: hover;
animation-name: hover;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-delay: .3s;
animation-delay: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
@-webkit-keyframes hang {
50% {
-webkit-transform:translateY(3px);
transform:translateY(3px)
}
100% {
-webkit-transform:translateY(6px);
transform:translateY(6px)
}
}
@keyframes hang {
50% {
-webkit-transform:translateY(3px);
-ms-transform:translateY(3px);
transform:translateY(3px)
}
100% {
-webkit-transform:translateY(6px);
-ms-transform:translateY(6px);
transform:translateY(6px)
}
}
.hang {
display: inline-block;
-webkit-transition-duration: .5s;
transition-duration: .5s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.hang {
-webkit-transform: translateY(6px);
-ms-transform: translateY(6px);
transform: translateY(6px);
-webkit-animation-name: hang;
animation-name: hang;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-delay: .3s;
animation-delay: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
.skew {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.skew:hover {
-webkit-transform: skew(-10deg);
-ms-transform: skew(-10deg);
transform: skew(-10deg)
}
.skew-forward {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.skew-forward:hover {
-webkit-transform: skew(-10deg);
-ms-transform: skew(-10deg);
transform: skew(-10deg)
}
.skew-backward {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.skew-backward:hover {
-webkit-transform: skew(10deg);
-ms-transform: skew(10deg);
transform: skew(10deg)
}
@-webkit-keyframes wobble-vertical {
16.65% {
-webkit-transform:translateY(8px);
transform:translateY(8px)
}
33.3% {
-webkit-transform:translateY(-6px);
transform:translateY(-6px)
}
49.95% {
-webkit-transform:translateY(4px);
transform:translateY(4px)
}
66.6% {
-webkit-transform:translateY(-2px);
transform:translateY(-2px)
}
83.25% {
-webkit-transform:translateY(1px);
transform:translateY(1px)
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes wobble-vertical {
16.65% {
-webkit-transform:translateY(8px);
-ms-transform:translateY(8px);
transform:translateY(8px)
}
33.3% {
-webkit-transform:translateY(-6px);
-ms-transform:translateY(-6px);
transform:translateY(-6px)
}
49.95% {
-webkit-transform:translateY(4px);
-ms-transform:translateY(4px);
transform:translateY(4px)
}
66.6% {
-webkit-transform:translateY(-2px);
-ms-transform:translateY(-2px);
transform:translateY(-2px)
}
83.25% {
-webkit-transform:translateY(1px);
-ms-transform:translateY(1px);
transform:translateY(1px)
}
100% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.wobble-vertical {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-vertical:hover {
-webkit-animation-name: wobble-vertical;
animation-name: wobble-vertical;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-horizontal {
16.65% {
-webkit-transform:translateX(8px);
transform:translateX(8px)
}
33.3% {
-webkit-transform:translateX(-6px);
transform:translateX(-6px)
}
49.95% {
-webkit-transform:translateX(4px);
transform:translateX(4px)
}
66.6% {
-webkit-transform:translateX(-2px);
transform:translateX(-2px)
}
83.25% {
-webkit-transform:translateX(1px);
transform:translateX(1px)
}
100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes wobble-horizontal {
16.65% {
-webkit-transform:translateX(8px);
-ms-transform:translateX(8px);
transform:translateX(8px)
}
33.3% {
-webkit-transform:translateX(-6px);
-ms-transform:translateX(-6px);
transform:translateX(-6px)
}
49.95% {
-webkit-transform:translateX(4px);
-ms-transform:translateX(4px);
transform:translateX(4px)
}
66.6% {
-webkit-transform:translateX(-2px);
-ms-transform:translateX(-2px);
transform:translateX(-2px)
}
83.25% {
-webkit-transform:translateX(1px);
-ms-transform:translateX(1px);
transform:translateX(1px)
}
100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.wobble-horizontal {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-horizontal:hover {
-webkit-animation-name: wobble-horizontal;
animation-name: wobble-horizontal;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-to-bottom-right {
16.65% {
-webkit-transform:translate(8px, 8px);
transform:translate(8px, 8px)
}
33.3% {
-webkit-transform:translate(-6px, -6px);
transform:translate(-6px, -6px)
}
49.95% {
-webkit-transform:translate(4px, 4px);
transform:translate(4px, 4px)
}
66.6% {
-webkit-transform:translate(-2px, -2px);
transform:translate(-2px, -2px)
}
83.25% {
-webkit-transform:translate(1px, 1px);
transform:translate(1px, 1px)
}
100% {
-webkit-transform:translate(0, 0);
transform:translate(0, 0)
}
}
@keyframes wobble-to-bottom-right {
16.65% {
-webkit-transform:translate(8px, 8px);
-ms-transform:translate(8px, 8px);
transform:translate(8px, 8px)
}
33.3% {
-webkit-transform:translate(-6px, -6px);
-ms-transform:translate(-6px, -6px);
transform:translate(-6px, -6px)
}
49.95% {
-webkit-transform:translate(4px, 4px);
-ms-transform:translate(4px, 4px);
transform:translate(4px, 4px)
}
66.6% {
-webkit-transform:translate(-2px, -2px);
-ms-transform:translate(-2px, -2px);
transform:translate(-2px, -2px)
}
83.25% {
-webkit-transform:translate(1px, 1px);
-ms-transform:translate(1px, 1px);
transform:translate(1px, 1px)
}
100% {
-webkit-transform:translate(0, 0);
-ms-transform:translate(0, 0);
transform:translate(0, 0)
}
}
.wobble-to-bottom-right {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-to-bottom-right:hover {
-webkit-animation-name: wobble-to-bottom-right;
animation-name: wobble-to-bottom-right;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-to-top-right {
16.65% {
-webkit-transform:translate(8px, -8px);
transform:translate(8px, -8px)
}
33.3% {
-webkit-transform:translate(-6px, 6px);
transform:translate(-6px, 6px)
}
49.95% {
-webkit-transform:translate(4px, -4px);
transform:translate(4px, -4px)
}
66.6% {
-webkit-transform:translate(-2px, 2px);
transform:translate(-2px, 2px)
}
83.25% {
-webkit-transform:translate(1px, -1px);
transform:translate(1px, -1px)
}
100% {
-webkit-transform:translate(0, 0);
transform:translate(0, 0)
}
}
@keyframes wobble-to-top-right {
16.65% {
-webkit-transform:translate(8px, -8px);
-ms-transform:translate(8px, -8px);
transform:translate(8px, -8px)
}
33.3% {
-webkit-transform:translate(-6px, 6px);
-ms-transform:translate(-6px, 6px);
transform:translate(-6px, 6px)
}
49.95% {
-webkit-transform:translate(4px, -4px);
-ms-transform:translate(4px, -4px);
transform:translate(4px, -4px)
}
66.6% {
-webkit-transform:translate(-2px, 2px);
-ms-transform:translate(-2px, 2px);
transform:translate(-2px, 2px)
}
83.25% {
-webkit-transform:translate(1px, -1px);
-ms-transform:translate(1px, -1px);
transform:translate(1px, -1px)
}
100% {
-webkit-transform:translate(0, 0);
-ms-transform:translate(0, 0);
transform:translate(0, 0)
}
}
.wobble-to-top-right {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-to-top-right:hover {
-webkit-animation-name: wobble-to-top-right;
animation-name: wobble-to-top-right;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-top {
16.65% {
-webkit-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
transform:skew(0)
}
}
@keyframes wobble-top {
16.65% {
-webkit-transform:skew(-12deg);
-ms-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
-ms-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
-ms-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
-ms-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
-ms-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
-ms-transform:skew(0);
transform:skew(0)
}
}
.wobble-top {
display: inline-block;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-top:hover {
-webkit-animation-name: wobble-top;
animation-name: wobble-top;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-bottom {
16.65% {
-webkit-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
transform:skew(0)
}
}
@keyframes wobble-bottom {
16.65% {
-webkit-transform:skew(-12deg);
-ms-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
-ms-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
-ms-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
-ms-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
-ms-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
-ms-transform:skew(0);
transform:skew(0)
}
}
.wobble-bottom {
display: inline-block;
-webkit-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-bottom:hover {
-webkit-animation-name: wobble-bottom;
animation-name: wobble-bottom;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes wobble-skew {
16.65% {
-webkit-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
transform:skew(0)
}
}
@keyframes wobble-skew {
16.65% {
-webkit-transform:skew(-12deg);
-ms-transform:skew(-12deg);
transform:skew(-12deg)
}
33.3% {
-webkit-transform:skew(10deg);
-ms-transform:skew(10deg);
transform:skew(10deg)
}
49.95% {
-webkit-transform:skew(-6deg);
-ms-transform:skew(-6deg);
transform:skew(-6deg)
}
66.6% {
-webkit-transform:skew(4deg);
-ms-transform:skew(4deg);
transform:skew(4deg)
}
83.25% {
-webkit-transform:skew(-2deg);
-ms-transform:skew(-2deg);
transform:skew(-2deg)
}
100% {
-webkit-transform:skew(0);
-ms-transform:skew(0);
transform:skew(0)
}
}
.wobble-skew {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.wobble-skew:hover {
-webkit-animation-name: wobble-skew;
animation-name: wobble-skew;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
@-webkit-keyframes buzz {
50% {
-webkit-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
100% {
-webkit-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
}
@keyframes buzz {
50% {
-webkit-transform:translateX(3px) rotate(2deg);
-ms-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
100% {
-webkit-transform:translateX(-3px) rotate(-2deg);
-ms-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
}
.buzz {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.buzz:hover {
-webkit-animation-name: buzz;
animation-name: buzz;
-webkit-animation-duration: .15s;
animation-duration: .15s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}
@-webkit-keyframes buzz-out {
10% {
-webkit-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
20% {
-webkit-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
30% {
-webkit-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
40% {
-webkit-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
50% {
-webkit-transform:translateX(2px) rotate(1deg);
transform:translateX(2px) rotate(1deg)
}
60% {
-webkit-transform:translateX(-2px) rotate(-1deg);
transform:translateX(-2px) rotate(-1deg)
}
70% {
-webkit-transform:translateX(2px) rotate(1deg);
transform:translateX(2px) rotate(1deg)
}
80% {
-webkit-transform:translateX(-2px) rotate(-1deg);
transform:translateX(-2px) rotate(-1deg)
}
90% {
-webkit-transform:translateX(1px) rotate(0);
transform:translateX(1px) rotate(0)
}
100% {
-webkit-transform:translateX(-1px) rotate(0);
transform:translateX(-1px) rotate(0)
}
}
@keyframes buzz-out {
10% {
-webkit-transform:translateX(3px) rotate(2deg);
-ms-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
20% {
-webkit-transform:translateX(-3px) rotate(-2deg);
-ms-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
30% {
-webkit-transform:translateX(3px) rotate(2deg);
-ms-transform:translateX(3px) rotate(2deg);
transform:translateX(3px) rotate(2deg)
}
40% {
-webkit-transform:translateX(-3px) rotate(-2deg);
-ms-transform:translateX(-3px) rotate(-2deg);
transform:translateX(-3px) rotate(-2deg)
}
50% {
-webkit-transform:translateX(2px) rotate(1deg);
-ms-transform:translateX(2px) rotate(1deg);
transform:translateX(2px) rotate(1deg)
}
60% {
-webkit-transform:translateX(-2px) rotate(-1deg);
-ms-transform:translateX(-2px) rotate(-1deg);
transform:translateX(-2px) rotate(-1deg)
}
70% {
-webkit-transform:translateX(2px) rotate(1deg);
-ms-transform:translateX(2px) rotate(1deg);
transform:translateX(2px) rotate(1deg)
}
80% {
-webkit-transform:translateX(-2px) rotate(-1deg);
-ms-transform:translateX(-2px) rotate(-1deg);
transform:translateX(-2px) rotate(-1deg)
}
90% {
-webkit-transform:translateX(1px) rotate(0);
-ms-transform:translateX(1px) rotate(0);
transform:translateX(1px) rotate(0)
}
100% {
-webkit-transform:translateX(-1px) rotate(0);
-ms-transform:translateX(-1px) rotate(0);
transform:translateX(-1px) rotate(0)
}
}
.buzz-out {
display: inline-block;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.buzz-out:hover {
-webkit-animation-name: buzz-out;
animation-name: buzz-out;
-webkit-animation-duration: .75s;
animation-duration: .75s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}
.border-fade {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: box-shadow;
transition-property: box-shadow;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: inset 0 0 0 4px #ff1c32, 0 0 1px rgba(0,0,0,0)
}
.border-fade:hover {
box-shadow: inset 0 0 0 4px #666, 0 0 1px rgba(0,0,0,0)
}
.hollow {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: background;
transition-property: background;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: inset 0 0 0 4px #ff1c32, 0 0 1px rgba(0,0,0,0)
}
.hollow:hover {
background: 0
}
.trim {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.trim:before {
content: '';
position: absolute;
border: #fff solid 4px;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
opacity: 0;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: opacity;
transition-property: opacity
}
.trim:hover:before {
opacity: 1
}
.outline-outward {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.outline-outward:before {
content: '';
position: absolute;
border: #ff1c32 solid 2px;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: top, right, bottom, left;
transition-property: top, right, bottom, left
}
.outline-outward:hover:before {
bottom: -4px;
left: -4px;
right: -4px;
top: -4px
}
.outline-inward {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.outline-inward:before {
pointer-events: none;
content: '';
position: absolute;
border: #ff1c32 solid 4px;
top: -16px;
right: -16px;
bottom: -16px;
left: -16px;
opacity: 0;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: top, right, bottom, left;
transition-property: top, right, bottom, left
}
.outline-inward:hover:before {
top: -8px;
right: -8px;
bottom: -8px;
left: -8px;
opacity: 1
}
.round-corners {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: border-radius;
transition-property: border-radius;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.round-corners:hover {
border-radius: 1em
}
.glow {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: box-shadow;
transition-property: box-shadow;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.glow:hover {
box-shadow: 0 0 8px rgba(0,0,0,.6)
}
.box-shadow-outset {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: box-shadow;
transition-property: box-shadow;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.box-shadow-outset:hover {
box-shadow: 2px 2px 2px rgba(0,0,0,.6)
}
.box-shadow-inset {
display: inline-block;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: box-shadow;
transition-property: box-shadow;
box-shadow: inset 0 0 0 rgba(0,0,0,.6), 0 0 1px rgba(0,0,0,0);
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0)
}
.box-shadow-inset:hover {
box-shadow: inset 2px 2px 2px rgba(0,0,0,.6), 0 0 1px rgba(0,0,0,0)
}
.float-shadow {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.float-shadow:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
top: 100%;
left: 5%;
height: 10px;
width: 90%;
opacity: 0;
background: -webkit-radial-gradient(center, ellipse, rgba(0,0,0,.35) 0, rgba(0,0,0,0) 80%);
background: radial-gradient(ellipse at center, rgba(0,0,0,.35) 0, rgba(0,0,0,0) 80%);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform, opacity;
transition-property: transform, opacity
}
.float-shadow:hover {
-webkit-transform: translateY(-5px);
-ms-transform: translateY(-5px);
transform: translateY(-5px)
}
.float-shadow:hover:before {
opacity: 1;
-webkit-transform: translateY(5px);
-ms-transform: translateY(5px);
transform: translateY(5px)
}
@keyframes hover {
50% {
-webkit-transform:translateY(-3px);
-ms-transform:translateY(-3px);
transform:translateY(-3px)
}
100% {
-webkit-transform:translateY(-6px);
-ms-transform:translateY(-6px);
transform:translateY(-6px)
}
}
@-webkit-keyframes hover-shadow {
0% {
-webkit-transform:translateY(6px);
transform:translateY(6px);
opacity:.4
}
50% {
-webkit-transform:translateY(3px);
transform:translateY(3px);
opacity:1
}
100% {
-webkit-transform:translateY(6px);
transform:translateY(6px);
opacity:.4
}
}
@keyframes hover-shadow {
0% {
-webkit-transform:translateY(6px);
-ms-transform:translateY(6px);
transform:translateY(6px);
opacity:.4
}
50% {
-webkit-transform:translateY(3px);
-ms-transform:translateY(3px);
transform:translateY(3px);
opacity:1
}
100% {
-webkit-transform:translateY(6px);
-ms-transform:translateY(6px);
transform:translateY(6px);
opacity:.4
}
}
.hover-shadow {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.hover-shadow:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
top: 100%;
left: 5%;
height: 10px;
width: 90%;
opacity: 0;
background: -webkit-radial-gradient(center, ellipse, rgba(0,0,0,.35) 0, rgba(0,0,0,0) 80%);
background: radial-gradient(ellipse at center, rgba(0,0,0,.35) 0, rgba(0,0,0,0) 80%);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform, opacity;
transition-property: transform, opacity
}
.hover-shadow:hover {
-webkit-transform: translateY(-6px);
-ms-transform: translateY(-6px);
transform: translateY(-6px);
-webkit-animation-name: hover;
animation-name: hover;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-delay: .3s;
animation-delay: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
.hover-shadow:hover:before {
opacity: .4;
-webkit-transform: translateY(6px);
-ms-transform: translateY(6px);
transform: translateY(6px);
-webkit-animation-name: hover-shadow;
animation-name: hover-shadow;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-delay: .3s;
animation-delay: .3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate
}
.shadow-radial {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.shadow-radial:after, .shadow-radial:before {
pointer-events: none;
position: absolute;
content: '';
left: 0;
width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
height: 5px;
opacity: 0;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: opacity;
transition-property: opacity
}
.shadow-radial:before {
bottom: 100%;
background: -webkit-radial-gradient(50% 150%, ellipse, rgba(0,0,0,.6) 0, rgba(0,0,0,0) 80%);
background: radial-gradient(ellipse at 50% 150%, rgba(0,0,0,.6) 0, rgba(0,0,0,0) 80%)
}
.shadow-radial:after {
top: 100%;
background: -webkit-radial-gradient(50% -50%, ellipse, rgba(0,0,0,.6) 0, rgba(0,0,0,0) 80%);
background: radial-gradient(ellipse at 50% -50%, rgba(0,0,0,.6) 0, rgba(0,0,0,0) 80%)
}
.shadow-radial:hover:after, .shadow-radial:hover:before {
opacity: 1
}
.bubble-top {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-top:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
border-style: solid;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: top;
transition-property: top;
left: -webkit-calc(50% - 10px);
left: calc(50% - 10px);
top: 0;
border-width: 0 10px 10px;
border-color: transparent transparent #ff1c32
}
.bubble-top:hover:before {
top: -10px
}
.bubble-right {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-right:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
border-style: solid;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: right;
transition-property: right;
top: -webkit-calc(50% - 10px);
top: calc(50% - 10px);
right: 0;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent #ff1c32
}
.bubble-right:hover:before {
right: -10px
}
.bubble-bottom {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-bottom:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
border-style: solid;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: bottom;
transition-property: bottom;
left: -webkit-calc(50% - 10px);
left: calc(50% - 10px);
bottom: 0;
border-width: 10px 10px 0;
border-color: #ff1c32 transparent transparent
}
.bubble-bottom:hover:before {
bottom: -10px
}
.bubble-left {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-left:before {
pointer-events: none;
position: absolute;
z-index: -1;
content: '';
border-style: solid;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: left;
transition-property: left;
top: -webkit-calc(50% - 10px);
top: calc(50% - 10px);
left: 0;
border-width: 10px 10px 10px 0;
border-color: transparent #ff1c32 transparent transparent
}
.bubble-left:hover:before {
left: -10px
}
.bubble-float-top {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-float-top:before {
position: absolute;
z-index: -1;
content: '';
left: -webkit-calc(50% - 10px);
left: calc(50% - 10px);
top: 0;
border-style: solid;
border-width: 0 10px 10px;
border-color: transparent transparent #ff1c32;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: top;
transition-property: top
}
.bubble-float-top:hover {
-webkit-transform: translateY(5px) translateZ(0);
-ms-transform: translateY(5px) translateZ(0);
transform: translateY(5px) translateZ(0)
}
.bubble-float-top:hover:before {
top: -10px
}
.bubble-float-right {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-float-right:before {
position: absolute;
z-index: -1;
top: -webkit-calc(50% - 10px);
top: calc(50% - 10px);
right: 0;
content: '';
border-style: solid;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent #ff1c32;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: right;
transition-property: right
}
.bubble-float-right:hover {
-webkit-transform: translateX(-5px);
-ms-transform: translateX(-5px);
transform: translateX(-5px)
}
.bubble-float-right:hover:before {
right: -10px
}
.bubble-float-bottom {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-float-bottom:before {
position: absolute;
z-index: -1;
content: '';
left: -webkit-calc(50% - 10px);
left: calc(50% - 10px);
bottom: 0;
border-style: solid;
border-width: 10px 10px 0;
border-color: #ff1c32 transparent transparent;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: bottom;
transition-property: bottom
}
.bubble-float-bottom:hover {
-webkit-transform: translateY(-5px) translateZ(0);
-ms-transform: translateY(-5px) translateZ(0);
transform: translateY(-5px) translateZ(0)
}
.bubble-float-bottom:hover:before {
bottom: -10px
}
.bubble-float-left {
display: inline-block;
position: relative;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: -webkit-transform;
transition-property: transform;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.bubble-float-left:before {
position: absolute;
z-index: -1;
content: '';
top: -webkit-calc(50% - 10px);
top: calc(50% - 10px);
left: 0;
border-style: solid;
border-width: 10px 10px 10px 0;
border-color: transparent #ff1c32 transparent transparent;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: left;
transition-property: left
}
.bubble-float-left:hover {
-webkit-transform: translateX(5px);
-ms-transform: translateX(5px);
transform: translateX(5px)
}
.bubble-float-left:hover:before {
left: -10px
}
.curl-top-left {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.curl-top-left:before {
pointer-events: none;
position: absolute;
content: '';
height: 0;
width: 0;
top: 0;
left: 0;
background: #fff;
background: -webkit-linear-gradient(315deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
background: linear-gradient(135deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#000000');
z-index: 1000;
box-shadow: 1px 1px 1px rgba(0,0,0,.4);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: width, height;
transition-property: width, height
}
.curl-top-left:hover:before {
width: 25px;
height: 25px
}
.curl-top-right {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.curl-top-right:before {
pointer-events: none;
position: absolute;
content: '';
height: 0;
width: 0;
top: 0;
right: 0;
background: #fff;
background: -webkit-linear-gradient(225deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
background: linear-gradient(225deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
box-shadow: -1px 1px 1px rgba(0,0,0,.4);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: width, height;
transition-property: width, height
}
.curl-top-right:hover:before {
width: 25px;
height: 25px
}
.curl-bottom-right {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.curl-bottom-right:before {
pointer-events: none;
position: absolute;
content: '';
height: 0;
width: 0;
bottom: 0;
right: 0;
background: #fff;
background: -webkit-linear-gradient(135deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
background: linear-gradient(315deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
box-shadow: -1px -1px 1px rgba(0,0,0,.4);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: width, height;
transition-property: width, height
}
.curl-bottom-right:hover:before {
width: 25px;
height: 25px
}
.curl-bottom-left {
display: inline-block;
position: relative;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0,0,0,0)
}
.curl-bottom-left:before {
pointer-events: none;
position: absolute;
content: '';
height: 0;
width: 0;
bottom: 0;
left: 0;
background: #fff;
background: -webkit-linear-gradient(45deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
background: linear-gradient(45deg, #fff 45%, #aaa 50%, #ccc 56%, #fff 80%);
box-shadow: 1px -1px 1px rgba(0,0,0,.4);
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: width, height;
transition-property: width, height
}
.curl-bottom-left:hover:before {
width: 25px;
height: 25px
}