/*
   HTML and styles done by Bogey Web Design
   www.bogeywebdesign.com
*/

body{
	font: 62.5%/1.2em Verdana, Helvetica, Arial, sans-serif;
	padding: 1em;
	background: #366 url(../images/bgGradient.gif) repeat-x;
}

body.popup {
	background: #ccc;
}

*{
	margin: 0;
	padding: 0;
}

a{
	text-decoration: none;
	color: #006;
}

a:hover, a:visited{
	text-decoration: underline;
	color: #366;
}

a img{
	border: 0;
}

hr {
	margin: 0 0 1em;
	background: #ccc;
	border: 0;
}

p, blockquote {
	font: 1.2em/1.4em Verdana, Helvetica, Arial, sans-serif;
	margin: 0 0 1em;
}

blockquote {
	font-style: italic;
}

ul {
	margin: 0 0 1em;
}

	li {
		font: 1.2em/1.4em Verdana, Helvetica, Arial, sans-serif;
		margin: 0 0 1em;
		list-style: inside;
	}

	ul.none li {
		list-style-type: none;
	}
	
h1, h2, h3, h4 {
	margin: 0 0 1em;
}

h2, h3 {
	font-size: 1.55em;
	line-height: 1.35em;
	margin: 0 0 .8em;
	color: #036;
}

#wrapper{
	position: absolute;
	width: 926px;
	top: 0;
	left: 50%;
	margin-left: -463px;
	background: url(../images/mainBg.gif) top left no-repeat;
}

#content{
	float: right;
	width: 592px;
	padding: 0 28px 10px 0;
}

	ul#mainNav {
		float: right;
	}

		ul#mainNav li {
			float: left;
			display: inline;
		}
		
			ul#mainNav a {
				height: 56px;
				float: left;
			}
		
			ul#mainNav #home a {
				width: 127px;
				background: url(../images/homeButton.gif) top left no-repeat;
			}
		
			ul#mainNav #credentials a {
				width: 125px;
				background: url(../images/credentialButton.gif) top left no-repeat;
			}
		
			ul#mainNav #services a {
				width: 129px;
				background: url(../images/servicesButton.gif) top left no-repeat;
			}
		
			ul#mainNav #gallery a {
				width: 132px;
				background: url(../images/galleryButton.gif) top left no-repeat;
			}
			
			ul#mainNav #home a:hover, ul#mainNav #credentials a:hover, ul#mainNav #services a:hover, ul#mainNav #gallery a:hover {
				background-position: 0 -56px;
			}
			
			ul#mainNav #home.on a, ul#mainNav #credentials.on a, ul#mainNav #services.on a, ul#mainNav #gallery.on a {
				background-position: 0 -112px;			
			}
			
				ul#mainNav a span, #contactInfo a span, #page h1#mainHdr span {
					position: absolute;
					left: -5000px;
				}
				
	#content #page {
		clear: both;
	}
	
		#content #page h1 {
			background: url(../images/indexHeader.gif) top left no-repeat;
			width: 594px;
			height: 38px;
			margin: 0;
		}
		
		#content #page h1.featured {
					background: url(../images/featuredHeader.gif) top left no-repeat;
		}
		
		#content #page h1.credentials {
			background: url(../images/credentialsHeader.gif) top left no-repeat;
		}
		
		#content #page h1.services {
			background: url(../images/servicesHeader.gif) top left no-repeat;
		}
		
		#content #page h1.gallery {
			background: url(../images/galleryHeader.gif) top left no-repeat;
		}
		
		#content #pageContent {
			background: url(../images/bodyBg.gif) bottom left no-repeat;
			width: 554px;
			padding: 20px;
			margin: 0 0 1em;
		}
		
			#content #pageContent img {
				clear: both;
				display: block;
				margin: 0 auto 1em;
				border: 1px solid #999;
			}
			
			#content #pageContent ul.star {
				overflow: auto;
				margin: 0 0 2em;
			}
			
				#content #pageContent ul.star li {
					float: left;
					width: 245px;
					margin-left: 10px;
					background: url(../images/starBullet.gif) center left no-repeat;
					padding-left: 20px;
					font-weight: bold;
					color: #036;
				}
				
			#content #pageContent #services {
				padding-top: 1em;
			}
				
				#content #pageContent #services h3 {
					background: url(../images/bannerBg.gif) center left no-repeat;
					color: #fff;
					padding: .4em .5em;
					font-size: 1.35em;
				}
				
				#content #pageContent #services p {
					padding-left: 1em;
				}
				
			#content #pageContent ul#staff li {
				border-top: 1px solid #999;
				padding-top: 1em;
				overflow: auto;
				font-size: 1em;
			}
				
				#content #pageContent ul#staff img {
					float: left;
					margin: 0 1em 0 0;
				}
				
				#content #pageContent ul#staff p {
					margin-left: 100px;
				}
				
					#content #pageContent ul#staff p strong {
						color: #036;
						margin: 0 0 -1em;
						display: block;
					}

	#content #footer {
		text-align: center;
	}
	
		#content #footer p {
			margin: 0 0 .5em;
		}
	
		#content #footer li {
			font-size: 1.1em;
			display: inline;
			padding-right: 10px;
			font-weight: bold;
		}
		
		#content #footer li.last {
			padding: 0;
		}
	
