/**
 * Few Colors used:
 * Menu BG Color: #bb5a26
 * Body BG Color: #f5f8f9
 * Body Border Color: #4a6c90
 * Border trim Color: #9daab0
 *
 *  Diagram:
 *    
 *  |-------48em------------|
 *  .-----------------------.
 *  |      |                |
 *  |-12.8-|-----35.8em-----|
 *  |  em  |                |
 *
 *  Some of these demensions are altered since the em size is relative
 *  to it's parent size. 
 *  Therefore, if parent width is 60em and you want the child
 *  to be the same width but has a font size of 0.8em then the
 *  size would have to be 125% of 60em. 
 *  60em * 1.25 = 75em  
 *  75em would be the proper matching width
 *  of the child.
 *
 * Organization is as follows:
 * 1. General Elements
 * 2. Header
 * 3. Body
 *    3.1 Sidebar
 *    3.2 Content
 * 4 Footer
 *    4.1 Footer Menu
 *
 * Can't stand the heat... gtfo the kitchen.
 * We on a mission,
 * -JGR, 09/05/2008
 */

 
/**
 * 1. General Elements =======================================================
 */
body {
	/* Set background of body to white
	 * removed all margins, set font size and family for
	 * entire document, body width */
	margin: 			0;
	font-size:			1em;
	font-family:		Arial, Helvetica, sans-serif;
	border:				none;
	background-color:	#fff;
}

a:link, 
a:visited,
a:active {	
	color: 				#0380b7;
	font-size:			0.9em;
}

a:hover {
	color: 				#000;
}

img {
	/**
	 * By Default take borders off all images,
	 * Specifically for images in anchors
	 */
	border: 			none;
	
}

form {
	margin: 			0; /* take off default margins on forms */
}

input {
	border: 			1px solid #999;
}

/**
 * 2. Header ============================================================
 */
#headerContainer {
	/* Container that holds the logo and quicklinks
	 * Does not hold the main menu bar
	 */
	background-color:	#fff;
	margin:				auto; 
	width:				48em;
	height:				6em; 
}

#headerLogo {
	margin: 			0.3em 0 ;
}

#headerQuickLinks
{
	font-size:			.8em;
	float:				right;
	margin: 			5.5em 0.8em 0 0;
	padding: 			0;
}

#headerQuickLinks li
{
	display: 			inline;
}

#headerSpacer {
	border-top:			0.4em solid #000;
	border-bottom:		1px solid #fff;
}

/**
 * 3. Body ============================================================
 */
 
#bodyBackground {
	background-image:	url(../images/bg.jpg);
	background-repeat:	repeat-x;
	background-color:	#f5f8f9;
	padding-bottom:		10em;
}

#bodyContainer {
	margin:				auto;
	width:				48em;
	background-color:	#fff;
	border:				none;
	border-left:		1px solid #4a6c90;
	border-bottom:		1px solid #4a6c90;
	border-right:		1px solid #4a6c90;
	margin-bottom:		10em;
}

/**
 * 3.1 Body - Sidebar ============================================================
 */
#bodySidebarContainer {
	float:				left;
	width:				14.2em;
	border:				none;
	margin:				0;
}

#bodySidebarContainer h1 {
	font-size:			1em;
	margin:				0; /* take out default for FF */
}

#bodySidebarTopContainer {
	background-image:	url(../images/sidebarbg.gif);
	background-position:bottom center;
	background-repeat:	repeat-x;
	background-color: 	#e4eef1;
	padding-top:		1em;
	
}

#bodySidebarTopLinks 
{
	background-color:	#0380b7;
	height:				1.4em;
	text-align: 		center;
	font-size: 			0.95em; 	
	font-weight: 		bold;
	padding:			.5em 0;
	color:				#fff;
}

#bodySidebarTopLinks a:link,
#bodySidebarTopLinks a:visited,
#bodySidebarTopLinks a:active 
{
	color:				#fff;
	text-decoration:	none;
}

#bodySidebarTopLinks a:hover
{
	color:				#fff;
	text-decoration:	underline;
}

#bodySidebarDialogue {
	padding: 			0.5em;
	font-size:			0.9em;
}

#bodySidebarDialogue ul {
	margin-top:			0;
}

#bodySidebarDialogue li {
	list-style-type:	square;
	color:				#e76e2e;
	font-size:			.9em;
}

#bodySidebarDialogue li span {
	color: 				#000;
}

#bodySidebarDialogue a:link,
#bodySidebarDialogue a:visited,
#bodySidebarDialogue a:active {
	text-decoration:	none;
	color:				#000;
}

