/* Opmerkingen:

Optimaal voor IE6, IE7 en FireFox.

Met deze opzet schaleert de pagina altijd minimaal 100% in hoogte.
De positionering van de DIV's outer, innerwrap, left, centrecontent, right, header en footer is heel belangrijk.
Daarnaast is de hoogte van de outer van belang: height: 100%; is voor IE6 vereist en min-height: 100%; voor IE7 en FireFox.

De fontgrote wordt relatief gebruikt, zodat het goed schaleert en op elk beeldscherm hetzelfde is.
De basis fontgrote is 10 pixels (62,5%) en wordt aangeroepen in de body. Pas de fontgrote per div aan met 'em'.
1.0em komt overeen met 10 pixels. Houdt rekening met de cascading eigenschap van CSS.

De volgorde/indeling van de CSS komt overeen met de indeling van de site layout. Deze indeling is gekozen omdat het 
zoekmachine vriendelijk is. Eerst wordt de content getoond in de bron en daarna alle andere bestandsdelen van de website.

*/

/* MAC HIDE\*/
html, body {height:100%}
/* END HIDE */

/* ///////////////////////////////////////////////////////////// */

/* BODY */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* fontgrote is 10 (62,5% van 16); standaard fontgrote in browsers is 16 pixels */
	font-weight: normal;
	font-style: normal;
	color: #000;
	padding:0;
	margin:0;
	text-align:center;
	min-width:1000px; /* for mozilla*/
	background-color: #fffccc;
}

/* ///////////////////////////////////////////////////////////// */

/* ALGEMEEN */

h1 {
	font-size:2.0em; /* x 10 is de fontgrote in pixels */
	font-weight: bold;
	color: #000;
	margin: 0px;
	margin-top: 20px;
	margin-left: 50px;
	margin-bottom: 20px;
}

h2 {
	font-size: 1.4em; /* x 10 is de fontgrote in pixels */
	font-weight: bold;
	color: #0a5ca9;
	margin-top: 30px;
}

a:link, a:active, a:visited {
	color: #000;
	text-decoration: underline;
}

a:hover {
	color: #022080;
	text-decoration: none;
}

img {
	border: 0px;
}

div,p  {margin-top:0}

/* ///////////////////////////////////////////////////////////// */

/* DIV OUTER */

html>body #outer{height:auto;}

#outer{
	height:100%;
	min-height:100%;
	width: 960px;
	color: #000000;
	text-align:left;
	margin:auto;
	position:relative;
	background: url(/images/outer_back.png) top no-repeat #fff;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV INNERWRAP */

#innerwrap {/* enables content first */
	position: relative;
	float:left;
	width:960px;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV CONTENT */

#centrecontent {
	width:710px;
	float:right;
	margin-top:174px;
	*margin-top:176px;
	_margin-top:180px;
	margin-bottom:52px;
	font-size: 1.2em;
}

.contentblok {
	padding-left: 50px;
	padding-right: 50px;
}

/* FORMULIER */

form {
	border: 1px solid #878A35;
	background: #c6e4ff;
	padding: 0px;
}

form th {
	background: #0a5ca9;
	color: white;
	padding: 5px;
	font-size: 1.6em;
	text-align: center;
}

form td {
	padding: 2px;
}

form table {
	margin: 0px;
	padding: 0px;
}

form .submit {
	background: #0a5ca9;
	color: white;
	border: 1px solid  #0a5ca9;
	font-weight: bold;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV LEFT */

#left p {padding-left:3px;padding-right:2px}

#left {
	position:absolute;
	width:220px;
	float:left;
	margin-top:170px;
	margin-bottom:52px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 40px;
	background: url(/images/submenu_bottom.png) no-repeat bottom #c6e4ff;
	min-height: 200px;
	font-size: 1.2em;
}

#left h1 {
	margin: 0px;
	padding: 0px;
	padding-top: 10px;
	padding-bottom: 15px;
	font-family: Helvetica;
	font-size: 1.5em;
}

#left a {
	color: #000;
	text-decoration: none;
}