#left{
	float: left;
	width: 254px;
	padding: 110px 10px 10px 26px;
}

	ul#language {
		overflow: auto;
	}

		ul#language li {
			padding: 2px 5px;
			float: left;
			margin: 0 5px 0 0;
		}
		
		ul#language li.on {
			border: 1px solid #999;
		}

	#cms, #contactInfo, #featProject {
		background: url(../images/boxTop.gif) top left no-repeat;
		padding-top: 8px;
	}
	
		#cms .inner, #contactInfo .inner, #featProject .inner {
			background: url(../images/boxBottom.gif) bottom left no-repeat;
			margin: 0 0 1em;
			padding: 1.2em 2em 1em;
		}
		
		#contactInfo .inner, #featProject .inner {
			background: url(../images/boxBottomGrad.gif) bottom left no-repeat;
			overflow: auto;
		}
		
		#contactInfo h2 {
			font-size: 1.35em;
		}
			
		#contactInfo ul {
			margin-bottom: 2em;
		}
		
			#contactInfo ul li {
				margin: 0 0 .6em;
			}
			
		#contactInfo a {
			float: left;
			margin: 0 0 1em 22px;
			width: 170px;
			height: 26px;
		}
			
		#contactInfo a.testimonial {
			background: url(../images/testimonialButton.gif) top left no-repeat;
		}
			
		#contactInfo a.terms {
			background: url(../images/termsButton.gif) top left no-repeat;
		}
			
		#contactInfo a.contact {
			background: url(../images/contactButton.gif) top left no-repeat;
		}
		
		#contactInfo a.ethicalstandards {
					background: url(../images/EthicalButton.gif) top left no-repeat;
		}
			
		#contactInfo a.testimonial:hover, #contactInfo a.terms:hover, #contactInfo a.contact:hover, #contactInfo a.ethicalstandards:hover {
			background-position: 0 -26px;
		}
			
			#featProject img {
				border: 1px solid #999;
				margin: 0 0 1em;
			}
			
			#featProject a {
				float: right;
				font-weight: bold;
				font-size: 1.1em;
			}
			
		ul.galleryLinks {
			overflow: auto;
		}
			
			ul.galleryLinks li {
				float: left;
				margin: 0 1em 0 0;
			}
			
				ul.galleryLinks li a {
					width: 145px;
					height: 22px;
					display: block;
				}
				
				ul.galleryLinks li#residential a {
					background: url(../images/residential.gif) top left no-repeat;
				}
				
				ul.galleryLinks li#residential.on a {
					background: url(../images/residentialOn.gif) top left no-repeat;
				}
				
				ul.galleryLinks li#commercial a {
					background: url(../images/commercial.gif) top left no-repeat;
				}
				
				ul.galleryLinks li#commercial.on a {
					background: url(../images/commercialOn.gif) top left no-repeat;
				}
				
	#featuredGallery {
		overflow: auto;
	}
				
		#content #featuredProject img {
			float: left;
			clear: none;
			margin-left: 10px;
		}
		
		#content #featuredProject img.left1 {
			margin: 0 10px 0 40px;
		}

#bottom {
	clear: both;
	background: url(../images/footer.gif) top left no-repeat;
	width: 924px;
	height: 42px;
}

	#bottom img {
		float: right;
		padding: 10px;
	}
	
	
