@import "normalise.css";
@import "clearfix.css";
@import "cart.css";
@import "subcategories.css";
/* CSS Document */
/*Rebecca Esler*/
/*08/02/08*/

body{
	background-image:url(../images/bg.jpg);
	background-position: top left;
	background-repeat: repeat-x;
	background-color: #b2e7f9;
	margin:0;
	padding:0;
	text-align: center;}
	
h5 {
	color: #2f63a1;
	font-weight: bold;
	font: 14px Arial, Helvetica, sans-serif;
	}

hr {
	width: 100%; 
	height: 2px!important;
	border:0;
	background-color:transparent;
	background-image:url("../images/line.gif");
	background-position:center top;
	background-repeat:repeat-y;
}

/*-------centres site--------*/
#frame{
	width: 950px;
	padding:0;
	margin:0 auto;
	text-align:center;
	background-image:url(../images/content_bg.gif);
	background-position: top left;
	background-repeat: repeat-y;}

#banner{
	width: 950px;
	padding:0;
	margin:0;
	text-align:center;
	clear: both;}

/*-------top navigation--------*/
#nav{
	background-image:url(../images/nav.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	margin:0;
	padding:7px 0 0 42px;
	text-align: left;
	width: 908px;
	height:30px;
	font: 13px Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-weight:bold;}

#nav ul{
	margin:0;
	padding:0;}

#nav li{
	list-style: none;
	margin:0;
	padding:0 20px;
	border-right: 1px solid #a7eaff;
	display: inline;}

#nav a:link, #nav a:visited{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #ffffff;
	font: 13px Arial, Helvetica, sans-serif;
	font-weight:bold;}

#nav a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #08f4f8;
	font: 13px Arial, Helvetica, sans-serif;
	font-weight:bold;}

/*-------content area--------*/
#content{
	background-image:url(../images/content.gif);
	background-position: top left;
	background-repeat: no-repeat;
	margin:0;
	padding:0px;
	text-align: left;
	width: 950px;
	min-height:637px;
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#000000;}

/*-------left side--------*/
#left{
	width: 209px;
	margin: 0;
	padding:27px 0 42px 39px;
	float: left;
	display: inline;}

/*-------online shop--------*/
#subnav{
	margin:0;
	padding:0 0 0px 24px;
	text-align: left;
	width: 185px;
	font: 11px Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-weight:bold;}

#subnav ul{
	margin:5px 0 0 0;
	padding:0;}

#subnav li{
	background-image:url(../images/subnav.gif);
	background-position: top left;
	background-repeat: no-repeat;
	list-style: none;
	margin:0;
	padding:4px 0px 6px 20px;}

#subnav a:link, #subnav a:visited{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #ffffff;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}

#subnav a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #08f4f8;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}
	
/*-------clearance--------*/
#clearance{
	margin:0;
	padding:0 0 30px 24px;
	text-align: left;
	width: 185px;
	font: 11px Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-weight:bold;}
	
#clearance ul{
	margin:0px 0 0 0;
	padding:0;}
	
#clearance li{
	background-image:url(../images/subnav_on.gif);
	background-position: top left;
	background-repeat: no-repeat;
	list-style: none;
	margin:0;
	height: 40px;
	padding:12px 0px 0px 20px;}
	
#clearance a:link, #clearance a:visited{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #ffffff;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}

#clearance a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #000000;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}

/*-------information--------*/
#subnavBtm{
	margin:0;
	padding:0 0 0 24px;
	text-align: left;
	width: 185px;
	font: 11px Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-weight:bold;}

#subnavBtm ul{
	margin:5px 0 0 0;
	padding:0;}

#subnavBtm li{
	background-image:url(../images/subnav_btm.gif);
	background-position: top left;
	background-repeat: no-repeat;
	list-style: none;
	margin:0;
	padding:4px 0px 6px 20px;}

#subnavBtm a:link, #subnavBtm a:visited{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #ffffff;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}

#subnavBtm a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #08f4f8;
	width: 165px;
	display:block;
	font: 11px Arial, Helvetica, sans-serif;
	font-weight:bold;}
	
.related-categories ul	{
	margin:0;
	padding:0;}

.related-categories li	{
	background-image: url(../images/sub_category.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	margin:4px 4px 4px 0;
	padding:6px 10px 8px 23px;
	list-style:none;
	width: 158px;
	float:left;
	text-transform: uppercase;
	color: #ffffff;
	display:block;}
	
	/*-------advertising box under login--------*/

#promo {
padding: 10px 0px 0px 25px;
}

