@charset "UTF-8";

.active .fadeIn{opacity:0;
    animation: fadeIn 1s 1s ease both;
    -moz-animation: fadeIn 1s 1s ease;
    -webkit-animation: fadeIn 1s 1s ease both;
    -o-animation:fadeIn 1s 1s ease both;}
.active .fadeInUp{opacity:0;
    animation: fadeInUp 1s 1s ease both;
    -moz-animation: fadeInUp 1s 1s ease;
    -webkit-animation: fadeInUp 1s 1s ease both;
    -o-animation:fadeInUp 1s 1s ease both;}
.active .fadeInDown{opacity:0;
    animation: fadeInDown 1s 1s ease both;
    -moz-animation: fadeInDown 1s 1s ease;
    -webkit-animation: fadeInDown 1s 1s ease both;
    -o-animation:fadeInDown 1s 1s ease both;}
.active .fadeInLeft{opacity:0;
    animation: fadeInLeft 1s 1s ease both;
    -moz-animation: fadeInLeft 1s 1s ease;
    -webkit-animation: fadeInLeft 1s 1s ease both;
    -o-animation:fadeInLeft 1s 1s ease both;}
.active .fadeInRight{opacity:0;
    animation: fadeInRight 1s 1s ease both;
    -moz-animation: fadeInRight 1s 1s ease;
    -webkit-animation: fadeInRight 1s 1s ease both;
    -o-animation:fadeInRight 1s 1s ease both;}
.active .fadeInBL{opacity:0;
	animation: fadeInBL 1s 1s ease both;
	-moz-animation: fadeInBL 1s 1s ease;
	-webkit-animation: fadeInBL 1s 1s ease both;
	-o-animation:fadeInBL 1s 1s ease both;}
.active .fadeInTR{opacity:0;
	animation: fadeInTR 1s 1s ease both;
	-moz-animation: fadeInTR 1s 1s ease;
	-webkit-animation: fadeInTR 1s 1s ease both;
	-o-animation:fadeInTR 1s 1s ease both;}
.active .fadeInBR{opacity:0;
	animation: fadeInBR 1s 1s ease both;
	-moz-animation: fadeInBR 1s 1s ease;
	-webkit-animation: fadeInBR 1s 1s ease both;
	-o-animation:fadeInBR 1s 1s ease both;}
.active .fadeInTL{opacity:0;
	animation: fadeInTL 1s 1s ease both;
	-moz-animation: fadeInTL 1s 1s ease;
	-webkit-animation: fadeInTL 1s 1s ease both;
	-o-animation:fadeInTL 1s 1s ease both;}
.active .fadeInUpBig{opacity:0;
	animation: fadeInUpBig 1s 1s ease both;
	-moz-animation: fadeInUpBig 1s 1s ease;
	-webkit-animation: fadeInUpBig 1s 1s ease both;
	-o-animation:fadeInUpBig 1s 1s ease both;}
.active .fadeInDownBig{opacity:0;
    animation: fadeInDownBig 1s 1s ease both;
    -moz-animation: fadeInDownBig 1s 1s ease;
    -webkit-animation: fadeInDownBig 1s 1s ease both;
    -o-animation:fadeInDownBig 1s 1s ease both;}
.active .fadeInLeftBig{opacity:0;
    animation: fadeInLeftBig 1s 1s ease both;
    -moz-animation: fadeInLeftBig 1s 1s ease;
    -webkit-animation: fadeInLeftBig 1s 1s ease both;
    -o-animation:fadeInLeftBig 1s 1s ease both;}   
.active .fadeInRightBig{opacity:0;
    animation: fadeInRightBig 1s 1s ease both;
    -moz-animation: fadeInRightBig 1s 1s ease;
    -webkit-animation: fadeInRightBig 1s 1s ease both;
    -o-animation:fadeInRightBig 1s 1s ease both;}
.active .fadeInBigTR{opacity:0;
    animation: fadeInBigTR 1s 1s ease both;
    -moz-animation: fadeInBigTR 1s 1s ease;
    -webkit-animation: fadeInBigTR 1s 1s ease both;
    -o-animation:fadeInBigTR 1s 1s ease both;}
.active .fadeInBigBR{opacity:0;
    animation: fadeInBigBR 1s 1s ease both;
    -moz-animation: fadeInBigBR 1s 1s ease;
    -webkit-animation: fadeInBigBR 1s 1s ease both;
    -o-animation:fadeInBigBR 1s 1s ease both;}
.active .fadeInBigTL{opacity:0;
    animation: fadeInBigTL 1s 1s ease both;
    -moz-animation: fadeInBigTL 1s 1s ease;
    -webkit-animation: fadeInBigTL 1s 1s ease both;
    -o-animation:fadeInBigTL 1s 1s ease both;}
.active .fadeInBigBL{opacity:0;
    animation: fadeInBigBL 1s 1s ease both;
    -moz-animation: fadeInBigBL 1s 1s ease;
    -webkit-animation: fadeInBigBL 1s 1s ease both;
    -o-animation:fadeInBigBL 1s 1s ease both;}
.active .bounceInUp{opacity:0;
    animation: bounceInUp 1s 1s ease both;
    -moz-animation: bounceInUp 1s 1s ease;
    -webkit-animation: bounceInUp 1s 1s ease both;
    -o-animation:bounceInUp 1s 1s ease both;}
.active .bounceInDown{opacity:0;
    animation: bounceInDown 1s 1s ease both;
    -moz-animation: bounceInDown 1s 1s ease;
    -webkit-animation: bounceInDown 1s 1s ease both;
    -o-animation:bounceInDown 1s 1s ease both;}
.active .bounceInLeft{opacity:0;
    animation: bounceInLeft 1s 1s ease both;
    -moz-animation: bounceInLeft 1s 1s ease;
    -webkit-animation: bounceInLeft 1s 1s ease both;
    -o-animation:bounceInLeft 1s 1s ease both;}
.active .bounceInRight{opacity:0;
    animation: bounceInRight 1s 1s ease both;
    -moz-animation: bounceInRight 1s 1s ease;
    -webkit-animation: bounceInRight 1s 1s ease both;
    -o-animation:bounceInRight 1s 1s ease both;}
.active .bounceInBR{opacity:0;
    animation: bounceInBR 1s 1s ease both;
    -moz-animation: bounceInBR 1s 1s ease;
    -webkit-animation: bounceInBR 1s 1s ease both;
    -o-animation:bounceInBR 1s 1s ease both;}
.active .bounceInTL{opacity:0;
    animation: bounceInTL 1s 1s ease both;
    -moz-animation: bounceInTL 1s 1s ease;
    -webkit-animation: bounceInTL 1s 1s ease both;
    -o-animation:bounceInTL 1s 1s ease both;}
.active .bounceInBL{opacity:0;
    animation: bounceInBL 1s 1s ease both;
    -moz-animation: bounceInBL 1s 1s ease;
    -webkit-animation: bounceInBL 1s 1s ease both;
    -o-animation:bounceInBL 1s 1s ease both;}
.active .bounceInTR{opacity:0;
    animation: bounceInTR 1s 1s ease both;
    -moz-animation: bounceInTR 1s 1s ease;
    -webkit-animation: bounceInTR 1s 1s ease both;
    -o-animation:bounceInTR 1s 1s ease both;}
.active .lightSpeedInRight{opacity:0;
    animation: lightSpeedInRight 1s 1s ease both;
    -moz-animation: lightSpeedInRight 1s 1s ease;
    -webkit-animation: lightSpeedInRight 1s 1s ease both;
    -o-animation:lightSpeedInRight 1s 1s ease both;}
.active .lightSpeedInLeft{opacity:0;
    animation: lightSpeedInLeft 1s 1s ease both;
    -moz-animation: lightSpeedInLeft 1s 1s ease;
    -webkit-animation: lightSpeedInLeft 1s 1s ease both;
    -o-animation:lightSpeedInLeft 1s 1s ease both;}
.active .fadeOutIn{opacity:0;
    animation: fadeOutIn 1s 1s ease both;
    -moz-animation: fadeOutIn 1s 1s ease;
    -webkit-animation: fadeOutIn 1s 1s ease both;
    -o-animation:fadeOutIn 1s 1s ease both;}
.active .flash{opacity:0;
    animation: flash 1s 1s ease both;
    -moz-animation: flash 1s 1s ease;
    -webkit-animation: flash 1s 1s ease both;
    -o-animation:flash 1s 1s ease both;}
.active .moveOutIn{opacity:0;
    animation: moveOutIn 1s 1s ease both;
    -moz-animation: moveOutIn 1s 1s ease;
    -webkit-animation: moveOutIn 1s 1s ease both;
    -o-animation:moveOutIn 1s 1s ease both;}
.active .bounceIn{opacity:0;
    animation: bounceIn 1s 1s ease both;
    -moz-animation: bounceIn 1s 1s ease;
    -webkit-animation: bounceIn 1s 1s ease both;
    -o-animation:bounceIn 1s 1s ease both;}
.active .bounceOut{opacity:0;
    animation: bounceOut 1s 1s ease both;
    -moz-animation: bounceOut 1s 1s ease;
    -webkit-animation: bounceOut 1s 1s ease both;
    -o-animation:bounceOut 1s 1s ease both;}
.active .zoomIn{opacity:0;
    animation: zoomIn 1s 1s ease both;
    -moz-animation: zoomIn 1s 1s ease;
    -webkit-animation: zoomIn 1s 1s ease both;
    -o-animation:zoomIn 1s 1s ease both;}
.active .zoomOut{opacity:0;
    animation: zoomOut 1s 1s ease both;
    -moz-animation: zoomOut 1s 1s ease;
    -webkit-animation: zoomOut 1s 1s ease both;
    -o-animation:zoomOut 1s 1s ease both;}
.active .zoomInDown{opacity:0;
    animation: zoomInDown 1s 1s ease both;
    -moz-animation: zoomInDown 1s 1s ease;
    -webkit-animation: zoomInDown 1s 1s ease both;
    -o-animation:zoomInDown 1s 1s ease both;}
.active .zoomInUp{opacity:0;
    animation: zoomInUp 1s 1s ease both;
    -moz-animation: zoomInUp 1s 1s ease;
    -webkit-animation: zoomInUp 1s 1s ease both;
    -o-animation:zoomInUp 1s 1s ease both;}
.active .zoomInLeft{opacity:0;
    animation: zoomInLeft 1s 1s ease both;
    -moz-animation: zoomInLeft 1s 1s ease;
    -webkit-animation: zoomInLeft 1s 1s ease both;
    -o-animation:zoomInLeft 1s 1s ease both;}
.active .zoomInRight{opacity:0;
    animation: zoomInRight 1s 1s ease both;
    -moz-animation: zoomInRight 1s 1s ease;
    -webkit-animation: zoomInRight 1s 1s ease both;
    -o-animation:zoomInRight 1s 1s ease both;}
