/* ---------------------
	Title: eScription - Main screen stylesheet
	Filename: screen.css
	Author: One Pica Inc, Boston MA
	
	Table of Contents:
		Searchstring (Section Name)				Description
		
		=General (General Styles):				Set font sizes, Page backgrounds, link behaviors, etc
		=Master (Master #container Styles):		Placing, sizing, styling the main container
		=Branding (Branding Styles):			Logos, taglines, branding info
		=Nav (Navigation Styles):				The navigation bar; internal and external
		=Forms (Form Styles)					Set appearance of forms, inputs, buttons, etc
		=Multicol (Multi-Column Styles):		The cases where the content needs to be in multiple columns
		=Content (Content Styles):				The main content of the page
		...Further style sections go here...
		=Footer (Credit/Footer Styles):			The footer
		=Uni (Universal Styles):				Classes and elements that apply throughout ('clear', 'blue', etc)
	
	Common Color Table:
		Main Message Left Purple: 				#2244A1;
		Main Message Right Turquoise: 			#0AC8F7;
		Nav Bar BG Blue: 						#6696CC;
		Main Nav Hilitebar Turquoise: 			#DEFAF9;
		eScription Logo Blue: 					#0068B3;
		Sidebar Medium Grey: 					#BBBBBB;
		Sidebar Login Grey: 					#A3A3A3;
		Sidebar Subnav BG Grey: 				#999999;
		Footer BG Blue: 						#84ACD9;
		Subpg Photo BG Blue: 					#A2D3FA;
		Main Button Green: 						#00A354;
		Page Title Dark Blue: 					#1F5899;
		Hyperlink Bright Blue: 					#0073F5;
	
	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
		Stylesheet searchstring flags: http://www.stopdesign.com/log/2005/05/03/css-tip-flags.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
		100.01% font size from (http://www.communitymx.com/content/article.cfm?page=5&cid=FAF76)
		Beginning "global reset" styles, to clear troublesome browser defaults, 
		are based on (http://meyerweb.com/eric/thoughts/2007/04/14/reworked-reset/) 
		Note that most form elements are omitted; style those separately, further down.
---------------------- */
html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
}
a img, :link img, :visited img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ol, ul {
	list-style: none;
}

/* Begin Actual Site Styles
----------------------------- */
html {
	font-size: 100.01%; /* Ensures font consistency across browsers */
	height: 100%; /* Footer-stick */
}
body {
	font-size: 10px; /* Sets base font-size for browsers that resize text correctly */
	line-height: 1.5; /* Sets base leading for lines of text */
	background-color: #fff;
	font-family: xCalibri, "Bitstream Vera Sans", "Lucida Grande", "xLucida Sans", Arial, sans-serif;
	height: 100%; /* Footer-stick */
	background: #ccc;
	text-align: center;
}
p {margin-bottom: 1em; line-height: 1.5}
div {line-height: 1.5}

input, select, th, td {font-size: 1em}

h1 {font-size: 2em} /* 24px */
h2 {font-size: 1.5em} /* 18px */
h3 {font-size: 1.25em} /* 15px */
h4 {font-size: 1em} /* 12px */
h5 {font-size: 1em} /* 12px */
h6 {font-size: 1em} /* 12px */

strong {font-weight: bold}
em {font-style: italic}
sup {font-size: 50%; vertical-align: super;}

/* Basic link styles */
a, a:link {
	color: #0073F5;
	text-decoration: underline;
}
a:visited {
	color: #666;
}
a:hover, a:active {
	color: #00A354;
	text-decoration: underline;
}
a:focus {
	outline: none; /* Removes dotted outline in Firefox */
}

/* =Master
---------------------- 
	Master Container
	Notes:
		margin: 0px auto; centers the container horizontally except in IE5, which is fixed in the body tag
		"Footer-stick" thanks to: http://www.themaninblue.com/writing/perspective/2005/08/29/
---------------------- */
#container {
	background: #fff url(../img/ctr_bg_215.gif) 0 0 repeat-y;
	width: 770px;
	font-size: 1.2em; /* 12px (based on value from body) */
	text-align: left; /* Normalize alignment; unfix all browsers from fix in IE stylesheet */
	position: relative; /* Footer-stick */
	height: auto !important; /* Footer-stick */
	height: 100%; /* Footer-stick */
	min-height: 100%; /* Footer-stick */
	margin: 0 auto;
}

