/* ######### Main Menu Bar CSS ######### */

.mattblackmenu ul{
margin: 0;
padding: 0;
font: 13px Verdana, Arial, Helvetica, Geneva;
list-style-type: none;
overflow: hidden;
width: 100%;
height: 31px;
text-align: left;
vertical-align: middle;
position: relative;
z-index:100;
}

.mattblackmenu li{
display: inline;
margin: 0;
padding-top: 2px;
background-image: url(../images/navimage_off.gif); /**/
}

.mattblackmenu li a{
/*background-image: url(../images/navimage_off.gif); bkgd natural state*/
float: left;
display: block;
text-decoration: none;
margin: 0;
padding: 5px;
/*padding: 6px 20px; padding inside each tab*/
/*border-right: 1px solid #1C5959; right divider between tabs*/
color: white;
/*background-color: #D2CBBB;*/
}

.mattblackmenu li a:visited{
color: white;
padding: 5px;
/*background-image: url(../images/navimage_off.gif);*/
}

.mattblackmenu li a:hover{
color: white;
padding: 5px;
background-color: #5387DD; /*background of tabs for hover state */
}

.mattblackmenu a.selected{
color: white;
padding: 5px;
background-image: url(../images/navimage_on.gif);/**/
background-color: #00CBBE; /*background of tab with "selected" class assigned to its LI */
}

/* Fly-out */
.megamenu{
position: absolute;
display: none;
left: 0;
top: 0;
background: white;
border: 1px solid #5387dd;
border-width: 5px 1px;
padding: 10px;
font: normal 12px Verdana;
line-height: 15px;
z-index: 100;
}

.megamenu .column{
float: left;
width: 180px; /*width of each menu column*/
margin-right: 10px;
}

.megamenu .column ul{
margin: 0;
padding: 2px;
list-style-type: none;
}

.megamenu .column ul li{
padding: 4px 0;
border-bottom: 1px dotted #2faa88;
}

.megamenu .column h3{
color: #2faa88;
background: #eaf9fc;
font: bold 12px Georgia, Serif;
margin: 0 0 5px 0;
padding: 3px;
}

.megamenu .column ul li a{
text-decoration: none;
}

.megamenu .column ul li a:hover{
color: #ff6600;
}