html, body
{
	height: 100%;
	padding: 0;
	margin: 0;
	border: 0;
	background: #362B2B;
	font-size: 16px;
	font-family: garamond, times new roman, times, georgia, palatino, serif;
	text-align: center;
}

#distance
{
	width: 1px;
	height: 50%;
	margin-bottom: -280px;
	/* half of container's height */
	float: left;
}

#wrapper
{
	height: 560px;
	margin: 0 auto;
/*	border: 1px solid #FFF;
	*/
	position: relative;
	/* puts container in front of distance */
	text-align: left;
	width: 800px;
	clear: left;
}

#header
{
	position: absolute;
	margin: 0;
	top: 0;
	left: 0;
	width: 800px;
	height: 110px;
	z-index: 5;
	text-align: center;
}

#header img { 
clear: left;
margin:0px auto 22px auto;
}


#footer
{
	margin: 0 0 0 -73px;
	position: absolute;
	top: 510px;
	left: 0;
	height: 66px;
	width: 900px;
	font-size: 11px;
	z-index: 8;
	color: #999;
	text-align: center;
	text-transform: uppercase;
}

#footer li
{
	display: inline;
	margin: 0;
	padding: 0 6px 0 6px;
	color: #bbb;
	border-left: 1px dotted #999;
}

#footer ul
{
	margin-top: 10px;
}

#footer ul.languagePH
{
	margin: -3px 0 0 0px;
}

#footer li.language
{
	display: inline;
	margin: 0;
	padding: 0 6px 0 6px;
	color: #bbb;
	height: 11px;
	border-left: 0px;
}

#footer li.language img
{
	margin: 0px 4px -1px 0;
}




#footer a
{
	color: #aaa;
	text-decoration: none;
}

#footer a:hover
{
	color: #fff;
	border-bottom: 1px dotted;
}

#fullwidth
{
width: 800px;
	height: 400px;
	background: #fff;
	position: absolute;
	top: 110px;
	bottom: 26px;
	z-index: 99;
	}

#left1, #left2
{
	width: 400px;
	height: 400px;
	background: #fff;
	position: absolute;
	top: 110px;
	bottom: 26px;
	z-index: 4;
	overflow: auto;
}

#left1 { font-size: 1em; }

#left2
{
	left: 400px;
	overflow: auto;
}


#left2 p#capps2
{
margin: 0px 10px -2px 0px;
font-size: 11px;
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
}


#left2 div.options
{
	margin: 10px 20px 0px 20px;
}                         


#left2 div.options img
{
	margin: 3px 2px -2px 0;
}


#left2 div.options a
{
margin: 0px 10px -2px 0px;
font-size: 11px;
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
}

#left2 div.options a:hover
{
	color: #000;
	border-bottom: 1px dotted;
}


#left2 div#contentwrap, #fullwidth div#contentwrap
{
padding: 20px 0px 20px 0px;
margin: 0px;
}

#fullwidth div#contentwrap
{
	text-align: center;

}


#fullwidth div#contentwrap ul.footer
{
	margin: 35px 20px 10px 20px;
	font-size: 10px;
	color: #000;
	text-align: center;
	text-transform: uppercase;
}

#fullwidth div#contentwrap ul.footer li
{
	display: inline;
	margin: 0;
	padding: 0 3px 0 3px;
	color: #000;
}



#left2 p, #fullwidth p
{
	margin: 0px;
	padding: 0px 20px 10px 20px;
	word-spacing: 0;
	letter-spacing: 0;
	line-height: 18px;
	font-size: 15px;
}

#ornament
{
	margin: -20px 0 0 0;
}


#left2 p.footnote
{
	margin: 0px;
	padding: 5px 5px 0px 20px;
	word-spacing: 0;
	letter-spacing: 0;
	line-height: 12px;
	font-size: 11px;
}


h1
{
	margin: 0px 20px 5px 20px;
	word-spacing: 0;
	text-align: left;
	letter-spacing: -1;
	line-height: 18px;
	font-size: 22px;
	font-style: italic;
	font-weight: normal;
}

h2
{
	margin: 10px 20px 5px 20px;
	word-spacing: 0;
	text-align: left;
	letter-spacing: -1;
	line-height: 18px;
	font-size: 18px;
	font-style: italic;
	font-weight: normal;
}

.ornament
{
position: relative;
float: left;
margin-right: 0px;
margin-left: 0px;
}

#ornament
{
	margin: -20px 0 0 0;
}

/*
Formulier
*/


form
{
margin:0px;
padding:0px;
border:0px;
}

#left2 div#contentwrap div#kiezer, div#send
{
margin: 0 20px 5px 20px;
padding: 10px;
border: 1px solid #BBB;
background-color: #F3F3F3;
}

#left2 div#contentwrap div#info, div#offerte, div#terugbel, div#send
{
margin: 0px;
padding: 0px;
}

