div#id-SideNavigation a.cls-SideNav-Selected
{
	background-color: #FBDD90;
	color: #FFFFFF;
}

div#id-SideNavigation ul li ul li a.cls-SideNav-Selected
{
	background-color: #FFF2DF;
	color: #FBDD90;
}

h1.cls-Header
{
	position: relative;
	width: 759px;
	height: 206px;
	margin: 0px;	
	z-index: 0; /* Firefox displays this element over the top of the QuickLink menu, so setting the z-index on both elements fixes this */
         
                  

}

h1.cls-Header span.cls-Header-Home,
h1.cls-Header span.cls-Header-About,
h1.cls-Header span.cls-Header-Products,
h1.cls-Header span.cls-Header-Clearance,
h1.cls-Header span.cls-Header-Contact,
h1.cls-Header span.cls-Header-Sheeting
{
	position: absolute;
	background-image: url("/Assets/Images/Header-Home.jpg");
	background-repeat: no-repeat;
	
	/* Set the span to fill the header element */
	width: 100%;
	height: 100%;
}

h1.cls-Header span.cls-Header-About
{
	background-image: url("/Assets/Images/Header-About.jpg");
        color:#FF8000;   

}

h1.cls-Header span.cls-Header-Products
{
	background-image: url("/Assets/Images/Header-Products.jpg");


}

h1.cls-Header span.cls-Header-Clearance
{
	background-image: url("/Assets/Images/Header-Clearance.jpg");
}

h1.cls-Header span.cls-Header-Contact
{
	background-image: url("/Assets/Images/Header-Contact.jpg");
}

h1.cls-Header span.cls-Header-Sheeting
{
	background-image: url("/Assets/Images/Header-Sheeting.jpg");
}

div.cls-Content,
div.cls-ContentHome
{
	clear: left;
	background-color: #FFFFFF;
	
	min-height: 349px !important; /* IE/Win doesn't recognise the property 'min-height' */
	height: auto;
}

/* Commented backslash hack - to hide the following declaration from IE5/Mac \*/

	/* Star Hack * These settings are only recognised by IE.6- */
	* html div.cls-Content,
	* html div.cls-ContentHome	
	{
		height: 349px; /* IE6-/Win incorrectly treats any specified height as 'min-height' so we set a 'specific' height for IE6-/Win only */
	}
	
/* End IE5/Mac hack */

div.cls-ContentHome
{
	background-image: url("/Assets/Images/Home-Background1.jpg");
	background-position: left top;
	background-repeat: no-repeat;
	background-repeat: repeat-y;
	padding:0px
}

div.cls-ContentHome div.cls-Content-Text
{
	color: #FFFFFF;
}

div.cls-Content-Text
{
	padding: 20px;
	/*594 - taken down by 50px for Firefox */
	width: 544px;
}

div.cls-ProductListing-Text
{
	padding: 20px;
}

div.cls-ProductListing-SearchStrap
{
	padding: 10px 20px;
	font-weight: bold;
	background-color: #FF8000;
}

dl.cls-ProductListing-SearchList
{
	margin: 0px;
}

dl.cls-ProductListing-SearchList dt
{
	float: left;
	width: 85px;
	margin-top: 5px;
	margin-left: 2px;
	
}

dl.cls-ProductListing-SearchList dd
{
	margin-top: 5px;
	margin-left: 90px; /* IE6-/Win incorrectly renders the left margin? So we explictly set the left margin for compliant browsers */
	padding: 10px;
	background-color: #003D7C;
	color: #FFFFFF;
	
	min-height: 65px !important; /* IE/Win doesn't recognise the property 'min-height' */
	height: auto;
}

/* Commented backslash hack - to hide the following declaration from IE5/Mac \*/
	
	/* Star Hack * These settings are only recognised by IE.6- */
	* html dl.cls-ProductListing-SearchList dd
	{
		height: 65px; /* IE6-/Win incorrectly treats any specified height as 'min-height' so we set a 'specific' height for IE6-/Win only */
	}
	
/* End IE5/Mac hack */

dl.cls-ProductListing-SearchList dt:first-child
{
	/*
		IE6-/Win (incorrectly) displays the first row of products as having its 'margin-top' value as 0px?
		We cannot simply set 'margin-top' to 0px for ALL browsers as this messes up IE6-/Win.
		To set all compliant browsers to display 'margin-top' as 0px we use a dynamic pseudo-class ':first-child'.
		IE6-/Win is not compliant enough to recognise dynamic pseudo-classes so it leaves IE6-/Win rendering the page incorrectly.
	*/
	margin-top: 0px;
}

div.cls-Product
{
	clear: left;
	position: relative;
}

div.cls-Product-Header
{
	width: 553px;
	float: left; /* This containers content is floated, so its height no longer wraps the content. Floating the container fixes this. */
	background-color: #323232;
	padding: 0px;
}

/* Star Hack * These settings are only recognised by IE.6- */
* html div.cls-Product-Header
{
	float: none; /* This declaration has its property value reset to 'none' to fix an IE/Win bug that effects the footer's display */
}

div.cls-Product-Header h3
{
	float: left;
	margin: 0px;
	min-height: 16px; /* IE/Win doesn't recognise the property 'min-height' */
	font-size: 95%; /* IE/Win only recognises percentages in 10's not in 5's so this percentage is understood by compliant browsers */
	color: #FFFFFF;
}

div.cls-Product-Header a
{
	float: right;
	text-decoration: none;
	font-size: 95%; /* IE/Win only recognises percentages in 10's not in 5's so this percentage is understood by compliant browsers */
	color: #FFFFFF;
}

img.cls-Product-Image
{
	clear: left;
	float: left;
	position: relative;
	top: 1px;	
}

div.cls-Product-Description
{
	float: left;
	margin-top: 1px;
	margin-left: 1px;
	padding: 0px;
	width: 303px;
}

div.cls-Product-Description h4
{
	font-size: 110%;
}

div.cls-Product-ProductLinks,
div.cls-Product-ProductExtraDesc
{
	clear: both;
	border: 1px solid #666666;
	position: relative;
	top: 5px;
	padding: 0px;
	margin-bottom: 5px;
}

div.cls-Product-ProductLinks
{
	border: 0px solid #666666;
	background-color: #EEEEEE;
}

/*
IE6- adds a 10px margin to the top of the first p tag!?
So we have to reset the margin to minus off that extra 10px, but this also effects compliant browsers (see below 'selector').
*/
div.cls-Product-ProductLinks p
{
	margin-top: -10px;
}

/*
Because compliant browsers do not add an extra 10px to the first paragraph we have to make sure
that the 10px we minus off (for IE6-'s sake) is put back for compliant browsers.
We do this using the child selector which IE6- does not recognise.
*/
div.cls-Product-ProductLinks > p
{
	margin-top: 0px;
}

div.cls-Product-TechData
{
	border: 1px solid #666666;
	position: relative;
	top: 5px;
	padding: 0px;
}

p.cls-LastPara-RemoveMargin
{
	margin-bottom: 0px;
}

div.cls-Content-CMSText
{
	padding: 5px;
}


div.cls-Content-CMSAboutText
{
	padding: 3px;
}

div#id-SideNavigation a.cls-SideNav-Selected2
{
	background-color: #FCDC8A;
	color: 000000;
}