/*---------------------------------------------------*/
/*--[ CSS Wauters Elektro 2006, copyright Robarov ]--*/
/*---------------------------------------------------*/

* {
	font-size:100%;
	margin:0;
	padding:0;
	}

body {
	background: #e7e6e2 url(../i/layout/bg-body.jpg) 0 0 repeat-x;
	color: #585858;
	font-family: "Lucida Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 70%;
	line-height: 1.8em;
	text-align: center; 
	}

#container {
	background: #fff;
	width: 760px;
	margin: 0 auto;
	text-align: left;
	}
#content {
	background: #fff;
	margin: 10px 0;
	padding-bottom: 10px;
	overflow: auto;
	}
#home #content {
	margin: 10px 20px;
}

		
/*--[ common ]----------------------------------------------------------------*/
h1, h2, h3, h4 { 
	font-weight: normal;
	}
h1 {
	font-size: 2.0em;
	line-height: 28px;
	height: 28px;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0 20px 5px;
	color: #6e6b61;
	}	
	
h2 {
	margin: 0 20px 10px;
	font-size: 1.8em;
	color: #f23a40;
	letter-spacing: 2px;
	}
h3 {
	margin: 0 20px 6px;
	font-size: 1.2em;
	font-weight: bold;
	color: #464646;
	}
h4 {
	margin: 0 20px 4px;
	font-size: 1.0em;
	color: #8c8c8c;
	}
	h4 span {
		color: #e1181f;
	}	
p { 
	margin: 0 20px 5px; 
	}
blockquote {
	font-size: 1.2em;
	color: #f23a40;
	font-weight: bold;
	}
ol {
	margin: 0 30px 15px; 
	}
	
 ul {
	margin: 0 20px 15px; 
	}
	ul li{
		background: url(../i/layout/bullet.gif) 0 0.7em  no-repeat;
		list-style-type: none;
		padding:0 0 0 14px;
		}

a {
	color: #d91017;
	}
	a:hover {
		text-decoration: none;
		background: #f3f2eb;
		}
img { 
	border: none;
	}
.alignleft {
	margin: 0 15px 5px 20px;
	float: left;
	}
.alignright {
	margin: 0 20px 5px 15px;
	float: right;
	}
.highlight { /* highlight important text */
	background: #FFC;
	}
.clear { /* clear floated divs */
	clear: both;
	}
.hide{ /* hides text from broswer */
	position:absolute;
	left:-9999px;
	width:0px;
	overflow:hidden;
	}
.info {
	padding:10px 20px;
	background: #f8f3eb;
	border: 1px solid #ddd1bd;
	color: #88736d;
	}
	
/*--[ header ]----------------------------------------------------------------*/
#header {
	background: #d20e14 url(../i/layout/bg-header.jpg) 0 0 repeat-x;
	height: 130px;
	position: relative;
	}
	#header h2 {
		background: #d20e14 url(../i/layout/logo.gif) 0 0 no-repeat;
		width: 374px;
		padding-top: 58px;
		height: 0px !important;
		overflow: hidden;
		margin: 0px;
		position: absolute;
		top: 31px;
		color: #fff;
		}

/*--[ nav ]----------------------------------------------------------------*/
#nav {
	position: absolute;
	top: 92px;
	margin: 0px;
	}
	#nav li {
		background: #fff url(../i/layout/bg-nav.gif) top right no-repeat;
		float: left;
		display: inline;
		text-align: center;
		padding: 0px;
		height: 32px;
		line-height: 32px;
		}
		#nav a {
			background: #fff url(../i/layout/bg-nav.gif) top right no-repeat;
			display: block;
			float: left;
			height: 32px;
			padding: 0 10px;
			text-decoration: none;
			color: #8c8c8c;
			}
			#nav a:hover, #nav .active a {
				background: #fff url(../i/layout/bg-nav.gif) 100% 50% no-repeat;
				color: #f23a40;
				}
	#n-home {width: 36px;}	
	#n-home a {
		background: url(../i/layout/home.gif) 0 0 no-repeat;
		width: 36px;
		height: 32px;
		padding: 0px;
		text-indent: -9999px;
		}
		#n-home a:hover, #n-home.active a {background: url(../i/layout/home.gif) 0 -32px no-repeat;}

/*--[ homepage ]----------------------------------------------------------------*/
#splash {
	background: #fff url(../i/layout/bg-splash.jpg) 0 0 no-repeat;
	height: 270px;
	padding-left: 350px;
	}

#splash h2, .box h2 {
	margin: 0 20px 0;
	padding-top: 20px;
	}
#splash ul {
	margin: 0 0 10px 20px;
}	
#splash li {
	background: url(../i/layout/bullet-splash.gif) 0% 50% no-repeat;
	font-size: 1.1em;
	padding-left: 24px;
	line-height: 2.2em;
	}

.button, .submit input, .contact .button {
	width: 104px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	float: right;
	display: inline;
	color: #fff;
	}
	.submit input {
		padding: 0px;
		border: 0px;
		cursor: pointer;
		font-size: 1em;
		margin: 0 40px 0 20px;
		}
