html { height: 100%; margin-bottom: 1px; }

body {
	background-color: #FFF;
	text-align: center;
	margin: 0px; padding: 0px;
}

body, #page, div {
	font: normal 11px Arial, Helvetica, sans-serif;
	line-height: 15px;
	color: #383838;
}

#page { // Horizontale position
	position: relative;
	width: 823px; height: 100%;
	margin-right: auto; 
	margin-left: auto;
	margin-top: 0px;
	padding: 0px;
	text-align: left;
	overflow: auto;
}

#pageContainer {
	position: relative;
	top: 0px; left: 0px;
	width: 823px;
	top: 0px; left: 0px;
}

#pageBorder {
 position: relative; 
 top: 0px; left: 0px;
 width: 823px; 
 background: #FFF url('../images/bg_center.gif') repeat-y;
}

#pageContent {
	position: relative;
	top: 0px; left: 0px;
	width: 803px;
	margin: 0px 10px 0px 10px;
}

#breadcrumb {
	width: 793px; height: 12px; 
	padding: 7px 5px 7px 5px;
	font-weight: bold;
	background: #EEE url('../images/bg_breadcrumb.gif') repeat-x;
}
#breadcrumb .breadcrumbClip {width: 620px; overflow: hidden; white-space: nowrap; text-overflow:ellipsis;}


.pagevisualContainer {width: 803px; height: 104px; background: #FFF;}
.pagevisualContainer .divgumbuttons {position: absolute;}


/* HOMEPAGE */
#contentBoxIndex {
	width: 803px; table-layout: fixed;
	background: #FFF url('../images/bg_contentbox_index.gif') repeat-y; 
}
#colindex1 {width: 160px; padding: 0px;}
#colindex2, 
#colindex3, 
#colindex4 {width: 161px; padding: 0px 0px 5px 0px;} 
#colindex5 {width: 160px; padding: 0px 0px 5px 0px;}
#colindex5 .whitespace {color: #FFF;}

/* --- JEUGD ---*/
#contentBoxJeugd {
	width: 803px; table-layout: fixed;
	background: #FFF url('../images/bg_contentbox_jeugd.gif') repeat-y; 
}
#coljeugd2, 
#coljeugd3, 
#coljeugd4 {width: 161px; padding: 0px 0px 5px 0px;} 
#coljeugd2 H2, #coljeugd3 H2, #coljeugd4 H2 {color: #e189b4;} /* Rose */
#coljeugd2 img.introAfbeelding,
#coljeugd3 img.introAfbeelding,
#coljeugd4 img.introAfbeelding {border-width: 4px 0px; border-style: solid; border-color: #e189b4;}

/* Vervolg 3 koloms */
#contentBoxVervolg {
	width: 803px; table-layout: fixed;
}
#colvervolg1 {width: 160px; padding: 0px;}
#colvervolg2 {width: 483px; padding: 0px 0px 25px 0px;} 
#colvervolg3 {width: 160px; padding: 0px 0px 5px 0px;}
#colvervolg3 .whitespace {color: #FFF;}

/* Vervolg 2 brede koloms */
#contentBoxVervolgBreed {width: 803px; table-layout: fixed;}
#colvervolgbreed2 {width: 322px; padding: 0px 0px 25px 0px;} 
#colvervolgbreed3 {width: 321px; padding: 0px 0px 25px 0px;}
#colvervolgbreed3 .whitespace {color: #FFF;}

/* Vervolg 1 koloms breed */
#contentBoxVervolgQuotes {
	width: 803px; table-layout: fixed;
	background: #FFF url('../images/bg_contentbox_breed.gif') repeat-y; 
}
#colvervolgquotes {width: 643px; padding: 0px 0px 25px 0px;} 


