﻿

/* 1. IMPORT SECTION */

	@import url("http://fonts.googleapis.com/css?family=Raleway:200,300,600,700&subset=latin,latin-ext");




/* 2. BASIC STYLES */

	html, body {
		height: 100%;
	}

	body {
		font-family: "Microsoft YaHei" Arial;
		font-weight: 200;
		line-height: 1.7857;
		letter-spacing: 0.075em;
		color: #333333;
		background-color: #fff;
	}

	a { 
		color: #000;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}

	a:hover {
		color: #000;
	}

	a, a:hover, a:active, a:focus, button:focus {
		outline: 0;
		border: 0;
		text-decoration: none;
	}

	#st-preloader {
		background: #FFF;
		bottom: 0;
		left: 0;
		position: fixed;
		right: 0;
		top: 0;
		z-index: 9999;
	}

	p {
		line-height: 1.5;
	}

	h1, h2, h3, h4, h5, h6{
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		text-transform: uppercase;
	}

	input, textarea{
		outline: none;
	}

	label{
		font-weight: 300;
	}
	li{
		list-style:none}
	#pre-status,
	.preload-placeholder {
		background-image: url(../images/preloader.gif);
		background-position: center;
		background-repeat: no-repeat;
		height: 40px;
		left: 50%;
		margin: -20px 0 0 -20px;
		position: absolute;
		top: 50%;
		width: 40px;
	}

	.preload-placeholder {
		background: none;
		left: 0;
		margin: 0;
		text-align: center;
		top: 65%;
	}

	.topLink{height:12px;float:left;margin-top: 15px;line-height:12px;}
	.topLink li{float:left;padding:0 15px 0 40px;border-left:1px #dbdbdb solid;}
	.topLink li a{color:#fff;font-size:12px;}
	.topLink li a:hover{color:#2b457d}
	.topLink li:nth-child(1){background:url(../images/i3.png) 15px center no-repeat;border-left: none;}
	.topLink li:nth-child(2){background:url(../images/i4.png) 15px center no-repeat;}
	.index_icon{
		background: #646464;
		width: 100%;
		height: 45px;
		line-height:45px
	}
	.index_icon .fa{
		margin:0% 6%;
	}
	.index_search{
		display: block;
		width: 73%;
		height: 34px;
		padding: 6px 12px;
		font-size: 14px;
		line-height: 1.42857143;
		color: #555;
		background-color: #fff;
		background-image: none;
		border: 1px solid #ccc;
		border-radius: 4px;
		-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
		-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		float: left;
		margin: 6px 0px 0px 0px;
}

.logo img{
	margin: 3% 0;
	}



/* 4. HEADER */

	#header{}

	#header .navbar {
		min-height: 80px;
		margin-bottom: 0;
		border-radius: 0;
	}

	.st-navbar{
		background-color: #fff;
		border-bottom: 1px solid #f0f0f0;
	}

	.st-navbar ul{
		margin-top: 15px;
	}
	.st-navbar ul li:hover{
		background-color: #0149b5;
	}
	.st-navbar ul li:hover a{
		color:#fff
	}
	.st-navbar ul li a{
		text-transform: uppercase;
		font-weight: 600;
		padding: 0;
		margin: 14px;
	}

	.st-navbar ul li a:hover,
	.st-navbar ul li a:focus {
		background-color: transparent;
	}

	
	.st-navbar .navbar-toggle .icon-bar {
		background-color: #000;
	}

	.st-navbar .navbar-toggle{
		margin-top: 7px;
		margin-right: 25px;
		padding: 0;
		border-radius: 0;
	}



/* 5. SLIDER */

	

	#home-carousel  .item {
		background-position: center top;
		background-repeat: no-repeat;
		background-size:cover;
		width:100%;
		height: 500px;
	}

	#home-carousel .item:before{
		content: "";
		height: 100%;
		top: 0;
		left: 0;
		opacity: 0.5;
		position: absolute;
		width: 100%;
	}

	.carousel-caption {
		left: 15px;
		right: 15px;
		top: 50%;
		font-size: 15px;
		text-align: left;
		color: #fff;
		text-shadow: none;
		margin-top: -130px;	
	}


	.carousel-caption h1 {
		font-size:46px;
		margin-bottom:0;
		line-height:27px;
		letter-spacing:2px;
		font-weight:100;
	}

	.carousel-caption h2 {
		font-size:81px;
		font-weight:600;
		margin-top:0px;
		text-transform:lowercase;
		letter-spacing:2px;
		margin-bottom:20px;
	}

	.home-carousel-left, 
	.home-carousel-right {	
		background-color: #f0f0f0;
		color:#000;
		font-size: 32px;
		height: 40px;
		line-height: 40px;
		margin-top: -20px;
		position: absolute;
		text-align: center;
		top: 50%;
		width: 32px;
		z-index: 999;
		-webkit-transition: 300ms;
		-moz-transition: 300ms;
		-o-transition: 300ms;
		-ms-transition: 300ms;
		transition: 300ms;
	}

	.home-carousel-left {
		left:-32px;
	}

	.home-carousel-right {
		right:-32px;
	}

	#home-carousel:hover .home-carousel-left {
		left:0;
	}

	#home-carousel:hover .home-carousel-right {
		right:0;
	}
	/* Carousel animation */

	#home-carousel .item h1, 
	#home-carousel .item h2, 
	#home-carousel .item p {
		opacity:0;
		-moz-transform: scale(0.5);
		-webkit-transform: scale(0.5);
		-o-transform: scale(0.5);
		-ms-transform: scale(0.5);
		transform: scale(0.5);
	}

	#home-carousel .item h1 {
		-webkit-transition: all 0.5s ease-in-out 0.15s;
		-moz-transition: all 0.5s ease-in-out 0.15s;
		-ms-transition: all 0.5s ease-in-out 0.15s;
		-o-transition: all 0.5s ease-in-out 0.15s;
		transition: all 0.5s ease-in-out 0.15s;
	}

	#home-carousel .item.active h1, 
	#home-carousel .item.active h2, 
	#home-carousel .item.active p {
		opacity:1;
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}

	#home-carousel .item h2 {
		-webkit-transition: all 0.5s ease-in-out 0.30s;
		-moz-transition: all 0.5s ease-in-out 0.30s;
		-ms-transition: all 0.5s ease-in-out 0.30s;
		-o-transition: all 0.5s ease-in-out 0.30s;
		transition: all 0.5s ease-in-out 0.30s;
	}

	#home-carousel .item p {
		-webkit-transition: all 0.5s ease-in-out 0.45s;
		-moz-transition: all 0.5s ease-in-out 0.45s;
		-ms-transition: all 0.5s ease-in-out 0.45s;
		-o-transition: all 0.5s ease-in-out 0.45s;
		transition: all 0.5s ease-in-out 0.45s;
	}

