/* ************************************************
NOTE: This layout does things a bit differently. There's no right column, and the left
column is in a layer positioned absolutely (left:0px; top:145px;) relative to #page. The
main content area (#contentWide) and breadcrumbs (#breadCrumbs) have left padding set
wide enough to leave room for the sidebar, and a y-repeat background graphic for the sidebar
background colour and right-border. This has been done for two reasons - to allow the
sidebar background colour to extend all the way down to the footer regardless of the content
length, and because the homepage has a graphic (the big photo full of sheep) that needs to
sit hard up against the sidebar graphic. The first can be done without layers (just set the
background graphic in #page with y-repeat and have background-color set in the header and
footer areas) but the second is impossible with floats in Explorer because explorer shoves
un-removable 3px margins around floats for no reason other than it's a bug-ridden pile of 
horse puckey. So keep this arrangement in mind when making changes to this CSS file.
*************************************************** */
/***  Colours used:

#FFF 		White
#000		Black
#DB599C		Very dark pink - Address details in header and inews story subheadings
#C69		Dark pink - background of titles
#CC95BC		Middle pink - background of menus in header
#F7E7EF		light pink - backgrounds of boxes in sidebars
#DB375E		Reddish pink - prices in displays
#CCE0F5 	Pale blue - header menu link rollovers
#666    	Light grey - sidebar list rollovers
#888		Very Light Grey - Order Codes
#900		Normal text link
#800		Visited text link
#F00 		Active, focused or hovered text link

****/

/* ****************** BASIC SETUP ***************** */

body {
	margin:0;
	font-size:90%;  /* if this is changed, change the ie only text size (below) too */
	text-align:center;
	color:#000;
	background-color:#FFF;
}
/* Adjust text size for stupid MIE */
/* Hide from IE5-mac. Only IE-win sees this. \*/
	* html body {font-size:85%}
/* End hide from IE5/mac */


body, #page, td, th {
	font-family:verdana,arial,helvetica,sans-serif;
}
a {cursor:pointer;}
* html a 	{cursor:hand;} /* Only IE sees this. */
a:link		{color:#900;text-decoration:none;}
a:visited	{color:#800;text-decoration:none;}
a:hover 	{color:#F00;text-decoration:underline;}
a:focus 	{color:#F00;text-decoration:underline;}
a:active 	{color:#F00;text-decoration:underline;}

img {display: block;}

.nox { /* used to hide an element */
	font-size:1px  !important;
	height:1px  !important;
	line-height:1px  !important;
	overflow:hidden;
	margin:0px  !important;
	padding:0px  !important;
	vertical-align:text-bottom;
	color:#FFF;
	font-family:arial,helvetica,sans-serif;
	background-image:none !important;
	width:auto;
}

.breaker {
	font-size:1px;
	line-height:1px;
	clear:both;
}

/* ****************************  BASIC PAGE SETUP LAYOUT ********** */

#page {			/* Entire site */
	width:779px;
	margin: 0px auto;
	padding:0;
	text-align: left;
	border-width:0px;
	position:relative; /* to hold sidebar layer */
}

#headerBlock {	/* Header Block  */ }

#leftColumn {		/* Left Column */
	position:absolute; /* relative to #page */
	top:145px;
	left:0px;
	width:154px;
	min-width:154px;
	line-height:1.2;
	text-align:left;
}
#contentWide {  /* The big wahoonie */
	margin:0;
	padding: 0 0 0 155px; /* horizontal room for floating sidebar */
	line-height:150%;
	background-image:url(../mrsheepskin/statimages/sidebar_back.gif);
	background-repeat:repeat-y;
	background-position:0 0;
	min-height:410px; /* vertical room for sidebar content in good browsers (ie: not IE)*/
}
#breadcrumbs {
	margin:0;
	padding:0 0 0 155px;
	background-image:url(../mrsheepskin/statimages/sidebar_back.gif);
	background-repeat:repeat-y;

}
#footer {
	clear:both;
	text-align:left;
	margin:0;
	padding:0;
}

/* Stops floats absentmindedly wandering out of their containing boxes in MIE */
/* (gives the containing box 'layout' whatever the heck *that* is) */
/* Also leaves vertical room for floating sidebar in IE */
/* Hide from IE5-mac. Only IE-win sees this. \*/
	 * html #contentWide	{height:410px;}
	 * html .contentArea 	{height:50px;}
