/* CSS Document */

/* Global Styles
--------------------------------------------------------------- */

* {
	margin: 0px;
	padding: 0px;
}

body, html {
	min-height: 101%;
}

body {
	text-align: left;
	font-size: 62.5%;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	background: url(../../images/layout/outerheader-bg.jpg) top repeat-x #f3fae4;
	margin: 0px;
}

a:link, a:visited, a:focus {
	color: #0000FF;
	text-decoration: underline;
	outline: none;
}

a:hover, a:active {
	color: #000;
	text-decoration: underline;
}

a img {
	border: none;
}

/* H1/H2/H3 Styles
--------------------------------------------------------------- */

h1 {
	font-size: 2.3em;
	font-weight: normal;
	color: #000;
}

h2 {
	font-size: 1.6em;
	font-weight: normal;
	color: #333;
}

h3 {
	font-size: 1.3em;
	font-weight: normal;
	color: #666;
}

/* Container Styles
--------------------------------------------------------------- */

#outerContainer {
	width: 100%;
	float: left;
}

#bannerOuter {
	position:absolute;
	top:150px;
	width:100%;
	height:331px;
	background:url(../../images/layout/outerBanner-bg.jpg) top left repeat-x;
	}
	
	#bannerContainer {
		width:960px;
		margin:0px auto;
		position:relative;
		z-index:99;
		font-size:1.2em;
		}

#container {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	font-size: 1.2em;
}


	#contentContainer {
		width: 960px;
		padding-top:490px;
	}
	
/* Main Styles
--------------------------------------------------------------- */

		#main {
			float: left;
			width: 475px;
			min-height:500px;
			padding: 0px 10px 10px 213px;
		}
		
			#main p {
				margin: 10px 0px 10px 0px;
				font-size: 1.2em;
				line-height: 20px;
			}
			
			#main ul {
				font-size: 1.2em;
				padding: 3px 0px 3px 25px;
				
			}
			
				#main ul li {
					padding: 4px 0px;
				}
				
		#googleMap {
			width: 640px;
			height: 300px;
		}
		
		
		#main .imgGallery {
			padding:20px 0px 0px 0px;
			}
			
		#main .imgGallery img {
			width:130px;
			height:100px;
			padding:3px;
			margin:3px;
			border:1px solid #ccc;
			
			}

/* Sidebar/CTA Styles
--------------------------------------------------------------- */
		
		#sidebar {
			float: right;
			width: 250px;
			height:540px;
		}
		
			#contact #sidebar #callback {
				display:none;
				}
			
			#sidebar #callback {
				float:left;
				width:239px;
				height:136px;
				background:url(../../images/layout/callback-bg.jpg) top left no-repeat;
				padding:0px 0px 0px 0px;
				}	
				
				#sidebar #callback #callbackform {
					float:left;
					padding:3px 0px 0px 3px;
					}
					
					#sidebar #callback #callbackform h2 {
						color: #fff;
						padding:0px 0px 2px 5px;
						}
					
					#sidebar #callback .botBuster {
						display:none;
						}
						
						#sidebar #callback .callbackformbox {
							width:132px;
							height:18px;
							border:1px solid #ccc;
							margin:0px 0px 2px 0px;		
							padding:2px 0px 0px 3px;					
							}
							
							#sidebar #callback #dropdown {
								width:136px;
								border:1px solid #ccc;
								}
								
			#sidebar #callback-errors {
				float:left;
				display:block;
				width:240px;
				padding:10px 0px 10px 20px;
				margin:0px;
				color: #FF0000;
				font-weight:bold;
				font-size:1.1em;
				
				}					
				
					
				
			#sidebar #map-cta {
				float:left;
				width:239px;
				height:178px;
				background:url(../../images/layout/map-cta-bg.jpg) top left no-repeat;
				padding:0px 0px 0px 0px;
				}	
				
				#sidebar #map-cta p.servicing {
					position:absolute;
					padding:10px;
					font-size:1.2em;
					color: #fff;
					line-height:1.0em;
					}
					
					#sidebar #map-cta p.east-midlands {
						position:absolute;
						padding:25px 0px 0px 10px;
						color: #fff;
						display:block;
						font-size:2.6em;
						line-height:1.0em;
						}
						
						#sidebar #map-cta a.more-details {
							position:absolute;
							width:229px;
							color: #fff;
							font-size:1.3em;
							line-height:1.2em;
							padding:135px 0px 0px 10px;
							text-decoration:none;
							}
							
							#sidebar #map-cta a.more-details:hover {
								color: #EFA342;
								}
								
			#sidebar #interiors-cta {
				float:left;
				width:239px;
				height:112px;
				padding:0px 0px 20px 0px;
				display:block;
				}		
				
				#interiors #sidebar #interiors-cta {
					display:none;
					}	
				
				#sidebar #interiors-cta a.interiors {
					position:absolute;		
					z-index:20;			
					padding:10px 0px 0px 105px;
					margin:0px;
					width:140px;
					height:112px;
					color: #000;
					font-weight:bold;
					font-size:1.1em;
					line-height:1.2em;
					text-decoration:none;
					}
					
					#sidebar #interiors-cta span.interiors-click {
						padding:10px 0px 0px 0px;
						margin:0px 0px 0px -6px;
						display:block;	
						font-size:1.1em;			
						}
							
		
		
