/* --------------------------------------
Main Style Sheet

version: 1.0
modern version browsers
validation: css 2.1

author: Stephan Bakker
website: www.stephanbakker.nl
mail: info@stephanbakker.nl

colors:
groen:#01B0A8
headers: #036
----------------------------------------- */

body{
	color:#000;
	font:62.5%/160% verdana,helvetica,sans-serif;
	background:#fff url(../images/backgrounds/bg_gradients.jpg) repeat-y center top;
	text-align:center;
	margin:0;
	padding:0;
}
#Wrapper{
	float: left;
	width: 100%;
	background: url(../images/backgrounds/bg_circles.jpg) no-repeat center top;
}
#Container{
	position:relative;/* prepare for nav */
	width:898px;
	margin:0 auto 0 auto;
	text-align:left;
	background:url(../images/logotekst.gif) no-repeat 719px 10px;
	z-index:1;
	overflow: hidden; /*IE creates extra padding*/
}

/* ---- main styles ---------------------------------------------------*/

ul{
	margin:0;
	padding:0.8em 0 1em 0;
}
	li ul{
		padding:0;
		margin:0;
	}
li{
	list-style:none;
	line-height:160%;
	margin:0 7px 0 7px;
}
	li a{
		margin:0;
		padding:0;
	}
fieldset, img, form{
	margin:0;
	padding:0;
	border:0;
}
input, textarea, select{
	vertical-align:top;
	line-height:110%;
	margin:0;
	padding:0.1em 0.2em;
	border:1px solid;
	border-color:#dcdcdc #7c7c7c #7c7c7c #dcdcdc;
}
input.submit{
	padding:0.2em;
}



/* ---------------------------typo ------------------------------------ */


a{
	color:#000;
	text-decoration:none;
}

p, h1, h2, h3, h4{
	padding:0 8px;
	margin:0;
}
h2{
	color:#036;
}
h3{
	color:#fff;
	font-weight:normal;
	font-size:1.1em;
	padding:0.2em 8px;
	margin:0;
	background:#036;
}
p.intro em{
	font-weight:bold;
	font-style:normal;
}
p.info{
	margin:0.5em 0;
	padding:0.5em 0;
}


/* ========================================================= modules =======================================================*/




/* ----------------------------------------------------- =Branding */

#Branding{
	float:left;
	width:898px;
	padding:0;
	margin:0;
}
	#Branding #Logo{
		
		float:left;
		width:713px;
		padding-left: 1px;
		overflow:hidden;
	}
	 	/* =Catcher */

#Catcher{
	
	/*hide voor redisign*/
	
	display: none;
	float:right;
	color:#fff;
	font-size:1.4em;
	width:184px;
	margin: 0 ;
	padding: 0;
	background:transparent;
}	
	#Catcher h2{
		color:#fff;
		font-size:1em;
		text-transform:uppercase;
		padding:4px;
		margin:4px 4px 0 4px;
		background:#01B0A8;
	}
	#Catcher p{
		color:#fff;
		font-size:0.9em;
		padding:4px;
		margin:0 4px 4px 4px;
		height:6em;
		background:#01B0A8;
	}
	
	/* end display:none */

/* ----------------------------------------------------- =Nav_main */

	#Nav_main{
		float:left;
		position:relative;
		top:-80px;
		width:700px;
		height:7em;
		padding:0 180px 0 8px;
	}
		#Nav_main ul{
		}
		#Nav_main li{
			display:inline;
			line-height:2.5em;
			padding:0;
			margin:0;
		}
		#Nav_main a{
			font-size:1.5em;
			margin:0 4px 0 0;
			border-bottom:2px solid #01B0A8;
		}
		#Nav_main li span{
			display:none;
		}

/* ------------------------------------------------- =Content_main */

