/*
    menu.css
    structuur menu:
    
   <div id="mainMenu">
      <ul id="menuList">
         <li class="menubar">
            <a href="#" class="head">Hoofdmenu</a>
            <ul class="menu">
               <li><a href="#">Keuze 1</a></li>
               <li><a href="#">Keuze 1</a></li>
               <li><a href="#">Keuze 1</a></li>
            </ul>
         </li>
      </ul>
   </div>



*/


/* this solves offsetLeft bug found in IE : http://crp2103.dyndns.org/endpoint/test.html 
#menuWrapper {
   width: 800px;
   padding-right: 0px;
   background-color: red;   
   margin-bottom: 00px;
   float: left;
}*/


#mainMenu {
	margin-top: 56px;
	width: 800px;
	float:right;
	text-align: left;
	background-color: transparent;
	color: #ffffff;
	height: 14px;
	font-size: 85%;
	letter-spacing: 0.1em;
}

#mainMenu ul  {
	margin:0;
	padding:0;
   font-weight:bold;
}

#mainMenu ul li.menubar {
   float: left;
   margin-left: 5px;
}


#mainMenu ul li.pipe {
   padding: 0 5px 0 5px;
   font-weight: bold;
   float: left;
   cursor: auto;
}

#menuList li {
   line-height: 14px;
   height: 14px;
   vertical-align: middle;
   text-transform: uppercase;
}


#menuList a {
   padding: 0 5px 0 5px;
   display: block;
   margin: 0;
   text-decoration: none;
   font-weight: bold;
}

#menuList a:hover {
   background-color: #CED1E5;
   color: #039;
}


#menuList li {
  list-style: none;
  display: inline;
}

a.head_link {
  background-color: transparent;
  color: #fff;
}

.menu {
   color: #039;
   background-color: #ECEDF4;
   border: 0px outset #4f4c4a;
   border-top: 0px solid red;
   position: absolute;
   visibility: hidden; 
   width: 170px;
   z-index: 40;
   display: inline;
   letter-spacing: 0em;
   font-weight:normal;
}



.menu li a {
   text-transform: none;
   background-color: #ECEDF4;
   border-bottom: 1px solid #CED1E5;
   color: #039;
   display: block;
   line-height: 17px;
   height: 17px;
   margin: 0px;
   padding: 0px 10px; 
   text-decoration: none;
}

.menu li a:hover {
   background-color: #CED1E5;
}



/* niveau 2 */
#subMenu {
   font-size: 12px;
   height: 18px;
   line-height: 18px;
   vertical-align: middle;
   margin-top: 4px;
   background-color: #bbcbe2;
   color: #095ba5;
}

#subMenu ul {
   list-style: none;
}

#subMenu ul li {
   float: left;
}

#subMenu ul li.plus {
   padding: 0 10px 0 10px;
   font-weight: bold;
   cursor: default;
}

#subMenu ul li a {
   display: block;
   color: #095ba5;
   padding: 0 5px 0 5px;
   text-decoration: none;
}

#subMenu ul li a:hover {
   background-color: #095ba5;
   color: #ffffff;
}
/* einde niveau 2 */