/*-----------------------------------------------------------------------------
Title Sutton Windows 

version:   1.0
author:    Jonathan Lewis
email:     jon.lewis@globalgraphics.co.uk
website:   http://www.globalgraphics.co.uk/
-----------------------------------------------------------------------------*/

/* =General
-----------------------------------------------------------------------------*/


/* Remove padding and margin */
* {
  margin: 0;
	padding: 0;
}

body {background-image:url(../images/global/BK.gif);}


/* Put it back on certain elements */
h1, h2, h3, h4, h5, h6, p, pre, blockquote {
  margin: 1em 0;
}

/* Class for clearing floats */
.clear {
	clear:both; line-height:1px; height:1px;
}


/* Remove border around linked images */
img {
	border: 0;
}

hr{
	width:80%;
	margin: 5px auto 10px;
	color:#CCC;
	border:none;
	border-top:1px solid #CCC;
	}

#root {
	width:975px;
	background-color:#2E2E2E;
	margin:auto;
	padding:15px 0;
}
#root-inner{
	width:930px;
	margin:auto;
}

/* =Top Banner
-----------------------------------------------------------------------------*/
#top-banner{
	height:87px;
	margin:auto;
	background:#FFF url(../images/global/banner-top.jpg) 50% 0% no-repeat;
	}
#top-banner h1{
	display:none;
	}

/* =Middle Wrap
-----------------------------------------------------------------------------*/
#middle-wrap{
	padding:0px 23px;
	background-color:#FFF;
	}

/* =Main Nav
-----------------------------------------------------------------------------*/
#main-nav{
	height:35px;
	background:url(../images/global/nav-bk.jpg) 100% 0% repeat-x;
	
	}
#main-nav ul{
	list-style:none;
	padding:0 12px;
	_padding:0px;
	width:860px;
	_width:865px;
	margin:0px auto;
    
	}
	
#main-nav ul li{
	float:left;
	height:35px;
	

	background:url(../images/global/nav-button-left.jpg) 0% 50% no-repeat;
	line-height:35px;
	margin:0 1px 0 2px;
	padding-left:12px;
	}
#main-nav ul li span{
	display:block;
	background:url(../images/global/nav-button-right.jpg) 100% 50% no-repeat;
	padding-right:12px;	
	}
#main-nav ul li a{
	display:block;
	
	
	}
#main-nav ul li#active{	background:url(../images/global/nav-button-left-active.jpg) 0% 50% no-repeat;}
#main-nav ul li#active span{background:url(../images/global/nav-button-right-active.jpg) 100% 50% no-repeat;}

.current a{color:#5E842A!important; text-decoration:underline !important;}
.current a:hover{color:#5E842A;}

/* =Product Nav
-----------------------------------------------------------------------------*/
#product-nav{
	padding:15px 0;
	}
#product-nav ul{
	list-style:none;
	}
#product-nav ul li{
	float:left;
	width:120px;
	margin:0 7px 0 0;
	}
#product-nav ul li.last{margin:0 0 0 1px;}
#product-nav ul li a{display:block;}
#product-nav ul li img{
	_border:1px solid #999;/*IE6*/
	_border-bottom:none;/*IE6*/
	filter:alpha(opacity=30);
	-moz-opacity:0.3;
	-khtml-opacity: 0.3;
	opacity: 0.3;
	}
#product-nav ul li > a{
	border:1px solid #999;
	border-bottom:none;
	}
#product-nav ul li > a.product-nav-link{border:none;}
#product-nav ul li#active img{
	filter:alpha(opacity=100);
	-moz-opacity:1.0;
	-khtml-opacity: 1.0;
	opacity: 1.0;
	}
.product-nav-link{
	height:18px;
	width:92px;
	background:url(../images/global/product-nav-bk.jpg) no-repeat;
	line-height:18px;
	padding-left:28px;
	}
#product-nav ul li#active .product-nav-link{
	background:url(../images/global/product-nav-bk-active.jpg) no-repeat;
	}


/* =Main Content
-----------------------------------------------------------------------------*/
#left-block,#right-block{width:175px; float:left;}
#left-block{
	background:url(../images/global/grey-block-bk.jpg) 50% 100% no-repeat;
	}
#left-block div.inner{
	_height:650px;/*IE6*/
	min-height:650px;
	float:left;
	}
#left-block span.title{
	display:block;
	width:175px;
	height:36px;
	line-height:36px;
	text-align:center;
	background:url(../images/global/green-title-bk.jpg) no-repeat;
	}
