/* Reset */
* { margin:0; padding:0; outline:none; border:0; text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px; color:#d0d0d0; }
body { background:url(../img/body-bg.png) repeat #151515;}

/* Standard styles */
.wrapper { margin:auto; width:940px; overflow:hidden; }
.content { margin:auto; width:630px; overflow:hidden; }
.last { margin-left:0; margin-right:0; }
.hide { visibility: hidden; }

.title { text-transform:uppercase; padding: 0 20px; margin-bottom:45px; }
.title .hoofd { font-size:50px; color:#fff; }
.title .hoofd span { font-size:50px; color:#3aaad4; }
.title .sub { font-size:30px; color:#cbcbcb; text-align:right; }

h1 {  }
h2 {  }
h3 { font-size:20px; color:#fff; text-transform:uppercase; margin:10px 0; }
h3 a{ font-size:20px; color:#fff; text-transform:uppercase; margin:10px 0; }
h3 a:hover{ color:#3aaad4; }

p { text-align:justify; margin:10px 0; }

.full_width { display:inline-block; width:100%; vertical-align: top;  }
.one_half { display:inline-block; width:270px; vertical-align: top; margin-right: 86px; }
.one_half_last { display:inline-block; width:270px; vertical-align: top; margin-right: 0px; }
.one_third { display:inline-block; width:147px; vertical-align: top; margin-right: 90px; }
.one_third_last { display:inline-block; width:147px; vertical-align: top; margin-right: 0px; }
.two_third { display:inline-block; width:294px; vertical-align: top; margin-right: 90px; }
.two_third_last { display:inline-block; width:294px; vertical-align: top; margin-right: 0px; }

/* Header styles */
#header {
	background-image: url(../img/head-bg.png);
	overflow: hidden;
	height: 234px;
	width: 100%;
}
#header .wrapper { 
	margin:auto; 
	width:940px;
	height:100%;
	background:url(../img/head-overlay.png) no-repeat center top;
}
#header .wrapper .content {
	margin:auto; 
	width:630px;
}
#header .wrapper .content #logo { 
	float:left;
	margin-top:65px;
}
#header .wrapper .content #menu { 
	float:right;
	margin-top:44px;
}
#header .wrapper .content #menu ul { 
	width:150px;
}
#header .wrapper .content #menu ul li { 
	list-style-type:none;
}
#header .wrapper .content #menu ul li a { 
	display:block;
	width:130px;
	padding:5px 10px 0;
	color:#fff;
	font-size:20px;
	text-transform:uppercase;
}
#header .wrapper .content #menu ul li a:hover { 
	background:#3aaad4;
	color:#fff;
}

/* Diesnten styles */
#diensten {
	width: 100%;
	padding: 90px 0;
}

/* Over ons styles */
#overons {
	width: 100%;
	padding: 90px 0;
	background:url(../img/light-bg.png) repeat #202020;
	background:url(../img/light-bg.png) repeat #202020;
}

/* Klanten styles */
#klanten {
	width: 100%;
	padding: 90px 0;
}
#klanten .item {
	width:108px;
	height:108px;
	display:inline-block;
	border:1px solid #202020;
	margin:0 16px 16px 0;
}
#klanten .item_last {
	width:108px;
	height:108px;
	display:inline-block;
	border:1px solid #202020;
	margin:0 0 16px 0;
}
#klanten .payoff {
	text-align:right;
	padding:0 20px;
}

/* Portfolio styles */
#portfolio {
	width: 100%;
	padding: 90px 0;
	background:url(../img/light-bg.png) repeat #202020;
}
#portfolio .content2 {
	margin: auto;
    overflow: hidden;
    width: 650px;
	}
#portfolio .visual{
	width:626px;
	height:346px;
	display:inline-block;
	border:1px solid #2f2f2f;
	margin:0 16px 16px 0;	
	padding:1px;
}
#portfolio .item {
	width: 108px;
	height: 108px;
	float: left;
	text-align: center;
	overflow: hidden;
	border:1px solid #2F2F2F;
	margin:10px;
	/*
	width:108px;
	height:108px;
	display:inline-block;
	border:1px solid #2f2f2f;
	margin:0 16px 16px 0;
	*/
}
#portfolio .item_last {
	width:108px;
	height:108px;
	display:inline-block;
	border:1px solid #2f2f2f;
	margin:0 0 16px 2px;
}
#portfolio .payoff {
	text-align:right;
	padding:0 20px;
}

/* Contact styles */
#contact {
	width: 100%;
	padding: 90px 0;
}
#contact h3{
	margin-top:0;
}
#contact .one_third2 { 
	float:left;
	width:170px; 
	margin-right: 60px; 
}
#contact .one_third2_last {  
	float:left;
	width:170px; 
	margin-right: 0px; 
}
#contact span {
	color: #3aaad4;
}
#contact label {
	cursor:pointer;
}
#contact input { 
	width:147px; 
	color: #5e5e5e;
	padding:6px 10px;
	background:#181818;
	border:1px solid #202020;
	margin-bottom:8px;
}
#contact input:hover, #contact input:focus, #contact textarea:hover, #contact textarea:focus { 
	background:#222222;
}
#contact input[type="submit"] { 
	width:auto;
	background:#3aaad4;
	color:#fff;
	border:1px solid #3688a8;
	padding:6px 15px;
}
#contact textarea { 
	width:147px; 
	height:190px; 
	color: #5e5e5e;
	padding:6px 10px;
	background:#181818;
	border:1px solid #202020;
	margin-bottom:10px;
}

/* Header styles */
#footer {
	background-image: url(../img/footer-bg.png);
	overflow: hidden;
	height: 234px;
	width: 100%;
}
#footer .wrapper { 
	margin:auto; 
	width:940px;
	height:100%;
	background:url(../img/head-overlay.png) no-repeat center bottom;
}
#footer .wrapper .content {
	margin:auto; 
	width:630px;
}

ul#filterOptions {
	overflow: hidden;
	margin-left:10px;
	margin-bottom:6px;
}
ul#filterOptions li { margin-right: 3px; display: inline-block; float: left; }
ul#filterOptions li a.all {
	padding: 8px 20px;
	display: block;
	background: #fff;
	color:#999; }
ul#filterOptions li a.web, ul#filterOptions li a.druk, ul#filterOptions li a.huis {
	padding:8px 20px;
	display: block;
	background: #3AAAD4;
	color:#fff; }
ul#filterOptions li a.web:hover, ul#filterOptions li a.druk:hover, ul#filterOptions li a.huis:hover, ul#filterOptions li a.all:hover  {
	padding: 8px 20px;
	display: block;
	background: #878787;
	color:#fff;
}
ul.ourHolder {
	overflow: hidden;
}
ul.ourHolder li.item {
	width: 108px;
	height: 108px;
	float: left;
	text-align: center;
	overflow: hidden;
	border:1px solid #2F2F2F;
	margin:4px;
}

.top { width:630px; margin:auto; text-align:right; position:relative; top:9px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }
.top2 { width:630px; margin:auto; text-align:right; position:relative; top:-9px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }
.top a, .top2 a { background: #252525; padding:3px 10px; border:1px solid #111; font-size:10px;  -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }
.top a:hover, .top2 a:hover { background:#3AAAD4;border:1px solid #3AAAD4;  padding:3px 10px; font-size:10px;  -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }