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

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

/* 1 Global
--------------------------------------------------------------------*/
* {
	font-family: arial;
	font-size: 12px;
	color: #6b6b6b;
	line-height: 18px;
}

img {
	border: 0;
}

h1 {
	margin: 0;
	padding: 0;
	color: #283891;
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 10px;
}

a {
	text-decoration: none;
	color: #1889b7;
}

a:hover {
	text-decoration: none;
	color: #6b6b6b;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

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

body {
	margin: 0;
	padding: 0;
	text-align: center;
}

/* 2 Container
----------------------------------------------------------------*/
div.container {
	position: relative;
	width: 1000px;
	margin: 0 auto;
	text-align: left;
	z-index: 7;
}

/* 3 Header
----------------------------------------------------------------*/
div#header {
	position: relative;
	width: 100%;
	text-align: center;
	z-index: 5;
	height: 137px;
	background: url(css/images/bg_header.jpg) repeat-x;
}

	/* 3 Header::Logo
	------------------------------------------------------------*/
	div#header div.container div#logo {
		position: absolute;
		top: 0;
		left: 22px;
		z-index: 7;
	}

	/* 3 Header::Menu
	------------------------------------------------------------*/
	div#header div.container div#menu {
		position: absolute;
		top: 18px;
		right: 0;
		z-index: 7;
	}

		div#header div.container div#menu li {
			float: left;
			padding-left: 15px;
		}

			div#header div.container div#menu li a {
				position: relative;
				z-index: 6;
				color: #fff;
				font-size: 14px;
			}

	div#header div.container div#menu div.hover {
		position: absolute; 
		display: none;
		background: url(css/images/bg_menuhover.png) repeat-x; 
		height: 30px;
		top: -6px;
		z-index: 5;
	}

		div#header div.container div#menu div.hover div.left {
			position: absolute;
			width: 4px;
			height: 30px;
			top: 0;
			left: 0;
			background: url(css/images/bg_menuhover-left.png) no-repeat;
		}

		div#header div.container div#menu div.hover div.right {
			position: absolute;
			width: 4px;
			height: 30px;
			top: 0;
			right: 0;
			background: url(css/images/bg_menuhover-right.png) no-repeat;
		}

	/* 3 Header::Quote
	------------------------------------------------------------*/
	div#header div.container div.quote {
		position: absolute;
		top: 80px;
		left: 400px;
		z-index: 7;
		padding: 0 0 0 50px;
		background: url(css/images/img_quote.png) no-repeat 0 4px;
	}
	
		div#header div.container div.quote p {
			color: #a3a3a3;
			margin: 0;
			padding: 0;
			font-size: 14px;
		}

	/* 3 Header::Home
	------------------------------------------------------------*/
	div#header.home {
		height: 472px;
		background: url(css/images/bg_headerhome.jpg) repeat-x;
	}


	div#header div.container div#headertext {
		position: absolute;
		top: 190px;
		left: 30px;
		width: 370px;
		z-index: 7;
	}
	
		div#header div.container div#headertext h1.first {
			font-weight: bold;
			font-size: 36px;
			color: #fff;
			margin: 0;
		}
		
		div#header div.container div#headertext h1.second {
			font-weight: bold;
			font-size: 54px;
			margin: 0;
		}

		div#header div.container div#headertext p {
			color: #fff;
			margin: 0;
		}

	div#header div.container div#subtext {
		position: absolute;
		top: 405px;
		left: 30px;
		z-index: 7;
	}

		div#header div.container div#subtext h1.first {
			color: #00aeef;
			margin: 0;
			font-size: 24px;
		}

		div#header div.container div#subtext h1.second {
			font-size: 24px;
		}

	div#header div.container div#carwashsplash {
		position: absolute;
		top: 73px;
		left: 425px;
		z-index: 7;
	}

	div#header div.container div.glow {
		position: absolute;
		top: 63px;
		left: -140px;
		width: 1280px;
		height: 323px;
		z-index: 6;
		background: url(css/images/bg_glow.jpg) no-repeat;
	}

/* 4 Middle::Home
----------------------------------------------------------------*/
div.col {
	position: relative;
	float: left;
	width: 300px;
	padding: 30px 0 30px 30px;
}

	div.col h1.light {
		color: #30bdf2;
	}
	
	div.col p.quote {
		padding-left: 53px;
		background: url(css/images/bg_quote.jpg) no-repeat;
	}

/* 4 Middle::About
----------------------------------------------------------------*/
div.contentheader {
	position: relative;
	width: 100%;
	text-align: center;
	height: 514px;
	/*height: 387px;*/
	z-index: 6;
}

div.contentheader.green {
	background-color: #3b8a05; /*#297003;*/
}

	div.contentheader div.container div.glowabout {
		position: absolute;
		top: 0;
		left: -140px;
		width: 1274px;
		height: 514px;
		z-index: 6;
		background: url(css/images/bg_glowabout.jpg) no-repeat;
	}

	div.contentheader div.left {
		position: relative;
		float: left;
		width: 662px;
		padding-top: 30px;
		z-index: 7;
	}

		div.contentheader div.left div.imagecontainer {
			position: relative;
			width: 594px;
			height: 343px;
			padding: 14px 0 0 68px;
			left: -37px;
			background: url(css/images/bg_imagecontainer.png) no-repeat;
		}

	div.contentheader div.right {
		position: relative;
		float: left;
		padding-top: 30px;
		width: 335px;
		left: -37px;
		z-index: 7;
	}

		div.contentheader.green div.right {
			color: #fff;
		}

		div.contentheader div.right * {
		}

		div.contentheader.green div.right * {
			color: #fff;
		}

		div.contentheader.green div.right a {
			color: #1889b7;
		}

		div.contentheader div.right h1 {
			font-size: 36px;
		}

div.container div.col div.imagecontainer-small {
	position: relative;
	width: 292px;
	height: 113px;
	left: -37px;
	padding: 17px 0 20px 38px;
	background: url(css/images/bg_imagecontainer_small.png) no-repeat;
}

div.container div.col h2 {
	font-size: 20px;
	color: #515151;
	margin: 0;
	padding: 0;
}

/* 4 Middle::Washes
----------------------------------------------------------------*/
div.container div.wash {
	position: relative;
	float: left;
	width: 290px;
	margin-left: 30px;
	padding-top: 30px;
}

	div.container div.wash div.top {
		position: relative;
		width: 273px;
		height: 83px;
		padding: 17px 0 0 17px;
		background: url(css/images/bg_topwasprogramma.jpg) no-repeat;
	}

		div.container div.wash div.top h1 {
			color: #fff;
			font-size: 24px;
			padding: 0 0 10px 0;
			text-transform: uppercase;
			margin: 0;
		}

		div.container div.wash div.top h2 {
			color: #fff;
			font-size: 30px;
			margin: 0;
			padding: 0 0 0 38px;
			background: url(css/images/icn_plus.png) no-repeat;
			text-transform: uppercase;
		}

	div.container div.wash div.middle {
		position: relative;
		padding: 20px 0 0 20px;
		background-color: #efefef;
	}

		div.container div.wash div.middle ul {
			list-style-image: url(css/images/icn_smallplus.png);
			margin: 0 0 0 20px;
		}

	div.container div.wash div.price {
		position: relative;
		background-color: #efefef;
		padding: 15px 0 10px 30px; 
	}

		div.container div.wash div.price p {
			font-size: 42px;
			font-weight: bold;
			color: #0c6a9e;
			margin: 0;
			padding: 0;
		}

div.container div.washcontenttop {
	position: relative;
	padding: 20px 50px 0 30px;
}

div.container div.washcontent {
	position: relative;
	padding: 10px 0 30px 30px;
}

