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

CATALOGUE CSS

Styles related to product category, details, or
list pages.

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

/* COLOUR CATEGORIES
--------------------------------------------------*/
#colours-categories {
	list-style: none;
	margin: 0;
	float: left;
}
#colours-categories li {
	background: url(/web/images/catalogue/category/landing/dulux_trade_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
}
#colours-categories h3 {
	padding: 0 12px;
	margin: 0;
}
#colours-categories h3 a {
	text-decoration: none;
}
#colours-categories p.details {
	padding: 6px 12px 0;
}

#dulux-trade-classic-page #colours-categories li {
	background: url(/web/images/catalogue/category/landing/dulux_trade_classic_categories.jpg) no-repeat;
}
#dulux-trade-classic-page #colours-categories .yellows {
	background-position: -165px 0;
}
#dulux-trade-classic-page #colours-categories .oranges {
	background-position: -330px 0;
}
#dulux-trade-classic-page #colours-categories .reds {
	background-position: -495px 0;
}
#dulux-trade-classic-page #colours-categories .blues {
	background-position: -660px 0;
}
#dulux-trade-classic-page #colours-categories .greens {
	background-position: -825px 0;
}
#dulux-trade-classic-page #colours-categories .cool-neutrals {
	background-position: -990px 0;
}

#dulux-trade-heritage-page #colours-categories li {
	background: url(/web/images/catalogue/category/landing/dulux_trade_heritage_categories.jpg) no-repeat;
}
#dulux-trade-heritage-page #colours-categories .greens-earths {
	background-position: -165px 0;
}
#dulux-trade-heritage-page #colours-categories .yellow-golds {
	background-position: -330px 0;
}
#dulux-trade-heritage-page #colours-categories .reds-terracottas {
	background-position: -495px 0;
}
#dulux-trade-heritage-page #colours-categories .creams-stones {
	background-position: -660px 0;
}
#dulux-trade-heritage-page #colours-categories .designer-range {
	background-position: -825px 0;
}

#dulux-trade-exteriors-page #colours-categories li {
	background: url(/web/images/catalogue/category/landing/dulux_trade_exteriors_categories.jpg) no-repeat;
}
#dulux-trade-exteriors-page #colours-categories .oranges {
	background-position: -165px 0;
}
#dulux-trade-exteriors-page #colours-categories .yellows {
	background-position: -330px 0;
}
#dulux-trade-exteriors-page #colours-categories .greens {
	background-position: -495px 0;
}
#dulux-trade-exteriors-page #colours-categories .blues {
	background-position: -660px 0;
}
#dulux-trade-exteriors-page #colours-categories .violets {
	background-position: -825px 0;
}
#dulux-trade-exteriors-page #colours-categories .warm-neutrals {
	background-position: -990px 0;
}
#dulux-trade-exteriors-page #colours-categories .cool-neutrals {
	background-position: -1155px 0;
}
#dulux-trade-exteriors-page #colours-categories .off-whites {
	background-position: -1320px 0;
}

#colour-futures-2008-trends-page #colours-categories li {
	min-height:42px;
	width: 90px;
	padding:66px 0 0;
	margin-bottom: 0;
}

* html #colour-futures-2008-trends-page #colours-categories li {
	height:52px;
}

#colour-futures-2008-trends-page #colours-categories li {
	background: url(/web/images/catalogue/category/landing/futures_2008_trends_categories.jpg) no-repeat;
}

#colour-futures-2008-trends-page #colours-categories .trends-2008-2 {
	background-position: -90px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-3 {
	background-position: -180px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-4 {
	background-position: -270px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-5 {
	background-position: -360px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-6 {
	background-position: -450px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-7 {
	background-position: -540px 0;
}
#colour-futures-2008-trends-page #colours-categories .trends-2008-8 {
	background-position: -630px 0;
}

ul#colours-categories.clean li {
	border: none;
}

/* BRAND CATEGORIES
--------------------------------------------------*/

/* DEFAULT - DULUX */

#brand-categories {
	list-style: none;
	margin: 0;
	float: left;
}
#brand-categories li {
	background: url(/web/images/catalogue/category/landing/dulux_trade_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 139px;
}
* html #brand-categories li {
	height: 139px;
}
#brand-categories .specialist,
#brand-categories .trim {
	margin-right: 0;
}
#brand-categories .emulsions {
	background-position: -165px 0;
}
#brand-categories .specialist {
	background-position: -330px 0;
}
#brand-categories .woodcare {
	background-position: -495px 0;
}
#brand-categories .exteriors {
	background-position: -660px 0;
}
#brand-categories .trim {
	background-position: -825px 0;
}
#brand-categories h3,
#brand-categories p {
	padding: 0 12px;
}
#brand-categories h3,
#colours-categories h3 {
	font-size: 1.2em;
}
.cufon-active #brand-categories h3,
.cufon-active #colours-categories h3{
	font-size: 1.6em;
}
#brand-categories p.details {
	bottom: 9px;
	left: 0;
	position: absolute;
}

