/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */

/* ############### RESET ALL ELEMENTS ############### */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,tr,th,td,table,img,address,caption,cite,code,dfn,em,i,strong,b,var,q,abbr,acronym{margin:0; padding:0;}




/* Tables still need 'cellspacing="0"' in the <table>-tag! */
table{border-collapse:collapse; border-spacing:0;}
td, th { border-style: none;text-align:left; vertical-align: top; }

fieldset,img,a img{border:0;}

address,caption,cite,code,dfn,em,strong,th,var{font-style:normal; font-weight:normal;}
ol,ul {list-style:none;}
caption{text-align:left; vertical-align: top;}
h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}
blockquote:before, blockquote:after,q:before,q:after{content:'';}/* Delete quote marks (") from <q>, <blockquote>. */
blockquote, q { quotes: "" ""; }
abbr,acronym {border:0;}



/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### BASICS.TALES.CSSFRAMEWORK ############### */

/*
contains:
	generic float-clearing magic
	bold & italic rules 
	
*/	

/* ############### FLOATING DIV WORKAROUNDS ############### */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    /*visibility: hidden;*/
	 visibility: collapse;
}
/* clearfix workaround for IE7 */
.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;} 
/* End hide from IE-mac */

#fixFloatingDiv, .fixFloatingDiv{
	clear: both !important;
	height: 1px !important;
	margin: 0 0 0px 0; 
	border: 0px solid #ea6346 !important;
	background-image: none !important;
	visibility: collapse;
	line-height: 1% !important; /* for IE: anders is deze div +- 20px hoog */
	}
	
	
/* ############### BOLD & ITALIC ############### */	
strong, b, .strong{ font-weight: bold;}
em, i, .italic{ font-style: italic;}


sup{
	line-height: 75%;
}
.noborder {	border: 0;}

/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### GRID.TALES.CSSFRAMEWORK ############### */

/*
contains:
	generic grid layouts
	
*/	



/* ############### BASIC BUILDING BLOCKS ############### */

/* structure:

	 -------pagewrapper------
   |                        |
   |    ----------------    |
   |    | langselection |   |
   |    ----------------    |
   |                        |
   |    ----------------    |
   |    |    header	   |   |
   |    ----------------    |	
   |                        |
   |    ----------------    |
   |    |    topnav	   |   |
   |    ----------------    |
   |                        |
   |    ----------------    |
   |    |    content	   |   |
   |    ----------------    |
   |                        |
   |    ----------------    |
   |    |    footer	   |   |
   |    ----------------    |
   |                        |
    ------------------------

*/


#pagewrapper{
	display: block;
	margin-left: auto;
	margin-right: auto;
	}
#languageselection{display: block;}
#header{display: block;}
#content{display: block;}
#footer{display: block;}
	
	
	

#sidenav{display: block;}	
#topnav{display: block;}

#crumbpath{
	
}
/* ############### 1 COLUMN LAYOUT ############### */
.oneCol .col1{
	display: block;}

/* ############### 2 COLUMN LAYOUT ############### */
.twoCols .col1{
	display: block;
	float: left;}
.twoCols .col2{
	display: block;
	float: left;
}

/* ############### 3 COLUMN LAYOUT ############### */
.threeCols .col1{
	display: block;
	float: left;}
.threeCols .col2{
	display: block;
	float: left;
}
.threeCols .col3{
	display: block;
	float: left;}


/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */

/* revision v.03.b : 14-02-2008 : explanation added */
/* revision v.03.a : 12-02-2008 : IE-versionnumbering with CC */

/* v0.3 includes only one update:
around the pagewrapper a couple of spans are written with IE Conditional Comments
These spans have no layout-influence, it only writes a span around #pagewrapper
which identifies the IE-version ran by the client.

f.e.: <span id="IE6">

This span is closed after the pagewrapper:
	<span id="IE6">
		<div id="pagewrapper">bla</div>
	</span>		


What this means:

1. no more need for an additional IE7-stylesheet
2. the !important - hack is not necessary anymore to target IE6.
	as in:
		.myrule
			{	bla: 7px !important; 
				bla: 5px;}

Instead, you can now write your code like this:

.mystuff{	bla: 7px;} -> targets all decent browsers
#IE6 .mystuff{ bla: 9px}
#IE7 .mystuff{ bla: 8px}

This makes your CSS-code and the exceptions for the various IE-flavours:
	-> clean
	-> easy to read and interprete
	-> fully W3C-compliant

version vectors supported 'till now:
#IE5
#IE55
#IE6
#IE7
#IE8

WWhy no #IE4? -> IE4 doesn't understand CC, therefore this selector has no use.
#IE8? IE8 isn't out yet, but will most likely work with CC


*/