/* Content-Left Styles
--------------------------------------------------------------- */		

img.content-left-top {
	position:absolute;
	top:480px;
	left:5px;
	z-index:101;
	width:176px;
	height:71px;
	}
		
#content-left {
	position:absolute;
	z-index:100;
	width: 152px;
	left:7px;
	top:500px;
	background: #65983B;
	padding:50px 10px 0px 10px;
	margin:0px;
	border:1px solid #F3FAE4;
	}
			
		#content-left p {
			float:left;
			width:155px;
			color: #fff;
			padding:1px 0px 10px 0px;			
			}
			
			#content-left p.name {
				float:left;
				width:150px;
				color: #fff;
				font-weight:bold;
				padding:0px;
				font-size:1.3em;				
				}
				
		#content-left a.more {
			float:right;
			padding:10px 5px 10px 0px;
			font-size:1.4em;
			font-weight:bold;
			color: #fff;
			}	
			
				#content-left a.more:hover {
					color: #EFA342;
					}	
		
#flashSlideshow {
	padding:20px 0px 0px 0px;
	}
		
		
		
		
/* Header Styles
--------------------------------------------------------------- */

#header {
	width: 960px;
	height: 150px;
	position: absolute;
	z-index: 10;
	top: 0px;
	left: 0px;
	background:url(../../images/layout/header-bg.jpg) top left no-repeat;
}

	#logo {
		width: 425px;
		height: 150px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:10;
	}
	
	#cta-top-right {
		width: 520px;
		float: right;
		padding: 30px 0px 0px 0px;
		text-align: right;
		height: 125px;
		font-size: 3.0em;
		line-height:1.0em;
		color: #b5b9a8;
	}
	
	#cta-top-right p {
		position:absolute;
		top:14px;
		right:10px;
		
		}
	
		#cta-top-right p.phone {
			position:absolute;
			top:59px;
			right:10px;
			font-size: 1.6em;
			color: #f0a342;
			padding:0px;	
			letter-spacing: -1px;		
		}
			

/* Main Image Styles
--------------------------------------------------------------- */

#imgmain {
	z-index: 100;
	position: absolute;
	top: 400px;
	left: 300px;
}

#slideshow {
	width: 940px;
	height: 220px;
	position: absolute;
}
	
	#slideshow img {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 8;
	}
	
	#slideshow img.active {
		z-index: 10;
	}
	
	#slideshow img.last-active {
		z-index: 9;
	}

/* Vertical Navigation Styles
--------------------------------------------------------------- */