/*-------right side--------*/
#right{
	width: 615px;
	margin: 0;
	padding:25px 51px 22px 36px;
	float: right;
	display: inline;}

#right input{
	text-align: left;
	font: 11px Arial, Helvetica, sans-serif;
	color:#000000;
	margin:0;
	padding:2px;}
	
/*-------right side--------*/
#rightInside{
	width: 615px;
	margin: 0;
	padding:20px 51px 22px 36px;
	float: right;
	display: inline;}
	
/*-------content homepage--------*/
#textHome{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#000000;
	float:left;
	display: inline;
	width: 397px;
	margin: 0;}


#textHome a:link, #textHome a:visited{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#2f63a1;
	padding:0;
	margin: 0;
	text-decoration: none;}

#textHome a:hover{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#e20b12;
	padding:0;
	margin: 0;
	text-decoration: none;}

/*-------content--------*/
#text{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#000000;
	float:left;
	display: inline;
	width: 397px;
	margin: 0;
	padding: 20px 0 0 0;}


#text a:link, #text a:visited{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#2f63a1;
	padding:0;
	margin: 0;
	text-decoration: none;}

#text a:hover{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#e20b12;
	padding:0;
	margin: 0;
	text-decoration: none;}

#text td{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#000000;}

#text h3{
	background-image:url(../images/h1.gif);
	background-position: top left;
	background-repeat: no-repeat;
	color: #2f63a1;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding: 11px 0 5px 26px;
	font:15px Arial, Helvetica, sans-serif;
}

#text h4{
	color: #2f63a1;
	font-size: 12px;
	font-weight:bold;
	margin: 0;}

#text h4 a:link, #text h4 a:visited{
	color: #2f63a1;
	font-size: 12px;
	font-weight:bold;
	margin: 0;
	text-decoration: none;}

#text h4 a:hover{
	color: #e20b12;
	font-size: 12px;
	font-weight:bold;
	margin: 0;
	text-decoration: none;}
	
	#text td{
	margin:0;
	padding:5px;}

.blue{
	color:#0c4986;
	font: 12px/16px Arial, Helvetica, sans-serif;}
	
#sub{
	font: 11px/16px Arial, Helvetica, sans-serif;
	margin: 0;}


#sub a:link, #sub a:visited{
	font: 11px/16px Arial, Helvetica, sans-serif;
	color:#ffffff;
	padding:0;
	margin: 0;
	font-weight:bold;
	width: 158px;
	text-decoration: none;}

#sub a:hover{
	font: 11px/16px Arial, Helvetica, sans-serif;
	color:#08f4f8;
	font-weight:bold;
	padding:0;
	margin: 0;
	text-decoration: none;}
	

/*-------my cart--------*/
#contentright {
	width: 198x;
	padding: 20px 0px 20px 0px;
	margin: 0px;
	float:right;
	display: inline;
	font: 11px Arial, Helvetica, sans-serif;}

#contentright img{
	padding: 0px 0px 5px 0px;
	margin: 0px;
	border: 0px;}

/*-------- breadcrumbs ---------*/
#rightInside .breadcrumbs {
	font: 10px Arial, Helvetica, sans-serif;
	color: #e20b12;
	padding: 0px 0px 5px 0px;
	margin: 10px 0px 10px 0px;
	height: 10px;}

#rightInside .breadcrumbs,a:link, #rightInside .breadcrumbs a:visited{
	font: 10px Arial, Helvetica, sans-serif;
	color: #e20b12;
	text-decoration: none;}

#rightInside .breadcrumbs a:hover{
	font: 10px Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #2f63a1;}

/*-------featured products--------*/
#featured-products{
	float:left;
	padding:28px 91px 37px 39px;
	margin:0;
	width: 820px;
	background-image:url(../images/line.gif);
	background-position: top center;
	background-repeat: no-repeat;
	text-align: left;
	font: 11px Arial, Helvetica, sans-serif;
	color:#000000;}

#featured-products p{
	padding:8px 0 0 0;
	margin:0;
	text-align: left;
	font: 11px Arial, Helvetica, sans-serif;
	color:#000000;}

#featured-products table{
	margin:0 0 0 0px;
	padding:0;}

#featured-products table table{
	margin:0 0px 0 11px;
	padding:0;}

.img{
	margin:0;
	paddin: 0;
	background-image:url(../images/img_bg.gif);
	background-position: top left;
	background-repeat: no-repeat;
	width: 200px;
	height:186px;}

