﻿/* ================================================================ 
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/flyoutt.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */
.menu {
	width: 160px;
	position: relative;
	margin-bottom: 10px;
	z-index: 2;
}

/* defaukt state */
.menu ul li a:visited {
	display: block;
	text-decoration: none;
	color: #FFF;
	width: 156px;
	text-align: center;
	padding: 2px 4px;
	border: 1px #FF6600 outset;
	background: #FF6600;
	font: bold 90% "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}

.menu ul li a {
	display: block;
	text-decoration: none;
	color: #FFF;
	width: 156px;
	text-align: center;
	padding: 2px 4px;
	border: 1px #FF6600 outset;
	background: #FF6600;
	font: bold 90% "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}

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

.menu ul li {
	float: left;
	margin-right: 1px;
	position: relative;
}

/* First level flyout during default state */
.menu ul li ul {
	display: none;
}

/* specific to non IE browsers */
/* When mouse hover over main menu */
.menu ul li:hover a {
	color: #FF6600;
	background: #FFF;
	border-style: inset;
	padding: 3px 3px 1px 5px; /*shift text 1px to the right and down*/
}

.menu ul li:hover ul {
	display: block;
	top: 0;
	position: absolute;
	left: 164px;
	width: 160px;
	z-index: 100;
}

/* Flyout first kevel sub-menu */
.menu ul li:hover ul li a.hide {
	background: #FF6600;
	color: #FFF;
}

/* Flyout second kevel sub-menu */
.menu ul li:hover ul li:hover a.hide {
	width: 160px;
}

/* Second level flyout during default state */
.menu ul li:hover ul li ul {
	display: none;
}

.menu ul li:hover ul li a {
	display: block;
	background: #FF6600;
	color: #FFF;
	width: 160px;
	border: 1px #FF6600 outset;
	opacity: 0.9;
}

.menu ul li:hover ul li a:hover {
	background: #FFF;
	color:#FF6600;
	border-style: inset;
	padding: 3px 3px 1px 5px; /*shift text 1px to the right and down*/
}

.menu ul li:hover ul li:hover ul {
	display: block;
	position: absolute;
	left: 172px;
	top: 0;
	color: #000;
}

.menu ul li:hover ul li:hover ul li a {
	display: block;
	width: 160px;
	background: #FF6600;
	color: #FFF;
}

.menu ul li:hover ul li:hover ul li a:hover {
	background: #FFF;
	color:#FF6600;
}
