.revealOnScroll { opacity: 0; }
.animated { -webkit-animation-duration: 3s; animation-duration: 3s; -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%, 100%, 20%, 50%, 80% {-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%, 100%, 20%, 50%, 80% {-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%, 100%, 50% {opacity:1 } 25%, 75% {opacity:0 } } @keyframes flash { 0%, 100%, 50% {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(100%); transform:translateY(100%) } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0) } } @keyframes fadeInUp { 0% {opacity:0; -webkit-transform:translateY(100%); -ms-transform:translateY(100%); transform:translateY(100%) } 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(40px); transform:translateY(40px) } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0) } } @keyframes fadeInUpBig { 0% {opacity:0; -webkit-transform:translateY(40px); -ms-transform:translateY(40px); transform:translateY(40px) } 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% {-webkit-transform:translateY(2000px); transform:translateY(2000px) } 100% {opacity:0; -webkit-transform:translateY(0); transform:translateY(0) } } @keyframes slideInUp { 0% {-webkit-transform:translateY(2000px); -ms-transform:translateY(2000px); transform:translateY(2000px) } 100% {opacity:0; -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 }
.revealOnScroll { opacity: 0; }
.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.maxtime { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes fadeInLeft { 0% {opacity:0; -webkit-transform:translateX(-100%); transform:translateX(-100%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } } @keyframes fadeInLeft { 0% {opacity:0; -webkit-transform:translateX(-100%); transform:translateX(-100%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } }
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% {opacity:0; -webkit-transform:translateX(-200%); transform:translateX(-200%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } } @keyframes fadeInLeftBig { 0% {opacity:0; -webkit-transform:translateX(-200%); transform:translateX(-200%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } }
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% {opacity:0; -webkit-transform:translateX(100%); transform:translateX(100%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } } @keyframes fadeInRight { 0% {opacity:0; -webkit-transform:translateX(100%); transform:translateX(100%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } }
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% {opacity:0; -webkit-transform:translateX(200%); transform:translateX(200%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } } @keyframes fadeInRightBig { 0% {opacity:0; -webkit-transform:translateX(200%); transform:translateX(200%); } 100% {opacity:1; -webkit-transform:translateX(0); transform:translateX(0); } }
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInTop { 0% {opacity:0; -webkit-transform:translateY(-100%); transform:translateY(-100%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } } @keyframes fadeInTop { 0% {opacity:0; -webkit-transform:translateY(-100%); transform:translateY(-100%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } }
.fadeInTop { -webkit-animation-name: fadeInTop; animation-name: fadeInTop; } @-webkit-keyframes fadeInTopBig { 0% {opacity:0; -webkit-transform:translateY(-200%); transform:translateY(-200%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } } @keyframes fadeInTopBig { 0% {opacity:0; -webkit-transform:translateY(-200%); transform:translateY(-200%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } }
.fadeInTopBig { -webkit-animation-name: fadeInTopBig; animation-name: fadeInTopBig; } @-webkit-keyframes fadeInBottom { 0% {opacity:0; -webkit-transform:translateY(100%); transform:translateY(100%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } } @keyframes fadeInBottom { 0% {opacity:0; -webkit-transform:translateY(100%); transform:translateY(100%); } 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0); } }
.fadeInBottom { -webkit-animation-name: fadeInBottom; animation-name: fadeInBottom; } @-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 { opacity: 1; -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 { opacity: 1; -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) } } . {opacity:1; -webkit-animation-name:tada; animation-name:tada } @keyframes fadeMoveLeft { from {margin-left:3px; } to { margin-left: -6px; } } @-moz-keyframes fadeMoveLeft { from {margin-left:3px; } to { margin-left: -6px; } } @-webkit-keyframes fadeMoveLeft { from {margin-left:3px; } to { margin-left: -6px; } }
.fadeMoveLeft { animation: fadeMoveLeft 0.5s infinite; -moz-animation: fadeMoveLeft 0.5s infinite; -webkit-animation: fadeMoveLeft 0.5s infinite; } @keyframes fadeMoveRight { from {margin-left:-3px; } to { margin-left: 6px; } } @-moz-keyframes fadeMoveRight { from {margin-left:-3px; } to { margin-left: 6px; } } @-webkit-keyframes fadeMoveRight { from {margin-left:-3px; } to { margin-left: 6px; } }
.fadeMoveRight { animation: fadeMoveRight 0.5s infinite; -moz-animation: fadeMoveRight 0.5s infinite; -webkit-animation: fadeMoveRight 0.5s infinite; } @-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 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(-180deg); -ms-transform:perspective(400px) rotateY(-180deg); transform:perspective(400px) rotateY(-180deg) } 70% {-webkit-transform:perspective(400px) rotateY(180deg); -ms-transform:perspective(400px) rotateY(180deg); transform:perspective(400px) rotateY(180deg) } 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 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 pulse { 0% {-webkit-transform:scale(0); transform:scale(0) } 100% {-webkit-transform:scale(1); transform:scale(1) } } @keyframes pulse { 0% {-webkit-transform:scale(0); -ms-transform:scale(0); transform:scale(0) } 100% {-webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } } .pulse { -webkit-animation-name: pulse; animation-name: pulse } @-webkit-keyframes show { 0% {opacity: 0; } 100% {opacity: 1; } } @keyframes show { 0% {opacity: 0; } 100% {opacity: 1; } }
.show { -webkit-animation-name: show; animation-name: show; }




html, body, div, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td {margin: 0; padding: 0; }
img { border: 0 none; vertical-align: top; }
ul,li,dl,dd,dt { list-style-type: none; }
i,em,cite { font-style: normal; }
body {  -webkit-text-size-adjust:none;  font-family:"微软雅黑";}
a{ text-decoration: none; }
.clear,.cle {clear:both;}
a,area { blr:expression(this.onFocus=this.blur()) }   
a:focus { outline: none; }    




.xn_n_14_wrap_menu1:hover>a {color: #fff;}
.xn_n_14_wrap_main>ul>li:nth-child(n+10) {display: none;}
.xn_n_14_wrap{z-index:100;height:100px;width:100%;text-align:center;box-sizing: border-box;border-bottom:2px solid #2774f9;position: relative;}
.xn_n_14_wrap_main{margin:0 auto;  width:1200px; height:100px; } 
.xn_n_14_wrap_main>ul{margin-right: -25px;float: left;margin-left: 250px;}
.index_body .xn_n_14_wrap_menu1_2>a{color: #fff;}
.xn_n_14_wrap_menu1_2>a:hover{ color:#fff;}
.xn_n_14_wrap_menu1 {float:left; width:90px; height:100px; font-size:14px;}
.xn_n_14_wrap_menu1>a{color:#666;line-height:100px;text-decoration:none;transition: all 0.6s;}
.xn_n_14_wrap_menu1>a:hover{color: #fff;line-height:100px;text-decoration:none;}
.xn_n_14_wrap_menu1_2 {float:left;width:90px;height:100px;font-size: 16px;}
.xn_n_14_wrap_menu1_2>a{color: #fff;line-height:100px;text-decoration:none;}
.xn_n_14_wrap_menu1_2>a:visited{color: #fff;line-height:100px;text-decoration:none;}
.xn_n_14_wrap_menu1_cur {float:left;  width:90px; height:100px; font-size:14px;background: #023894;}
.xn_n_14_wrap_menu1_cur a{color:#fff; line-height:100px; text-decoration:none;}
.xn_n_14_wrap_menu1_cur a:visited{color:#fff; line-height:100px; text-decoration:none;}
.xn_n_14_wrap_menu2 a{color:#666;font-weight:normal;line-height:30px !important;}
.xn_n_14_wrap_menu2_2>a{color: #023894;font-weight:normal;}
.xn_n_14_wrap_menu2_2>a:hover{color: #7e8796;font-weight:normal;line-height: 50px !important;text-decoration:none;}
.xn_n_14_wrap_menu2 a:hover{color:#fff; text-decoration:none;}
.xn_n_14_wrap_main>ul>li>ul{background: rgba(251,251,251,.9);filter:Alpha(opacity=75);border-top: 0;position: absolute;width: 100%;left: 0 !important;height: 137px;opacity: .9;top: 100px !important;display: none !important;}
.xn_n_14_wrap_main>ul>li:hover>ul {display: block !important;}
.xn_n_14_wrap_main>ul>li>ul>li>a{line-height: 50px !important;}
.xn_n_14_wrap_main>ul>li>ul>li:hover>a{color: #7e8796;font-weight: bold;}
.xn_n_14_wrap_main>ul>li>ul>li>ul{ display:none !important; float:left; margin-left:128px;}
.xn_n_14_wrap_main>ul>li>ul>li>a {font-size: 16px;padding: 0 16px;font-weight: bold;color: #7e8796;}
.xn_n_14_wrap_main>ul>li>ul>li {display: inline-block;box-sizing: border-box;margin-top: 65px;position: relative;} 
.xn_n_14_wrap_main>ul>li>ul>li:first-child>a {border: 0; }
#type1Ul_t101 {background: url(../image/CgAGfFomGcaAMqUxAAA2z-2H8XY057.png)center no-repeat rgba(251,251,251,.9);}
#type1Ul_t201 {background: url(../image/CgAGfFomGiWAAsFYAAA3Ngr67Sk852.png) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t301 {background: url(../image/CgAGfFomGuKAfpY2AAA4TeUGZDE189.png) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t601 {background: url(../image/CgAGfFomGx6ASZH-AAA4H-AAlAo761.png) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t701 {background: url(../image/CgAGfFolA1SAZGc6AAAszqTfnnI664.jpg) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t801 {background: url(../image/CgAGfFomGnuADn3wAAA4rtlDf2g013.png) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t2501 {background: url(../image/CgAGfFomGq2AM5DdAAA2yXf83yE236.png) center no-repeat rgba(251,251,251,.9);}
#type1Ul_t2601 {background: url(../image/CgAGfFomG1CANMqoAAA4FyrPw54866.png) center no-repeat rgba(251,251,251,.9);}
.xn_n_14_wrap_main>ul>li>ul>li:first-child {margin-left: 180px;}
.xn_n_14_wrap_main>ul>li>ul>li:before {content: "";width: 11px;height: 9px;display: none;background: url(../image/bg11.png) no-repeat;position: absolute;left: 0;top: 20px;}
.xn_n_14_wrap_main>ul>li>ul>li:hover:before {display: block; }
ap_main>ul>li>a {display: block;position: relative;overflow: hidden;height: 100px;}
.xn_n_14_wrap_main>ul>li>a {display: block;position: relative;overflow: hidden;height: 100px;}
.xn_n_14_wrap_main>ul>li>a:after {content: "";width: 100%;height: 100px;background: #023984;display: block;top: 100px;left: 0;position: absolute;z-index: -1;transition: all 0.6s;}
.xn_n_14_wrap_menu1_2>a:after {top: 0 !important;}
#type1Li_n0:hover>a:after {
    top: 0;
}
.xn_n_14_wrap_main>ul>li>ul>li:hover>a {color: #023984;}


.t_logo{position:absolute;left: 50%;margin-left: -600px;}
#ea_l{position:relative;display: table-cell;vertical-align:middle;    height: 100px;}
.t_logo img{width: 172px;border:0px;}


#img_ShoveWebControl_Search12 {position: relative;top: 0px;left:-3px;}
.t_search {width: 135px;height: 22px;background: #fff;border: 1px solid #8f8f8f;position: absolute;top: 40px;right: 50%;margin-right: -600px;border-radius: 8px;}
.t_search table { width: 100%; }
.t_search_text {border: 0px;background-color: transparent;color: #999;width: 102px;height: 20px;margin-top: 0;text-indent: 5px;}


.top{width: 100%;z-index:99;position: fixed;background: url(https://1.rc.xiniu.com/rc/Heads/36282/Images/ihpsp1_top_bg.gif?d=20170825135011292) #fff repeat-x;top: 0;}
.t_t{position:relative; z-index:100; width:1200px; margin:0 auto; }
div#ea_ba {margin-top: 100px;}




.products_banner{width:100%; height:215px;overflow:hidden;position:relative;margin:0 auto;}
.products_banner_m{z-index:0; width:1920px; height:215px; position:absolute; left:50%; margin-left:-960px;}




.n_content_right_name_r{float:left; height:40px;padding-left:20px;}
.n_r_wz1,.n_r_wz2,.n_r_wz3,.n_r_wz4,.n_r_wz5,.n_r_wz6{}.n_r_wz6 a:last-child{color: #003894 !important;}
.n_content_right_name_r>ul{overflow:hidden;}
.n_content_right_name_r>ul>li{float:right;height:40px;line-height:40px;overflow:hidden;}
.n_content_right_name_r>ul>li>img{margin-right:6px;margin-top:12px;}
.n_r_wz1{display:none;}
.n_content_right_name_r>ul>li>span{font-size:14px;color:#666666;font-weight: 700;}
.n_content_right_name_r>ul>li>span a{font-size:14px;color:#666666;font-weight: 700;}
.n_content_right_name_r>ul>li>span a:hover{color:#003e95;}


.n_content_left_t{width:100%;overflow:hidden;padding-top: 22px;}
.n_content_left_t>span{display:block;font-weight:bold;}
.n_content_left_t1{height:34px;line-height:34px;overflow:hidden;text-align:center;font-size:24px;color:#333333;overflow:hidden;}
.n_content_left_t2{font-size:18px;color:#666666;height:24px;line-height:24px;overflow:hidden;text-align:center;overflow:hidden;}


.n_content_left_cnt{width:1200px;height:auto;padding-top:20px;overflow:hidden;text-align:center;margin: 0 auto;display:none;}
.n_content_left_cnt>ul{display:inline-block !important;overflow:hidden;margin:0 auto;}
.n_content_left_cnt>ul>ul:first-child{padding-left:1px;}
.n_content_left_cnt>ul>ul{float:left;overflow:hidden;}
.n_content_left_cnt>ul>ul>li{float:left;}
.n_content_left_cnt>ul>ul>li>a{display:block;height:35px;line-height:35px;padding:0 15px;border:1px solid #b3b3b3;margin-left:-1px;font-size:14px;color:#666666;-moz-transition:all 0.5s ease-out 0s;-webkit-transition:all 0.5s ease-out 0s;-o-transition:all 0.5s ease-out 0s;transition:all 0.5s ease-out 0s;}
.n_content_left_cnt>ul>ul>li>a:hover,.left_menu1_cur>a{color:#ffffff !important;background:#023894;-moz-transition:all 0.5s ease-out 0s;-webkit-transition:all 0.5s ease-out 0s;-o-transition:all 0.5s ease-out 0s;transition:all 0.5s ease-out 0s;}
.n_content_left_cnt>ul>ul>li>ul{display:none !important;}


.xn_c_products_12_wrap{width:1200px;margin:0 auto;overflow:hidden;padding-top:18px;}
.xn_c_products_12_wbox{width:100%;overflow:hidden;padding-top:8px;}
.xn_c_products_12_wbox>div{float:left;margin:0 75px 36px;width:250px;}
.xn_c_products_12_lftbox{width:244px;height:160px;border:3px solid #fff;box-shadow:0 0px 10px 0 rgba(0,0,0,0.6);}
.xn_c_products_12_lftbox img{width:100%;height:100%;border:none;display: block;transition: 1s;-moz-transition: 1s;-webkit-transition: 1s;-o-transition: 1s;overflow:hidden;}
.xn_c_products_12_lftbox>a{display:block;overflow:hidden;width:100%;height:100%;}
.xn_c_products_12_ritbox{overflow:hidden;width:100%;}
.xn_c_products_12_name{width:100%;height:54px;overflow:hidden;}
.xn_c_products_12_name>a{display:block;height:54px;line-height:54px;text-align:center;font-size:18px;color:#000;font-weight:bold;overflow:hidden;-moz-transition:all 0.5s ease-out 0s;-webkit-transition:all 0.5s ease-out 0s;-o-transition:all 0.5s ease-out 0s;transition:all 0.5s ease-out 0s;}
.xn_c_products_12_wbox>div:hover .xn_c_products_12_lftbox img{transform:scale(1.2);-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform: scale(1.2);}
.xn_c_products_12_wbox>div:hover .xn_c_products_12_name>a{color:#023894;-moz-transition:all 0.5s ease-out 0s;-webkit-transition:all 0.5s ease-out 0s;-o-transition:all 0.5s ease-out 0s;transition:all 0.5s ease-out 0s;}
.xn_c_products_12_xinhao,.xn_c_products_12_time,.xn_c_products_12_coent,.xn_c_products_12_order,.xn_c_products_12_more{display:none;}


.fy{width:100%; text-align:center;height:40px;line-height:40px;overflow:hidden;padding:10px 0 50px 0;}
.fy span,.fy span a{color: #666;vertical-align:middle;}
.fy_1,.fy_9,.fy_4,.fy_7,.fy_3,.fy_5{display:none;}
.fy_2,.fy_on,.fy_out{}
.fy_8{}
.fy_2>a,.fy_6>a{display:inline-block;font-size:14px;color:#ffffff;font-family:"微软雅黑";}
.fy_2>a{padding: 0 30px;margin-right:11px;border: 1px solid #b3b3b3;}
.fy_6>a{padding: 0 30px;margin-left: 11px;border: 1px solid #b3b3b3;}
.fy_2>a:hover{background: #023894;margin-right:11px;color: #fff;}
.fy_6>a:hover{margin-left:11px;background: #023894;color: #fff;}
.fy_on>a,.fy_out>a{display:inline-block;padding:0 20px;font-size:14px;font-family:"arial";font-weight:bold;border: 1px solid #b3b3b3;margin: 0 5px;}
.fy_on>a,.fy_out>a:hover{background: #023894;color: #fff !important;}







.xn_c_teachers_60_wrap{width:1200px;margin:0 auto;overflow:hidden;}
.xn_c_teachers_60_type_jia01{ overflow: hidden;border-bottom:1px solid #d9d9d9;padding-top:10px;}
.xn_c_teachers_60_type>span{width:50px;height:36px;line-height:36px;font-size:14px;color:#5f5f5f;overflow:hidden;float:left;}
.xn_c_teachers_60_type_jia01{display:none;}
.xn_c_teachers_60_type_jia01 ul{width:1150px;overflow:hidden;float:left;}
.xn_c_teachers_60_type_jia01 li{height:16px;line-height:16px;margin:10px 0;cursor:pointer;float:left;padding-right:17px;margin-right:17px;overflow:hidden;border-right:1px solid #5f5f5f;display:inline-block;}
.xn_c_teachers_60_type li a{font-size:14px;color:#5f5f5f;}
.xn_c_teachers_60_type li:hover a,.xn_c_teachers_60_type li.curr a{color:#a73fd4;}


.xn_c_teachers_60_type_jia02{width: 1200px; height: auto;padding-top: 16px; overflow: hidden;text-align: center; margin: 0 auto;}
.xn_c_teachers_60_type_jia02>ul{display: inline-block !important;overflow: hidden; margin: 0 auto;padding-left: 1px;}
.xn_c_teachers_60_type_jia02>ul>li{float: left;}
.xn_c_teachers_60_type_jia02>ul>li>a{display: block;height: 35px;line-height: 35px;padding: 0 15px;border: 1px solid #b3b3b3;margin-left: -1px; font-size: 16px;color: #666666;
    -moz-transition: all 0.5s ease-out 0s; -webkit-transition: all 0.5s ease-out 0s;-o-transition: all 0.5s ease-out 0s;transition: all 0.5s ease-out 0s;}
.xn_c_teachers_60_type_jia02>ul>li>a:hover,.xn_c_teachers_60_type_jia02>ul>li.curr>a{color: #ffffff !important; background: #023894; -moz-transition: all 0.5s ease-out 0s;
    -webkit-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s;transition: all 0.5s ease-out 0s;}



.index_body .n_main{width: 100%; margin:0; padding:0; background:url(https://1.rc.xiniu.com/rc/Contents/36316/Images/incsp1_index_cbg.png?d=20170825135023401) center 47px repeat-x; height:auto; overflow:hidden;z-index:5; position: relative;} 
.n_main{width:100%;margin:0;padding:0;height:auto;overflow:hidden;z-index:5; position: relative;min-width:1200px;} 
.n_content{width:1200px; margin:0 auto;}
@keyframes leftInt{
    0%{transform:translateX(-100%);opacity:0;}
    100%{transform:translateX(0px);opacity:1;}
}
@keyframes rightInt{
    0%{transform:translateX(100%);opacity:0;}
    100%{transform:translateX(0px);opacity:1;}
}
@keyframes upInt{
    0%{transform:translateY(-100%);opacity:0;}
    100%{transform:translateY(0px);opacity:1;}
}
@keyframes downInt{
    0%{transform:translateY(100%);opacity:0;}
    100%{transform:translateY(0px);opacity:1;}
}
@keyframes downInt1{
    0%{transform:translateY(100px);opacity:0;}
    100%{transform:translateY(0px);opacity:1;}
}
@keyframes leftInt2{
    0%{transform:translateX(-100px);opacity:0;}
    100%{transform:translateX(0px);opacity:1;}
}
@keyframes fadeInt{
    0%{opacity:0;},
    100%{opacity:1;}
}
@keyframes keyframes xh{
    0%{transform:translateY(0px)}
    25%{transform:translateY(-5px)}
    50%{transform:translateY(0px)}
    75%{transform:translateY(5px)}
    100%{transform:translateY(0px)}
}
@-webkit-keyframes xh{
    0%{transform:translateY(0px)}
    25%{transform:translateY(-5px)}
    50%{transform:translateY(0px)}
    75%{transform:translateY(5px)}
    100%{transform:translateY(0px)}
}
@-moz-keyframes xh{
    0%{transform:translateY(0px)}
    25%{transform:translateY(-5px)}
    50%{transform:translateY(0px)}
    75%{transform:translateY(5px)}
    100%{transform:translateY(0px)}
}
@-o-keyframes xh{
    0%{transform:translateY(0px)}
    25%{transform:translateY(-5px)}
    50%{transform:translateY(0px)}
    75%{transform:translateY(5px)}
    100%{transform:translateY(0px)}
}


.n_content_right_name{width:1200px; margin:0 auto;position:absolute;overflow:hidden;padding-top:18px;}


.n_content_right{position:relative; width:783px; height: auto; float:right; padding-bottom:20px;}


.n_content_right_m {text-align:left; width:92%; margin:0 auto; line-height:24px; color:#737373; font-size:12px; padding:30px 0 20px 0; position:relative;}




.foot_c11 {min-height: 100px;}
.xn_f_21_xhbox a {color: #fff;font-size: 16px;line-height: 20px;display: block;padding: 0 10px;height: 20px;margin-top: 10px;} 
.xn_f_21_xhbox a:hover{text-decoration: underline;}
.xn_f_21_xhbox:nth-child(1) a {border: 0; }
.xn_f_21_wrap{width: 800px;height: auto;overflow: hidden;padding-bottom: 30px;padding-top: 30px;display: none;}
.index_body .xn_f_21_wrap {display: none;}
.xn_f_21_wrapbigbox{height:auto;width: 1100px;line-height: 60px;float: left;}
.xn_c_index_172_enName55{display: block;width: 80px;height: 40px;float: left;font-size: 16px;color: #fff;line-height: 40px;}
.xn_f_21_xhbox{float:left;overflow:hidden;text-align:center;}
.xn_f_21_wrap11 {height: auto;margin: 0px auto;width: 1200px;line-height: 60px;}


.foot_tel{position:absolute;width: 256px;top: -11px;right: 0px;color:#999;height: 110px;background: url(../image/footbg.png) no-repeat;}
.foot_tel_f{position:relative;width: 60%;height:100%;}
.foot_tel a{color:#999; }
.foot_add {font-size: 16px; color: #666; text-indent: 20px; margin-top: 30px; } 
.foot_phone {font-size: 16px; color: #666; text-indent: 20px; margin-top: 5px; } 
.foot_zip {position: absolute;top: 40px;left: 140px;font-size: 48px;color: #023894;width: 96px;overflow: hidden;height: 40px;line-height: 40px;}


.foot_nav{width:900px;overflow:hidden;height:auto;text-align:left;}
.foot_nav ul{ float:left; margin:0px; padding:0px;}
.foot_nav ul li{width: 145px;float:left;position: relative;}
.foot_nav ul li a{line-height:28px;font-size: 18px;color: #fff;}
.foot_nav ul li ul li a{line-height:28px;padding-left: 5px;font-size: 16px;font-weight: normal !important;}
.foot_nav ul li ul li a:hover{text-decoration:underline;}
.foot_nav ul:before{  clear:both;}
.foot_nav ul>li:nth-child(n+7) {display: none;}
.foot_nav>ul>li:after {content: "/";line-height: 28px;font-size: 18px;color: #fff;position: absolute;right: 35px;}


.foot_copy{width: 100%;text-align: center;margin-top: 10px;font-size: 16px;color: #fff;padding: 10px;}
.foot_nav>ul>li:after {content: "/";line-height: 28px;font-size: 18px;color: #fff;position: absolute;right: 35px;}
.foot_copy a {font-size: 16px;color: #fff;}


.foot{  width:100%; position:relative; text-align:center; font-size:12px;color:#666666; line-height:25px; background: #023894;}
.foot a{ font-size:12px; color:#fff; text-decoration:none; line-height:25px;}
.foot a:hover{ text-decoration: underline;;}
.foot_c{position:relative; width:1127px; margin:auto; text-align:left;}


.foot_wx {position: absolute; right: 100px; top: 160px; text-align: center; font-size: 16px; color: #fff; line-height: 25px; }
.foot_wx img {width: 120px; height: 120px; display: block; }
.back_top {position: fixed; top: 70%; right: 5%; z-index: 9999; width: 50px; height: 50px;cursor: pointer; }
.back_top img {width: 100%; height: 100%; }
body {
    overflow-x: hidden;
}