/*************************************************************

  

  author:         I-Folks (c)

  company:        Vasco

  version:        1.0



  created on:     14.02.2008

  last modified:  18.02.2008

  

  CONTENT

  -------

  01. PAGE STRUCTURE

  02. WRAPPERLEFT (Leftside)

  03. WRAPPERRIGHT (Rightside)

  04. FOOTER

    

/************************************************************/





/*============================================================

  01. PAGE STRUCTURE

============================================================*/



* { font-size: 100%; }



body { background: #231f20; margin: 60px 0 0 0; padding: 0 }



#wrapper { height: 500px; margin: 0 auto; width: 900px; position: relative; }







/*============================================================

  02. WRAPPERLEFT

============================================================*/



#wrapperleft { color: #fff; float: left; font: bold 1.13em/1.33em Verdana, Arial, Helvetica, sans-serif; height: 500px; width: 126px; overflow: hidden; }



#wrapperleft a       { color: #fff; text-decoration: underline }

#wrapperleft a:hover { color: #cc0000 }



#wrapperleft h1   { margin: 36px 0 0 }

#wrapperleft h1 a { background: url(../images/LOGO.jpg); display: block; height: 51px; width: 126px }



#wrapperleft input[type="text"], #wrapperleft input.login { background: #fff; border: 0; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; padding: 2px; width: 95px }

#wrapperleft input:focus        { outline: 0 }

#wrapperleft span.login 

{

    font-size: 0.6em;

}





/*============================================================

  03. WRAPPERRIGHT

============================================================*/

#PartnerLogin {

	text-transform: uppercase;

	color: #6d6e71;

	font-size: 14px;

	font-weight: normal;

}



#wrapperrechts { float: right; height: 500px; width: 774px;}



/*============================================ topnavigatie */

#topnavigatie {

	color: #6d6e71;

	font: normal 0.88em Verdana, Arial, Helvetica, sans-serif;

	height: 30px; /*51px;*/

	padding: 5px 0 0;

	/*width: 174px;*/

}



#topnavigatie a        { color: #6d6e71; text-decoration: none; text-transform: uppercase }

#topnavigatie a:hover  { color: #fff }

#topnavigatie a:active { color: #fff; font-weight: bold }



#topnavigatie input[type="text"] { background: #6d6e71; border: 0; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; padding: 2px; width: 115px }

#topnavigatie input:focus        { outline: 0 }



/*=============================================== navigatie */

#navigatie   { background: #6d6e71; float: left; font: 0.69em Verdana, Arial, Helvetica, sans-serif; height: 400px; overflow: hidden; padding: 7px 0 0; width: 143px }

*>#navigatie { overflow: visible }



#navigatie ul { list-style: none; margin: 0 0 0 4px; padding: 0 0 0 4px; text-transform: uppercase }



#navigatie a        { color: #000; text-decoration: none }

#navigatie a:hover  { color: #fff }

#navigatie a:active { color: #fff; font-weight: bold }



/*=============================================== tekstvlak */

#tekstvlak { float: left; font: 0.69em/1.18em Verdana, Arial, Helvetica, sans-serif; height: 407px; width: 631px }



#tekstvlak p { margin: 10px 0 }



#tekstvlak ul    { list-style: disc outside; margin: 0 0 0 35px; padding: 0 }

#tekstvlak ul li {
	margin: 0;
	padding: 0;
	list-style-type: none;
 }



#tekstvlak h1 { font-size: 1.27em; font-weight: bold; line-height: 100%; margin: 10px 0; text-transform: uppercase }

#tekstvlak h2 { font-size: 1.18em; font-weight: bold; line-height: 100%; margin: 10px 0; text-transform: uppercase }



#tekstvlak a       { color: #000 }

#tekstvlak a:hover { color: #666 }



#tekstvlak :focus { outline: 0 }



/*========================================== PRODUCTS pages */

#product { background: url(../images/INTRO.jpg); color: #fff; float: left; height: 97px; padding: 305px 5px 5px; width: 541px }