/*contact*/

/**/
/* 8. PRICING */
	
	#pricing{
		background-color: #f5f5f5;
		padding-top: 130px;
		padding-bottom: 120px;
	}

	.st-pricing{
		background-color: #fff;
		padding: 40px;
		margin-top: 30px;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}

	.st-pricing:hover{
		box-shadow: 0px 0px 18px #ddd;
	}

	.st-pricing h5{
		margin-top: 0;
		margin-bottom: 25px;
	}

	.st-pricing h3{
		margin-top: 0;
		margin-bottom: 25px;
	}

	.st-pricing .st-border{
		width: 100%;
		margin-bottom: 15px;
		background-color: #ccc;
	}

	.st-pricing ul{
		list-style: none;
		padding: 0;
	}

	.st-pricing ul li{
		padding: 12px 0;
		font-size: 15px;
	}

	.st-pricing a.btn-send{
		text-transform: uppercase;
		margin-top: 20px;
		padding: 10px 25px;
	}


/**/


/* 13. CONTACT */

	#contact{
		padding-top: 60px;
		padding-bottom: 60px;
	}
	
	.contact-info .contact-content{
		margin: 30px 0px;
	}

	.contact-info p{
		margin-bottom: 20px;
	}

	.contact-info p i{
		font-size: 16px;
		margin-right: 10px;
	}

	.contact-form button{
    background: #BFBFBF;
    border: 0px;
    border-radius: 25px;
    padding: 1% 5%;
    color: #fff;
}

	.contact-form input[type="text"],
	.contact-form input[type="email"]{
		border: 1px solid #E8E8E8;
		padding: 8px 14px;
		width: 100%;
		margin-bottom: 20px;
	}

	.contact-form textarea{
		border: 1px solid #E8E8E8;
		padding: 8px 14px;
		width: 100%;
		margin-bottom: 20px;
	}


