* { margin: 0; padding: 0; }

body { text-align: center; background: #e0e0cf url(pics/bgBody.gif) left 251px repeat-x; }

/* holder */
#holder { position: absolute; top: 0; left: 0; padding-top: 16px; width: 100%; background: url(pics/bgHolder.gif) repeat-x; z-index: 1; }
#holder .holder { position: relative; margin: 0 auto; width: 948px; border: 0px solid #000; z-index: 2; }

/*
#holder { position: absolute; top: 0; left: 0; padding-top: 16px; width: 100%; z-index: 1; }
#holder .holder { position: relative; margin: 0 auto; width: 948px; border: 0px solid #000; z-index: 2; background: url(pics/bgHolder.gif) repeat-x;}
*/
body .laboratorium { background: url(pics/bgHolder_green.gif) repeat-x !important ; }
body .bouwstoffen { background: url(pics/bgHolder_blue.gif)  repeat-x !important;}
body .certification { background: url(pics/bgHolder_orange.gif) repeat-x !important ;}

/* head */
#hhead { position: relative; float: left; width: 948px; height: 235px; }
#hhead img.headImage { position: relative; float: left; width: 948px; height: 14px; }
#hhead .head { position: relative; float: left; padding: 0px 9px; width: 930px; height: 221px; }
#hhead .head .medewerker { position: relative; float: left; margin: 100px 0px 0px 18px; /*width: 113px; height: 131px;*/ }
#hhead .head .beeld { position: relative; float: right; margin: 60px 1px 0px 0px; width: 528px; height: 161px; overflow: hidden; }
#hhead .head .beeld #beeldwissel { position: absolute; top:0; left:0; width: 528px; height: 161px; }
#hhead .head .beeld #beeldwissel li { position: absolute; left:0; top:0; z-index: 3;  }
#hhead .head .beeld #beeldwissel li img { z-index: 3;  }

#hhead .head h1.logo { position: absolute; left: 35px; top: 23px; display: block; width: 165px; height: 65px; z-index: 4; }
#hhead .head h1.logo a { display: block; width: 166px; height: 63px; background: url(pics/logoHome.gif); }
#hhead .head h1.logo a span { display: none; }

/* businessunit menu */
#businessMenu { position: absolute; top: 160px; left: 210px; width: 792px; z-index: 5; }
#businessMenu ul.businessMenu {  list-style: none; }
#businessMenu ul.businessMenu li { position: relative; float: left; width: 264px; height: 147px; }
#businessMenu ul.businessMenu li img.bgBusinessUnit { position: absolute; width: 264px; height: 147px; top: 0; left: 0; z-index: 1; }
#businessMenu ul.businessMenu li a,
#businessMenu ul.businessMenu li a:visited { position: absolute; top: 11px; left: 7px; display: block; padding: 55px 0px 0px 44px; width: 204px; height: 63px; font-weight: bold; color: #000000; text-align: left; text-transform: uppercase; background: url(pics/bgBusiness.gif); z-index: 11; }
#businessMenu ul.businessMenu li span { position: absolute; top: 46px; left: 80px; display: block; padding-right: 25px; font-size: 19px; font-weight: normal; text-transform: uppercase; z-index: 10; }
#businessMenu ul.businessMenu li a b { display: none; }

#businessMenu ul.businessMenu li.node1 { position: absolute; left: 0px; top: 0px; z-index: 10; width: 264px; height: 147px; }
#businessMenu ul.businessMenu li.node1 a:hover,
#businessMenu ul.businessMenu li.node1 a.active { text-decoration: none; background: url(pics/bgBusinessBouwstoffen.gif) bottom left no-repeat; }
#businessMenu ul.businessMenu li.node1 span { color: #2d7f9e; visibility:hidden; background: url(pics/bgBusinessArrBouwstoffen.gif) right no-repeat; }

#businessMenu ul.businessMenu li.node2 { position: absolute; left: 220px; top: 0px; z-index: 9; width: 264px; height: 147px; }
#businessMenu ul.businessMenu li.node2 img.bgBusinessUnit { position: absolute; width: 264px; height: 147px; top: 0; left: 0; z-index: 1; }
#businessMenu ul.businessMenu li.node2 a:hover,
#businessMenu ul.businessMenu li.node2 a.active { text-decoration: none; background: url(pics/bgBusinessCertification.gif) bottom left no-repeat; }
#businessMenu ul.businessMenu li.node2 span { color: #ff9217; visibility:hidden; background: url(pics/bgBusinessArrCertification.gif) right no-repeat; }

#businessMenu ul.businessMenu li.node3 { position: absolute; left: 440px; top: 0px; z-index: 8; width: 264px; height: 147px; }
#businessMenu ul.businessMenu li.node3 a:hover,
#businessMenu ul.businessMenu li.node3 a.active { text-decoration: none; background: url(pics/bgBusinessLaboratorium.gif) bottom left no-repeat; }
#businessMenu ul.businessMenu li.node3 span { color: #63a101; visibility:hidden;background: url(pics/bgBusinessArrLaboratorium.gif) right no-repeat; }

#businessMenu ul.businessMenu li ul { display: none;  }

#hbody { position: relative; float: left; padding: 0px 10px; width: 928px; }
#hbody .hbody { position: relative; float: left; padding-top: 96px; width: 928px; background: #FFFFFF url(pics/bgHbody.gif) top repeat-x; }
#hbody .hbody .tpl { position: relative; float: left; padding: 0px 25px 50px 25px; width: 878px; }

/* businessunit menu intern */
.hbody .tpl ul.businessSubMenu { display: none; }
.bouwstoffen .hbody .tpl ul.businessSubMenu { display: block; }
.certification .hbody .tpl ul.businessSubMenu { display: block; }
.laboratorium .hbody .tpl ul.businessSubMenu { display: block; }

#hbody .hbody .tpl ul.businessSubMenu { position: relative; float: left; list-style: none; width: 212px; }
#hbody .hbody .tpl ul.businessSubMenu li { float: left; width: 212px; min-height: 0px; }
#hbody .hbody .tpl ul.businessSubMenu li a { display: none; }
#hbody .hbody .tpl ul.businessSubMenu li ul  { display: none; }

#hbody .hbody .tpl ul.businessSubMenu li.menuTitel { font-size: 19px; text-align: left; text-transform: uppercase; }
#hbody .hbody .tpl ul.businessSubMenu li a.active,
#hbody .hbody .tpl ul.businessSubMenu li a.active:hover,
#hbody .hbody .tpl ul.businessSubMenu li a.active:visited { display: block; min-height: 32px; font-size: 12px; font-weight: bold; text-align: left; text-decoration: none; line-height: 18px; color: #000000; }

/* businessunit menu intern - niveau 1 */
#hbody .hbody .tpl ul.businessSubMenu li ul.active { position: relative; float: left; list-style: none; display: block; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li { display: block; width: 212px; min-height: 23px; line-height: 23px; background: #e1e1cf; border-bottom: 1px solid #f3f3ec; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li a,
#hbody .hbody .tpl ul.businessSubMenu li ul.active li a:visited { padding: 0px 10px; display: block; width: 192px; min-height: 23px; color: #000000; font-size: 12px; text-align: left; }

#hbody .hbody .tpl ul.businessSubMenu li ul.active li a:hover { text-decoration: none; background: #55d0e7; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li a.active { min-height: 23px; line-height: 23px; text-decoration: none; background: #bdbda5; }

/* businessunit menu intern - niveau 2 */
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active { position: relative; float: left; margin-top: 1px; list-style: none; display: block; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li { display: block; width: 212px; min-height: 23px; line-height: 23px; background: #e1e1cf; border-bottom: 1px solid #f3f3ec; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li.lastNode { border-bottom: 0px; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a,
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a:visited { padding: 0px 10px 0px 22px; display: block; width: 180px; min-height: 23px; color: #000000; font-size: 12px; text-align: left; background: url(pics/divBusinessSubMenu.gif) 10px no-repeat; }
#hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a.active { min-height: 23px; line-height: 23px; text-decoration: none; background: #bdbda5 url(pics/divBusinessSubMenu.gif) 10px no-repeat; }

/* tpl - Breadcrum */
#hbody .hbody .tpl #breadcrumMenu { position: relative; float: right; width: 640px; }
#hbody .hbody .tpl #breadcrumMenu ul { position: relative; float: left; height: 20px; list-style: none; }
#hbody .hbody .tpl #breadcrumMenu ul li { display: inline; padding: 0px 14px 0px 7px; background: url(pics/divBreadCrum.gif) right 60% no-repeat; }
#hbody .hbody .tpl #breadcrumMenu ul li.firstNode { padding-left: 0px; }
#hbody .hbody .tpl #breadcrumMenu ul li.lastNode { font-size: 12px; background: none; }
#hbody .hbody .tpl #breadcrumMenu ul li a,
#hbody .hbody .tpl #breadcrumMenu ul li a:visited { font-size: 12px; color: #64645a; text-decoration: none; }
#hbody .hbody .tpl #breadcrumMenu ul li a:hover { font-size: 12px; color: #64645a; text-decoration: underline; }

/* tpl - Content */
#hbody .hbody .tpl #content { position: relative; float: right; padding-top: 40px; width: 640px; text-align: left; }
#hbody .hbody .tpl #content .intro { position: relative; float: left; padding: 17px 0px; width: 640px; font-weight: bold; text-align: left; }

/* Bouwstoffen */ 
.bouwstoffen #hbody .hbody .tpl ul.businessSubMenu li.menuTitel { color: #31819f; }
.bouwstoffen #hbody .hbody .tpl ul.businessSubMenu li ul.active li a:hover { text-decoration: none; background: #55d0e7; }
.bouwstoffen #hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a:hover { text-decoration: none; background: #55d0e7 url(pics/divBusinessSubMenu.gif) 10px no-repeat;; }
.bouwstoffen #hbody .hbody .tpl #breadcrumMenu ul li.lastNode { color: #31819f; }
.bouwstoffen #hbody .hbody .tpl #breadcrumMenu ul li a:hover { color: #31819f; }
.bouwstoffen #hbody .hbody .tpl h1 { color: #31819f; }
.bouwstoffen #hhead .head h1.logo a { display: block; width: 165px; height: 65px; background: url(pics/bouwstoffen.jpg); }
.bouwstoffen #hhead .head .medewerker {margin: 95px 0 0 18px; }


/* Certification */ 
.certification #hbody .hbody .tpl ul.businessSubMenu li.menuTitel { color: #ff9217; }
.certification #hbody .hbody .tpl ul.businessSubMenu li ul.active li a:hover { text-decoration: none; background: #ffbe76; }
.certification #hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a:hover { text-decoration: none; background: #ffbe76 url(pics/divBusinessSubMenu.gif) 10px no-repeat;; }
.certification #hbody .hbody .tpl #breadcrumMenu ul li.lastNode { color: #ff9217; }
.certification #hbody .hbody .tpl #breadcrumMenu ul li a:hover { color: #ff9217; }
.certification #hbody .hbody .tpl h1 { color: #ff9217; }
.certification #hhead .head h1.logo a { display: block; width: 167px; height: 63px; background: url(pics/certification.jpg); }
.certification #hhead .head .medewerker {margin: 89px 0 0 45px; }

/* Laboratorium */ 
.laboratorium #hbody .hbody .tpl ul.businessSubMenu li.menuTitel { color: #67a308; }
.laboratorium #hbody .hbody .tpl ul.businessSubMenu li ul.active li a:hover { text-decoration: none; background: #c7dda3; }
.laboratorium #hbody .hbody .tpl ul.businessSubMenu li ul.active li ul.active li a:hover { text-decoration: none; background: #c7dda3 url(pics/divBusinessSubMenu.gif) 10px no-repeat;; }
.laboratorium #hbody .hbody .tpl #breadcrumMenu ul li.lastNode { color: #67a308; }
.laboratorium #hbody .hbody .tpl #breadcrumMenu ul li a:hover { color: #67a308; }
.laboratorium #hbody .hbody .tpl h1 { color: #67a308; }
.laboratorium #hhead .head h1.logo a { display: block; width: 167px; height: 63px; background: url(pics/laboratorium.jpg); }
.laboratorium #hhead .head .medewerker {margin: 95px 0 0 1px; }

/* main menu */
#mainMenu { position: absolute; top: 37px; right: 23px; width: 700px; height: 22px; z-index: 6; }
#mainMenu ul.mainMenu { float: right; list-style: none; height: 22px; }
#mainMenu ul.mainMenu li { float: left; padding: 0px 12px 0px 13px; line-height: 22px; background: url(pics/divMainMenu.gif) left no-repeat; }
#mainMenu ul.mainMenu li a { float: left; line-height: 22px; }
#mainMenu ul.mainMenu li a, 
#mainMenu ul.mainMenu li a:link, 
#mainMenu ul.mainMenu li a:active, 
#mainMenu ul.mainMenu li a:visited { font-family: Arial, Helvetica, sans-serif; font-size: 13px; text-transform: uppercase; color: #000000; }
#mainMenu ul.mainMenu li.firstNode { padding-left: 0px; background: none; }
#mainMenu ul.mainMenu li.lastNode { padding-right: 0px; background: none; }
#mainMenu ul.mainMenu li.lastNode a,
#mainMenu ul.mainMenu li.lastNode a:visited { padding: 0px 27px 0px 7px; width: auto; height: 20px; color: #FFFFFF; background: #ababac url(pics/bgBtnLogin.gif) 96% no-repeat; border: 1px solid #89898a; border-left-color: #bcbcbd; border-top-color: #bcbcbd; cursor: pointer; }

#hfoot { position: relative; float: left; width: 948px; height: 148px; text-align: center; top: -20px; }
#hfoot .foot { position: relative; float: left; padding: 4px 0px 0px 28px; width: 920px; height: 16px; }
#hfoot .foot address { position: relative; float: left; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #e0e0cf; }
#hfoot .foot address a,
#hfoot .foot address a:visited { text-decoration: none; color: #e0e0cf; }
#hfoot .foot address a:hover { text-decoration: underline; color: #e0e0cf; }
#hfoot .foot address a.email,
#hfoot .foot address a.email:visited { text-decoration: none; color: #ff905f; }
#hfoot .foot address a.email:hover { text-decoration: underline; color: #ff905f; }

#hfoot #footMenu { position: relative; margin: 0 auto; padding-top: 8px; width: auto; }
#hfoot #footMenu ul { position: relative; width: auto; margin: 0 auto; }
#hfoot #footMenu ul li { display: inline; padding: 0px 11px 0px 10px; background: url(pics/divFootmenu.gif) right no-repeat; }
#hfoot #footMenu ul li.lastNode { background: none; }
#hfoot #footMenu ul li a,
#hfoot #footMenu ul li a:visited { text-decoration: none; color: #363636; }
#hfoot #footMenu ul li a:hover { text-decoration: underline; color: #363636; }
