/*
font color: E5D0A1
submenu background color: FFFFFF
Hover Highlight color: 75226A
*/

/* remove the indents and bullets from the unordered list and define the width of our menu items. 
 we need to close the menu so add a border to the bottom of the list*/
ul#menu {
list-style:none;
margin:0;
padding:0px 0px 0px 17px;
}


/* 
We want each sub-menu to appear below its parent menu item when that item is hovered over. 
We have also set display to “none,” as we don’t want the sub-menus to be visible by default.*/
ul#menu li ul {
position:absolute;
left:0;
display:none;
top:32px;
/*z-index:20000;*/

}



/* now make them pretty - kinda :) */

/* set the position as relative, because we will need to position the sub-menus absolutely within the list items. */
ul#menu li {
position:relative;
display:inline !important; /*this is the magic that makes the UL become horizontal*/
float:left !important; /*this is the magic that makes the UL become horizontal*/
margin:0px 3px 0px 0px;
z-index:16000 !important;

/*width:125px;*/
}

/* this is the background color of the submenu*/
ul#menu li ul li {
background-color:#601C57;
}

ul#menu li a {
display:block;
height:21px;
text-decoration:none;
color:#FFFFFF;
padding:7px 17px 1px;
}
ul#menu li.current_page_item {
color: #FFFFFF !important;
/*background-color:#9A2B00;
background:transparent url(images/tab-right.jpg) no-repeat scroll right -111pt;*/
display:block;
height:27px;
text-decoration:none;
}
ul#menu li.current_page_item a {
background:white none repeat scroll 0% 0%;
color:#641E5C !important;
display:block;
height:26px;
text-decoration:none;
}
ul#menu li.current_page_item a:hover{
background:transparent url(images/menu-highlight-bg.jpg) repeat-x 0% 0%;
color:#FFFFFF !important;
}

ul#menu li.inactive_page_item {
/*background:transparent url(images/tab-right.jpg) no-repeat scroll right 0pt;*/
color:#E5D0A1!important;
display:block;
height:24px;
text-decoration:none;
color:#FFFFFF;
}
ul#menu li.inactive_page_item a {
/*background:transparent url(images/tab-left.jpg) no-repeat left -1pt;*/
color:#E5D0A1!important;
display:block;
height:26px;
text-decoration:none;
color:#FFFFFF;
}
ul#menu li.inactive_page_item a:hover{
background:transparent url(images/menu-highlight-bg.jpg) repeat-x 0% 0%;
color:#FFFFFF !important;
}
ul#menu li.inactive_page_item a.menu:hover, 
ul#menu li.inactive_page_item a.submenu:hover, 
ul#menu li.current_page_item a.menu:hover, 
ul#menu li.current_page_item a.submenu:hover{
color:#FFFFFF !important;
background:transparent url(images/menu-highlight-bg.jpg) repeat-x 0% 0%;
}
ul#menu li.inactive_page_item a.menu, 
ul#menu li.current_page_item a.menu 
{
background:transparent none no-repeat scroll 0% 50%;
color:#E5D0A1!important;

}
ul#menu li.inactive_page_item a.menu:hover {
background-color:#75226A;
}

/* the menu items don’t stack up neatly in IE. so here is the IE Hack */
* html ul#menu li {
float:left;
height:1%;
}

* html ul#menu li a {
height:1%;
}
/* End IE Hack */

/* Hover Styles for main row*/
ul#menu li a:hover {
color:#FFFFFF;
background:transparent url(images/x.jpg) no-repeat left -1pt;

text-decoration:none;
}

/* Hover Styles for submenus*/
ul#menu li ul li a:hover {
color:#FFFFFF;
background:#75226A;
}
ul#menu li ul li a.submenu,{
background-color:#75226A;
color:#FFFFFF;

}


/* Sub Menu Styles */
li ul li a {
padding:5px;
}
ul#menu ul li {
width:215px;
padding:0px;
}
/* add the little arrow to indicate a 2nd menu */
ul#menu li ul li a.submenu,ul#menu li.iehover li a.submenu {
background:url(images/sub.gif) no-repeat scroll right center;
padding-right:5px;
color:#E5D0A1!important;

}

/* add the little arrow to indicate a 2nd menu */
ul#menu li ul li a.submenu:hover {
background:#75226A url(images/sub.gif) no-repeat scroll right center;
padding-right:5px;
color:#E5D0A1!important;

}

/* position the 2nd menu so it looks like it pops off the first menu */
ul#menu li ul li ul {
top:0px;
left:215px;
border-left:2px solid #C670BB;
}

/* Do Not Move - Must Come Before display:block for Gecko 
this hide and displays the 2nd menu*/
ul#menu li:hover ul ul,ul#menu li:hover ul ul ul,ul#menu li.iehover ul ul,ul#menu li.iehover ul ul ul {
display:none;
}

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

.menuz{
background:transparent url(images/content-top-bg.jpg) repeat-x scroll 0% 0%;
float:left;
font-size:12px;
font-style:normal;
font-weight:bold;
position:relative !important;
text-decoration:none;
height:34px;
left:0px;
clear:both !important;
width:100% !important;

}
