/* CSS Document */



#pageContainer {

	width: 780px;

	margin: 25px auto 0px auto;

	

	position:relative;

}



#footer {

	width: 780px;

	margin:0px auto 0px auto;

	position:relative;

	padding: 10px 0px 10px 72px;

	font-size:11px;

	color:#ffffff;

}

#footer a {

	margin: 0 20px;

	color: #ffffff;

	text-decoration:none;

}

#footer a:hover {

	color: #ffff00;

	text-decoration:none;

}



/* =================================================================

	Menu bar on the left

/ ================================================================= */



#menuBar {

	width: 25px;

	height: 530px;

	padding: 0px;

	margin: 0px;

	position:relative;

	float:left;

	z-index: 101;

}



/* 1px extra height for each button becasue IE6 get the bottom margin all wrong if you try to use that */



#menuBar a.contact {

	background-image:url(/images/buttons/contact.png);

	height: 95px;

}

#menuBar a.awards {

	background-image:url(/images/buttons/awards.png);

	height: 96px;

}



#menuBar a.clients {

	background-image:url(/images/buttons/clients.png);

	height: 73px;

}



#menuBar a.press {

	background-image:url(/images/buttons/press.png);

	height: 74px;

}



#menuBar a.caseStudies {

	background-image:url(/images/buttons/case_studies.png);

	height: 117px;

}



#menuBar a.gallery {

	background-image:url(/images/buttons/gallery.png);

	height: 77px;

}





#menuBar a {

	display:block;

	width: 25px;

	overflow:hidden;

	border:none;

	background-repeat:no-repeat;

	background-position:-70px 0;

	text-indent: 50px;

	margin-bottom: 0px;

	text-decoration:none;

}



#menuBar a:hover {

	background-position:-35px 0;

	text-decoration:none;

}



#menuBar a img {

	border:none;

}









/* =================================================================

	Other main page elements

/ ================================================================= */





#top {

	height: 141px;

	margin:0 0 1px 26px;

	background-color:#333333;

	position:relative;

}



#top #mainLogo {

	position:absolute;

	right: 30px;

	top: 40px;

}



#top #callUs {

	width: 400px;



	position: absolute;

	left: 40px;

	top: 50px;



	padding: 0px;



}



#middle {

	height: 150px;

	margin:0 0 0px 26px;

	background-color:#333333;

	position:relative;

	background-repeat:no-repeat;

}





#middle #headingBG {

	display:block;

	position:absolute;

	width: 690px;

	height: 35px;

	bottom: 0px;

	left: 30px;

	background-color:#333333;

	filter:alpha(opacity=70);

	opacity: 0.7;

	-moz-opacity:0.7;

	KHTMLOpacity:0.7;

}



.middlePath {

	background-image:url(/images/middle/path.jpg);

}

.middleBoy {

	background-image:url(/images/middle/boy.jpg);

}

.middleFence {

	background-image:url(/images/middle/fence.jpg)

}

.middleLeaves {

	background-image:url(/images/middle/leaves.jpg);

}

.middleSlabs {

	background-image:url(/images/middle/slabs.jpg);

}



.middle1 {

	background-image:url(/images/middle/1.jpg);

}

.middle2 {

	background-image:url(/images/middle/2.jpg);

}

.middle3 {

	background-image:url(/images/middle/3.jpg);

}

.middle4 {

	background-image:url(/images/middle/4.jpg);

}

.middle5 {

	background-image:url(/images/middle/5.jpg);

}

.middle6 {

	background-image:url(/images/middle/6.jpg);

}

.middle7 {

	background-image:url(/images/middle/7.jpg);

}

.middle8 {

	background-image:url(/images/middle/8.jpg);

}

.middle9 {

	background-image:url(/images/middle/9.jpg);

}



.middle10 {

	background-image:url(/images/middle/10.jpg);

}



#middle h1 {

	position: absolute;

	left: 55px;

	bottom: 7px;

	font-size:14px;



	font-weight:normal;

	padding: 0px;

	margin: 0px;

}



#bottom {

	height: 218px;

	background-color:#333333;

	margin:1px 0 0px 26px;

	

	position:relative;

	

	padding: 10px 30px 10px 30px;	

}


