/* ---------------------
	Title: One Pica blank screen stylesheet
	Filename: screen.css
	Author: One Pica Inc, Boston MA
	
	Table of Contents:
		Section Title (Searchstring)			Description
		
		General Styles(=General):				Set font sizes, Page backgrounds, etc
		Master #container Styles(=Master):		Placing, sizing, styling the main container
		Branding Styles(=Branding):				Logos, taglines, branding info
		Navigation Styles(=Nav):				The navigation bar; internal and external
		Content Styles(=Content):				The main content of the page
		Credit/Footer Styles(=Footer):			The footer
		Universal Styles(=Uni):					Classes and elements that apply throughout ('clear', 'blue', etc)
	
	Common Color Table:
		White:								#FFFFFF;
		Background White:						#FFFFFF;
		Shepherd Red:						#FD1B14;
		Light Grey							#A3A3A3;	
		Dark Grey 							#1D1D1D;
	
	Thanks To:
		CSS structure/commenting: 				http://www.huddletogether.com/2006/02/16/practical-web-development-tips/
		Markup Structure:						http://www.stuffandnonsense.co.uk/archives/whats_in_a_name_pt2.html
---------------------- */

/* =General
---------------------- 
	General Styles applied to 'normalize' things
	Notes:
		EM styling generally following (http://www.clagnut.com/blog/348/) from this point 10px=1em, 11px=1.1em, etc
---------------------- */
html {
	padding: 0;
	margin: 0;
	font-size: 100%; /* ensures font consistency across browsers */
}
body {
	font-size: 62.5%; /* correct value for IE6 */
	line-height: 1.5;
	background: #FFFFFF url("../images/backgrounds/bg-main.gif") repeat-x;
	text-align: center;/* fix IE5 bug that doesn't honor margin auto */
	font-family: Tahoma, sans-serif;
	padding: 0px;
	margin: 0px;
}
html > body {
	font-size: 10px; /* correct value for non-IE6 browsers */
}
p {
	margin: 0 0 1em 0;
}

INPUT, SELECT, TH, TD {font-size: 1em}
H1 {font-size: 2em}  /* displayed at 24px */
H2 {font-size: 1.5em}  /* displayed at 18px */
H5 {
	font-size: 1.15em;
	background: url("../images/inline/li-header.jpg") no-repeat 0px;
	margin: 0 1px 0 0 !important;
	margin: 0 15px 0 0;
	padding: 0 0 0 10px;
	font-family: Arial, Helvetica, sans-serif;
	float: left;
	clear: left;
}
H6 {
	font-size: 1.15em;
	margin: 0 0 0 5px;
	padding: 0 0 0 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #4A4A4A;
	float: left;
}

/* =Master
---------------------- 
	Master Container
	Notes:
		margin: 0px auto; centers the container horizontally except in IE5, which is fixed in the body tag
---------------------- */
#container {
	position: relative;
	margin: 0px auto;
	width: 655px;
	font-size: 1.1em; /* displayed at 11px */
	text-align: left; /* unfix all other browsers from the IE fix in the body tag above */
}

/* =Branding
----------------------
	Branding styles: Usually the logo and tagline
	Notes:
		Image replacement: Usually Phark Method (http://www.mezzoblue.com/tests/revised-image-replacement/)
---------------------- */
#branding {
	width: 100%;
	clear: both;
	float: left;
	height: 80px;
	margin-top: 90px;
}
	#branding-logo {
	}
		#branding-logo h1 {
			text-indent: -5000px;
			overflow: hidden;
			background: url("../images/branding/main-logo.gif");
			height: 45px;
			width: 179px;
			float: right;
			margin-right: 10px !important;
			margin-right:6px;
			margin-top:21px;

		}
		.printlogo { 
		position:absolute;
		left:468px;
		top:25px;
		visibility:hidden;
	}

	a#skiplink {
		display: none;
	}
	#branding-tagline {
	}
		#branding-tagline h2 {
			/* uncomment this for Image Replacement
			text-indent: -5000px;
			overflow: hidden;
			background: ;
			height: ;
			*/
			display: none;
		}
	#branding-info {
	}

/* =Nav
----------------------
	Navigation styles
	Notes:
		Navigation belongs in an UL tag with <ul><li><a></a></li></ul> as the markup scheme.
		Keep each of the below #elements as divs, and put the UL inside them
		If there's a Left-Hand navigation, use #nav-section, give it a width & float it left
---------------------- */
#nav-container {
	padding-top:6px;
}
#nav {
	height:230px;
	float: right;
	width: 193px;
	background: #FFFFFF;
	padding-top: 15px;
	background: #FFF;
}
	#nav-main ul { margin: 7px 0 10px 0px !important; margin: 7px 0 10px 25px; }
	#nav-main li {
		font: 12px/22px Arial, sans-serif;
		list-style: none;
		color: #5E5E5E;
		text-decoration: none;	
	}
	#nav-main li a {
		list-style: none;
		color: #5E5E5E;
		text-decoration: none;	
		padding-left: 12px !important;	
		padding-left: 16px;
	}	
	#nav-main li a:hover {
		list-style: none;
		background: url("../images/inline/li-nav.jpg") no-repeat 0px;
		padding-left: 12px !important;
		padding-left: 16px;
		color: #000000;
	}

#nav-main ul {
	background: #FFFFFF;
	height: 100%;
}
/* =Content
----------------------
	Main Content styles
	Notes:
		font-size: 1em makes the text 10px but expandable in IE
		Remember: The font is inherited, so some math will be necessary to size children up or down correctly
---------------------- */
#content {
	font-size: 1em;
	width: 462px;
	float: left;
	clear: none;
	padding-bottom: 0;
}
	#content-main {
		padding: 15px;
		color: #4A4A4A;
	}
		#content-main ul { margin: 0 0 1.5em 10px; padding: 0 0 0 0; }
		#content-main li {
			background: url("../images/inline/li.jpg") no-repeat 0px 7px;
			margin-left: 0px;
			padding-left: 10px;
			list-style: none;
		}
		#content-main li a { text-decoration: none; color: #A3A3A3; }
		#content-main li a:hover { text-decoration: none; color: #000000; }
		#content-main p {
			margin: 0 0 1.5em 10px;
			padding: 0 0 0 0;
			}
		
	#content-news {
	}

/* =Footer
----------------------
	Credit/footer styles: Usually the copyright/company info
	Notes:
---------------------- */
#siteinfo {
}

#tagline {
	width: 462px;
	float: left;
	color:#999999;
	font-size:.9em;
	padding-top: 0px;
	padding-left: 0px;
	padding-right:0px;
	margin-top:0px;
	background:url("../images/branding/tagline.jpg") 0 0 no-repeat;
	border:0px solid white !important;
	border:1px solid white;
}
#tagline .tagline-content {
	padding-left:225px;
	padding-top:45px;
}
#tagline .tagline-content a {
	color:#666666;
	text-decoration:none;
	}
#tagline .tagline-content a:hover {
	}
	
	
#sub-nav {
	display:none;
}
	
/* =Uni
----------------------
	Universal styles: Styles that apply to elements found throughout the site
	Notes:
		The best example of this is the "clear" div
---------------------- */
.clear {
	clear: left;
}

.red { color: #FD1B14; }
.light-grey { color: #A3A3A3; }
.dark-grey { color: 1D1D1D; }