#pagehead {
	/*  PAGE HEADER BAR this is the styles for the whole top bar, 
		containing the LOGO, and menu buttons */

	background-color: black;
	
	
	
	/*-------------------------------------------------------------------------------*/
	height:55px;   /* NOTE: This number will change the behaviour of constants in
						the following sections:  
								#logo     	padding-top,
								#menu 		margin-top
								
					*/
	/*---------------------------------------------------------------------------------*/
	
	
	z-index: 1997;
	position: relative;
	display:block;
	float:left;
	
	/* let's make it a sexy semi-transparent header! */
	
	opacity:0.90;
	filter:alpha(opacity=90);
	
	
		/* <EDGES> This section ensures that we reach the very page edges, 
				which are .5% away on each side by default */ 

		width:100%; 

		
		/* end EDGES section */


	/* end PAGE HEADER BAR  */	
	
}

#logo {
	/* site logo */
	position: absolute;
	padding-left:20px; 
	padding-top:8px;


}

#menu {

	/* this is for the MENU buttons as a group. */	
//	z-index: 200;
	float:right; 	/* we want the menu on the right of the header */
	margin-right:0;
	margin-top:16px;  /* nav header's height is constant, this is to push our menu items down
						to where we want, at the bottom of the header. */
	

}



#menu li {

	/* the style for ALL list items. Anything that starts with an <li> 
		that is contained in the MENU div. Cascading down. Would need overriding. */


    position: relative;
 //   z-index: 2200;
    
	list-style-type: none;    /* no bullets or numbers for list */
	text-align:center;
	float:left;
	color: #CBCBCB;
	display:block;
	background-color: black;

	
	height:1.5em;

	min-width:2em; 	/* auto-width looks weird when used on a short word */
	width:2em;		/* to try to keep the spacing between words consistent 
						we set the block for each list item to auto width,
						but then have a set padding on each side. */
	padding-left:2em;
	padding-right:2em;


	

}


/* this section tells lists inside other TOP LEVEL list elements how to behave. 
	in this case: be invisible */

#menu li ul{

    position: relative;
 //   z-index: 2201;;
	display: none;
	font-size:12px;
	
	display:none;


	width:60px;

	padding-top:10px;
	margin-left:-1em;
	background-color:black;
	
	
}

/* this section tells ENTIRE LISTS how to behave when their parent element is hovered over 
	in this case: appear! */

	

	
 #menu li:hover >ul {

    position: relative;
  //  z-index: 1202;
	display: block;


} 

/*  #menu li:hover {

	color:pink;


}  */



#menu li ul li a {
	display:block;
} 

#menu li ul li {

	/* this is the list items, and how they look. 
	
			Important settings:
					position: relative  -- keeps menu lined up with menu title
		
			float:none;         -- avoids inheriting float:left; */

    position: relative;
  //  z-index: 1203;

	height:1.5em;

	padding:.3em;
	padding-bottom:1em;
	padding-top:0;

	text-align:left;

	margin-left:-3em;
	width:90px;
	float:none; 





	}





#menu li:hover  {
	/* default hover behaviour for all list items */

	color:white;     /* change list item text color on hover */ 


	}
	
#menu li:hover  > a{
	/* default hover behaviour for the anchor contained in the li */

	color:white;     /* change list item text color on hover */ 

	}
	
	

#menu a {

	/* default styling for list items which are <a> anchored links! */
	
	text-decoration: none;  /* no link underlines or whatever */
	
	color:#CBCBCB;		/* overwrite standard link color */
	
	}
	
#menu a:hover {
	/* default behaviour for hovering over an <a> anchored link */
	
	color:white;
	}
	
	


/* the searchbutton image needs a few tweaks to behave the way the other list items do on hover */

#menu li.searchbutton {
	opacity:0.70;
	filter:alpha(opacity=70);
	width:auto;

	
	}

#menu li.searchbutton:hover {
	opacity:1;
	filter:alpha(opacity=100);
	}
	

	
/* END SEARCHBUTTON ------------------------------------------ */
	
/* we want to give the store button a funny GOLD color when you hover over the enclosing <li> */
	
#menu li.cashmoney:hover >a{
	color:#FFD700;
	
	}


	
/* a small grey bar to make the transition from nav to page less severe */	
	
#live1 {

	z-index:-400;
	position:absolute;
	margin-top:55px;
	float:none;
	clear:both;
	width: 100%;
	height:6px;

	background:rgba(205,205,205,0.5);


}
	
	
	
	
	

/*---------------------------------------DONE NAV BAR ------------------------------------*/