/* ############### BASIC BUILDING BLOCKS ADDONS ############### */
#pagewrapper{
	/*width: 960px;*/
	width: 961px;
	padding: 0 10px 0 10px;
	/*background-image: url(../gfx/basics/background.page.gif);*/
	background-repeat: repeat-y;
	background-position: center;
}
#accessibility{
	display: block;
	height: 50px;
	width: 960px;
	text-align: right;
	background-image: url(../gfx/basics/background.accessibility.hc.gif);
	background-repeat: no-repeat;
}


#header{
	height: 110px;
	background-image: url(../gfx/basics/background.accessibility.hc.gif);
	background-repeat: no-repeat;
	background-position: 0 -50px;
	}
.splashpage #header{	
	background-image: none !important;
}
#content{
	width: 960px;
		background-image: url(../gfx/basics/background.content.hc.gif);
	background-repeat: repeat-y;
	padding-bottom: 20px;
	}
	
	
.splashpage #content{
	width: 960px;
	/*background-image: url(../gfx/basics/background.content.home.gif);*/
	background-image: none;
	background-repeat: repeat-y;
	padding-bottom: 20px;
	}
	
.splashpage #animlogo{
/*	margin-left: 423px;	*/	
	margin-left: 223px;	
	}
.splashpage #logotekst{
	margin-left: 223px;		
	}	
	
#footer{
	/*position: fixed;
	bottom: 0;*/
	width: 960px;
	height: 36px;
	margin-right: auto;
	margin-left: auto;
	padding: 0 10px 0 10px;
	/*background-color: #e9bb3e;
	background-image: url(../gfx/basics/background.footer.gif);*/
	background-repeat: repeat-x;
	}
	

.splashpage #footer{
	/*background-image: url(../gfx/homepage/bottom.footer.gif) !important;*/
	background-repeat: no-repeat;
	background-color: transparent !important;
	padding-top: 20px;
	background-position: 2px 0;
	
}

#topnav{
	background-image: url(../gfx/basics/background.topnav.hc.gif);
	background-repeat: repeat-x;
	background-position: top;
	width: 960px;
	height: 47px;
	padding-top:10px;
}

#IE6 #topnav,#IE76 #topnav{
	margin-top: 0;
}

#crumbpath{
	display: none;
}

/*.col1{	width: 200px;}
.col2{	width: 700px; }*//* = pagewrapper.width - col1.width */


/* ############### 1 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.oneCol#header .col1{
	/*background-color: #fff;*/
	color: #fff;
	height: 110px;
	width: 960px;
	/*background-image: url(../gfx/basics/background.header.gif);*/
	/*background-repeat: repeat-x;
	background-position: bottom;*/
	}
.oneCol#content .col1{
	
	width: 960px;}

/* ############### 2 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.twoCols#header .col1{
	background-color: #000;
	color: #fff;
	height: 150px;
	width: 200px;}
.twoCols#header .col2{
	background-color: green;
	color: #fff;
	height: 150px;
	width: 700px;}

.twoCols#content .col1{
	background-color: #ffcc00;
	width: 200px;}
.twoCols#content .col2{
	background-color: #fff;
	width: 700px;
}

/* minimum height for sidenav and text-block */
/* remember: if working with backgroundcolors or borders, 
you'll need to set a repeating background on 
.twoCols#content, since col1 doesn't know how
long col2 becomes (and vice-versa)
 !!!!!
*/
.twoCols#content .col1 {min-height: 200px;} /* mozilla + IE7 */
*html* .twoCols#content .col1 {height: 200px;} /* IE6 */

.twoCols#content .col2 {min-height: 200px;} /* mozilla + IE7 */
*html* .twoCols#content .col2 {height: 200px;} /* IE6 */



