/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.3.0
*/
body {
  color: #000;
  background: #FFF;
}

body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, code,
form, fieldset, legend, input, textarea,
p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

li {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

q:before, q:after {
  content: '';
}

abbr, acronym {
  border: 0;
  font-variant: normal;
}

sup, sub {
  line-height: -1px;
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}


/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.3.1
*/
/**
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE6/7 quirks mode.
 */
body {font:13px/1.22 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}
/**
 * Bump up IE to get to 13px equivalent
 */
pre,code,kbd,samp,tt {font-family:monospace;*font-size:108%;line-height:99%;}


/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.3.0
*/
/* base.css, part of YUI's CSS Foundation */
h1 {
  /*18px via YUI Fonts CSS foundation*/
  font-size:138.5%;
}
h2 {
  /*16px via YUI Fonts CSS foundation*/
  font-size:123.1%;
}
h3 {
  /*14px via YUI Fonts CSS foundation*/
  font-size:108%;
}
h1,h2,h3 {
  /* top & bottom margin based on font size */
  margin:1em 0;
}
h1,h2,h3,h4,h5,h6,strong {
  /*bringing boldness back to headers and the strong element*/
  font-weight:bold;
}
abbr,acronym {
  /*indicating to users that more info is available */
  border-bottom:1px dotted #000;
  cursor:help;
}
em {
  /*bringing italics back to the em element*/
  font-style:italic;
}
blockquote,ul,ol,dl {
  /*giving blockquotes and lists room to breath*/
  margin:1em;
}
ol,ul,dl {
  /*bringing lists on to the page with breathing room */
  margin-left:2em;
}
ol li {
  /*giving OL's LIs generated numbers*/
  list-style: decimal outside;
}
ul li {
  /*giving UL's LIs generated disc markers*/
  list-style: disc outside;
}
dl dd {
  /*giving UL's LIs generated numbers*/
  margin-left:1em;
}
th,td {
  /*borders and padding to make the table readable*/
  border:1px solid #000;
  padding:.5em;
}
th {
  /*distinguishing table headers from data cells*/
  font-weight:bold;
  text-align:center;
}
caption {
  /*coordinated marking to match cell's padding*/
  margin-bottom:.5em;
  /*centered so it doesn't blend in to other content*/
  text-align:center;
}
p,fieldset,table {
  /*so things don't run into each other*/
  margin-bottom:1em;
}

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}

/**
 * Controls the main layout.  Yeah, I'm aware that the ordering of the 
 * main application.html.erb is not ideal SEO-wise, but it's what I've
 * been left with...
 *
 * #container
 *   #header
 *   #navigation
 *   #page
 *     #left_sidebar
 *     #content
 *     #right_sidebar
 *   #footer
 */

#container {
  width: 980px;
  margin: 20px auto;
  padding:0;
  overflow: hidden;
}

#container .column {
  padding-bottom: 20010px; /* X + padding-bottom */
  margin-bottom: -20000px; /* -X */
}

#header {
  width: 805px;
  height: 80px;
  margin-left: 60px;
}

#search {
  float:right;
  width:165px;
  height:20px;
  margin-right: 5px;
}

#navigation {
  width: 799px;
  min-height: 20px;
  margin: 20px 0 0 120px;
}

#global_basket {
  float: right;
  padding: 40px 20px 0 40px;
  margin-top: -40px;
  margin-bottom:-10px;
  width: 180px;
}

#page {
  clear: both;
  width: 940px;
}

#left {
  float: left;
  width: 155px;
  margin:0;
  padding-right:5px;
}

#content {
  float: left;
  width: 600px;
  padding: 0 0 20px 0;
  border: 1px solid #bca05c;
}

#content-wide {
  float: left;
  width: 753px;
  padding: 0 0 20px 0;
  /* FIXME Wrong place for this! */
  border: 1px solid #bca05c;
  text-align: justify;
}

#content-wide p, #content-wide h1 {
  padding: 0 10px 0 10px;
}

#right {
  float:left;
  width:153px;
  margin:0;
}

#footer {
  clear: both;
  width: 759px;
  min-height: 20px;
  margin-left: 160px;
  padding-bottom: 10px;
  position: relative;
}


legend {
  font-weight: bold;
  margin-top: 1em;
}

#content fieldset {
  width: 460px;
  padding: 10px 0 0 15px;
}

