/* -------------------------------------------------------------- 
  	GENERAL CROSS-BROWSER RESET 
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
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%;
  font-family: inherit;
  vertical-align: baseline;
}

body { 
  line-height: 1.5; 
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* Remove annoying border on linked images. */
a img { border: none; }

/* PC FF3 adds an outline to Flash objects? */
a, object {
	outline: none;
}

/* -------------------------------------------------------------- 
  	TYPOGRAPHIC DEFAULTS 
-------------------------------------------------------------- */

/* Headings
-------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em 0;
	line-height: 1;
	font-weight: bold;
}  

h1 { font-size: 2.667em; color: #FF5B00; }
h2 { font-size: 1.333em; color: #0D34A1; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.3em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1em; }

h1 a, h1 a:link { color: blue; }
h2 a, h2 a:link { color: blue; }
h3 a, h3 a:link { color: blue; }
h4 a, h4 a:link { color: blue; }
h5 a, h5 a:link { color: blue; }
h6 a, h6 a:link { color: blue; }

h1 a:hover { color: blue; }
h2 a:hover { color: blue; }
h3 a:hover { color: blue; }
h4 a:hover { color: blue; }
h5 a:hover { color: blue; }
h6 a:hover { color: blue; }

/* Specific Header Styles */
#faqSection h2 { cursor: pointer; margin-bottom: 0.75em; }

/* Text Elements
-------------------------------------------------------------- */

p { margin: 0 0 1.5em; line-height: 1.5;}
.summary p { font-size: 1.4em; font-style: italic; }

