/* Indeling layout................................................................................................*/					

body{
				background-color:#333333;}

div#main_container{
				margin: 0 auto 0 auto;
				width: 800px;}
				

		div#box1home{
							width: 100%;
							height: 163px;
							background-image:url(../jpgbos/homeboven.jpg);}

		div#box1hetbedrijf{
							width: 100%;
							height: 163px;
							background-image:url(../jpgbos/grachtenpandboven.jpg);}

		div#box1werkwijze{
							width: 100%;
							height: 163px;
							background-image:url(../jpgbos/utrechtse.jpg);}

		div#box1werkzaamheden{
							width: 100%;
							height: 163px;
							background-image:url(../jpgbos/rietendakboven.jpg);}

		div#box1projecten{
							width: 100%;
							height: 163px;
							background-image:url(../jpgbos/bungalowboven.jpg);}


div#box2{
					background-color: white;
					float:left;
					width: 210px;
					height: 490px;
					padding-top:2px;}

div#box3{
					background-color: white;
					float:left;
					width: 560px;
					height: 482px;
					padding-top: 10px;
					padding-left:30px;}

		div#box4home{
							clear: left;
							width: 100%;
							height: 38px;
							background-image:url(../jpgbos/homeonder.jpg)}
		
		div#box4hetbedrijf{
							clear: left;
							width: 100%;
							height: 38px;
							background-image:url(../jpgbos/grachtenpandonder.jpg)}
				
		div#box4werkwijze{
							clear: left;
							width: 100%;
							height: 38px;
							background-image:url(../jpgbos/utrechtonder.jpg)}
		
		div#box4werkzaamheden{
							clear: left;
							width: 100%;
							height: 38px;
							background-image:url(../jpgbos/rietendakonder.jpg)}
		
		div#box4projecten{
							clear: left;
							width: 100%;
							height: 38px;
							background-image:url(../jpgbos/bungalowonder.jpg)}

	
					
/* ..opmaak teksten ..............................................................................................*/					
	
										.tekst{
													font-family:Verdana, Arial, Helvetica, sans-serif;
													font-size:11px;
													line-height: 19px;
													color:#000;}
	
										.teksthoofd{
													font-family:Verdana, Arial, Helvetica, sans-serif;
													font-size:13px;
													font-weight:bold;
													color:#003399;}
	
										.tekstsubhoofd{
												font-family:Verdana, Arial, Helvetica, sans-serif;
												font-size:11px;
												font-weight:bold;
												color:#000000;
												font-style: italic;
												padding-top:5px;}
 
/* ..naw gegevens ..............................................................................................*/					
										div#adres{
												position:inherit;
												width:167px;
												height:230px;
												margin-top:100px;
												margin-left:40px;
												font-family:Verdana, Arial, Helvetica, sans-serif;
												font-size:9px;
												text-align:center;
												line-height:13px;}
												a{
													text-decoration: none;
												}
										
										h5{  
												font-family:Verdana, Arial, Helvetica, sans-serif;
												font-size:10px;
												color:#003399;
												border-top:1px #333 solid;
												padding-top: 5px;
												margin-bottom:5px;
												
												}
											
											div#vergunning{
												float:right;							
												
												background-image:url(../jpgbos/erkendleerbedrijf.jpg);}
												
/* ..tabelprojecten leveranciers ..............................................................................................*/					
										.tabelprojecten{
												width:500px;
												border-collapse:collapse;
												border-style:none;
												outline:none;
												

										}
										.tdtabelprojecten{
												padding:10px 10px 10px 10px;
												width:100px;
												border-top:1px solid #333;
												outline:none;
										}
										
										.tabellever{
												border-collapse:collapse;
												border-style:none;}
										
										.tdtabellever{
												border:1px solid #333;
										}
										
										a img {border: none;
										}
										
										.lijst{
												list-style-type: square;}
												
										.copyright{
												font-family:Verdana, Arial, Helvetica, sans-serif;
												font-size: 9px;
												color:#ccc;
												font-style:italic;
												text-align:center;
												margin-top:0px;}
	
/* knoppenbalk /* ................................................................................................*/					