#content .fields input,
#content .fields textarea {
  width: 310px;
  border: 1px solid #666;
  padding: 2px;
}

#content .fields option {
  padding: 0 2px;
}

#content .fields label {
  float: left;
  clear: both;
  width: 140px;
}

#content .fields input,
#content .fields label,
#content .fields select {
  margin-bottom: 1em;
}

#content select {
  border: 1px solid #666;
}

#content textarea {
  border: 1px solid #666;
}

#content .fields input.number {
  width: 50px;
  margin-right: 173px;
}

#content .checkboxes {
  padding-left: 155px;
}

#content .checkboxes input {
  vertical-align: top;;
}

#content .checkboxes label {
  padding-left: 10px;
}

#content #tickboxes {
  clear: both;
}

#content .controls {
  text-align: right;
}

#content .controls input {
  cursor: pointer;
  margin-left: 20px;
  background: #fff;
  color: #c00;
  font-weight: bold;
}

div#errorExplanation,
div.flash {
  margin: 15px 30px 15px 15px;
  width: 525px;
  padding: 15px;
  color: #16131a;
  border: 1px dashed #c50d3d;
}

#errorExplanation ul {
  list-style: none;
  padding-top: 15px;
}

/* Dominant colours:
 * 
 * - Black: #16131a
 * - Red:   #c8003d
 * - Gold:  #bca05c
 */
body {
  color: #333;
  line-height: 150%;
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 80%;
}

a:link,
a:visited {
  color: #333;
  text-decoration: none;
}

a:hover,
a:active {
  color: #c50d3d;
  text-decoration: none;
}

h1,
h2 {
  font-weight: normal;
}

h1 {
  font-size: 1.3em;
  letter-spacing: 2px;
}

h2 {
  font-size: 1.1em;
  letter-spacing: 1px;
}

li a.selected:link,
li a.selected:visited {
  color: #c00;
}

#content h1 {
  font-weight: normal;
  margin-top: 0px;
  padding: 10px 30px 6px 15px;
  background-color: #16131a;
  color: #c8003d;
  color: #fff;
}

#content p {
  padding-left: 20px;
  padding-right: 20px;
  text-align: justify;
}

#banner {
  margin-bottom: -4px;
}

p a {
  font-weight: bold;
}

th, td {
  border: none;
}

.hide {
  display: none;
}



/* Visual styling for the header, which replaces the text with an image. */

#header {
  background: url("../images/top-bar.png") no-repeat;
}

#header h1 {
  display: none;
}

#header h2 {
  clear:both;
  margin-left:40px;
  padding:5px 20px;
  color:#bca05c;
}

#search p {
  text-align:right;
}

#search input {
  vertical-align: middle;
  border: 1px solid #bca05c;
  height:20px;
}

#search #product_search_submit {
  margin-left:-5px;
}

#search #product_name_search {
  width: 120px;
}


/* Styling of the top-level navigation. */

#navigation {
  font-size: 0.9em;
  margin-bottom: 5px;
}

#navigation ul {
  text-transform: uppercase;
  margin: 10px 40px;
}

#navigation li {
  list-style-type: none;
  float: left;
  margin-right: 10px;
  padding-right: 10px;
  border-right: 1px solid #c8003d;
}

#navigation li, #navigation li a:hover {
  color: #c8003d;
}

#navigation li a {
  color: #16131a;
}

#navigation li.last {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}

#navigation #global_basket {
/*  background: #bca05c url("../images/shopping-bags.gif") no-repeat scroll top center;*/
  color: #fff;
}

#navigation #global_basket a:link,
#navigation #global_basket a:visited,
#navigation #global_basket a:hover,
#navigation #global_basket a:active {
  color: #fff;
  text-decoration: underline;
  font-weight: normal;
}


#breadcrumbs {
  background-color: #bca05c;
  color: #fff;
}

#breadcrumbs p {
  background-color: #EDC973;
  margin:0;
  padding: 4px 10px;
/*  margin-right: 81px;*/
}
#breadcrumbs a {
  color: #fff;
  text-decoration: underline;
}

/* Visual styling for the sidebars, both left and right. */

#left h3 {
  text-align:right;
  padding-right: 10px;
}

#left ul {
  margin:50px 5px;
}
#left ul li {
  list-style-type: none;
  height: 50px;
  vertical-align:middle;
  padding-right: 40px;
  padding-top: 6px;
  text-align: right;
}

