@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:#FFF;filter:alpha(opacity=90);  
      -moz-opacity:0.9;  
      -khtml-opacity: 0.9;  
      opacity: 0.9;  }	
.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 a{ color:#333; font-weight:bold;}
.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:#4a91e1;}
.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:750px; background:url(bg_banner2.jpg) no-repeat center top;}
.i4  #bnt_more{  height:36px;  border:1px solid #fff; margin:0 auto 10px auto;width:180px; height:45px; text-align:center; border-radius:5px; display:block; line-height:45px; text-align:center;  font-size:14px; color:#fff; }
.i4  #bnt_more:hover{ background:#fff; color:#444;   }
.sj{ width:1240px; height:500px; 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:584px; 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:19px; 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:700px; line-height:30px; 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:90px; clear:both;}
*html .t120{margin-top:220px;}
.w_01{ width:100%; height:auto; padding:0; text-align:center; background-color:#4b84db;border:none;}
.w_01 img{
	display:block;
	border:none;
	width:100%; height:auto; padding:0; text-align:center;
}
.w_02{ width:100%; height:auto; padding:0; text-align:center; background-color:#fff;border:none;}
.w_02 img{
	display:block;
	border:none;
	width:100%; height:auto; padding:0; text-align:center;
}
.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; margin:0 auto; padding-top:50px;}
.app .a_main h2{ width:316px; height:85px;font-size:29px; text-align:center; font-family:微软雅黑; 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 h2 span{ color:#ff0000;}
.app .a_main h4{ font-size:14px; font-weight:normal; text-align:center; padding-top:15px; color:#444;}
.app .a_main h4 span{ color:#ff0000;}

.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:200px; 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; font-size:12px; height:auto !important; background-color:#333; }
.footer{ width:1200px; margin:0 auto; text-align:center;}
.footnav{ width:1200px;  text-align:center; line-height:30px; padding:30px 0;}
.footnav .left{ width:800px; height:auto; float:left; color:#FFF; }
.footnav .right{ width:400px; height:auto; float:left; color:#D0D0D0; }
.footnav .left ul{ width:130px; float:left; font-weight:bold; padding-right:30px; text-align:center;}
.footnav .left a{ font-weight:normal; color:#D0D0D0; }
.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:584px; 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:14px; line-height:30px; 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; }
.banner_wx{ background:url(banner_weixin.jpg) no-repeat center center; width:100%; height:480px; }
.banner_zjym{ background:url(banner_zhujiyuming.jpg) no-repeat center center; width:100%; height:411px; }
.banner_seo{ background:url(banner_seo.jpg) no-repeat center center; width:100%; height:500px; }
.banner_mail{ background:url(banner_mail.jpg) no-repeat center center; width:100%; height:268px; }
.banner_wxgg{ background:url(wxgg_01.jpg) no-repeat center center; width:100%; height:485px; }
.banner_mtzy{ background:url(banner_mtzy.jpg) no-repeat center center; width:100%; height:480px; }
.banner_wzjs{ background:url(banner_wzjs.jpg) no-repeat center center; width:100%; height:445px; }
.banner_yun{ background:url(banner_yun.jpg) no-repeat center center; width:100%; height:486px; }
.banner_anlis{ background:url(banner_anlis.jpg) no-repeat center center; width:100%; height:480px; }
.mail_db1{ background:url(email_01.jpg) no-repeat center center; width:100%; height:467px; }
.mail_db2{ background:url(email_02.jpg) no-repeat center center; width:100%; height:536px; }
.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:微软雅黑;
	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:微软雅黑;}
.contact_left .title{ font-size:18px; font-family:微软雅黑; 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;}
/*微信广告*/
.wxgg_02{ background:url(wxgg_02.jpg) no-repeat center center; width:100%; height:554px; }
.wxgg_03{ background:url(wxgg_03.jpg) no-repeat center center; width:100%; height:590px; }
.wxgg_04{ background:url(wxgg_04.jpg) no-repeat center center; width:100%; height:734px; }
.wxgg_05{ background:url(wxgg_05.jpg) no-repeat center center; width:100%; height:662px; }
.wxgg_06{ background:url(wxgg_06.jpg) no-repeat center center; width:100%; height:597px; }
.wxgg_07{ width:951px; margin:0 auto; }
.weixinyx_01{ background:url(weixinyx_01.jpg) no-repeat center center; width:100%; height:514px; }
/*微信代运营*/
.wxdyy_01{ background:url(wxyy_01.jpg) no-repeat center center; width:100%; height:288px; }
.wxdyy_02{ background:url(wxyy_02.jpg) no-repeat center center; width:100%; height:393px; }
.wxdyy_03{ background:url(wxyy_03.jpg) no-repeat center center; width:100%; height:641px; }
.wxdyy_04{ background:url(wxyy_04.jpg) no-repeat center center; width:100%; height:544px; }
.wxdyy_05{ background:url(wxyy_05.jpg) no-repeat center center; width:100%; height:592px; }
/*网站代运营*/
.wzdyy_01{ background:url(wzdyy_01.jpg) no-repeat center center; width:100%; height:150px; }
.wzdyy_02{ background:url(wzdyy_02.jpg) no-repeat center center; width:100%; height:649px; }
.wzdyy_03{ background:url(wzdyy_03.jpg) no-repeat center center; width:100%; height:194px; }
.wzdyy_04{ background:url(wzdyy_04.jpg) no-repeat center center; width:100%; height:394px; }
.wzdyy_05{ background:url(wzdyy_05.jpg) no-repeat center center; width:100%; height:399px; }
.wzdyy_06{ background:url(wzdyy_06.jpg) no-repeat center center; width:100%; height:322px; }
.wzdyy_07{ background:url(wzdyy_07.jpg) no-repeat center center; width:100%; height:576px; }
.wzdyy_08{ background:url(wzdyy_08.jpg) no-repeat center center; width:100%; height:479px; }
/*媒体资源*/
.mtzy_01{ background:url(mtzy_01.jpg) no-repeat center center; width:100%; height:690px; }
/*媒体广告*/
.mtgg_01{ background:url(mtgg_01.jpg) no-repeat center center; width:100%; height:637px; }
.mtgg_02{ background:url(mtgg_02.jpg) no-repeat center center; width:100%; height:572px; }
.mtgg_03{ background:url(mtgg_03.jpg) no-repeat center center; width:100%; height:607px; }
.mtgg_04{ background:url(mtgg_04.jpg) no-repeat center center; width:100%; height:621px; }
/*云网客首页*/
.yunh_01{ margin:0 auto; width:989px; height:215px; }
.yunh_02{ background:url(yun_home2.jpg) no-repeat center center; width:100%; height:471px; }
/*------------留言反馈------------*/
.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:1200px;
        padding-top: 30px;
        padding-right: 3px;
		text-align:center;
		margin:0 auto;
		height: 50px;
        clear: both;
}
.new_mail .pagepage {
	    width:1200px;
        padding-top: 30px;
        padding-right: 3px;
        text-align:center;
		margin:0 auto;
		height: 50px;
        clear: both;
}

.pagepage .epages a{
        height: 25px;
        overflow: hidden;
        line-height: 25px;
        background-color: #cbe3fe;
        border: 2px solid #F1F4F8;
        text-align: center;
        margin-right: 5px;
        margin-left: 5px;
        text-decoration: none;
        padding:5px 10px;
        color: #004ea7;
}
.pagepage .epages a:hover{
        background-color: #004ea7;
        border: 2px solid #004ea7;
        text-align: center;
        text-decoration: none;
        color: #FFFFFF;
}
.pagepage .epages b{
        height: 25px;
        overflow: hidden;
        line-height: 25px;
        background-color: #FFFFFF;
        border: 2px solid #C0C0C0;
        text-align: center;
        margin-right: 5px;
        margin-left: 5px;
        color: #999999;
        padding:5px 10px;
}
.pagepage .epages span{
    height: 25px;
    overflow: hidden;
    line-height: 25px;
    background-color: #CBE3FE;
    border: 2px solid #F1F4F8;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
    text-decoration: none;
        padding:5px 10px;
    color: #004EA7;
}



/*--------------网页设计-------------*/
.fl {
float: left;
display: inline;
}
.tl {
text-align: left;
}
.tr {
text-align: right;
}
.fwCont{margin-top:64px;}

.tit h1{font-size:24px;color:#666;}

.fwCont .fwBox{height:296px;background:url(../images/fwline.gif) repeat-x;overflow:hidden;margin-top:59px;}
.fwCont .fwMain{width:1170px; margin:0 auto;}
.fwCont .fwIte{width:583px;color:#9a9999;font-size:14px;}
.fwCont .fwIte .fwnr{margin-bottom:59px;height:100%;overflow:hidden;}
.fwCont .fwIte .fwnr div{padding-top:5px;
	width:405px;
	/* [disabled]float:left; */
}
.fwCont a{display:block;width:405px;padding-top:5px;}
.fwCont a.tab1{background:url(../images/tab1.png) no-repeat right 0;padding-right:143px;height:119px;margin-top:-5px;text-align:right;}
.fwCont .fwIte .fwnr a.tab1:hover{background:url(../images/tab1hover.png) no-repeat right 0;}
.fwCont a.tab2{background:url(../images/tab3.png) no-repeat right 0;padding-right:143px;height:119px;margin-top:-5px;}
.fwCont .fwIte .fwnr a.tab2:hover{background:url(../images/tab1hover3.png) no-repeat right 0px;}

.fwCont a.tab3{background:url(../images/tab2.png) no-repeat left 0;padding-left:149px;height:119px;margin-top:-5px;margin-left:32px;}
.fwCont .fwIte .fwnr a.tab3:hover{background:url(../images/tab2hover.png) no-repeat left 0;}

.fwCont a.tab4{background:url(../images/tab4.png) no-repeat left 0;padding-left:149px;height:119px;margin-top:-5px;margin-left:32px;}
.fwCont .fwIte .fwnr a.tab4:hover{background:url(../images/tab1hover4.png) no-repeat left 0;}


.fwCont a.t1{background:url(../images/t1.png) no-repeat right 0;padding-right:143px;height:119px;margin-top:-5px;text-align:right;}
.fwCont .fwIte .fwnr a.t1:hover{background:url(../images/t1_on.png) no-repeat right 0;}
.fwCont a.t2{background:url(../images/t2.png) no-repeat right 0;padding-right:143px;height:119px;margin-top:-5px;}
.fwCont .fwIte .fwnr a.t2:hover{background:url(../images/t2_on.png) no-repeat right 0px;}

.fwCont a.t3{background:url(../images/t3.png) no-repeat left 0;padding-left:149px;height:119px;margin-top:-5px;margin-left:32px;}
.fwCont .fwIte .fwnr a.t3:hover{background:url(../images/t3_on.png) no-repeat left 0;}

.fwCont a.t4{background:url(../images/t4.png) no-repeat left 0;padding-left:149px;height:119px;margin-top:-5px;margin-left:32px;}
.fwCont .fwIte .fwnr a.t4:hover{background:url(../images/t4_on.png) no-repeat left 0;}


.fwCont .fwIte .fwnr h2{margin-top:4px;}
.fwCont .fwIte .fwnr a h2 {color:#4d4d4d;font-size:20px;}

.fwCont .fwIte .fwnr a p{color:#b6b6b6; font-size: 13px; font-weight: normal;}
.fwCont .fwIte .fwnr a:hover h2,.fwCont .fwIte .fwnr a:hover p{color:#cf1111;}
.fwCont .fwIte .fwnr a:hover div.tab1{background:url(../images/tab1hover.png) no-repeat right 0;}
.fwCont .fwIte .fwnr p{line-height:25px;margin-top:17px;}

.fwCont .fwIte img{width:119px;height:119px;}
.fwCont .fwIte.sL{border-right:1px solid #d9d9dd;}
.fwCont .fwIte.sL .fwnr{*padding-right:34px;}
.fwCont .fwIte.sL img{float:right;margin-right:36px;}
.fwCont .fwIte.sR img{float:left;margin-right:35px;margin-left:36px;}
.liucheng{ width:100%; text-align:center;}




























/*==========以下部分是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;
}
/*新增*/
.body{ position:relative;}
.float_l{ float:left}
.float_r{ float:right}
.clear{ clear:both;}
.right{float: right;}
.left{float: left;}
.yiyuangou{width: 100%;}
.zhdt{ padding-top:3%;}
.zhdt h1{ text-align:center; color:#616161;}
.zhdt h1 span{ color:#008b45;}
.zhdt .zhp{ text-align:center; font-size:21px; color:#a7a7a7;}
.zhbleft{ width:18%; background:#008b45; padding-top:4%; padding-bottom:1%; padding-right:1%; padding-left:1%;}
.zhbleft h1{ color:#fff; font-size:60px; text-align:right;}
.zhbleft span{text-align:right;color:#fff; font-size:14px; display:block;}
.zhbleft p{ color:#fff; font-size:14px; text-align:right; margin-top:4%; padding-top:4%; border-top:1px solid #fff;}
.zhbright{ width:82%;padding-top:4%; padding-bottom:1%; padding-left:3%; padding-right:5%;}
.zhbbox{ background:#f7f7f7; margin-bottom:3%;}
.zhbright h4{ font-size:20px; color:#008b45; font-weight:bold; margin-bottom:2%;}
.zhbright .pcp{ font-size:14px; color:#666;}
.zhbright .zhrmore{ text-align:right; display:block;color:#008b45;}
.zhdtye{padding-bottom:4%; padding-top:3%;}
.zhdtye a{ padding:1% 2%; background:#ececec; margin-right:1%;transition:0.3s; color:#666;}
.zhdtye a:hover{ background:#008b45; color:#fff;transition:0.3s;}
.zhbright .sjp{ display:none;}
#container{}
@media screen and (max-width:800px) {
	.weixin{ padding-left:4%; padding-right:2%;}
	.wei_box{ width:32%;}
	.wei_mo{ display:none;}
	.wei_x_left,.wifi_left{ margin-bottom:3%;}
	.wei_x_left,.wei_x_right{ width:100%; margin:auto; padding:4%;}
	.wei_x_left img,.wei_x_right img,.wifi_left img,.wifi_rig img{ display:block; margin:auto;}
	.wifi_left,.wifi_rig{ width:100%; padding-left:2%; padding-right:2%;}
	.shoujilunbo{ display:block;}
	.shoujilunbo .hiSlider-item a{ width:31%; padding-left:1%; padding-right:1%;}
	.shoujilunbo li{ padding-left:1%; padding-right:1%;}
	.pclunbo{ display:none;}
	.chaow_con h1,.cwhx_rig h1{ font-size:18px;}
	.cwanli h1{ font-size:20px;}
	.cwanli_rig p{ font-size:15px;}
	.zhcw,.cwhx_rig p{ font-size:13px;}
	.cwhe_left,.cwhx_rig,.cwanli_top{ width:100%; padding-left:2%; padding-right:2%;}
	.cw_con,.cwanli_bot,.cwanli_xia{ display:none;}
	.chao_lb li{ padding-top:2%;}
	.chao_lb li img{ display:block; margin:auto; width:71%;}
	.cwanli_left,.cwanli_rig{ width:100%; clear:both;}
	.cwanli_rig{ margin-bottom:3%;}
	.cwanli_rig p{ text-align:center;}
	.wei_box{ min-height:164px;}
	.swiper-content .movie-text{ min-height:350px;}
	}	

@media screen and (max-width:1000px) {
	.hiSlider-item a{ width:19%; display:block; float:left; margin-left:3px; margin-right:3px;}
	
	}
/*****************************************************新增加的内容***************************************************************/

.wei_box{ width:19.5%; background:#e4e4e4; padding-top:2%; padding-bottom:2%; float:left; margin:1px; min-height:180px;}
.wei_box img{ display:block; margin:auto;} 
.wei_box h4,.wei_box p{ text-align:center;}
.wei_box h4{ margin-bottom:5%; color:#666;}
.wei_box p{ color:#999; font-size:12px; width:95%; margin:auto;}
.wei_box:hover{ background:#5ab3e7;}
.wei_box:hover h4{ color:#fff;}
.wei_box:hover p{ color:#fff;}
.wei_box .wei2{ display:none;}
.wei_box:hover .wei1{ display:none;}
.wei_box:hover .wei2{ display:block;}
.wei_xia{ width:100%; background:#f3f2ed; padding-top:4%; padding-bottom:4%; margin-top:3%;}
.wei_x_left,.wei_x_right{ width:50%; padding-left:2%; padding-right:2%;}
.wei_x_left{ padding-top:4%;}
.wifi{ padding-top:5%; padding-bottom:5%;}
.wifi_left,.wifi_rig{ width:50%; padding-left:2%; padding-right:2%;}
.wifi_rig{ padding-top:3%;}
.hiSlider-item a{ width:19.5%; display:block; float:left; margin-left:2px; margin-right:2px;}
.hiSlider-item a img{ width:95%; display:block; margin:auto;}
.shoujilunbo{ display:none;}
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
	display: block;
	max-width: 100%;
	height: auto
}
.ksdhsss{ width:100%;  background-color:#fff; clear:both; margin:0 auto; text-align:center;}
.ksdhsss .a_main{ width:1200px; margin:0 auto; padding-top:50px;}
.ksdhsss .a_main h2{ width:316px; height:40px;font-size:29px; text-align:center; font-family:微软雅黑; color:#000; line-height:30px; padding-top:15px; margin:0 auto; background:url(a_ser_bg.jpg) no-repeat center bottom; }
.ksdhsss .a_main h2 p{ font-size:18px; color:#afafaf; height:35px; font-weight:normal; text-align:center;}
.ksdhsss .a_main h2 span{ color:#ff0000;}
.ksdhsss .a_main h4{ font-size:14px; font-weight:normal; text-align:center; padding-top:15px; color:#444;}
.ksdhsss .a_main h4 span{ color:#ff0000;}

.zihaichaow{}
.zihaichaow h1{ text-align:center; font-size:30px; line-height:50px; font-family:微软雅黑; margin-bottom:6%;}
.chaowang{ padding-top:5%; padding-bottom:5%; background:#268cb2; width:100%; margin-top:5%;}
.chaow_con h1{ text-align:center; color:#fff;}
.chaow_con h1 span{ color:#f6ff00;}
.cw_con{ padding-top:5%;}
.cw_con img{ float:left; width:33%; padding-left:1%; padding-right:1%;}
.zhcw{ width:20%; padding-left:1%; padding-right:1%; text-align:center; font-size:16px; color:#333; float:left;}
.zhcw img{ display:block; margin:auto;}
.idc h1{ margin-bottom:2%;}
.idc h1 span{ color:#68c9d2;}
.idc .idcp{ font-size:18px; color:#333; text-align:center; margin-bottom:6%;}
.idc_part1{}
.idc_part1 img{ display:block; margin:2% auto;}
.idc_part1 p{ font-size:18px; color:#666; line-height:29px; text-indent:29px;}
.idc_part2{ padding-top:3%; padding-bottom:3%; background:#69c9d2; margin-top:3%; margin-bottom:3%;} 
.idc2_left{ padding-left:10%;}
.idc2_rig{ padding-right:10%;}
.idc2_left p{ color:#fff; font-size:16px; margin-top:2%; text-align:center;}
.idc2_rig h4{ font-size:18px; color:#fff; font-weight:600;}
.idc2_rig p{ font-size:16px;color:#fff; margin-bottom:18%; margin-top:2%; text-align:left;}
.idc3_left{ width:60%;}
.idc3_left h2,.idc4_rig h2{ color:#fff; font-size:34px; background:#69c9d2; padding:2%; display:inline-block; margin-bottom:3%;}
.idc3_left p,.idc4_rig p{ font-size:18px; color:#666; line-height:29px; text-indent:28px; width:88%;}
.idc_part3{ border-bottom:1px solid #69c9d2;}
.idc4_rig{ width:51%;}
.idc4_rig p{ width:100%;}
.idc_part4{ margin-bottom:3%;}
.idc3_rig{ width:40%;}
.idc4_left{ width:49%;}
@media screen and (max-width:800px) {
	.idc_part1,.idc2_rig,.idc_part3,.idc_part4{ padding-left:2%; padding-right:2%;}
	.idc_part1 img{ width:80%;}
	.idc_part1 p{ font-size:15px;}
	.idc2_con,.idc2_rig,.idc3_left,.idc3_left p,.idc3_rig,.idc4_left,.idc4_rig{ width:100%;}
	.idc2_left{ clear:both;width:100%;}
	.idc2_left img,.idc3_rig img,.idc4_left img{ margin:auto; display:block;}
	.idc2_rig p{ margin-bottom:5%; text-align:center;}
	.idc2_rig h4{ text-align:center;}
	.idc2_left{ padding:0}
	.idc3_left h2, .idc4_rig h2{ font-size:22px;}
	.idc3_left p, .idc4_rig p{ font-size:15px;}
	.idc .idcp{ font-size:15px;}
}
.zhdttit{margin: 0 auto; width:1100px;}
.zhdttit h5{display:inline-block; font-size:16px; padding-top:1%; padding-bottom:1%; color:#fff;}
.zhdttit .h51{background:#68c9d2; width:16%; text-align:center;}
.zhdttit .h52{background:#87a2db;width:16%;text-align:center;}
.zhdttit .h53{background:#68c9d2;width:16%;text-align:center;}
.zhdttit .h54{background:#68c9d2;width:16%;text-align:center;}
.zhdttit .h55{background:#68c9d2;width:16%;text-align:center;}
.zhdttit .h56{background:#68c9d2;width:16%;text-align:center;}
a.hvr-ripple-out-aa {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  background: #4b78cd;
}
@-webkit-keyframes hvr-ripple-out-aa {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}

@keyframes hvr-ripple-out-aa {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
a.button2{
  padding: 1em;
  cursor: pointer;
  background:#eee;
  text-decoration: none;
  font-size: 1.2em;
  color: #fff;
  }

a.button,a.button2{
  /*display: inline-block;*/
  /*vertical-align: middle;*/
  padding: 1em;
  cursor: pointer;
  background:none;
  text-decoration: none;
  font-size: 1.2em;
  color: #666;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
a.hvr-ripple-out-aa {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  background: #4b78cd;
}
a.hvr-ripple-out-aa:before {
  content: '';
  position: absolute;
  cborder: #68C9D2  solid 1px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
a.hvr-ripple-out-aa:hover:before,a.hvr-ripple-out-aa:focus:before,a.hvr-ripple-out-aa:active:before {
  -webkit-animation-name: hvr-ripple-out-aa;
  animation-name: hvr-ripple-out-aa;
}
@media screen and (max-width:990px) {
	ul.border-list a{ height:100% !important; line-height:20px !important; min-height:70px;}
}



.border-aa{ background:#68c9d2;}

  ul.border-list li{
 display: inline-block;
 list-style: none;
 margin:1em 2px; 
 width:100%;
}


ul.border-list a{ 
  background:#4B78CD; padding-top:2%; padding-bottom:2%;
  width:9.3%;  height:7px; line-height:6px; text-align:center; color:#fff;font-size: 14px;margin: 2px 0px;
}
ul.border-list a:hover{ font-size:12px; transition:all 0.3s; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;}
ul.border-list a.border-list-1{background:#68c9d2; }
ul.border-list a.border-list-2{background:#87a2db; }
ul.border-list a.border-list-3{background:#aecc6b; }
ul.border-list a.border-list-4{background:#e48583; }
ul.border-list a.border-list-5{background:#5ab3e7; }
ul.border-list a.border-list-6{background:#68c9d2; }
ul.border-list a.border-list-7{background:#008b45; }
ul.border-list a.border-list-8{background:#4B78CD; }
/*-------------------------------------------------------------*/
.foot_bg{
	background:#2868b0;
	height:300px;
	margin:0;
	width:100%;
}
.foot_main{
	margin:0 auto;
	position:relative;
	width:1100px;
}
.foot_logo{
	background:url(../images/foot_logo.png) no-repeat 33px 25px #ffffff;
	height:300px;
	left:0px;
	position:absolute;
	top:-40px;
	width:300px;
}
.foot_erweima{
	background:url(../images/foot_erweima.png) no-repeat;
	color:#fff;
	font-size:14px;
	height:150px;
	margin:140px 0 0 30px;
	padding:0 0 0 77px;
}
/*-------------------------------------------------------------*/
.foot_nav{
	border-bottom:solid 1px #ccc;
	float:right;
	font-size:14px;
	line-height:35px;
	margin:30px 0 0 0;
	width:780px;
}
.foot_nav a{
	color:#fff;
	margin:0 10px;
}
.foot_copy{
	color:#fff;
	float:right;
	line-height:35px;
	padding:5px 0 0 0;
	width:770px;
}
.foot_copy a{
	color:#fff;
	margin:0 5px 0 0;
}