/* Skip link: This is the very first link anywhere on the page; by tabbing to it or hitting accesskey 2, a user can skip the header/navigation of a page and go directly to the page content. It is normally 'hidden' by being positioned far, far off the page; bringing it into focus with Tab makes it visible. */
	#skiplink a {
		position: absolute;
		top: -1000px;
		left: -2000px;
	}
		#skiplink a:focus, #skiplink a:active {
			position: absolute;
			margin: 0;
			top: 0;
			left: 0;
			display: block;
			padding: 0;
			background: #000;
			color: #fff;
			font-weight: bold;
		}
		#skiplink a:hover { 
		}

/* =Branding
----------------------
	Branding styles: Usually the logo and tagline
	Notes:
		Image replacement: Usually Phark Method (http://www.mezzoblue.com/tests/revised-image-replacement/)
---------------------- */
#branding-outer {
	background: #fff;
}
#home #branding-outer {
	background: #fff url(../img/branding_bg_home.jpg) 50% 0 no-repeat;
}
	#branding {
		position: relative;
		margin: 0px auto;
		width: 740px;
		padding: 0 5px 10px 5px;
	}
		#branding-logo {
			cursor: pointer;
			width: 187px;
			height: 49px; /* Set dimensions once here, and use 100% for all dimensions in both rules below */
			padding: 20px 0 0 0;
		}
			#branding-logo h1 {
				text-indent: -5000px;
				overflow: hidden;
				background: transparent url(../img/nuance_logo.gif) 0 0 no-repeat;
				width: 100%;
				height: 100%;
				line-height: 1;
			}
				#branding-logo h1 a {
					display: block;
					width: 100%;
					height: 100%;
				}
		#branding-tagline {
			width: 210px;
			height: 31px; /* See branding-logo above */
			position: absolute;
			top: 35px;
			left: 160px;
		}
			#branding-tagline h2 {
				text-indent: -5000px;
				overflow: hidden;
				background: transparent url(../img/escription_tagline.gif) 0 0 no-repeat;
				width: 100%;
				height: 100%;
				line-height: 1;
				padding: 0;
				margin: 0;
			}
		#branding-info {
			background: #6696CC url(../img/branding-info_bg2_home.gif) 50% 0 no-repeat;
			height: 184px;
		}
			#branding-info-inner {
				background: transparent url(../img/branding-info_bg1_home.jpg) 50% 0 no-repeat;
				height: 184px;
			}

