/* common styling */
.menu {
	background:		url(img/prod_back.jpg);
	position:		relative; 
	margin:			0;
	width:			176px;
	float:			left;
	border-right:	3px solid #CCC;
	border-bottom:	3px solid #CCC;
	margin-right:	15px;
}
.menu ul li a, .menu ul li a:visited {
	border-bottom: 0;
	display:block; 
	text-decoration:none; 
	color:#FFF; 
	width:156px; 
	padding: 10px; 
	font-size:11pt; 
	font-weight: bold;
}

.menu ul li a.hide { background: url(img/arrow.gif) center right no-repeat; }

.menu ul {
	padding:0; margin:0; list-style: none;
}
.menu ul li {
	float:left; position:relative; border-bottom: 1px solid #FFF;
}
.menu ul li ul {
	display: none;
}

.menu .last { border-bottom: 0; }

/* specific to non IE browsers */
.menu ul li:hover a {color:#fff; background-color: #333; border-bottom: 0;}
.menu ul li:hover ul {display:block; position:absolute; top:0; left:176px; width:166px; border: 1px #CCC solid;}
.menu ul li:hover ul li {background: url(img/prod_back.jpg);}
.menu ul li:hover ul li a, 
.menu ul li:hover ul li a.hide { color:#FFF; font-size:10pt; padding: 5px; background: url(img/arrow.gif) center right no-repeat; border-bottom: 0;}
.menu ul li:hover ul li:hover a.hide {width:156px; background: url(img/arrow.gif) center right no-repeat #333; border-bottom: 0;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; color:#FFF; background: url(img/prod_back.jpg); width:156px; font-size:10pt; border-bottom: 0;}
.menu ul li:hover ul li a:hover {background: #333; color:#FFF;}

.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:166px; top:0; color:#000;}
.menu ul li:hover ul li:hover ul li a {display:block; width:156px; font-size: 8pt; background: url(img/prod_back.jpg); color:#FFF; border-bottom: 0;}
.menu ul li:hover ul li:hover ul li a:hover {background:#333; color:#fff;}