/* ---------->>> the following styles govern the positioning and size of objects comprising the
 basic interior layout structure <<<-------------------------------------------------------------------------*/

/* ---------->>> global position styles: <<<-----------------------------------------------------------------------*/
/* ------------  the following styles govern the position/style html, body and wrapper elements -------------------*/

/* note: this is a global white space reset.
 (asterisk is the universal css selector - all descendents will have this setting applied.) */   
*{padding: 0px; margin: 0px;}
				
/* 'min-height: 101%' forces firefox to always have a scrollbar, even on short pages,
   so that layout doesn't shift, which can throw off the sub-menus by a pixel or two. */		  
html, body {
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

/* ie7 understands min-height, but ie6 (and under) does not; this hack should force the height
for these browsers and allow the left background graphic to scroll all the way to the bottom of viewport */
/* mac hide \*/
/* html, body, #outer_wrapper {height:100%} */
/* end hide */
	
/* specify a min-width for the body as wide as the wrapper div: 
(prevents negative (inaccessible) left-margins in narrow browser windows 
when using netscape 6+/mozilla on win32.) */					
body {
	position:absolute;   /* wrapper divs seem to need absolute positioning in order to force 100% height */
	width:100%;	    	 /* also seem to need a width defined */
	min-width:800px;     /* 2 x (left column full width + center column padding) + right column full width */
	text-align:center; 
	background-color:#043167;
	border:0px solid #ffffff;
}		

/* ---------->>> layout positioning styles: <<<--------------------------------------------------------------------*/
/* ------------  the following styles govern the position and style of the basic parts of the layout --------------*/	

#outer_wrapper {
	position:absolute; /* wrapper divs seem to need absolute positioning in order to force 100% height */
	width:924px; 
	height:650px; /* really, this is 665px - this is height of inside content area plus padding = outer_wrapper */
	top:50%;
	margin-top:-325px;  /* 560 height + (25*2) padding = 610 > take this number and half it for margin-top */
	left:50%;
	margin-left:-461px; /* 950 width + (25*2) padding = 1000 > take this number and half it for margin-left */
	background-color: #ffffff;
	border:0px solid #296DC0;
}

#header {
	position:relative;
	top:0px;
	padding-left:25px;
	width:899px;  /* make this automatically expand to outer_wrapper width */
	background-color: #296DC0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF; 
}
	
/* container for left, center and right columns */
#content {
	position:relative;		
	top:0px;
	padding-right:289px; /* right column full width + any center column padding */
	padding-left:326px;  /* left column full width */
	padding-top:30px;
	padding-bottom:0px;
	/* min-height:275px; */
	overflow:auto;	
	text-align:left;
	background-color:#ffffff;
	margin-bottom:150px; /* build in some bottom-margin to equal height of the footer */ 
	border:0px #ffcccc solid;	
}

#content .column, #contentIndex .column {
	position: relative;
	float: left;
}

/* center column - interior pages */
#bodyTextArea {
	/* padding: 10px 20px;   */    /* center column padding */
	width:100%;
	border:0px #333333 solid;
}

/* center column - index only - this spaces the actual text away from the left and right columns
(functions almost the same as bodyText on interior layouts)  */
#centerColumn {
	padding-top:0px;
	padding-left:15px;
	padding-right:15px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #296DC0;
	border-left-color: #296DC0;
	border-top-style:none;
	border-bottom-style:none;
	/* border:1px #ffcccc solid; */
}

/* left column of teasers - index only */
#leftColumn{
	width:275px;			  /* left column width */
	/* padding: 0 10px; */    /* left column padding */
	right:275px;              /* left column full width + any center column padding */
	margin-left:-355px;
	padding-left:35px;
	padding-right:15px;
	border:0px #666666 dashed;
}

/* right column of teasers - index only (functions almost the same as pageImgArea) */
#rightColumn {
    width:234px;		   /* right column width */
	padding-right:40px;    /* right column padding (right and left) */
	padding-left:15px;     
	margin-right:-471px;
	border:0px #666666 dashed;
}

/* make sure to build in enough margin-bottom in the #content div to space this footer out;
otherwise, on long pages, the footer might overlap the text */
#footer {	
	clear:both;
	position:absolute;
	text-align:left;
	bottom:0px;
	left:0px;       /* IE 7 didn't like margin-left , so use left instead */
	padding-left:0px;
	padding-top:15px;
	padding-bottom: 0px;
	width:100%; 	/* make this automatically expand to outer_wrapper width */
	height:auto;	
	border:0px #ffcccc solid;	
}	

.footerCopy {   	
	padding-left:40px;
	padding-right:50px;
	font-size:11px;
	color:#999999;
	text-decoration:none;
	border:0px solid #000000;
}

div.footerCopy p {
	color:#999999;
	padding-top:15px; 
}

#printNavBox { 
	/* *** DMS - for printing only, just turn off here */
	display:none; 
}