#header { background-image: url(../images/visuals/header_gras.png); height: 113px; z-index: 5; }

#navigation H1 { POSITION: absolute; TOP: -1000em; }

#navigation H2 { POSITION: absolute; TOP: -1000em; }

.topheader { height: 100px; background-color: #336600; }


#separator{ float: left; margin-top: 8px; background-image: url(../images/layout/bg_nav.png); height: 4.2em; width: 277px; }

.primair { margin: 0px; padding: 0px; background-color: #71A700; float: left; }

.secundair { float: left; padding-top: 15px; margin-top: 8px; width: 259px; height: 2.9em; background: url(../images/layout/bg_secundair_nav.png) left; }

.secundair a { text-decoration: none; color: #498100; }

.secundair a:hover { color: #FFF; }

.secundair ul { display: inline; margin-left: 13px; padding: 0; }
 
.secundair ul li { margin-left: 0; padding-left: 7px; padding-right: 3px; background-image: url(../images/layout/sep_secundair.gif); background-repeat: no-repeat; background-position: left; list-style: none; display: inline; }
	
.secundair ul li.first { margin-left: 0; background-image: none; list-style: none; display: inline; }

.itemgras{ width: 129px; height: 55px; }

.itemgras a{ display: block; width: 123px; height: 49px; background-image: url(../images/layout/tab_gras_up.png); }

.itemgras a:hover{ height: 49px; background-image: url(../images/layout/tab_gras_down.png); }

.itemgras a.highlighted{ background-image: url(../images/layout/tab_gras_down.png); }

.itemfourage{ width: 129px; height: 55px; margin-left: -24px; }

.itemfourage a { display: block; width: 123px; height: 49px; background-image: url(../images/layout/tab_fourage_up.png); }

.itemfourage a:hover{ height: 49px; background-image: url(../images/layout/tab_fourage_down.png); cursor: pointer; }

.itemfourage a.highlighted{ background-image: url(../images/layout/tab_fourage_down.png); }

.submenulistgras{ position: absolute; width: 490px; height: 12em; background-image: url(../images/layout/bg_subnav.png); background-repeat: repeat-x; margin-left: 10px; padding-left: 12px; padding-top: 10px; border-bottom: solid 1px #336600; }

.submenulistgras a{ margin-left: 6px; height: 1.3em; width: 9.4em; background-image: url(../images/icons/nav_arrow.gif); background-repeat: no-repeat; background-position: right; }

.submenulistgras a:hover{ margin-left: 6px; height: 1.3em; width: 9.4em; background-image: url(../images/icons/nav_arrow_white.gif); background-repeat: no-repeat; background-position: right; }

.submenulistfourage{ position: absolute; width: 373px; height: 12em; background-image: url(../images/layout/bg_subnav.png); background-repeat: repeat; margin-left: -95px; padding-left: 129px; padding-top: 10px; border-bottom: solid 1px #336600; }

.submenulistfourage a{ margin-left: -5px; height: 1.3em; width: 9.4em; background-image: url(../images/icons/nav_arrow.gif); background-repeat: no-repeat; background-position: right; }

.submenulistfourage a:hover{ margin-left: -5px; height: 1.3em; width: 9.4em; background-image: url(../images/icons/nav_arrow_white.gif); background-repeat: no-repeat; background-position: right; }

	
/* HORIZONTAL FREESTYLE MENU LAYOUT */
/* All <ul> tags in the menu including the first level */
.menulist { margin: 0; padding: 0; list-style: none; }

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul { display: none; top: 1.0em; margin-top: 44px; /* I'm using ems and px to allow people to zoom their font */ left: -1px; }

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul { top: -1px; margin-top: 0; }

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li { float: left; display: block; position: relative; list-style: none;}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li { float: none; position: relative; margin-bottom: -1px; }

.menulist ul>li:last-child { margin-bottom: 1px; /* Mozilla fix */ }

/* Links inside the menu */
.menulist a { display: block; padding: 3px; text-decoration: none; }

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus { color: #FFF; }

.menulist a.highlighted { color: #FFF; }

/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/
/* Only style submenu indicators within submenus. */
.menulist a .subind { display: none; }

.menulist ul a .subind { display: block; float: right; }

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a { float: left; }

.menulist ul a { float: none; }

/* \*/
.menulist a { float: none; }

/* */
/*
 HACKS: IE/Win:
 A small height on <li> and <a> tags and floating prevents gaps in menu.
 * html affects <=IE6 and *:first-child+html affects IE7.
 You may want to move these to browser-specific style sheets.
*/
*:first-child+html .submenulistgras ul li { float: left; width: 100%; }

* html .submenulistgras ul li { float: left; height: 1%; }

* html .submenulistgras ul a { height: 1%; }

*:first-child+html .submenulistfourage ul li { float: left; width: 100%;}

* html .submenulistfourage ul li { float: left; height: 1%;}

* html .submenulistfourage ul a { height: 1%; }

/* End Hacks */
/* Footer */
#footercontent{ width: 770px; height: 38px; background: url(../images/layout/bg_footer_left.png) no-repeat #FFFFFF; font-size: 0.9em; color: #336600; margin: 0 auto; }

#footercontent .footernav { float: left; margin-top: 11px; }

.footernav a { text-decoration: none; }

.footernav a:hover{ text-decoration: underline; }

.footernav ul { margin-left: 33px; padding-left: 0; display: inline; }
 
.footernav ul li { margin-left: 0; padding-left: 6px; padding-right: 3px; border-left: 1px solid #336600; list-style: none; display: inline; }
	
.footernav ul li.first { margin-left: 0; border-left: none; list-style: none; display: inline; }

#footercontent .gmp { margin-left: 511px; padding-left: 28px; padding-top: 3px; height: 35px; background: url(../images/layout/bg_footer_right.png) repeat-y; }

.gmp a { display: block; width: 32px; height: 32px; background-image: url(../images/icons/gmp.jpg); }

.gmp a:hover{ background-image: url(../images/icons/gmpkl.jpg); cursor: pointer; }

.gmp h3 { position: absolute; top: -1000em; }

#sitemap ul { list-style: none; vertical-align: top; margin-left: 5px; padding-left: 0px; }

#sitemap a { text-decoration: none; list-style-image: url(../images/icons/anchor_icon.gif); vertical-align: top; margin-left: 5px; padding-left: 0px; }

#sitemap a:hover{ text-decoration: underline; list-style-image: url(../images/icons/anchor_icon_over.gif); }

#sitemap li { margin-top: 0.5em;   }

#sitemap ul li h3 { margin-left: 0; }

/*** IE6 Fix ***/
* html #footercontent .gmp {
  margin-left: 508px; }
* html #separator {
  margin-top: 0px; }
* html .secundair {
  margin-top: 0px; }
* html .primair {
  margin-top: -8px; }