@charset "UTF-8";

html, body {
	font-size: 100%;
	margin: 0;
	padding: 0;
}
body {
	background: black url(../images/layout/pageBackground.jpg) top repeat-x;
}
#container {
	width: 960px;
	margin: 0 auto;
	position: relative;
	font-family: "Lucida Grande", Helvetica, sans-serif;
}
	#container a {
		color: #FFBE24;
	}
#container #header {
	margin: 0;
	height: 90px;
	position: relative;
}
#container #header a#logo {
	width: 253px;
	height: 62px;
	position: absolute;
	top: 16px;
	left: 50px;
	background: url(../images/layout/logo.jpg) no-repeat;
	overflow: hidden;
	text-indent: -3000px;
}
#container #header span.slogan {
	display: block;
	width: 328px;
	height: 17px;
	position: absolute;
	top: 16px;
	left: 582px;
	background: url(../images/layout/slogan.jpg) no-repeat;
	overflow: hidden;
	text-indent: -3000px;
}
#container #header ul.navigation {
	display: block;
	list-style: none;
	position: absolute;
	bottom: 0;
	right: 50px;
	margin: 0;
	padding: 0;
}
	#container #header ul.navigation li {
		font-size: 12px;
		display: block;
		float: left;
		margin-left: 1em;
	}
		#container #header ul.navigation li a {
			float: left;
			text-decoration: none;
			color: #CCCCCC;
			height: 1.5em;
		}
		#container #header ul.navigation li.active a {
			border-bottom: 5px solid #FFBE24;
		}
		#container #header ul.navigation li a:hover {
			border-bottom: 5px solid #FFBE24;
		}
#container #photoExplorer {
	height: 300px;
	width: 960px;
}
#container #content {
	padding: 15px 45px 15px 45px;
}
	#container #content div {
		position: relative;
	}
#container #content h1 {
	margin: 0;
	padding: 0 0 15px 23px;
	color: white;
	font-size: 20px;
	font-weight: normal;
}
#container #content h2 {
	color: white;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
	#container #content h2 a {
		text-decoration: none;
		color: white;
		padding-right: 50px;
		background: url(../images/layout/arrowsOnShortGray.gif) right no-repeat;
	}
		#container #content h2 a:hover {
			text-decoration: underline;
		}
		#container #content .tall h2 a {
			background: url(../images/layout/arrowsOnTallGray.gif) right no-repeat;
		}
		#container #content .featured h2 a {
			background: url(../images/layout/arrowsOnBlue.gif) right no-repeat;
		}
#container #content h3 {
	color: white;
	font-size: 11px;
}
#container #content p, #container #content li {
	font-size: 11px;
	color: white;
	line-height: 1.5em;
}
#container #content ul {
	padding: 0;
	margin: 15px 0 0 0;
}
	#container #content ul li {
		list-style: none;
		background: url(../images/layout/bullet.gif) left .6em no-repeat;
		padding: 0 0 0 9px;
		margin: 0 0 .5em 0;
	}

#container #content img {
	border: none;
}
#container #content .short {
	float: left;
	padding: 15px 20px 15px 20px;
	margin: 0 5px 0 5px;
	width: 240px;
	background: black url(../images/layout/grayShortBox.jpg) left top repeat-x;
}
#container #content .short.highlighted {
	background-image: url(../images/layout/yellowShortBox.jpg);
}

#container #content .tall {
	float: left;
	padding: 15px 20px 15px 20px;
	margin: 0 5px 0 5px;
	width: 240px;
	background: black url(../images/layout/grayTallBox.jpg) left top repeat-x;
}
	#container #content .tall.wide, #container #content .short.wide {
		width: 530px;
	}
	#container #content .tall.fullWidth, #container #content .short.fullWidth {
		width: 820px;
	}
	#container #content .tall.featured {
		background: black url(../images/layout/blueTallBox.jpg) left top repeat-x;
	}
	#container #content .tall.highlighted {
		background-image: url(../images/layout/yellowTallBox.jpg);
	}


#container #content .wide p {
	width: 245px;
}
	#container #content .wide.full p {
		width: 100%;
	}
#container #content .tall.wide .productThumbnails {
	width: 230px;
	position: absolute;
	top: 3em;
	right: 13px;
}
	#container #content .tall.wide .productThumbnails img {
		border: 4px solid #666666;
		width: 58px;
		float: left;
		margin: 0 5px 20px 5px;
	}
		#container #content .tall.wide .productThumbnails a:hover img {
/*			border: 4px solid #999999;*/
		}
#container #content .jobPhotos {
	width: 240px;
	margin-left: 0px;
	margin-top: 18px;
}
	#container #content .jobPhotos img {
		border: 4px solid #FF9900;
		width: 58px;
		float: left;
		margin: 0 7px 20px 7px;
	}
		#container #content .jobPhotos a:hover img {
			border: 4px solid #FFBE24;
		}

p a.services {
	padding-left: 13px;
	background: black url(../images/icons/bolt.gif) bottom left no-repeat;
}
p a.contact {
	padding-left: 13px;
	background: black url(../images/icons/mobile.gif) bottom left no-repeat;
}

#container #footer {
	clear: both;
	background: url(../images/layout/grayShortBox.jpg) left top repeat-x;
	height: 100px;
	margin: 15px 50px 0 50px;
	padding: 15px 20px 15px 20px;
}
	#container #footer p {
		font-size: 11px;
		color: white;
	}

#container #content div.error {
	width: 530px;
}
	#container #content div.error p, #container #content div.error li {
		color: #FFBE24;
	}
	
#container #content table {
	margin-top: .5em;
}

#container #content td {
	padding: 5px;
	color: white;
	font-size: 11px;
}

#container #content th {
	padding: 5px;
	text-align: right;
	vertical-align: top;
	color: white;
	font-size:  11px;
}

#container #content p.sentEmailLabel strong {
	color: #FFBE24;
}