/* --- MAIN.CSS - CFI --- */

body, html {
	height: 100%;
	margin: 0;
	padding: 0;
}

body, p, td, h1, h2, h3, h4, h5, h6, input, textarea, select {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

body {
	font-size: 0.8em;
	line-height: 1.25em;
	color: #3f3f3f;
	background-color: #eed38e;
}

div {
	margin: 0;
	padding: 0;
}

h1 {
	font-size: 1.65em;
	font-weight: normal;
	line-height: 1.25em;
	color: #000000;
	margin: 4px 0 3px;
	padding: 0;
}

h2 {
	font-size: 1.35em;
	font-weight: normal;
	line-height: 1.0em;
	color: #000000;
	margin: 0;
	padding: 10px 0 5px;
}

h3 {
	font-size: 1.0em;
	font-weight: bold;
	line-height: 1.25em;
	color: #3f3f3f;
	margin: 0;
	padding: 0;
}

p {
	margin: 0 0 16px;
	padding: 0;
}

ul, li,
dl, dd, dt {
	margin: 0;
	padding: 0;
}

li,
dd, dt {
	list-style-type: none;
}

a:link, a:visited {
	color: #0050bb;
	text-decoration: underline;
}

a:hover, a:focus, a:active {
	color: #5aa2ff;
	text-decoration: none;
}

a:visited, a:active {
	color: #783399;
}

a img {
	border-style: none;
}

.offScreen {
	position: absolute !important;
	left: -9999px !important;
	width: 500px;
}

.alignLeft {
	float: left;
}

.alignRight {
	float: right;
}

img.alignLeft {
	display: block;
}

img.alignRight {
	display: block;
}


/* --- hoofdstructuur --- */

#container {
	position: relative;	/* #footer wordt t.o.v. deze div gepositioneerd */
	height: 100%;
	margin: 0;
	padding: 0;
}

html>body #container {
	height: auto;
	min-height: 100%;
}

#skipNavigatie {
	position: absolute;
	left: -1000px;
}

#allButFooter {
	width: 100%;
	margin: 0;
	padding: 0 0 5.45em;	/* bottom minstens de totale hoogte van de footer */
	overflow: hidden;
}

#siteTop {
	width: 100%;
	min-height: 44px;
	padding: 14px 0 0;
	overflow: hidden;
	background-color: #ffffff;
}

#siteBody {
	background: url(../images/bg.gif) transparent repeat-x left top;
}

#footer {
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 1.9em;
	padding: 0 0 23px;
	overflow: hidden;
	background-color: #ffffff;
	border-top: 1px solid #e7c366;
}

html>body #footer {
	bottom: 0;
	height: auto;
	min-height: 1.9em;
}

	.site {
		width: 860px;
		margin: 0 auto;
		padding: 0 20px;
		overflow: hidden;
	}
	
		#columnLeft {
			float: left;
			width: 160px;
		}
		
		#mainContent {
			float: right;
			width: 680px;
		}
	
	
/* ------------ */
/* --- logo --- */
/* ------------ */

#logo {
	float: left;
	width: 542px;
	margin: 0 10px 0 0;
}

	#logo h1 {
		width: 322px;
		height: 30px;
		margin: 0;
		padding: 0;
	}

		#logo h1 a:link, #logo h1 a:visited, #logo h1 a:hover, #logo h1 a:focus, #logo h1 a:active {
			display: block;
			width: 542px;
			height: 30px;
			margin: 0;
		}
		

/* ------------------- */
/* --- serviceMenu --- */
/* ------------------- */

#serviceMenu {
	float: right;
	font-size: 0.85em;
	font-weight: bold;
	color: #801f10;
	margin: 27px 0 0;
	padding: 5px 2px;
	background-color: #f5dc9d;
	border-bottom: 1px solid #fbf1d8;
}

html>body #serviceMenu {
	padding: 5px 2px 0;
}