/* =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 {
	border-top: solid 1px #0DA07C;
	background: #2753AC url(../img/nav_bg_tl_2000.gif) 50% 0 repeat-y;
	padding-top: 9px;
}
#home #nav {
	border-top: none;
	background: transparent;
	padding-top: 0px;
}
	#nav-main-outer {
		border-top: solid 1px #2A3A8C;
		background: #6696CC;
		border-bottom: solid 1px #DEFAF9;
	}
		#nav-main {
			margin: 0px auto;
			width: 740px;
			padding: 0 5px;
			background: #6696CC;
		}
			#nav-main ul {
				list-style: none outside;
				margin: 0;
				padding: 0 15px;
			}
				#nav-main ul li {
					float: left;
					display: inline;
					padding: 0 25px 0 0;
					background: #6696CC;
				}
					#nav-main ul li a {
						display: block;
						padding: 9px 1px;
						font-weight: bold;
						line-height: 1;
						text-transform: uppercase;
						color: #DAE3F0;
						height: 9px;
						text-indent: -5000px;
						overflow: hidden;
					}
					#nav-main ul li a, #nav-main ul li a:link, #nav-main ul li a:visited {
						color: #DAE3F0;
						text-decoration: none;
					}
					
					.nav-home a {
						width: 29px;
						background: transparent url(../img/nav_home.gif) 1px 0 no-repeat;
					}
					.nav-products a {
						width: 53px;
						background: transparent url(../img/nav_products.gif) 1px 0 no-repeat;
					}
					.nav-services a {
						width: 49px;
						background: transparent url(../img/nav_services.gif) 1px 0 no-repeat;
					}
					.nav-csuccesses a {
						width: 117px;
						background: transparent url(../img/nav_csuccesses.gif) 1px 0 no-repeat;
					}
					.nav-newsevents a {
						width: 82px;
						background: transparent url(../img/nav_newsevents.gif) 1px 0 no-repeat;
					}
					.nav-careers a {
						width: 45px;
						background: transparent url(../img/nav_careers.gif) 1px 0 no-repeat;
					}
					.nav-aboutus a {
						width: 50px;
						background: transparent url(../img/nav_aboutus.gif) 1px 0 no-repeat;
					}
					.nav-contact a {
						width: 62px;
						background: transparent url(../img/nav_contact.gif) 1px 0 no-repeat;
					}
					#nav-main ul li a:hover, #nav-main ul li a:active, #nav-main ul li a.current, #nav-main ul li a.current:hover, #nav-main ul li a.current:active {
						background-position: 1px -27px;
					} 
					
					#nav-main ul li a:hover, #nav-main ul li a:active {
						color: #fff;
						text-decoration: none;
						padding: 9px 1px 6px;
						border-bottom: solid 3px #8BB6D6;
					}
					#nav-main ul li a.current, #nav-main ul li a.current:link, #nav-main ul li a.current:visited, #nav-main ul li a.current:hover, #nav-main ul li a.current:active {
						padding: 9px 1px 6px;
						border-bottom: solid 3px #DEFAF9;
						color: #fff;
					}
					
	/* Left column subnav */
	#nav-section {
		border-top: solid 7px #828282;
		background: #999;
		margin: 0 0 0 0;
	}
		#nav-section ul {
			width: 190px;
			float: right;
			display: inline;
			padding: 10px 0 23px 10px;
			list-style: none outside;
		}
			#nav-section ul li {
				border-bottom: solid 1px #BFBCB8;
			}
				#nav-section ul li a {
					display: block;
					padding: 6px 0 4px;
					line-height: 16px;
					margin: 0;
				}
				#nav-section ul li a span {
				}
				#nav-section ul li a, #nav-section ul li a:link, #nav-section ul li a:visited {
					color: #DFE7F0;
					text-decoration: none;
				}
				#nav-section ul li a:hover, #nav-section ul li a:active {
					color: #fff;
					text-decoration: none;
					padding: 6px 0 4px;
				}
				#nav-section ul li a:hover span, #nav-section ul li a:active span {
					padding-bottom: 2px;
					padding-right: 1px;
					border-bottom: solid 3px #ACABA9;
				}
				#nav-section ul li a.current {
					color: #fff;
					font-weight: bold;
					padding: 6px 0 5px;
				}
				#nav-section ul li a.current span {
					padding-bottom: 3px;
					padding-right: 1px;
					border-bottom: solid 3px #BFBCB8;
				}
				/* For links with long names */
				#nav-section ul li.longname a span {
					display: block;
					line-height: 16px;
				}
				#nav-section ul li.longname a:hover, #nav-section ul li.longname a:active {
					color: #fff;
					text-decoration: none;
					padding: 6px 0 0px;
				}
				#nav-section ul li.longname a:hover span, #nav-section ul li.longname a:active span {
					padding-bottom: 1px;
					padding-right: 1px;
					border-bottom: solid 3px #ACABA9;
				}
				#nav-section ul li.longname a.current {
					color: #fff;
					font-weight: bold;
					padding: 6px 0 0px;
				}
				#nav-section ul li.longname a.current span {
					padding-bottom: 2px;
					padding-right: 1px;
					border-bottom: solid 3px #BFBCB8;
				}
				
				/* For links that have 3rd-level children, i.e. eScription Experience */
				#nav-section ul li.haschildren {
					border-bottom: none;
				}
					#nav-section ul li.haschildren a, #nav-section ul li.haschildren a:link, #nav-section ul li.haschildren a:visited {
					}
					#nav-section ul li.haschildren a:hover, #nav-section ul li.haschildren a:active {
					}
						#nav-section ul li.haschildren a span {
						}
							#nav-section ul li.haschildren ul {
								width: 180px;
								float: right;
								display: inline;
								padding: 0px 0 6px 10px;
								margin: 0 0 0 10px;
								list-style: none outside;
								background: transparent;
								border-top: solid 1px #BFBCB8;
								font-size: 0.92em;
							}
								#nav-section ul li.haschildren ul li {
									border-bottom: solid 1px #B3AFAB;
									margin: 0 0 0 10px;
								}
									#nav-section ul li.haschildren ul li a {
									}

