body{
margin:0;
padding:0;
font-family: 'Open Sans', sans-serif;
background:#161616 url('../img/bg.jpg'); 
background-size:cover;
}

#wrapper{
	position:relative;
	width:90%;
	max-width:1100px;
	min-width:600px;
	height:auto;
	margin:0 auto;
}

#wrapper #header{
	width:100%;
}

#wrapper #header #nav{
	width:100%;
	height:auto;
	padding:50px 0;
}

#wrapper #header #nav .logo{
	position:relative;
	display:inline-block;
	vertical-align:text-top;
	width:135px;
	height:150px;
	background:url('../img/logo.png') no-repeat;
	background-size:100%;
	background-position:center center;
}

#wrapper #header #nav .contact{
	position:relative;
	display:inline-block;
	vertical-align:text-top;
	float:right;
	height:150px;
	width:40%;
	text-align:right;
	font-size:12px;
	color:#fff;
}

#wrapper #content{
	width:100%;
	min-width:600px;
	color:#fff;
	margin:40px 0 120px 0;
}

#wrapper #content .headline{
	font-weight:100;
	color:#fff;
	font-size:30px;
	text-align:center;
	width:60%;
	margin:0 auto;
	padding:0;
	line-height:1.6;
}

#wrapper #content .headline .des{
	font-weight:400;
	color:#666;
	font-size:16px;
	text-align:center;
	margin:20px auto;
	padding:0;
	line-height:1.6;
}

#wrapper #content .logos{
	margin:90px 0 0 0;
	text-align:center;
}

#wrapper #content .logos img{
	margin:0 30px;
}


#wrapper #content .more-content{
	display: flex;
	justify-content: center;
	vertical-align: middle;
	align-content: center;
	margin-top: 40px;
}

#wrapper #content .more-content .button{
	padding: 14px 20px;
	background:#dfec0b;
	color: #000;
	text-decoration: none;
	font-size: 0.9rem;
}

#wrapper #content .more-content .button:hover{
	cursor: pointer;
	opacity: 0.8;
}

#wrapper #projects{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;

}

#wrapper #projects .project{
	margin-bottom: 90px;
}

#wrapper #projects h2{
	margin: 0 auto;
	padding: 0;
	color: #fff;
	max-width: 600px;
	text-transform: uppercase;
}

#wrapper #projects .des{
	margin: 0 auto;
	margin-top: 20px;
	color: #ddd;
	max-width: 600px;
	line-height: 1.4;
}

#wrapper #projects .featured{
	padding: 20px;
	border: 1px solid #999;
}

#wrapper #projects .featured b{
	color: #fff;
}

#wrapper #projects .des ul{
	font-size: 0.9em;
	text-align: left;
}

#wrapper #projects .des ul li{
margin-bottom: 10px;
}

#wrapper #projects .images{
	margin-top: 30px;
	margin-bottom: 10px;
}

#wrapper #projects .images img{
	max-width: 700px;
	margin-bottom: 5px;
}



#wrapper #products{
	position:relative;
	width:100%;
	min-width:600px;
	color:#fff;
	margin:50px 0 0px 0;
	border-top:1px dotted #666;
	padding-top:30px;
}

#wrapper #products .title{
	margin:0 0 20px 0;
	font-size:16px;
	text-transform:uppercase;
	font-weight:600;
	color:#dfec0b;
}

#wrapper #products .grid{
	width:100%;
	min-width:600px;
	display: -webkit-inline-box;
	display: -moz-inline-box;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	display: inline-flex;
	-webkit-flex-flow: row wrap;
	justify-content: space-between;
}

#wrapper #products .grid .item{
	display:inline-block;
	width:30%;
	min-width:200px;
	font-weight:600;
	text-transform:uppercase;
	font-size:16px;
	text-align:center;
	margin:13px 0;
	padding:10px;
	background:rgba(242, 255, 0, 0.1);
}

#wrapper #products .grid .item:hover{
	background:rgba(242, 255, 0, 0.5);
	cursor:pointer;
}

#wrapper #products .grid .item-contact{
	width:100%;
	padding:20px;
	background:#dfec0b;
	font-weight:600;
	text-transform:uppercase;
	font-size:16px;
	text-align:center;
	margin:13px 0;
	color:#444;
}

#wrapper #products .grid .item img{
	height:180px;
	margin:0 auto;
}	

#wrapper #services{
	position:relative;
	width:100%;
	min-width:600px;
	color:#fff;
	margin:70px 0 50px 0;
	border-top:1px dotted #666;
	padding-top:30px;
}

#wrapper #services .title{
	margin:0 0 20px 0;
	font-size:14px;
	color:#999;
}

#wrapper #services .grid{
	width:100%;
	min-width:600px;
	display: -webkit-inline-box;
	display: -moz-inline-box;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	display: inline-flex;
	-webkit-flex-flow: row wrap;
	justify-content: space-between;
}

#wrapper #services .grid .item{
	display:inline-block;
	width:47%;
	min-width:200px;
	font-weight:600;
	text-transform:uppercase;
	font-size:18px;
	text-align:center;
	margin:13px 0;
	padding:20px 10px;
	background:rgba(63, 116, 203, 0.1);
}

#wrapper #services .grid .item .des{
	text-transform:none;
	font-weight:400;
	font-size:14px;
	color:#666;
	margin-top:5px;
}

#wrapper #services .grid .item img{
	height:180px;
	margin:0 auto;
	margin-bottom:25px;
}	


#wrapper #footer{
	position:relative;
	margin:80px 0 0 0;
}

#wrapper #footer .content{
	position:relative;
	margin:40px 0;
}