#navigation {
	width: 191px;
	height:246px;
	z-index: 100;
	position: absolute;
	left: 4px;
	top: 38px;
	background:url(../../images/layout/verticalNav-bg2.jpg) top left no-repeat #ccc;
}

	#navigation ul {
		margin: 0px;
		padding: 0px 0px 0px 12px;
	}
	
		#navigation ul li {
			display: inline;
			list-style: none;
			padding:0px 0px 0px 0px;
			
		}
		
		#navigation ul li.products {
			display: inline;
			float:left;
			color: #fff;
			font-size:1.4em;
			padding:0px 0px 6px 10px;
			}
			
			#navigation ul li a {
				float:left;
				width:159px;
				color: #f6bc72;
				text-decoration:none;
				font-size:1.4em;
				padding:6px 0px 6px 10px;	
				border-top:1px solid #9b519d;	
				border-bottom:1px solid #793c79;		
				}
		
			#navigation ul li a.interiors-a {
				border-bottom:none;
				}

				#navigation ul li a:hover {
					color: #fff;
				}
				
#wooden #navigation .wooden-a,
#glass #navigation .glass-a,
#mirrored #navigation .mirrored-a,
#coloured #navigation .coloured-a,
#patterned #navigation .patterned-a,
#interiors #navigation .interiors-a
 {
	color: #FFFF00;
}

/* Horizontal Navigation Styles
--------------------------------------------------------------- */

#horizontalNav {
	width: 955px;
	height: 38px;
	z-index: 1;
	position: absolute;
	left: 5px;
	top: 0px;
	background: url(../../images/layout/horizontalNav-bg.jpg) top left no-repeat;
	}

	#horizontalNav ul {
		float:right;
		margin: 0px;
		padding: 0px 10px 0px 0px;	
	}
	
		#horizontalNav ul li {
			display: inline;
			list-style: none;
		}
			  
			#horizontalNav ul li a {
				float: left;
				color: #fff;
				text-decoration: none;
				padding: 6px 10px 6px 10px;
				font-size: 1.8em;
			}

				#horizontalNav ul li a.contact-a {
					border-right: none;
				}

				#horizontalNav ul li a:hover {
					color: #f6bc72;
				}
				
#index #horizontalNav .index-a,
#examples #horizontalNav .examples-a,
#testimonials #horizontalNav .testimonials-a,
#contact #horizontalNav .contact-a {
	color: #FFFF00;
}

/* Banner Styles
--------------------------------------------------------------- */

.strapline {
	position:absolute;
	top:117px;
	left:110px;
	z-index:11;
	color:#DFDFDF !important;
	font-style:italic;
	font-size:1.3em;
	font-weight:bold;
	text-decoration:none !important;
	}
	
	.strapline:hover {
		text-decoration:none;
		}
	

#product-types {
	position:absolute;
	top:56px;
	right:0px;
	width:350px;
	height:243px;	
	display:none;
	}
	
	#index #product-types,
	#contact #product-types,
	#examples #product-types,
	#testimonials #product-types,
	#tv #product-types,
	#privacy #product-types,
	#thankyou #product-types,
	#useful #product-types,
	#error #product-types  {
		display:block;
		}
	
	#product-types ul {
		float:left;
		width:360px;
		}
		
		#product-types ul li {
			float:left;
			display:inline;
			list-style:none;
			}
			
			#product-types ul li a {
				float:left;
				width: 161px;
				height: 21px;
				text-align:center;	
				padding:93px 0px 0px 0px;
				margin:0px 16px 0px 0px;
				color: #fff;
				text-decoration:none;
				font-size:1.2em;	
				}
				
				#product-types ul li a.coloured {
					background:url(../../images/layout/productTypes-coloured.jpg) top left no-repeat;
					}
					
				#product-types ul li a.glass {
					background:url(../../images/layout/productTypes-glass.jpg) top left no-repeat;
					}
					
				#product-types ul li a.wooden {
					background:url(../../images/layout/productTypes-wooden.jpg) top left no-repeat;
					margin:16px 16px 0px 0px;
					}
					
				#product-types ul li a.mirrored {
					background:url(../../images/layout/productTypes-mirrored.jpg) top left no-repeat;
					margin:16px 16px 0px 0px;
					}
					
					
							
/* JQuery Hover Image Styles
--------------------------------------------------------------- */

