﻿/*!
 * Animator Beta
 * http://animator.ringotc.net
 *
 * Copyright 2014 RingoTC
 * Released under the MIT license
 * ringo.me@hotmail.com
 *
 * Date: 2014-07-07
 */

.Bounce,
.Flip,
.Flash,
.Shake,
.Wobble,
.Tada,
.RubberBand,
.Swing {
    -webkit-animation: 1s ease;
    -moz-animation: 1s ease;
    -ms-animation: 1s ease;
    animation: 1s ease;
}

.BounceIn,
.BounceInT,
.BounceInL,
.BounceInR,
.BounceInB,
.FadeIn,
.FadeInT,
.FadeInL,
.FadeInR,
.FadeInB,
.Flip,
.FlipInX,
.FlipInY,
.LightSpeedIn {
    -webkit-animation: 1s ease-out backwards;
    -moz-animation: 1s ease-out backwards;
    -ms-animation: 1s ease-out backwards;
    animation: 1s ease-out backwards;
   
}

.BounceOutT,
.BounceOutL,
.BounceOutR,
.BounceOutB,
.FadeOut,
.FadeOutT,
.FadeOutL,
.FadeOutR,
.FadeOutB,
.BounceOut,
.FlipOutX,
.FlipOutY,
.LightSpeedOut {
    -webkit-animation: 1s ease-in forwards;
    -moz-animation: 1s ease-in forwards;
    -ms-animation: 1s ease-in forwards;
    animation: 1s ease-in forwards;
}

.Bounce {
    -webkit-animation-name: Bounce;
    -moz-animation-name: Bounce;
    -ms-animation-name: Bounce;
    animation-name: Bounce;
}

.BounceIn {
    -webkit-animation-name: BounceIn;
    -moz-animation-name: BounceIn;
    -ms-animation-name: BounceIn;
    animation-name: BounceIn;
}

.BounceInT {
    -webkit-animation-name: BounceInT;
    -moz-animation-name: BounceInT;
    -ms-animation-name: BounceInT;
    animation-name: BounceInT;
}

.BounceInL {
    -webkit-animation-name: BounceInL;
    -moz-animation-name: BounceInL;
    -ms-animation-name: BounceInL;
    animation-name: BounceInL;
}

.BounceInR {
    -webkit-animation-name: BounceInR;
    -moz-animation-name: BounceInR;
    -ms-animation-name: BounceInR;
    animation-name: BounceInR;
}

.BounceInB {
    -webkit-animation-name: BounceInB;
    -moz-animation-name: BounceInB;
    -ms-animation-name: BounceInB;
    animation-name: BounceInB;
}

.BounceOut {
    -webkit-animation-name: BounceOut;
    -moz-animation-name: BounceOut;
    -ms-animation-name: BounceOut;
    animation-name: BounceOut;
}

.BounceOutT {
    -webkit-animation-name: BounceOutT;
    -moz-animation-name: BounceOutT;
    -ms-animation-name: BounceOutT;
    animation-name: BounceOutT;
}

.BounceOutL {
    -webkit-animation-name: BounceOutL;
    -moz-animation-name: BounceOutL;
    -ms-animation-name: BounceOutL;
    animation-name: BounceOutL;
}

.BounceOutR {
    -webkit-animation-name: BounceOutR;
    -moz-animation-name: BounceOutR;
    -ms-animation-name: BounceOutR;
    animation-name: BounceOutR;
}

.BounceOutB {
    -webkit-animation-name: BounceOutB;
    -moz-animation-name: BounceOutB;
    -ms-animation-name: BounceOutB;
    animation-name: BounceOutB;
}

.FadeIn {
    -webkit-animation-name: FadeIn;
    -moz-animation-name: FadeIn;
    -ms-animation-name: FadeIn;
    animation-name: FadeIn;
}

.FadeInT {
    -webkit-animation-name: FadeInT;
    -moz-animation-name: FadeInT;
    -ms-animation-name: FadeInT;
    animation-name: FadeInT;
}

.FadeInL {
    -webkit-animation-name: FadeInL;
    -moz-animation-name: FadeInL;
    -ms-animation-name: FadeInL;
    animation-name: FadeInL;
}

