/* this section is for mega menus, NOTE: use our nav div to set width and positioning; normally, we'll do the menus as an include */


ul#menu {
margin: 0;
padding: 0em 0em;
}


ul#menu li {
display: inline;
margin: 0em;
position: relative;
}

/* @group css rollovers */

/* use this section for rollover images, adding nav1, nav2, etc., as h2 class */

ul#menu h2.nav1 {
float: left;
display: block;
width: 261px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_01.gif) no-repeat 0 0;
}

ul#menu h2.nav1:hover {
background-position: 0 -108px;
}

ul#menu h2.nav1 span {
display: none;
}

ul#menu h2.nav2 {
float: left;
display: block;
width: 104px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_02.gif) no-repeat 0 0;
}

ul#menu h2.nav2:hover {
background-position: 0 -108px;
}

ul#menu h2.nav2 span {
display: none;
}

ul#menu h2.nav3 {
float: left;
display: block;
width: 192px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_03.gif) no-repeat 0 0;
}

ul#menu h2.nav3:hover {
background-position: 0 -108px;
}

ul#menu h2.nav3 span {
display: none;
}

ul#menu h2.nav4 {
float: left;
display: block;
width: 122px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_04.gif) no-repeat 0 0;
}

ul#menu h2.nav4:hover {
background-position: 0 -108px;
}

ul#menu h2.nav4 span {
display: none;
}

ul#menu h2.nav5 {
float: left;
display: block;
width: 74px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_05.gif) no-repeat 0 0;
}

ul#menu h2.nav5:hover {
background-position: 0 -108px;
}

ul#menu h2.nav5 span {
display: none;
}

ul#menu h2.nav6 {
float: left;
display: block;
width: 68px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_06.gif) no-repeat 0 0;
}

ul#menu h2.nav6:hover {
background-position: 0 -108px;
}

ul#menu h2.nav6 span {
display: none;
}

ul#menu h2.nav7 {
float: left;
display: block;
width: 139px;
height: 108px;
background: url(../cleve-tank-images/nav/nav_07.gif) no-repeat 0 0;
}

ul#menu h2.nav7:hover {
background-position: 0 -108px;
}

ul#menu h2.nav7 span {
display: none;
}

/* @end */

/* styles for dropdown items */

/* @group mega menu */

ul#menu h3 {
font-size: 100%;
font-weight: normal;
display: inline;
}

ul#menu li a {
color: #003355;
text-decoration: none;
padding: 0 0.4em;
}

ul#menu li a:hover {
text-decoration: underline;
}

/* orig script uses an arrow to indicate dropdowns, using
background: transparent url(arrow.gif) center right no-repeat; */


ul#menu div {
display: none;
z-index: 5000;
}

ul#menu li.hovering div {
display: block;
}

/* @group mega general set-up */

ul#menu li#button1,
ul#menu li#button2,
ul#menu li#button3,
ul#menu li#button4,
ul#menu li#button5,
ul#menu li#button6,
ul#menu li#button7 {
	float: left;
	padding: 0px;
	margin: 0;
}

ul#menu li#button1 div#tab1,
ul#menu li#button2 div#tab2,
ul#menu li#button3 div#tab3,
ul#menu li#button4 div#tab4,
ul#menu li#button5 div#tab5,
ul#menu li#button6 div#tab6,
ul#menu li#button7 div#tab7 {
position: absolute;
top: 108px;
left: 2px;
padding: 5px;
background: #ffffff;
border: 1px solid #003355;
color: #003355;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0px 4px 8px #333;
-webkit-box-shadow: 0px 4px 8px #333;
box-shadow: 0px 4px 8px #333;
}

ul#menu li#button1 div a,
ul#menu li#button2 div a,
ul#menu li#button3 div a,
ul#menu li#button4 div a,
ul#menu li#button5 div a,
ul#menu li#button6 div a,
ul#menu li#button7 div a {
color: #003355;
padding: 4px 0px 4px 10px;
background-image: none;
text-decoration: underline;
display: block;
height: auto;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

ul#menu li#button1 div a:hover,
ul#menu li#button2 div a:hover,
ul#menu li#button3 div a:hover,
ul#menu li#button4 div a:hover,
ul#menu li#button5 div a:hover,
ul#menu li#button6 div a:hover,
ul#menu li#button7 div a:hover {
color: #ffffff;
padding: 4px 0px 4px 10px;
background-image: none;
text-decoration: underline;
background-color: #94090d;
}

/* @end */

/* @group Button 1 */

ul#menu li#button1 div#tab1 {
width: 330px;
}

ul#menu li#button1 div a {
width: 330px;
}



/* @end */

/* @group Button 2 */

ul#menu li#button2 div#tab2 {
width: 350px;
}

ul#menu li#button2 div#tab2 .col1 {
	width: 160px;
	height: 190px;
	padding-left: 10px;
	float: left;
	border-right: 1px dotted #66aaee;
}

ul#menu li#button2 div#tab2 .col2 {
	width: 160px;
	height: 190px;
	padding-left: 10px;
	float: left;
}

ul#menu li#button2 div a {
width: 150px;
}



/* @end */

/* @group Button 3 */

ul#menu li#button3 div#tab3 {
width: 230px;
}

ul#menu li#button3 div a {
width: 210px;
}
/* ul#menu li#button3 div#tab3 .col1 {
	width: 230px;
	height: 100px;
	padding-left: 10px;
	float: left;
	border-right: 1px dotted #66aaee;
}

ul#menu li#button3 div#tab3 .col2 {
	width: 220px;
	height: 100px;
	padding-left: 10px;
	float: left;
}
*/

/* @end */

/* @group Button 4 */

ul#menu li#button4 div#tab4 {
width: 190px;
}

ul#menu li#button4 div a {
width: 180px;
}

/* @end */

/* @group Button 5 */

ul#menu li#button5 div#tab5 {
width: 200px;
}

ul#menu li#button5 div a {
width: 190px;
}

/* @end */


/* @group Button 6 */

ul#menu li#button6 div#tab6 {
width: 140px;
}

ul#menu li#button6 div a {
width: 130px;
}

/* @end */


/* @group Button 7 */

ul#menu li#button7 div#tab7 {
width: 180px;
margin-left: -60px;
}

ul#menu li#button7 div a {
width: 160px;
}

/*
ul#menu li#button7 div#tab7 .col1 {
	width: 160px;
	height: 100px;
	padding-left: 10px;
	float: left;
	border-right: 1px dotted #66aaee;
}

ul#menu li#button7 div#tab7 .col2 {
	width: 160px;
	height: 100px;
	padding-left: 10px;
	float: left;
}

*/

/* @end */

ul#menu li div a.more {
color: red;
font-weight: bold;
}

ul#menu div h3 {
color: #99ccff;
font-weight: bold;
font-size: 1.1em;
}
ul#menu div p {
margin: 0 0 0.8em 0;
padding: 0;
}



/* @end */


/* end of mega menus styles */