/* CSS Document */

#menu {
width: 100%; /* set width of menu */
background: transparent;
} 

#menu ul { /* remove bullets and list indents */
list-style: none;
margin: 0;
padding: 0;
}

/* style, color and size links to suit */
#menu li.primary a {
color: #3c3321;
background: transparent;
text-decoration: none;
font: 11px "Lucida Sans", Arial, Helvetica, Sans-Serif;
display: block;
width: 132px;
height: 21.7px;
border: 0px;
margin: 0px;
padding-top:3px;
padding-left:5px;
}

#menu li.primary a:hover {
color: #810d1c;
}

#menu ul.submenu a {
color: #fff;
background: #978765;
text-decoration: none;
font: 10px Verdana, Tahoma, Helvetica, Sans-Serif;
font-weight: bold;
display: block;
border-bottom: 1px solid #a79972;
width: 150px;
height: 18px;
padding-top: 7px;
padding-left: 5px;
padding-right: 5px;
margin: 0px;
}

#menu ul.submenu a:hover {
color: #fedc54;
background: #810d1c;
border-bottom: 1px solid #bd3c3c;
}

#menu li {
/* make the list elements a containing block for the nested lists */
position: relative;
} 

#menu ul ul ul {
position: absolute;
top: 0;
left: 100%; /* to position them to the right of their containing block */
width: 100%; /* width is based on the containing block */
}

div#menu ul ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}