/* ---------------------  ------------------------------------------------ */
html{ font-size: 62.5%;}
body {
	margin:0px;
	padding:0px;
	background-color:#fff;
	font-size:1.1em;
	color:#000000;
	font-family:Verdana,Tahoma,Helvetica,Sans-serif;}
h3,h4,h5,h6,ul,li,form,p { margin:0px; padding:0px;}
/* --------------------------------------------------------------------- */
h1 {
	color:#000000;
	margin-bottom:5px;
	padding-bottom:10px;
	font-size:1.6em;
	font-weight: normal;
}
h2, h3, h4, h5, h6{
	font-size:1.1em;
	font-weight:bold;}
/* --------------------------------------------------------------------- */
a {	text-decoration:underline;}
a:hover { text-decoration:none;}
/* --------------------------- help tricks------------------------------------------ */
.all, .reset { display:block; width:1px; height:1px; clear:both; font-size:1px; margin:0; padding: 0; line-height:1px; }
.floatLeft { float: left; }
.floatRight { float: right;}

/* --------------------------------------------------------------------- */
div#main_box{
    width:670px;
}
/* --------------------------------------------------------------------- */

#xypicker { 
    background:#f6f6f6;
    border-top: solid 1px #cacaca;
    padding:0px;
    display: none;
}
#xypicker h2 { 
    color:#000000; 
	font:bold 1em Verdana,Tahoma,Helvetica,Sans-serif;
	padding:6px;
    float: left;
}
#xypicker .helpicon { width:19px; float: left; cursor: help; position: relative; top: 2px; left: 1px; }
#xypickercontent { border:0px; list-style:none;
	padding:4px; background-color:#fff;}

.legenda { 
    display: none; 
    background:#f6f6f6;
    border-bottom: solid 0px #cacaca;
    padding:0px;
    margin-bottom:0px;
}

.legenda span.in { padding:3px 0px 0px 0px; margin: 0px 4px 0px 32px; cursor: help; display:block;}
.legenda p { color:#000; height:auto; margin: 0px 20px 0px 0px; padding:4px 0px; text-decoration:none; overflow:visible;}

*html .legenda p { height:21px; } 

/* --------------------------------------------------------------------- */
div#map_area{
    background:#fdf6bb;
    position:relative;
    margin:0;
    clear: both;
    /* Width en height moeten hier ook opgegeven worden (naast #imgMapContainer), want in IE6 wordt legenda anders te laag getekend.*/
    width:670px;
    height:466px;
}
#map_area h2 { 
	color:#000000;
	font-size:1.2em;
	padding-left:6px;
	padding-right:6px;
	padding-bottom:4px;}
#map_controls {
    border:0px solid green;
    position:absolute;
    top:8px;
    right:14px;
    padding:0px 0px;
    margin:0px 0px;
    z-index:1000;
}
/* --------------------------------------------------------------------- */
/* no focus-'dotted border' on a- and input-elements*/
/* http://codylindley.com/Javascript/223/hiding-the-browsers-focus-borders-should-i-shouldnt-i */
:focus { 
    -moz-outline-style: none; 
}