.FadeInR {
    -webkit-animation-name: FadeInR;
    -moz-animation-name: FadeInR;
    -ms-animation-name: FadeInR;
    animation-name: FadeInR;
}

.FadeInB {
    -webkit-animation-name: FadeInB;
    -moz-animation-name: FadeInB;
    -ms-animation-name: FadeInB;
    animation-name: FadeInB;
}

.FadeOut {
    -webkit-animation-name: FadeOut;
    -moz-animation-name: FadeOut;
    -ms-animation-name: FadeOut;
    animation-name: FadeOut;
}

.FadeOutT {
    -webkit-animation-name: FadeOutT;
    -moz-animation-name: FadeOutT;
    -ms-animation-name: FadeOutT;
    animation-name: FadeOutT;
}

.FadeOutL {
    -webkit-animation-name: FadeOutL;
    -moz-animation-name: FadeOutL;
    -ms-animation-name: FadeOutL;
    animation-name: FadeOutL;
}

.FadeOutR {
    -webkit-animation-name: FadeOutR;
    -moz-animation-name: FadeOutR;
    -ms-animation-name: FadeOutR;
    animation-name: FadeOutR;
}

.FadeOutB {
    -webkit-animation-name: FadeOutB;
    -moz-animation-name: FadeOutB;
    -ms-animation-name: FadeOutB;
    animation-name: FadeOutB;
}

.Flip {
    -webkit-animation-name: Flip;
    -moz-animation-name: Flip;
    -ms-animation-name: Flip;
    animation-name: Flip;
}

.FlipInX {
    -webkit-animation-name: FlipInX;
    -moz-animation-name: FlipInX;
    -ms-animation-name: FlipInX;
    animation-name: FlipInX;
}

.FlipInY {
    -webkit-animation-name: FlipInY;
    -moz-animation-name: FlipInY;
    -ms-animation-name: FlipInY;
    animation-name: FlipInY;
}

.FlipOutX {
    -webkit-animation-name: FlipOutX;
    -moz-animation-name: FlipOutX;
    -ms-animation-name: FlipOutX;
    animation-name: FlipOutX;
}

.FlipOut,
.FlipOutY {
    -webkit-animation-name: FlipOutY;
    -moz-animation-name: FlipOutY;
    -ms-animation-name: FlipOutY;
    animation-name: FlipOutY;
}

.Flash {
    -webkit-animation-name: Flash;
    -moz-animation-name: Flash;
    -ms-animation-name: Flash;
    animation-name: Flash;
}

.Shake {
    -webkit-animation-name: Shake;
    -moz-animation-name: Shake;
    -ms-animation-name: Shake;
    animation-name: Shake;
}

.Swing {
    -webkit-animation-name: Swing;
    -moz-animation-name: Swing;
    -ms-animation-name: swing;
    animation-name: Swing;
}

.Wobble {
    -webkit-animation-name: Wobble;
    -moz-animation-name: Wobble;
    -ms-animation-name: Wobble;
    animation-name: Wobble;
}

.Tada {
    -webkit-animation-name: Tada;
    -moz-animation-name: Tada;
    -ms-animation-name: Tada;
    animation-name: Tada;
}

.RubberBand {
    -webkit-animation-name: RubberBand;
    -moz-animation-name: RubberBand;
    -ms-animation-name: RubberBand;
    animation-name: RubberBand;
}

.LightSpeedIn {
    -webkit-animation-name: LightSpeedIn;
    -moz-animation-name: LightSpeedIn;
    -ms-animation-name: LightSpeedIn;
    animation-name: LightSpeedIn;
}

.LightSpeedOut {
    -webkit-animation-name: LightSpeedOut;
    -moz-animation-name: LightSpeedOut;
    -ms-animation-name: LightSpeedOut;
    animation-name: LightSpeedOut;
}

