/* 
   we resetten alles zodat we in alle browser ongeveer
   met hetzelfde starten (yahoo ui css reset)
*/
@import "reset.css";

/*
   om mooie ronde dynamische kaders te bekomen gebruiken
   we de schillmania.com rounded corners technique
*/
@import "dialog.css";

/* standaard aangename typografie zoals verantwoorde lijnafstand, eigen defaults instellen e.d */
body {
	xfont: 12pt/1.5em bold normal Arial, Verdana, Helvetica, sans-serif;
	color: black;
	background: white url(../images/header-background.gif) repeat-x top left;
	text-align: center;
}

/* deze centreert heel het boeltje */
#container {
	position: relative;
	width: 900px;
	margin: 0 auto;
	text-align: left;
}

#header, #navigation, #sub_nav {
    font: 12pt/1.5em bold normal Arial, Verdana, Helvetica, sans-serif;
}

#header {
	height: 115px;
}

/* we vervangen de symantisch correcte kop tekst met het logo */
h1 {
	position: absolute;
	top: 25px;
	width: 503px;
	height: 93px;
	/* we maken gebruik van de zogenaamde phark method */
	text-indent: -5000px;
	/*background: url(../images/header-logo.png) no-repeat; */
}

h1.NL { background: url(../images/header_NL.gif) no-repeat; }
h1.FR { background: url(../images/header_FR.gif) no-repeat; }
h1.EN { background: url(../images/header_EN.gif) no-repeat; }

/* de slogan zit in het logo dus deze hebben we niet nodig, wel voor seo */
h2 {
	display: none;
}

/* alle navigatie lijstjes horizontaal maken */
#global_nav li, #lang_nav li, #navigation li, #sub_nav li {
	display: inline;
}

/* absoluut positioneren zodat we recht kunnen uitlijnen ongeacht de lengte van de navigatie */
#global_nav, #lang_nav {
	top: 83px;
	position: absolute;
	font-size: 12px;
}

#global_nav {
	right: 61px;
}

#lang_nav {
	right: 0;
}

.current a:link, .current a:visited, .current a:hover {
	color: #1F94DA !important;
	text-decoration: none;
	pointer: default;
}

/* uitlijnen met deeltje van logo 77px - 8px van de li padding van menu items = 69px */
#navigation {
	padding: 14px 0px 0px 73px;
	height: 70px;
}

#navigation, #sub_nav {
	font-size: 12px;
}

/* alle links in header en navigatie correct kleur geven */
#navigation a:link, #navigation a:visited, #header a:link, #header a:visited {
	text-decoration: none;
	color: white;
}

#navigation a:hover, #header a:hover {
	text-decoration: underline;
}

#navigation li, #global_nav li, #sub_nav li {
    margin: 0;
	padding-left: 4px;
}

#navigation a, #global_nav a, #sub_nav a {
	border-right: 1px solid white;
	padding-right: 6px;
	margin: 0;
}

#navigation a.nav-active 
{
	color: #FFD600;
	text-decoration: none;
}

#sub_nav a {
	border-right: 1px solid lightgrey;
}

#sub_nav a.nav-active 
{
	color: #11354B !important;
	text-decoration: none;
}

/* we zorgen voor een pipe na elk menu item maar niet bij het laatste */
#navigation .nav-last, #global_nav .nav-last, #sub_nav a.nav_last {
	border-right: none !important;
}

#sub_nav ul 
{
	border-bottom: 1px solid lightgrey;
	padding-bottom: 10px;
	margin-bottom: 10px;
	/*width: 534px;*/
}

#sub_nav li:first 
{
	margin-left: -4px;
}

/* zorgt dat footer onder één van de kolommen komt ongeacht welke het langst is */
#wrapper {
	overflow: auto;
}

/* content moet door logo ontwerp beetje padding krijgen links */
#content {
    padding: 0px 0px 10px 77px;
}

/* linker kolom staat uitgelijnd op deeltje van het logo waardoor we niet uitkomen op mooie pixel getallen */
#left {
	padding: 0px 0px 10px 77px;
	width: 533px;
	float: left;
}

