#nav {
	margin: 0;
	display:block;
}
#nav li {
	list-style-image: none;
	list-style-type: none;
	margin:0;
	padding:0;
}
#nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 182px; /* Width of Menu Items */
	}
	
#nav ul li {
	position: relative;
	list-style: none;
	}

/* Styles for Menu Items */
#nav ul li a {
	display: block;
	text-decoration: none;
	padding:0;
	list-style: none;
	}
	
/* Style and position the table so it takes no part in the menu function. The font size is necessary for IE5.5 */
#nav table {border-collapse:collapse; width:0; height:0; position:relative; top:0; left:-92px; text-align:left;}
	
/* Default top link link styling */
#nav li.top a.top_link {display:block; float:left; height:28px;}
#nav li.top a span {position:absolute; left:-9999px; top:0; z-index:0; font-size:10px;} /* move the link text off screen */
#nav li:hover ul, li.over ul { display: block; } /* The magic */

/* pre-load the hover images into the lists */
#nav li.p1 {width:182px; height:36px; background:url(../images/menu/m1-over.gif) no-repeat;}
#nav li.p2 {width:182px; height:30px; background:url(../images/menu/m2-over.gif) no-repeat;}
#nav li.p3 {width:182px; height:30px; background:url(../images/menu/m3-over.gif) no-repeat;}
#nav li.p4 {width:182px; height:39px; background:url(../images/menu/m4-over.gif) no-repeat;}
#nav li.p5 {width:182px; height:35px; background:url(../images/menu/m5-over.gif) no-repeat;}
#nav li.p6 {width:182px; height:28px; background:url(../images/menu/m6-over.gif) no-repeat;}
#nav li.p7 {width:182px; height:28px; background:url(../images/menu/m7-over.gif) no-repeat;}
#nav li.p8 {width:182px; height:28px; background:url(../images/menu/m8-over.gif) no-repeat;}
#nav li.p9 {width:182px; height:28px; background:url(../images/menu/m10-over.gif) no-repeat;}
#nav li.p11 {width:182px; height:28px; background:url(../images/menu/m11-over.gif) no-repeat;}
#nav li.p12 {width:182px; height:28px; background:url(../images/menu/m12-over.gif) no-repeat;}
#nav li.p13 {width:182px; height:27px; background:url(../images/menu/m13-over.gif) no-repeat;}

/* set up the normal unhovered images in the links */
#nav li a#personalBanking {width:182px; height:36px; background:url(../images/menu/m1.gif) no-repeat;}
#nav li a#businessServices {width:182px; height:30px; background:url(../images/menu/m2.gif) no-repeat;}
#nav li a#realEstate {width:182px; height:30px; background:url(../images/menu/m3.gif) no-repeat;}
#nav li a#onlineBanking {width:182px; height:39px; background:url(../images/menu/m4.gif) no-repeat;}
#nav li a#about {margin:0; width:182px; height:35px; background:url(../images/menu/m5.gif) no-repeat;}
#nav li a#locations {width:182px; height:28px; background:url(../images/menu/m6.gif) no-repeat;}
#nav li a#careers {width:182px; height:28px; background:url(../images/menu/m7.gif) no-repeat;}
#nav li a#rates {margin:0; width:182px; height:28px; background:url(../images/menu/m8.gif) no-repeat;}
#nav li a#communityInvolvement {width:182px; height:28px; background:url(../images/menu/m10.gif) no-repeat;}
#nav li a#disclosures {width:182px; height:28px; background:url(../images/menu/m11.gif) no-repeat;}
#nav li a#id_protection {width:182px; height:28px; background:url(../images/menu/m12.gif) no-repeat;}
#nav li a#shareholders {width:182px; height:27px; background:url(../images/menu/m13.gif) no-repeat;}

/* Style the list OR link hover. Depends on which browser is used */
#nav a:hover {visibility:visible;} /* for IE6 */
#nav li:hover { position:relative; z-index:200;} /* for IE7 */

/* make the links transparent on hover so that the hover images in the lists show through (no flicker) */
#nav li a#personalBanking:hover, #nav li:hover a#personalBanking, 
#nav li a#businessServices:hover, #nav li:hover a#businessServices,
#nav li a#realEstate:hover, #nav li:hover a#realEstate,
#nav li a#onlineBanking:hover, #nav li:hover a#onlineBanking,
#nav li a#about:hover, #nav li:hover a#about,
#nav li a#locations:hover, #nav li:hover a#locations,
#nav li a#careers:hover, #nav li:hover a#careers,
#nav li a#rates:hover, #nav li:hover a#rates, 
#nav li a#communityInvolvement:hover, #nav li:hover a#communityInvolvement,
#nav li a#disclosures:hover, #nav li:hover a#disclosures,
#nav li a#id_protection:hover, #nav li:hover a#id_protection,
#nav li a#shareholders:hover, #nav li:hover a#shareholders {background:transparent;}

/* keep the 'next' level invisible by placing it off screen. */
#nav ul, 
#nav :hover ul ul, 
#nav :hover ul :hover ul ul,
#nav :hover ul :hover ul :hover ul ul,
#nav :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0;}

/* set up the first drop down sub level */
#nav :hover ul.sub {left:175px; top:0; background: #2B1D00; padding:3px 0; border:1px solid #6D521B; white-space:nowrap; width:200px; height:auto;}
#nav :hover ul.sub li {display:block; height:20px; position:relative; float:left; width:198px;}
#nav :hover ul.sub li a {display:block; font-size:11px; height:20px; width:200px; line-height:20px; text-indent:5px; color:#fff; text-decoration:none; border:3px solid #2B1D00; border-width:0;}
#nav :hover ul.sub li a.fly {background: url(../images/arrow.gif) 135px 7px no-repeat;}
#nav :hover ul.sub li a:hover {background:#F3ECDA; color:#000;}
#nav :hover ul.sub li a.fly:hover {background:#D4781D url(../images/arrow_over.gif) 135px 7px no-repeat; color:#fff;}
#nav :hover ul li:hover > a.fly {background:#D4781D url(../images/arrow_over.gif) 135px 7px no-repeat; color:#fff;} 

/* set up the flyout levels when hovering */
#nav :hover ul :hover ul,
#nav :hover ul :hover ul :hover ul,
#nav :hover ul :hover ul :hover ul :hover ul,
#nav :hover ul :hover ul :hover ul :hover ul :hover ul
{left:145px; top:-4px; background: #2B1D00; padding:3px 0; border:1px solid #888; white-space:nowrap; width:150px; z-index:200; height:auto; z-index:300;}