@charset "UTF-8";
/* Haylock and Pittman CSS */

* { margin: 0; }
body { width: 100%; }

/* Branding */
#branding {
	background: url('images/branding.jpg') no-repeat;
	height: 111px;
}
	#branding h1 {
		margin: 0;
		padding: 0;
	}
	#branding p {
		font-size: 0.9em;
		margin-bottom: 0;
	}
	#branding #persistent_text {
		float: right;
		text-align: right;
		margin: 30px 5px 0 0;
	}
		#branding #persistent_text p { line-height: 1.5em; }
		.number {
			font-size: 1.4em;
			color: #005B4A;
		}
		#branding #persistent_text a {
			font-size: 1em;
			color: #005B4A;
			text-decoration: none;
		}
		#branding #persistent_text a:hover { color: #737778; }

/* Main Content Area */
#main {
	background: url('images/sideline.gif') repeat-y;
	padding-left: 6px;
}
	
	/* Main Menu */
	div#menu {
		background-color: #E5EEED;
		clear: right;
		padding: 2px 0;
	}
		div#menu ul {
			list-style: none;
			padding: 0;
		}
			div#menu ul li {
				float: left;
				font-size: 0.8em;
				font-weight: bold;
				margin: 0 20px 0 5px;
			}
				div#menu ul li a {
					background: url('images/menu_bullet.gif') no-repeat;
					background-position: 0 50%;
					color: #005B4A;
					text-decoration: none;
					padding-left: 15px;
				}
				div#menu ul li a:hover {
					background-position: -493px 50%;
					color: #737778;
				}
	
	/* Content */
	#content {
		background: url('images/house.jpg') no-repeat right bottom;
		padding: 20px 10px;
		min-height: 594px;
	}
	
		/* Left Area Menu */
		#left {
			float: left;
			width: 13em;
		}
			#left h3 {
				background-color: #E5EEED;
				color: #005B4A;
				font-weight: normal;
				font-size: 1em;
				border-left: 3px solid #005B4A;
				padding: 2px 2px 2px 10px;
				margin-bottom: 10px;
			}
			#left ul {
				list-style: none;
				padding: 0;
			}
				#left ul li {
					font-size: 0.7em;
					margin-bottom: 10px;
					height: auto;
				}
					#left ul li a {
						background: url('images/menu_bullet.gif') no-repeat;
						background-position: 3px 50%;
						display: block;
						text-decoration: none;
						color: #006C5B;
						font-weight: bold;
						padding:  2px 2px 2px 15px;
					}
					#left ul li a:hover {
						background-color: #E5EEED;
						background-position: -490px 50%;
						color: #5A9D8B;
					}
						#left ul li ul { margin-left: 13px; }
							#left ul li ul li {
								font-size: 0.9em;
								margin: 0;
							}
								#left ul li ul li a {
									background: none;
									font-weight: normal;
									padding: 2px;
								}
								#left ul li ul li a:hover { color: #006C5B; }
	
		/* Main Content */
		#maincontent { margin-left: 15em; margin-right: 5em; }
			#maincontent h2 {
				color: #005B4A;
				font-weight: bold;
				font-size: 0.9em;
				margin-bottom: 0.8em;
			}
			#maincontent div.slider_right {
				float: right;
				margin: 0.8em 5em 0 360px;
			}
			#maincontent ul.checklist {
				list-style: none;
				padding: 0;
			}
				#maincontent ul.checklist li {
					background: url('images/tick.gif') no-repeat;
					background-position: 0 -3px;
					line-height: 1.6em;
					padding-left: 30px;
				}
					#maincontent ul.checklist li ul { list-style: none; }
						#maincontent ul.checklist li ul li { background: none; }
			#maincontent ul.larger li { font-size: 0.8em; }
				#maincontent ul.larger li ul { padding-left: 0; }
					#maincontent ul.larger li ul li { font-size: 0.9em; }
			
			/* Projects Slider */
			#slider {
				float: left;
				margin-bottom: 1.2em;
				position: absolute;
			}
				#navigate {
					width: 331px;
					background-color: #016C5A;
					height: 1.2em;
					line-height: normal;
					padding: 2px 5px 2px 2px;
				}
					#navigate h3 {
						font-weight: normal;
						font-size: 0.9em;
						color: #FFFFFF;
					}
					#navigate p {
						float: right;
						color: #FFFFFF;
						margin-top: 0.2em;
						margin-bottom: 0;
					}
					#navigate a {
						display: block;
						float: left;
						height: 17px;
						width: 30px;
					}
					.pagination {
						text-align: right;
						float: right
					}
				.sliderwrapper {
					float: left;
					overflow: hidden;
					width: 338px;
					height: 230px;
				}
					.sliderwrapper .contentdiv {
						visibility: hidden;
						position: absolute;
						left: 0;
						top: 0;
						width: 338px;
						height: 100%;
					}
						.contentdiv p {
							height: 50px;
							line-height: 20px;
							position: relative;
							top: -50px;
							font-size: 13px;
							color: #FFFFFF;
							padding: 5px;
						}
							.contentdiv p a {
								text-decoration: none;
								color: #fff !important;
								font-weight: 100 !important;
							}
								.contentdiv p a span {
									position: absolute;
									right: 5px;
									bottom: 13px;
									line-height: normal;
									text-transform: uppercase;
									font-size: 18px;
									cursor: pointer;
								}
			
			/* Service Boxes */
			.serviceBox {
				height: 74px;
				width: 194px;
				float: left;
				color: #006C5B;
				margin: 0 2px;
				padding: 130px 5px 5px 5px;
			}
			#refurbishment { background: url('images/box-referb.jpg') no-repeat; }
			#decorating { background: url('images/box-decorating.jpg') no-repeat; }
			#extensions { background: url('images/box-extensions.jpg') no-repeat; }
				.serviceBox h3, .serviceBox p { font-size: 11px; }
				.serviceBox h3 { margin-bottom: 4px; }
				.serviceBox ul {
					list-style: inside;
					padding-left: 30px;
				}
					.serviceBox ul li { line-height: 13px; }
						.serviceBox ul li a { font-weight: normal !important; }
				.serviceBox a {
					color: #006C5B;
					text-decoration: none;
				}
				.serviceBox a:hover { text-decoration: underline; }
			
			/* Two Column Text Layout */
			.column1, column2 {
				width: 40%;
				float: left;
			}
			.column1 { margin-right: 12.5%; }
			.column2 { margin-left: 10%; }
				
				/* Accreditation Page Styles */
				.accreditation {
					width: 90%;
					position: relative;
				}
					.logo {
						width: 120px;
						height: 50px;
					}
					.description {
						position: relative;
						left: 120px;
						top: -50px;
					}
			
			/* Project Page */
			.project_summary {
				float: left;
				width: 443px;
				padding: 15px 0;
			}
			.project_details {
				float: right;
				width: 190px;
				background-color: #E5EEED;
				padding: 5px 5px;
				border-left: 5px solid #005B4A;
				margin: 0 0 10px 10px;
			}
				.project_details h3 { margin-bottom: 20px; }
				p.info {
					font-weight: bold;
					color: #005B4A;
					visibility: hidden;
				}
					p.info span.value {
						float: right;
						margin-right: 50px;
						visibility: hidden;
					}
				.project_details blockquote {
					color: #666666;
					font-weight: bold;
					font-style: italic;					
				}
			
		/* Right Box */
		#right {
			width: 244px;
			background: url('images/right-box.gif') no-repeat;
			float: right;
			margin-right: -10px;
			margin-top: 5%;
			padding: 25px 0 10px 30px;
		}
			#right .close {
				background: url('images/close-right-box.gif') no-repeat;
				margin: -20px 0 -10px -30px;
				width: 274px;
				height: 44px;
			}
			#right h2 {
				font-size: 0.9em;
				width: 240px;
				color: #005B4A;
				margin-bottom: 15px;
			}
			#right ul {
				list-style: none;
				padding: 0;
				margin: 0;
				width: 140px;
			}
				#right ul li {
					height: 71px;
					margin-bottom: 15px;
				}
					#right ul li a { text-decoration: none; }
						#right ul li span.text {
							position: relative;
							top: -30px;
							left: 100px;
							display: block;
							font-size: 1.1em;
						}

	/* Footer */
	#footer {
		background-color: #006C5B;
		position: relative;
		text-align: center;
		color: #FFFFFF;
		font-size: 0.9em;
	}
		#footer p { margin-bottom: 0; }
		#footer a { color: #FFFFFF; }