/* ############### 3 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.threeCols#header .col1{
	background-color: #000;
	color: #fff;
	height: 150px;
	width: 200px;}
.threeCols#header .col2{
	background-color: green;
	color: #fff;
	height: 150px;
	width: 500px;}
.threeCols#header .col3{
	background-color: orange;
	color: #fff;
	height: 150px;
	width: 200px;}

.threeCols#content .col1{
	width: 193px;
	/*background-image: url(../gfx/basics/background.sidenavig.jpg);*/
	background-repeat: no-repeat;
	background-position: 22px 0px;	
	}
.threeCols#content .col2{
	width: 527px;
	margin-left: 24px;
	}
.threeCols#content .col3{
	width: 168px;
	margin-left: 26px;
	}

/* minimum height for sidenav and text-block */
/* remember: if working with backgroundcolors or borders, 
you'll need to set a repeating background on 
.twoCols#content, since col1 doesn't know how
long col2 becomes (and vice-versa)
 !!!!!
*/
.threeCols#content .col1 {min-height: 425px;} /* mozilla + IE7 */
*html* .threeCols#content .col1 {height: 425px;} /* IE6 */

.threeCols#content .col2 {min-height: 200px;} /* mozilla + IE7 */
*html* .threeCols#content .col2 {height: 200px;} /* IE6 */


.threeCols#content .col3 {min-height: 200px;} /* mozilla + IE7 */
*html* .threeCols#content .col3 {height: 200px;} /* IE6 */


#logoblock{
	
	background-image: url(../gfx/basics/background.content.hc.gif);
	background-repeat: repeat-y;
}
.threeCols#logoblock .col1{
	width: 193px;
	text-align: center;
	}
/*.threeCols#content .col2{
	width: 527px;
	height: 1px;  fix for collapsing empty div in firefox 
	margin-left: 24px;
	}*/
.threeCols#logoblock .col3{
	width: 168px;
	margin-left: 577px;
	/*margin-left: 26px;*/
	text-align: right;
}

#IE6 .threeCols#logoblock .col3{
	margin-left: 385px;
}


/* ############### HEADER ADDONS ############### */
.twoCols#header .col1{ }
.twoCols#header .col2{ }
.twoCols#header .col1 a{
	display: block;
}




/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### FONTS.TALES.CSSFRAMEWORK ############### */

/*
contains:
	font rules - to be adjusted for each site that uses this framework
	DOES NOT INCLUDE NAVIGATION FONTS
*/	



/* ############### BASIC FONT SETTINGS ############### */
/* ############### ADJUST ON A AS-NEEDED-BASE ############### */
html, body{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: #fff;}
p{	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; margin-bottom: 1em; line-height: 135%;}

h1,h2,h3,h4,h5,h6{font-weight: bold; font-family: Arial, Helvetica, sans-serif; margin-bottom: 5px}	
h1{
	font-size: 125%;
	width: 517px;
	/*background-color: #e9bb3e;*/
	/*background-image: url(../gfx/basics/background.h1.gif);*/
	background-repeat: repeat-x;
	height: 21px;
	padding: 5px 5px 5px 5px;
	text-transform: uppercase;
	}
h2{ font-size: 115%; }
#content .col3 h2{
	font-size: 95%;
	letter-spacing: 0.11em;
	width: 158px;
	/*background-color: #e9bb3e;
	background-image: url(../gfx/basics/background.rechterkolom.h2.gif);*/
	background-repeat: repeat-x;
	height: 18px;
	padding: 7px 5px 5px 5px;
	text-transform: uppercase;
	}

#content .col3 h2 a:link, #content .col3 h2 a:visited{	color: #fff;}
#content .col3 h2 a:hover, #content .col3 h2 a:active{	color: yellow;}
h3{ font-size: 150%; margin-top: 20px}
h4{ font-size: 125%; margin-top: 20px}
h5{ font-size: 110%; margin-top: 20px}
h6{ font-size: 100%; margin-top: 20px}




td{}


#maincontent ul{	list-style: square;	margin: 10px 0 10px 40px;}
#maincontent ul li{	margin-bottom: 3px;}

