* {
	margin: 0;
	padding: 2;
	text-align: left; /* for IE */
}

html,body {
    height: 100%; /* HEEL BELANGRIJK! */
    background: #FFF;
    background-image: url(i/bgpage.jpg);	
    color: #330033;
    FONT-WEIGHT: normal;
    FONT-SIZE: 14px;
    FONT-FAMILY: Arial, Helvetica, sans-serif;
    text-align: center; /* for IE */

}

h1 {
    font-family: Arial, Courier, 'Franklin Gothic Book', sans-serif ;
    font-size: 2em;
		color: green;
	 }
h2 {
    font-family: Arial, Courier, 'Franklin Gothic Book', sans-serif ;
    font-size: 1.6em;
		color: green;
	 }
h3 {
    font-family: Arial, Courier, 'Franklin Gothic Book', sans-serif ;
    font-size: 1.4em;
		color: green;
	 }
.clear {
    clear: both; /* deze class gaan we gebruiken om de twee floats #left en #right te clearen. */
}
h4 {
	font-family: Arial, Courier, 'Franklin Gothic Book', sans-serif;
	font-size: 1.2em;
	text-align: left;
	
}

TD {
	vertical-align: top;
	text-align: left;
   }
fieldset {
  padding: 5px;
  border:1px solid;
  border-color: #888888;

  font-size:90%;
  text-align:left;
  width: 190px;
  background-color: #FFFFFF;
 }


ul, li{
text-align : left;
list-style-image: url("i/0comment.gif");
margin-left: 5px; padding: 5px;

}

li{
border: dotted black;
border-width: 1px;
margin: 5pt;
padding: 5px;
background: url("i/bgdark.jpg");
background-repeat: repeat;
}

#menu {
border: dotted black;
border-width: 1px;
margin: 2pt;
padding: 2px;

}
#menu li {
border: solid black;
border-width: 1px;
background: none;
list-style-image: none;
list-style-type: none;
background-color : #DFDFDF;
background-image: url(i/bggrey.jpg);	
}
#menu a {
text-decoration: none;
}


input.box {
text-align : left;
border-style: solid;
border-width : 1px;
height: 1.8em;
border-color: #888888;
color: rgb(51, 51, 51);
background-color: #FFFFFF;
}


input.nb {
    background-color : #DFDFDF;
    border: 1px solid black;  
    font-size: 1em;
}



textarea {
border-style: solid;
border-width : 1px;
border-color: #888888;
color: rgb(51, 51, 51);
background-color: #rgb(255,204,255);
font-size: 1.5em;
}


input.btn {
	border-color : black;
	text-align: center;
	border-width : 1px;
	border-style : outset;
	color : black;
	background-color : #CCFF99;
	width : 9em;
	height : 3.2em;
	margin: 10px;
	font-size: .9em;
}

hr {
height: 0;
border: 0;
border-top: 1px solid #666666;
} 


A:link {
text-decoration: underline;
color: green;
font-weight:bold
}
A:visited {
text-decoration: underline;
color: green;
}
A:active {
text-decoration: underline;
color: red;
}
A:hover {
 display: compact;
 background: yellow;
 text-decoration: none;
}


#textsizer
{
 border: 0px black solid;
 background-color: #CCFF99;
 background: url("i/bgdark.jpg");
 width: 15em;
 height:2.8em;
 text-align: right;
 fontsize: 1.3em;
 background-image: url(i/ability.png);
 background-repeat: no-repeat;
 
}
#footer
{
 clear: both;
 text-align: right;
 text-indent: 200px;
}

#container {
    height: auto;
    width: 98%;  
    margin: 0 auto; /* deze div centreren */
    text-align: center;
    background: #666666;
	  background-image: url(i/bgtable.jpg);
    position: relative; 
    border:thin #FFFFFF solid;
	}

#header {
    height: 6.5em;
    text-align: left;
    background: url(i/loket2.png);
	  background-repeat: no-repeat;
	  background-position: top right;
	  font-size: 1em;
		}
table {
  font-size: 1em;
}		
#navbar {
	height: 3em;
	padding: 1px;
 	font-size: 1em;
		}
#formbar
{
	height: 6.5em;
	padding: 1px;
 	font-size: 1em;
 
		}
#left {
    width: 20%;
    float: left;
    height: auto;
		padding-top: 20px;
		padding-bottom: 40px; 
}
   
#right {
    margin-top: 50px;
    padding: 1em;
    float: left;
	  width: 75%;
    background-image: url(i/bggrey.jpg);
		background-repeat: repeat;
		height: auto;
		padding-bottom: 40px;
}