#Content_main{
	float:left;
	clear:both;
	width:714px;
	padding:0;
	margin-top:-72px;
	font-size:1.1em;
}
.pageturner{
	text-align:center;
	padding:4px 0 0 0;
	margin:0;
}
	#Content_main h2{
		font-size:1em;
		font-weight:normal;
		color:#01B0A8;
		padding:2em 0 0 0 ;
	}
	#Content_main h3{
		float:left;
		text-transform:uppercase;
		font-size:1.3em;
		font-weight:bold;
		color:#000;
		padding:0.4em 30px 0.6em 0;
		margin:0;
		background:#fff url(../images/backgrounds/bg_category.gif) no-repeat 100% 60%;
	}
		#Content_main h4{
			clear:both;
			font-size:1.3em;
			font-weight:bold;
			color:#000;
			padding:0.4em 30px 0.6em 0;
			margin:0;
		}
		#Content_main h3 a{
			color:#000;
			text-decoration:none;
		}
	.entry,
	.entrybox{
		clear:left;
		float:left;
		display:inline; /*margin bug IE */
		width:698px;
		padding:0 0 1em 0;
		margin:0 8px;
		border-bottom:2px solid #01B0A8;
	}
	.entry h1,
	.entry h2,
	.entry h3,
	.entry h4,
	.entry h5,
	.entry h6{
		padding:0;
		line-height:1em;
	}
	.entry span.imgbox{
		float:right;
		clear:left;
		text-align:right;
		padding:0 8px 1.5em 0;
		margin:0;
	}
	.entry img{
		margin:0 0 0 8px;
		padding:0;
		}
	.entry p{
		clear:left;
		padding:0;
	}
	.entry a{
		font-weight:bold;
		text-decoration:underline;
	}
	.entry p.intro{
		
	}
		.entry p span.imgbox{
			margin:0;
			padding:0;
			}
	
	.entry p.info a{
		color:#01B0A8;
	}

 	.entry .ufo,
	.entry .swf{
		float:right;
		margin:0.6em 0 1em 20px;
		padding:0;
	}
	
	/* uitzonderingen in  div class="entry textpage" */
	
.textpage{
	border:0;
	margin-top:2em;/* no padding ivm IE h3 uitlijning..? */
}      

	.textpage p span.imgbox{ 
		width:100%;
		text-align:left;
		display:block;
		margin:1em 0;
		padding:0;
	}
		.textpage p span.imgbox img{
			margin:0;
		}

	
	/* =entrybox voor meer entries per rij bijv. */
	
#Content_main .entrybox h2{
	color:#000;
	font-weight:bold;
	font-size:1.2em;
	padding:1em 0;
	margin:0;
}	
.entrybox .entry{
	float:left;
	clear:none;
	padding:0 8px 0.5em 0;
	margin:0;
	width:340px;
	border:0;
}
.entrybox img{
	float:left;
	margin:0 8px 8px 0;
}
#Content_main .entrybox h3{
	font-size:1em;
	text-transform:none;
	float:none;
	padding:0 0 0 8px;
	background:none;
}
#Content_main .entrybox p.intro{
	float:left;
	clear:none;
}
	
	/* extra div class=calender */

#Content_main .calender{
	float:left;
	clear:both;
	display:inline; /* margin-bug IE */
	width:698px;
	background:#fff;
	margin:0 0 0 8px;
	padding:0;
	overflow:hidden;
}
	.calender .cat_row{
		clear:both;
		float:left;
		padding:8px 0 8px 0;
		margin: 4px 0;
		width:698px; /* IE heeft niet genoeg aan width:100% */
		background: #000;
	}
	
	/* 3 verschillende backgrounds voor de opvolgende background-colors, default = .cat_row*/
	#Content_main .catrow2{
		background: #555;
	}
	#Content_main .catrow3{
		background: #999;
	}
	
	#Content_main .calender .cat_row h2{
		float:left;
		color:#fff;
		margin:0;
		padding:26px 0 0 20px;
		font-size:2.2em;
		width:158px;
	}
	
	#Content_main .cat_row ul{
		margin:0;
		padding:0; 
	}
	#Content_main .cat_row li{
		float:left;
		display:inline;
		position:relative;
		margin:0 0 0 10px;
		padding:0;
		width:90px;
		height:68px;
		background:#000;
		border:1px solid #cacaca;
		overflow:hidden;
	}
	#Content_main .cat_row a{
		color:#fff;
	}
		.cat_row span.date{
			position:absolute;
			top:28px;
			left:0;
			width:90px;
			color:#fff;
			font-size:0.8em;
			height:1.2em;
			line-height:1.2em;
			padding:0.2em 0;
			text-align:center;
			background:#000;
			z-index:2;
		}
	