#left-block ul.nav {
	list-style-type:none;
	padding:20px 0 0;
	}
#left-block ul.nav li{
	height:23px;
}
#left-block ul.nav li a{
	display:block;
	width:80%;
	height:100%;
	padding-left:20%;
	background:url(../images/global/arrow-right.png) 10% 50% no-repeat;
	line-height:23px;
	}
#left-block ul.nav li a:hover{
	background-color:#FFF;
	}
#middle-block{width:494px; float:left; padding:0 20px; position:relative; top:0px; left:0px;}
#middle-block-full{width:685px; float:left; padding:0 0 0 20px; }
#middle-block-style{width:580px; margin:0px auto; padding:0 20px;}
	
#right-block span.title{
	display:block;
	width:165px;
	height:36px;
	line-height:36px;
	padding-left:10px;
	background:url(../images/global/blue-title-bk.jpg) no-repeat;
	}
	
#right-block span.titledoors{
	display:block;
	width:165px;
	height:36px;
	line-height:36px;
	padding-left:10px;
	background:url(../images/global/blue-title-bk.jpg) no-repeat;
	}
#right-block #featured-products, #right-block #call-back{
	background:url(../images/global/grey-block-bk.jpg) 50% 100% no-repeat;
	padding-bottom:30px;
	}
#featured-img,
#energy-saving-img{
	width:170px; 
	margin:2px auto; 
	background-repeat:no-repeat; 
	background-position:50% 50%;
	padding-top:148px;
	}
#energy-saving-img{
	padding-top: 96px;
}
#energy-saving {
	margin-bottom: 15px;
}
#featured-img-doors{
	width:170px; 
	margin:2px auto; 
	background-repeat:no-repeat; 
	background-position:top left;
	
	padding-top:148px;
	}
#featured-img span.title,
#energy-saving-img span.title{
	display:block;
	height:22px;
	width:auto;
	line-height:22px;
	background:url(../images/global/white-60.png) repeat;
	}
#energy-saving-img span.title {
	color: #000 !important;
}
#right-block #featured-products ul{list-style:none; padding:3px 20px;}
#right-block #call-back{margin-top:20px; padding-bottom:5px;}
#call-back-img{
	width:170px;
	margin:2px auto;
	}
#freephone{
	display:block;
	text-align:center;
	padding-top:5px;
	}



/* =Bottom Block
-----------------------------------------------------------------------------*/
#bottom-block{
	clear:both;
	padding:20px 23px 22px 23px;
	background:#FFF url(../images/global/round-bottom.jpg) 50% 100% no-repeat;
	}
#bottom-block div.inner{
	background:#8FB76C url(../images/global/bottom-block-top.jpg) 0% 0% no-repeat;
	padding:10px;
	
	}
#bottom-block div.inner ul{
	padding:15px;
	float:left;
	list-style:none;
	}


/* =Footer
-----------------------------------------------------------------------------*/



/* =Forms
-----------------------------------------------------------------------------*/

/* Removes fieldset borders. even on Opea 7 */
fieldset {
  border: 1px solid transparent;
}


/* =Tables
-----------------------------------------------------------------------------*/

table { 
  border-spacing: 0;
	border-collapse: collapse;
}

td {
  text-align: left;
	font-weight: normal;
}



