@import url("./whitespace-reset.css");

body { 
	font: 12px arial, helvetica, sans-serif;
	background: #0e2334; }
	
a, a:visited { text-decoration: none; }
	a:hover { text-decoration: underline; }
	
button { 
	margin: 0;
	padding: 0;
	cursor: pointer;
	border: none; }
	
fieldset { border: none; }

label { 
	color: #999999;
	font: 14px georgia, times, serif;
	font-style: italic; }

input[type=text], textarea { 
	display: block;
	clear:both;
	margin-top: 5px;
	font: 12px arial, helvetica, sans-serif;
	padding: 3px 5px;
	color: #999999;
	font-weight: bold;
	border: 1px solid #CCCCCC; }

h1, h2, h3, h4, h5 { clear: both; }

h4 { 
	color: #2c7cb2;
	font-size: 32px;
	text-align: center;
	font-weight: normal;
	font-style: italic; }
	form h4 { 
		font-size: 20px;
		text-align: left;
		font-style: normal;
		font-family: arial, helvetica, sans-serif; }
		form > h4 { 
			padding-bottom: 30px;
			margin-bottom: 0px;
			background: transparent url("../images/bg_heading_shadow_bottom.png") center 100% no-repeat; }
	
p { 
	color: #808080;
	line-height: 140%;
	padding-top: 10px; }
	
#sitewrapper { 
	min-width: 1200px;
	padding-bottom: 50px; }

#header_wrapper { 
	width: 1200px;
	height: 150px;
	margin: 0 auto;
	background: transparent url("../images/bg_header.png") 0 0 no-repeat; }
	#home #header_wrapper { height: 429px; }
	
#header { 
	color: #FFFFFF;
	position: relative;
	padding: 30px 10px 0 20px; }
	#home #header { height: 399px; }
	#header h1 { 
		float: left;
		width: 237px;
		height: 79px;
		background: transparent url("../images/logo.png") 0 0 no-repeat; }
		#header h1 a { 
			width: 237px;
			height: 79px; }
	#header a, #header a:visited { color: #FFFFFF; }
	#header .nav_container { 
		float: right;
		width: 680px; }
	#header .nav { 
		clear: both;
		float: right; }
		#header .nav li { 
			padding: 2px 10px;
			background: transparent url("../images/bg_nav_border.png") 0 0 repeat-y; }
			#header .nav li:first-child { background: transparent; }
	#header .site_nav { 
		padding-top: 15px;
		font-weight: bold;
		*width: 580px; /* STUPID IE7. to prevent li wrapping, a width to the site nav ul had to be given. */ }
		
#heading_wrapper { 
	background: #407eab;
	padding: 20px 0;
	color: #FFFFFF; }

#heading h2, #heading h3 { font-weight: normal; }
#heading h2 { font-size: 32px; }
#heading h3 { font-size: 20px; }

#top_nav { 
	font-size: 18px;
	padding-top: 10px; }
	#header #top_nav li { padding: 3px 10px 3px; }
	#header #top_nav li:first-child { padding-top: 2px; }
			
#header_copy { 
	width: 420px;
	padding: 60px 20px 20px 0;
	clear: both; }
	#header_copy h2, #header_copy h3 { 
		font-weight: normal;
		text-transform: uppercase; }
	#header_copy h2 { 
		line-height: 100%;
		font-size: 38px; }
	#header_copy h3 { 
		line-height: 100%;
		font-size: 25px;
		color: #de7a1c; }
	#header_copy p { 
		font-size: 18px;
		color: #DBDBDB;
		padding-top: 12px;
		line-height: 140%; }

#header ul.btn_container { 
	position: absolute;
	height: 50px;
	left: 20px;
	bottom: -15px;
	padding-top: 50px; }
	#header ul.nav.btn_container li { background: transparent; }
	#header ul.btn_container li { padding-left: 10px; }
		#header ul.btn_container li:first-child { padding-left: 0; }
	#header ul.btn_container a { 
		width: 144px;
		height: 50px;
		background: transparent 0 0 no-repeat; }
		#header ul.btn_container a:hover, #header ul.btn_container a.selected { background-position: -144px 0 }
	#header ul.btn_container a.btn_learn_more_blue { background-image: url("../images/btn_learn_more_blue.png"); }
	#header ul.btn_container a.btn_contact_us_gray { background-image: url("../images/btn_contact_us_gray.png"); }