input {
    font-size:1em;
    border:1px solid #000;
    padding:1px 1px;
    margin:0px 0px;
    vertical-align: baseline;
}
select {
    font-size:1em;
    border: solid 1px #000;
    margin:0px 0px -1px 0px;
    padding:0px 0px 0px 0px;
    vertical-align: baseline;
}
.inputcheckbox {
    vertical-align: middle;
    border:0px;
}
/* legenda control */
#legendaContainer {
    bottom:0;
    position:absolute;
    right:16px;
    z-index:1000;
    background:url(data/legenda_bg.png) right top repeat;
    padding-right:5px;
    width: 206px;
    overflow: visible;
}
.legenda_btn_inactive{
	border:none; 
	background:url(data/legenda_inactive_inactive.png) left center no-repeat;
    background-color:#fff;
	height:21px;
    cursor: pointer;
    display:block;   
}
.legenda_btn_inactive:hover{	
	background:url(data/legenda_inactive_mouseover.png) left center no-repeat; 
    background-color:#e5e5e5;
}
.legenda_btn_active{	
    border:none; 
	background:url(data/legenda_active_inactive.png) left center no-repeat;
    background-color:#f9e11e;
	height:21px;
    cursor: pointer;
    display:block;
}
.legenda_btn_active:hover{	
	background:url(data/legenda_active_mouseover.png) left center no-repeat;
    background-color:#e1bd22;
}
.legenda_metadata {
    float: right;
    padding: 6px 3px 0px 0px;
    display: block;
    width: 16px;
    height: 16px;
    background: url(data/metadata.gif) center center no-repeat;
}
.legenda_metadata a {
    display: block;
    width: 16px;
    height: 16px;
}
.satelliet_btn_inactive{
	border:none; 
	background:url(data/satelliet_inactive_inactive.png) right center no-repeat;
	width:81px;
	height:23px;
    cursor: pointer;
    display:inline-block;  
    padding:5px;    
}
.satelliet_btn_inactive:hover{	
	background:url(data/satelliet_inactive_mouseover.png) right center no-repeat;
    padding:5px;    
}
.satelliet_btn_active{	
    border:none; 
	background:url(data/satelliet_active_inactive.png) right center no-repeat;
	width:81px;
	height:23px;
    cursor: pointer;
    display:inline-block;
    padding:5px;
}
.satelliet_btn_active:hover{	
	background:url(data/satelliet_active_mouseover.png) right center no-repeat;
    padding:5px;
}
.kaart_btn_inactive{
	border:none; 
	background:url(data/kaart_inactive_inactive.png) right center no-repeat;
	width:81px;
	height:23px;
    cursor: pointer;
    display:inline-block;
    padding:5px;
}
.kaart_btn_inactive:hover{	
	background:url(data/kaart_inactive_mouseover.png) right center no-repeat;
    padding:5px;
}
.kaart_btn_active{	
    border:none; 
	background:url(data/kaart_active_inactive.png) right center no-repeat;
	width:81px;
	height:23px;
    cursor: pointer;
    display:inline-block;
    padding:5px;
}
.kaart_btn_active:hover{	
	background:url(data/kaart_active_mouseover.png) right center no-repeat;
    padding:5px;
}

	
.button_i-icon {
	border:none;
	background: url(data/information.gif) 0px 0px no-repeat;
	width:35px;
	padding:0px 10px 0px 0; margin:0;
	cursor: help;
	}

/* --------------------------------- */
#imgMapContainer { 
    padding: 0px; 
    background:#ffffff; 
    display: block;  
    position:relative;
    width:670px;
    height:466px;
}

.olMapViewport { overflow: hidden; position: relative; top: 0px; left: 0px; width: auto; }
#warningMessageContainer { display: none; margin: 0px;  padding: 20px; color: #000000; background-color: #f9e11e; border: 1px solid #fdf6bb; font-weight: bold; }
#warningMessageContainer a, #warningMessageContainer a:visited {
    text-decoration:none; color: #000000;
    background:url(data/arrow.gif) 0px -1px no-repeat;
    padding-left: 10px;
}
#warningMessageContainer a:hover, #warningMessageContainer a:active {
    background-color:#fdf6bb;
    text-decoration:underline;
    color:#000000;
}

/* zoek locatie / geocoder form */
#map_bar_1{
    background-color:#f6f6f6;
    border-bottom:1px solid #e6e6e6;
    display:block;
    position: relative;
    width: 100%;
    z-index: 2500;
}
#map_bar_2{
    background-color:#ffffff;
    width:100%;
    padding-top:4px;
    z-index: 2000;
    clear: both;
    position: relative;
}
#submitsearchbtn {
    border:1px solid black;
    cursor:pointer;
    display:inline;
    margin:0px 0px -4px 0px;
    padding:0px 0px 0px 0px;
    width:55px;
    height:15px;
}
.submitsearchbtnmouseover{
    background:url(_img/zoekbtn_mouseover.gif);
}
.submitsearchbtnmouseout{
    background:url(_img/zoekbtn.gif);
}
#zipsearchdiv{
    display:inline;
}
.searchinput{
    display:inline;
    background-image:url(_img/search_icon.gif);
    background-position:right center;
	background-repeat:no-repeat;
}
.searchinput_busy{
    background-image:url(_img/search_icon_spinner.gif);
}
#searchmessages{
    display:block;
    padding: 0px 0px;
    border:0px red solid;
    padding-top:3px;
    left:0px;
}
.inline{
    display:inline;
    padding-right:5px;
}
#searchcontainer{
    padding-left:15px;
}
#searchblock1div {
    float: left;
    display: block;
    height: 35px;
}
#searchblock2div {
    display: block;
}
#searchresultdiv{
    top:23px;
    width: 150px;
    background-color: white;
    border: 1px solid black;
    position: absolute;
    z-index: 1000;
}
#searchresultdiv li, #searchresultdiv a, #searchresultdiv span{
    text-decoration:none;
    color:#000;
    list-style-position:outside;
    list-style-type:none;
}
#searchresultdiv em{
	font-style: normal;
    font-weight:bold
}
#searchresultdiv a {
    display: block;
    border-bottom: 2px solid #cacaca;
}
#searchresultdiv span {
    padding: 2px 5px 2px 5px;
    display: block;
}
#searchresultdiv a:hover {
    text-decoration:underline;
    color:#707070;
    background-color: #e5e5e5;
}