/* --------------------------------- =Content_main =reaction ------ */

			#Content_main .reaction{
				clear:both;
				margin:0 8px;
				width:475px;
				padding-top:1px; /* for not margin-collapse in top */
				background:#f0f0f0;
			}	
			#Content_main .reaction h2{	
					font-size:1.2em;
					color:#000;
					font-weight:bold;
					padding:1.2em 20px 0.6em 8px;
					margin:0;
					background:#fff;

			}
			#Content_main .reaction p{
				margin:1em 0;
				padding:0 8px;
			}
			#Content_main .reaction p.info{
				margin:0.5em 0 0 0;
				padding:0.5em 8px 1.5em 8px;
				background:#fff;
			}	
			
/* ------------------=Reaction form */

			form#Reaction{
				float:left;
				clear:both;
				margin:20px 0 20px 16px;
				width:445px;
			}
				form#Reaction h2{
					font-size:1.2em;
					font-weight:bold;
					color:#000;
					padding:0;
				}
				form#Reaction legend{
					font-size:1.4em;
					color:#000;
					margin:0;
					padding:0 0 1em 8px;
				}
				form#Reaction label{
					display:block;
					margin-top:0.8em;
				}
				form#Reaction input{
					width:443px;
					border:1px solid #ccc;
				}
				form#Reaction input.submit{
					width:auto;
					float:right;
					margin:1em 0 0 0;
					padding:3px 8px;
					border:1px solid #ccc;
					background:#f0f0f0;
				}
				form#Reaction textarea{
					width:443px;
					border:1px solid #ccc;
				}





/* ------------------------------------------------------ =nav_sub */

#Nav_sub{
	
	float:right;
	padding:0 ;
	margin: 26px 0 0 0;
	padding: 222px 0 0 0;
	font-size:1.1em;
	width:184px;
	background: url(../images/tekst_onderlogo.gif) no-repeat 6px 0;
	overflow: hidden;
}

/* verander naar eng. tekst in background-image via javascript */
body.version_en #Nav_sub{
	background: url(../images/tekst_onderlogo_en.gif) no-repeat 6px 0;
}
#Nav_sub h3{
	display:none;
}

	/* Nav_sub -> div.class? */
	.categories,
	.feeds,
	.articles,
	.reactions,
	.external,
	.archive{
		width: 172px;
		margin: 0 0 6px 6px;
		overflow: hidden;/*prevent lange woorden de width uit te duwen (IE)*/
	}
	.categories,
	.feeds{
		background: #fff;
		margin: 0 0 6px 6px;
	}
	.articles,
	.external{
		background: #eee;
	}
	.reactions
	{
		padding: 0.6em 0;
		background: #ccc url(../images/backgrounds/bg_reactionsgrad.jpg) repeat-x top;
	}
	
	.archive{
		background: #fff;
	}
	
	.categories li a{
		font-size:1.6em;
		padding:0 30px 0 0;
		background:#fff url(../images/backgrounds/bg_category.gif) no-repeat 100% 70%;
	}
	.feeds{
		padding:2em 0 1em 0;
		background: #bec0c3;
	}

	.weblog{
	}

	.articles a{
		text-transform:uppercase;
	}
	.articles a span{
		display:block;
		font-size:0.9em;
		text-transform:none;
		color:#01B0A8;
		font-weight:bold;
	}
	.reactions ul{
		padding:0;
	}
	.reactions li{
		padding:0 8px;
		background:none;
		margin: 1em 0;
	}
	.reactions a{
		background:none;
		padding:0;
		margin:0;
	}
	.reactions strong{
		display:block;
		color:#01B0A8;
	}
	.external li{
		padding:0 0 0 10px;
		background:url(../images/backgrounds/bullet_li.gif) no-repeat 0 0.7em;
	}
	.feeds a{
		margin:0 0 0 6px;
		padding:0 0 0 16px;
		background:url(../images/feedicon.png) no-repeat left bottom;
	}
	

	
	/* switch nl/en */

		#Nav_sub .controls{
		position:absolute;
		left:220px;
		top:22px;
		width:100px;
		height:24px;
	}
		#Nav_sub .controls ul{
			margin:0;
			padding:0;
		}
		#Nav_sub .controls li{
			float:none;
			display:inline;
			padding:0;
			margin:0;
		}
			#Nav_sub .controls li a{
				font-size:1.2em;
				padding:0;
				margin:0;
				border-bottom:2px solid #01B0A8;
			}



/* ------------------------------------------------ =Supplementary */

#Supplementary{
	clear:both;
	width:675px;
	padding:183px 12px 7em 12px;
	text-align:center;
	background:url(../images/logo_footer.gif) no-repeat 8px 0;
}
	#Supplementary a{
		color:#01B0A8;
	}