/*
 * Default styles
 */
* {
	padding: 0;
	margin: 0;
}

html {
	overflow-y: scroll;
}

body {
	font: 12px/18px Arial, Helvetica, sans-serif;
	text-align: justify;
	color: #002244;
	background: #f9e11e;
}

p,
ul,
ol {
	margin: 0 0 18px;
}

ul,
ol {
	padding-left: 25px;
}

ul ul,
ul ol,
ol ol,
ol ul {
	margin: 0;
}

h2 {
	font: bold 36px/48px Arial, Helvetica, sans-serif;
	text-align: left;
	letter-spacing: -2px;
	margin: -5px 0 39px;
}

h3 {
	font: bold 14px/18px Arial, Helvetica, sans-serif;
	text-align: left;
	margin: 0 0 18px;
}

a {
	color: #002244;
	text-decoration: underline;
}

img {
	vertical-align: bottom;
	border: 0;
}

hr {
	clear: both;
	height: 0;
	margin: 0 -10px 18px;
	border: solid #d9dee3;
	border-width: 0 0 1px;
}

span.pipe {
	padding: 0 3px;
}

input.input,
textarea.input,
input.submit,
input.button,
button {
	font: 12px/18px Arial, Helvetica, sans-serif;
	color: #002244;
	background: transparent;
	padding: 2px 4px;
	border: 1px solid #002244;
}

textarea.input {
	overflow: auto;
	height: 72px;
}

input.required,
textarea.required {
	padding-left: 3px;
	border-left: 2px solid #002244;
}

input.ivld,
textarea.ivld {
	background: #d9dee3;
}

/*
 * Wrapper
 */
#wrapper {
	background: #fff url(../images/background-gradient.png) repeat-y;
	overflow: hidden;
	width: 1040px;
	margin: 0 auto;
}

/*
 * Header
 */
#header {
    position: relative;
	background: url(../images/background-gradient.png) no-repeat -1040px 0;
	height: 320px;
	padding: 20px 30px 0 140px;
}

	/* Logo */
	#header h1 {
		position: absolute;
		top: 20px;
		left: 30px;
		z-index: 1;
		text-indent: -9999px;
		background: url(../images/duijnisveld-logo-nl.png) no-repeat;
		width: 320px;
		height: 320px;
	}
	
		.en #header h1 {
			background-image: url(../images/duijnisveld-logo-en.png);
		}
		
		.de #header h1 {
			background-image: url(../images/duijnisveld-logo-de.png);
		}
		
		#header h1 img {
		    position: absolute;
		    top: 0;
		    left: 0;
		    display: block;
		    width: 100%;
		    height: 100%;
		}
	
	/* Images */
	#header .images {
	    overflow: hidden;
		height: 210px;
	}
	
	/* Actionbar */
	#header .actionbar {
		position: relative;
		z-index: 1;
		font-size: 10px;
		line-height: 30px;
		color: #7f90a1;
		background: #002244 url(../images/actionbar.png) no-repeat;
		overflow: hidden;
		height: 30px;
		padding: 0 10px 0 40px;
	}
	
		#header .actionbar a {
			color: #7f90a1;
			text-decoration: none;
		}
		
			#header .actionbar a:hover {
				color: #fff;
			}
	
		#header .actionbar .tel {
			float: right;
			color: #fff;
			margin: 0;
		}
		
		/* Languages */
		#header .actionbar .languages {
			float: right;
			list-style: none;
			padding: 0;
			margin: 0 15px 0 0;
		}
		
			#header .actionbar .languages li {
				float: left;
				padding: 10px 5px 7px;
			}
			
				#header .actionbar .languages li a {
					display: block;
					text-indent: -9999px;
					background: url(../images/languages.png) no-repeat;
					overflow: hidden;
					width: 18px;
					height: 13px;
				}
				
					#header .actionbar .languages li.nl a { background-position: 0 0; }
					.nl #header .actionbar .languages li.nl a,
					#header .actionbar .languages li.nl a:hover { background-position: -18px 0; }
					
					#header .actionbar .languages li.en a { background-position: 0 -13px; }
					#header .actionbar .languages li.en a:hover,
					.en #header .actionbar .languages li.en a { background-position: -18px -13px; }
					
					#header .actionbar .languages li.de a { background-position: 0 -26px; }
					#header .actionbar .languages li.de a:hover,
					.de #header .actionbar .languages li.de a { background-position: -18px -26px; }
		
		/* Breadcrumbs */
		#header .actionbar .breadcrumbs {
			float: left;
			list-style: none;
			height: 30px;
			padding: 0;
			margin: 0;
		}
		
			#header .actionbar .breadcrumbs li {
				display: inline;
				color: #fff;
			}
			
				#header .actionbar .breadcrumbs li ul {
					display: inline;
					background: url(../images/arrows.png) no-repeat;
					padding-left: 14px;
				}

