/* 
CSS bestand.
id wordt aangegeven met #, classes met .classnaam. 
ook b.v : .classnaam a
*/


BODY {
background-color: #F7EECD ;
color: black; font-family: Times, Times New Roman, Serif;
text-align: center; /* center things in pre-IE6 */
font-family: verdana;
font-size: 11px;
/* background-image: url(images/site/chessblue.jpg); background-repeat: no-repeat */
}

/* STANDAARD LETTER TYPES*/

h1 {font-size: 20px;}
h2 {font-size: 18px;}
h3 {font-size: 15px;}

a {	
	color:black;
	font-family: verdana;
	font-size: 10px;

}
a:hover {
color: red;
background-color: yellow ;
}

td{
	font-size: 10px;
}

/* Diverse classes */

/* The Centering Cheat 
vb: <img src="images/header.gif" class="centered" />

Note: If you're using the center cheat trick
to center a top-level block element or a 'container' 
which will contain the rest of your coding, 
you must add text-align: center; to the body selector of the stylesheet. 
This is because some versions of Microsoft Internet Explorer
and some older browsers do not support top-level element centering.
*/

.centered {
margin: 0 auto 0 auto;
text-align: center;
}




/* ###########################################################    HOOFD CONTAINER */

.hoofdcontainer{
position: absolute;
top: 0px;
left: 0px;
border: 1px solid black;
color: #000000;
text-align: center;
margin: 0 auto 0 auto; /* Venster marges op 0!*/
width:100%
}

#hoofdcontainer{
width: 100%;
}


/* ###########################################################    HEADER  */

#top {
width: 100%;
height: 80px;
background-color:#F5CBB3;
}
 
div.top{
position: absolute;
left: 0px;
top: 0px;
border: 0px dashed #FF0000;
}




/* ###########################################################    LINKS BOVEN  */

#lb {
float: left;
width: 150px;
height:180px;
}

div.floatlb {
position: absolute;
left: 10px;
top: 100px;
border-style: groove;
border-color:#F5CBB3;
border-width:10px;
color: #000000;
text-align: center;
margin-left: 0px;


}



/* ###########################################################    RECHTS BOVEN  */

#rb {
float: left;
width: 600px;
height:250px
}

div.floatrb {
position: absolute;
left: 220px;
top: 80px;
border: 0px dashed #FF0000;
color: #000000;
text-align: left;
margin: 0px;
padding: 4px;
float: left;
}

/* ###########################################################   Google  */

#google {
float: left;
width: 878px;
height:12px;
}

div.google {
z-index:1;
position: absolute;
left: 0px;
top: 65px;
border-style: solid;
border-color:#F5CBB3;
border-width:3px;
background-color:#F5CBB3;
color: #000000;
text-align: center;
margin-left: 0px;


}




/* ###########################################################    LINKS ONDER  */

#lo {
float: left;
width: 180px;
height:210px
}

div.floatlo {
position: absolute;
left: 0px;
top: 320px;
top:380px; /* bij feestplaatje */
border: 0px dashed #FF0000;
color: #000000;
text-align: center;
margin-left: 0px;
padding: 4px;
float: left;
}


/* ###########################################################    LINKS 2  */

#li2 {
float: left;
width: 180px;
height:210px
}

div.floatli2 {
position: absolute;
left: 200px;
top: 320px;
top:380px; /* bij feestplaatje */
border: 0px dashed #FF0000;
color: #000000;
text-align: center;
margin-left: 0px;
padding: 4px;
float: left;
}

/* ###########################################################    RECHTS ONDER  */

#ro {
float: left;

}

div.floatro {
position: absolute;
width: 300px;
height:150px;
left: 400px;
top: 320px;
top:380px; /* bij feestplaatje */
border: 0px solid purple;
color: #000000;
text-align: left;
margin-left: 0px;
padding: 4px;
float: left;
}

/* ###########################################################    RECHTER kolom  */

#floatrechts {


}

div.floatrechts {
position: absolute;
width: 120px;
height:540px;
right: 0px;
top: 0px;
border: 0px solid purple;
background-color:#F5CBB3 ;
color: #F7EECD;
text-align: center;
margin-left: 0px;
padding: 0px;
float: right;
}

/* ###########################################################   HS  */

#HS {
float: left;
width: 900px;
height:20px;
}

div.HS {
z-index:1;
position: absolute;
left: 0px;
top: 520px;
top: 580px;
border-style: solid;
border-color:#F5CBB3;
border-width:3px;
background-color:#F5CBB3;
color: #000000;
text-align: center;
margin-left: 0px;


}

/* ###########################################################    SPACER */

div.spacer {
clear: both;
}

/* #################################################################  TABEL */

table{
color:black;		
font-family: verdana;
font-size: 12px;

}

th {
background-color: #F5CBB3;
font-family: Verdana,Helvetica,Arial,sans-serif;
font-size: 12px;
font-weight: bold;
}

/* ###########################################################  LOGIN FORMULIER */

.loginform {
  position: relative; 
  display: block;
  text-align: center;
  float: left;
  color:black;
  margin: 0px;
  padding: 2px;
  font-size: 11px;
	font-family: verdana;		/* letter type */
  min-width: 130px;
  max-width: 130px;
  width: 130px;
	
}

input, select, textarea {
  font-family: Verdana;
  font-size: 11px;
	font-weight: bold;
  color: black;
	width:130px;
	margin:3px;
	/*background-color: #E7FFFF
	background-color:#FFF8C6;*/

}

.button {
background-color: F5CBB3;
border-width: 3;
width: 130px;
height: 25px;
margin:3px;
color: black;
font-size: 11px;
font-family: arial;
font-weight: bold;
}

/* ###########################################################   FIELDSET */

fieldset {
border: #26a solid 1px;

}  

legend{
background: #F5CBB3;
border: #26a solid 2px;
padding: 1px 10px
}

label {
width: 8em;
float: left;
text-align: right;
margin: 0 1em 10px 0;
clear: both;
}


/* ###########################################################   register */
#register {
float: center;
width: 250px;
height:350px;
}

div.register {
position: absolute;
left: 70px;
top: 10px;
border-style: groove;
border-color:#F5CBB3;
border-width:10px;
color: #000000;
text-align: center;
margin-left: 0px;


}