/* General */
html, body, h1, h2, h3, h4, h5, h6, p, form, fieldset, ul, ol, li, dl, dt, dd, legend { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address { margin: 5px 0; padding: 0; }
input, select, textarea { font: 100% Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333; background: #fff;  }

h1, h2, h3,h4 { background: transparent; color: #9ECDE2; padding: 0.2em 0 0.7em 0; font: bold 170% Verdana, Geneva, Arial, Helvetica, sans-serif; clear: both; }  
h2 {color: #515151; background: transparent; font-size: 13px;} 
h3 {color: #515151; background: transparent; font-size: 120%;}
h4 {color: #000; background: transparent; font-size: 100%;}
address { font-style: normal; margin: 0.5em 0; }
img { border: none; display: block; } 
.access { position: absolute; left: -9999px; }

body {
	background: #9ecde2 url(../img/bg.jpg) 0 0;
	text-align: center;
	color: #8a8f91;
	margin: 0; padding: 0;
	font: 68%/150% Verdana, Geneva, Arial, Helvetica, sans-serif; 
	
}
/*Definition list op contactpagina, evt class geven wanneer er een andere wordt gebruikt*/
 dl
{
width: 41.1em;
margin: 0.5em 0 40px 0;
padding: 0;

}

 dt
{
width: 10em;
float: left;
margin: 0;
padding: .2em;

}

.Topintro
{
	display:none;
}

 dd
{
float: left;
width: 24em;
margin: 0;
padding: .2em;

}

.h2toh1
{
	color: #515151; background: transparent; font-size: 13px;
}


a {
	font-weight: bold;
	color: #90c6de;
	background: transparent;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

h2 a{
background: transparent; 
color: #515151;
text-decoration:none;
}

h2 a:hover
{
	color: #8dc6de;
	text-decoration:none;
}




#main-wrap {
 margin: 0 auto;
	text-align: left; 
	width: 786px;


}
#inner-wrap {
background: transparent url(../img/back-wrapper.png) repeat-y top right;
width: 786px;
float: left;
}


#logo {
	background:url(../img/logo-bg.png) no-repeat top right;
		width: 786px;
		height: 112px;
}


a.logo-link {
	background:url(../img/logo.png) no-repeat 0 0;
	height: 112px;
	border:none;
	width: 350px;
	display: block;
	position: relative;
	top: 0;
	left: 0;
	float: left;

}

/* Submenu naast logo */

ul#submenu {
float: right;
	margin: 75px 25px 0 0;
	color: #fff;
	background: transparent;
}

ul#submenu li {
	list-style: none;
	display: inline;
}

ul#submenu li a {
	color: #fff;
	background: transparent;
	text-decoration: none;
	font-weight: normal;
}

ul#submenu li a:hover
{
	text-decoration: underline;
}

/*Hoofdmenu*/

ul#menu {
	background: transparent url(../img/back-right-menu-ie.png) no-repeat top right ;/* schaduwrandje*/
		margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
	color: #fff;
	float: left;
	width: 786px;
	height: 30px;
	
}

ul#menu li {

display: inline;
float: left;
padding: 0;
margin: 0;
height: 30px;
}

ul#menu li a:hover
{
	color: #8dc6de;
}

ul#menu li a {
height: 30px;
width: 130px;
/*overflow: hidden;  IE */
line-height:270%;
font-size: 90%;
text-decoration: none;
color: #fff;
background: transparent url(../img/menu_arrow.png) no-repeat bottom center;
float: left;
padding: 0;
margin: 0;

}
ul#menu li.home-link a {
	width: 120px;
}
ul#menu li.producten-link a {
	width: 120px;
}
ul#menu li.service-link a {
	width: 170px;
}
ul#menu li.offerte-link a {
	width: 120px;
}
ul#menu li.over-link a {
	width: 125px;
}
ul#menu li.contact-link a {
	width: 125px;
}


.spacer
{
	clear: both;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
}

/*Headers verschillend op Home/Producten etc*/

#header {

}


/*Home*/

body#home #header {
	background: url(../img/header/home.jpg) no-repeat bottom left;
	width: 780px;
	height: 242px;
	
	
}

/*Producten*/
body#product #header,
body.product-detail #header {
	background: url(../img/header/product.jpg) no-repeat 0 0;
	width: 780px;
	height: 181px;

}

/*Service*/
body.service #header 
{
	background: url(../img/header/service.jpg) no-repeat 0 0;
	width: 780px;
	height: 181px;
}

