
/* -------------------- 

Gainsborough Hardware CSS file 2009
Authors: Origination CRM - Will & Tracey 

---------------------------- */

body {background: #fff; font-family: Helvetica, Arial, sans-serif;}



	

/* -------------------- headings & text styles ---------------------------- */

.main h2 {font-size: 28px; line-height:100%; color: #fff; text-align: right; padding: 20px 15px 15px; margin: 0; clear:both;xheight:30px;}
	.main h2.smaller {font-size: 18px; padding: 15px 10px; border: none;}

.main h3 {font-size: 18px; line-height: 1.4; color: #898989; text-align:left; padding:4px 0 6px; }

.main h4 {font-size: 14px; line-height: 1.3; color: #333;}

.main h5 {font-size:15px; color:#333; font-weight:normal; margin: 20px 0 5px; line-height:1.4;}
	.functionThumbInfo h5 {margin-top:10px;}

.main h6 {font-size:13px; color:#333; font-weight:bold; margin: 15px 0 3px; line-height:1.3;}


.main p, .main td, main li {font-size: 13px; color: #333; line-height:1.3;}
.main a {color: #898989; text-decoration: none; border-bottom: 1px solid #ddd;}
	.main a:hover {color: #333; text-decoration: none; border-bottom: none;}

.main .leftGuarLogoWrapper p a {border:none;}
	.main .leftGuarLogoWrapper a {border:none;}

dl {font-size: 13px; line-height: 1.3;}
	.main dl { margin: 5px 0 10px 0; padding: 0; clear:both;}
.main dt { width: 250px; float: left; margin: 0 0 0 0; padding: 5px 5px; color: #333; clear:left; text-align:right;  }
	.arch .main dt { width: 250px; float: left; margin: 0 0 0 0; padding: 5px 5px; color: #071F79; clear:left; text-align:right;  }
.main dd { float: left; width: 225px; margin: 0 0 0 0; padding: 5px 5px; color: #898989; xclear:right; }

.main .breadcrumb a.active {color: #666;}


.main ul { padding:5px 5px 15px; list-style-type: disc;}
	.main ul li { font-size:13px; color:#333; font-weight:normal; line-height:1.3; margin:5px 0 0; }

.main .searchWrapper ul { margin:5px 5px 15px; list-style-type: none;}
	.main .searchWrapper ul li { font-size:13px; color:#333; font-weight:normal; line-height:1.3; margin:5px 0 0; }

.main  ul#tab-menu { margin:15px 0 10px; list-style-type: disc; padding:0;}

h7 {margin-bottom: 0px; font-size: 12px; color:#898989;}
.tabs p.Address, .tabs p.PhoneFax span {white-space: pre;}
.tabs p.OpeningHours {white-space: pre;margin:2px 0 10px;padding:0;}
.tabs p.EmailWebsite {margin-top:0;}
.tabs p.Tagline {font-style:italic;}


/* -------------------- general image float left or right ---------------------------- */

.imgLeft {float:left; margin-right:20px; margin-bottom: 15px;}
.imgRight {float:right; margin-left:20px; margin-bottom: 15px;}






/* -------------------- range dependent colours & attributes ---------------------------- */


/* home collection */


.hc .seriesHeading h2 {color: #800023; background:none;border:none; padding-bottom:0;}
.hc .breadcrumb a:hover, .hc .rangeColour {color: #800023;}
.hc h3, .hc h5, .hc .main a, .hc .tab-wrapper a, .hc #tab-menu li.active a {color: #800023;}
.hc .main a:hover {color: #800023;}
.hc h2 {background: #800023 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #460013;}
.hc #tab-menu li.active a{color: #800023;}
.hc .main .prodDetail .prodDetailContent .textContent a {color:#800023; text-decoration: none; border-bottom: 1px solid #ccc;}
.hc .main .prodDetail .prodDetailContent .textContent a:hover {border-bottom: none;}

.prodInfoDiscontinuedMessage {
	border: 1px solid #ccc;
	padding: 7px;
	color: #aaa;
	font-size: 12px;
	margin-top: 10px;
	line-height: 18px;
}

/* architectural */

.arch .seriesHeading h2 {color: #071f79; background:none;border:none; padding-bottom:0;}
.arch .breadcrumb a:hover, .arch. rangeColour {color: #071f79;}
.arch h3, .arch h5, .arch .main a, .arch .tab-wrapper a, .arch #tab-menu li.active a {color: #071f79;}
.arch .main a:hover {color: #071f79; xborder-bottom: 1px solid #00124B;}
.arch h2 {background: #071f79 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #00124B;}
.arch #tab-menu li.active a{color: #071f79;}
.arch .main .prodDetail .prodDetailContent .textContent a {color:#071f79; text-decoration: none; border-bottom: 1px solid #ccc;}
.arch .main .prodDetail .prodDetailContent .textContent a:hover {border-bottom: none;}



/* designer collection 

Colours
bg – #bbc8da
text – #8daad8

streamline – #8daad8 / #6387c0
accent – #9e4b41 / #843026
synergi – #9ebdbe / #79a3a4
couture – #a7a9ac / #83888f
estilo – #5a4a33

*/

.dc h2 {background: #bbc8da url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #8daad8;}
.dc .main a.downloadFile:hover {border:1px solid #ccc; color:#bbc8da;}


.dc.Streamline h2 {
	background: #8daad8 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #6387c0;}
.dc.Streamline h5,
.dc.Streamline h5 a,
.dc.Streamline #tab-menu li.active a,
.dc.Streamline ul.Level2 li.active a, 
.dc.Streamline .main h3, 
.dc.Streamline .main h3 a,
.dc.Streamline .item dl dt:hover,
.dc.Streamline .main a.downloadFile:hover {
	color: #6387c0;
}
.dc.Streamline ul.Level2 li.active  ul.Level3 li.active a {
	color:#6387c0 !important;
}

.dc.Accent h2 {
	background: #9e4b41 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #843026;}
.dc.Accent h5,
.dc.Accent h5 a,
.dc.Accent #tab-menu li.active a span, 
.dc.Accent ul.Level2 li.active a, 
.dc.Accent .main h3, 
.dc.Accent .main h3 a, 
.dc.Accent .item dl dt:hover,
.dc.Accent .main a.downloadFile:hover {
	color:#843026;
}
.dc.Accent ul.Level2 li.active  ul.Level3 li.active a {
	color:#843026 !important;
}


.dc.Synergi h2 {
	background: #9ebdbe url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #79a3a4;}
.dc.Synergi h5,
.dc.Synergi h5 a,
.dc.Synergi #tab-menu li.active a,
.dc.Synergi ul.Level2 li.active a, 
.dc.Synergi .main h3, 
.dc.Synergi .main h3 a, 
.dc.Synergi .item dl dt:hover,
.dc.Synergi .main a.downloadFile:hover {
	color:#79a3a4;
}
.dc.Synergi ul.Level2 li.active  ul.Level3 li.active a {
	color:#79a3a4 !important;
}


.dc.Couture h2 {
	background: #a7a9ac url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #83888f;}
.dc.Couture h5,
.dc.Couture h5 a,
.dc.Couture #tab-menu li.active a,
.dc.Couture ul.Level2 li.active a, 
.dc.Couture .main h3, 
.dc.Couture .main h3 a, 
.dc.Couture .item dl dt:hover,
.dc.Couture .main a.downloadFile:hover {
	color:#83888f;
}
.dc.Couture ul.Level2 li.active  ul.Level3 li.active a {
	color:#83888f !important;
}


.dc.Estilo h2 {
	background: #5a4a33 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #42331e;}
.dc.Estilo h5,
.dc.Estilo h5 a,
.dc.Estilo #tab-menu li.active a,
.dc.Estilo ul.Level2 li.active a, 
.dc.Estilo .main h3, 
.dc.Estilo .main h3 a, 
.dc.Estilo .item dl dt:hover,
.dc.Estilo .main a.downloadFile:hover {
	color:#42331e;
}
.dc.Estilo ul.Level2 li.active  ul.Level3 li.active a {
	color:#42331e !important;
}



.homeintroFinishes {margin:5px 2px 15px 2px;padding:0; float: left;width:137px; }
.homeintroFinishes a {background:#eee;display:block; padding:5px 8px; height:400px; margin:0; }
.homeintroFinishes.Streamline a:hover {background-color:#8daad8;}
.homeintroFinishes.Accent a:hover {background-color:#9e4b41;}
.homeintroFinishes.Synergi a:hover {background-color:#9ebdbe;}
.homeintroFinishes.Couture a:hover {background-color:#a7a9ac;}
.homeintroFinishes.Estilo a:hover {background-color:#5a4a33;}
.homefinishesHeader {color:#666;text-align:center;display:block;width:113px;padding:10px 0;height:18px;font-size:18px;}
a:hover .homefinishesHeader {color:#fff;}
.homeFinishTab {border:1px solid #333; width:113px; height:98px;padding:3px;margin-bottom:10px;display:block;}


.introFinishes {float: right;padding:5px 8px; height:400px; }
.finishesHeader {color:#fff;text-align:center;display:block;width:85px;padding:3px 0 0;height:16px;}
.t30 {background:transparent url(../../assets/image/dc/banners/heroes/30transblack.png) repeat 0 0;}
.t60 {background:transparent url(../../assets/image/dc/banners/heroes/60transblack.png) repeat 0 0;}
.smallFinishTab {border:1px solid #333; width:80px; height:79px;padding:3px;margin-bottom:5px;}
.CP {background: #fff url(/assets/image/dc/finishes/CP.jpg) no-repeat 50% 5px;}
.SC {background: #fff url(/assets/image/dc/finishes/SC.jpg) no-repeat 50% 5px;}
.BSC {background: #fff url(/assets/image/dc/finishes/BSC.jpg) no-repeat 50% 5px;}
.SS {background: #fff url(/assets/image/dc/finishes/SS.jpg) no-repeat 50% 5px;}
.FN {background: #fff url(/assets/image/dc/finishes/FN.jpg) no-repeat 50% 5px;}
.OM {background: #fff url(/assets/image/dc/finishes/OM.jpg) no-repeat 50% 5px;}
.EB {background: #fff url(/assets/image/dc/finishes/EB.jpg) no-repeat 50% 5px;}
.WH {background: #fff url(/assets/image/dc/finishes/WH.jpg) no-repeat 50% 5px;}


/* will's DC style */

.dcEntrance { padding:0;}
* html .dcEntrance{height: 200px; padding: 10px 0 10px 0;}
.dcEntrance .item {float:left; width: 160px; margin:0 5px 0 5px; position: relative; padding: 0 0 30px 0; border: 1px solid #e3e3e3; text-align: center;height:220px;}
.dcEntrance .item dl {display:block; text-align: left;}
.dcEntrance .item dl dt {display:block; position: absolute; background: #f3f3f3; width: 140px; left: 0; bottom: 0; color: #333; padding: 10px; text-transform: capitalize; text-align: center; border-top: 1px solid #e3e3e3;height: 30px;line-height:1.3;}
.dcEntrance .item dl dd {position: absolute; padding: 5px; width: 150px; left: -1px; bottom:50px; background: #fff; border: 1px solid #e3e3e3; opacity:0.8; filter:alpha(opacity=80);}
.dcEntrance .item dl dd ul{padding: 0 0 0 5px;margin:5px 0 5px 5px;}
.dcEntrance .item dl dd li{list-style:square; margin: 0 0 5px 5px; font-size: 12px;}
.entranceH3 {float:left; position:absolute; xtop:260px; bottom:0; padding:10px; }
.entranceH3 h3 {color: #8daad8; font-size: 24px; xline-height: 26px; }
.dcEntrance h3 {font-size: 24px; xline-height: 26px; padding:20px 10px 8px 5px; }
.dcEntrance h5 {margin:10px 0 5px;}

/* space rangers, ACTIVATE! */
.dcEntrance .item dd {display:none; }
.dcEntrance .item:hover dd {display:block;}





/* -------------------- header! ---------------------------- */

.header {background: #fff url(../images/layout/header/lip-rep.jpg) repeat-x bottom; height: 100px; position: relative; height: 116px;}
.headerContent{width: 940px; position: relative; margin: 0 auto;}
.header h1 {top:10px; left:0; position: absolute;}
.header h1 a {display:block; background: url(../images/layout/header/logo.jpg) no-repeat center;}
.header h1, .header h1 a {width:206px; height: 89px; position: absolute;}
.header h1 span {display: none;}
.header a {text-decoration: none;}



/* -------------------- breadcrumb ---------------------------- */

.breadcrumb {padding: 15px 10px; border-bottom: 1px solid #ccc; color: #bbb; background-color: #f9f7f7;}
.breadcrumb a {color: #bbb; border-bottom: 1px solid #ddd; text-decoration:none;}
.breadcrumb a:hover {border-bottom: none; text-decoration:none;}




/* -------------------- page content area ---------------------------- */

.main {min-height: 300px; float: right; width:716px;overflow:hidden;}

.GuaranteeLogo {width:120px; text-align:right; padding:0px; height:1px; position:absolute; top:10px; right:15px;}
.GuaranteeLogoDetail {width:80px; height:1px; text-align:right; position:absolute; top:55px; right:-60px; xfloat:right; margin:0; display:block;}

.textPage {padding:20px;}
.textPage p {margin:10px 0;}

/* for our range series landing pages */


.intro {padding: 10px 10px 15px 16px;}
.intro p{font-size: 16px; line-height: 26px; text-align:right; color:#898989;}

.greyLine {border: 1px solid #eee;margin:0; }

.Where .infoOuterWrapper, .Information .infoOuterWrapper {}
.infoOuterWrapper { margin:15px 0 5px 12px; padding:15px 20px; border:1px solid #ccc;width:650px;}
.tabbyContent .infoOuterWrapper { margin:5px 5px 15px; padding:15px 20px; border:1px solid #ccc;width:640px;}
.infoWrapper { }
.leftGuarLogoWrapper {width:140px; float:left;padding:10px 0 10px 0; }
.leftGuarLogoWrapper img {max-width:140px; }
.leftGuarLogoWrapper p {text-align:center; }
.rightGuarTextWrapper {margin-left:200px;padding-bottom:10px; }
.rightGuarTextWrapper a{color:#000; text-decoration: none; border-bottom: 1px solid #ccc;}
.rightGuarTextWrapper a:hover{border-bottom: none;}
.Where .rightGuarTextWrapper h5{text-transform:uppercase;}
.rightGuarTextWrapper p.Address span, .rightGuarTextWrapper p.EmailWebsite span, .rightGuarTextWrapper p.PhoneFax span {clear:right; display:block; }




/* information pages colours & attributes */
.Where h2, .Information h2, .simpleH2 {background:#898989 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #333;}
.Information h4{display:none;}
.Information h5{color: #000; text-transform: none; padding: 0 0 5px 0;}
.Information h6{}
.Information ul{}
.Information .main li{}
.Information p{ padding: 0 0 0px 0;}
.Where .strong{font-weight: normal; color: #000;}
.Information p.prodInfoPartNo {padding: 0 0 0px 0; color: #666; font-weight:bold;}
.Information .main dd { width: 325px; }
.main .glossary dd { width: 325px; }


/* latest news pages colours & attributes */
.Where h2, .Latest h2, .simpleH2 {background:#898989 url(../images/layout/shadows/down-black-65.png) repeat-x top; border: 1px solid #333;}
.Latest h4{display:none;}
.Latest h5{color: #000; text-transform: none; padding: 0 0 5px 0;}
.Latest h6{}
.Latest ul{}
.Latest .main li{}
.Latest p{ padding: 0 0 0px 0;}
.Where .strong{font-weight: normal; color: #000;}
.Latest p.prodInfoPartNo {padding: 0 0 0px 0; color: #666; font-weight:bold;}
.Latest .main dd { width: 325px; }
.main .glossary dd { width: 325px; }




/* prod detail pages */

.prodDetailLeft {width:392px; float:left;padding:0;
}

/* prod detail image gallery */


.prodDetailImageGallery {
width:380px; float:left; background: #eee; padding:10px 0 10px 10px; xborder: 1px solid #eee; border-left:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc;margin-bottom:5px;}
	.prodDetailImageGallery .prodDetailImageTitle {
	padding:10px; text-align: left; min-height: 15px; position: relative; background-color:#fff;border-top:7px solid #EEEEEE; margin-right:10px;line-height: 125%;}
		.prodDetailImageGallery .prodDetailImageTitle span {
		display: block; color:#898989;}
		.prodDetailImageGallery .prodDetailImageTitle span span.captionFileName {
		font-weight:bold;}
		.prodDetailImageGallery .prodDetailImageTitle span span.captionDescription {
		display:none;}

		.prodDetailImageGallery .prodDetailImageTitle span span.captionProduct {
		padding-top: 3px;}
			.captionFunction {
			}
				.arch .prodDetailImageGallery .prodDetailImageTitle span.captionFinish {
				display:none;}


.main .prodDetail .image {
float: left; width:370px; background: #fff; text-align: center; height: 370px; position: relative; overflow: hidden; margin:0; }
	.main .prodDetail .image a {
	position: absolute; top:0; left:0; display: block; height: 370px; width: 370px; text-indent: -999em; background-position: center; background-repeat: no-repeat;}

.main .prodDetail .prodDetailImageGallery .moreImagesThumbs {
padding:0;margin:0;}
	.main .prodDetail .prodDetailImageGallery .moreImagesThumbs li {
	float: left; display: block; margin:0;}
	.main .prodDetail .prodDetailImageGallery .moreImagesThumbs li a {
	float: left; display: block;border:4px solid #ddd; width:47px; height: 47px; margin: 10px 8px 0 0; background: #fff;background-position: 50% 50%; background-repeat:no-repeat;}
	.main .prodDetail .prodDetailImageGallery .moreImagesThumbs li a:hover {
	border-color: #ccc;}


/* prod downloads */

.prodDownloads {
	clear:left;
	padding:0;
	border:1px solid #ccc;
}
.prodDownloads.inline {clear:none;margin-left:20px;}
.prodDownloadButton {background: #eee url(/assets/image/grad-ccc-darker-bg.jpg) repeat-x 0 50%; }
.prodDownloadButton h3 {padding:10px 5px 10px 60px; color:#fff;
behavior: url(../scripts/iepngfix/iepngfix.htc);
!important;background: transparent url(/assets/image/download-grey.png) no-repeat 10px 50%;display:block;}
.prodDownloadFiles {}
.downloadBG {background: url(../images/layout/gradient/up-lightgrey-to-white-long.jpg) repeat-x 0 bottom;  }
.main a.downloadFile {border:1px solid #EEEEEE;padding:10px 10px 10px 55px; line-height:120%; margin:5px; display:block; color:#898989;font-size:12px; min-height:19px;}
.arch .main a.downloadFile:hover {border:1px solid #ccc; color:#071F79;}
.hc .main a.downloadFile:hover {border:1px solid #ccc; color:#800023;}
.pdf {background: url(/assets/image/icons/pdf-grey.gif) no-repeat 8px 6px;}
.eps {background: url(/assets/image/icons/eps-grey.gif) no-repeat 8px 6px;}
.jpg {background: url(/assets/image/icons/jpg-grey.gif) no-repeat 8px 6px;}
.doc {background: url(/assets/image/icons/doc-grey.gif) no-repeat 8px 6px;}
.pdf:hover {background-image: url(/assets/image/icons/pdf.gif);}
.eps:hover {background-image: url(/assets/image/icons/eps.gif);}
.jpg:hover {background-image: url(/assets/image/icons/jpg.gif);}
.doc:hover {background-image: url(/assets/image/icons/doc.gif);}
.filesize {color:#bbb; font-size:small;}
p.downloadDisclaimer {margin:5px;font-size:9px;}
.downloadBG  .webProduct  {color: navy; font-size: larger;}
.downloadBG  .webProductNote {color: black;}
.downloadBG  .note  {font-size: smaller;}
/* prod detail information */


.main .prodDetail{padding: 0px 0;}
.main .prodDetail .prodNotes {padding:3px 0 3px;}
.main .prodDetail .prodNotes p {color: #333;}

.twocolDetails .productDescription {float:left; width:135px; display:inline;}


.main .prodDetail .prodDetailContent {float: left; width:290px;padding:7px 0 4px 15px;}
.main .prodDetail .prodDetailContent .textContent {clear: both; padding: 0;}
.main .prodDetail .prodDetailContent .textContent h4{font-weight:normal; text-transform:uppercase; margin: 10px 0 0px; color:#333;}
.main .prodDetail .prodDetailContent .textContent ul{padding: 2px 0 5px 12px; color: #333;}
.main .prodDetail .prodDetailContent .textContent li{list-style: disc; padding: 0 0 0 0; xlist-style-position: inside; color: #666;}
.main .prodDetail .prodDetailContent .textContent a {text-decoration: none; border-bottom: 1px solid #ccc;}
.main .prodDetail .prodDetailContent .textContent a:hover {border-bottom: none;}

.main .prodDetail .prodDetailContent .textContent .productDescriptionIntro {padding: 0 0 7px 0; border-bottom: 0px solid #eee;}
.main .prodDetail .prodDetailContent .textContent .productDescriptionIntro h2 {background:none; text-align:left; color:#898989; border:none; padding:10px 30px 5px 0;}
.main .prodDetail .prodDetailContent .textContent .productDescriptionIntro p {color:#333;}

.main .prodDetail .prodDetailContent .textContent .productDescription {padding: 0 0 7px 0; border-bottom: 1px solid #eee;}

.main .prodDetail .prodDetailContent .textContent p.prodInfoFinishesAvailable {padding: 5px 0; color: #666; }
.main .prodDetail .prodDetailContent .textContent p.prodInfoFinishesAvailable  span {margin-right:5px;}
.main .prodDetail .prodDetailContent .textContent p.prodInfoFinishesAvailable  a {color:#aaa; text-decoration: none; border-bottom: 1px solid #ccc; }
.main .prodDetail .prodDetailContent .textContent .productDescription span.prodInfoFinishesAvailable  a {color:#aaa; text-decoration: none; border-bottom: 1px solid #ccc;font-size:13px; }
.main .prodDetail .prodDetailContent .textContent p.prodInfoFinishesAvailable  a:hover {border-bottom: none; white-space:nowrap; color:#666;}
.main .functionThumbInfo p.prodInfoFinishesAvailable  a {color:#aaa; text-decoration: none; border-bottom: 0px solid #ccc; }
.main .functionThumbInfo span.prodInfoFinishesAvailable  a {color:#aaa; text-decoration: none; border-bottom: 0px solid #ccc; }

.main .prodDetail .prodDetailContent .textContent p.prodInfoPartNo {padding: 0 0 0px 0; color: #666; font-weight:bold;}

.prodDetailInfo {
	* margin-top: 10px;
/*
	pdadding-left:406px;
	clear:right;

	* margin-top: 10px;
	* float: right;

	margin-left: 0px;
	* margin-left: -8px;
	-margin-left: 0px;

	margin-right: 15px;
	*/
}

.productDescription dl { margin: 5px 0 10px 0; padding: 0; }
.productDescription dt { width: 40px; float: left; margin: 0 0 0 0; padding: 8px 5px; color: #333; }
.productDescription dd { float: left; width: 225px; margin: 0 0 0 0; padding: 8px 5px; color: #898989; }



/* -------------------- tabs area ---------------------------- */

#tabs-block .tabbyContent h2 {background:none; text-align:left; color:#898989; border:none; padding:10px 0 0 0;}

.tabbyContent h3 { margin-bottom:0px; padding-left:5px;}
.tabbyContent ul { margin:5px 0px 5px 15px; position: relative;}
.tabbyContent li { margin:5px 25px 0; list-style-type: disc; font-size:13px; color:#333; font-weight:normal; margin:5px 0 0; }

.prodInfoTab {width:460px;}
.prodInfoTabInstallPics {width:200px; margin-left:30px; border-left:1px solid #ccc; padding-left:15px;padding-bottom:20px;}
.prodInfoTabInstallPics img {margin-top:15px;}


/* .tabs{position: relative;} -- this kills ie7 :( */

.tabs{min-height: 230px; padding: 15px 0 15px 16px;}
.tabs p{margin: 10px 0;}
.tabsRight{float:right; width: 134px; height: 46px; background: url(../images/layout/gradient/up-lightgrey-to-white-fade-right.jpg) no-repeat bottom right; overflow: hidden; border: none;}

/* this is menu to tabs! */
#tab-menu{background:url(../images/layout/gradient/up-lightgrey-to-white.jpg) repeat-x bottom; height: 32px; position: relative; margin: 20px 0 0; border:1px solid #eee;border-bottom:none; clear: both;}

.main #tab-menu ul { margin:0; list-style-type: none;}
.main #tab-menu li {float: left; display: block; margin:0 0 0 0;line-height:13px; }
.main #tab-menu li a{text-decoration: none; font-size: 13px; display: block; float: left; color: #666; cursor: pointer; border-bottom: none;}
.main #tab-menu li a span{display: block;padding: 11px 20px 8px; float: left;}

.main #tab-menu li a:hover{color: #000;}
.main #tab-menu li.active a{background: #fff url(../images/layout/gradient/up-lightgrey-to-white-left.jpg) no-repeat bottom left;}
.main #tab-menu li.active a span{background: url(../images/layout/gradient/up-lightgrey-to-white-right.jpg) no-repeat bottom right;}
em.eSolno1 {background:url(../../assets/image/dc/numberedCircle1.png) no-repeat 0 0 !important; padding:0;margin:-6px 0 -10px; display:block; width:32px; height:25px; float:left;}
em.eSolno2 {background:url(../../assets/image/dc/numberedCircle2.png) no-repeat 0 0 !important; padding:0;margin:-6px 0 -10px; display:block; width:32px; height:25px; float:left;}
em.eSolno3 {background:url(../../assets/image/dc/numberedCircle3.png) no-repeat 0 0 !important; padding:0;margin:-6px 0 -10px; display:block; width:32px; height:25px; float:left;}



/* tabs again when there's no javascript! */
.main .tabs h4{font-size: 18px; text-transform: uppercase; color: #898989; padding: 10px 0; clear: both; border-top: 1px solid #ddd; margin: 10px 0 0;}



/* thumbnails of products */

.thumbWrapper{display: block; float: left; margin: 10px 7px 10px 0; text-decoration: none; position: relative; padding:0px 0; width:133px;}
.prodAccessory { margin: 20px 0;}
.prodAccessory .thumbWrapper{padding:0;margin: 0px 7px 10px 0;}
.prodAccessory .thumbWrapper .thumbImgWrap { background-position: 50% top;}
.prodAccessory .thumbWrapper  span {display: block; width:125px; height:125px; text-align:center; background-position: 50% 50%; background-repeat: no-repeat;background-color:#fff;xborder: 4px solid #ddd; }


.thumbGrid {padding: 0; xwidth:725px;  }

.thumbGrid .thumb {display: block; text-decoration: none;}
.thumbGrid .thumb:hover img, .thumbGrid .thumb:active img { xborder-color: #ccc;}
.thumbGrid .thumb strong { display: block; font-size: 13px; color: #000; text-align: center; padding: 10px; cursor: pointer; font-weight:normal;}

.thumbGrid .thumbWrapper{min-height: 190px;}
.thumbGrid .thumbWrapper  a.thumb .thumbImgWrap {display: block; width:125px; height:125px; text-align:center; background-position: 50% 50%; background-repeat: no-repeat;background-color:#fff;border: 4px solid #ddd; }
.thumbGrid .thumbWrapper  a.thumb .thumbImgWrap  { }
.thumbGrid .thumbWrapper  a.thumb:hover  .thumbImgWrap   {border-color: #bbb;}


.thumbWrapperNoBorder {display: block; border: none; float: none; margin: 0 20px 0 0; text-decoration: none; position: relative; padding:10px;}
.thumbWrapperNoBorder a, .thumbWrapperNoBorder a:hover {border: none;}


a.thumb, a.thumb:active {display: block; text-decoration:none;  padding:0px; text-align:center; width:133px; border-bottom:0px; }

.thumbInfo {padding:0px 0;}



/* hide this */
.thumbGrid li span.breadcrumb{display: none;}

/* finishes */
.thumbGrid li span.finishes{text-align: center; display: block;font-size: 11px;}
.thumbGrid li span.finishes a{padding:0 2px; text-decoration: none; color: #888;}
.thumbGrid li span.finishes a:hover{color:#333;}

/* intro copy is removed for grid view */
.thumbGrid li p{display: none;}


/* this is the complex version */
.thumbGrid.detailedResults li {display: block; float: none; width:auto; height: 180px;}
.thumbGrid.detailedResults li .thumb{position: absolute; top:0; left:0;}
.thumbGrid.detailedResults li .thumb strong{position: absolute; top:0; left:170px; width:400px; text-align: left; font-size: 18px;}
.thumbGrid.detailedResults li span.finishes{position: absolute; top:32px; left:176px; width:520px; background:#f5f5f5 url(../images/advancedSearch/detailed/finishes-word.jpg) no-repeat 5px 50%; padding: 5px 3px 5px 65px; text-align: left;}
.thumbGrid.detailedResults li span.breadcrumb{position: absolute; top:55px; left:176px; width:520px; padding: 5px 3px; text-align: left; font-size: 11px; color: #777; display: block; text-transform: lowercase;}
.thumbGrid.detailedResults li span.breadcrumb a{text-decoration: none; color: #666;}
.thumbGrid.detailedResults li span.breadcrumb a:hover{color: #000;}
.thumbGrid.detailedResults li p{color: #666; width:520px; position: absolute; top:80px; left:180px; height: 80px; overflow: hidden; display: block;}
.thumbGrid.detailedResults li p a{color:#000; text-decoration: none;}
.thumbGrid.detailedResults li p a:hover{color:#444;}



.functionWrapper { margin: 30px 0;}
.functionThumb{display: block; border: none; margin: 0 20px 0 0; text-decoration: none; position: relative; padding:0px 10px;float:left; background-position: 50% 50%; background-repeat: no-repeat; width:80px; height:70px;}
.functionThumbInfo {padding:0px 0;margin-left:120px;}







/* this will be used to clear floated divs. see the ie stylesheet for the zoom fix */
/* thanks to http://www.positioniseverything.net/easyclearing.html :) */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow: hidden;}

.clear{clear:both; height: 1px; overflow: hidden; display: block;}



/* z-indexes, togetha, foreva ------------------*/
/* why? easier to deal with it all in one place */
.header, .footer{z-index: 1000;}
.leftBar{z-index: 500;}
.main{z-index: 400;}
.tab-menu{z-index: 500;}
.tabsRight{z-index: 600;}
.footerLeftMenuFader{z-index: 700;}
.popWide, .popWide .head, .popWide .foot{z-index: 1000;}
.popWide .body{z-index:1100;}
#grid{z-index: 1200;}
.simpleTips, .questionMarkTips, .searchResultsGrid li .thumbNail .bigThumbNail{z-index: 9999;}

.carousel{z-index: 420;}
.carousel .carouselContent{z-index: 440;}
.carousel .carouselMenu{z-index: 450;}

/* end z-indexes, togeth'd, forev'd ------------------*/




.m1{position: absolute; top:76px; right: 0; width:75%;}
.m1 a{float: right; margin:2px; text-transform: uppercase; color: #9a9a9a; padding: 10px 15px; font-size: 11px; position: relative;}
.m1 a.active{border:2px solid #ececec; border-bottom-width: 0; color: #000; background: #fff  url(../images/layout/header/m1-grad-rep.jpg) repeat-x bottom; margin: 0;}
.m1 a:hover{color: #444;}

/* false rounding on corners */
.m1 a span, .m1 a em{display: block; background: #fff; height: 1px; width: 1px; position: absolute; top:-2px;}
.m1 a span{right: -2px;}
.m1 a em{left: -2px;}

/* this makes the rightmost one hard against the right menu when not active */
.m1 a.rightMost{padding-right: 0;}
.m1 a.rightMost.active{padding-right: 15px;}

/* contact bits */
.headerContact{width:117px; height: 39px;background: url(../images/layout/header/contact-backer.jpg); position: absolute; top:15px; right:0;}
.headerContact a{color: #777; display: block; width: 100%; height: 100%;}
.headerContact a:hover{background: url(../images/layout/header/contact-backer-darker.jpg); color: #333;}
.headerContact a span{position: absolute; top:28px; left:58px; display: block; font-size: 11px; text-transform: uppercase; width:80px;}

/* some shadows */
/* overflow: hidden; is for IE6's failures, otherwise it'll pad out to standard line height! */
.headerShadow{background: url(../images/layout/shadows/down-black-35.png) repeat-x; height: 6px; width:100%; position: absolute; bottom: -6px; left:0; overflow: hidden; display: block;}


.footer{height: 80px; position: relative; background: #fff url(../images/layout/footer/footer-fade.jpg) no-repeat top left; clear: both; position: relative; width:940px; margin: 0 auto; border: 1px solid #fff; border-top-width: 0;} /* the border is to hide the leftBar stuff! */
.footerLeftMenuFader{width:220px; height: 168px; background: url(../images/layout/footer/footer-left-fade.jpg) no-repeat; display: block; position: absolute; top:-152px; left:0; border-width: 0;}
/* .range .footerLeftMenuFader{background: none;} I'm not sure why you got rid of this Tracey? It should only be disabled on pages without the left menu? */
.footer ul{width:940px; margin: 0 auto; text-align:center; padding: 30px 0 0; position: relative; }
.footer ul li{display: inline; font-size: 11px; color: #999; padding:0 6px 0; border-right: 1px solid #ddd}
.footer ul li:last-child{border:none; padding-right: 0;}
.footer ul li a{color:#999; text-decoration: none; border-bottom: 1px solid #ddd;}
.footer ul li a:hover{color:#333;}

/* main content */
.content{width:940px; margin: 0 auto; position: relative; min-height: 300px; padding:0; background: url(../images/layout/leftBar/bar-grey-for-body-rep.jpg) repeat-y left;}
.contentTopRightShadow{width: 16px; height: 357px; position: absolute; top:0; right:-16px; background: url(../images/layout/shadows/content-topRight-fader.jpg) no-repeat top left;}
.contentTopLeftShadow{width: 16px; height: 357px; position: absolute; top:0; left:-16px; background: url(../images/layout/shadows/content-topLeft-fader.jpg) no-repeat top left;}

/* sometimes it's full width */
.content.fullwidth{background: #fff;}

/*-------------------------------------- left bar ---------------------------------------------*/

.leftBar{width:222px; float:left; min-height: 300px; margin-left: -2px;}


/*--------		 'm2' is our main menu on the left. It's a <ul> 
					see above for range specific colours			 -----------*/

/* 1st level - Category */


.m2{zoom: 1;margin:0; padding:0;}
.m2 li{zoom: 1;display:block; padding: 0; margin: 0; line-height: 0;}
.m2 a{zoom: 1;text-decoration: none; color:#fff;margin:0; padding:0;}
.m2Main{display: block; height: 47px; color: #fff; margin: 0; border-right: 1px solid #666;}
.m2Main:hover{color:#ddd;}
.m2Main span{font-size: 12px; letter-spacing: 1px; padding: 17px 0 0 22px; display: block; text-transform: uppercase; line-height: 18px; }

.m2Search .m2Main{color:#666; border: 0px;}
.m2Home .m2Main{zoom: 1;background:#800023 url(../images/layout/leftBar/m2-coloured-back-red.jpg);}
.m2Home .m2Main .parent{color:#800023;}
.m2Residential .m2Main{zoom: 1;background:url(../images/layout/leftBar/m2-coloured-back-lightblue.jpg);}
.m2Architectual .m2Main{zoom: 1;background:url(../images/layout/leftBar/m2-coloured-back-blue.jpg);}
.m2Information .m2Main{background:url(../images/layout/leftBar/m2-coloured-back-grey.jpg);}

.m2 .theLastOne{background:url(../images/layout/leftBar/bottom-item-fader.png) no-repeat top right; height: 200px;}



/* 2nd level - Series */

.sub, .m2SearchDrop form, li.m2SearchLocation form{position: relative; margin-left: 1px; border-left: 1px solid #ddd;}
.subTopRightShadow{position: absolute; top:0; right: 0; width:9px; height: 72px; }
.sub ul{zoom: 1; padding:5px 0px 12px 0px; background: transparent; xborder-bottom: 1px solid #e3e3e3;}
.sub ul li{line-height: 110%;zoom: 1;}
.sub ul.Level2  li.active {background-color: #fff;padding-left:8px; margin-left:-8px;border:1px solid #ddd;}
.sub ul.Level2 li.active ul.Level3  li.active {xbackground-color: #fff;padding-left:0; margin-left:10px; border:none;}
.sub ul li a{zoom: 1;display: block; font-size: 12px; color: #666; padding: 10px 15px 8px; border-top: 1px solid #eee;}
.sub ul li a:hover{color:#222;}


/* inline distributor search */

div.m2SearchLocation form, div.m2SearchLocation .distributorList{width:300px; float:left; display:block;padding:20px 10px 15px 20px;}
div.m2SearchLocation form {width:340px;}
div.m2SearchLocation .distributorList{width:280px;}
div.m2SearchLocation form h3, div.m2SearchLocation form p {margin-bottom:10px;width:300px:}
div.m2SearchLocation h4 {margin:20px 0;}


/* another level! */
.sub ul li ul li{margin-left: 10px; padding:0;}

/* the 'HasChildren' stuff for items with children */
.m2 .HasChildren{}

/* some range-specific colours: */
.m2Home .sub ul li.active a{color: #800023;}
.m2Residential .sub ul li.active a{color: #2b5a73;}
.m2Architectual .sub ul li.active a{color: #021c70;}
.m2Where .sub ul li.active a{color: #000;}
.m2Information .sub ul li.active a{color: #000;}

/* then reset below! */
.m2 .sub ul li ul li a {color:#666 !important; font-weight:normal !important;}


/* ... unless it's active too, or hover! */
.m2Home .sub ul li.active ul li a:hover {color:#000 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Residential .sub ul li.active ul li a:hover {color:#000 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Architectual .sub ul li.active ul li a:hover {color:#000 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Where .sub ul li.active ul li a:hover {color:#000 !important;}
.m2Information .sub ul li.active ul li a:hover {color:#000 !important;}

.m2Home .sub ul li.active ul li.active a {color:#800023 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Residential .sub ul li.active ul li.active a {color:#2b5a73 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Architectual .sub ul li.active ul li.active a {color:#021c70 !important; border-left:18px solid #EEE;margin-left:-18px;}
.m2Where .sub ul li.active ul li.active a {color:#333 !important;}
.m2Information .sub ul li.active ul li.active a {color:#333 !important;}

/* this controls what displays with accordion action and so on: */
.m2 .sub ul li ul {display: none;margin:0; padding:0;}
.m2 .sub ul li.active ul {display: block; padding-right:8px;}
.m2 .sub ul li.active ul li ul{display: none;margin:0; padding:0;}
.m2 .sub ul li.active ul li.active ul {display: none; background-color:#f4f5f8; padding-right:5px;}


/* 3rd level */
.sub ul li ul{padding: 0; background: none;margin:0;}
.sub ul li ul li{border:none;}
.sub ul li ul li a{font-weight: normal; padding: 10px 0 8px 15px;}


/* force level 4 to not be 'active' colour */
.m2 .sub ul li.active ul li.active .Level4 li a{color:#666 !important;}
.m2 .sub ul li.active ul li.active .Level4 li a:hover{color:#000 !important;}


/* if we want to draw attention to an item */
.lookAtMe{background: #ffe;}


/* search stuff */
.m2Search{display: block;}
#m2SearchDrop{display: none;}
#m2SearchDrop form, .m2SearchLocation form {padding:20px 10px 15px 20px;}
#m2SearchDrop .text, .m2SearchLocation .text, .ourRangeHome .search .text{border:1px solid #ccc; background: #fff; font-size: 14px; padding: 4px; width:130px;display: block; float: left; color: #666;}
#m2SearchDrop .text:hover, .m2SearchLocation .text:hover, .ourRangeHome .search .text:hover{border-color: #aaa;}
#m2SearchDrop .submit, .m2SearchLocation .submit, .ourRangeHome .search .submit{background: url(../images/layout/arrows/button-right-grey-arrow.gif) no-repeat 0 0; color: #000; font-size: 11px; text-transform: uppercase; display: block; float: left; border: none; width:34px; height: 27px; font-weight: bold; cursor: pointer;}
#m2SearchDrop .submit:hover, .m2SearchLocation .submit:hover, .ourRangeHome .search .submit:hover{background-position: 0 -27px; color: #fff;}
#m2SearchDrop a, li.m2SearchLocation a, .ourRangeHome .search a{color: #666; display: block; font-size: 12px; padding: 15px 0 20px; clear: both;}
#m2SearchDrop a:hover, .m2SearchLocation a:hover, .ourRangeHome .search a:hover{color: #000;}
.m2 #m2SearchDrop form .clear{height:20px;}


#m2SearchDrop .text, .m2SearchLocation .text, .ourRangeHomeNew .search .text{border:1px solid #ccc; background: #fff; font-size: 14px; padding: 4px; width:130px;display: block; float: left; color: #666;}
#m2SearchDrop .text:hover, .m2SearchLocation .text:hover, .ourRangeHomeNew .search .text:hover{border-color: #aaa;}
#m2SearchDrop .submit, .m2SearchLocation .submit, .ourRangeHomeNew .search .submit{background: url(../images/layout/arrows/button-right-grey-arrow.gif) no-repeat 0 0; color: #000; font-size: 11px; text-transform: uppercase; display: block; float: left; border: none; width:34px; height: 27px; font-weight: bold; cursor: pointer;}
#m2SearchDrop .submit:hover, .m2SearchLocation .submit:hover, .ourRangeHomeNew .search .submit:hover{background-position: 0 -27px; color: #fff;}
#m2SearchDrop a, li.m2SearchLocation a, .ourRangeHomeNew .search a{color: #666; display: block; font-size: 12px; padding: 15px 0 20px; clear: both;}
#m2SearchDrop a:hover, .m2SearchLocation a:hover, .ourRangeHomeNew .search a:hover{color: #000;}


.m2SearchDrop .submit.formSubmitCheckerSubmitted{background: url(../images/icons/spinner-666-arrow.gif) no-repeat center; text-indent: -999em;}

/* this is just for searching locations: */
.m2 li.m2SearchLocation {}
.m2SearchLocation .intro{font-size: 14px; color: #666; line-height: 18px; padding: 0 0 10px;}
.m2 li.m2SearchLocation form{padding: 15px 15px 0; xbackground:#fff url(../images/layout/leftBar/right-faint-shadow.jpg) repeat-y right; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.m2 li.m2SearchLocation form .theSearchRow{/* has the main search inputs in it */ height:20px;}
.m2 li.m2SearchLocation form hr{ border:none; clear: both; height: 5px; background: none; border-width: 0px; color: #fff; overflow: hidden;}
.m2 li.m2SearchLocation form .fieldSetsSuck{padding: 0 0 10px; position: relative; clear: both; margin: 5px 0 0;}
.m2 li.m2SearchLocation form .fieldSetsSuck h5{display: block; text-transform: uppercase; font-size: 11px; padding: 0 0 5px; line-height: 15px;}
.m2 li.m2SearchLocation form .fieldSetsSuck p{display: block; clear: both; line-height: 20px; padding: 0;  height: 20px;}
.m2 li.m2SearchLocation form .fieldSetsSuck p input,
.m2 li.m2SearchLocation form .fieldSetsSuck p a,
.m2 li.m2SearchLocation form .fieldSetsSuck p label{font-size: 11px; color: #777; float: left; display: block;margin: 0 0 5px 5px;}



/* END left side stuff */



/* the big banner */
.introBannerBig{position: relative; margin: 0 0 -5px; overflow: hidden;}
.introBannerBig .overlay{background: #000; opacity:0.8; position: absolute; top:0; right: 0; width:350px; height: 100%;}
.introBannerBig .overlayContent{position: absolute; top:0; right: 0; width:300px; height: 100%; padding: 20px; text-align: right;}
.introBannerBig .overlayContent h2{color: #fff; font-size: 30px; padding: 0 0 15px 0;}
.introBannerBig .overlayContent p{color: #fff; font-size: 16px; line-height: 140%; padding: 0 0 15px 0;}
.introBannerBig .overlayContent p a{color: #fff;}


.closeXDark{height:30px; width: 30px; overflow: hidden; display: block; position: absolute; top:10px; left: 0; background:url(../images/layout/icons/x-button-darker.png) no-repeat center;}
.closeXDark:hover{background-image:url(../images/layout/icons/x-button-dark-over.png);}


/* simple tooltips */
.simpleTips, .simpleTipsWider, .questionMarkTips{border: 1px solid #ccc; background: #fff;}
.simpleTips{min-width:120px;}
.simpleTipsWider{min-width:250px;}
.simpleTips .tip-text, .simpleTipsWider .tip-text{position: absolute; top:5px; left:5px; font-size: 11px; color: #666;}
.simpleTips .tip-title, .simpleTipsWider .tip-title{font-size: 13px; color: #000; padding: 20px 5px 5px;}
.simpleTips .tip-top, .simpleTips .tip-bottom, .simpleTipsWider .tip-top, .simpleTipsWider .tip-bottom, .questionMarkTips .tip-top, .questionMarkTips .tip-bottom{display:none;}

.questionMarkTips{width: 250px;}
.questionMarkTips .tip-text{display: none;}
.questionMarkTips .tip-title{color: #333; font-size: 13px; padding: 5px; line-height: 130%;}







/* this is for the lcoation search page */
.locationContent{}

/* left side of maps */
.mapsLeft{float: left; width: 170px; font-size: 12px; padding:15px 0 0 10px; overflow: hidden;}
.mapsLeft h4{text-transform: uppercase; color: #666; padding: 5px 0 10px;}
.mapsLeft .itemsFound ul li{padding: 0 0 10px 0; color: #999; line-height: 130%;}
.mapsLeft .itemsFound ul li a, .mapsLeft .mightBeAfter p a{display: block; color: #000; text-decoration: underline; border: none;}
.mapsLeft .itemsFound ul li a:hover, .mapsLeft .mightBeAfter p a:hover{color: #000; text-decoration: none;}

.mapsLeft .mightBeAfter{border-top: 1px solid #ddd; margin: 50px 0 0; padding: 10px 0 0;}
.mapsLeft .mightBeAfter p a{padding: 5px 0; color: #333; text-decoration:none;}


/* the actual map */
.googleMap{float: right; width: 526px; height:385px; position: relative;background: #f6f6f6 url(../images/locationSearch/maps-backer.jpg); margin: 20px  -3px 0 0; position: relative;}
.googleMap img{ position: absolute; top:6px; left:6px;} /* remember this will be an iFrame when implimented! */



/* advanced search page */

.advancedSearch{}

.greyBar{height:30px; background: #e8e8e8 url(../images/layout/greyBar/left.jpg) no-repeat left; position: relative; margin: 0 0 20px 0;}
.greyBarRight{height:30px; background: url(../images/layout/greyBar/right.jpg) no-repeat left; width: 4px; overflow: hidden; position: absolute; top:0; right:0;}
.greyBarInner{display: block; padding: 5px 0 0;}

.greyBarInner .pagination{float: left; width:35%; padding: 0 0 0 5px;}
.greyBarInner .pagination li{float: left; width:20px; margin: 0 1px;}
.greyBarInner .pagination li a{float: left; width:20px; color: #646464; display: block; text-align: center; padding: 3px 0; font-size: 14px; text-decoration: none; border: none;}
.greyBarInner .pagination li a.active{font-weight: bold; background: #fff; color: #000;}
.greyBarInner .pagination li a:hover{background: #fff; color: #000;}

.greyBarInner .sortOptions{float: right; width: 60%; padding: 0 5px 0 0;}
.greyBarInner .sortOptions{text-align: right;}
.greyBarInner .sortOptions label{font-size: 15px; color: #646464; padding: 0 5px; font-weight: bold; text-transform: uppercase; letter-spacing: -0.5pt;}
.greyBarInner .sortOptions input, .greyBarInner .sortOptions select{font-size: 10px;}
.greyBarInner .sortOptions .submit{font-weight: bold;}


/* some TOGGLES! Moo <3 */
.notAFieldSet .rangeSelect ul.toggleClosed,
.notAFieldSet ul.toggleClosed,
.m2 .searchAgainAdvanced ul li.toggleClosed,
{display: none;}

.notAFieldSet .rangeSelect ul.toggleOpen,
.notAFieldSet ul.toggleOpen,
.m2 .searchAgainAdvanced ul li.toggleOpen
{display: block;}


/* end toggley */

.advancedSearch form .greatBigSearchStuff{margin: 0 auto; position: relative; height: 50px;}
.advancedSearch form input.text{font-size: 18px; padding: 7px; color: #555; position: absolute; top:0; left: 0; width:300px; border: 1px solid #ccc; display: block; height: 20px;}
.advancedSearch form input.submit{width:46px; height: 36px; position: absolute; top:0; left:330px; font-size: 20px; font-weight: bold; color: #000; background: url(../images/advancedSearch/great-big-button.jpg) no-repeat top left; border: none; cursor: pointer;}
.advancedSearch form input.submit:hover{color: #fff; background-position: -46px 0;}

.moreAdvancedBits{padding: 0 0 20px 0;}
.moreAdvancedBits h3{background: #f3f3f3; padding: 10px; margin: 25px 0 0; position: relative; color: #666; xfont-size: 15px;}
.moreAdvancedBits .notAFieldSet{border: 1px solid #ccc; position: relative;}
.moreAdvancedBits .notAFieldSet label{font-size: 13px; color: #666;}
.moreAdvancedBits .notAFieldSet .selectAll{position: absolute; top:-30px; right:5px; height: 15px; text-align: right; width: 85px;}
.moreAdvancedBits .notAFieldSet .selectAll input{float: right; line-height: 23px; padding: 0 5px; position: absolute; top:1px; left: -2px;}
.moreAdvancedBits .notAFieldSet .selectAll label{position: absolute; top:0px; right:0; width:80px; padding: 5px; border: 1px solid #f3f3f3;}
.moreAdvancedBits .notAFieldSet .selectAll label:hover, .moreAdvancedBits .notAFieldSet .selectAll:hover label{background: #fff; border: 1px solid #ccc;}

/* ranges */
.rangeSelect{width:232px; float: left;  position: relative;}
.rangeSelect .top{height: 70px;}
.rangeSelect .top label{text-indent: -999em;background: no-repeat center; height: 50px; width:185px; display: block; position: absolute; top:10px; left:30px;}
.rangeSelect .top input{position: absolute; top:25px; left:10px;}
.rangeHome .top label{background-image: url(../images/advancedSearch/range-home.jpg);}
.rangeDesigner .top label{background-image: url(../images/advancedSearch/range-designer.jpg);}
.rangeArchitectual .top label{background-image: url(../images/advancedSearch/range-architectual.jpg);}

.rangeDesigner, .rangeArchitectual{border-left: 1px dashed #ddd;}

/* ranges! */
.notAFieldSet .rangeSelect ul{padding:0 0 10px 0;}

.notAFieldSet .rangeSelect ul li{padding: 5px 5px 5px 35px; position: relative;}
.notAFieldSet .rangeSelect ul li input{position: absolute; top:2px; left:10px;}
.notAFieldSet .rangeSelect ul li label{font-size: 12px; color: #888;}
.notAFieldSet .rangeSelect ul li.all label{font-weight: bold; color: #555;}

/* finishes */
.notAFieldSet .finishesList{}
.notAFieldSet .finishesList li, .notAFieldSet .functionsList li{ float: left; width:220px; height: 45px; position: relative; margin: 5px; background: #fff; border: 1px solid #fff;}
.notAFieldSet .finishesList li:hover, .notAFieldSet .functionsList li:hover{border:1px solid #ddd;}
.notAFieldSet .finishesList li input{position: absolute; top:12px; left:5px;}
.notAFieldSet .finishesList li label{background: no-repeat left; padding: 10px 0 0 45px; position: absolute; top:0; left:30px; height: 35px;}
.notAFieldSet .finishesList li label strong{font-weight: bold; text-transform: uppercase; display: block;}

.notAFieldSet .finishesList li.finish-ab label{background-image:url(../images/finishes/antique-brass.jpg);}
.notAFieldSet .finishesList li.finish-ac label{background-image:url(../images/finishes/antique-copper.jpg);}
.notAFieldSet .finishesList li.finish-ai label{background-image:url(../images/finishes/almond-ivory.jpg);}
.notAFieldSet .finishesList li.finish-bc label{background-image:url(../images/finishes/bright-chrome.jpg);}
.notAFieldSet .finishesList li.finish-bg label{background-image:url(../images/finishes/bright-goldtone.jpg);}

/* functions! (uses some of the style from above ) */
.notAFieldSet .functionsList li{height: 30px;}
.notAFieldSet .functionsList li input{position:absolute; top:5px; left:5px;}
.notAFieldSet .functionsList li label{position:absolute; top:0; left:0; padding: 10px 0 10px 35px;}



/* searchAgainAdvanced on the leftbar */
.m2 .m2SearchDrop h3{xfont-size: 12px; letter-spacing: 1px; padding: 5px 0; display: block; text-transform: uppercase; color: #666 !important;}
.m2 .searchAgainAdvanced{clear: both; min-height: 100px; background:#fff url(../images/layout/leftBar/right-faint-shadow.jpg) repeat-y right; position: relative; margin-left: 1px; border-left: 1px solid #ddd; padding: 0 10px 10px; font-size: 12px;}
.m2 .searchAgainAdvanced h4{padding:20px 0 0; font-weight: bold;}
.m2 .searchAgainAdvanced h5{padding: 15px 0 3px; font-weight: bold; color: #666;}
.m2 .searchAgainAdvanced ul {padding: 5px; border: 1px solid #eee; background: #fff;}
.m2 .searchAgainAdvanced ul li{display:inline; position: relative;}
.m2 .searchAgainAdvanced ul li a{display:inline; color: #666;font-size: 11px !important;}
.m2 .searchAgainAdvanced ul li a:hover{color: #333;}
.m2 .searchAgainAdvanced ul li.changeDetails{display:block;}
.m2 .searchAgainAdvanced ul li.changeDetails a{display:block; padding: 3px 5px 0; color: #000; background: #f3f3f3;}
.m2 .searchAgainAdvanced ul li.changeDetails a:hover{color:#fff; background: #666;}


/* and hide the normal one when alt is active! */
.changeDetails .alt{display: none;}
.changeDetails .togglerOpen  .alt{display: inline;}
.changeDetails .togglerOpen .normal{display: none;}


/* popup action! */
.changeSearchStuffPop{left:160px; top:45px;}

.popWide{width:800px; background:url(../images/tooltips/wide/rep.png) repeat-y left; position: absolute;}
.popWide .head{width:800px; height: 96px; left:-5px; top:-96px; position: absolute; background:url(../images/tooltips/wide/top.png) no-repeat left;}
.popWide .foot{width:800px; height: 43px; left:0; bottom:-43px; position: relative; background: url(../images/tooltips/wide/bottom.png) no-repeat left;}
.popWide .body{padding: 0 40px; min-height: 100px; margin: 0;}
.popWide .body .closePopup{font-size: 15px !important; display: block; padding: 10px 5px; text-decoration: underline;}





/*	--------------------------------------*/
/*	carousel!
/*	--------------------------------------*/

/* ze carousel!*/
.carousel{width:716px; height:300px; position: relative; overflow: hidden; background: #fff;}

/* the javascript-generated menu */
.carouselMenu{height: 40px; position: absolute; bottom: 0; left:0;  width: 100%; padding:0; background: url(../images/transparents/80-percent-black.png);}
* html .carouselMenu{background: #000;}
.carouselMenu li{display: block; float: left; height: 51px;}

/* various numbers of tabs */
.carouselMenu.cols-6 li{width: 16.665%;} /* \m/ */
.carouselMenu.cols-5 li{width: 20%;}
.carouselMenu.cols-4 li{width: 25%;}
.carouselMenu.cols-3 li{width: 33.333%;}
.carouselMenu.cols-2 li{width: 50%;}
/* if there's only one, do we really wanna display it? */
.carouselMenu.cols-1 li, .carouselMenu.cols-0 li{display: none;}

/* ... all use the same link style */
.carouselMenu li a{display: block; width: 100%; height: 100%; font-size: 12px; color: #fff; text-decoration: none; line-height: 20px; text-transform: uppercase; padding: 5px 10px;}
.carouselMenu li a:hover, .carouselMenu li a.active{color:#ccc; background: #000;}


/* and now the content within! */
.carouselContent{position: absolute; top:0; left:0; width: 9999em;}
.carouselContent li{float: left;}



/*	--------------------------------------*/
/*	Contact Page
/*	--------------------------------------*/
.contact.left{ padding: 10px 35px 0 30px; min-height: 400px;}
.contact.centre{ padding: 10px 0 0 0px; min-height: 400px;}
.contact.left div {margin-bottom:40px;}

.contact.left{width:245px; float: left; background: url(../images/contact/fade-splitter-left.jpg) no-repeat top right;}
.xcontact .right{width:220px; float: right; background: url(../images/contact/fade-splitter-right.jpg) no-repeat top left; padding-left: 45px;}
.contact.centre{width:336px; float: left; margin-left:37px;}

.contact h3{xcolor: #898989; text-transform: uppercase; padding: 15px 0 10px 50px; background: no-repeat left; margin: 10px 0 20px 0;}

.contact h3.phone {background-image:url(../images/contact/icon-phone.jpg);}
.contact h3.letus {background-image:url(../images/contact/icon-rewind.jpg);}
.contact h3.person {background-image:url(../images/contact/icon-smiley.jpg);}

.contact.left p{}
.contact.left a{display: block;  background: url(../images/contact/arrow.jpg) no-repeat 0 4px; padding: 0 0 0 12px; margin: 5px 0;}
.contact.left a:hover{color: #000; text-decoration: none;}

.contact strong{font-weight: bold;}


/* the form */
.contact.centre form {margin: 0 0 10px 0;}
.contact.centre form .InputRow{margin: 5px 0; padding: 0 0 35px;clear:both;}
.contact.centre form p{padding: 0; clear: both; margin:5px 0;}
.contact.centre form label{width:90px; float: left; color: #898989; font-size: 14px; xmargin: 5px 0; padding: 10px 0 3px; text-align:right;}
.contact.centre form select,
.contact.centre form input.Email,
.contact.centre form input.Text,
.contact.centre form .TextArea{ border: 1px solid #ddd; float: right;  color: #333; padding: 5px;font-size: 14px;} 
.contact.centre form select{width:218px;}
.contact.centre form input.Text, .contact.centre form input.Email{width:206px;} 
.contact.centre form .TextArea{width:206px; font-family: Helvetica, Arial, sans-serif; } 
.contact.centre form .SubmitButtonRow input{border:2px solid #aecd44; background: #aecd44;color: #fff; cursor: pointer; float: right; margin: 5px 0; font-size: 16px; padding: 5px;} 
.contact.centre form .submit:hover{background: #a8c73c;} 

.contact.centre form .Text:focus, .contact.centre form TextArea:focus{border: 1px solid #ddd;}

.contact.centre form .disabledInputs{background: #f6f6f6; color: #999;}

.contact.centre form .InputRow.IsError{margin: 5px 0; padding: 0 0 35px;clear:both;}
.contact.centre form .InputRow.IsError .ErrorMessage{font-size:9px; color:#CC0000;margin-left:120px;}

/* this happens with the click on the form */
.contact.centre form .formSubmitCheckerSubmitted, .contact.centre form .formSubmitCheckerSubmitted:hover{background: #fff url(../images/icons/spinner-green-arrow.gif) no-repeat 7px 50%; padding: 5px 5px 5px 30px; float: right; color: #a8c73c;}


/* the 'more' bit */
.moreNumbersEtcLink{display: none;}
.moreNumbersEtc{padding: 10px 0;}
.moreNumbersEtc h4{font-size: 12px; font-weight: bold;}
.moreNumbersEtc dl dt, .moreNumbersEtc dl dd{font-size: 11px; padding: 7px 0; border-top: 1px solid #ddd;}
.moreNumbersEtc dl dt{width: 100px; float: left; clear: both;}
.moreNumbersEtc dl dd{width: 145px; float: left; }


/* the RANGE page fun */

.ourRangeHome .kwik{height:400px; position: relative; display: block; overflow: hidden; border: 1px solid #000;}
.ourRangeHome .kwik ul{height:400px; position: absolute; top:0; left: 0; width:1300px; display: block; background: #000;}
.ourRangeHome .kwik ul li{height:400px; display: block; float: left; width: 315px; position: relative; overflow: hidden; border-right: 1px solid #000;}

/* the content */
.ourRangeHome .kwik ul li .mainPic{height:400px; position: absolute; top:0; left:50%; margin: 0 0 0 -250px; width: 500px;}
.ourRangeHome .kwik ul li p{top:380px; position: absolute; left:50%; margin: 0 0 0 -250px; width: 500px;}
.ourRangeHome .kwik ul li p a{display:block; text-align: center; padding: 13px 0; background: url(../images/layout/shadows/up-black-35.png) repeat-x bottom; border-top: 1px solid #000; text-decoration: none; font-size: 15px; font-weight: bold;color: #ccc; height: 15px;}
.ourRangeHome .kwik ul li p a:hover{color: #fff;}

/* the itemz */
.ourRangeHome .kwik ul li.home p a{background-color: #800023; }
.ourRangeHome .kwik ul li.designer p a{background-color: #2b5a73; }
.ourRangeHome .kwik ul li.arch p a{background-color: #021c70;}


/* and below is some other stuff*/
.ourRangeHome .guide{float: right; width: 621px;}
.ourRangeHome .guide a{border: 1px solid #fff; display: block; height: 170px; margin: 7px 0 0;}
.ourRangeHome .guide a:hover {border:1px solid #999;}

/*see m2Search for ther rest of this */
.ourRangeHome .search{float: left; width: 765px;background: url(../images/rangeHome/search-full-width.jpg) no-repeat top left; border-top: 1px solid #fff;height: 170px; margin: 7px 0 0;padding: 0 0 0 175px;}
.ourRangeHome .search a.doorSched {margin:10px 10px; display:block;float:right;padding:0;}
.ourRangeHome .search form{padding-top: 84px;}
.ourRangeHome .search .text{width: 210px; }
.ourRangeHome .search .formSubmitCheckerSubmitted{background: url(../images/icons/spinner-666-arrow.gif) no-repeat center; text-indent: -999em;}



/* the RANGE page fun */

.ourRangeHomeNew .kwik{height:400px; position: relative; display: block; overflow: hidden; border: 1px solid #000;}
.ourRangeHomeNew .kwik ul{height:400px; position: absolute; top:0; left: 0; width:1300px; display: block; background: #000;}
.ourRangeHomeNew .kwik ul li{height:400px; display: block; float: left; width: 235px; position: relative; overflow: hidden; border-right: 1px solid #000;}

/* the content */
.ourRangeHomeNew .kwik ul li .mainPic{height:400px; position: absolute; top:0; left:50%; margin: 0 0 0 -250px; width: 500px;}
.ourRangeHomeNew .kwik ul li p{top:380px; position: absolute; left:50%; margin: 0 0 0 -250px; width: 500px;}
.ourRangeHomeNew .kwik ul li p a{display:block; text-align: center; padding: 13px 0; background: url(../images/layout/shadows/up-black-35.png) repeat-x bottom; border-top: 1px solid #000; text-decoration: none; font-size: 15px; font-weight: bold;color: #ccc; height: 15px;}
.ourRangeHomeNew .kwik ul li p a:hover{color: #fff;}

/* the itemz */
.ourRangeHomeNew .kwik ul li.home p a{background-color: #800023; }
.ourRangeHomeNew .kwik ul li.designer p a{background-color: #2b5a73; }
.ourRangeHomeNew .kwik ul li.arch p a{background-color: #021c70;}

/*see newss for ther rest of this */
.ourRangeHomeNew .noozbox{display: none;float: left; width: 235px; background: url(../images/rangeHome/news-image.jpg) no-repeat top right;border-top: 1px solid #fff;height: 170px;}
.ourRangeHomeNew .noozbox a{display: block; width: 100%; height: 170px; text-decoration: none; }


/*see m2Search for ther rest of this */
.ourRangeHomeNew .search{float: right; width: 705px;  background: url(../images/rangeHome/search-three-quarter-width.jpg) no-repeat top right; border-top: 1px solid #fff;height: 170px;}
.ourRangeHomeNew .search a.doorSched {margin:10px 10px; display:block;float:right;padding:0;}
.ourRangeHomeNew .search form{padding-top: 84px; margin-left: 30px;}
.ourRangeHomeNew .search .text{width: 210px; }
.ourRangeHomeNew .search .formSubmitCheckerSubmitted{background: url(../images/icons/spinner-666-arrow.gif) no-repeat center; text-indent: -999em;}

/*see m2Search for ther rest of this */
.ourRangeHomeNew .search{float: left; width: 765px;background: url(../images/rangeHome/search-full-width.jpg) no-repeat top left; border-top: 1px solid #fff;height: 170px; margin: 7px 0 0;padding: 0 0 0 175px;}
.ourRangeHomeNew .search a.doorSched {margin:10px 10px; display:block;float:right;padding:0;}
.ourRangeHomeNew .search form{padding-top: 84px;}
.ourRangeHomeNew .search .text{width: 210px; }
.ourRangeHomeNew .search .formSubmitCheckerSubmitted{background: url(../images/icons/spinner-666-arrow.gif) no-repeat center; text-indent: -999em;}



/*for dev  */
#grid{background:url(../images/scrap/960_grid_16_col.png) repeat-y top !important; width:100%; height: 100%; min-height: 100%; position: absolute; top:0; left:0; opacity:0.5; filter:alpha(opacity=50);}
/**/ #grid{display: none;}
/**/

/* .header, .footer{ display: none;} */


/* tables */

/* working blocks */

table.workingBlocks {width:560px; float:right; margin:10px 0; zoom:1; }
table.workingBlocks th, table.packagingInfo th {background:#eee;border-bottom:1px solid #ccc; padding:15px 10px 10px;}
th.WBdescriptionHeader {}
th.WBpartNoHeader {}
table.workingBlocks td, table.packagingInfo td {padding:10px; border-bottom:1px solid #ccc;}
table.workingBlocks td.WBdescription, table.packagingInfo td.WBdescription { border-right:1px solid #ccc;}
td.WBpartNo {white-space:nowrap;width:100px;}
td.MerchValues, th.MerchHeader {text-align:center;border-left:1px solid #ccc;}
table.packagingInfo{width:690px; margin:10px 0;padding:0; }



/* gosh I hate IE6, you... YOU! GRR. */


/* triggler hasLayout for EVERYTHINGS 'cause of lazy */
* {zoom:1}

/* do some min-height stuff */ 
body,
.content
{height: 100%;}

/* get rid of the shadow on IE6 */
* html .hc h2, * html .arch h2, * html .dc h2, * html .Streamline h2, * html .Accent h2, * html .Synergi h2, * html .Couture h2, * html .Estilo h2, * html .Where h2, * html .Information h2 {background-image:none;}

* html .dc a:hover {background-color: #fff !important;}

* html .GuaranteeLogoDetail {margin-left:-70px;}

* html .main .prodDetail .prodDetailImageGallery .moreImagesThumbs li a {margin-right:4px;}

* html .main .prodDetail .prodDetailContent {xwidth: 290px;xdisplay:block;}
* html .prodDetailImageGallery {xwidth:370px; xpadding:0px 0 10px 10px; xmargin-bottom:5px;}

* html .tabs{height: 230px; margin-right: -25px;}

* html .thumbGrid {xmargin-right: -25px;}

* html .m2 .theLastOne{background:none;}

* html .sub ul.Level2  li.active {}
* html .sub ul li a{}
* html .sub ul li{}

* html .sub ul li ul li a{margin:0;}


/* ie fails, make them set width */
* html .simpleTips{width:120px;}
* html .simpleTipsWider{width:250px;}

* html .contact .left, * html .contact .centre{height: 400px;}
* html .contact .centre form p {padding:5px 0;}
* html .tabbyContent ul { margin:0px; padding:0 0 0 20px; xposition: relative;}
* html .tabbyContent li { padding:5px 0 0 5px; vertical-align: middle; }

* html .thumbWrapper{height: 190px;}

* html .xhomeintroFinishes {margin:5px 0;padding:0;}
* html .xhomeintroFinishes a {padding:5px 8px; margin:0 0 15px 5px;width:120px; }

* html .prodInfoTabInstallPics {width:230px;}
* html .prodInfoTab {width:430px;}

div {

}