@charset 'utf-8';
body { font-family: 'Microsoft Yahei', Arial; background: #fff }
/*.scale_img  li img, .scale_img li img { -o-transition: all 1s linear 0s; transition: all 0.75s linear 0s }*/
/*.scale_img li:hover img, .scale_img li:hover img { -webkit-transform: scale(1.09) rotate(0deg) translateY(0); -ms-transform: scale(1.09) rotate(0deg) translateY(0); transform: scale(1.09) rotate(0deg) translateY(0) }*/


.fullSlide { position: relative; z-index: 1; clear: both; width: 100% }
.fullSlide .bd { margin: 0 auto; position: relative; z-index: 0; overflow: hidden }
.fullSlide .bd .con { width: 100% !important; height: auto !important; display: block }
.fullSlide .bd .li { width: 100% !important; overflow: hidden; text-align: center; background: no-repeat center top; z-index: 0 }
.fullSlide .bd .li img { display: block; height: auto !important; width: 100% }
.fullSlide .hd { position: absolute; width: 100%; height: 12px; left: 0; bottom:45px; text-align: center; cursor: pointer }
.fullSlide .hd li { display: inline-block; width: 12px; height: 12px; background: #fff; margin: 0 10px; border-radius: 50%; opacity: .6; -o-transition: all .3s ease; transition: all .3s ease }
.fullSlide .hd li.on { width: 36px; height: 12px; opacity: 1; border-radius: 5px }
.fullSlide p { display: none; position: absolute; top: 50%; width: 80px; height: 80px; z-index: 99; opacity: 1; text-align: center; margin-top: -40px }
.fullSlide .prev2 { left: 3% }
.fullSlide .next2 { right: 3% }
/**/
.seach{ height: 74px; line-height: 74px; border-bottom: 1px solid #d9d9d9; margin-bottom: 77px;}
.seach h3{ float: left; width: 810px;}
.seach h3 i{ color: #1d1d1d; font-size: 14px;}
.seach h3 i span{ color: #00a0e9; text-transform: uppercase;}
.seach h3 em a{font-weight: normal; color: #848484; font-size: 14px; margin-right: 22px;}
.seach h3 em a:hover{ color: #000; text-transform: uppercase;}
.sea{width:305px;height:33px;  background:url(../images/seach.png) no-repeat;float:right;position: relative; margin-top:23px;}
.sea .txt{overflow: hidden; float: left; padding-left: 23px; color: #454545; font-size: 14px; height: 33px; line-height: 33px; border: none; background: none; color: #454545; font-size: 14px; width: 248px;}
.sea .btn{width:33px; height:33px;cursor: pointer;z-index:67; position: relative; border: none; outline: none; background: none; float: left;}
input::-webkit-input-placeholder{color:#333;font-size:16px;}
��������input:-moz-placeholder{��������color:#333;font-size:16px;}
��������input::moz-placeholder{color:#333;font-size:16px;}
��������input:-ms-input-placeholder{��������color:#333;font-size:16px;}
/**/
.zuz{ height:685px;overflow: hidden;}
.zuz dl{ overflow: hidden; padding-bottom: 58px;}
.zuz dl dt{ overflow: hidden; height: 406px; float: left;}
.zuz dl dd{ float: right; width: 513px;}
.zuz dl dd h3{ height: 158px;background: url(../images/z_h.jpg) no-repeat left bottom; font-size: 41px; color: #000000; line-height: 100%; font-weight: normal; margin-bottom: 34px;}
.zuz dl dd h3 i{ display: block; font-weight: bold; padding: 6px 0 13px 73px; font-size: 49px; line-height: 100%;}
.zuz dl dd p{ font-size: 16px; color: #666; line-height: 36px; height: 139px;}
.zuz dl dd em{ display: block; color: #131313; font-size: 16px; font-weight: bold;}
.zuz dl dd em img{ vertical-align: middle;}
.zuz ul li{ float: left; margin-right: 16px; width: 227px; text-align: center; line-height: 100%; font-size: 0;}.zuz ul li:last-of-type{ margin-right: 0;}
.zuz ul li i{ display: block; line-height: 100%; padding-top: 27px; font-size: 14px; color: #000000;background: url(../images/zgbg.jpg) no-repeat;}
    /**/
.product{ height:707px;background: url(../images/product.jpg) no-repeat center 0; overflow: hidden; margin-bottom: 76px; box-sizing: border-box; padding-top:68px;}
h2{ text-align: center; line-height: 100%; color: #101116; font-size: 20px;font-weight: normal; padding-bottom: 63px;}
h2 i{ display: block; line-height: 100%;font-weight: bold; padding-bottom: 18px; color: #000000; font-size: 48px;}
h2 i span{ color: #0076d7; padding-left: 49px;background: url(../images/h2.png) no-repeat 18px 18px; display: inline-block; line-height: 100%;}
.pro_l{ width: 401px;background: url(../images/pro_l.jpg) no-repeat;}
.pro_lb ul li{ float: left; width: 194px; margin-right: 12px; font-size: 0; line-height: 0;}
.pro_lb ul li img{ width: 194px;}
.pro_lb ul li i{ display: block; text-align: center; font-size: 16px; color: #000000; line-height: 100%; padding-top: 18px;}
.pro_la{ height: 264px;}
.pro_r ul li{ font-size: 0; line-height: 0; overflow: hidden;}
.pro_la h3{ height: 67px; line-height: 67px; padding-left: 82px;}
.pro_la h3 a{ color: #fff; font-size: 20px;}
.pro_la h3 span{ display: inline-block; float: right; padding-right: 30px;}
.pro_la h3 span a{font-weight: normal; font-size: 16px; color: #fff; text-transform: uppercase; font-weight: normal;}
.pro_la ul{ overflow: hidden; width: 401px; padding-top: 30px;}
.pro_la ul li{ float: left; margin-bottom: 30px; line-height: 100%;}
.pro_la ul li a{ color: #656565; font-size: 16px; line-height: 100%; padding: 0 16px; border-right: 1px solid #e0e0e0; display: inline-block;}
.pro_la ul li:nth-child(3n) a{ padding-right: 0; border-right: none;}
.pro_la ul li:hover a{ color: #0076d7; text-decoration: underline;font-weight: bold;}
    /**/
.product2{padding-bottom: 76px;}
.p_lis{background: url(../images/product2.jpg) no-repeat; height: 178px;}
.p_lis h3{ height: 67px; line-height: 67px; padding-left: 82px;}
.p_lis h3 a{ color: #fff; font-size: 20px;}
.p_lis h3 span{ display: inline-block; float: right; padding-right: 30px;}
.p_lis h3 span a{font-weight: normal; font-size: 16px; color: #fff; text-transform: uppercase; font-weight: normal;}
.p_lis ul{ overflow: hidden; padding-top: 32px; width: 1200px;}
.p_lis ul li{ float: left; line-height: 100%;}
.p_lis ul li  a{ display: inline-block; line-height: 100%; color: #656565; font-size: 16px; padding: 0 20px; border-right: 1px solid #e3e3e3;}
.p_lis ul li:last-of-type  a{ border-right: none;}
.p_lis ul li  a:hover{ color: #0076d7; font-size: 16px; text-transform: uppercase; text-decoration: underline;}

.p_on ul{ clear: both;}
.p_on ul li{ /*float: left;*/display:inline-block; width: 280px; margin: 0 22px 25px 0; box-shadow: 0 0 2px rgba(0,0,0,0.2);}.p_on ul li:nth-child(4n){ margin-right: 0;}
.p_on ul li img{ width: 280px;}
.p_on ul li span{ display: block; overflow: hidden; border: 2px solid #dfdfdf; font-size: 0; line-height: 0;}
.p_on ul li i{ display:block; text-align: center; height: 55px; line-height: 55px; overflow: hidden; font-size: 15px; color: #222222;}
.p_on ul li:hover span{border: 2px solid #117fda; }
.p_on ul li:hover{box-shadow: 1px 1px 5px rgba(0,0,0,0.2);}
.p_on ul li:hover i{color: #0076d7;font-weight: bold;}
  /**/
.case{background: url(../images/case.jpg) repeat-x;overflow: hidden; margin-bottom: 99px; box-sizing: border-box; padding-top: 85px;}
.case h2{ padding-bottom: 40px;}
.c_lis{ overflow: hidden;background: url(../images/c_lis.jpg) no-repeat; height: 106px;}
.c_lis ul{ width: 1300px;}
.c_lis ul li{ float: left;}
.c_lis ul li a{ display:block; padding: 38px 0 0 63px; line-height: 100%; height: 70px; font-size: 18px; font-weight: bold; color: #212020;}
.c_lis ul li:first-child{ width:226px;}
.c_lis ul li:nth-child(2){ width:199px;}
.c_lis ul li:nth-child(3){ width:182px;}
.c_lis ul li:nth-child(4){ width:224px;}
.c_lis ul li:nth-child(5){ width:196px;}
.c_lis ul li a:hover{ color: #0076d7;background: url(../images/c_lis2.jpg) no-repeat;}
.c_lis ul li:nth-child(2) a:hover{background: url(../images/c_lis2.jpg) no-repeat -226px 0;}
.c_lis ul li:nth-child(3) a:hover{background: url(../images/c_lis2.jpg) no-repeat -425px 0;}
.c_lis ul li:nth-child(4) a:hover{background: url(../images/c_lis2.jpg) no-repeat -607px 0;}
.c_lis ul li:nth-child(5) a:hover{background: url(../images/c_lis2.jpg) no-repeat -831px 0;}
.c_lis ul li:nth-child(6) a:hover{background: url(../images/c_lis2.jpg) no-repeat -1027px 0;}
.c_lis ul li:nth-child(6){ width: 180px;}

.c_on{ overflow: hidden; margin-bottom: 63px;}
.c_on ul li{ float: left; width: 50%; position: relative; font-size: 0; line-height: 0;}
.c_on ul li img{ display: inline-block; width: 100%;}
.c_on ul li em{ position: absolute;}
.c_on ul li em span{ display: none;}
.c_on ul li:first-child em{ right: 0; background: rgba(0,0,0,0.85); bottom: 0; width: 76%; box-sizing: border-box; padding-left: 30px; padding-bottom: 30px;}
.c_on ul li em i{ display: block; font-size: 24px; font-weight: bold; line-height: 100%; color: #fff; padding-top: 29px;background: url(../images/c_mm.png) no-repeat 90% 29px; line-height: 26px;}
.c_on ul li:nth-child(2) em{ left: 0; background: rgba(0,0,0,0.85); bottom: 0; width: 76%; box-sizing: border-box; padding-left: 30px; padding-bottom: 30px;}
.c_on ul li:hover em{background: rgba(0,118,215,0.85);}
.c_on ul li:hover em span{display: block; font-size: 15px; color: #fff; opacity: 0.8; line-height: 23px; padding: 23px 39px 0 0;}

.c_om{ position: relative;}
.c_uu{ position: absolute; z-index: 55; cursor: pointer; top: 129px; left: -61px;}
.c_dd{ position: absolute; z-index: 55; cursor: pointer; top: 129px; right: -61px;}
.c_om ul li{ float: left; width: 386px; margin-right: 21px; font-size: 0; line-height: 0; background: #fff; box-shadow:0 0 5px rgba(0,0,0,0.2); margin-bottom: 5px;}
.c_om ul li img{ width: 386px;}
.c_om ul li i{ display: block; height: 75px; line-height: 75px; font-size: 16px; color: #000000; padding-left: 26px;background: url(../images/c_m.jpg) no-repeat 321px 35px;}
    /**/
.yss{ overflow: hidden; background: #f5f5f5; padding-top: 80px; height: 910px; margin-bottom: 102px;}
.yss h2{ padding-bottom: 37px;}
.ys_on1{ overflow: hidden;}
.ys_on1 ul li{background: url(../images/ys_on1.jpg) no-repeat center 0; height: 788px;}
.ys_on1 ul li em{ display: block; width: 1200px; margin: 0 auto; color: #fff; padding-top: 330px;}
.ys_on1 ul li em b{ display: block; line-height: 120%; font-size: 64px;}
.ys_on1 ul li em b span{ font-size: 52px; line-height: 100%;}
.ys_on1 ul li i{ display: block; padding-top: 43px; font-size: 15px; line-height: 30px;}
.y_ud{ position: relative; z-index: 55!important;  width:1200px; margin: -130px auto 0;}
.y_uu{ float: left; margin-right: 24px; cursor: pointer;}
.y_dd{ cursor: pointer;}
.ys_on2{ margin:-685px auto 0; width: 1200px; color: #fff; z-index: 55; height: 788px;}
.ys_on2 ul{ margin-left: 687px;}
.ys_on2 ul li{ height: 262px; box-sizing: border-box;padding: 71px 0 0 63px; border-bottom: 1px solid #a8afb4; font-size: 20px; font-weight: bold; cursor: pointer; position: relative;}.ys_on2 ul li:last-of-type{ border-bottom: none;}
.ys_on2 ul li i{ display: block; padding: 13px 0 49px 0;background: url(../images/y_mor.png) no-repeat 0 bottom;}
.ys_on2 ul li.cur:before{ position: absolute; content: ""; width: 25px; height: 63px; background: url(../images/y_lic.png) no-repeat; left: -25px; top: 85px;}
    /**/
.news{ padding-bottom: 132px;}
.news h2{ padding-bottom: 66px;}
.n_lis{ height: 51px; overflow: hidden;}
.n_lis ul li{ float: left; padding-right: 62px;}
.n_lis ul li a{ display: inline-block;font-weight: bold; color: #181818; font-size: 20px;padding-left: 37px;background: url(../images/n_io1.png) no-repeat; line-height: 23px;}
.n_lis ul li:nth-child(2) a{background: url(../images/n_io2.png) no-repeat; }
.n_lis ul li:nth-child(3) a{background: url(../images/n_io3.png) no-repeat; }
.n_lis ul li.cur a{background: url(../images/n_io11.png) no-repeat; color: #0076d7; font-weight: bold;}
.n_lis ul li:nth-child(2).cur a{background: url(../images/n_io21.png) no-repeat; color: #0076d7; font-weight: bold;}
.n_lis ul li:nth-child(3).cur a{background: url(../images/n_io31.png) no-repeat; color: #0076d7; font-weight: bold;}
.n_lis span{ float: right;}
.n_lis span a{ display: inline-block; font-size: 16px; color: #2d2d2d; font-weight: bold; line-height: 100%;}

.picScroll-left{ overflow:hidden; position:relative; background: #f7f7f7; height: 337px; margin-bottom: 30px;}
.picScroll-left .hd{ overflow:hidden; position: absolute; top: 267px; left: 350px;width: 248px; height: 70px; background: rgba(0,0,0,0.55); z-index: 55!important;}
.pageState{ color: #b2bcc1; line-height: 70px;font-weight: bold; font-size: 24px;}
.pageState span{ color: #fff; font-size: 36px; line-height: 100%; padding-left: 16px;}

.picScroll-left .hd .prev,.picScroll-left .hd .next{ display:block;  float:right; margin-right:10px; margin-top:25px;  overflow:hidden;
    cursor:pointer; }
.picScroll-left .hd .next{ background-position:0 -50px;  }
.picScroll-left .hd .prevStop{  }
.picScroll-left .hd .nextStop{  }
.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:32px; zoom:1; }
.picScroll-left .hd ul li{ float:left;  width:6px; height:6px; overflow:hidden; margin-right:12px; text-indent:-999px; cursor:pointer; background:#fff; border-radius: 6px; }
.picScroll-left .hd ul li.on{background: #0076d7; }
.picScroll-left .bd{ overflow: hidden;}
.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
.picScroll-left .bd ul li{ overflow:hidden;}
.picScroll-left .bd ul li .pic{ float: left; font-size: 0; line-height: 0;}
.picScroll-left .bd ul li .pic img{ width: 600px;}
.n_omt{ float: right; width: 502px; padding: 45px 45px 0 0;}
.n_omt h3 a{ display: block; font-weight: normal; color: #161616; font-size: 18px; line-height: 100%;}
.n_omt h3 span{ display: block; font-weight: normal; line-height: 100%; color: #8e8e8e; font-size: 12px; padding: 15px 0 35px 0;}
.n_omt p{ height: 125px; font-size: 16px; color: #666666; line-height: 30px;}
.n_omt h4 a{ display: block; padding-left: 37px; width: 135px; height: 44px; line-height: 44px;font-weight: normal; color: #fff; font-size: 16px;background: url(../images/n_mor.jpg) no-repeat 115px 18px #0076d7; }

.n_bom{ overflow: hidden;}
.n_bom ul li{ float: left; width: 548px; height: 50px; line-height: 50px; border-bottom: 1px solid #eee; overflow: hidden;background: url(../images/n_lim.jpg) no-repeat 0 23px;}
.n_bom ul li:nth-of-type(2n){ float: right;}
.n_bom ul li span{ display: inline-block; float: right; color: #9b9a9a; font-size: 12px;}
.n_bom ul li a{ display: inline-block; padding-left: 14px; color: #222222; font-size: 16px; width: 455px; overflow: hidden;height: 50px; line-height: 50px;}
.n_bom ul li a:hover{ color: #0076d7; }

    /**/
.about{ height:725px; /*background: url(../images/about_bg.jpg) no-repeat center 0;*/ overflow: hidden;box-sizing: border-box; padding-top:546px;}
.about p{ overflow: hidden;}
.about p em{ display: inline-block; float: left; padding-left: 45px; width:378px; color: #666666; font-size:20px; text-align: left;}
.about p em span{ display: block;font-weight: bold; line-height: 100%; font-size: 37px;padding-bottom:28px; color: #000000;}
.about p i{ display: inline-block; float: right; width:748px; padding:0 23px 0 0;}
.about p i a{ display: block; line-height: 100%; font-size: 14px; color: #333333; margin-bottom: 14px;font-weight: bold;}
.about p i b{ display: block; font-weight: normal; font-size: 14px; color: #898989; line-height: 24px;}
.about p i .morr{ color: #0076d7; display: inline-block;font-weight: normal;}
.about p i a:hover{ color: #0076d7; text-decoration: underline;}
    /**/
.list6{height:300px;}
.fenc{height: 430px; }
.f_tit{height: 52px; overflow: hidden;}
.f_tit li {float:left; font-size: 24px; color: #333333; line-height:100%;background: url(../images/f_tit.png) no-repeat right 5px; padding: 0 52px 0 36px;}
.f_tit li.on {font-weight: bold; color: #0076d7;}
.f_tit li:last-of-type{ background: none;}
.f_nr li{float:left; width:285px;margin-right:20px; font-size:0; line-height: 0;}
.f_nr li img {width:285px;}
.f_nr li span {display: block;margin-top:28px; height: 26px; line-height: 26px;text-align: center; font-size: 16px; color: #282828;}
.f_nr li span a{ display: block; color: #282828; line-height: 100%;}
.f_sc{ position: relative;}
    /**/
.links { height: 60px; overflow: hidden; position: relative; width: 1200px; margin: -60px auto 0;}
.links em { display: inline-block; font-style: normal; font-size: 16px; line-height: 90px;  color: #333333; font-weight: normal; float: left; padding-left: 34px; }
.links i { display: inline-block;float: right;}
.links a { font-size: 14px; color: #747474; line-height: 60px; display: inline-block; margin-right: 46px; transition: .3s ease; -o-transition: .3s ease ;  position: relative; z-index: 6;}
.links a:hover {text-decoration: underline; color: #eee;}
/**/
.btn,.pro_r ul li em strong,.btn21,.xw_l dl:before{ transition: all 0.3s linear 0s;}
.btn:hover{ text-decoration: underline; color: #fff; background-position: 115px 14px;}
.btn21:hover{background-position: 90% 3px;}
.xw_r ul li:hover .btn21{background-position: 90% 3px;}
.pro_r ul li em strong:hover{ background-position: 75px 5px;}
.zuz .content:before,.hezu .content:before{-webkit-animation:gogogo 0.95s infinite linear ;}
.xw_l dl:hover:before{    height: 121px;}
@-webkit-keyframes gogogo {
    0%{

        -webkit-transform: translateY(0px);

    }
    50%{
        -webkit-transform:translateY(9px);
    }
    100%{
        -webkit-transform:translateY(0px);
    }

}

/**/

@-webkit-keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown1 { -webkit-animation-name: fadeInDown1; animation-name: fadeInDown1 }
@-webkit-keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown2 { -webkit-animation-name: fadeInDown2; animation-name: fadeInDown2 }
@-webkit-keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft1 { -webkit-animation-name: fadeInLeft1; animation-name: fadeInLeft1 }
@-webkit-keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft2 { -webkit-animation-name: fadeInLeft2; animation-name: fadeInLeft2 }
@-webkit-keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 }
@-webkit-keyframes fadeInRight2 {
    from { -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight2 {
    from { -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight2 { -webkit-animation-name: fadeInRight2; animation-name: fadeInRight2 }
@-webkit-keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
@keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
.zoomLeft { -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
.zoomRight { -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
@-webkit-keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 }
@-webkit-keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2 }
@keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-moz-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-webkit-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-o-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}