/* periode / calendars  control*/
#periodediv{
    float:right;
    position:relative;
    right:16px;
}
.periodecalendar{
    cursor:pointer;
    position:relative;
    top:3px;
}
.calendartitle{
    /*display:none;*/
}

/* category control */
.category {
    display: none;
}
#categorydiv {
    padding-top: 2px;
    padding-left: 15px;
    float: left;
}
#categorydiv select {
    font-size:1em;
}
.category span {
    cursor: pointer;
}

/* permalink control */
#permabtndiv {
    position: absolute;
    right: 15px;
    top: 4px;
    z-index: 1000;
}
#permabtn{
    border:1px solid black;
    cursor:pointer;
    display:inline-block;
    height:15px;
    padding:0;
    width:54px;
    background:url(_img/permalink_knop.gif);
}
a#permabtn:hover {
    background:url(_img/permalink_knop_mouseover.gif);
}
#permalinkdiv {
    background-color: #ffffff;
    position: absolute;
    right: 15px;
    top: 22px;
    border: 1px solid #000000;
    padding: 2px;
    z-index: 5000;
}
.permalinkClose {
    position: absolute;
    right: 2px;
    top: 2px;
}

/* downloadlink control */
.downloadbtndiv {
    position: absolute;
    right: 15px;
    top: 4px;
    z-index: 1000;
}
.downloadbtn {
    border:1px solid black;
    cursor:pointer;
    display:inline-block;
    height:15px;
    padding:0;
    width:64px;
    background:url(_img/download_knop.gif);
}
a.downloadbtn:hover {
    background:url(_img/download_knop_mouseover.gif);
}
.downloaddiv {
    background-color: #ffffff;
    position: absolute;
    right: 15px;
    top: 22px;
    border: 1px solid #000000;
    padding: 12px 4px 4px 4px;
    z-index: 5000;
}
.downloaddiv a, .downloaddiv a:visited {
    text-decoration:none; color: #000000;
    background:url(data/arrow.gif) 0px -1px no-repeat;
    padding-left: 10px;
}
.downloaddiv a:hover, .downloaddiv a:active {
    background-color:#fdf6bb;
    text-decoration:none;
    color:#000000;
}
.geotoolInfoPanelCloseBox {
    background: url(_img/close_mini.gif) no-repeat;
    right: 2px;
    top: 2px;
}
/* DREMPELVRIJ PAGINA's */
#drempelvrijwrapper{
    height: 100%;
    width: 100%;
    overflow:auto;
}
#drempelvrijwrapper .roweven td { background: #C0C0C0; padding: 1px 2px 2px 5px; }
#drempelvrijwrapper .rowodd td { background: #FFFFFF; padding: 1px 2px 2px 5px; }
#drempelvrijwrapper .rowsimple td { background: #FFFFFF; padding: 1px 2px 2px 5px;}
#drempelvrijwrapper .rowlabel { color: #404040; }
#drempelvrijwrapper .rowlabelright { color: #404040; text-align:right; }

#wegbeheerdersdrempelvrij td, th, h2{
    text-align:left;
}

#waterstandendrempelvrij{
    text-align:left;
}
#waterstandendrempelvrij.img{
    float:left;
}