.text{
	margin:0;
	padding:0 0 0 16px;}

.text input{
	padding: 2px;
	margin:0;}

.strong{
	font-weight:bold;}

#featured-products h1{
	background-image:url(../images/h1.gif);
	background-position: top left;
	background-repeat: no-repeat;
	padding: 4px 0 3px 25px;
	margin:10px 0 0 0;
	font: 12px Arial, Helvetica, sans-serif;
	color:#000000;
	font-weight:bold;}

#featured-products h1 a:link, #featured-products h1 a:visited{
	padding: 0px;
	margin:0;
	font: 12px Arial, Helvetica, sans-serif;
	color:#000000;
	font-weight:bold;}

#featured-products h1 a:hover{
	padding: 0px;
	margin:0;
	font: 12px Arial, Helvetica, sans-serif;
	color:#1d67c0;
	font-weight:bold;}

#featured-products ul{
	margin:5px 0 5px 15px;
	padding:0;}

#featured-products li{
	background-image:url(../../images/li.gif);
	background-position: top left;
	background-repeat: no-repeat;
	padding: 0 0 0 0px;
	margin:0;}

#featured-products a:link, #featured-products a:visited{
	margin:0;
	padding:0;
	text-decoration:none;
	color: #000000;
	font: 11px Arial, Helvetica, sans-serif;
	border:0;
	font-weight:bold;}

#featured-products a:hover{
	margin:0;
	padding:0;
	text-decoration:none;
	font: 11px Arial, Helvetica, sans-serif;
	color: #1d67c0;
	font-weight:bold;}


/*-------footer--------*/
#footer{
	float:left;
	background-image:url(../images/footer.jpg);
	background-position: top left;
	background-repeat: repeat-y;
	margin:0;
	padding:60px 0 0 57px;
	text-align: left;
	width: 893px;
	height:23px;
	font: 10px Arial, Helvetica, sans-serif;
	color:#000000;
	font-weight:bold;}

#footer ul{
	margin:0;
	padding:0;}

#footer li{
	list-style: none;
	margin:0;
	padding:0px 5px;
	border-right: 1px solid #a7eaff;
	display: inline;}

#footer a:link, #footer a:visited{
	font-weight:bold;
	margin:0;
	padding:0;
	text-decoration: none;
	color: #ffffff;}

#footer a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #08f4f8;}

/*-------hairy lemon link--------*/
#hl{
	width: 935px;
	padding:5px 15px 10px 0;
	margin:0 auto;
	text-align:right;
	font: 10px Arial, Helvetica, sans-serif;
	color:#000000;}

#hl a:link, #hl a:visited{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #000000;}

#hl a:hover{
	margin:0;
	padding:0;
	text-decoration: none;
	color: #1d67c0;}


.printonly {
	display:none;}

.clear {
	clear:both;
	height:1px;}




/* -----------------------CART STYLES-------------------------- */

/* ------------Category Product List - 3 columns-------------- */
.product-list {
	padding: 15px 0 0 0;
	clear: both;
	width: 524px;
	text-align:left;
	font:11px Arial, Helvetica, sans-serif;}
	
.product-list1 {
	padding: 0px;
	clear: both;
	text-align:left;
	font:11px Arial, Helvetica, sans-serif;}

#main .product-list td{
	border-bottom: dashed 1px #9c9b9b;
	padding: 5px 0px 5px 0px;}

#main .product-list p {
	margin-left:0;}

table.products {
	voice-family: "\"}\"";
	voice-family: inherit; 
	width: 397px;
	text-align:left;}
	
	
