move.css
zoomIn zoomInDown
outer-circlearrowTopexpandOpen
fadeIn fadeInNormal fadeInUp fadeInRight fadeInDown fadeInLeft
moveDown 上往下进入 moveUp 由下往上进入 moveLeft 由右往左进入 moveRight由左往 右进入
rotateIn 旋转进入 rotateInDownLeft 左下角切入 rotateInDownRight 右下角切入 reverseRotataZ
flipInY 弹性 flipInX
lightSpeedIn 由右向左进入，
slideDown 由上向下进入 slideUp slideLeft slideRight
pullUp 由中间上下折叠展开 pullDown
stretchLeft 中间向两边展开 stretchRight
@keyframes outer-circle {
0% { transform: scale(1) }50% {
transform: scale(.8) }100%{
transform: scale(1) }}@-webkit-keyframes outer-circle {
0% { -webkit-transform: scale(1) }50% {
-webkit-transform: scale(.8) }100% {
-webkit-transform: scale(1) }}@keyframes arrowTop{ 0%{-webkit-transform: translate(0,42px); opacity: 0;} 60%{-webkit-transform: translate(0,12px); opacity: 1;} 100%{-webkit-transform: translate(0,0); opacity: 0;}}@-webkit-keyframes arrowTop{ 0%{-webkit-transform: translate(0,42px); opacity: 0;} 60%{-webkit-transform: translate(0,12px); opacity: 1;} 100%{-webkit-transform: translate(0,0); opacity: 0;}}
.animated { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000;}@-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); transform: scale3d(0.3, 0.3, 0.3) translateZ(0); } 50% { opacity: 1; }}@-moz-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); -moz-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); transform: scale3d(0.3, 0.3, 0.3) translateZ(0); } 50% { opacity: 1; }}@-o-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); transform: scale3d(0.3, 0.3, 0.3) translateZ(0); } 50% { opacity: 1; }}@keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); -moz-transform: scale3d(0.3, 0.3, 0.3) translateZ(0); transform: scale3d(0.3, 0.3, 0.3) translateZ(0); } 50% { opacity: 1; }}.animated.zoomIn { -webkit-animation-name: zoomIn; -moz-animation-name: zoomIn; -o-animation-name: zoomIn; animation-name: zoomIn;}@-webkit-keyframes zoomInDownfeiji { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(300px, -500px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.55, 0.675, 1); } 60% { opacity: 1; } 100% { -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); }}@-moz-keyframes zoomInDownfeiji { 0% { opacity: 0; -moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(300px, -500px, 0); -moz-animation-timing-function: cubic-bezier(0.55, 0.55, 0.675, 1); } 60% { opacity: 1; } 100% { -moz-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); }}@-o-keyframes zoomInDownfeiji { 0% { opacity: 0; -o-transform: scale3d(0.1, 0.1, 0.1) translate3d(300px, -500px, 0); -o-animation-timing-function: cubic-bezier(0.55, 0.55, 0.675, 1); } 60% { opacity: 1; } 100% { -o-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); }}@keyframes zoomInDownfeiji { 0% { opacity: 0; transform: scale3d(0.1, 0.1, 0.1) translate3d(300px, -500px, 0); animation-timing-function: cubic-bezier(0.55, 0.55, 0.675, 1); } 60% { opacity: 1; } 100% { transform: scale3d(1, 1, 1) translate3d(0, 0, 0); }}@-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); }}@-moz-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); }}@-o-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); }}@keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); }}.animated.zoomInDown { -webkit-animation-name: zoomInDown; -moz-animation-name: zoomInDown; -o-animation-name: zoomInDown; animation-name: zoomInDown;}@-moz-keyframes expandOpen { 0% { opacity: 0; -moz-transform: scale(1.8) translateZ(0); transform: scale(1.8) translateZ(0); } 50% { opacity: 1; -moz-transform: scale(0.95) translateZ(0); transform: scale(0.95) translateZ(0); } 80% { -moz-transform: scale(1.05) translateZ(0); transform: scale(1.05) translateZ(0); } 90% { -moz-transform: scale(0.98) translateZ(0); transform: scale(0.98) translateZ(0); } 100% { -moz-transform: scale(1) translateZ(0); transform: scale(1) translateZ(0); }}@-o-keyframes expandOpen { 0% { opacity: 0; transform: scale(1.8) translateZ(0); } 50% { opacity: 1; transform: scale(0.95) translateZ(0); } 80% { transform: scale(1.05) translateZ(0); } 90% { transform: scale(0.98) translateZ(0); } 100% { transform: scale(1) translateZ(0); }}@keyframes expandOpen { 0% { opacity: 0; -webkit-transform: scale(1.8) translateZ(0); -moz-transform: scale(1.8) translateZ(0); transform: scale(1.8) translateZ(0); } 50% { opacity: 1; -webkit-transform: scale(0.95) translateZ(0); -moz-transform: scale(0.95) translateZ(0); transform: scale(0.95) translateZ(0); } 80% { -webkit-transform: scale(1.05) translateZ(0); -moz-transform: scale(1.05) translateZ(0); transform: scale(1.05) translateZ(0); } 90% { -webkit-transform: scale(0.98) translateZ(0); -moz-transform: scale(0.98) translateZ(0); transform: scale(0.98) translateZ(0); } 100% { -webkit-transform: scale(1) translateZ(0); -moz-transform: scale(1) translateZ(0); transform: scale(1) translateZ(0); }}@-webkit-keyframes expandOpen { 0% { opacity: 0; -webkit-transform: scale(1.8) translateZ(0); } 50% { opacity: 1; -webkit-transform: scale(0.95) translateZ(0); } 80% { -webkit-transform: scale(1.05) translateZ(0); } 90% { -webkit-transform: scale(0.98) translateZ(0); } 100% { -webkit-transform: scale(1) translateZ(0); }}.animated.expandOpen { -moz-animation-name: expandOpen; -o-animation-name: expandOpen; animation-name: expandOpen; -webkit-animation-name: expandOpen; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out;}@-moz-keyframes fadeInNormal { 0% { opacity: 0; } 100% { opacity: 1; }}@-o-keyframes fadeInNormal { 0% { opacity: 0; } 100% { opacity: 1; }}@keyframes fadeInNormal { 0% { opacity: 0; } 100% { opacity: 1; }}@-webkit-keyframes fadeInNormal { 0% { opacity: 0; } 100% { opacity: 1; }}/*==============================================fadeIn==============================================*/.animated.fadeIn { -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-name: fadeIn; -moz-animation-duration: 1.5s; -o-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; -moz-animation-timing-function: ease-in-out; -o-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out;}@-moz-keyframes fadeIn { 0% { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; } 60% { -moz-transform: scale(1.1) translateZ(0); transform: scale(1.1) translateZ(0); opacity: 1; } 80% { -moz-transform: scale(0.9) translateZ(0); transform: scale(0.9) translateZ(0); opacity: 1; } 100% { -moz-transform: scale(1) translateZ(0); transform: scale(1) translateZ(0); opacity: 1; }}@-o-keyframes fadeIn { 0% { transform: scale(0) translateZ(0); opacity: 0; } 60% { transform: scale(1.1) translateZ(0); opacity: 1; } 80% { transform: scale(0.9) translateZ(0); opacity: 1; } 100% { transform: scale(1) translateZ(0); opacity: 1; }}@keyframes fadeIn { 0% { -webkit-transform: scale(0) translateZ(0); -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; } 60% { -webkit-transform: scale(1.1) translateZ(0); -moz-transform: scale(1.1) translateZ(0); transform: scale(1.1) translateZ(0); opacity: 1; } 80% { -webkit-transform: scale(0.9) translateZ(0); -moz-transform: scale(0.9) translateZ(0); transform: scale(0.9) translateZ(0); opacity: 1; } 100% { -webkit-transform: scale(1) translateZ(0); -moz-transform: scale(1) translateZ(0); transform: scale(1) translateZ(0); opacity: 1; }}@-webkit-keyframes fadeIn { 0% { -webkit-transform: scale(0) translateZ(0); opacity: 0; } 60% { -webkit-transform: scale(1.1) translateZ(0); opacity: 1; } 80% { -webkit-transform: scale(0.9) translateZ(0); opacity: 1; } 100% { -webkit-transform: scale(1) translateZ(0); opacity: 1; }}@-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-moz-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-o-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}.animated.fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp;}@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-moz-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-o-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}.animated.fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight;}@-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-moz-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-o-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}.animated.fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft;}@-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-moz-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); -moz-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@-o-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}@keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); -moz-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}.animated.fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown;}/*==============================================moveDown==============================================*/.animated.moveDown { -moz-animation-name: moveDown; -o-animation-name: moveDown; animation-name: moveDown; -webkit-animation-name: moveDown; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease; -o-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-timing-function: ease;}@-moz-keyframes moveDown { 0% { opacity: 0; -moz-transform: translateY(-100%); transform: translateY(-100%); } 100% { opacity: 1; -moz-transform: translateY(0%); transform: translateY(0%); }}@-o-keyframes moveDown { 0% { opacity: 0; -o-transform: translateY(-100%); transform: translateY(-100%); } 100% { opacity: 1; -o-transform: translateY(0%); transform: translateY(0%); }}@keyframes moveDown { 0% { opacity: 0; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); } 100% { opacity: 1; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); }}@-webkit-keyframes moveDown { 0% { opacity: 0; -webkit-transform: translateY(-100%); } 100% { opacity: 1; -webkit-transform: translateY(0%); }}/*==============================================moveUp==============================================*/@-moz-keyframes moveUp { 0% { opacity: 0; -moz-transform: translateY(100%); transform: translateY(100%); } 100% { opacity: 1; -moz-transform: translateY(0%); transform: translateY(0%); }}@-o-keyframes moveUp { 0% { opacity: 0; -o-transform: translateY(100%); transform: translateY(100%); } 100% { opacity: 1; -o-transform: translateY(0%); transform: translateY(0%); }}@keyframes moveUp { 0% { opacity: 0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); } 100% { opacity: 1; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); }}@-webkit-keyframes moveUp { 0% { opacity: 0; -webkit-transform: translateY(100%); } 100% { opacity: 1; -webkit-transform: translateY(0%); }}/*==============================================moveLeft==============================================*/.animated.moveLeft { -moz-animation-name: moveLeft; -o-animation-name: moveLeft; animation-name: moveLeft; -webkit-animation-name: moveLeft; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease-in-out; -o-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out;}@-moz-keyframes moveLeft { 0% { opacity: 0; -moz-transform: translateX(150%); transform: translateX(150%); } 100% { opacity: 1; -moz-transform: translateX(0%); transform: translateX(0%); }}@-o-keyframes moveLeft { 0% { opacity: 0; -o-transform: translateX(150%); transform: translateX(150%); } 100% { opacity: 1; -o-transform: translateX(0%); transform: translateX(0%); }}@keyframes moveLeft { 0% { opacity: 0; -webkit-transform: translateX(150%); -moz-transform: translateX(150%); -o-transform: translateX(150%); transform: translateX(150%); } 100% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); }}@-webkit-keyframes moveLeft { 0% { opacity: 0; -webkit-transform: translateX(150%); } 100% { opacity: 1; -webkit-transform: translateX(0%); }}/*==============================================moveRight==============================================*/.animated.moveRight { -moz-animation-name: moveRight; -o-animation-name: moveRight; animation-name: moveRight; -webkit-animation-name: moveRight; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease-in-out; -o-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out;}@-moz-keyframes moveRight { 0% { opacity: 0; -moz-transform: translateX(-150%); transform: translateX(-150%); } 100% { opacity: 1; -moz-transform: translateX(0%); transform: translateX(0%); }}@-o-keyframes moveRight { 0% { opacity: 0; -o-transform: translateX(-150%); transform: translateX(-150%); } 100% { opacity: 1; -o-transform: translateX(0%); transform: translateX(0%); }}@keyframes moveRight { 0% { opacity: 0; -webkit-transform: translateX(-150%); -moz-transform: translateX(-150%); -o-transform: translateX(-150%); transform: translateX(-150%); } 100% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); }}@-webkit-keyframes moveRight { 0% { opacity: 0; -webkit-transform: translateX(-150%); } 100% { opacity: 1; -webkit-transform: translateX(0%); }}@-webkit-keyframes rotateIn { from { opacity: 0; -webkit-transform: rotate(-220deg); } to { opacity: 1; -webkit-transform: rotate(0deg); }}@-moz-keyframes rotateIn { from { opacity: 0; -moz-transform: rotate(-220deg); } to { opacity: 1; -moz-transform: rotate(0deg); }}@-o-keyframes rotateIn { from { opacity: 0; -o-transform: rotate(-220deg); } to { opacity: 1; -o-transform: rotate(0deg); }}@keyframes rotateIn { from { opacity: 0; -webkit-transform: rotate(-220deg); -moz-transform: rotate(-220deg); -o-transform: rotate(-220deg); transform: rotate(-220deg); } to { opacity: 1; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }}.animated.rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear;}@-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg) translateZ(0); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0) translateZ(0); opacity: 1; }}@-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg) translateZ(0); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0) translateZ(0); opacity: 1; }}@-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg) translateZ(0); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0) translateZ(0); opacity: 1; }}@keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -moz-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg) translateZ(0); -moz-transform: rotate(-90deg) translateZ(0); transform: rotate(-90deg) translateZ(0); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -moz-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0) translateZ(0); -moz-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); opacity: 1; }}.animated.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft;}@-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg) translateZ(0); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0) translateZ(0); opacity: 1; }}@-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg) translateZ(0); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0) translateZ(0); opacity: 1; }}@-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg) translateZ(0); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0) translateZ(0); opacity: 1; }}@keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg) translateZ(0); -moz-transform: rotate(90deg) translateZ(0); transform: rotate(90deg) translateZ(0); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0) translateZ(0); -moz-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); opacity: 1; }}.animated.rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight;}@-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg) translateZ(0); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg) translateZ(0); } 70% { -webkit-transform: perspective(400px) rotateY(10deg) translateZ(0); } 100% { -webkit-transform: perspective(400px) rotateY(0deg) translateZ(0); opacity: 1; }}@-moz-keyframes flipInY { 0% { -moz-transform: perspective(400px) rotateY(90deg) translateZ(0); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateY(-10deg) translateZ(0); } 70% { -moz-transform: perspective(400px) rotateY(10deg) translateZ(0); } 100% { -moz-transform: perspective(400px) rotateY(0deg) translateZ(0); opacity: 1; }}@-o-keyframes flipInY { 0% { -o-transform: perspective(400px) rotateY(90deg) translateZ(0); opacity: 0; } 40% { -o-transform: perspective(400px) rotateY(-10deg) translateZ(0); } 70% { -o-transform: perspective(400px) rotateY(10deg) translateZ(0); } 100% { -o-transform: perspective(400px) rotateY(0deg) translateZ(0); opacity: 1; }}@keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg) translateZ(0); -moz-transform: perspective(400px) rotateY(90deg) translateZ(0); transform: perspective(400px) rotateY(90deg) translateZ(0); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg) translateZ(0); -moz-transform: perspective(400px) rotateY(-10deg) translateZ(0); transform: perspective(400px) rotateY(-10deg) translateZ(0); } 70% { -webkit-transform: perspective(400px) rotateY(10deg) translateZ(0); -moz-transform: perspective(400px) rotateY(10deg) translateZ(0); transform: perspective(400px) rotateY(10deg) translateZ(0); } 100% { -webkit-transform: perspective(400px) rotateY(0deg) translateZ(0); -moz-transform: perspective(400px) rotateY(0deg) translateZ(0); transform: perspective(400px) rotateY(0deg) translateZ(0); opacity: 1; }}.animated.flipInY { -o-backface-visibility: visible !important; -webkit-backface-visibility: visible !important; -moz-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-animation-name: flipInY; -o-animation-name: flipInY; animation-name: flipInY;}@-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; }}@-moz-keyframes flipInX { 0% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateX(-10deg); } 70% { -moz-transform: perspective(400px) rotateX(10deg); } 100% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; }}@-o-keyframes flipInX { 0% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateX(-10deg); } 70% { -o-transform: perspective(400px) rotateX(10deg); } 100% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1; }}@keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -moz-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -moz-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -moz-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -moz-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; }}.animated.flipInX { -o-backface-visibility: visible !important; -webkit-backface-visibility: visible !important; -moz-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-animation-name: flipInX; -o-animation-name: flipInX; animation-name: flipInX;}@-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }}@-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }}@-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }}@keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -moz-transform: translateX(100%) skewX(-30deg); -o-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -moz-transform: translateX(-20%) skewX(30deg); -o-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -moz-transform: translateX(0%) skewX(-15deg); -o-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -moz-transform: translateX(0%) skewX(0deg); -o-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; }}.animated.lightSpeedIn { -webkit-animation-name: lightSpeedIn; -moz-animation-name: lightSpeedIn; -o-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out;}.animated.lightSpeedIn { -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; -o-animation-duration: 0.5s; animation-duration: 0.5s;}/*==============================================slideDown==============================================*//*.animated.slideDown{ animation-name: slideDown; -webkit-animation-name: slideDown; animation-duration: 1s; -webkit-animation-duration: 1s; animation-timing-function: ease; -webkit-animation-timing-function: ease;}*/@-moz-keyframes slideDown { 0% { opacity: 0; -moz-transform: translateY(-100%) translateZ(0); transform: translateY(-100%) translateZ(0); } 50% { opacity: 1; -moz-transform: translateY(8%); transform: translateY(8%); } 65% { -moz-transform: translateY(-4%); transform: translateY(-4%); } 80% { -moz-transform: translateY(4%); transform: translateY(4%); } 95% { -moz-transform: translateY(-2%); transform: translateY(-2%); } 100% { -moz-transform: translateY(0%); transform: translateY(0%); }}@-o-keyframes slideDown { 0% { opacity: 0; transform: translateY(-100%) translateZ(0); } 50% { opacity: 1; -o-transform: translateY(8%); transform: translateY(8%); } 65% { -o-transform: translateY(-4%); transform: translateY(-4%); } 80% { -o-transform: translateY(4%); transform: translateY(4%); } 95% { -o-transform: translateY(-2%); transform: translateY(-2%); } 100% { -o-transform: translateY(0%); transform: translateY(0%); }}@keyframes slideDown { 0% { opacity: 0; -webkit-transform: translateY(-100%) translateZ(0); -moz-transform: translateY(-100%) translateZ(0); transform: translateY(-100%) translateZ(0); } 50% { opacity: 1; -webkit-transform: translateY(8%); -moz-transform: translateY(8%); -o-transform: translateY(8%); transform: translateY(8%); } 65% { -webkit-transform: translateY(-4%); -moz-transform: translateY(-4%); -o-transform: translateY(-4%); transform: translateY(-4%); } 80% { -webkit-transform: translateY(4%); -moz-transform: translateY(4%); -o-transform: translateY(4%); transform: translateY(4%); } 95% { -webkit-transform: translateY(-2%); -moz-transform: translateY(-2%); -o-transform: translateY(-2%); transform: translateY(-2%); } 100% { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); }}@-webkit-keyframes slideDown { 0% { opacity: 0; -webkit-transform: translateY(-100%); } 50% { opacity: 1; -webkit-transform: translateY(8%); } 65% { -webkit-transform: translateY(-4%); } 80% { -webkit-transform: translateY(4%); } 95% { -webkit-transform: translateY(-2%); } 100% { -webkit-transform: translateY(0%); }}/*==============================================slideUp==============================================*/.animated.slideUp { -moz-animation-name: slideUp; -o-animation-name: slideUp; animation-name: slideUp; -webkit-animation-name: slideUp; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease; -o-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-timing-function: ease;}@-moz-keyframes slideUp { 0% { opacity: 0; -moz-transform: translateY(100%); transform: translateY(100%); } 50% { opacity: 1; -moz-transform: translateY(-8%); transform: translateY(-8%); } 65% { -moz-transform: translateY(4%); transform: translateY(4%); } 80% { -moz-transform: translateY(-4%); transform: translateY(-4%); } 95% { -moz-transform: translateY(2%); transform: translateY(2%); } 100% { -moz-transform: translateY(0%); transform: translateY(0%); }}@-o-keyframes slideUp { 0% { opacity: 0; -o-transform: translateY(100%); transform: translateY(100%); } 50% { opacity: 1; -o-transform: translateY(-8%); transform: translateY(-8%); } 65% { -o-transform: translateY(4%); transform: translateY(4%); } 80% { -o-transform: translateY(-4%); transform: translateY(-4%); } 95% { -o-transform: translateY(2%); transform: translateY(2%); } 100% { -o-transform: translateY(0%); transform: translateY(0%); }}@keyframes slideUp { 0% { opacity: 0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); } 50% { opacity: 1; -webkit-transform: translateY(-8%); -moz-transform: translateY(-8%); -o-transform: translateY(-8%); transform: translateY(-8%); } 65% { -webkit-transform: translateY(4%); -moz-transform: translateY(4%); -o-transform: translateY(4%); transform: translateY(4%); } 80% { -webkit-transform: translateY(-4%); -moz-transform: translateY(-4%); -o-transform: translateY(-4%); transform: translateY(-4%); } 95% { -webkit-transform: translateY(2%); -moz-transform: translateY(2%); -o-transform: translateY(2%); transform: translateY(2%); } 100% { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); }}@-webkit-keyframes slideUp { 0% { opacity: 0; -webkit-transform: translateY(100%); } 50% { opacity: 1; -webkit-transform: translateY(-8%); } 65% { -webkit-transform: translateY(4%); } 80% { -webkit-transform: translateY(-4%); } 95% { -webkit-transform: translateY(2%); } 100% { -webkit-transform: translateY(0%); }}/*==============================================slideLeft==============================================*/.animated.slideLeft { -moz-animation-name: slideLeft; -o-animation-name: slideLeft; animation-name: slideLeft; -webkit-animation-name: slideLeft; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease-in-out; -o-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out;}@-moz-keyframes slideLeft { 0% { opacity: 0; -moz-transform: translateX(150%); transform: translateX(150%); } 50% { opacity: 1; -moz-transform: translateX(-8%); transform: translateX(-8%); } 65% { -moz-transform: translateX(4%); transform: translateX(4%); } 80% { -moz-transform: translateX(-4%); transform: translateX(-4%); } 95% { -moz-transform: translateX(2%); transform: translateX(2%); } 100% { -moz-transform: translateX(0%); transform: translateX(0%); }}@-o-keyframes slideLeft { 0% { opacity: 0; -o-transform: translateX(150%); transform: translateX(150%); } 50% { opacity: 1; -o-transform: translateX(-8%); transform: translateX(-8%); } 65% { -o-transform: translateX(4%); transform: translateX(4%); } 80% { -o-transform: translateX(-4%); transform: translateX(-4%); } 95% { -o-transform: translateX(2%); transform: translateX(2%); } 100% { -o-transform: translateX(0%); transform: translateX(0%); }}@keyframes slideLeft { 0% { opacity: 0; -webkit-transform: translateX(150%); -moz-transform: translateX(150%); -o-transform: translateX(150%); transform: translateX(150%); } 50% { opacity: 1; -webkit-transform: translateX(-8%); -moz-transform: translateX(-8%); -o-transform: translateX(-8%); transform: translateX(-8%); } 65% { -webkit-transform: translateX(4%); -moz-transform: translateX(4%); -o-transform: translateX(4%); transform: translateX(4%); } 80% { -webkit-transform: translateX(-4%); -moz-transform: translateX(-4%); -o-transform: translateX(-4%); transform: translateX(-4%); } 95% { -webkit-transform: translateX(2%); -moz-transform: translateX(2%); -o-transform: translateX(2%); transform: translateX(2%); } 100% { -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); }}@-webkit-keyframes slideLeft { 0% { opacity: 0; -webkit-transform: translateX(150%); } 50% { opacity: 1; -webkit-transform: translateX(-8%); } 65% { -webkit-transform: translateX(4%); } 80% { -webkit-transform: translateX(-4%); } 95% { -webkit-transform: translateX(2%); } 100% { -webkit-transform: translateX(0%); }}/*==============================================slideRight==============================================*/.animated.slideRight { -moz-animation-name: slideRight; -o-animation-name: slideRight; animation-name: slideRight; -webkit-animation-name: slideRight; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: 1s; -moz-animation-timing-function: ease-in-out; -o-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; visibility: visible !important;}@-moz-keyframes slideRight { 0% { opacity: 0; -moz-transform: translateX(-150%); transform: translateX(-150%); } 50% { opacity: 1; -moz-transform: translateX(8%); transform: translateX(8%); } 65% { -moz-transform: translateX(-4%); transform: translateX(-4%); } 80% { -moz-transform: translateX(4%); transform: translateX(4%); } 95% { -moz-transform: translateX(-2%); transform: translateX(-2%); } 100% { -moz-transform: translateX(0%); transform: translateX(0%); }}@-o-keyframes slideRight { 0% { opacity: 0; -o-transform: translateX(-150%); transform: translateX(-150%); } 50% { opacity: 1; -o-transform: translateX(8%); transform: translateX(8%); } 65% { -o-transform: translateX(-4%); transform: translateX(-4%); } 80% { -o-transform: translateX(4%); transform: translateX(4%); } 95% { -o-transform: translateX(-2%); transform: translateX(-2%); } 100% { -o-transform: translateX(0%); transform: translateX(0%); }}@keyframes slideRight { 0% { opacity: 0; -webkit-transform: translateX(-150%); -moz-transform: translateX(-150%); -o-transform: translateX(-150%); transform: translateX(-150%); } 50% { opacity: 1; -webkit-transform: translateX(8%); -moz-transform: translateX(8%); -o-transform: translateX(8%); transform: translateX(8%); } 65% { -webkit-transform: translateX(-4%); -moz-transform: translateX(-4%); -o-transform: translateX(-4%); transform: translateX(-4%); } 80% { -webkit-transform: translateX(4%); -moz-transform: translateX(4%); -o-transform: translateX(4%); transform: translateX(4%); } 95% { -webkit-transform: translateX(-2%); -moz-transform: translateX(-2%); -o-transform: translateX(-2%); transform: translateX(-2%); } 100% { -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); }}@-webkit-keyframes slideRight { 0% { opacity: 0; -webkit-transform: translateX(-150%); } 50% { opacity: 1; -webkit-transform: translateX(8%); } 65% { -webkit-transform: translateX(-4%); } 80% { -webkit-transform: translateX(4%); } 95% { -webkit-transform: translateX(-2%); } 100% { -webkit-transform: translateX(0%); }}/*==============================================pullUp==============================================*/.animated.pullUp { -moz-animation-name: pullUp; -o-animation-name: pullUp; animation-name: pullUp; -webkit-animation-name: pullUp; -moz-animation-duration: 1.1s; -o-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-duration: 1.1s; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; -moz-transform-origin: 50% 100%; -o-transform-origin: 50% 100%; transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; -webkit-transform-origin: 50% 100%;}@-moz-keyframes pullUp { 0% { opacity: 0; -moz-transform: scaleY(0.1) translateZ(0); transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -moz-transform: scaleY(1.02); transform: scaleY(1.02); } 60% { -moz-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -moz-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -moz-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -moz-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -moz-transform: scaleY(1); transform: scaleY(1); }}@-o-keyframes pullUp { 0% { opacity: 0; transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -o-transform: scaleY(1.02); transform: scaleY(1.02); } 60% { -o-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -o-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -o-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -o-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -o-transform: scaleY(1); transform: scaleY(1); }}@keyframes pullUp { 0% { opacity: 0; -webkit-transform: scaleY(0.1) translateZ(0); -moz-transform: scaleY(0.1) translateZ(0); transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -webkit-transform: scaleY(1.02); -moz-transform: scaleY(1.02); -o-transform: scaleY(1.02); transform: scaleY(1.02); } 60% { -webkit-transform: scaleY(0.98); -moz-transform: scaleY(0.98); -o-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); -moz-transform: scaleY(1.01); -o-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(0.98); -moz-transform: scaleY(0.98); -o-transform: scaleY(0.98); transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); -moz-transform: scaleY(1.01); -o-transform: scaleY(1.01); transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); }}@-webkit-keyframes pullUp { 0% { opacity: 0; -webkit-transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -webkit-transform: scaleY(1.02); } 60% { -webkit-transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(0.98); } 80% { -webkit-transform: scaleY(1.01); } 100% { -webkit-transform: scaleY(1); }}/*==============================================pullDown==============================================*/.animated.pullDown { -moz-animation-name: pullDown; -o-animation-name: pullDown; animation-name: pullDown; -webkit-animation-name: pullDown; -moz-animation-duration: 1.1s; -o-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-duration: 1.1s; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; -moz-transform-origin: 50% 0%; -o-transform-origin: 50% 0%; transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; -webkit-transform-origin: 50% 0%;}@-moz-keyframes pullDown { 0% { opacity: 0; -moz-transform: scaleY(0.1) translateZ(0); transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -moz-transform: scaleY(1.02) translateZ(0); transform: scaleY(1.02) translateZ(0); } 60% { -moz-transform: scaleY(0.98) translateZ(0); transform: scaleY(0.98) translateZ(0); } 80% { -moz-transform: scaleY(1.01) translateZ(0); transform: scaleY(1.01) translateZ(0); } 100% { -moz-transform: scaleY(0.98) translateZ(0); transform: scaleY(0.98) translateZ(0); } 80% { -moz-transform: scaleY(1.01) translateZ(0); transform: scaleY(1.01) translateZ(0); } 100% { -moz-transform: scaleY(1) translateZ(0); transform: scaleY(1) translateZ(0); }}@-o-keyframes pullDown { 0% { opacity: 0; transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; transform: scaleY(1.02) translateZ(0); } 60% { transform: scaleY(0.98) translateZ(0); } 80% { transform: scaleY(1.01) translateZ(0); } 100% { transform: scaleY(0.98) translateZ(0); } 80% { transform: scaleY(1.01) translateZ(0); } 100% { transform: scaleY(1) translateZ(0); }}@keyframes pullDown { 0% { opacity: 0; -webkit-transform: scaleY(0.1) translateZ(0); -moz-transform: scaleY(0.1) translateZ(0); transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -webkit-transform: scaleY(1.02) translateZ(0); -moz-transform: scaleY(1.02) translateZ(0); transform: scaleY(1.02) translateZ(0); } 60% { -webkit-transform: scaleY(0.98) translateZ(0); -moz-transform: scaleY(0.98) translateZ(0); transform: scaleY(0.98) translateZ(0); } 80% { -webkit-transform: scaleY(1.01) translateZ(0); -moz-transform: scaleY(1.01) translateZ(0); transform: scaleY(1.01) translateZ(0); } 100% { -webkit-transform: scaleY(0.98) translateZ(0); -moz-transform: scaleY(0.98) translateZ(0); transform: scaleY(0.98) translateZ(0); } 80% { -webkit-transform: scaleY(1.01) translateZ(0); -moz-transform: scaleY(1.01) translateZ(0); transform: scaleY(1.01) translateZ(0); } 100% { -webkit-transform: scaleY(1) translateZ(0); -moz-transform: scaleY(1) translateZ(0); transform: scaleY(1) translateZ(0); }}@-webkit-keyframes pullDown { 0% { opacity: 0; -webkit-transform: scaleY(0.1) translateZ(0); } 40% { opacity: 1; -webkit-transform: scaleY(1.02) translateZ(0); } 60% { -webkit-transform: scaleY(0.98) translateZ(0); } 80% { -webkit-transform: scaleY(1.01) translateZ(0); } 100% { -webkit-transform: scaleY(0.98) translateZ(0); } 80% { -webkit-transform: scaleY(1.01) translateZ(0); } 100% { -webkit-transform: scaleY(1) translateZ(0); }}/*==============================================stretchLeft==============================================*/.animated.stretchLeft { -moz-animation-name: stretchLeft; -o-animation-name: stretchLeft; animation-name: stretchLeft; -webkit-animation-name: stretchLeft; -moz-animation-duration: 1.5s; -o-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; -moz-transform-origin: 100% 0%; -o-transform-origin: 100% 0%; transform-origin: 100% 0%; -ms-transform-origin: 100% 0%; -webkit-transform-origin: 100% 0%;}@-moz-keyframes stretchLeft { 0% { opacity: 0; -moz-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -moz-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -moz-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -moz-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -moz-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -moz-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -moz-transform: scaleX(1); transform: scaleX(1); }}@-o-keyframes stretchLeft { 0% { opacity: 0; -o-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -o-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -o-transform: scaleX(1); transform: scaleX(1); }}@keyframes stretchLeft { 0% { opacity: 0; -webkit-transform: scaleX(0.3); -moz-transform: scaleX(0.3); -o-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -webkit-transform: scaleX(1.02); -moz-transform: scaleX(1.02); -o-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); -moz-transform: scaleX(0.98); -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); -moz-transform: scaleX(1.01); -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); -moz-transform: scaleX(0.98); -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); -moz-transform: scaleX(1.01); -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); }}@-webkit-keyframes stretchLeft { 0% { opacity: 0; -webkit-transform: scaleX(0.3); } 40% { opacity: 1; -webkit-transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); }}/*==============================================stretchRight==============================================*/.animated.stretchRight { -moz-animation-name: stretchRight; -o-animation-name: stretchRight; animation-name: stretchRight; -webkit-animation-name: stretchRight; -moz-animation-duration: 1.5s; -o-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out; -moz-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%;}@-moz-keyframes stretchRight { 0% { opacity: 0; -moz-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -moz-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -moz-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -moz-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -moz-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -moz-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -moz-transform: scaleX(1); transform: scaleX(1); }}@-o-keyframes stretchRight { 0% { opacity: 0; -o-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -o-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -o-transform: scaleX(1); transform: scaleX(1); }}@keyframes stretchRight { 0% { opacity: 0; -webkit-transform: scaleX(0.3); -moz-transform: scaleX(0.3); -o-transform: scaleX(0.3); transform: scaleX(0.3); } 40% { opacity: 1; -webkit-transform: scaleX(1.02); -moz-transform: scaleX(1.02); -o-transform: scaleX(1.02); transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); -moz-transform: scaleX(0.98); -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); -moz-transform: scaleX(1.01); -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); -moz-transform: scaleX(0.98); -o-transform: scaleX(0.98); transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); -moz-transform: scaleX(1.01); -o-transform: scaleX(1.01); transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); }}@-webkit-keyframes stretchRight { 0% { opacity: 0; -webkit-transform: scaleX(0.3); } 40% { opacity: 1; -webkit-transform: scaleX(1.02); } 60% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(0.98); } 80% { -webkit-transform: scaleX(1.01); } 100% { -webkit-transform: scaleX(1); }}@keyframes reverseRotataZ{ 0%{-webkit-transform:rotateZ(0deg)}100%{-webkit-transform:rotateZ(-360deg)}}@-webkit-keyframes reverseRotataZ{ 0%{-webkit-transform:rotateZ(0deg)}100%{-webkit-transform:rotateZ(-360deg)}}@-moz-keyframes reverseRotataZ{ 0%{-moz-transform:rotateZ(0deg)}100%{-moz-transform:rotateZ(-360deg)}}@-ms-keyframes reverseRotataZ{ 0%{-ms-transform:rotateZ(0deg)}100%{-ms-transform:rotateZ(-360deg)}}