/* CSS Document */

/*
=======================================================
	 Stijldocument voor de basisopmaak voor:
	 http://www.jolijnlangeveld.nl
	 gemaakt door: MariekŠUniek/Marieke van Esveld
=======================================================
 */

/* eerst even alle standaard browser marges op 0 zetten 	
*/
* {
	margin: 0;
	padding: 0;
}
ul, ol { list-style: none; }

html {
height:100%;
max-height:100%;
padding:0;
margin:0;
border:0;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
	scrollbar-face-color: #cdd8dd;
	scrollbar-shadow-color: #FFFFFF;
	scrollbar-highlight-color: #FFFFFF;
	scrollbar-3dlight-color: #cdd8dd;
	scrollbar-darkshadow-color: #cdd8dd;
	scrollbar-track-color: #f989ea2;
	scrollbar-arrow-color: #ffffff;
}




body {	
	height:100%; 
	max-height:100%; 
	overflow:hidden; 
	padding:0; 
	margin:0; 
	border:0;
	background-color: #FFFFFF;	 
	text-align:left;
	font-size: 100%/1.5;  /*For IE*/
}

html,body,div,p,td {
	font				: normal 1.0em, Arial, Helvetica, sans-serif;
	color				: #666666;
}

/*opmaak van alle standaard-elementen die absoluut gepositioneerd worden*/
#banner, #midden, #kolomlinks, #kolommidden, #middensmal, #kolomrechts, #footer{
	position:absolute;
	}
/*tekstkleur vaststellen voor een aantal elementen*/	
#kolomlinks, #kolommidden, #middensmal, #kolomrechts{
	color: #666666;
	}

	
/* basis vlakverdeling */	

#container {
	background:#fff url(../images/bg_wrapper.gif) center repeat-y;
	margin:0 auto; 
	bottom:0;
	left:50%; 
	display:block; 
	width:860px;
	height:540px;
	min-height:464px;
	right:auto;
	text-align:left;

	}	

#banner{
	position:absolute; 
	margin:0; 
	top:0; 
	left:50%; 
	margin-left:-430px; 
	display:block; 
	width:860px; 
	height:87px; 
	z-index:5; 
	color:#FFFFFF;  
	right:auto; 
	text-align:center;
}
* html #banner  {
	height:92px;
}
	
#footer {
	position:absolute; 
	margin:0; 
	top:540px;
	left:50%; 
	margin-left:-430px; 
	display:block; 
	width:860px;
	height:25px;
	right:auto;
	text-align:left;
	font: 0.8em Trebuchet, Arial, Helvetica, sans-serif;
	color: #8C8C8C;
	font-style: normal;
	background-color:#ffffff;
	z-index:5;
	}

* html #footer  {
	bottom:-1px;
	height:15px;
}


/* opbouw kolommen */	

#kolomlinks, #kolommidden, #middensmal, #kolomrechts, #kolommiddensm, #kolomrechtsbr {
	position:absolute; 
	left:0; 
	top:87px; 

	font-size:1em; 
	z-index:4; 
	text-align:left;
}

#kolomlinks{ 
	width:145px;
	height:464px;
	min-height:464px;		
	left:50%;
	overflow:hidden;
	margin-left:-422px; 
	background-color: #c9d4d8;	
	}

#kolommidden{
	width:505px;
	height:464px;
	min-height:464px;
	overflow:inherit;
	left:50%;
	margin-left:-277px;
	background-color: #FFFFFF;
	}
#kolommiddensm{
	width:460px;
	height:464px;
	min-height:464px;
	overflow:inherit;
	left:50%;
	margin-left:-277px;
	background-color: #FFFFFF;
	}	

#kolomrechts{
	width:194px;
	height:464px;
	min-height:464px;		
	left:50%;
	overflow:hidden;
	margin-left:227px;
	background-color: #FFFFFF;
	}
#kolomrechtsbr{
	width:234px;
	height:464px;
	min-height:464px;		
	left:50%;
	overflow:hidden;
	margin-left:187px;
	background-color: #FFFFFF;
	}
	
* html #kolomlinks { 
	width:145px; 
}

* html #kolommidden { 
	width:505px;
	max-height:464px;
} 

* html #kolomrechts { 
	width:194px; 
}


/* Basislayout links */

a:link, a:active, a:visited, #tekst a:link, #tekst a:active, #tekst a:visited {
	color                : #6d8e9a;
/*	font-weight          : bold;*/
	background-color     : inherit;
	text-decoration      : underline;
}



