@import url('./reset.css');
@import url('./text.css');

/* temporary grey coloring for layout purposes */

.tmp { background: gray; }

/* end temporary grey coloring */

html { overflow: scroll; }

html, body { margin: 0; padding: 0; background: black; color: white; }

img { border: none; margin: 0; padding: 0; }

#wrapper { width: 1000px; margin: 0 auto 0 auto; padding: 0; background: url('./images/midden.jpg') repeat-y scroll center top; color: black; }

#header, #content, #footer {
	width: 886px;
	margin: 0;
}

#header {
	height: 117px;
	padding: 57px 57px 0 57px;
	background: url('./images/header.jpg') no-repeat scroll center top;
	position: relative;
}

	a#logo {
		float: left;
		width: 104px;
		height: 117px;
		text-indent: -9999px;
		background: url('./images/logo.formaat.jpg') no-repeat scroll center center;
	}

	#search {
		position: absolute;
		top: 32px;
		/*right: 135px;*/
		right: 215px;
	}

	#search span.label {
		font-weight: bold;
	}

	#lang {
		position: absolute;
		top: 34px;
		/*right: 57px;*/
		right: 137px;
	}

	#login {
		position: absolute;
		top: 34px;
		right: 57px;

		
	}

	#banner1 {
		float: left;
		width: 330px;
		height: 76px;
		margin: 0 18px 0 0;
		position: relative;
	}

		#banner1 a {}
		#banner1 img, #banner1 a img {
			width: 330px;
			height: 76px;
			position: absolute;
			top: 0;
			left: 0;
		}

	#banner2 {
		float: left;
		width: 434px;
		height: 76px;
		position: relative;
	}

		#banner2 a {}
		#banner2 img, #banner2 a img {
			width: 434px;
			height: 76px;
			position: absolute;
			top: 0;
			left: 0;
		}

	ul#nav {
		float: left;
		width: 782px;
		height: 41px;
		margin: 0 0 0 0;
		list-style: none;
		background: url('./images/navigatie.jpg') no-repeat scroll center center;
	}

		ul#nav li {
			float: left;
			height: 41px;
			margin: 0;
			padding: 0;
		}

			/*li.nieuws, li.nieuws a { width: 88px; }
			li.formaat, li.formaat a { width: 130px; }
			li.vorming, li.vorming a { width: 130px; }
			li.producten, li.producten a { width: 144px; }
			li.agenda, li.agenda a { width: 86px; }
			li.jeugdhuizen, li.jeugdhuizen a { width: 124px; }
			li.themas, li.themas a { width: 80px; }*/

			li.informatie, li.informatie a { width: 133px; }
			li.ondersteuning, li.ondersteuning a { width: 169px; }
			li.vorming, li.vorming a { width: 113px; }
			li.jeugdhuizen, li.jeugdhuizen a { width: 150px; }
			li.nieuws, li.nieuws a { width: 105px; }
			li.formaat, li.formaat a { width: 112px; }

		ul#nav li a {
			display: block;
			height: 41px;
			text-indent: -9999px;
		}

			/*li.nieuws a:hover, li.nieuws a.current { background: url('./images/nav.select.jpg') no-repeat scroll 0 -31px; }
			li.formaat a:hover, li.formaat a.current { background: url('./images/nav.select.jpg') no-repeat scroll -88px -31px; }
			li.vorming a:hover, li.vorming a.current { background: url('./images/nav.select.jpg') no-repeat scroll -218px -31px; }
			li.producten a:hover, li.producten a.current { background: url('./images/nav.select.jpg') no-repeat scroll -348px -31px; }
			li.agenda a:hover, li.agenda a.current { background: url('./images/nav.select.jpg') no-repeat scroll -492px -31px; }
			li.jeugdhuizen a:hover, li.jeugdhuizen a.current { background: url('./images/nav.select.jpg') no-repeat scroll -578px -31px; }
			li.themas a:hover, li.themas a.current { background: url('./images/nav.select.jpg') no-repeat scroll -702px -31px; }*/

			li.informatie a:hover, li.informatie a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll 0 ; }
			li.ondersteuning a:hover, li.ondersteuning a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll -133px ; }
			li.vorming a:hover, li.vorming a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll -302px ; }
			li.jeugdhuizen a:hover, li.jeugdhuizen a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll -415px ; }
			li.nieuws a:hover, li.nieuws a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll -565px ; }
			li.formaat a:hover, li.formaat a.current { background: url('./images/navigatie_roll.jpg') no-repeat scroll -670px ; }