#contact .fa{
	color:#000
	}
	
	
	




/* 15. FOOTER */

	#footer{
		background-color: #646464;
		padding-top: 20px;
		/* padding-bottom: 10px; */
		color:#fff;
	}
	.banquan{
		background: #8C8C8C;
		text-align: center;
		line-height: 32px;
		height: 32px;
	}
	#footer a{
		color: #fff;
	}
	#footer a:hover{
		color: #fff;
	}

	.footer-social-icons{
		text-align: right;
	}

	.footer-social-icons a{
		margin: 0 5px;
		font-size: 16px;
	}

	.footer-social-icons span{
		margin-right: 10px;
	}

	#footer dl dd{
		line-height: 26px;
	}
	

.main{
    position:relative;
    top:-40px;
}
.mainleft{
    width:412px;
    height:225px;
    background: #0149b5;
    padding-left: 23px;
}
.mainleft img{
    float:left;
    margin:36px 0px 18px 0px;
}
.mainleft p{
    font-size: 20px;
    color:#fff;
    line-height: 18px;
    float:left;
    clear:both;
    font-weight: bold;
}

.mainleft p strong{
	padding: 27% 0px 15% 0px;
	display: block;
	font-size: 28px;
	}
.go-btn{
    clear:both;
    display: block;
    float:left;
    margin-left: 1px;
    width:91px;
    height:29px;
    color: #fff;
    border: 1px dashed;
    text-align: center;
    margin: 5% 0;
}
.mainright{
    position: absolute;
    left:200px;
    top:14px;
    width: 86%;
}
.mainright li{
    float:left;
    width: 16%;
    height:197px;
    border-right:1px solid #888;
    background: #fff;
}
.mainright li a{
    display: block;
    width:100%;
    height:147px;
    padding-top: 5px;
}

.mainright li a img{
	display:block;
	margin:0px auto;
	transition-duration:500ms;
}
.mainright li a:hover img{
	transform:scale(1.1);
}

.mainright li a p{
    color:#000;
    font-size: 14px;
    padding:0px 0px 0px 30px;
    height: 36px; 
    bottom: 0px;
    margin: 17px;
	width:100%
}
.mainright p.xl1{
   background:url(../images/x_01.png) no-repeat;
}
.mainright p.xl2{
   background:url(../images/x_02.png) no-repeat;
}
.mainright p.xl3{
   background:url(../images/x_03.png) no-repeat;
}
.mainright p.xl4{
   background:url(../images/x_04.png) no-repeat;
   margin: 17px 3px;
}
.mainright p.xl5{
   background:url(../images/x_05.png) no-repeat;
}
.mainright p.xl6{
   background:url(../images/x_06.png) no-repeat;
}

.bg-red{
    width:256px;
    height:150px;
    background: #034bba;
    position: absolute;
    right: 0px;
    top: 75px;
}
.index_tel{
	font-size: 30px;
	}
.banner img{ max-width:100%}


