/* 
========================================================================
PODUCTS.CSS
========================================================================
*/


/* ------------PRODUCTS  styles controlling how Products are displayed ---------------------------- */


/* ------ TABLES - holding product prices tax / add to basket / out of stock etc  ALSO Shipping info Pages ------ */


table 
{
width: 100%;
margin-bottom:5px;
border:none;
}


th 
{
text-align: left;
color:#ffffff;
font-size:10px;
font-weight:bold;
border:none;
}


td, select, input 
{
font-size: 9pt; 
font-weight: normal; 
color: #779299;
background-color: #FFFFFF;
border:none;
padding-left:1em;
padding-right:1em;
}

table tr 
{

background-position: top left;
background-repeat: repeat-x;
border:none;
}

table tr.header
{
background-color:#ffffff;
border:none;
}

table tr.header th 
{
font-size: 9pt;
font-weight: bold;
background-image: none;
background-color: #ffffff;
color:#333333;
border:none;
}



table caption 
{
font-size: 10pt;
color: #DD7700;
}


table tr.alt 
{
background-position: top left;
background-repeat: repeat-x;
}

table tr.highlight 
{
background-color: #F7F7F7;
background-image: none;
}

.versions tr.highlight td 
{
background-image: none;
}

table tr.subheader td 
{
border-top: solid 1px #CBD5DB;
background-position: top left;
border:none;
}

table td, table th
{
color:#779299;
padding: 3px;
border:none;
}

table th 
{
background-color: white;
border:none;
}


/*  controls product info like dimensions, materials extra product info */

pre 
{
width:480px;
font-size:12px;
clear:both;
margin:2px 0px 5px 0px;
padding:5px 10px 5px 10px;
border:1px dotted #cccccc;
background-color: #F5F5F5;
color: #333333;
width/**/:/**/ 458px;
}

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


/* Product Heading within product boxes etc. also controls Customer Review & Carry On Shopping  */

.product h2 
{
margin:0px 0px 0px 0px;
padding-top:10px;
text-align: left;
font-size:12pt;
}

/* Outer wrapper div for products displayed in short format - for example Featured Products on homepage  */

.products_shortened 
{
margin:0 auto;
padding:0;
}	


.products_shortened .product h2 
{
margin-top: 5px;
text-align: left;
font-size: 10pt;
background-image:none;
}	

/* Covers info on all 'product' views - including product.asp */

.product em.strapline 
{
display: block;
margin: 8px 0px 8px 0px;
padding: 0;
}

.generalspace 
{
display: block;
height: 1px;
}

.product p 
{
margin: 0 10px 5px 10px;
}


#productdescription
{border:1px solid #cccccc}




/* MAIN SINGLE PRODUCT DISPLAY  */

.product 
{
width:510px;
background-image:url(../templateimages/back_fade4.png);
background-repeat:no-repeat;
border:0px solid #cccccc;
padding:15px 0px 0px 15px;
margin:0px 1px 2px 1px; 
overflow:hidden;
width/**/:/**/ 495px;
}

.main 
{
width:475px;
margin:0px 10px 0px 10px;
padding:5px;
height:auto;
width/**/:/**/ 465px;
}

.main p
{
border:1px solid #cccccc;
width:300px;
margin:0px 0px 0px 0px;
padding:5px;
background-color:#fff;
height:auto;
float:right;
width/**/:/**/ 290px;
}

#prodimage
{
padding:1px;
margin:0px;
}


.product img.thumb 
{
float: left;
margin: 0px 10px 5px 10px;
border:1px solid #cccccc;
margin: 0px 10px 20px 0px;
padding:2px;
max-width:130px;
width: expression(this.width > 130? 130: true);
}

/* --- closes the main single product display - includes box bottom and large view link  ------- */


.xextrainfolinks 
{
padding:0px;
margin:0px;
text-align:center;
}

.xextrainfolinks .submit
{
margin:2px 0px 0px 0px;
width:146px;
}
		

.pextrainfolinks 
{
width:510px;
height:40px;
background-image:url(../templateimages/back_fade4b.png);
background-repeat:no-repeat;
border:0px solid #cccccc;
padding:0px 0px 10px 0px;
margin:0px 1px 2px -15px; 
overflow:hidden;
clear:both;
width/**/:/**/ 510px;
}


.pextrainfolinks .submit
{
width:148px;
float:left;
margin-left:86px;
}




.pextrainfolinks a:link
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
margin-left:25px;
}

.pextrainfolinks a:active
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
margin-left:25px;
}

.pextrainfolinks a:hover
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
margin-left:25px;
}

.pextrainfolinks a:visited
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
margin-left:25px;
}


.moreinfo .largeview 
{
margin: 5px 0px 0px -10px;
display: inline;
border:none;
clear:both;
}


