@import url(kolommen.css); 		
/* -------------- reset -------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td { margin:0; padding:0;}  
/* -------------- basis -----------------*/
body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:80%; } 
/*html>body {font-size:12.8px; } */
td, th {font-size:100%;}
img {border:0; }
input,textarea { font-size:100%; padding-left:.3em;}
textarea {font-family: Verdana, Arial, Helvetica, sans-serif; }
.verbergen {display:none;}
.verbergen2 {margin-left:-5000em; float:left;}
/* ================================================================================= */
/* =================================== Kolommmen =================================== */
#header, #utilities {height:5em; margin-bottom:1.8em;}
#header { background: #063944 url(../images/layout/oog.jpg) no-repeat right top;}
#header img { margin:1.3em 0 0 2%; height:2.27em; width:29.4em; } /* em = pixels * 6.25 / bodyfont% */

#menu, #sub-section { padding:0 0 .3em 0; margin:0; }
#content, #contentwide { padding:0 0 2em 0;}
#menu #rss, #menu #contact {margin-left:10%;}
#menu li {padding-left:10%;}
* html #menu li {padding-left:2%; p\adding-left:10%;} /* IE hack */
#contact a:link, #contact a:visited { color: #99914a; text-decoration:none; }
#contact a:hover { color: #9d2e5b; text-decoration:underline;}
#content, #contentwide { background-color:#fff; } /* Bij procentueel verkleinen in IE7 verkleint de linkermarge niet */
#contentwide {text-align:justify;}
#contentwide table, #content table {text-align:left; }
/* ---------------- ZOEKEN  ----------------- */
#utilities {background-color:#063944;}
#utilities #zoekveld {margin:0 5px 0 .5em; width:65%; border:1px solid #063944; padding:2px; }
#utilities .knop {width:24%; padding:0px; border:1px solid #9d2e5b; background-color:#9d2e5b;}
#utilities .knop:hover {background-color: #e3db93; border-color: #e3db93; color:#000;}
#utilities ul {padding: .6em 0 .7em 0; margin: 0 0 0 .5em; list-style-type: none; line-height:1.1em; }
#utilities ul li { margin:0 5px 0 0; padding:0; display:inline; background-image:none;}
#utilities ul li a {color: white; }
#utilities img.vlag {padding-left:.6em;}

/* ================================================================================= */
/* ================================= NAVIGATIE MENU's ============================== */
/* -------------------linkermenu hoofditems ------------------------ */
#menu { background-color:#efeabf; font-size:1em;}
#menu ul {margin:-.43em 0 2.9em 0; padding: 0; list-style-type: none; line-height:1.8em; font-size:1em;}
#menu ul li {margin: 0; padding-top: .43em; padding-bottom:.43em; background-image:none; }
#menu ul li a {display: block; padding:0; width:100%; text-decoration: none;}  
html>body #menu ul li a { width: auto; }
#menu ul li a:visited {color: #005fab; }
#menu ul li a:hover,#menu ul li.active a:hover {color: #9d2e5b;}
#menu ul li.active span, #menu li li.active {color:#9d2e5b; font-weight:bold; }
#menu li li.active a:link,#menu li li.active a:visited {color: #9d2e5b; font-weight:bold; }

/* -------------------linkermenu subitems ------------------------ */
#menu ul li.uitklap { background-color: #e3db93; }
#menu ul ul {margin: .2em 0 .5em 0; padding: 0 0 .42em 10%; list-style-type: none; font-size:.833em; line-height:1.08em;}
* html #menu ul ul { padding-left:2%; p\adding-left:10%;} /* IE hack */
#menu ul li li {border:0; margin:0; padding:0; }
#menu ul li li a, #menu ul li li.active {border:0; margin:0; padding:0.54em 0 0.5em 0; }
#menu ul li li.active a {padding:0;}
#zoeken a.active:visited {color:#d66500;}

/* -------------- tabjes -----------------*/
#contentnav { padding-bottom: 1.8em; margin-bottom: 2.9em; background: #fff; }
#contentnav ul { width: 100%; float: left; margin: 0; padding: 0 20px 0 0;	border-bottom: 1px solid #5d7e85;}
#contentnav li { float: left; display: inline; padding:0; margin:0; list-style: none; background:none;}
#contentnav a:link, #contentnav a:visited {	float: left; line-height: 1.8em; margin:0 1.8em 0 0;
text-decoration: none; color:#005fab}
#contentnav a.active:link, #contentnav a.active:visited, #contentnav a:hover {
	border-bottom: 4px solid #5d7e85; padding-bottom: 2px; color: #063944;	}
#contentnav a.active:link, #contentnav a.active:visited {	font-weight: bold; }

