.clear {
	CLEAR: both;
}
.hide {
	DISPLAY: none;
}
html {overflow-y: scroll;}

BODY {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #000000;
	font-size:85%; /*ori 75%;   16x75%=12px*/
	MARGIN: 0px; 
	PADDING: 0px; 
	BACKGROUND-COLOR: #ffffff; 
}

#container {
	width: 760px;
	BORDER-BOTTOM-COLOR: #8F8F8F;
	BORDER-TOP-COLOR: #8F8F8F;
	BORDER-RIGHT-COLOR: #8F8F8F;
	BORDER-LEFT-COLOR: #8F8F8F;
/*	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;  ivm vertikaal centreren*/
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 0px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	padding: 0px;
	background-repeat: no-repeat;	/*ivm plaatjes boven de inhoud*/
	position: absolute; /* ivm vertikaal centreren*/
	margin: 0 auto; /* ivm vertikaal centreren*/
	top: 50%; /* ivm vertikaal centreren*/
	left: 50%; /* ivm vertikaal centreren*/
	margin-left: -381px; /* = helft van feitelijke breedte = 762px*/
	margin-top: -245.5px; /* = helft van feitelijke hoogte =  491px*/

}

#logo { /*als eerste in de div container*/
	position: relative;
	top: 18px; 
	float:right;
	padding-right: 20px;
	padding-left: 87px;
	z-index: 7; /* anders loopt in FF3.5 zichtbaar het achtergrondplaatje oranje lijntje van het menu door tot rechts*/
	background-color: #ffffff;/*anders is de doorlopende oranje lijn van het menu zichtbaar in FF en Opera */
}

#beheer {
	margin: 0px;
	padding: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-size: 12px; /*1em  was 12 px bij orifontsize 75% = 12x1=12px*/
	position: relative;
	top: 0px;
}

#menu1 {
	position: relative;
	list-style-type: none;
	left: 0px;
	right: 205px;
	top: 36px; 
	height: 36px;
	z-index: 6;/*menu rolt nu uit over de inhoud heen*/
/*	background-image: url(../baspics/spacer.gif); */
	background-repeat: repeat-x;
}

#menu1 ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
#menu1 a {
	padding: 0;
	margin: 0;
	list-style: none;
	color: #FFFFFF;
}
#menu1 li {
	float: left;
	position: relative;
	padding-top: 0px; 
	padding-right: 9px; /* (558-knopbreedtes)/6 = 9.16666 = ruimte rechts van de knoppen*/
	padding-bottom: 0px;
	padding-left: 0px;
	list-style-type: none;
	
}
#menu1 li ul {
	display: none;
	position: absolute;
	top: 29px; 
	left: 0;
	list-style-type: none;
	background-image: url(../baspics/bgsubmenupijltje.png); /*pijltje omhoog van het submenu*/
	background-repeat: no-repeat;
	margin: 0px;
	padding: 0px;
}
#menu1 li:hover ul {
	display: block;
	padding: 9px 0px;
	margin: 0px;
}
#menu1 li:hover ul li a {
	display: block;
	padding: 0px;
	margin: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

#outerColumnContainer {
	BORDER-LEFT: #ffffff 108px solid; /*ffffff=wit; deze bepaalt feitelijke breedte leftcolumn*/
	BORDER-RIGHT: #ffffff 205px solid; /*ffffff=wit; deze bepaalt feitelijke breedte rightcolumn*/
}

#button {  /*div in de div outercolumncontainer*/
	position: relative;
	top: 100px;
	z-index: 7; /*moet overal bovenop liggen*/
	float:right;
	margin-right: -185px;
	margin-top: -37px; /* als ik het weglaat, springt alles in outercolumncontainer naar beneden*/
}


#innerColumnContainer {
/*	Z-INDEX: 1; */
	BORDER-LEFT: 0px; 
	MARGIN: 0px 0px; /*0px -1px*/
	WIDTH: 100%;
/*	background-color: #FF9999;  FF9999 = roze */
}

#leftColumn {
	POSITION: relative; 
	OVERFLOW: visible;
	Z-INDEX: 2; /* ori 4 */
	MARGIN-top: 40px; /*60px*/
	margin-right: 1px;
	margin-bottom: 0px;
	margin-left: -108px; /*dit is -108px van de innercontainer*/
	WIDTH: 108px;
	FLOAT: left;
/*	background-color: #00FFFF; 00FFFF = grieks-blauw*/
}
#middleColumn {
	POSITION: relative;
	OVERFLOW: visible;
/*	Z-INDEX: 4;*/
	MARGIN-top: 20px;   
	MARGIN-right: 0px;
	margin-bottom: 0px;
	margin-left: -1px; /* als ik deze op 0 zet, begint de inhoud waar de hoogte van left column ophoudt*/
	WIDTH: 100%;
	FLOAT: right;
/*	background-color: #FFFF33; #FFFF33 = grieks-blauw*/
}
.imgfloatright {
	FLOAT:right;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 5px;
}

.layerhidden {
	position: relative;
	visibility: hidden;
}
.layershow {
	position: relative;
	visibility: show;
}

#rightColumn {
	POSITION: relative;
	OVERFLOW: visible;
	Z-INDEX: 2;
	MARGIN-top: 60px;
	margin-right: -205px;
	margin-bottom: 0px;
	margin-left: 1px;
	WIDTH: 205px;
	FLOAT: right;
	padding-top: 45px; /*ivm benodigde ruimte onder de button */
/*	background-color:#00CC99;  #00CC99 = blauwgroen */
}
.tekstrightcol {/* class voor div met tekst in right column*/
	padding-left: 20px; /* = ruimte tussen einde tekst middlecolumn en begin tekst rightcolumn*/
	padding-right: 10px; /* = ruimte tussen einde tekst rightcolumn en kantlijn rechts */
	padding-top: 15px; /* = extra ruimte button ravelijnlogo en tekst */
	font-size: 0.9em; 
}
#SOWrap {
	POSITION: relative;
	OVERFLOW: visible;
	Z-INDEX: 3;
	MARGIN-top: 0px;
	margin-right: -1px;
	margin-bottom: 0px;
	margin-left: 0px;
	WIDTH: 100%;
	FLOAT: left;
/*	background-color: #3399CC;   #3399CC = blauw*/
}
#footer {
	PADDING-BOTTOM: 0.5em;
	PADDING-TOP: 0.5em;
	border: 0px;
	border-bottom-width: 1px; /*dit is het lijntje onderaan de pagina */
	border-bottom-color: #8F8F8F;
	border-bottom-style: solid;
}
BR {
	CLEAR: left; /*wat doet dit? ik durf het niet weg te halen*/
}

.testbg_groen {
background-color:#CCFF66;
}
.testbg_geel {
background-color:#FFFF66;
}