.active .pullBottom{opacity:0;
    animation: pullBottom 1s 1s ease both;
    -moz-animation: pullBottom 1s 1s ease;
    -webkit-animation: pullBottom 1s 1s ease both;
    -o-animation:pullBottom 1s 1s ease both;}
.active .pullTop{opacity:0;
    animation: pullTop 1s 1s ease both;
    -moz-animation: pullTop 1s 1s ease;
    -webkit-animation: pullTop 1s 1s ease both;
    -o-animation:pullTop 1s 1s ease both;}
.active .pullLeft{opacity:0;
    animation: pullLeft 1s 1s ease both;
    -moz-animation: pullLeft 1s 1s ease;
    -webkit-animation: pullLeft 1s 1s ease both;
    -o-animation:pullLeft 1s 1s ease both;}
.active .pullRight{opacity:0;
    animation: pullRight 1s 1s ease both;
    -moz-animation: pullRight 1s 1s ease;
    -webkit-animation: pullRight 1s 1s ease both;
    -o-animation:pullRight 1s 1s ease both;}
.active .flipInX{opacity:0;
    animation: flipInX 1s 1s ease both;
    -moz-animation: flipInX 1s 1s ease;
    -webkit-animation: flipInX 1s 1s ease both;
    -o-animation:flipInX 1s 1s ease both;}
.active .flipInY{opacity:0;
    animation: flipInY 1s 1s ease both;
    -moz-animation: flipInY 1s 1s ease;
    -webkit-animation: flipInY 1s 1s ease both;
    -o-animation:flipInY 1s 1s ease both;}
.active .rotateIn{opacity:0;
    animation: rotateIn 1s 1s ease both;
    -moz-animation: rotateIn 1s 1s ease;
    -webkit-animation: rotateIn 1s 1s ease both;
    -o-animation:rotateIn 1s 1s ease both;}
.active .flipInRing{opacity:0;
    animation: flipInRing 1s 1s ease both;
    -moz-animation: flipInRing 1s 1s ease;
    -webkit-animation: flipInRing 1s 1s ease both;
    -o-animation:flipInRing 1s 1s ease both;}
.active .flip{opacity:0;
    animation: flip 1s 1s ease both;
    -moz-animation: flip 1s 1s ease;
    -webkit-animation: flip 1s 1s ease both;
    -o-animation:flip 1s 1s ease both;}
.active .rollIn{opacity:0;
    animation: rollIn 1s 1s ease both;
    -moz-animation: rollIn 1s 1s ease;
    -webkit-animation: rollIn 1s 1s ease both;
    -o-animation:rollIn 1s 1s ease both;}
.active .rollInRight{opacity:0;
    animation: rollInRight 1s 1s ease both;
    -moz-animation: rollInRight 1s 1s ease;
    -webkit-animation: rollInRight 1s 1s ease both;
    -o-animation:rollInRight 1s 1s ease both;}
.active .rotateInDownLeft{opacity:0;
    animation: rotateInDownLeft 1s 1s ease both;
    -moz-animation: rotateInDownLeft 1s 1s ease;
    -webkit-animation: rotateInDownLeft 1s 1s ease both;
    -o-animation:rotateInDownLeft 1s 1s ease both;}
.active .rotateInUpRight{opacity:0;
    animation: rotateInUpRight 1s 1s ease both;
    -moz-animation: rotateInUpRight 1s 1s ease;
    -webkit-animation: rotateInUpRight 1s 1s ease both;
    -o-animation:rotateInUpRight 1s 1s ease both;}
.active .rotateInDownRight{opacity:0;
    animation: rotateInDownRight 1s 1s ease both;
    -moz-animation: rotateInDownRight 1s 1s ease;
    -webkit-animation: rotateInDownRight 1s 1s ease both;
    -o-animation:rotateInDownRight 1s 1s ease both;}
.active .rotateInUpLeft{opacity:0;
    animation: rotateInUpLeft 1s 1s ease both;
    -moz-animation: rotateInUpLeft 1s 1s ease;
    -webkit-animation: rotateInUpLeft 1s 1s ease both;
    -o-animation:rotateInUpLeft 1s 1s ease both;}
.active .moveLr{opacity:0;
    animation: moveLr 1s 1s ease both;
    -moz-animation: moveLr 1s 1s ease;
    -webkit-animation: moveLr 1s 1s ease both;
    -o-animation:moveLr 1s 1s ease both;}
.active .moveTb{opacity:0;
    animation: moveTb 1s 1s ease both;
    -moz-animation: moveTb 1s 1s ease;
    -webkit-animation: moveTb 1s 1s ease both;
    -o-animation:moveTb 1s 1s ease both;}
.active .swing{opacity:0;
    animation: swing 1s 1s ease both;
    -moz-animation: swing 1s 1s ease;
    -webkit-animation: swing 1s 1s ease both;
    -o-animation:swing 1s 1s ease both;}
.active .swingTop{opacity:0;
    animation: swingTop 1s 1s ease both;
    -moz-animation: swingTop 1s 1s ease;
    -webkit-animation: swingTop 1s 1s ease both;
    -o-animation:swingTop 1s 1s ease both;}
.active .swingBottom{opacity:0;
    animation: swingBottom 1s 1s ease both;
    -moz-animation: swingBottom 1s 1s ease;
    -webkit-animation: swingBottom 1s 1s ease both;
    -o-animation:swingBottom 1s 1s ease both;}
.active .swingLeft{opacity:0;
    animation: swingLeft 1s 1s ease both;
    -moz-animation: swingLeft 1s 1s ease;
    -webkit-animation: swingLeft 1s 1s ease both;
    -o-animation:swingLeft 1s 1s ease both;}
.active .swingRight{opacity:0;
    animation: swingRight 1s 1s ease both;
    -moz-animation: swingRight 1s 1s ease;
    -webkit-animation: swingRight 1s 1s ease both;
    -o-animation:swingRight 1s 1s ease both;}
.active .jelloBottom{opacity:0;
    animation: jelloBottom 1s 1s ease both;
    -moz-animation: jelloBottom 1s 1s ease;
    -webkit-animation: jelloBottom 1s 1s ease both;
    -o-animation:jelloBottom 1s 1s ease both;}
.active .jelloRight{opacity:0;
    animation: jelloRight 1s 1s ease both;
    -moz-animation: jelloRight 1s 1s ease;
    -webkit-animation: jelloRight 1s 1s ease both;
    -o-animation:jelloRight 1s 1s ease both;}
.active .jelloTop{opacity:0;
    animation: jelloTop 1s 1s ease both;
    -moz-animation: jelloTop 1s 1s ease;
    -webkit-animation: jelloTop 1s 1s ease both;
    -o-animation:jelloTop 1s 1s ease both;}
.active .jelloLeft{opacity:0;
    animation: jelloLeft 1s 1s ease both;
    -moz-animation: jelloLeft 1s 1s ease;
    -webkit-animation: jelloLeft 1s 1s ease both;
    -o-animation:jelloLeft 1s 1s ease both;}
.active .jelloCenter{opacity:0;
    animation: jelloCenter 1s 1s ease both;
    -moz-animation: jelloCenter 1s 1s ease;
    -webkit-animation: jelloCenter 1s 1s ease both;
    -o-animation:jelloCenter 1s 1s ease both;}
.active .shake{opacity:0;
    animation: shake 1s 1s ease both;
    -moz-animation: shake 1s 1s ease;
    -webkit-animation: shake 1s 1s ease both;
    -o-animation:shake 1s 1s ease both;}
.active .tada{opacity:0;
    animation: tada 1s 1s ease both;
    -moz-animation: tada 1s 1s ease;
    -webkit-animation: tada 1s 1s ease both;
    -o-animation:tada 1s 1s ease both;}
.active .rubberBand{opacity:0;
    animation: rubberBand 1s 1s ease both;
    -moz-animation: rubberBand 1s 1s ease;
    -webkit-animation: rubberBand 1s 1s ease both;
    -o-animation:rubberBand 1s 1s ease both;}
.active .bounce{opacity:0;
    animation: bounce 1s 1s ease both;
    -moz-animation: bounce 1s 1s ease;
    -webkit-animation: bounce 1s 1s ease both;
    -o-animation:bounce 1s 1s ease both;}
.active .fadeOut{opacity:0;
    animation: fadeOut 1s 1s ease both;
    -moz-animation: fadeOut 1s 1s ease;
    -webkit-animation: fadeOut 1s 1s ease both;
    -o-animation:fadeOut 1s 1s ease both;}
.active .fadeOutUp{opacity:0;
    animation: fadeOutUp 1s 1s ease both;
    -moz-animation: fadeOutUp 1s 1s ease;
    -webkit-animation: fadeOutUp 1s 1s ease both;
    -o-animation:fadeOutUp 1s 1s ease both;}
.active .fadeOutDown{opacity:0;
    animation: fadeOutDown 1s 1s ease both;
    -moz-animation: fadeOutDown 1s 1s ease;
    -webkit-animation: fadeOutDown 1s 1s ease both;
    -o-animation:fadeOutDown 1s 1s ease both;}
.active .fadeOutLeft{opacity:0;
    animation: fadeOutLeft 1s 1s ease both;
    -moz-animation: fadeOutLeft 1s 1s ease;
    -webkit-animation: fadeOutLeft 1s 1s ease both;
    -o-animation:fadeOutLeft 1s 1s ease both;}
.active .fadeOutRight{opacity:0;
    animation: fadeOutRight 1s 1s ease both;
    -moz-animation: fadeOutRight 1s 1s ease;
    -webkit-animation: fadeOutRight 1s 1s ease both;
    -o-animation:fadeOutRight 1s 1s ease both;}
.active .hingeLeft{opacity:0;
    animation: hingeLeft 1s 1s ease both;
    -moz-animation: hingeLeft 1s 1s ease;
    -webkit-animation: hingeLeft 1s 1s ease both;
    -o-animation:hingeLeft 1s 1s ease both;}
.active .hingeRight{opacity:0;
    animation: hingeRight 1s 1s ease both;
    -moz-animation: hingeRight 1s 1s ease;
    -webkit-animation: hingeRight 1s 1s ease both;
    -o-animation:hingeRight 1s 1s ease both;}


@-webkit-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@-moz-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
/**
 * 分类一：飞入效果
 */

