/* Category listings */
/* ----------------- */

table.products td a	{ display: block; padding-left: 16px; background: url("images/bullet_med.png") 0 0 no-repeat; }
table.products td p	{ margin: 0.2em 0 0; padding-left: 16px; }



/* This overrides the standard thumbnail layout to align to the top (because of variable caption sizes) and to assume a maximum thumbnail width of 128px. To adjust this, add 4px for image border (and 12px for link padding under IE5 & 5.5) onto the maximum width for thumbnails. */
table.thumbnails td		{ vertical-align: top; }
/* Thanks Alan but we don't mind if the images are a funny width - Tom 16/11/2007*/
/*
.thumbnails a			{ width: 132px; }
* html .thumbnails a	{ width: 144px; w\idth: 132px; }
*/
.thumbnails .title		{ display: block; text-align: right; font-size: 90%; }
.thumbnails .price		{ display: block; text-align: right; color: white; }
/* Special images in grid layout. -Tom 15/11/2007 */
table.thumbnails td	a { display: block; height: 100%; position: relative; }
table.thumbnails td img.special
						{ border: none; position: absolute; top: 0; left: 0; }


/* This overrides the standard thumbnail layout to align to the top (because of variable caption sizes) and to assume a maximum thumbnail width of 128px. To adjust this, add 4px for image border (and 12px for link padding under IE5 & 5.5) onto the maximum width for thumbnails. */
table.thumbnails td		{ vertical-align: bottom; }
.thumbnails a			{ width: 132px; position: relative; height: 100%; }
* html .thumbnails a	{ width: 144px; w\idth: 132px; }
.thumbnails .title		{ display: block; text-align: right; font-size: 90%; }
.thumbnails .price		{ display: block; text-align: right; color: white; }
.thumbnails .special	{ border: none; position: absolute; top: 0; left: 0; }

/* Product pages */
/* ------------- */

#product-price .old	{ text-decoration: line-through; }
#product-price .new	{ color: white; font-style: italic; }


#product-photos			{ float: right; width: 312px; margin-left: 24px; position: relative; /* Fixes draw bug in IE<=6 */}
#product-photos .note	{ margin: 0 12px 12px 0; background: #432; padding: 0.25em 0.5em; }
#main-image				{ margin: 0 12px 0 0; display: block; }
#additional-images		{ margin: 12px 0 0; }

#product-enquire		{ margin: 1em 0; width: 300px; }
#product-enquire input	{ width: 100%; }


/* These are optional little zoom icons that appear in the bottom-left of linked images. */
/* We don't use them. Firefox gets confused with them for some reason. -Tom 16/11/2007 */
/*
.zoom
{
	display: block;
	height: 32px;
	width: 32px;
	margin: -32px 0 0;
	position: relative;
	top: -10px;
	left: 10px;
	opacity: 0.66;
}

* html .zoom	{ display: none !important; /* Do not show at all for IE<7, since this is a 24-bit PNG }
a:hover .zoom,
a:active .zoom,
a:focus .zoom	{ opacity: 1; }
*/

/* Added by Tom to accommodate index layout of subcategories. See public_html/products/content/index.tpl. */
div.index.layout
{
}
div.index.layout div.category.image
{
	float: left;
}
div.index.layout table.subcategories
{
	width: 100%;
}
div.index.layout table.subcategories td
{
	white-space: nowrap;
}

table.inputs,
table.options
{
	clear: left;
	float: left;
	width: auto !important;
}
table.inputs td
{
	vertical-align: middle;
}
table.inputs td.enquire,
table.inputs td.add
{
	padding-top: 10px;
}