.splashpage #maincontent p a{	text-transform: uppercase; text-decoration: none;	font-size: 1.4em;}
.splashpage #maincontent p a:link, .splashpage #maincontent p a:visited{	color: #fff !important;}
.splashpage #maincontent p a:hover, .splashpage #maincontent p a:active{	color: #C92944 !important;}
.splashpage #footer #disclaimer a:link, .splashpage #footer #disclaimer a:visited{		color: #fff;}
.splashpage #footer #disclaimer a:hover, .splashpage #footer #disclaimer a:active{		color: #C92944;}

/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### TOPNAVIGATION ############### */
#topnav ul{
	margin-top: -10px;
	margin-left: 780px;
}
#IE6 #topnav ul, #IE7 #topnav ul{
	/*margin-top: -10px;*/
}


#topnav ul li{
	/*display: inline;*/
	list-style: none;
	float: left;
	color: #fff;
	margin-right: -5px;
	background-image: url(../gfx/basics/divider.topnav.gif);
	background-repeat: no-repeat;
	background-position:  right 10px !important;
}

#topnav ul li.lastitem{
	background-image: none !important;
}

#topnav a, #topnav a.visited{
	color: #fff;
	display: inline-block;
	/*display: block;*/
	float: left;
	height: 18px;
	padding: 10px 10px 7px 10px;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 110%;
	font-family: Arial, Helvetica, sans-serif;
}

#topnav a:hover, #topnav a:active, #topnav a.selected{
	/*background-image: url(../gfx/basics/background.topnav.hover.gif);*/
	background-color: yellow;
	color: #000;
	background-repeat: repeat-x;
}


#topnav a#topnav_home:link, #topnav a#topnav_home:visited{
	width: 40px;
	height: 35px;
	text-indent: -2000px;
	padding: 0;	
	background-image: url(../gfx/basics/ico.home.gif);
	background-repeat: no-repeat;
	background-position: center;
	
}

#topnav a#topnav_home:hover, #topnav a#topnav_home:active, #topnav a#topnav_home.selected{
	background-image: url(../gfx/basics/ico.home.hover.gif);
	background-repeat: no-repeat;
}

/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### SIDENAVIGATION ############### */


#sidenav{}

/* ######################### LEVEL 1 ######################### */

#sidenav ul{
	/*background-color: aqua;*/
	margin-left: 22px;
	}

#sidenav ul li{
	background-image: url(../gfx/basics/divider.sidenav.level1.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	width: 168px;
}
#sidenav ul li.lastitem{
	background-image: none !important;}
#sidenav ul li a, #sidenav ul li a:link, #sidenav ul li a:visited{
	display: block;
	width: 135px;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
	font-size: 100%;
	padding: 8px 25px 8px 11px;
	background-image: url(../gfx/basics/sidenav.marker.of.gif);
	background-repeat: no-repeat;
	background-position: 155px 13px;
}

#sidenav ul li a:hover, #sidenav ul li a:active{
	color: #000 !important;
	background-image: url(../gfx/basics/sidenav.marker.on.gif) !important;
	background-color: yellow;
	}
#sidenav ul li a.selected{
	color: #000;
	/*background-image: url(../gfx/basics/sidenav.marker.on.gif) !important;*/
	background-color: yellow;
}
/* ######################### LEVEL 2A ######################### */
#sidenav ul li ul{
	margin-top: 0px;
	margin-bottom: 0px;
	padding-bottom: 5px;
}
#sidenav ul li ul li{	background-image: none; width: 148px;}
#sidenav ul li ul li a, #sidenav ul li ul li a:link, #sidenav ul li ul li a:visited{
	background-image: url(../gfx/basics/sidenav.marker.sublevel2b.gif) !important;
	background-repeat: no-repeat;
	background-position: 0px 7px;
	text-transform: none;
	width: 120px;
	font-size: 100% !important;
	padding: 2px 17px 2px 10px !important;}
#sidenav ul li ul li a:hover, #sidenav ul li ul li a:active, #sidenav ul li ul li a.selected{
	color: #008ed0 !important;}

	
	/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */


/* ############### SITESPECIFIC CSS - KVD ############### */
/* ############### SITEWIDE RULES - SITESPECIFIC ############### */
html, body{
	background-color: #000;
	}
p{ }
a{	}




/* ############### CRUMBPATH ADDONS ############### */
#crumbpath{
	color: #000 !important; /* crumbpathdividers color */
}
#crumbpath a:link, #crumbpath a:visited{
	text-decoration: none !important;
	color: red;}