#slideshow { 
	width: 502px;
	height: 472px;
	margin-top: -140px;
	margin-left: 20px;
	position: relative;
	padding: 6px 21px 4px 23px;
	background: transparent url("../images/bg_slideshow_int.png") 0 0 no-repeat; }	
	#home #slideshow { 
		position: absolute;
		right: 10px;
		top: 145px;
		width: 501px;
		height: 502px;
		margin-top: 0;
		padding: 6px 21px 4px 23px;
		background: transparent url("../images/bg_slideshow.png") 0 0 no-repeat; }
	#slideshow h2, #slideshow p { 
		color: #525252;
		padding: 10px 20px; }
	#slideshow h2 { 
		text-align: center;
		font-size: 22px;
		padding-bottom: 20px;
		margin-bottom: 0px;
		background: transparent url("../images/bg_int_slideshow_shadow.png") center 100% no-repeat; }
	/*	#home #slideshow h2 { 
			text-align: left;
			background: none;
			padding-bottom: 0;
			margin-bottom: 0; } */
	#slideshow p { 
		font-size: 14px;
		line-height: 140%; }
	#slideshow .slides { 
		width: 480px;
		height: 270px;
		margin: 10px;
		*padding-top: 10px; /* IE7 Hack. was not applying margin to the top of the ul */
		overflow: hidden; }
	#slideshow .btn_container { 
		position: absolute;
		top: 256px;
		width: 44px;
		height: 50px; }
		#slideshow .btn_container a { 
			width: 16px;
			height: 23px;
			margin: 14px 0 0 14px;
			background: transparent 0 0 no-repeat; }
			#slideshow .btn_container a:hover, #slideshow .btn_container a.selected { background-position: -16px 0; }
		#slideshow .btn_container.btn_prev { 
			left: 0;
			background: transparent url("../images/btn_slideshow_prev_bg.png") 0 0 no-repeat; 
			z-index: 100; }
			#slideshow .btn_container.btn_prev a { background-image: url("../images/btn_slideshow_prev.png"); }
		#slideshow .btn_container.btn_next { 
			right: 0px;
			background: transparent url("../images/btn_slideshow_next_bg.png") 0 0 no-repeat; 
			z-index: 100; }
			#slideshow .btn_container.btn_next a { background-image: url("../images/btn_slideshow_next.png"); }
			
#content_wrapper { 
	padding: 50px 0 70px 0;
	background: #FFFFFF; }
	
#content > h2 { 
	font-size: 32px;
	font-weight: normal; }
	#content blockquote { 
		width: 350px;
		float: left;
		margin-top: 20px;
		padding: 0 0 0 40px;
		font-size: 14px;
		color: #888888;
		font-style: italic;
		line-height: 140%;
		background: transparent url("../images/sym_quotes_open.png") 0 0 no-repeat;
		min-height: 90px; }
		#content blockquote p.byline { 
			padding-top: 5px;
			background: transparent url("../images/sym_quotes_close.png") 100% 0 no-repeat; }
	#content .module blockquote { 
		background: none;
		width: auto;
		margin: 0;
		padding: 10px 0 0; }

#services { 
	clear: both;
	padding-top: 50px;
	color: #808080;
	margin: 0 -10px 0 -20px; }
	#services li { 
		float: left;
		height: 230px;
		position: relative; }
		#services li:first-child { *margin-left: -20px; } /* IE7 Hack. doing this becuase negative margins not recognized on parent ul */
		#services h2 { 
			font-size: 20px;
			color: #2c7cb2; }
		#services p { 
			line-height: 140%;
			padding-top: 10px; }
		#services #collect { 
			width: 159px;
			padding: 0 160px 0 20px;
			background: transparent url("../images/hp_services_collect_bg.jpg") 0 0 no-repeat; }
		#services #process { 
			width: 160px;
			padding: 0 140px 0 20px;
			background: transparent url("../images/hp_services_process_bg.jpg") 0 0 no-repeat; }
		#services #provide { 
			width: 151px;
			padding: 0 170px 0 20px;
			*margin-right: -10px; /* IE7 Hack. doing this becuase negative margins not recognized on parent ul */
			background: transparent url("../images/hp_services_provide_bg.jpg") 0 0 no-repeat; }
		#services .btn_learn_more_curve { 
			position: absolute;
			bottom: 0; }