#left a:hover {
	text-decoration: underline;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV RIGHT */

#right p {padding-left:4px;padding-right:2px}

#right {
	position:relative;
	width:200px;
	float:right;
	margin-top:174px;
	*margin-top:176px;
	_margin-top:180px;
	margin-bottom:52px;
	background: #0000ff;
	display: none;
}

/* ///////////////////////////////////////////////////////////// */

/* CLEARFOOTER */

#clearfooter {width:100%;height:52px;clear:both}

/* ///////////////////////////////////////////////////////////// */

/* HEADER */

#header{
	position:absolute;
	top: 0px;
	left: 0px;
	width: 960px;
	height: 150px;
	background: #00ff00;
	border-bottom: none;
	color: #000000;
	background: #c6e4ff;
}

/* DIV HOOFDMENU */

#menu {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 105px;
	width: 960px;
	margin: 0px;
	padding: 0px;
	color: #fff;
	background: url(/images/header.png);
}

#algemeen {
	position: absolute;
	top: 85px;
	left: 10px;
	color: #000;
	font-size: 1.2em;
}

#algemeen a {
	color: #000;
	text-decoration: none;
}

#algemeen a:hover {
	color: #0a5ca9;
}

#menu_left {
	height: 45px;
	width: 505px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	background: url(/images/header_linksonder.png) no-repeat left bottom;
	_background: url(/images/header_linksonder_ie6.png) no-repeat left bottom;
}

#header ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	position: absolute;
	top: 105px;
	left: 430px;
	height: 45px;
	width: 500px;
	padding-left: 50px;
}

#header li {
	float: left;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 25px;
	padding-bottom: 4px;
	font-size: 1.3em;
	border-right: solid 1px #000;
}

#header li a {
	color: #000;
	font-weight: bold;
	text-decoration: none;
}

#header li:hover, #header li.sfhover {
	background: #0a5ca9;
}

#header li:hover a, #header li.sfhover a {
	color: #fff
}

#header li.selected {

}

#header li.selected a {

}

#header li ul {

}

/* ///////////////////////////////////////////////////////////// */

/* FOOTER */

* html #footer {/*only ie gets this style*/
	\height:70px;/* for ie5 & ie6 */
}
#footer {
	width: 960px;
	min-height: 70px;
	clear:both;
	background: #fff;
	color: #000000;
	left:0;
	bottom:0;
	position: absolute;
	background: #0a5ca9;
	color: #fff;
}

#btw {
	height: 19px;
	width: 723px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #ffe900;
	text-align: center;
	padding-left: 237px;
	padding-top: 1px;
	color: #000;
	font-size: 1.2em;
	letter-spacing: 2px;
}

#zoeken {
	width: 237px;
	height: 131px;
	background: url(/images/zoeken_back.png);
	position: absolute;
	top: -80px;
	left: 0px;
}

#text {
	position: absolute;
	top: 48px;
	left: 22px;
}

#text input[type="text"] {
	width: 185px;
	border: solid 1px #0a5ca9;
}

#submit {
	position: absolute;
	bottom: 25px;
	right: 29px;
}

#submit input[type="submit"] {
	background: #0a5ca9;
	border: solid 1px #0a5ca9;
	color: #fff;
}

#footer a {
	color: #fff;
	text-decoration: none;
}

#footer a:hover {
	color: #ff9900;
}

#footer ul {
	margin: 0px;
	padding: 0px;
	margin-left: 60px;
	padding: 0px;
	padding-right: 20px;
	padding-bottom: 5px;
	margin-top: 25px;
}

#footer li {
	float: left;
	height: 15px;
	list-style: none;
	margin-bottom: 3px;
	padding-right: 10px;
}

#footer li a {
	color: #fff;
	text-decoration: none;
}

#jingahoogingoogle {
	position: absolute;
	top: 25px;
	left: 10px;
	width: 150px;
	height: 20px;
	text-align: left;
	padding-top: 20px;
}

#jingahoogingoogle a {
	color: #fff;
	text-decoration: none;
}
