/*--------------------------------------------------------------------
Basic Style Sheet

Version: 1.0
Copyright: 2009, dicode® VOF - understanding internet
W: www.dicode.nl
E: info@dicode.nl
T: 0570-750680
--------------------------------------------------------------------*/

/* Global
--------------------------------------------------------------------*/
* { 
	font-family: arial;
	color: #727272;
	font-size: 12px;
}

img {
	border: 0;
}

h1 {
	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #b02311;
	font-size: 20px;
}

h2 {
	margin: 0;
	padding: 0;
	font-weight: bold;
	color: #99a100;
	font-size: 17px;
}

h3 {
	margin: 3px 0 3px 0;
	padding: 0;
	color: #b02311;
	font-weight: bold;
	font-size: 12px;
}

h4 {
	margin: 0;
	padding: 0;
	color: #727272;
	font-weight: bold;
	font-size: 12px;
}

h5 {
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-weight: bold;
	font-size: 25px;
}

h6 {
	margin: 0;
	padding: 0;
	color: #99a100;
	font-weight: bold;
	font-size: 18px;
}

hr {
	border: 0;
	width: 196px;
	padding: 0;
	margin: 4px 0;
	height: 2px;
	border-bottom: solid 2px #eaeaea;
	background-color: #eaeaea;
}

hr.small {
	border: 0;
	width: 196px;
	padding: 0;
	margin: 4px 0;
	height: 1px;
	border-bottom: solid 1px #eaeaea;
	background-color: #eaeaea;
}

a {
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

body {
	margin: 0;
	padding: 0;
	text-align: center;
	background: #f6f6f6 url(css/images/bg.jpg) repeat-x;
}


input.error, textarea.error {
	border: 1px solid #b02311;
	padding: 2px;
}

/* Top
--------------------------------------------------------------------*/
	div#top {
		position: absolute;
		margin: 0;
		padding: 0;
		height: 35px;
		width: 100%;
		top: 0;
		left: 0;
		background: url(css/images/bg_balk.png) repeat-x;
		z-index: 5;
	}

	div#topcontent {
		position: relative;
		width: 979px;
		margin: 0 auto;
	}
	
	div#logo {
		position: relative;
		width: 225px;
		height: 100px;
		margin-top: -4px;
	}
	
	div#top ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	
	div#top ul li {
		float: left;
		margin: 5px 0 0 30px;
	}
	
	div#top ul li a {
		text-decoration: none;
	}
	
	div#top ul li a:hover {
		text-decoration: underline;
	}


/* Site
--------------------------------------------------------------------*/
div#site {
	position: relative;
	width: 979px;
	margin: 0 auto;
	padding-top: 26px;
	z-index: 1;
	text-align: left;
	border-right: solid 1px #fff;
	border-left: solid 1px #fff;
	background-color: #fff;
}

/* Head
--------------------------------------------------------------------*/
	div#headmenu {
		position: relative;
		height: 103px;
		background: url(css/images/bg_head.jpg) no-repeat;
	}
	
	div#headmenu div.box {
		position: absolute;
		top: 5px;
		right: 30px;
		color: #9bb118;
	}

	div#headmenu div.box div.boxleft {
		position: relative;
		width: 54px;
		float: left;
		height: 26px;
		background: url(css/images/img_boxleft.jpg) no-repeat;
	}

	div#headmenu div.box div.boxmiddle {
		position: relative;
		height: 22px; /* 26px */
		float: left;
		padding: 4px 0 0 0;
		background: url(css/images/img_boxmiddle.jpg) repeat-x;
	}

	div#headmenu div.box div.boxmiddle input {
		height: 12px;
		line-height: 10px;
		font-size: 10px;
		border: solid 1px #d2d2d2;
	}

	div#headmenu div.box div.boxright {
		position: relative;
		width: 58px;
		float: left;
		height: 26px;
		background: url(css/images/img_boxright.jpg) no-repeat;
	}
	
	div#headmenu div.box a {
		color: #636568;
		font-size: 11px;
		text-decoration: none;
	}
	
	div#headmenu div.box a:hover {
		text-decoration: underline;
	}