#why_ocra_block { 
	color: #FFFFFF;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 10px; }
	#why_ocra_block h2 { 
		font-weight: normal;
		font-size: 32px; }
	#why_ocra_block h3 { font-size: 18px; }
	#why_ocra_block li { 
		position: relative;
		width: 210px;
		height: 160px;
		float: left;
		padding: 30px 0 0 40px; }
		#why_ocra_block li:first-child { padding-left: 0; }
	#why_ocra_block li p { padding-top: 15px; }
	#why_ocra_block li .button { 
		position: absolute;
		left: 40px;
		bottom: 0; }
		#why_ocra_block li:first-child .button { left: 0; }
		
#col1, #col2 { width: 403px; }
	#col1.col_narrow { width: 233px; }
	#col1.col_wide { width: 475px; }
	form#col1 { width: 620px; }
#col2 { margin-left: 19px; }
	#contact_us #col2 { 
		width: 303px;
		margin-left: 40px; }

#accounting .column { margin-top: 20px; }
		
#contact_us fieldset.column { 
	width: 310px; }
	#contact_us input[type=text] { width: 270px; }
	#contact_us textarea { 
		width: 580px;
		height: 75px; }
	#contact_us fieldset { padding-top: 10px; }
	#contact_us fieldset.button_container { margin-right: 30px; }
	
#payroll blockquote, #payroll #col2 > h4 { margin-left: 40px; }

#reports ul.with_image { margin-top: 20px; }
	#reports ul.with_image > li > img { 
		float: left;
		padding: 6px 6px 20px 6px;
		background: transparent url("../images/reporting_image_matte.png") 0 0 no-repeat; }
	#reports ul.with_image > li > div { 
		width: 560px;
		padding-left: 40px; }
	#reports ul.with_image h5 { padding-top: 40px; }
	
#why_ocra .module_wide { height: 400px; }
	#why_ocra .module_wide > h5 { 
		font-size: 13px;
		padding-top: 20px; }
	#why_ocra .module_wide > p { padding-top: 0; }
	#why_ocra .module .btn_request_quote { left: 280px; }

#client_scroller_wrapper { 
	float: left;
	clear; both;
	width: 100%; 
	padding-bottom: 60px; }
	#client_scroller_wrapper h4 { 
		font-size: 21px;
		text-align: left;
		font-style: normal }
	#client_scroller_container { 
		background: transparent url("../images/bg_shadow_bottom.png") center 100% no-repeat; }
	#client_scroller { 
		position: relative;
		padding: 20px 0 40px 80px;
		background: transparent url("../images/bg_shadow_top.png") center 0 no-repeat; }
	#client_scroller .btn_container { 
		width: 46px;
		height: 46px;
		position: absolute;
		top: 60px;
		background: transparent url("../images/bg_btn_client_scroll.png") 0 0 no-repeat; }
		#client_scroller .btn_container a { 
			width: 16px;
			height: 23px;
			margin: 14px 0 0 14px;
			background: transparent 0 0 no-repeat; }
		#client_scroller .btn_container a:hover, #client_scroller .btn_container a.selected { background-position: -16px 0; }
		#client_scroller .btn_container.btn_prev { left: 0; }
			#client_scroller .btn_container.btn_prev a { background-image: url("../images/btn_slideshow_prev.png"); }
		#client_scroller .btn_container.btn_next { right: 0; }
			#client_scroller .btn_container.btn_next a { background-image: url("../images/btn_slideshow_next.png"); }
	#client_scroller ul.with_image li > img { 
		float: left;
		/*border-right: 1px solid #CCCCCC;*/
		padding-right: 40px; }
	#client_scroller ul.with_image li > div { 
		float: left;
		width: 600px;
		color: #b2b2b2;
		font: 16px/160% georgia, times, serif italic; }
	
