/*-----------------------------------------------------*/
/*--[ CSS Art & Reno 2006, copyright Robarov ]       --*/
/*-----------------------------------------------------*/

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

body {
	background: #fff url(../i/layout/bg-body.jpg) 0 0 repeat-x;
	color: #333333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	line-height: 1.8em;
}

#container {
	background: #fff url(../i/layout/camion.jpg) bottom right no-repeat;
}

#sidebar {
	position: absolute;
	left: 0px;
	top:140px;
	background: #BDBEC0 url(../i/layout/bg-sidebar.gif) bottom left no-repeat;
	width: 185px;
	height: 415px;
	padding: 25px 0 0 0;
	margin: 0 10px 0 0;
}
	
#content {
	margin-left: 190px;
	min-height:500px;
 	height:auto !important;
  	height:500px;
}
/*--[ crumb ]----------------------------------------------------------------*/
#crumb {
	font-size: 0.8em;
	text-transform: uppercase;
	border-bottom: 3px solid #BDBEC0;	
	margin: 6px 0 14px 30px;
}

/*--[ header ]----------------------------------------------------------------*/

#header {
	background: #222222 url(../i/layout/bg-header.gif) 0 0 repeat-x;
	height: 140px;
	border-bottom: 2px solid #BDBEC0;
	text-align: center;
}
#header h2 {
	padding: 26px 0 0 0;
	border-bottom: 0px;
	margin: 0 auto;
	width: 364px;
	height: 85px;
	}
#header h2 a { 
	background: #222222 url(../i/layout/logo.gif) 0 0 no-repeat;
	text-indent: -9000em;
	overflow: hidden; 
	width: 364px;
	height: 85px;
	display: block;
	float: left;
	text-decoration: none;
	border: 0px solid #BDBFC0;
}

/*--[ common ]----------------------------------------------------------------*/
h1, h2, h3, h4 { 
	font-weight: normal;
}
h1 {
	font-size: 2em;
	color: #00f;
	padding: 0 0 6px 0;
	margin: 0 30px 15px;
	border-bottom: 1px solid #333333;
}	
	
h2 {
	margin: 0 30px 4px 20px;
	font-size: 1.6em;
	padding: 0 0 6px 0;
	margin: 0 30px 10px;
	border-bottom: 1px solid #BDBEC0;
}

h3 {
	margin: 0;
	font-size: 1.2em;
	text-transform: uppercase;
}

p {
	margin: 0 30px 15px;
}

strong {
	color: #333333;
}

ol {
	margin: 0 40px 15px; 
}
	
ul, ol {
	margin: 0 30px 15px; 
}
ul li, ol li{
	margin:0 0 0 20px;
}

a {
	color: #95A575;
	outline: none;
}
a:hover {
	color: #333333;
	text-decoration: none;
}

a:active {
	color: #FFF;
}

img { 
	border: 2px solid #95A575;
	margin: 0 0 0 30px;
}
.alignleft {
	margin: 0 15px 5px 30px;
	float: left;
}

.alignright {
	margin: 0 30px 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;
}
		
/*--[ nav ]----------------------------------------------------------------*/
#nav {
	position: absolute;
	left: 0px;
	top: 20px;
	margin: 0px;
	width: 185px;
	height: 175px;
	}
	
	#nav li{
		position: absolute;
		left: 0px;
		height: 25px;
		width: 185px;
		padding: 0px;
		background: none;
		list-style: none;
		margin: 0;
		}
	#nav li a {
		display: block;
		text-indent: -9000em;
		overflow: hidden;
		height: 25px;
		width: 185px;
		float: left;
		}	
		#nav #nav1{top:0px;}
		#nav #nav2{top:25px;}
		#nav #nav3{top:50px;}
		#nav #nav4{top:75px;}
		#nav #nav5{top:100px;}
		#nav #nav6{top:125px;}
		#nav #nav7{top:150px;}
		#nav #nav8{top:175px;}
		
		#nav li, #nav li a, #nav li.active a {background-image:url(../i/layout/bg-nav.gif); background-repeat: no-repeat; }

		#nav #nav1, #nav #nav1 a{background-position: 0px 0px;}
		#nav #nav2, #nav #nav2 a{background-position: 0px -25px;}
		#nav #nav3, #nav #nav3 a{background-position: 0px -50px;}
		#nav #nav4, #nav #nav4 a{background-position: 0px -75px;}
		#nav #nav5, #nav #nav5 a{background-position: 0px -100px;}
		#nav #nav6, #nav #nav6 a{background-position: 0px -125px;}
		#nav #nav7, #nav #nav7 a{background-position: 0px -150px;}
		#nav #nav8, #nav #nav8 a{background-position: 0px -175px;}
	
		#nav li#nav1 a:hover, #nav li#nav1.active a { background-position: -187px 0px; }
		#nav li#nav2 a:hover, #nav li#nav2.active a { background-position: -187px -25px; }
		#nav li#nav3 a:hover, #nav li#nav3.active a { background-position: -187px -50px; }
		#nav li#nav4 a:hover, #nav li#nav4.active a { background-position: -187px -75px; }
		#nav li#nav5 a:hover, #nav li#nav5.active a { background-position: -187px -100px; }
		#nav li#nav6 a:hover, #nav li#nav5.active a { background-position: -187px -125px; }
		#nav li#nav7 a:hover, #nav li#nav5.active a { background-position: -187px -150px; }
		#nav li#nav8 a:hover, #nav li#nav5.active a { background-position: -187px -175px; }
