/*------------------------------------------------------------------
[Master Stylesheet]

Template:		Fixed width with sticky footer
Version:		1.0
Last change:	2008/07/26
Primary use:	Website (screen)
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
[Website Dimensions]
-------------------------------------------------------------------*/
/* Width of the website */
#container, #header-content, #footer #footer-content { width: 896px; }
/* Height of the header */
#header, #header-content { height: 180px; }
/* Height of the header and height of the footer */
#wrapper { padding: 180px 0 65px; }
/* Height of the footer and its negative value */
#footer { height: 65px; margin: -65px auto 0; }
/* Height of the footer */
#footer #footer-content { height: 40px; padding: 25px 34px 0; width: 828px; }


/*------------------------------------------------------------------
[Template styles]
-------------------------------------------------------------------*/
* {
	font-family: Arial, Helvetica, sans-serif;
}

body { background: #f1f1f1; }
#header { background: transparent url("/img/header-repeat.gif") repeat-x left top; }
#header #header-content { background: transparent url("/img/header.jpg") no-repeat center bottom; }
#container { background: transparent url("/img/content-repeat.jpg") repeat-y center top; }
#content { background: transparent; }
#footer { background: transparent; }
#footer #footer-content { background: transparent url("/img/footer-bg.jpg") no-repeat center top; }

/*------------------------------------------------------------------
[Template]
-------------------------------------------------------------------*/
* {
	outline: none;
}

body, html {
	color: #555555;
	height: 100%;
	margin: 0px;
	padding: 0px;
}

#container {
	height:auto;
	margin: 0px auto;
	min-height:100%;
	position: relative;
	text-align: left;
}

#header {
	left: 0px;
	position: absolute;
	text-align: center;
	top: 0px;
	width: 100%;
}
	#header-content {
		margin: 0 auto;
		padding-left: 210px;
		width: 686px;
	}
		#header-content h1 {
			margin: 0;
			padding: 0;
			font-size: 14px;
		}
		#header-content .header-btn {
			background: transparent url('/img/header-separator.gif') no-repeat right top;
			float: left;
			font-size: 12px;
			margin: 2px 0 0 20px;
			padding: 3px 20px 0 0;
			text-align:left;
		}
			#header-content .header-btn img {
				margin-right: 8px;
			}
			#header-content .header-btn a {
				color: #555555;
				display: block;
			}
			#header-content .no-bg {
				background: transparent;
			}

#wrapper {
	position: relative;
}
	#content {
		padding-left: 264px;
		position: relative;
		width: 600px;
		
		/* min-height hack for ie6 */
		min-height: 375px;
		height: auto !important;
		height: 375px;
	}
	
	#navigation {
		left:14px;
		list-style-type: none;
		margin: 0;
		padding: 0;
		position:absolute;
		top:185px;
		width:185px;
	}
		#navigation li {
			list-style-type: none;
		}
			#navigation li a {
				display: block;
				height: 24px;
				position: relative;
				text-indent: -9999px;
			}
					#navigation li ul {
						list-style-type: none;
						padding: 0;
						margin: 3px 0 8px 55px;
					}
						#navigation li ul a {
							color: #8f8f8f;
							display: inline;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 12px;
							font-weight:bold;
							line-height: 19px;
							text-decoration:none;
							text-indent: 0;
						}
						#navigation li ul a:hover {
							color: #377bc4;
						}
						#navigation li ul a.active {
							color: #ff8400;
						}
						
				#navigation a span {
					background-position: 0 0;
					background-repeat: no-repeat;
					cursor: pointer;
					display: block;
					height: 24px;
					left: 0px;
					position: absolute;
					top: 0;
					width: 185px;
				}
				#navigation a:hover {
					border: none; /* Fixes a bug in IE 6 */
				}
				#navigation a:hover span {
					background-position: 0px -24px;
				}
				#navigation a.active span {
					background-position: 0px -48px;
				}
				#navigation li a.home span { background-image: url("/img/navigation/home.jpg"); }
				#navigation li a.activiteiten span { background-image: url("/img/navigation/activiteiten.jpg"); }
				#navigation li a.producten span { background-image: url("/img/navigation/producten.jpg"); }
				#navigation li a.service span { background-image: url("/img/navigation/service.jpg"); }
				#navigation li a.premies span { background-image: url("/img/navigation/premies.jpg"); }
				#navigation li a.voor-wie span { background-image: url("/img/navigation/voor-wie.jpg"); }
				#navigation li a.evenementen span { background-image: url("/img/navigation/evenementen.jpg"); }
				#navigation li a.realisaties span { background-image: url("/img/navigation/realisaties.jpg"); }
				#navigation li a.aanvraag span { background-image: url("/img/navigation/aanvraag.jpg"); }
				#navigation li a.contact span { background-image: url("/img/navigation/contact.jpg"); }
				#navigation li a.nieuws span { background-image: url("/img/navigation/nieuws.jpg"); }