a { text-decoration: underline; }
a,a:link { color: #144AE0; }
a:visited { color: #144AE0; }
a:hover,a:active,a:focus { color: #0333B8; background: #E8F4FC; }
a.contactBtn { display: block; background: url(../images/btn/contact.gif) 0 0 no-repeat; width: 70px; height: 22px; text-indent: -9999px; }
a.contactBtn:hover { background: url(../images/btn/contact-hover.gif) 0 0 no-repeat; }
a.findLocationBtn {display: block; background: url(../images/btn/find-location.gif) 0 0 no-repeat; width: 103px; height: 22px; text-indent: -9999px;}
a.findLocationBtn:hover {display: block; background: url(../images/btn/find-location-hover.gif) 0 0 no-repeat; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong { font-weight: bold; }
em  { font-style: italic; }
address { font-style: normal; margin: .5em 0 .5em 0;}
cite { font-style: italic; }
small { font-size: 0.833em; }

/* Following six styles generally do not need to be edited */

sup, sub    { line-height: 0; }
dfn { font-style: italic; }
del { color:#666; }
pre { white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


/* Lists
-------------------------------------------------------------- */

li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }
ul ol li 	{ background: none; padding-left: 0; }

ul          { list-style-type: disc; margin-left: 1.5em; }
ol          { list-style-type: decimal; }
dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

/* Tables
-------------------------------------------------------------- */

table       { margin-bottom: 1.4em; width:100%; border: 1px solid #D9D9D9; border-bottom: none; border-right: none; }
th          { background-color: #e5e5e5; font-weight: bold; border-right: 1px solid #D9D9D9; }
th,td,caption { padding: 4px 10px 4px 5px; }
td		{ border-bottom: 1px solid #D9D9D9; border-right: 1px solid #D9D9D9;  }
tr.odd td  { background: #FBFBFB; }
tfoot       { font-style: italic; }
caption     { background: #eee; text-align: center; }

/* -------------------------------------------------------------- 
	PAGE STRUCTURE
	Elements that make up the skeleton of the layout and holds things together
----------------------------------------------------------- */
body {
	margin: 0;
	color: #000000;
	font: 62.5% arial, helvetica, sans-serif;
	text-align: center;
	background: #1238A3 url(../images/design/layout/body-bg.gif) 50% 0 repeat-y;
}

#page {
	position: relative;
	text-align: left;
	padding: 0;
	background: url(../images/design/layout/page-bg.jpg) 0 0 repeat-x; 
	font-size: 1.2em; /* this, along with body font size of 62.5% renders type approximately 12px in size across all browsers */
}

#header {
	position: relative;
	height: 87px;
	padding: 0 4px;	
}

#wrapper {
	background: url(../images/design/layout/body-bg.gif) 0 0 repeat-y;
	position: relative;
	width: 668px;	
	min-height: 550px;
	margin: 0 auto;	
}

#contentMain { 
	padding: 0 4px; 
	background: url(../images/design/layout/inner-content-main-bg.gif) 3px 0 repeat-y; 
}

#footer 		{ clear: left; margin: 0 4px; border-top: 1px solid #DCDCDC; padding: 1em 20px; font-size: 0.917em;}
#footer strong 	{ display: block; }
#footer p 		{ margin-bottom: 1em; }
#footer a:hover { background: none; }

/* Homepage Specific Styles */
body.home #contentMain { background: none; }

/* -------------------------------------------------------------- 
	PAGE STRUCTURE ELEMENTS
	Elements  such as logos, search bars, and any other design element repeated throughout the site, but doesn't effect the structural layout
----------------------------------------------------------- */
    
#logo {
	width: 155px;
	height: 87px;
	display: block;
	background: #FFFFFF url(../images/design/header/logo.gif) 50% 50% no-repeat;
	position: absolute;
	top: 0;
	border-right: 1px solid #D9D9D9;
	left: 4px;
	margin: 0;
	padding: 0;
	font-size: 1em;
}
	#logo a {
		width: 100px;
		height: 100px;
		display: block;
		text-indent: -9999px;
	}
	
	#logo a:hover { background: none; }
/* -------------------------------------------------------------- 
	HOME PAGE LAYOUT
----------------------------------------------------------- */
#animation {
	height: 192px;
	overflow: hidden;	
	position: relative;
	z-index: 10;
	margin-top: 2px;
}

#companyIntro { padding: 20px 230px 20px 20px; position: relative; }
#companyIntro h1 { font-size: 3em; font-family: "Times New Roman", georgia, serif; }
	#companyIntro h1 span { font-size: 0.5em; position: relative; top: -18px; }

#serviceListing { background: url(../images/design/home-page/home-services-bg.gif) 0 0 repeat-x; border-bottom: 1px dashed #D9D9D9; border-top: 1px solid #D9D9D9; padding: 1em 0;  }
	#mainServices { list-style: none; margin: 0; }
		#mainServices li { background: #FFFFFF; min-height: 190px; float: left; width: 150px; border: 1px solid #D9D9D9; margin-left: 15px; padding: 5px; display: inline; }
			#mainServices li#additional { background: none; width: 103px; border: 0; text-align: left; }
				#mainServices li#additional h3 { color: #666666; font: bold 1.167em arial, sans-serif; }
				#mainServices li#additional ul { margin: 0; }
				#mainServices li#additional li { float: none; display: block; width: auto; margin: 0; background: none; min-height: 0; height: auto; border: 0; padding: 0; margin-bottom: 0.5em; }
					#mainServices li#additional li a { padding: 0; color: #2A37A5; display: inline;  }
						#mainServices li#additional li a:hover { background: none; }
			
			#mainServices img { margin-bottom: 5px; } 
			#mainServices a, 
			#mainServices p { padding: 0; margin-bottom: 0; }
				#mainServices .serviceImage:hover { background: none; }
				
#locationsList { padding: 0.5em 10px 1em 10px; }
	#locationsList h3 { color: #666666; font: bold 1.167em arial, sans-serif; margin-left: 10px; }
		#locationsList h3 a { color: #536EA5; }
			#locationsList h3 a:hover { background: none; }
	#locationsList ul { margin: 0; list-style: none; background: url(../images/design/home-page/location-listing-bg.gif) -3px 0 repeat-y; }
		#locationsList li { margin: 0; list-style: none; width: 112px; float: left; padding: 0 8px; }
			#locationsList li a { color: #727BC4; font-size: 0.833em; display: block; margin-bottom: 1em; }

/* Tool Tip */

.tooltip { display: none; position: absolute; padding: 10px 0 10px 20px; width: 210px; padding-right: 0; background: #FFFFFF; border: 1px solid #D9D9D9; font-size: 1.2em; -webkit-box-shadow: 2px 2px 15px #666666; -moz-box-shadow: 2px 2px 15px #666666; }
	.tooltip .tip { position: absolute; left: -25px; top: 10px; width: 25px; height: 27px; display: block; background: url(../images/design/home-page/tooltip.gif) 0 0 no-repeat; }
		.reversed .tip { left: auto; top: 10px; right: -25px; background-image: url(../images/design/home-page/tooltip-reversed.gif); }
	.tooltip h3 { font-weight: bold; color: #FF6600; margin-left: 0; text-align: left; }
	.tooltip ul { float: left; width: 100px; background: none; margin: 0; margin-right: 5px; list-style: none; }
		.tooltip li { font-size: 0.833em; margin-bottom: 0.75em; padding: 0; line-height: 1; text-align: left; } /* ie6.css */
		
/* Angie's list */

.angiesList { position: absolute; right: 0; top: 190px; }
	.angiesListImg:hover {background: none;}
		.angiesListLink {position: relative; right: 30px; }
			.angiesListLink a:hover { background: #E8F4FC; }
/* -------------------------------------------------------------- 
	INNER PAGE LAYOUT
----------------------------------------------------------- */
#aside 					{ float: left; width: 155px; margin-right: 1px;}
	#aside .secureLogout { margin-left: 15px; }
#article 					{ float: left; width: 503px; overflow: hidden; /* ie6 float drop fix */ }
#article img.headerImage 	{ margin: 2px 0 0 3px; }
#articleInner				{ padding: 1em 20px 2.5em 20px; }
	#articleInner blockquote { margin-left: 0; margin-right: 0; }
	
#inTheNews { list-style: none; margin: 0; }
	#inTheNews li { margin-bottom: 0.5em; padding: 0; }
		#inTheNews span { width: 95px; display: block; float: left; }
		#inTheNews a { padding-left: 10px; }
		
/* List Template
----------------------------------------------------------- */
#serviceList { float: left; width: 503px; padding: 0 20px; width: 463px; overflow: hidden; /* ie6 float drop fix */ }
	#serviceList img { margin-left: -17px; }
	#listingTop { padding-top: 1em; margin-bottom: 1.5em;  }
	#serviceList h2 { margin-bottom: 1em; border-top: 1px solid #D9D9D9; padding-top: 1em; }
	.pageList { padding-left: 140px; padding-bottom: 1.5em; margin-bottom: 1.5em; border-bottom: 1px dashed #D9D9D9; }
		#serviceList .pageList img { border: 1px solid #D9D9D9; margin-left: -140px; display: inline; float: left; }
			.pageList h3 a { color: #0D34A1; font-weight: normal; text-decoration: none; font-size: 0.813em; }
				.pageList h3 a:hover { background: none; text-decoration: underline; }
		.pageList p { margin-bottom: 1em; }
		.pageList .readMore,
		.pageList .locationLink { color: #0333B8; font-size: 0.917em; text-decoration: none; }
		.pageList .readMore { padding-right: 0.75em; margin-right: 0.5em; border-right: 1px solid #D9D9D9; }
			.pageList .readMore:hover { background: none; text-decoration: underline; }
		.pageList .locationLink { padding-right: 15px; background: url(../images/icons/button-right.gif) 100% 3px no-repeat; }
			.pageList .locationLink:hover { text-decoration: underline; }
	.pageListLast { border-bottom: 0; margin-bottom: 0; }

/* General Template
----------------------------------------------------------- */
#mainContent { float: left; width: 287px; margin-left: 20px; display: inline; padding: 1em 10px 1em 0; overflow: hidden; /* ie6 float drop fix */ }
#asideRight { float: left; width: 175px; padding-left: 9px; border-left: 1px solid #d9d9d9; margin-top: 55px; overflow: hidden; /* ie6 float drop fix */ }
	
/* Locations Template
----------------------------------------------------------- */
#indLocation { float: left; width: 504px; }
	#indLocationInner { padding: 1em 20px; } 
		#serviceAreaInfo { border-top: 1px solid #d9d9d9; padding: 1em 0; font-size: 0.917em; }
				#serviceArea { float: left; width: 145px; margin-right: 5px; }
					#serviceArea ul { margin-right: 0; }
				#contactInfo { float: left; width: 124px;  margin-right: 5px;}
					#contactInfo span { font-weight: bold; }
				#contactMethod { width: 180px; float: left; }	
		#indLocationInner #serviceListing { margin: 0 -20px 0 -20px; border: 0; }
			#indLocationInner #serviceListing h2 { padding-left: 20px; }
		#indLocationInner #serviceListing #mainServices li { width: 135px; margin-bottom: 1em; }
		
/* Location Map
----------------------------------------------------------- */
#map { background:url(../images/map/us_map.jpg) no-repeat; position: relative; width: 456px; height: 426px; }
	#map a { background:url(../images/map/dot.jpg) no-repeat; display: block; height: 9px; width: 9px; text-decoration: none; position: absolute; }
	#map a:hover { background-position: 0 -8.9px; }
	#map a span { display: none; font-size: 1em; position: absolute; background-color: #FFF; padding: 3px 2px; top: -15px; left: 10px; white-space: nowrap; }
		#map a:hover span { display: block; }
/* -------------------------------------------------------------- 
	NAVIGATION
----------------------------------------------------------- */
#mainMenu {
	position: absolute;
	left: 163px;
	width: 500px;
	margin: 0; 
	background: white url(../images/design/main-menu/cloud-bg.jpg) 0 0 repeat-x;
	list-style: none;
}

#mainMenu li {
	float: left;
	padding: 0;
	border-bottom: 1px #FFFFFF solid;
	border-right: 1px #FFFFFF solid;
}

#mainMenu li a {
	width: 124px;
	height: 87px;
	display: block;
	color: white;
	font-size: 1em;
	text-decoration: none;
	position: relative;
}

#mainMenu li a span {
	display: block;
	background: #4967B8;
	padding: 3px 8px;
	width: 108px;
	border-top: 1px solid #FFFFFF;
	position: absolute;
	bottom: 0;
	cursor: pointer;
}
#mainMenu li a:hover span { background: #FD6A18; }
#mainMenu li a.active span, #mainMenu li a.current span { background: #0D34A1; }

#mainMenu li#services a:hover		{ background: transparent url(../images/design/main-menu/services.jpg )		no-repeat; }
#mainMenu li#about-us a:hover		{ background: transparent url(../images/design/main-menu/about-us.jpg )		no-repeat; }
#mainMenu li#locations a:hover		{ background: transparent url(../images/design/main-menu/contact-us.jpg )		no-repeat; }
#mainMenu li#franchise a:hover		{ background: transparent url(../images/design/main-menu/franchising.jpg )	no-repeat; }

blockquote cite { display: block; font-style: normal; color: #0333B8; font-weight: bold; margin-top: 0.5em; }



/* -------------------------------------------------------------- 
	ASIDE ELEMENTS
----------------------------------------------------------- */
#aside h4 	{ 
	position: relative; /* hasLayout Fix for ie6 */ 
	margin: 0;
	padding: 0.75em 10px; 
	border-bottom: 1px solid #D9D9D9; 
	border-top: 1px solid #D9D9D9; 
}
#aside h4 a { 
	color: #FF6600;
	text-transform: capitalize;
	font-weight: bold;
	text-decoration: none;
	padding-right: 12px;
	background: url(../images/design/layout/arrow-orange.gif) 100% 5px no-repeat; 
}

#aside ul 	{ list-style: none; background: url(../images/design/local-nav/aside-ul-bg.gif) 0 100% repeat-y; margin: 0; margin-bottom: 2em; }

	#aside li { border-bottom: 1px solid #D9D9D9; padding: 0; } /* ie6.css */

		#aside li a { color: #2A37A5; font: normal 1.15em arial, sans-serif; text-transform: capitalize; text-decoration: none; display: block; padding: 0.6em 10px;}

		#aside li a:hover,
		#aside li a.active { color: #FFFFFF; background: #FF6600; }

		#aside li.active a  { color: #FFFFFF; background: #FF6600; }
		
		#aside li ul  {  margin-bottom: 0;  }
		
			#aside li.active ul  { background: none; }
			
				#aside li li.active  { background: none; }
				
				#aside li.active li,
				#aside li li.active { background: url(../images/design/local-nav/list-bullet.gif) 8px 10px no-repeat; padding-left: 22px; } 
				
				#aside li.active li a  { background: none; background: none; color: #2A37A5; }
				
			#aside li li  { font-size: 0.8em; border-bottom: 0; padding: 5px; padding-left: 0; position: relative;  }
			
				#aside li li a  { padding: 0; display: inline; }
				
					#aside li li a.active  { background: none; color: #2A37A5; font-weight: bold; }
					
					#aside li li a:hover  { background: 0; color: #2A37A5; text-decoration: underline; }
				
/* -------------------------------------------------------------- 
	IMAGES ELEMENTS
----------------------------------------------------------- */
a.freeEstimate { 
	background: url(../images/btn/free-estimates.gif) 0 0 no-repeat;
	display: block;
	height: 75px;
	width: 193px;
	text-indent: -9999px;
	position: absolute;
	right: 20px;
	top: 30px;
}

a.freeEstimate:hover { background: url(../images/btn/free-estimates.gif) 0 -75px no-repeat; }
a.location { 
	background: url(../images/btn/locations.gif) 0 0 no-repeat;
	display: block;
	height: 50px;
	width: 193px;
	text-indent: -9999px;
	position: absolute;
	right: 20px;
	top: 120px;
}
a.location:hover { background: url(../images/btn/locations.gif) 0 -50px no-repeat; }


/* -------------------------------------------------------------- 
	FORM ELEMENTS
----------------------------------------------------------- */
form {margin-bottom: 1.5em;}

fieldset {
	background: #efefef;
	margin-bottom: 1.5em;
	padding: 1em 1.5em;
}

	legend { font-weight: bold; }
	
	.fieldArea { margin-bottom: 0.833em; }
	
	label { float: left; margin-right: 10px; width: 150px; }
		label em { color: #DD0000; font-weight: bold; }
	
	input.commandButton {
		background: url(../images/btn/submit.gif) 0 0 repeat-x;
		border: 0;
		width: 70px;
		height: 22px;
		cursor: pointer;
		line-height: 0;
		font-size: 0;
		overflow: hidden;
		text-indent: -9999px;
		float: left; /* HasLayout fix */
	}
	
	input.commandButton:hover { background-image: url(../images/btn/submit-rollover.gif); }
	
	span.message {
		display: block;
		font-size: 0.833em;
	}
	
	span.error {
		color: #DD0000;
	}

	
/* Specific Element Styles */
.htmlSelectOneRadio label,
.htmlInputTextarea label,
.beginWorkFieldArea label { float: none; width: auto; margin: 0; }

.htmlSelectOneRadio table { margin: 0; border: 0; width: auto; }
.htmlSelectOneRadio table td { width: auto; border: 0; padding: 0; background: none; }

.htmlInputTextarea textarea { display: block; width: 100%; }

.beginWorkFieldArea label { display: block; }

fieldset.alt				{ padding: 0; background: none; }
.formTable 	 				{ width: auto; }

.formTable th 				{ font-size: 0.833em; padding-bottom: 0; padding-top: 0; }
.formTable thead th			{ text-align: center; }

.formTable textarea,
.formTable input 			{ width: 120px; margin-bottom: 5px; }
.formTable .small input 	{ width: 35px; }
.formTable .medium input 	{ width: 75px; }


.htmlSelectOneMenu  {margin-bottom: 1.8em;}

div#errors {
	background: #FFF5E6 url(../images/forms/error.gif) 10px 0.5em no-repeat;
	border: 1px solid #FFEBCC;
	color: #990000;
	font: normal 0.846em arial;
	margin: 0 0 1.5em 0;
	padding: 0.5em 10px 0.5em 50px;
}

div#errors h4 	{ color: #DD0000; font-weight: bold; }
div#errors ul 	{ margin-bottom: 0; }
div#errors li 	{ margin-bottom: 0.5em; font-size: 1.084em; }


.whatServicesFieldArea {padding-top: 0.8em;}

#breadCrumbs {padding: 1em 20px 0 20px; }

/* -------------------------------------------------------------- 
	MISC
----------------------------------------------------------- */

.floatLeft { float: left; }
.floatRight { float: right; }
.clearLeft { clear: left; }
.clearRight { clear: right; }
.clear {clear: both;}
.first { margin-left:0; padding-left:0; }
.last  { margin-right:0; padding-right:0; }
.top   { margin-top:0; padding-top:0; }
.bottom { margin-bottom:0; padding-bottom:0; }

img.floatLeft { margin: 0 1.5em 1.5em 0; }
img.floatRight { margin: 0 0 1.5em 1.5em; }

/* ----------------
	CLEAR FLOATS WITHOUT EXTRA HTML MARKUP
	add this class to the element that needs to be cleared - This works in modern browser that support the after pseudo element
    ------------- */ 
.group:after { 
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden; 
}