div.container.bubbles {
	background: url(css/images/bg_bubbles.png) no-repeat right bottom;
}

/* 4 Middle::Action
----------------------------------------------------------------*/
div.container.action {
	min-height: 562px;
	background: url(css/images/img_action.jpg) no-repeat right bottom;
}

	div.actions {
		position: relative;
		padding: 10px 0 0 30px;
	}

		div.actions h1.big {
			font-size: 52px;
			color: #00aeef;
		}

		div.actions div.content {
			position: relative;
			background: #efefef;
			padding: 20px 20px 40px 20px;
			width: 500px;
		}

		div.actions div.content div.formLabel {
			position: relative;
			float: left;
			height: 29px;
			width: 56px;
			padding-bottom: 5px;
		}

		div.actions div.content div.formField {
			position: relative;
			float: left;
			height: 29px;
			padding-bottom: 5px;
		}

			div.actions div.content div.formField input {
				width: 165px;
				height: 29px;
				background: url(css/images/bg_input.png) no-repeat;
				border: 0;
			}

/* 4 Middle::Washbox
----------------------------------------------------------------*/
div.container div.boxleft {
	position: relative;
	float: left;
	width: 609px;
	padding: 20px 0 30px 30px;
}
	
	div.container div.boxleft div.imagelarge {
		width: 601px;
		height: 350px;
		padding: 8px 0 0 8px;
		background: url(css/images/bg_washboxlarge.jpg) no-repeat;
	}

	div.container div.boxleft div.smallcol {
		position: relative;
		float: left;
		width: 198px;
		padding: 15px 7px 0 0;
	}

	div.container div.boxleft div.smallcol.last {
		padding-right: 0;
	}

		div.container div.boxleft div.smallcol h1.light {
			color: #30bdf2;
			font-size: 22px;
		}

		div.container div.boxleft div.smallcol h2 {
			font-size: 18px;
			color: #515151;
			margin: 0;
			padding: 0;
		}

		div.container div.boxleft div.smallcol div.imagecontainer-small {
			position: relative;
			width: 190px;
			height: 113px;
			padding: 8px 0 0 8px;
			margin-bottom: 15px;
			background: url(css/images/bg_imagebox_small.png) no-repeat;
		}

div.container div.boxright {
	position: relative;
	float: left;
	padding: 10px 10px 0 10px;
	margin: 20px 0 30px 35px;
	width: 290px;
	background-color: #ebebeb;
}

		div.container div.boxright ul {
			list-style-image: url(css/images/icn_smallplus.png);
			margin: 0 0 0 20px;
		}

		div.container div.boxright h2 {
			color: #00aeef;
			font-size: 22px;
			font-weight: normal;
		}

		div.container div.boxright p.btn {
			text-align: center;
			padding: 10px 0;
		}

/* 4 Middle::Washcard
----------------------------------------------------------------*/
div.contentheader div.left.carwashpas {
	padding-top: 65px;
}

div.col4 {
	position: relative;
	float: left;
	width: 215px;
	padding: 30px 0 30px 25px;
}

	div.col4.first {
		padding: 30px 0 30px 30px;
	}

	div.col4 h1.light {
		color: #30bdf2;
	}

	div.col4 h2 {
		font-size: 20px;
		color: #515151;
		margin: 0;
		padding: 0;
	}

/* 4 Middle::Login
----------------------------------------------------------------*/
div.loginleft {
	position: relative;
	float: left;
	width: 500px;
}

div.loginright {
	position: relative;
	float: left;
	width: 500px;
}

