/* BASIC CSS (Generic) ************************************************/

/* Fonts **************************************************************/

/* Wired in since IE* and Opera don't ALWAYS inherit from container */
/* To override any of these, simply wrap in a container with class .f8 -.f18 */
body, button, input, label, select, textarea
{ 
	color: #5D563F;
	font-family: Verdana, Arial, Helvetica, Geneva, SunSans-Regular, sans-serif; 
	font-size: 11pt;
}  
tt, pre, .mono	
{ 
	font-family: "Courier New", Courier, Monaco, monospace; 
}

/* Touch up font sizes to  use with other classes (e.g., class="h1 f14") */
/* This abstracts the notion of relative (%) or absolute (pt) sizes */
/* Using fixed pt sizes since modern browsers can + or - fixed size fonts */
.f18			{ font-size: 18pt; }
.f16			{ font-size: 16pt; }
.f14, h1		{ font-size: 14pt; }
.f13, h2		{ font-size: 13pt; }
.f12, h3		{ font-size: 12pt; }
.f11, h4		{ font-size: 11pt; }
.f10			{ font-size: 10pt; }
.f9				{ font-size: 9pt;  }
.f8				{ font-size: 8pt;  }

/* Set the default font weights for common text elements */
h1				{ font-weight: normal; }
h2, h3, h4		{ font-weight: bold; }

