Animation Wow

 CSS

@charset "UTF-8";.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,20%,50%,80%,100%{-webkit-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}@keyframes bounce{0%,20%,50%,80%,100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce}@-webkit-keyframes flash{0%,50%,100%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,100%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rubberBand{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);-ms-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);-ms-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);-ms-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);-ms-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}@keyframes tada{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);-ms-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);-ms-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);-ms-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes wobble{0%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);-ms-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);-ms-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);-ms-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);-ms-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);-ms-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);-ms-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);-ms-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);-ms-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes bounceOut{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes bounceOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes bounceOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes bounceOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}}@keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}}@keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}}@keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}}@keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);-ms-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);-ms-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);-ms-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);-ms-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);-ms-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);-ms-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}@keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);-ms-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);-ms-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes slideOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes slideOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes slideOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}@-webkit-keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes slideOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes hinge{0%{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);transform:translateY(700px);opacity:0}}@keyframes hinge{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);-ms-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);-ms-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);-ms-transform:translateY(700px);transform:translateY(700px);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}@keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);-ms-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);-ms-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;transform-origin:center bottom}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);-ms-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);-ms-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;-ms-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;transform-origin:center top}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;-ms-transform-origin:center top;transform-origin:center top}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}



JS

(function(){function e(t,e){return function(){return t.apply(e,arguments)}}var l,c=[].slice;function t(t){null==t&&(t={}),this.scrollCallback=e(this.scrollCallback,this),this.scrollHandler=e(this.scrollHandler,this),this.start=e(this.start,this),this.config=l(t,this.defaults),this.scrolled=!0}l=function(){for(var t,e,i,n=arguments[0],o=2<=arguments.length?c.call(arguments,1):[],s=n||{},a=0,r=o.length;a<r;a++)for(t in i=o[a]||{})e=i[t],"object"==typeof s[t]?s[t]=l(s[t],e):s[t]||(s[t]=e);return s},this.WOW=(t.prototype.defaults={boxClass:"wow",animateClass:"animated",offset:0},t.prototype.init=function(){var t;return"interactive"===(t=document.readyState)||"complete"===t?this.start():document.addEventListener("DOMContentLoaded",this.start)},t.prototype.start=function(){var t,e,i,n;if(this.element=window.document.documentElement,this.boxes=this.element.getElementsByClassName(this.config.boxClass),this.boxes.length){for(e=0,i=(n=this.boxes).length;e<i;e++)t=n[e],this.applyStyle(t,!0);return window.addEventListener("scroll",this.scrollHandler,!1),window.addEventListener("resize",this.scrollHandler,!1),this.interval=setInterval(this.scrollCallback,50)}},t.prototype.stop=function(){return window.removeEventListener("scroll",this.scrollHandler,!1),window.removeEventListener("resize",this.scrollHandler,!1),null!=this.interval?clearInterval(this.interval):void 0},t.prototype.show=function(t){return this.applyStyle(t),t.className=t.className+" "+this.config.animateClass},t.prototype.applyStyle=function(t,e){var i=t.getAttribute("data-wow-duration"),n=t.getAttribute("data-wow-delay"),o=t.getAttribute("data-wow-iteration");return t.setAttribute("style",this.customStyle(e,i,n,o))},t.prototype.customStyle=function(t,e,i,n){var o=t?"visibility: hidden; -webkit-animation-name: none; -moz-animation-name: none; animation-name: none;":"visibility: visible;";return e&&(o+="-webkit-animation-duration: "+e+"; -moz-animation-duration: "+e+"; animation-duration: "+e+";"),i&&(o+="-webkit-animation-delay: "+i+"; -moz-animation-delay: "+i+"; animation-delay: "+i+";"),n&&(o+="-webkit-animation-iteration-count: "+n+"; -moz-animation-iteration-count: "+n+"; animation-iteration-count: "+n+";"),o},t.prototype.scrollHandler=function(){return this.scrolled=!0},t.prototype.scrollCallback=function(){var o;return this.scrolled&&(this.scrolled=!1,this.boxes=function(){for(var t=this.boxes,e=[],i=0,n=t.length;i<n;i++)(o=t[i])&&(this.isVisible(o)?this.show(o):e.push(o));return e}.call(this),!this.boxes.length)?this.stop():void 0},t.prototype.offsetTop=function(t){for(var e=t.offsetTop;t=t.offsetParent;)e+=t.offsetTop;return e},t.prototype.isVisible=function(t){var e=t.getAttribute("data-wow-offset")||this.config.offset,i=window.pageYOffset,n=i+this.element.clientHeight-e,o=this.offsetTop(t),s=o+t.clientHeight;return o<=n&&i<=s},t)}).call(this),(new WOW).init();






