/* ================================================================================

	screen.css
	----------
	Devon Mitton | Mars Hill Group
	v 1.0 | 2009.07.27
	
	====================
	
	Colors:						BG:			Border:
	-------
	Dark Blue:					#103c67		
	Blue:						#336699		

================================================================================ */

/* ===== Import Components ===== */
@import "lib/reset.css";
@import "lib/typography.css";
/*@import "lib/forms.css";*/

/* ===== HTML Base Styles ===== */
html, body												{ height: 100%; }
body													{ background-color: #103c67; min-width: 1000px; }
body.bottom												{ background-color: #fff; }

ul li													{ background: url('img/interface/bg_list_item.png') left 7px no-repeat; }
#primary-content ul li{text-indent:0; padding:0 0 0 15px;}

form dl													{ margin: 0; padding: 0; width: 210px; }
form dl dt,
form dl dd												{ margin: 0 0 5px 0; padding: 0; }
form dt label											{ font-weight: normal; font-size: 1em; }
form dd .text-input										{ width: 200px; }

/* ===== Universal Content Layout Elements ===== */

#container, #utilities, #header, #focus-wrap, #focus,
#focus-bar, #headline-wrap, #headline, #main,
#footer-wrap, #footer									{ float: left; width: 100%; }

#utilities												{ background: url('img/interface/bg_utilities.png') left top repeat-x #ccc; height: 35px; }

#search-form											{ border-right: 1px solid #b4b4b4; padding-top: 5px; padding-right: 10px; position: relative; float: right; height: 25px; width: 195px; }
/*.search-input											{ margin: 0; position: absolute; top: 6px; left: 0; font-size: 9px; padding: 1px; width: 117px; }*/
.search-input											{ margin: 0; border: none; padding: 3px; height: 13px; width: 119px; position: absolute; top: 6px; background: url('img/interface/bg_text_input.png') left top no-repeat; }
.search-submit											{ background: url('img/buttons/bg_search_btn.png') left top no-repeat; position: absolute; right: 10px; top: 5px; border: none; width: 70px; height: 25px; overflow: hidden; text-indent: -9999px; cursor: pointer; }
.search-submit:hover									{ background-position: left bottom; }

#login													{ float: right; position: relative; padding-top: 5px; padding-left: 10px; border-left: 1px solid #d4d4d4; }
#student-login-button									{ width: 102px; height: 25px; overflow: hidden; text-indent: -9999px; background: url('img/buttons/bg_student_login_btn.png') left top no-repeat; display: block; }
#student-logout-button									{ width: 102px; height: 27px; overflow: hidden; text-indent: -9999px; background: url('img/buttons/logout.png') left top no-repeat; display: block; }

#student-login-button:hover								{ background-position: left bottom; }
#student-logout-button:hover							{ background-position: left bottom; }

#header													{ background: #fff; padding-top: 15px; height: 110px; position: relative; z-index: 10; }

#logo													{  }

#programs-navigation									{ position: absolute; top: 0; right: 195px; width: 145px; z-index: 100; }
#organization-navigation								{ position: absolute; top: 0; right: 20px; width: 145px; z-index: 100; }

#focus-wrap												{ background: url('img/interface/bg_focus_wrap.png') left top repeat-x #103c67; height: 313px; }
#focus													{ background: url('img/interface/bg_focus.jpg') center top no-repeat; height: 313px; }
#focus .content											{ padding: 0px; }
#focus-flash											{ height: 313px; position: relative; z-index: 1; }

#focus-bar												{ height: 135px; padding-top: 25px; background: #ccc; border-bottom: 5px solid #2c5882; margin-top: -25px; background: url('img/interface/bg_focus_bar.png') left bottom repeat-x; }
#focus-bar .content										{ height: 135px; }
#focus-bar #program-box									{ float: left; height: 135px; border-right: 1px solid #c3c3c3; border-left: 1px solid #797979; }
#focus-bar .program										{ float: left; height: 115px; width: 160px; padding: 45px 15px 0 145px; position: relative; top: -25px;; }
#focus-bar .program h4									{ color: #26517d; font-family: "Myriad Pro", "MyriadPro", "Myriad", Calibri, Tahoma, sans-serif; font-weight: bold; font-size: 1.6em; margin-bottom: 0.25em; text-shadow: 0px 1px 3px rgba(0,0,0,.5); }
#focus-bar .program p									{ color: #fff; font-family: "Myriad Pro", "MyriadPro", "Myriad", Calibri, Tahoma, sans-serif; line-height: 1em; margin-bottom: 0.25em; text-shadow: 0px 1px 2px rgba(0,0,0,.25); }
#focus-bar .program a									{ display: block; position: absolute; overflow: hidden; text-indent: -9999px; top: 0; left: 0; width: 318px; height: 160px; }

#focus-bar #paramedic									{ background: url('img/interface/bg_paramedic.png') left bottom no-repeat; }
#focus-bar #fire-academy								{ background: url('img/interface/bg_fire_academy.png') left bottom no-repeat; }
#focus-bar #paramedic:hover,
#focus-bar #fire-academy:hover							{ background-position: right bottom; }

#headline-wrap											{ height: 167px; background: url('img/interface/bg_headline_wrap.png') left top repeat-x #103c67; }
#headline												{ height: 167px; background: url('img/interface/bg_headline.jpg') center top no-repeat; }
#headline .content										{ padding-top: 95px; }
#headline h1											{ font-family: "Myriad Pro", "MyriadPro", "Myriad", Calibri, Tahoma; font-size: 36px; color: #fff; text-shadow: 0px 1px 5px rgba(0,0,0,.75); }

#main													{ background: #fff; }
#main .content											{ padding: 40px 20px; } 

#primary-content										{ width: 600px; float: left; }
#secondary-content										{ width: 211px; float: right; padding-right: 109px; }

#footer-wrap											{ background: url('img/interface/bg_footer_wrap.png') left top repeat-x #103c67; height: 211px; }
#footer-wrap.bottom										{ position: absolute; bottom: 0px; left: 0px;}
#footer													{ background: url('img/interface/bg_footer.jpg') center top no-repeat; height: 141px; padding-top: 70px; }

#footer-logo											{ position: absolute; left: 20px; z-index: 1; width: 115px; height: 115px; }
#footer-logo a											{ display: block; width: 115px; height: 115px; overflow: hidden; text-indent: -9999px; background: url('img/interface/bg_footer_logo.png') left top no-repeat; }

#footer #footer-links									{ padding-left: 140px; }

#footer h3												{ color: #fff; }
#footer .links											{ width: 135px; margin-bottom: 0; }
#footer .links li										{ border-top: 1px solid #385e86; }
#footer .links li a										{ color: #fff; }

#footer .vcard											{ color: #fff; font-style: normal; border-top: 1px solid #385e86; margin: 0px; padding: 0px; width: 135px; font-size: 0.8em; padding-top: 5px; line-height: 1.2em; }
#footer .vcard .adr										{ margin-bottom: 1em; }
#footer .vcard .email									{ color: #fff; }

#footer-search-box										{ width: 300px; float: right; padding-left: 20px; }
#footer-search-box h3									{ border-bottom: 1px solid #385e86; padding-bottom: 0.5em; }
#footer-search-form										{ position: relative; width: 205px; }

/* ===== Classed Elements ===== */
/* Container Classes */
.content												{ width: 960px; padding: 0 20px; position: relative; margin: 0 auto; }
.column													{ float: left; margin-right: 30px; }

.image-block											{ padding: 5px 0 10px 240px; position: relative; min-height: 135px; margin-bottom: 1em; }
.image-block:after										{ content: ""; display: block; height: 0; clear: both; }
.image-box												{ width: 191px; min-height: 115px; padding: 10px; background: url('img/interface/bg_image_box.png') left bottom no-repeat; margin-right: 20px; overflow-x: hidden; }
.image-block .image-box									{ float: left; position: relative; top: -5px; margin-left: -240px; }

.preamble												{ padding: 5px 240px 10px 0; position: relative; min-height: 135px; margin-bottom: 1em; }
.preamble:after											{ content: ""; display: block; height: 0; clear: both; }
.preamble .preamble-image								{ float: right; margin-right: -240px; position: relative; top: -5px; }
.preamble p												{ color: #336699; font-size: 1.3em; font-family: "Myriad Pro", "MyriadPro", "Myriad", Tahoma, Verdana, "sans-serif"; }

.section												{ margin-bottom: 3em; }
.border 												{ border-bottom: 1px solid #ccc; }
.section:after											{ content: ""; display: block; height: 0; clear: both; }

.buttons												{ text-align: right; padding-top: 1em; width: 210px; margin-bottom: 1em; }
/* Component Classes */
.links													{ list-style: none; margin: 0 0 20px 0; padding: 0; font-size: .9em; line-height: 1em; }
.links li												{ border-top: 1px solid #e5e5e5; background: none; text-indent: 0px; }
.links li.active										{ background: #e5e5e5; text-indent: 1em; }
.links li.activeSec										{ text-indent: 1em; display: block; padding: 4px 0px; text-decoration: none; }
.links li a												{ display: block; padding: 4px 0px; color: #336699; text-decoration: none; }
.links li a:hover										{ text-decoration: underline; }
.links li a:active										{ color: #222; }

.button													{ width: 70px; height: 25px; background: transparent left top no-repeat; border: none; overflow: hidden; text-indent: -199px; cursor: pointer; }
a.button												{ display: block; }
.button:hover											{ background-position: left bottom; }
.submit-btn												{ background-image: url('img/buttons/bg_login_btn.jpg'); }
.signup-btn												{ background-image: url('img/buttons/bg_sign_up_btn.jpg'); }
.large													{ width: 210px; height: 35px; }

.start-your-new-career									{ background-image: url('img/buttons/bg_start_your_new_career_btn.jpg'); }
.view-course-materials									{ background-image: url('img/buttons/bg_view_course_materials_btn.jpg'); }
.view-current-grades									{ background-image: url('img/buttons/bg_view_current_grades_btn.jpg'); }

/* Component Ammendments */


/* Utility Classes */
.clear 													{ clear: both; }
.left													{ float: left; }

.description											{ color: #336699; font-size: .9em; }

/* ===== Debugging Information ===== */
.outline, .outline *									{ outline: 1px dotted #ccc; }

/*@import "lib/debug.css";*/


h1 {
	font-size:26px;
	color:#333333;
	font-family:Georgia, "Times New Roman", Times, serif;
}

h2 {
	font-size:18px;
	color:#336699;
	font-family:Georgia, "Times New Roman", Times, serif;
}