/*
 * Container
 */
#container {
	position: relative;
	z-index: 1;
	background: url(../images/background.png) no-repeat 30px 0;
	overflow: hidden;
	width: 980px;
	padding: 50px 30px 88px;
	margin: -80px 0 -18px;
}

/*
 * Navigation
 */
#navigation {
	float: left;
	display: inline;
	list-style: none;
	text-align: left;
	width: 205px;
	padding: 0;
	margin: 0 0 0 100px;
	border: solid #d9dee3;
	border-width: 0 0 1px;
}

	#navigation li {
		float: left;
		width: 100%;
	}
	
		#navigation li a {
			display: block;
			text-indent: -9999px;
			width: 185px;
			height: 35px;
			padding: 0 10px;
			border: solid #d9dee3;
			border-width: 1px 0 0;
			outline: none;
		}
		
			#navigation li a.sub-active {
				background-position: -205px 0;
			}
			
			#navigation li a:hover {
				background-position: -410px 0;
			}
			
			#navigation li a.active,
			#navigation li a.active:hover {
				background-position: -615px 0;
			}
			
			/* Sub-navigation */
			#navigation li ul {
				float: left;
				list-style: none;
				background: #002244;
				padding: 0 0 6px;
				margin: -5px 0 0;
			}
			
				#navigation li ul li {
					margin: -6px 0;
				}
			
					#navigation li ul li a {
						font-size: 12px;
						line-height: 33px;
						text-indent: -1px;
						text-decoration: none;
						color: #7f90a1;
						background: url(../images/arrows.png) no-repeat 100% -181px;
						height: 33px;
						border: 0;
					}
				
						#navigation li ul li a:hover {
							color: #f9e11e;
							background-position: 100% -217px;
						}
	
						#navigation li ul li a.active,
						#navigation li ul li a.active:hover {
							color: #fff;
							background-position: 100% -253px;
						}

/*
 * Content
 */
#content {
	float: right;
	display: inline;
	width: 465px;
	padding: 0 10px;
	margin-right: 100px;
}

	#content img {
		margin: 0 0 18px;
		border: 1px solid #d9dee3;
	}
	
		#content img.align-right {
			float: right;
			clear: both;
			margin: 5px 0 18px 25px;
		}
		
		#content img.align-left {
			float: left;
			clear: both;
			margin: 5px 25px 18px 0;
		}
		
		#content .columns {
		    overflow: hidden;
		    width: 490px;
		    margin: 0 0 0 -25px;
		}
		
		    #content .columns .column {
		        float: left;
		        display: inline;
		        width: 220px;
		        margin-left: 25px;
		    }
		
	/* Form */
	#content form p {
		clear: left;
		overflow: hidden;
		margin: 0 0 8px;
	}
	
	#content form label {
		float: left;
		display: inline;
		text-align: left;
		width: 105px;
		padding-right: 5px;
	}
	
	#content form hr {
		margin: 18px -10px;
	}
	
	#content form input.input,
	#content form textarea.input {
		float: left;
		display: inline;
		width: 345px;
	}
	
	#content form input.button,
	#content form input.submit,
	#content form button {
	    display: inline;
		margin-left: 110px;
	}
	
	/* Image list */
	#content ul.images {
		list-style: none;
		overflow: hidden;
		width: 490px;
		margin: 0 0 0 -25px;
		padding: 4px 0 0;
	}
	
		#content ul.images li {
			float: left;
			display: inline;
			margin-left: 25px;
		}

/*
 * Footer
 */
#footer {
	clear: both;
	text-align: center;
	background: url(../images/background-gradient.png) no-repeat -2080px 100%;
	height: 30px;
	padding: 18px 30px 0;
}

	#footer p,
	#footer p small {
		color: #ac960e;
		font-size: 10px;
		line-height: 30px;
		margin: 0;
	}
	
	#footer a {
		color: #ac960e;
		text-decoration: none;
	}
	
		#footer a:hover {
			text-decoration: underline;
		}