@charset "utf-8";

/******
	Note that em sizes are based on a default 1em = 12pt = 16px = 100% for flexibility.
	If global type is declared differently (say 12px) then the em relationship will be
	a proportion of that. Normally, type styling should be separated from layout styling,
	but they are combined here for ease of single stylesheet.
	
	If your stylesheet defines global type as other than 1em or equivalent, you will need
	to edit the font sizes on lines 100, 155 and 177 to correct the sizing.
	
	The style initially uses a 2000px wide banner without the District Title or Building
	Strong as part of the graphic. The District title is renedered through HTML text in
	the HTML DIV called CORPS DIstrict. Building Strong is a separate graphic laid on top of 
	the blank banner.
	
	BuildingStrong.png is a 200px x 100px transparent png file.
	
	If you are using your own banner provide by Jane and VI, then remove the 
	#CorpDistrict and #BuildingStrong sections below. The rest of the style should flow.
	
	Remember to remove the comments befor final publication.
******/

/* #CorpsHeader: Placeholder for isolating entire header element */
#CorpsHeader {
	width: 100%;
	min-width: 820px; /* Default was 55em or 880px */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	}

/* #CorpsBanner: Placeholder for graphic banner image -- base image supports 2000px width */	
#CorpsBanner { 
	height: 100px;
	background: #fff url("../images/CorpsBanner_CamoFade.png") top left no-repeat; 
	}

/* #CorpsDistrict: Placeholder for isolating District Title as an image.
   If you are using your own banner provide by Jane and VI, then remove the #CorpDistrict section below 
   and remove this comment */
#CorpsDistrict {
	float: left;
	width: 400px;
	margin: 65px 0 0 132px;
	font: bold 18px Arial;
	}
	
/* #Building Strong: Placeholder for Building Strong graphic to remain right aligned as page width scales 
   If you are using your own banner provide by Jane and VI, then remove the #BuildingStrong section below 
   and remove this comment */		
#BuildingStrong {
	width: 200px;
	height: 100px;
	background: transparent url("../images/BuildingStrong.png") top right no-repeat;
	float: right;
	z-index: 100;
	}

/* #CorpsDistrict: Keep the District Title as text for searches but don't show it in the browser */ 
#CorpsBanner span, #BuildingStrong span { display: none;}

/******
	Top Menu section
	Darker green horizontal menu can accommodate 6-7 items 
*****/   
	
/* #TopMenuArea: Define the box's attributes */
#TopMenuArea {
	background: #95a195;
	float: left;
	padding: 0px;
	width: 100%;
}

/* ul#TopMenuArea: Clear the list's style and margins/padding */
ul#TopMenu {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* ul#TopMenuArea li: Leave layout control to the list items */
ul#TopMenu li {
	background-image: none;
	padding-left: 0px;
	padding-right: 0px;
	float: left;
	margin: 0;
	line-height: 21px;
	white-space: nowrap;
	border-right: 1px solid #a9a9a9;
	text-transform: uppercase;
}

/* ul#TopMenuArea li a: Specify the link styles */
ul#TopMenu li a {
	display: block;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 0.8em; /* Change this from 0.7em to 0.8em because of your other stylesheets font designator */
	text-decoration: none;
	color: #000000;
	background: transparent;
}

/* Force the <a> within the menu to use full width */
#TopMenuArea>ul#TopMenu li a { width: auto; }

/* Color the menu item on mouseover */
ul#TopMenu li a:hover {
	color: #fff;
	background: #95a195;
	}

/* Search Bar 
   Can accommodate most any search that allows sizing to below */
#SearchBar {
	float: right;
	padding-right: 10px;
	width: auto;
	font: 0.8em #000 Verdana, Arial, Helvetica, sans-serif;
	height: 22px !important;
    height: 24px;
	padding-bottom: 1px;
	overflow: hidden;
	}

#SearchBar input.SearchItem, #SearchBar select.SearchItem {
	margin: 0 1px 3px 1px;
	height: 18px;
 	width: 100px;
	font: 1.0em #000 Verdana, Arial, Helvetica, sans-serif;
	}

/* How Do I (MainMenu) 
   Lighter Green Menu can accommodate*/

/* #MainMenuArea: Define the box's attributes */
#MainMenuArea { 
	margin: 0;
	width:100%;
	background-color: #D0D2BD;
	padding: 0 0 -5px 0;
	overflow-x:hidden; /* IE7 */
	clear:both;
	}

/* #HowDoI: Separate the "How Do I..." Text from the menu box */
#HowDoI { 
  	float: left;
	width:10%;
	margin: 2px 0 0 5px;
	font-size: 0.9em; /* Change this from 0.7em to 0.9em because of your other stylesheets font designator */
	font-weight:bold;
	}
	
/* #MainMenuAreaBlock: Subcontainer for #MainMenu ul */
#MainMenuBlock {
	float:left;
	width:88%;
	}
	
#MainMenuArea ul {
    list-style-type: none;
	margin: 3px 0;
	}
	
/* #MainMenuArea ul li: Set the list's style specifically width before column-wrap */
#MainMenuArea ul li {
    float:left;
    width: 19em; /* 256 pixels */
    margin-bottom: 4px;
    padding:0;
	display: inline;
	font-size: 0.7em; /* Change this to a fixed pixel size if necessary*/
	}

/* Define the attributes for the How Do I elements */
#MainMenuArea ul li a,
#MainMenuArea ul li strong { 
	width: auto; 
	margin: 0; 
	padding-left: 15px; 
	background: transparent url("../images/MainMenu_Bullet.png") top left no-repeat; 
	color: #000; 
	font-weight: normal; 
	text-decoration: none; 
	}
#MainMenuArea ul li a:focus,
#MainMenuArea ul li a:hover,
#MainMenuArea ul li a:active { 
	background: transparent url("../images/MainMenu_Bullet-Over.png") top left no-repeat; 
	color: #990000; 
	text-decoration: none; 
	}