/*public*/ /* main */ #main{width: 1920px;height: 790px;overflow:hidden;position:relative;margin:0px auto;left: 50%;margin-left: -960px;} #main .box{width: 1920px;height: 790px;box-shadow:0px 0px 5px #ddd;margin:0px auto;overflow:hidden;position:relative;} #main .box img{width: 100%;/* height: 790px; */position:absolute;left:0px;top:0px;opacity:0;filter:alpha(opacity=0);} #main .btnLeft{width:35px;height:57px;position:absolute;left:0px;top:185px;background:url(../images/left_ar.html) no-repeat 0px 0px;} #main .btnRight{width:35px;height:57px;position:absolute;right:0px;top:185px;background:url(../images/right_ar.html) no-repeat 0px 0px;} #main .page{width:180px;height:22px;position:absolute;bottom:108px;right: 50%;margin-right: -60px;} #main .page a{display:inline-block;width:22px;height:22px;background: #fff;margin:0px 11px;float:left;border-radius: 50%;color:#FFF;text-decoration:none;text-align:center;} #main .page a.active{background:#ffd500;} /*xn_c_index_540_wrap*/ .xn_c_index_540_wrap{width: 100%;background: url(/template/images/CgAGfFpFtgqAdw5_AAADpoae98w683.png) center no-repeat;height: 830px;} .xn_c_index_540_box{overflow: hidden;width: 1200px;height: 830px;position: relative;margin: auto;} .xn_c_index_540_tit{width: 100%;font-size: 16px;color: #000;height: auto;line-height: 26px;padding-top: 0px;margin-top:-33px;} .xn_c_index_540_titt{width: 575px;height: 137px;background: url(/template/images/CgAGTFmC1LOAbF8gAAAdzFbrETs630.png)left bottom no-repeat;padding-top: 150px;} .xn_c_index_540_tit1{font-size: 48px;color: #ffffff;display: block;padding-top: 105px;text-transform: uppercase;display: none;} .xn_c_index_540_tit2{font-size: 36px;color: #ffffff;display: block;padding-top: 27px;padding-bottom: 60px; padding-left: 80px; background: url(/template/images/viedonamebc7d.png) 0 35px no-repeat;display: none;} .xn_c_index_540_tit3{font-size: 18px;color: #ffffff;display: block;width: 96px;margin-right: 20px;height: 40px;line-height: 40px; float: left;background: url(/template/images/vlinebc7d.png) right center no-repeat;} .xn_c_index_540_tit4{display: block;font-size: 12px;color: #ffffff;} .xn_c_index_540_tit5{display: block;font-size: 12px;color: #ffffff;height: 25px;width:400px;margin-top: -7px;} .xn_c_index_540_wrap_cnt{position: relative;padding-top:20px; } .lalala{background: url(/template/images/vvbc7d.png) no-repeat;width:600px;height: 420px;z-index: 1; position: absolute;left: 20px;top: 37px;} .xn_c_index_540_li{width: 600px;height: 420px;position: absolute;z-index: 9999;background: url(/template/images/bobc7d.png) center no-repeat !important;} .xn_c_index_540_li_img img{width: 600px;height: 420px;border-radius: 10px;} .xn_c_index_540_li_img:hover img{t} .xn_c_index_540_li_img em{} .xn_c_index_540_li_img:hover em{} .xn_c_index_540_li_cont{display: none;} .xn_c_index_540_li_videobg{position: fixed;width: 100%;height: 100%;top: 0;left: 0;background: rgba(0,0,0,0.5);z-index: 200;} .xn_c_index_540_li_video{position: fixed;width: 1000px;height: 693px;padding: 0px;border-radius: 0px;z-index: 202;top: 12%;left: 57%;margin-left: -600px;} .xn_c_index_540_li_video_cont{width: 1000px;height: 693px;overflow: hidden;} .xn_c_index_540_li_close{position: absolute;right: 2px;top: 1px;width: 20px;height: 20px;background: #F9F9F9;border-radius: 50%;line-height: 20px;text-align: center;font-size: 16px;color: #000;cursor: pointer;background: url(/template/images/vclosebc7d.png) center no-repeat;} .xn_c_index_540_li_video embed { width: 1150px !important; height: 642px !important; margin-left: 25px; } /*end_xn_c_index_540_wrap*/ .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; } /* Public */ @charset "utf-8"; 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; /* 谷歌不支持12px以下字号 */ font-family:"微软雅黑";} a{ text-decoration: none; } .clear,.cle {clear:both;} a,area { blr:expression(this.onFocus=this.blur()) } /* 去掉IE下链接虚线框 */ a:focus { outline: none; } /* 去掉火狐下链接虚线框 */ /* end_Public */ /*public*/ /*ea_h*/ /*xn_n_14_wrap*/ .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;/* background: #023894; */} .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(/template/images/CgAGfFomGcaAMqUxAAA2z-2H8XY057.png)center no-repeat rgba(251,251,251,.9);} #type1Ul_t201 {background: url(/template/images/CgAGfFomGiWAAsFYAAA3Ngr67Sk852.png) center no-repeat rgba(251,251,251,.9);} #type1Ul_t301 {background: url(/template/images/CgAGfFomGuKAfpY2AAA4TeUGZDE189.png) center no-repeat rgba(251,251,251,.9);} #type1Ul_t401 {background: url(/template/images/CgAGfFomGx6ASZH-AAA4H-AAlAo761.png) center no-repeat rgba(251,251,251,.9);} #type1Ul_t501 {background: url(/template/images/CgAGfFolA1SAZGc6AAAszqTfnnI664.jpg) center no-repeat rgba(251,251,251,.9);} #type1Ul_t601 {background: url(/template/images/CgAGfFomGnuADn3wAAA4rtlDf2g013.png) center no-repeat rgba(251,251,251,.9);} #type1Ul_t701 {background: url(/template/images/CgAGfFomGq2AM5DdAAA2yXf83yE236.png) center no-repeat rgba(251,251,251,.9);} #type1Ul_t801 {background: url(/template/images/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(/template/images/bg113747.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;} /*end_xn_n_14_wrap*/ /* t_logo */ .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;} /* end_t_logo */ /* t_search */ #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;} /* end_t_search */ /*top*/ .top{width: 100%;z-index:99;position: fixed;background: url(/template/images/ihpsp1_top_bg3747.html) #fff repeat-x;top: 0;} .t_t{position:relative; z-index:100; width:1200px; margin:0 auto; } div#ea_ba {margin-top: 100px;} /*end_top*/ /*ea_h*/ /*ea_ba*/ /*about_banner*/ .about_banner{width:100%; height:215px;overflow:hidden;position:relative;margin:0 auto;} .about_banner_m{z-index:0; width:1920px; height:215px; position:absolute; left:50%; margin-left:-960px;} /*end_about_banner*/ /*products_banner*/ .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;} /*end_products_banner*/ /*.w1200 { width: 1200px; margin: 0 auto;} .banner {margin-top:-125px; position: relative; overflow: hidden; width: 100%; height: 790px; background-color: #000;} .banner ul li { position: absolute; left: 50%; margin-left:-50%; top: 0; width: 100%; height: 100%; min-width: 1200px; transform: scale(1.2); transform-origin: center; opacity: 0.2; z-index: 1;text-align: center;} .banner ul li a { display: block; width: 100%; height: 100%;} .banner ul li.on { transform: scale(1); transform-origin: center; transition: all 4s; opacity: 1; z-index: 2;} .banner .btns { position: absolute; left: 50%; bottom: 108px; height: 15px; text-align: center; z-index: 12;} .banner .btns span { cursor: pointer; width: 15px; height: 15px; margin: 0 8px; border-radius: 50%; border: none; background-color: #fff; display:inline-block;} .banner .btns span.cur { width: 15px; height: 15px; border-radius: 50%; background-color: #ffd500;opacity: 1 !important;}*/ .w1200 { width: 1200px; margin: 0 auto;} .banner { position: relative; overflow: hidden; width: 100%; height: 790px; background: rgba(255,255,255,.2);} .banner ul li { position: absolute; left: 50%; margin-left:-50%; top: 0; width: 100%; height: 100%; min-width: 1200px; opacity: 0.1;z-index: 1;text-align: center;} .banner ul li a { display: block; width: 100%; height: 100%;} .banner ul li.on { transition: all 1s; opacity: 1; z-index: 2;} .banner .btns {position: absolute; left: 50%; bottom: 108px; height: 15px; text-align: center; z-index: 12;} .banner .btns span {cursor: pointer; width: 15px; height: 15px; margin: 0 8px; border-radius: 50%; border: none; background-color: #fff; display:inline-block;opacity: 1 !important;} .banner .btns span.cur { width: 15px; height: 15px; border-radius: 50%; background-color: #ffd500;opacity: 1 !important;} /*xn_ba_js_1_banner*/ /** 显示宽高 **/ .xn_ba_js_1_banner{width:100%;height: 520px;visibility:hidden;overflow:hidden;position:relative; display: none;} .xn_ba_js_1_bigImg img {width:1920px;height: 790px;border:0;} .xn_ba_js_1_element{position: absolute;} /** button **/ .xn_ba_js_1_btn{top: 672px;cursor:pointer;position:relative;padding:0;margin:0 auto;} .xn_ba_js_1_btn li{float:left;list-style:none;padding:0;margin:0;width: 10px;height: 10px;margin-left: 6px;border-radius: 5px;} .xn_ba_js_1_element_btn{ background: #fff; } .xn_ba_js_1_element_btn:hover,.xn_ba_js_1_element_btn_on{ width: 24px !important; background: #fff; } /** 字体属性 **/ .xn_ba_js_1_zt{white-space: nowrap;color:#FFFFFF;text-align:left;position:absolute;font-family:微软雅黑;} .xn_ba_js_1_A0{left:480px;top:100px;font-size:40px;color:#e21b14;font-weight:bold;} .xn_ba_js_1_A1{left:480px;top:160px;font-size:14px;color:#d30a01;} .xn_ba_js_1_A2{left:480px;top:180px;font-size:14px;color:#d30a01;} .xn_ba_js_1_B0{left:1020px;top:100px;font-size:40px;color:#e21b14;font-weight:bold;} .xn_ba_js_1_B1{left:1020px;top:155px;font-size:18px;color:#d30a01;} .xn_ba_js_1_C0{left:1070px;top:100px;font-size:36px;color:#e21b14;font-weight:bold} .xn_ba_js_1_C1{left:1070px;top:155px;font-size:14px;color:#d30a01;} /*end_xn_ba_js_1_banner*/ /*ea_ba*/ /*ea_c*/ /*n_content_right_name_r*/ .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{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;} /*end_n_content_right_name_r */ /*n_content_left_t*/ .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:20px;line-height:18px;overflow:hidden;text-align:center;overflow:hidden;} /*end_n_content_left_t*/ /*n_content_left_cnt */ .n_content_left_cnt{width:1200px;height:auto;padding-top:16px;overflow:hidden;text-align:center;margin: 0 auto;} .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;} /*end_n_content_left_cnt */ /*xn_c_index_251_wrap*/ .xn_c_index_251_wrap{width:100%;overflow:hidden;padding-top:18px;} .xn_c_index_251_box{width: 1200px; margin:0 auto;overflow:hidden;} .xn_c_index_251_bott{width:100%;overflow:hidden;text-align:center;} .xn_c_index_251_ul{overflow:hidden;display:inline-block;margin:0 auto;} .xn_c_index_251_ul>li:nth-child(3n){margin-right: 0; } .xn_c_index_251_ul>li:nth-child(3n+1) {margin-left: 75px; } .xn_c_index_251_li{width:335px;float: left;overflow: hidden;margin-right: 25px;margin-bottom: 30px;} .xn_c_index_251_img{width:335px;height:195px;overflow: hidden;} .xn_c_index_251_img img{width: 100%;height:100%;border:none;display: block;transition: 1s;-moz-transition: 1s;-webkit-transition: 1s;-o-transition: 1s;} .xn_c_index_251_img img:hover{transform:scale(1.2);-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform: scale(1.2);} .xn_c_index_251_bottom_wrap{border:1px solid #dddddd;border-top:none;overflow:hidden;padding:2px 0 5px;overflow:hidden;text-align:left;} .xn_c_index_251_title{width:98%; height:42px;overflow:hidden;margin:0 auto;} .xn_c_index_251_title>a{display:block;height:42px;line-height:42px;font-size:18px;color:#000;font-weight:bold;text-indent:18px;white-space: nowrap; text-overflow:ellipsis; /*溢出省略号，支持ie、safari（webkit）*/ -o-text-overflow:ellipsis; /*溢出省略号，支持opera*/ -moz-binding:url('ellipsis.html#ellipsis');/*溢出省略号，支持firefox*/ overflow:hidden;/*溢出隐藏*/transition:all 0.5s;} .xn_c_index_251_content{width: 98%;margin:0 auto; height: 50px; line-height: 25px;font-size: 16px;color:#666666;overflow:hidden;text-indent:35px; } .xn_c_index_251_li:hover .xn_c_index_251_title a{color:#023894;} /*end_xn_c_index_251_wrap*/ /*xn_c_teachers_2_wrap*/ .xn_c_teachers_2_wrap{width:100%;margin:0 auto;overflow:hidden;padding-top:0px;} .xn_c_teachers_2_wbox{width:1012px;margin: 10px auto;} .xn_c_teachers_2_wbox>div{padding-left:75px;background:url(/template/images/teachers_0190f8.png?d=20170825135023417) left 29px top 43px no-repeat;margin-bottom:33px;-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;border: 1px solid #fff;position: relative;top: 0;} .xn_c_teachers_2_wbox>div:hover{border: 1px solid #003894;box-shadow: 0 0 10px 0px rgba(2, 56, 148, 0.51);background:url(/template/images/teachers_0290f8.png?d=20170825135023417) left 29px top 43px no-repeat;-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;top: -5px;} .xn_c_teachers_2_nsimg{display:none} .xn_c_teachers_2_nscont{overflow:hidden;padding-top:10px;position: relative;} .cnt1_more {position: absolute;bottom: 20px;right: 20px;} .cnt1_more a {line-height: 30px;font-size: 16px;color: #666666;} .cnt1_more a:hover {color: #023894;} .xn_c_teachers_2_nstitle{overflow:hidden;height:38px;} .xn_c_teachers_2_nstitle>a{display:block;height:38px;line-height:38px;font-size:18px;color:#000;font-weight:bold;white-space: nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -moz-binding:url('ellipsis.html#ellipsis'); 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_teachers_2_wbox>div:hover .xn_c_teachers_2_nstitle>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_teachers_2_bottom_wrap{overflow:hidden;padding-bottom:14px;} .xn_c_teachers_2_nsneirong{width:800px;overflow:hidden;float:left;height:60px;line-height:30px;font-size:14px;color:#666666;} .xn_c_teachers_2_nstime{float:right;overflow:hidden;margin-right:20px;height:30px;line-height:30px;font-size:14px;color:#666666;} .xn_c_teachers_2_nstime>span{float:left;} /*end_xn_c_teachers_2_wrap*/ /*xn_c_products_12_wrap*/ .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;} /*end_xn_c_products_12_wrap*/ /*xn_c_products_12g_wrap*/ .xn_c_products_12g_wrap{width:1200px;margin:0 auto;overflow:hidden;padding-top:18px;} .xn_c_products_12g_wbox{width:100%;overflow:hidden;padding-top:8px;} .xn_c_products_12g_wbox>div{float:left;margin:0 25px 36px;width:250px;} .xn_c_products_12g_lftbox{width:244px;height:160px;border:3px solid #fff;box-shadow:0 0px 10px 0 rgba(0,0,0,0.6);} .xn_c_products_12g_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_12g_lftbox>a{display:block;overflow:hidden;width:100%;height:100%;} .xn_c_products_12g_ritbox{overflow:hidden;width:100%;} .xn_c_products_12g_name{width:100%;height:54px;overflow:hidden;} .xn_c_products_12g_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_12g_wbox>div:hover .xn_c_products_12g_lftbox img{transform:scale(1.2);-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform: scale(1.2);} .xn_c_products_12g_wbox>div:hover .xn_c_products_12g_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_12g_xinhao,.xn_c_products_12g_time,.xn_c_products_12g_coent,.xn_c_products_12g_order,.xn_c_products_12g_more{display:none;} /*end_xn_c_products_12g_wrap*/ /*fy*/ .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;} /*end_fy */ /*xn_c_about_1_warp*/ .xn_c_about_1_warp{padding:26px 10px 0;overflow:hidden;} /*end_xn_c_about_1_warp*/ /*xn_c_index_350_wrap*/ .xn_c_index_350_wrap{width: 100%;height:auto;margin:20px auto;} .xn_c_index_350_inner{height:auto;overflow:hidden;} .xn_c_index_350_inner li{height: 205px;line-height:36px;overflow:hidden;cursor:pointer;} .xn_c_index_350_inner li.curr{height: 559px;overflow:hidden;} .xn_c_r1,.xn_c_index_350_inner li.curr .xn_c_r0{display: none;} .xn_c_index_350_inner li.curr .xn_c_r1{display: block;} .xn_c_r1,.xn_c_r0 {width: 100%; height: 100%;position: relative; } .xn_c_r1 span, .xn_c_r0 span {display: block;} .xn_c_r0_4 { font-size: 24px; color: #fff; text-align: center; margin-top: 260px; font-weight: bold;} span.xn_c_r0_5 {font-size: 18px; color: #fff; text-align: center; text-indent: -170px; } .xn_c_r0_4:hover {opacity: .8; } span.xn_c_r0_1 {width: 49%; height: 100%; float: left; text-align: right; line-height: 205px; font-size: 100px; color: #fff; padding-right: 1%; } span.xn_c_r0_2,span.xn_c_r0_3 {float: left; width: 50%; font-size: 18px; color: #fff; line-height: 40px; } span.xn_c_r0_2 {margin-top: 66px;} .xn_c_r1 a {width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0;} /*end_xn_c_index_350_wrap*/ /*xn_c_teachers_60_wrap*/ .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;} /*end_xn_c_teachers_60_wrap*/ /*xn_c_teachersv_4_wrap*/ .xn_c_teachersv_4_wrap{overflow:hidden;padding-top:18px;} .xn_c_teachersv_4_title{text-align: center;height:50px;line-height:50px;font-size: 12px;color:#333333;overflow:hidden;} .xn_c_teachersv_4_jia{overflow:hidden;height:34px;text-align:center;} .xn_c_teachersv_4_jia>div{display:inline-block;overflow:hidden;height:34px;line-height:34px;font-size:14px;color:#666;} .xn_c_teachersv_4_author{margin:0 50px;} .xn_c_teachersv_4_jia>div span{float:left;overflow:hidden;} /*end_xn_c_teachersv_4_wrap*/ /*xn_c_teachersv_10_wrap*/ .xn_c_teachersv_10_wrap{width:1115px;margin:0 auto;overflow:hidden;padding-top:35px;line-height:28px;color:#666666;font-size:14px;} /*end_xn_c_teachersv_10_wrap*/ /*n_main*/ .index_body .n_main{width: 100%; margin:0; padding:0; background:url(../../1.rc.xiniu.com/rc/Contents/36309/Images/incsp1_index_cbgce82.html?d=20170825135022526) 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)} } /*end_n_main*/ /*n_content_right_name*/ .n_content_right_name{width:1200px; margin:0 auto;position:absolute;overflow:hidden;padding-top:18px;} /*end_n_content_right_name*/ /*n_content_right*/ .n_content_right{position:relative; width:783px; height: auto; float:right; padding-bottom:20px;} /*end_n_content_right*/ /*n_content_right_m*/ .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;} /*end_n_content_right_m*/ /*i_tcase*/ .i_tcase{position: relative;width: 1200px;height: auto;top: -90px; z-index: 90;} .i_tcase_f{width:100%; height:100%; position:relative;} .i_tcase_m{width: 1200px;height:auto;overflow:hidden;} .i_tcase_main{width: 367px;height: 210px;float:left;margin-right: 10px;} .i_tcase_t{background:url(/template/images/icpsp1_index_probg3e3a.html) no-repeat; width:593px; height:27px; padding-left:20px; color:#000; text-align:left;} .i_tcase_t1{ float:left;} .i_tcase_t2{ float:left; margin:0 5px; } .i_tcase_t3{ float:left;} .i_tcase_img{position: relative;overflow: hidden;height: 203px;} .i_tcase_img img{width: 367px;height: 203px;} .i_tcase_main_name{ position:absolute; left:180px; top:0; width:300px; height:20px; line-height:20px; font-size:12px; white-space: nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; -moz-binding:url('ellipsis.html#ellipsis'); } .i_tcase_main_name1{ color: #000; font-weight:bold;} .i_tcase_main_name2 a{color: #C00; text-decoration:none; font-weight:bold;} .i_tcase_main_name2 a :hover{color: #C00; text-decoration: underline;} .i_tcase_main_cnt{position:absolute; left:180px; top:24px; font-size:12px; } .i_tcase_main_cnt1{ color: #000; font-weight:bold !important;} .i_tcase_main_cnt2{width:410px; line-height:18px; height:54px; display:block; overflow:hidden; color: #333; margin-top:3px;} .i_tcase_more{position:absolute; right:0; top:10px;} .i_tcase_more a{background:url(/template/images/icpsp1_index_commore13e3a.html) no-repeat; width:44px; height:11px; display: block;} .i_tcase_more a:hover{background:url(/template/images/icpsp1_index_commore23e3a.html) no-repeat; width:44px; height:11px;} .i_tcase_main:first-child {margin-left: 40px; } .i_tcase_img>a {display: none; width: 367px; height: 203px; position: absolute; background: url(/template/images/CgAGfFoBFbKAfVJPAAANxH01tWI037.png) center no-repeat; -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; } .i_tcase_main:hover a {display: block; -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; } .i_tcase_img:after { width：100%; height: 100%; content: ""; display: block; z-index: 11; top:0px; left: 0px; background: url(/template/images/CgAGfFnv3neAZ5wZAAAOCe_jSj8551.png) center no-repeat; position: absolute; transition: all 0.6s; opacity: 0; cursor: pointer; } .i_tcase_main:hover .i_tcase_img:after { opacity:1; top: 0; width: 100%; height: 203px; left: 0; } .i_tcase_main:first-child .i_tcase_img:after { } /*end_i_tcase*/ /*xn_c_index_175_wrap*/ .xn_c_index_175_wrap{width: 1127px;margin:20px auto;} .xn_c_index_175_topbox{width:800px;line-height:30px;} .xn_c_index_175_wbox{width: 100%;position:relative;/* overflow: hidden; */} .xn_c_index_175_nrwbox1{width: 100%;float:left;cursor:pointer;margin-top: 90px;overflow: hidden;} .xn_c_index_175_nrwbox2{width:200px;float:left;background:#dadada;cursor:pointer;} .xn_c_index_175_nrwbox3{width:200px;float:left;background:#58ff24;cursor:pointer;} .xn_c_index_175_nrwbox4{width:200px;float:left;background:#a5100f;cursor:pointer;} .xn_c_index_175_intro{width: 100%;height: 100px;line-height: 25px;overflow:hidden;font-size: 16px;color: #fff;margin-top: 11px;} .xn_c_index_175_img img{width:200px;height:100px;} .xn_c_index_175_col>span {display: inline-block; } .xn_c_index_175_col {position: relative;} .xn_c_index_175_col>a {position: absolute;z-index: 11;width: 300px;height: 100%;} .xn_c_index_175_colName {background: url(/template/images/fangan3e3a.png) left center no-repeat; height: 46px; padding-left: 50px; font-size: 24px; color: #023894; line-height: 46px; } .xn_c_index_175_sol_line {font-size: 24px; color: #023894; } .xn_c_index_175_ename {font-size: 18px; color: #b6bcb6; } .xn_c_index_175_more a {display: block; width: 140px; height: 35px; border: 1px solid #fff; line-height: 35px; text-align: center; font-size: 16px; color: #fff; margin-top: 25px;} .xn_c_index_175_img {width: 536px; height: 260px; box-sizing: border-box; border: 6px solid #fff; margin: 0px; float: left; } .xn_c_index_175_img img {width: 100%; height: 100%; } .xn_c_index_175_boxx {float: right; width: 500px; height: 260px; } .xn_c_index_175_name {height: 60px;} .xn_c_index_175_name a {line-height: 75px; font-size: 30px; color: #fff; } .xn_c_index_175_funame {font-size: 16px; color: #fff; height: 20px; } .xn_c_index_175_intro br {display: none; } .xn_c_index_175_more a:hover {color: #023894; border-color: #023894; } .xn_c_index_175_name a:hover {color: #023894; } .xn_c_index_175_box1 {margin-top: 90px;} .xn_c_index_175_box1:nth-child(2n) .xn_c_index_175_img {float: right; } .xn_c_index_175_box1:nth-child(2n) .xn_c_index_175_boxx {float: left; } .xn_c_index_1751_wrap{width: 1127px;margin:20px auto;} .xn_c_index_1751_topbox{width:800px;line-height:30px;} .xn_c_index_1751_wbox{width: 100%;position:relative;/* overflow: hidden; */} .xn_c_index_1751_nrwbox1{width: 100%;float:left;cursor:pointer;margin-top: 90px;overflow: hidden;} .xn_c_index_1751_nrwbox2{width:200px;float:left;background:#dadada;cursor:pointer;} .xn_c_index_1751_nrwbox3{width:200px;float:left;background:#58ff24;cursor:pointer;} .xn_c_index_1751_nrwbox4{width:200px;float:left;background:#a5100f;cursor:pointer;} .xn_c_index_1751_intro{width: 100%;height: 100px;line-height: 25px;overflow:hidden;font-size: 16px;color: #fff;margin-top: -1px;} .xn_c_index_1751_img img{width:200px;height:100px;} .xn_c_index_1751_col>span {display: inline-block; } .xn_c_index_1751_colName {background: url(/template/images/fangan3e3a.png) left center no-repeat; height: 46px; padding-left: 50px; font-size: 24px; color: #023894; line-height: 46px; } .xn_c_index_1751_sol_line {font-size: 24px; color: #023894; } .xn_c_index_1751_ename {font-size: 18px; color: #b6bcb6; } .xn_c_index_1751_more a {display: block; width: 140px; height: 35px; border: 1px solid #fff; line-height: 35px; text-align: center; font-size: 16px; color: #fff;margin-top: 26px; } .xn_c_index_1751_img {width: 536px; height: 260px; box-sizing: border-box; border: 6px solid #fff; margin: 0px; float: left; } .xn_c_index_1751_img img {width: 100%; height: 100%; } .xn_c_index_1751_boxx {float: right; width: 500px; height: 260px; } .xn_c_index_1751_name {height: 60px;} .xn_c_index_1751_name a {line-height: 75px; font-size: 30px; color: #fff; } .xn_c_index_1751_funame {font-size: 16px; color: #fff; height: 20px; } .xn_c_index_1751_intro br {display: none; } .xn_c_index_1751_more a:hover {color: #023894; border-color: #023894; } .xn_c_index_1751_name a:hover {color: #023894; } .xn_c_index_1751_box1 {margin-top: 90px;} .xn_c_index_1751_box1:nth-child(2n+1) .xn_c_index_1751_img {float: right; } .xn_c_index_1751_box1:nth-child(2n+1) .xn_c_index_1751_boxx {float: left; } .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.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; } /*end_xn_c_index_175_wrap*/ /*index_cnt*/ .index_body .index_cnt {width: 100%;background: url(/template/images/cbg13e3a.png) center 100px no-repeat; } .index_cnt_m{width:1200px; position:relative; margin:0 auto; } /*end_index_cnt*/ /*xn_c_index_15_wrap*/ .xn_c_100_wrap1{width:100%;height: 660px;} .xn_c_index_15_wrap {width:1127px;margin: 120px auto 100px;} .index_15_line{width:400px;background:url(/template/images/xn_c_index_139_onLine36d4.png) center center;height:3px;margin:0 auto;display: none;} .index_15_line span{ display:none;} .xn_c_index_15_hot {width: 357px;float:left;/* height:420px; */position: relative;margin-top:25px;} .xn_c_index_15_hotbox {width: 357px;position:relative;overflow:hidden;} .xn_c_index_15_item {width: 357px;display: block;} .xn_c_index_15_img {width: 357px;height: 413px;overflow: hidden;} .xn_c_index_15_img img {width: 357px;height: 413px;transition: .1s transform;transform: translateZ(0);} .xn_c_index_15_item:hover img {transform: scale(1.1, 1.1); transition: 0.5s transform; } .xn_c_index_15_itemc{height: 210px;width:100%;} .xn_c_index_15_date { font-size:12px; display:none; } .xn_c_index_15_title { margin-top:8px;font-size:16px; font-weight:normal; height:32px; width:540px; margin:0 auto; line-height:32px; color:#fff;} .xn_c_index_15_title a{color: #000;font-size: 18px;font-weight: bold;line-height: 40px;} .xn_c_index_15_title a:hover{color: #023894;} .xn_c_index_15_cont {font-size: 16px;color: #666;width: 100%;line-height: 30px;height: 90px;overflow:hidden;padding-top: 10px;} .xn_c_index_15_focus { position:absolute; width:400px; display:none;height:30px; top:270px; left:0; text-align:center; } .xn_c_index_15_focus span { width:15px; height:15px; background:#555; display:inline-block; margin:0 3px 0 0; cursor:pointer; } .xn_c_index_15_focus span.curr { background:#f00; } .xn_c_index_15_list {width: 700px;float:right;height:420px;margin-top:25px;} .xn_c_index_15_list ul li {width: 700px;height: 160px;overflow:hidden;margin-bottom:26px;border-bottom: 1px solid #dedede;margin-bottom: 60px;} .xn_c_index_15_list ul li h2 {color: #000;font-size: 18px;font-weight: bold;line-height: 25px;} .xn_c_index_15_list ul li h2 a {color: #404040;text-decoration:none;font-size: 16px;} .xn_c_index_15_list ul li h2 a:hover{color: #023984;text-decoration:none;} .xn_c_index_15_list ul li h4 { display:none;width:60px; height:30px; border:1px solid #555; } .xn_c_index_15_list ul li h4 img { width:60px; height:30px; } .xn_c_index_15_list ul li .xn_c_index_15_ldate {color: #023894;float:left;text-align:Center;font-size: 16px;height: 100px;width: 100px;border-right: 3px solid #dedede;} .xn_c_index_15_list ul li .xn_c_index_15_lcont {font-size:12px;line-height:20px;height:40px;color: #666;clear: both;overflow: hidden;} .xn_c_index_15_list ul li .xn_c_index_15_cont1 {width: 565px;float:Right;} .xn_c_index_15_lisDay{font-size: 50px;width:100%;display:block;color: #023894;height: 68px;line-height: 70px;} .xn_c_index_15_col>span {display: inline-block; } .xn_c_index_15_col {position: relative;} .xn_c_index_15_col>a {position: absolute;z-index: 11;width: 300px;height: 100%;} span.xn_c_index_15_colName {background: url(/template/images/newbg13e3a.png) right center no-repeat;height: 46px;padding-right: 50px;font-size: 24px;color: #023894;line-height: 46px;} span.xn_c_index_15_sol_line {font-size: 24px; color: #023894; } span.xn_c_index_15_ename {font-size: 18px; color: #b6bcb6; } span.xn_c_index_15_more {display: none; } li.xn_c_index_15_mli:nth-child(2n+1) .xn_c_index_15_img {float: left; } .xn_c_index_15_col {text-align: right;} .xn_c_index_16_date {font-size: 12px; color: #666; background: url(/template/images/time13e3a.png) left center no-repeat; padding-left: 15px; margin-top: 5px; float: left; } .xn_c_index_15_click {font-size: 12px; color: #666; background: url(/template/images/yan13e3a.png) left center no-repeat; padding-left: 15px; margin-top: 5px; float: left; margin-left: 22px; } .xn_c_index_15_tmore a {display: block;width: 88px;height: 25px;background: url(/template/images/more13e3a.png);margin-top: 15px;} .xn_c_index_15_tmore a:hover {opacity: .8; } /*end_xn_c_index_15_wrap*/ /*ea_c*/ /*seacr_st*/ .seacr_st{ width:1200px; margin:40px auto 0 auto; } .sear_head{ width: 1200px; height: 30px; font-size: 18px; color: #023894; text-align: center;line-height: 30px;overflow: hidden; } .search_nr{ width:1200px; height:auto; margin-bottom:17px; border-bottom:1px dashed #ebebeb;padding-bottom: 10px;overflow: hidden; } .search_title{width: 1188px;height:22px;line-height:22px; padding-left:12px; font-size:14px; } .search_title a{display: block;width: 1188px;height:22px;line-height: 22px;color: #050505;white-space: nowrap; text-overflow:ellipsis; /*溢出省略号，支持ie、safari（webkit）*/ -o-text-overflow:ellipsis; /*溢出省略号，支持opera*/ overflow:hidden;/*溢出隐藏*/ -moz-binding:url('ellipsis.xml#ellipsis');/*溢出省略号，支持firefox*/ } .search_title a:hover{ color:#023894; } .search_ms{ color:#737373; font-size:12px; padding-top:10px;line-height: 22px;} #EIMS_C_25_1_Top {width: 1200px; height: 40px; line-height: 40px; margin:10px auto;text-align: center; } #EIMS_C_25_1_Top ul { list-style: none; margin: 0px; padding: 0px; } #EIMS_C_25_1_Top ul li {width: 189px;height: 40px;overflow: hidden; margin: 0px; padding: 0px; text-align: center; line-height: 40px;display: inline-block;background: #e6e6e6;font-size: 18px;margin-left: 3px;margin-right: 3px; } #EIMS_C_25_1_Top ul li:hover{background: #023894;} #EIMS_C_25_1_Top ul li a{color: #fff;font-size: 18px;display:block;} #EIMS_C_25_1_Top ul li{*display: inline;} #EIMS_C_25_1_Content { width:1200px;overflow: hidden;margin-top: 40px;} #EIMS_C_25_1_TypeList{display: none;} /*end_seacr_st*/ /*ea_b*/ /*xn_f_21_wrap*/ .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: block;} .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;} /*end_xn_f_21_wrap*/ /*foot_tel*/ .foot_tel{position:absolute;width: 256px;top: -11px;right: 0px;color:#999;height: 110px;background: url(/template/images/footbgea87.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;} /*end_foot_tel*/ /*foot_nav*/ .foot_nav{width:900px;overflow:hidden;height:auto;text-align:left;/* padding-top:30px; */} .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;} /*end_foot_nav */ /*foot_copy*/ .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;} /*end_foot_copy*/ /*foot*/ .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;} /*end_foot*/ /*foot_wx*/ .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; } /*end_foot_wx*/ /*ea_b*/ /*ea_bg*/ /*ea_bg*/ /*ea_m*/ /*ea_m*/ /*ea_pi*/ /*ea_pi*/ /*ea_wj*/ /*ea_wj*/ .main-im{position:fixed;right:10px;top:300px;z-index:100;width:110px;height:272px;} .main-im .qq-a{display:block;width:106px;height:116px;font-size:14px;color:#0484cd;text-align:center;position:relative;} .main-im .qq-a span{bottom:5px;position:absolute;width:90px;left:10px;} .main-im .qq-hover-c{width:70px;height:70px;border-radius:35px;position:absolute;left:18px;top:10px;overflow:hidden;z-index:9;} .main-im .qq-container{z-index:99;position:absolute;width:109px;height:118px;border-top-left-radius:10px;border-top-right-radius:10px;border-bottom:1px solid #dddddd;background:url(/template/images/qq-icon-bg.png) no-repeat center 8px;} .main-im .img-qq{max-width:60px;display:block;position:absolute;left:6px;top:3px;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;} .main-im .im-qq:hover .img-qq{max-width:70px;left:1px;top:8px;position:absolute;} .main-im .im_main{background:#F9FAFB;border:1px solid #dddddd;border-radius:10px;background:#F9FAFB;} .main-im .im_main .im-tel{color:#000000;text-align:center;width:109px;height:105px;border-bottom:1px solid #dddddd;} .main-im .im_main .im-tel div{font-weight:bold;font-size:12px;margin-top:6px;} .main-im .im_main .im-tel .tel-num{font-family:Arial;font-weight:bold;color:#e66d15;} .main-im .im_main .im-tel:hover{background:#fafafa;} .main-im .im_main .weixing-container{width:110px;height:110px;border-right:1px solid #dddddd;background:#f5f5f5;border-bottom-left-radius:10px;background:url(/template/images/weixing-icon.png) no-repeat center center;float:left;} .main-im .im_main .weixing-show{width:112px;height:172px;background:#ffffff;border-radius:10px;border:1px solid #dddddd;position:absolute;left:-125px;top:-126px;} .main-im .im_main .weixing-show .weixing-sanjiao{width:0;height:0;border-style:solid;border-color:transparent transparent transparent #ffffff;border-width:6px;left:112px;top:134px;position:absolute;z-index:2;} .main-im .im_main .weixing-show .weixing-sanjiao-big{width:0;height:0;border-style:solid;border-color:transparent transparent transparent #dddddd;border-width:8px;left:112px;top:132px;position:absolute;} .main-im .im_main .weixing-show .weixing-ma{width:104px;height:103px;padding-left:5px;padding-top:5px;} .main-im .im_main .weixing-show .weixing-txt{position:absolute;top:110px;left:7px;width:100px;margin:0 auto;text-align:center;} .main-im .im_main .go-top{width:50px;height:47px;background:#f5f5f5;border-bottom-right-radius:10px;background:url(/template/images/totop-icon.png) no-repeat center center;float:right;} .main-im .im_main .go-top a{display:block;width:52px;height:47px;} .main-im .close-im{position:absolute;right:10px;top:-12px;z-index:100;width:24px;height:24px;} .main-im .close-im a{display:block;width:24px;height:24px;background:url(/template/images/close_im.png) no-repeat left top;} .main-im .close-im a:hover{text-decoration:none;} .main-im .open-im{cursor:pointer;margin-left:68px;width:40px;height:133px;background:url(/template/images/open_im.png) no-repeat left top;}