table.mini-products{
margin:0;
padding:0;
border-bottom: dashed 1px #9c9b9b;}

table.products, table.products td, table.mini-products, table.mini-products td {
	margin:0;
	padding: 0px;
	border-spacing: 0px;
	border-collapse: collapse;}

table.products td {
	/*background: url(/images/sect-b-product-middle.gif) repeat-x 0px 0px*/;
	vertical-align: top;
	padding: 0;
	border-bottom: dashed 1px #9c9b9b;}

table.products td.thumbnail, table.mini-products td.thumbnail {
	/*background: url(/images/sect-b-product-left.gif) no-repeat left top;*/
	padding:8px 0 8px 0;
	width: 88px;}

table.products td.thumbnail img, table.mini-products td.thumbnail img {
	border: none;}

table.products td.description, table.mini-products td.description {
	vertical-align: top;
	padding: 8px 0px;}

table.mini-products td.description {
	width: 100px;}

#main table.products td.description p, table.mini-products td.description p {
	margin:0;	
	text-align:left;}

table.products td.price {
	padding: 8px 8px 0 0;
	width: 75px;
	text-align: center;
	font-size:11px;
	font-weight:bold;
	/*background: url(/images/sect-b-product-right.gif) no-repeat right top;*/}

table.products td.price .price {
	font-size:16px;
	font-weight:bold;
	color:#000;}

.price SELECT {}

table.mini-products td.description {
	/*background: url(/images/sect-b-product-right.gif) no-repeat right top;*/
	padding-right: 8px;
	line-height: 1;}
	
.seo-phrase{
display:none;}




/* ------------details page of product-------------- */
.product_info {
	padding-left: 8px;}

.product-info .description {
	float: left;
	width: 100%;}

.product-info .description-inner {
	margin: 0;}

.product-info .order-me {
	float: left;
	margin: 16px 0 0 0;
	width: 184px;
	/*background: url(/images/sect-b-product-top.gif) no-repeat right top;*/
	text-align: left;}

.product-info .order-me #flipper {
	right: 16px;
	top: 160px;
}

.product-info .order-me #zoomer {
display:none;}

.product-info .order-me .thumbs {
	padding: 0 7px 0 0;
}
	
.product-info .addtocart{
	padding: 0 30px 0 0;}

.product-info #product-shot {
	margin: 8px 8px 8px 0;
	cursor: pointer;}

.product-info form {
	margin: 0px 0px 0px 8px;
	text-align: center;
	padding: 0px 8px 8px;
	/*background: url(/images/sect-b-product-bottom.gif) no-repeat right bottom;*/
	position: relative;
	top: 8px;}

.product-info .icons {
	margin: 0px 8px;
	text-align: center;}

dl.product-details {
	margin: 1ex 0px 2ex 16px;}

dl.product-details dt {
	float: left;
	clear: left;
	font-weight: bold;
	width: 4em;}

dl.product-details dd {}

.addtocart .price {
	font-size:16px;
	font-weight:bold;}


/* ------------Register Form / Add Address form -------------- */

fieldset {
	border: 1px solid #2f63a1;
	margin: 0px 8px 8px 0;
	padding:1em;}
	

* html fieldset {
	padding: 0px 8px;}
	

legend {
	font-weight: bold;
	color: #2f63a1;
	/*text-transform: uppercase;*/}

table.form {
	border-spacing: 0px;
	border-collapse: collapse;
	margin: 0px 8px 2ex 16px;}

table.form td{
font:11px Arial, Helvetica, sans-serif;}

fieldset table.form {
	width: 100%;
	margin: 0px;}

table.form td.label {
	width: 160px;}

table.form label {
	font-weight: bold;
	color: #000000;
	font:12px  Arial, Helvetica, sans-serif;}

table.form input.text,
table.form textarea,
table.form select {
	width: 90%;}

input.text,
textarea,
select {
	border: 1px solid #7f9db9;
	background-color: #ffffff;
	font: 12px Arial, Helvetica, sans-serif;
	vertical-align: bottom;
	margin:0px 0;}

input.image {
	vertical-align: bottom;}




/* ------------Step 1: Address that you have entered - confirming details-------------- */
table.addresses {
	margin: 5px 0px 5px 0px;	
	width: 397px;}

table.addresses td {
	vertical-align: top;
	padding: 1ex;
	border-bottom: 1px solid #2f63a1;}





/* ------------Step 2: Confirming order details-------------- */
#text table.order-details{
margin: 0px;
border: 1px solid #2f63a1;
width: 100%;
font: 10px Arial, Helvetica, sans-serif;
	color:#000000;}

#text table.order-details td {
border: 1px solid #2f63a1;
	vertical-align:top;
	margin:5px;
	padding:5px;}

table.order-details thead th {
	font-weight: bold;
	text-align: left;
	padding: 5px;
	border: 2px solid #2f63a1;
	border-width: 1px 0px;}

table.order-details td.price {
	text-align: center;}
	
table.order-details td.qty {
	text-align: center;}
	
table.order-details tfoot td {
	border-top-color: black;}



/* ------------Step 3: Paying by direct credit or postal or fax-------------- */
table.fax-order {
	margin: 1ex 8px 2ex 0px;	
	border-spacing: 0px;
	border-collapse: collapse;
	width: 397px;}

table.fax-order table.order-details {
	margin: 0px;
	width: 100%;}

table.fax-order td {
	/*border-top: 1px solid #C7C9CA;*/
	vertical-align: top;}