/* Colors & Borders ********************************************************/
div, span, h1, h2, h3, h4, p, pre, table, td, th, ol, ul, li 
{ 
	background-color: transparent; 	/* better than inherit for absolute positioning + bleed thru images */
	border-color: inherit;
	border-width: 0px;				/* use width:0px rather than style:none to remove a border */
	border-style: solid;			/* must override specifically for dashed or none */
	color: inherit; 
}
/* Div can't inherit border colors in IE */
body	{ border-color: #C2DDF0; }
table	{ border-collapse: collapse; }	/* Tables always collapse shared borders */
img		{ border-width: 0px; }			/* No border on images so anchored images don't look ugly */

/* Anchor colors that are more modern than the defaults */
a:link 		{ color: #31568C; }
a:visited	{ color: #5B1B8D; }
a:active	{ color: #7F1608; }

/* Alignment **********************************************************/

/* Horizontal */
.left 		{ text-align: left; }
.center		{ text-align: center; }
.mcenter	{ margin: auto; }
.right		{ text-align: right; }

/* Vertical */
.top		{ vertical-align: top; }
.middle		{ vertical-align: middle; }
.baseline	{ vertical-align: baseline; }
.bottom		{ vertical-align: bottom; }

/* Table */
td				{ vertical-align: top; }

/* Spacing ***********************************************************/

body, div	{ margin: 0px; padding: 0px; }
hr			{ margin: 5px 0px; padding: 0px; }
.ie hr		{ margin: 0px; } /* IE has a wired-in 5px margin */

/* No default margins or padding so tables can be used as layout containers */
/* Visible tables should be overloaded with .p or wrapped with div.i for indentation */
table  	{ margin: 0px; }	/* tables don't have padding */
td, th	{ padding: 0px; }	/* cells don't have margins */

/* Top and Bottom (TB) spacing is controlled in EMs (relative to font) */
/* Left and Right (LR) spacing is controlled by PX (fixed for LR alignment) */
/* Additional LR spacing is applied with a div tag (e.g., div.i) or the container */

/* Use pure padding so that backgrounds fill their containers */
h1, h2, h3, h4  { margin: 0px; padding: 0.4em 10px 0.4em 10px; }
p, pre, tt      { margin: 0px; padding: 0.4em 10px 0.4em 10px; }

/* List containers always left indent from adjacent blocks */
/* Right spacing is done by the LI element */
/* (OL | UL) spacing + (First | Last) LI spacing = P spacing
/* Nested lists have are adjusted based on their parents */
ul		{ margin: 0px; padding: 0.2em 0px 0.2em 30px; }
ul ul	{ margin: 0px; padding: 0em -10px -0.2em 20px; }
ol		{ margin: 0px; padding: 0.2em 0px 0.2em 38px; }
ol ol	{ margin: 0px; padding: 0em -10px -0.2em 28px; }

/* List entries have smaller TB margins so they are more compact */
li		{ margin: 0px; padding: 0.2em 10px 0.2em 10px; }

/* For div, p, img, or table for additional indenting  */
/* DIV.i can be nested for relative LHS indentation */
.i		{ margin-left: 10px; }
.ii		{ margin-left: 20px; }
.iii	{ margin-left: 30px; }

/* Other elements with margins (or padding) that act like a paragraph */
div.p, table.p, img.p	{ margin: 0.4em 10px 0.4em 10px; }
td.p					{ padding: 0.4em 10px 0.4em 10px; }

/* General touchup classes to override padding */
.flush-top		{ padding-top: 0px !important; }
.flush-right	{ padding-right: 0px !important; }
.flush-bottom	{ padding-bottom: 0px !important; }
.flush-left		{ padding-left:	0px !important; }
.flush-tb		{ padding-top: 0px !important; padding-bottom: 0px !important; }
.flush-rl		{ padding-right: 0px !important; padding-left: 0px !important; }
.flush			{ padding: 0px !important; }

/* Display ***********************************************************/

/* Images should be wrapped in <p> tags for indentation and spacing */
.inline	{ display: inline; }	/* Use img.inline or table.inline when you want them to flow */
.block	{ display: block; }		/* Use img.block or table.block when you want them blocked */

/* Floating of tables and images -- use with .p for spacing (e.g., class="fl p") */
.fr		{ float: right; }
.fl		{ float: left;  }

/* Sizing - set anything to a width of 100%  */
/* Note: input and textarea require a box-model change, see input.w100 */
.w100	{ width: 100%; }

/* Nowrap */
.nowrap	{ white-space: nowrap; }

/* Debugging and Specs *************************************************/
.debug		{ background-color: #DDFFFF; color: black; }
.error		{ background-color: #F9CAC3; }
.error h1 	{ color: #7F1608; }
.codeblock	{ background-color: #EDF1F6; border: 1px dashed #A2B2CA; }

/* GRID CSS (Generic) *************************************************/
/* Provides a grid pattern for displaying tabular data or a tabluar form */
/* No font-sizes are specified.  The cascade determines the font size */

/* Present tabular data in a grid format -- margins are set by the wrapper*/
table.grid {}

table.grid th
{ 
	background-color: #EDF1F6;
	border-color: #D1DAE6;
	border-width: 1px;
	color: #5D563F;
	padding: 3px 5px 3px 5px; 
	text-align: left;
}

table.grid th.title
{ 
	background-color: #FEF9C4;
	color: #525E70;
	font-weight: bold;
}

table.grid td 
{ 
	background-color: white;
	border-color: #D1DAE6;
	border-width: 1px;
	color: #5D563F; 
	padding: 3px 5px 3px 5px; 
	vertical-align: top;
}

/* When you want header coloring on a td */
table.grid td.head
{
	background-color: #EDF1F6;
	color: #5D563F; 
}

/* When you want header coloring on a td grid */
table.grid td.blank
{
	border-width: 0px;
	background-color: inherit;
	font-size: 25%;
}

/* When you want an img in the grid with no border */
table.grid td.img
{
	padding: 0px;
	vertical-align: baseline;
}

/* When you want an img in the grid with no border */
table.grid td.img img
{
	display: block;
}

/* A grid cell that contains a nested table splits the vertical padding in half */
table.grid td.table	
{ 	padding: 3px 0px 3px 0px;  }

table.grid td.table td	
{ 
	background-color: inherit;	/* IE Ignores */
	border-width: 0px;
	color: inherit;				/* IE Ignores */
	padding: 0px 5px 0px 5px; 
}

/* BASIC CSS (Site Overrides) ******************************************/

/* Fonts and Colors ****************************************************/

/* Set the max width and any auto margins */
body
{
	color: #5D563F;	
	background-color: #F9F6E3;
	margin: 12px auto;
	max-width: 1000px;	
}

/* Heading colors */
h1, h2, h3, h4  { color: #B1301F; }
h1.big		{ font-size: 18pt; font-weight:bold; }

/* Page Divisions **********************************************************/

/* page-top division */
/* contains table page-logo (left cell) and page-menu (right-cell) */
#page-top
{	
	background-color: #ECF3FE;  
	background-image: url(div-top-bottom.jpg); 
	background-repeat: repeat-y;
	background-position: right;
	color: #223E67; 
	border-width: 1px; 
}
#page-top a { text-decoration: none; }

/* Page Header is stored in a table, but CSS allows for changing to divs */
#page-top table { width: 100%; }

#page-top table td { vertical-align: middle; }

/* Logo Cell on the left */
#page-logo
{ 
	font-size: 20pt; 
	font-weight: bolder; 
	padding: 10px;
	text-align: left;
}
#page-logo,
#page-logo a { color: #B1301F;}

/* Menu Cell on the right */
#page-menu
{ 
	font-size: 11pt; 
	font-weight: bolder; 
	padding: 0px 10px 5px 10px;
	text-align: right;
}
#page-menu,
#page-menu a { color: #303A49;}
#page-menu a:hover { background-color: #F9F6E3;}

#page-menu-top
{ 
	color: #B1301F; 
	font-weight: bolder; 
	font-size: 16pt; 
	font-style: italic; 
	padding: 5px 10px 0px 10px;
	text-align: right;
}

/* page-content division  */
/* Holds the content that changes on a per-page basis */
#page-content
{ 
	background-color: white; 
	border-width: 0px 1px; 
	color: #383426;
	padding: 10px;
	min-height: 500px;
}

/* page-bottom division  */
/* Holds table with left and right cells for copyrights, status, etc */
#page-bottom
{
	background-color: #ECF3FE;  
	background-image: url(div-top-bottom.jpg); 
	background-repeat: repeat-y;
	background-position: right; 
	border-width: 1px; 
	color: #223E67;
}

#page-bottom table { width: 100%; }
#page-bottom table td
{ 
	font-size: 11pt;
	padding: 7px 10px;
	vertical-align: middle; 
}
#page-bottom-left { text-align: left;}
#page-bottom-right { text-align: right;}

/* Misc Content Area Classes *********************************************/

/* Infobox table */
table.info
{
	margin: 0.4em auto;
	width: 200px;
}

table.info th
{ 
	background-color: #0171BB;
	background-image: url(info-top.jpg); 
	background-repeat: repeat-x;
	background-position: left;
	border: 1px solid #91C7ED; 
	color: #014980;
	padding: 2px;
}

table.info td, table.info td.flash
{ 
	background-color: #ECF2FE;
	border: 1px solid #C2DDF0; 
	padding: 4px;
	vertical-align: middle;
}

table.info td.label	{ border-right-width: 0px; }
table.info td.value	{ border-left-width: 0px; }

/* Used to frame images on the home page */
img.frame, div.frame, div.flashframe
{
	background-color: #ECF2FE;
	border: 1px solid #C2DDF0; 
	padding: 4px;	
}

/* Flash needs this touchup */
table.info td.flash, div.flashframe { padding: 4px 4px 1px 4px; }

/* GRID CSS (Site Overrides ) ******************************************/

table.grid th.title
{
	background-image: url(grid-title.jpg); 
	background-repeat: repeat-y;
	background-position: right;
}