@-webkit-keyframes RubberBand {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    30% {
        -webkit-transform: scaleX(1.25) scaleY(0.75);
        transform: scaleX(1.25) scaleY(0.75);
    }
    40% {
        -webkit-transform: scaleX(0.75) scaleY(1.25);
        transform: scaleX(0.75) scaleY(1.25);
    }
    60% {
        -webkit-transform: scaleX(1.15) scaleY(0.85);
        transform: scaleX(1.15) scaleY(0.85);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes RubberBand {
    0% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
    30% {
        -moz-transform: scaleX(1.25) scaleY(0.75);
        transform: scaleX(1.25) scaleY(0.75);
    }
    40% {
        -moz-transform: scaleX(0.75) scaleY(1.25);
        transform: scaleX(0.75) scaleY(1.25);
    }
    60% {
        -moz-transform: scaleX(1.15) scaleY(0.85);
        transform: scaleX(1.15) scaleY(0.85);
    }
    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}

@-ms-keyframes RubberBand {
    0% {
        -ms-transform: scale(1);
        transform: scale(1);
    }
    30% {
        -ms-transform: scaleX(1.25) scaleY(0.75);
        transform: scaleX(1.25) scaleY(0.75);
    }
    40% {
        -ms-transform: scaleX(0.75) scaleY(1.25);
        transform: scaleX(0.75) scaleY(1.25);
    }
    60% {
        -ms-transform: scaleX(1.15) scaleY(0.85);
        transform: scaleX(1.15) scaleY(0.85);
    }
    100% {
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes RubberBand {
    0% {
        transform: scale(1);
        transform: scale(1);
    }
    30% {
        transform: scaleX(1.25) scaleY(0.75);
        transform: scaleX(1.25) scaleY(0.75);
    }
    40% {
        transform: scaleX(0.75) scaleY(1.25);
        transform: scaleX(0.75) scaleY(1.25);
    }
    60% {
        transform: scaleX(1.15) scaleY(0.85);
        transform: scaleX(1.15) scaleY(0.85);
    }
    100% {
        transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes LightSpeedIn {
    0% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
    60% {
        -webkit-transform: translateX(-20%) skewX(30deg);
        transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: translateX(0%) skewX(-15deg);
        transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-ms-keyframes LightSpeedIn {
    0% {
        -ms-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
    60% {
        -ms-transform: translateX(-20%) skewX(30deg);
        transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }
    80% {
        -ms-transform: translateX(0%) skewX(-15deg);
        transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }
    100% {
        -ms-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-moz-keyframes LightSpeedIn {
    0% {
        -moz-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
    60% {
        -moz-transform: translateX(-20%) skewX(30deg);
        transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }
    80% {
        -moz-transform: translateX(0%) skewX(-15deg);
        transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }
    100% {
        -moz-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@keyframes LightSpeedIn {
    0% {
        transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
    60% {
        transform: translateX(-20%) skewX(30deg);
        transform: translateX(-20%) skewX(30deg);
        opacity: 1;
    }
    80% {
        transform: translateX(0%) skewX(-15deg);
        transform: translateX(0%) skewX(-15deg);
        opacity: 1;
    }
    100% {
        transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-webkit-keyframes LightSpeedOut {
    0% {
        -webkit-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

@-moz-keyframes LightSpeedOut {
    0% {
        -moz-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
    100% {
        -moz-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

@-ms-keyframes LightSpeedOut {
    0% {
        -ms-transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
    100% {
        -ms-transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

@keyframes LightSpeedOut {
    0% {
        transform: translateX(0%) skewX(0deg);
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
    100% {
        transform: translateX(100%) skewX(-30deg);
        transform: translateX(100%) skewX(-30deg);
        opacity: 0;
    }
}

@-webkit-keyframes Bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        -webkit-transform: translateY(0);
    }
    40% {
        -webkit-transform: translateY(-30px);
    }
    60% {
        -webkit-transform: translateY(-15px);
    }
}

@-moz-keyframes Bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
    }
    40% {
        -moz-transform: translateY(-30px);
    }
    60% {
        -moz-transform: translateY(-15px);
    }
}

@-ms-keyframes Bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        -ms-transform: translateY(0);
    }
    40% {
        -ms-transform: translateY(-30px);
    }
    60% {
        -ms-transform: translateY(-15px);
    }
}

@keyframes Bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-30px);
    }
    60% {
        transform: translateY(-15px);
    }
}

@-webkit-keyframes BounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
    }
    70% {
        -webkit-transform: scale(0.9);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes BounceIn {
    0% {
        opacity: 0;
        -moz-transform: scale(0.0);
    }
    50% {
        opacity: 1;
        -moz-transform: scale(1.05);
    }
    70% {
        -moz-transform: scale(0.9);
    }
    100% {
        -moz-transform: scale(1);
    }
}

@-ms-keyframes BounceIn {
    0% {
        opacity: 0;
        -ms-transform: scale(0);
    }
    50% {
        opacity: 1;
        -ms-transform: scale(1.05);
    }
    70% {
        -ms-transform: scale(0.9);
    }
    100% {
        -ms-transform: scale(1);
    }
}

@keyframes BounceIn {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    50% {
        opacity: 1;
        transform: scale(1.05);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

@-webkit-keyframes BounceInT {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
    }
    50% {
        opacity: 1;
        -webkit-transform: translateY(30px);
    }
    70% {
        -webkit-transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0px);
    }
}

@-moz-keyframes BounceInT {
    0% {
        opacity: 0;
        -moz-transform: translateY(-100px);
    }
    60% {
        opacity: 1;
        -moz-transform: translateY(30px);
    }
    80% {
        -moz-transform: translateY(-10px);
    }
    100% {
        -moz-transform: translateY(0);
    }
}

@-ms-keyframes BounceInT {
    0% {
        opacity: 0;
        -ms-transform: translateY(-100px);
    }
    60% {
        opacity: 1;
        -ms-transform: translateY(30px);
    }
    80% {
        -ms-transform: translateY(-10px);
    }
    100% {
        -ms-transform: translateY(0);
    }
}

@keyframes BounceInT {
    0% {
        opacity: 0;
        transform: translateY(-100px);
    }
    60% {
        opacity: 1;
        transform: translateY(30px);
    }
    80% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0);
    }
}

@-webkit-keyframes BounceInR {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(-30px);
    }
    80% {
        -webkit-transform: translateX(10px);
    }
    100% {
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes BounceInR {
    0% {
        opacity: 0;
        -moz-transform: translateX(100px);
    }
    60% {
        opacity: 1;
        -moz-transform: translateX(-30px);
    }
    80% {
        -moz-transform: translateX(10px);
    }
    100% {
        -moz-transform: translateX(0);
    }
}

@-ms-keyframes BounceInR {
    0% {
        opacity: 0;
        -ms-transform: translateX(100px);
    }
    60% {
        opacity: 1;
        -ms-transform: translateX(-30px);
    }
    80% {
        -ms-transform: translateX(10px);
    }
    100% {
        -ms-transform: translateX(0);
    }
}

@keyframes BounceInR {
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    60% {
        opacity: 1;
        transform: translateX(-30px);
    }
    80% {
        transform: translateX(10px);
    }
    100% {
        transform: translateX(0);
    }
}

@-webkit-keyframes BounceInL {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(30px);
    }
    80% {
        -webkit-transform: translateX(-10px);
    }
    100% {
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes BounceInL {
    0% {
        opacity: 0;
        -moz-transform: translateX(-100px);
    }
    60% {
        opacity: 1;
        -moz-transform: translateX(30px);
    }
    80% {
        -moz-transform: translateX(-10px);
    }
    100% {
        -moz-transform: translateX(0);
    }
}

@-ms-keyframes BounceInL {
    0% {
        opacity: 0;
        -ms-transform: translateX(-100px);
    }
    60% {
        opacity: 1;
        -ms-transform: translateX(30px);
    }
    80% {
        -ms-transform: translateX(-10px);
    }
    100% {
        -ms-transform: translateX(0);
    }
}

@keyframes BounceInL {
    0% {
        opacity: 0;
        transform: translateX(-100px);
    }
    60% {
        opacity: 1;
        transform: translateX(30px);
    }
    80% {
        transform: translateX(-10px);
    }
    100% {
        transform: translateX(0);
    }
}

@-webkit-keyframes BounceInB {
    0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
    }
    60% {
        opacity: 1;
        -webkit-transform: translateY(-30px);
    }
    80% {
        -webkit-transform: translateY(10px);
    }
    100% {
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes BounceInB {
    0% {
        opacity: 0;
        -moz-transform: translateY(100px);
    }
    60% {
        opacity: 1;
        -moz-transform: translateY(-30px);
    }
    80% {
        -moz-transform: translateY(10px);
    }
    100% {
        -moz-transform: translateY(0);
    }
}

@-ms-keyframes BounceInB {
    0% {
        opacity: 0;
        -ms-transform: translateY(100px);
    }
    60% {
        opacity: 1;
        -ms-transform: translateY(-30px);
    }
    80% {
        -ms-transform: translateY(10px);
    }
    100% {
        -ms-transform: translateY(0);
    }
}

@keyframes BounceInB {
    0% {
        opacity: 0;
        transform: translateY(100px);
    }
    60% {
        opacity: 1;
        transform: translateY(-30px);
    }
    80% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0);
    }
}

@-webkit-keyframes BounceOut {
    0% {
        -webkit-transform: scale(1);
    }
    50% {
        -webkit-transform: scale(0.9);
    }
    70% {
        opacity: 1;
        -webkit-transform: scale(1.05);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(0.3);
    }
}

@-moz-keyframes BounceOut {
    0% {
        -moz-transform: scale(1);
    }
    50% {
        -moz-transform: scale(0.9);
    }
    70% {
        opacity: 1;
        -moz-transform: scale(1.05);
    }
    100% {
        opacity: 0;
        -moz-transform: scale(0.3);
    }
}

@-ms-keyframes BounceOut {
    0% {
        -ms-transform: scale(1);
    }
    50% {
        -ms-transform: scale(0.9);
    }
    70% {
        opacity: 1;
        -ms-transform: scale(1.05);
    }
    100% {
        opacity: 0;
        -ms-transform: scale(0.3);
    }
}

@keyframes BounceOut {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.9);
    }
    70% {
        opacity: 1;
        transform: scale(1.05);
    }
    100% {
        opacity: 0;
        transform: scale(0.3);
    }
}

@-webkit-keyframes BounceOutT {
    0% {
        -webkit-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -webkit-transform: translateY(20px);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
    }
}

@-moz-keyframes BounceOutT {
    0% {
        -moz-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -moz-transform: translateY(20px);
    }
    100% {
        opacity: 0;
        -moz-transform: translateY(-100px);
    }
}

@-ms-keyframes BounceOutT {
    0% {
        -ms-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -ms-transform: translateY(20px);
    }
    100% {
        opacity: 0;
        -ms-transform: translateY(-100px);
    }
}

@keyframes BounceOutT {
    0% {
        transform: translateY(0);
    }
    20% {
        opacity: 1;
        transform: translateY(20px);
    }
    100% {
        opacity: 0;
        transform: translateY(-100px);
    }
}

@-webkit-keyframes BounceOutR {
    0% {
        -webkit-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
}

@-moz-keyframes BounceOutR {
    0% {
        -moz-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -moz-transform: translateX(-20px);
    }
    100% {
        opacity: 0;
        -moz-transform: translateX(100px);
    }
}

@-ms-keyframes BounceOutR {
    0% {
        -ms-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -ms-transform: translateX(-20px);
    }
    100% {
        opacity: 0;
        -ms-transform: translateX(100px);
    }
}

@keyframes BounceOutR {
    0% {
        transform: translateX(0);
    }
    20% {
        opacity: 1;
        transform: translateX(-20px);
    }
    100% {
        opacity: 0;
        transform: translateX(100px);
    }
}

@-webkit-keyframes BounceOutL {
    0% {
        -webkit-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -webkit-transform: translateX(20px);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
    }
}

@-moz-keyframes BounceOutL {
    0% {
        -moz-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -moz-transform: translateX(20px);
    }
    100% {
        opacity: 0;
        -moz-transform: translateX(-100px);
    }
}

@-ms-keyframes BounceOutL {
    0% {
        -ms-transform: translateX(0);
    }
    20% {
        opacity: 1;
        -ms-transform: translateX(20px);
    }
    100% {
        opacity: 0;
        -ms-transform: translateX(-100px);
    }
}

@keyframes BounceOutL {
    0% {
        transform: translateX(0);
    }
    20% {
        opacity: 1;
        transform: translateX(20px);
    }
    100% {
        opacity: 0;
        transform: translateX(-200px);
    }
}

@-webkit-keyframes BounceOutB {
    0% {
        -webkit-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -webkit-transform: translateY(-20px);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(100px);
    }
}

@-moz-keyframes BounceOutB {
    0% {
        -moz-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -moz-transform: translateY(-20px);
    }
    100% {
        opacity: 0;
        -moz-transform: translateY(100px);
    }
}

@-ms-keyframes BounceOutB {
    0% {
        -ms-transform: translateY(0);
    }
    20% {
        opacity: 1;
        -ms-transform: translateY(-20px);
    }
    100% {
        opacity: 0;
        -ms-transform: translateY(100px);
    }
}

@keyframes BounceOutB {
    0% {
        transform: translateY(0);
    }
    20% {
        opacity: 1;
        transform: translateY(-20px);
    }
    100% {
        opacity: 0;
        transform: translateY(100px);
    }
}

@-webkit-keyframes FadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes FadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-ms-keyframes FadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes FadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes FadeInT {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes FadeInT {
    0% {
        opacity: 0;
        -moz-transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
}

@-ms-keyframes FadeInT {
    0% {
        opacity: 0;
        -ms-transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        -ms-transform: translateY(0);
    }
}

@keyframes FadeInT {
    0% {
        opacity: 0;
        transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-webkit-keyframes FadeInL {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes FadeInL {
    0% {
        opacity: 0;
        -moz-transform: translateX(-100px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
}

@-ms-keyframes FadeInL {
    0% {
        opacity: 0;
        -ms-transform: translateX(-100px);
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0);
    }
}

@keyframes FadeInL {
    0% {
        opacity: 0;
        transform: translateX(-100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@-webkit-keyframes FadeInR {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes FadeInR {
    0% {
        opacity: 0;
        -moz-transform: translateX(100px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
}

@-ms-keyframes FadeInR {
    0% {
        opacity: 0;
        -ms-transform: translateX(100px);
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0);
    }
}

@keyframes FadeInR {
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@-webkit-keyframes FadeInB {
    0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes FadeInB {
    0% {
        opacity: 0;
        -moz-transform: translateY(100px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
}

@-ms-keyframes FadeInB {
    0% {
        opacity: 0;
        -ms-transform: translateY(100px);
    }
    100% {
        opacity: 1;
        -ms-transform: translateY(0);
    }
}

@keyframes FadeInB {
    0% {
        opacity: 0;
        transform: translateY(100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-webkit-keyframes FadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes FadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-ms-keyframes FadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes FadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes FadeOutT {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
    }
}

@-moz-keyframes FadeOutT {
    0% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -moz-transform: translateY(-100px);
    }
}

@-ms-keyframes FadeOutT {
    0% {
        opacity: 1;
        -ms-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -ms-transform: translateY(-100px);
    }
}

@keyframes FadeOutT {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(-100px);
    }
}

@-webkit-keyframes FadeOutL {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
    }
}

@-moz-keyframes FadeOutL {
    0% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -moz-transform: translateX(-100px);
    }
}

@-ms-keyframes FadeOutL {
    0% {
        opacity: 1;
        -ms-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -ms-transform: translateX(-100px);
    }
}

@keyframes FadeOutL {
    0% {
        opacity: 1;
        transform: translateX(0);
    }
    100% {
        opacity: 0;
        transform: translateX(-100px);
    }
}

@-webkit-keyframes FadeOutR {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(100px);
    }
}

@-moz-keyframes FadeOutR {
    0% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -moz-transform: translateX(100px);
    }
}

@-ms-keyframes FadeOutR {
    0% {
        opacity: 1;
        -ms-transform: translateX(0);
    }
    100% {
        opacity: 0;
        -ms-transform: translateX(100px);
    }
}

@keyframes FadeOutR {
    0% {
        opacity: 1;
        transform: translateX(0);
    }
    100% {
        opacity: 0;
        transform: translateX(100px);
    }
}

@-webkit-keyframes FadeOutB {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(100px);
    }
}

@-moz-keyframes FadeOutB {
    0% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -moz-transform: translateY(100px);
    }
}

@-ms-keyframes FadeOutB {
    0% {
        opacity: 1;
        -ms-transform: translateY(0);
    }
    100% {
        opacity: 0;
        -ms-transform: translateY(100px);
    }
}

@keyframes FadeOutB {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(100px);
    }
}

@-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(0.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(0.95);
        -moz-animation-timing-function: ease-in;
    }
    100% {
        -moz-transform: perspective(400px) scale(1);
        -moz-animation-timing-function: ease-in;
    }
}

@-ms-keyframes Flip {
    0% {
        -ms-transform: perspective(400px) rotateY(0);
        -ms-animation-timing-function: ease-out;
    }
    40% {
        -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg);
        -ms-animation-timing-function: ease-out;
    }
    50% {
        -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
        -ms-animation-timing-function: ease-in;
    }
    80% {
        -ms-transform: perspective(400px) rotateY(360deg) scale(0.95);
        -ms-animation-timing-function: ease-in;
    }
    100% {
        -ms-transform: perspective(400px) scale(1);
        -ms-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(0.95);
        animation-timing-function: ease-in;
    }
    100% {
        transform: perspective(400px) scale(1);
        animation-timing-function: ease-in;
    }
}

@-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(0);
        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(0);
        opacity: 1;
    }
}

@-ms-keyframes FlipInX {
    0% {
        -ms-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
    40% {
        -ms-transform: perspective(400px) rotateX(-10deg);
    }
    70% {
        -ms-transform: perspective(400px) rotateX(10deg);
    }
    100% {
        -ms-transform: perspective(400px) rotateX(0);
        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(0);
        opacity: 1;
    }
}

@-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(0);
        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(0);
        opacity: 1;
    }
}

@-ms-keyframes FlipInY {
    0% {
        -ms-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
    40% {
        -ms-transform: perspective(400px) rotateY(-10deg);
    }
    70% {
        -ms-transform: perspective(400px) rotateY(10deg);
    }
    100% {
        -ms-transform: perspective(400px) rotateY(0);
        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(0);
        opacity: 1;
    }
}

@-webkit-keyframes FlipOutX {
    0% {
        -webkit-transform: perspective(400px) rotateX(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-moz-keyframes FlipOutX {
    0% {
        -moz-transform: perspective(400px) rotateX(0);
        opacity: 1;
    }
    100% {
        -moz-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-ms-keyframes FlipOutX {
    0% {
        -ms-transform: perspective(400px) rotateX(0);
        opacity: 1;
    }
    100% {
        -ms-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@keyframes FlipOutX {
    0% {
        transform: perspective(400px) rotateX(0);
        opacity: 1;
    }
    100% {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-webkit-keyframes FlipOutY {
    0% {
        -webkit-transform: perspective(400px) rotateY(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

@-moz-keyframes FlipOutY {
    0% {
        -moz-transform: perspective(400px) rotateY(0);
        opacity: 1;
    }
    100% {
        -moz-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

@-ms-keyframes FlipOutY {
    0% {
        -ms-transform: perspective(400px) rotateY(0);
        opacity: 1;
    }
    100% {
        -ms-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

@keyframes FlipOutY {
    0% {
        transform: perspective(400px) rotateY(0);
        opacity: 1;
    }
    100% {
        transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

@-webkit-keyframes Flash {
    0%,
    50%,
    100% {
        opacity: 1;
    }
    25%,
    75% {
        opacity: 0;
    }
}

@-moz-keyframes Flash {
    0%,
    50%,
    100% {
        opacity: 1;
    }
    25%,
    75% {
        opacity: 0;
    }
}

@-ms-keyframes Flash {
    0%,
    50%,
    100% {
        opacity: 1;
    }
    25%,
    75% {
        opacity: 0;
    }
}

@keyframes Flash {
    0%,
    50%,
    100% {
        opacity: 1;
    }
    25%,
    75% {
        opacity: 0;
    }
}

@-webkit-keyframes Tada {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    10%,
    20% {
        -webkit-transform: scale(0.9) rotate(-3deg);
        transform: scale(0.9) rotate(-3deg);
    }
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg);
    }
    40%,
    60%,
    80% {
        -webkit-transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        -webkit-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0);
    }
}

@-moz-keyframes Tada {
    0% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
    10%,
    20% {
        -moz-transform: scale(0.9) rotate(-3deg);
        transform: scale(0.9) rotate(-3deg);
    }
    30%,
    50%,
    70%,
    90% {
        -moz-transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg);
    }
    40%,
    60%,
    80% {
        -moz-transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        -moz-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0);
    }
}

@-ms-keyframes Tada {
    0% {
        -ms-transform: scale(1);
        transform: scale(1);
    }
    10%,
    20% {
        -ms-transform: scale(0.9) rotate(-3deg);
        transform: scale(0.9) rotate(-3deg);
    }
    30%,
    50%,
    70%,
    90% {
        -ms-transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg);
    }
    40%,
    60%,
    80% {
        -ms-transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        -ms-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0);
    }
}

@keyframes Tada {
    0% {
        transform: scale(1);
        transform: scale(1);
    }
    10%,
    20% {
        transform: scale(0.9) rotate(-3deg);
        transform: scale(0.9) rotate(-3deg);
    }
    30%,
    50%,
    70%,
    90% {
        transform: scale(1.1) rotate(3deg);
        transform: scale(1.1) rotate(3deg);
    }
    40%,
    60%,
    80% {
        transform: scale(1.1) rotate(-3deg);
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        transform: scale(1) rotate(0);
        transform: scale(1) rotate(0);
    }
}

@-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);
    }
}

@-ms-keyframes Shake {
    0%,
    100% {
        -ms-transform: translateX(0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -ms-transform: translateX(-10px);
    }
    20%,
    40%,
    60%,
    80% {
        -ms-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);
    }
}

@-webkit-keyframes Wobble {
    0% {
        -webkit-transform: translateX(0);
    }
    15% {
        -webkit-transform: translateX(-100px) rotate(-5deg);
    }
    30% {
        -webkit-transform: translateX(80px) rotate(3deg);
    }
    45% {
        -webkit-transform: translateX(-65px) rotate(-3deg);
    }
    60% {
        -webkit-transform: translateX(40px) rotate(2deg);
    }
    75% {
        -webkit-transform: translateX(-20px) rotate(-1deg);
    }
    100% {
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes Wobble {
    0% {
        -moz-transform: translateX(0);
    }
    15% {
        -moz-transform: translateX(-100px) rotate(-5deg);
    }
    30% {
        -moz-transform: translateX(80px) rotate(3deg);
    }
    45% {
        -moz-transform: translateX(-65px) rotate(-3deg);
    }
    60% {
        -moz-transform: translateX(40px) rotate(2deg);
    }
    75% {
        -moz-transform: translateX(-20px) rotate(-1deg);
    }
    100% {
        -moz-transform: translateX(0);
    }
}

@-ms-keyframes Wobble {
    0% {
        -ms-transform: translateX(0);
    }
    15% {
        -ms-transform: translateX(-100px) rotate(-5deg);
    }
    30% {
        -ms-transform: translateX(80px) rotate(3deg);
    }
    45% {
        -ms-transform: translateX(-65px) rotate(-3deg);
    }
    60% {
        -ms-transform: translateX(40px) rotate(2deg);
    }
    75% {
        -ms-transform: translateX(-20px) rotate(-1deg);
    }
    100% {
        -ms-transform: translateX(0);
    }
}

@keyframes Wobble {
    0% {
        transform: translateX(0);
    }
    15% {
        transform: translateX(-100px) rotate(-5deg);
    }
    30% {
        transform: translateX(80px) rotate(3deg);
    }
    45% {
        transform: translateX(-65px) rotate(-3deg);
    }
    60% {
        transform: translateX(40px) rotate(2deg);
    }
    75% {
        transform: translateX(-20px) rotate(-1deg);
    }
    100% {
        transform: translateX(0);
    }
}