a:hover, #tekst a:hover{
	color               : #6d8e9a;
/*	font-weight          : bold;*/
	background-color    : inherit;
	text-decoration     : none;
}

a img, :link img, :visited img {border-width: 0; border-style: none;}

#knoppenRe {float:right;}
#knoppenRe img {
background-color:#FFFFFF;
	border: 1px solid #c8d4d9;
	margin: 2px 3px 0 0;
	padding: 2px;

}
#knoppenLi {float:left;}
#knoppenLi img {
background-color:#FFFFFF;
	border: 1px solid #c8d4d9;
	margin: 2px 0 0 2px;
	padding: 2px;

}
/*Eind Basislayout links*/




/*Start menu-stijlen*/

#menu_basis { 
	position: absolute;

	height:464px;
	background-color: #cdd8dd;
	background-image:url(../images/bg_menu.jpg);	
	margin: 0;
	overflow:hidden;
	}
#menu_basis ul {margin:0; padding:0;}
#menu_basis li {list-style-type:none; width:145px; height:103px; display:inline;}

#menu_basis a {
		float:left; 
		width:145px; 
		height:0; 
		overflow:hidden;  
		text-decoration:none; 
		padding-top:93px; 
		background:transparent url(../images/bg_menu_over.jpg) no-repeat 145px 464px;}
		
* html #menu_basis a  {height:93px; he\ight:0;}

#menu_basis a#link1:hover {background-position: 0 0; z-index:50;}
#menu_basis a#link2:hover {background-position: 0 -93px; z-index:50;}
#menu_basis a#link3:hover {background-position: 0 -186px; z-index:50;}
#menu_basis a#link4:hover {background-position: 0 -279px; z-index:50;}
#menu_basis a#link5:hover {background-position: 0 -372px; z-index:50;}

#menu_basis a.active  {

		background:transparent url(../images/bg_menu_actief.jpg) no-repeat 145px 464px;}
		
* html #menu_basis a.active  {height:93px; he\ight:0;}

#menu_basis a#link1.active {background-position: 0 0; z-index:50;}
#menu_basis a#link2.active {background-position: 0 -93px; z-index:50;}
#menu_basis a#link3.active {background-position: 0 -186px; z-index:50;}
#menu_basis a#link4.active {background-position: 0 -279px; z-index:50;}
#menu_basis a#link5.active {background-position: 0 -372px; z-index:50;}





#menu_portfolio { 
	position: absolute;

	height:464px;
	background-color: #cdd8dd;
	background-image:url(../images/bg_subnav.jpg);	
	margin: 0;
	overflow:hidden;
	}
#menu_portfolio ul {margin:0; padding:0;}
#menu_portfolio li {list-style-type:none; width:145px; height:58px; display:inline;}

#menu_portfolio a {
		float:left; 
		width:195px; 
		height:0; 
		overflow:hidden;  
		text-decoration:none; 
		padding-top:115px; 
}
		
* html #menu_basis a  {height:115px; he\ight:0;}

#menu_basis a#p-link1:hover {background-position: 0 0; z-index:50;}
#menu_basis a#p-link2:hover {background-position: 0 -115px; z-index:50;}
#menu_basis a#p-link3:hover {background-position: 0 -230px; z-index:50;}
#menu_basis a#p-link4:hover {background-position: 0 -345px; z-index:50;}




/*Eind menu-stijlen*/





/*Start grafische elementen*/
.paisley{
	background-image:url(../images/bg_banner.gif);
	background-repeat: no-repeat;
	}
.onder{
	background-image:url(../images/bg_footer.gif);
		background-repeat: no-repeat;
	}	
.fotostart{
	background:#fff url(../images/collage_startpagina.jpg) no-repeat;
	}
.fotobiografie{
	background:#fff url(../images/kolomre_biografie.jpg) no-repeat;
	}
.fotoww{
	background:#fff url(../images/collage_ww.jpg) no-repeat;
	}	
.midden-paisley{
	background:#fff url(../images/bg_middenkader.jpg) no-repeat;
	}
.midden-paisleybl{
	background:#fff url(../images/bg_fotokader.jpg) no-repeat;
	}		
.bgrechts{
	background:#fff url(../images/bg_re.jpg) no-repeat;
	background-position: right;
	}
.bgrechts2{
	background:#fff url(../images/bg_fotonav.jpg) no-repeat;
	background-position: right;
	}
#main_pic {

	width:350px; 
	padding: 5px;
	position: absolute;
	left: 70px;