#left ul li, #left_sidebar ul li a:hover {
  color: #c8003d;
}

#left ul li a {
  color: #16131a;
}

#right {
  background-color: #bca05c;
  color: #fff;
  font-size:90%;
}

#right h3 {
  padding: 0 5px;
  margin-top:0;
  padding-top: 1em;
  border-top: 1px solid #EDC973;
  color: #c8003d;
}

#right h3 a {
  color: #c8003d;
  text-decoration: none;
}

#right p, #right fieldset {
  padding: 0 5px;
}

#right #new_global_basket {
  background-color: #c8003d;
  padding:5px 0;
}

#right #new_global_basket h3 {
  color: #EDC973;
  background: #c8003d url(../images/basket.gif) no-repeat center right;
  margin:0;
  padding: 0 5px 4px 3px;
  border-bottom: 1px solid #EDC973;
  border-top:none;
}

#newsletter input {
  vertical-align: middle;
  border: 1px solid #bca05c;
  height:20px;
}

#newsletter #newsletter_sign_up {
  margin-left:-6px;
  margin-top: -1px;
}

#right #newsletter #newsletter_email_address {
  width: 90px;
}

#right a:link,
#right a:visited,
#right a:hover,
#right a:active {
  color: #fff;
  text-decoration: underline;
  font-weight: normal;
}


div#footer {
  border-top: 1px solid #c50d3d;
  background-color: #fff;
  font-size: 0.9em;
  text-transform: uppercase;
}

#footer li {
  list-style-type: none;
  float: left;
  margin-right: 10px;
  padding-right: 10px;
  border-right: 1px solid #c8003d;
}

#footer li.last {
  border-right: none;
}

#footer li, #footer li a:hover {
  color: #c8003d;
}

#footer li a {
  color: #16131a;
}

div.listed-product {
  float: left;
  clear: both;
  width: 600px;
  padding-bottom: 1em;
}

div.listed-product-image {
  float: left;
  width: 145px;
  padding-bottom: 20px;
  text-align: center;
}

.listed-product-image p {
  text-align: center;
}

div.listed-product-text {
  float: left;
  width: 455px;
}

div.listed-product h2 {
  background: #fff;
  color: #16131a;
}

div.listed-product h2,
div.listed-product p {
  float: right;
  width: 425px;
}

div.listed-product p {
  padding: 10px 15px 0 15px;
}

div.listed-product h2 {
  padding: 10px 15px 6px 15px;
  line-height: 110%;
}

div.listed-product-image a {
  font-weight: bold;
}

div.listed-product a:link,
div.listed-product a:visited {
  color: #16131a;
}

div.listed-product a:hover,
div.listed-product a:active {
  color: #c50d3d;
}

p.price {
  color: #c50d3d;
}

div.add-to-basket {
  clear: both;
  border-top: 3px solid #bca05c;
  padding: 0 15px;
  background: #ddd;
  text-align: right;
}

#col-two div.add-to-basket {
  border-top: 6px solid #fff;
}

div.add-to-basket form {
  padding: 5px 0;
}

div.add-to-basket input {
  background: #fff;
  margin-left: 5px;
  padding: 2px;
  color: #000;
  border: 1px solid #333;
}

div.add-to-basket input.add-to-basket {
  background: #ddd;
  padding: 0;
  border: 0;
  color: #c00;
  font-weight: bold;
  cursor: pointer;
}

#featured-product {
  padding: 5px 0 15px 0;
  text-align: left;
}

#featured-product a {
  font-weight: normal;
}

#featured-product h2 {
  border-top: 3px solid #bca05c;
  padding: 5px;
  background: #fff;
  color: #16131a;
  line-height: 110%;
}

#featured-product img {
  float: left;
  padding-right: 5px;
}

#featured-product p {
  width: 130px;
  text-align: left;
}

div#col-one {
  float: left;
  width: 145px;
}

div#col-one p,
div#col-one ul {
  padding-left:0;
  padding-right:0;
  width: 145px;
}

div#col-one ul {
  list-style: none;
}

div#col-two {
  float: left;
  width: 455px;
}

#col-two h1 {
  margin: 0;
  padding: 8px 15px 6px 15px;
  background: #c50d3d;
  color: #fff;
  line-height: 110%;
}

