@charset "iso-8859-1";

h1
{
	font-size: 130%;
	margin-top: 10px;
	margin-bottom: 10px;
}
h2
{
	font-size: 100%;
	margin-top: 10px;
	margin-bottom: 2px;
}

h3
{
	font-size: 100%;
	margin-top: 10px;
	margin-bottom: 2px;
}
h4
{
	font-size: 90%;
	margin-top: 10px;
	margin-bottom: 2px;
	font-style: italic;
}
p
{
	margin-top: 5px;
	margin-bottom: 5px;
	padding-top: 0;
	padding-bottom: 0;
}
.clear
{
	clear: both;
	padding-bottom: 1px;	/* for Gecko-based browsers */
	margin-bottom: -1px;	/* for Gecko-based browsers */
} 

body,
html 
{
    	margin:0;
    	padding:0;
}
body 
{	
	margin: 0 17%; 						/* center content with 7% margin on each side */
	font-family: verdana, arial, helvetica, sans-serif;
	min-width: 60em; 					/* IE does not understand this. Why?? */	
}
#pageWrapper
{
	border-width: 0px 5px 0 5px;				/* left and right border */
	width: auto;
}
#outerContainer
{
	border-left: solid 200px #917949;
		/* reserves space for the left column. */
}
#innerContainer
{
	width: 100%;						/* this container serves as placeholder for the mainColumn and the leftColumn.	*/ 										/* For some mysterious reason, IE renders the leftcolumn offset very 		*/										/* strange if the mainColumn and leftColumn are placed in the 			*/										/* outerContainer directly...*/
}
#mainColumn
{

	float: right;
	width: 100%;
}
#header
{
	background: url("header.JPG");
	height: 188px;
	margin: -1px 0 0 0;					/* push header up to get rid of ugly top line */
}
#contentContainer
{
	background: url("crystal2.gif") no-repeat;
	background-position: top right;
	width: 70%;
	border-right: 1px solid #000;
	margin: 0 0 15px 0;
}
#content
{	
	float: left;
	width: 100%	
}
#contentLeft
{
	float: left;
	width: 65%;
}
#contentRight
{
	float: right;
	margin-top: 25px;
}
#rightColumn
{
	float: right;						/* push right column into rest right space of 66% in parent contentContainer */
								/* the total amount available on the right side is calculated as follows: */
								/* (100 - contentContainer.width) / contentContainer.width */
								/* which is 42 % */
	margin: 0 -42% 0 0; 
	width: 42%;
}
.rightBlock
{
	margin: 5px 10px 15px 10px;
	font-size: 80%;
	padding: 0 0 15px 0;
}

#contentItem
{
	margin: 0px 10px 5px 10px;
	line-height: 135%;
}
#contentHeader
{
	margin: 25px 10px 25px 10px;
}
#leftPlaceholder
{
	float: left;

	width: 70%;	
}
#rightPlaceholder
{
	float: right;
	
	width: 20%;
}

#explanation
{
	width: 80%;
	float: right;
	border: solid 1px #000;
	padding: 5px 5px;	
	margin: 0 5px 10px 2px;
	background-color: #fff;
	font-size: 75%;
	line-height: 130%;
}
#leftColumn
{
	float: left;
	margin: 0px 0px 0 -200px; /* push leftcolumn into border aera of parent */
	width: 200px;
}
#navigationHeader
{
	width: 100%;
	font-size: 80%;
}
.leftBlock
{
	margin: 15px 5px 25px 0px;
	font-size: 8.0pt;
}
.leftBlock p
{
	padding: 2px 5px 5px 10px;				/* left and right padding for text in left blocks */
}
.leftBlock .vnav li
{
	margin: 5px 0px 5px 0px;
	padding: 2px 0 6px 0px;
}
.leftBlock h2
{
	border-top: solid 1px #000;
	padding: 10px 5px 5px 10px;
}
.leftTextBlock
{	
	border: solid 1px #000;
	margin: 35px 5px 0 5px;
}

.rightTextBlock ul, .rightTextBlock ul li
{
	margin: 0;
	padding: 0;
	list-style-type: square;
}
.rightTextBlock ul li
{
	margin: 5px 0px 5px 15px;
}
	
#footer
{
	clear: right;
	padding: 0 5px;
	text-align: left;
	font-size: 75%;
}
#footer p
{
	padding: 5px 0 5px 0;
	margin: 0;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
	}
#vmenu
{
	width: 195px;
	margin-top: 10px;
	margin-left: 5px;

}
	
#vmenu li a
{
	text-decoration: none;
	height: 32px;
  	voice-family: "\"}\""; /* voice-famliy hack voor IE */
  	voice-family: inherit;
  	height: 24px;
}
	
#vmenu li a:link, #vmenu li a:visited 
{
	display: block;
	background: url(images/menu8.gif);
	padding: 8px 0 0 15px;
}
	
#vmenu li a:hover 
{
	background: url(images/menu8.gif) 0 -32px;
	padding: 8px 0 0 15px;
}
	
#vmenu li a:active 
{
	background: url(images/menu8.gif) 0 -64px;
	padding: 8px 0 0 15px;
}
#vmenu h2
{
	border-top: solid 1px #000;
	margin: 0 5px 0 0;
	padding: 15px 0 10px 5px;
}
.hnav
{
	margin: 0;
	padding: 3px 0 4px 0;
	font-weight: bold;
}

.hnav ul
{
	text-align: right;
	line-height: normal;
	margin: 0;
	padding: 0;
}
.hnav ul li
{
	list-style-type: none;	
	display: inline;
	margin: 0;
	border-left: solid 1px #000;
}
.hnav ul li a, .hnav ul li a:link, .hnav ul li a:visited, .hnav ul li a:active, .hnav ul li a:hover
{
	padding: 3px 10px 4px 10px;
	cursor: pointer;
	text-decoration: none;
}





/* IE layout hack. Otherwise rightColumn and leftColumn disappear under the outerbounds of its parent */
* html #rightColumn,
* html #leftColumn
{
	position: relative;
}

* html div
{
	overflow: visible;
}