/*	top: 165px;*/
	bottom: 30px;
	display: inline;
	text-align:center;	


}	

#onderschrift {

	width:350px; 
	padding: 5px;
	position: absolute;
	left: 70px;
/*	top: 165px;*/
	bottom: 10px;
	display: inline;
	font: 0.9em, Arial, Helvetica, sans-serif;
	color: #76919d;
	text-align:center;
	font-weight:bold;	

}
#main_picP {

	width:400px; 
	padding: 5px;
	position: absolute;
	left: 70px;
/*	top: 165px;*/
	bottom: 40px;
	display: inline;
	text-align:center;	


}	

#onderschriftP {

	width:400px; 
	padding: 5px;
	position: absolute;
	left: 70px;
/*	top: 165px;*/
	bottom: 10px;
	display: inline;
	font: 0.9em, Arial, Helvetica, sans-serif;
	color: #76919d;
	text-align:center;
	font-weight:bold;	

}
	
/*Einde grafische elementen*/	

/*Start tekst layout*/
#tekst {
	display:block;
	text-align: justify;
	padding:10px; 
	margin: 0 5px 0 0;
	font: normal 0.8em, Arial, Helvetica, sans-serif;
	line-height : 100%;
	color: #666666;	
	}
#tekst img {
background-color:#FFFFFF;
	border: 1px solid #c8d4d9;
	margin: 0 10px 0 0;
	padding: 3px;

}
#tekst .niets {
	border:0;
	margin:0;
	padding:0;
	}
#tekst .blok {
	display: block;
	clear:both;
	padding: 5px 0 0 0;
	}	
#tekst2 {

	text-align: justify;
	overflow: hidden; 
	padding:10px; 
	font: normal 0.8em, Arial, Helvetica, sans-serif;
	color: #333333;
	line-height : 100%;	
	}
#tekst2 img {
background-color:#FFFFFF;
	border: 1px solid #545a5a;
	margin: 0 2px 0 0;
	padding: 3px;

}
#tekst2 .niets {
	border:0;
	margin:0;
	padding:0;
	}
	
h1{
	font-size: 1.1em;
	font-weight: bold;
	line-height : 100%;
	padding-top:4px;	
	padding-bottom:2px;
	color: #76919d;	
} 
h2{	
	font-size: 1.0em;
	font-weight: bold;
	line-height : 110%;
	padding-top:2px;
	color: #76919d;	

} 
h3{	
	font-size: 1.0em;
	font-weight: bold;
	line-height : 110%;
} 

p {
	padding-top:3px;
	padding-bottom:3px;
} 
li {
	font-size: 1.0em;
	line-height : 150%;
	color:#5a5958;
	font-weight: bold;	
}

#banner h1 {
display:none;
/*	text-align: center;
	font-family:  arial, helvetica, sans-serif;
	font-size: 3.5em;
	line-height: 1.0;		
	color: #5a5958;
	font-weight: bold;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding-top:3px;	
	padding-bottom:7px;		*/

}
.compact {

	padding-top:2px;
	padding-bottom:2px;

}
/*Einde tekst layout*/

/*Extra elemente*/
#copyright {
	position: absolute;
	margin:0;
	bottom:0;
	right:10px;
	display:block;
	width:300px;
	height:20px;
	z-index:2;
	text-align:right;
	font: normal 10px Arial, Helvetica, sans-serif;
	color: #bdc6ca;
	font-style: normal;
	padding-left: 5px;
}
* html #copyright  {
	bottom:-1px;
	height:20px;
}
#copyright a:link,a:active, a:visited {
	color: #bdc6ca;
	text-decoration: underline;
}
	
#copyright a:hover {color: #bdc6ca; }

#volgende {
	position: absolute;
	text-align: left;
	bottom:5px;
	right:5px;
	margin-top:5px;
	padding-left: 5px;
	margin-bottom: 10px;
	}

#vorige {
	position: absolute;
	text-align: left;
	bottom:5px;
	right: 105px;
	margin-top:5px;
	padding-left: 5px;
	margin-bottom: 10px;
	border: 1px solid #c1cfd4;
	}
	
#divUpControl{position:relative; width:170; left:5; top:30;  z-index:1; text-align: right}

#divDownControl{position:relative; width:170; left:5; top:250;  z-index:1; text-align: right}

#divContainer{position:absolute; width:300; height:300; overflow:visible; top:0; left:45; clip:rect(0,300,300,0); visibility:hidden}

#divContent{position:absolute; top:0; left:0}	
