@import "fonts.css";
@import "page.css";
 @font-face {
font-family: 'DroidKufi-Regular';
src: url('../fonts/DroidKufi-Regular.eot');
src: url('../fonts/DroidKufi-Regulard41d.eot?') format('embedded-opentype'),
url('../fonts/DroidKufi-Regular.woff') format('woff'),
url('../webfont/fonts/DroidKufi-Regular.html') format('truetype'); }  
@font-face {
    font-family: "geww";
    font-style: normal;
    font-weight: normal;
    src: url("../font/gewwd41d.eot?#iefix") format("embedded-opentype"), url("../font/geww.woff") format("woff"), url("../font/geww.ttf") format("truetype"), url("../font/geww.svg#HacenCasablancaRegular") format("svg");
}
body{
	position: relative;
	margin: 0px;
	padding: 0px;
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	background-color: #f5f5f5;
}
a {
   outline: 0;
}
ul , li , a{
	padding: 0;
	margin: 0;
	list-style-type: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	list-style-image: none;
}
a:hover{
	text-decoration: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
.clear_in{
	clear: both;
}
header{
	background-color: #31708f75;

}
.logo{
	margin-top: 15px;
	margin-bottom: 15px;
}
.logo img{
	height: auto;
	max-width: 100%;
}

.cl-effect-12 a::after {
	width: 90px;
	height: 90px;
	border-width: 6px;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);
	transform: translateX(-50%) translateY(-50%) scale(0.8);
}

.cl-effect-12 a:hover::before,
.cl-effect-12 a:hover::after,
.cl-effect-12 a:focus::before,
.cl-effect-12 a:focus::after {
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
	transform: translateX(-50%) translateY(-50%) scale(1);
}
#pop{
	margin: 0px;
	padding: 0px;
	float: left;
}

#pop li ul {
	margin: 0;
	padding: 0;
	list-style: none;

}
#pop li {
	float: right;
	text-align: right;
	margin: 0;
	padding: 0;
	position: relative;
	list-style-image: none;
	list-style-type: none;
}
#pop li li {
	float: right;
	width: 250px;
	margin: 0;
	padding: 0;
}
#pop li a, #pop li a:link, #pop li a:visited {
	font-family: "JF Flat Regular";
	color: #FFF;
	text-decoration: none;
	display: block;
	padding-top: 40px;
	padding-right: 15px;
	padding-bottom: 40px;
	padding-left: 15px;
	font-size: 16px;
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0px;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #405667;
}
#pop li a:hover, #pop li a:active {
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #50b9ce;
}
#pop li li a, #pop li li a:link, #pop li li a:visited {
	color:#FFF;
	width: 250px;
	margin: 0px;
	font-size: 14px;
	text-align: right;
	padding-top: 5px;
	padding-right: 12px;
	padding-bottom: 5px;
	padding-left: 12px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #60c2d2;
}
#pop li li a:hover, #pop li li a:active {
	color: #FFF;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */
	background: #45484d; /* Old browsers */
	background: -moz-linear-gradient(left,  #45484d 0%, #000000 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #45484d 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #45484d 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=1 );	
}
#pop li li  a:hover::before  , #pop li li  a:hover::after {
	display:none;
	border:none !important
}
#pop li ul {
	position: absolute;
	width: 250px;
	display: none;
	z-index: 222;
	right: 0px;
}
#pop li:hover ul {
	display: block;
}
#pop li a .fa {
	padding-left: 10px;
	font-size: 16px;
	color: #FFF;
}
.all_site{
	position: relative;
	padding-top: 30px;
}
.slider_in{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: auto;
	z-index: -1;
	overflow: hidden;
}
.slider_in .logo_ba{
	height: 555px;
	width: 1078px;
	position: absolute;
	z-index: 5;
	left: 0px;
	bottom: 50px;
	background-repeat: no-repeat;
	background-position: left bottom;
}
.slider{}
.slider li{
	position: relative;
	height: 750px;
	text-align: right;
}
.slider li img{
	position: absolute;
	width: 100%;
	left: 0px;
	top: 0px;
	z-index: -1;
	height: auto;
}
.slider li .text{
	font-family: "JF Flat Regular";
	font-size: 30px;
	font-weight: normal;
	color: #FFF;
	line-height: 45px;
	z-index: 99;
	padding-top: 250px;

}
.slider li .text h2{
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: right;
}
.frag_{
	height: 610px;
}
.service_in{
	font-family: "JF Flat Regular";
	background-color:#8bb9ce;
	color: #FFF;
	text-align: center;
	padding-top: 75px;
	padding-bottom: 75px;
	background-image: url(../img/service_ba.png);
	background-repeat: no-repeat;
	background-position: left bottom;
}
.service_in .item a{
	font-family: "JF Flat Regular";
	color: #4d5d70;
	text-decoration: none;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 18px;
	color: #FFF;
	text-decoration: none;
	padding-bottom: 10px;
	}