#mainImage {
	position:absolute;
	top:56px;
	left:205px;
	width:504px;
	height:245px;
	display:block;
	}
	
	#mainImage p {
		position:absolute;
		padding:205px 0px 0px 10px;
		z-index:10;
		color: #fff;
		text-shadow:#000000;
		display:block;
		font-size:2.6em;
		font-weight:bold;
		}
		
		#index #mainImage p,
		#contact #mainImage p,
		#testimonials #mainImage p,
		#examples #mainImage p,
		#tv #mainImage p,
		#privacy #mainImage p,
		#thankyou #mainImage p,
		#useful #mainImage p,
		#error #mainImage p {
			display:none;
			}
	
	#index #mainImage,
	#contact #mainImage,
	#testimonials #mainImage,
	#examples #mainImage,
	#tv #mainImage,
	#privacy #mainImage,
	#thankyou #mainImage,
	#useful #mainImage,
	#error #mainImage {
		display:none;
		}
	
	
#index ul.thumb, #index p.thumb-title,
#contact ul.thumb, #contact p.thumb-title,
#testimonials ul.thumb, #testimonials p.thumb-title,
#examples ul.thumb, #examples p.thumb-title,
#tv ul.thumb, #tv p.thumb-title,
#privacy ul.thumb, #privacy p.thumb-title,
#thankyou ul.thumb, #thankyou p.thumb-title,
#useful ul.thumb, #useful p.thumb-title,
#error ul.thumb, #error p.thumb-title { 
	display:none;
	}

p.thumb-title {
	color: #fff;
	position:absolute;
	padding:0px;
	top:50px;
	right:20px;
	font-size:1.1em;
	z-index:50;
	}

ul.thumb {
	position:absolute;
	top:66px;
	right:0px;
	list-style: none;
	margin: 0; padding: 10px 0px 0px 0px;
	width:235px;
}

ul.thumb li {
	margin: 0; padding: 3px;
	float: left;
	position: relative;  /* Set the absolute positioning base coordinate */
	width: 71px;
	height: 71px;
}

ul.thumb li img {
	width: 71px; height: 71px; /* Set the small thumbnail size */
	-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
/*	border: 1px solid #ddd;
	padding: 5px;
	background: #f0f0f0;*/
	position: absolute;
	left: 0; top: 0;
}

ul.thumb li img.hover {
	background:url(thumb_bg.png) no-repeat center center;  /* Image used as background on hover effect
	border: none; /* Get rid of border on hover */
}
/*--------------------------------------------------------------- */
					
a.view-advert {
	position:absolute;
	top:284px;
	left:14px;
	z-index:600;
	height:25px;
	width:190px;
	background:url(../../images/layout/tv-advert-bg.jpg) top left no-repeat;
	padding:4px 0px 0px 30px;
	color: #fff;
	text-decoration:none;
	font-size:1.2em;
	}	
	
	a.view-advert:hover {
		color: #EFA342;
		}									

/* Footer Styles
--------------------------------------------------------------- */

#outerFooter {
	float: left;
	width: 100%;
	background: url(../../images/layout/outerFooter-bg.jpg) top left repeat-x;
}

#footer {
	clear: both;
	width: 960px;
	color: #ddd;
	height:193px;
	margin: 0px auto;
	padding: 15px 0px 10px 0px;
	font-size: 1.2em;
	background: url(../../images/layout/footer-bg.jpg) top left no-repeat;
}

	#footer .index-a,
	#footer .contact-a, {
		display: none;
	}

	#footer h2 {
		font-weight: bold;
		margin: 0px;
		color: #fff;
		padding: 3px 5px;
		font-size: 1.7em;
		width: 250px;
	}
		
	#footer li {
		list-style: none;
	}
	
	#footer p, #footer ul {
		margin: 0px;
		padding: 0px;
	}

	#footer a {
		white-space: nowrap;
		color: #ddd;
		text-decoration: none;
	}
		
		#footer a:hover {
			color: #EFA342;
			text-decoration: underline;
		}