p#ster
{
	padding: 0px;
	margin: -4px 0 0 0;
	font-size: 9px;
	color: gray;
	float: right;
	z-index: 10;
}

p#capps
{
	margin: 0px 5px 2px 5px;
	padding: 0px;
	font-size: 10px;
	font-weight: normal;
	text-transform: uppercase;
	display: inline;
	float: left;
}

#left2 div#tableHold
{
margin: 0 20px 5px 20px;
padding: 7px;
border: 1px solid #BBB;
background-color: #F3F3F3;
}

p#tableTitle
{
	margin: 0px 5px 2px 5px;
	padding: 0px;
	font-size: 10px;
	font-weight: normal;
	text-transform: uppercase;
	display: inline;
	float: left;
}

p#tableContent
{
	margin: 0px;
	padding: 0px;
	font-weight: normal;
	display: inline;
	float: left;
}

p#tableHelp
{
	margin: 2px 5px 5px 5px;
	padding: 0px;
	font-weight: normal;
	display: inline;
	float: left;
}

.validation-advice
{
	margin: 5px 5px 5px 0px;
	padding: 0px;
	font-weight: normal;
	display: block;
	float: left;
	font-size:12px;
	color:red;
}

#left2 label
{
	margin: 0px;
	padding: 0px;
	word-spacing: 0;
	letter-spacing: 0;
	font-size: 13px;
}


/*
Kalender CSS
*/


input.dashboard,
select.dashboard {
	width: 149px;
}

button.dashboard {
	background: url(images/dashboard-icon.gif);
	border: 0;
	cursor: pointer;
	height: 20px;
	margin-right: 10px;
	width: 20px;
}
button.dashboard:hover,
button.dashboard.active {
	background-position: 0 20px;
}

div.dashboard {
	background: url(images/dashboard.png);
	height: 175px;
	padding: 0 12px;
	text-align: center;
	width: 147px;
}	
	div.dashboard * {
		margin: 0;
		padding: 0;
	}	
	div.dashboard div {
		background: none !important;
		cursor: move;
		height: 165px;
		overflow: hidden;
		padding-top: 5px;
		position: relative;
		width: 147px;
	}	
	
	div.dashboard caption {
		color: #362B2B;
		font: normal 12px/17px Arial, Helvetica, sans-serif;;
		padding-top: 4px;
		text-align: center;
		width: 100%;
	}
	div.dashboard caption a {
		cursor: pointer;
		display: block;
		height: 11px;
		overflow: hidden;
		position: absolute;
		text-indent: -100px;
		top: 16px;
		width: 11px;
	}
	div.dashboard caption a.prev {
		background-image: url(images/dashboard-prev.gif);
		left: 1px;
	}
	div.dashboard caption a.next {
		background-image: url(images/dashboard-next.gif);
		right: 1px;
	}
	div.dashboard caption a:hover {
		background-position: 0 11px;
	}
	div.dashboard caption span {
		height: 25px;
		position: relative;
		text-align: center;
	}
	div.dashboard caption span.month {
		padding-right: 8px;
	}
	div.dashboard caption span.month:after {
		content: ',';
	}

	div.dashboard table {
		border: 0;
		border-collapse: collapse;
		border-spacing: 0;
		cursor: default;
		margin: 0 auto;
		overflow: hidden;
		width: 147px;
	}
	div.dashboard td,
	div.dashboard th {
		border: 0;
		color: #362B2B;
		font: normal 12px Arial, Helvetica, sans-serif;
		height: 19px;
		text-align: center;
		width: 21px;
	}
	div.dashboard td {
		color: #362B2B;
		font-size: 11px;
		padding-right: 5px;
		text-align: right;
		width: 16px;
	}
	div.dashboard td.invalid {
		color: #CCC;
	}
	div.dashboard td.valid {
		background-color: #DDD;
		color: #362B2B;
		cursor: pointer;
	}
	div.dashboard td.active,
	div.dashboard td.hover {
		color: #FFF;
		background-color: #362B2B;
		cursor: pointer;
	}


input, textarea {
	border: 1px solid #BBB;
	background: #fff;
	color : #000;
}

input.validation-failed, textarea.validation-failed {
	border: 1px solid #FF3300;
	color : #000;
}

input.validation-passed, textarea.validation-passed {
	border: 1px solid #BBB;
	color : #000;
}


.validation-advice {
	margin: 2px 0 5px 0;
	color : #FF3300;
	float:left;
	width: 100%;
}




/* END OF THE FORMS CSS*/
/* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after
{
	content: ".";
	/* the period is placed on the page as the last thing before the div closes */
	display: block;
	/* inline elements don't respond to the clear property */
	height: 0;
	/* ensure the period is not visible */
	clear: both;
	/* make the container clear the period */
	visibility: hidden;
	/* further ensures the period is not visible */
}

.clearfix { display: inline-block; }

/* a fix for IE Mac */
/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */