/*************************************************************************************************
/* File: base.css
/* Purpose: This file contains all of the base styles for the look of the CONTENT in the
/* 			web site.  It is independent of the layout.css since these styles are used within
/*			typical HTML pages as well as JS driven thickbox windows.  Any styles related to
/*			the page LAYOUT should go in layout.css
/************************************************************************************************/


/* -----------------------------------------------------------------------------------*/
/* ---------------------------------->>> GLOBAL <<<-----------------------------------*/
/* -----------------------------------------------------------------------------------*/

body{
    font-family:Verdana, Arial, sans-serif;
	font-size:62.5%;
	color:#414141;
}


h1{
	color:#12177f;
	font-size:1.8em;
	font-weight:bold;
	}
	

h2{
	color:#ff9211;
	font-size:1.4em;
	font-weight:bold;
	margin-bottom:15px;
	}

h3{	
	border-bottom:1px solid #b2b4df;
	color:#12177f;
	font-size:1.3em;
	font-weight:bold;
	padding-bottom:3px;
	margin:25px 0 5px 0;
	}

h4{
	color:#ff9211;
	font-size:1.3em;
	font-weight:bold;
	margin-bottom:5px;
	}

h5{
	color:#808080;
	font-size:1.1em;
	font-weight:bold;
	margin-bottom:5px;
	}

p{ 
	font-size:1.2em;
	line-height:1.9em;
	margin-bottom:15px;
	}

a{ 
	color:#12177f;
	font-weight:bold;
	text-decoration:none;
	}
a:hover{ background-color:#e6e4f1;}


ul{
	margin-left:20px;
	margin-bottom:15px;
	}

li{
	background:url(../images/bullet_arrow.png) no-repeat left center;
	list-style-type:none; /* for TinyMCE */
	padding-left:10px;
	margin-bottom:5px;
	font-size:1.2em;
	color:#2c2c2c;
	}


li{ background:url(../images/bullet_arrow.png) no-repeat left 3px; }


/* -----------------------------------------------------------------------------------*/
/* ---------------------------------->>> IMAGES <<<-----------------------------------*/
/* -----------------------------------------------------------------------------------*/

/* accomodates hand coded and TinyMCE inserted images */
p img, .accentImageR, .accentImageL, .accentImage{ 
	border:1px solid #ccc;
	display:inline; 
	margin:5px 10px;
	padding:3px;
	}

.accentImageR{ float:right; }
.accentImageL{ float:left; }


/* -----------------------------------------------------------------------------------*/
/* ---------------------------------->>> TABLES <<<-----------------------------------*/
/* -----------------------------------------------------------------------------------*/
.displayTable td, .displayTable th{
	border:1px solid #ccc;  
	border-left:3px solid #ccc;
	font-size:1.1em;
	padding:7px;
	}

.displayTable th{ color:#666; background-color:#ddd; font-weight:bold; }
.displayTable td { vertical-align:top;}


/* -----------------------------------------------------------------------------------*/
/* ---------------------------------->>> FORMS <<<------------------------------------*/
/* -----------------------------------------------------------------------------------*/

fieldset{ 
	background-color:#eeeef1; 
	padding:20px; 
	}

input, select, textarea{ 
	border:1px solid #a3a3a3; 
	margin-top:2px;
	}

input{ 
	height:1.5em; 
	}
	/* 
		This rule applies to Firefox only since FF streches the checkbox
		with the input rule above. IE ignores this rule and does not allow 
		styles on checkboxes so it works out.
	*/
	input[type='checkbox']{ height:auto; }
	

	/* [ Form Display and Layout]
	/* -----------------------------------------------------------------------------------*/
	.formTable td, .formTable th{ font-size:110%; padding:5px 10px;}
	
	/* 
		This set of rules is used in forms made up of nested tables 
		the first and last classes should be applied to <td>'s that are
		the first and last in a row.  :first-child is not used due to 
		lack of support in IE6
	*/
	.formTable table{ width:100%; }
	.formTable table td, .formTable table th{ font-size:inherit; padding:0 10px; }
	.first{ padding-left:0 !important; }
	.last { padding-right:0 !important;}

	#captcha td, #captcha th{ padding:5px 10px; background-color:#ccc;}
	#captcha input{ width:220px; }

	.formButton{
		border-bottom:2px solid #a3a3a3;
		border-right:2px solid #a3a3a3;
		color:#12177f;
		font-weight:bold;
		font-variant:small-caps; 
		height:auto !important;
		padding:3px;
		}
	.formButton:hover{background-color:#ccc; }
	.graphicFormButton{ border:none; margin:0; height:auto; }


	/* [ Form User Interaction ]
	/* -----------------------------------------------------------------------------------*/
	.required, .formTable th{ color:#12177f; font-weight:bold; }

	.error	{ background-color: #ffe4c8; padding:10px; margin-bottom:10px; font-size:1.2em; }
	.error li{ font-size:inherit; }
	.error ul{ margin-top:10px; }


/* -----------------------------------------------------------------------------------*/
/* ----------------------------->>> UTILITY/ACCENT <<<--------------------------------*/
/* -----------------------------------------------------------------------------------*/
.large	{ font-weight:bold; font-size:110%; }
.small	{ font-size:90%; }
.full 	{ width:100%; }
.center	{ display:block; margin:auto; }