HTML Editing

<main class="wowBack clearfix"> <section class="wowWrap"> <h4>Wow.js & Animate.css</h4> <div class="wow bounce">bounce</div> <div class="wow flash">flash</div> <div class="wow pulse">pulse</div> <div class="wow rubberBand">rubberBand</div> <div class="wow shake">shake</div> <div class="wow swing">swing</div> <div class="wow tada">tada</div> <div class="wow wobble">wobble</div> <div class="wow bounceIn">bounceIn</div> <div class="wow bounceInDown">bounceInDown</div> <div class="wow bounceInLeft">bounceInLeft</div> <div class="wow bounceInRight">bounceInRight</div> <div class="wow bounceInUp">bounceInUp</div> <div class="wow bounceOut">bounceOut</div> <div class="wow bounceOutDown">bounceOutDown</div> <div class="wow bounceOutLeft">bounceOutLeft</div> <div class="wow bounceOutRight">bounceOutRight</div> <div class="wow bounceOutUp">bounceOutUp</div> <div class="wow fadeIn">fadeIn</div> <div class="wow fadeInDown">fadeInDown</div> <div class="wow fadeInDownBig">fadeInDownBig</div> <div class="wow fadeInLeft">fadeInLeft</div> <div class="wow fadeInLeftBig">fadeInLeftBig</div> <div class="wow fadeInRight">fadeInRight</div> <div class="wow fadeInRightBig">fadeInRightBig</div> <div class="wow fadeInUp">fadeInUp</div> <div class="wow fadeInUpBig">fadeInUpBig</div> <div class="wow fadeOut">fadeOut</div> <div class="wow fadeOutDown">fadeOutDown</div> <div class="wow fadeOutDownBig">fadeOutDownBig</div> <div class="wow fadeOutLeft">fadeOutLeft</div> <div class="wow fadeOutLeftBig">fadeOutLeftBig</div> <div class="wow fadeOutRight">fadeOutRight</div> <div class="wow fadeOutRightBig">fadeOutRightBig</div> <div class="wow fadeOutUp">fadeOutUp</div> <div class="wow fadeOutUpBig">fadeOutUpBig</div> <div class="wow flip">flip</div> <div class="wow flipInX">flipInX</div> <div class="wow flipInY">flipInY</div> <div class="wow flipOutX">flipOutX</div> <div class="wow flipOutY">flipOutY</div> <div class="wow lightSpeedIn">lightSpeedIn</div> <div class="wow lightSpeedOut">lightSpeedOut</div> <div class="wow rotateIn">rotateIn</div> <div class="wow rotateInDownLeft">rotateInDownLeft</div> <div class="wow rotateInDownRight">rotateInDownRight</div> <div class="wow rotateInUpLeft">rotateInUpLeft</div> <div class="wow rotateInUpRight">rotateInUpRight</div> <div class="wow rotateOut">rotateOut</div> <div class="wow rotateOutDownLeft">rotateOutDownLeft</div> <div class="wow rotateOutDownRight">rotateOutDownRight</div> <div class="wow rotateOutUpLeft">rotateOutUpLeft</div> <div class="wow rotateOutUpRight">rotateOutUpRight</div> <div class="wow hinge">hinge</div> <div class="wow rollIn">rollIn</div> <div class="wow rollOut">rollOut</div> <div class="wow zoomIn">zoomIn</div> <div class="wow zoomInDown">zoomInDown</div> <div class="wow zoomInLeft">zoomInLeft</div> <div class="wow zoomInRight">zoomInRight</div> <div class="wow zoomInUp">zoomInUp</div> <div class="wow zoomOut">zoomOut</div> <div class="wow zoomOutDown">zoomOutDown</div> <div class="wow zoomOutLeft">zoomOutLeft</div> <div class="wow zoomOutRight">zoomOutRight</div> <div class="wow zoomOutUp">zoomOutUp</div> </section><!-- --><section class="wowWrap"> <h4>data-wow-delay=".25s"</h4> <div data-wow-delay=".25s" class="wow bounce">bounce</div> <div data-wow-delay=".25s" class="wow flash">flash</div> <div data-wow-delay=".25s" class="wow pulse">pulse</div> <div data-wow-delay=".25s" class="wow rubberBand">rubberBand</div> <div data-wow-delay=".25s" class="wow shake">shake</div> <div data-wow-delay=".25s" class="wow swing">swing</div> <div data-wow-delay=".25s" class="wow tada">tada</div> <div data-wow-delay=".25s" class="wow wobble">wobble</div> <div data-wow-delay=".25s" class="wow flip">flip</div> <div data-wow-delay=".25s" class="wow flipOutX">flipOutX</div> <div data-wow-delay=".25s" class="wow flipOutY">flipOutY</div> <div data-wow-delay=".25s" class="wow rotateOut">rotateOut</div> <div data-wow-delay=".25s" class="wow rotateOutDownLeft">rotateOutDownLeft</div> <div data-wow-delay=".25s" class="wow rotateOutDownRight">rotateOutDownRight</div> <div data-wow-delay=".25s" class="wow rotateOutUpLeft">rotateOutUpLeft</div> <div data-wow-delay=".25s" class="wow rotateOutUpRight">rotateOutUpRight</div> <div data-wow-delay=".25s" class="wow bounceOut">bounceOut</div> <div data-wow-delay=".25s" class="wow bounceOutDown">bounceOutDown</div> <div data-wow-delay=".25s" class="wow bounceOutLeft">bounceOutLeft</div> <div data-wow-delay=".25s" class="wow bounceOutRight">bounceOutRight</div> <div data-wow-delay=".25s" class="wow bounceOutUp">bounceOutUp</div> <div data-wow-delay=".25s" class="wow fadeOut">fadeOut</div> <div data-wow-delay=".25s" class="wow fadeOutDown">fadeOutDown</div> <div data-wow-delay=".25s" class="wow fadeOutDownBig">fadeOutDownBig</div> <div data-wow-delay=".25s" class="wow fadeOutLeft">fadeOutLeft</div> <div data-wow-delay=".25s" class="wow fadeOutLeftBig">fadeOutLeftBig</div> <div data-wow-delay=".25s" class="wow fadeOutRight">fadeOutRight</div> <div data-wow-delay=".25s" class="wow fadeOutRightBig">fadeOutRightBig</div> <div data-wow-delay=".25s" class="wow fadeOutUp">fadeOutUp</div> <div data-wow-delay=".25s" class="wow fadeOutUpBig">fadeOutUpBig</div> <div data-wow-delay=".25s" class="wow hinge">hinge</div> <div data-wow-delay=".25s" class="wow rollOut">rollOut</div> <div data-wow-delay=".25s" class="wow zoomOut ">zoomOut</div> <div data-wow-delay=".25s" class="wow zoomOutDown">zoomOutDown</div> <div data-wow-delay=".25s" class="wow zoomOutLeft">zoomOutLeft</div> <div data-wow-delay=".25s" class="wow zoomOutRight">zoomOutRight</div> <div data-wow-delay=".25s" class="wow zoomOutUp">zoomOutUp</div> </section><!-- --><section class="wowWrap"> <h4>data-wow-delay=".25s"</h4> <div data-wow-delay=".25s" class="wow bounceIn wHighlight">bounceIn</div> <div data-wow-delay=".25s" class="wow bounceInDown wHighlight">bounceInDown</div> <div data-wow-delay=".25s" class="wow bounceInLeft wHighlight">bounceInLeft</div> <div data-wow-delay=".25s" class="wow bounceInRight wHighlight">bounceInRight</div> <div data-wow-delay=".25s" class="wow bounceInUp wHighlight">bounceInUp</div> <div data-wow-delay=".25s" class="wow fadeIn wHighlight">fadeIn</div> <div data-wow-delay=".25s" class="wow fadeInDown wHighlight">fadeInDown</div> <div data-wow-delay=".25s" class="wow fadeInDownBig wHighlight">fadeInDownBig</div> <div data-wow-delay=".25s" class="wow fadeInLeft wHighlight">fadeInLeft</div> <div data-wow-delay=".25s" class="wow fadeInLeftBig wHighlight">fadeInLeftBig</div> <div data-wow-delay=".25s" class="wow fadeInRight wHighlight">fadeInRight</div> <div data-wow-delay=".25s" class="wow fadeInRightBig wHighlight">fadeInRightBig</div> <div data-wow-delay=".25s" class="wow fadeInUp wHighlight">fadeInUp</div> <div data-wow-delay=".25s" class="wow fadeInUpBig wHighlight">fadeInUpBig</div> <div data-wow-delay=".25s" class="wow flipInX wHighlight">flipInX</div> <div data-wow-delay=".25s" class="wow flipInY wHighlight">flipInY</div> <div data-wow-delay=".25s" class="wow lightSpeedIn wHighlight">lightSpeedIn</div> <div data-wow-delay=".25s" class="wow rotateIn wHighlight">rotateIn</div> <div data-wow-delay=".25s" class="wow rotateInDownLeft wHighlight">rotateInDownLeft</div> <div data-wow-delay=".25s" class="wow rotateInDownRight wHighlight">rotateInDownRight</div> <div data-wow-delay=".25s" class="wow rotateInUpLeft wHighlight">rotateInUpLeft</div> <div data-wow-delay=".25s" class="wow rotateInUpRight wHighlight">rotateInUpRight</div> <div data-wow-delay=".25s" class="wow rollIn wHighlight">rollIn</div> <div data-wow-delay=".25s" class="wow zoomIn wHighlight">zoomIn</div> <div data-wow-delay=".25s" class="wow zoomInDown wHighlight">zoomInDown</div> <div data-wow-delay=".25s" class="wow zoomInLeft wHighlight">zoomInLeft</div> <div data-wow-delay=".25s" class="wow zoomInRight wHighlight">zoomInRight</div> <div data-wow-delay=".25s" class="wow zoomInUp wHighlight">zoomInUp</div> </section><!-- --><section class="wowWrap"> <h4>data-wow-duration="2s"<br> data-wow-iteration="100"</h4> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounce">bounce</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flash">flash</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow pulse">pulse</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rubberBand">rubberBand</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow shake">shake</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow swing">swing</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow tada">tada</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow wobble">wobble</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceIn">bounceIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceInDown">bounceInDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceInLeft">bounceInLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceInRight">bounceInRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceInUp">bounceInUp</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceOut">bounceOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceOutDown">bounceOutDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceOutLeft">bounceOutLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceOutRight">bounceOutRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow bounceOutUp">bounceOutUp</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeIn">fadeIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInDown">fadeInDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInDownBig">fadeInDownBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInLeft">fadeInLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInLeftBig">fadeInLeftBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInRight">fadeInRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInRightBig">fadeInRightBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInUp">fadeInUp</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeInUpBig">fadeInUpBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOut">fadeOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutDown">fadeOutDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutDownBig">fadeOutDownBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutLeft">fadeOutLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutLeftBig">fadeOutLeftBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutRight">fadeOutRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutRightBig">fadeOutRightBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutUp">fadeOutUp</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow fadeOutUpBig">fadeOutUpBig</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flip">flip</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flipInX">flipInX</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flipInY">flipInY</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flipOutX">flipOutX</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow flipOutY">flipOutY</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow lightSpeedIn">lightSpeedIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow lightSpeedOut">lightSpeedOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateIn">rotateIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateInDownLeft">rotateInDownLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateInDownRight">rotateInDownRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateInUpLeft">rotateInUpLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateInUpRight">rotateInUpRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateOut">rotateOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateOutDownLeft">rotateOutDownLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateOutDownRight">rotateOutDownRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateOutUpLeft">rotateOutUpLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rotateOutUpRight">rotateOutUpRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow hinge">hinge</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rollIn">rollIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow rollOut">rollOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomIn">zoomIn</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomInDown">zoomInDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomInLeft">zoomInLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomInRight">zoomInRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomInUp">zoomInUp</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomOut">zoomOut</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomOutDown">zoomOutDown</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomOutLeft">zoomOutLeft</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomOutRight">zoomOutRight</div> <div data-wow-duration="2s" data-wow-iteration="100" class="wow zoomOutUp">zoomOutUp</div> </section><!-- --><!-- --><section class="wowWrap"> <h4>data-wow-iteration="100"</h4> <div data-wow-iteration="100" class="wow bounce">bounce</div> <div data-wow-iteration="100" class="wow flash">flash</div> <div data-wow-iteration="100" class="wow pulse">pulse</div> <div data-wow-iteration="100" class="wow rubberBand">rubberBand</div> <div data-wow-iteration="100" class="wow shake">shake</div> <div data-wow-iteration="100" class="wow swing">swing</div> <div data-wow-iteration="100" class="wow tada">tada</div> <div data-wow-iteration="100" class="wow wobble">wobble</div> <div data-wow-iteration="100" class="wow bounceIn">bounceIn</div> <div data-wow-iteration="100" class="wow bounceInDown">bounceInDown</div> <div data-wow-iteration="100" class="wow bounceInLeft">bounceInLeft</div> <div data-wow-iteration="100" class="wow bounceInRight">bounceInRight</div> <div data-wow-iteration="100" class="wow bounceInUp">bounceInUp</div> <div data-wow-iteration="100" class="wow bounceOut">bounceOut</div> <div data-wow-iteration="100" class="wow bounceOutDown">bounceOutDown</div> <div data-wow-iteration="100" class="wow bounceOutLeft">bounceOutLeft</div> <div data-wow-iteration="100" class="wow bounceOutRight">bounceOutRight</div> <div data-wow-iteration="100" class="wow bounceOutUp">bounceOutUp</div> <div data-wow-iteration="100" class="wow fadeIn">fadeIn</div> <div data-wow-iteration="100" class="wow fadeInDown">fadeInDown</div> <div data-wow-iteration="100" class="wow fadeInDownBig">fadeInDownBig</div> <div data-wow-iteration="100" class="wow fadeInLeft">fadeInLeft</div> <div data-wow-iteration="100" class="wow fadeInLeftBig">fadeInLeftBig</div> <div data-wow-iteration="100" class="wow fadeInRight">fadeInRight</div> <div data-wow-iteration="100" class="wow fadeInRightBig">fadeInRightBig</div> <div data-wow-iteration="100" class="wow fadeInUp">fadeInUp</div> <div data-wow-iteration="100" class="wow fadeInUpBig">fadeInUpBig</div> <div data-wow-iteration="100" class="wow fadeOut">fadeOut</div> <div data-wow-iteration="100" class="wow fadeOutDown">fadeOutDown</div> <div data-wow-iteration="100" class="wow fadeOutDownBig">fadeOutDownBig</div> <div data-wow-iteration="100" class="wow fadeOutLeft">fadeOutLeft</div> <div data-wow-iteration="100" class="wow fadeOutLeftBig">fadeOutLeftBig</div> <div data-wow-iteration="100" class="wow fadeOutRight">fadeOutRight</div> <div data-wow-iteration="100" class="wow fadeOutRightBig">fadeOutRightBig</div> <div data-wow-iteration="100" class="wow fadeOutUp">fadeOutUp</div> <div data-wow-iteration="100" class="wow fadeOutUpBig">fadeOutUpBig</div> <div data-wow-iteration="100" class="wow flip">flip</div> <div data-wow-iteration="100" class="wow flipInX">flipInX</div> <div data-wow-iteration="100" class="wow flipInY">flipInY</div> <div data-wow-iteration="100" class="wow flipOutX">flipOutX</div> <div data-wow-iteration="100" class="wow flipOutY">flipOutY</div> <div data-wow-iteration="100" class="wow lightSpeedIn">lightSpeedIn</div> <div data-wow-iteration="100" class="wow lightSpeedOut">lightSpeedOut</div> <div data-wow-iteration="100" class="wow rotateIn">rotateIn</div> <div data-wow-iteration="100" class="wow rotateInDownLeft">rotateInDownLeft</div> <div data-wow-iteration="100" class="wow rotateInDownRight">rotateInDownRight</div> <div data-wow-iteration="100" class="wow rotateInUpLeft">rotateInUpLeft</div> <div data-wow-iteration="100" class="wow rotateInUpRight">rotateInUpRight</div> <div data-wow-iteration="100" class="wow rotateOut">rotateOut</div> <div data-wow-iteration="100" class="wow rotateOutDownLeft">rotateOutDownLeft</div> <div data-wow-iteration="100" class="wow rotateOutDownRight">rotateOutDownRight</div> <div data-wow-iteration="100" class="wow rotateOutUpLeft">rotateOutUpLeft</div> <div data-wow-iteration="100" class="wow rotateOutUpRight">rotateOutUpRight</div> <div data-wow-iteration="100" class="wow hinge">hinge</div> <div data-wow-iteration="100" class="wow rollIn">rollIn</div> <div data-wow-iteration="100" class="wow rollOut">rollOut</div> <div data-wow-iteration="100" class="wow zoomIn">zoomIn</div> <div data-wow-iteration="100" class="wow zoomInDown">zoomInDown</div> <div data-wow-iteration="100" class="wow zoomInLeft">zoomInLeft</div> <div data-wow-iteration="100" class="wow zoomInRight">zoomInRight</div> <div data-wow-iteration="100" class="wow zoomInUp">zoomInUp</div> <div data-wow-iteration="100" class="wow zoomOut">zoomOut</div> <div data-wow-iteration="100" class="wow zoomOutDown">zoomOutDown</div> <div data-wow-iteration="100" class="wow zoomOutLeft">zoomOutLeft</div> <div data-wow-iteration="100" class="wow zoomOutRight">zoomOutRight</div> <div data-wow-iteration="100" class="wow zoomOutUp">zoomOutUp</div> </section><!-- --><section class="wowWrap"> <h4>wow-data-offset="200"</h4> <div data-wow-offset="200" class="wow bounce">bounce</div> <div data-wow-offset="200" class="wow flash">flash</div> <div data-wow-offset="200" class="wow pulse">pulse</div> <div data-wow-offset="200" class="wow rubberBand">rubberBand</div> <div data-wow-offset="200" class="wow shake">shake</div> <div data-wow-offset="200" class="wow swing">swing</div> <div data-wow-offset="200" class="wow tada">tada</div> <div data-wow-offset="200" class="wow wobble">wobble</div> <div data-wow-offset="200" class="wow bounceIn">bounceIn</div> <div data-wow-offset="200" class="wow bounceInDown">bounceInDown</div> <div data-wow-offset="200" class="wow bounceInLeft">bounceInLeft</div> <div data-wow-offset="200" class="wow bounceInRight">bounceInRight</div> <div data-wow-offset="200" class="wow bounceInUp">bounceInUp</div> <div data-wow-offset="200" class="wow bounceOut">bounceOut</div> <div data-wow-offset="200" class="wow bounceOutDown">bounceOutDown</div> <div data-wow-offset="200" class="wow bounceOutLeft">bounceOutLeft</div> <div data-wow-offset="200" class="wow bounceOutRight">bounceOutRight</div> <div data-wow-offset="200" class="wow bounceOutUp">bounceOutUp</div> <div data-wow-offset="200" class="wow fadeIn">fadeIn</div> <div data-wow-offset="200" class="wow fadeInDown">fadeInDown</div> <div data-wow-offset="200" class="wow fadeInDownBig">fadeInDownBig</div> <div data-wow-offset="200" class="wow fadeInLeft">fadeInLeft</div> <div data-wow-offset="200" class="wow fadeInLeftBig">fadeInLeftBig</div> <div data-wow-offset="200" class="wow fadeInRight">fadeInRight</div> <div data-wow-offset="200" class="wow fadeInRightBig">fadeInRightBig</div> <div data-wow-offset="200" class="wow fadeInUp">fadeInUp</div> <div data-wow-offset="200" class="wow fadeInUpBig">fadeInUpBig</div> <div data-wow-offset="200" class="wow fadeOut">fadeOut</div> <div data-wow-offset="200" class="wow fadeOutDown">fadeOutDown</div> <div data-wow-offset="200" class="wow fadeOutDownBig">fadeOutDownBig</div> <div data-wow-offset="200" class="wow fadeOutLeft">fadeOutLeft</div> <div data-wow-offset="200" class="wow fadeOutLeftBig">fadeOutLeftBig</div> <div data-wow-offset="200" class="wow fadeOutRight">fadeOutRight</div> <div data-wow-offset="200" class="wow fadeOutRightBig">fadeOutRightBig</div> <div data-wow-offset="200" class="wow fadeOutUp">fadeOutUp</div> <div data-wow-offset="200" class="wow fadeOutUpBig">fadeOutUpBig</div> <div data-wow-offset="200" class="wow flip">flip</div> <div data-wow-offset="200" class="wow flipInX">flipInX</div> <div data-wow-offset="200" class="wow flipInY">flipInY</div> <div data-wow-offset="200" class="wow flipOutX">flipOutX</div> <div data-wow-offset="200" class="wow flipOutY">flipOutY</div> <div data-wow-offset="200" class="wow lightSpeedIn">lightSpeedIn</div> <div data-wow-offset="200" class="wow lightSpeedOut">lightSpeedOut</div> <div data-wow-offset="200" class="wow rotateIn">rotateIn</div> <div data-wow-offset="200" class="wow rotateInDownLeft">rotateInDownLeft</div> <div data-wow-offset="200" class="wow rotateInDownRight">rotateInDownRight</div> <div data-wow-offset="200" class="wow rotateInUpLeft">rotateInUpLeft</div> <div data-wow-offset="200" class="wow rotateInUpRight">rotateInUpRight</div> <div data-wow-offset="200" class="wow rotateOut">rotateOut</div> <div data-wow-offset="200" class="wow rotateOutDownLeft">rotateOutDownLeft</div> <div data-wow-offset="200" class="wow rotateOutDownRight">rotateOutDownRight</div> <div data-wow-offset="200" class="wow rotateOutUpLeft">rotateOutUpLeft</div> <div data-wow-offset="200" class="wow rotateOutUpRight">rotateOutUpRight</div> <div data-wow-offset="200" class="wow hinge">hinge</div> <div data-wow-offset="200" class="wow rollIn">rollIn</div> <div data-wow-offset="200" class="wow rollOut">rollOut</div> <div data-wow-offset="200" class="wow zoomIn">zoomIn</div> <div data-wow-offset="200" class="wow zoomInDown">zoomInDown</div> <div data-wow-offset="200" class="wow zoomInLeft">zoomInLeft</div> <div data-wow-offset="200" class="wow zoomInRight">zoomInRight</div> <div data-wow-offset="200" class="wow zoomInUp">zoomInUp</div> <div data-wow-offset="200" class="wow zoomOut">zoomOut</div> <div data-wow-offset="200" class="wow zoomOutDown">zoomOutDown</div> <div data-wow-offset="200" class="wow zoomOutLeft">zoomOutLeft</div> <div data-wow-offset="200" class="wow zoomOutRight">zoomOutRight</div> <div data-wow-offset="200" class="wow zoomOutUp">zoomOutUp</div> </section><!-- --></main> <!-- ALL CHOICES bounce flash pulse rubberBand shake swing tada wobble bounceIn bounceInDown bounceInLeft bounceInRight bounceInUp bounceOut bounceOutDown bounceOutLeft bounceOutRight bounceOutUp fadeIn fadeInDown fadeInDownBig fadeInLeft fadeInLeftBig fadeInRight fadeInRightBig fadeInUp fadeInUpBig fadeOut fadeOutDown fadeOutDownBig fadeOutLeft fadeOutLeftBig fadeOutRight fadeOutRightBig fadeOutUp fadeOutUpBig flip flipInX flipInY flipOutX flipOutY lightSpeedIn lightSpeedOut rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight hinge rollIn rollOut zoomIn zoomInDown zoomInLeft zoomInRight zoomInUp zoomOut zoomOutDown zoomOutLeft zoomOutRight zoomOutUp -->