#footer_wrapper { 
	clear: both;
	padding-top: 20px;
	background: transparent url("../images/bg_footer_border.png") 0 0 repeat-x; }
	
#footer .nav a, #footer .nav a:visited { color: #FFFFFF; }
	#footer .nav { 
		clear: both;
		padding-top: 5px; }
	#footer .nav li { 
		padding: 0 10px;
		border-left: 1px solid #FFFFFF; }
		#footer .nav li:first-child { 
			padding-left: 0;
			border: none; }
	#footer > a.button { float: right; }

.content_container { 
	width: 970px;
	margin: 0 auto; }

.nav_container { float: left; }
	ul.nav li { float: left; }

.blue { color: #2c7cb2; }
.blue-phone { color: #63BDFC; }

p.lead_text { 
	text-align: center;
	padding: 20px 60px 40px;
	line-height: 160%;
	font-size: 14px;
	background: transparent url("../images/bg_shadow_bottom.png") center bottom no-repeat; }

.button { 
	display: block;
	text-indent: -8420px;
	outline: none; }
	.btn_client_login { 
		width: 100px;
		height: 28px;
		background: transparent url("../images/btn_client_login.png") 0 0 no-repeat; }
		.btn_client_login:hover, .btn_client_login.selected { background-position: -100px 0;  }
	.btn_learn_more_curve { 
		width: 124px;
		height: 36px;
		background: transparent url("../images/btn_learn_more_curve.png") 0 0 no-repeat; }
		.btn_learn_more_curve:hover, .btn_learn_more_curve.selected { background-position: -124px 0; }
	.btn_learn_more_small { 
		width: 100px;
		height: 28px;
		background: transparent url("../images/btn_learn_more_small.png") 0 0 no-repeat; }
		.btn_learn_more_small:hover, .btn_learn_more_small.selected { background-position: -100px 0; }
	.btn_logo_small { 
		width: 120px;
		height: 33px;
		background: transparent url("../images/logo_small.png") 0 0 no-repeat; }
	.btn_submit { 
		width: 75px;
		height: 26px;
		background: transparent url("../images/btn_submit_orange.png") 0 0 no-repeat; }
		.btn_submit:hover { background-position: -75px 0; }
	.btn_view_sample { 
		width: 145px;
		height: 36px;
		background: transparent url("../images/btn_view_sample.png") 0 0 no-repeat; }
		.btn_view_sample:hover, .btn_view_sample.selected { background-position: -145px 0; }
	.btn_request_quote { 
		width: 155px;
		height: 36px;
		background: transparent url("../images/btn_request_quote.png") 0 0 no-repeat; }
		.btn_request_quote:hover, .btn_request_quote.selected { background-position: -155px 0; }
		
.module_wrapper { 
	margin: 70px 0 0;
	float: left;
	background: transparent 0 0 repeat-y; }
	.module_wrapper:first-child { margin-top: 0; }
	.module_container { 
		float: left;
		margin-bottom: -20px;
		padding-bottom: 30px;
		background: transparent 0 100% no-repeat; }
	.module { 
		position: relative;
		float: left;
		margin-top: -20px;
		padding: 3px 20px 0;
		color: #808080;
		background: transparent 0 0 no-repeat; }
		.module h4, #col2 h4 { 
			font-size: 20px;
			text-align: left;
			padding-top: 20px;
			font-style: normal; }
		.module p { 
			line-height: 160%;
			font-size: 13px; }
		.module > p, .module > ul { padding-top: 20px; }
		.module li p { padding-top: 0; }
		.module a, .module a:visited { 
			color: #2c7cb2;
			text-decoration: underline; }
		.module li { padding-top: 5px; }
			.module li:first-child { padding: 0; }
		.module .btn_view_sample { 
			position: absolute;
			right: 20px;
			bottom: -42px; }
		.module .btn_request_quote { 
			position: absolute;
			left: 39px;
			bottom: -42px; }
		
		
.module_narrow_wrapper {  
	width: 233px;
	background-image: url("../images/col_narrow_matte_middle.png"); }
	.module_narrow_container {  
		width: 233px;
		background-image: url("../images/col_narrow_matte_bottom.png"); }
	.module_narrow {  
		width: 193px;
		background-image: url("../images/col_narrow_matte_top.png"); }
		
.module_narrow2_wrapper {  
	width: 303px;
	background-image: url("../images/col_narrow2_matte_middle.png"); }
	.module_narrow2_container {  
		width: 303px;
		background-image: url("../images/col_narrow2_matte_bottom.png"); }
	.module_narrow2 {  
		width: 263px;
		background-image: url("../images/col_narrow2_matte_top.png"); }
		
.module_even_wrapper {  
	width: 403px;
	background-image: url("../images/col_even_module_matte_middle.png"); }
	.module_even_container {  
		width: 403px;
		background-image: url("../images/col_even_module_matte_bottom.png"); }
	.module_even {  
		width: 363px;
		background-image: url("../images/col_even_module_matte_top.png"); }
		
.module_wide_wrapper {  
	width: 475px;
	background-image: url("../images/col_wide_module_matte_middle.png"); }
	.module_wide_container {  
		width: 475px;
		background-image: url("../images/col_wide_module_matte_bottom.png"); }
	.module_wide {  
		width: 435px;
		background-image: url("../images/col_wide_module_matte_top.png"); }
	
	.module_wide ul.with_image li > div { width: 300px; }
		.module_wide ul.with_image li > div:first-child { width: 100%; }
		
.module_full_wrapper {  
	width: 960px;
	margin-top: 50px;
	background-image: url("../images/full_matte_middle.png"); }
	.module_full_container {  
		width: 960px;
		background-image: url("../images/full_matte_bottom.png"); }
	.module_full {  
		width: 920px;
		background-image: url("../images/full_matte_top.png"); }
		
		.module_full > h4 { text-align: center; }
		.module_full > p { 
			text-align: center;
			padding-bottom: 40px;
			background: transparent url("../images/bg_shadow_bottom.png") center 100% no-repeat; }
		
ul.with_image { width: 100%; }
	ul.with_image li { 
		float: left;
		width: 100%;
		clear: both;
		padding-top: 20px; }
		ul.with_image li:first-child { margin-left: 0; }
		ul.with_image h5 { 
			font-size: 17px;
			color: #2c7cb2; }
		ul.with_image li img { float: left; }
			ul.with_image li img:first-child { margin-left: 10px; }
		ul.with_image li div { 
			padding-left: 20px;
			float: left; }
			ul.with_image li div:first-child { padding-left: 0; }
			
ul.narrow_list { 
	width: 100%;
	padding-top: 80px; }
	ul.narrow_list li { 
		margin-top: 0;
		margin-left: 12px }
		ul.narrow_list li:first-child { margin-left: 0; }
	ul.narrow_list h4 { 
		font-size: 18px;
		padding-top: 10px;
		text-align: center; }
	ul.narrow_list .module { height: 360px; }
	ul.narrow_list p { text-align: center; }
	ul.narrow_list img.symbol { 
		float: none;
		display: block;
		margin: -40px auto 0; }
	

.column { float: left; }
.col_wide { padding-top: 30px; }

fieldset.button_container { float: right; }
	fieldset.button_container span { 
		padding-top: 5px;
		padding-right: 5px;
		float: left;
		font-size: 10px;
		font-style: italic; }
img.symbol { 
	float: right;
	margin: -50px 0; }

ul.bullets, ul.bullets li { 
	list-style: disc;
	list-style-type: disc;
	margin-left: 8px; }
	
.clearer { clear: both; }

input.error, textarea.error {
	border: 1px solid red;
}

#ss {
	width: 782px;
}

.dark_blue {
	color: #20577c; 
	font-size: 10px;
}



/**************OVERRIDES/ADDITIONS**********************/
#social_nav {
	width: 110px;
	position: relative;
	top: 40px;
	left: 154px;
}


#social_nav li {
	width: 25px;
	float: left;
	margin-right: 10px;
}

#header .nav_container {
	position: relative;
	top: -28px;
}

#social_nav a:focus {
	text-decoration: none;
	border-style: none;
}