/** Shop Steel Stylesheet **/


/** 1. Layout **/
* {
	margin:			0px;
	padding:		0px;
	border:			0px;
	font-family:	arial;
}

body  { 
	margin:			0px;
	padding:		0px;
	border:			0px;
}

div#wrapper {
	margin:			0 auto;
	padding-top:	0;
	width:			1000px;
}
div#top-container {
	width:			950px;
	height:			123px;
	float:			left;
	background:		url('../images/banner-bg.png') repeat-x; 
}
div#logo-container {
	width:			288px;
	height:			87px;
	float:			left;
	background:		url('../images/shopsteel-logo.png') no-repeat;
}
div#menu-holder {
	width:			99%;
	padding-left:	1%;
	float:			left;
	height:			36px;
}
div#top-image {	
	width:			950px;
	height:			218px;
	float:			left;
}

div#content-area {
	width:			948px;
	_height:		450px;
	min-height:		450px;
	float:			left;
	border:			1px solid #d8d8d8;
	border-top:		0px;
}


/** 2. Menu **/
ul li {
	list-style-type:	none;
	float:				left;
}

ul li a {
	float:			left;	
	height:			36px;
	padding:		0px 2px 0 2px;
}

ul li a.home {
	width:			84px;
	background:		url('../images/home.jpg') no-repeat;
}
ul li a.services {
	width:			108px;
	background:		url('../images/about-us.jpg') no-repeat;
}
ul li a.projects {
	width:			108px;
	background:		url('../images/projects.jpg') no-repeat;
}
ul li a.contact-us {
	width:			126px;
	background:		url('../images/contact-us.jpg') no-repeat;
}

ul li a:hover {
	background-position:	 0 100%;
}

/** 3. bg images */

div#top-image div {
	width:			950px;
	height:			218px;
	float:			left;
}
div#top-image div.home-top {
	background:		url('../images/home-top.jpg') no-repeat;
}
div#top-image div.services-top {
	background:		url('../images/services-top.jpg') no-repeat;
}
div#top-image div.projects-top {
	background:		url('../images/projects-top.jpg') no-repeat;
}
div#top-image div.contactus-top {
	background:		url('../images/contactus-top.jpg') no-repeat;
}

/** Content area **/

div#content-area div#home {
	width:			908px;
	_height:		450px;
	min-height:		450px;
	padding:		20px;
	padding-bottom:	0px;
	
}

div#content-area div#home div.list-split {
	width:			35%;
	min-height:		10px;
	_height:		10px;
	float:			left;
}
div#content-area div#home div.list-images {
	width:			60%;
	min-height:		10px;
	_height:		10px;
	float:			left;
	padding:		90px 3% 0 2%;
}

div#content-area div#home div.list-images li {
	list-style:		none;
	padding-left:	20px;
	width:			100%;
	
}
div#content-area div#home div.list-images div.last div.image {
	padding-right:	0px;
	
}
div#content-area div#home div.list-images div.image{
	padding-right:	30px;
	width:			150px;
	height:			130px;
	float:			left;
}
div#content-area div#home div.list-images a {
	width:			150px;
	height:			130px;
	border:			1px solid #a5a5a5;
}


div#content-area div#services {
	width:			908px;
	_height:		450px;
	min-height:		450px;
	padding:		20px;
	padding-bottom:	0px;
	background:		url('../images/services-middle.jpg') right top no-repeat;
}
div#content-area div#projects {
	width:			908px;
	_height:		450px;
	min-height:		450px;
	padding:		20px;
	padding-bottom:	0px;
	background:		url('../images/projects-middle.jpg') right top no-repeat;
}
div#content-area div#contactus {
	width:			908px;
	_height:		450px;
	min-height:		450px;
	padding:		20px;
	padding-bottom:	0px;
	background:		url('../images/contactus-middle.jpg') right top no-repeat;
}

div#content-area  h1{
	font-family:	arial;
	font-size:		26px;
	font-weight:	bold;
}
div#content-area  h2{
	font-family:	arial;
	font-size:		18px;
	font-weight:	100;
}
div#content-area p {
	color:			#555555;
	font-family:	arial;
	font-size:		12px;
	width:			65%;
}
div#content-area tr td {
	color:			#555555;
	font-family:	arial;
	font-size:		12px;
	width:			20%;
}
div#content-area input {
	border:			1px solid #8f8f8f;
	font-size:		12px;
	padding:		3px;

}
div#content-area input.no-border {
	border:			0;


}
div#content-area textarea {
	border:			1px solid #8f8f8f;
	font-size:		12px;
}
div#content-area ul li {
	list-style-type:	disc;
	list-style-position: inside;
	color:			#555555;
	font-family:	arial;
	font-size:		12px;
	float:			left;
	width:			100%;
	min-height:		20px;
	_height:		20px;
	
}
div#content-area ul li div.image
{
	float:			left;
	padding:		10px 10px 10px 0;
	height:			100px;
}
div#content-area ul li a {

	border:			2px solid #262626;
	width:			100px;
	height:			100px;
	padding:		0px;

}

/** footer **/

div#footer {
	width:			100%;
	text-align:		center;
	float:			left;
	color:			#555555;
	font-family:	arial;
	font-size:		12px;
}
div#footer a {

	color:			#ffbb18;
}