/* styles for the meg header

This copy just has one little change from the regular one - #menu ul is set for 6 columns, that's All */

#masthead_container {
	width:auto;
	clear:right;
	display:block;
	height: 110px;
	position:absolute;
	z-index:500;
	left:0;
	top:0;
}
#masthead_logos {
	float: left;
	height: 95px;
	white-space:nowrap;
}
#logo1 {
	background-image: url(/page_art/SHARK.jpg);
	background-repeat: no-repeat;
	float:left;
	width: 142px;
	height: 65px;
	display:inline;
}
#logo1:hover { cursor:pointer; }
#logo2 {
	background-image: url(/page_art/logo.gif);
	background-repeat: no-repeat;
	position:absolute;
	left:147px;
	top:5px;
	width:146px;
	height:76px;
	display:inline;
}
#logo2:hover { cursor:pointer; }
#mastheadRightStuff {
	height: 76px;
	display: inline;
	float:left;
	clear:right;
}
#masthead_slogos {
	position: absolute;
	left: 303px;
	top: 8px;
	height: auto;
	width: 595px;
	display: block;
	clear:right;
}
#masthead_slogos h1,
#masthead_slogos h2,
#masthead_slogos h3,
#masthead_slogos h4,
#masthead_slogos h5,
#masthead_slogos h6 {
	font-size:14px;
	line-height:22px;
	color: #ececec;
	font-style: normal;
	white-space: nowrap;
	font-stretch:ultra-expanded;
	overflow: hidden;
	text-align:center;
	text-indent:-15px;
}
#menu {
	width: 900px;
	float: left;
	clear:both;
	position:relative;
	left:2px;
	top:-15px;
	display:block;
}
#menu ul {
	list-style: none;
	height:14px;
	line-height:14px;
	margin: 0;
	padding: 0;
	width: 150px;/*here's where you set the width of each heading. Should fit within #menu width */
	float: left;
}
#menu ul li ul a,
#menu h2{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	display: block;
	font-size:10px;
	border-width: 1px;
	border-style: solid;
	border-color: #ccc #888 #555 #bbb;
	margin: 0;
	padding: 2px 3px;
}
#menu ul h2 {
	color: #fff;
	letter-spacing:0.9;
	word-spacing:normal;
	font-weight:normal;
	text-transform: lowercase;
	text-align:center;
	background:#666699;
	font-size: 13px;
	letter-spacing:normal;
}

#menu a {
	color: #000000;
	background: #efefef;
	text-decoration: none;
}
#menu a:hover {
	color: #a03000;
	background: #ffffff;
}
#menu ul li h2 a{
	background-color:#666699;
	color:#FFFFFF;
	border:none;
	font-size:13px;
	font-weight:normal;

}
#menu ul li h2 a:hover{
	color:#E76239;
	background-color:#666699;
}
/*  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 */
}
/* 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; }