*:first-child+html #serviceMenu {
	padding: 5px 2px;
}

	#serviceMenu li {
		float: left;
		padding: 0 8px 0.2em;
	}
	
	#serviceMenu li.tekstgrootte {
		padding: 0 8px 0.3em;
	}
	
	html>body #serviceMenu li.tekstgrootte {
		padding: 0 8px;
	}
	
	*:first-child+html #serviceMenu li.tekstgrootte {
		padding: 0 8px 0.2em;
	}
	
		#serviceMenu li.tekstgrootte span {
			speak: none;
		}
	
		#serviceMenu a:link, #serviceMenu a:visited, #serviceMenu a:hover, #serviceMenu a:focus, #serviceMenu a:active {
			display: block;
			font-weight: bold;
			color: #801f10;
			text-decoration: none;
			padding: 0 0 0.1em 16px;
			background: none transparent no-repeat left center;
		}
	
		html>body #serviceMenu a:link, html>body #serviceMenu a:visited, html>body #serviceMenu a:hover, html>body #serviceMenu a:focus, html>body #serviceMenu a:active {
			padding: 0.1em 0 0 16px;
		}
	
		*:first-child+html #serviceMenu a:link, *:first-child+html #serviceMenu a:visited, *:first-child+html #serviceMenu a:hover, *:first-child+html #serviceMenu a:focus, *:first-child+html #serviceMenu a:active {
			padding: 0 0 0 16px;
		}
	
		#serviceMenu a.actief:link, #serviceMenu a.actief:visited, #serviceMenu a.actief:hover, #serviceMenu a.actief:focus, #serviceMenu a.actief:active {
			text-decoration: underline;
		}
		
		#serviceMenu a:hover, #serviceMenu a:focus, #serviceMenu a:active {
			text-decoration: underline;
		}
		
		#serviceMenu .contact a:link, #serviceMenu .contact a:visited, #serviceMenu .contact a:hover, #serviceMenu .contact a:focus, #serviceMenu .contact a:active {
			background-image: url(../images/ico_contact.gif);
		}
		
		#serviceMenu .print a:link, #serviceMenu .print a:visited, #serviceMenu .print a:hover, #serviceMenu .print a:focus, #serviceMenu .print a:active {
			background-image: url(../images/ico_print.gif);
		}
		
		#serviceMenu a.kleiner:link, #serviceMenu a.kleiner:visited, #serviceMenu a.kleiner:hover, #serviceMenu a.kleiner:focus, #serviceMenu a.kleiner:active {
			display: inline;
			font-size: 0.7em;
			padding: 0.8em 0 0.2em 16px;
			background-image: url(../images/ico_tekstverkleinen.gif);
		}
		
		html>body #serviceMenu a.kleiner:link, html>body #serviceMenu a.kleiner:visited, html>body #serviceMenu a.kleiner:hover, html>body #serviceMenu a.kleiner:focus, html>body #serviceMenu a.kleiner:active {
			padding: 0.7em 0 0.2em 16px;
		}
		
		*:first-child+html #serviceMenu a.kleiner:link, *:first-child+html #serviceMenu a.kleiner:visited, *:first-child+html #serviceMenu a.kleiner:hover, *:first-child+html #serviceMenu a.kleiner:focus, *:first-child+html #serviceMenu a.kleiner:active {
			padding: 0.7em 0 0.1em 16px;
		}
		
		#serviceMenu a.groter:link, #serviceMenu a.groter:visited, #serviceMenu a.groter:hover, #serviceMenu a.groter:focus, #serviceMenu a.groter:active {
			display: inline;
			font-size: 1.25em;
			padding: 0 16px 0.1em 0;
			background-image: url(../images/ico_tekstvergroten.gif);
			background-position: right center;
		}
		
		html>body #serviceMenu a.groter:link, html>body #serviceMenu a.groter:visited, html>body #serviceMenu a.groter:hover, html>body #serviceMenu a.groter:focus, html>body #serviceMenu a.groter:active {
			padding: 0 16px 0 0;
		}


/* ------------------ */
/* --- breadcrumb --- */
/* ------------------ */

#breadcrumb {
	clear: both;
	font-size: 0.85em;
	font-style: italic;
	color: #ffffff;
	margin: 10px 0 15px;
	padding: 0 0 0 5px;
}
	
	#breadcrumb li {
		display: inline;
		padding: 0 0 0 19px;
		background: url(../images/dot_wit.gif) transparent no-repeat 6px 50%;
	}

		#breadcrumb ul ul {
			display: inline;
		}
		
			#breadcrumb li li {
				background-image: url(../images/pijl_wit.gif);
			}
			
			#breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:focus, #breadcrumb a:active {
				font-weight: bold;
				font-style: normal;
				color: #ffffff;
				text-decoration: underline;
			}
			
			#breadcrumb a:hover, #breadcrumb a:focus, #breadcrumb a:active {
				text-decoration: none;
			}
			

