/* Colors used: 
    pink: color: #E52C9D;
	lichtgrijze achtergrondkleur voor header: #CCCCCC
*/

 * {
    /* alle paddings en margins even op 0 zetten, om lastig te traceren problemen 
	te voorkomen. Waar nodig gewoon margin en padding instellen */
	font-family: Verdana;
	margin: 0;
	padding: 0;
}

body {
   background-color: #F6F6F6; }
	A:link
	{ text-decoration: underline; color:#E52C9D; }
	A:visited
	{ text-decoration: underline; color:#E52C9D; }
	A:active
	{ text-decoration: underline; color:#E52C9D; }
	A:hover
	{ text-decoration: underline; color:#000000; }


.leftmenu{
   /* containing menudiv: bevat de bovenrand van het menublokje
   Breedte hardgecodeerd in px.
   Padding aan de bovenrand die net zo groot is als de image, zodat het menu
   onder de rand pas begint, en er niet overheen valt. */
	background: url(../images/module_top.jpg) no-repeat top;
	width: 167px; 
	padding-top: 8px; 
	margin: 10px; /* mag weggehaald worden, geeft de ruimte om de buitenranden heen */
}

.menu{ 
	/* Menu's kunnen vaak het beste weergegeven worden als (un)ordered lists
	alleen moeten de bullets weggewerkt worden: */
	list-style-position: outside; 
	list-style: none;
	/* Het ul-element zelf bevat de onderrand. Ook hier: breedte en padding instellen */
	background: url(../images/module_bottom.jpg) no-repeat bottom;
	width: 167px; 
	padding-bottom: 12px; 
}
.menu li{ 
/* ook hier voor de zekerheid de bullets even wegwerken. 
Hier wordt het herhalende middendeel ingesteld */
	background: url(../images/module_middle.jpg) repeat-y;
	background-color: White;	
	list-style-position: outside; 
	list-style-type: none;
	/* visuele effecten van de tekst */
	color: #E52C9D;
	font-size: 0.7em;
	font-weight: bold;
	padding-left: 10px;	
	padding-right: 4px;
}
.menu li ul{ 
	/* Dit kan een uitklapbaar menuutje worden -  haal commenttekens om 'display:none'
	 weg om de submenu's te verbergen.
	Bij geneste lists moeten de buitenranden niet opnieuw getekend worden, dus 
	background even leeg maken*/
/*	display: none;*/
	background: none; 
	padding-bottom: 0; 
}
.menu li li{ 
  /* Idem: deze neemt in principe alle properties van menu>li over. Ook padding
  etc. Als dat niet gewenst is, hier resetten*/
	background: none;
	padding-left: 5px; /* klein beetje inspringen */
	font-size: 1em; /* lettertype van geneste lijst niet kleiner*/
	font-weight: normal;
}
.menucol{ 
	background: url(../images/back_small.gif) repeat-y 50px 0;  
	width: 10%;  }
.headerrow{ background: url(../images/content-top.gif) no-repeat 50px bottom;  background-color: #CCCCCC;  }
.footerrow{ background: url(../images/footer.jpg) no-repeat 50px top;    }

#maintable{
	margin: auto;
	border-right: 1px solid #CCCCCC;
}

#header{
	text-align: center;
	padding-bottom: 10px;
}
#footer{
	text-align: center;
	font: italic 0.8em serif;
	padding-top: 10px
}

#maincol{
	text-align: left;
	vertical-align: top;
	/* Hier komen al wat 'algemene' waarden voor de hoofdtekst. */
padding-left: 15px;	
padding-right: 20px; 
	padding-top: 20px;
	font-family: Verdana; 
	font-size: 11px;
}

.floatbox{
	/* Gebaseerd op .menu , maar kan rechts in de tekst staan */
	float: right;
	color: #E52C9D;
	font-size: 0.8em;
	background: url(../images/module_top.jpg) no-repeat top;
	width: 167px; 
	padding-top: 5px; 
	margin: 10px; /* mag weggehaald worden, geeft de ruimte om de buitenranden heen */
}
 .floatbox ul{ 
	/* Menu's kunnen vaak het beste weergegeven worden als (un)ordered lists
	alleen moeten de bullets weggewerkt worden: */
	list-style-position: outside; 
	list-style: none;
	/* Het ul-element zelf bevat de onderrand. Ook hier: breedte en padding instellen */
	background: url(../images/module_bottom.jpg) no-repeat bottom;
	width: 167px; 
	padding-bottom: 12px; 
}
.floatbox h3{
	background: url(../images/module_middle.jpg) repeat-y;
	font-weight: bold;
	font-size: 0.9em;
	font-style: italic;
	text-align: center;
	padding: 0 5px 3px; /* boven-, links-en-rechts, onder */
	margin: 0;
	
}
.floatbox li, .floatbox p{
	background: url(../images/module_middle.jpg) repeat-y;
	list-style-position: outside; 
	list-style-type: none;
	/* visuele effecten van de tekst */
	padding-left: 10px;	
	padding-right: 4px;
}


/* Vanaf hier gewoon layout voor de maintekst. 
Dit kan in principe gewoon zonder class- of id-aanduiding , worden er dingen naar
het menu overerfd, voeg dit dan hierboven toe.*/

h3{
	font-style: italic;
	font-weight: normal;
	font-size: 1em;
	margin-top: 0.75em;
	margin-bottom: 0;
}
p{
	margin-bottom: 0.75em;
}