/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/pro_variable4.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#nav {
	padding: 0 0 0 65px;
	margin: 0;
	list-style: none;
	font: 12px lucida grande, arial, sans-serif;
	position: relative;
	z-index: 200;
	height: 34px;
    background-image:url(http://home.razorside.com/patioperfect/template/top-menu-bg.gif);
    text-align:left;
}

#nav ul {
	padding: 0;
	margin: 0;
	list-style: none;
	float: left;
	background:#ccc;
	border-top: 1px solid #fff;
}

#nav li {
	float: left;
}

#nav li li {
	float: none;
	border-left: 1px solid #fff;
	border-right: 1px solid #666;
}

#nav li.last {
	border-bottom: 1px solid #666;
}

/* a hack for  IE6 */
* html #nav li li {
	float: left;
}

#nav li a {
	display: block;
	float: left;
	color:#4D574F;
	height: 34px;
	padding: 0 25px 0 5px;
	line-height: 34px;
	text-decoration: none;
	white-space: nowrap;
	font-weight: bold;
}

#nav li a.down {
	background: url(http://home.razorside.com/patioperfect/template/down.gif) no-repeat right center;
}

#nav li li a {
	display: block;
	height: 20px;
	line-height: 20px;
	float: none;
	padding: 5px 25px 0 5px;
	font-weight: normal;
	letter-spacing: 1px;
	font: 11px helvetica, arial, sans-serif;
	border-bottom:1px dotted #ffffff;
	
}

#nav li li a.fly {
	background: url(fly.gif) no-repeat right center;
}

#nav li:hover {
	position: relative;
	z-index: 300;
}

#nav li.cssplay_hover {
	position: relative;
	z-index: 300;
}

#nav li.cssplay_hover a {
	color: #4D574F;
}

#nav li li a {
	color: #fff;
	background-color:#4D574F;
}

#nav li li.cssplay_hover a {
	color: #fff;
	background-color: #4CAC57;	
}

#nav li:hover ul {
	left: 0;
	top: 33px;
	z-index: 500;
}

#nav li.cssplay_hover ul {
	left: 0;
	top: 33px;
	z-index: 500;
}

#nav ul {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

* html #nav ul {
	width: 2px;
}

/* it could have been this simple if all browsers understood */
	/* show next level */
#nav li:hover li:hover>ul {
	left: -5px;
	margin-left: 100%;
	top: -1px;
	z-index: 500;
}

/* keep further levels hidden */
#nav li:hover>ul ul {
	position: absolute;
	left: -9999px;
	top: -9999px;
	width: auto;
}

/* show path followed */
#nav li:hover>a {
	text-decoration:none;
	color: #4CAC57;
}

#nav li li:hover>a {
	color: #fff;
	background-color: #4CAC57;
}

/* but IE5.x and IE6 need this lot to style the flyouts*/
#nav li.cssplay_hover li.cssplay_hover a,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover a,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a
{
	color: #fff;
	background-color: #4D574F;
}

#nav
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
 
a
,
#nav
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
 
a
,
#nav
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
 
a
,
#nav
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
.cssplay_hover
 
li
 
a
,
{
color
:
#633
;
 
background-color
:
#ddd
;
}
/* show next level */
#nav li.cssplay_hover li.cssplay_hover ul,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul
	{
	left: 100%;
	margin-left: -5px;
	top: -1px;
}

/* keep further levels hidden */
#nav li.cssplay_hover ul ul,#nav li.cssplay_hover li.cssplay_hover ul ul,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul,#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul
	{
	position: absolute;
	left: -9999px;
	top: -9999px;
}