#menu {
    width:837px;
    margin-left:187px;
    height:70px;
    z-index:100;
    display:block;
    float:left;
    clear:both;
}

/* remove all the bullets, borders and padding from the default list styling */
#menu ul {
    list-style-type:none;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#menu li {
    float:left;
    position:relative;
}

/* style the links for the top level */
#menu a, #menu a:visited {
    display:block;
    font-size:12px;
    text-decoration:none;
    color:#fff;
    width:93px;
    height:19px;
    margin-left:0px;
    line-height:19px;
    padding-top:45px;
    padding-bottom:6px;
    text-align:center;
    overflow:hidden;
}


/* hide the sub levels and give them a positon absolute so that they take up no room */
#menu ul ul {
    visibility:hidden;
    position:absolute;
    height:auto;
    top:70px;
    left:-67px;
    width:237px;
    padding:7px 5px 5px 5px;
    background:transparent url(/images/bg/dropmenu.png) no-repeat top left;
    border-left:2px solid #fff;
    border-right:2px solid #fff;
    border-bottom:2px solid #fff;
}


/* style the table so that it takes no ppart in the layout - required for IE to work */
#menu table {
    position:absolute;
    top:0;
    left:0;
    border-collapse:collapse;
}

/* style the second level links */
#menu ul ul a, #menu ul ul a:visited {
    background:transparent;
    color:#fff;
    height:auto;
    line-height:16px;
    padding:2px 0;
    width:237px;
}

#menu li.spacer {
    height:auto;
    line-height:1em;
    padding:5px 0;
    width:237px;
}
#menu hr {
    border:none;
    color:#ccc;
    background-color:#ccc;
    height:1px;
}

/* style the top level hover */
#menu a:hover {
    color:#fff;
    background:transparent;
    text-decoration:none;
}
#menu ul ul a:hover{
    color:#ee7701;
    background:transparent;
    text-decoration:none;
}
#menu :hover > a {
    color:#fff;
    background:transparent;
    text-decoration:none;
}
#menu ul ul :hover > a {
    color:#ee7701;
    background-color:#333;
    text-decoration:none;
}

/* make the second level visible when hover on first level list OR link */
#menu ul li:hover ul, #menu ul a:hover ul{
    visibility:visible;
    z-index: 100;
}

#menu li a.tab {
}

#menu li.nieuws a.tab {
    background-image:url(/images/menu-i/nieuws.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.campagne a.tab {
    background-image:url(/images/menu-i/campagne.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.ambassadeurs a.tab {
    background-image:url(/images/menu-i/ambassadeurs.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.sluit-je-aan a.tab {
    background-image:url(/images/menu-i/sluit-je-aan.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.evenementen a.tab {
    background-image:url(/images/menu-i/evenementen.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.materialen a.tab {
    background-image:url(/images/menu-i/download-bestel.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.links a.tab {
    background-image:url(/images/menu-i/links.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.poll a.tab {
    background-image:url(/images/menu-i/poll.png);
    margin-left:10px;
    background-position:top left;
    background-repeat:no-repeat;
}
#menu li.nieuws a.active,
#menu li.nieuws:hover a.tab,
#menu li.nieuws a.tab:hover {
    background-image:url(/images/menu-a/nieuws.png);
}
#menu li.campagne a.active,
#menu li.campagne:hover a.tab,
#menu li.campagne a.tab:hover {
    background-image:url(/images/menu-a/campagne.png);
}
#menu li.ambassadeurs a.active,
#menu li.ambassadeurs:hover a.tab,
#menu li.ambassadeurs a.tab:hover {
    background-image:url(/images/menu-a/ambassadeurs.png);
}
#menu li.sluit-je-aan a.active,
#menu li.sluit-je-aan:hover a.tab,
#menu li.sluit-je-aan a.tab:hover {
    background-image:url(/images/menu-a/sluit-je-aan.png);
}
#menu li.evenementen a.active,
#menu li.evenementen:hover a.tab,
#menu li.evenementen a.tab:hover {
    background-image:url(/images/menu-a/evenementen.png);
}
#menu li.materialen a.active,
#menu li.materialen:hover a.tab,
#menu li.materialen a.tab:hover {
    background-image:url(/images/menu-a/download-bestel.png);
}
#menu li.links a.active,
#menu li.links:hover a.tab,
#menu li.links a.tab:hover {
    background-image:url(/images/menu-a/links.png);
}
#menu li.poll a.active,
#menu li.poll:hover a.tab,
#menu li.poll a.tab:hover {
    background-image:url(/images/menu-a/poll.png);
}