/* =Forms
----------------------
	Form styles
	Notes:
		A <p></p> should always enclose every label-input (or label-select) pair.
		Widths are in % to start, so that they scale, but they are the attributes most likely to change.
		Remember -- the IE stylesheet has different percentage widths to start.
---------------------- */
form {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
}
	fieldset {
		border: 0px solid;
		padding: 0;
		margin: 0 0 1.4em 0;
	}
	form p {
		display: block;
		clear: both;
		margin: 0 0 0.4em 0;
		padding: 0;	
	}
		form label {
			display: inline;
			float: left;
			width: 35%;
			padding: 0 5% 0 0;
			margin: 0;
			line-height: 1.6;
		}
		form input, form select, form textarea {
		   margin: 0;
		   padding: 0;
		   width: 59.2%; /* CLOSE to full width; use pixels for the real thing */
		   font-size: 1em;
		   border: solid 1px #999;
		   border-bottom-color: #ccc;
		   background-color: #fff;
		   font-family: Arial, sans-serif;
		}
		form input {height: 1.3em}
		form select {width: 59.5%; height: 1.5em}  /* Selects are not the same as inputs */
		form textarea {height: 6em}
		
		/* Radio buttons */
		form input.radio, form input.radiobtn {
			text-align: left;
			width: 1.3em;
			margin: 0.3em 0.2em 0 0;
			padding: 0;
			border: none;
			background: none;
		}
		form .radiotext {
			margin: 0 1em 0 0;
		}
		
		/* Check boxes */
		form input.ckbx, form input.checkbox {
			text-align: left;
			width: 1.2em;
			margin: 0.3em 0.2em 0 0;
			padding: 0;
			border: none;
			background: none;
		}
		
	form p.indent { /* For buttons or text that need to align with inputs/selects */
		margin-left: 40%;
	}
	form p.xspa { /* "extra space after" */
		margin-bottom: 2.0em;
	}
	form .req, form .required {
		color: red;
	}
	form input:focus {
		/* however we want the focused field to look */
	}
	form input.submit, button { /* There are lots of default values to fix */
		border: 3px double #999;
		border-top-color: #ccc;
		border-left-color: #ccc;
		padding: 1px 2px;
		background: #f6f6f6;
		color: #555;
		font-size: 0.9em;
		font-weight: bold;
		height: auto;
		width: auto;
		cursor: pointer;
		font-family: inherit;
	}
	form input.submit:hover, button:hover { /* IE6 can't see these, too bad */
		color: #fff;
		background-color: #6696CC;
	}
	form input.submit:active, button:active { /* Button 'feedback' behavior */
		border: 3px double #ccc;
		border-top-color: #999;
		border-left-color: #999;
	}
	form button.noborder, form button.noborder:hover, form button.noborder:active {
		border: none !important;
	}
	
	/* Specific Form Styles */
	.content-form {
		border: solid 1px #ddd;
		padding: 20px;
		width: 88%;
	}
	.content-form textarea {height: 9em}
	.content-form p.indent {
		margin-left: 34%;
	}
	.content-form .longcheck {
		clear: both;
		padding: 0 0 0.8em 0;
	}
		.content-form .longcheck label {
			float: right;
			width: 88%;
		}
		.content-form .longcheck input {
			float: left;
		}
	
	.content-form .btn-outer {
		float: left;
		display: inline;
		margin-right: 5%;
		clear: none;
		width: auto;
		background: #00A354 url(../img/btn_main_g_tl.gif) 0 0 no-repeat;
		padding: 0;
		border: none !important;
	}
		.content-form .btn-outer span {
			display: block;
			background: transparent url(../img/btn_main_g_tr.gif) top right no-repeat;
			padding: 0;
		}
			.content-form .btn-outer span span {
				display: block;
				background: transparent url(../img/btn_main_g_bl.gif) bottom left no-repeat;
				padding: 0;
			}
					.content-form button {
						background: transparent url(../img/btn_main_g_br.gif) bottom right no-repeat;
						font-weight: bold;
						color: #fff;
						font-size: 1.1em;
						padding: 2px 7px 3px;
						width: auto;
						line-height: 1 !important;
						overflow: visible;
						border: none !important;
					}
	.content-form .btn-2 {
		background: #999 url(../img/btn_main_2_tl.gif) 0 0 no-repeat;
		margin-left: 7%;
	}
		.content-form .btn-2 span {
			background: transparent url(../img/btn_main_2_tr.gif) top right no-repeat;
		}
			.content-form .btn-2 span span {
				background: transparent url(../img/btn_main_2_bl.gif) bottom left no-repeat;
			}
					.content-form .btn-2 button {
						background: transparent url(../img/btn_main_2_br.gif) bottom right no-repeat;
					}
	.content-form button:hover, .content-form button:active {
		color: #fff;
	}
	#content ul.less-space li {
		margin-bottom: 0.3em;
	}
	
	/* eScription University */
	#regForm {
		padding: 0;
		width: 88%;
		border: none;
	}
		.form-section {
			padding: 7px 15px 10px;
			border: solid 1px #ccc;
			margin: 0 0 1.5em 0;
		}
		.courseheader {
			padding: 0 0 0.2em 0;
			border-bottom: solid 1px #999;
			margin: 0;
		}
		.coursetitle {
			font-size: 1.2em;
			font-weight: bold;
		}
		.coursedesc {
			background: #eee;
			font-size: 0.92em;
			padding: 7px 14px;
			border-bottom: solid 1px #999;
			margin: 0;
		}
		.shortdesc {
			padding-top: 0.3em;
			padding-bottom: 0.4em;
			border-bottom: solid 1px #ddd;
			margin: 0;
		}
		.timeinfo {
			padding-top: 0.5em;
			border-bottom: solid 1px #ddd;
			padding-bottom: 0.5em;
			margin: 0;
			font-weight: bold;
			color: #4C74A2;
		}
		.form-callout {
			margin-bottom: 1.0em;
			background: #ffff99;
			padding: 0.3em 0.9em;
			font-weight: bold;
		}
		.checkrow {
			padding: 3px 10px 4px;
			border-bottom: solid 1px #ddd;
			margin: 0 0;
			clear: both;
		}
			#regForm .checkrow label {
				float: right;
				display: inline;
				width: 88%;
			}
			#regForm .multiline-radio {
				clear: both;
				padding: 0.5em 0 1.5em;
			}
			#regForm .radiotext {
				float: right;
				display: inline;
				width: 84%;
			}
	