/* End hide from IE5/mac */

/* ********************* HEADER ************************************* */

h1 {
	font-size:0.7em;
	margin:0;
	padding:5px 0 5px 0;
	background-color:#FFF;
}
#pageheader {
	height:100px;
	margin:0;
	border-top:5px solid #E11127;
	border-bottom:3px solid #E11127;
	background-image:url(../mrsheepskin/statimages/header_logo.gif);
	background-repeat:no-repeat;
	background-position:50% top; 
	background-color:#FFF;
}
#pageheader address {
	display:block;
	padding:25px 5px 0 0;
	text-align:right;
	font-size:0.8em;
	font-style:normal;
	font-weight:bold;
	font-family:"trebuchet ms",arial,helvetica,sans-serif;
	color:#AAA;
	line-height:120%;
}
#navTop {
	background-color: #000;
	color:#FFF;
	line-height: 18px;
	height:18px;
	font-size:0.8em;
	margin:0;
	padding:0;
	clear:both;
}
	#navTop ul {
		display:inline;
		margin:0px;
		padding:0px;
	}
	#navTop ul li {
		padding:0 0.5em;
		margin:0;
		display: inline;
		border-left:1px solid #FFF;
	}
	#navTop ul li.first {
		border-left:1px solid #000;
	}
	#navTop a, #navTop a:visited {
		font-weight:700;
		color:#FFF;
		text-decoration:none;
	}
	#navTop a:hover {
		color:#F00;
	}
#navHome {
	float:left;
	display:inline;
	padding:0;
	margin:0;
	border-left:10px solid #000;
}
#navCheckout {
	float:right;
	display:inline;
	padding:0;
	margin:0;
	border-right:5px solid #000;
}

/* ************************* LEFT/RIGHT COLUMNS ***************************** */

	#leftColumn {
		font-size:1em;
	}
	#leftColumn h2 {
 		color:#000;
		font-weight:bold;
		margin:1em 0 0 0;
		font-size:1em;
		font-family:"trebuchet ms",arial,helvetica,sans-serif;
		text-align:center;
	}
	#leftColumn ul	{
		margin:1em 0 0 0;
		padding:0;
		border-top:1px solid #000;
	}
	#leftColumn ul li {
		font-size:0.8em;
		color: #000;
		margin: 0px;
		padding: 0.3em 0.2em;
		list-style-type: none;
		border-bottom:1px solid #000;
		text-transform:capitalize;
	}
	#leftColumn ul li h3 {
		font-weight:normal;
		margin:0;
		font-size:1em;
	}
	#leftColumn ul li a	{
		color: #000;
		text-decoration:none;
	}
	#leftColumn ul li a:hover {
		color: #F00;
	}
	#leftColumn p {
		font-size:0.8em;
		margin:0.5em;
		text-align:center;
	}
	#leftColumn p a {
		color:#A00;
	}


/* ********************* BREADCRUMBS ********************* */

#breadCrumbBody {
	margin:0 0.5em 0 1em;
	padding:1em 0 0 2px;
	font-size:0.8em;
	text-transform:capitalize;
}

/* ********************* CONTENT ********************* */

	#shoppingCart,
	#iNews,
	#inews
	{
		padding:1em; /* space around content */
		margin:0;
	}

	#contentWide h2
	{
		line-height: 120%;
		background-color: #E11127;
		border:1px solid #000;
		margin: 0 0 1em 0;
		padding: 0.2em 0.2em 0.2em 0.5em;
		font-size:0.9em;
		color:#FFF;
		font-weight:bold;
		border:1px solid #000;
		text-transform:capitalize;
	}


/* ********************* FOOTER ********************* */

#footer {
	border-top:3px solid #E11127;
	padding:2px;
	margin:0;
	font-size:0.8em;
}
#footer #navFoot {
	margin:0px;
	padding:0px;
	float:right;
}
#footer #navFoot li {
	padding:0 0.5em;
	margin:0;
	display: inline;
	border-right:1px solid #000;
}
#footer #navFoot li.last {
	border-right:1px solid #FFF;
}
#footer #navFoot a,
#footer #navFoot a:visited {
	color:#000;
	text-decoration:none;
}
#footer #navFoot a:hover {
	color:#F00;
}