/* 4 Middle::Aanmelden
----------------------------------------------------------------*/
div.signup {
	position: relative;
	padding: 30px 0;	
}

	div.signup div.left {
		position: relative;
		width: 280px;
		float: left;
		min-height: 506px;
		background: url(css/images/bg_signupshadow.jpg) no-repeat center right;
	}

		div.signup div.left ul.steps {
		}

			div.signup div.left ul.steps li {
				font-size: 16px;
				padding: 5px 0 15px 20px;
				background: url(css/images/li_arrow.jpg) no-repeat;
			}

			div.signup div.left ul.steps li a {
				font-size: 16px;
				color: #6b6b6b;
			}

			div.signup div.left ul.steps li.active a:hover,
			div.signup div.left ul.steps li.active {
				color: #00aeef;
			}

	div.signup div.right {
		position: relative;
		float: right;
		width: 674px;
		min-height: 506px;
	}

		div.signup div.right h1 {
			color: #00aeef;
		}

		div.signup div.right div.extra {
			padding: 10px 0 20px 0;
		}

	div.signup div.formLabel {
		position: relative;
		float: left;
		width: 130px;
		font-size: 16px;
		padding-top: 9px;
	}

		div.signup div.formLabel label {
			font-size: 16px;
		}

	div.signup div.formField {
		position: relative;
		float: left;
		font-size: 16px;
		padding: 2px 0 10px 0;
	}
	
		div.signup div.formField input {
			width: 400px;
			height: 29px;
			padding: 0 4px;
			font-size: 16px;
			border: solid 1px #c4c4c4;
			background: url(css/images/bg_inputshadow.jpg) repeat-x;
		}
	
	div.signup div.formField.noinput {
		padding-top: 9px;
	}
	
	div.signup div#id_company {
		position: relative;
		display: none;
	}
	
	div.signup div.formField input.radio,
	div.signup div.formField input.check {
		width: auto;
		height: auto;
	}
	
	div.signup div.formField input.initials {
		width: 80px;
	}
	
	div.signup div.formField input.insertion {
		width: 80px;
	}
	
	div.signup div.formField input.nr {
		width: 60px;
	}
	
	div.signup div.formField input.suffix {
		width: 40px;
	}
	
	div.signup div.formField input.zip {
		width: 70px;
		text-transform: uppercase;
	}
	
	div.signup div.formField input.phonecode {
		width: 40px;
	}
	
	div.signup div.formField input.phonenet {
		width: 40px;
	}
	
	div.signup div.formField input.phonenumber {
		width: 80px;
	}
	
	div.signup div.formField input.kenteken {
		width: 80px;
		text-transform: uppercase;
	}
	
	div.signup div.right table.overview {
		width: 500px;
	}

		div.signup div.right table.overview th {
			text-align: left;
		}
		
		div.signup div.right table.overview tr {
			text-align: left;
			vertical-align: top;
		}
		
	div.signup div.right table.myoverview {
		width: 550px;
	}	
	
		div.signup div.right table.myoverview th {
			text-align: left;
		}
		
		div.signup div.right table.myoverview tr {
			text-align: left;
			vertical-align: top;
		}
		
	div.signup div.right div.mycards {
		position: relative;
		width: 700px;
		margin: 6px 0 0 2px;
	}
	
		div.signup div.right div.mycards div.col1 {
			position: relative;
			float: left;
			width: 100px;
			vertical-align: top;
		}
		
		div.signup div.right div.mycards div.col2 {
			position: relative;
			float: left;
			width: 80px;
			vertical-align: top;
		}
		
		div.signup div.right div.mycards div.col3 {
			position: relative;
			float: left;
			width: 100px;
			vertical-align: top;
		}
		
		div.signup div.right div.mycards div.col4 {
			position: relative;
			float: left;
			width: 180px;
			vertical-align: top;
			padding: 0;
		}
		
		div.signup div.right div.mycards div.col5 {
			position: relative;
			float: left;
			width: 150px;
			vertical-align: top;
		}
		
		div.signup div.right div.mycards div.kentekenToevoegen {
			display: none;
			padding: 15px 0 20px 0;
		}
		
	div.signup div.right div.profile {
		position: absolute;
		top: 27px;
		left: 550px;
	}
	
		div.signup div.right div.profile table.profile {
			width: 150px;
		}	
		
			div.signup div.right div.profile table.profile td {
				padding: 0 0 5px 0;
			}
			
			div.signup div.right div.profile table.profile th {
				text-align: left;
			}

