body {	background-color: #333; 
	color: #E0E0E0;
	font-size: 100.01%;
	font-weight: normal;
	font-family: Helvetica, Trebuchet MS, Trebuchet, Verdana, Arial;

	margin: 0px 0 0 0;
	padding: 0;
}

img{ border: 0px solid }

h2 { font-size: 105%; }

#block_1
	{
	position: relative;
	float: left;
	width: 160px;
	left: 820px;
	overflow: hidden;
	background-color: #333;
	}
* html #block_1
	{
	display: inline;
	}
#block_2
	{
	position: relative;
	float: left;
	width: 820px;
	left: -160px;
	overflow: hidden;
	background-color: #333;
	}
* html #block_2
	{
	display: inline;
	}
#wrapper
	{
	width: 980px;
	}
/* we need this for IE 5.01 - otherwise the wrapper does not expand to the
necessary height (unless fixed, this problem becomes even more acute 
weirdness as the method is enhanced */
#wrapper
	{
/* Normally a Holly-style hack height: 1% would suffice but that causes 
IE 5.01 to completely collapse the wrapper - instead we float it */
	float: left;
/* NB. possibly only IE 5.01 needs to get this float value - otherwise 5.5 sometimes 
(I saw it happen many moons ago) makes the width of wrapper too small 
the float: none with the comment is ignored by 5.01,
5.5 and above see it and carry on about their business
It's probably fine to just remove it, but it's left here 
just in case that many moons ago problem rears its head again */
	float/**/: none;
	}
/* easy clearing */
#wrapper:after
	{
	content: '[DO NOT LEAVE IT IS NOT REAL]'; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}
#wrapper
	{
	display: inline-block;
	}
/*\*/
#wrapper
	{
	display: block;
	}
/* end easy clearing */


#kopje { margin-top: 24px; font-size: 20px; font-weigth: 600; border: 1px solid #EEE; color: #EEE;  background-color: #222; }


#los { text-align: left; }

#rand {  margin: 0px; padding: 0px; }

#foto {  margin: 0px; padding: 0px; border: 1px solid #EEE; background-color: #222; }

#image { text-align: center; margin: 0px; padding: 0px;}


#datum { color: #999; font-style:italic; }

/*
#kleurtje { border: 1px solid #EEE; margin: 0px; padding: 0px 0px; background-color: #EEE; }

#tekst {  border: 1px solid #EEE; background-color: #333;  color: #EEE; }
*/


#subnavigation
	{
	float: left;
	floa\t: left;
	margin: 30px 0 -8px 1em;
	margin-lef\t: 1em;
	width: 160px;
	list-style-type: none;
	text-align: left;
	}


* html #subnavigation
	{
	margin-top: 16px;
	}

#subnavigation h2
	{
	margin: 0;
	margin-top: -0.25em;
	margin-bottom: 0em;
	padding: 0;
	border-bottom: solid 0.1em #0FF;
	font-weight: normal;
	font-size: 0.75em;
	}
* html #subnavigation h2
	{
	margin-top: 0;
	margin-bottom: 0px;
	}
#subnavigation li
	{
	font-size: 0.75em;
	width: 160px;
	}
* html #subnavigation li
	{
	/*\*/ height: 1px; /* */
	}
#subnavigation ul, #subnavigation ol
	{
	margin-top: 6px;
	padding-bottom: 0em;
	padding-left: 0em;
	margin-left: 0em;
	list-style-type: none;
	}
/* for some reason, every li is 1. or A. - so 'suppress them' */
* html #subnavigation ul, * html #subnavigation ol
	{
	padding: 0;
	list-style-type: none;
	}
#subnavigation li a
	{
	display: block;
	width: 140px;
	height: 1%;
	font-size: 1em;
	border-left: solid 2px #0FF;
	padding-left: 4px;
	margin-left: 0px;
	margin-bottom: 2px;
	color: #FFF;
	text-decoration: none;
	}

#subnavigation li a:hover
	{
	color: #000;
	background: #FFF;
	border-color: #FFF !important;
	}

#subnavigation li a.current
	{
	display: block;
	width: 140px;
	height: 1%;
	font-size: 1em;
	border-left: solid 2px #FFF;
	padding-left: 4px;
	margin-left: 0px;
	margin-bottom: 2px;
	color: #0FF;
	text-decoration: none;
	}

