/* ================================================================ 
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/
Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#menu {
	width:960px;
	text-align:center;
	position:relative;
	z-index:500;
}
 
#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left;} /* top level list remove padding, margin and bullets */
 
#menu li {display:inline-block; display:inline;} /* this is for IE to give the list 'hasLayout' */
#menu ul ul {position:absolute; left:-9999px;} /* position the dropdown list off screen */
#menu ul.level1 {padding-left:0px;} /* to center the top level in all browsers except IE6 */
#menu ul.level1 li.level1-li {float:left; display:block; position:relative; margin-right:-1px; background-color:#fff;}
 
#menu ul.level1 {background:#37210c;} /* background of top level list */
#menu ul.level2 {background:#37210c;} /* background of dropdown list */
 
#menu b {position:absolute;} /* -- for IE6 non-flyout dropdowns to stop flickering - who knows why --*/
 
#menu a {
 display:block;
 color:#000;
 background-color:#fff;
 line-height:20px;
 text-decoration:none;
 padding: 4px 25px;

 font-family: Verdana, Geneva, sans-serif;
 font-size:14px;
} /* style the top level links */
#menu ul.level1 li.level1-li a.level1-a {float:left;} /* float the top level list items to make the top level horizontal */
 
#menu ul li:hover > ul {visibility:visible; left:0; top:28px;} /* for all browsers except IE6 use li:hover to show the dropdown list */
#menu li.left:hover > ul {visibility:visible; left:auto; right:0; top:22px;} /* the same as above for left aligned dropdown */
 

#menu a:hover ul {left:0; top:20px;} /* for IE6 use a:hover to show dropdown list */
#menu li.left a:hover ul {left:auto; right:-1px; top:21px;} /* same as above for left aligned dropdown */
 
#menu li.left ul a {padding:0 10px 0 10px;}  /* style the left aligned dropdown links */
#menu li ul li a {border-width:0px 0px 0px 0px; background: #b2805c; } /* style the dropdown links */
 

#menu li a.fly {} /* add the down arrow graphic to the top level links with a dropdown menu */
#menu li.left ul a.fly {} /* as above for the left aligned dropdowns */
 
#menu li a:hover,
#menu li a.fly:hover {color:#fff; background-color:#e21f01;} /* style the link hovers for IE6 */
#menu li:hover > a,
#menu ul li:hover > a.fly {color:#fff; background-color:#e21f01;} /* style the link hovers for non-IE6 browsers */
 
#menu table {position:absolute; height:0; width:0; left:0; border-collapse:collapse; margin-top:2px;} /* style the tables for IE6 - this positions the dropdown menu in IE6 */

 /* all below adds an id to each of the top level links and then uses a class in the page body tag to show current button  */
body.home #menu li a#homenav,
body.thesong #menu li a#thesongnav,
body.buy #menu li a#buynav,
body.lyrics #menu li a#lyricsnav,
body.theband #menu li a#thebandnav,
body.sean #menu li a#seannav,
body.photos #menu li a#photosnav,
body.links #menu li a#linksnav,
body.contact #menu li a#contactnav

{color:#fff;
background-color:#e21f01;}

 /* all below stops the link going white again when waiting for the new page to load */
#menu li a:active,
#menu li a:focus, 
#menu li a:hover,
#menu li a.fly:hover {color:#000; background-color: #CCC;} /* style the link hovers for IE6 */