#content {
	padding: 12px 0 0 57px;
}

	#content #left {
		float: left;
		width: 208px;
		margin: 0 18px 0 0;
	}

		#baseline {
			float: left;
			width: 208px;
			height: 156px;
			margin: 0 18px 18px 0;
		}
		
		#promobanner3 {
			float: left;
			width: 208px;
			max-height: 86px;
			margin: 0 18px 18px 0;
		}
		
		#promobanner4 {
			float:left;
			width: 208px;
			height: 156px;
			margin: 0 18px 0 0;
		}
		
		#deadlines {
			float:left;
			width: 208px;
			height:86px;
			margin: 0 18px 18px 0;
			background-color: #ECECEC;
		}
		
		#navigatie {
			float: left;
			width: 208px;
			margin: 0 0 18px 0;
		}

		#navigatie ul#leftnav { list-style: none; }
		#navigatie ul#leftnav span { display: block; padding: 0 8px; }
		#navigatie ul#leftnav a, #navigatie ul#leftnav a:link { display: block; color: #000; text-decoration: none; padding: 4px 0 4px 8px; }
		#navigatie ul#leftnav a:hover, #navigatie ul#leftnav a.selected { background: #f89828; }
		#navigatie ul#leftnav a.head0 { background: #e51837; color: #fff; }
		#navigatie ul#leftnav a.head0, #navigatie ul#leftnav a.head1, #navigatie ul#leftnav a.head2, #navigatie ul#leftnav a.head3 { font-weight: bold; }
		#navigatie ul#leftnav a, #navigatie ul#leftnav a:link { color: #000; }
		#navigatie ul#leftnav li { margin: 0; }
		#navigatie ul#leftnav li span { }
		#navigatie ul#leftnav li a, #navigatie ul#leftnav li a:link { }
		#navigatie ul#leftnav li ul { list-style: none; border-left: 1px solid #f89828; }
		#navigatie ul#leftnav li ul { }
		#navigatie ul#leftnav li ul a, #navigatie ul#leftnav li ul a:link { color: #000; }
		#navigatie ul#leftnav li ul li { margin: 0; }
		#navigatie ul#leftnav li ul li span {  }
		#navigatie ul#leftnav li ul li a, #navigatie ul#leftnav li ul li a:link { }
		#navigatie ul#leftnav li ul li ul { list-style: none; margin: 0 0 0 8px; border-left: 1px solid #f89828; }
		#navigatie ul#leftnav li ul li ul {  }
		#navigatie ul#leftnav li ul li ul li { margin: 0; }
		#navigatie ul#leftnav li ul li ul li span {  }
		#navigatie ul#leftnav li ul li ul li a, #navigatie ul#leftnav li ul li ul li a:link { color: #000; }
		#navigatie ul#leftnav li ul li ul li ul { list-style: none; margin: 0 0 0 8px; border-left: 1px solid #f89828; }
		#navigatie ul#leftnav li ul li ul li ul {  }
		#navigatie ul#leftnav li ul li ul li ul li { margin: 0; }
		#navigatie ul#leftnav li ul li ul li ul li span {  }
		#navigatie ul#leftnav li ul li ul li ul li a, #navigatie ul#leftnav li ul li ul li ul li a:link { color: #000; }

	#content #center {
		float: left;
		width: 434px;
		margin: 0 18px 0 0;
	}

		.centercontent { clear: both; margin: 0 0 8px 0;  }
		.centercontent .fotohoofdbericht {float :left; width: 156px; height: 156px; margin: 0 18px 18px 0;}
		.centercontent .contentfoto { float: left; width: 86px; margin: 0 18px 18px 0; }
		.centercontent .contentfoto img { width: 86px; }
		.centercontent .contenttext { float: left; }
		.centercontent .contenttext.hoofdbericht {width: 260px;}
		.centercontent .contenttext.type1 { width: 330px; }
		.centercontent .contenttext.type2 { width: 434px; }
		.centercontent .contenttext p { clear: both; }
		.centercontent .contenttext h1, .centercontent .contenttext h2, .centercontent .contenttext h3, .centercontent .contenttext h4, .centercontent .contenttext h5, .centercontent .contenttext h6 { clear: none; }
		.centercontent .contenttext span.contenttextdate { float: right; color: #999999; margin-bottom: 11px; }
		.centercontent .contenttext a.contenttextmorelink { float: right; }

		.centercontent .contenttext div.menufloatrightul {
			float: right;
			margin: 0px 10px 5px 10px;
			padding: 5px 10px 5px 0px;
			background-color: #dddddd;
			border: 2px dotted #000000;
		}

		.centercontent .contenttext div.menufloatrightul a, .centercontent .contenttext div.menufloatrightul a:link, .centercontent .contenttext div.menufloatrightul a:visited {
			color: #e51837;
			text-decoration: underline;
		}

		.centercontent .contenttext div.menufloatrightul a:hover {
			color: #f89828;
		}

	#content #right {
		float: left;
		width: 208px;
	}
	
		#fotorechthoek {
			float: left;
			width: 208px;
			height: 86px;
			margin: 0 0 1px 0;
		}
		
		#indekijker {
			float:left;
			height: 260px;
			margin: 0 0 18px 0;
			background-color: #ECECEC;
			padding:0 0.5em 0 0.5em;
			
		}

		#agenda {
			float: left;
			width: 208px;
			height: 232px;
			/*margin: 0 0 18px 0;*/
		}
		#agenda ul#rightnav { list-style: none; margin: 0; }
		#agenda ul#rightnav li { margin: 0; }
		#agenda ul#rightnav li span.small { font-size: .75em; }

	.foto, .fotoright {
		float: left;
		width: 208px;
		margin: 0 0 18px 0;
	}

	.fotoright { margin-left: 18px; }

		.foto img, .fotoright img,
		#content #center .foto img, #content #center .fotoright img,
		#content #left .foto img,
		#content #right .foto img { width: 208px; }

	#content #pagination {
		clear: both;
		padding: 15px 0 15px 0;
		text-align: center;
	}

	#content #subfooter {
		border-top: 1px dashed #000000;
		border-bottom: 1px dashed #000000;
		clear: both;
		margin: 0 0 15px 0;
		padding: 5px 0 5px 0;
		text-align: center;
	}