.moreinfo a
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.moreinfo  a:active
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.moreinfo a:hover
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.moreinfo  a:visited
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.pextrainfolinks .moreinfo
{
margin: 5px 0px 5px 0px;
background-image:none;
border:0px solid #cccccc;
}



/* END SINGLE PRODUCT DISPLAY  */

.quantitydiscount .link 
{
clear:both;
padding: 5px 0px 5px 0px;
}

.products .minprice 
{
color: #FF9900;
}

.products .minprice 
{
display: block;
font-weight: bold;
padding-top: 10px;
}

/* Wrapper for all products displayed on the page - product list (everything beneath PRODUCTS H5) */
.products 
{
margin-bottom: 0px;
padding-bottom: 10px;
overflow: hidden;
}

/* Closing product Pages */

.products_end 
{
clear: both;
}




/* MAIN PRODUCT IMAGE STYLING */
.products .product img 
{
float: left;
margin: 0px 10px 10px 0px;
border:1px solid #cccccc;
padding:2px;
}


.products .product .pad 
{
margin-bottom: 2px;
padding: 0px;
zoom: 100%; /* To fix IE 'invisible text' rendering bug (http://archivist.incutio.com/viewlist/css-discuss/57305) */
overflow: hidden; /* To fix image flow in extended view, mozz/opera */	
}

.products .product .product_end 
{
clear: both;
}

/* Specific to the shortened display - note: the width of .product is set programmatically
based on the numShortenedFormatCols config setting */
.products_shortened .product img 
{
display: block;
float: none;
margin: 8px auto;
text-align: center;
}	

/* outer wrapper for INDIVIDUAL products in short format - for example featured products Homepage  */

.products_shortened .product 
{
display: block;
float: left;
margin-bottom: 0px;
}

/* Price displayed for INDIVIDUAL products in short format - for example from £6.99  */

.products_shortened .minprice 
{
border:1px dotted #ff6600;
padding:3px;
font-weight:bold;
font-size:10pt;
color:#666666;
text-align: center;
}

.products_shortened em {
	padding: 0px 10px 5px 10px;
}


/* Specific to the 'classic' search display type - no styling, just text and description */
.products_classicsearch .product .pad 
{
background: none;
border: none;
padding: 0;
margin: 0;
}

.products_classicsearch .product .pad p 
{
margin: 4px 0 8px 0;
}


/* INDIVIDUAL products in short format - eg featured products - padding around main text - heading em & min price etc - no styling necessary - adjust padding only */

.products_shortened .product .pad 
{
padding: 10px;
}

.products_shortened .product .moredetails 
{
display: none;
visibility: hidden;
}

/* Boxes for general display - generally leave this set to none as will clash with outer box stylings */

.box 
{
border:none;
}



.boxinset 
{
clear:both;
background-position: top left;
background-repeat: repeat-x;
}

/* Shortened column format boxes */
.products_shortened .box 
{
width: 175px;
height: 280px;
margin: 0px 5px 5px 0px;
background-position: top left;
background-repeat: repeat-x;
border-top: solid 1px #CBD5DB;
border-left: solid 1px #CBD5DB;
border-bottom: solid 1px #E2EAEF;
border-right: solid 1px #E2EAEF;
font-size: 7.5pt;
padding:0px;
}

.subcategories_shortened .box 
{
width: 175px;
height: 260px;
margin: 0px 5px 5px 0px;
background-position: top left;
background-repeat: repeat-x;
border-top: solid 1px #CBD5DB;
border-left: solid 1px #CBD5DB;
border-bottom: solid 1px #E2EAEF;
border-right: solid 1px #E2EAEF;
font-size: 7.5pt;
padding:0px;
}

/* MAIN PRODUCT BOX FORMATTING */

.products_extended .product 
{
background-image:url(../templateimages/back_fade5.png);
background-repeat:no-repeat;
width:510px;
padding:10px 0px 0px 15px;
margin:0px 15px 20px 1px; 
overflow:hidden;
width/**/:/**/ 495px;
}

.products_extended .product p
{
width:307px;
float:left;
border:1px solid #cccccc;
padding:5px;
margin:0px;
background-color:#ffffff;
width/**/:/**/ 297px;
}


.products_extended h2
{

}

.products_normal .product 
{
background-position: top left;
background-repeat: no-repeat;
margin-bottom: 0px;
padding-top: 15px;
padding-bottom: 10px;
}

/* --- additional extrainfo links  ------- */
		
/* --- esp. for position of moreinfo button beneath product description in a category page ------- */		
		

.extrainfolinks 
{
text-align:right;
padding:0px 0px 0px 0px;
margin:0px 0px 2px 0px; 
float:left;
}


.extrainfolinks .img
{
border:none;
}

