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

/*
 Submenus (<ul> tags) are hidden and absolutely positioned across from their parent.
 They don't *have* to touch their parent menus, but is' a good idea as CSS-only fallback
 mode requires menus to touch/overlap (when JS is disabled in the browser).
*/
.menulist ul {
	display: none;
	position: absolute;
	top: -1px;
	left: 184px;
	}

/*
 All menu items (<li> tags) are relatively positioned to correctly offset their submenus.
 They have borders that are slightly overlaid on one another to avoid doubling up.
*/
.menulist li {
	position: relative;
	}
li.submenu {
	margin-bottom: -1px;
	width: 140px;
	}


/* Links inside the menu */
.menulist a {
	display: block;
	xpadding: 3px;
	color: #000 !important;
	text-decoration: none !important;
	}

/*
 Lit items: 'hover' is mouseover, 'highlighted' are parent items to visible menus.
*/
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
	xcolor: #FFF;
	xbackground-color: #A64;
	}
.menulist a.highlighted {
	xcolor: #FFF;
	xbackground-color: #C86;
	}

/*
 For per-item background images in the menu items ...
 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 a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/

.submenu a {
	border: 1px solid #000;
	font-family: Verdana, Arial, Helvetica, sans-serif !important;
	font-size: 10px !important;
	background: #f1f1f1;
	padding: 2px 5px !important;
	}
.submenu a:hover {
	background-color: #fc0;
	}

#nav_1 {
	background: url(../images/nav_home_0.jpg) no-repeat;
	}
.menulist a#nav_1:hover, .menulist a.highlighted#nav_1, .menulist a:focus {
	background: url(../images/nav_home_1.jpg) no-repeat;
	}
.menulist a#nav_2 {
	background: url(../images/nav_news_0.jpg) no-repeat;
	}
.menulist a#nav_2:hover, .menulist a.highlighted#nav_2, .menulist a:focus {
	background: url(../images/nav_news_1.jpg) no-repeat;
	}
.menulist a#nav_3 {
	background: url(../images/nav_clients_0.jpg) no-repeat;
	}
.menulist a#nav_3:hover, .menulist a.highlighted#nav_3, .menulist a:focus {
	background: url(../images/nav_clients_1.jpg) no-repeat;
	}
.menulist a#nav_4 {
	background: url(../images/nav_partners_0.jpg) no-repeat;
	}
.menulist a#nav_4:hover, .menulist a.highlighted#nav_4, .menulist a:focus {
	background: url(../images/nav_partners_1.jpg) no-repeat;
	}
.menulist a#nav_5 {
	background: url(../images/nav_directory_0.jpg) no-repeat;
	}
.menulist a#nav_5:hover, .menulist a.highlighted#nav_5, .menulist a:focus {
	background: url(../images/nav_directory_1.jpg) no-repeat;
	}
.menulist a#nav_6 {
	background: url(../images/nav_record_0.gif) no-repeat;
	}
.menulist a#nav_6:hover, .menulist a.highlighted#nav_6, .menulist a:focus {
	background: url(../images/nav_record_1.jpg) no-repeat;
	}
.menulist a#nav_7 {
	background: url(../images/nav_contact_0.jpg) no-repeat;
	}
.menulist a#nav_7:hover, .menulist a.highlighted#nav_7, .menulist a:focus {
	background: url(../images/nav_contact_1.jpg) no-repeat;
	}


/* 'subind' submenu indicators, which are automatically prepended to 'A' tag contents. */
.menulist a .subind {
	display: none;
	xfloat: 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 */