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

* { margin: 0; padding: 0; }

body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; color: #5f5e5e; line-height: 150%; background: url(../images/bg.gif) top repeat-x #7f7e7e; }

#holder { position: relative; margin: 0 auto; width: 909px; height: auto; overflow: hidden; }
#holder img.left { position: relative; float: left; width: 20px; }
#holder img.right { position: relative; float: right; width: 20px; }

#holder .holder { position: relative; float: left; padding: 0px 17px 17px 17px; width: 835px; background: #FFFFFF; }

#holder #header { position: relative; float: left; width: 100%; height: auto; }
#holder #header h1 { position: relative; float: left; margin: 13px 0px; width: 300px; height: 70px; }
#holder #header h1 a { position: relative; float: left; display: block; width: 300px; height: 70px; background: url(../images/logo.gif) 0 0 no-repeat; }
#holder #header h1 a span { display: none; }

#holder #header #menu { position: relative; float: left; width: 100%; height: 99px; background: #5f5e5e; }
#holder #header #menu ul { position: relative; float: right; width: auto; height: 24px; border-bottom: 3px solid #ffffff; list-style: none; }
#holder #header #menu ul li { float: left; border-left: 3px solid #ffffff; }
#holder #header #menu ul li a,
#holder #header #menu ul li a:visited { float: left; display: block; padding: 0px 10px; height: 24px; font-size: 9px; font-weight: bold; color: #FFFFFF; text-transform: uppercase; text-decoration: none; line-height: 24px; background: url(../images/bgHeaderMenu.gif) repeat-x; }
#holder #header #menu ul li a:hover,
#holder #header #menu ul li a.active { float: left; color: #bcd73e; }

#holder #header #menu h2 { position: relative; float: left; display: inline; margin: 18px 0px 0px 73px; width: 665px; height: 37px; background: url(../images/bgHeaderSlogan.gif) top left no-repeat; }
#holder #header #menu h2 span { display: none; }

#holder #header #categorie { position: relative; float: left; margin-top: 3px; width: 100%; height: 205px; }
#holder #header #categorie ul { position: relative; float: left; width: 100%; height: 205px; list-style: none; margin-left: 2px }
#holder #header #categorie ul li { float: left; margin-right: 5px; width: 162px; height: 205px; background: #116634; overflow: hidden; }
#holder #header #categorie ul li.lastNode { float: left; margin-right: 0px; width: 162px; height: 205px; }
#holder #header #categorie ul li a,
#holder #header #categorie ul li a:visited { text-align: center; position: relative; float: left; display: block; width: 162px; height: 205px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #000000; text-transform: uppercase; text-decoration: none; }
#holder #header #categorie ul li a:hover,
#holder #header #categorie ul li a.active { position: relative; float: left; display: block; width: 162px; height: 205px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #000000; text-transform: uppercase; text-decoration: none; }
#holder #header #categorie ul li a span,
#holder #header #categorie ul li a:visited span { font-size: 11px; position: absolute; z-index: 1; left: 0; top: 10px; display: block; width: 166px; height: 40px; line-height: 40px; opacity: 0.85; filter:alpha(opacity=85); cursor: pointer; background: #FFFFFF; }
#holder #header #categorie ul li a:hover span,
#holder #header #categorie ul li a.active span { opacity: 1; filter:alpha(opacity=100); background: #bcd73e; }
#holder #header #categorie ul li a img { float: left; margin: 0; border: 0; }
#holder #header #categorie ul li a.strong { font-weight: bold; }
 
#holder #breadcrum { position: relative; float: left; width: 100%; height: 40px; background: url(../images/bgBreadcrum.gif) 0 10px no-repeat; }
#holder #breadcrum .breadcrum { position: relative; float: left; width: 100%; height: 32px; background: url(../images/bgBreadcrum.gif) 0 31px no-repeat; }
#holder #breadcrum .breadcrum ul { position: relative; float: left; margin-top: 14px; width: 100%; height: 20px; list-style: none; }
#holder #breadcrum .breadcrum ul li { float: left; margin-right: 6px; font-size: 10px; color: #000000; }
#holder #breadcrum .breadcrum ul li a,
#holder #breadcrum .breadcrum ul li a:visited { font-size: 10px; color: #000000; text-decoration: none; }
#holder #breadcrum .breadcrum ul li a:hover,
#holder #breadcrum .breadcrum ul li a.active { font-size: 10px; color: #000000; text-decoration: underline; }

#holder #body { position: relative; float: left; width: 100%; height: auto; }
#holder #body .body { position: relative; float: left; padding: 0px 35px 20px 24px; width: 571px; height: auto; min-height: 200px; overflow: hidden; text-align: left; }
#holder #body .body h1 { margin-bottom: 15px; font-size: 12px; font-weight: normal; color: #115b2f; }
#holder #body .body h2 { font-size: 12px; font-weight: bold; color: #115b2f; }
#holder #body .body p { margin-bottom: 15px; }

#holder #body .body ul { margin-bottom: 15px; list-style: square; }
#holder #body .body ul li a,
#holder #body .body ul li a:visited { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; text-decoration: underline; color: #5f5e5e; }
#holder #body .body ul li a:hover { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; text-decoration: none; color: #5f5e5e; }

