/* --------------------------------------------- GENERAL STYLES --------------------------------------------- */
a:link { color: #625B55; text-decoration: underline; background: transparent; }
a:visited { color: #333; text-decoration: underline; background: transparent; }
a:active { color: #333; text-decoration: underline; background: transparent; }
a:hover { color: #C60; text-decoration: underline; background: transparent; }
	
a img { border-width: 0; }

body {
	margin: 0;
	padding: 0;
	color: #333;
	background: #fff;
	border-width: 0;
    /* more specific to override imported rule */
    font-size: 70%;
    line-height: 160%;
    font-family: "Arial", "Helvetica", "Verdana", sans-serif;     
    /* false value for WinIE4/5 */
    voice-family: "\"}\"";   
    /* trick WinIE4/5 into thinking rule is over */
    voice-family: inherit;   
    /* recover from trick */
    font: 70%/160% "Arial", "Helvetica", "Verdana", sans-serif;
    /* intended value for better browsers */
    }
    
html>body, html { margin: 0; padding: 0; border-width: 0;}	

h1 { font-weight: normal; font-size: 170%; line-height: 130%; margin: 0; }
h2 { font-weight: normal; font-size: 170%; line-height: 130%; margin: 0; }
h3 { margin: 20px 0 5px 0; font-weight: bold; font-size: 110%; }
h5 { margin: 0; }
ul { list-style: none; text-indent: 0; margin: 0; padding: 0; }

.skiplinks { position: absolute; left: -1000px; width: 990px; font-size:1%; line-height:1; }
.hoofdnavigatie { position: absolute; left: -1000px; width: 990px; font-size:1%; line-height:1; }
.hide { display: none; }
/* --------------------------------------------- TOP BAR --------------------------------------------- */	
#top { height: 107px; background: url("/img/shared/bg-topright.jpg") top repeat-x; margin: 0; }
#top .topimg { background: url("/img/shared/topimg.jpg") top left no-repeat; margin: 0; padding: 0; }
#top .topimg a { display: block; width: 782px; height: 107px; text-indent: -10000px; }
#top .printlogo { display: none; }	

/* --------------------------------------------- TITLE BAR --------------------------------------------- */
#balk { margin: 0; padding: 0; height: 23px; background: url("/img/shared/bg-right.jpg") top left repeat-x; vertical-align: top; }
#title-introductie { background: url("/img/titles/home.jpg") no-repeat; height: 23px; }
#title-rekenvoorbeelden { background: url("/img/titles/rekenvoorbeelden.jpg") no-repeat; height: 23px; }
#title-nieuws { background: url("/img/titles/nieuws.jpg") no-repeat; height: 23px; }
#title-aanbiedingen { background: url("/img/titles/aanbiedingen.jpg") no-repeat; height: 23px; }
#title-stralingswarmte { background: url("/img/titles/stralingswarmte.jpg") no-repeat; height: 23px; }
#title-zonne-energie { background: url("/img/titles/zonne-energie.jpg") no-repeat; height: 23px; }
#title-warmtepompen { background: url("/img/titles/warmtepompen.jpg") no-repeat; height: 23px; }
#title-warmte-terugwinning { background: url("/img/titles/warmte-terugwinning.jpg") no-repeat; height: 23px; }
#title-centrale-verwarming { background: url("/img/titles/centrale-verwarming.jpg") no-repeat; height: 23px; margin: 0; }
#title-vloerverwarming { background: url("/img/titles/vloerverwarming.jpg") no-repeat; height: 23px; }
#title-airconditioning { background: url("/img/titles/airconditioning.jpg") no-repeat; height: 23px; }
#title-water { background: url("/img/titles/water.jpg") no-repeat; height: 23px; }
#title-gas { background: url("/img/titles/gas.jpg") no-repeat; height: 23px; }
#title-electriciteit { background: url("/img/titles/electriciteit.jpg") no-repeat; height: 23px; }
#title-contact { background: url("/img/titles/contact.jpg") no-repeat; height: 23px; }
#title-service { background: url("/img/titles/service.jpg") no-repeat; height: 23px; }
#title-referenties { background: url("/img/titles/referenties.jpg") no-repeat; height: 23px; }
#title-demonstratie { background: url("/img/titles/demonstratie.jpg") no-repeat; height: 23px; }

/* --------------------------------------------- TOP NAVIGATIE --------------------------------------------- */
div#topnav
{
	width: 300px;
	position: absolute;
	left: 65%;
	margin: 0;
	padding: 0;
	top: 0;
}

div#topnav ul
{
	margin: 0;
	padding: 0;
	list-style: none;
	height: 42px;
}

div#topnav span { display: none; }

div#topnav ul li
{
	float: left;
	margin: 0;
	padding: 0 10px 0 10px;
	background-repeat: no-repeat;
	background-position: bottom center;
	height: 42px;
	display: block;
}

#dotted
{
	border-left: 1px dotted #fff;
	border-right: 1px dotted #fff;
}

div#topnav ul li a
{
	display: block;
	height: 42px;
	margin: 0;
	padding: 0;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: bottom center;
}

div#topnav ul li strong
{
	display: block;
	height: 42px;
	margin: 0;
	padding: 0;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: bottom center;
}

/* contact */
div#topnav ul li.contact strong { background-image: url("/img/navigatie/contact_on.gif"); width: 41px; }
div#topnav ul li.contact, div#topnav ul li.contact a { background-image: url("/img/navigatie/contact.gif"); width: 41px; }
div#topnav ul li.contact a:hover { background-image: url("/img/navigatie/contact_on.gif"); width: 41px; }
/* service */
div#topnav ul li.service strong { background-image: url("/img/navigatie/service_on.gif"); width: 38px; }
div#topnav ul li.service, div#topnav ul li.service a { background-image: url("/img/navigatie/service.gif"); width: 38px; }
div#topnav ul li.service a:hover { background-image: url("/img/navigatie/service_on.gif"); width: 38px; }
/* referenties */
div#topnav ul li.referenties strong { background-image: url("/img/navigatie/referenties_on.gif"); width: 59px; }
div#topnav ul li.referenties a { background-image: url("/img/navigatie/referenties.gif"); width: 59px; }
div#topnav ul li.referenties a:hover { background-image: url("/img/navigatie/referenties_on.gif"); width: 59px; }
		
/* --------------------------------------------- LEFT NAV --------------------------------------------- */	
#left {
	position: absolute;
	top: 128px;
	left: 18px;
	width: 199px;
	w\idth: 189px;
	z-index: 3;
	background: url("/img/shared/bg-left.jpg") no-repeat #EEE6CB;
	color: #333;
	padding: 0 0 0 10px;
	margin: 0;
	font-family: "Arial", "Helvetica", "Verdana", sans-serif;
	}
#left li { margin: 0; }
#left h2 {
	margin: 15px 0 5px 0;
	padding: 0 0 3px 0;
	border-bottom: 1px dotted #f93;
	font: normal 115% "Arial", "Helvetica", "Verdana", sans-serif;
	color: #f60;
	}
#left h2 span { display: none; }

#left h2#home { background: url("/img/navigatie/algera.gif") no-repeat; height: 20px; }
#left h2#energiebesparing { background: url("/img/navigatie/energiebesparing.gif") no-repeat; height: 20px; }
#left h2#temperatuur { background: url("/img/navigatie/temperatuur.gif") no-repeat; height: 20px; }
#left h2#water-gas { background: url("/img/navigatie/water-gas.gif") no-repeat; height: 20px; }

/* --------------------------------------------- MAIN CONTENT BLOCKS --------------------------------------------- */	
/* outer block */
#c-block { z-index: 1; background: url("/img/shared/bg-rightcol.jpg") right repeat-y #EEE6CB; margin-left: 18px; padding: 0; vertical-align: top; font-family: "Verdana", sans-serif; }

/* middle col */
#c-col { padding: 35px 35px 22em 45px; margin: -2px 155px 0 199px; z-index: 5; background-color: #fff; border-left: 1px dotted #F60; border-bottom: 1px solid #fff; border-right: 1px dotted #B8B3A2; }
	
/* --------------------------------------------- FOOTER --------------------------------------------- */
#footer { height: 20px; background: #B5A587; color: #fff; margin: 0; padding: 2px; text-align: center; font: bold 11px "Arial", "Verdana", sans-serif; white-space: nowrap; clear: left; }
#footer strong { color: #666; padding: 0 5px 0 5px;}
#footer a { color: #fff; text-decoration: none; padding: 0 5px 0 5px;}
#footer a:hover { color: #666; text-decoration: none;}

/* --------------------------------------------- RIGHT COLUMN, SUBNAVIGATIE PAGINA'S --------------------------------------------- */
#subnav {
	position: absolute;
	top: 128px;
	right: 15px;
	margin-right: -15px;
	padding: 40px 10px 15px 18px;
	width: 122px;
	\width: 150px;
	w\idth: 122px;
	z-index: 3;
	color: #000;
	background: transparent;
	line-height: 105%;
    }
	
#subnav a { margin: 0; }
#subnav ul { margin: 0; padding: 0; text-indent: 0; }
#subnav ul li { list-style-image: url("/img/shared/arrow.gif"); list-style-type: none; margin-top: 6px; text-indent: 0; padding: 0; }
#subnav li.here { list-style-image: url("/img/shared/arrow_on.gif"); font-weight: bold; color: #896532; }
#subnav #nieuws-items h3 { line-height: 160%; }
#subnav #nieuws-items div { border-bottom: 1px solid #000; padding-bottom: 1.33em;}

/* --------------------------------------------- general styles: info paginas --------------------------------------------- */	
#c-block h1 { margin: 0 50px 5px 0; color: #896532; position: relative; }
#c-block h3 { clear: left; }
#c-block p { margin: 8px 0 10px 0; }
#c-block em { font: 13px "Verdana", "Arial", sans-serif; }
#c-block ul { margin: 8px 50px 10px 0; }
#c-block ul li { list-style-type: none; margin: 0 0 8px 0;}

/* float left img */
#c-col p.left img { margin: 0 15px 5px 0; border: 1px solid #666; }
#c-col p.left { width: 240px; }
#c-block #c-col .exception { float: none; border: 1px solid #666; }
#c-col .description { font: italic 95%/100% "Verdana"; color: #666; width: 225px; }


/* --------------------------------------------- special styles: promo vrachtwagen --------------------------------------------- */
#promotie { border: 1px solid #C60; font: 12px/20px "Arial", "Verdana", "Geneva", sans-serif; color: #604114; margin: 35px 0 0 0; width: 100%; }
#promotie h1, #promotie h2 { color: #C60; padding: 10px 10px 15px 10px; margin: 0; position: relative; }
#promotie p { padding: 0 10px 10px 10px; margin: 0; height: 100%; }
#promotie img { margin: 0; padding: 0 10px 0 0; border-width: 0; } 
/* --------------------------------------------- special styles: home-introductie --------------------------------------------- */
#c-block .block { border-bottom: 1px solid #B5A587; margin: 0; width: 95%; position: relative; }
#c-block .block h1 { margin-left: 20px; }
#c-block .block p, #c-block .block ul { margin: 10px 0 0 190px; }
/* #c-block .block#voorlopig { background-image: url("/img/temp/demowagen-sm.jpg"); background-repeat: no-repeat; background-position: 50% 100%; padding: 5px 0 15px 0; height: 220px; } */
	
#c-block .block#een { background-image: url("/img/intro/img1.gif"); background-repeat: no-repeat; background-position: 10px 100%; padding: 5px 0 15px 0; }
#c-block .block#twee { background-image: url("/img/intro/img2.gif"); background-repeat: no-repeat; background-position: 10px 100%; padding: 25px 0 15px 0; }
#c-block .block#drie { background-image: url("/img/intro/img3.gif"); background-repeat: no-repeat; background-position: 10px 100%; padding: 25px 0 15px 0; }
#c-block .block#rekenvoorbeeld { background-repeat: no-repeat; background-position: 10px 100%; padding: 25px 0 0 20px; margin: 0; }
	
#c-block .block#rekenvoorbeeld h1 { margin: 0; color: #666; }
#c-block .block#rekenvoorbeeld small { margin: 0 0 25px 0; color: #666; }
#c-block .block#rekenvoorbeeld td { padding: 30px 15px 0 10px; width: 200px; border-left: 1px dotted #ccc; font-size: 85%; font-family "Arial", "Verdana", sans-serif; }
#c-block .block#rekenvoorbeeld img { border: 0; }

/* --------------------------------------------- special styles: aanbiedingen --------------------------------------------- */
#aanbieding .link { font: bold 11px "Arial", "Verdana", sans-serif; background: url("/img/aanbieding/arrow.gif") left center no-repeat; padding-left: 14px; float: left; position: relative; }
#aanbieding .link a { color: #c63; }
#aanbieding .link a:hover { color: #666; }
#aanbieding h1 { margin: 3px 0 20px 0; padding: 0 0 0 0; line-height: 20px; }
#aanbieding #c-block h2 { color: #c63; margin: 3px 0 6px 0; font-family: "Arial", "Helvetica", "Verdana", sans-serif; font-size: 110%; font-weight: bold; }
#aanbieding h4, #aanbieding h4 a { color: #896532; margin: 3px 0 0 0; }
#aanbieding h4 a:hover { color: #666; }
	
#aanbieding small { border-bottom: #F60; color: #f60; margin: 15px 0 0 0; padding: 0; text-align: right; clear: both; display: block; width: 100%; border-width: 0 0 1px 0; border-style: none none dotted none; }
#aanbieding #c-block #c-col img { border: 0; margin: 0; padding: 0; display: block; }	
#aanbieding #c-block #c-col .img { margin: 0 20px 0 0; padding: 0 0 0 32px; border: 2px solid #f60; position: relative; width: 225px; float: left; background-image: url("/img/aanbieding/special.gif"); background-repeat: no-repeat; background-position: left center; background-color: #f60; }
	
p.intro { color: #666; font: bold 12px "Verdana", "Arial", sans-serif; }
#aanbieding .contact { font: 12px "Arial", "Verdana", sans-serif; color: #c63; }

/* --------------------------------------------- contactformulier --------------------------------------------- */
#c-block #c-col #form img { border: none; margin: 0 3px 2px 0; padding: 0; clear: none; float: none; vertical-align: bottom; }
#c-block #c-col #form strong { color: #f60; font-weight: normal; }

.text { width: 217px; }
.postcode { width: 50px; }	
.woonplaats { width: 160px; }	
.textarea { width: 250px; }
.addition { color: #666; font: 95% "Verdana", "Arial", sans-serif; }	
code { font-size: 110%; padding: 8px; border: 1px solid #999; display: block; }
/* Home */
p.groet { line-height: 3;}
#c-block em, em { font-style: italic !important; }