#crumbpath a:hover, #crumbpath a:active{	color: silver;}

/* ############### ACCESSIBILITY ############### */
#skipstuff{
	display: block;
	width: 125px;
	float: left;
	margin-left: 488px;
	margin-right: 12px;
}

#IE6 #skipstuff{
	margin-left: 244px;
}
#contrastswitch{
	display: block;
	width: 105px;
	float: left;
	margin-right: 25px;
}

#fontsizeswitch{
	display: block;
	padding-top: 6px;
	width: 175px;
	float: left;
}
#IE6 #fontsizeswitch{
	width: 185px !important;
}
#skipstuff a{
	text-transform: uppercase;
	text-decoration: none;
	display: block;
	width: 125px;
	height: 22px;
	padding-top: 8px;
	font-weight: bold;
	/*font-size: 90%;*/
	font-size: 12px;
}
#contrastswitch a{
	text-transform: uppercase;
	text-decoration: none;
	display: block;
	width: 105px;
	height: 22px;
	padding-top: 8px;
	font-weight: bold;
	/*font-size: 90%;*/
	font-size: 12px;
}
#skipstuff a:link, #skipstuff a:visited, #contrastswitch a:link, #contrastswitch a:visited{
	color: #fff;}
#skipstuff a:hover, #skipstuff a:active, #contrastswitch a:hover, #contrastswitch a:active{
	color: #dd3e00;
}

#fontsizeswitch #fontblock{
	display: block;
	width: 50px;
	text-align: center;
	float: left;
	margin-top: -3px;
	font-size: 11px;
}

#fontsizeswitch #fontblockdescription{
	display: block;
	width: 110px;
	text-align: center;
	float: right;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 12px;
}
#IE6 #fontsizeswitch #fontblockdescription{
	margin-left: 0px;
}
#fontsizeswitch #fontblock a:link, #fontsizeswitch #fontblock a:visited{
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}
#fontsizeswitch #fontblock a:hover, #fontsizeswitch #fontblock a:active{	color: #DD3E00;}
#fontsizeswitch #fontblock a#small{ /*font-size: 100%;*/ 
	font-size: 12px;
	}
#fontsizeswitch #fontblock a#medium{ /*font-size: 120%;*/
	font-size: 15px;}
#fontsizeswitch #fontblock a#large{ /*font-size: 140%;*/
	font-size: 18px;}#fontsizeswitch #fontblock a.selected{
	text-decoration: underline !important;
}

/* ############### HEADER ############### */
#logo{
	margin: 18px 0 0 22px;
	float: left;
}


#tabnav{
	display: block;
	width: 440px;
	height: 100px;
	padding-top: 8px;
	margin-left: 520px;
	/*background-color: orange;*/
}

#tabnav a{
	display: block;
	float: left;
	height: 60px;
	padding-top: 41px;
	/*background-color: Silver;*/
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	border-right: 1px solid #d6d6d6;
	font-weight: bold;
	background-image: url(../gfx/basics/background.tabnav.gif);
	background-repeat: no-repeat;
	background-position: center bottom;
}

#tabnav a:link, #tabnav a:visited{
	color: #fff;
}

#tabnav a:hover, #tabnav a:active{
	color: yellow;
	background-image: url(../gfx/basics/background.tabnav.hover.gif);
}

#tabnav a#tabnav_hydro{
	
	width: 140px;
	}
#tabnav a#tabnav_havens{
	width: 162px;
}
#tabnav a#tabnav_kustbeheer{
	border-right: 0;
	width: 135px;
}
#IE6 #tabnav a#tabnav_kustbeheer{
	margin-right: -3px; /* fix for IE6 repeating character bug */
}

/* ############### CONTENTBLOCK ############### */
.date{
	font-style: italic;
	margin-bottom: 0em;
}
#nextpage{	color: #fff; margin-bottom: 2.5em;}
#nextpage a:link{	color: #fff;}
#nextpage a:hover, #nextpage a:active {	color: yellow !important;}
#nextpage a:visited{	color: #fff;}

#peoplelist{
	/*background-image: url(../gfx/basics/background.peoplelist.gif);*/
	background-repeat: repeat-y;
	margin: 15px 0 15px 0;
}
#peoplelist .row{
	margin-bottom: 10px;
}
#peoplelist .persoon{
	display: block;
	width: 200px;
	float: left;
}

