@charset "UTF-8";
/* CSS Document */

/* GLOBAL ======================================================= */

body{
	background: url(../images/bg-body.png) repeat-x top left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
	}

hr{
	heigth: 10px;
	color: #CECECE;
	text-align: left;
	filter: alpha(opacity=50);
	-moz-opacity: .50;
	opacity: .50;
	margin: 0 auto 0 0;
	background-color: #CECECE;

}


body#home{
	background: url(../images/bg-body.png) repeat-x top left;
	}
	
img{
	border: none;
	}
	
.clear{
	clear: both;
	}

a:link		{ color: #EF7000; text-decoration: underline; }
a:visited	{ color: #EF7000; text-decoration: underline; }
a:active	{ color: #EF7000; text-decoration: none; }
a:hover 	{ color: #505050; text-decoration: underline; }

/* HEADER ======================================================= */

#header{
	background: url(../images/bg-header.png) no-repeat bottom center; 
	z-index: 0;
	height: 420px;
	}
#header-content {
	/*background: url(../images/bg-header.jpg) no-repeat bottom center;*/
	height: 270px;
	}
.header-text{
	color: #FFF;
	width: 435px;
	font-size: 16px; 
	position: absolute;
	top: 160px;
	left: 15px;
	}

.header-text a:link {
	color: #fff; 
	text-decoration: underline; 
	}

.header-text a:visited	{
	color: #fff; 
	text-decoration: underline; 
	}

.header-text a:active	{ 
	color: #fff; 
	text-decoration: underline; 
	}

.header-text a:hover { 
	color: #EF7000; 
	text-decoration: underline; 
	}
	
.header-text H1{
	margin: 0 0 15px 0;
	font-size: 36px;
	}
.header-text H1 span{
	font-weight: normal;
}

	
#header-container{
	width: 940px;
	margin: 0 auto;
	position: relative;
	}

#home #header{
	background: url(../images/bg-header-temp.jpg) no-repeat bottom center;
	height: 420px;
	}
	
#home #header-container{
	width: 940px;
	margin: 0 auto;
	position: relative;
	}
	
.logo{
	background: url(../images/logo-header.png) no-repeat top left;
	text-indent: -9999px;
	display: block;
	width: 260px;
	height: 150px;
	left: 0px;
	margin: 0 0 0 -32px;
	padding: 0;
	overflow: hidden;
	z-index: 10;
	width: 260px;
	}
	
.btn-meer-info-xl a{
	background: url(../images/btn-meer-info-xl.png) no-repeat top left;
	width: 160px;
	height: 30px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	position: absolute;
	top: 330px;
	left: 15px;
	z-index: 9999;
	}
.btn-meer-info-xl a:hover{	
	background-position: 0 -30px;
	}


/* NAVIGATIE */

#navigatie{
	position: absolute;
	right: 0px;
	top: 0px;
	}
#nav, #nav ul {
	float: left;
	list-style: none;
	background: white;
	font-weight: bold;
	padding: 0;
	margin: 0;
	z-index: 9999;
}

#nav a {
	background: url(../images/bg-menu.png) no-repeat top left;
	display: block;
	width: 160px;
	w\idth: 6em;
	color: #7C6240;
	text-decoration: none;
	padding: 0.25em 2em;
	text-indent: -9999px;
	overflow: hidden;
}

#nav a.home{ width: 70px; height: 60px;	padding: 0; display: block;	}
#nav a:hover.home {	background-position:0 -60px; }
#nav li:hover a.home{ background-position: 0 -60px;	}

#nav a.producten{ background-position:-70px 0; width: 111px; height: 60px; padding: 0; display: block; }
#nav a:hover.producten { background-position:-70px -60px; }
#nav li:hover a.producten{ background-position: -70px -60px; }
	
#nav a.productinfo{	background-position:-181px 0; width: 176px;	height: 60px; padding: 0; display: block; }
#nav a:hover.productinfo {	background-position: -181px -60px; }
#nav li:hover a.productinfo{ background-position: -181px -60px;	}

