
#container {
			width: 100%;
/*			height: 300px;*/
			overflow: hidden;
	}
	.sections,.section {
/*		height:100%;*/
	}
	#container,.sections {
		position: relative;
	}
	.section {
		background-color: #000;
		background-size: cover;
		background-position: 50% 50%;
		text-align: center;
		color: white;
	}
	.section img{width: 100%;
/*				height: 100%;*/
				}
.pages li{list-style-type:none;width:10px;height:10px;border-radius:10px;background-color:white}
.pages li:hover{box-shadow:0 0 5px 2px white}
.pages li.active{background-color:orange;box-shadow:0 0 5px 2px orange}
.pages{position:absolute;z-index:999}
.pages.horizontal{left:50%;transform:translateX(-50%);bottom:5px}
.pages.horizontal li{display:inline-block;margin-right:10px}
.pages.horizontal li:last-child{margin-right:0}
.pages.vertical{right:5px;top:50%;transform:translateY(-50%)}
.pages.vertical li{margin-bottom:10px}
.pages.vertical li:last-child{margin-bottom:0}

.xl-center{width: 1099px;
		margin: auto;}
.xl-list li{width: 400px;
		height: 577px;
		float: left;
		
		margin-right: 18px;}
.xl-list{  
/*margin-top: 150px;*/
}
.xl-mainte{width:100% ;
			height: 175px;
			background: #00b7ee;
			margin-bottom: 25px;
			position: relative;}
.xl-mainte:last-child{margin-bottom: 0;}
.xl-list .xl-support{width: 329px;
					background: #00b7ee;}
.xl-list li:nth-child(3n){margin-right: 0;}

.xl-wrap{width: 122px;
		height:175px;}
.xl-wrap table{width: 122px;
		height: 175px;}
.xl-wrap1{width: 82px;
		height:175px;}
.xl-wrap1 table{width: 92px;
		height: 175px;}
.xl-side{width: 278px;
		height: 100%;}
.xl-side h2{font-size: 20px;
			font-family:"Microsoft YaHei";
			color: #FFFFFF;
			margin-top: 35px;}
.xl-side1{width: 247px;
		height: 100%;}
.xl-side1 h2{font-size: 20px;
			font-family:"Microsoft YaHei";
			color: #FFFFFF;
			margin-top: 50px;}
.xl-introduce{    width: 100%;
    margin-top: 10px;
    line-height: 30px;
    font-size: 16px;
    color: #FFFFFF;
    font-family:'Microsoft YaHei';}
.xl-sustain{width: 100%;
		}
.xl-sustain .xl-list2 li{width: 100%;
						height: 100%;
						float: none;
						font-size: 22px;
						color: #FFFFFF;
						margin-top: 18px;}
.xl-sustain .xl-list2 li a{font-size: 18px;
						color: #FFFFFF;
						text-decoration:none;
						font-family: "Microsoft YaHei";}
.xl-particul{display: block;
			font-size: 12px;
			font-family: "Microsoft YaHei";
			color: #ffd600;
/*			margin-top: 15px;*/
			    float: right;
    margin-right: 50px;
     text-decoration: none;}



/* animation */
@import url(http://fonts.googleapis.com/css?family=Cabin+Condensed:700);

@-webkit-keyframes icon-bounce {
  0%, 100% {
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
      -o-transform:scale(0.5); 
     -moz-transform:scale(0.5);  
  -webkit-transform:scale(0.5);  

  }

  50% {
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  75% {
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

 85% {
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}



/* styles */

a {
  color: #000;
  text-decoration: none;
}


.container {
/*  max-width: 1000px;*/
  margin: 0 auto;
/*  padding-top: 40px;*/
}

.service-item {

}
.xl-mainte:hover .service-item .service-icon {
  -webkit-animation: icon-bounce 0.5s alternate;
  -moz-animation: icon-bounce 0.5s alternate;
  -o-animation: icon-bounce 0.5s alternate;
  animation: icon-bounce 0.5s alternate;
}
.xl-support:hover .service-item .service-icon {
  -webkit-animation: icon-bounce 0.5s alternate;
  -moz-animation: icon-bounce 0.5s alternate;
  -o-animation: icon-bounce 0.5s alternate;
  animation: icon-bounce 0.5s alternate;
}

.service-icon-wrap {
  text-align: center;
  display: block;
  height: 52px;
  margin-bottom: 30px;
}

.service-title {
  font-family: 'Cabin Condensed', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 20px;
  text-align: center;
  margin: 0;
  padding: 0 20px;
}
.xl-alter{width: 400px;
		height: 578px;
/*		background: #7093c3;*/
background:rgb(142,195,41);
		position: absolute;
		left: 0;
		top: 0;
		z-index: 99;
		display: none;}
.xl-mainte:hover .xl-alter{display: block;}
.xl-list3 li{width: 100%;
						height: 100%;
						float: none;
						font-size: 18px;
						color: #FFFFFF;
						margin-top: 13px;}
.xl-list3 li a{font-size: 18px;
						color: #FFFFFF;
						margin-top: 13px;
						text-decoration:none;
						font-family: "Microsoft YaHei";}
.xl-lis{margin-top: 155px;}
.xl-lis li{width:538px;
			height: 462px;
			border: 1px solid #00B7EE;
			float: left;
			margin-right: 14px;
			margin-bottom: 140px;
			}
.xl-lis li:nth-child(2n){margin-right: 0;}
.xl-img{width: 100%;
		height: 398px;}
.xl-img img{width: 100%;
			height: 100%;}
.xl-perfect{width: 100%;
			height: 66px;
			background: #00B7EE;
			line-height: 66px;
			font-size: 33px;
			color: #FFFFFF;
			text-align: center;
			font-family: "Microsoft YaHei";}
.xl-hot{text-align: center;
		color: #000000;
		font-size: 14px;
		font-weight: bold;
		font-family: "Microsoft YaHei";
		margin-bottom: 140px;
		}
.xl-lis li a{text-decoration:none;font-family: "Microsoft YaHei";}
.xl-hot a{text-decoration:none;font-family: "Microsoft YaHei";}
.xl-sustain .xl-list2 li:hover a{color: #ffd600;}
.xl-list3 li:hover a{color: #ffd600;}

.d_rcdesc{
	margin:25px 0px 35px 0px;
	text-align:left;
	font-family: "Microsoft YaHei";
	font-size: 16px;
	color:#727272;
	
}

.d_rcdesc h2{
	font-size:22px;
	width:200px;
	margin:35px auto;
}
.d_rcdesc p{
	text-indent:2em;
	width:896px;
	margin:0px auto;
	line-height: 28px;
}