/* for this demo only */
#nav {
	margin-top: -15px;
	margin-right: 0;
	margin-bottom: 50px;
	margin-left: 0;
}
 
/* the styling */
#nav {
	float:left;
	padding-left:10px;
	width:550px;
	height:auto;
	background-color: #e5b9c3;
	background-image: url(../images/bg.gif);
	background-repeat: repeat-x;
	background-position: bottom;
}
 
#nav .select, #nav .current {
	padding:0;
	list-style:none;
	display:block;
	float:left;
	margin-top: 1.2em;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}
 
#nav .sub {margin:0; padding:0; list-style:none;}
 
#nav li {display:list-item; float:left; margin:0; padding:0; position:relative; z-index:100;}
#nav .current li {display:inline; z-index:50;}
 
#nav .select a, 
#nav .current a {display:inherit; height:2.5em; float:left; width:100px; background:url(../images/left_both.gif) no-repeat left top; padding:0 0 0 9px; border-bottom:1px solid #765; text-decoration:none; font-weight:bold; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:2.4em; white-space:nowrap;}
 
/* calculate the required widths of the top level */
#nav .one a {width:10em;}
#nav .two a {width:10em;}
#nav .three a {width:10em;}
#nav .four a {width:10em;}
 
#nav .select a b, 
#nav .current a b {height:100%; display:inherit; background:url(../images/right_both.gif) no-repeat right top; padding:0 15px 0 6px; color:#553; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; 	}
 
#nav .sub {display:none;}
 
/* for IE5.5 and IE6 only */
#nav table {position:absolute; border-collapse:collapse; left:0; top:0; font-size:1em;}
 
#nav .select a:hover b {color:#000; cursor:pointer;}
 
#nav .current a {background-position:0 -150px; border-color:#fff;}
#nav .current a b {background-position:100% -150px; color:#000;}
 
#nav .sub li a:hover, 
#nav .select a:hover .sub li a:hover, 
#nav .select li:hover .sub li a:hover {border-color:#E5B9C3; background:#d1e1ce; color:#000;}
 
#nav .current .sub .current_sub a, 
#nav .current .sub a:hover {border-color:#C56379; background:#d1e1ce; color:#000;}
 
#nav .current .sub, 
#nav .select a:hover .sub, 
#nav .select li:hover .sub {display:block; position:absolute; width:450px; top:2.5em; background:#fff; margin-top:1px; padding:10px 0 5px 0;}
 
* html #nav .current .sub, * html #nav .select a:hover .sub {margin-top:0; margin-t\op:1px;}
 
#nav .current .sub li a, 
#nav .select a:hover .sub li a, 
#nav .select li:hover .sub li a {display:inline; background:#fff; border:1px solid #CD788B; padding:0 10px; margin:0 10px 0 0; width:auto; white-space:nowrap; font-weight:normal; font-size:0.9em; height:2em; line-height:1.9em;}
 
#nav .select a:hover, 
#nav li:hover a {background-position:0% -150px; border-color:#fff;}
 
#nav .select a:hover b, 
#nav .select li:hover a b {background-position:100% -150px; border-color:#fff; color:#000;}
 
/* calculate the left edge position of each sub level */
#nav .one .sub {left:0;}
#nav .two .sub {left:-10em; margin-left:-9px;}
#nav .three .sub {left:-21em; margin-left:-18px;}
* html #nav .three .sub {margin-left:-9px; marg\in-left:-18px;}
#nav .four .sub {left:-30.5em; margin-left:-27px;}
* html #nav .four .sub {margin-left:-18px; marg\in-left:-27px;}