* { margin: 0; padding: 0; }
html, body { height:100%; }
body { text-align: center; background: url(pics/bgBody.gif) top repeat-x #dce1e4; }

#holder { position: relative; width: 859px; height: auto; overflow: hidden; margin: 0 auto; }

/* hhead */
#hhead { position: relative; width: 859px; height: 249px; text-align: left; background: url(pics/bgHHead.jpg); z-index:1; }

/* hhead - gallery */
#hhead ul#gallery { position: absolute; top: 22px; right: 16px; width: 569px; height: 227px; overflow: hidden; list-style: none; }
#hhead ul#gallery li { width: 569px; height: 227px; }

/* hhead - logo */
#hhead .hhead h1.logo { position: absolute; top: 41px; left: 60px; width: 216px; height: 126px; background: no-repeat; z-index: 2; } 
#hhead .hhead h1.logo a { position: absolute; top: 0px; left: 0px; display: block; width: 216px; height: 126px; z-index: 3; } 
#hhead .hhead h1.logo a span { display: none; } 

/* hbody */
#hbody { position: relative; float: left; padding: 40px 0px 10px 0px; width: 859px; height: auto; clear: both; background: url(pics/bgHBody.gif) repeat-y #FFFFFF; z-index: 1; }

/* hbody - generalmenu */
#hbody .hbody #generalMenu { position: absolute; top: -33px; left: 45px; width: 770px; height: 33px; z-index: 3; }
#hbody .hbody #generalMenu ul.generalMenu { list-style: none; }
#hbody .hbody #generalMenu ul.generalMenu li { display: block; float: left; width: 152px; height: 33px; margin-right: 2px; display: inline; background: url(pics/bgGeneralMenuItems.gif) left -33px !important; }
#hbody .hbody #generalMenu ul.generalMenu li a, 
#hbody .hbody #generalMenu ul.generalMenu li a:link, 
#hbody .hbody #generalMenu ul.generalMenu li a:active, 
#hbody .hbody #generalMenu ul.generalMenu li a:visited { display: block; width: 110px; height: 24px; overflow: hidden; padding: 9px 0px 0px 42px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; text-align: left; text-decoration: none; color: #000000; background: url(pics/bgGeneralMenuItems.gif); }
#hbody .hbody #generalMenu ul.generalMenu li a:hover, 
#hbody .hbody #generalMenu ul.generalMenu li a.active, 
#hbody .hbody #generalMenu ul.generalMenu li a.active:link, 
#hbody .hbody #generalMenu ul.generalMenu li a.active:visited, 
#hbody .hbody #generalMenu ul.generalMenu li a.active:hover, 
#hbody .hbody #generalMenu ul.generalMenu li a.active:active { display: block; width: 110px; height: 24px; padding: 9px 0px 0px 42px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; text-align: left; text-decoration: none; color: #000000; background: none; }
#hbody .hbody #generalMenu ul.generalMenu li a img { position: absolute; top: 6px; left: 12px; }
#hbody .hbody #generalMenu ul.generalMenu li.node1 a img { background: url(pics/ico_ontwerp.gif); }
#hbody .hbody #generalMenu ul.generalMenu li.node2 a img { background: url(pics/ico_aanleg.gif); }
#hbody .hbody #generalMenu ul.generalMenu li.node3 a img { background: url(pics/ico_onderhoud.gif); }
#hbody .hbody #generalMenu ul.generalMenu li.node4 a img { background: url(pics/ico_beregening.gif); }
#hbody .hbody #generalMenu ul.generalMenu li.node5 a img { background: url(pics/ico_referenties.gif); }
#hbody .hbody #generalMenu ul.generalMenu li a b { display: none; }

/* hbody - tplLeft */
#tplLeft { position: relative; width: 202px; float: left; }

/* hbody - tplLeft - main menu */
#mainMenu { position: relative; float: left; width: 202px; height: auto; }
#mainMenu ul.mainMenu { position: relative; float: left; margin: 0; display: inline; margin-left: 45px; width: 131px; height: auto; }
#mainMenu ul.mainMenu li { position: relative; float: left; width: 131px; min-height: 24px; margin: 0px 0px 3px 0px; text-align: left; background: url(pics/bgMainMenuItems.gif) top left no-repeat #FFFFFF; }
#mainMenu ul.mainMenu li a, 
#mainMenu ul.mainMenu li a:link, 
#mainMenu ul.mainMenu li a:active, 
#mainMenu ul.mainMenu li a:visited { position: relative; float: left; margin: 0; padding: 0px 0px 0px 5px; display: block; min-height: 24px; width: 126px; font-family: Arial, Helvetica, sans-serif; font-size: 13px; text-decoration: none; line-height: 24px; color: #000; border-bottom: 1px solid #e5e5e5; background: url(pics/divMainMenu.gif) right no-repeat; }
#mainMenu ul.mainMenu li a:hover, 
#mainMenu ul.mainMenu li a.active, 
#mainMenu ul.mainMenu li a.active:link, 
#mainMenu ul.mainMenu li a.active:visited, 
#mainMenu ul.mainMenu li a.active:hover, 
#mainMenu ul.mainMenu li a.active:active { position: relative; float: left; margin: 0; padding: 0px 0px 0px 5px; display: block; min-height: 24px; width: 126px;  font-family: Arial, Helvetica, sans-serif; font-size: 13px; text-decoration: none; line-height: 24px; color: #000; border-bottom: 1px solid #ffffff; background: none; }
#mainMenu ul.mainMenu li.lastNode a,
#mainMenu ul.mainMenu li.lastNode a:visited { border-bottom: 0px; }

#mainMenu ul.mainMenu li ul.active { position: relative; float: left; display: block; visibility: visible; margin: 2px 0px 0px 0px; padding-bottom: 18px; border-bottom: 1px solid #e5e5e5; }
#mainMenu ul.mainMenu li ul.active li { height: 25px; margin: 0; }
#mainMenu ul.mainMenu li ul.active li a,
#mainMenu ul.mainMenu li ul.active li a:active, 
#mainMenu ul.mainMenu li ul.active li a:visited { display: block; margin: 0; padding: 0px 18px 0px 18px; width: 95px; height: 24px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; background: #f2f2f2; border-bottom: 1px solid #d9d9d9; }
#mainMenu ul.mainMenu li ul.active li a:hover, 
#mainMenu ul.mainMenu li ul.active li a.active, 
#mainMenu ul.mainMenu li ul.active li a.mouse, 
#mainMenu ul.mainMenu li ul.active li a.active:visited, 
#mainMenu ul.mainMenu li ul.active li a.active:hover, 
#mainMenu ul.mainMenu li ul.active li a.active:active { display: block; margin:0; padding: 0px 18px 0px 18px; width: 95px; height: 24px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; background: #d5d5d5; border-bottom: 1px solid #d5d5d5; }
#mainMenu ul.mainMenu li ul.active li.firstNode { height: 25px; padding-top: 5px; background: url(pics/bgMainSubmenuFirstItem.gif) top left; }
#mainMenu ul.mainMenu li ul.active li.lastNode { height: 25px; padding-bottom: 5px; background: url(pics/bgMainSubmenuLastItem.gif) bottom left; }
#mainMenu ul.mainMenu li ul.active li.lastNode a,
#mainMenu ul.mainMenu li ul.active li.lastNode a:visited { border-bottom: 1px solid #f2f2f2; }

*html #hbody .hbody #mainMenu ul li ul li { display: block; width: 131px; height: 24px; overflow: hidden; }

/* hbody - tplLeft - Recent Projects */
#recentProjects { position: relative; float: left; display: inline; margin: 115px 0px 0px 45px; width: 130px; height: 172px;  }
#recentProjects h1 { padding: 0; margin-bottom: 10px; display: block; width: 130px; height: 24px; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 24px; color: #FFFFFF; background:url(pics/bgRecentProjects.gif); }
#recentProjects a,
#recentProjects a:visited { padding: 0; margin-top: 10px; display: block; width: 130px; height: 26px; border-top: 1px solid #dce1e4; border-bottom: 1px solid #dce1e4; font-family: Arial, Helvetica, sans-serif; font-size: 11px; line-height: 26px; text-align: justify; color: #46949d; }

/* hbody - tpl */
#hbody .tpl { position: relative; float: left; width: 612px; text-align: left; }
#hbody .tpl .intro { font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; padding-bottom: 11px; }

/* footer */
#footer { position: relative; float: left; padding-top: 35px; width: 859px; height: 35px; background: url(pics/bgHFoot.gif) top no-repeat; }
#footer #footMenu ul { height: 20px; overflow: hidden; margin: 0 auto; font: 11px Arial, Verdana, Helvetica, sans-serif; margin: 0; padding: 0 10px 0 0; list-style: none; }
#footer #footMenu ul li { padding: 0px 10px 0px 10px; display: inline; font-family: Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; color: #939da2; background: url(pics/divFootMenu.gif) right no-repeat; }
#footer #footMenu ul li a,
#footer #footMenu ul li a:visited { font-family: Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; color: #939da2; text-decoration: none; }
#footer #footMenu ul li a:hover,
#footer #footMenu ul li a:active, 
#footer #footMenu ul li a.active, 
#footer #footMenu ul li a:visited.active { font-family: Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; color: #939da2; text-decoration: underline; }
#footer #footMenu ul li.firstNode { padding-left: 0px; }
#footer #footMenu ul li.lastNode { padding-right: 0px; background: none; }