#subnavigation li a.current:hover
	{
	color: #000;
	background: #FFF;
	border-color: #FFF !important;
	}

* html #appendices h2
	{
	margin-top: 1em;
	}

#boven
	{
	text-align: center;
	width: 980px;
	margin: 0px;
	margin-bottom: 0px;
	margin-top: 10px;
	clear: both; 
	padding: 0px;
	padding-bottom: 2px;
	background-color: #333;
	font-size:14px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; 
	}


#header
	{
	text-align: center;
	width: 980px;
	margin: 0px;
	margin-bottom: 20px;
	margin-top: 0px;
	clear: both; 
	padding: 0px;
	background-color: FFF;
	border-bottom: 1px solid #0FF;

	}


#footer
	{
	width: 980px;
	margin-top: 10px;
	clear: both; 
	padding: 3px;
	}










ul#menu { margin:auto; padding:0; list-style-type:none; width:440px; position:relative; display:block; height: 19px; font-size:12px; font-weight:bold;  font-family:Arial, Helvetica, sans-serif; } 

ul#menu li { display:block; float:left; margin:0; padding:0;}

ul#menu li a{display:block; float:left; color:#E0E0E0; text-decoration:none; font-weight:bold; padding: 2px 10px 0 10px;}

ul#menu li a:hover{ color:#0FF; height:18px; text-decoration: none; }

ul#menu li a.current{ color:#FFFFFF; height:18px; }


ul#menu li a:hover.current{ color:#0FF; height:18px; }




td { margin-right: 8px; padding-right: 8px; }




