/*main menu div*/
#menuBarDiv {
	position: absolute;
	left: 215px;
}

/*remove list-style and set font for the whole menu*/
#menuBar, #menuBar ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
	font-family: Avenir, Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
}

/*root level list items 
- float left for horizontal bar
- set default text*/
#menuBar li {
	float: left;
	display: block;
	height: 44px;
	padding-top: 18px;
	padding-left: 5px;
	margin-right: -42px;
	font-size: .80em;
	color: #4F828B;
	text-align: center;
}

/*root level multiple widths*/
.rootMenuSm {width: 119px;}
.rootMenuMed {width: 140px;}
.rootMenuLg {width: 160px;}
.rootMenuXLg {width: 180px;}

/*root level link format*/
.rootMenuSm a, .rootMenuMed a, .rootMenuLg a, .rootMenuXLg a {
	text-decoration: none;
	font-size: .85em;
	color: #FFFFFF;
}

/*sub-menu unordered list - background
background color must be set or problems will be encountered in MSIE*/
#menuBar li ul {
	position: absolute;
	display: none;
	width: 200px;
	background-color: #FFFFFF;
}

/*sub-menu ul shift for right align on multi-width root items*/
#menuBar li .subMenuSm {margin-left: -105px;}
#menuBar li .subMenuMed {margin-left: -85px;}
#menuBar li .subMenuLg {margin-left: -65px;}
#menuBar li .subMenuXLg {margin-left: -45px;}

/*sub-menu list items*/
#menuBar ul li  {
	width: 200px;
	height: 30px;
	padding-top: 11px;
	padding-left: 75px;
	color: #FFFFFF;
	text-align: left;
}

/*sub-menu alignment and background images*/
.subTop {
	padding-top: 14px!important;
	margin-top: 12px;
	background-image: url(images/rollBoxTop.png);
	background-repeat: no-repeat;
}
.subMid1 {
	margin-top: -14px;
	margin-left: -14px;
	background-image: url(images/rollBoxMid.png);
	background-repeat: no-repeat;
}
.subMid2 {
	margin-top: -11px;
	margin-left: -29px;
	background-image: url(images/rollBoxMid.png);
	background-repeat: no-repeat;
}
.subMid3 {
	margin-top: -11px;
	margin-left: -44px;
	background-image: url(images/rollBoxMid.png);
	background-repeat: no-repeat;
}
.subMid4 {
	margin-top: -11px;
	margin-left: -59px;
	background-image: url(images/rollBoxMid.png);
	background-repeat: no-repeat;
}
.subMid5 {
	margin-top: -11px;
	margin-left: -74px;
	background-image: url(images/rollBoxMid.png);
	background-repeat: no-repeat;
	width: 210px !important;
}
.subBottom1 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -14px;
	margin-left: -16px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
}
.subBottom2 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -11px;
	margin-left: -31px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
}
.subBottom3 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -11px;
	margin-left: -46px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
}
.subBottom4 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -11px;
	margin-left: -61px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
}
.subBottom5 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -11px;
	margin-left: -76px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
	width: 210px !important;
}
.subBottom6 {
	height: 33px;
	padding-top: 8px!important;
	margin-top: -11px;
	margin-left: -91px;
	background-image: url(images/rollBoxBottom.png);
	background-repeat: no-repeat;
	width: 226px !important;
}

/*sub-menu link format*/
#menuBar ul li a  {
	color: #FFFFFF;
}

/*changes background on root level menu items when moused over*/
#menuBar li:hover a {
	font-size: .85em;
	color: #FFFFFF;
}
#menuBar li:hover {
	color: #FFFFFF;
}

.rootMenuSm:hover {
	background-image: url(images/menuRollSm.png);
	background-repeat: no-repeat;
}
.rootMenuMed:hover {
	background-image: url(images/menuRollMed.png);
	background-repeat: no-repeat;
}
.rootMenuLg:hover {
	background-image: url(images/menuRollLg.png);
	background-repeat: no-repeat;
}
.rootMenuXLg:hover {
	background-image: url(images/menuRollXLg.png);
	background-repeat: no-repeat;
}

/*set sub-menu UL to be visible on root-level link mouse over*/
#menuBar li:hover ul {
	display: block;
}

/* normal hover class for sub-level links*/
#menuBar ul a:hover {
	background-color: #606060;
	color: #FFFFFF;
	text-decoration: underline;
}
/*set text color of the sub-level links when the root-level
menu items are moused over*/
#menuBar li:hover ul a{
	color: #FFFFFF;
	background-color: transparent;
}
#menuBar li ul {
	background-color: transparent;
}
