/* ======= General Stylesheet for oost-vlaanderen.be ========= 
 *
 *    Version: 1.1
 *    Author: KST (Amplexor)
 *
 *		version 1.1: modification for homepage (17/10/2005) - KST
 *
 *   ------------------------------------                                 
 *   |      Table of Contents           |
 *   ------------------------------------
 *   | 1. General Styling               |
 *   | 2. Header Styling                |
 *   | 3. Navigation Styling            |
 *   | -- Left nav                      |
 *   | -- Top nav                       |
 *   | 4. Footer Styling                |
 *   | 5. Content element Styling       |
 *   | 6. Right Box styling             |
 *   | 7. 3-Col positioning & Floating  |
 *   -----------------------------------
 * ===================================================== */

/* ====
 * = 1. General Styling 
 * ======================= */
body{font: 0.83em/1.4 verdana, arial, Helvetica, sans-serif; margin: 0; padding: 0; width: 100%;color:#565655; background: #737272}
* {font-size: 100%}
img{border: 0}
div{margin: 0; padding: 0; border: none}
a{color: #D54902; text-decoration: underline}
a:hover{text-decoration: none}

/* ====
 * = 2. Header Styling
 * ====================*/
#logo{position: absolute; top: 54px; left: 0}
#headerImg{display: block; height: 72px; width: 800px; position: absolute; top: 0px; left: 189px}

/* ====
 * = 3. Navigation Styling
 * ====================*/
/* == Left nav == */
/* -- 
----- Older browsers may display this navigation less than perfect, but functionallity and accessibility remains optimal
----- tested in: IE5.01; MAC-IE5.1; IE5.5; IE6; FF1.0 (mac & pc); N7.1; safari 1.2.4; Camino 0.82; Opera 7.51
-- */
#nav ul{margin: 0; padding: 0; list-style-type: none; background-color: #fff; width: 190px;}
#nav li{font-size: 1em; margin: 0; padding: 0; border: 0px solid #fff}
#nav a:link, #nav a:active, #nav a:visited, #nav a:hover{display: block; background: #D54902; border-left: 3px solid #D54902; padding: 0.18em 5px 0.18em 15px; color: #E4DACB; font-weight: bold; text-decoration: none}
#nav a:hover, #nav a.sel:link, , #nav a.sel:active, , #nav a.sel:visited, , #nav a.sel:hover{color: #fff; border-left: 3px solid #FFFFFF}
#nav li.bb{border-bottom: 1px solid #fff}
#nav li{border-bottom: 1px solid #b5a99f}

#nav a.protected:link, #nav a.protected:active, #nav a.protected:visited, #nav a.protected:hover{padding-right: 22px; background-image: url('css_lock.gif'); background-repeat: no-repeat; background-position: right}
#nav ul ul a.protected:link, #nav ul ul a.protected:active, #nav ul ul a.protected:visited, #nav ul ul a.protected:hover{padding-right: 22px; background-image: url('css_lock3.gif'); background-repeat: no-repeat; background-position: right}

#nav ul ul a:link, #nav ul ul a:active, #nav ul ul a:visited, #nav ul ul a:hover{background: #fff; border-left: 3px solid #fff; border-right: 3px solid #D54902; font-weight: normal; font-size: 0.83em; color: #565655; padding-left: 20px}
#nav ul ul a:hover, #nav ul ul a.active:link, #nav ul ul a.active:active, #nav ul ul a.active:visited, #nav ul ul a.active:hover{background-color: #FFFFFF; border-left: 3px solid #FFFFFF; border-right: 3px solid #D54902}

/* == End Left nav == */

/* == Target Nav  == */
#targetNav{position: absolute; top: 0; left: 0; width: 100%; background-color: #d4c7b7; border-bottom: 1px solid #fff; font-size: 80%; height: auto; white-space: nowrap; padding: 0.2em 0}
#targetNav a{color: #625141}
 .dark_bullet_right,  .red_bullet_right{background: url('css_dark_bullet.gif') no-repeat right; padding-right: 13px; margin-right: 3px}
 .dark_bullet_left,  .dark_bullet_left{background: url('css_dark_bullet.gif') no-repeat left; padding-left: 13px; margin-left: 3px}
 .red_bullet_right,  .red_bullet_left{background-image: url('css_red_bullet.gif')}
#targetNav div{margin-left: 205px}

/* == Top nav == */
#topNav{position: absolute; top: 25px; left: 205px; white-space: nowrap}
#topNav a{color: #FFFFFF}

/* == Drop Down Navigation == */
/* -- A simple Javascript function sets and removes the class ".acitve" to display the second level navigation. 
----- IE5.0 is not capable of handeling this kind of css, so for this browser no second level navigation will pop-up.
----- This has no accessibility issues because the second level is accessible in the left navigation by selecting the first level in the top navigation.
----- In Browsers without JS or with JS disables, no pop-up behaviour will visible either.
----- tested in: IE5.01; MAC-IE5.1; IE5.5; IE6; FF1.0 (mac & pc); N7.1; safari 1.2.4; Camino 0.82; Opera 7.51
-- */
/* The fixed width is to prevent horizontal scroll-bars on higher resolutions, and wrapping of navigation items on lower resolution. */
#headerNav{margin-top: 72px; margin-left: 189px; width: 61em}
#headerNav ul, #headerNav li{padding: 0; margin: 0; list-style-type: none; display: inline}
#headerNav a{display: block; color: #fff; background: #D54902; text-decoration: none; font-weight: bold; height: 27px; width: 7em; font: bold 0.83em/1 verdana, arial, Helvetica, sans-serif; padding: 3px 1em; padding-bottom: 4px; border-right: 1px solid #fff;}
#headerNav a:hover, #headerNav a.sel{background: #D54902}
/* IE5.x Boxmodel hack */
#headerNav a, #headerNav li{width:10em; voice-family: "\"}\""; voice-family:inherit; width:7em}
#headerNav a, #headerNav li{height: 32px; voice-family: "\"}\""; voice-family:inherit; height: 26px}

#headerNav li{float: left; width: auto}
* html #headerNav li{width: 7em}
#headerNav li ul{display: none; background: #D54902}
#headerNav li.active ul{display: block; position: absolute; width: auto; background: #D54902;}
#headerNav li.active a{background: #D54902}
#headerNav li li{float: none; border-width: 0px; margin: 0; padding: 0; height: auto; display: inline; width: auto; border: none}
#headerNav li li a{height: auto; padding: 3px 1em; margin: 0; border-width: 0px; background-color: #D54902; display: block; border-bottom: 1px solid #fff; width: 120%}
#headerNav li li a:hover{background-color: #D54902}
/* colored line inside level 1 nav */
#headerNav li b{width: 20px; height: 3px; display: block; margin-top: -3px}
#headerNav li.notactive b{background-color:#D54902}
#headerNav li.active b, #headerNav li b.sel{background-color: #D54902}

#headerNav a.protected:link, #headerNav a.protected:active, #headerNav a.protected:visited, #headerNav a.protected:hover{background-image: url('css_lock3.gif'); background-repeat: no-repeat; background-position: right}
/* == End Drop Down Navigation == */


#searchBox{display: inline; margin-left: 2em}
#searchBox input#text, #searchBox select#select, #searchBox input#submit, #auto_form input#text, #auto_form textareau{height: auto; width: 6em; display: inline; border: 1px solid #625141}
#searchBox select#select, #searchBox input#submit{width: auto}
#searchBox input.notactive{background: #D54902; color:#FFFFFF; border: 1px solid #D54902; cursor:pointer; font-weight: bold; color: #fff}
#searchBox input.active{background: #625141; border: 1px solid #D54902; cursor:pointer; font-weight: bold; color: #fff}
form{display: inline}




/* ====
 * = 4. Footer Styling
 * ====================*/

#footer span{display: block; color: #fff; font-size: 80%; margin-left: 210px}

/* ====
 * = 5. Content element Styling
 * =========================*/
#ct {text-align:left; font-size: 75%}
h1{
	font-size: 100%;
	color:#D54902;}

#evt-page h1{background: url(css_events_icon_big.gif) no-repeat left; padding-left: 40px; height: 25px; vertical-align: middle}
#pub-page h1{background: url(css_pubs_icon_big.gif) no-repeat left; padding-left: 40px; height: 25px; vertical-align: middle}
#subs-page h1{background: url(css_subs_icon_big.gif) no-repeat left; padding-left: 40px; height: 25px; vertical-align: middle}

#content h2{color: #D54902; margin: 0; padding: 0; margin-top: 2em}
#content a.gototop{float: right; font-size: 85%; padding-right: 12px; background: url('css_bookmark_up.gif') no-repeat right; text-decoration: none; font-weight: normal; margin-top: -1.3em}
#content{padding: 15px 0; text-align: left;}
#content p{margin-top: 0.5em}
#content h1{margin-top: 0.3em}	
#content .detNav, #content #relLinks, #content #contenttoc{clear: right}

#detNav, .detNav{width: 95%; margin: 0.3em auto; background: #F4F4F6; text-align: left}
#detNav td, .detNav td{width: 50%; padding: 0.2em;padding-top: 1em}
#detNav td{padding: 0.5em}
#detNav td ul {margin: 0em}
* html #detNav td ul {margin: 0 2.5em}
.detNav h3, .detNav p{padding: 0; margin:0}
.detNav p{margin-bottom: 0.5em}
.detNav td{padding: 1em}
.ll{border-left: 1px dashed #FFFFFF}
#detNav a.protected:link, #detNav a.protected:active, #detNav a.protected:visited, #detNav a.protected:hover{background-image: url('css_lock3.gif'); background-repeat: no-repeat; background-position: right; padding-right: 20px}

.detNav a:link, .detNav a:active, .detNav a:visited, .detNav a:hover{color: #D54902; text-decoration: none}
* html .detNav a:hover{text-decoration: underline}
.detNav a:hover *{text-decoration: underline}

#contenttoc{border-bottom: 1px solid #b5a99f; border-top: 1px solid #b5a99f}
#detNav li, #relLinks li{list-style: url(css_more_link.gif)}
#contenttoc li{list-style: url(css_bookmark_right.gif)}
.moreLink{background:  url(css_more_link.gif) no-repeat left; padding-left: 10px}
#relLinks{width: inherit; margin: 1.5em auto; padding: 0.5em; border: 1px solid #d4c7b7; background: #fff}
#relLinks h4{margin: 0.2em}
#relLinks ul{margin: 0 2em; margin-bottom: 0.5em}

#content .imgsrc{color: #999; font-style: italic; margin: 0; padding: 0; text-align: right; font-size: 70%; margin-bottom: 0.5em}
#content img.right{float: right; clear: right}
.imgBox{margin: 0;padding:0; width: 220px; float: right; padding-left: 1em; text-align: right; white-space: wrap; margin-top: 2em; margin-bottom: 0.5em; margin-left: 1em; overflow: hidden}
.imgBox *{display: block; clear:right}
#home-page .imgBox{float: none; width: auto; margin: 0; padding: 0; text-align: left}
#home-page .imgBox *{display: inline; clear: none}
#home-page #content img.right{float: none; clear: none}

.contentTable{width: auto; border: 1px solid #d4c7b7; padding: 0; margin: 1em auto;}
.contentTable td, .contentTable th{padding: 0.2em; text-align: left}
.contentTable th{background: #d4c7b7}
.contentTable .on td{background: #fff}

/* Toegevoegd door KDP*/
.contentTableLinks{ border: 1px solid #d4c7b7; padding: 0; margin: 1em auto;}
.contentTableLinks td, .contentTable th{padding: 0.2em; text-align: left}
.contentTableLinks th{background: #d4c7b7}
.contentTableLinks .on td{background: #fff}

/* Toegevoegd door SV vrije uitlijning van tekst in tabel...*/
.contentTableText{ border: 1px solid #d4c7b7; padding: 0; margin: 1em auto;}
.contentTableText td, .contentTable th{padding: 0.2em;}
.contentTableText th{background: #d4c7b7}
.contentTableText .on td{background: #fff}

.docs a{background: url(other.gif) no-repeat left top; padding-left: 20px; text-decoration: none}
.docs a:hover{text-decoration: underline}
.docs a:visited{color:#333333;}
.docs a.pdf,.docs a.doc, .docs a.xls, .docs a.ppt, .docs a.zip, .docs a.other{background: url(pdf.gif) no-repeat left top; padding-left: 20px}
.docs a.doc{background-image: url(word.gif)}
.docs a.xls{background-image: url(excel.gif)}
.docs a.ppt{background-image: url(ppt.gif)}
.docs a.zip{background-image: url(zip.gif)}
.docs a.swf{background-image: url(swf.gif)}
.docs a.other{background-image: url(other.gif)}
.docs a b{color: #625141}
.uppercase{text-transform: uppercase;}

#searchresults h3, #searchresults p, #searchresults span{margin: 0; padding: 0}
#searchresults h3{margin-top: 1em}
#searchresults p span{color: #666; font-size: 90%; font-style: italic; display: block; }

/* new home-content */
#home-page .detNav{background: #fff; border: 1px solid #000000}
#home-page .detNav h2{margin: 0}

#home-page .detNav ul{margin: 0; padding: 0; margin-left: 15px; list-style: url(css_more_link.gif)}
#home-page .detNav ul a{text-decoration: underline}
#home-page .detNav ul a span, #home-page .detNav ul a b{text-decoration: none; font-size: 85%; color: #999}
#home-page .detNav ul a:hover, #home-page .detNav ul a:hover span, #home-page .detNav ul a b{text-decoration: none; font-weight: normal}
#home-page #right{padding-top: 15px}

#home-page #relLinks{border: none; margin: 0; padding: 0}
#home-page h4{color: #D54902; padding: 0; margin: 0; margin-top: 10px }
#home-page .ll h2{margin-bottom: 10px}
#home-page .ll h3{margin-bottom:0px}
#home-page .ll p{margin-top: 0px}
/* ====
 * = 6. Right Box styling
 * =========================*/
#right div.box {background: #fff url('css_rb_top.gif') no-repeat top; width: 180px; margin-left: 5px; margin-bottom: 20px; padding: 10px 0}
/* #evt-page #right div#evt-box, #subs-page #right div#subs-box, #pub-page #right div#pub-box{padding: 0; width: 180px} */

#right img{margin-left:5px;width: 180px; margin-bottom:20px}
#right div.box h3{border-bottom: 1px solid #FFFFFF; font-size: 79%; margin: 0; padding: 2px 3px 4px 10px}
#right div#pub-box h3, #right div#evt-box h3, #right div#subs-box h3, #right div#acc-box h3{padding-left: 25px}

#right div p {font-size: 75%; padding: 5px 10px}

#pub-box h3{background: url(css_pubs_icon_small.gif) no-repeat left top}
#evt-box h3{background: url(css_events_icon_small.gif) no-repeat left top}
#subs-box h3{background: url(css_subs_icon_small.gif) no-repeat left top}
#acc-box h3{background: url(css_acc_icon_small.gif) no-repeat left top}

#pub-page #right div#pub-box{background-image: none; padding-top: 0}
#subs-page #right div#subs-box{background-image: none; padding-top: 0}
#evt-page #right div#evt-box{background-image: none; padding-top: 0}

#evt-page #right div#evt-box h3{background: url(css_events_icon_small_on.gif) no-repeat left top}
#pub-page #right div#pub-box h3{background: url(css_pubs_icon_small_on.gif) no-repeat left top}
#subs-page #right div#subs-box h3{background: url(css_subs_icon_small_on.gif) no-repeat left top}

#evt-page #right div#evt-box h3, #subs-page #right div#subs-box h3, #pub-page #right div#pub-box h3{background-color: #D54902; color: #fff}

/*#pub-page #right div#pub-box p, #subs-page #right div#subs-box p, #evt-page #right div#evt-box p{margin: 5px 10px}*/
#right a{display: block; margin-top: 0.1em; padding-left: 15px; background: url(css_link_arrow.gif) no-repeat left 0.5em}
#right a.pdf{background-image: url(css_pdf_icon.gif); padding-left: 20px}
#right a.more{background-image: none; padding: 0}
/*#right #evt-box a.more, #right #subs-box a.more, #right #pub-box a.more{padding: 0 5px 10px 10px}*/
#right #blindsurfer {width:45px; margin-left:50px;}
/* ====
 * = 7. 3 Column Layout Positioning & Floating 
 * ============================================*/
body{padding-top: 160px}

#header{background: url('css_header_bg_gouv.gif') repeat-x; position: absolute; top: 55px; left: 0; width: 100%; height: 105px}

#mainContainer{min-width: 975px; width: 100%}
#container{background: #FFFFFF url('css_nav_bg.gif') repeat-y left; float: left; width: 100%}

/*#home-page #container{background-image: url(css_homegouv_pic2.jpg); background-repeat: no-repeat; background-position: top left} */

#content{margin-left:210px;}
#nav, #leftcontent{ float:left; width:200px;}
#leftcontent{margin-left:10px;margin-top:10px;}


#right{width: 20%; margin-left: 78%; padding-top: 20px}
#footer{background:#D54902 url('css_footer_bg_gouv.gif') repeat-y left; width: 100%; clear: both}

/* .xopusmeta {display:none;}*/

.dp-none, #hidetopskip, #hidetopskip{display: none}


/* ====
 * = Stijlen specifiek voor de gouverneurssite
 * ============================================*/

.gouverneur #headerNav a, .gouverneur #headerNav li{width:14em; voice-family: "\"}\""; voice-family:inherit; width:10em}
.gouverneur #headerNav li{float: left; width: auto}
* html .gouverneur #headerNav li{width: auto}
.gouverneur #headerNav li ul{display: none; background: #D54902}
.gouverneur #headerNav li.active ul{display: block; position: absolute; width: 10em; background: #D54902;}
.gouverneur #headerNav li.active a{background: #D54902}

.gouverneur #headerNav li li{float: none; border-width: 0px; margin: 0; padding: 0; height: auto; display: inline; width: auto; border: none}
.gouverneur #headerNav li li a{height: auto; padding: 3px 1em; margin: 0; border-width: 0px; background-color: #625141; display: block; border-bottom: 1px solid #fff; width: 120%}
.gouverneur #headerNav li li a:hover{background-color: #D54902}

/* colored line inside level 1 nav */
.gouverneur #headerNav li b{width: 20px; height: 3px; display: block; margin-top: -3px}
.gouverneur #headerNav li.notactive b{background-color:#625141}
.gouverneur #headerNav li.active b, #headerNav li b.sel{background-color: #D54902}

.gouverneur #targetNav{display: none}
.gouverneur .ll .heet{border: 1px solid #D54902; padding:5px; margin-right:10px;}
.gouverneur .ll .heet a{text-decoration:underline}
.gouverneur .ll h1 {color:#D54902}

#auto_form input.text,#auto_form textarea.text,#auto_form select.text{height: auto; width:auto; display: inline; border: 1px solid #625141;}
#auto_form div {padding-left:20px;}
#auto_form div.verplicht{ background:url('required.gif') no-repeat top left; width:auto;  }
#auto_form div.error{ background:url('error.gif') no-repeat top left; width:auto;  }
#auto_form input.error,#auto_form textarea.error,#auto_form select.error{height: auto; width:auto; display: inline; border: 1px solid #D54902}