.button a {
	display: block;
	color: #fff;
	text-decoration: none;
	width: 104px;
	}
	.domo a, .real a {color: #565656;}
.grey, .grey a, .submit input {background: #4e4e4e url(../i/layout/button-grey.gif) 0 0 no-repeat;}
.grey a:hover, .submit input:hover {background: #b20d0e url(../i/layout/button-grey.gif) 0 -30px no-repeat;}
.white, .white a {background: #fff url(../i/layout/button-white.gif) 0 0 no-repeat;}
.white a:hover {background: #f5ca9f url(../i/layout/button-white.gif) 0 -30px no-repeat;}
	
.box {
	background: url(../i/layout/bg-box.gif) 0 0 no-repeat;
	width: 240px;
	height: 270px;
	float: left;
	position: relative;
}
.box img {
	position: absolute;
	top: 66px;
}
.box .button {
	position: absolute;
	bottom: 22px;
	right: 20px;
	margin: 0px;
}
.domo h2, .real h2 {color: #fff;}
.domo h4, .real h4 {color: #ffe8b6;}
.contact {background: #fff url(../i/layout/bg-contact.jpg) 0 0 no-repeat;}
.contact p {
	line-height: 14px;
}

	
/*--[ contact ]----------------------------------------------------------------*/
#contact-form {
	width: 500px;
	float: left;
}
form {margin: 0 0 10px 20px;}
label {
	font-weight: bold;
	cursor: pointer;
	}	
form div {margin-bottom: 0.6em;}
.input {width: 200px;}
.textarea{width: 430px;}
.float {
	float: left;
	margin-right: 30px;
}
.input span, .textarea span {
	display: block;
	width: 200px;
	background: #F3F3F3;
	padding: 4px;
}
.textarea span {width: 430px;}
.error, .input .error, .textarea .error {
	color: #c00;
	width: auto;
	display: inline;
	padding: 0px;
	background: transparent;
	}
input, textarea {
	font-family: "Lucida Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	padding: 4px;
	background: #fff;
	border: 1px solid #A7A7A7;
	width: 190px;
	}
fieldset {border: 0px;}

textarea {
	overflow: auto;
	height: 85px;
	width: 420px;
}
html>body textarea {margin-bottom: -2px;}

form p {
	color: #666;
	margin: 0px;
	line-height: 30px; 
	text-align: right;
}

#attention, #success {
	background: #F5DC63;
	border: 1px solid #D29C34;
	margin: 0 20px 15px;
	padding: 5px;
}
#success {
	background: #86D958;
	border: 1px solid #229322;
}
#attention div, #success div {
	background: #fff url(../i/layout/icon-attention.gif) 10px 10px no-repeat;
	margin: 0px;
	padding: 15px 20px 10px 40px;
}
#success div {
	background: #fff url(../i/layout/icon-success.gif) 10px 10px no-repeat;
}

#attention ul, #success p {margin: 0 20px;}

/*--[ links ]----------------------------------------------------------------*/
.links {
	clear: both;
}
.links li {
	padding: 0px;
	background: #eee;
	float: left;
	padding: 4px;
	display: inline;
	margin: 0 20px 10px 0;
	}
	.links a {
		display: block;
		width: 150px;
		height: 60px;
		}
	.links a img {border: 1px solid #ddd;vertical-align: middle;}	
	.links a:hover img {border-color: #A7A7A7;}	

/*--[ realisaties ]----------------------------------------------------------------*/
.project{
	width: 350px;
	margin: 0 0 20px 20px;
	float: left;
	display: inline;
}
.project p{
	margin: 0;
}
.project p strong{
	margin: 0 5px 0 0;
}
.download-pdf{
	display: block;
	height: 70px;
	line-height: 70px;
	padding-left: 60px;
	background: #fcfcfc url(../i/pdf.gif) 10px 50% no-repeat;
	font-size:12px;
	color: #7c7c7c;
	text-decoration: none;
	border: 1px solid  #E7E6E2;
	border-left-color: #e2e2e2;
	border-top-color: #e2e2e2;
}
.download-pdf:hover {
	background: #E7E6E2 url(../i/pdf.gif) 10px 50% no-repeat;;
	border: 1px solid  #e2e2e2;
}

/*--[ sIFR ]----------------------------------------------------------------*/
/* These are standard sIFR styles... do not modify */
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
	}
.sIFR-replaced {
	visibility: visible !important;
	}
span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
	}

.sIFR-hasFlash h1 {
	visibility: hidden;
	height: 28px;
	}
	
/*--[ footer ]----------------------------------------------------------------*/
#footer {
	clear: both;
	background: #8c897e url(../i/layout/bg-footer.gif) 0 0 no-repeat;
	color: #fff;
	text-align: center;
	height: 32px;
	line-height: 32px;
	margin: 0px;
	}
	#footer a {color: #fff;}
	#footer a:hover {background: transparent;}