#nav a.trainingen{ background-position:-357px 0; width: 112px; height: 60px; padding: 0; display: block; }
#nav a:hover.trainingen { background-position: -357px -60px; }
#nav li:hover a.trainingen{ background-position: -357px -60px; }

#nav a.nieuws{ background-position:-469px 0; width: 83px; height: 60px; padding: 0; display: block; }
#nav a:hover.nieuws { background-position: -469px -60px; }
#nav li:hover a.nieuws{ background-position: -469px -60px; }

#nav a.contact{ background-position:-552px 0; width: 93px; height: 60px; padding: 0; display: block; }
#nav a:hover.contact { background-position: -552px -60px; }
#nav li:hover a.contact{ background-position: -552px -60px; }




#nav li {
	float: left;
	padding: 0;
}

#nav li ul {
	background: url(../images/bg-subnav.png) no-repeat bottom left;
	position: absolute;
	left: -9999px;
	height: auto;
	width: 198px;
	padding: 15px 15px 18px 15px;
	/*w\idth: 13.9em;*/
	font-weight: normal;
	margin: 0;
}
#nav ul{
	border: none;
	}

#nav li li {
	width: 195px;
}
#nav li li a{
	background: url(../images/bg-submenu-a.gif) no-repeat center left;
	color: #505050;
	padding: 9px 0 9px 20px;
	border-bottom: #cecece 1px solid;
	text-indent: 0px;
	}
#nav li li a:hover{
	background: #EF7000 url(../images/bg-submenu-a-hover.gif) no-repeat center left;
	color: #FFF;
	}
#nav li li .last{
	border: none;
	}

#nav li ul a {
	width: 175px;
}

#nav li ul ul {
	margin: -1.75em 0 0 14em;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}

#nav li:hover, #nav li.sfhover {
	background: url(../images/bg-menu.png) no-repeat top left;
}

#nav li:hover a.productinfo, #nav li.sfhover{
	background-position: -181px -60px;
	}


/* Zoeken */

#header-zoeken{	
	position: absolute;
	width: 270px;
	top: 67px;
	right: 10px;
	}

.btn-zoeken{
	background: #FFF url(../images/bg-btn.gif) repeat-x top left;
	width: 81px;
	height: 25px;
	display: block;
	padding-top: 1px;
	border: none;
	cursor: pointer;
	float: right;
	border: #cdcdcd 1px solid;
	text-transform: uppercase;
	}
.btn-zoeken:hover{
	background-position: 0 -25px;
	}
	
/*.btn-zoeken{
	background:url(../images/bg-btn.gif) repeat-x bottom left;
	width: 81px;
	height: 25px;
	display: block;
	border: none;
	cursor: pointer;
	float: right;
	border: #cdcdcd 1px solid;
	text-transform: uppercase;
	}*/

.input-zoeken{
	border-top: #bfbfbf 1px solid;
	border-left: #bfbfbf 1px solid;
	border-bottom: none;
	border-right: none;
	padding: 2px 5px;
	float: left;
	margin: 0 7px 0 0;
	font-size: 11px;
	width: 169px;
	}
	
/* Download buttons */

.btn-veiligheid{
	background: #FFF url(../images/veiligheid-button.jpg) no-repeat top left;
	width: 333px;
	height: 200px;
	display: block;
	border: none;
	cursor: pointer;
	border: #ddd 1px solid;
	text-transform: uppercase;
	}
.btn-veiligheid:hover{
	background-position: 0 -200px;
	}

.btn-gebouwen{
	background: #FFF url(../images/gebouwen-button.jpg) no-repeat top left;
	width: 333px;
	height: 200px;
	display: block;
	border: none;
	cursor: pointer;
	border: #ddd 1px solid;
	text-transform: uppercase;
	}
.btn-gebouwen:hover{
	background-position: 0 -200px;
	}

