/* styles for the meg header */

/* Masthead Styles */

div.mastheadContainer
	{
	display:block;
	white-space: nowrap;
	height:141px;
	width:800px;
	clear: right;
	}
div.mastheadLogo
	{
	float:left;
	width:294px; height:132px;
	align:center;
	display: inline;
	}
div.mastheadLogo img
	{
	
	border:none;
	}
	
#masthead_container {

	width:inherit;
	clear:right;
	display:block;
}
	
div.mastheadLogo div
	{
	position:relative;
	text-align:center;
	bottom:12px;
	
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	white-space: nowrap;
	}

div.mastheadTextOverPict
	{
	display: block;
	float:left;
	white-space: nowrap;
	width:498px;
	height:141px;
	background-repeat:no-repeat;
	background-image: url(/Galleries/pictures/header-sunset-pic.jpg);
	}
div.mastheadTextOverPict span
	{
	position:relative;
	font-family:Arial, Helvetica, sans-serif;
	font-size:23px;
	line-height:30px;
	color:#CC9933;
	left: 20px;
	top: 72px;
	width: 300px;
	height: 64px;
	overflow: visible;
	}




#menu {
	width: 800px;
	float: left;
	clear:both;
	position:relative;
	left:2px;
	top:0px;
	display:block;
	padding:0;
	margin:0;
}
#menu ul {
	list-style: none;
	height:14px;
	line-height:14px;
	margin: 0;
	padding: 0;
	width: 158px;/*here's where you set the width of each heading. Should fit within #menu width */
	float: left;
}
#menu ul li ul p,
#menu ul li ul h2,
#menu ul li ul h3,
#menu ul li ul a,
#menu h2, #menu h3{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	display: block;
	font-size:12px;
	border-width: 1px;
	border-style: solid;
	border-color: #ccc #888 #555 #bbb;
	margin: 0px;
	padding: 2px 0px 2px 0px;
}


#menu ul h2 ,#menu ul h3{
	color: #fff;
	letter-spacing:0.9;
	word-spacing:normal;
	font-weight:normal;
	text-align:center;
	font-size: 13px;
	letter-spacing:normal;
	background-color: #663333;
}

#menu a {
	color: #000000;
	background: #efefef;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}
#menu a:hover {
	color: #a03000;
	background: #ffffff;
}
#menu ul li h2 a,
#menu ul li h3 a,
#menu ul li h2,
#menu ul li h3{
	background-color: #663333;
	color:#FFFFFF;
	border:none;
	font-size:13px;
	font-weight:normal;
}
#menu ul li h2 a:hover,
#menu ul li h3 a:hover,
#menu ul li h2 :hover,
#menu ul li h3 :hover{
	text-decoration:underline;
	background-color: #663333;
	color:#FFFFFF;
}
#menu h3 ,#menu ul li h3 a, #menu ul h3{
		font-size:11px;
}

/*  positioning for any children */

#menu li { position: relative; }
#menu ul ul ul {
	position: absolute;
	top: 5px;
	right: 100%;   /* set this r or l to set the direction of the 2nd level dropdown */
	text-align:right;
}
/* pops it out over any lower down text */
#menu ul ul {
	position: absolute;
	z-index: 500;
}
/* to hide any 2nd level menus we might make*/
div#menu ul ul { display: none; }
/*Again the convoluted CSS to keep IE happy, this time when we hover over the first <li> which is in fact the heading too we want the child lists to appear*/

div#menu ul li:hover ul { display: block; }
/* counteracts the hover on deeper lists */
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul { display: none; }
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul { display: block; }