#footer {
	clear: both;
	height: 20px;
	padding: 58px 57px 20px 57px;
	color: gray;
	text-align: center;
	background: black url('./images/footer.jpg') no-repeat scroll center top;
}


/* Forms
----------------------------------------------------------------------------------------------------*/

input, textarea {
	padding: 2px 5px;
	border: 1px solid #D0D0D0;
	font-family: Arial, sans-serif;
	font-size: 8pt;
	font-weight: bold;
	color: #6B6B6B;
}

input[type='checkbox'], input[type='button'], input[type='submit'], input[type='reset'], input[type='image'], input[type='file'] {
	border: none;
	padding: 3px 5px;
}

input[type='button'], input[type='submit'], input[type='reset'], input[type='image'], input[type='file'] {
	background-color: #D0D0D0;
}

input[type='button']:hover, input[type='submit']:hover, input[type='reset']:hover, input[type='image']:hover, input[type='file']:hover {
	background-color: #D0D0D0;
	cursor: pointer;
}

select {
	padding: 2px 0px 2px 0px;
	border: 1px solid #D0D0D0;
	font-family: Arial, sans-serif;
	font-size: 8pt;
	font-weight: bold;
	color: #6B6B6B;
}

a.button:link, a.button:visited, a.button:hover, a.button:active {
	padding: 3px 5px;
	border: 1px solid #D0D0D0;
	font-family: Arial, sans-serif;
	font-size: 8pt;
	font-weight: bold;
	color: #6B6B6B;
	background-color: #D0D0D0;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
}


/* Tables
----------------------------------------------------------------------------------------------------*/

table {
	margin-bottom: 1.5em;
	border-collapse: collapse;
	text-align: left;
	border: none;
	color: #606060;
}

	table.noborder {
		border: none;
	}

	table.border {
		border: 1px solid #606060;
	}

	table.border td {
		border: 1px solid #606060;
	}

	table.border th {
		border: 1px solid #606060;
	}

	table th {
		text-align: left;
		vertical-align: top;
		font-weight: bold;
		padding: 0.3em;
	}

	table td {
		text-align: left;
		vertical-align: top;
		padding: 0.3em;
		border: none;
	}

	table.border td {
		border: 1px solid #606060;
	}

	table.tinymce_textarea td {
		padding: 0;
	}

	table tr {
		position: relative;
	}

	table tr.rowH {
		background-color: #FD8307;
		color: #fff;
	}

	table tr.rowA {
		background-color: #ddd;
		color: inherit;
	}

	table tr.rowB {
		background-color: #fff;
		color: inherit;
	}

	table th.date, table td.date {
		padding-left: 32px;
	}

		table td h4 {
			height: 100%;
			font-weight: bold;
			padding: 0;
			margin: 0;
		}

	table td {
		background-color: none;
	}


/* Custom
----------------------------------------------------------------------------------------------------*/

.red { color: #E51837; }
.inheritlink a, .inheritlink a:link { color: inherit; text-decoration: inherit; }
.inheritlink a:hover, .inheritlink a.selected { color: inherit; }
.orange { color: #FD8307; }
.gray { color: #999999; }
.darkgray { color: #666666; }
.ruler { padding: 1em 0 1em 0; background: #fff; border-bottom: 2px dotted #999; }
.noborder { border: none; }
.smaller { font-size: 0.8em; }
.floatright { float: right; }
.borderdotted { padding: 5px; border: 2px dotted #000000; }


.message {
/*	border: 1px solid #999999;*/
	padding: 5px;
	color: #FFFFFF;
	background-color: #F89828;
	font-weight: bold;
}

.error {
/*	border: 1px solid #999999;*/
	padding: 5px;
	color: #FFFFFF;
	background-color: #E51837;
	font-weight: bold;
}


/* Clear floated elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://www.positioniseverything.net/easyclearing.html */

.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	visibility: hidden;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}