body.default #col-two h1 {
  border-top: 3px solid #bca05c;
  background: #16131a;
  color: #fff;
}

#col-two h2 {
  font-weight: normal;
  background: #fff;
  color: #16131a;
}

#col-two h1,
#col-two h2,
#col-two p {
  float: right;
  width: 425px;
}

body.home #content #main-image img {
  border-top: 3px solid #bca05c;
}

body.home h1 {
  margin:0;
}

body.home #banner {
  height:300px;
  width: 600px;
}

body.home #banner img {
  position:absolute;
}

body.home #content h1 {
  padding-bottom: 4px;
  color: #c8003d;
}

body.home #content h2 {
  font-weight: bold;
  margin-top: 0px;
  padding: 10px 30px 6px 15px;
  background-color: #16131a;
  color: #bca05c;
  margin-bottom:0;
}

body.home #content {
  padding-bottom:20000px;
  background-color: #16131a;
}

body.home .left {
  float: left;
}

body.home .right {
  float: right;
}

body.home #text-left {
  float: left;
  width: 29px;
}

body.home #text-right {
  float: right;
  width: 290px;
}

body.home #text-left p,
body.home #text-right p {
  padding-left:1em;
  width: 245px;
  text-align: left;
}

body.home .image {
  width: 113px;
}

body.home .boxes p {
  padding: 0;
}

body.home .boxes {
  clear: both;
  width: 600px;
  background: #16131a;
  font-weight: normal;
  color: #fff;
}

body.home .boxes .container {
  width: 260px;
  padding: 0 15px;
}

body.home .boxes a:link,
body.home .boxes a:visited {
  color: #fff;
  text-decoration: none;
}

body.home .boxes a:hover,
body.home .boxes a:active {
  color: #fff;
  text-decoration: none;
}

body.home .image span {
  float: left;
  color: #fff;
}

body.home .image img {
  border: 0;
}

body.home .image img {
  border: 1px solid #bca05c;
}

body.home .breaker {
  clear: both;
  height: 1px;
}

.corporate-image {
  float:right;
  margin-left: 5px;
  padding: 2px;
}

body.news #content h1 {
  margin-top: 0;
  background: #16131a;
  padding: 6px 0 6px 15px;
  font-weight: normal;
  color: #fff;
}

body.news #content div.news-story {
  clear: both;
  width: 570px;
  padding-bottom: 10px;
}

body.news #content div.news-story img {
  float: left;
  margin: 15px 10px 10px 15px;
  border: 0;
}

body.news #content div.news-story p {
  width: 555px;
  padding-right: 0;
}

body.news #content h1 {
  width: 585px;
}


body.basket #content h1,
body.checkout #content h1 {
  background: #c50d3d;
  padding-bottom: 6px;
  font-weight: normal;
  color: #fff;
  font-weight: normal;
  text-align: left;
}

body.basket table,
body.checkout div#basket-summary table {
  width: 600px;
  border-collapse: collapse;
}

body.basket td,
body.checkout div#basket-summary td {
  border-bottom: 3px solid #fff;
  background: #ddd;
  color: #333;
}

body.basket td,
body.basket th,
body.checkout div#basket-summary td,
body.checkout div#basket-summary th {
  padding: 6px 0 3px 0;
}

body.basket tfoot  td {
  background: #fff;
  border: 1px solid #c50d3d;
  border-width: 1px 0;
  padding: 8px 15px;
}

body.basket .amount,
body.checkout div#basket-summary .amount {
  text-align: right;
  padding-right: 15px;
}

body.basket .description,
body.checkout div#basket-summary .description {
  text-align: left;
  padding-left: 15px;
}

body.basket .quantity,
body.checkout div#basket-summary .quantity {
  text-align: left;
}

body.basket .quantity a {
  font-weight: bold;
  color: #c50d3d;
}

body.basket #content input {
  background: #ddd;
  margin-left: 0;
  padding: 0;
  border: 0;
  color: #c00;
  font-weight: bold;
  cursor: pointer;
}

body.basket #content span input {
  background: #fff;
  padding: 2px;
  color: #000;
  border: 1px solid #333;
  text-align: right;
  cursor: default;
}

body.basket div.continue {
  padding: 8px 15px;
}

