html, body{ margin: 0; padding: 0; height: 100%; }
body{ width: 100%; background-color: #ddd; color: #222; font: 75%/1.6em Verdana, sans-serif; }
body *{ background-color: transparent; }

/* clear all */
h1,h2,h3,h4,p,div,img,ul,li{ margin:0; padding:0; }
ul {list-style: none;}
p {margin-bottom: 10px;}
a {color:#009E16;}
a:hover {color:#222;}

h1,h2,h3{ margin-bottom:5px; }
h1{ font-size:22px; }
h2{ font-size:18px; }
h3{ font-size:14px; }
/* h3{ margin-top:25px; } */

h1, h2, h3, h1 a, h2 a, h3 a, h4 a { color: #009E16; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {color: #222;}
h1 a, h2 a, h3 a, h4 a {display:block; text-decoration: none;}
h2 a, h3 a, h4 a {background: no-repeat url('/images/arrow-009E16.png') right 7px;}
h2 a:hover, h3 a:hover, h4 a:hover {background-image: url('/images/arrow-222222.png');}

/* defaults */
img{border:0;}
ul.horizontal{list-style:none;}
ul.horizontal li{list-style:none;float:left;margin-right: 20px;text-align: center;}
a.readmore{ font-size:9px;display:block; line-height:normal; text-decoration: none; }

/* toolbox */
.center-page{ margin: 0 auto; }
.clear{ clear: both; }
.center{ margin: auto auto; }
.left{ float: left; }
.right{ float: right; }
.half-pane{ width: 50%; overflow:hidden; }
.third-pane{ width: 33.3%; overflow:hidden; }
.two-third-pane{ width: 66.7%; overflow:hidden; }
.padding{ padding: 20px; }
.phor{ padding:0 20px; }
.ptop{ padding-top: 20px; }
.mtop{margin-top: 20px;}
.mbott{margin-bottom: 20px;}
.mright{margin-right: 20px;}
.mstop{margin-top: 10px;}
.msbott{margin-bottom: 10px;}
.msright{margin-right: 10px;}

.clearfix:after {	content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix {	display: inline-block; }
html[xmlns] .clearfix {	display: block; }
* html .clearfix { height: 1%; }


/* main div positions */
#framework  { position: relative; width: 990px; background-color: white;}
div#header  { height: 266px; background: #0B5F0A no-repeat url('/images/header.jpg'); }
div#logo { top:25px; left:10px; position:absolute; width:auto; }
div#logo a { display:block; background: transparent url('/images/logo-vlag.png') no-repeat; width:268px; height:199px;}
div#logo a span { display:none;}
div#intro   { background-color: #139012; color:white; }
div#intro-text { width: 740px; }
div#intro-text h2 { color:white; }
div#intro-text h3 { color: #00FF00; margin-top:0; }
div#intro-text p { margin-bottom:0; }
div#intro-text a { color:white; }
div#intro-text a:hover { color:black; }
div#intro-text div.padding { } /* correct p margin bottom... */
div#content {  }
div#content div#col1 { float:left; width:490px; }
div#content div#col2 { float:left; width:250px; background: #222; }
div#content div#col3 { float:left; width:250px; }
div#footer { padding: 10px 20px; margin-bottom: 10px; border-top: 1px solid #004A00; }

/* pixel lines */
/*
div#intro{ border-bottom: 1px solid #004A00; }
div#content{ border-top: 1px solid #139012; border-bottom: 1px solid white; }
*/

/* CONTENT PAGE */
#framework.content-page div#header{ height: 135px; }
#framework.content-page div#header { background: #0B5F0A no-repeat url('/images/header-content-page.jpg'); }
#framework.content-page div#logo { top:10px; left:10px; position:absolute; width:auto; }
#framework.content-page div#logo a { display:block; background: transparent url('/images/logo-vlag-content-page.png') no-repeat; width:188px; height:139px;}
#framework.content-wide div#col1 { width:740px; }



/* /////////// */
/* NAVIGATIONS */

/* main nav */
div#main-nav{ font-size:16px; }
div#main-nav ul a{ display:block; color: white; text-decoration: none; margin-bottom: 5px; }
div#main-nav ul a:hover { color: #00FF00; }
div#main-nav ul li { margin-bottom:20px; }

/* sub nav */
div#main-nav ul.sub-nav { margin-bottom:10px; font-size: 12px; }
div#main-nav ul.sub-nav li { margin-bottom:1px; }
div#main-nav ul.sub-nav li a{  margin-bottom: 0; line-height:25px; padding-left:15px; background: no-repeat url('/images/arrow-00ff00.png') 0 10px; display:block; color: #00ff00; text-decoration: none; }
div#main-nav ul.sub-nav li.active a,
div#main-nav ul.sub-nav li a:hover{ color: white; background-image: url('/images/arrow-ffffff.png') }
/* TODO: fix recursion */
div#main-nav ul.sub-nav li.active li a{  margin-bottom: 0; line-height:25px; padding-left:15px; background: no-repeat url('/images/arrow-00ff00.png') 0 10px; display:block; color: #00ff00; text-decoration: none; }
div#main-nav ul.sub-nav li.active li.active a{ color: white; background-image: url('/images/arrow-ffffff.png') }
div#main-nav ul.sub-nav ul.sub-nav {margin-left:10px;margin-bottom:0;}

/* generic nav */
div#generic-nav{ width:250px; float:right; background-color: white; text-align:right; }
div#generic-nav ul { float:right; }
div#generic-nav ul a { margin-bottom:0; display:block; line-height:30px;color: #139012; background-color:white; text-decoration: none; }
div#generic-nav ul a:hover{ text-decoration: underline; }

/* footer nav */
div#footer-nav{ }
div#footer-nav ul a { line-height:20px; color:#139012; background-color:white; text-decoration: none; }
div#footer-nav ul a:hover { text-decoration: underline; }

/* breadcrumb nav */
div#breadcrumb-nav { font-size:10px; }
div#breadcrumb-nav ul { margin:auto; }
div#breadcrumb-nav ul li{ margin:auto; }
div#breadcrumb-nav ul a { line-height:12px;color: #0B5F0A; text-decoration: none; }
div#breadcrumb-nav ul a:hover { text-decoration: underline; }

/* END NAVIGATIONS */
/* /////////////// */


/* article */
div.intro{ margin-bottom:10px; font-weight:bold; } /* intro not used, shown in green title block */
div.body{ margin-bottom:10px;}
div.body ul { margin-bottom:10px;list-style:square;margin-left:15px; }

.date{ color: #009E16;font-size: 10px;line-height:normal; }

/* lists like newitems */
div.list{ }
div.list div.item{ width:100%; float:left; margin-bottom:20px; }
div.list div.item h3{ margin:0; }
div.list div.item div.img{ background-color: #139012; margin-top:3px; margin-right:10px; }
div.list div.item div.img img{ float:left; }
div.list div.item div.date{ color: #009E16; font-size: 10px; line-height:normal; }
/* minilist */
div.minilist div.item{ width:100%; float:left; margin-bottom:10px; }

/* bullits before wsvr events in right column */
div#col3 ul.list li { line-height:normal;margin-bottom:3px; }
/*
div#col3 ul.list {}
div#col3 ul.list li { line-height:normal;margin-bottom:5px; padding-left:15px; background: no-repeat url('/images/arrow-green.gif') 0 6px; display:block; }
div#col3 ul.list li span.date { line-height:0; }
*/

/* gallery and images */
div.img img{ font-size: 10px; line-height:normal; }
div.img div.description{ font-size: 10px; line-height:normal; }
div.gallery-thumbs div.img { width:88px; height:88px; border:1px solid #009E16; margin:0 10px 10px 0; } 
div.gallery-thumbs div.img { overflow:hidden; } /* should be php image crop */ 
div.gallery-thumbs div.img.last { margin-right:0; } 
div.gallery-thumbs div.img img{ border:1px solid white; }
div.gallery-thumbs div.description{ text-align: left; padding:0 5px 5px 5px; }
/* gallery overview page */
div.gallery-list div.gallery-thumbs div.img { width:80px; height:80px; }
div.gallery-list div.gallery-thumbs div.img.last { margin-right:0; } 

/* slideshow */
div#slideshow { height:200px; overflow:hidden; }
div#slideshow a { color:white; text-decoration:none; }
div#slideshow a:hover { color:#00FF00; }


/* weer pagina */
div.knmi-waarschuwing { padding:10px;border:5px solid red; }
div.knmi-waarschuwing h3 { color: red; }





/* IE6 fix */
div#main-nav li a { _margin-bottom:5px; }
div#main-nav li ul li a { _margin-bottom:auto; }
div#main-nav ul.sub-nav li { _line-height:1; }
div#main-nav ul.sub-nav li a{ _line-height:1; }



/* /////////////////////// */
/* legacy... to be deleted */

/* content block */
.cblock{padding-top: 5px;border-top: 1px dotted #333; margin-bottom: 10px;}

/* Gouwe Ouwe */
table.gouwe-ouwe th,
table.gouwe-ouwe td {vertical-align: top;}
table.gouwe-ouwe th {font-size: 10px; color: #666; text-align: left;}

table.gouwe-ouwe-form th {font-weight:normal;text-align: left;vertical-align:top;line-height:25px;}
table.gouwe-ouwe-form th.fieldset {background-color: #139012; font-weight: bold;color:white;padding-left:5px;}
table.gouwe-ouwe-form td.divider {line-height:1px;height:5px;}
table.gouwe-ouwe-form td {font-style: italic;font-size:10px;color: #666;}
table.gouwe-ouwe-form input,
table.gouwe-ouwe-form textarea
 {width:300px;border:1px solid #139012; }
table.gouwe-ouwe-form input.submit {width:auto;}

ul.error_list{padding:2px 5px;background-color:red; color:white;}