/* GENERAL STYLES */
.whitespace {margin: 0px 5px 10px 5px;}
HR {height: 4px; clear: both; border-left: none; border-right: none; margin: 0px 0px 10px 0px; border-top: 4px solid #E0E0E0; border-bottom: none;}
P {margin: 0px;}
FORM {margin: 0px;}
UL {margin-top: 0px; }
IMG {border: 0px;}
TD {vertical-align: top;}
H1 {font: bold 16px Arial, Helvetica, sans-serif; margin: 5px 0px 5px 0px;}
H2 {font: bold 12px Arial, Helvetica, sans-serif; margin: 5px 0px 5px 0px;}
H3 {font: bold 11px Arial, Helvetica, sans-serif; margin: 20px 0px 5px 0px;}
H4, H5, H6 {font: bold 11px Arial, Helvetica, sans-serif; margin: 0px;}
H2.pagetitle {font: bold 12px Arial, Helvetica, sans-serif; margin: 5px 5px 5px 5px; display: block; height: 24px; }
A {text-decoration: underline; color: #0078ae;}
A:hover {text-decoration: underline; color: #0078ae;}

/* HOMEPAGE */
#colindex2 H2 {color: #e189b4;} /* Rose */
#colindex3 H2 {color: #f5a748;} /* Oranje */
#colindex4 H2 {color: #adca57;} /* Groen */
#colindex5 H2 {color: #FFFFFF;} /* Wit */
#colindex2 img.introAfbeelding {border-width: 4px 0px; border-style: solid; border-color: #e189b4;} /* Rose */
#colindex3 img.introAfbeelding {border-width: 4px 0px; border-style: solid; border-color: #f5a748;} /* Oranje */
#colindex4 img.introAfbeelding {border-width: 4px 0px; border-style: solid; border-color: #adca57;} /* Groen */
#colindex5 img.introAfbeelding {border-width: 4px 0px; border-style: solid; border-color: #0078ae;} /* Donkerblauw */

/* #colindex5 a {color: #FFF; text-decoration: underline;} */


/* QUOTES PAGINA */

.quoteCol1 {width: 310px; float: left; margin-right: 11px;}
.quoteCol2 {width: 310px; float: left; }

.quote {width: 310px; margin: 0px 0px 10px 0px; padding-bottom: 10px;}
.quoteBallon {width: 300px; padding: 7px 5px 24px 5px; font: bold italic 13px Arial, Helvetica, sans-serif; cursor:pointer; cursor:hand;}

/* FAQ - VRAAG EN ANTWOORD */
.questionGroup {margin-top: 15px;}
.question {border-top: 1px solid #EEE;}
.question:hover {background-color: #F1F1F1;}
.question a.plus {display: block; padding: 3px 0px 3px 20px; background: url('../images/bullet_faq_plus.gif') no-repeat 5px 6px;}
.question a.min {display: block; padding: 3px 0px 3px 20px; background: url('../images/bullet_faq_min.gif') no-repeat 5px 6px;}
.questionAnswer {padding: 5px 0px 15px 20px;}

/* VERWIJZERS OPENKLAP SECTIES */
.sectionGroup {margin-top: 15px;}
.openklapSection {border-top: 1px solid #EEE;}
.openklapSection:hover {background-color: #F1F1F1;}
.openklapSection a.plus {display: block; padding: 3px 0px 3px 20px; background: url('../images/bullet_faq_plus.gif') no-repeat 5px 6px;}
.openklapSection a.min {display: block; padding: 3px 0px 3px 20px; background: url('../images/bullet_faq_min.gif') no-repeat 5px 6px;}
.sectionOpenklap {padding: 5px 0px 15px 20px;} /* dit is het deel dat openklap! */


/* NIEUWSOVERZICHT */
.nieuwsJaarSelector {margin-top: 10px; }
.nieuwsJaarSelector td {vertical-align: middle; padding: 3px 3px;}
.nieuwsJaarSelector select {font: normal 10px Arial, Helvetica, sans-serif;}
.navbar { margin: 0px 0px 15px 0px; padding: 5px 3px;}
.navbarPageNumber,
.navbarDots {display: inline; border-left: 1px solid #CCC; padding: 0px 8px 0px 8px;}
.navbarActivePageNumber {background: #F1F1F1; border-left: 1px solid #CCC; padding: 0px 8px 0px 8px;}
.navbarPreviousNextArrow {padding: 0px 8px 0px 8px;}
.nieuwsAnkeiler {border-top: 1px solid #CCC; padding: 5px 0px;}

/* VACATUREOVERZICHT */
.vacatureAnkeiler {border-top: 1px solid #CCC; padding: 5px 0px;}

/*-------- Left menu -----------*/
.leftMenu {padding: 0px; margin: 0px; width: 160px;}
.leftMenu ul {list-style: none outside; padding: 0px; margin: 0px;}
.leftMenu li {list-style: none outside; padding: 0px; margin: 0px;}
.leftMenu a.niv1 {
	font: bold 12px Arial, Helvetica, sans-serif; text-decoration: none;
	display: block; padding: 5px 12px 0px 0px; 
	width: 148px; height: 23px; margin: 0px; 
	text-align: right; }


.leftMenu .pink {background: #FFF url('../images/menu_bt_pink.gif') no-repeat; color: #000;}
.leftMenu .pink:hover, 
.leftMenu .pinkactive {background: #FFF url('../images/menu_bt_pinkhover.gif') no-repeat; color: #FFF;}

.leftMenu .orange {background: #FFF url('../images/menu_bt_orange.gif') no-repeat; color: #000;}
.leftMenu .orange:hover, 
.leftMenu .orangeactive {background: #FFF url('../images/menu_bt_orangehover.gif') no-repeat; color: #FFF;}

.leftMenu .green {background: #FFF url('../images/menu_bt_green.gif') no-repeat; color: #000;}
.leftMenu .green:hover, 
.leftMenu .greenactive {background: #FFF url('../images/menu_bt_greenhover.gif') no-repeat; color: #FFF;}

.leftMenu .lightblue {background: #FFF url('../images/menu_bt_lightblue.gif') no-repeat; color: #000;}
.leftMenu .lightblue:hover, 
.leftMenu .lightblueactive {background: #FFF url('../images/menu_bt_lightbluehover.gif') no-repeat; color: #FFF;}

.leftMenu .darkblue {background: #FFF url('../images/menu_bt_darkblue.gif') no-repeat; color: #000;}
.leftMenu .darkblue:hover, 
.leftMenu .darkblueactive {background: #FFF url('../images/menu_bt_darkbluehover.gif') no-repeat; color: #FFF;}

/*-----------  Left menu VERWIJZERS -------------*/
.leftMenu a.niv1Arrow {
	font: bold 12px Arial, Helvetica, sans-serif; text-decoration: none;
	display: block; padding: 5px 12px 0px 0px; 
	width: 148px; height: 23px; margin: 0px; 
	text-align: right;
	background: #FFF url('../images/menu_bt_darkblue.gif') no-repeat; color: #000;
}

.leftMenu a.niv1ArrowActive {
	font: bold 12px Arial, Helvetica, sans-serif; text-decoration: none;
	display: block; padding: 5px 12px 0px 0px; 
	width: 148px; height: 23px; margin: 0px; 
	text-align: right;
	background: #FFF url('../images/menu_bt_darkbluehover.gif') no-repeat; color: #FFF;
}

.leftMenu a.niv1Arrow:hover, .leftMenu a.niv1ArrowActive:hover {background: #FFF url('../images/menu_bt_darkbluehover.gif') no-repeat; color: #FFF;}


.leftMenu a.niv1Locked  {
	font: bold 12px Arial, Helvetica, sans-serif; text-decoration: none;
	display: block; padding: 5px 12px 0px 0px; 
	width: 148px; height: 23px; margin: 0px; 
	text-align: right;
	background: #FFF url('../images/menu_bt_darkbluelocked.gif') no-repeat; color: #999;
}
.leftMenu a.niv1Locked:hover {background: #FFF url('../images/menu_bt_darkblue_lockedhover.gif') no-repeat; color: #bde2f2;}





/*---------- LEFT Sidebar items --------*/
.sidebar_textBlock {
	width: 148px; padding: 0px; border: 1px solid #b8def6; margin: 0px 5px 10px 5px;
	background-color: #FFF;
}
.sidebar_textBlock H2 {
	display: block; background-color: #b8def6; margin: 0px; padding: 3px 5px;
}
.sidebar_textBlock .content {margin: 5px;}

.sidebar_bannerBlock {
	width: 150px; padding: 0px; border: 0px solid #b8def6; margin: 0px 5px 10px 5px;
}

/*-------------- FORMS ----------------------*/

.xsFormTable {table-layout: fixed;}
.xsFormCol1 {width: 35%; padding: 4px 2px 4px 2px; vertical-align: top; border-top: 1px solid #e3f2ff;}
.xsFormCol2 {width: 65%; padding: 4px 2px 4px 2px; vertical-align: top; border-top: 1px solid #e3f2ff;}
.xsFormButton {background-color: #FFF; border: 1px solid #2A8BBE; color: #145190;cursor:pointer;cursor:hand; padding-bottom: 2px; height: 22px;}
.xsFormButton:hover {background-color: #2A8BBE; border: 1px solid #2A8BBE; color: #FFF;cursor:pointer;cursor:hand;}

.xsformbuilder_simple_textbox {width: 260px;background-color: #EEF9FF;border: 1px solid #A5ACB2;font: normal 12px Arial, Helvetica, sans-serif;}
.xsformbuilder_large_textbox {width: 260px;background-color: #EEF9FF;border: 1px solid #A5ACB2; font: normal 12px Arial, Helvetica, sans-serif;}
.xsformbuilder_radiotext { }

.xsformbuilder_select {width: 270px;background-color: #EEF9FF;font: normal 12px Arial, Helvetica, sans-serif;}


.xsFormTable HR {height: 2px; clear: both; border-left: none; border-right: none; margin: 0px 0px 10px 0px; border-top: 2px dotted #90ccff; border-bottom: none;}

/* ---------- SITEMAP -------------*/
.sitemapPink,
.sitemapOrange,
.sitemapGreen,
.sitemapDarkblue,
.sitemapLightblue,
.sitemapGray {width: 150px; float: left; margin-top: 10px; margin-bottom: 20px;}
.sitemapPink UL, .sitemapOrange UL, .sitemapGreen UL, .sitemapDarkblue UL, .sitemapLightblue UL, .sitemapGray UL {list-style: none outside; padding: 0px; margin: 0px;}
.sitemapPink LI, .sitemapOrange LI, .sitemapGreen LI, .sitemapDarkblue LI, .sitemapLightblue LI, .sitemapGray LI {list-style: none outside; padding: 0px; margin: 0px;}
.sitemapPink LI UL LI, .sitemapOrange LI UL LI, .sitemapGreen LI UL LI, .sitemapDarkblue LI UL LI, .sitemapLightblue LI UL LI, .sitemapGray LI UL LI {list-style: none outside; padding: 0px 0px 0px 5px; margin: 0px;}
.sitemapPink {border-top: 4px solid #e189b4; margin-right: 10px;}
.sitemapOrange {border-top: 4px solid #f5a748; margin-right: 10px;}
.sitemapGreen {border-top: 4px solid #adca57; margin-right: 10px;}
.sitemapDarkblue {border-top: 4px solid #0078ae;}
.sitemapLightblue {border-top: 4px solid #0078ae; margin-right: 10px;}
.sitemapGray {border-top: 4px solid #CCC; margin-right: 10px;}
.sitemapPink H2 {color: #e189b4;}
.sitemapOrange H2 {color: #f5a748;}
.sitemapGreen H2 {color: #adca57;}
.sitemapDarkblue H2 {color: #0078ae;}
.sitemapLightblue H2 {color: #0078ae;}


/*--------- ZOEKBOX -----------*/
.searchBoxContainer {position: absolute; top: 109px; left: 642px; width: 155px; height: 16px; z-index:10; }
#searchBox {width: 103px; height: 14px; padding: 0px; margin: 0px; border: 1px solid #7d8790; font: normal 10px Arial, Helvetica, sans-serif; float: left; margin-right: 2px;}
.xsearchResultsContainer {}
.zoekbutton {width: 45px; height: 16px; padding: 0px; margin: 0px; border: 1px solid #eeeeee; background-color: #eeeeee; font: normal 10px Arial, Helvetica, sans-serif; float: left;cursor:pointer;cursor:hand;color: #0078ae;}
.zoekbutton:hover {}

/* ---------- FOOTER -------------*/
#footer {position: relative;
	width: 793px; height: 12px; 
	padding: 14px 5px 7px 5px;
	background: #EEE url('../images/footer_ruler.gif') no-repeat 0px 5px; 
}
#footer .copyright {position: absolute; top: 14px; right: 3px; width:200px; height: 16px; z-index:10; color: #7d8790; text-align: right; padding-right: 5px;}

/*------------ ZELFTEST -----------*/
.zelftestProgressContainer {border: 1px solid #bebebe; padding: 2px;width: 360px;}
.zelftestProgressBg {background: #e8e8e8;}
.zelftestText {margin-bottom: 5px;}
.zelftestButton {font: normal 10px Arial, Helvetica, sans-serif; margin-top: 10px; padding: 2px 12px 2px 0px;}
.zelftestButton:hover {font: normal 10px Arial, Helvetica, sans-serif; margin-top: 10px; padding: 2px 12px 2px 0px;cursor:pointer;cursor:hand;}
.zelftestUitleg {width:420px; border: 1px dotted red; padding: 10px; margin: 10px 0px; background: #FFF url('../images/bg_uitleg.gif') repeat-x bottom left;}

/*----------- NEWS & VACATURE ROTATOR --------------*/
.rotatorContainer {position: relative; width: 150px; height: 160px; overflow:hidden; margin-top: 5px; }


.rotatingContent {
	width: 150px;
	font: normal 10px Arial, Helvetica, sans-serif;

}

/*------------ NEWSLETTER AAN- EN AFMELDEN ----------*/
.newsletterStatus { border: 2px solid #ccc; padding:5px; width:95%; margin:4px 0px; }
.newsletterButton { border: 1px solid #ccc; background-color: #ddd; }