@charset 'utf-8';
body { font-family: 'Microsoft Yahei', Arial; background: #fff }
.scale_img dt img, .scale_img li img { -o-transition: all 1s linear 0s; transition: all 1s linear 0s }
.scale_img dl:hover dt img, .scale_img li:hover img { -webkit-transform: scale(1.05) rotate(0deg) translateY(0); -ms-transform: scale(1.05) rotate(0deg) translateY(0); transform: scale(1.05) rotate(0deg) translateY(0) }
.fl{float:left;}
.fr{float:right;}
/**/
.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: 60px; text-align: center; cursor: pointer }
.fullSlide .hd li { display: inline-block; width: 12px; height: 12px; background: #fff; margin: 0 12px; 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; background: #0068b6;}
.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% }
/**/

/**/
h2{ text-align: center; line-height: 100%; font-size: 44px; padding-top: 76px;}
h2 a{font-weight: normal; color: #000; letter-spacing: 3px;}
h2 a:hover{ color: #0068b6;}
h2 span{ display: block; font-weight: normal; padding-top: 41px; font-size: 20px; color: #333; letter-spacing: 5px; line-height: 100%; padding-bottom: 40px;background: url(../h2.png) no-repeat center 15px;}
/**/
.tils{ overflow: hidden;background: url(../tils.jpg) no-repeat center 0; height:795px; box-sizing: border-box;}
.t_on1 h2 span{ padding-bottom: 25px;}
.t_on1 p{ height: 110px; font-size: 15px; color: #666; line-height: 26px; margin: 0 48px; text-align: center;}
.t_on1 ul{ overflow: hidden; height: 125px; padding-left: 148px;}
.t_on1 ul li{ float: left; font-size:16px; color: #555; padding: 0 60px; border-right: 1px solid #dcdcdc;}
.t_on1 ul li i{ display: block; line-height: 100%; padding-top:8px;}
.t_on1 ul li em{ display: inline-block; line-height: 100%;font-weight: bold;}
.t_on1 ul li em span{ display: inline-block;  font-weight: bold; font-size: 38px; font-family:Arial; line-height: 90%; color: #0068b6;}
.t_on1 ul li:last-of-type{ border-right: none;}
.t_on1 ul li b{ display: inline-block; width: 15px; font-size: 14px; line-height: 100%;}
.t_on2{ background: rgba(65,65,65,0.08)}
.t_on2 ul{ overflow: hidden;}
.t_on2 ul li{ float: left; width: 300px; box-sizing: border-box; padding:52px 63px 0; height: 283px; font-size: 15px; color: #666; line-height: 24px;background: url(../t_lin2.png) no-repeat right  49px;}
.t_on2 ul li:last-of-type{ background: none;}
.t_on2 ul li i{ display: block; height: 54px; padding-left: 46px; font-size: 24px; color: #333333;background: url(../t_io1.png) no-repeat; line-height: 32px; letter-spacing: 2px;}
.t_on2 ul li:nth-of-type(2) i{background: url(../t_io2.png) no-repeat;}
.t_on2 ul li:nth-of-type(3) i{background: url(../t_io3.png) no-repeat;}
.t_on2 ul li:nth-of-type(4) i{background: url(../t_io4.png) no-repeat;}
.t_on2 ul li:hover{ background: #0068b6; color: #fff;}
.t_on2 ul li:hover i{background: url(../t_io11.png) no-repeat; color: #fff;}
.t_on2 ul li:nth-of-type(2):hover i{background: url(../t_io21.png) no-repeat; color: #fff;}
.t_on2 ul li:nth-of-type(3):hover i{background: url(../t_io31.png) no-repeat; color: #fff;}
.t_on2 ul li:nth-of-type(4):hover i{background: url(../t_io41.png) no-repeat; color: #fff;}
/**/

.pro_bg{ overflow:hidden;} 
.pro .t_h2{margin:50px auto 55px; text-align: center; line-height: 50px;}
.pro_l{width:303px;overflow:hidden; background:url(../pro_lbg.jpg) no-repeat left top;}
.pro_l h4{ text-align: center; margin:40px auto 0; height:102px; overflow:hidden; font:bold 20px/28px "Microsoft Yahei"; }
.pro_l h4 i{display:block; font:14px/16px "Times New Roman", Times, serif; text-transform: uppercase; color: #fff;}
.pro_l h4 a{ color:#fff;}
.pro_l h3{ margin:0 auto 0px; width: 262px; overflow: hidden; font:bold 16px/40px "Microsoft Yahei";}
.pro_l h3 a{ color:#fff; display: inline-block; border: 2px solid #4a4645; padding-left: 18px; width:240px; height:40px; overflow:hidden;}
.pro_l h3 a:hover,.pro_l .cur a{border: 2px solid #0068b6; background: #0068b6; text-decoration: none;}
.pro_l ul{margin-left: 28px; margin-bottom: 20px; width: 253px; overflow: hidden;}
.pro_l ul li{ height:30px; overflow:hidden; font-size:14px; font-family:"微软雅黑", "Microsoft Yahei"; padding-left: 14px; background:url(../ico01.png) no-repeat left center; line-height:30px; width:44%;float:left;}
.pro_l ul li a{ color:#000; height:30px; line-height:30px; display:block; width:100px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.pro_r{width:876px;overflow:hidden; background:url(../pro_bg01.jpg) no-repeat left top;}
.pro_r h2{margin: 19px 10px; width: 772px; height:62px; overflow:hidden; font:bold 20px/62px "Microsoft Yahei"; background:url(../pro_l1.png) no-repeat left bottom;padding-top:0px; text-align:left;}
.pro_r h2 a{color: #0068b6; font-weight:bold; letter-spacing: inherit;}
.pro_r h2 span{ font:14px/62px "Microsoft Yahei";padding-right: 26px; background:url(../pro_ic2.png) no-repeat 32px center;}
.pro_r h2 span a{color: #666;}
.pro_r dl{ margin:0 auto; width: 782px; overflow:hidden;}
.pro_r dt {float: left; width:370px; height:322px; overflow:hidden;}
.pro_r dt img{width:370px; height:322px;}
.pro_r dd{float: right; width:370px; padding-top: 25px; overflow:hidden;}
.pro_r dd h3{ margin-bottom:20px; border-bottom: 1px solid #cdcccc; overflow:hidden; font: bold 16px/68px "Microsoft Yahei";}
.pro_r dd h3 a{ color:#1f1a17;}
.pro_r dd h3 a:hover{ text-decoration:none;}
.pro_r dd p{ font:14px/32px "Microsoft Yahei"; color: #555;}
.pro_r ul{width: 876px;  overflow:hidden;}
.pro_r li{ float:left; text-align: center; width:280px; line-height: 0px;border: 1px solid #eee;margin: 5px;}
.pro_r li img{padding: 7px; width:266px; height:241px;}
.pro_r li p{ display:block;  width:280px; height:50px;  font:14px/50px "Microsoft Yahei"; color: #fff;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;background-color:#0068b6} 
.pro_r li em{position: absolute; left:-2px; top:0px; width:296px; height:255px; display:none;}
.pro_r .nones{margin-left: -8px;}
.pro_r li a:hover{text-decoration: none;}
.pro_r li a:hover em{display: block;}
.pro_r .pro_li1{margin-left: 0px;}
.pro_r .pro_li1 em{left:0px;}
.pro_r .pro_li4,.pro_r .pro_li5,.pro_r .pro_li6{margin-top: -6px;}
.tel01{ clear: both; margin: 0px auto 0; width: 368px;}
.tel_sp{display: inline-block; height: 44px; margin-top:33px; }
.tel_sp a{float: left; margin:0 4px; display:block; width:176px; height:44px; text-align:center; font: bold 18px/42px "Microsoft Yahei";color: #fff; background:url(../al_b1.png) no-repeat left top;}
.tel_sp .tel_b2{float: right; color: #333; background:url(../al_b2.png) no-repeat left top;}
.tel_sp a:hover{text-decoration: none;}
.tel01 p{text-align: center; color: #666;font:16px/74px "Microsoft Yahei";}
.tel01 p b{color: #e60012;font:bold 36px/74px "Times New Roman", Times, serif;}
/**/
.cpys{background: url(../cpys.jpg) no-repeat center 0; height: 820px;}
.cpys h2 span{padding-bottom: 44px;}
.cpys ul{ overflow: hidden;}
.cpys ul li{ width: 446px; float: left; height:173px;}
.cpys ul li:nth-of-type(2n){ float: right; width: 362px;}
.cpys ul li img{ display: inline-block; float: left; width: 118px; height: 118px; box-sizing: border-box; border: 2px solid #858585; border-radius: 118px; margin-top: 27px; margin-right: 10px;-webkit-transition:all .8s ease-in-out;-moz-transition:all .8s ease-in-out;transition:all .8s ease-in-out}
.cpys ul li:hover img{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}
.cpys ul li em{ display: inline-block; float: left; font-size: 15px; color: #333; line-height: 20px;}
.cpys ul li em i{ display: block;font-weight: bold; line-height: 100%; margin-top: 30px; padding-bottom: 23px; position: relative; font-size: 24px;}
.cpys ul li em i:before{ position: absolute; left: 2px; content: ""; top: 37px; height: 2px; background: #0068b6; width: 16px;}
.cpys ul li:nth-of-type(2n) img{ float: right; margin-left: 10px; margin-right: 0;}
.cpys ul li:nth-of-type(2n) em{ text-align: right; float: right;}
.cpys ul li:nth-of-type(2n) i:before{ left: 188px;}
.cpys ul li:nth-of-type(2) i:before{left: 181px;}
.cpys ul li:nth-of-type(4) i:before{left: 159px;}
.cpys ul li:nth-of-type(6) i:before{left: 190px;}
/**/
.jij{ overflow: hidden; height:882px;background: url(../jij.jpg) no-repeat center bottom;}
.jj_nav{ height: 121px; overflow: hidden;}
.jj_nav li{ float: left; width: 200px; box-sizing: border-box; text-align: center; border-right: 1px solid #e5e5e5; height: 82px; ;}
.jj_nav li:last-of-type{ border-right: none;}
.jij .jj_nav li a span{ display: block; background: #fff; padding-top: 9px;}
.jij .jj_nav li a{display: block;line-height: 100%; padding-top: 55px; font-size: 20px; color: #333; }
.jij .jj_nav li:nth-child(1) a{background: url(../j_li1.jpg) no-repeat center 0;}
.jij .jj_nav li:nth-child(2) a{background: url(../j_li2.jpg) no-repeat center 0;}
.jij .jj_nav li:nth-child(3) a{background: url(../j_li3.jpg) no-repeat center 0;}
.jij .jj_nav li:nth-child(4) a{background: url(../j_li4.jpg) no-repeat center 0;}
.jij .jj_nav li:nth-child(5) a{background: url(../j_li5.jpg) no-repeat center 0;}
.jij .jj_nav li:nth-child(6) a{background: url(../j_li6.jpg) no-repeat center 0;}
.jij .jj_nav li:hover a,.jj_nav li.on a{font-weight: bold; color: #0068b6;}
.jij .jj_nav li:nth-child(1).on a{background: url(../j_li1.jpg) no-repeat center -55px;}
.jij .jj_nav li:nth-child(2).on a{background: url(../j_li2.jpg) no-repeat center -55px;}
.jij .jj_nav li:nth-child(3).on a{background: url(../j_li3.jpg) no-repeat center -55px;}
.jij .jj_nav li:nth-child(4).on a{background: url../(j_li4.jpg) no-repeat center -55px;}
.jij .jj_nav li:nth-child(5).on a{background: url(../j_li5.jpg) no-repeat center -55px;}
.jij .jj_nav li:nth-child(6).on a{background: url(../j_li6.jpg) no-repeat center -55px;}


.jj_on1 dl dt{ margin-left: -361px; float: left;}
.jj_on1 dl dd{ float: right; width: 533px; margin-top: 65px;}
.jj_on1 dl dd h3{ height: 74px;}
.jj_on1 dl dd h3 a{ display: block; line-height: 100%; font-size: 28px; color: #222222;font-weight: normal;}
.jj_on1 dl dd p{ height: 118px; font-size: 16px; color: #666666; line-height: 29px;}
.jj_on1 dl dd h4{ overflow: hidden;}
.jj_on1 dl dd h4 em{ display: inline-block; float: left; width: 109px; height: 139px; border: 1px solid #b9b9b9; border-radius: 6px; margin-right: 28px; text-align: center;}
.jj_on1 dl dd h4 em:last-of-type{ margin-right: 0;}
.jj_on1 dl dd h4 em img{ display: block; margin: 0 auto; padding-top: 23px;}
.jj_on1 dl dd h4 em span{ display: block; font-size: 18px; color: #333333; padding-top: 16px;}
.jij h5{ position: absolute; right: 0; width: 460px; z-index: 5; top:796px; color: #fff; height: 86px; line-height: 86px;font-weight: normal; font-size: 16px;}
.jij h5 em{ font-size: 28px;}
/**/
.case{ overflow: hidden; padding-bottom: 77px;}
.case dl{ float: left; width: 330px; padding: 28px; border: 1px solid #e2e2e2; height: 410px; margin-right: 18px;}
.case dl:last-of-type{ margin-right: 0;}
.case dl dt{ position: relative; height: 227px; margin-bottom: 24px;}
.case dl dt img{ width:330px}
.case dl dt span{ display: inline-block; position: absolute; top: 23px; right:-5px; width: 64px; height: 32px; line-height: 32px; background: #303338; text-align: center; color: #fff; font-size: 14px;}
.case dl dd h3{ height: 45px; font-size: 13px; color: #6f7381;}
.case dl dd h3 a{ display: block; font-weight: bold; font-size: 16px; color: #363636; margin-bottom: 5px;overflow: hidden; text-overflow:ellipsis;white-space:nowrap;display: block;}
.case dl dd h3 em b{ color: #363636; font-size: 21px; padding-right: 13px; line-height: 100%;}
.case dl dd h3 em{ padding: 0 24px 0 0; display: inline-block; margin-right: 32px; border-right: 1px solid #ebebeb; height: 20px; line-height: 100%;}
.case dl dd p{ height: 75px; color: #666; font-size: 15px; line-height: 22px;}
.case dl dd h4 a{ display: inline-block; width: 45px; height: 45px;background: url(../c_m.jpg) no-repeat;}
.case dl dd h4 a:hover,.case dl:hover h4 a{background: url(../c_2.jpg) no-repeat}
.case dl:hover dt span{ background: #0068b6;}
.case dl:hover{ box-shadow: 0 0 17px rgba(0,0,0,0.17)}
    /**/
.ys{overflow: hidden;background:url(../ys1.jpg) no-repeat center 0; height: 774px;}
.ys h3{ position: relative; height:240px;}
.ys h3 img{ padding: 49px 0 0 140px;}
.ys h3 span{ display: inline-block; position: absolute;font-weight: normal; left: 477px; top: 106px; height: 32px; line-height: 30px; font-size: 21px; color: #0068b6; letter-spacing: 5px;}
.ys dl{clear: both;}
.ys dl dt{ float: right;    margin-right: -2px;  }
.ys dl dd{ float: left; width: 508px; padding: 0 43px;}
.ys dl dd h4{ margin-top: 72px; height: 135px; padding-left: 121px;background:url(../y_no1.jpg) no-repeat;font-weight: normal; color: #000002; font-size: 20px; letter-spacing: 3px;}
.ys dl dd h4 i{ display: block; line-height: 100%; font-size: 36px; padding-bottom: 7px;letter-spacing: 5px;}
.ys dl dd p{ padding-left: 34px; font-size: 16px; color: #666666; line-height: 22px; margin-bottom: 15px;background:url(../y_li.png) no-repeat 0 3px;}
.ys dl dd p i{font-weight: bold; color: #ff7d31;}
.ys dl dd b{ padding-top: 40px; display: block;}

.ys2{background:url(../ys2.jpg) no-repeat center 0; height: 543px; overflow: hidden;}
.ys2 dl dt{ float: left; margin-left: -13px; padding-top: 73px;}
.ys2 dl dd{ float: right; padding-right: 50px;}
.ys2 dl dd h4{background:url(../y_dt2.jpg) no-repeat; text-align: right; padding-right: 126px;}
.ys2 dl dd p{ padding-right: 39px;background:url(../y_li.png) no-repeat right 5px; text-align: right;}
.ys2 dl dd b{ display: block; text-align: right;}

.ys3{background:url(../ys3.jpg) no-repeat center 0;  height: 557px; padding-top: 68px; box-sizing: border-box;}
.ys3 dl dt{ margin-right: -26px;}
.ys3 dl dd{ margin-top: 21px;padding-top: 32px;}
.ys3 dl dd h4{ margin-top: 0;background:url(../y_dt3.jpg) no-repeat;}

.ys4{ background: #f5f5f5;}
.ys4 dl dt{ margin: 50px -25px 0 -144px; padding-top: 0;}
.ys4 dl dd{background:url(../y_dt4.png) no-repeat right 0; margin-top: 71px;}
.ys4 dl dd h4{background:none; padding-top: 45px; margin-top: 0;}
.ys4 dl dd b{ padding-top: 35px;}
    /**/
/**/
.xinw{ height:983px; overflow: hidden;background:url(../jubg.jpg) no-repeat center 0; box-sizing: border-box; padding-top: 216px;}
.xinw h3{ float: left;background:url(../j_h.jpg) no-repeat; width: 259px; height: 503px; margin-bottom: 50px; box-sizing: border-box; color: #fff; padding-top: 100px; text-align: center;}
.xinw h3 a{ display: block; line-height: 100%; color: #fff; font-size: 40px;font-weight: normal; letter-spacing: 5px;}
.xinw h3 span{ display: inline-block; font-weight: normal; line-height: 100%; padding-top: 10px; font-size: 20px; color: #fff; letter-spacing: 2px;}
.news{ width:887px; float: right; margin-top: 117px; height: 389px; overflow: hidden;}
.n_nav{ height:44px; overflow: hidden;background:url(../j_lin.jpg) no-repeat 109px 4px;}
.n_nav ul li{ float: left;padding-right: 52px;}
.n_nav ul li a{ font-size:22px; color: #333; display: inline-block; line-height: 100%;}
.n_nav ul li a:hover,.n_nav ul li.cur a{ color: #000;font-weight: bold;}
.n_span a{ color: #999999;  font-size: 12px; font-family: Arial;font-weight: normal;  display: inline-block; text-transform: uppercase; margin-top:7px;  line-height: 20px; padding: 0 11px; border: 1px solid #c9c9c9; border-radius: 17px;}
.n_span a:hover{ color: #333; border: 1px solid #333;}

.news_c{ overflow: hidden;}
.news_c dl{ overflow: hidden; height:150px;}
.news_c dl dt{ font-size: 0; line-height: 0; overflow: hidden; float: left;}
.news_c dl dt img{ width: 230px; display: block; transition: all 0.3s ease-in-out 0s;}
.news_c dl dd{ float: right; width: 620px; padding-top: 12px;}
.news_c dl dd h4 a{ display: block; line-height: 100%; margin-top: 13px; overflow: hidden; font-size: 17px; color: #333333;font-weight: normal;}
.news_c dl dd h4 a:hover{ color: #0068b6;}
.news_c dl dd p{ color: #888888; font-size: 15px; line-height: 26px; padding-top: 9px;}
.news_c dl dd em{ display: block; text-align: right; font-size: 14px; color: #999999; font-family: Arial;}
.news_c ul li{margin-bottom: 26px; overflow: hidden; float: left; width: 423px;}
.news_c ul li:nth-of-type(2n){ margin-left: 41px;}
.news_c ul li i{ display: inline-block; float: left; width: 66px; height: 79px; border: 2px solid #d6d6d6; font-size: 12px; color: #444444; font-family: Arial; text-align: center; line-height: 100%;}
.news_c ul li i span{ display: block; line-height: 87%; font-size: 36px; padding-top: 16px;}
.news_c ul li em{ display: inline-block; float: right; width: 330px; color: #808080; font-size: 14px; line-height: 22px; margin-top: 5px;}
.news_c ul li em a{ display:block;  font-size: 18px; color: #333333; overflow: hidden; margin-bottom: 12px;overflow: hidden; text-overflow:ellipsis;white-space:nowrap;display: block;}
.news_c ul li:hover a,.news_c ul li:hover em{color: #0068b6;}
.news_c ul li:hover i{ border: 2px solid #0068b6; color: #0068b6;}
.faqs{ clear: both; background: #f6f6f6; height: 134px; overflow: hidden;}
.faqs h4{ float: left; background: #303338; width: 261px; height: 134px; text-align: center;}
.faqs h4 em{ display: block; padding-top: 37px; padding-bottom: 12px;}
.faqs h4 em a{ display: inline-block; line-height: 100%; font-size: 22px; color: #fff;}
.faqs h4 i img{ display: inline-block; padding: 0 12px; cursor: pointer;}
.faq_c {float: left; width: 916px; overflow: hidden;background:url(../j_lin2.jpg) no-repeat 484px 24px; padding-top: 24px; padding-left: 23px;}
.faq_c ul li{ float: left; margin-left: 35px; padding-left: 29px; width: 365px;background:url(../j_q.jpg) no-repeat; margin-right: 29px;}
.faq_c ul li i a{ display: block; line-height: 21px; font-size: 16px; color: #333;font-weight: bold;}
.faq_c ul li em{ display: block; font-size: 14px; color: #999; line-height: 24px; margin-top: 13px;}
.faq_c ul li i a:hover{color: #0068b6;}
    /**/
.aboti{overflow: hidden;background:url(../a_bg.jpg) no-repeat center 0; height: 961px; padding-top: 71px; box-sizing: border-box;}
.aboti dl{ background: rgba(255,255,255,0.89); padding: 70px 59px 0 68px; width: 480px; height: 393px; margin-bottom: 106px;}
.aboti dl h3 a{ display: block;line-height: 100%; font-size: 44px; color: #000;font-weight: normal;}
.aboti dl h3 span{ display: block; font-weight: normal; font-size: 20px; color: #333333; padding-top: 7px; letter-spacing: 3px;}
.aboti dl dd p{ padding-top: 43px; height: 187px; font-size: 16px; color: #666; line-height: 25px;}
.aboti dl dd em{ display: block; }
.aboti dl dd em a{border-bottom: 3px solid #0068b6; color: #333333; font-size: 18px; letter-spacing: 2px; line-height: 100%;}

.f_tit{height: 60px; overflow: hidden;padding-left:352px;}
.f_tit li {float:left; width:146px; margin-right:20px; height: 34px; line-height: 34px; text-align: center; border: 3px solid #0068b6; color: #222020; font-size: 18px; cursor: pointer;}
.f_tit li.on { background: #0068b6; color: #fff;}
.f_fl_j,.f_fr_j{position: absolute; cursor: pointer;}
.f_fl_j{ top: 67px;left: -46px;}
.f_fr_j{ top: 67px; right: -46px;}
.f_sc{ position: relative;}
.f_nr li{float:left; width:296px;font-size:0; line-height: 0; margin-right: 5px; height: 300px;}
.f_nr li img {width:296px;}
.f_nr li span {display: block;margin-top:18px;text-align: center;}
.f_nr li span a {font-size:16px; color: #333; line-height: 100%;}
    /**/
.links { height: 80px; overflow: hidden ;  margin:0 auto; font-size: 16px; background: #333;}
.links em, .links a { display: block; float: left; font-size: 18px; line-height: 80px; color: #adadad; }
.links em { margin-right: 60px }
.links a { margin-right: 60px; -o-transition: all .3s ease; transition: all .3s ease; font-size: 14px;}
.links a:hover { text-decoration: underline;}

@-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 }
}