/* =Multicol
----------------------
	Multi-Column Content styles
	Notes:
		These columns should be used for text within #content.
		Values are in percentages to start off -- remember that the IE stylesheet has different values.
		If you need "pixel-perfect", you'll have to stop using percentages and use actual pixels
---------------------- */
.twoColumnLayout {
	width: 47%;
	float: left;
	clear: none;
}
	.twoColumnLeft {
		margin-right: 5%;
	}
.threeColumnLayout {
	width: 30%;
	float: left;
	clear: none;
}
	.threeColumnLeft {
		margin-right: 4%;
	}
	.threeColumnMiddle {
		margin-right: 4%;
	}
	.threeColumnRight {
		margin-right: 0;
	}

/* =Content
----------------------
	Main Content styles
	Notes:
		
		Font-size is inherited, so some math will be necessary to size child elements up or down correctly
---------------------- */
#content {
	font-size: 1em; /* Inherits 12px from #container */
	padding-bottom: 48px;
}

/* Main Content Area
------------------------- */
#content-main {
	float: left;
	display: inline;
	width: 555px;
	background: transparent;
	border-top: solid 7px #DBDFE7;
	padding-bottom: 2em;
}

/* Headings */
#content-main h4 { /* Case Study Titles */
	xtext-transform: uppercase;
	xletter-spacing: 0.03em;
	font-weight: normal;
	font-size: 1.75em;
	line-height: 1.4;
	xcolor: #004799;
	color: #777;
	padding: 0;
	margin: 0 0 0em 0;
}
#content-main h5 { /* Subheadings for main content */
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: bold;
	color: #004799;
	padding: 0;
	margin: 0 0 0.8em 0;
	line-height: 1.4;
}
#content-main h6 { /* Sub-subheadings for main content */
	font-weight: bold;
	color: #004799;
	padding: 0;
	margin: 0 0 0.4em 0;
}

#content-main strong {
	color: #414141;
}


ul.bulleted {
	padding: 0;
	margin: 0 0 1.0em 0;
	list-style: none outside;
	line-height: 1.5;
}
	ul.bulleted li {
		margin: 0 0 0.8em 0;
		padding: 0 0 0 12px;
		background: transparent url(../img/li_bullet1.gif) 0 0.55em no-repeat;
		line-height: inherit;
	}
#content ol {
	padding: 0 0 0 19px;
	margin: 0 0 1.0em 0;
	list-style: decimal outside;
	line-height: 1.5;
}
	#content ol li {
		margin: 0 0 0.8em 0;
		padding: 0 0 0 0px;
		line-height: inherit;
	}

