/* All <ul> tags in the menu including the first level */
.menulist, .menulist ul{
	margin:0;
 	width:231px;
 	list-style:none;
}

/* Submenus (<ul> tags) are hidden and absolutely positioned across from their parent */
.menulist ul {
 	top:0;
 	left:231px;
 	width:221px;
 	display:none;
 	padding:5px;
 	position:absolute;
 	background:#edefe3;
 	border:solid 1px #e6e6e6;
}

/* All menu items (<li> tags) are relatively positioned (to correctly offset submenus). */
.menulist li{
 	position:relative;
}

/* Links inside the menu */
.menulist li a{
 	display:block;
 	color:#000;
 	text-decoration:none;
 	margin:0;
}

/*
 Lit items: hover/focus = the current item. 'highlighted' = parent items to visible menus.
 Here, active items are given a border, and a padding tweak to 'elevate' the text within.
 Feel free to use background-image:url(file.gif) instead of background-color:#nnn here...

.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
 	color: #FFF;
 	background-color: #46A;
 	padding: 2px 5px 4px 29px;
 	border: 1px solid #ADF;
 	margin: 0;
}
.menulist a.highlighted {
 	color: #FFF;
 	background-color: #68C;
 	border: 1px solid #CDE;
 	margin: 0;
}*/

.menulist li a{
	display:block;
	width:231px;
	text-indent:-9999px;
}

.menulist li ul li{
	background:#f7f8f0;
	border-bottom:solid 1px #e6e6e6;
}

.menulist li ul li a{
	color:#007033;
	text-indent:0;
	margin-left:8px;
	padding:10px 10px 10px 12px;
}

.menulist li ul li a:hover{
	color:#004e24;
	background:url(images/bgArrow.gif) left center no-repeat;
}

/*
If you want per-item background images in your menu items, here's how to do it.
1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
2) Copy and paste these next lines for each link you want to have an image:*/

.menulist li a.about{
	height:32px;
	background:url(images/btnAbout.gif) no-repeat;
}
.menulist li a.about:hover, .menulist li a.about.highlighted{
    background-position:0 -32px;
}

.menulist li a.investment{
	height:33px;
	background:url(images/btnInvestment.gif) no-repeat;
}
.menulist li a.investment:hover, .menulist li a.investment.highlighted{
    background-position:0 -33px;
}

.menulist li a.insurance{
	height:32px;
	background:url(images/btnInsurance.gif) no-repeat;
}
.menulist li a.insurance:hover, .menulist li a.insurance.highlighted{
    background-position:0 -32px;
}

.menulist li a.financial{
	height:32px;
	background:url(images/btnFinancial.gif) no-repeat;
}
.menulist li a.financial:hover, .menulist li a.financial.highlighted{
    background-position:0 -32px;
}

.menulist li a.fourohthree{
	height:32px;
	background:url(images/btn403.gif) no-repeat;
}
.menulist li a.fourohthree:hover, .menulist li a.fourohthree.highlighted{
    background-position:0 -32px;
}

.menulist li a.small{
	height:32px;
	background:url(images/btnSmallBusiness.gif) no-repeat;
}
.menulist li a.small:hover, .menulist li a.small.highlighted{
    background-position:0 -32px;
}

.menulist li a.contact{
	height:32px;
	background:url(images/btnContactUs.gif) no-repeat;
}
.menulist li a.contact:hover, .menulist li a.contact.highlighted{
    background-position:0 -32px;
}

/* 'subind' submenu indicators, which are automatically prepended to 'A' tag contents. */
.menulist a .subind{
 	float:right;
}

/*
 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 li {
 float: left;
 width: 100%;
}

* html .menulist li {
 float: left;
 height: 1%;
}
* html .menulist a {
 height: 1%;
}
/* End Hacks */