/* tussen de kolommen alsook nog een marge gelaten */
#right {
	float: left;
	width: 279px;
	margin-left: 10px;
}

/* het geeft visueel een betere indruk als de footer op de content staat uitgelijnd */
#footer {
    font: 12pt/1.5em bold normal Arial, Verdana, Helvetica, sans-serif;
	clear: both;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 77px;
	text-align: center;
	font-size: x-small;
}

#footer p 
{
    padding-top: 10px;
	border-top: 1px solid lightgrey;
}

#content a:link, #content a:visited, #footer a:link, #footer a:visited {
	text-decoration: none;
	color: #1F94DA;
}

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

#nieuwsbrief-wuc {
    width: 269px;
    float: right;
    margin-left: 20px;
    margin-bottom: 10px;
	font: 9pt/1.5em bold normal Arial, Verdana, Helvetica, sans-serif;
}

/* we vervangen de symantisch correcte kop tekst met het logo */
h3#nieuwsbrief-header, h3#nieuwsbrief-knop {
	width: 258px;
	height: 38px;
	/* we maken gebruik van de zogenaamde phark method */
	text-indent: -5000px;
}
.nl h3#nieuwsbrief-header { background: url(../images/nieuwsbrief-nl-header.png) no-repeat; }
.nl h3#nieuwsbrief-knop { cursor: pointer; background: url(../images/nieuwsbrief-nl-knop.png) no-repeat; }
.fr h3#nieuwsbrief-header { background: url(../images/nieuwsbrief-fr-header.png) no-repeat; }
.fr h3#nieuwsbrief-knop { cursor: pointer; background: url(../images/nieuwsbrief-fr-knop.png) no-repeat; }

#nieuwsbrief-wuc { font-size: 11px; }
#nieuwsbrief-form table, #nieuwsbrief-validatie { margin: 10px 10px 0px 10px; }
#nieuwsbrief-form table { border-collapse: collapse; }
#nieuwsbrief-form table input { margin-left: 10px; }
#nieuwsbrief-form table td { padding: 3px 0px; }
#nieuwsbrief-form .textbox { width:155px; padding:1px; }
#nieuwsbrief-form .radiobuttons label { padding: 0px 5px; }
#nieuwsbrief-form .radiobuttons input { border: none; }
#nieuwsbrief-form table tr { margin-bottom: 10px; }
#nieuwsbrief-form table span label { display: inline; vertical-align:text-bottom; }
#nieuwsbrief-form input { border: 1px solid lightgrey; }
#nieuwsbrief-form .verzend { text-align:right; display: block; border-top: 1px solid lightgrey; padding: 10px; overflow:auto; }
#nieuwsbrief-form .verzend a { float:left; border:none; }

#nieuwsbrief-validatie {
	margin-bottom: 10px;
}

input:focus, textarea:focus {
	background: #F9F9F9;
}
input, textarea {
	padding: 3px;
	border: 1px solid lightgrey;
	background: white;
}
/* het markeren heeft voorrang op alle andere css */
.mark {
	background-color: #FFD7D7 !important;
}

/* sterreke op een formulier met verplicht veld */
.sterreke {
    color: red;
    padding-left: 3px;
}


#content-wrapper h1 {
	font-size: 2.0em;
	font-weight: normal;
	margin-top: 0em;
	margin-bottom: 0em;
	}
#content-wrapper h2 {
	font-size: 1.7em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}
#content-wrapper h3 {
	font-size: 1.4em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}
#content-wrapper h4 {
	font-size: 1.2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
#content-wrapper h5 {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
#content-wrapper h6 {
	font-size: 0.8em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
#content-wrapper img {
	border: 0;
	}

#content-wrapper ol, #content-wrapper ul, #content-wrapper li {
	list-style-type: disc;
	font-size: 1.0em;
	line-height: 1.8em;
	margin-top: 0.2em;
	margin-bottom: 0.1em;
	margin-left: 0.8em;
	}
#content-wrapper {
	font: 9pt/1.5em bold normal Arial, Verdana, Helvetica, sans-serif;
	margin: 1.2em 0em 1.2em 0em;
	font-family: Arial;
}