/* Subpage Styles */
	#content-main .pagetitle {
		padding: 13px 0 2px 25px;
		color: #1F5899;
		font-size: 3em;
		line-height: 1;
	}
	#content-main .backlink {
		padding: 8px 0 0px 25px;
		margin: 0 0 0 0;
		font-size: 0.91em;
	}
	#content-main .news {
		font-size: 1.6em;
		border-bottom: solid 7px #A2D3FA;
		padding: 0;
		margin: 0 0 1.0em 0;
	}
		#content-main .news span {
			display: block;
			border-bottom: solid 1px #74A9E5;
		}
			#content-main .news span span {
				display: block;
				width: 520px;
				line-height: 1.2;
				padding: 10px 0 12px 25px;
				border: none;
			}
	#content-main .pgheader-img-outer {
		border-top: solid 1px #75A9E5;
		background: #A2D3FA url(../img/pgheader_bg_line.gif) 0 bottom repeat-x;
		overflow: hidden;
		margin: 0 0 15px 0;
	}
		#content-main .pgheader-img {
			width: 540px;
			background: transparent url(../img/pgheader_bg_pulse.gif) 450px bottom no-repeat;
			overflow: hidden;
			padding: 0;
			margin: 0;
			line-height: 1;
			height: 113px;
		}
		#content-main #productslanding .pgheader-img {
			width: 540px;
			height: 195px;
		}
			#content-main .pgheader-img img {
				margin: 0;
				padding: 0;
				line-height: 1;
				border: none;
				width: 370px;
				float: left;
				display: inline;
			}
			#content-main #productslanding .pgheader-img img {
				width: 520px;
			}
			#content-main .pgheader-img .caption {
				float: right;
				display: inline;
				width: 143px;
				padding: 5px 15px 0 0;
				font-size: 0.92em;
				color: #fff;
				
			}
	#content-main .page-body {
		width: 500px;
		padding: 0 15px 0 25px;
	}
	/* This is being turned off for now, on account of making the layout too busy.
	#content-main p.intro {
		color: #004799;
		font-size: 1.1em;
	} */
	#content-main .indent {
		padding-left: 25px;
	}
	
	/*--- Tabs ---*/
	.content-tabs {
		padding-bottom: 0.2em;
		border-bottom: solid 1px #D9D5CE;
		margin-bottom: 1.0em;
	}
	
	.tabs {
		border-bottom: solid 5px #e3e3e3;
		padding: 0.8em 0 0 0;
		margin: 0 0 1.0em 0;
	}
		.tabs ul {
			border-bottom: solid 1px #bfbfbf;
			list-style: none outside;
		}
			.tabs li {
				float: left;
				clear: none;
				display: inline;
				width: auto;
				padding: 0;
				margin: 0 4px 0 0;
				background: #dbdbdb url(../img/tab_init_tl.gif) 0 0 no-repeat;
				font-size: 0.92em;
				cursor: pointer;
			}
			.tabs li.current {
				background: #6696cc url(../img/tab_curr_tl.gif) 0 0 no-repeat;
			}
				.tabs a, .tabs a:link, .tabs a:visited, .tabs a:hover, .tabs a:active {
					display: block;
					padding: 6px 10px 4px;
					margin: 0;
					background: transparent url(../img/tab_init_tr.gif) right top no-repeat;
					color: #2768B0;
					text-decoration: none;
				}
				.tabs .current a, .tabs .current a:link, .tabs .current a:visited, .tabs .current a:hover, .tabs .current a:active {
					background: transparent url(../img/tab_curr_tr.gif) right top no-repeat;
					color: #fff;
					font-weight: bold;
				}
				.tabs a:hover, .tabs a:active {
					text-decoration: underline;
					
				}
				.tabs li.current a:hover, .tabs li.current a:active {
					text-decoration: none;
				}
	
	/*--- Button-style Links ---*/
	a.btnlink-main-green, a.btnlink-main-green:link, a.btnlink-main-green:visited, a.btnlink-main-green:hover, a.btnlink-main-green:active {
		background: #00A354 url(../img/btn_main_g_tl.gif) 0 0 no-repeat;
		float: left;
		display: inline;
		clear: none;
		width: auto;
		padding: 0;
		margin: 0 0 0 0;
		color: #fff;
		font-weight: bold;
		text-decoration: none;
	}
	.right-aligned {
		float: right !important;
	}
	a.btnlink-main-green:hover, a.btnlink-main-green:active {
		text-decoration: underline;
	}
		.btnlink-main-green span {
			display: block;
			background: transparent url(../img/btn_main_g_tr.gif) top right no-repeat;
		}
			.btnlink-main-green span span {
				display: block;
				background: transparent url(../img/btn_main_g_bl.gif) bottom left no-repeat;
			}
				.btnlink-main-green span span span {
					display: block;
					background: transparent url(../img/btn_main_g_br.gif) bottom right no-repeat;
					padding: 7px 14px;
				}
	
	a.btnlink-sb-green, a.btnlink-sb-green:link, a.btnlink-sb-green:visited, a.btnlink-sb-green:hover, a.btnlink-sb-green:active {
		background: #00A354 url(../img/btn_sb_g_tl.gif) 0 0 no-repeat;
		float: left;
		display: inline;
		clear: none;
		width: auto;
		padding: 0;
		margin: 0 0 0 0;
		color: #fff;
		font-weight: normal;
		text-decoration: none;
	}
	a.btnlink-sb-green:hover, a.btnlink-sb-green:active {
		text-decoration: underline;
	}
		.btnlink-sb-green span {
			display: block;
			background: transparent url(../img/btn_sb_g_tr.gif) top right no-repeat;
		}
			.btnlink-sb-green span span {
				display: block;
				background: transparent url(../img/btn_sb_g_bl.gif) bottom left no-repeat;
			}
				.btnlink-sb-green span span span {
					display: block;
					background: transparent url(../img/btn_sb_g_br.gif) bottom right no-repeat;
					padding: 5px 9px;
				}
		
	/* Careers page */
	.joinourteam-box {
		border: solid 1px #bbb;
		background: #EFEFEF;
		margin: 1.2em 0 2.5em 0;
	}
		.jot-left {
			float: left;
			display: inline;
			width: 184px;
			border-top: solid 5px #2C54AD;
		}
			#content-main .jot-left h4 {
				background: #2367B5;
				padding: 5px 12px;
			}
			.jot-left ul.bulleted {
				font-weight: bold;
				padding-left: 15px;
			}
				.jot-left ul.bulleted li {
					margin-bottom: 0.4em;
				}
		.jot-right {
			float: left;
			display: inline;
			width: 264px;
			border-top: solid 5px #E2E1E1;
			padding: 12px 25px 21px 25px;
		}
	.leftcol-184 {
		float: left;
		display: inline;
		width: 184px;
		margin: 0 25px 0 0;
	}
		.img-brdr img {
			border: solid 1px #A2D3FA;
		}
	.rightcol-184 {
		float: left;
		display: inline;
		width: 284px;
	}
	
	/* Styles for Careers section */
	.float-left {
		float: left;
		display: inline;
		margin: 0 15px 20px 0;
	}
	.float-right {
		float: right;
		display: inline;
		margin: 0 0 15px 20px;
	}
	.subheading1 {
		font-weight: normal !important;
		margin-top: 0.2em !important;
	}
	
	/* Table Styles */
	.info-table {
		width: 100%;
		padding: 0;
		margin: 0 0 1.0em 0;
		border-collapse: collapse;
		line-height: 1.5;
	}
		.info-table tr {
		}
		.info-table td {
			padding: 0 10px 20px 0;
			line-height: 1.5;
		}
	
	/* Callout Box - About Us, etc. */
	.calloutbox {
		border: solid 1px #bbb;
		background: #EFEFEF;
		margin: 0 0 1.0em 0;
	}
		#content .calloutbox ul {
			border-top: solid 5px #E2E1E1;
			padding: 8px 15px 5px;
			margin: 0;
		}
			#content .calloutbox ul li {
				margin: 0 0 0.6em 0;
			}