#vloerverwarming { background: url(../images/vloerverwarming1.jpg); color: #000; float: left; height: 400px; padding: 2px 5px 5px 310px; width: 236px }
#wandverwarming { background: url(../images/wandverwarming.jpg); color: #000; float: left; height: 400px; padding: 2px 5px 5px 310px; width: 236px }


#systemen { background: url(../images/vloerverwarming2.jpg); color: #000; float: left; height: 97px; padding: 305px 5px 5px; width: 541px }

#systemen_noppen { 
background: url(../images/noppenplaat.jpg); color: #000; float: left; height: 400px; padding: 2px 5px 5px; width: 541px }
#systemen_tacker { 
background: url(../images/tacker.jpg); color: #000; float: left; height: 400px; padding: 2px 5px 5px; width: 541px }
#systemen_gecoat { 
background: url(../images/gecoat_net.jpg); color: #000; float: left; height: 400px; padding: 2px 5px 5px; width: 541px }


#warmtebehoefteberekenen                    { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }

#warmtebehoefteberekenen input[type="text"] { background: #fff; border: 1px solid #666; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; padding: 2px; width: 50px }

#warmtebehoefteberekenen a                  { background: #000; color: #fff; padding: 2px 5px; text-decoration: none }

#warmtebehoefteberekenen a:hover            { background: #cc0000; }

/* LEGEND with Heat Calculation */
#warmtebehoefteberekenen table.legend    { border: 1px solid #231f20; font: 10px/14px Verdana, Arial, Helvetica, sans-serif; margin: 10px 0 }
#warmtebehoefteberekenen table.legend th { background: #231f20; color: #fff; font-weight: normal; padding: 2px; text-transform: uppercase }
#warmtebehoefteberekenen table.legend td { padding: 2px 15px 2px 8px }




#gerichtzoekenindex { background: url(../images/gerichtzoeken.jpg); float: left; height: 407px; width: 551px }



#gerichtzoeken                { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }

#gerichtzoeken a.search       { background: #000; color: #fff; font-weight: bold; padding: 2px 5px; text-decoration: none }

#gerichtzoeken a:hover.search { background: #cc0000 }



/*============================================ NIEUWS pages */

#nieuws { background: url(../images/news.jpg); float: left; height: 407px; width: 551px }



#nieuwscontent 
{
    background: #fff; 
    color: #000; 
    float: left; 
    height: 407px; 
    width: 551px;
    overflow: hidden;
}

*>#nieuwscontent
{
    overflow: visible;
}


/*========================================= DOWNLOADS pages */

#downloads { background: url(../images/downloads.jpg); float: left; height: 407px; width: 551px }

#downloadscontent { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }

#lastenboek { background: url(../images/lastenboek.jpg); float: left; height: 407px; width: 551px }


/*=============================================== FAQ pages */

#faq { background: url(../images/faq.jpg); color: #000; float: left; height: 397px; padding: 5px 285px 5px 5px; width: 261px }



#faqcontent          { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }

#faqcontent textarea { background: #fff; border: 1px solid #666; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; height: 100px; overflow: auto; padding: 2px; width: 300px }



#kleuren { background: url(../images/kleuren_sfeer.jpg); color: #000; float: left; height: 71px; padding: 331px 5px 5px 188px; width: 358px  }



/*=========================================== DEALERS pages */

#dealers                        { background: url(../images/dealers.jpg); color: #000; float: left; height: 397px; padding: 5px 285px 5px 5px; width: 261px; overflow: auto; }

#dealers input[type="checkbox"] { border: 0; margin: 0; padding: 0 }

#dealers input[type="text"]     { background: #fff; border: 0; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; padding: 2px; width: 115px }

#dealers a.search               { color: #000; font-weight: bold; text-decoration: none }

#dealers a:hover.search         { color: #cc0000 }



/*=========================================== BEDRIJF pages */

#company { background: url(../images/company.jpg); float: left; height: 407px; width: 551px }
#bedrijf { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }



/*=========================================== CONTACT pages */

#contact              { background-color:#FFFFFF; color: #000; float: left; height: 397px; padding: 5px 285px 5px 5px; width: 261px; overflow: auto; }

#contact a.send       { background: #000; color: #fff; font-weight: bold; text-decoration: none; padding: 2px 5px }