#holder #body .body ul.subCategorie { margin-top: 15px; list-style: none; }
#holder #body .body ul.subCategorie li { float: left; display: block; padding-left: 20px; width: 240px; height: 34px; }
#holder #body .body ul.subCategorie li.green { background: url(../images/bgListGreen.gif) left 4px no-repeat; }
/*#holder #body .body ul.subCategorie li.yellow { background: url(../images/bgListYellow.gif) left 4px no-repeat;}*/
#holder #body .body ul.subCategorie li.yellow { background: url(../images/bgListLightGreen.gif) left 4px no-repeat;}
#holder #body .body ul.subCategorie li a,
#holder #body .body ul.subCategorie li a:visited { font-weight: normal; color: #5d5c5d; text-decoration: none; }
#holder #body .body ul.subCategorie li a:hover,
#holder #body .body ul.subCategorie li a.active { font-weight: normal; color: #5d5c5d; text-decoration: underline; }

#holder #body .body ul.producten { margin-top: 15px; list-style: none; width: auto; height: auto; }
#holder #body .body ul.producten li { float: left; margin: 0px 4px 9px 0px; padding: 6px 6px 4px 6px; display: block; width: 124px; height: 230px; overflow: hidden; text-align: center; border: 1px solid #5f5e5e; }
#holder #body .body ul.producten li h2 { display: block; height: 30px; overflow: hidden; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #20663c; line-height: normal; text-decoration: none; }
#holder #body .body ul.producten li a,
#holder #body .body ul.producten li a:visited { display: block; height: 30px; overflow: hidden; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #20663c; line-height: normal; text-decoration: none; }
#holder #body .body ul.producten li a:hover,
#holder #body .body ul.producten li a.active { display: block; height: 30px; overflow: hidden; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #20663c; line-height: normal; text-decoration: underline; }
#holder #body .body ul.producten li a.lightbox,
#holder #body .body ul.producten li a.lightbox:hover,
#holder #body .body ul.producten li a.lightbox:visited { height: auto; }
#holder #body .body ul.producten li img { border: 1px solid #393939; }
#holder #body .body ul.producten li p { margin: 0; }
#holder #body .body ul.producten li span.product { display: block; }

#holder #body .rail { position: relative; float: right; width: 205px; height: auto; }
#holder #body .rail ul.subMenu { position: relative; float: right; margin-top: 3px; width: 205px; height: auto; list-style: none; }
#holder #body .rail ul.subMenu li { float: left; margin-bottom: 2px; width: 205px; height: 35px; background: #bcd73e; }
#holder #body .rail ul.subMenu li a,
#holder #body .rail ul.subMenu li a:visited { display: block; width: 205px; height: 35px; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; line-height: 35px; color: #2d2c2c; }
#holder #body .rail ul.subMenu li a:hover,
#holder #body .rail ul.subMenu li a.active { display: block; width: 205px; height: 35px; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; line-height: 35px; color: #2d2c2c; }
#holder #body .rail ul.subMenu li.even { float: left; margin-bottom: 2px; width: 205px; height: 35px; background: #20663c; }
#holder #body .rail ul.subMenu li.even a,
#holder #body .rail ul.subMenu li.even a:visited { display: block; width: 205px; height: 35px; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; line-height: 35px; color: #ffffff; }
#holder #body .rail ul.subMenu li.even a:hover,
#holder #body .rail ul.subMenu li.even a.active { display: block; width: 205px; height: 35px; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; line-height: 35px; color: #ffffff; }

#holder #body .rail ul.activiteit { position: relative; float: right; margin-top: 10px; width: 178px; height: auto; list-style: none; }
#holder #body .rail ul.activiteit li { text-align: left; }
#holder #body .rail ul.activiteit li a,
#holder #body .rail ul.activiteit li a:visited { padding-left: 18px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: none; color: #000100; }
#holder #body .rail ul.activiteit li a:hover,
#holder #body .rail ul.activiteit li a.active { padding-left: 18px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: underline; color: #000100; }
#holder #body .rail ul.activiteit li.odd a { background:url(../images/blockOdd.gif) left 2px no-repeat; }
#holder #body .rail ul.activiteit li.even a { background:url(../images/blockEven.gif) left 2px no-repeat; }

#holder #footer { position: relative; float: left; margin-top: 10px; width: 100%; height: 36px; background: #dfdfdf; }
#holder #footer ul { position: relative; float: right; width: auto; height: 36px; list-style: none; }
#holder #footer ul li { float: left; padding: 0px 11px 0px 10px; line-height: 36px; background: url(../images/bgFooterDiv.gif) right no-repeat; }
#holder #footer ul li a,
#holder #footer ul li a:visited { font-family: Arial, Helvetica, sans-serif; font-size: 9px; color: #116634; text-decoration: none; }
#holder #footer ul li a:hover,
#holder #footer ul li a.active { font-family: Arial, Helvetica, sans-serif; font-size: 9px; color: #116634; text-decoration: underline; }
#holder #footer ul li.firstNode { padding-left: 0px; }
#holder #footer ul li.lastNode { background: none; }
#holder #footer ul li.LimeSquare { background: none; }

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
	

/* Min-Width */
.lbWidth { /* most browsers */
	position: absolute;
	top: 0px; left: 0px;
	width: 100%;
	min-width: 790px;
	}

* html .lbContent { /* IE6 */
	margin-left: -790px;
	position:relative;
	}

* html .lbMinWidth { /* IE6 */
	padding-left: 790px;
	}
	
	
/* Clearfix */	
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */