/***************************************************************

main.css: page structure, background colors & images, etc.
Jeremy Tarpley
5/2/2008


border: 0f4f5e
bg: 9fc2cb
green 799628 498b00
footer: d1d1d1
header bg: c8c8c8
h text: 275f87
link 325800
text 090909
nav links 515151
lucida grande

***************************************************************/
html {
	background: #0A6286 url('/media/images/secondary-bg-pattern.jpg') repeat-x 0% 0%;
}
html#homepage {
	background: #0A6286 url('/media/images/homepg-bg-pattern.jpg') repeat-x 0% 0%;
}

body {
	background: transparent;
	font-family: "Lucida Grande", Trebuchet, Tahoma, Verdana, arial, sans-serif;
	font-style: normal;
	text-align: center;
	color: #1C202D;
	margin: 0;
	padding: 0;
	text-align: left;
	min-width: 870px;
}

#header, #breadcrumbs, #footer {
	padding: 0;
}

h1 {
	font-family: "Lucida Grande", Trebuchet, Tahoma, Verdana, arial, sans-serif;
	font-size: 19px;
	letter-spacing: .5pt;
}

label { 
	cursor: default;
}

/*
 * footerstickalt technique by Cameron Adams and Craig Erskine
 * avalible at http://www.themaninblue.com/writing/perspective/2005/08/29/
 */
html, body, * html #wrapper {
}

#wrapper {
	position: relative;
}

#footer {
	position: relative;
}

#homepage #footer {
}

hr {
	border: 0px none;
	background-color: #5DB2D4;
	height: 2px;
}

ul, ol {
	padding:0pt 0pt 18px 10px;
	margin-left: 0;
}


textarea {
	overflow: auto;	
}


/****************************************************************
  Header
****************************************************************/
#header {
	background: #2698C8 url('/media/images/header_bg.png') repeat-x 0% 0%;
	height: 126px;
	margin: 0;
	padding: 47px 0 0 0;
	font-size: 11px;
	position: relative;
	z-index: 99;
	width: 100%;
	display: block;
}

#homepage #header {
	height: 96px;
}

#header_wrapper {
	width: 660px;
	margin: 0 auto;
}

#header, #header a, #header a:visited, #header a:active {
	color: #fff;
}

#site_logo a { 
	background: url('/media/images/logo.jpg') no-repeat 0% 0%;
	height: 91px;
	width: 560px;
	float: left;
	margin: 0;
	position: relative;
	left: -53px;
}

#user-actions ul{
	padding-top: 15px;
}


/***************************************************************
  Stats in header
***************************************************************/
#header_stats {
	font-size: 9px;
	background-color: #d7d7d7;
	color: #515151;
	display: block;
	width: 260px;
	float: right;
	position: relative;
	top: -100px;
	z-index: 4;
	clear: both;
	margin-right: 10px;
}

#header_stats .header_stats_box a {
	color: #515151;
}

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

#header #header_stats_text a {
	color: #498B00;
	font-weight: bold;
}

#header #header_stats_title, #header #header_stats_title a {
	font-size: 10px;
	color: #498B00;
	font-weight: bold;
}

#header_stats_text {
	display: block;
	width: 130px;
	margin: 8px 5px 5px 10px;
	float: left;
	line-height: 13px;
}

#header_stats .header_stats_box {
	display: block;
	width: 52px;
	margin-top: 6px;
	background-color: #c2c2c2;
	float: left;
	text-align: center;
}

#header_stats_date {
	height: 37px;
	padding: 5px 0 10px 0;
	margin-right: 5px;
	font-size: 16px;
}

#header_stats_temp {
	height: 32px;
	padding: 12px 0 8px 0;
	margin-right: 0;
	font-size: 21px;
}

#header_stats_temp sup {
	font-size: 10px;
	position: relative;
	top: -13px;
}


/***************************************************************
  Breadcrumbs below the header
***************************************************************/
#homepage #breadcrumbs {
	display: none;	
}

#breadcrumbs {
	background: transparent;
	height: 18px;
	color: #fff;
	margin: 0;
	padding: 0;
	float: left;
	position: relative;
	top: 115px;
	left: 155px;
	z-index: 2;
}

#breadcrumbs a, #breadcrumbs a:visited, #breadcrumbs a:active {
	font-size: 10px;
	color: #fff;
	letter-spacing: .5pt;
	padding: 0 8px;
}

#breadcrumbs a:hover {
	background-color: #43616f;
}

#breadcrumbs ul {
	list-style-type: none;
	margin: 0;
	padding: 2px 0 0 0;
}

#breadcrumbs li {
	display: inline;
	margin: 0px;
}



/***************************************************************
  wrapper div around navigation and content, 
  creates a continuous background so they appear 
  to be the same height
***************************************************************/
#wrapper {
	background: transparent url('/media/images/wrapper_bg.png') repeat-y 0 0;
	margin: 0 auto;
	padding: 0;
	display: block;
	width: 660px;
}


/***************************************************************
  Navigation on right side of page
***************************************************************/
#navigation {
	width: 130px;
	float: left;
	margin: 0;
	padding: 0px 5px 20px 0;
	font-size: 11px;
	position: relative;
	z-index: 2;
	height: 100%;
}

#homepage #navigation {
	padding: 25px 5px 0 0;
	min-height: 590px;
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;	
}

#navigation h1 {
	text-align: right;
	color: #B7F878;
	padding-bottom: 10px;
}

#navigation ul {
	padding: 0;
}

#navigation li {
	margin: 0;
	padding: 0;
}

#navigation li a {
	display: block;
	margin: 2px 0 0 0;
	padding: 0 0 0 14px;
	background: transparent;
	height: 22px;
	width: 120px;
	line-height: 22px;
}

#navigation, #navigation a, #navigation a:visited, #navigation a:active {
	color: #fff;
}

#navigation a:hover {
	background: transparent url('/media/images/wrapper_bg.png') repeat 0 0;
}


#navigation .nav_header a {
	color: #B7F878;
	font-weight: bold;
}

#navigation .current a {
	background: transparent url('/media/images/wrapper_bg.png') repeat 0 0;
}

#navigation .subnav li {
	margin: 0 0 0 40px;
	padding: 0;
}

#nav_global, #nav_course_info, #nav_about_us, .nav_bottom_link {
}
#nav_global{
	margin-top: 10px;
}
#nav_course_info {
	margin-top: 20px;
}
#nav_student_info {
	margin-top: 30px;
}
#nav_about_us {
	margin-top: 30px;
}
.nav_bottom_link {
	margin-top:10px;
}


.sponsors img {
	display: block;
	margin: 10px auto;
}

#navigation ul.sponsors a:hover {
	background-color: transparent;
}

/***************************************************************
  Page Content
***************************************************************/

#content {
	display: block;
	float: left;
	margin: 10px 0 0 20px;
	width: 470px;
	padding: 0 15px 20px 20px;
	font-size: 12px;
	line-height: 150%;
	min-height: 300px;
}

#homepage #content {
	margin: 0 0 0 20px;
	min-height: 550px;
	padding: 0 0px 0px 0px;
	width: 480px;
}

#header_img {
	margin: 0 0 0 -180px;
	z-index: 1;
}

#content p, #content h1, #content ul  {
	margin-left: 10px;
	margin-right: 15px;
	position: relative;
	z-index: 1;
}

#content h1, #content h2, #content  h3, #content  h4, #content  h5, #content  h6 {
	font-weight: bold;
	letter-spacing: 1px;
	font-family: Helvetica;
	margin: 8px 0;
	padding: 8px 15px 5px 0px;
}

#content h1 {
	border-bottom: 3px solid #5DB2D4;
	margin: 15px 0;
	font-size: 26px;
	color: #1C202D;
	padding: 8px 15px 0px 0px;
}

#content h2 {
	font-size: 14px;	
}

#content a, #content a:visited, #content a:active {
	color: #fff;
	border-bottom: 1px dotted #70D6FF;
}

#content a:hover {
	border-bottom: 1px dotted #ccc;
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;
}

#content li {
	margin: 5px 0 15px 0;
}

.img_float_left {
	float: left; 
	margin: -5px 25px 0 -10px; /*negative margins to account for 30deg drop shadow on images in content*/
}

#homepage #left_box {
	margin-left: 30px;
}

#homepage .homepg_featured_links {
	display:block;
	float: left;
	width: 210px;
	margin: 20px 10px 0px 10px;
	font-weight: bold;
	font-size: 11px;
	min-height: 185px;
	background: #4b8ba6;
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;
}

#homepage .homepg_featured_links h2 {
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 1px;
	font-family: Helvetica;
	color: #B7F878 !important;
	margin: 0;
	padding: 11px 12px 9px 10px;
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;
}

#content .homepg_featured_links ul {
	margin-left: 0;
	margin-right: 0;
	padding: 5px 0 10px 10px;
	position: static;	
}

#homepg_site_description {
	margin-top: 20px
}

input, textarea, select {
	color: #fff;
	padding: 3px 10px;
	margin: 0 10px 5px 0;
}

#id_portrait, .form_button_td input, .field input, .field textarea, .field select,
.webForm input, .webform textarea {
	background-color: #3c3e40;
	border: none;
}

.field #id_portrait {
	color: #000;
}

#wrapper .submitButton,
#wrapper a.submitButton,
#wrapper a.submitButton:hover,
#wrapper a.submitButton:visited,
#wrapper a.submitButton:active,
#footer .submitButton,
input.submitButton {
	background: transparent url('/media/images/button_bg.gif') repeat 0 0;
	border: 1px solid #fff;
	color: #222;
	font-weight: bold;
	cursor:pointer !important;
	padding: 3px 10px;
	font-size: 11px;
	line-height: 150%;
}

.login_pg_button {
	float: right;
}

.form_button_td {
	width: 100%;
}

.form_button_td input.submitButton {
	float: left;
	position: relative;
	right: 0;
}

.content_button {
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;
	padding: 2px;
}


#id_status {
	width: 100px;
}

#courses .course, #cases .case {
	margin: 20px 0;
}

#wrapper table#simple_form ul.errorlist li {
	background-color: #bae1f1;
	padding: 0 8px;
}

.messages {
	margin: 20px 0 10px 0;
}

.message {
	padding: 10px;
}

.messages .success {
	border: 1px solid #B7F878;
	background-color: #e2f7ce;
}

#search-cases {
	display: block;
	padding: 5px 10px 20px 10px;
	margin: 0 10px 0 0;
	background: transparent url('/media/images/tranparent_bg.png') repeat 0 0;
}

#search-cases h2 {
	margin: 0;
}

#search-cases label {
	display: block;	
}

#search-cases p {
	margin: 0;
}

#search-cases .field {
	clear: both;
}

#search-cases .submitButton {
	position: relative;
	left: 220px;
	margin: 0;
}

div.staff {
	border: 1px solid #2C7897;
	margin: 10px;
	padding: 10px 15px;
	height: 160px;
}

div.staff img {
	height: 150px;
	width: 180px;
	padding: 2px;
	border: 1px solid #fff;
}

/***************************************************************
  Pagination
***************************************************************/
#content .paging
{
	font-weight: bold;
	font-family: Helvetica;
	width: 100%;
	text-align: center;
	margin-top: 12px;
}

#content .paging .current_paging_information
{
	font-size: 14px;
}

#content .paging .paging_navigation
{
	font-size: 12px;
}



/***************************************************************
  Page Footer
***************************************************************/
#footer {
	background-color: #2C5164;
	clear: left;
	height: 215px;
	font-size: 11px;
	color: #676767;
}

#footer_content {
	width: 420px;
	margin: 0 auto 0 auto;
	padding: 10px 0;
	position: relative;
	left: 70px;
}

#footer, .footer_links, .copyright {
	position: relative;
	z-index: 1;
}

#footer .copyright {
	padding-top: 15px;
}

#footer a, #footer a:visited #footer a:active {
	color: #498b00;
}

#footer a:hover {
	color: #498b00;
	text-decoration: underline;
}

#footer h2 {
	margin-bottom: 12px;
	padding: 0;
	color: #fff;
}

#footer p {	
	clear: left;
	padding: 0;
	margin: 0 0 0 10px;
}

.footer_links {
	float: left;
	width: 270px;
}

.footer_links ul { 
	margin: 0 50px 15px 0;
	padding: 0;
	list-style: none;
}

.footer_links li {
	line-height: 150%;
}

.footer_links a:hover {
	color: #498b00;
	text-decoration: underline;
}

.footer_links input, .footer_links textarea {
	background-color: #4A6A7A;
	border: none;
	color: #fff;
	padding: 3px 10px;
	margin: 0 10px 5px 0;
}

/*tooltips*/
.tooltip {
	position: absolute;
	top: 780px;
	left: 593px;
	z-index: 3;
	display: block;
	background-color: #43A6CE;
	color: #fff;
	font-size: 11px;
	font-weight: normal;
	padding: 5px;
}


li#form_comments {
	float: left;
	position: relative;
	width: 150px;
	height: 50px;
	top: -50px;
	left: 150px;
}

li#form_comments textarea#id_comments {
}

#contact_form li.buttons {
	margin: 50px 0 0 345px;
}

#contact_form li.buttons input{
	margin: 0;
	cursor: pointer !important;
}

 
.copyright {
	color: #197EAA; 
	font-size: 9px;
	margin-top: 15px;	
}



/***************************************************************
  Misc
***************************************************************/
.clear {clear: both;}
.float_right { float: right; }
.float_left { float: left; }
.center { text-align: center; }
.small { font-size: 9px; }
