/* ================================================================ 

This copyright notice must be untouched at all times.



The original version of this stylesheet and the associated (x)html

is available at http://www.cssplay.co.uk/menus/final_drop.html

Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.

This stylesheet and the associated (x)html may be modified in any 

way to fit your requirements.

=================================================================== */



.menu {
	width:845px;
	height:35px;
	position:relative;
	z-index:20;
	font-family:arial, sans-serif;
	text-align: center;
	vertical-align: middle;
	background-color: #009900;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	color: #FFFFFF;
}

/* hack to correct IE5.5 faulty box model */

* html .menu {width:846px; w\idth:845px;}

/* remove all the bullets, borders and padding from the default list styling */

.menu ul {padding:0;margin:0;list-style-type:none;}

.menu ul ul {width:105.63px;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */

.menu li {float:left;width:105.62px;position:relative;}

/* style the links for the top level */

.menu a, .menu a:visited {
	border-left:0px solid #fff;
	border-right:0px solid #fff;
	border-top:0px solid #fff;
	border-bottom:1px solid #efefef;
	display:block;
	font-size:12px;
	text-decoration:none;
	color:#FFFFFF;
	width:98px;
	height:24px;
	padding-left:2px;
	line-height:12px;
	font-weight:bold;
	background-color: #009900;
}

/* a hack so that IE5.5 faulty box model is corrected */

* html .menu a, * html .menu a:visited {width:105.63px; w\idth:98px;}



/* style the second level background */

.menu ul ul a.drop, .menu ul ul a.drop:visited {
	text-align: left;
	background-color: #009900;
	background-repeat: no-repeat;
	background-position: 130px center;
}

/* style the second level hover */

.menu ul ul a.drop:hover{background:#272727 url('blue-arrow.gif') no-repeat 130px center;}

.menu ul ul :hover > a.drop {
	background-color: #FFCC00;
	background-repeat: no-repeat;
	background-position: 130px center;
}

/* style the third level background */

.menu ul ul ul a, .menu ul ul ul a:visited {
	background-color: #FFCC00;
}

/* style the third level hover */

.menu ul ul ul a:hover {
	background-color: #FFCC00;
}





/* 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:31px;left:0; width:149px;border-top:1px solid #efefef; text-align: left;}

/* another hack for IE5.5 */

* html .menu ul ul {top:30px;t\op:31px;}



/* 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;}



/* style the table so that it takes no ppart 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 {
	color:#FFFFFF;
	height:auto;
	line-height:1em;
	padding:5px 10px;
	width:128px;
	border-width:0 1px 1px 1px;
	background-color: #009900;
}

/* yet another hack for IE5.5 */

* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:128px;}



/* style the top level hover */

.menu a:hover, .menu ul ul a:hover{
	color:#000000;
	background-color: #FFCC00;
}

.menu :hover > a, .menu ul ul :hover > a {
	color:#000000;
	background-color: #FFCC00;
}



/* 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; }

/* 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;}



.singles { height:12px; padding-top: 8px; }

.doubles { height:24px; padding-top: 4px; padding-bottom: 4px; }



.clear {clear:both;font-size:1px;line-height:0px;height:1px;overflow:hidden;}