ul#navigatie{
	position:relative;
	top:-15px;
	left: 0px;
	list-style:none;
	height:169px;
	width:167px;
	background-repeat:no-repeat;
	background-position:20px 50px;
			
			}
			
ul#navigatie li{
			margin-top:0px;
			margin-bottom:0px;
			}

ul#navigatie a {
			height:29px;
			width:167px;
			display:block;
			outline:none;

			}

ul#navigatie li.home a{
background-image:url(../jpgbos/home.png);
}

ul#navigatie li.hetbedrijf a {
background-image:url(../jpgbos/knophetbedrijf.png);
}

ul#navigatie li.werkwijze a {
background-image:url(../jpgbos/knopwerkwijze.png);
}

ul#navigatie li.werkzaamheden a {
background-image: url(../jpgbos/knopwerkzaamheden.png);
}

ul#navigatie li.projecten a {
background-image:url(../jpgbos/projecten.png);
height:53px;
}

ul#navigatie li.home a:hover{
background-image:url(../jpgbos/knophomeover.png);
}

ul#navigatie li.hetbedrijf a:hover{
background-image:url(../jpgbos/knophetbedrijfover.png);
}

ul#navigatie li.werkwijze a:hover{
background-image:url(../jpgbos/knopwerkwijzeover.png);
}

ul#navigatie li.werkzaamheden a:hover{
background-image: url(../jpgbos/knopwerkzaamhedenover.png);
}

ul#navigatie li.projecten a:hover{
background-image:url(../jpgbos/projectenover.png);
height:53px;
}

/* scrollbalk *//* ................................................................................................*/					

			
			div#scrollpanel{
				float:left;}
			
			div#text-block{
				width:547px;
				height:470px;
				overflow:hidden;
				float:left;
				border:0px;}
				
			div#slide{
				position:relative;
				width:10px;
				height:25px;
				float:left;}
			
			div#slide div#slider{
				width:6px;
				height:25px;
				background-color:#333333;
				position:absolute;
				left:0px;
				top:0px;
				cursor:pointer;
				overflow:hidden;
				margin-left:5px;
				margin-top:0px;}
			
			div#slide div#slidebar{
				width:4px;
				height:470px;
				border:1px;
				border-style:solid;
				border-color: #333333;
				margin-left:5px;
				margin-top:0px;}

/* lightbox *//* ...plaatjes.............................................................................................*/					

#lightbox{	
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	
	border: none;}

#lightbox img{
	width: auto;
	height: auto;}

#lightbox a img{
	border: none;}

#outerImageContainer{
	position: relative; 
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;}
	
#imageContainer{ 
	padding: 10px; }

#loading{ 
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;}
	
#hoverNav{ 
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;}
	
#imageContainer>#hoverNav{ 
	left: 0;}
	
#hoverNav a{ 
	outline: none;}

#prevLink, #nextLink{ 
	width: 49%; 
	height: 100%;
	background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
	display: block;}

#prevLink {
	left: 0;
	float: left;}

#nextLink { 
	right: 0;
	float: right;}

#prevLink:hover, #prevLink:visited:hover { 
	background: url(../jpgbos/prevlabel.gif) left 15% no-repeat; }

#nextLink:hover, #nextLink:visited:hover { 
	background: url(../jpgbos/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ 
	background-color: #fff; 
	margin: 0 auto; 
	line-height: 1.4em;
	overflow: auto;
	width: 100%	;}

#imageData{	
	padding-left:10px;
	font-family:Verdana, Helvetica, sans-serif; 
	color: #000;}
	
#imageData #imageDetails{
	width: 70%;
	float: left;
	font-weight:bold;
	font: 10px Verdana, Helvetica, sans-serif; 
	color: #003399;
	text-align: left;}	

#imageData #numberDisplay{
	display: block;
	font-family:Verdana, Helvetica, sans-serif; 
	font-style:italic;
	color:black;
	clear: left;
	padding-top: 1.0em;
	padding-bottom: 1.0em;}
	
#imageData #bottomNavClose{
	width: 66px;
	float: right;
	padding-bottom: 0.7em;
	outline: none;}	 	

#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	}

 