/* -------------------------------- */
/* --- hoofdMenu / algemeenMenu --- */
/* -------------------------------- */

#columnLeft ul {
	background-color: #f5dc9d;
}

	#columnLeft li {
		width: 100%;
		overflow: hidden;
	}

		#columnLeft li a:link, #columnLeft li a:visited, #columnLeft li a:hover, #columnLeft li a:focus, #columnLeft li a:active {
			display: block;
			color: #801f10;
			text-decoration: none;
			width: 138px;
			padding: 7px 11px 10px;
			border-width: 1px;
			border-style: solid none;
			border-top-color: #fbecc7;
			border-bottom-color: #e6c061;
		}
		
		#hoofdMenu li a:link, #hoofdMenu li a:visited, #hoofdMenu li a:hover, #hoofdMenu li a:focus, #hoofdMenu li a:active {
			font-weight: bold;
			width: 124px;
			padding-left: 25px;
			background: url(../images/dot_zand.gif) transparent no-repeat 11px 45%;
		}
		
		#hoofdMenu li a:hover, #hoofdMenu li a:focus/*, #hoofdMenu li a:active*/ {
			background-image: url(../images/dot_rood.gif);
		}
		
		#algemeenMenu li a:link, #algemeenMenu li a:visited, #algemeenMenu li a:hover, #algemeenMenu li a:focus, #algemeenMenu li a:active {
			font-size: 0.85em;
			padding: 0 11px 3px;
		}
		
		#columnLeft li.actief a:link, #columnLeft li.actief a:visited, #columnLeft li.actief a:hover, #columnLeft li.actief a:focus, #columnLeft li.actief a:active {
			color: #ffffff;
			background-color: #801f10;
			border-top-color: #801f10;
		}
		
		#hoofdMenu li.actief a:link, #hoofdMenu li.actief a:visited, #hoofdMenu li.actief a:hover, #hoofdMenu li.actief a:focus, #hoofdMenu li.actief a:active {
			background-image: url(../images/dot_wit.gif);
		}
		
		#columnLeft li a:hover, #columnLeft li a:focus/*, #columnLeft li a:active*/ {
			background-color: #e9c975;
			border-top-color: #e9c975;
		}
	

/* ------------------- */
/* --- mainContent --- */
/* ------------------- */

#intro {
	width: 660px;
	padding: 5px 5px 5px 15px;
	overflow: hidden;
}

#intro.navigatie {
	background-image: url(../images/ln_intro.gif);
	background-repeat: repeat-y;
	background-position: 245px 0;
}

	#intro div.alignLeft {
		width: 220px;
		margin: 0;
		padding: 0 5px 0 0;
	}
	
	#intro div.alignRight {
		width: 415px;
		margin: 0;
		padding: 0 0 0 15px;
	}
	
		#intro h1 {
			color: #ffffff;
			line-height: 1.2em;
			margin: 6px 0 -11px;
			padding: 0 15px 0 5px;
		}
		
		html>body #intro h1 {
			margin: 6px 0 4px;
		}
		
		*:first-child+html #intro h1 {
			margin: 6px 0 -11px;
		}
		
		#intro h1.alignLeft {
			width: 500px;
		}
		
		#intro .alignLeft h1 {
			width: 200px;
			margin: 6px 0 0;
		}
		
		html>body #intro .alignLeft h1 {
			margin: 6px 0 0;
		}
		
		#intro h2 {
			font-size: 1.0em;
			font-weight: bold;
			line-height: 1.0em;
			color: #ffffff;
			margin: 12px 0 -11px;
			padding: 0 15px 0 5px;
		}
		
		#intro p {
			clear: left;
			margin: 16px 0 6px;
			padding: 0 15px 0 5px;
		}

		#intro p.namens {
			font-weight: bold;
			color: #ffffff;
		}
		
		#intro .alignRight p {
			width: 255px;
			margin: 13px 0 6px;
			padding: 0 10px 0 5px;
		}
		
		html>body #intro .alignRight p {
			width: 260px;
		}
		
		#intro img {
			width: 118px;
			margin: 5px 5px 5px 15px;
			border: 1px solid #000000;
		}
		
		#intro ul {
			clear: both;
			margin: 5px 0 6px 5px;
		}
		
			#intro li {
				padding: 0 0 0 12px;
				background: url(../images/dot_wit.gif) transparent no-repeat 0 5px;
			}
			
				#intro li a:link, #intro li a:visited, #intro li a:hover, #intro li a:focus, #intro li a:active {
					text-decoration: none;
				}
				
				#intro li a:hover, #intro li a:focus, #intro li a:active {
					text-decoration: underline;
				}