/* ********************* HOMEPAGE ********************* */

#homePage {
	background-image: url(../mrsheepskin/statimages/big_low.jpg);
	background-repeat:no-repeat;
	height:410px;
}

/* ********************* INEWS STORY DISPLAY ********************* */

#inews .contentArea {
	font-size:85%;
	padding:0 2.5em 1em 2.5em;
}
#inews h3 {
	margin:1em 0 0 0;
	font-size:1.1em;
	color:#E11127;
	text-indent:-0.5em;
}
#inews address {
	font-style:normal;
	text-align:center;
	line-height:115%;
	font-family:"trebuchet ms",arial,helvetica,sans-serif;
	font-size:1.2em;
}
#contactTable td {
	font-size:0.9em;
	margin:1em auto;
}
#contactTable td {
	font-size:0.9em;
}
#contactTable td input {
	font-size:0.9em;
}
#contactTable td #submitButton {
	margin:0.5em auto;
}


/* ********************* CAT AND SUBCAT DISPLAY ********************* */
#catDisplay .listing,
#subcatDisplay .listing 
{
	width:			140px;
	float:			left;
	text-align:		center;
	padding:		4px;
}
#subcatDisplay .listingImageArea,
#catDisplay .listingImageArea
{
	width:150px;
	height:auto;
	margin:0px auto 5px auto;
	overflow:hidden;
	border:1px solid black;
}
#subcatDisplay .listing h3,
#catDisplay .listing h3 {
	font-size:0.9em;
	line-height:130%;
	font-weight:bold;
	height:4em;
	margin:0.5em 0;
}


/* ********************* LISTPROD/SEARCHPROD/SPECIAL DISPLAYS ********************* */

#listProduct h3,
#specialProduct h3,
#searchProduct h3
{
	color:#E11127;
	font-size:0.9em;
	line-height:130%;
	font-weight:bold;
	height:2em;
	margin:0.1em 0 0.5em 0;
	padding:0 0.5em;
}
#listProduct .id,
#specialProduct .id,
#searchProduct .id
{
	font-size:0.8em;
	color:#888;
}
#listProduct .listingImageArea,
#specialProduct .listingImageArea,
#searchProduct .listingImageArea
{
	width:150px;
	height:auto;
	margin:0px auto;
	overflow:hidden;
	border:1px solid black;
	text-align:center;
}
#listProduct .listingImageArea img,
#specialProduct .listingImageArea img,
#searchProduct .listingImageArea img
{
	margin:0 auto auto auto;
}
#listProduct .fakeTable,
#specialProduct .fakeTable,
#searchProduct .fakeTable
{
	display:table;
	width:100%;
}
#listProduct .fakeRow,
#specialProduct .fakeRow,
#searchProduct .fakeRow 
{
	display:table-row;
}
#listProduct .fakeCell,
#specialProduct .fakeCell,
#searchProduct .fakeCell {
	display:table-cell;
	width:30%;
	text-align:center;
	padding: 4px 4px 1.5em 4px;
}
#listProduct .moreInfo img,
#specialProduct .moreInfo img,
#searchProduct .moreInfo img
{
	margin:0.3em auto;
}

/* Hide from IE5-mac. Only IE-win sees this. \*/
	* html #listProduct   .fakeRow {clear:left;}
	* html #specialProduct .fakeRow {clear:left;}
	* html #searchProduct .fakeRow {clear:left;}
	* html #listProduct   .fakeCell {float:left;height:2em;width:30%;}
	* html #specialProduct   .fakeCell {float:left;height:2em;width:30%;}
	* html #searchProduct .fakeCell {float:left;height:2em;width:30%;}
/* End hide from IE5/mac */


/* ********************* SHOWPROD DISPLAY ********************* */