/* 短距飞入(向上) */
@-webkit-keyframes fadeInUp {0% {opacity:0;-webkit-transform:translate3d(0,100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInUp {0% {opacity:0;-moz-transform:translate3d(0,100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInUp {0% {opacity:0;transform:translate3d(0,100%,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(向右) */
@-webkit-keyframes fadeInLeft {0% {opacity:0;-webkit-transform:translate3d(-100%,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInLeft {0% {opacity:0;-moz-transform:translate3d(-100%,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInLeft {0% {opacity:0;transform:translate3d(-100%,0,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(向左) */
@-webkit-keyframes fadeInRight {0% {opacity:0;-webkit-transform:translate3d(100%,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInRight {0% {opacity:0;-moz-transform:translate3d(100%,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInRight {0% {opacity:0;transform:translate3d(100%,0,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(左下) */
@-webkit-keyframes fadeInBL {0% {opacity:0;-webkit-transform:translate3d(-100%,100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBL {0% {opacity:0;-moz-transform:translate3d(-100%,100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBL {0% {opacity:0;transform:translate3d(-100%,100%,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(右上) */
@-webkit-keyframes fadeInTR {0% {opacity:0;-webkit-transform:translate3d(100%,-100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInTR {0% {opacity:0;-moz-transform:translate3d(100%,-100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInTR {0% {opacity:0;transform:translate3d(100%,-100%,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(向下) */
@-webkit-keyframes fadeInDown {0% {opacity:0;-webkit-transform:translate3d(0,-100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInDown {0% {opacity:0;-moz-transform:translate3d(0,-100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInDown {0% {opacity:0;transform:translate3d(0,-100%,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(右下) */
@-webkit-keyframes fadeInBR {0% {opacity:0;-webkit-transform:translate3d(100%,100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBR {0% {opacity:0;-moz-transform:translate3d(100%,100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBR {0% {opacity:0;transform:translate3d(100%,100%,0)}
100% {opacity:1;transform:none}
}

/* 短距飞入(左上) */
@-webkit-keyframes fadeInTL {0% {opacity:0;-webkit-transform:translate3d(-100%,-100%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInTL {0% {opacity:0;-moz-transform:translate3d(-100%,-100%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInTL {0% {opacity:0;transform:translate3d(-100%,-100%,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(向上) */
@-webkit-keyframes fadeInUpBig {0% {opacity:0;-webkit-transform:translate3d(0,2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInUpBig {0% {opacity:0;-moz-transform:translate3d(0,2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInUpBig {0% {opacity:0;transform:translate3d(0,2000px,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(向下) */
@-webkit-keyframes fadeInDownBig {0% {opacity:0;-webkit-transform:translate3d(0,-2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInDownBig {0% {opacity:0;-moz-transform:translate3d(0,-2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInDownBig {0% {opacity:0;transform:translate3d(0,-2000px,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(向右) */
@-webkit-keyframes fadeInLeftBig {0% {opacity:0;-webkit-transform:translate3d(-2000px,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInLeftBig {0% {opacity:0;-moz-transform:translate3d(-2000px,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInLeftBig {0% {opacity:0;transform:translate3d(-2000px,0,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(向左) */
@-webkit-keyframes fadeInRightBig {0% {opacity:0;-webkit-transform:translate3d(2000px,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInRightBig {0% {opacity:0;-moz-transform:translate3d(2000px,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInRightBig {0% {opacity:0;transform:translate3d(2000px,0,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(右上) */
@-webkit-keyframes fadeInBigTR {0% {opacity:0;-webkit-transform:translate3d(2000px,-2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBigTR {0% {opacity:0;-moz-transform:translate3d(2000px,-2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBigTR {0% {opacity:0;transform:translate3d(2000px,-2000px,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(右下) */
@-webkit-keyframes fadeInBigBR {0% {opacity:0;-webkit-transform:translate3d(2000px,2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBigBR {0% {opacity:0;-moz-transform:translate3d(2000px,2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBigBR {0% {opacity:0;transform:translate3d(2000px,2000px,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(左上) */
@-webkit-keyframes fadeInBigTL {0% {opacity:0;-webkit-transform:translate3d(-2000px,-2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBigTL {0% {opacity:0;-moz-transform:translate3d(-2000px,-2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBigTL {0% {opacity:0;transform:translate3d(-2000px,-2000px,0)}
100% {opacity:1;transform:none}
}

/* 长距飞入(左下) */
@-webkit-keyframes fadeInBigBL {0% {opacity:0;-webkit-transform:translate3d(-2000px,2000px,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes fadeInBigBL {0% {opacity:0;-moz-transform:translate3d(-2000px,2000px,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes fadeInBigBL {0% {opacity:0;transform:translate3d(-2000px,2000px,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(向上) */
@-webkit-keyframes bounceInUp {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(0,100%,0)}
50% {opacity:1;-webkit-transform:translate3d(0,-8%,0)}
65% {opacity:1;-webkit-transform:translate3d(0,4%,0)}
80% {opacity:1;-webkit-transform:translate3d(0,-4%,0)}
95% {opacity:1;-webkit-transform:translate3d(0,2%,0)}
100% {opacity:1;-webkit-transform:translate3d(0,0,0)}
}
@-moz-keyframes bounceInUp {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(0,100%,0)}
50% {opacity:1;-moz-transform:translate3d(0,-8%,0)}
65% {opacity:1;-moz-transform:translate3d(0,4%,0)}
80% {opacity:1;-moz-transform:translate3d(0,-4%,0)}
95% {opacity:1;-moz-transform:translate3d(0,2%,0)}
100% {opacity:1;-moz-transform:translate3d(0,0,0)}
}
@keyframes bounceInUp {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(0,100%,0)}
50% {opacity:1;transform:translate3d(0,-8%,0)}
65% {opacity:1;transform:translate3d(0,4%,0)}
80% {opacity:1;transform:translate3d(0,-4%,0)}
95% {opacity:1;transform:translate3d(0,2%,0)}
100% {opacity:1;transform:translate3d(0,0,0)}
}

/* 飞入反弹(向下) */
@-webkit-keyframes bounceInDown {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(0,-100%,0)}
50% {opacity:1;-webkit-transform:translate3d(0,8%,0)}
65% {-webkit-transform:translate3d(0,-4%,0)}
80% {-webkit-transform:translate3d(0,4%,0)}
95% {-webkit-transform:translate3d(0,-2%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInDown {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(0,-100%,0)}
50% {opacity:1;-moz-transform:translate3d(0,8%,0)}
65% {-moz-transform:translate3d(0,-4%,0)}
80% {-moz-transform:translate3d(0,4%,0)}
95% {-moz-transform:translate3d(0,-2%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInDown {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(0,-100%,0)}
50% {opacity:1;transform:translate3d(0,8%,0)}
65% {transform:translate3d(0,-4%,0)}
80% {transform:translate3d(0,4%,0)}
95% {transform:translate3d(0,-2%,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(向左) */
@-webkit-keyframes bounceInLeft {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(150%,0,0)}
50% {opacity:1;-webkit-transform:translate3d(-8%,0,0)}
65% {-webkit-transform:translate3d(4%,0,0)}
80% {-webkit-transform:translate3d(-4%,0,0)}
95% {-webkit-transform:translate3d(2%,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInLeft {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(150%,0,0)}
50% {opacity:1;-moz-transform:translate3d(-8%,0,0)}
65% {-moz-transform:translate3d(4%,0,0)}
80% {-moz-transform:translate3d(-4%,0,0)}
95% {-moz-transform:translate3d(2%,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInLeft {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(150%,0,0)}
50% {opacity:1;transform:translate3d(-8%,0,0)}
65% {transform:translate3d(4%,0,0)}
80% {transform:translate3d(-4%,0,0)}
95% {transform:translate3d(2%,0,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(向右) */
@-webkit-keyframes bounceInRight {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(-150%,0,0)}
50% {opacity:1;-webkit-transform:translate3d(8%,0,0)}
65% {-webkit-transform:translate3d(-4%,0,0)}
80% {-webkit-transform:translate3d(4%,0,0)}
95% {-webkit-transform:translate3d(-2%,0,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInRight {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(-150%,0,0)}
50% {opacity:1;-moz-transform:translate3d(8%,0,0)}
65% {-moz-transform:translate3d(-4%,0,0)}
80% {-moz-transform:translate3d(4%,0,0)}
95% {-moz-transform:translate3d(-2%,0,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInRight {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(-150%,0,0)}
50% {opacity:1;transform:translate3d(8%,0,0)}
65% {transform:translate3d(-4%,0,0)}
80% {transform:translate3d(4%,0,0)}
95% {transform:translate3d(-2%,0,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(右下) */
@-webkit-keyframes bounceInBR {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(100%,100%,0)}
50% {opacity:1;-webkit-transform:translate3d(-8%,-8%,0)}
65% {-webkit-transform:translate3d(4%,4%,0)}
80% {-webkit-transform:translate3d(-4%,-4%,0)}
95% {-webkit-transform:translate3d(2%,2%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInBR {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(100%,100%,0)}
50% {opacity:1;-moz-transform:translate3d(-8%,-8%,0)}
65% {-moz-transform:translate3d(4%,4%,0)}
80% {-moz-transform:translate3d(-4%,-4%,0)}
95% {-moz-transform:translate3d(2%,2%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInBR {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(100%,100%,0)}
50% {opacity:1;transform:translate3d(-8%,-8%,0)}
65% {transform:translate3d(4%,4%,0)}
80% {transform:translate3d(-4%,-4%,0)}
95% {transform:translate3d(2%,2%,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(左上) */
@-webkit-keyframes bounceInTL {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(-100%,-100%,0)}
50% {opacity:1;-webkit-transform:translate3d(8%,8%,0)}
65% {-webkit-transform:translate3d(-4%,-4%,0)}
80% {-webkit-transform:translate3d(4%,4%,0)}
95% {-webkit-transform:translate3d(-2%,-2%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInTL {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(-100%,-100%,0)}
50% {opacity:1;-moz-transform:translate3d(8%,8%,0)}
65% {-moz-transform:translate3d(-4%,-4%,0)}
80% {-moz-transform:translate3d(4%,4%,0)}
95% {-moz-transform:translate3d(-2%,-2%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInTL {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(-100%,-100%,0)}
50% {opacity:1;transform:translate3d(8%,8%,0)}
65% {transform:translate3d(-4%,-4%,0)}
80% {transform:translate3d(4%,4%,0)}
95% {transform:translate3d(-2%,-2%,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(左下) */
@-webkit-keyframes bounceInBL {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(-100%,100%,0)}
50% {opacity:1;-webkit-transform:translate3d(8%,-8%,0)}
65% {-webkit-transform:translate3d(-4%,4%,0)}
80% {-webkit-transform:translate3d(4%,-4%,0)}
95% {-webkit-transform:translate3d(-2%,2%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInBL {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(-100%,100%,0)}
50% {opacity:1;-moz-transform:translate3d(8%,-8%,0)}
65% {-moz-transform:translate3d(-4%,4%,0)}
80% {-moz-transform:translate3d(4%,-4%,0)}
95% {-moz-transform:translate3d(-2%,2%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInBL {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(-100%,100%,0)}
50% {opacity:1;transform:translate3d(8%,-8%,0)}
65% {transform:translate3d(-4%,4%,0)}
80% {transform:translate3d(4%,-4%,0)}
95% {transform:translate3d(-2%,2%,0)}
100% {opacity:1;transform:none}
}

/* 飞入反弹(右上) */
@-webkit-keyframes bounceInTR {0%,60%,75%,90%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:translate3d(100%,-100%,0)}
50% {opacity:1;-webkit-transform:translate3d(-8%,8%,0)}
65% {-webkit-transform:translate3d(4%,-4%,0)}
80% {-webkit-transform:translate3d(-4%,4%,0)}
95% {-webkit-transform:translate3d(2%,-2%,0)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes bounceInTR {0%,60%,75%,90%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:translate3d(100%,-100%,0)}
50% {opacity:1;-moz-transform:translate3d(-8%,8%,0)}
65% {-moz-transform:translate3d(4%,-4%,0)}
80% {-moz-transform:translate3d(-4%,4%,0)}
95% {-moz-transform:translate3d(2%,-2%,0)}
100% {opacity:1;-moz-transform:none}
}
@keyframes bounceInTR {0%,60%,75%,90%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:translate3d(100%,-100%,0)}
50% {opacity:1;transform:translate3d(-8%,8%,0)}
65% {transform:translate3d(4%,-4%,0)}
80% {transform:translate3d(-4%,4%,0)}
95% {transform:translate3d(2%,-2%,0)}
100% {opacity:1;transform:none}
}

/* 加速飞入(向右) */
@-webkit-keyframes lightSpeedInRight {0% {-webkit-transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}
60% {-webkit-transform:skewX(-20deg);opacity:1}
80% {-webkit-transform:skewX(5deg);opacity:1}
100% {-webkit-transform:none;opacity:1}
}
@-moz-keyframes lightSpeedInRight {0% {-moz-transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}
60% {-moz-transform:skewX(-20deg);opacity:1}
80% {-moz-transform:skewX(5deg);opacity:1}
100% {-moz-transform:none;opacity:1}
}
@keyframes lightSpeedInRight {0% {transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}
60% {transform:skewX(-20deg);opacity:1}
80% {transform:skewX(5deg);opacity:1}
100% {transform:none;opacity:1}
}

/* 加速飞入(向左) */
@-webkit-keyframes lightSpeedInLeft {0% {-webkit-transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}
60% {-webkit-transform:skewX(20deg);opacity:1}
80% {-webkit-transform:skewX(-5deg);opacity:1}
100% {-webkit-transform:none;opacity:1}
}
@-moz-keyframes lightSpeedInLeft {0% {-moz-transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}
60% {-moz-transform:skewX(20deg);opacity:1}
80% {-moz-transform:skewX(-5deg);opacity:1}
100% {-moz-transform:none;opacity:1}
}
@keyframes lightSpeedInLeft {0% {transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}
60% {transform:skewX(20deg);opacity:1}
80% {transform:skewX(-5deg);opacity:1}
100% {transform:none;opacity:1}
}


/**
 * 分类二：缩放显示效果
 */

/* 渐渐显示(里往外) */
@-webkit-keyframes fadeIn {0% {opacity:0}
100% {opacity:1}
}
@-moz-keyframes fadeIn {0% {opacity:0}
100% {opacity:1}
}
@keyframes fadeIn {0% {opacity:0}
100% {opacity:1}
}

/* 放大消失(里往外) */
@-webkit-keyframes fadeOutIn {0% {-webkit-transform:scale(1.1);-webkit-animation-timing-function:linear;opacity:0}
50% {-webkit-transform:scale(1);-webkit-animation-timing-function:linear;opacity:.5}
100% {-webkit-transform:scale(1.5);-webkit-animation-timing-function:linear;opacity:0}
}
@-moz-keyframes fadeOutIn {0% {-moz-transform:scale(1.1);-moz-animation-timing-function:linear;opacity:0}
50% {-moz-transform:scale(1);-moz-animation-timing-function:linear;opacity:.5}
100% {-moz-transform:scale(1.5);-moz-animation-timing-function:linear;opacity:0}
}
@keyframes fadeOutIn {0% {transform:scale(1.1);animation-timing-function:linear;opacity:0}
50% {transform:scale(1);animation-timing-function:linear;opacity:.5}
100% {transform:scale(1.5);animation-timing-function:linear;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}
}
@keyframes flash {0%,50%,100% {opacity:1}
25%,75% {opacity:0}
}

/* 缩放(里外) */
@-webkit-keyframes moveOutIn {0% {-webkit-transform:scale3d(1,1,1)}
50% {-webkit-transform:scale3d(1.2,1.2,1.2)}
100% {-webkit-transform:scale3d(1,1,1)}
}
@-moz-keyframes moveOutIn {0% {-moz-transform:scale3d(1,1,1)}
50% {-moz-transform:scale3d(1.2,1.2,1.2)}
100% {-moz-transform:scale3d(1,1,1)}
}
@keyframes moveOutIn {0% {transform:scale3d(1,1,1)}
50% {transform:scale3d(1.2,1.2,1.2)}
100% {transform:scale3d(1,1,1)}
}

/* 放大反弹(小到大) */
@-webkit-keyframes bounceIn {0%,20%,40%,60%,80%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:scale3d(.3,.3,.3)}
20% {-webkit-transform:scale3d(1.1,1.1,1.1)}
40% {-webkit-transform:scale3d(.9,.9,.9)}
60% {opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03)}
80% {-webkit-transform:scale3d(.97,.97,.97)}
100% {opacity:1;-webkit-transform:scale3d(1,1,1)}
}
@-moz-keyframes bounceIn {0%,20%,40%,60%,80%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:scale3d(.3,.3,.3)}
20% {-moz-transform:scale3d(1.1,1.1,1.1)}
40% {-moz-transform:scale3d(.9,.9,.9)}
60% {opacity:1;-moz-transform:scale3d(1.03,1.03,1.03)}
80% {-moz-transform:scale3d(.97,.97,.97)}
100% {opacity:1;-moz-transform:scale3d(1,1,1)}
}
@keyframes bounceIn {0%,20%,40%,60%,80%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:scale3d(.3,.3,.3)}
20% {transform:scale3d(1.1,1.1,1.1)}
40% {transform:scale3d(.9,.9,.9)}
60% {opacity:1;transform:scale3d(1.03,1.03,1.03)}
80% {transform:scale3d(.97,.97,.97)}
100% {opacity:1;transform:scale3d(1,1,1)}
}

/* 缩小反弹(大到小) */
@-webkit-keyframes bounceOut {0%,20%,40%,60%,80%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-webkit-transform:scale3d(1.8,1.8,1.8)}
20% {-webkit-transform:scale3d(.97,.97,.97)}
40% {-webkit-transform:scale3d(1.07,1.07,1.07)}
60% {opacity:1;-webkit-transform:scale3d(.97,.97,.97)}
80% {-webkit-transform:scale3d(1.03,1.03,1.03)}
100% {opacity:1;-webkit-transform:scale3d(1,1,1)}
}
@-moz-keyframes bounceOut {0%,20%,40%,60%,80%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;-moz-transform:scale3d(1.8,1.8,1.8)}
20% {-moz-transform:scale3d(.97,.97,.97)}
40% {-moz-transform:scale3d(1.07,1.07,1.07)}
60% {opacity:1;-moz-transform:scale3d(.97,.97,.97)}
80% {-moz-transform:scale3d(1.03,1.03,1.03)}
100% {opacity:1;-moz-transform:scale3d(1,1,1)}
}
@keyframes bounceOut {0%,20%,40%,60%,80%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1)}
0% {opacity:0;transform:scale3d(1.8,1.8,1.8)}
20% {transform:scale3d(.97,.97,.97)}
40% {transform:scale3d(1.07,1.07,1.07)}
60% {opacity:1;transform:scale3d(.97,.97,.97)}
80% {transform:scale3d(1.03,1.03,1.03)}
100% {opacity:1;transform:scale3d(1,1,1)}
}

/* 匀速放大(小到大) */
@-webkit-keyframes zoomIn {0% {opacity:0;-webkit-transform:scale3d(.3,.3,.3)}
50% {opacity:1}
100% {opacity:1}
}
@-moz-keyframes zoomIn {0% {opacity:0;-moz-transform:scale3d(.3,.3,.3)}
50% {opacity:1}
100% {opacity:1}
}
@keyframes zoomIn {0% {opacity:0;transform:scale3d(.3,.3,.3)}
50% {opacity:1}
100% {opacity:1}
}

/* 匀速缩小(大到小) */
@-webkit-keyframes zoomOut {0% {opacity:0;-webkit-transform:scale3d(1.8,1.8,1.8)}
50% {opacity:1;-webkit-transform:scale3d(1,1,1)}
100% {opacity:1}
}
@-moz-keyframes zoomOut {0% {opacity:0;-moz-transform:scale3d(1.8,1.8,1.8)}
50% {opacity:1;-moz-transform:scale3d(1,1,1)}
100% {opacity:1}
}
@keyframes zoomOut {0% {opacity:0;transform:scale3d(1.8,1.8,1.8)}
50% {opacity:1;transform:scale3d(1,1,1)}
100% {opacity:1}
}

/* 放大显示(向下) */
@-webkit-keyframes zoomInDown {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInDown {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInDown {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}

/* 放大显示(向上) */
@-webkit-keyframes zoomInUp {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInUp {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInUp {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}

/* 放大显示(向右) */
@-webkit-keyframes zoomInLeft {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInLeft {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInLeft {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(10px,0,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}

/* 放大显示(向左) */
@-webkit-keyframes zoomInRight {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInRight {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInRight {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}


/**
 * 分类三：展开翻转效果
 */

/* 展开(向下) */
@-webkit-keyframes pullBottom {0% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(0.1)}
40% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(1.02)}
60% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(0.98)}
80% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(1.01)}
100% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(0.98)}
80% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(1.01)}
100% {-webkit-transform-origin:50% 0;-webkit-transform:scaleY(1)}
}
@-moz-keyframes pullBottom {0% {-moz-transform-origin:50% 0;-moz-transform:scaleY(0.1)}
40% {-moz-transform-origin:50% 0;-moz-transform:scaleY(1.02)}
60% {-moz-transform-origin:50% 0;-moz-transform:scaleY(0.98)}
80% {-moz-transform-origin:50% 0;-moz-transform:scaleY(1.01)}
100% {-moz-transform-origin:50% 0;-moz-transform:scaleY(0.98)}
80% {-moz-transform-origin:50% 0;-moz-transform:scaleY(1.01)}
100% {-moz-transform-origin:50% 0;-moz-transform:scaleY(1)}
}
@keyframes pullBottom {0% {transform-origin:50% 0;transform:scaleY(0.1)}
40% {transform-origin:50% 0;transform:scaleY(1.02)}
60% {transform-origin:50% 0;transform:scaleY(0.98)}
80% {transform-origin:50% 0;transform:scaleY(1.01)}
100% {transform-origin:50% 0;transform:scaleY(0.98)}
80% {transform-origin:50% 0;transform:scaleY(1.01)}
100% {transform-origin:50% 0;transform:scaleY(1)}
}

/* 展开(向上) */
@-webkit-keyframes pullTop {0% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(0.1)}
40% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(1.02)}
60% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(0.98)}
80% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(1.01)}
100% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(0.98)}
80% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(1.01)}
100% {-webkit-transform-origin:50% 100%;-webkit-transform:scaleY(1)}
}
@-moz-keyframes pullTop {0% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(0.1)}
40% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(1.02)}
60% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(0.98)}
80% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(1.01)}
100% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(0.98)}
80% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(1.01)}
100% {-moz-transform-origin:50% 100%;-moz-transform:scaleY(1)}
}
@keyframes pullTop {0% {transform-origin:50% 100%;transform:scaleY(0.1)}
40% {transform-origin:50% 100%;transform:scaleY(1.02)}
60% {transform-origin:50% 100%;transform:scaleY(0.98)}
80% {transform-origin:50% 100%;transform:scaleY(1.01)}
100% {transform-origin:50% 100%;transform:scaleY(0.98)}
80% {transform-origin:50% 100%;transform:scaleY(1.01)}
100% {transform-origin:50% 100%;transform:scaleY(1)}
}

/* 展开(向左) */
@-webkit-keyframes pullLeft {0% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(0.3)}
40% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(1.02)}
60% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(0.98)}
80% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(1.01)}
100% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(0.98)}
80% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(1.01)}
100% {-webkit-transform-origin:100% 50%;-webkit-transform:scaleX(1)}
}
@-moz-keyframes pullLeft {0% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(0.3)}
40% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(1.02)}
60% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(0.98)}
80% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(1.01)}
100% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(0.98)}
80% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(1.01)}
100% {-moz-transform-origin:100% 50%;-moz-transform:scaleX(1)}
}
@keyframes pullLeft {0% {transform-origin:100% 50%;transform:scaleX(0.3)}
40% {transform-origin:100% 50%;transform:scaleX(1.02)}
60% {transform-origin:100% 50%;transform:scaleX(0.98)}
80% {transform-origin:100% 50%;transform:scaleX(1.01)}
100% {transform-origin:100% 50%;transform:scaleX(0.98)}
80% {transform-origin:100% 50%;transform:scaleX(1.01)}
100% {transform-origin:100% 50%;transform:scaleX(1)}
}

/* 展开(向右) */
@-webkit-keyframes pullRight {0% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(0.3)}
40% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(1.02)}
60% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(0.98)}
80% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(1.01)}
100% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(0.98)}
80% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(1.01)}
100% {-webkit-transform-origin:0 50%;-webkit-transform:scaleX(1)}
}
@-moz-keyframes pullRight {0% {-moz-transform-origin:0 50%;-moz-transform:scaleX(0.3)}
40% {-moz-transform-origin:0 50%;-moz-transform:scaleX(1.02)}
60% {-moz-transform-origin:0 50%;-moz-transform:scaleX(0.98)}
80% {-moz-transform-origin:0 50%;-moz-transform:scaleX(1.01)}
100% {-moz-transform-origin:0 50%;-moz-transform:scaleX(0.98)}
80% {-moz-transform-origin:0 50%;-moz-transform:scaleX(1.01)}
100% {-moz-transform-origin:0 50%;-moz-transform:scaleX(1)}
}
@keyframes pullRight {0% {transform-origin:0 50%;transform:scaleX(0.3)}
40% {transform-origin:0 50%;transform:scaleX(1.02)}
60% {transform-origin:0 50%;transform:scaleX(0.98)}
80% {transform-origin:0 50%;transform:scaleX(1.01)}
100% {transform-origin:0 50%;transform:scaleX(0.98)}
80% {transform-origin:0 50%;transform:scaleX(1.01)}
100% {transform-origin:0 50%;transform:scaleX(1)}
}

/* 翻转(上下) */
@-webkit-keyframes flipInX {0% {-webkit-transform:perspective(400px) rotateX(90deg);-webkit-transition-timing-function:ease-in;opacity:0}
40% {-webkit-transform:perspective(400px) rotateX(-20deg);-webkit-transition-timing-function:ease-in}
60% {-webkit-transform:perspective(400px) rotateX(10deg);opacity:1}
80% {-webkit-transform:perspective(400px) rotateX(-5deg)}
100% {-webkit-transform:perspective(400px);opacity:1}
}
@-moz-keyframes flipInX {0% {-moz-transform:perspective(400px) rotateX(90deg);-moz-transition-timing-function:ease-in;opacity:0}
40% {-moz-transform:perspective(400px) rotateX(-20deg);-moz-transition-timing-function:ease-in}
60% {-moz-transform:perspective(400px) rotateX(10deg);opacity:1}
80% {-moz-transform:perspective(400px) rotateX(-5deg)}
100% {-moz-transform:perspective(400px);opacity:1}
}
@keyframes flipInX {0% {transform:perspective(400px) rotateX(90deg);transition-timing-function:ease-in;opacity:0}
40% {transform:perspective(400px) rotateX(-20deg);transition-timing-function:ease-in}
60% {transform:perspective(400px) rotateX(10deg);opacity:1}
80% {transform:perspective(400px) rotateX(-5deg)}
100% {transform:perspective(400px);opacity:1}
}

/* 翻转(右左) */
@-webkit-keyframes flipInY {0% {-webkit-transform:perspective(400px) rotateY(90deg);-webkit-transition-timing-function:ease-in;opacity:0}
40% {-webkit-transform:perspective(400px) rotateY(-20deg);-webkit-transition-timing-function:ease-in}
60% {-webkit-transform:perspective(400px) rotateY(10deg);opacity:1}
80% {-webkit-transform:perspective(400px) rotateY(-5deg)}
100% {-webkit-transform:perspective(400px);opacity:1}
}
@-moz-keyframes flipInY {0% {-moz-transform:perspective(400px) rotateY(90deg);-moz-transition-timing-function:ease-in;opacity:0}
40% {-moz-transform:perspective(400px) rotateY(-20deg);-moz-transition-timing-function:ease-in}
60% {-moz-transform:perspective(400px) rotateY(10deg);opacity:1}
80% {-moz-transform:perspective(400px) rotateY(-5deg)}
100% {-moz-transform:perspective(400px);opacity:1}
}
@keyframes flipInY {0% {transform:perspective(400px) rotateY(90deg);transition-timing-function:ease-in;opacity:0}
40% {transform:perspective(400px) rotateY(-20deg);transition-timing-function:ease-in}
60% {transform:perspective(400px) rotateY(10deg);opacity:1}
80% {transform:perspective(400px) rotateY(-5deg)}
100% {transform:perspective(400px);opacity:1}
}


/**
 * 分类四：旋转转圈效果
 */

/* 匀速转圈(中心点) */
@-webkit-keyframes rotateIn {0% {-webkit-transform-origin:center;-webkit-animation-timing-function:linear;-webkit-transform:rotateZ(0deg)}
100% {-webkit-transform-origin:center;-webkit-animation-timing-function:linear;-webkit-transform:rotateZ(360deg)}
}
@-moz-keyframes rotateIn {0% {-moz-transform-origin:center;-moz-animation-timing-function:linear;-moz-transform:rotateZ(0deg)}
100% {-moz-transform-origin:center;-moz-animation-timing-function:linear;-moz-transform:rotateZ(360deg)}
}
@keyframes rotateIn {0% {transform-origin:center;animation-timing-function:linear;transform:rotateZ(0deg)}
100% {transform-origin:center;animation-timing-function:linear;transform:rotateZ(360deg)}
}

/* 匀速转圈(垂直) */
@-webkit-keyframes flipInRing {0% {-webkit-transform:rotateY(0deg);-webkit-animation-timing-function:linear}
100% {-webkit-transform:rotateY(360deg);-webkit-animation-timing-function:linear}
}
@-moz-keyframes flipInRing {0% {-moz-transform:rotateY(0deg);-moz-animation-timing-function:linear}
100% {-moz-transform:rotateY(360deg);-moz-animation-timing-function:linear}
}
@keyframes flipInRing {0% {transform:rotateY(0deg);animation-timing-function:linear}
100% {transform:rotateY(360deg);animation-timing-function:linear}
}

/* 外蹦转圈(中心点) */
@-webkit-keyframes flip {0% {-webkit-transform:perspective(400px) rotateY(-360deg);-webkit-animation-timing-function:ease-out}
40% {-webkit-transform:perspective(400px) translate3d(0,0,150px) rotateY(-190deg);-webkit-animation-timing-function:ease-out}
50% {-webkit-transform:perspective(400px) translate3d(0,0,150px) rotateY(-170deg);-webkit-animation-timing-function:ease-in}
80% {-webkit-transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in}
100% {-webkit-transform:perspective(400px);-webkit-animation-timing-function:ease-in}
}
@-moz-keyframes flip {0% {-moz-transform:perspective(400px) rotateY(-360deg);-moz-animation-timing-function:ease-out}
40% {-moz-transform:perspective(400px) translate3d(0,0,150px) rotateY(-190deg);-moz-animation-timing-function:ease-out}
50% {-moz-transform:perspective(400px) translate3d(0,0,150px) rotateY(-170deg);-moz-animation-timing-function:ease-in}
80% {-moz-transform:perspective(400px) scale3d(.95,.95,.95);-moz-animation-timing-function:ease-in}
100% {-moz-transform:perspective(400px);-moz-animation-timing-function:ease-in}
}
@keyframes flip {0% {transform:perspective(400px) rotateY(-360deg);animation-timing-function:ease-out}
40% {transform:perspective(400px) translate3d(0,0,150px) rotateY(-190deg);animation-timing-function:ease-out}
50% {transform:perspective(400px) translate3d(0,0,150px) rotateY(-170deg);animation-timing-function:ease-in}
80% {transform:perspective(400px) scale3d(.95,.95,.95);animation-timing-function:ease-in}
100% {transform:perspective(400px);animation-timing-function:ease-in}
}

/* 转圈进入(从左) */
@-webkit-keyframes rollIn {0% {opacity:0;-webkit-transform:translate3d(-100%,0,0) rotateZ(-120deg)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes rollIn {0% {opacity:0;-moz-transform:translate3d(-100%,0,0) rotateZ(-120deg)}
100% {opacity:1;-moz-transform:none}
}
@keyframes rollIn {0% {opacity:0;-webkit-transform:translate3d(-100%,0,0) rotateZ(-120deg)}
100% {opacity:1;-webkit-transform:none}
}

/* 转圈进入(从右) */
@-webkit-keyframes rollInRight {0% {opacity:0;-webkit-transform:translate3d(100%,0,0) rotateZ(120deg)}
100% {opacity:1;-webkit-transform:none}
}
@-moz-keyframes rollInRight {0% {opacity:0;-moz-transform:translate3d(100%,0,0) rotateZ(120deg)}
100% {opacity:1;-moz-transform:none}
}
@keyframes rollInRight {0% {opacity:0;-webkit-transform:translate3d(100%,0,0) rotateZ(120deg)}
100% {opacity:1;-webkit-transform:none}
}

/* 顺旋转(向下) */
@-webkit-keyframes rotateInDownLeft {0% {-webkit-transform-origin:left bottom;-webkit-transform:rotateZ(-45deg);opacity:0}
100% {-webkit-transform-origin:left bottom;-webkit-transform:none;opacity:1}
}
@-moz-keyframes rotateInDownLeft {0% {-moz-transform-origin:left bottom;-moz-transform:rotateZ(-45deg);opacity:0}
100% {-moz-transform-origin:left bottom;-moz-transform:none;opacity:1}
}
@keyframes rotateInDownLeft {0% {transform-origin:left bottom;transform:rotateZ(-45deg);opacity:0}
100% {transform-origin:left bottom;transform:none;opacity:1}
}

/* 顺旋转(向上) */
@-webkit-keyframes rotateInUpRight {0% {-webkit-transform-origin:right bottom;-webkit-transform:rotateZ(-90deg);opacity:0}
100% {-webkit-transform-origin:right bottom;-webkit-transform:none;opacity:1}
}
@-moz-keyframes rotateInUpRight {0% {-moz-transform-origin:right bottom;-moz-transform:rotateZ(-90deg);opacity:0}
100% {-moz-transform-origin:right bottom;-moz-transform:none;opacity:1}
}
@keyframes rotateInUpRight {0% {transform-origin:right bottom;transform:rotateZ(-90deg);opacity:0}
100% {transform-origin:right bottom;transform:none;opacity:1}
}

/* 逆旋转(向下) */
@-webkit-keyframes rotateInDownRight {0% {-webkit-transform-origin:right bottom;-webkit-transform:rotateZ(45deg);opacity:0}
100% {-webkit-transform-origin:right bottom;-webkit-transform:none;opacity:1}
}
@-moz-keyframes rotateInDownRight {0% {-moz-transform-origin:right bottom;-moz-transform:rotateZ(45deg);opacity:0}
100% {-moz-transform-origin:right bottom;-moz-transform:none;opacity:1}
}
@keyframes rotateInDownRight {0% {transform-origin:right bottom;transform:rotateZ(45deg);opacity:0}
100% {transform-origin:right bottom;transform:none;opacity:1}
}

/* 逆旋转(向上) */
@-webkit-keyframes rotateInUpLeft {0% {-webkit-transform-origin:left bottom;-webkit-transform:rotateZ(45deg);opacity:0}
100% {-webkit-transform-origin:left bottom;-webkit-transform:none;opacity:1}
}
@-moz-keyframes rotateInUpLeft {0% {-moz-transform-origin:left bottom;-moz-transform:rotateZ(45deg);opacity:0}
100% {-moz-transform-origin:left bottom;-moz-transform:none;opacity:1}
}
@keyframes rotateInUpLeft {0% {transform-origin:left bottom;transform:rotateZ(45deg);opacity:0}
100% {transform-origin:left bottom;transform:none;opacity:1}
}

/**
 * 分类五：移动摇晃效果
 */

/* 移动(左右) */
@-webkit-keyframes moveLr {50% {-webkit-transform:translate3d(25px,0,0);-webkit-transition-timing-function:linear}
100% {-webkit-transform:translate3d(0,0,0);-webkit-transition-timing-function:linear}
}
@-moz-keyframes moveLr {50% {-moz-transform:translate3d(25px,0,0);-moz-transition-timing-function:linear}
100% {-moz-transform:translate3d(0,0,0);-moz-transition-timing-function:linear}
}
@keyframes moveLr {50% {transform:translate3d(25px,0,0);transition-timing-function:linear}
100% {transform:translate3d(0,0,0);transition-timing-function:linear}
}

/* 移动(上下) */
@-webkit-keyframes moveTb {50% {-webkit-transform:translate3d(5px,25px,0);-webkit-transition-timing-function:linear}
100% {-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:linear}
}
@-moz-keyframes moveTb {50% {-moz-transform:translate3d(5px,25px,0);-moz-transition-timing-function:linear}
100% {-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:linear}
}
@keyframes moveTb {50% {transform:translate3d(5px,25px,0);-webkit-transition-timing-function:linear}
100% {transform:translate3d(0px,0,0);-webkit-transition-timing-function:linear}
}

/* 摇晃(中心点) */
@-webkit-keyframes swing {0% {-webkit-transform:rotateZ(0deg)}
25% {-webkit-transform:rotateZ(-12deg)}
50% {-webkit-transform:rotateZ(8deg)}
75% {-webkit-transform:rotateZ(-12deg)}
100% {-webkit-transform:rotateZ(0deg)}
}
@-moz-keyframes swing {0% {-moz-transform:rotateZ(0deg)}
25% {-moz-transform:rotateZ(-12deg)}
50% {-moz-transform:rotateZ(8deg)}
75% {-moz-transform:rotateZ(-12deg)}
100% {-moz-transform:rotateZ(0deg)}
}
@keyframes swing {0% {transform:rotateZ(0deg)}
25% {transform:rotateZ(-12deg)}
50% {transform:rotateZ(8deg)}
75% {transform:rotateZ(-12deg)}
100% {transform:rotateZ(0deg)}
}

/* 摇晃(顶点) */
@-webkit-keyframes swingTop {0% {-webkit-transform-origin:50% 0;-webkit-transform:rotateZ(0deg)}
25% {-webkit-transform-origin:50% 0;-webkit-transform:rotateZ(-12deg)}
50% {-webkit-transform-origin:50% 0;-webkit-transform:rotateZ(8deg)}
75% {-webkit-transform-origin:50% 0;-webkit-transform:rotateZ(-12deg)}
100% {-webkit-transform-origin:50% 0;-webkit-transform:rotateZ(0deg)}
}
@-moz-keyframes swingTop {0% {-moz-transform-origin:50% 0;-moz-transform:rotateZ(0deg)}
25% {-moz-transform-origin:50% 0;-moz-transform:rotateZ(-12deg)}
50% {-moz-transform-origin:50% 0;-moz-transform:rotateZ(8deg)}
75% {-moz-transform-origin:50% 0;-moz-transform:rotateZ(-12deg)}
100% {-moz-transform-origin:50% 0;-moz-transform:rotateZ(0deg)}
}
@keyframes swingTop {0% {transform-origin:50% 0;transform:rotateZ(0deg)}
25% {transform-origin:50% 0;transform:rotateZ(-12deg)}
50% {transform-origin:50% 0;transform:rotateZ(8deg)}
75% {transform-origin:50% 0;transform:rotateZ(-12deg)}
100% {transform-origin:50% 0;transform:rotateZ(0deg)}
}

/* 摇晃(底部) */
@-webkit-keyframes swingBottom {0% {-webkit-transform-origin:50% 100%;-webkit-transform:rotateZ(0deg)}
25% {-webkit-transform-origin:50% 100%;-webkit-transform:rotateZ(-12deg)}
50% {-webkit-transform-origin:50% 100%;-webkit-transform:rotateZ(8deg)}
75% {-webkit-transform-origin:50% 100%;-webkit-transform:rotateZ(-12deg)}
100% {-webkit-transform-origin:50% 100%;-webkit-transform:rotateZ(0deg)}
}
@-moz-keyframes swingBottom {0% {-moz-transform-origin:50% 100%;-moz-transform:rotateZ(0deg)}
25% {-moz-transform-origin:50% 100%;-moz-transform:rotateZ(-12deg)}
50% {-moz-transform-origin:50% 100%;-moz-transform:rotateZ(8deg)}
75% {-moz-transform-origin:50% 100%;-moz-transform:rotateZ(-12deg)}
100% {-moz-transform-origin:50% 100%;-moz-transform:rotateZ(0deg)}
}
@keyframes swingBottom {0% {transform-origin:50% 100%;transform:rotateZ(0deg)}
25% {transform-origin:50% 100%;transform:rotateZ(-12deg)}
50% {transform-origin:50% 100%;transform:rotateZ(8deg)}
75% {transform-origin:50% 100%;transform:rotateZ(-12deg)}
100% {transform-origin:50% 100%;transform:rotateZ(0deg)}
}

/* 摇晃(左点) */
@-webkit-keyframes swingLeft {0% {-webkit-transform-origin:0 50%;-webkit-transform:rotateZ(0deg)}
25% {-webkit-transform-origin:0 50%;-webkit-transform:rotateZ(-12deg)}
50% {-webkit-transform-origin:0 50%;-webkit-transform:rotateZ(8deg)}
75% {-webkit-transform-origin:0 50%;-webkit-transform:rotateZ(-12deg)}
100% {-webkit-transform-origin:0 50%;-webkit-transform:rotateZ(0deg)}
}
@-moz-keyframes swingLeft {0% {-moz-transform-origin:0 50%;-moz-transform:rotateZ(0deg)}
25% {-moz-transform-origin:0 50%;-moz-transform:rotateZ(-12deg)}
50% {-moz-transform-origin:0 50%;-moz-transform:rotateZ(8deg)}
75% {-moz-transform-origin:0 50%;-moz-transform:rotateZ(-12deg)}
100% {-moz-transform-origin:0 50%;-moz-transform:rotateZ(0deg)}
}
@keyframes swingLeft {0% {transform-origin:0 50%;transform:rotateZ(0deg)}
25% {transform-origin:0 50%;transform:rotateZ(-12deg)}
50% {transform-origin:0 50%;transform:rotateZ(8deg)}
75% {transform-origin:0 50%;transform:rotateZ(-12deg)}
100% {transform-origin:0 50%;transform:rotateZ(0deg)}
}

/* 摇晃(右点) */
@-webkit-keyframes swingRight {0% {-webkit-transform-origin:100% 50%;-webkit-transform:rotateZ(0deg)}
25% {-webkit-transform-origin:100% 50%;-webkit-transform:rotateZ(-12deg)}
50% {-webkit-transform-origin:100% 50%;-webkit-transform:rotateZ(8deg)}
75% {-webkit-transform-origin:100% 50%;-webkit-transform:rotateZ(-12deg)}
100% {-webkit-transform-origin:100% 50%;-webkit-transform:rotateZ(0deg)}
}
@-moz-keyframes swingRight {0% {-moz-transform-origin:100% 50%;-moz-transform:rotateZ(0deg)}
25% {-moz-transform-origin:100% 50%;-moz-transform:rotateZ(-12deg)}
50% {-moz-transform-origin:100% 50%;-moz-transform:rotateZ(8deg)}
75% {-moz-transform-origin:100% 50%;-moz-transform:rotateZ(-12deg)}
100% {-moz-transform-origin:100% 50%;-moz-transform:rotateZ(0deg)}
}
@keyframes swingRight {0% {transform-origin:100% 50%;transform:rotateZ(0deg)}
25% {transform-origin:100% 50%;transform:rotateZ(-12deg)}
50% {transform-origin:100% 50%;transform:rotateZ(8deg)}
75% {transform-origin:100% 50%;transform:rotateZ(-12deg)}
100% {transform-origin:100% 50%;transform:rotateZ(0deg)}
}

/* 扭摆(底点) */
@-webkit-keyframes jelloBottom {11.1% {-webkit-transform:none;-webkit-transform-origin:bottom}
22.2% {-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);-webkit-transform-origin:bottom}
33.3% {-webkit-transform:skewX(6.25deg) skewY(6.25deg);-webkit-transform-origin:bottom}
44.4% {-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);-webkit-transform-origin:bottom}
55.5% {-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);-webkit-transform-origin:bottom}
66.6% {-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);-webkit-transform-origin:bottom}
77.7% {-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);-webkit-transform-origin:bottom}
88.8% {-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);-webkit-transform-origin:bottom}
100% {-webkit-transform:none;-webkit-transform-origin:bottom}
}
@-moz-keyframes jelloBottom {11.1% {-moz-transform:none;-moz-transform-origin:bottom}
22.2% {-moz-transform:skewX(-12.5deg) skewY(-12.5deg);-moz-transform-origin:bottom}
33.3% {-moz-transform:skewX(6.25deg) skewY(6.25deg);-moz-transform-origin:bottom}
44.4% {-moz-transform:skewX(-3.125deg) skewY(-3.125deg);-moz-transform-origin:bottom}
55.5% {-moz-transform:skewX(1.5625deg) skewY(1.5625deg);-moz-transform-origin:bottom}
66.6% {-moz-transform:skewX(-.78125deg) skewY(-.78125deg);-moz-transform-origin:bottom}
77.7% {-moz-transform:skewX(0.390625deg) skewY(0.390625deg);-moz-transform-origin:bottom}
88.8% {-moz-transform:skewX(-.1953125deg) skewY(-.1953125deg);-moz-transform-origin:bottom}
100% {-moz-transform:none;-moz-transform-origin:bottom}
}
@keyframes jelloBottom {11.1% {transform:none;transform-origin:bottom}
22.2% {transform:skewX(-12.5deg) skewY(-12.5deg);transform-origin:bottom}
33.3% {transform:skewX(6.25deg) skewY(6.25deg);transform-origin:bottom}
44.4% {transform:skewX(-3.125deg) skewY(-3.125deg);transform-origin:bottom}
55.5% {transform:skewX(1.5625deg) skewY(1.5625deg);transform-origin:bottom}
66.6% {transform:skewX(-.78125deg) skewY(-.78125deg);transform-origin:bottom}
77.7% {transform:skewX(0.390625deg) skewY(0.390625deg);transform-origin:bottom}
88.8% {transform:skewX(-.1953125deg) skewY(-.1953125deg);transform-origin:bottom}
100% {transform:none;transform-origin:bottom}
}

/* 扭摆(右点) */
@-webkit-keyframes jelloRight {11.1% {-webkit-transform:none;-webkit-transform-origin:right}
22.2% {-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);-webkit-transform-origin:right}
33.3% {-webkit-transform:skewX(6.25deg) skewY(6.25deg);-webkit-transform-origin:right}
44.4% {-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);-webkit-transform-origin:right}
55.5% {-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);-webkit-transform-origin:right}
66.6% {-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);-webkit-transform-origin:right}
77.7% {-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);-webkit-transform-origin:right}
88.8% {-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);-webkit-transform-origin:right}
100% {-webkit-transform:none;-webkit-transform-origin:right}
}
@-moz-keyframes jelloRight {11.1% {-moz-transform:none;-moz-transform-origin:right}
22.2% {-moz-transform:skewX(-12.5deg) skewY(-12.5deg);-moz-transform-origin:right}
33.3% {-moz-transform:skewX(6.25deg) skewY(6.25deg);-moz-transform-origin:right}
44.4% {-moz-transform:skewX(-3.125deg) skewY(-3.125deg);-moz-transform-origin:right}
55.5% {-moz-transform:skewX(1.5625deg) skewY(1.5625deg);-moz-transform-origin:right}
66.6% {-moz-transform:skewX(-.78125deg) skewY(-.78125deg);-moz-transform-origin:right}
77.7% {-moz-transform:skewX(0.390625deg) skewY(0.390625deg);-moz-transform-origin:right}
88.8% {-moz-transform:skewX(-.1953125deg) skewY(-.1953125deg);-moz-transform-origin:right}
100% {-moz-transform:none;-moz-transform-origin:right}
}
@keyframes jelloRight {11.1% {transform:none;transform-origin:right}
22.2% {transform:skewX(-12.5deg) skewY(-12.5deg);transform-origin:right}
33.3% {transform:skewX(6.25deg) skewY(6.25deg);transform-origin:right}
44.4% {transform:skewX(-3.125deg) skewY(-3.125deg);transform-origin:right}
55.5% {transform:skewX(1.5625deg) skewY(1.5625deg);transform-origin:right}
66.6% {transform:skewX(-.78125deg) skewY(-.78125deg);transform-origin:right}
77.7% {transform:skewX(0.390625deg) skewY(0.390625deg);transform-origin:right}
88.8% {transform:skewX(-.1953125deg) skewY(-.1953125deg);transform-origin:right}
100% {transform:none;transform-origin:right}
}

/* 扭摆(扭摆) */
@-webkit-keyframes jelloTop {11.1% {-webkit-transform:none;-webkit-transform-origin:top}
22.2% {-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);-webkit-transform-origin:top}
33.3% {-webkit-transform:skewX(6.25deg) skewY(6.25deg);-webkit-transform-origin:top}
44.4% {-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);-webkit-transform-origin:top}
55.5% {-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);-webkit-transform-origin:top}
66.6% {-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);-webkit-transform-origin:top}
77.7% {-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);-webkit-transform-origin:top}
88.8% {-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);-webkit-transform-origin:top}
100% {-webkit-transform:none;-webkit-transform-origin:top}
}
@-moz-keyframes jelloTop {11.1% {-moz-transform:none;-moz-transform-origin:top}
22.2% {-moz-transform:skewX(-12.5deg) skewY(-12.5deg);-moz-transform-origin:top}
33.3% {-moz-transform:skewX(6.25deg) skewY(6.25deg);-moz-transform-origin:top}
44.4% {-moz-transform:skewX(-3.125deg) skewY(-3.125deg);-moz-transform-origin:top}
55.5% {-moz-transform:skewX(1.5625deg) skewY(1.5625deg);-moz-transform-origin:top}
66.6% {-moz-transform:skewX(-.78125deg) skewY(-.78125deg);-moz-transform-origin:top}
77.7% {-moz-transform:skewX(0.390625deg) skewY(0.390625deg);-moz-transform-origin:top}
88.8% {-moz-transform:skewX(-.1953125deg) skewY(-.1953125deg);-moz-transform-origin:top}
100% {-moz-transform:none;-moz-transform-origin:top}
}
@keyframes jelloTop {11.1% {transform:none;transform-origin:top}
22.2% {transform:skewX(-12.5deg) skewY(-12.5deg);transform-origin:top}
33.3% {transform:skewX(6.25deg) skewY(6.25deg);transform-origin:top}
44.4% {transform:skewX(-3.125deg) skewY(-3.125deg);transform-origin:top}
55.5% {transform:skewX(1.5625deg) skewY(1.5625deg);transform-origin:top}
66.6% {transform:skewX(-.78125deg) skewY(-.78125deg);transform-origin:top}
77.7% {transform:skewX(0.390625deg) skewY(0.390625deg);transform-origin:top}
88.8% {transform:skewX(-.1953125deg) skewY(-.1953125deg);transform-origin:top}
100% {transform:none;transform-origin:top}
}

/* 扭摆(左点) */
@-webkit-keyframes jelloLeft {11.1% {-webkit-transform:none;-webkit-transform-origin:left}
22.2% {-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);-webkit-transform-origin:left}
33.3% {-webkit-transform:skewX(6.25deg) skewY(6.25deg);-webkit-transform-origin:left}
44.4% {-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);-webkit-transform-origin:left}
55.5% {-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);-webkit-transform-origin:left}
66.6% {-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);-webkit-transform-origin:left}
77.7% {-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);-webkit-transform-origin:left}
88.8% {-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);-webkit-transform-origin:left}
100% {-webkit-transform:none;-webkit-transform-origin:left}
}
@-moz-keyframes jelloLeft {11.1% {-moz-transform:none;-moz-transform-origin:left}
22.2% {-moz-transform:skewX(-12.5deg) skewY(-12.5deg);-moz-transform-origin:left}
33.3% {-moz-transform:skewX(6.25deg) skewY(6.25deg);-moz-transform-origin:left}
44.4% {-moz-transform:skewX(-3.125deg) skewY(-3.125deg);-moz-transform-origin:left}
55.5% {-moz-transform:skewX(1.5625deg) skewY(1.5625deg);-moz-transform-origin:left}
66.6% {-moz-transform:skewX(-.78125deg) skewY(-.78125deg);-moz-transform-origin:left}
77.7% {-moz-transform:skewX(0.390625deg) skewY(0.390625deg);-moz-transform-origin:left}
88.8% {-moz-transform:skewX(-.1953125deg) skewY(-.1953125deg);-moz-transform-origin:left}
100% {-moz-transform:none;-moz-transform-origin:left}
}
@keyframes jelloLeft {11.1% {transform:none;transform-origin:left}
22.2% {transform:skewX(-12.5deg) skewY(-12.5deg);transform-origin:left}
33.3% {transform:skewX(6.25deg) skewY(6.25deg);transform-origin:left}
44.4% {transform:skewX(-3.125deg) skewY(-3.125deg);transform-origin:left}
55.5% {transform:skewX(1.5625deg) skewY(1.5625deg);transform-origin:left}
66.6% {transform:skewX(-.78125deg) skewY(-.78125deg);transform-origin:left}
77.7% {transform:skewX(0.390625deg) skewY(0.390625deg);transform-origin:left}
88.8% {transform:skewX(-.1953125deg) skewY(-.1953125deg);transform-origin:left}
100% {transform:none;transform-origin:left}
}

/* 扭摆(中心点) */
@-webkit-keyframes jelloCenter {11.1% {-webkit-transform:none;-webkit-transform-origin:center}
22.2% {-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);-webkit-transform-origin:center}
33.3% {-webkit-transform:skewX(6.25deg) skewY(6.25deg);-webkit-transform-origin:center}
44.4% {-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);-webkit-transform-origin:center}
55.5% {-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);-webkit-transform-origin:center}
66.6% {-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);-webkit-transform-origin:center}
77.7% {-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);-webkit-transform-origin:center}
88.8% {-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);-webkit-transform-origin:center}
100% {-webkit-transform:none;-webkit-transform-origin:center}
}
@-moz-keyframes jelloCenter {11.1% {-moz-transform:none;-moz-transform-origin:center}
22.2% {-moz-transform:skewX(-12.5deg) skewY(-12.5deg);-moz-transform-origin:center}
33.3% {-moz-transform:skewX(6.25deg) skewY(6.25deg);-moz-transform-origin:center}
44.4% {-moz-transform:skewX(-3.125deg) skewY(-3.125deg);-moz-transform-origin:center}
55.5% {-moz-transform:skewX(1.5625deg) skewY(1.5625deg);-moz-transform-origin:center}
66.6% {-moz-transform:skewX(-.78125deg) skewY(-.78125deg);-moz-transform-origin:center}
77.7% {-moz-transform:skewX(0.390625deg) skewY(0.390625deg);-moz-transform-origin:center}
88.8% {-moz-transform:skewX(-.1953125deg) skewY(-.1953125deg);-moz-transform-origin:center}
100% {-moz-transform:none;-moz-transform-origin:center}
}
@keyframes jelloCenter {11.1% {transform:none;transform-origin:center}
22.2% {transform:skewX(-12.5deg) skewY(-12.5deg);transform-origin:center}
33.3% {transform:skewX(6.25deg) skewY(6.25deg);transform-origin:center}
44.4% {transform:skewX(-3.125deg) skewY(-3.125deg);transform-origin:center}
55.5% {transform:skewX(1.5625deg) skewY(1.5625deg);transform-origin:center}
66.6% {transform:skewX(-.78125deg) skewY(-.78125deg);transform-origin:center}
77.7% {transform:skewX(0.390625deg) skewY(0.390625deg);transform-origin:center}
88.8% {transform:skewX(-.1953125deg) skewY(-.1953125deg);transform-origin:center}
100% {transform:none;transform-origin:center}
}

/* 摇摆(左右) */
@-webkit-keyframes shake {0%,100% {-webkit-transform:translate3d(0,0,0)}
10%,30%,50%,70%,90% {-webkit-transform:translate3d(-10px,0,0)}
20%,40%,60%,80% {-webkit-transform:translate3d(10px,0,0)}
}
@-moz-keyframes shake {0%,100% {-moz-transform:translate3d(0,0,0)}
10%,30%,50%,70%,90% {-moz-transform:translate3d(-10px,0,0)}
20%,40%,60%,80% {-moz-transform:translate3d(10px,0,0)}
}
@keyframes shake {0%,100% {transform:translate3d(0,0,0)}
10%,30%,50%,70%,90% {transform:translate3d(-10px,0,0)}
20%,40%,60%,80% {transform:translate3d(10px,0,0)}
}

/* 抖动(里往外) */
@-webkit-keyframes tada {0% {-webkit-transform:scale3d(1,1,1)}
10%,20% {-webkit-transform:scale3d(.9,.9,.9) rotateZ(-3deg)}
30%,50%,70%,90% {-webkit-transform:scale3d(1.1,1.1,1.1) rotateZ(3deg)}
40%,60%,80% {-webkit-transform:scale3d(1.1,1.1,1.1) rotateZ(-3deg)}
100% {-webkit-transform:scale3d(1,1,1)}
}
@-moz-keyframes tada {0% {-moz-transform:scale3d(1,1,1)}
10%,20% {-moz-transform:scale3d(.9,.9,.9) rotateZ(-3deg)}
30%,50%,70%,90% {-moz-transform:scale3d(1.1,1.1,1.1) rotateZ(3deg)}
40%,60%,80% {-moz-transform:scale3d(1.1,1.1,1.1) rotateZ(-3deg)}
100% {-moz-transform:scale3d(1,1,1)}
}
@keyframes tada {0% {transform:scale3d(1,1,1)}
10%,20% {transform:scale3d(.9,.9,.9) rotateZ(-3deg)}
30%,50%,70%,90% {transform:scale3d(1.1,1.1,1.1) rotateZ(3deg)}
40%,60%,80% {transform:scale3d(1.1,1.1,1.1) rotateZ(-3deg)}
100% {transform:scale3d(1,1,1)}
}

/* 拉伸(左右) */
@-webkit-keyframes rubberBand {0% {-webkit-transform:scale3d(1,1,1)}
30% {-webkit-transform:scale3d(1.25,.75,1)}
40% {-webkit-transform:scale3d(0.75,1.25,1)}
50% {-webkit-transform:scale3d(1.15,.85,1)}
65% {-webkit-transform:scale3d(.95,1.05,1)}
75% {-webkit-transform:scale3d(1.05,.95,1)}
100% {-webkit-transform:scale3d(1,1,1)}
}
@-moz-keyframes rubberBand {0% {-moz-transform:scale3d(1,1,1)}
30% {-moz-transform:scale3d(1.25,.75,1)}
40% {-moz-transform:scale3d(0.75,1.25,1)}
50% {-moz-transform:scale3d(1.15,.85,1)}
65% {-moz-transform:scale3d(.95,1.05,1)}
75% {-moz-transform:scale3d(1.05,.95,1)}
100% {-moz-transform:scale3d(1,1,1)}
}
@keyframes rubberBand {0% {transform:scale3d(1,1,1)}
30% {transform:scale3d(1.25,.75,1)}
40% {transform:scale3d(0.75,1.25,1)}
50% {transform:scale3d(1.15,.85,1)}
65% {transform:scale3d(.95,1.05,1)}
75% {transform:scale3d(1.05,.95,1)}
100% {transform:scale3d(1,1,1)}
}

/* 反弹(上下) */
@-webkit-keyframes bounce {0%,20%,53%,80%,100% {-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0)}
40%,43% {-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0)}
70% {-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0)}
90% {-webkit-transform:translate3d(0,-4px,0)}
}
@-moz-keyframes bounce {0%,20%,53%,80%,100% {-moz-transition-timing-function:cubic-bezier(0.215,.61,.355,1);-moz-transform:translate3d(0,0,0)}
40%,43% {-moz-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-moz-transform:translate3d(0,-30px,0)}
70% {-moz-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-moz-transform:translate3d(0,-15px,0)}
90% {-moz-transform:translate3d(0,-4px,0)}
}
@keyframes bounce {0%,20%,53%,80%,100% {transition-timing-function:cubic-bezier(0.215,.61,.355,1);transform:translate3d(0,0,0)}
40%,43% {transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transform:translate3d(0,-30px,0)}
70% {transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transform:translate3d(0,-15px,0)}
90% {transform:translate3d(0,-4px,0)}
}

/**
 * 分类六：消失效果
 */

/* 渐渐消失(向里) */
@-webkit-keyframes fadeOut {0% {opacity:1}
100% {opacity:0}
}
@-moz-keyframes fadeOut {0% {opacity:1}
100% {opacity:0}
}
@keyframes fadeOut {0% {opacity:1}
100% {opacity:0}
}

/* 渐渐消失(向上) */
@-webkit-keyframes fadeOutUp {0% {opacity:1}
100% {opacity:0;-webkit-transform:translate3d(0,-100%,0)}
}
@-moz-keyframes fadeOutUp {0% {opacity:1}
100% {opacity:0;-moz-transform:translate3d(0,-100%,0)}
}
@keyframes fadeOutUp {0% {opacity:1}
100% {opacity:0;transform:translate3d(0,-100%,0)}
}

/* 渐渐消失(向下) */
@-webkit-keyframes fadeOutDown {0% {opacity:1}
100% {opacity:0;-webkit-transform:translate3d(0,100%,0)}
}
@-moz-keyframes fadeOutDown {0% {opacity:1}
100% {opacity:0;-moz-transform:translate3d(0,100%,0)}
}
@keyframes fadeOutDown {0% {opacity:1}
100% {opacity:0;transform:translate3d(0,100%,0)}
}

/* 渐渐消失(向左) */
@-webkit-keyframes fadeOutLeft {0% {opacity:1}
100% {opacity:0;-webkit-transform:translate3d(-100%,0,0)}
}
@-moz-keyframes fadeOutLeft {0% {opacity:1}
100% {opacity:0;-moz-transform:translate3d(-100%,0,0)}
}
@keyframes fadeOutLeft {0% {opacity:1}
100% {opacity:0;transform:translate3d(-100%,0,0)}
}

/* 渐渐消失(向右) */
@-webkit-keyframes fadeOutRight {0% {opacity:1}
100% {opacity:0;-webkit-transform:translate3d(100%,0,0)}
}
@-moz-keyframes fadeOutRight {0% {opacity:1}
100% {opacity:0;-moz-transform:translate3d(100%,0,0)}
}
@keyframes fadeOutRight {0% {opacity:1}
100% {opacity:0;transform:translate3d(100%,0,0)}
}

/* 掉落(向左) */
@-webkit-keyframes hingeLeft {0% {-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}
20%,60% {-webkit-transform:rotateZ(80deg);-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}
40%,80% {-webkit-transform:rotateZ(60deg);-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out;opacity:1}
100% {-webkit-transform:translate3d(0,700px,0);opacity:0}
}
@-moz-keyframes hingeLeft {0% {-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}
20%,60% {-moz-transform:rotateZ(80deg);-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}
40%,80% {-moz-transform:rotateZ(60deg);-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out;opacity:1}
100% {-moz-transform:translate3d(0,700px,0);opacity:0}
}
@keyframes hingeLeft {0% {transform-origin:top left;animation-timing-function:ease-in-out}
20%,60% {transform:rotateZ(80deg);transform-origin:top left;animation-timing-function:ease-in-out}
40%,80% {transform:rotateZ(60deg);transform-origin:top left;animation-timing-function:ease-in-out;opacity:1}
100% {transform:translate3d(0,700px,0);opacity:0}
}

/* 掉落(向右) */
@-webkit-keyframes hingeRight {0% {-webkit-transform-origin:top right;-webkit-animation-timing-function:ease-in-out}
20%,60% {-webkit-transform:rotateZ(-80deg);-webkit-transform-origin:top right;-webkit-animation-timing-function:ease-in-out}
40%,80% {-webkit-transform:rotateZ(-60deg);-webkit-transform-origin:top right;-webkit-animation-timing-function:ease-in-out;opacity:1}
100% {-webkit-transform:translate3d(0,700px,0);opacity:0}
}
@-moz-keyframes hingeRight {0% {-moz-transform-origin:top right;-moz-animation-timing-function:ease-in-out}
20%,60% {-moz-transform:rotateZ(-80deg);-moz-transform-origin:top right;-moz-animation-timing-function:ease-in-out}
40%,80% {-moz-transform:rotateZ(-60deg);-moz-transform-origin:top right;-moz-animation-timing-function:ease-in-out;opacity:1}
100% {-moz-transform:translate3d(0,700px,0);opacity:0}
}
@keyframes hingeRight {0% {transform-origin:top right;animation-timing-function:ease-in-out}
20%,60% {transform:rotateZ(-80deg);transform-origin:top right;animation-timing-function:ease-in-out}
40%,80% {transform:rotateZ(-60deg);transform-origin:top right;animation-timing-function:ease-in-out;opacity:1}
100% {transform:translate3d(0,700px,0);opacity:0}
}