#navigation {}
#navigation a { text-decoration: none; font-weight:bold; color:#FFF; z-index:90}
#navigation ul { list-style: none; padding: 0; margin: 0;  z-index:9;font-size:1em;}
#nav div {background-color:#2A426D; z-index:90;} 

#nav a {z-index:90; font-weight: bold; color:#FFF; text-decoration: none; font-size:1.2em !important;}
#nav li li a {z-index:90; display: block; font-weight: bold; color: #FFF; padding: 0.2em 10px 0.5em; width:100%;}/*width:100%;*/
#nav li li a:hover { padding: 0.3em 0px 0.4em 10px; background-color:#8A1664; color:#EEE;}
#nav li div a:hover { background-color:#8A1664; width:100%;} /* frm 2010:background-color:#F6C828; */

/* Try prepending the follwing li & ul with #navigation to be sure they don't affect things in OTHER areas */

li {z-index:90; float: left; position: relative; width:10em; text-align: center; cursor: default; background-color:#782018;}
/* the width of the above determines how much horiz spacing the overall menu item list takes */
/*li#first { border-left-width: 1em; }
li#last { border-right-width: 1em; } */
li ul { display: none; position: absolute; top: 100%; left: 0; width:100%;
 font-weight: normal; background-color:#2A426D; padding: 0.5em 0 1em 0; border: solid 1px #2A426D; border-top: 0px solid #7d6340;}
li>ul { top: auto; left: auto; }
li li { display: block; float: none; background-color: transparent; border: 0; width:11em; text-align:left;}
li:hover ul { display: block; width:13em;}
li:hover ul li { display: block; width:12em;margin-left:0em;}
ul#nav { width:100%;} /*to center use: margin-left:auto; margin-right:auto; */