/* CSS Document */

/*	Origineel design: www.circumflex.com en Katja Budde		*/
/*	Tekst en inhoud: Katja Budde							*/
/*	Omzetting naar CSS: Nel van Wageningen					*/
/*	Menu omzetting naar CSS dank zij www.stunichols.com		*/

* html {
	background-color: #99CC00;
}
body {background: url(images/bg.gif) repeat;
	color: #2C2C2C;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 90%;
	scrollbar-arrow-color: #333366;
	scrollbar-base-color: #99CC00;
	scrollbar-darkshadow-color: #99CC00;
	scrollbar-track-color: #99CC00;}
	
#wrapper{
	margin-left: auto;background-color: #99CC00;top: 0px;width:622px;margin-right: auto;
	padding-bottom: 30px;padding-left:1px;font-size: 90%;border-left: 1px solid #2F3E4F;
	background: url(images/bg_fill.jpg) repeat-y center;height:auto;}

/* 	Standaard waarden om basis te stellen 	*/

a {	text-decoration: none;}
a:hover{text-decoration: underline;}
img {border:0;}
a.link {color: #2F4F2F; background-color:#333366; text-decoration: none;}
ul {padding:0;	margin:0;list-style:none;}

/*	Standaard indelingselementen			*/

h1 {display: none} 
h2 { font-family: Arial, Helvetica, sans-serif; font-weight:bold; height: 1.7em; margin: -10px -10px 0 -10px; text-indent: 1em; 
	line-height: 1.4em; font-size:100%; color: #333366; background: url(images/header_01.jpg) repeat-y center; letter-spacing: 1px;
	border-bottom: 1px solid #000000;}
h2.lijn { border-top: 1px solid #000000;}
h3 {font-weight: bold; font-size:100% ;height:1.5em; font-style:italic; color:#333366;}
h3 .link_table { line-height:2em; }
h4 { font-weight:normal; font-size:100%; font-style:italic;}
h5 {font-weight: bold; font-size:100%; color:#333366; font-variant:small-caps } 

span.lowercap { font-variant:small-caps; }

/*	Indelingskenmerken voor layout 		*/

#kop{/*background:url(images/bg3.jpg) no-repeat center; */ width:623px;height:auto;margin-left:-2px;}
html>body #kop { width: 625px;}
#menu a {text-decoration:none;}
#menu {	margin: -105px 0 0 0;	position:absolute;padding:0;width: 596px;height:70px;
	border:0;z-index:100;color:#999900;	font: Verdana, Arial, Helvetica, sans-serif;} /* positionering menu, styling volgt 	*/
html>body #menu { margin: -104px 0 0 0;}
#indexwrapper #menu {margin-top: -93px;}	/* Wrapper voor eerste pagina: menu moet lager zitten ivm grotere afbeelding als kop*/
/*#indexwrapper3 #menu {margin-top: -96px;}	/* Wrapper voor eerste pagina: menu moet lager zitten ivm grotere afbeelding als kop*/
br.clear {clear:both; }						/* Nodig voor resetten float kenmerk na het menu, zie template	*/

#content {	top:100px;	width: 530px;	margin: 0 auto 20px auto; font-size:90%; padding:10px;
	border: 1px solid;	border-color: #2F4F2F #2F2F4F #2F4F3F #2F3E4F;
	
	scrollbar-base-color: #663366;	scrollbar-face-color:#CCCCCC;	scrollbar-track-color: #EDEAD9;
	scrollbar-arrow-color: #2F4F2F;	scrollbar-highlight-color: #FFFFFF;	scrollbar-3dlight-color: #CCCCCC;
	scrollbar-shadow-color: #663366;	scrollbar-darkshadow-color: #000000; 	background-color: #FFFFFF;}	

/* 	Styling gebruikte opsommingslijsten in content, ter vervanging van tabellen		*/
#content ul {list-style: url(images/li.gif) outside;font-size:100%; margin-left: 2em; position:relative; }
#content ul.nolist {list-style-type: none; }
#content ul li {text-indent: 1em;}
#content ul ul { list-style-type:none; }
#content ul ul li { text-indent: 3em; list-style-type:none}
#content a, #content a:visited, #content li a, #content li a:visited {color: #333366; text-decoration:underline; }
#content a:hover, #content li a:hover {background-color: #CECECE;  color:#333366; text-decoration:underline;}

/* 	Kleine stylingselementen 		*/
wrapper2 { top: 160px; border-top: 1px solid #cccccc; bottom: 20px}
a.onder:hover {display: hidden; position: left; }
a.onder {display:block; position:left;}
#content img.foto {float: right; margin:8px; border: 1px solid #FFFFFF; padding: 3px; background-color: #ECE9D8; }
p.rechts {text-align: right;}
.blauw {background-color:#333366; font-style: italic;}

/*	Laatste styling grote indelingselementen					*/

#footer{color: #000000;	font-size: 88%;	font-weight: normal;height:2em;	line-height: 1.8em;
	vertical-align:middle;margin: 10px -10px -10px -10px;background:url(images/header_01.jpg) repeat-y right;
	padding:1px 10px ;	text-align:right;position: relative;border-top: 1px solid #000000;
	text-decoration: none;	visibility: visible;width: 530px;z-index: 999;}
#logo { background: url(images/logo-onder3.jpg) repeat-x bottom ; width: 622px; height: auto ; position:relative;}
	


/* Menu detail style 											*/

/* This style is adapted from examples by Stu Nichols at www.stunichols.com */
/* He ia a unique pioneer exploring CSS frontiers browser wide 				*/

#menu {/* background:url(images/bg_menu4.jpg) repeat-x top */;padding-left:0.7em; letter-spacing:0.8px; }
/* style the outer div to give it width */
.menu {font-size:85%; padding-bottom:30px; width:100%; color:#CCCCCC; font-stretch: 0.1em; }

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0; margin:0;list-style-type:none; height:50px; background:transparent;}

/* style the sub-level lists */
.menu ul ul {width:15em; margin-top:0.2em; height: 50px;}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {float:left;height:32px;line-height:2.5em; display:block; }

/* style the sub level list items */
.menu ul ul li {display:block;height:1.9em; line-height:1.2em; margin-top: -1px; background:transparent;}

/* style the links for the top level */
.menu a, .menu a:visited {display:block;float:left;height:100%; color: #FFFFFF;text-decoration:none;background:url(images/bl_li_up.gif) no-repeat left ;
 padding:0 0.4em 0 1.35em; margin: 0.1em;}
/* hack IE5.x to get the correct the faulty box model and get the width right */
* html .menu a, * html .menu a:visited {width:auto; w\idth:auto;}
/* style the sub level links */
.menu ul ul a, .menu ul ul a:visited {display:block; font-size: 100%; color:#FFFFFF; background: url(images/or_li_up.gif) no-repeat top left; 
width:15em; height:1.9em; margin-left:0.1em;line-height:1.2em; margin-top: -0.05em; padding: 0 0.4em 0 1.35em;}
* html .menu ul ul a, * html .menu ul ul a:visited  {color:#FFFFFF;width:auto; w\idth:auto;}


/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {border-collapse:collapse; padding:0; margin:-1px; width:0; height:0; font-size:1em; z-index:1;}
#wrapper2 table.linktable {position: relative; border-collapse:merged; border:0;height: 300px; width:530px;table-layout: fixed; }
#wrapper2 table.linktable tbody { text-align:left; vertical-align:middle;line-height:1em; }
#wrapper2 table.linktable tr td{ height: 1em; }

/* style the level hovers */
/* first */
* html .menu a:hover {color:#FE9900;background:url(images/bl_re_up.gif) no-repeat left ; position:relative; z-index:100;}
.menu li:hover {position:relative;}
.menu :hover > a {color:#FE9900;background:url(images/bl_re_up.gif) no-repeat left ;}
/* second */
* html .menu ul ul a:hover{color:#363466;background:url(images/or_re_up.gif) no-repeat top left ; position:relative; z-index:110;}
.menu ul ul li:hover {position:relative;}
.menu ul ul :hover > a {color:#363466;background:url(images/or_re_up.gif) no-repeat top left; }


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:2em; left:0; width:auto;}

/* make the second level visible when hover on first level list OR link */
.menu ul :hover ul{visibility:visible; height:auto; background:transparent; padding:1em 1em 1em 1em; left:-1em;}
	
/*  Pagina Indicator Image positionering 					*/

 img.indicator1{clear:both;margin-top:-8px; margin-left: 1.8em; }
 img.indicator2{clear:both;margin-top:-8px; margin-left: 6em; }
 img.indicator3{clear:both;margin-top:-8px; margin-left: 13em; }
 img.indicator4{clear:both;margin-top:-8px; margin-left: 24em; }
 img.indicator5{clear:both;margin-top:-8px; margin-left: 32em; }
 img.indicator6{clear:both;margin-top:-8px; margin-left: 39em; }
 img.indicator7{clear:both;margin-top:-8px; margin-left: 46em; }
 img.indicator8{clear:both;margin-top:-8px; margin-left: 50em; }
 img.indicator9{clear:both;margin-top:-8px; margin-left: 57em; }
	


/*	Styling gebruikte tabellen in content					*/

#content ul.lijst { list-style-type:none; list-style-position:inside ;margin: 0; padding:0; color:#FE9900;}
#content ul.lijst li { display:block; width: 14em; float:left;  }	
#content ul.lijst li.groot { width: 28em;}

	/*	Algemene kenmerken tabellen							*/
td a {color:#FF9900; font-weight: bold; }
td a:hover {color:#99CC00; font-weight: bold;}
table caption { text-align:left;}
#content table input,
#content table textarea { background-color:#EDEAD9; }
#content table { margin: 20px 0;}
#content table thead tr th {font-style: italic; height:3em; font-weight:bold; }
#content table tr { padding:2px; }
#content table tr th { text-align:right; font-weight:normal; font-style: italic;}
#content table tr td {padding-left:8px; }
#content table tr td span {text-align:left; font-weight:normal; font-size: 80%; font-style: italic; left:-45px;}

	/*	Specifieke kenmerken tabellen						*/
table th { width:auto;}
table td { width:auto;}
table.link_table tr th { width: 45%;}
table.link_table tr td { width: 55%;}
table.link_table tr th h3 { padding-right:50%;}
table.link_table tr td h3 { padding-right:20%;}
table.contact tr th { width:25%;}
table.opdrgever tr td { color:#333366; width: 30%; background-color: #EDEAD8; border: 0; padding:1px 4px; }

/*	Deze tekst niet laten zien op site, wel op printpagina	*/	
#printtekst { display:none;}
ul li.hand { list-style-image: url(images/or_re_up.gif)}
#content img.foto {float: right; margin: 8px; border: 1px solid #FF6600; padding:5px; background-color: #ECE9D8; }
