/* -- [ 0. Reset ] -----------------------------------------------*/



html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {  
		margin: 0; 
		padding: 0; 
		border: none; 
		outline: 0; 
		font-weight: inherit; 
		font-style: inherit; 
		font-size: 100%; 
		font-family: inherit; 
		vertical-align: baseline; 
}



:focus {  
		outline: 0; 
}



ol, ul, li {  
		list-style: none; 
}



/* tables still need 'cellspacing="0"' in the markup */



table {  
		border-collapse: separate; 
		border-spacing: 0; 
}



caption, th, td {  
		text-align: left; 
		font-weight: normal; 
}



blockquote:before, blockquote:after,
q:before, q:after {  
		content: ""; 
}



blockquote, q {  
		quotes: "" ""; 
}



/* -- [ 1. Fixes ] -----------------------------------------------*/



.clearfix:after {  
		content:"."; 
		display:block; 
		height:0; 
		clear:both; 
		visibility:hidden; 
}



.clearfix {  
		display:inline-block; 
}



.clearfix {  
		display:block; 
}



* html .clearfix {  
		height:1px; 
}



a { 
		text-decoration: none;}



/* -- [ 1. General ] ---------------------------------------------*/



html, body, form, fieldset {  
		padding: 0; 
		height: 100%; 
		background:none; 
}



body {  
		color: #ffffff; 
		font: 76%/140% ; 
		margin: 0; 
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		font-size: 12px; 
		background-color: #ffffff; 
		background-image: url(../images/body-bg.jpg); 
		background-repeat: repeat-x; 
		background-position: center top; 
}



/* -- [ 1. ID's ] -----------------------------------------------*/



div#wrapper {  
		display: block; 
		width:996px; 
		margin:0 auto;  
}



#header {  
		display: block; 
		width: 996px; 
		height: 110px; 
		background-image: url(../images/header-bg.jpg); 
		background-position: center top; 
		background-repeat: no-repeat; 
		float:left; 
}

#header .hiswa {
display:block;
float:left;
width: 48px;
height: 56px; 
		background-image: url(../images/hiswa_logo.png); 
		position: relative; 
		left: -44px; 
		top: 260px;}



#contentwrapper {  
		display: block; 
		width:996px; 
		overflow:hidden; 
		float:left; 
		background-position: center top; 
		background-repeat: no-repeat; 
		background-color: #444348; 
}



.home #contentwrapper {  
		background-image: url(../images/masthead-home.jpg); 
}



.oplocatie #contentwrapper {  
		background-image: url(../images/masthead-oplocatie.jpg); 
}



.projecten #contentwrapper {  
		background-image: url(../images/masthead-projecten.jpg); 
}



.offerte #contentwrapper, .thanks #contentwrapper {  
		background-image: url(../images/masthead-offerte.jpg); 
}



.contact #contentwrapper {  
		background-image: url(../images/masthead-contact.jpg); 
}



#masthead {  
		display: block; 
		float:left; 
		width: 996px; 
		height: 310px; 
		position: relative; 
}



#content {  
		display: block; 
		float:left; 
		width: 996px; 
		padding-bottom: 45px; 
		background-position: center bottom; 
		background-repeat: no-repeat; 
		background-image: url(../images/wrapper-bg.jpg); 
		background-color: #444348; 
		color: #444; 
}



#main {  
		display: block; 
		float:left; 
		width:659px; 
		min-height: 250px;
		overflow:hidden; 
		margin: 0; 
		padding: 0 20px 20px 20px; 
		background-position: center bottom; 
		background-repeat: no-repeat; 
		background-image: url(../images/content-closure.jpg); 
}



#main-wrapper {  
		display: block; 
		float:left; 
		width:700px; 
		min-height: 250px; 
		margin: 0px; 
		background-position: center +60px; 
		background-repeat: no-repeat; 
		background-image: url(../images/maincontent-bg.jpg); 
}



#footer-wrapper {  
		display: block; 
		float:left; 
		width:700px; 
		min-height: 250px; 
		margin: -65px 0 0 28px; 
}

.main-closure {
display:block;
float:left; 
		font-size: 10px; 
		color: #f5f5f5; 
		width:700px; 
		height: 50px; 
		margin: 15px 0; 
		text-align: center; 
}





#sidebar {  
		color: #fff; 
		display:block; 
		float:left; 
		position:relative; 
		width: 230px; 
		min-height: 300px; 
		margin: -37px 0 0 20px; 
}



/* -- [ 1. NAVIGATIE ] -----------------------------------------------*/



#navigation {  
		display: block; 
		margin: 70px 0 0 500px; 
}



#navigation .navlist li {  
		float: left; 
		font-size: 14px; 
		font-weight: bold; 
		text-transform: uppercase; 
		margin: 0 15px 0 0 
}



#navigation .navlist li a {  
		color: #000; 
}



#navigation .navlist li a:hover {  
		color: #cb2e01; 
}



#navigation .navlist li a.active {  
		color: #cb2e01; 
}



/* -- [ 2. TYPOGRAFIE ] -----------------------------------------------*/



#masthead h1 {  
		font-size: 32px; 
		line-height: 48px; 
		font-weight: lighter; 
		font-style: normal; 
		text-align: center; 
		vertical-align: middle; 
		font-family: "Century Gothic", Verdana, Helvetica, Arial, sans-serif; 
		width: 440px; 
		margin: 30px 
}



#main h2 {  
		font-size: 22px; 
		font-weight: bolder; 
		color: #d32608; 
		margin: 0 0 40px 0; 
		padding: 20px 0; 
		border-top: 2px dotted; 
		border-bottom: 2px #b90207 dotted; 
}

