#menu 

{

 float: right;

 margin: 0;

}



#menu ul 

{

 list-style: none;

 padding: 0;   /* padding to buttons */

 margin: 0 ;   /* indent from outside div */

}



#menu li 

{
 float: left;

 position: relative;
 margin: 0 ;   /* indent from outside div */

}



#menu a , #menu a:visited, #menu a:visited:hover 

{

 color: white;

 float: none;     /* left for horizonal menu, otherwise its vertical. */

 text-decoration: none; /* remove typical underline */

 font-size: 9pt;    /* menu text size */

 display: block;    /* treats layout of buttons like they're table cells rather than list items */

 border-width: 0 0 0 1;

 border-style: solid ;

 border-color: #ffffff;

 padding: 2px 5px 5px 5px;   /* padding of text within button */

 margin: 0;   /* padding of button within list item */

}



#menu a:hover {  /* override as neccesary for mouse over effects */

 color: black; 

 background-color: white;

}





#menu ul ul {  /* this one is the dropdown */

 background-color: #CCC;

 position: absolute; /* so we can hide it */

 left: -999em;  /* by default it is hidden */

 width: 120px;  /* width of the entire dropdown */

 margin: 0 0;  /* relative position of the menu to the button... 0=tight on bottom.. */

 padding: 0;

}



#menu ul ul ul {  /* this one is the dropdown */

 background-color: #CCC;

 position: absolute; /* so we can hide it */

 left: -999em;  /* by default it is hidden */

 width: 120px;  /* width of the entire dropdown */

 margin: -22px 120px;  /* relative position of the menu to the button... 0=tight on bottom.. */

 padding: 0;

}



#menu ul ul li {  /* this one is the dropdown */

 width: 120px;

 margin: 0 ;   /* indent from outside div */

 display: block;

 height: 22px;

}



#menu ul ul a ,  #menu ul ul a:visited

{  

/* override colours for drop down buttons */

 background-color:#CCC;

 height: 22px;

 color:black;

 width: 120px;

 padding:4px;

}



#menu ul ul a:hover {  /* override colours for drop down buttons */

 color: white; 

 background-color: #666;

}



#menu li:hover ul ul, 

#menu li:hover ul ul ul, 

#menu li.sfhover ul ul, 

#menu li.sfhover ul ul ul 

{

 left: -999em;

}



#menu li:hover ul, 

#menu li li:hover ul, 

#menu li li li:hover ul, 

#menu li.sfhover ul, 

#menu li li.sfhover ul, 

#menu li li li.sfhover ul {

 left: auto;

}