/* CUPRINOL */

#brand-landing-cuprinol-page #brand-categories li {
	background: url(/web/images/catalogue/category/landing/cuprinol_trade_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 139px;
}
#brand-landing-cuprinol-page #brand-categories .exterior-woodcare {
background-position:-165px 0;
}
#brand-landing-cuprinol-page #brand-categories .landscape-garden {
	background-position: -330px 0;
}
#brand-landing-cuprinol-page #brand-categories .treatment-fillers {
	background-position: -495px 0;
}

/* GLIDDEN TRADE */

#brand-landing-glidden-page  #brand-categories li {
	background: url(/web/images/catalogue/category/landing/glidden_trade_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 139px;
}
#brand-landing-glidden-page #brand-categories .decorative-finishes  {
	background-position:-165px 0;
}
#brand-landing-glidden-page #brand-categories .exteriors  {
	background-position:-330px 0;
}
#brand-landing-glidden-page #brand-categories .specialist  {
	background-position:-495px 0;
}

/* POLYCELL TRADE */

#brand-landing-polycell-page  #brand-categories li {
	background: url(/web/images/catalogue/category/landing/polycell_trade_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 139px;
}
#brand-landing-polycell-page #brand-categories .fillers  {
	background-position:-165px 0;
}
#brand-landing-polycell-page #brand-categories .painting-aids  {
	background-position:-330px 0;
}

/* HAMMERITE TRADE */

#brand-landing-hammerite-page #brand-categories li {
	background: url(/web/images/catalogue/category/landing/hammerite_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 152px;
}
* html #brand-landing-hammerite-page #brand-categories li {
	height: 152px;
}

#brand-landing-hammerite-page #brand-categories .preparation  {
	background-position:-165px 0;
}
#brand-landing-hammerite-page #brand-categories .metal-primers  {
	background-position:-330px 0;
}

/* BRAND LANDING
--------------------------------------------------*/
.brand-landing-page .masthead,
#pyroshield-landing-page #masthead {
	background-repeat: none;
	height: 0;
	overflow: hidden;
	padding: 291px 0 0;
	width: 980px;
}
#brand-landing-glidden-page .masthead {
	background-image: url(/web/images/catalogue/category/landing/glidden_trade.jpg);
}
#brand-landing-dulux-page .masthead {
	background-image: url(/web/images/catalogue/category/landing/dulux_trade.jpg);
}
#brand-landing-polycell-page .masthead {
	background-image: url(/web/images/catalogue/category/landing/polycell_trade.jpg);
}
#brand-landing-sikkens-page .masthead {
	background-image: url(/web/images/catalogue/category/landing/sikkens.jpg);
}
#brand-landing-glidden-page .masthead {
	background-image: url(/web/images/catalogue/category/landing/glidden_trade.jpg);
}

#pyroshield-landing-page #masthead {
	padding: 244px 0 0;
	background-image: url(/web/images/catalogue/category/landing/pyroshield.jpg);
	margin-bottom: 12px;
}

/* BRAND LANDING CONTENT
--------------------------------------------------*/
.brand-landing-page .page-section-2 h2 {
	color: #AEDD27;
	margin: 0 0 15px;
}
.brand-logo {
	background: url(/web/images/canvas/brand_sprite.gif) no-repeat;
	height: 0;
	margin: 0 0 10px;
	overflow: hidden;
	padding: 47px 0 0;
	width: 117px;
}
.brand-landing-page p.cuprinol-trade {
	background-position: 0 0;
}
.brand-landing-page p.dulux-trade {
	background-position: 0 -47px;
}
.brand-landing-page p.sikkens {
	background-position: 0 -94px;
}
.brand-landing-page p.polycell-trade {
	background-position: 0 -141px;
}


/* DSD BENEFITS
--------------------------------------------------*/