#our-team{
	padding: 20px 0px
}
.portfolio-wrapper ul.filter{
		list-style: none;
		padding: 0;
		margin-bottom: 35px;
		margin-top: 28px;
		overflow: hidden;
	}
	.filter .nav_yiji .div1{
		padding:0px 0px 0px 20px;
	}
	.portfolio-wrapper ul.filter li{
		text-transform: uppercase;
		margin-right: 25px;
		font-weight: 600;
		float: left;
	}
	.portfolio-wrapper .pro_list ul.filter li{
		float:none;
		margin: 10px 0px;
	}
	.div1 li{
		border-bottom: 1px dashed #ccc;
	}
	.portfolio-wrapper ul.filter li a{
		color: #909090;
	}

	.portfolio-wrapper ul.filter li a:hover,
	.portfolio-wrapper ul.filter li a.active{
		color: #000;
	}

	.portfolio-wrapper .portfolio-items{
		clear: both;
	}

	.portfolio-wrapper .portfolio-content{
		position: relative;
		margin-bottom: 30px;
		border: 1px solid #ccc;
	}

	.portfolio-wrapper .portfolio-overlay{
		position: absolute;
		background-color: rgba(0, 0, 0, 0.7);
		color: #fff;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		padding: 30px;
		opacity: 0;
		-webkit-transition: all 0.3s ease-out 0s;
		-moz-transition: all 0.3s ease-out 0s;
		-ms-transition: all 0.3s ease-out 0s;
		-o-transition: all 0.3s ease-out 0s;
		transition: all 0.3s ease-out 0s;
		-moz-transform: scale(0.5);
		-webkit-transform: scale(0.5);
		-o-transform: scale(0.5);
		-ms-transform: scale(0.5);
		transform: scale(0.5);
	}

	.portfolio-wrapper .portfolio-content:hover .portfolio-overlay{
		opacity: 1;
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}

	.portfolio-wrapper .portfolio-overlay a{
		color: #fff;
		font-size: 35px;
	}
	.portfolio-wrapper .portfolio-overlay a:hover{
		color: #fff;
	}
.portfolio-wrapper .col-md-9{display: flex;flex-wrap: wrap;justify-content: center;}


/*ÃƒÆ’Ã‚Â¥ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¡Ãƒâ€šÃ‚Âµ*/
.about_bg_01{
	background-color:rgba(1,73,181,0.8);
	color:#fff;
	padding: 1% 0px;
}
.about_bg_02{
	padding:2% 0px}
	.about_bg_04 img{
		margin:0px 12%

	}
.my_title{
	margin: 3% 0px;
}
.my_title big,.my_title small{
	font-size: 45px;
	display:block;
	text-align:center;
	line-height:40px;
}
.my_title small{
	font-size: 26px;
}
.st-about p{
	line-height: 26px;
	text-indent:2em;
	}
.pinpai{
	text-align:center
}
.pinpai img{
	max-width:100%
}

.about_bg_03{
	background:url(../images/wenhua.jpg) center;
	padding: 30px 0px 100px 0px;
	}
.honor_img img{
	margin:2% 2% 5% 2%
}
.white{color:#fff}
.wenhua{
	text-align:center;
	color:#838383
}
.wenhua a{
	color:#838383
}
.wenhua:hover img{transform: scale(0.8,0.8);transition: transform 0.6s ease 0s;  }
.wenhua span{ display:block; margin:10px 0; width:100%;}
.about_bg_04{background:#fbfbfb;padding: 2% 0px;}

.st-border{
		width: 34px;
		height: 1px;
		display: block;
		background-color: #000;
	}
.team-member{
	background-color: #f5f5f5;
	
}
.member-image{
	border-bottom: 1px solid #ffffff
}
.member-image img{
	max-width:100%
}
.member-info{
		background-color: #f5f5f5;
		padding: 15px;
	}

.news_biaoti{
	text-align:center;
	color: #666;
	border-bottom:1px solid #ccc;
	margin:20px 0px;
	padding:20px 0px;
}
.news_title{
	font-size:20px;
	font-weight:bold;
	}
.pagelist {clear:both; font-size: 12px; padding:20px 0;text-align:center;}
.pagelist a{ padding: 5px 9px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin:3px; color:#666; font-family:Ã¥Â®â€¹Ã¤Â½â€œ,arial,sans-serif;}
.pagelist a:visited, #nowpage { padding: 3px 8px; margin:3px; border: solid 1px #ddd; background: #fff; text-decoration: none; }
.pagelist a:hover, #nowpage{color:#97262a; background: #fff; border-color:#97262a; text-decoration: none;}

@media screen and (max-width:640px){
.promid{
	width:100%}
}