body.basket div.continue a:link,
body.basket div.continue a:visited,
body.basket div.continue a:hover,
body.basket div.continue a:active {
  color: #c50d3d;
  font-weight: bold;
}

body.basket div.total,
body.checkout div#basket-summary .total {
  border: 1px solid #c50d3d;
  border-width: 1px 0;
  padding: 8px 15px;
}

body.basket div.checkout {
  padding: 15px 0 0 15px;
}

body.basket div.checkout a:link,
body.basket div.checkout a:visited,
body.basket div.checkout a:hover,
body.basket div.checkout a:active {
  background: #c50d3d;
  padding: 6px 15px 4px 15px;
  color: #fff;
  font-weight: normal;
}


body.checkout div#basket-summary .quantity a {
  display: none;
}

body.checkout div#errorExplanation {
  width: 540px;
}

body.checkout div#one.col,
body.checkout div#three.col,
body.checkout div#five.col {
  float: left;
  width: 260px;
}

body.checkout div#two.col,
body.checkout div#four.col,
body.checkout div#six.col {
  float: right;
  width: 260px;
}

body.checkout div#two.col p {
  text-align: left;
}

body.checkout div#one.col div#errorExplanation,
body.checkout div#two.col div#errorExplanation {
  width: 230px;
}

body.checkout div#one.col fieldset.fields,
body.checkout div#two.col fieldset.fields {
  width: 275px;
}

body.checkout div#one.col fieldset.fields label,
body.checkout div#two.col fieldset.fields label {
  width: 100px;
}

body.checkout div#one.col fieldset.fields input,
body.checkout div#two.col fieldset.fields input,
body.checkout div#one.col fieldset.fields select,
body.checkout div#two.col fieldset.fields select {
  width: 155px;
}

body.checkout div#one.col p,
body.checkout div#two.col p,
body.checkout div#three.col p,
body.checkout div#four.col p,
body.checkout div#five.col p,
body.checkout div#six.col p {
  width: 245px;
}

body.checkout div#tickboxes,
body.checkout div#delivery-time,
body.checkout div#delivery-costs,
body.checkout div#gift-message {
  float: left;
  clear: both;
  width: 600px;
  padding: 0;
}

body.checkout div#address-details {
  float: left;
  clear: both;
  width: 585px;
  padding: 0;
}

body.checkout div#tickboxes p,
body.checkout div#delivery-costs p,
body.checkout div#gift-message p {
  width: 570px;
  padding: 0;
}

body.checkout div#tickboxes,
body.checkout div#delivery-time,
body.checkout div#gift-message {
  padding-bottom: 1em;
}

body.checkout div#delivery-costs {
  padding-top: 1em;
}

body.checkout div#three.col fieldset {
  width: 275px;
}

body.checkout div#four.col fieldset {
  width: 24px;
  padding-right: 30px;
  text-align: right;
}

body.checkout div#delivery-time {
  border: solid #c50d3d;
  border-width: 1px 0;
}

body.checkout div#gift-message,
body.checkout div#basket-summary {
  border: solid #c50d3d;
  border-width: 1px 0 0 0;
}

body.checkout div#four.col option {
  padding-right: 4px;
}

body.checkout div#four.col select {
  margin-left: 5px;
}

body.checkout div#five.col p,
body.checkout div#six.col p {
  padding-left: 15px;
}

body.checkout div.checkout {
  clear: both;
  width: 585px;
  padding: 15px 0 0 15px;
}

body.checkout div.checkout fieldset {
  float: right;
}

body.checkout div.checkout input {
  float: right;
  background: #c50d3d;
  padding: 3px 10px 2px 10px;
  color: #fff;
  font-weight: normal;
  font-size: 95%;
  cursor: pointer;
}

body.checkout div.checkout a:link,
body.checkout div.checkout a:visited,
body.checkout div.checkout a:hover,
body.checkout div.checkout a:active {
  background: #c50d3d;
  padding: 6px 15px 4px 15px;
  color: #fff;
  font-weight: normal;
}

body.checkout div#basket-summary {
  clear: both;
  margin-top: 1em;
}

body.checkout div#basket-summary div {
  padding: 1em 15px 0 15px;
}

body.checkout div#basket-summary table {
  width: 100%;
}

body.checkout div.back-to-delivery {
  padding-bottom: 15px;
}

body.checkout div#basket-summary div.total {
  text-align: right;
}
