/* HORIZONTAL FREESTYLE MENU LAYOUT */
#masthead01 div.menu{
font-size:.712em;
height:210px;
left:0;
margin:0;
position:absolute;
top:0;
z-index:20;
}
/* All <ul> tags in the menu including the first level */
.menulist,.menulist  ul{
list-style:none;
margin:0;
padding:0;
}
/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul{
display:none;
left:-1px;
margin-top:13px;/* I'm using ems and px to allow people to zoom their font */
position:absolute;
top:1.0em;
width:150px;
}
/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul{
left:148px;
margin-top:0;
top:-1px;
}
/*
All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li{
border:none;/* background: #000;*/
display:block;
float:left;
margin-right:-1px;
padding:0;
position:relative;
}
/* KISSKA */
.menulist li li{
background:#a0a0a0;
border-bottom:1px solid #dddddd;
color:#ffffff;
display:block;
float:left;
left:2px;
margin-right:-1px;
padding:0;
position:relative;
}
/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li{
border-top:1px solid #dddddd;
float:none;
margin:0;
margin-bottom:-1px;
}
.menulist ul>li:last-child{
margin-bottom:1px;/* Mozilla fix */
}
/* Links inside the menu */
.menulist a{
color:#ffffff;
display:block;
padding:3px;
text-decoration:none;
}
/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover,.menulist a.highlighted:hover,.menulist a:focus{
background:#666666;
color:#ffffff;
}
.menulist a.highlighted{
background:#666666;
color:#ffffff;
}
.menulist a.active{
background:#cdcdcd;
color:#ff6500;
}
/* Only style submenu indicators within submenus. */
.menulist a .subind{
display:none;
}
.menulist ul a .subind{
display:block;
float:right;
}
/* KISSKA */
.menulist a#but1,.menulist a#butActive1,
.menulist a#but2,.menulist a#butActive2,
.menulist a#but10,.menulist a#butActive10,
.menulist a#but12,.menulist a#butActive12,
.menulist a#but175,.menulist a#butActive175,
.menulist a#but206,.menulist a#butActive206{
background:none;
color:#666666;
height:18px;
padding:2px 0 10px 0;
text-align:center;
width:90px;
}
.menulist a#butActive1,
.menulist a#butActive2,
.menulist a#butActive10,
.menulist a#butActive12,
.menulist a#butActive175,
.menulist a#butActive206{
color:#ff6500;
}
.menulist a#but1:hover,
.menulist a#but2:hover,
.menulist a#but10:hover,
.menulist a#but12:hover,
.menulist a#but175:hover,
.menulist a#but206:hover,
.menulist a.highlighted#but1,
.menulist a.highlighted#but2,
.menulist a.highlighted#but10,
.menulist a.highlighted#but12,
.menulist a.highlighted#but175,
.menulist a.highlighted#but206{
color:#000000;
}
/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a{
float:left;
}
.menulist ul a{
float:none;
}
/* \*/
.menulist a{
float:none;
}
/* */
/*
HACKS: IE/Win:
A small height on <li> and <a> tags and floating prevents gaps in menu.
* html affects <=IE6 and *:first-child+html affects IE7.
You may want to move these to browser-specific style sheets.
\*/
*:first-child+html .menulist ul li{
float:left;
width:100%;
}
* html .menulist ul li{
float:left;
height:1%;
}
* html .menulist ul a{
height:1%;
}
/* End Hacks */