/* ================================================================================= */
/* ================================ TEKSTEN =========================================*/
p, ul, ol { line-height:1.8em; font-size:1em; margin-top:0; margin-bottom:1.8em}
br { line-height:1.8em; font-size:1em; margin:0; }
.nieuwsbriefdatum {color:#999999; font-size: 0.833em; margin:-2.16em 0 2.16em 0; line-height:2.16em;}
.smalltext { font-size:.833em; }
div.ruler {border-bottom:1px solid #cae2e7; margin-bottom:1.8em; font-size:1em;}
div.ruler hr {display:none;}
ul.wide li {padding-bottom:1.8em;}
#content p.focus, #contentwide p.focus {border:0.44em double white; background-color: #e0e8ef; padding:1.26em; text-align:center; }
#sub-section .related p.focus {}
#sub-section p, #sub-section hr, #sub-section ul, #sub-section ol, #contact p, #rss p { font-size:0.833em; line-height:2.16em; margin-bottom:2.16em;}
#sub-section h2 { font-size:0.83em; padding:0; margin:0; line-height:2.05em;}
#content p.nomargin, #contentwide p.nomargin, #sub-section p.nomargin {margin-bottom:0;}
/* homepage nieuws item */
div.focus {border:0.44em double white; background-color: #e0e8ef; padding:1.26em; text-align:center; margin-bottom:1.8em; margin-top:0.6em;}
div.focus h2 {margin-top:0; }
div.focus p {margin-bottom:0;}
/* ------------- links -----------------*/
a:link {color: #005fab;}
a:visited {color: #8997a3;}
a:hover {color: #9d2e5b;}
/* ------------- headers -----------------*/
h1,h2, h1 a:link, h1 a:visited, h1 a:hover, h2 a:link, h2 a:visited, h2 a:hover, h3 a:hover { color:#9d2e5b; }
h3, h3 a:link, h3 a:visited { color: #000; }
h1 {font-size:1.2em; margin-bottom: 1.52em; line-height:1.5em;}
h2, h3 {font-size:1em; line-height:1.8em; margin-top:1.8em;  }
h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited { text-decoration:none;}
h1 a:hover, h2 a:hover, h3 a:hover { text-decoration:underline;}

/* ------------- item met plaatje ------------- */
.itemafbeelding { margin-top:1.8em; }
.itemafbeelding img { float:left; margin:.5em 0 0 0; padding:0; border:0; width:5.55em; height:5.55em;}
.itemafbeelding p, .itemafbeelding ul {margin-left:7em;  }
.itemafbeelding h2 {margin-left:6.9em;} /* de header moet om een of andere reden minder breedte hebben */

/* ----------  bullets ---------------- */
ul {margin-left: 0; padding-left:.6em; list-style-type: none;}
ul li, ul li li {
	margin-left: 0; padding-left:1.2em; border: 0; background: url(../images/layout/bullet1.gif) no-repeat 0em .75em;}
ul li li {background-image: url(../images/layout/bullet2.gif) }
ol {padding-left:1em;margin-left:1em;}
/* -----------tabellen / formulieren / knoppen -------------*/
.knop { background: #063944; border:1px solid #063944; color:#fff; font-weight:bold; cursor:pointer;}	
a.knop:link, a.knop:visited, a.knop:hover { padding:.2em 1em; text-decoration:none; color:#fff; font-weight:bold;}
.knop:hover {background-color:#9d2e5b; border-color:#9d2e5b; }
tr.shaded, td.shaded, th.shaded {background-color: #f9f8ed;}
#contentwide form table {padding-top:.5em; width:60%; }
#content form table {padding-top:.5em; width:100%; }
form td, form th {padding:.5em 1.4em .5em 0; border-top: 1px dotted #999999; width:50%;}
.activeFormField {background-color:#FFFF99; border:2px solid black; color:black; }
.error { font-weight:bold; color: #CC0000; }
form table td {border-top: 1px dotted #999999;}
/* --------------------- Afbeelding ---------------------*/
div.afbeelding {float:right; padding:0; margin:0 0 0 2em; font-size:1em; background-color:#efeabf; }
#content .afbeelding {width: 37.2%; }
#contentwide .afbeelding {width:31.4%; }
#sub-section .afbeelding {float:none; margin-left:0; text-align:left;}
.afbeelding img { padding:0; width:12.6em; height:12.6em;}
/* --------------------- Gerelateerd / Rechterkolom-------------------*/
div.related {font-size:1em; border-bottom:1px solid #e0e8ef; background-color:#e0e8ef;  padding:.9em .9em 0 .9em; margin: .9em 0 .9em 0; }

/* ------------------- Vorige / 1 2 3 4 / Volgende links ------------- */
div.row {width:100%; clear: both;}
div.row span.left {float: left; width: 33%;}
div.row span.right {float: right; text-align: right; width: 34%;}
div.row span.middle {float: left; text-align: center; width: 33%;}
div.row span.left a.page {padding-left: 1.2em; background: transparent url(../images/layout/bluearrowl.gif) no-repeat scroll left center;}
div.row span.right a.page {padding-right: 1.2em; background: transparent url(../images/layout/bluearrow.gif) no-repeat scroll right center;}

.screenshot {border: 1px solid #333A8B;}

/* -------------------  Thumbnails / overzicht logo's opdrachtgevers ------------------- */
.thumbnailcontainer { width:100%;}
#contentwide .thumbnailcontainer .kolom p, #contentwide .thumbnailcontainer .kolom ul  {text-align:left; }
.thumbnailcontainer .kolom { width:49%; float:left; }
.thumbnail { float: left; padding: 0 1em .5em 0; }
.thumbnail img, .gallery img {border: 1px solid #4A6B85;}
.thumbnail a:hover img {border: 1px solid #d66500;}
.thumbnail .caption {width: 100px; height: 5em; padding-top: 4px;} 
.thumbnail a:hover .caption {cursor:pointer; }  /* anders is het een text-cursor ipv handje */
.thumbnail a { padding-bottom:.8em; } /* geen ruimte tussen de links */
.gallery {float:left; position:relative; padding-right:1em; padding-top:0.2em;}
.spacer {clear: both; height:0; font-size:1px;  margin:0; padding:0;}
.thumbnail .caption {vertical-align: middle; text-align: center; font-size: 80%;}

/* 000 grid 000 */
/*html {background:none;}
body { background:#fff url(../images/grid.gif) repeat 0 13px;} 
#content, #contentwide, #menu, #menu ul li.uitklap {background:none;}
*/