hr { color: #333; margin-top: 2px; margin-bottom: 4px; padding: 0; height: 1px; } 

* html hr { color: #333; margin-top: 2px; margin-bottom: 0px; padding: 0; height: 1px; } 

iframe { margin: 0px; } 

/*
html, body, iframe {
height: 100%;
}

.content {
width:100%;
min-height: 100%;
height:auto !important; /* voor moderne browsers */
height:100%; /* voor IE */
}

*/




A:link { color: #0FF; text-decoration: none; }

A:visited { color: #0FF; text-decoration: none; }

A:active  { color: #0FF; text-decoration: underline; }

A:focus  { color: #0FF; text-decoration: underline; }

A:hover { color: #0FF; text-decoration: underline;  }


A.linknormaal:link { color: #0FF; text-decoration: none; }

A.linknormaal:visited { color: #0FF; text-decoration: none; }

A.linknormaal:active { color: #333;  text-decoration: underline; }

A.linknormaal:focus { color: #333; text-decoration: underline; }

A.linknormaal:hover { color: #333; text-decoration: underline;  }


A:link#linknormaal { color: #0FF; text-decoration: none; }

A:visited#linknormaal  { color: #0FF; text-decoration: none; }

A:active#linknormaal  { color: #0FF; text-decoration: underline; }

A:focus#linknormaal  { color: #0FF; text-decoration: underline; }

A:hover#linknormaal  { color: #0FF; text-decoration: underline;  }



A:link#linkje { color: #333; text-decoration: none; font-weight: 500; margin-left: 3px; text-transform: uppercase; }

A:visited#linkje { color: #333; text-decoration: none; font-weight: 500; margin-left: 3px; text-transform: uppercase; }

A:active#linkje { background-color: #333; color: #333; text-decoration: none; font-weight: 500; margin-left: 3px; text-transform: uppercase; }

A:focus#linkje { background-color: #333; color: #333; text-decoration: none; font-weight: 500; margin-left: 3px; text-transform: uppercase; }

A:hover#linkje { background-color: #333; color: #333; text-decoration: none; font-weight: 500; margin-left: 3px; text-transform: uppercase; }



A:link img#linkje{ border: 1px solid #888; margin: 2px; padding: 6px;
}

A:visited img#linkje{ border: 1px solid #888; margin: 2px; padding: 6px; 
}

A:focus img#linkje{ border: 1px solid #0FF; margin: 2px; padding: 6px; 
 }

A:active img#linkje{ border: 1px solid #0FF; margin: 2px; padding: 6px; 
 }

A:hover img#linkje{ border: 1px solid #0FF; margin: 2px; padding: 6px; 
}



A:link#fp { color: #EEE; text-decoration: none; font-weight: 500; }

A:visited#fp { color: #EEE; text-decoration: none; font-weight: 500; }

A:hover#fp { color: #FFFFFF; text-decoration: none; font-weight: 500;  }

A:active#fp { color: #FFFFFF; text-decoration: none; font-weight: 500; }



A:link#fp2 { color: #EEE; text-decoration: none; font-weight: 500; }

A:visited#fp2 { color: #EEE; text-decoration: none; font-weight: 500; }

A:hover#fp2 { color: #000; text-decoration: none; font-weight: 500;  }

A:active#fp2 { color: #000; text-decoration: none; font-weight: 500; }




#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#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(images/prevlabel.gif) left 20% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 20% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; 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; background-color: #000; }






#year { font-size: 14px; font-weight: 500; }

.so { width: 138px;
      height: 91px;
      position: relative;
      z-index: 1;
      top: 46px;
      left: 0px;
      font-size: 18px; 
      font-weight: 600; 
      padding: 0px; 
      overflow: hidden;      
      margin-top: 0px;
      margin-bottom: 0px;
}



.yo19 a  {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/19d.jpg) no-repeat;
	background-position: -138px 0;
	text-align: center;

	}

.yo19 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo18 a  {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/18d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;

	}

.yo18 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }



.yo17 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/17d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo17 a:hover {
margin: 0px; margin-bottom: 6px; 
border: 1px solid #FFF;
background-position: 0px 0; }




.yo16 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/16d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo16 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }



.yo15 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/15d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo15 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo14 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/14d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo14 a:hover {
margin: 0px; margin-bottom: 6px; 
border: 1px solid #FFF;
background-position: 0px 0; }


.yo13 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/13d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo13 a:hover {
margin: 0px; margin-bottom: 6px; 
border: 1px solid #FFF;
background-position: 0px 0; }

.yo12 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/12d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo12 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }




.yo11 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/11d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo11 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo10 a {
      	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/10d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo10 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo9 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/9d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo9 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo8 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/8d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo8 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo7 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/7d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo7 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo6 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/6d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo6 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo5 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/5d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo5 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo4 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/4d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo4 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo3 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/3d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo3 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo2 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/2d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo2 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo1 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 6px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/1d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo1 a:hover {
margin: 0px; margin-bottom: 6px;
border: 1px solid #FFF;
background-position: 0px 0; }


.yo0 a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 8px;
	border: 1px solid #E0E0E0;
	background: transparent url(frontpage/0d.JPG) no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yo0 a:hover {
margin: 0px; margin-bottom: 8px;
border: 1px solid #FFF;
background-position: 0px 0; }

.yoarchive a {
	display: block;
	width: 138px;
	height: 91px;
	margin: 0px; margin-bottom: 8px;
	border: 1px solid #E0E0E0;
	background: transparent no-repeat;
	background-position: -138px 0;
	text-align: center;
	}

.yoarchive a:hover {
margin: 0px; margin-bottom: 8px;
border: 1px solid #000;
background-position: 0px 0; }




.yo a {
	display: block;
	width: 0px;
	height: 91px;
	margin: 0px; margin-bottom: 8px;
	border: 0px solid #666666;
	text-align: center;
	}












.glossymenu{
margin: 0px 0;  /*was 5 0*/
padding: 0;
width: 140px; /*width of menu*/
border: 0px solid #9A9A9A;
border-bottom-width: 0;
}

.glossymenu a.menuitem{
background: black url(images/glossyback.gif) repeat-x bottom left;
font: bold 14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px; /*was 10px*/
text-decoration: none;
}


.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: white;
}

.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 5px;
border: none;
}

.glossymenu a.menuitem:hover{
background-image: url(images/glossyback2.gif);
}

.glossymenu div.submenu{ /*DIV that contains each sub menu*/
padding-top: 6px; /*zelf toegevoegd*/
}

.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;

}

.glossymenu div.submenu ul li{
border-bottom: 0px solid blue;  /*was: 1px solid blue */
}

.glossymenu div.submenu ul li a{
display: block;
font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: black;
text-decoration: none;
padding: 0px 0;
padding-left: 0px; /*was 10px*/
}

.glossymenu div.submenu ul li a:hover{
background: #DFDCCB;
colorz: white;
}