/* Content-main Homepage Styles */
#home #content-main {
	border-top: 0px none;
	padding-bottom: 1em;
	float: right;
}
	.home-cta {
		border-top: solid 7px #C1CFE8;
		background: #DEE7FA;
		padding: 0.4em 15px 0.4em 25px;
		margin: 0 0 1.4em 0;
	}
		.home-cta p {
			width: 500px;
			font-size: 1.2em;
			margin: 0;
			padding: 0.6em 0 0.4em;
		}
			.home-cta p strong {
				line-height: 1.5;
			}
		#home #content-main .page-body {
			width: 330px;
			padding: 0 25px 0 25px;
			float: left;
			display: inline;
		}
		#home .home-updates {
			width: 160px;
			padding: 0;
			float: left;
			display: inline;
		}
			#home .home-updates h4 {
				padding: 0;
				margin: 0 0 0.6em 0;
				color: #999;
			}
			#home .home-updates p {
				margin: 0 0 0.6em 0;
			}
			#home a.hiring {
				display: block;
				text-indent: -5000px;
				overflow: hidden;
				background: #666 url(../img/home_update_hiring2.gif) 0 0 no-repeat;
				width: 160px;
				height: 87px;
				line-height: 1;
			}
			#home a.hiring:hover, #home a.hiring:active {
				background: #666 url(../img/home_update_hiring2.gif) 0 -87px no-repeat;
			}
	
