/***************************
	MAIN STRUCTURE
	
	
	ROOD: 	#b30938
	BLAUW: 	#0a99cf
/**************************/

	body {
		font: 80% arial;
		background: #c90e31 url(images/body-bg.gif) repeat-x;
		color: #000;
	}
	
	#container {
		width: 920px;
		background: #fff;
		margin: 20px auto;
		margin-bottom: 5px;
		position: relative;
	}
	#top {
		height: 260px;
		margin-bottom: 10px;
		background: url(images/top-bg.gif) no-repeat;
	}
	#logo {
		margin: 5px;
	}
	
	#header {
		width: 100%;
		height: 115px;
		top: 78px;
		left: 0px;
		position: absolute;
		background: #0b9393;
	}

	#content {
		float: right;
		width: 660px;
		margin-right: 10px;
		overflow: hidden;
	}

	#navigation, #content, #extra  {
		min-height: 400px;
		height: auto!important;
		height: 400px;
	}
	#navigation,#subcontent {
		width: 250px;
		/*background: #eee;*/
	}
	#extra {
		width: 240px;
		/*background: #ccc;*/
	}

	#footer {
		width: 920px;
		margin: 0 auto;
		margin-bottom: 20px;
		font-size: .8em;
	}
	#footer ul {
		float: right;
		margin-top: 10px;
		margin-right: 4px;
	}
	#footer li {
		list-style: none;
		color: #fff;
		background: none;
		float: left;
		padding-left: 10px;
		border-left: 1px solid #fff;
		margin-left: 10px;
	}
	#footer li a {
		color: #fff;
	}

	
/***************************
	NAVIGATION
/**************************/
	#logo {
		float: left;
	}
	#img-livechat {
		float: right;
		margin: 10px 10px 0 0;
	}
	
	#mainnavigation {
		position: absolute;
		left: 0;
		top: 196px;
		margin: 0 10px;
		background: #054343;
		height: 33px;
		width: 900px;
	}
	#mainnavigation li {
		float: left;
		padding: 0 .7em;
		padding-top: 5px;
		list-style: none;
		position: relative;
		margin-left: 12px;
		margin-right: 12px;
		line-height: normal;
		background: none;
	}
	#mainnavigation li.last {
		margin-right: 0;
	}
	#mainnavigation li a {
		font-weight: bold;
		display: block;
		overflow: hidden;
		color: #fff;
		text-decoration: none;
		font-size: 1.3em;
		font-family: arial;
	}
	#mainnavigation li a:hover, #mainnavigation li a:focus, #mainnavigation li a:active {
		text-decoration: underline;
	}
	#mainnavigation li a span {
		/*position: absolute;
		left: -100em;*/
	}
	#mainnavigation li li {
		position: absolute;
		left: -100em;
	}
	#breadcrumbs {
		position: absolute;
		top: 228px;
		left:0;
		padding: 4px 0;
		margin: 0 10px;
		width: 900px;
		border-bottom: 1px dotted #aaa;
		font-size: .85em;
		text-transform: lowercase;
	}
	#breadcrumbs span {
		float: left;
		padding: 0 5px 0 20px;
		color: #9d9d9d;
		font-weight: bold;
	}
	#breadcrumbs ol {
		margin-left: 20px;
		margin-bottom: 0;
	}
	
	#breadcrumbs li {
		list-style: none;
		margin: 0!important;
		padding: 0;
		display: inline;
		padding-right: 12px!important;
		margin-right: 5px !important;
		background: none;
		color: #9d9d9d;
		font-weight: bold;
		background: url(images/bc-bullet.gif) no-repeat right center;
		line-height: normal;
	}
	#breadcrumbs li a {color: #9d9d9d; display:inline-block;}
	#breadcrumbs li.last {
		background: none;
		padding-right: 0;
	}	
	
	#subnavigation {
		font-size: 1.1em;	
	}
	#subnavigation h3 {
		position: absolute;
		left: -200em;
	}
	#subnavigation li {
		list-style: none;
		list-style-image: none;
		list-style-type: none;
		margin: 0;
		padding: .5em 0;
		padding-left: 20px;
		border-bottom: 1px dashed #0B9393;
		font-weight: bold;
		line-height: normal;
		line-height: 100%;
		background: none;
	}
	#subnavigation li a {
		text-decoration: none;
	}
	#subnavigation li a:hover {
		color: #054343;
	}
	
	/*
	#mainnavigation a.nav-home { background: url(images/nav_home.gif); width: 66px; }
	#mainnavigation a.nav-about { background: url(images/nav_about.gif); width: 120px; }
	#mainnavigation a.nav-thema { background: url(images/nav_thema.gif); width: 91px; }
	#mainnavigation a.nav-agenda { background: url(images/nav_agenda.gif); width: 92px; }
	#mainnavigation a.nav-help { background: url(images/nav_help.gif); width: 119px; }
	#mainnavigation a.nav-contact { background: url(images/nav_contact.gif); width: 87px; }
	
	#mainnavigation ul ul {
		position: absolute;
		background: #fff;
		z-index: 10;
		padding: 10px;
		left: -100em;
	}
	#mainnavigation li.hover ul {
		left: 0;
	}
	#mainnavigation li li {
		margin: 0;
		padding: .2em 0;
	}
	#mainnavigation li li a {
		height: inherit;
	}
	#mainnavigation li li a span{
		display: block;
		position: relative;
		left: 0;
	}
	*/
	
	
	

	