#contact a:hover.send { background: #cc0000; color: #fff }



#contact table           { border: 0; padding: 2px; width: 523px }

#contact table td.right  { text-align: right }

#contact table td.person { background: #dedede; padding: 5px; vertical-align: top; width: 50% }



#contact input[type="text"]  { background: #fff; border: 1px solid #666; color: #000; font: normal 12px/18px Arial, Helvetica, sans-serif; padding: 2px; width: 160px }

#contact input[type="radio"] { border: 0; color: #000; margin: 0; padding: 0 }



/*============ Privacy policy - Terms of use - Legal notice */

#content { background: #fff; color: #000; float: left; height: 397px; overflow: auto; padding: 5px; width: 541px }





.BGRhome {

	background-color: #090b0e;

	background-image: url(../images/BGRhome.jpg);

	background-position: bottom left;

	background-repeat: no-repeat;

	color: #fff;

}



.titelhome {

	padding: 230px 0 0 150px;

}



#taalkeuze {

	padding-left: 305px;

}







#navigatiesub a:active {

	color: #fff;

	text-decoration: none;

	font-weight: normal;

}



a.actief {

	color: #fff !important; 

	/*text-decoration: none;*/

	font-weight: bold;

}



a.actiefNietBoldWit {

	color: #fff!important; 

}



a.actiefNietBold {

	color: #000!important; 

}



/*tekstvlak */



	#sfeerbeeld, #inhoudblok {

		width: 551px;

		height: 407px;

		float: left;

		background-color: #fff;

	}

	#sfeerbeeld

	{

	    overflow: hidden;

	}

	*>#sfeerbeeld {

		overflow: visible;

	}

	#inhoudblok {

		overflow: auto;

		position: relative;

	}

	

#productinfo         { background: #fff; color: #000; font-weight: bold; height: 17px; left: 349px; padding: 3px 21px 0 0; position: absolute; text-align: right; text-transform: uppercase; top: 423px; width: 530px; /* filter */ filter: alpha(opacity=60); opacity: .6 }	

#productinfo a       { color: #000; text-decoration: none }