body.about #header 
{
	background: url(../img/header/overons.jpg) no-repeat 0 0;
	width: 780px;
	height: 181px;
}

/*Offerte*/
body.offerte #header {
		background: url(../img/header/offerte.jpg) no-repeat 0 0;
	width: 780px;
	height: 181px;

}

/*Contact*/
body.contact #header {
		background: url(../img/header/contact.jpg) no-repeat 0 0;
	width: 780px;
	height: 181px;

}


#content {
	width: 780px;
	background: #fff;
	color: #8a8f91;
}



#blokken {
	background: url(../img/back-blokken.png) repeat-y 0 0;
	float: left;
	width: 780px;

}


body#algemeen #blokken {
	background: url(../img/back-producten-detail.png) repeat-y 0 0;


}

/*Linkerkant als blok over de hele breedte gaat*/
#blokken .deel-a {
	width: 235px;
	float: left;
margin: 20px 0 0 0;
padding-left:15px; 
overflow: hidden;
}

body#algemeen #blokken .blok1 .deel-a img {
	margin: 10px 0 20px 0;
	padding-left: 10px;
	float: left;
	width: 198px;
}





/*pdf linkjes op servicepagina*/
#blokken .deel-a ul#pdf {
	list-style: none;
		font-weight: bold;
		color: #000;
			background: transparent;
	float: left;
	font-size: 100%;
}

#blokken .deel-a ul#pdf li {
	float: left;
		padding:0 0 0 10px;
		
	
}

#blokken .deel-a ul#pdf li a {
	color: #000;
	background: url(../img/pdf.png) no-repeat 0 0;
	padding:0 0 10px 70px;
	float: left;
}

#blokken .deel-a ul#pdf li a:hover
{
	text-decoration: none;
}

#blokken .deel-a ul#pdf li a span {
	color: #90C6DE;
		background: transparent;
		padding:0 0 10px 0px;
 float: left;
		
}

/*Blokken homepage*/
body#home #blokken .blok1 {
	
	float: left;
	width: 260px;
	min-height: 296px; /*IE heeft een beetje moeite met min-height*/
 
}

body#home #blokken .blok1 a.img-link {
background: url(../img/blokken/home-1.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}

body#home #blokken .blok2 {
float: left;
width: 260px;
min-height: 296px; /*IE heeft een beetje moeite met min-height*/
}


body#home #blokken .blok2 a.img-link {
background: url(../img/blokken/home-2.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}

body#home #blokken .blok3 {
	
	float: left;
	width: 260px;
	min-height: 296px; /*IE heeft een beetje moeite met min-height*/

}

body#home #blokken .blok3 a.img-link {
background: url(../img/blokken/home-3.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}

body#home #blokken .blok4 {
	background: url(../img/blokken/home-4.jpg) no-repeat bottom left;
	float: left;
	width: 520px;
	height: 230px; /*IE heeft een beetje moeite met min-height*/
	border-top: 1px solid #cccccc;

}

body#home #blokken .blok5 {
	
	float: left;
	width: 260px;
	height: 230px; /*IE heeft een beetje moeite met min-height*/
	border-top: 1px solid #cccccc;
	background: url(../img/blokken/home-5.jpg) no-repeat bottom right;

}
body#home #blokken .blok5 a.img-link {
border:none;
width:260px;
height: 237px;
float:left;
}

/*Blokken productenpagina*/
body#product #blokken .blok1 {

	float: left;
	width: 260px;
}


body#product #blokken .blok1 a.img-link {
background: url(../img/blokken/product-1.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}

body#product #blokken .blok2 {
	
	float: left;
	width: 260px;
min-height: 296px; /*IE heeft een beetje moeite met min-height*/
}


body#product #blokken .blok2 a.img-link {
background: url(../img/blokken/product-2.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}


body#product #blokken .blok3 {
	float: left;
	width: 260px;
	min-height: 296px; /*IE heeft een beetje moeite met min-height*/

}


body#product #blokken .blok3 a.img-link {
	background: url(../img/blokken/product-3.jpg) no-repeat 0 0;
border:none;
width:260px;
height: 140px;
float:left;
}


body#product #blokken .blok4 {
background: url(../img/blokken/product-4.jpg) no-repeat bottom right;
float: left;
width: 260px;
min-height: 230px; /*IE heeft een beetje moeite met min-height*/
clear: both; /* bij grotere fonts nu geen verspringen */
}