.service_in h2.title_section{
	font-size: 28px;
	padding-bottom: 70px;
	color: #FFF;
}
.service_in .item{
	margin-right: 50px;
	margin-left: 50px;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #f7ff7b;
	padding-bottom: 40px;
}
.service_in .text{
	height: 140px;
	overflow: hidden;
	color: #FF9;
}
.prodect_in{
	font-family: "JF Flat Regular";
	padding-bottom: 80px;
}
.prodect_in h2.title_section{
	font-size: 28px;
	font-weight: normal;
	color: #000;
	text-align: center;
	padding-top: 60px;
	padding-bottom: 45px;
}
.prodect_in .item{
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #50b9ce;
	max-width:100%;
}
.prodect_in .item:hover .text{
	color:#CCC;
}
.prodect_in .item:before{
	background-color: #314555;
}
.prodect_in .item .img_in{
	height: 230px;
	width: 100%;
	background-color: #eeeeee;
	position: relative;
}
.prodect_in .item .img_in .img_effect{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;	
	background: rgba(40,47,57, .67);
	text-align: center;
	opacity: 0;
	transition: all .3s ease;
	
}
.prodect_in .item:hover .img_in .img_effect{
	opacity: 1;
}
.prodect_in .item img{
	max-width:100%;
	max-height:100%;
	height: 100%;
	width: 100%;
	}
.prodect_in .item .inner{
	padding: 10px;
}	
.prodect_in .item:hover  a.title{
	color: #FFF;
}
	
.prodect_in .item  a.title{
	font-family: "JF Flat Regular";
	color: #333;
	text-decoration: none;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 16px;
	color: #036;
	text-decoration: none;
	padding-bottom: 10px;
	}
.prodect_in .item .text{
	color: #666;
	line-height: 25px;
	height: 200px;
	overflow: hidden;
}
.news_in{
	font-family: "JF Flat Regular";
	}

.news_in .inner{
	padding-top: 15px;
	padding-left: 15px;
}
.news2{
	padding-top: 0px !important;
	padding-bottom: 60px   !important;
	max-width:100%

}
.news{
	padding-top: 60px;
	padding-bottom: 60px;
}
.news2 .item{
	margin-right: 100px !important;

}
.news2 .item:before{
	background-color: #faac50 !important;
}
.news .item:before{
	background-color: #8fe1ef 
}
.news .item {
	margin-right: 30px;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 45px;
	max-width:100% !important
}
.news .item .img_in {
	height: 170px;
	width: 170px;
	margin-left: 30px;
	background-color: #D6D6D6;
	float: right;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
border-radius: 150px;	overflow: hidden;
}
.news .item .img_in img{
	height: 100%;
	width: 100%;
}
.news .item a.title{
	font-family: "JF Flat Regular";
	color: #333;
	text-decoration: none;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 16px;
	color: #FFF;
	text-decoration: none;
	padding-bottom: 10px;
}
.news .item .wasf{
	color: #EFEFEF;
	text-decoration: none;
	padding-top: 15px;
	height: 75px;
	overflow: hidden;
}
.news_in{
	background-image: url(../img/News_ba.png);
	background-repeat: no-repeat;
	background-position: center top;
}

.partners{
	position: relative;
	font-family: "JF Flat Regular";
}
.partners_ba{
	background-color: #1f262e;
	padding-bottom: 85px;
	}
.partners .item img{
	max-width:100%;
	height:auto;
	}
.partners .part_ba{
	background-color: #1f262e;
	padding-top: 240px;
	position: absolute;
	top: -160px;
	z-index: -1;
	width: 100%;
}
.partners h2.title{
	color: #FFF;
	text-align: center;
	padding-bottom: 50px;
}

.contact{
	font-family: "JF Flat Regular";
	padding-top: 60px;
	padding-bottom: 60px;
	background-image: url(../img/contact_ba.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	}
.contact h2.title{
	text-align: center;
	padding-bottom: 60px;
}
.contact div{
	margin-top: 5px;
	margin-bottom: 5px;
}
.contact textarea{
	height: 155px
	}
.map_in{
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #38404a;
}	
footer{
	font-family: "JF Flat Regular";
	background-color: #4d5d70;;
	padding-top: 60px;
	padding-bottom: 60px;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #50b9ce;
}
footer ul li a{
	color: #FFF;
	text-decoration: none;
	display: block;
	padding: 5px;
}
footer .social_link{}
footer .social_link a{
	color: #FFF;
	text-decoration: none;
	height: 35px;
	width: 35px;
	border: 2px solid #FFF;
	text-align: center;
	display: inline-block;
	margin-right: 5px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	padding-top: 5px;
}
footer .social_link a:hover{
	color: #FF0;
}