#benefit-categories {
	list-style: none;
	margin: 0;
	float: left;
	padding:0;
}
#benefit-categories li {
	background: url(/files/media/images/canvas/decorators/dsd_benefit_categories.jpg) no-repeat;
	border: solid 1px #DEDEDE;
	float: left;
	margin: 0 12px 12px 0;
	width: 165px;
	padding: 73px 0 11px;
	position: relative;
	min-height: 80px;
}
* html #benefit-categories li {
	height: 80px;
}

#benefit-categories p {
	padding: 0 12px;
}
#benefit-categories p.details {
	bottom: 9px;
	left: 0;
	position: absolute;
}

#benefit-categories .benefit-01 {
	background-position: 0 0;
}
#benefit-categories .benefit-02 {
	background-position: -165px 0;
}
#benefit-categories .benefit-03 {
	background-position: -330px 0;
}
#benefit-categories .benefit-04 {
	background-position: -495px 0;
}
#benefit-categories .benefit-05 {
	background-position: -660px 0;
}
#benefit-categories .benefit-06 {
	background-position: -825px 0;
}
#benefit-categories .benefit-07 {
	background-position: -990px 0;
}
#benefit-categories .benefit-08 {
	background-position: -1155px 0;
}
#benefit-categories .benefit-09 {
	background-position: -1320px 0;
}
#benefit-categories .benefit-10 {
	background-position: -1485px 0;
}
#benefit-categories .benefit-11 {
	background-position: -1650px 0;
}


/* GENERIC ITEM STYLE
--------------------------------------------------*/
ul.articles,
ul.news,
ul.products,
ul.listed{
	list-style: none;
	float: left;
	margin: 0;
	width: 100%;
}
ul.articles li,
ul.news li,
ul.products li,
ul.listed li{
	border-top: 1px solid #DEDEDE;
	clear: both;
	float: left;
	margin: 0 0 14px; 
	overflow: hidden;
	width: 100%;
}
ul.articles img,
ul.news img,
ul.products img,
ul.listed img {
	float: left;
	margin: 15px 20px 0 20px;
	display: inline;
	width: 45px;
}
ul.articles img,
ul.news img {
	width: 110px;
}
ul.listed img {
	width: 72px;
}
ul.articles .content,
ul.news .content,
ul.products .content,
ul.listed .content{
	padding: 15px 0 0 0;
	float: left;
	width: 647px;
}
ul.articles .content,
ul.news .content,
ul.listed .content{
	width: 394px;
}
ul.articles .content img,
ul.news .content img,
ul.products .content img {
	padding: 0;
	float: none;
	width: auto;
}
ul.articles h3,
ul.news h3,
ul.products h3,
ul.strong-products h3 {
	margin: 0 0 6px;
}

ul.articles h3 a:link,
ul.articles h3 a:visited,
ul.articles h3 a:hover,
ul.articles h3 a:active,
ul.news h3 a:link,
ul.news h3 a:visited,
ul.news h3 a:hover,
ul.news h3 a:active,
ul.products h3 a:link,
ul.products h3 a:visited,
ul.products h3 a:hover,
ul.products h3 a:active {
	color: #575757;
	text-decoration: none;
}
ul.articles p,
ul.news p,
ul.products p,
ul.strong-products p {
	margin: 0 0 6px;
}
.page-layout-3-a ul.products .content {
	width: 459px;
}
.page-layout-3-a ul.articles .content
.page-layout-3-a ul.news .content {
	width: 394px;
}

ul.articles ul,
ul.news ul,
ul.products ul {
	list-style-type: disc;
	margin-left: 1.2727em;
}
ul.articles ul li,
ul.news ul li,
ul.products ul li {
	border: 0;
	clear: none;
	float: none;
	width: auto;
	overflow: auto;
	margin: 0;
}

/* GENERIC LIST BOX STYLE
--------------------------------------------------*/
ul.strong-products {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
}
ul.strong-products li {
	border: 1px solid #DEDEDE;
	clear: left;
	float: left;
	padding: 12px; 
	margin: 0 0 12px;
	width: 518px;
}
ul.strong-products img {
	float: left;
	margin: 0 12px 0 0;
	display: inline; /* IE6 - DFM */
}
ul.strong-products .content {
	padding: 0 0 0 64px;
}
ul.strong-products .content img {
	float: none;	
	border: 0;
	margin: 0;
}

ul.strong-products .content h3 a {
	text-decoration: none;
}

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

PRODUCT DETAILS CSS

The product page styles.

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