#peoplelist .persoon.left{
	margin-right: 65px;
}

#peoplelist .persoon img{
	border: 1px solid #0079b1 ;
	margin-bottom: 1em;
}
#peoplelist .persoon h2{
	color: #fff !important;
	font-size: 1.25em !important;
	font-weight: normal !important;
}

#peoplelist .persoon p{
	text-align: left !important;
	font-size: 0.95em;
}
/* ############### COL 3 ############### */
.col3content{
	display: block;
	width: 168px;
	margin-top: -6px;
	/*background-image: url(../gfx/basics/background.col3content.gif);*/
	background-repeat: repeat-y;
	text-align: right;
}

.col3content span{
	display: block;
	padding: 0;
	font-size: 90%;
	line-height: 135%;
}
.col3content .nieuwsbericht:link, .col3content .nieuwsbericht:visited{
	display: block;
	padding: 10px 5px 5px 0;
	background-image: url(../gfx/basics/divider.col3.gif);
	background-repeat: repeat-x;
	text-decoration: none;
}
.col3content .nieuwsbericht:hover, .col3content .nieuwsbericht:active{
	background-color: yellow;
}
.col3content .nieuwsbericht:hover span.datum, .col3content .nieuwsbericht:active span.datum, 
.col3content .nieuwsbericht:hover span.nieuwsintro, .col3content .nieuwsbericht:active span.nieuwsintro, 
.col3content .nieuwsbericht:hover span.leesmeer, .col3content .nieuwsbericht:active span.leesmeer{
	color: #000;
}

.col3content .nieuwsbericht span.datum{
	color: #fff;
	font-weight: bold;
	font-size: 100%;
	margin-bottom: 0px;
}
.col3content span.nieuwsintro{ margin: 0 0 5px 0; color: #fff;}
.col3content span.leesmeer{
	color: #fff;
	text-decoration: underline;
}

.logos{
	display: block;
	margin: 50px 0 20px 0;
	text-align: right;
}

/* ############### FOOTER ############### */
#footer p{
	text-align: center;
	padding-top: 7px;
	font-weight: bold;
}
#footer p a:link, #footer p a:visited{	color: #fff;}
#footer p a:hover, #footer p a:active{	color: yellow;}


/* ############### IMAGEROTATOR ############### */
.imagerotator{
	margin-top: -5px;
	margin-bottom: 15px;
}

#maincontent p{
	text-align: justify;
}



/* ############### FORM ############### */
.formulier{
	margin-bottom: 30px;
}
.formulier div{
	display: block;
	margin-bottom: 1em;
	/*background-color: Orange;*/
}

.formulier label{
	display: block;
	float: left;
	width: 220px;
	margin-bottom: 1em;
	/*background-color: Orange;*/
}

.formulier input{
}

.nojustify{text-align:left !important;}

/* ############### SPLASHPAGE ############### */


.splashpage #maincontent p{
	text-align: center !important;
	margin-top: 20px;
}

.splashpage #footer p{
	font-weight: normal !important;	
}
.splashpage #footer a{
	text-decoration: none;
	font-weight: normal !important;
}


/* ############### ADDONS ############### */
.threeCols#logoblock .col1 p{
	margin-top: 131px;
	text-align:center !important;
	
	}
#afdelingkustlink{	
	margin-top: 7px;
}

#afdelingkustlink a{
	background-image: url(../gfx/basics/arrow.left.gif);
	background-repeat: no-repeat;
	background-position: 3px 2px;
	padding-left: 17px;
}
@media all and (min-width: 0px) { /* for Safari and all webkit-based browsers */
             body:not(:root:root) #afdelingkustlink a { 
			background-position: 3px -3px !important; }
    }

#afdelingkustlink a:hover, #afdelingkustlink a:active{
	background-image: url(../gfx/basics/arrow.left.hover.gif);
}

a:link, a:visited{
	color: yellow;
}

a:hover, a:active{
	color: orange;
}

#logo{
	margin: 9px 0 0 0;
	/*border: 1px solid red;*/
}




#toegankelijkheid{
	display: block;
	margin: 20px 0 10px 0;
	text-align: center;
}