.btn-voertuigen{
	background: #FFF url(../images/voertuigen-button.jpg) no-repeat top left;
	width: 333px;
	height: 200px;
	display: block;
	border: none;
	cursor: pointer;
	border: #ddd 1px solid;
	text-transform: uppercase;
	}
.btn-voertuigen:hover{
	background-position: 0 -200px;
	}

.btn-overig{
	background: #FFF url(../images/overig-button.jpg) no-repeat top left;
	width: 333px;
	height: 200px;
	display: block;
	border: none;
	cursor: pointer;
	border: #ddd 1px solid;
	text-transform: uppercase;
	}
.btn-overig:hover{
	background-position: 0 -200px;
	}
	
/* Taalkeuze */

#header-taalkeuze{
	font-size: 11px;
	color: #7b7b7b;
	text-transform: uppercase;
	position: absolute;
	top: 104px;
	right: 25px;
	list-style: none;
	margin: 0;
	padding: 0;
	}
#header-taalkeuze li{
	float: left;
	margin: 0 0 0 10px;
	}
	
/* Breadcrums */

#header-breadcrums{
	font-size: 11px;
	color: #7b7b7b;
	padding: 0;
	position: absolute;
	top: 94px;
	left: 240px;
	list-style: none;
	font-size: 10px;
	}
#header-breadcrums li{
	float: left;
	margin: 0 5px 0 0;
	}
#header-breadcrums a{
	color: #7B7B7B;
	}
#header-breadcrums a:hover{
	color: #ef7000;
	text-decoration: none;
	}


/* CONTENT ====================================================== */

#content{
	width: 940px;
	margin: 0 auto;
	padding: 20px 0;
	}

.content ul{
	list-style: disc;
	padding: 0 0 0 15px;
	}
	
/* Left */

#left{
	width: 220px;
	float: left;
	}
	
#left .contact{
	background: #505050 url(../images/bg-contact.png) no-repeat bottom left;
	padding: 15px;
	color: #FFF;
	line-height: 18px;
	margin: 0 0 20px 0;
	}
#left .contact h2{
	text-transform: uppercase;
	font-size: 14px;
	padding: 0;
	margin: 0 0 13px 0;
	}
#left .contact a{
	color: #FFF;
	}
#left .contact a:hover{
	text-decoration: none;
	}
	
#left .inloggen{
	background: url(../images/bg-inloggen.png) repeat-x bottom left;
	border: #e6e6e6 1px solid;
	padding: 15px;
	}
#left .inloggen h2{
	text-transform: uppercase;
	font-size: 14px;
	padding: 0;
	margin: 0 0 10px 0;
	color: #252525;
	}
	
.contact-left {
	width: 380px;
	float: left;
	}

.contact-right {
	border-left: 1px solid #CECECE;
	float:right;
	margin:33px 0 0;
	padding:20px 20px 20px 40px;
	width:220px;
	}

form#inloggen{
	margin: 0;
	padding: 0;
	}
.input-inloggen{
	border-top: #bfbfbf 1px solid;
	border-left: #bfbfbf 1px solid;
	border-bottom: none;
	border-right: none;
	padding: 5px;
	float: left;
	margin: 0 0 5px 0;
	font-size: 11px;
	width: 178px;
	}
	
.btn-inloggen{
	background: #fff url(../images/bg-btn.gif) repeat-x top left;
	width: 96px;
	height: 25px;
	display: block;
	border: none;
	cursor: pointer;
	clear: left;
	border: #cdcdcd 1px solid;
	text-transform: uppercase;
	}
.btn-inloggen:hover{
	background-position: 0 -25px;
	}
	
#left .subnav{
	background: url(../images/bg-inloggen.png) repeat-x bottom left;
	border: #e6e6e6 1px solid;
	padding: 15px;
	list-style: none;
	margin: 0 0 20px 0;
	font-weight: bold;
	}
#left .subnav li{
	border-bottom: #cecece 1px solid;
	}
#left .subnav li a{
	background: url(../images/bg-subnav-li.gif) no-repeat center left;
	padding: 5px 0 5px 15px;
	display: block;
	color: #505050;
	text-decoration: none;
	}
