@charset "utf-8";
/* CSS Document */
@font-face {
	font-family: 'zhang';
	src: url('../font/zhang.eot');
	src: local('☺'), url('../font/zhang.woff') format('woff'), url('../font/MSYH.TTC') format('truetype'), url('../font/zhang.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'msyh';
	src: url('../font/msyh.eot');
	src: url('../font/msyh.woff') format('woff'), url('../font/msyh.ttf') format('truetype'), url('../font/msyh.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*---------head----*/
div ul,li,a,span,p,h4,h1,h2{
	margin:0px;
	padding:0px;
	list-style-type:none;}
img {border:0 none;
    margin:0;
	padding:0;}
table{
	margin:0px;
	padding:0px;
	border-collapse: separate;
	border-spacing: 0px;

	}
body{
	margin:0px;
	padding:0px;
	font-size:12px;
	background-color:#fff;
	font-family:'msyh',"微软雅黑","宋体",Helvetica,Georgia,"Times New Roman", Times, serif;
	line-height:20px;
	color:#444;
}
a{
	color:#5f5d5d;
	text-decoration:none;}
a:hover{
	color:#07509c;
	text-decoration:none;}
	
.header{ width:100%; height:120px; position:fixed; left:0; top:0; z-index:9999999; background-color:#f1f1f1;}	
.head{ width:1200px; height:120px; margin:0 auto;position:relative;}
.top{ width:1200px; height:30px; line-height:30px; text-align:right;}	
.logo{ width:450px; height:90px;float:left;}
.nav{ width:750px; height:90px; float:left;}
.nav ul li{ width:107px; line-height:90px; height:90px; float:left; text-align:center; font-size:14px;}
.nav ul li:hover{ background-color:#1057a7;}
.nav ul li:hover a{ color:#fff;}
.i_down{ width:100%; height:60px; line-height:60px; text-align:center; clear:both;}





/*-------banner--------------*/
#full-screen-slider { width:100%; height:420px;}
#slides { display:block; width:100%; height:400px; list-style:none; padding:0; margin:0;position:relative;}
#slides li { display:block; width:100%; height:100%; list-style:none; padding:0; margin:0; position:absolute;}
#slides li a { display:block; width:100%; height:100%; text-indent:-9999px}
#pagination { display:block; list-style:none; position:absolute; left:50%; top:480px; z-index:9900;  padding:5px 15px 5px 0; margin:0}
#pagination li { display:block; list-style:none; width:12px; height:12px; float:left; margin-left:15px; border-radius:7px; background:#FFF }
#pagination li a { display:block; width:100%; height:100%; padding:0; margin:0;  text-indent:-9999px;}
#pagination li.current { background:#ff1d00}
.list_nav{ width:200px; height:420px; margin:0 auto; position:absolute;top:0; left:50%;z-index:1100;}
.list_nav ul{width:200px; height:420px;background-color:#fff;box-shadow: 2px 2px 2px rgba(0,0,0,0.2); position:absolute;top:0; left:-600px;}
.list_nav ul li{ width:160px; height:29px; border-bottom:1px dotted #ddd; line-height:30px; padding-left:40px }
.dao_01{ background:url(1.jpg) no-repeat 10px center;}
.dao_02{ background:url(2.jpg) no-repeat 10px center;}
.dao_03{ background:url(3.jpg) no-repeat 10px center;}
.dao_04{ background:url(4.jpg) no-repeat 10px center;}
.dao_05{ background:url(5.jpg) no-repeat 10px center;}
.dao_06{ background:url(6.jpg) no-repeat 10px center;}
.dao_07{ background:url(7.jpg) no-repeat 10px center;}
.dao_08{ background:url(8.jpg) no-repeat 10px center;}
.dao_09{ background:url(9.jpg) no-repeat 10px center;}
.dao_10{ background:url(10.jpg) no-repeat 10px center;}
.dao_11{ background:url(11.jpg) no-repeat 10px center;}
.dao_12{ background:url(12.jpg) no-repeat 10px center;}
.dao_13{ background:url(13.jpg) no-repeat 10px center;}
/*-------banner end--------------*/
/*-------优势特效-------*/

.yous ul li a p{ -moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out; } 

.yous ul li a:hover p
{-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg); }
/*=====================*/
.main_box{ width:1224px; margin:0 auto;}
/*==============首页主体=====================*/
.sy-title{text-align:center; margin:50px auto;}
.sy-title h1{ font-size:35px; color:#ff1d00;  line-height:65px; text-align:center;}
.sy-title h2{ font-size:20px; color:#4a4a4c; padding:1px 0 10px 0; text-align:center;}
.sy-title h3{ color:#999; font-size:13px; text-align:center; text-transform:uppercase;}
.sy-title  p{ text-align:center; line-height:30px; margin-top:50px; color:#757477; font-size:14px;}

.sy-title1{text-align:center; margin:50px auto;}
.sy-title1 h1{ font-size:35px; color:#fff;  line-height:65px; text-align:center;}
.sy-title1 h2{ font-size:20px; color:#fff; padding:1px 0 10px 0; text-align:center;}
.sy-title1 h3{ color:#b2b2b3; font-size:11px; text-align:center; text-transform:uppercase;}
.sy-title1  p{ text-align:center; line-height:30px; margin-top:50px; color:#757477; font-size:14px;}

.sy-title2{text-align:center; margin:0px auto; padding:30px 0; clear:both;}
.sy-title2 h1{ font-size:35px; color:#fff;  line-height:65px; text-align:center;}
.sy-title2 h2{ font-size:20px; color:#fff; padding:1px 0 10px 0; text-align:center;}
.sy-title2 h3{ color:#b2b2b3; font-size:11px; text-align:center; text-transform:uppercase;}
.sy-title2  p{ text-align:center; line-height:30px; margin-top:50px; color:#757477; font-size:14px;}

/*==============首页f1=====================*/
.i1{}
.yous{ width:1240px; height:380px; margin:0 auto;}
.yous ul li { width:286px; height:215px; float:left; padding-left:12px; padding-right:12px; background:url(yous_bg.gif) repeat-y center center; }
.yous ul li p{ width:145px ; height:145px; margin:15px auto;}
.yous ul li a{ display:block;}
.yous ul li h1 {font-size: 18px; height:30px;text-align: center;color: #fff;}
.yous ul li h2 {font-size: 14px; height:30px;text-align: center;color: #fff; font-weight:normal;}
/*==============首页f2=====================*/
.new_c{ width:100%; background-color:#125299;}
.i2.{ width:100%; height:879px; overflow:hidden;}
.i2 #sy-case{ width:100%; padding:20px 0 50px 0;}
.i2 #sy-case ul{ margin-top:0px;}
.i2 #sy-case ul li{ position:relative;  background:#ededee; margin:3px; width:300px; float:left; display:block; overflow:hidden;}
.i2 #sy-case ul li .box{ display:block; width:300px;}
.i2 #sy-case ul li .box img{ width:300px; height:193px;}
.i2 #sy-case ul li .box h1 a{ height:50px; line-height:50px; display:block; padding:0 20px; }
.i2 #sy-case ul li .box h1 a strong{ color:#444545; font-size:14px;}
.i2 #sy-case ul li .box h1 a span{ color:#a9a9a9; font-size:12px; float:right;}
.i2 #sy-case ul li .hover  a{ opacity:0; display:block; position:absolute; top:0; width:100%; height:193px; z-index:3; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000', endColorstr='#7F000000');background:rgba(0,0,0,0.5);}

.i2 #sy-case ul li .hover img{ display:block; margin:0 auto; padding-top: 76px; }
.i2 #sy-case ul li:hover .hover a{ opacity:1;}
.i2 #sy-case ul li:hover{ background:#ff1d00;}
.i2 #sy-case ul li:hover span{ color:#fff !important;}
.i2 #sy-case ul li:hover strong{ color:#fff !important;}
.i2  #bnt_more{  height:36px; border:1px solid #fff; margin:60px auto 20px auto; width:180px; height:45px; text-align:center; border-radius:5px; display:block; line-height:45px; text-align:center;  font-size:14px; color:#fff;}
.i2  #bnt_more:hover{ background:#fff; color:#444;   }
/*==============首页f3=====================*/
.i3{ width:100%; background-color:#f2f2f2;}
.i3 .mid{ width:1200px; margin:0 auto; }
.i3 #sy-case{ width:100%; padding:20px 0 0px 0;}
.i3 #sy-case ul{ margin-top:0px;}
.i3 #sy-case ul li{ position:relative;  background:#ededee; margin:0; width:300px; float:left; display:block; overflow:hidden;}
.i3 #sy-case ul li .box{ display:block; width:300px;}
.i3 #sy-case ul li .box img{ width:300px; height:193px;}
.i3 #sy-case ul li .box h1 a{ height:50px; line-height:50px; display:block; padding:0 20px; }
.i3 #sy-case ul li .box h1 a strong{ color:#444545; font-size:14px;}
.i3 #sy-case ul li .box h1 a span{ color:#a9a9a9; font-size:12px; float:right;}
.i3 #sy-case ul li .hover  a{ opacity:0; display:block; position:absolute; top:0; width:100%; height:193px; z-index:3; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000', endColorstr='#7F000000');background:rgba(0,0,0,0.5);}

.i3 #sy-case ul li .hover img{ display:block; margin:0 auto; padding-top: 76px; }
.i3 #sy-case ul li:hover .hover a{ opacity:1;}
.i3 #sy-case ul li:hover{ background:#ff1d00;}
.i2 #sy-case ul li:hover span{ color:#fff !important;}
.i3 #sy-case ul li:hover strong{ color:#fff !important;}
.i3  #bnt_more{  height:36px; border:1px solid #444; margin:60px auto 20px auto; width:180px; height:45px; text-align:center; border-radius:5px; display:block; line-height:45px; text-align:center;  font-size:14px; color:#444;}
.i3  #bnt_more:hover{ background:#ff1d00; color:#fff;border:0px solid #444;   }
/*-------s手机特效-------*/

.sj ul li a p{ -moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out; } 

.sj ul li a:hover p
{-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg); }
/*=====================*/
/*-----------f4---------*/
.i4{ width:100%; height:auto; background:url(bg_banner2.jpg) no-repeat center top;}
.sj{ width:1240px; height:600px; margin:0 auto;}
.sj ul{ margin-bottom:20px;}
.sj ul li { width:186px; height:332px; float:left; padding:53px 31px; background:url(case_1.png) repeat-y center center; }
.sj ul li p{ width:103px ; height:103px; margin:50px auto;}
.sj ul li a{ display:block;}
.sj ul li h1 {font-size: 18px; height:30px;text-align: center;color: #fff;}
.sj ul li h2 {font-size: 14px; height:30px;text-align: center;color: #fff; font-weight:normal;}
/*-----------i_new-------*/
.i5{ width:100%; height:620px; background-color:#e4e4e4;}
.i_new{ width:1200px; margin:0 auto; height:620px;}
.i_new_tit{ width:100%; padding-top:80px; background:url(news_index.png) no-repeat center 20px; text-align:center; font-size:35px; line-height:50px; color:#131517;}


/*--------tab----------*/
#tabs {overflow: hidden;width:438px; height:50px; margin: 0; padding-left:381px; padding-right:381px;list-style: none; padding-top:30px; padding-bottom:30px;}
#tabs li { width:94px; padding:0 26px; height:40px; float: left; font-size:16px;}
#tabs a {float: left;position: relative; height:40px;line-height: 40px;text-transform: uppercase;
    text-decoration: none;
    color: #444;      
  
  }
#tabs a:hover,#tabs a:focus {
    border-bottom-color:#F00;
    opacity: 1;
    filter: alpha(opacity=100);
  }
#tabs a:focus {   outline: 0;}
#tabs #current {
    z-index: 3;
    border-bottom: 3px solid #F00;       
  }
.i_news{ width:1200px; height:auto; }
.i_new_h{ width:370px; height:330px; float:left; background-color:#FFF;}
.i_new_t{ width:338px; height:180px; padding:16px;}
.i_N_date{ width:80px; height:70px; background-color:#c70c1f;color:#fff; float:left;}
.i_N_date p{ width:100%; height:35px; line-height:35px; text-align:center; font-size:24px; font-weight:bold;}
.i_N_date .red{ font-size:12px; background-color:#a80011; font-weight:normal; }
.i_N_title{ width:242px; height:70px; float:left; padding-left:16px; line-height:35px;}
.i_N_title p{ width:242px; height:35px; overflow:hidden;}
.i_N_title p a{ font-size:14px; color:#a80011;}
.c_c1{ width:100px; height:35px; display:block; background:url(au_1.gif) no-repeat left center; padding-left:21px; float:left;}
.c_c2{ width:100px; height:35px; display:block; background:url(c_c2.gif) no-repeat left center; padding-left:21px; float:left;}
.i_N_con{ width:100%; padding-top:16px; line-height:25px; clear:both; height:100px; overflow:hidden;}

.i_n_li{ width:830px; height:330px; float:left;}
.i_N_box{ width:375px; height:94px; padding-left:40px; padding-bottom:24px; float:left; background:url(i_N_bg.gif) no-repeat right top;}
.i_N_li{ width:335px;height:62px; padding:16px 20px; }
.i_N_li:hover{background:url(i_N_bg_2.gif) no-repeat right top;}
.i_N_box .i_N_li .i_li_date{ width:62px; height:52px; line-height:26px; text-align:center; color:#FFF; font-size:24px; font-weight:bold; padding-top:5px; float:left;}
.i_N_box .i_N_li .i_li_date .red{ font-size:12px; font-weight:normal;}
.i_N_li_con{ width:263px; height:62px; padding-left:10px; float:left;}
.i_N_li_con div{ color:#000; line-height:22px; font-weight:bold;}
.i_N_li_con p{ color:#666; line-height:20px; height:40px; overflow:hidden;}

.i_N_li:hover .i_N_li_con div{ color:#c70c1f;}

.about_1{ width:100%; height:600px; background:url(bg_banner2.jpg) no-repeat center center; }
.about_1 .content{ width:560px; height:auto; margin:0 auto; padding-top:240px; background:url(about_tit.png) no-repeat center top; color:#fff;}
.about_1 .content .a_d{ width:50px; height:40px; margin-top:30px; padding-left:255px;}

.about_2{  width:100%; height:553px;}
.about_2 .a_n{ width:1000px; height:500px; margin:30px auto;}
.about_2 .a_n h1{ width:100%; font-size:30px; line-height:30px; color:#5a5a5a; font-weight:normal;}
.about_2 .a_n h1 p{ font-size:18px; color:#347eb8;}
.about_2 .a_n h2{ width:100%; font-size:20px; padding-top:15px; color:#5a5a5a; font-weight:normal;}
.about_2 .a_n h2 p{ font-size:14px; color:#5a5a5a;}

/*-----网站建设页面---------*/
.t120{ margin-top:120px;}
.h120{ width:100%; height:120px; clear:both;}
*html .t120{margin-top:220px;}
.w_01{ width:100%; height:auto; padding:0; text-align:center; background-color:#4b84db;}
.w_02{ width:100%; height:auto; padding:0; text-align:center; background-color:#fff;}
.w_03{ width:100%; height:502px; padding:0; text-align:center; background:url(m_06.jpg) no-repeat center top;}
/*------webapp---*/
.webapp_banner{ width:100%; height:510px; background-color:#054580; clear:both;}
.webapp_banner .con{ width:1200px; height:510px; margin:0 auto;}
.webapp_banner .con h1{ font-size:38px; color:#FFF; padding-top:30px; padding-bottom:10px; background:url(app_h1bg.jpg) no-repeat center bottom; text-align:center; height:40px;}
.webapp_banner .con p{ font-size:14px; line-height:50px; color:#9ccdfb; text-align:center;}


.app{ width:100%; height:650px; background-color:#fff; clear:both;}
.app .a_main{ width:1200px; height:650px; margin:0 auto; padding-top:50px;}
.app .a_main h2{ width:316px; height:85px;font-size:29px; color:#000; line-height:30px; padding-top:15px; margin:0 auto; background:url(a_ser_bg.jpg) no-repeat center bottom; }
.app .a_main h2 p{ font-size:18px; color:#afafaf; height:35px; font-weight:normal; text-align:center;}
.app .a_main h4{ font-size:14px; font-weight:normal; text-align:center; padding-top:15px; color:#444;}

.app .a_main .lc{ width:100%; padding:100px 0;}
.app .a_main .lc ul li{ width:140px; padding:15px; text-align:center; float:left;}
.app .a_main .lc ul li img{ width:100px; height:100px; border-radius:50px; border:1px solid #aaa;}
.app .a_main .lc ul li:hover img{ border:1px solid #c70c1f;}
.app .a_main .lc ul li:hover p{ color:#c70c1f;}
.app .a_main .lc ul li .tit{ width:100%; height:40px; line-height:40px; font-size:18px; text-align:center;}
/*------案例页面-----*/
.case{ width:100%; height:290px; min-height:290px; height:auto !important;background-color:#fff; clear:both;}
.case .a_main{ width:1200px; height:auto; margin:0 auto; padding-top:50px;}
.case .a_main h2{ width:180px; height:85px;font-size:30px; color:#000; line-height:30px; padding-top:15px; margin:0 auto; background:url(a_ser_bg.jpg) no-repeat center bottom; text-align:center; }
.case .a_main h2 p{ font-size:18px; color:#afafaf; height:35px; font-weight:normal; text-align:center;}
.case .a_main h4{ font-size:14px; font-weight:normal; text-align:center; padding-top:15px; color:#444;}
.case .a_main .list{ width:100%; height:40px; padding-top:30px; padding-bottom:30px; text-align:center;}
.case .a_main .list ul li{ width:150px; height:30px; border:1px solid #444; display:inline; margin:10px; padding:7px 20px; font-size:14px; border-radius:5px;}
.case .a_main .list ul li a{ color:#222;}
.case .a_main .list ul .on{ background-color:#1057a7;border:1px solid #1057a7;}
.case .a_main .list ul .on a{ color:#fff;}
.p30{ padding-top:30px;}

.case_main{ width:1200px; margin:0 auto;}
.case .case_about{ width:1200px;padding:0;margin:0 auto;}
.case .case_about li{ width:1200px;height:30px;*margin-left:-16px;padding-left:10px;line-height:30px;border-bottom:1px dotted #999999;}
.case .case_about li b{ font-size:18px;}
.case .case_n_text{ width:750px; padding-top:20px; padding-bottom:20px; margin:0 auto;}
.case_main .content{ width:1200px; height:auto; padding-top:50px; padding-bottom:50px;}

.case_main .list{ width:100%; height:40px; padding-top:80px; padding-bottom:50px; text-align:center;}
.case_main .list ul li{ width:150px; height:30px; border:1px solid #444; display:inline; margin:10px; padding:7px 20px; font-size:14px; border-radius:5px;}
.case_main .list ul li a{ color:#222;}
.case_main .list ul .on{ background-color:#1057a7;border:1px solid #1057a7;}
.case_main .list ul .on a{ color:#fff;}

.case_top{ width:100%; height:150px; background-color:#125299; border-bottom:1px solid #CCC; border-top:1px solid #CCC;}
.case_top .w1200{ width:1200px; height:auto; margin:0 auto;}
.case_top .w1200 .left{ width:800px; height:150px; float:left;}
.case_top .w1200 .left .title{ font-size:30px; color:#fff; padding-top:60px; padding-bottom:20px;}
.case_top .w1200 .left p{ font-size:14px; color:#9ccdfb;}
.case_top .w1200 .right{ width:400px; height:150px; float:left;}
.case_top .w1200 .right ul li{ width:110px; float:left; padding-top:30px;  text-align:center;}
.case_top .w1200 .right ul li p{ font-size:14px; text-align:center; color:#fff;}
.case_top .w1200 .right ul li:hover a img{ filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8;}

.help{ width:100%; height:258px; padding-top:57px; clear:both;}
.help .foot_map{ width:253px; height:201px; background:url(f_map_c.png) no-repeat center top; margin:0 auto;}
.help .foot_map .add{ width:190px; padding-left:45px; height:50px;  background:url(ico_add.jpg) no-repeat 12px center; padding-top:7px; color:#fff;}
.help .foot_map ul{ width:205px; height:138px; padding-right:5px; margin:0 auto;}
.help .foot_map ul li{ width:175px; padding-left:30px; height:46px; line-height:46px; margin:0 auto; border-bottom:1px solid #ccc;}
.help .foot_map ul li strong{ color:#a40c0b;}

.foot{ width:100%; min-height:150px; height:150px; height:auto !important; background-color:#ebebeb; }
.footer{ width:1200px; margin:0 auto; text-align:center;}
.footnav{ width:100%; height:30px; text-align:center; line-height:30px; padding-top:30px;}
.footnav a{ padding-left:20px; padding-right:20px; font-weight:bold;}
.link{ width:100%; padding:10px; text-align:left;}

/*---------模板选择页面---------*/

.banner_p{ width:100%; height:390px; background:url(banner_service_tx.jpg) no-repeat center top; }
.banner_p .b_p1{ width:1200px; height:80px; line-height:80px; font-size:36px; color:#FFF; margin:0 auto; text-align:center; padding-top:100px;}
.banner_p .b_p2{ width:1200px; height:50px; line-height:50px; font-size:24px; color:#FFF; margin:0 auto; text-align:center;}
.banner_p .b_p3{ width:1200px; height:50px; line-height:50px; font-size:12px; color:#807e7e; margin:0 auto; text-align:center;}

.p_top{ width:1200px; height:380px; margin:0 auto;}
.p_top .list_ul li{ width:200px; height:30px; float:left;  }

/*------------search-----------*/
.search{ width:410px; height:80px; margin:0 auto; padding-top:100px;}
.searchTextField{ width:320px; height:39px; float:left; padding:0; margin:0; border:1px solid #c0c1c1; padding-left:10px; font-family:"微软雅黑"; color:#CCC; line-height:39px;}
.inp_2{ width:75px; height:41px; float:left; }

.page_list{ width:1200px; height:30px; margin:0 auto; padding-top:50px; text-align:center;}
/*--------news---------*/

.banner_n{ width:100%; height:390px; background:url(banner_gd.jpg) no-repeat center top; }
.banner_n .b_p1{ width:1200px; height:80px; line-height:80px; font-size:36px; color:#FFF; margin:0 auto; text-align:center; padding-top:100px; color:#fff;}
.banner_n .b_p2{ width:1200px; height:50px; line-height:50px; font-size:24px; color:#FFF; margin:0 auto; text-align:center;}
.banner_n .b_p3{ width:1200px; height:50px; line-height:50px; font-size:12px; color:#807e7e; margin:0 auto; text-align:center;}

.news{ width:100%; height:auto;}
.new_mail{ width:1245px; margin:0 auto;}
.new_list{ width:1245px; margin-top:20px;}

.tabs {overflow: hidden;width:438px; height:50px; margin: 0; padding-left:381px; padding-right:381px;list-style: none; padding-top:30px; padding-bottom:30px;}
.tabs li { width:94px; padding:0 26px; height:40px; float: left; font-size:16px;}
.tabs a {float: left;position: relative; height:40px;line-height: 40px;text-transform: uppercase;
    text-decoration: none;
    color: #444;      
  
  }
.tabs a:hover,.tabs a:focus {
    border-bottom-color:#F00;
    opacity: 1;
    filter: alpha(opacity=100);
  }
.tabs a:focus {   outline: 0;}
.tabs .current {
    z-index: 3;
    border-bottom: 3px solid #F00;       
  }
  
.tabs2 {overflow: hidden; height:50px; margin: 0; list-style: none; padding-top:30px; padding-bottom:30px;}
.tabs2 li { width:94px; padding:0 26px; height:40px; float: left; font-size:16px;}
.tabs2 a {float: left;position: relative; height:40px;line-height: 40px;text-transform: uppercase;
    text-decoration: none;
    color: #444;      
  
  }
.tabs2 a:hover,.tabs2 a:focus {
    border-bottom-color:#F00;
    opacity: 1;
    filter: alpha(opacity=100);
  }
.tabs2 a:focus {   outline: 0;}
.tabs2 .current {
    z-index: 3;
    border-bottom: 3px solid #F00;       
  }


.new_con{ width:1100px; height:500px; min-height:500px; height:auto !important; margin:0 auto; background-color:#fff; padding:20px 50px;}
.new_con h1{ width:100%; height:50px; line-height:50px; font-size:24px; color:#444; text-align:center;}
.new_con .span{ width:100%; height:30px; line-height:30px; font-size:14px; color:#aaa; text-align:center; border-bottom:1px dotted #CCCCCC;}
.new_con .text{ height:370px; min-height:370px; height:auto !important; font-size:12px; line-height:25px; padding-top:20px; padding-bottom:0px;}
.new_con .text .back{ margin:20px auto; width:120px; height:35px; line-height:35px; background-color: #1057a7; border-radius:5px; text-align:center;}
.new_con .text .back a{ color:#FFF;}
/*------联系我们-------*/
.contact_b{ background:url(banner_service_tx1.jpg) no-repeat center center; width:100%; height:390px; }
.contact_top{
    width:1024px;
	height:90px;
	padding-top:20px;
	padding-bottom:30px;
	margin:0 auto;}
.contact_top li{
    float:left;
	width:340px;
	height:90px;}
.contact_left{
    width:600px;
	height:400px;
	min-height:400px;
	font-family:'zhang',"msyh";
	padding-top:30px;
	height:auto !important;
	line-height:30px;
	font-size:16px;
	float:left;}
.contact_left	.c_tit{ font-size:24px; line-height:30px;}
.contact_left	.c_tit p{ font-size:14px; font-family:'zhang';}
.contact_left .title{ font-size:18px; font-family:'zhang',"msyh"; padding-top:15px; padding-bottom:10px;}
.contact_left .erwei img{ margin-right:30px; margin-top:20px; margin-bottom:0; padding:0; }
.contact_left .erwei{ line-height:30px;}
.contact_left .erwei span{ padding-left:30px;}
.contact_right{
    width:578px;
	height:400px;
	min-height:400px;
	padding-top:30px;
	padding-left:20px;
	border:1px solid #ccc;
	background-color:#fff;
	margin-top:-100px;
	height:auto !important;
	float:left;}

.contact_right form{padding-left:10px;}
.contact_right .ipt{border:1px solid #afafaf;width:250px;height:35px;line-height:35px;padding-left:9px;color:#666666;font-size:14px;display:block;float:left;margin-top:17px;font-family:'msyh';}
.contact_right .intR{margin-right:14px;}
.contact_right form textarea{font-family:'msyh';border:1px solid #afafaf;margin-top:17px;width:517px;height:134px;padding:6px 9px;overflow:auto;color:#666666;font-size:14px;line-height:1.5em; margin-left:0px;}
.contact_right form .btn{width:143px;height:40px;line-height:35px;text-align:center;font-size:16px;color:#fff;background:#1057A7;margin-right:24px;font-family:'msyh';}
.contact_right form .btnCont{margin-top:17px;line-height:40px;}
.contact_right form .btnCont span{color:#a8a8a8;font-size:14px;}
.main_n{ width:1200px; height:400px; margin:0 auto;}


/*------------留言反馈------------*/
.contact_right .tit {
font-size: 22px;
color: #666;
background: url(cutagtly.png) no-repeat right center;
height: 36px;
line-height: 39px;
padding-right: 60px;
width: 134px;
padding-left: 9px;
}
/*--------------分页美化---------------*/
.pagepage {
	    width:470px;
        padding-top: 30px;
        padding-right: 3px;

		margin:0 auto;
		height: 50px;
        clear: both;
}
.new_mail .pagepage {
	    width:570px;
        padding-top: 30px;
        padding-right: 3px;

		margin:0 auto;
		height: 50px;
        clear: both;
}

.pagepage .epages a{
        display: block;
        height: 25px;
        overflow: hidden;
        line-height: 25px;
        background-color: #cbe3fe;
        border: 2px solid #F1F4F8;
        float: left;
        text-align: center;
        margin-right: 5px;
        margin-left: 5px;
        text-decoration: none;
        padding-right: 10px;
        padding-left: 10px;
        color: #004ea7;
}
.pagepage .epages a:hover{
        display: block;
        background-color: #004ea7;
        border: 2px solid #004ea7;
        float: left;
        text-align: center;
        text-decoration: none;
        color: #FFFFFF;
}
.pagepage .epages b{
        display: block;
        height: 25px;
        overflow: hidden;
        line-height: 25px;
        background-color: #FFFFFF;
        border: 2px solid #C0C0C0;
        float: left;
        text-align: center;
        margin-right: 5px;
        margin-left: 5px;
        color: #999999;
        padding-right: 10px;
        padding-left: 10px;
}
.pagepage .epages span{
    display: block;
    height: 25px;
    overflow: hidden;
    line-height: 25px;
    background-color: #CBE3FE;
    border: 2px solid #F1F4F8;
    float: left;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
    text-decoration: none;
    padding-right: 10px;
    padding-left: 10px;
    color: #004EA7;
}
































/*==========以下部分是Validform.css===========*/
/*==============================amimate开始=======================================*/

/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

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

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-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% {
    -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% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

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

@keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

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

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
}

@keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }


  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  -ms-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    -ms-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    -ms-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    -ms-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);

    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

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

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@-webkit-keyframes 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);
    opacity: 1;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  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);
    opacity: 1;
    -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;
  }

  100% {
    -webkit-transform: translateY(700px);
    -ms-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

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

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

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


.clear:after {
	content: '\20';
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/*固定的悬浮窗*/
.yb_conct {
	position: fixed;
	z-index: 9999999;
	top: 200px;
	right: -127px;
	cursor: pointer;
	transition: all .3s ease;
}
.yb_bar ul li {
	width: 180px;
	height: 53px;
	font: 14px/53px 'Microsoft YaHei';
	color: #fff;
	text-indent: 54px;
	margin-bottom: 3px;
	border-radius: 3px;
	transition: all .5s ease;
	overflow: hidden;
}
.yb_bar .yb_top {
	background: #1057a7 url(fixCont.png) no-repeat 0 0;
}
.yb_bar .yb_phone {
	background: #1057a7 url(fixCont.png) no-repeat 0 -57px;
}
.yb_bar .yb_QQ {
	text-indent: 0;
	background: #1057a7 url(fixCont.png) no-repeat 0 -113px;
}
.yb_bar .yb_ercode {
	/*height:200px;*/

	background: #1057a7 url(fixCont.png) no-repeat 0 -169px;
}
.hd_qr {
	padding: 0 29px 25px 29px;
}
.yb_QQ a {
	display: block;
	text-indent: 54px;
	width: 100%;
	height: 100%;
	color: #fff;
}