.nav, .nav * {
 margin:0;
 padding:0;
 list-style:none;
}

/* nested submenu ul elements */
.nav ul {
 position:absolute;  
 top:-999em;  
}

/* submenu items */

.nav ul li,
.nav a { /* this affects top level anchors too */
 width: auto; 
}


/* all anchor elements */
.nav a {
 display:block; /* make IE6 obey width when text-indent is used */
}

/**** Position of second tier of nav ****/
.nav li:hover ul,  
ul.nav li.sfHover ul {
 left:-1px;  
 top: 29px;
}

/**** Position of third tier of nav ****/
.nav li:hover li ul,
.nav li.sfHover li ul {
 top:-999em; 
}

/**** Position of forth tier of nav ****/
.nav li li:hover ul,
ul.nav li li.sfHover ul {
 left:260px; /* VARIABLE. Offset subsequent submenus to the right by the amount you set for the submenu widths (see .nav ul rules above) */
 top:0px; /* position subsequent submenus horizontally aligned to parent li */
 opacity: .90;
 -moz-opacity: .90;
 -khtml-opacity: .90;
 filter: alpha(opacity=90);
}

.nav li li:hover li ul,
.nav li li.sfHover li ul {
 top:-999em; /* hide submenu in screen-reader and search-engine friendly way */
}


.nav li li li:hover ul,
ul.nav li li li.sfHover ul {
 left:9.45em; /* VARIABLE. Offset subsequent submenus to the right by the amount you set for the submenu widths (see .nav ul rules above) */
 top:-1px; /* position subsequent submenus horizontally aligned to parent li */
}

/**** Very important ****/
.superfish li:hover ul,
.superfish li li:hover ul,
.superfish li li li:hover ul {
 top: -999em; /* hide submenu in screen-reader and search-engine friendly way */
}

/* A quick note about issues with submenus appearing under Flash animations. Some say that setting wmode="opaque" or  wmode="transparent" on the embed or object tag is sufficient. This does fix many issues but I find it sometimes helps to also add this CSS: */
embed, object {
 position: relative;
 z-index: 0;
}

.nav {
 float:left; /* necessary if you don't want this element to collapse */
 margin-bottom:1.5em; /* add space beneath nav. Purely cosmetic */
}

.nav li {
 background:transparent; /* default background colour */
 padding-left: 0px;
}

.nav a {
 color: #000;
 padding: 3px 10px 8px 10px; 
 text-decoration:none;
 border-left: 1px solid #FFF;
 border-right: 1px solid #FFF;
 font-weight: 300;
}


.nav li:hover, .nav li.sfHover,
.nav a:focus, .nav a:hover, .nav a:active {
 background:transparent; 
}

.nav a:hover{
 text-decoration:none;
 padding: 3px 10px 7px 10px; 
 text-decoration:none;
 border-left: 1px solid #FFF;
 border-right: 1px solid #FFF;
 background: #FF0000;
}

/* second tiers  */
.nav ul li:hover, .nav ul li.sfHover,
.nav ul  a:focus, .nav ul a:hover, .nav ul a:active  {
 background:#FF0000; /* hover highlight */
 text-decoration:none;
}

.nav ul a:link, .nav ul a:visited{
 text-align:left;
 color:#000;
}

.nav li li {
 background:transparent; /* slightly darker shade for nested submenus */
}

.nav li li:hover {
 background:transparent; /* slightly darker shade for nested submenus */ /*THIS IS VERY VERY VERY IMPORTANT- NOT REMOVE THAT*/
}

.nav li li a{
 background: #FFFFFF; /* slightly darker shade for nested submenus */
 color:#000;
 padding-left: 0px;
 padding-right: 0px;
 font-weight: normal;
}

.nav li li a:hover{
 /*color:#ADCF3A;*/
}

.nav li li li {
 background:#FFF; /* slightly darker shade for nested submenus */
}

.nav ul a {
 color:#fff;
}
.nav ul ul a{
 color:#fff;
}

/* all li elements */
.nav li {
 float:left; /* must float all li elements. Vertical submenu items are restrained by parent ul width (see .nav ul rules above) */
 position:relative; /* make child submenu ul position relative to parent li */
 z-index:3000; /* ensure submenus appear above other page items. Increase if needed, but do not exceed thickbox overlay z-index! */	
}

.nav li.wide {
 height: 30px;
 margin-right: 0px;
 z-index:3000;
 padding-top: 0px;
}

.nav li.narrow {
 text-align: center;
 height: 30px;
 margin-right: 0px;
 z-index:3000;
 padding-top: 0px;
}


.nav li.narrow a {
 color: #FFF;
 font-size: 14px;
}

.nav li.wide a {
 color: #FFF;
 font-size: 14px;
}

.nav li.wide ul li a {
 width: 250px;
 padding-top: 5px;
 background: #FFF;
 border: 0px;
 margin: 0px;
 padding-left: 10px;
 font-size: 11px;
 color:#000;
 /* working in every browser */
 opacity: .90;
 -moz-opacity: .90;
 -khtml-opacity: .90;
 filter: alpha(opacity=90);
}

.nav li.wide ul li a:hover {
 padding-top: 5px;
 outline: 0px;
 margin: 0px;
 width: 238px;
}

.nav li.wide a:hover, 
.nav li.narrow a:hover {
 color: #FFF;
}

.nav li.wide li a:hover {
 background: #FF0000;
 color: #000;
}

.nav li#menuselected a {
 color: #FFF;
}

.nav li.wide ul li a:hover {
 background:#FF0000;
 color: #FFF;
 opacity: 1;
 -moz-opacity: 1;
 -khtml-opacity: 1;
 filter: alpha(opacity=100);
 border: 1px solid #FFF;
}

.nav #menuselected ul li.wide a {
 padding-top: 5px;
 background: #FFF;
 border: 0px;
 margin: 0px;
 padding-left: 10px;
 font-size: 11px;
 color:#000;
 /* working in every browser */
 opacity: .90;
 -moz-opacity: .90;
 -khtml-opacity: .90;
 filter: alpha(opacity=90);
}

.nav #menuselected ul li.wide a:hover{
 background:#FF6B6B;
}

ul li.wide li#menuselected a{/*this force the css to display correctly the menuselected in the submenu*/
 padding-top: 5px;
 background: #FFF;
 border: 0px;
 margin: 0px;
 padding-left: 10px;
 font-size: 11px;
 color:#000;
 /* working in every browser */
 opacity: .90;
 -moz-opacity: .90;
 -khtml-opacity: .90;
 filter: alpha(opacity=90);
}