/* Sidebar
------------------------- */
#content-secondary {
	background: #b6b6b6;
	border-right: solid 1px #3670B3;
	float: left;
	display: inline;
	width: 214px;
	text-align: right;
	padding-bottom: 1em;
}
	.csuccess {
		width: 200px;
		float: right;
		display: inline;
		padding: 15px 0 6px 0;
	}
		.csuccess h4 {
			color: #DEFAF9;
			text-transform: uppercase;
			font-weight: bold;
			padding: 0 0 0.9em 10px;
		}
		.csuccess .quotation {
			background: transparent url(../img/csuccess_quote1.gif) 0 0 no-repeat;
			padding: 4px 10px 0px 10px;
			color: #fff;
			font-size: 1.167em;
		}
		.csuccess .attribution {
			font-size: 0.92em;
			padding: 0 0 0 10px;
			color: #555;
		}
			.csuccess .attribution span {
				color: #0A3566;
				display: block;
				margin-bottom: 0.3em;
			}
		.csuccess .cta, .sb-cta .cta {
			padding-left: 5px;
			font-size: 0.92em;
		}
	.employee {
	}
		.employee .employeehs {
			xfloat: left;
			xdisplay: inline;
			xwidth: 40px;
			xmargin-right: 10px;
			padding-left: 10px;
			margin-bottom: 0;
		}
			.employeehs img {
				border: solid 1px #CDCDCD;
			}
		.employee .attribution {
			xfloat: left;
			xdisplay: inline;
			xwidth: 115px;
			padding-top: 0.2em;
		}
			.employee .attribution span {
				margin-bottom: 0.1em;
			}
	
	.sb-cta {
		width: 190px;
		clear: right;
		float: right;
		display: inline;
		padding: 15px 0 6px 0;
	}
		.sb-cta h4 {
			color: #DEFAF9;
			text-transform: uppercase;
			font-weight: bold;
			padding: 0 0 0.9em 0px;
		}
		.sb-cta .text {
			font-size: 0.92em;
			padding: 0 10px 0.1em 0;
			color: #555;
		}
		.sb-cta .cta {
			margin-left: -5px;
		}
	.separated {
		border-top: solid 1px #D3D3D3;
	}
	
	/* Sidebar Homepage styles */
	.custlogin-outer {
		background: #a3a3a3;
		border-top: solid 7px #929292;
	}
		.custlogin {
			width: 190px;
			float: right;
			display: inline;
			padding: 12px 0 14px 10px;
		}
			.custlogin h4 {
				font-size: 0.87em;
				font-weight: bold;
				text-transform: uppercase;
				color: #DEFAF9;
				letter-spacing: 0.02em;
				margin: 0 0 0.4em 0;
				text-indent: -5000px;
				overflow: hidden;
				background: transparent url(../img/sb_title_custlogin.gif) 0 0 no-repeat;
			}
			.custlogin p {
				margin: 0;
			}
			.custlogin input {
				float: left;
				display: inline;
				width: 56%;
				background: #f2f2f2;
				border: solid 1px #555;
				border-bottom: solid 1px #888;
				padding: 2px 3px;
				font-size: 0.92em;
				color: #888;
				margin-right: 6px;
			}
			.custlogin .btn-outer {
				float: left;
				display: inline;
				margin-right: 5%;
				clear: none;
				width: auto;
				background: #828282 url(../img/btn_login_tl.gif) 0 0 no-repeat;
				padding: 0;
			}
				.custlogin .btn-outer span {
					display: block;
					background: transparent url(../img/btn_login_tr.gif) top right no-repeat;
					padding: 0;
				}
					.custlogin .btn-outer span span {
						display: block;
						background: transparent url(../img/btn_login_bl.gif) bottom left no-repeat;
						padding: 0;
					}
							.custlogin button {
								background: transparent url(../img/btn_login_br.gif) bottom right no-repeat;
								font-weight: normal;
								color: #e2e2e2;
								padding: 2px 7px 3px;
								width: auto;
								line-height: 1 !important;
								overflow: visible;
							}
			.custlogin button:hover, .custlogin button:active {
				color: #fff;
			}

/* =Footer
----------------------
	Credit/footer styles: Usually the copyright/company info
	Notes:
---------------------- */
#siteinfo-outer {
	height: 47px; /* Footer-stick */
	position: relative; /* Footer-stick */
	margin: -48px 0 0 0; /* Negative margin makes footer-stick work */
	padding: 0;
	border-top: solid 1px #2A3A8C;
	background: #6696CC; 
	color: #fff;
	font-size: 1.1em;
	line-height: 1;
}
	#siteinfo {
		margin: 0px auto;
		width: 740px;
		padding: 6px 5px 0;
		line-height: 1;
	}
		#siteinfo a, #siteinfo a:link, #siteinfo a:visited {
			color: #fff;
			padding: 0 5px;
		}
		#siteinfo a:hover, #siteinfo a:active {
			color: #DEFAF9;
		}
		#siteinfo-legal { /* Usually the copyright notice */
			text-align: left;
			float: left;
			width: 55%;
			line-height: 1.5;
		}
		#siteinfo-links { /* Usually Terms, Privacy and Accessibility */
			text-align: right;
			float: right;
			width: 42%;
			line-height: 1.5;
		}

/* =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;
	/* Try adding any/all of these if clear divs aren't working right:
	height: 1%;
	width: 100%;
	font-size: 1%;
	line-height: 1;
	clear: both;
	*/
}
.clear-right {clear: right;}
.clear-both {clear: both;}

.bold {font-weight: bold}
.em {font-style: italic}

.xspa {
	margin-bottom: 1.5em !important;
}