/* 7 Middle::Contact
----------------------------------------------------------------*/
div.contactleft {
	position: relative;
	float: left;
	width: 465px;
	padding: 30px 0;
}

	div.contactleft td {
		padding-right: 20px;
	}


div.contactright {
	position: relative;
	float: left;
	width: 465px;
	margin-left: 40px;
	padding: 30px 0;
}

	div.contactright div.formField {
		padding-bottom: 10px;		
	}
	
		div.contactright div.formField input {
			width: 400px;
			height: 29px;
			border: solid 1px #c4c4c4;
		}
	
		div.contactright div.formField textarea {
			width: 400px;
			height: 150px;
			border: solid 1px #c4c4c4;
		}

/* 8 Footer
-----------------------------------------------------------------*/
div#footer {
	position: relative;
	background: #096ba2 url(css/images/bg_footer.jpg) repeat-x;
	height: 406px;
	width: 100%;
	margin: 0 auto;
	z-index: 5;
}

	div#footer div.container {
		height: 406px;
	}

	div#footer div.container div.glow {
		position: absolute;
		top: 0;
		left: -140px;
		width: 1280px;
		min-height: 406px;
		z-index: 6;
		background: url(css/images/bg_glowfooter.jpg) no-repeat;
	}

	/* 8 Footer::Head
	-------------------------------------------------------------*/
	div#footer div.container div.left {
		position: relative;
		float: left;
		z-index: 7;
		width: 270px;
		margin-top: 40px;
		padding: 0 25px 0 30px;
		border-right: solid 1px #5eb3cf;
	}

		div#footer div.container div.left h1 {
			font-weight: bold;
			font-size: 36px;
			color: #fff;
			margin: 0;
		}

	div#footer div.container div.right {
		position: relative;
		float: right;
		z-index: 7;
		width: 640px;
		margin-top: 40px;
	}

		div#footer div.container div.right p {
			color: #fff;
		}

	/* 8 Footer::Footercontent
	-------------------------------------------------------------*/
	div#footer div.container div.footercontent {
		position: absolute;
		top: 160px;
		left: 0;
		z-index: 7;
		height: 246px;
	}

		div#footer div.container div.footercontent div.col {
			position: relative;
			float: left;
			width: 300px;
			padding: 20px 0 0 30px;
		}

			div#footer div.container div.footercontent div.col ul.icons li {
				float: left;
				padding: 0 16px 20px 0;
			}

			div#footer div.container div.footercontent div.col ul.icons li.last {
				padding-right: 0;
			}

			div#footer div.container div.footercontent div.col p {
				color: #fff;
			}

			div#footer div.container div.footercontent div.col h1 {
				font-size: 18px;
				color: #fff;
			}

			div#footer div.container div.footercontent div.col div.formLabel {
				position: relative;
				float: left;
				color: #fff;
				height: 29px;
				width: 56px;
				padding-bottom: 5px;
			}

			div#footer div.container div.footercontent div.col div.formField {
				position: relative;
				float: left;
				height: 29px;
				padding-bottom: 5px;
			}

				div#footer div.container div.footercontent div.col div.formField input {
					width: 165px;
					height: 29px;
					background: url(css/images/bg_input.png) no-repeat;
					border: 0;
				}

			div#footer div.container div.footercontent div.col div.formButton {
				position: relative;
				text-align: right;
				width: 233px;
			}

			div#footer div.container div.copyright {
				position: absolute;
				bottom: 14px;
				right: 37px;
				color: #5398bf;
				z-index: 7;
			}

				div#footer div.container div.copyright a {
					color: #5398bf;
					text-decoration: underline;
				}

				div#footer div.container div.copyright a:hover {
					text-decoration: none;
				}


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

.cufon-loading * {
	visibility: hidden !important;	
}