/* Menu
--------------------------------------------------------------------*/
	div#menu {
		position: relative;
		height: 39px;
		margin-bottom: 1px;
		background: url(css/images/bg_menu.jpg) repeat-x;
	}

	div#menu ul {
		list-style: none;
		margin: 0;
		padding: 0 0 0 20px;
	}

	div#menu ul li {
		float: left;
		padding: 11px 8px;
		background: url(css/images/bg_menuli.jpg) no-repeat top right;
	}

	div#menu ul li.last {
		background: none;
	}

	div#menu ul li a {
		color: #fff;
		text-decoration: none;
	}

	div#menu ul li a:hover {
		text-decoration: underline;
	}

/* Subhead
--------------------------------------------------------------------*/
	div#subheadhome {
		position: relative;
		width: 978px;
		height: 228px;
		background: url(css/images/img_home.jpg) no-repeat;
	}

	div#subheadhome div.subheadcontent {
		position: absolute;
		right: 20px;
		width: 170px;
		line-height: 20px;
	}

	div#subheadhome div.subheadcontent * {
		color: #175771;
	}

	div#subheadhome div.subheadcontent h1 {
		color: #fff;
		font-size: 42px;
		line-height: 42px;
	}

	div#subheadhome div.subheadcontent a {
		padding-right: 20px;
		background: url(css/images/img_arr.png) no-repeat right 1px;
	}
	
	div#subhead {
		position: relative;
		margin-top: 2px;
		width: 978px;
		height: 109px;
		background: url(css/images/img_page.jpg) no-repeat;
	}

	div#subhead div.subheadcontent {
		position: absolute;
		right: 20px;
		width: 170px;
		line-height: 20px;
	}

	div#subhead div.subheadcontent * {
		color: #175771;
	}

	div#subhead div.subheadcontent h1 {
		color: #fff;
		font-size: 42px;
		line-height: 42px;
	}

	div#subhead div.subheadcontent a {
		padding-right: 20px;
		background: url(css/images/img_arr.png) no-repeat right 1px;
	}
	
		/* Container::Content Breadcrumbs
		------------------------------------------------------------*/
			div#middle div#breadcrumbs {
				position: relative;
				width: 560px;
				padding: 0;
				height: 20px;
				margin: -42px 0 20px 0;
				border-bottom: dotted 1px #9bb118;
			}

			div#middle div#breadcrumbs ul {
				list-style: none;
				padding: 0 0 0 10px;
				margin: 0;
			}
			
			div#middle div#breadcrumbs ul li {
				float: left;
				color: #9bb118;
				font-size: 12px;
				background: none;
			}
			
			div#middle div#breadcrumbs ul li a {
				text-decoration: none;
				color: #9bb118;
				font-size: 10px;
			}
			
			div#middle div#breadcrumbs ul li a:hover {
				text-decoration: underline;
			}
			

/* Left
--------------------------------------------------------------------*/
	div#left {
		position: relative;
		float: left;
		width: 197px; /* 197px */ /* 201px */
		margin-top: -15px;
		line-height: 20px;
		left: 0;
		border-top: solid 2px #eaeaea;
	}

	div#left h2 {
		font-size: 12px;
		color: #175771;
		font-weight: bold;
		padding-top: 5px;
	}

	div#left h2.green {
		font-size: 18px;
		color: #99a100;
		padding: 0;
	}

	div#left div.title {
		position: absolute;
		top: -30px;
		left: 19px;
		width: 170px;
	}

	div#left div.hline, div#left div.hline2 {
		position: relative;
		width: 197px;
		left: 0px;
		height: 1px;
		margin: 5px 0;
		line-height: 1px;
		border-bottom: solid 1px #eaeaea;
	}

	div#left div.hline2 {
		height: 2px;
	}
	
	div#left ul {
		list-style: none;
		margin: 0;
		padding: 0;
		margin-left: 20px;
	}

	div#left ul li {
		padding: 1px 0 1px 10px;
		background: url(css/images/img_singlearr.jpg) no-repeat 0 8px;
	}

	div#left ul li a {
		color: #175771;
		text-decoration: none;
	}

	div#left ul li a:hover {
		text-decoration: underline;
	}

	div#left input {
		width: 161px;
		background-color: #f2f2f2;
	}

	div#left a.btn {
		float: right;
		padding: 14px 10px 0 0;
	}

	div#left div.banner {
		position: relative;
		left: 0px;
		padding-top: 10px;
	}

	div#left h4.blue {
		color: #175771;
		margin-left: 20px;
	}