/* =Misc 1
-----------------------------------------------------------------------------*/
.ruler1{ width:250px; height:1px; background:#cdcdcd; margin:5px;}
.ruler2{width:430px; height:1px; background:#cdcdcd; margin:10px 0px 10px 35px; clear:both;}
.clear{clear:left;}
.bottom-border{border-bottom:1px solid #cccccc; padding-bottom:10px;}

.imageright{float:right; margin:10px 0px 0px 10px}
/* =Misc 2
-----------------------------------------------------------------------------*/
.header{ width:150px; display:block;border-bottom:1px solid #cccccc;}

.links { width:400px; margin:0px auto;}
.links  ul { float:left; list-style:none;}
.links  li{display:block; margin:10px 0px;}

.container{width:430px; margin:0px auto; }
.container h2{margin:0px; padding:0px; font-size:14px; font-weight:bold;}
.container strong{display:block; text-align:right;}
.container b{display:block; text-align:right;}


.more{display:block; position:releative; top:0px; left:0px;  float:left; width:100%; height:20px; }
.more a{position:relative; float:right;bottom:0px ; right:0px; background:url(../images/global/arrrow.jpg) no-repeat left top; padding-left:20px;}

.containerinner{ width:200px; float:left;}
.containerinnerright{width:200px; float:right;}
.containerinner b, .containerinnerright b{color:#94B872!important; text-align:left; margin:10px 0px 0px 0px; padding:0px;}

.doors-list{width:122px;  float:left}
.doors-list h3{background:transparent url(../images/doors/doors-sml-header.jpg) no-repeat top left; color:#FFFFFF; margin:0px; padding:5px 10px; font-size:11px;}
.doors-list ul{list-style:none; margin:0px 0px 20px 0px; padding:0px;width:117px;}
.doors-list li {background:transparent url(../images/global/arrrow.jpg) no-repeat left -1px; padding-left:20px; margin-bottom:5px}
.doors-list li a{color:#8FB76C;}
.doors-list li a:hover{color:#996633}

h2.doors-title{display:block; width:688px; text-indent:20px; padding:5px 0px; background:transparent url(../images/doors/doors-long-header.jpg) no-repeat top left; margin:0px; color:#FFFFFF}
.Maincontent-wrapper{width:350px; float:left; padding-left:10px;}
.side-bar{float:right; width:300px; margin-top:10px;}

.gallery{list-style:none; margin-top:10px;}
.gallery li {float:left; margin-right:20px; margin-bottom:20px;}
.features{float:left;background:transparent url(../images/global/features-mid.jpg) repeat-y top left; width:300px; margin-top:-4px;}
.features-bottom{float:left;background:transparent url(../images/global/features-bottom.jpg) no-repeat bottom left; width:300px; padding-bottom:10px; margin:}
.features-inner{float:left;width:280px; margin-left:10px;}

.features-inner ul{list-style:none; margin:0px; width:250px;}
.features-inner li {float:left; width:125px;}

.address{width:200px; float:left; }
.address h3{color:#8FB76C; font-size:12px;}

.map {float:right; margin-top:-130px; position:relative; right:20px;width:186px}
.map a{background:transparent url(../images/global/arrrow.jpg) no-repeat 60%; padding-left:0px; color:#8FB76C; text-align:right; display:block; width:185px;}
.map a:hover{text-decoration:underline;}


label.t1{display:block; margin-bottom:2px;}
input{width:170px; margin-bottom:10px; border:1px solid #666666;}
textarea{width:170px; height:100px;border:1px solid #666666;}
.formwrapper{width:100%; float:left; }
.formwrapper form{float:left}
.formleft{float:left; width:190px}
.formleft2{width:190px; margin-left:150px;}
.formleft2 select{margin-bottom:10px;}
.formright{float:left; width:300px;}
.t2{width:300px; float:left; margin-bottom:5px; margin-top:5px;}
.t2 label {float:left; }
.t2 select {float:right; width:70px;}
.t3{float:left; margin:0px 5px 10px 10px}
.t3 label{margin:0p; padding:0px;}
.t4{display:block; margin-bottom:0px; margin-top:0px; clear:both; position:relative; top:0px; left:0px}

.checkbox{width:10px; float:left; border:none}
.comments{width:300px; height:100px;}

.button{border:none; width:80px; color:#8FB76C; background-color:#FFFFFF;  background-image: url(../images/form/arrows.jpg); background-position:4px left; background-repeat: no-repeat !important; padding-left:10px; margin-left:10px; cursor:pointer; }

.button2{border:none; width:50px; color:#8FB76C; background-color:#FFFFFF;  background-image: url(../images/form/arrows.jpg); background-position:4px left; background-repeat: no-repeat !important; padding-left:15px; margin-left:10px; cursor:pointer; float:left; line-height:20px;}
a.link-white{color:#ffffff;}
a:hover.link-white{color:#ffffff;}

p.legal{font-weight:normal; margin-top:15px; margin-left:40px;width:360px; float:left;}

.link{text-decoration:none;color:#8FB76C;}
.link:hover{text-decoration:none}

.moreinfo ul{list-style:none}

.moreinfo a{background:url(../images/global/listicon.jpg) top left no-repeat; padding-left:20px; margin:0px; display:block; height:25px; line-height:25px; color:3976AC!important;}


.privacy{float:left;  position:relative; top:10px; left:24px; color:#fffff}
.designby{float:right;  position:relative; top:10px; right:24px; color:#FFFFFF; padding-bottom:10px;}

.designby a, .privacy a{color:#FFFFFF; text-decoration:none}
.designby a:hover, .privacy a:hover{text-decoration:underline;}