#showProduct .listingImageBlock {
	float:right;
	text-align:center;
	font-size:0.8em;
	padding:5px 5px 1.5em 1.5em;
}
#showProduct h3 {
	font-size:1em;
	line-height:130%;
	font-weight:bold;
	margin:0.5em 0 0 0;
}
#showProduct .id
{
	font-size:0.8em;
	color:#888;
	margin:0 0 0.5em 1.5em;
}
#showProduct .listingPrices {
	margin:1em 0 0 0;
	font-size:0.9em;
	padding-left:1em;
}
#showProduct .listingPrice {
	color:#E11127;
	font-weight:bold;
}
#showProduct .label {
	color:#000;
	font-weight:bold;
}
#showProduct .listingCurrencyConvert {
	font-size:0.8em;
	padding-left:1.5em;
	margin: 0 0 1em 0;
	color:#900;
}
#showProduct .listingDesc {
	font-size:0.9em;
	margin:0 0 1em 1em;
}
#showProduct #button
{
	margin:0.5em 0 1.5em 1.5em;
	border-width:0px;
}
#showProduct #optionTable {
	clear:none;
	margin:0 0 0 1em;
}
#showProduct #optionTable td {
	padding:2px;
	font-size:84%;
	line-height:120%;
}
#showProduct #optionTable select {
	font-size:0.9em;
}
#showProduct #optionTable input {
	font-size:0.9em;
}


/* ********************* ADD BASKET AND VIEW BASKET DISPLAY ********************* */

#addBasket .listingImageBlock,
#viewBasket .listingImageBlock {
	float:right;
	text-align:center;
	font-size:0.8em;
	padding:5px 5px 1.5em 1.5em;
}
#addBasket .fakeRow,
#viewBasket .fakeRow {
	display:table-row;
}

#addBasket .listing,
#viewBasket .listing {
	display:table-cell;
	border-bottom:1px solid #000;
	margin:0.5em 0 1em 1em;
	padding:0 0 0.5em 0;
	clear:right;
	float:none;
	width:590px; 
}
#addBasket .listing h3,
#viewBasket .listing h3 {
	font-size:1em;
	line-height:130%;
	font-weight:bold;
	margin:0.5em 0 0 0;
}
#addBasket .id,
#viewBasket .id
{
	font-size:0.8em;
	color:#888;
	margin:0
}
#addBasket .details,
#viewBasket .details
{
	font-size:0.9em;
	margin:0 0 0.5em 0;
	color:#444;
}
#addBasket .details label,
#viewBasket .details label
{
	font-weight:bold;
}

#addBasket .details .price,
#viewBasket .details .price
{
	color:#E11127;
	font-weight:bold;
}

#addBasket .subSummary,
#viewBasket .subSummary
{
	font-size:1em;
	color:#E11127;
	font-weight:bold;
}

#addBasket .text,
#viewBasket .text
{
	font-size:0.9em;
}

#addBasket #summary,
#viewBasket #summary {
	font-size:0.9em;
	text-align:center;
	clear:right;
	font-weight:bold;
}
#viewBasket #summary {
	margin:0 2em;
}
#addBasket #summary .price,
#viewBasket #summary .price {
	color:#E11127;
}
#addBasket #summary img,
#viewBasket #summary img {
	display:inline;
	padding:0 1.5em;
}

/* ********************* TELL A FRIEND ********************* */

#tellPage {
	text-align:center;
	margin:0;
}
#tellPage .box1Header {
	color:#FFF;
	font-size:1.2em;
	font-weight:bold;
	margin:0 0 1em 0;
	padding:0.3em 0.5em;
	background-color: #C69;
}
#tellPage .box1Header img {display:none;}
#tellPage .box1Body {}
#tellPage .box1Bottom {}

#tellPage .tellAFriendTable {margin:0 auto;}
#tellPage .tellAFriendLabelMessage,
#tellPage .tellAFriendLabel {color:#000;text-align:left;}
#tellPage .tellAFriendInput {}
#tellPage .tellAFriendLabelMessage {}
#tellPage #submitButton {
	margin:0.5em 0 0.5em 10em;
}

/******************** FORMS ***************************/

#inews address {
	font-style:normal;
	margin:1.1em 0 0 0;
}
#inews form {
	font-size:1em;
	margin-top:1.1em;
}
#inews form label {
	float:left;
	clear:left;
	width:11em;
	margin:0;
	color:#656565;
}
#inews form input {
	display:block;
	margin:0.2em 0 0.2em 10em;
}
#inews form textarea {
	display:block;
	margin:0.3em 0 0.3em 10em;
	width:17em;
	height:10em;
}