#left .subnav li a:hover{
	background: url(../images/bg-subnav-li-hover.gif) no-repeat center left;
	color: #EF7000;
	}	

/* Right */

#right{
	width: 700px;
	float: right;
	}
	
.diensten{
	list-style: none;
	font-size: 12px;
	line-height: 16px;
	margin: 0;
	padding: 0;
	color: #606060;
	height: 191px;
	}
.diensten h2{
	color: #ef7000;
	text-transform: uppercase;
	}
.diensten li{
	background: url(../images/bg-diensten.png) repeat-y top right;
	float: left;
	width: 220px;
	height: 190px;
	position: relative;
	}
.diensten li#voertuigen{ background: url(../images/bg-diensten-voertuigen.jpg) no-repeat bottom left; margin: 20 0 0 0; }
.diensten li#gebouwen{ background: url(../images/bg-diensten-gebouwen.jpg) no-repeat bottom left; margin: 0 20px; }
.diensten li#veiligheid{ background: url(../images/bg-diensten-veiligheid.jpg) no-repeat bottom left; }

.diensten a.meer-info_nl{
	background: url(../images/btn-meer-info.gif);
	width: 70px;
	height: 30px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	top: 145px;
	left: 0px;	
}
.diensten a.meer-info_en{
	background: url(../images/btn-meer-info_en.gif);
	width: 70px;
	height: 30px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	top: 145px;
	left: 0px;	
}
.diensten a.meer-info_du{
	background: url(../images/btn-meer-info_du.gif);
	width: 70px;
	height: 30px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	top: 145px;
	left: 0px;	
}
.diensten a.meer-info_nl:hover{
	background-position: 0 -30px;	
}
.diensten a.meer-info_en:hover{
	background-position: 0 -30px;	
}
.diensten a.meer-info_du:hover{
	background-position: 0 -30px;	
}

	
.merken{
	background: url(../images/bg-merken.png) repeat-x top left;
	margin: 38px 0 0 0;
	padding: 0;
	list-style: none;
	height: 120px;
	width: 700px;
	clear: left;
	}
.merken .tekst {
	float: left; 
	padding: 20px 0 20px 0px; 
	color: #999999; 
	font-size: 16px; 
}
.merken li{
	float: right;
	padding: 25px 0 0 0;
	}
	
.content{
	color: #505050;
	line-height: 18px;
	border-top: #cecece 1px solid;
	min-height: 199px;
	}
.content h1{
	color: #ef7000;
	margin: 15px 0;
	text-transform: uppercase;
	}
	
/* .downloads{
	list-style: none;
	margin: 0;
	padding: 0;
	}
.downloads li a{
	background: url(../images/pdf-icon.gif) no-repeat center left;
	display: block;
	padding: 5px 0 0 20px;
	text-decoration: none;
	font-weight: ;
	color: #505050;
	width: 50%;
	}
.downloads li a:hover{
	color: #ef7000;
	} */

.downloadleft h4 {
	margin-bottom: 6px;
	margin-top: 0px;
	color: #EF7000;
	}

.downloadright h4 {
	margin-top: 0px;
	margin-bottom: 6px;
	color: #EF7000;
	}

.downloadleft {
	width: 333px;
	min-height:75px;
	background-color:#fff;
	float: left;
	position:relative;
	margin-right: 16px;
	padding-right: 6px;
	padding-top: 6px;
	padding-bottom: 6px;
	}	
	
.downloadright {
	width: 333px;
	min-height: 75px;
	background-color:#fff;
	float: left;
	position: relative;
	padding: 6px;
	}	

.downloaditem {
	width: 319px;
	display: block;
	height: 16px;
	color: #000;
	background-color: #fff;
	padding: 6px;
	margin-bottom: 6px;
	border: 1px #CCC solid;
	background-repeat: no-repeat;
	background-position: right;
	vertical-align: middle;
	background-image: url(../images/download-icon.png);
	}