/* Image and intro.
--------------------------------------------------*/
#product-introduction {
	float: left;
	width: 100%;
	padding: 0 0 25px;
}
#product-visual {
	float: left;
}
#product-description {
	float: right;
	min-height: 105px;
	width: 410px;
	margin-left: 12px;
}

* html #product-description {
	height:105px;
}

#product-details {
	background: url(/web/images/canvas/product_sprite.gif) repeat-y -341px 0;
	clear: both;
	float: left;
	width: 100%;
}
#product-details h3,
#product-details h4 {
	background: url(/web/images/canvas/product_sprite.gif) no-repeat;
	height: 0;
	margin: 0;
	padding: 22px 0 0;
	overflow: hidden;
}
#product-details .specification-section {
	border-bottom: solid 1px #EEE;
	margin: 0 0 13px;
	float: left;
	width: 100%;
}
#product-details #system-information {
	border: 0;
	margin: 0;
}

/* Logoptics
--------------------------------------------------*/
ul#logoptics {
	display:inline;
	float:left;
	list-style:none;
	margin:0 0 0 10px;
	width:300px;
}

ul#logoptics li {
	float: left;
	margin-right:6px;
}

/* The custom headers
--------------------------------------------------*/
#key-information h3 {
	width: 109px;
}
#application-information h3 {
	background-position: 0 -22px;
	width: 162px;
}
#key-benefits h3 {
	background-position: 0 -66px;
	width: 86px;
}
#system-information h3 {
	background-position: 0 -44px;
	width: 135px;
}
#colour-range h4 {
	background-position: 0 -88px;
}
#downloads h4 {
	background-position: 0 -110px;
}
#literature h4 {
	background-position: 0 -132px;
}
#related-products h4 {
	background-position: 0 -154px;
}

/* Product accordian
--------------------------------------------------*/
#product-details .header {
	background: url(/web/images/canvas/product_sprite.gif) no-repeat 100% 0;
	float: left;
	padding: 0 23px 0 0;
}
#product-details .active .header {
	background-position: 100% -22px;
}
#product-details .content {
	clear: left;
	padding: 6px 0 0;
	width: 100%;
}
#product-specification {
	display: inline; /* IE6 - DFM */
	float: left;
	margin: 0 24px 0 0;
	width: 341px;
}
#product-specification dt {
	clear: left;
	float: left;
	font-weight: bold;
	width: 108px;
	padding: 0 0 4px;
}
#product-specification dd {
	padding: 0 0 4px 108px;
}
#product-specification ul {
	list-style: none;
	margin-left: 0;
}

/* Product aside
--------------------------------------------------*/
#product-information-aside {
	float: left;
	width: 167px;
}
#product-information-aside h4 {
	margin: 0 0 6px;
}
#colour-range {
	border-bottom: solid 1px #EEE;
	padding: 0 0 7px;
	margin: 0 0 12px;
}
#colour-range p {
	margin: 0 0 4px;
}

#downloads {
	border-bottom: solid 1px #EEE;
	padding: 0 0 7px;
	margin: 0 0 12px;
}
#downloads ul {
	list-style: none;
	margin: 0;
}
#downloads li {
	background: url(/web/images/canvas/product_icons_sprite.gif) no-repeat;
	list-style: none;
	margin-left: 0;
	min-height: 21px;
	padding: 5px 0 6px 34px;
}
* html #downloads li {
	height: 21px;
}
#literature {
	background: url(/web/images/canvas/product_icons_sprite.gif) no-repeat -181px 31px;
	border-bottom: solid 1px #EEE;
	padding: 0 0 7px;
	margin: 0 0 12px;
}
#literature p {
	padding: 0 0 0 34px;
	margin: 0 0 4px;
}
#literature input {
	display: inline-block;
	margin: 3px 0 0 12px;
}
#literature a.details {
	background: url(/web/images/canvas/product_icons_sprite.gif) no-repeat 0 -128px;
	padding: 0 0 2px 20px;
	display: inline-block;
	margin: 0 0 3px;
}

#related-products ul {
	margin: 0;
	list-style: none;
}
#related-products img {
	float: left;
}
#related-products p {
	margin: 0 0 9px 7px;
	float: left;
	width: 140px;
}

/* Brochures & Colour cards
--------------------------------------------------*/
#brochures h3 {
	color: #AEDD27;
}
#brochures form {
	margin: 15px 0 0;
	float: left;
}
#brochures form fieldset {
	float: left;
}
#brochures .download {
	margin: 0 0 0 5px; 
	display: block; 
	float: left;
}