/* Footer Services Styles
--------------------------------------------------------------- */	

	#footer #footer-services {
		float: left;
		width: 320px;
		margin: 0px;
	}
	
	 #footer #footer-services h2 {
	 	width:300px;
		}
	
		#footer #footer-services ul li {
			float: left;
		}
		
		#footer #footer-services ul li.products {
			display:none;
			}
	
			#footer #footer-services ul li a {
				float: left;
				width: 250px;
				padding: 3px 5px;
				border-bottom: 1px dotted #777;
			}
		
/* Footer Areas Styles
--------------------------------------------------------------- */	

	#footer #footer-areas {
		float: left;
		width: 220px;
		padding:0px 0px 0px 20px;
	}
	
		#footer #footer-areas h2 {
			width: 200px;
		}
	
		#footer #footer-areas ul {
			float: left;
			width: 155px;
		}
	
		#footer #footer-areas ul li {
			float: left;
			width: 125px;
			padding: 3px 5px;
			border-bottom: 1px dotted #777;
		}
		
/* Footer Address Styles
--------------------------------------------------------------- */	

	#footer #footer-address {
		float: left;
		width: 200px;
	}
	
		#footer #footer-address h2 {
			width: 170px;
		}
		
		#footer #footer-address p {
			line-height: 20px;
			padding: 2px 0px 0px 3px;
		}
				
/* Footer Help & Advice
--------------------------------------------------------------- */	

	#footer #footer-help {
		float: right;
		width: 165px;
	}
	
		#footer #footer-help h2 {
			width: 155px;
		}
		
			#footer #footer-help ul li {
				float: left;
			}
					
			#footer #footer-help ul li a {
				float: left;
				width: 165px;
				padding: 3px 5px;
				border-bottom: 1px dotted #777;
			}
		
		#footer #footer-help p {
			line-height: 20px;
			padding: 3px 5px;
		}
		
		#footer #footer-help .bottomLink {
			margin-bottom: 5px;
		}
		
		
/* Footer Bottom Styles
--------------------------------------------------------------- */	

		#footer #footer-bottom {
		width: 940px;
		float: left;
		margin:3px 0px 0px 0px;
		text-align: center;
	}

/* Float Styles
--------------------------------------------------------------- */

.left, .img-left {
	float: left;
}

	.img-left {
		margin: 10px 10px 10px 0px;
	}

.right, .img-right {
	float: right;
} 

	.img-right {
		margin: 10px 0px 10px 10px;
	}

/* Zooming Slideshow Styles
--------------------------------------------------------------- */

#zooming-slideshow{
	width: 500px;
	height: 300px;
	background: #999999;
}

/* Page Specific Slider Styles
---------------------------------------------------------------

#glass #slider ul li.wooden,
#glass #slider ul li.mirrored {
	display:none;
	}
	
#mirrored #slider ul li.wooden {
	display:none;
	}

#coloured #slider ul li.wooden,
#coloured #slider ul li.mirrored,
#coloured #slider ul li.glass {
	display:none;
	}	
	
#patterned #slider ul li.wooden,
#patterned #slider ul li.mirrored,
#patterned #slider ul li.glass,
#patterned #slider ul li.coloured {
	display:none;
	}
	
#interiors #slider ul li.wooden,
#interiors #slider ul li.mirrored,
#interiors #slider ul li.glass,
#interiors #slider ul li.coloured,
#interiors #slider ul li.patterned {
	display:none;
	}	
		
 */

/* Easy Slider Styles
--------------------------------------------------------------- */

#slider {
	position:absolute;
	top:56px;
	left:205px;
	display:none;
	}
	
	#index #slider,
	#contact #slider,
	#examples #slider,
	#testimonials #slider,
	#tv #slider,
	#privacy #slider,
	#thankyou #slider,
	#useful #slider,
	#error #slider {
		display:block;
		}

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{		
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{  
		width:400px;
		height:245px;
		overflow:hidden; 
		}	s

/*following code display:none as not needed unless prev / next button present */

	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		z-index:1000;
		display:none;
		}	
	#nextBtn, #slider1next{ 
		left:696px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/btn_next.gif) no-repeat 0 0;	
		}
		
		#slider ul li.nodisplay {
			display:none;		
			}	
	
/* Generic Styles
--------------------------------------------------------------- */

.clearfix {
	clear: both;
}