.downloaditem a:link {
	height: 20px;
	color: #000;
	text-decoration: none;
	display: block;
	font-weight: bold;
	}
.downloaditem a:visited {
	height: 20px;
	color: #000;
	text-decoration: none;
	display: block;
	font-weight: bold;
	}

.downloaditem a:hover {
	height: 20px;
	color: #EF7000;
	text-decoration: none;
	display: block;
	font-weight: bold;
	}

.downloaditem a:active {
	height: 20px;
	color: #EF7000;
	text-decoration: none;
	display: block;
	font-weight: bold;
	}

/* FOOTER ======================================================= */

#footer{
	font-size: 11px;
	color: #808080;
	line-height: 20px;  
	width: 940px;
	margin: 0 auto;
	border-top: #cecece 1px solid;
	position: relative;
	clear: both;
	}
#footer a{
	color: #808080;
	}
#footer a:hover{
	text-decoration: none;
	}
#footer p{
	padding: 15px;
	margin: 0;
	}

#footer .keurmerken{
	margin: 0;
	list-style: none;
	position: absolute;
	top: 15px;
	right: 0px;
	}
#footer .keurmerken li{
	float: left;
	margin: 0 0 0 10px;
	}
	
/**************************
FORM
**************************/	

label {
	float: left;
	width:  110px;	
	padding: 2px 0 0 0;
}

input.fout, textarea.fout {
	border:1px solid #FF0000;
}
label.fout {
	color:#FF0000;
}

input, select {	
	background: #ffffff;
	margin: 0 0 5px 0;
	border: 1px solid #a0a0a0;
	height: 20px;
	width: 200px;
	padding: 0 0 0 2px;
}
textarea {
	width: 200px;
	background: #ffffff;
	margin: 0 0 5px 0;
	border: 1px solid #a0a0a0;
	height: 80px;
}
input.submit {
	float: left;
	width: 100px;
	background: #ffffff;
	height: 20px;
	border: 0px;
	padding: 0 0 4px 0;
	cursor: pointer;
}

	
/* MENU ============================================================= */

ul									{ list-style: none; }
p                                   { margin: 15px 0; }


/* 
	LEVEL ONE
*/
ul.dropdown                         { position: absolute; height: 60px; top: 0; right: 0; margin: 0; z-index: 999;}
ul.dropdown li                      { font-weight: bold; float: left; zoom: 1; }
ul.dropdown a:hover		            { color: #000; }
ul.dropdown a:active                { color: #ffa500; }
ul.dropdown li a                    { display: inline-block; padding: 22px 15px 0 15px; font-size:12px; font-weight: normal;
	 								  color: #fff; height: 38px; text-transform: uppercase; text-decoration: none;  }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { background: #FFF; color:#EF7000; position: relative; }
ul.dropdown li.hover a              { color: #EF7000; }


/* 
	LEVEL TWO
*/ 
ul.dropdown ul 						{ width: 195px; visibility: hidden; position: absolute; top: 100%; left: 0; background: url(../images/bg-subnav.png) no-repeat bottom right; padding: 15px 15px 18px; }
ul.dropdown ul li 					{ font-weight: normal; color: #000; float: none; }
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ 	color: #505050;
										background: url("../images/bg-submenu-a.gif") no-repeat scroll left center;
										padding: 12px 0 12px 20px;
										height: 10px;
										border-bottom: #cecece 1px solid;
										text-indent: 0px;
										font-size: 11px;
 } 
 ul.dropdown li.hover ul li a{				color: #505050; text-transform: none; display: block;}
ul.dropdown li.hover ul li a:hover{
									background: #EF7000 url("../images/bg-submenu-a-hover.gif") no-repeat scroll left center;
									color: #FFF;
}

/* */

.btn{
	background: #fff url(../images/bg-btn.gif) repeat-x top left;
	width: auto;
	height: 25px;
	display: block;
	border: none;
	cursor: pointer;
	border: #cdcdcd 1px solid;
	text-transform: uppercase;
	}
.btn:hover{
	background-position: 0 -25px;
	}