Comments

Post a Comment

Popular posts from this blog

Right click disable

 <body class="tg-home" onLoad="disableClick()" oncontextmenu="return false"> //hide code// document.onkeydown = function(e) {     if(e.keyCode == 123) {      return false;     }     if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)){      return false;     }     if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)){      return false;     }     if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)){      return false;     }     if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)){      return false;     }        }  ///F12//  //------------------------------ function unloadJS(scriptName) {   var head = document.getElementsByTagName('head').item(0);   var js = document.getElementById(sc...
Read more

Moutain

Image
  <!DOCTYPE html> <html> <head> <title> Moutain </title> </head> <body> <section class =" zoom "> <img src =" mountain1.png " alt ="" title ="" id =" layer1 "> <img src =" mountain2.png " alt ="" title ="" id =" layer2 "> <img src =" text.png " alt ="" title ="" id =" text "> </section> <section class =" content "> <h2> Lorem text is the dummy text for this </h2> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna liqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occa...
Read more

Input Placeholder

Image
<!DOCTYPE html> <html> <head> <title>Input Placeholder</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div class="container"> <h2>How to Create Custom Input Filed</h2> <form> <div class="input-field"> <input type="text" name="" required=""> <label>Please Enter Your Full Name</label> <span></span> </div> <input type="submit" value="Show Result" name="" class="btn"> </form> </div> </body> </html> <style type="text/css"> *{margin: 0px; padding: 0px; font-family: arial; box-sizing: border-box; } body{ display: flex; justify-content: center; align-items: center; background-color: #111; min-height: 100vh;} .c...
Read more