*{margin: 0; padding: 0}
html, body{width: 100%; height: 100%}
html { overflow-y: scroll }
body
{		
	background: #fff;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 0.625em;
	line-height: 1.5em;
	color: #333333;
}
li, p {font-size:1.2em; line-height:1.5em;}

table{border-collapse: collapse; border: 0; border-spacing: 0}
td{vertical-align: top}

input, select, textarea{font-family: Arial, sans-serif}
img{border: 0;}
a{color: #000; outline: none; text-decoration: none}
a:hover{text-decoration: underline;}
p{margin: 1em 0;}
p.noMargin { margin: 0 }
h1, h2, h3, h4, h5
{
	font-weight: normal;	
}
h1{font-size: 2.5em;}
h2{color: #00649d; font-size: 1.6em; line-height: 1.2em}
h3{font-size: 1.4em; font-weight: bold; line-height:1.4em;}
h4{font-size: 1.2em;}
h5{font-size: 1.0em;}
h1 a, h2 a, h3 a, h4 a, h5 a
{	
	color: #000;
}
small { font-size: .95em }

h2.swfheading {
    color: #00649d; 
    font-size: 3.2em;
    letter-spacing:-2px;
    }
.printSwfType {display:none;}
.swfTypeOffset object {margin-left:-4px;}

.clear{clear: both; height:0px; margin:0;padding:0;line-height:0px;}
.floatLeft{float: left}
.floatRight{float: right}
.inline {display:inline}

/* Header */
#headerOuter
{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-50%;
	width:100%;
	height: 259px;
}

#headerOuter
{
	background: #e0e0e0 url(../images/headerNavBackground.png) 0 0 repeat-x;
	min-width:960px;
}
.home #headerOuter
{
	height: 194px
}

#headerInner
{
	background: transparent url(../images/navigationBottom.png) bottom left no-repeat;
	height: 259px;
	margin: 0 auto;
	position: relative;
	width: 960px;
}
.home #headerInner{ background: transparent; height: 194px }

.header h1
{
	float: left; 
}

#logo
{
	background: url(../images/compassLogo.png) 0 0 no-repeat;
	display: block;
	height: 104px;
	position: absolute;
	left: 0;
	top: 43px;
	text-indent: -999em;
	width: 342px
}

#tagline {
	background: url(../images/expertLink.jpg) 0 0 no-repeat;
	display: block;
	height: 104px;
	position: absolute;
	right: 0;
	text-indent: -999em;
	top: 43px;
	width: 536px
}
.phonenumber {
    position: absolute;
    left: 425px;
    top: 145px;
    text-indent: -9999px;
    background: url(/images/contact.png) no-repeat top left;
    width: 278px;
    height: 23px;
    }

.header ul.nav
{
	bottom: 22px;
	float: left;
	left: 0;
	position: absolute;
	width: 960px;
	list-style-type: none;	
}.home #headerInner ul.nav
{
	bottom: -43px
}

.header ul.nav li
{
	float: left;
}
.header ul.nav li a
{
	background: url(../images/navigation.png) 0 0 no-repeat;
	float: left;
	display: block;
	height: 43px;	
	text-indent: -9999px
}

#btnHome a{ background-position: 0 0; width: 75px }
#btnProfile a{ background-position: -74px 0; width: 124px }
#btnCapabilities a{ background-position: -198px 0; width: 160px }
#btnWhyChooseCompass a{ background-position: -360px 0; width: 248px }
#btnClientsProjects a{ background-position: -607px 0; width: 230px }
#btnContact a{ background-position: -837px 0; width: 123px }

#btnHome a:hover, #btnHome a.on{ background-position: 0 -66px }
#btnProfile a:hover, #btnProfile a.on{ background-position: -74px -66px }
#btnCapabilities a:hover, #btnCapabilities a.on{ background-position: -198px -66px }
#btnWhyChooseCompass a:hover, #btnWhyChooseCompass a.on{ background-position: -360px -66px }
#btnClientsProjects a:hover, #btnClientsProjects a.on{ background-position: -607px -66px }
#btnContact a:hover, #btnContact a.on{ background-position: -837px -66px }


/* Breadcrumb */

ul.breadcrumb 
{
    font-size:0.9em;
    display:block;
    list-style-type:none;
    padding:0;
    margin:0;
}

.breadcrumb li {float:left;}
.breadcrumb li a {color:#00699d;}

/* Content */

.home #sectionOuter
{
	background: transparent url(../images/homeSectionBackgroundExtend.png) 0 0 repeat-x;
	position: absolute;
	top:194px;
	left: 0;
	width:100%;
	height: 369px;
	z-index: -1000;
}
#content, #headerContent
{
	margin: 0 auto; 
	width: 960px;
}
#sectionInner
{
	float: left;
	margin: 0 auto;
	padding-top: 28px;
	width: 960px;	
}
.home #sectionInner { background: url(../images/homeSectionBackground.png) 0 0 no-repeat; height: 303px; padding-top: 63px;  }
#content .clientProjectTop {padding-top: 14px;}
#content .clientsTop, #content .page404Top {padding-top: 27px;}
.clientsTop p {padding:3px 0 10px 0;margin:0;}

#tradeExperts { margin-top: 1em }
#quotes
{
	margin: 1.7em 0;
}
#quotes .aQuote {margin-bottom:20px; float:left;}
.quoteBody
{
	background: #e9eced url(../images/quote300Middle.jpg) 0 0 repeat-y;
	width: 300px;
}

.quoteBody360
{
	background: #e9eced url(../images/quote360Middle.png) 0 0 repeat-y;
	width: 363px;
	padding-top:8px;
}

	.quoteBody p
	{
		padding: 0 20px;
	}
	
	.quoteBody360 p
	{
		padding: 0px 20px;
		line-height:22px;
		margin:9px 0 0 0;
		overflow:visible;
	}
	
td.spacer
{
	background: transparent;
	width: 30px
}
blockquote
{
	float: left;
	line-height: 1.75em;
	margin: 1.5em 0;
	overflow: hidden;
	position: relative;
}

.blockquoteTop, .blockquoteBottom
{
	background-image: url(../images/quote300.jpg);
	background-repeat: no-repeat;
	float: left;
	height: 13px;
	margin: 0;
	width: 300px;
}

.blockquoteTop360, .blockquoteBottom360
{
	background: url(../images/quote360.png) no-repeat;
	float: left;
	height: 13px;
	margin: 0;
	width: 363px;
	display:block;
}

.blockquoteTop, .blockquoteTop360 { background-position: 0 0 }
.blockquoteBottom, .blockquoteBottom360 { background-position: 0 -13px }

.wideQuote { background: #e9eced url(../images/quote550Middle.jpg) 0 0 repeat-y; width: 550px }
.wideQuote .blockquoteTop, .wideQuote .blockquoteBottom
{
	background-image: url(../images/quote550.jpg);
	background-repeat: no-repeat;
	width: 550px
}

.leftQuote, .rightQuote
{
	background: transparent url(../images/blockquotes.png) no-repeat top left;
	display: inline-block;
	height: 20px;
	margin: 0 .25em .25em 0;
	text-indent: -999em;
}
.leftQuote
{
	margin-right: .5em;
	width: 23px;
}
.rightQuote
{
	background-position: -23px 0;
	margin-left:.5em;
	width: 24px;
}


	.quote, .author
	{
		padding: 0 18px 0;
		float:left;
	}
	.quote { padding-top: 10px }
	.author
	{
		font-weight: bold;
	}
	
	.quoteBody360 .author {padding:0px 0 0 18px;margin:4px 0 0 0;}
	
.columnOne
{
	width: 560px
}
	.heading
	{
		text-indent: -999em;
	}
	#profileHeading 
	{
		background: transparent url(../images/profile-heading.png) -1px -1px no-repeat;
		height: 38px;
		width: 550px
	}
	
	#capabilitiesHeading 
	{
		background: transparent url(../images/capabilities-heading.png) -1px -1px no-repeat;
		height: 80px;
		width: 504px
	}
	
	#whyHeading 
	{
		background: transparent url(../images/why-heading.png) 0 0 no-repeat;
		height: 79px;
		width: 329px
	}
	
	#clientsProjectsHeading 
	{
		background: transparent url(../images/clientsprojects-heading.png) 0 0 no-repeat;
		height: 37px;
		width: 625px
	}

	#Page404Heading 
	{
		background: transparent url(../images/pagenotfound-title.png) 0 0 no-repeat;
		height: 33px;
		width: 188px
	}
	
	#clientsProjectsHeadingTwo
	{
		background: transparent url(../images/clientsprojects-headingTwo.png) 0 20px no-repeat;
		height: 101px;
		width: 724px
	}
	
	#testimonialsHeading 
	{
		background: transparent url(../images/testimonials-heading.png) 0 0 no-repeat;
		height: 35px;
		width: 545px
	}
	
	#contractorHeading 
	{
		background: transparent url(../images/contractorregistration-heading.png) 1px 0 no-repeat;
		height: 36px;
		width: 267px
	}
	
	#thanksHeading 
	{
		background: transparent url(../images/thanks-heading.png) 0 0 no-repeat;
		height: 37px;
		width: 247px
	}
	#termsHeading
	{
		background: transparent url(../images/ttl-terms.gif) 0 0 no-repeat;
		height: 37px;
		width: 257px;
		margin-bottom:10px;
	}
	.columnOne ul
	{
		color: #00649d;
		margin: 0 0 1.16em 0;
		list-style:none;
	}
	.columnOne li
	{
		color: #333333;
		background:url(../images/list_item.gif) no-repeat top left;
		padding-left:12px;
	}
	
.columnTwo
{
	width: 360px
}
	.columnTwo img:first-child
	{
		margin: 0
	}
	.columnTwo img
	{
		margin: 1.16em 0
	}

    .columnTwo .sideImage 
    {
        max-width: 360px;
    }

.contactPageLeft
{
	float:left;
	width:320px;
}
.contactPageRight
{
	float:right;
	width:240px;
}

.caption
{
	font-size: 1.1em;
	margin: 0
}


/* Clients & Projects  */


#clientList
{
	overflow: hidden;
	padding-bottom: 0px;
	padding-top:3px;
	margin:0;
}
	#clientList  div
	{
		float: left;
		margin-right: 17px;
		overflow: hidden;
		position: relative;
		padding-bottom:20px;
	}
	#clientList div.lastChild
	{
		margin-right: 0
	}
		#clientList div p
		{
			color: #000;
			font-weight: bold;
			padding:5px 0 0 0;
			margin:0;
			width:175px;
		}
		
		#clientList div .projectname {text-transform:uppercase;}
		
		#clientList  div.clear {clear: both; height:0px; margin:0;padding:0;line-height:0px;}
		
		.storeCount
		{
			background: transparent url(../images/client-dotted.png) top left repeat-x;	
			display: block;
			text-transform: uppercase;
			margin-top:5px;
			padding-top:7px;
		}
		
		.viewProjects 
		{
		    background:url(../images/clients-viewprojects.png) no-repeat top left;
		    width:106px;
		    height:24px;
		    display:block;
		    border:0;
		    text-indent:-9999px;
		    margin-left:-1px;
		}
		    .viewProjects:hover {background-position: bottom left;}

.enlarge 
{
    background:url(../images/enlarge.png) no-repeat center left;
    font-size:1.1em;
    margin:0 0 4px 0;
    padding: 0 0 0 14px;
}

.projCont 
{
    width:575px;
    float:left;
}

.testimonialsCol 
{
    float:right;
    width:365px;
    margin:15px 0 0 15px;
}
.testimonialsCol h2 
{
    text-indent:-9999px;
    background:url(../images/testimonials-heading2.png) no-repeat top center;
    width:128px;
    height:25px;
    display:block;
    margin-left:-6px;
}

.projCont h2.swfheading { margin-top: 8px; height: 38px; }


/* Contact Us */

#contactCompanyh2 { color: #333333; font-weight: bold; margin: 0 }
#contactDetails { margin-bottom: 1em; color:#000000; font-size:1.2em; line-height:1.34em;}
	#contactDetails a { color: #00649d; font-weight: bold }
	.contactTableHead { font-weight: bold }
	#contactDetails .col1 {width:45px;}
#businessDetails {font-size:1.2em; color:#000000; }
#contractorRegistrationButton
{
	background: transparent url(../images/contactus-contractorregistration.png) 0 0 no-repeat;
	display: block;
	height: 32px;
	margin: .25em 0 1.8em;
	width: 171px;
	text-indent: -999em
}
#contractorRegistrationButton:hover {background-position: 0 -32px;}
#newClientButton
{
	background: transparent url(../images/contactus-newclient.png) 0 0 no-repeat;
	display: block;
	height: 32px;
	margin: .25em 0 1em;
	width: 133px;
	text-indent: -999em
}
#newClientButton:hover {background-position:0 -32px;}
#backButton
{
	background: transparent url(../images/thanks-back.png) 0 0 no-repeat;
	display: block;
	height: 32px;
	margin: 0 0 1em;
	width: 153px;
	text-indent: -999em
}
#backButton:hover {background-position:0 -32px;}
	/* Contractor Registration */
	fieldset
	{
		border: none;
		background: transparent url(../images/dotted.png) bottom left repeat-x;		
		margin: 0;
		padding: 0 0 18px;
	}
	
	legend
	{
		font-weight: bold;
		padding: 12px 0 6px;
	}

	label
	{
		display: block;
		margin-top: 7px;
	}
	label.marginTop3 {margin-top:3px;}
	.inlineSection
	{
		border: none;
		overflow: hidden;
		padding: 0
	}
	
	.inlineSection div
	{
		float: left;

	}
		.inlineSection div input
		{
			margin-right: 8px
		}
	
	.textBox
	{
		border: 1px solid #02629e;
		font-family: Arial, sans-serif;
		padding: 1px;
		margin-top:1px;
	}
	
	
	.w413 { width: 413px }
	.w198 { width: 198px }
	.w58 { width: 58px }
	.w165 { width: 165px }
	.w96 { width:96px }
	.formError {border:1px solid #F00 !important;}
	.errorBox {color:#F00;}
	
	.invalid { background-color: #ddf }
	
	#submitButton 
	{
		border: none;
		height: 32px;
		padding: 0;
		width: 59px
	}

/* Footer */
.footer
{
	background: transparent url(../images/dotted.png) top left repeat-x;
	color: #a7a9ac;
	float: left;
	font-size: .875em;
	margin-top: 15px;
	padding: 5px 0 43px;
	width: 960px
}

.footer p { margin: 0 }
.footer p a
{
	color: #a7a9ac;
}
.footer p.footerLeft
{
	float: left;
	width: 600px;
}
.footer p.footerRight
{	
	float: right;
	text-align: right;
	width: 360px;
}
.footer p.address { font-size: 12px; margin-top: 10px; }

.gallery {}
.gallery .images {display:none;}
.none {display:none;}

.btnBackToProjects 
{
    display:block;
    background: transparent url(../images/btn_back_to_projects.png) top left no-repeat;
    width:160px;
    height:32px;
    text-indent:-99999px;
    clear:both;
    margin-bottom:15px;
}

.btnBackToProjects:hover {background-position: 0 -32px;}