body#product #blokken .blok5 {
	background:#fff; /* om de lijntjes niet te zien! */
	float: left;
	color: #8a8f91;
	width: 520px;
	min-height: 230px; /*IE heeft een beetje moeite met min-height*/
	border-top: 1px solid #ccc;
}

/*Productdetail + service + contact pagina*/
body#algemeen #blokken .blok1 {
	width: 780px;
	min-height: 250px; /*IE heeft een beetje moeite met min-height*/
	border-top: 1px solid #ccc;
	overflow: hidden; /*voor IE , om versrpingen tegen te gaan*/
	padding-bottom: 10px; /*Beetje lucht aan de onderkant*/
} 

/*1e blok geen border*/
body#algemeen #blokken .first {
	border: none;
	
}



/*Selectbox en h1 */
body.product-detail #blokken .blok1 form#select {
	float: right;
	margin: -60px 0 0 0;

}

body.product-detail #blokken .blok1 h1 {
	margin-bottom: 30px;
}

body#algemeen #blokken .blok4 {
	background: url(../img/blokken/product-4.jpg) no-repeat bottom right;
	float: left;
	width: 260px;
 min-height: 230px; /*IE heeft een beetje moeite met min-height*/

}

body#algemeen #blokken .blok5 {
	float: left;
 	width: 520px;
	border-top: 1px solid #ccc;
	color: #8a8f91;
}





/*Teksten in de blokken, een div omheen om wat flexibeler te zijn */
body#home #blokken .blok1 .tekst,
body#home #blokken .blok2 .tekst,
body#home #blokken .blok3 .tekst,
/*Teksten in de blokken op productpagina */
body#product #blokken .blok1 .tekst,
body#product #blokken .blok2 .tekst,
body#product #blokken .blok3 .tekst {
	padding: 10px 0 0 30px;
	width: 220px;
	float: left;
}

body#home #blokken .blok4 .tekst{
	padding: 50px 0 0 290px;
	width: 210px;
	float: left;
}



body#product #blokken .blok5 .tekst {
	padding: 30px 0 0 20px;
		width: 470px;
	float: left;
}

/*Teksten en images in de blokken op de product detailpagina + service + contact */

body#algemeen #blokken .blok1 .tekst {
margin: 20px 20px 0 0;
width: 480px;
float: right;
background: #fff; /*achtergrond lijn moet weg*/
color: #8a8f91;
}

body#algemeen #blokken .blok1 img {
	float: left;
	margin-top: 30px;
}

body.offerte #blokken .blok1 img.img-bottom{
margin:0 0 -15px 0;
float: left;
}

body#algemeen #blokken .blok5 .tekst {
	padding: 30px 0 0 20px;
	width: 470px;
	float: left;
}


a.verder { 
	background: url(../img/bullet-logo.png) no-repeat 2px 5px;
	padding: 8px 0 20px 25px;
	height: 25px;
	float: left;
	margin: 10px 0;
}

/*Einde blokken Home*/
#footer {
	background: transparent url(../img/footer.png) no-repeat 0 0;
	float: left;
	width: 786px;
	height: 30px;
	color: #fff;
padding: 10px;
margin-bottom: 20px;
}

#footer a {
	color: #fff;
	background: transparent;
float: right;
margin: -25px 20px 0 0;
text-decoration: none;
font-weight: normal;
}


/*-----------------------------

Formulier Contactpagina

-------------------------------*/
form {
	float: left;
	margin-top: 15px;
}


	fieldset {
		margin: 1em 0;
		padding: 1em;
		border:solid 0 transparent; /*geen border, ook niet in Opera*/
		float: left;
		}
	
	fieldset.vraag {
		width: 180px;
		margin-right: 35px;
  
	}
	
	legend {
		color: #8A8F91;
		background: transparent;
		font-weight: bold;
		margin-left: 0px;
	}

label {
	width: 80px;
	float: left; /* mooi onder elkaar */
	clear: both;
}
	
	
input[type="text"]  {
	width: 170px;
	border: 1px solid  #8b8f92;
		height: 15px;
	padding: 1px 1px 1px 2px;

}	
	
input.input-dark, textarea.input-dark
{
	background: #9ecde2;
	color: #FFFFFF;	
}

input#postcode 
{
	width: 45px;
}
	
textarea 
{
	width:455px;
	height: 145px;
	border: 1px solid  #8b8f92;
	padding: 1px 1px 1px 2px;
}
	
	.submit {
		width: 67px;
		height: 26px;
		float: left;
		border: none;
	}
	
	