/* Middle
--------------------------------------------------------------------*/
	div#middle {
		position: relative;
		float: left;
		width: 572px;
		margin: 20px 0 0 9px;
	}
	
	div#site div.page {
		width: 552px;
	}
	
	div#middle div.hline {
		height: 10px;
		width: 552px;
		border-top: dotted 1px #9bb118;
		margin-top: 10px;
	}

	
	div#middle p {
		line-height: 20px;
	}

	div#middle div.item {
		position: relative;
		float: left;
		padding: 0 12px 30px 0;
	}

	div#middle div.box_head {
		background: url(css/images/bg_box_head.jpg) no-repeat;
		height: 30px;
	}

	div#middle div.box_foot {
		background: url(css/images/bg_box_foot.jpg) no-repeat;
		height: 30px;
		margin-bottom: 10px;
	}


	div#middle div.box {
		position: relative;
		width: 468px;
		background: url(css/images/bg_box.jpg) repeat-y;
		padding: 0 30px 0 30px;

	}

	div#middle div.box img {
		vertical-align: top;
	}

	div#middle div.box h3 {
		margin: 0px;
	}
	
	div#middle div.box div.hline {
		height: 10px;
		width: 468px;
		border-top: dotted 1px #9bb118;
		margin-top: 10px;
	}
	
	div#middle div.box div.left {
		position: relative;
		float: left;
		width: 248px;
		overflow: hidden;
		line-height: 20px;
	}


	div#middle div.box div.right {
		position: relative;
		float: left;
		width: 220px;
		overflow: hidden;
		line-height: 20px;
	}

	div#middle div.form div.left {
		width: 120px;
		line-height: 30px;
		
	}
	div#middle div.form div.right {
		width: 348px;
		line-height: 30px;
	}
		
	div#middle div.item h3 {
		color: #175771;
		padding: 4px 0 4px 8px;
	}

	div#middle div.item ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	div#middle div.item ul li {
		padding: 4px 0 4px 18px;
		border-top: solid 1px #eaeaea;
		background: url(css/images/img_doublearr.jpg) no-repeat 8px 8px;
	}

	div#middle div.item ul li.last {
		border-bottom: solid 1px #eaeaea;
	}

	div#middle div.item ul li a {
		color: #000;
		text-decoration: none;
	}

	div#middle div.item ul li a:hover {
		text-decoration: underline;
	}

	div#middle div.left {
		position: relative;
		float: left;
		width: 257px;
	}

	div#middle div.left h1 {
		color: #175771;
	}

	div#middle div.right {
		position: relative;
		float: right;
	}
	
		/* years */
		div#middle div#years {
			position: relative;
			text-align: right;
			width: 250px;
			margin-left: 260px;
			font-size: 12px;
		}
		
		div#middle div#years a {
			font-size: 11px;
		}
	
		/* meeting */
		div#middle a {
			text-decoration: none;
		}
		
		div#middle ul.meeting {
			list-style-type: none;
			margin: 0 0 -10px 10px;
			padding: 0;
		}
		
		div#middle ul.meeting li {
			margin: 10px;
		}
		
		div#middle a:hover {
			text-decoration: underline;
		}
	
		/* login */
		div#middle div.login {
			position: relative;
			width: 530px;
			height: 276px;
			background: url(css/images/bg_login.jpg) no-repeat;
		}
		
		div#middle div.login a {
			text-decoration: none;
			color: #a4ba22;
		}
		
		div#middle div.login a:hover {
			text-decoration: underline;
		}
		
			div#middle div.login div.gebruikersnaam {
				position: relative;
				float: left;
				width: 125px;
				height: 35px;
				line-height: 35px;
				margin: 60px 0 0 40px;
			}
			
			div#middle div.login div.gebruikersnaam_input {
				position: relative;
				float: left;
				width: 200px;
				height: 35px;
				line-height: 35px;
				margin: 60px 0 0 0px;
			}
			
			div#middle div.login div.wachtwoord {
				position: relative;
				float: left;
				width: 125px;
				height: 35px;
				line-height: 35px;
				margin: 0px 0 0 40px;
			}
			
			div#middle div.login div.wachtwoord_input {
				position: relative;
				float: left;
				width: 200px;
				height: 35px;
				line-height: 35px;
				margin: 0px 0 0 0px;
			}
		
		div#middle div.login div.button {
			position: absolute;
			top: 170px;
			left: 175px;
			margin: 0;
		}
		
		div#middle div.login div.lostpw {
			position: absolute;
			top: 200px;
			left: 325px;
		}
		
		div#middle div.login div.msg {
			position: absolute;
			top: 40px;
			left: 30px;
			color: #b02311;
			font-weight: bold;
		}
		
		div#middle div.login div.right input.normal {
			width: 150px;
		}
	
	div#middle ul.sitemap {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	div#middle ul.sitemap li {
		padding: 4px 0 4px 18px;
		background: url(css/images/img_doublearr.jpg) no-repeat 8px 8px;
	}
	
	div#middle ul.sitemap li.spacer {
		padding: 0px;
	}

	div#site .page ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	div#site .page ul li {
		padding: 4px 0 4px 18px;
		background: url(css/images/img_doublearr.jpg) no-repeat 8px 8px;
	}

	div#site .page a {
		text-decoration: none;
		color: #175771;
	}

	div#site .page a:hover {
		text-decoration: underline;
	}
	
	/* E-cards */
	div#middle div#ecards {
		
	}
	
	div#middle div#ecards div#intro {
		float: left;
		width: 540px;
	}
	
	div#middle div#ecards div#intro h3 {
		color: #b5cc2b;
		margin-top: 20px;
	}
	
	div#middle div#ecards div#intro p {
		margin-top: 5px;
	}
	
	div#middle div#steps {
		margin-top: 20px;
		height: 32px;
		width: 556px;
		background: url(css/images/ecards/bg_hline.jpg) repeat-x bottom;
	}
	
	div#middle div.card {
		margin: 20px 0 10px 0;
		height: 127px;
		width: 184px;
		float: left;
		background: url(css/images/ecards/bg_card.jpg) repeat-x bottom;
		margin-right: 5px;
	}
	
	div#middle div.card label {
		color: #00a6dd;
		margin-top: 2px;
	}
	
	div#middle div.card img {
		margin: 8px 0 10px 10px;
	}
	
	div#middle div.button {
		margin: 40px 20px 0 0;
		float: right;
	}
	
	div#middle div.step2card {
		margin: 20px 0 10px 0;
		height: 127px;
		width: 184px;
		float: left;
		background: url(css/images/ecards/bg_card.jpg) repeat-x bottom;
		margin-right: 5px;
	}
	
	div#middle div.step2card img {
		margin: 8px 0 10px 10px;
	}
	
	div#middle div.step2card a {
		text-decoration: none;
		color: #00a6dd;
		padding-left: 20px;
		margin-left: 20px;
		background: url(css/images/ecards/arr_blue.jpg) no-repeat 0 -1px ;
	}
	
	div#middle div.inhoud {
		margin: 20px 20px 0 0;
		float: right;
	}
	
	div#middle div.inhoud textarea {
		width: 320px;
		height: 241px;
		border: 1px #e5e5e5 solid;
		color: #09bfdf;
		padding: 10px;
		font-size: 18px;
	}
	
	div#middle div.sendbox {
		margin-top: 20px;
		height: 55px;
		width: 119px;
		float: left;
		background: #a7bd21;
		margin-right: 5px;
		color: #ffffff;
		font-size: 14px;
		padding: 10px;
		font-weight: bold;
	}
	
	div#middle div.sendboxinput {
		margin-top: 20px;
		float: left;
		background: none;
	}
	
	div#middle div.sendboxinput input {
		border: 1px #e5e5e5 solid;
		color: #09bfdf;
		padding: 5px;
		font-size: 18px;
		width: 360px;
	}
	
	input.styled { 
		display: none;
	}
	
	span.radio {
		width: 16px;
		height: 16px;
		padding: 0 5px 0 0;
		margin-left: 10px;
		background: url(/css/images/beheer/input_checkbox.gif) no-repeat;
	 	display: block;
	 	float: left;
		cursor: pointer;
	}
	
	div#middle div#placeholder {
		position: relative; 
		float: left; 
		height: 400px; 
		width: 550px; 
	}
	
	div#middle div#front {
		position: absolute;
		top: 0;
		left: 0;

		height: 392px;
		width: 562px;
		background: #fff url(css/images/ecards/bg_ecard_front.jpg) no-repeat top;
		
		z-index: 2;
	}
	
	div#middle div#front img {
		margin: 13px 0 10px 10px;
	}
	
	div#middle div#back {
		position: absolute;
		top: 0;
		left: 0;

		height: 392px;
		width: 562px;
		background: #fff url(css/images/ecards/bg_ecard_back.jpg) no-repeat top;
		
		z-index: 1;
	}
	
	div#middle div#back div.inhoud {
		margin: 40px 0px 30px 30px;
		float: left;
		color: #060605;
		font-size: 18px;
		width: 300px;
	}
	
	div#middle div#back div.afzender {
		margin: 203px 0 10px 10px;
		float: left;
		font-size: 16px;
		font-weight: bold;
	}
	
	div#middle div#back div.afzender * {
		font-size: 16px;
		font-weight: bold;
		color: #000000;
	}