/*
#nav {
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 800;
	padding: 0 0 1px 0;
	margin: 0;
	background: #3D3A3B;
}
#nav li{
	line-height: 25px;
	background: #ff0;
	background: #222222 url(../i/layout/bg-header.gif) 0 0 repeat-x;
	padding: 0px;
	margin: 0px;
	display: inline;
}
#nav li a {
	color: #00f;
	background: #ff0;
	background: #222222 url(../i/layout/bg-header.gif) 0 0 repeat-x;
	display: block;
	text-decoration: none;
	border-left: 20px solid #99f;
	padding: 0 0 0 4px;
	margin: 2px 0;
}	
#nav li a:hover, #nav li.active a {
	border-left: 20px solid #00f;
}
/*--[ overview ]----------------------------------------------------------------*/
#overview {
	text-align: center;
	width:780px;
}
#overview li{
	float: left;
	list-style: none;
	width: 260px;
	margin: 0;
	padding: 0;
}
#overview li a span{
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	text-transform: none;
	font-weight: 800;
	color: #333333;
	font-size:1.2em;
}
#overview li a {
	width: 260px;
	text-align: center;
	margin: 0;
	padding: 0;
	text-decoration:none;
}	
#overview li a:hover, #overview li.active a {
}

.advantage span, .application span{
	font-weight: bolder
}
		
/*--[ sidebar ]----------------------------------------------------------------*/
#sidebar p {
	color: #00f;
	font-family: Verdana, Arial;
	font-size: 16px;
	font-weight: 800;
}

#email {
	position: absolute;
	left: 26px;
	bottom: 38px;
}

#email a { 
	text-indent: -9000em;
	overflow: hidden; 
	width: 120px;
	height: 18px;
	display: block;
	float: left;
	text-decoration: none;
}


/*--[ homepage ]----------------------------------------------------------------*/

	
/*--[ contact ]----------------------------------------------------------------*/
form{
	clear:both;
	margin: 20px 30px 30px 30px;
	width:490px;
}
	fieldset{border:none;}

	.floatl{
		width:240px;
		float:left;
	}
	.floatr{
		width:240px;
		float:right;
	}
	form div input, form div textarea{
		font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
		font-size:1em;
		border: 1px solid #e1dcc7;
		padding:2px 0;
	}
	form div input { width:240px;}
	span.error{color:#e42323;font-size:.9em;}
	form div {margin:0 0 .6em 0;}
	form label {display:block;}
	textarea{width:490px;}

	#content ul.error{
		border-top: 1px solid #e42323;
		border-bottom: 1px solid #e42323;
		background: #f8c7c7;
		padding: 5px 10px 5px 0px;
		color:#e42323;
		display: block;
		width:470px;
	}
	#content ul.error li{
		background:url(../i/layout/error.gif) 0 50% no-repeat;
		padding:0 0 0 20px;
		list-style:  none;
	}	
	
	#banner{
		text-align:center;
	}

/*--[ 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;
}
/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
	font-size: 1.5em;
	line-height: normal;
}
	
/*--[ footer ]----------------------------------------------------------------*/
#footer {
	clear:both;
	margin: 0px;
	height: 22px;
	font-size: 11px; 
	text-align: center;
	color :#adadad;
	}
	span{
		text-transform: uppercase;
		font-size: 9px;
	}
	#footer a {
		color: #95A575;
	}
	#footer a:hover{
		color: #333333;
	}		
.stijl4 {
	color: #000;
}
#container #content .stijl1 .stijl4 {
	font-family: Verdana, Geneva, sans-serif;
}
#container #content .stijl1 .stijl4 {
	font-family: Georgia, "Times New Roman", Times, serif;
}
#container #content .stijl1 .stijl4 {
	font-family: Arial, Helvetica, sans-serif;
}
#container #content .stijl1 .stijl4 {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
#container #content .stijl1 .stijl4 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
}