/***************************
	COMMON STYLES
/**************************/	
	.invisible, .access {
		position: absolute;
		left: -200em;
	}
	object, a, embed { outline: none; }
	a {
		color: #0b9393;
		text-decoration: underline;
	}
	a:hover, a:focus, a:active {
		text-decoration: none;
	}
	p {
		font-weight: normal;
		margin-bottom: 1em;
		line-height: 160%;
	}
	strong {
		font-weight: bold;
	}
	img.left {
		float: left;
		margin: 0 10px 10px 0;
	}
	h1, h2, h3, h4 { 
		font-weight: bold; 
		color: #C90E31;
	}
	h1 {
		text-transform: uppercase;
	}
	h1,h2 {
		font-size: 1.3em;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.clear {
		clear:both;
		width: 100%;
		height: 1px;
		display: block;
	}	
	ul, ol {
		margin-bottom: 10px;
	}
	ul li {
		list-style: none;
		background: url( images/bullet.gif ) no-repeat 0 4px;
		margin-left: 1em;
		padding-left: 20px;
		line-height: 160%;
	}
	ol li {
		list-style: decimal;
		margin-left: 2em;
	}
	li a {
		font-weight: bold;
	}
	form li {
		list-style: none;
		margin: 0;
	}
	img.grijs {
		border: 2px solid #eee; 
		padding: 6px;
		margin: 0 10px 10px 0;
	}
	table {
		margin-bottom: 1em;
	}
	table td, table th {
		border: 1px solid #000;
		padding: .2em .5em;
		vertical-align:top;
	}
	#subcontent .youtube object, 
	#subcontent .youtube embed { width: 400px; }
	#subcontent  object, 
	#subcontent  embed { width: 220px; height: 200px; }	
/***************************
	COMPONENT STYLES
/**************************/		
	.block {
		margin: 15px;
		margin-top:  0;
		background: #fff;
	}
	.block .block {
		margin: 0 !important;
		margin-bottom: 10px !important;
	}
	.content {
		padding: 5px;
	}
	

	
/*	
	.newslist {
	
	}
	.newslist .item {
		margin-bottom: 5px;
		clear: both;
	}
	.newslist .item .date {
		float: left;
		width: 50px;
		font-weight: bold;
		color: #b30938;
	}
	.newslist .item .description {
		display: block;
		width: 350px;
		float: left;
	}
	.newslist .item p { margin: 0; }
*/	
	
	.agenda #header { background-image: url(images/subkop-agenda.gif); }
	.colofon #header { background-image: url(images/subkop-colofon.gif); }
	.contact #header { background-image: url(images/subkop-contact.gif); }
	.jongereninfo #header { background-image: url(images/subkop-jongereninfo.gif); }
	.sitemap #header { background-image: url(images/subkop-sitemap.gif); }
	.wie-helpt-mij #header { background-image: url(images/subkop-wiehelptmij.gif); }
	.zoeken #header { background-image: url(images/subkop-zoeken.gif); }
	.jongerenwerk #header { background-image: url(images/subkop-jongerenwerk.gif); }

	.gezondheid #header { background-image: url(images/thema-gezondheid.gif); }
	.geld #header { background-image: url(images/thema-geld.gif); }
	.maatschappij #header { background-image: url(images/thema-maatschappij.gif); }
	.school #header { background-image: url(images/thema-school.gif); }
	.werk #header { background-image: url(images/thema-werk.gif); }
	.sex #header { background-image: url(images/thema-sex.gif); }
	.verslaving #header { background-image: url(images/thema-verslaving.gif); }
	.geld #header { background-image: url(images/thema-geld.gif); }
	.wonen #header { background-image: url(images/thema-wonen.gif); }
	.recht #header { background-image: url(images/thema-rechit.gif); }
	.criminaliteit #header { background-image: url(images/thema-criminaliteit.gif); }
	.gemeente #header { background-image: url(images/thema-gemeente.gif); }
	
	
	