#productinfo a:hover { color: #666 }

	

	#technischeinfo {

		width: 250px;

		height: 230px;

		position: absolute;

		top: 60px;

		left: 600px; /* info op technische fiches */

	}

	

	#technischeinfo a:link, #technischeinfo a:visited, #technischeinfo a:active {

		color: #000;

		text-decoration: underline;

	}

	

	#technischeinfo a:hover, #technischeinfo a:visited:hover {

		color: #666666;

		text-decoration: underline;

	}

	

	#technischeinfo ul {

		list-style: none;

		padding: 5px 0 0 10px;

		margin: 0;

	}

	

	#inputonder {

		width: 551px;

		position: absolute;

		top: 333px;

		left: 0px;

		text-transform: uppercase;

		color: #fff;

	}

	

	.kleuren#inputonder {

		width: 361px;

		color: #000;

		padding-left: 190px;

	}

	

	/*INPUT*/

		

		/*     nieuws     */

			

		#inputondernieuws {

			color: #000;

			width: 536px;

			position: absolute;

			top: 223px;

			left: 0px;

			padding: 5px 5px 5px 10px;

		}

		

			#inputondernieuws h1 {

				font-size: 12px;

				padding: 0 0 7px 0;

				margin: 0;

			}

			

			#inputondernieuws h2 {

				font-size: 11px;

				padding: 5px 0 3px 0;

				margin: 0;

			}

			

		/*     dealer     */

		

		#inputonderdealer {

			color: #000;

			width: 536px;

			position: absolute;

			top: 183px;

			left: 0px;

			padding: 0 5px 0 10px;

			text-transform: uppercase;

		}

		

		/*     technische info     */

		

		#inputtechnischeinfo {

			padding: 10px 15px 0 15px;

			margin: 0;

		}

		

			#inputtechnischeinfo a:link, #inputtechnischeinfo a:visited, #inputtechnischeinfo a:active,

			#inputbedrijf a:link, #inputbedrijf a:visited, #inputbedrijf a:active {

				color: #000;

				text-decoration: underline;

			}

			

			#inputtechnischeinfo a:hover, #inputtechnischeinfo a:visited:hover,

			#inputbedrijf a:hover, #inputbedrijf a:visited:hover {

				color: #666666;

				text-decoration: underline;

			}

			

			#inputtechnischeinfo ul {

				list-style: disc outside;

				padding: 5px 0 0 10px;

				margin: 0;

			}

			

			#inputtechnischeinfo h1 {

				text-transform: uppercase;

				padding: 0;

				margin: 0 0 5px 0;

				font-size: 14px;

				font-weight: normal;

			}

			

		/*     Gericht zoeken     */

		

		#inputzoek {

			text-transform: uppercase;

			padding: 0;

			margin: 10px 0 0 0;

		}

		

			#inputzoek h1 {

				margin: 10px 0 10px 0;

				padding: 0;

				font-size: 12px;

				border-top: 1px solid #000;

			}

		

			#inputzoek input[type=radio].redone { 

				appearance:normal;

				display:inline-block;

				background:url(../images/radio-button.gif) no-repeat;

				margin: 0 5px 0 5px;

			}

			

			#inputzoek input[type=submit] {

				background-color: #96875d;

				text-transform: uppercase;

				font-weight: bold;

				border: none;

				margin-right: 10px;

			}

			

		/*     bedrijf     */

			

		#inputbedrijf {

			padding: 15px;

			margin: 0;

		}

		

			#inputbedrijf h1 {

				font-size: 12px;

				text-transform: uppercase;

				padding: 0;

				margin: 0 0 7px 0;

			}

			

			#inputbedrijf h2 {

				font-size: 11px;

				padding: 0;

				margin: 0 0 5px 0;

			}

	

	#achtergrondkleur {

		background-color: #96875d;

		width: 200px;

		padding: 3px;

	}		

	

	#balkproducten {

		/* breedte van groene balk */

		width: 75px;

		height: 407px;

		float: left;

		color: #fff;

		border-left: 5px solid #6d6e71;

		

		background-image: url(../images/BGR_groenebalk.gif);

		background-repeat: repeat-y;

		background-position: top left;

		

		/*background-color: #7aaa33;*/

	}

	

	#balkproducten.balkproductengroen div#balkproducten2{

		height: 407px;

		/*background-image: url(../images/awards.jpg);*/

		background-repeat: no-repeat;

		background-position: bottom right;

	}

	

	#balkproducten a:link, #balkproducten a:visited, #balkproducten a:active{

		color: #fff;

		text-decoration: none;

		border-bottom: 1px solid #fff;

		display:block;

	}

	

	#balkproducten a:hover, #balkproducten a:visited:hover, #productitemHuidig a {

		color: #000;

		text-decoration: none;

		border-bottom: 1px solid #000!important;

		display:block;

	}

	

	.awards {

		padding-top: 200px;

	}

	

	#productitem {

		/*border-bottom: 1px solid #fff;*/

		width: 75px;

		float: left;

		background-position: right;

		background-repeat: no-repeat;

		padding-top: 5px;

		text-transform: uppercase;

		margin-top: 5px;

	}

	

	#productitemHuidig {

		/*border-bottom: 1px solid #fff;*/

		width: 75px;

		float: left;

		background-position: right;

		background-repeat: no-repeat;

		padding-top: 5px;

		text-transform: uppercase;

		margin-top: 5px;

	}

	

#baseline { font: 0.75em Verdana, Arial, Helvetica, sans-serif; float: left; display: inline; height: 17px; margin: 0 0 0 162px; padding: 3px 0 0; width: 612px }

.groen    { color: #7aaa33 }







/*============================================================

  04. FOOTER

============================================================*/



#footer { color: #6e6e6e; float: left; font: normal 0.63em/1.6em Verdana, Arial, Helvetica, sans-serif; height: 17px; padding: 20px 0 0; width: 774px }



#footer a       { color: #6e6e6e; text-decoration: none }

#footer a:hover { color: #fff }



/*============================================================

  05. MENNO - FOTOGALERIJ

============================================================*/



div.thumbnails {

    height: 78px;

    margin-top: -78px;

    overflow: hidden;

    background-color: #000;

    

    z-index: 3;

    position: relative;

    width: 100%;

}



div#thumbnailbar {

    height: 78px;

    width: 4000px;

}



