@CHARSET "ISO-8859-1";

.menu {
	width: 100%;
	height: 21px;
	font-size: 0.85em;
	position: relative;
	z-index: 10;
	top: 42px;
	}

/* hack to correct IE5.5 faulty box model */
* html .menu {
	width: 100%;
	w\idth: 99%;
	}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	}

/* make list horizontal w/ float, and a relative positon so that you can control the dropdown menu positon */
.menu li {
	float: left;
	position: relative;
	margin-right: 2px;
	}

/* style the links for the top level */
.menu a,.menu a:visited {
	display: block;
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	background: 21335F; //new
	padding: 0;
	line-height: 21px;
	}

/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a,* html .menu a:visited {
	width: 49px;
	w\idth: 38px;
	}

.menu a, .menu li {background-repeat: no-repeat;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
	visibility: hidden;
	position: absolute;
	height: 0;
	top: 21px;
	left: 0;
}

/* another hack for IE5.5 */
* html .menu ul ul {
	top: 22px;
	t\op: 21px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {
	position: absolute;
	top: 0;
	left: 0;
	border-collapse: collapse;;
}

/* style the second level links */
.menu ul ul a,.menu ul ul a:visited {
	background: 21335F; //new
	color: #000;
	height: 21px;
	line-height: 21px;
	padding: 0;
	width: 173px;
}

/* yet another hack for IE5.5 */
* html .menu ul ul a,* html .menu ul ul a:visited {
	width: 174px;
	w\idth: 173px; /* This determines submenu size in IE6 */
	}

/*	style the top level hover 
	The backgrounds mus be specified in HEX*/
.menu a:hover,.menu ul ul a:hover {color:#fff; background:#949e7c;}
.menu :hover>a,.menu ul ul :hover>a {color:#fff; background:#949e7c;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,.menu ul a:hover ul {visibility: visible;z-index: 10000;}

/*** begin individual graphics section ***/
	/**Ex: #ah0		= _a_nchor tag, _h_ome page, link _0_ (button) **/
	/**Ex: h1n.png 	= _h_ome, link _1_, _n_ormal (or _h_ighlight) **/
	/**Home (Lyle Value)**/

#lh0 {background-image: url(./images/Navigation/LyleValueHighlight.png);}
#ls0 {background-image: url(./images/Navigation/SolutionsHighlight.png);}
#la0 {background-image: url(./images/Navigation/AboutLyleHighlight.png);}
#lj0 {background-image: url(./images/Navigation/JoinLyleHighlight.png);}
#lc0 {background-image: url(./images/Navigation/ContactUsHighlight.png);}
#li0 {background-image: url(./images/Navigation/IndustryNewsHighlight.png);}

#ah0 {background-image: url(./images/Navigation/LyleValue.png);width: 88px;}
#ah0:hover {background-image: url(./images/Navigation/LyleValueHighlight.png);}
#ah1 {background-image: url(./images/Navigation/h1n.png);}
#ah1:hover {background-image: url(./images/Navigation/h1h.png);}
#ah2 {background-image: url(./images/Navigation/h2n.png);}
#ah2:hover {background-image: url(./images/Navigation/h2h.png);}
#ah3 {background-image: url(./images/Navigation/h3n.png);}
#ah3:hover {background-image: url(./images/Navigation/h3h.png);}
#ah4 {background-image: url(./images/Navigation/h4n.png);}
#ah4:hover {background-image: url(./images/Navigation/h4h.png);}

/**Solutions**/
#as0 {background-image: url(./images/Navigation/Solutions.png);width: 85px;}
#as0:hover {background-image: url(./images/Navigation/SolutionsHighlight.png);}
#as1 {background-image: url(./images/Navigation/s1n.png);}
#as1:hover {background-image: url(./images/Navigation/s1h.png);}
#as2 {background-image: url(./images/Navigation/s2n.png);}
#as2:hover {background-image: url(./images/Navigation/s2h.png);}
#as3 {background-image: url(./images/Navigation/s3n.png);}
#as3:hover {background-image: url(./images/Navigation/s3h.png);}
#as4 {background-image: url(./images/Navigation/s4n.png);}
#as4:hover {background-image: url(./images/Navigation/s4h.png);}
#as5 {background-image: url(./images/Navigation/s5n.png);}
#as5:hover {background-image: url(./images/Navigation/s5h.png);}

/**About Lyle**/
#aa0 {background-image: url(./images/Navigation/AboutLyle.png);width: 88px;}
#aa0:hover {background-image: url(./images/Navigation/AboutLyleHighlight.png);}
#aa1 {background-image: url(./images/Navigation/a1n.png);}
#aa1:hover {background-image: url(./images/Navigation/a1h.png);}
#aa2 {background-image: url(./images/Navigation/a2n.png);}
#aa2:hover {background-image: url(./images/Navigation/a2h.png);}
#aa3 {background-image: url(./images/Navigation/a3n.png);}
#aa3:hover {background-image: url(./images/Navigation/a3h.png);}

/**Join Lyle**/
#aj0 {background-image: url(./images/Navigation/JoinLyle.png);width: 81px;}
#aj0:hover {background-image: url(./images/Navigation/JoinLyleHighlight.png);}
#aj1 {background-image: url(./images/Navigation/j1n.png);}
#aj1:hover {background-image: url(./images/Navigation/j1h.png);}
#aj2 {background-image: url(./images/Navigation/j2n.png);}
#aj2:hover {background-image: url(./images/Navigation/j2h.png);}
#aj3 {background-image: url(./images/Navigation/j3n.png);}
#aj3:hover {background-image: url(./images/Navigation/j3h.png);}

/**Contact Us**/
#ac0 {background-image: url(./images/Navigation/ContactUs.png);width: 96px;}
#ac0:hover {background-image: url(./images/Navigation/ContactUsHighlight.png);}
#ac1 {background-image: url(./images/Navigation/c1n.png);}
#ac1:hover {background-image: url(./images/Navigation/c1h.png);}

/**Industry News**/
#ai0 {background-image: url(./images/Navigation/IndustryNews.png);width: 115px;}
#ai0:hover {background-image: url(./images/Navigation/IndustryNewsHighlight.png);}
#ai1 {background-image: url(./images/Navigation/i1n.png);}
#ai1:hover {background-image: url(./images/Navigation/i1h.png);}
#ai2 {background-image: url(./images/Navigation/i2n.png);}
#ai2:hover {background-image: url(./images/Navigation/i2h.png);}
#ai3 {background-image: url(./images/Navigation/i3n.png);}
#ai3:hover {background-image: url(./images/Navigation/i3h.png);}

/* These are not used in our single-level menubar:
/* style the second level hover */
	.menu ul ul a.drop:hover {
		background: #c9ba65 url(http://www.cssplay.co.uk/graphics/drop.gif)
			bottom right no-repeat;
	}
	.menu ul ul :hover>a.drop {background: #c9ba65 url(http://??)	bottom right no-repeat;}
	/* style the third level background */
	.menu ul ul ul a,.menu ul ul ul a:visited {background: #e2dfa8;}
	/* style the third level hover */
	.menu ul ul ul a:hover {background: #b2ab9b;}
	/* position the third level flyout menu  */
	.menu ul ul ul {
		left: 149px;
		top: -1px;
		width: 149px;
		}
	/* position the third level flyout menu for a left flyout  */
	.menu ul ul ul.left {left: -149px;}
	/* keep the third level hidden when you hover on first level list OR link */
	.menu ul :hover ul ul {visibility: hidden;}
	/* make the third level visible when you hover over second level list OR link */
	.menu ul :hover ul :hover ul {visibility: visible;}
	/* style the second level background */
	.menu ul ul a.drop,.menu ul ul a.drop:visited {
	background: #d4d8bd url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;
	}