/* Right
--------------------------------------------------------------------*/
	div#right {
		position: relative;
		float: right;
		width: 200px;
		margin-top: 15px;
	}
	
	div#right div.nieuwsberichten {
		position: relative;
		width: 180px; /* 196px */
		height: 24px; /* 30px */
		padding: 3px 8px;
		background-color: #17d0ec;
	}

	div#right div.nieuwsberichten h2 {
		color: #fff;
	}
	

	/* Right :: newsitem
	----------------------------------------------------------------*/
		div#right div.newsitem {
			padding: 10px 8px 5px 8px;
			line-height: 16px;
			border-bottom: solid 1px #eaeaea;
		}
	
		div#right div.newsitem p {
			margin: 0;
			padding: 0;
		}

		div#right div.newsitem a {
			text-decoration: none;
		}
	
		div#right h7 {
			width: 180px;
			font-size: 18px;
			font-weight: bold;
		}
	
		div#right div.newsitem h4 {
			font-size: 12px;
			font-weight: bold;
			color: #175771;
		}
	
		div#right div.newsitem h4.blue {
			color: #175771;
		}
	
		div#right div.newsitem h4.green {
			color: #99a100;
		}
	
		div#right div.newsitem h4.red {
			color: #b02311;
		}
	
		div#right div.newsitem div.date {
			font-size: 10px;
			color: #99a100;
		}

	div#right a.morenews {
		color: #99a100;
		text-decoration: underline;
		padding: 0 10px 0 8px;
		background: url(css/images/img_doublearr-green.jpg) no-repeat right 5px;
	}

	div#right a.morenews:hover {
		text-decoration: none;
	}
	
	div#right div.publicaties {
		position: relative;
		width: 180px; /* 196px */
		height: 24px; /* 30px */
		padding: 3px 8px;
		background-color: #99a100;
	}

	div#right div.publicaties h2 {
		color: #fff;
	}
	
		
/* Footer
-------------------------------------------------------------------*/

	div#footer {
		position: relative;
		width: 979px;
		height: 51px;
		font-size: 11px;
		margin-top: 20px;
		background: url(css/images/bg_footer.jpg) repeat-x;
	}
	
	div#footer div#box1 {
		position: absolute;
		padding-top: 25px;
		margin: 0px 0 0 25px;
		color: #fff; 
	}
	
	div#footer div#box2 {
		position: absolute;
		top: 25px;
		left: 650px; /* 700px */
		color: #e1ebaa;
		font-size: 11px;
	}
	
	/* Footer::Components
	---------------------------------------------------------------*/
		div#footer a {
			color: #fff; 
			font-size: 11px;
			text-decoration: none;
		}
		
		div#footer a:hover {
			text-decoration: underline;
		}
	


/* Other
--------------------------------------------------------------------*/
	div.clear {
		clear: both;	
	}