#main a { 
		text-decoration: underline; 
		color: #3b8bd0;}



#main #text.small {  
		display:block; 
		float:left; 
		width: 360px; 
}



#main #text p {  
		margin: 0px 0 10px 0; 
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		line-height: 20px; 
}



#main #text strong {  
		margin: 10px 0px 0px 0px; 
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		line-height: 20px; 
		color: #cb2e01; 
		font-weight: bold; 
}



#main #text.small hr {  
		width: 360px; 
		display:block; 
		float:left; 
		position:relative; 
		color:#fff; 
		margin: 10px 0; 
		border-top: 2px #6f6e76 dotted; 
}



#main #text.wide hr {  
		width: 660px; 
		display:block; 
		float:left; 
		color:#fff; 
		margin: 10px 0; 
		border-top: 2px #6f6e76 dotted; 
}



#main span.greybox {  
		color: #fff; 
		display:block; 
		background-color: #6f6e76; 
		padding: 15px; 
}



#main span.greybox a {  
		color: #fff; 
		text-decoration: underline; 
}



#main .personeelcard {  
		color: #fff; 
		display:block; 
		float:left; 
		width: 300px; 
		background-color: #9e9ea0; 
		padding: 10px; 
		margin: 10px 5px 5px 0; 
}



#main .personeelcard a {  
		color: #fff; 
}



#main .personeelcard .info {  
		color: #fff; 
		display:block; 
		float:left; 
		margin: 15px 0; 
		padding: 0px; 
}



#main p img {  
		display:block; 
		float: right; 
		margin: 5px 10px 10px 10px; 
}



#main .personeelcard p img {  
		float:right; 
		display:block; 
		margin:0; 
		padding: 0; 
}



#sidecontent h3 {  
		font-size: 18px; 
		font-weight: bolder; 
		color: #fff; 
		margin: 0 0px 18px 0px; 
		padding: 18px 0; 
		border-top: 2px #fff dotted; 
		border-bottom: 2px #fff dotted; 
}



#sidecontent p {  
		font-size: 11px; 
		margin: 10px 0px; 
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		line-height: 20px; 
}



#sidecontent img {  
		display:block; 
		float:left; 
		margin: 10px 0px; 
		border: 3px #fff solid; 
}

#items {
overflow: hidden;
margin: 0 0 0 20px;
display:block;
float:left;
width: 273px;
}

#items .item {  
		width:67px; 
		height: 42px; 
		overflow:hidden; 
		display:block; 
		float:left; 
		margin: 25px 0 0 20px; 
}



#large {  
		display:block; 
		float:right; 
		width:273px; 
		height: 176px; 
		margin: 25px 0 0 0; 
}



#items .item img {  
		width: 76px; 
		overflow:hidden; 
		cursor: pointer; 
}



#large .item img {  
		width: 273px; 
		overflow:hidden; 
}



div.contactform {  
		color: #fff; 
		display:block; 
		background-color: #6f6e76; 
		padding: 15px; 
}



div.formobject {  
		margin: 0 0 5px 0; 
		display: block; 
		clear:both; 
		height: 25px; 
}



div.formobject_txt {  
		margin: 0 0 5px 0; 
		display: block; 
		clear:both; 
		height: 65px; 
}



div.formobject label {  
		display:block; 
		margin: 0 0 5px 0; 
		vertical-align: baseline; 
		width: 140px; 
		float:left; 
}



div.formobject_txt label {  
		display:block; 
		margin: 0 0 5px 0; 
		vertical-align: baseline; 
		width: 140px; 
		float:left; 
}



div.formobject input, div.formobject_txt input {  
		border: none; 
		width:400px; 
		float:left; 
}



div.formobject input.verplicht {  
		background-color: #d8daff; 
}



div.formobject input.button, div.formobject_ext input.button {  
		border: none; 
		font-size: 12px; 
		color:#fff; 
		padding: 5px; 
		width:80px; 
		margin:5px 5px 0 80px; 
		background-color: #46454a; 
		float: right; 
}



div.formobject_txt textarea {  
		color:#000; 
		width:400px; 
		float:left; 
		background-color: #ffffff; 
		overflow: auto; 
		height: 60px; 
		border:none; 
}



#freeform hr {  
		width: 630px; 
		display:block; 
		color:#fff; 
		margin: 10px 0; 
		border-top: 2px #fff dotted; 
}



#projects {  
		width: 660px; 
		display:block; 
float:left;
clear:both;
margin: 10px 0 0 0;
}



#projects hr {  
		width: 660px; 
		display:block; 
		color:#fff; 
		margin: 10px 0; 
		border-top: 2px #6f6e76 dotted; 
}



#projects strong {  
		margin: 10px 0px 0px 0px; 
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		line-height: 20px; 
		color: #cb2e01; 
		font-weight: bold; 
}



#projects #overview {  
		font-family: Verdana, Helvetica, Arial, sans-serif; 
		line-height: 22px;
		font-size: 10px; 
		color: #fff; 
		width: 630px; 
		padding: 15px; 
		overflow:hidden; 
		background-color: #6f6e76; 
}



#projects #overview #project {
margin: 0 5px;
		padding: 5px 5px;  
		width: 295px; 
		overflow:hidden; 
		display: block; 
		float:left; 
}



#projects #overview #project:hover { 
		background-color: #5f5d64;
		cursor: pointer;}



#projects #overview a { 
		color: #fff;
		cursor: pointer; 
		text-decoration: none;}



#projects #overview #project img {  
		width: 76px; 
		overflow:hidden; 
		display: block; 
		margin: 0 15px 0 0; 
		float:left; 
		border: 3px #ffffff solid;}