/* popup */
div#popup {
	position: absolute;
	width: 578;
	top: 12px;
	left: 50%;
	margin-left: -289px;
	background: url(../images/popupBgTop.gif) top left no-repeat;
	padding-top: 16px;
}

	div#popup div.inner {
		background: url(../images/popupBgBot.gif) bottom left no-repeat;
		padding: 0 23px 21px 21px;
	}
	
		div#popup div.inner div {
			height: 590px;
			overflow: auto;
			padding-right: 5px;
		}
		
	div#popup div.inner img {
		float: right;
		margin: 1em;
	}
		
		div#popup div.inner a img {
			float: left;
		}
		
	div#popup div.inner p {
		clear: both;
	}
		
		div#popup div.inner p strong {
			color: #036;
		}
		
	div#popup div.inner li {
		margin-left: 1em;
	}
	
	div#popup div.inner blockquote {
		text-indent: 1em;
		margin: 0;
	}
	
	div#popup div.inner p.byline {
		text-indent: 1em;
		font-weight: bold;
		margin: 0 0 1.5em;
	}
	
/* featured project page */
#featuredProject {
	padding: 1em;
	background: #333;
}

	.featuredLink {
		float: right;
		margin-top: -2.2em;
		font-size: 1.2em;
	}

	#featuredProject #featuredContent, #featuredProject #galleryContent {
		background: #fff url(../images/featuredGrad.gif) top left repeat-x;
		padding: 3em 1em 0;
		border: 1px solid #ccc;
	}
	
	
/* Gallery CSS
   Modified version of code done by Stu Nicholls of CSSplay
   http://www.cssplay.co.uk/menu/scroll_gallery
*/

#mainGallery {
	position: relative;
	background: url(../images/placeholder.gif) center 10px no-repeat;
	margin-bottom: 1em;
	z-index: 1;
	padding-top: 360px;
}

#content #featuredProject img {
	border: 1px solid #fff;
}

#scrollbox {
	padding: 1em;
	height: 190px;
	margin-left: 20px;
}

a.gallery, a.gallery:visited {
	display: block;
	text-decoration: none;
	width: 200px;
	height: 124px;
	margin: 0 10px 10px 0;
	float: left;
	border: 1px solid #999;
}

#mainGallery a.gallery, #mainGallery a.gallery:visited {
	width: 84px;
	height: 84px;
}

/* gallery page gallery */
/* commercial */
#mainGallery a.slidea {
	background: url(../images/gallery/comm1_nail.jpg) top left no-repeat;
}

#mainGallery a.slideb {
	background: url(../images/gallery/comm2_nail.jpg) top left no-repeat;
}

#mainGallery a.slidec {
	background: url(../images/gallery/comm3_nail.jpg) top left no-repeat;
}

#mainGallery a.slided {
	background: url(../images/gallery/comm4_nail.jpg) top left no-repeat;
}

#mainGallery a.slidee {
	background: url(../images/gallery/comm5_nail.jpg) top left no-repeat;
}

#mainGallery a.slidef {
	background: url(../images/gallery/comm6_nail.jpg) top left no-repeat;
}

#mainGallery a.slideg {
	background: url(../images/gallery/comm7_nail.jpg) top left no-repeat;
}

#mainGallery a.slideh {
	background: url(../images/gallery/comm8_nail.jpg) top left no-repeat;
}

#mainGallery a.slidei {
	background: url(../images/gallery/comm9_nail.jpg) top left no-repeat;
}

/* residential */
#mainGallery.residential a.slidea {
	background: url(../images/gallery/res1_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slideb {
	background: url(../images/gallery/res2_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slidec {
	background: url(../images/gallery/res3_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slided {
	background: url(../images/gallery/res4_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slidee {
	background: url(../images/gallery/res5_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slidef {
	background: url(../images/gallery/res6_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slideg {
	background: url(../images/gallery/res7_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slideh {
	background: url(../images/gallery/res8_nail.jpg) top left no-repeat;
}

#mainGallery.residential a.slidei {
	background: url(../images/gallery/res9_nail.jpg) top left no-repeat;
}

a.gallery:active img, a.gallery:focus img {
	z-index: 50;
}

a.gallery span {
	display: none;
}

a.gallery:hover {
	white-space:normal;
} /* IE6 */

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {
	display: block;
	position: absolute;
	width: 500px;
	height: 350px;
	top: 0px;
	left: -15px;
	padding: 5px;
	z-index: 100;
}

a.gallery:active span, a.gallery:focus span {
	z-index: 50;
}
	