.content {
	/*clear: both;*/
	margin: 10px 0;
	padding: 0 20px 10px;
	/*overflow: hidden;*/
	background-color: #ffffff;
}
	
	.content ul {
		width: 640px;
		overflow: hidden;
		border-top: 1px solid #f5dc9d;
	}
	
		.content li {
			clear: both;
			width: 640px;
			margin: 0;
			padding: 0 0 1px;
			overflow: hidden;
			border-bottom: 1px solid #f5dc9d;
		}
		
			.content li span,
			.content li a:link, .content li a:visited, .content li a:hover, .content li a:focus, .content li a:active {
				display: block;
				float: left;
				clear: left;
				font-weight: bold;
				color: #000000;
				padding: 0 0 2px 15px;
				background: url(../images/dot_zand.gif) transparent no-repeat 0 5px;
			}
			
			.jsOn .content li.jsVisited span,
			.content li a:visited {
				color: #d9a51f;
			}
			
			.jsOn .content li.jsActive span,
			.content li a:active {
				color: #801f10;
			}
			
			.jsOn .content li span.jsHover,
			.content li a:hover, .content li a:focus {
				color: #801f10;
				text-decoration: underline;
				cursor: pointer;
			}
	
			.content li p {
				clear: both;
				margin: 3px 0 0;
				padding: 0 0 6px 25px;
			}
			
			.jsOn .content li p {
				display: none;
				background: url(../images/ico_child.gif) transparent no-repeat 5px 3px;
			}
			
			.jsOn .content li.jsActive p {
				display: block;
			}
		
	.bevestiging p {
		padding: 0 0 0 15px;
	}
	
	.bevestiging .signature {
		float: left;
		width: 300px;
	}
	
		.bevestiging .handtekening {
			font-style: italic;
			width: 285px;
			padding-top: 75px;
		}
					
	.knoppen {
		width: 100%;
		margin: -11px 0 0;
		padding: 0 0 4px;
		overflow: hidden;
	}

		a.terug:link, a.terug:visited, a.terug:hover, a.terug:focus, a.terug:active,
		a.verder:link, a.verder:visited, a.verder:hover, a.verder:focus, a.verder:active {
			font-size: 0.85em;
			color: #000000;
			text-decoration: none;
			padding: 0 0 0 12px;
			background: none transparent no-repeat left center;
		}
		
		a.terug:hover, a.terug:focus, a.terug:active,
		a.verder:hover, a.verder:focus, a.verder:active {
			text-decoration: underline;
		}
	
.buttonLink {
	float: left;
	margin: 16px 0 9px 5px;
	padding: 0;
	background: url(../images/bg_button.gif) transparent repeat-x left bottom;
	border-bottom: 1px solid #e6c061;
}
	
	.buttonLink a:link, .buttonLink a:visited, .buttonLink a:hover, .buttonLink a:focus, .buttonLink a:active {
		display: block;
		float: left;
		font-weight: bold;
		color: #801f10;
		text-decoration: none;
		padding: 3px 20px 5px;
		overflow: hidden;
		background: url(../images/dot_rood.gif) transparent no-repeat 7px 45%;
		border-style: none;
	}
	
	.buttonLink a:active {
		padding: 4px 20px;
	}

	
/* ---------------- */
/* --- metaMenu --- */
/* ---------------- */

#metaMenu {
	font-size: 0.85em;
	width: 13.6em;
	max-width: 100%;
	height: 1.5em;
	margin: 8px auto 0;
	overflow: hidden;
}

	#metaMenu li {
		float: left;
		height: 1.5em;
		padding: 0 0 0 12px;
		background: url(../images/dot_zand.gif) transparent no-repeat left center;
	}
	
	#metaMenu li.laatste {
		float: right;
	}
	
		#metaMenu a:link, #metaMenu a:visited, #metaMenu a:hover, #metaMenu a:focus, #metaMenu a:active {
			color: #801f10;
			text-decoration: none;
		}
	
		#metaMenu a.actief:link, #metaMenu a.actief:visited, #metaMenu a.actief:hover, #metaMenu a.actief:focus, #metaMenu a.actief:active {
			text-decoration: underline;
		}
		
		#metaMenu a:hover, #metaMenu a:focus, #metaMenu a:active {
			text-decoration: underline;
		}