table.fax-order th {
	border: 1px solid black;
	border-width: 1px 0px;
	font-weight: bold;
	/*test-transform: uppercase;*/}

table.payment-method {
	border-spacing: 0px;
	border-collapse: collapse;
	width: 100%;}

table.payment-method td {
	line-height: 2.5em;}

.print-only {
	display: none;}




/* ------------Invoice-------------- */
table.invoice {
	margin: 1ex 8px 2ex 16px;	
	border-spacing: 0px;
	padding: 5px;
	border-collapse: collapse;
	width: 500px;
	font: 11px Arial, Helvetica, sans-serif;}

table.invoice table.invoice {
	margin: 0px;
	width: 100%;}

table.invoice td {
	/*border-top: 1px solid #C7C9CA;*/
	vertical-align: top;}

table.invoice table.order-details {
	margin: 0px;
	font:11px Arial, Helvetica, sans-serif;
	color:#000000;
	width: 100%;}

table.invoice table.order-details h4 {
	margin: 0px;
	font:12px Arial, Helvetica, sans-serif;
	color:#0c4986;
	width: 100%;}


table.invoice th {
	border: 1px solid black;
	border-width: 1px 0px;
	font-weight: bold;
	/*test-transform: uppercase;*/}




/* ------------List or products ordered-------------- */
table.order-list {
	width: 397px;
	margin: 0px 8px 2ex 0px;
	padding: 3px 0;
	border-collapse: collapse;
	border-spacing: 0px;
	border-bottom: 1px solid black;}

table.order-list td {
	border-top: 1px solid #ccc;}

table.order-list th {
	border: 1px solid black;
	border-width: 1px 0px;
	text-align: left;}

table.metric .metric {
	display: inline;}

table.metric .imperial {
	display: none;}

table.imperial .metric {
	display: none;}

table.imperial .imperial {
	display: inline;}




/* ------------Sizing Chart-------------- */
#sizing-chart {
	margin: 0px 0px 2ex 8px;
	padding: 7px;
	border: 1px solid #5C5F61;
	background: #C7C9CA;}

#sizing-chart p {
	margin: 0px 0px 2ex;}

#sizing-chart h3 {
	margin: 0px;
	padding: 0px;}

#sizing-chart table {
	border-collapse: collapse;
	border-spacing: 0px;
	margin: 0px 0px 2ex;}

#sizing-chart th {
	padding: 2px 4px;
	border: 1px solid #5C5F61;
	font-weight: bold;}

#sizing-chart td {
	width: 4em;
	padding: 2px 4px;
	border: 1px solid #5C5F61;}

#sizing-chart thead th {
	text-align: center;
	background: #5C5F61;
	color: white;}

#sizing-chart tr th {
	text-align: left;
	width: 6em;}

#sizing-chart tr.odd td,
#sizing-chart tr.odd th {
	background: white;}

#sizing-chart tr.even td,
#sizing-chart tr.even th {
	background: #e2e3e3;}




/* ------------Enquiry Form-------------- */
#enquiryform {}

#enquiryform td {
	padding:10px 1em;
	vertical-align:top;}

.charitylink {
	float:right;
	margin:0 10px 5px 5px;}

.clearall {
	clear:both;}

ul.error {
	font-weight:bold;
	color:#f00;}

input.error, select.error, textarea.error {
	background-color:#fdd;}

.required {
	font-weight:bold;
	color:#000000;}

#errormsg {
	font-size: 10px;
	margin:1em 0;
	color:#f00;}
	
.right{
	text-align: right;}
	
#submit {
  width: 127px;
  height: 21px;
  padding: 55px 0 0;
  margin: 0;
  border: 0;
  background: transparent url(/images/send_button.jpg) no-repeat center top;
  overflow: hidden;
  cursor: pointer; /* hand-shaped cursor */
  cursor: hand; /* for IE 5.x */
}

/* ---------------- Google search --------------*/
#cse-search-results iframe {
	width: 380px;
	border: 5px solid E5F2FE;
	}

#google-search-box {
	float:right; 
	margin-top:10px;
	margin-right:25px;
	}
	
	
/* Subcategories Additional */

	.related-categories li#subcat-SKins {
	background-image: url(../images/subcategories/SKins.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	margin:4px 4px 4px 0;
	padding:6px 10px 8px 23px;
	list-style:none;
	width: 158px;
	height:90px;
	float:left;
	text-transform: uppercase;
	color: #ffffff;
	display:block;}