.extrainfolinks .submit
{
width:148px;
margin:2px 0px 0px 0px;
float:left;
border-style: outset;
border-left: solid 1px #BBBBBB;
border-top: solid 1px #BBBBBB;
border-right: solid  1px #BBBBBB;
border-bottom: solid  1px #BBBBBB;
clear:both;
padding:1px;
width/**/:/**/ 146px;
}


.extrainfolinks a:link
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.extrainfolinks a:selected
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.extrainfolinks a:hover
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.extrainfolinks a:visited
{
font-size:1px;
color: #ffffff;
font-weight:bold;
text-decoration:none;
float:left;
}

.extrainfolinks .largeview 
{
margin: 5px 0px 0px 5px;
display: inline;
border:none;
clear:both;
}

.extrainfolinks .moreinfo
{
margin: 5px 0px 5px 0px;
background-image:none;
}


.moreinfo 
{
background-image:none;
}


.extrainfolinks .compare {
	margin: 5px 0px 0px 0px;
}

.extrainfolinks .compare a {
	font-weight: normal;
}

.extrainfolinks img {
	float: none;
	margin: 0;
	border:none;
}



/* ------------ Categories ------------------------------------------- */
.category h2 {
	margin: 0px 0px 8px 0px;
}

.subcategories {
	margin-bottom: 0px;
}

.subcategories_normal {
	background-position: top left;
	background-repeat: no-repeat;
	padding-bottom: 10px;
}

.subcategories_extended {
	background-position: top left;
	background-repeat: no-repeat;
	padding-bottom: 10px;
}

/* ------------ Main category: category description - text at top of a category page eg art & artists -------------- */

.maincategory 

{
padding: 10px;
width: 94%;
border: 0;
overflow:hidden;
}

.subcategory 
{
margin: 0px;
padding: 0px;
border:1px solid #cccccc;
}

.subcategories_normal .subcategory {
	margin: 10px;
	padding: 5px;
}

.subcategories_extended .subcategory {
	margin: 0;
	padding: 15px 0px 1px 0px;
}

.subcategory strong {
	display: block;
	margin-bottom: 4px;
}

.subcategories_extended .subcategory img, .maincategory img {
	float: right;
	margin: 0px 0px 10px 10px;
}

.subcategories_shortened .subcategory_image {
	display: block;
	margin: auto;
	margin-top: 5px;
	margin-bottom: 5px;
}

.subcategories .subcategory .pad, .maincategory .pad {
	margin: 0 0 0 0;
	zoom: 100%; /* To fix IE 'invisible text' rendering bug (http://archivist.incutio.com/viewlist/css-discuss/57305) */
	overflow: hidden; /* To fix image flow in extended view, mozz/opera */
}

/* For the shortened design */
.subcategories_shortened .subcategory {
	display: block;
	float: left;
	margin-bottom: 0px;
	
}

.subcategories_shortened .subcategory .pad {
	padding: 10px;
}

/* Style specifically for the 'link'. We remove most of the box styling for link mode */
.subcategories_link .subcategory .pad {
	margin: 0;
	padding: 0;
	border: 0;
	background-color: transparent;
}




/* ------------ Top lists -------------------------------------------- */

.boundary
{
width:510px;
height:auto;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 20px;
text-align:center;
width/**/:/**/ 490px;
}

.boundary h4 
{
font-size:18px;
color: #789297;
margin:0px 0px 5px 0px;
}

.boundbox
{
margin:0;
padding:0;
}

#toproducts

{
width:510x;
height:auto;
margin:5px 7px 0px 0px;
padding:0px 5px 0px 5px;
}

.topbox
{
width:160px;
height:250px;
margin:0px 8px 8px 0px; 
padding:0px;
float:left;
border:1px dotted #ffffff;
width/**/:/**/ 150px;
}

.rim
{
width:510px;
background-color:yellow;
}

.topbox h2
{
text-align:center;
}

.topbox a
{
text-align:center;
text-decoration:none;
font-size:14px;
font-weight:bold;
color:#ff9900;
}

.topbox a:active
{
text-align:center;
text-decoration:none;
font-size:14px;
font-weight:bold;
color:#ff9900;
}

.topbox a:hover
{
text-align:center;
text-decoration:none;
font-size:14px;
font-weight:bold;
color:#ff9900;
}

.topbox a:visited
{
text-align:center;
text-decoration:none;
font-size:14px;
font-weight:bold;
color:#ff9900;
}

.topbox img
{
max-height:144px;
max-width:144px;
width: expression(this.width > 144? 144: true);
height: expression(this.height > 144? 144: true); 
}

.radio
{
border:none;
}

.price1
{
border:none;
}

.header
{border:none;
}

.subheader
{border:none;
}

.box 
{
{border:none;
}

.price2
{
border:none;
}