div#measurediv{

    float: left;

    min-width: 50px;

}



*>div#measurediv{

    width: auto;

}



img.thumbnail {

    cursor: pointer;

    border-right: 1px solid #000;

}



#beeldbackground, #beeldpopup{

    position: absolute;

    left: 20px;

    top: 20px;

    width: 700px;

    height: 370px;

    z-index: 4;

    border: 1px solid #fff;

}



#beeldbackground {

    background-color: #fff;

    opacity: .9;

	filter: alpha(opacity=90);

	z-index: 4;

}



#beeldpopupimg {

    float: left;

}



div.beeldpopupdv {

    width: 20px;

    float: right;

    text-align: right;

}



div.beeldpopupdv input {

    border: 0px solid transparent;

    background-color: transparent;

    font-weight: bold;

    padding: 3px;

    margin: 1px 3px 1px 3px;

}



a#beeldpopuplink {

    float: left;

    width: 696px;

    height: 16px;

    display: block;

    clear: both;

    padding: 2px;

    color: #000;

    background-color: #fff;

}



input.login_knop, input.zoek_knop

{

    border: 0px solid Transparent;

    background-color: Transparent;

    color: #fff;

    font-weight: bold;

    padding: 0px;

    cursor: pointer;

    height: 24px;

    font-size: 19px;

}



input.zoek_input 

{

    width: 115px;
	color:#bbb!important;

}



input.login_knop:hover, input.zoek_knop:hover

{

    color: #cc0000;

}

.zoekTekstInput{

	position:absolute;

	top:-14px;

	left: 0px

}



.inputZoekTopNave {

	margin: 0px; 

	padding: 0px; 

	display: inline; 

	position: relative

}

#banner_home {
width:120px;
height:170px;
position:absolute;
top:272px;
left:6px;
}
#banner_home_info {
width:774px;
height:407px;
position:absolute;
top:34px;
left:126px;
}
#banner_producten {
	width:774px;
	height:407px;
	position:absolute;
	top:35px;
	left:126px;
	background-image: url(../images/banner_producten.jpg);
	background-repeat: no-repeat;
	background-position: top;
	
}

#banner_producten_baseline
{
	padding-top: 10px;
	padding-left: 20px;
	color: #CE071E;
	font-size: 15px;
	font-weight: normal;
	line-height: 30px;
	padding-right: 400px;
	height: 365px;
	overflow: hidden;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	text-align: justify;
	float: left;

}

#banner_producten_footer {
	width: 774px;
	height: 32px;
	float: left;
}

#banner_producten2 {
	width:774px;
	height:407px;
	position:absolute;
	top:35px;
	left:126px;
	background-image: url(../images/producten_nieuw_bg.jpg);
	background-repeat: no-repeat;
	background-position: top;
}
#banner_producten_baseline2
{
	padding-top: 10px;
	padding-left: 20px;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: normal;
	height: 365px;
	overflow: hidden;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	text-align: justify;
	float: left;
	width: 754px;
	line-height: 16px;

}


#banner_producten_baseline2 h1 {
	font-size: 24px;
	text-transform: uppercase;
	color: #B1B2B4;
}
#banner_producten_baseline2 a:link
{
	color: #FFFFFF;
	text-decoration: none;
}

#banner_producten_baseline2 a:visited
{
	color: #FFFFFF;
	text-decoration: none;
}
#banner_producten_baseline2 a:hover {
	color: #CD071E;
	text-decoration: none;
}
#banner_producten_baseline2 a:active {
	color: #CD071E;
	text-decoration: none;
}
#banner_producten_baseline2 img {
	border: thin solid #111015;
}
#banner_producten_baseline2 a:hover img {
	border: thin solid #CC061F;
}

/* Speciale pagina's - volledig beeld, submenu is verborgen - Rubriek FILM  */

#volle_pag_met_submenu_film {
	width:631px;
	height:407px;
	position:absolute;
	top:35px;
	left:269px;
	background-color: #FFFFFF;
}
.klein {
	font-size:10px;
}