#footer {
	position: relative;
	text-align: center;
	width: 100%;
}
	#footer #footer-content {
		color: #898989;
		font-size: 11px;
		margin: 0 auto;
		position: relative;
		text-align: center;
	}
		#footer #footer-content a,
		#footer #footer-content a:link,
		#footer #footer-content a:visited {
			color: #888888;
			font-size: 11px;
			text-decoration: underline;
		}


/*------------------------------------------------------------------
[Links]
-------------------------------------------------------------------*/
a, a:link, a:visited {
	color: #2383C2;
}
a.active, a:hover, a:focus{
	color: #f57e00;
}


/*------------------------------------------------------------------
[Paragraphs, text, lists]
-------------------------------------------------------------------*/
#content h1 {
	background: transparent url("/img/h1-big.gif") no-repeat left bottom;
	font-size: 20px;
	font-weight: normal;
	margin: 0;
	padding: 0 0 26px;
}
#content h2,
#content h3 {
	clear: both;
	color:#494949;
	font-size:18px;
	font-weight:normal;
	margin: 0;
	padding: 12px 0 8px;
}
#content h3 {
	font-size:16px;
	font-weight:bold;
}
p, ul, li {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 140%;
	margin: 0 0 15px;
	padding: 0;
}
td {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 140%;
}
ul {
	padding-left: 40px;
}
li {
	line-height: normal;
	margin:0;
	padding-bottom: 5px;
}
blockquote {
    margin: 10px 25px;
    color: #888888;
    border-left: 2px solid #888888;
	font-size: 13px;
	font-style: italic;
    padding-left: 15px;
}


#content .gray, .grey,
#content .gray *, .grey * {
	color: #aaaaaa;
	font-size: 11px;
	font-style: italic;
}

.normal, .normal * {
	line-height: normal;
}
.indent10 {
	margin-left: 10px;
}
.indent20 {
	margin-left: 20px;
}
.center {
	text-align: center;
}
.bold {
	font-weight: bold;
}

/*------------------------------------------------------------------
[Form elements]
-------------------------------------------------------------------*/
.fullwidth {
	width: 98%;
}
select.fullwidth {
	width: 99%;
}


/*------------------------------------------------------------------
[Structural elements]
-------------------------------------------------------------------*/
.fl-left {
	float: left;
}
.fl-right {
	float: right;
}
img.fl-left {
	margin-right: 10px;
}
img.fl-right {
	margin-left: 10px;
}
#content img.fl-left,
#content img.fl-right {
	margin-bottom: 5px;
	margin-bottom: 5px;
}
.clear {
	clear: both;
	float: none;
	font-size: 0px;
	height: 0px;
	line-height: 0px;
}
.no-margin, p.no-margin {
	margin: 0;
}
.small-margin {
	margin: 0 0 10px;
}


/*------------------------------------------------------------------
[Form elements]
-------------------------------------------------------------------*/
#content label.checked {
	background: #f9f9f9 url('/img/chk_on.gif') no-repeat 8px center;
	border: 1px solid #888888;
	clear: both;
	color: #555555;
	cursor: pointer;
	display: block;
	/*font-size: 0.75em;*/
	font-size: 11px;
	margin-bottom: 5px;
	/*margin-right: 3px;*/
	padding: 0.2em 0.2em 0.2em 32px;
}
#content label.unchecked {
	background: #f9f9f9 url('/img/chk_off.gif') no-repeat 8px center;
	border: 1px solid #888888;
	clear: both;
	color: #555555;
	cursor: pointer;
	display: block;
	/*font-size: 0.75em;*/
	font-size: 11px;
	margin-bottom: 5px;
	/*margin-right: 3px;*/
	padding: 0.2em 0.2em 0.2em 32px;
}
#content label {
	/*font-size: 0.7em;*/
	font-size: 12px;
}
#content .styled input, #content .styled textarea, #content .styled select, #content .styled button {
	background: #f9f9f9;
	border: 1px solid #888888;
	color: #555555;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*font-size: 0.7em;*/
	font-size: 11px;
}
#content .styled input {
	line-height: 1.5em;
	height: 1.5em;
}
#content .styled textarea {
	height: 5.4em;
	overflow: auto;
}
#content input.button {
	background-color: #f9f9f9;
	border: 1px solid #888888;
	display: inline;
	float: right;
	height: 2.4em;
	line-height: 1.2em;
	overflow: visible;
	padding: 0.5em;
	width: auto;
}
#content input.button.busy {
	background: #f9f9f9 url('/img/loader.gif') no-repeat 0.5em center;
	padding-left: 32px;
}
#content .left-col {
	float: left;
	/*padding-left: 40px;*/
	padding-bottom: 4px;
	width: 49%;
}
#content .right-col {
	float: right;
	padding-bottom: 4px;
	width: 49%;
}
#content .styled input, #content .styled textarea, #content .styled select {
	display: block;
	/*padding: 2px 4px;*/
	width: 100%;
}