/* Typography */
p, li, h2, h3, h4, blockquote, label { font-family: Verdana, Arial, Helvetica, sans-serif; }
p, li, blockquote, label { font-size: 0.7em; }
p { margin-bottom: 1.5em; }
.caption {font-size: 0.6em; color: #999999;}
h3, h4 { color: #005B4A; }
h3 { font-size: 0.8em; }
h4 { font-size: 0.7em; }
p.credit {
	text-align: right;
	margin-top: 0;
	padding-top: 0;
}
#content a {
	font-weight: bold;
	color: #005B4A;
}
.bold {
	font-weight: bold;
	color: #005B4A;
	font-size: 1em;
}

/* Other */
a img { border: none; }
.clear { clear: both; }
a#skip {
	display: none;
	visibility: hidden;
	text-indent: -9000em;
}
a:focus { outline: none; }

blockquote { font-size: 1.0em; line-height: 1.1em; }
p.credit { color: #006C5B; }
.clear { clear: both; }
h2.clear { padding: 10px 0 0 0; }
.refurbishment #right { margin-left: 10px; }

.quote { background: #016C5A url(images/corner-br.gif) bottom right no-repeat; padding: 10px; display: inline-block; }
.quote h4 { font-size: 10pt; background: url(images/corner-tr.gif) top right no-repeat; margin: -10px -10px 0 0; padding: 10px 0 0 0; }
.quote li, .quote label, .quote h4 { color: #fff; }
.quote li { list-style: none; padding: 0 0 0 20px; background: #016C5A url(images/tick2.gif) 0 0 no-repeat; }
.quote label { display: block; margin: 5px 0; text-transform: uppercase; }
.quote label input, .quote label select { display: block; width: 180px; margin: 5px 0 0; text-transform: none; }
.quote input.submit { padding: 3px 15px; display: block; margin: 5px auto; }
.quote ul { }
.quote ul.errors { margin: 6px 0 0 0; }
.quote ul.errors li { background: none; padding: 0; }
.quote ul.errors li label { font-size: 1.1em; color: #f99; display: inline; font-weight: 700; }
#left .quote ul li a { color: #fff; display: inline; }
#left .quote a:hover { background: #016C5A; }