#bodySidebarDialogue a:hover {
	text-decoration:	underline;
}

#bodySidebarFeatures
{
	background-color: 	#0380b7;
	color:				#fff;
	font-size:			.8em;
	font-weight:		bold;
	height:				9em;
}

#bodySidebarFeatures a:link,
#bodySidebarFeatures a:visited 
{
	color:				#fff;
	text-decoration:	none;
}

#bodySidebarScreenWidgetContainer {
	text-align:center;
}
#bodySidebarScreenWidget {
	width:				209px; 
	height:				104px; 
	margin:				auto;
	display:			block;
}

#bodySidebarSeperator {
	background-image:	url(../images/sidebardivider.gif);
	background-repeat:	no-repeat;
	margin-top:			1em;
	padding-bottom:		1em;
	height:				1px;
}

/**
 * 3.2 Body - Content ============================================================
 */
#bodyContentContainer {
	font-size:			0.8em;
	/**
	 * Since we are scaling the text in this area down to size .8em
	 * our relative em size is changed so our new corrected left margin
	 * is 16em verus 12.8em
	 */
	margin-left:		227px;
	border:				none;
	min-height:			30em;
	padding:			0 1em 1em;
	background-image:	url(../images/contentborder.jpg);
	background-repeat:	no-repeat;
	background-position:top left;
}

#bodyEnrollModule {
	background-image:	url(../images/welcome/money.gif);
	background-repeat:	no-repeat;
	background-position:center right;
	padding:			0.5em;
	padding-left:		1em;
	height: 			11em;
	margin-right:		15em;
}

#bodyEnrollModule h1 {
	font-size:			1.25em;
	margin:				0;
	padding:			.5em 0;
	font-weight:		bold;
}

#bodyQuickLinks {
	float:				right;
	width:				13.5em;
	height:				11.1em;
	border-left:		1px solid #9daab0;
	padding:			0.5em;
	padding-left:		1em;
}

#bodyQuickLinks h1 {
	font-size:			1.25em;
	margin:				0 0 0.5em 0;
	padding:			0.5em 0;
	font-weight:		bold;
}

#bodyQuickLinks a {
	margin-bottom: 		.5em;
	display:			block;
}

#bodyWelcomeFlash {
	border-bottom: 		1px solid #9daab0;
	background-image:	url(../images/welcome/flashdummy.jpg);
	height:				17.58em;
	
}

#bodySubFlash {
	border-bottom:		1px solid #9daab0;
	border-left:		1px solid #9daab0;
	height: 			10.2em;
	margin-left:		12.8em;
	background-color:	#9daab0;
	
	/**
	 * Was getting serious problems trying to format site cross browser...
	 * ended up hacking the layout of the flash on subpages for IE6. 
	 * Wouldn't say it was IE6's fault.  It was actually FF3.  FF3 wasn't
	 * using margins right
	 */
	-margin:			0;
	-float:				right;
}

/**
 * 4. Footer ============================================================
 */
#footerCenterer {
	margin:				auto;
	width:				60em; /* 48em altered due to fontsize reduction */
	font-size:			0.8em;
	text-align:			right;
}

#footerContainer {
	border-top:			1px solid #000;
	background-color:	#fff;
}

#footerMenu {
	margin:				auto; 
	width:				48em;
	height:				5em;
	margin-top:			-5em;
	
}

/**
 * 4.1 Footer - Menu ============================================================
 */
#footerMenu div {
	padding-left:		1em;
	height:				5em;
	width:				15em;
}

#footerMenu h1 {
	font-size:			0.9em;
	margin:				0;
}

#footerMenu ul,
#footerMenu li {
	padding: 			0;
	margin: 			0;
	list-style:			none;
}

#footerMenu li {
	float: 				left;
	width:				7.5em;
}

#footerMenu a:link,
#footerMenu a:visited,
#footerMenu a:active {
	font-size:			0.8em;
	color:				#000;
	text-decoration:	none;
}

#footerMenu a:hover {
	color:				#333;
	text-decoration:	underline;
}

#footerMenuLeft {
	float:				left;
	background-image:	url(../images/upfadedivider.gif);
	background-position: 12em 0.8em;
	background-repeat:	no-repeat;
}

#footerMenuCenter {
	float:				left;
	background-image:	url(../images/upfadedivider.gif);
	background-position: 11em 0.8em;
	background-repeat:	no-repeat;
}

#footerMenuRight {
	float:				right;
}

#footerQuickLinks {
	margin:				0; /* remove default margin from <ul> */
	padding:			0;
	float:				left;
}

#footerQuickLinks li {
	display:			inline;
}