/*

												ATTENTION PLEASE!

Hello and welcome to this stylesheet. If you're new here, please take the time to read the few notes at the front here, it will help make your life a little simpler. 

1. Type sizing

All type is sized in % where possible. This is just to make the maths easier. It should have no visible difference to using em, which would be the preferred unit otherwise.



*/

body {
	text-align: center;
	font: 12px/1.4 arial, helvetica, sans-serif;
	text-decoration: none;
	}
	
.wrap { /* This sets font-sizes for most elements on the page */
	text-align: left;
}

/* First stage of my attempt to clean up this stylesheet - putting font-sizes all in the same place*/

h1 {
	font-size: 200%;
	line-height: 1.2;
	margin-bottom: 0.8em;
}

h2, .big {
	font-size: 160%;
}

h2 { /*This is a bit specialist, so I can't combine it with other selectors. Currently considering whether its really necessary.*/
	margin-bottom: 0.6em;
	line-height: 1.2;
	padding-top: 35px;
	width: 100%;
}

.article h2 {
  clear: none;
  display: block;
  padding: 0;
  width: auto;
}

h2.first {
	padding: 0;
}

/* This isn't the base font-size for the site, just certain areas they wanted the typography bigger.*/

h3, .article p, .article ul, .article ol, .article dl, #find_carts_widget div label, #find_carts_widget div select, #find_carts_widget div input, #main #selling-points li {
	font-size: 120%;
}

.business_account h2 {
  padding-top: 0;
}

ul#categories > li > a, #delivery_message, #pricepromise_message, #guarantee_message, .basket_message_box table table {
	font-size: 110%;
}

h4, h5, h6, #product_list h2.cable a, #main .family a, .wrap .searchform input {
	font-size: 100%;
	margin-bottom: 0.2em;	
}

#footer .brands p, #help_menu li li {
	font-size: 80%;
}

#main h1 a, #main h2 a {
	font-size: 63%;
}

/* Other properties of typographic elements*/

h3.result_no span {
	display: inline;
	line-height: 1.5;
	padding: 0;
	vertical-align: baseline;
}

h1, h3, h4, h5, h6 { /* Setting all colours here, as it's easier */
 	color: #4E1A00;
}

#shoppingbasket h2 {
	padding: 38px 0 0 9px;
	width: 293px;
}

#shoppingbasket h2 a, #shoppingbasket h2 a:visited {
	color: #4E1A00;
}

h3.toggle {
  cursor: pointer;
}

.product_heading, .customer legend {
  display: block;   
}

.checkout h3, .customer legend, #shopping_cart th {
  background-color: #f1f1f1;
  border-top: 1px solid #D5D4AA;
  text-decoration: none;
}

p.add_to_basket {
	margin-bottom: 0.3em;
}

.product_heading, .checkout h3, #shopping_cart th {
  margin: 0 0 0.6em 0;
}

.product_heading, .checkout h3 {
  padding: 0.5em 0 0.5em 0.5em;
}

.product_heading, #description h3 {
  color: black;
}

#shopping_cart th {
  padding: 0.5em 0em;
  text-align: center;
}

#shopping_cart .description {
  text-align: left;
  padding-left: 0.4em;
}

#receipt table td {
  text-align: center;
}

h3 span, h3 a {
	display: block;
	padding: 0 0 0 22px;
	line-height: 26px;
	vertical-align: middle;
	}

#main .cart_list a h3 {
  cursor: pointer;
  margin: 0;
  text-decoration: underline;
}

label, .label {
  vertical-align: middle;
}

td label {
  line-height: 2;
}

.customer legend {
	margin-bottom: 1em;
}

.customer legend span {
  display: block;
  font-weight: bold;
  padding: 3px 10px 6px 6px;
	width: 624px; /* In FF, legend is given the default display property of -moz-fit-content, which means that it will automatically take the width of it's contents, without having to be floated. This is fine, until you want to have a background of consistent length on all your legends. The question I need to resolve is, can you disable this and style the legend like a normal block-level element. But there are further problems in IE I think.*/
}

.checkout .customer legend span {
	width: 744px;
}

#product_list h2.cable a {
  text-decoration: none;
  color: #4E1A00;
}

#itemhead {
	clear: both;
	position: relative;
	}

#itemhead h1 {
	width: 80%;
	}

#main #itemhead img {
	margin: 0 0 10px 0;
	position: absolute;
	right: 0;
	top: 1px;
	}

/* Paragraphs */

.article p, .checkout p, #description p, .printer_list, #main #bestselling_carts, #delivery_message, #pricepromise_message, #guarantee_message, .page_nav, #help-articles .content, #footer p  {
	margin-bottom: 1.2em;
}

/* Article Styles*/

/* Articles are any elements which are purely text, as distinct from user interface elements This style and its descendants helps distinguish ui and text typographically.*/

.article_small p, .article p, .article ul, .article ol, .article dl {
	margin-bottom: 1.2em;
}

.article_small ul li, .article ul li, .article_small ol li, .article ol li {
	margin-left: 2em;
}

.article_small ul li, .article ul li {
	list-style-type: disc;
}

.article ol li {
	list-style-type: decimal;
}

.article_small ul li, .article ul li, .article ol li, .page_nav li {
	margin-bottom: 0.6em;
}

.article dt {
	font-weight: bold;
}

.article .comments {
  padding-left: 5em;
  font-size: 90%;
}

.article .comments h3 {
  margin-bottom: 1em;
  font-style: italic;
  font-size: 130%;
}

.article .comments ul {
  margin-left: 0;
}

.article .comments ul li {
  list-style-type: none;
}

.article .comments p {
  margin-bottom: 0;
}

.article .comments .name {
  font-size: 100%;
}

.article .comments .readmore {
  text-align: right;
}

.article .comments .hide {
  display: none;
}

.article .comments .stars {
  padding-left: 70px;
  background: url(/images/stars.png) left center no-repeat;
  font-weight: 700;
}

.article_small {
  clear: both;
}

/* Article Ends*/

#main #bestselling_carts, .printer_list {
  overflow: hidden;
}

#main .printer_list li {
	display: inline;
	float: left;
  margin: 0 1em 0.4em 0;
  width: 32%;
}

#popular_printer_list .printer_list li {
  width: 24%;
}

#main .product .information .benefits {
  background: none;
  line-height: 1.5;
  margin-top: 1em;
}

/* Secondary column elements */

#secondary a {
	color: #000;
}

#delivery_message, #pricepromise_message, #guarantee_message {
	display: block;
	line-height: 1.2;
}

	#delivery_message > a, #pricepromise_message > a, #guarantee_message > a {
		height: 70px;
		width: 80px;
		float: left;
		padding-right: 0.6em;
		text-indent: -9999px;  /* Work in progress! */
	} 

	#secondary #delivery_message > a {
		background: url(/images/dave/delivery_icon.png) no-repeat left top;
	}

	#secondary #pricepromise_message > a {
		background: url(/images/dave/price_promise_icon.png) no-repeat left top;
	}

	#secondary #guarantee_message > a {
		background: url(/images/dave/guarantee_icon.png) no-repeat left top;
	}

		dl {
			padding-bottom: 1.2em;
		}

		#delivery_message dt, #pricepromise_message dt, #guarantee_message dt {
			font-weight: bold;
		}
	
/* Secondary Ends*/

/* Footer */

	#footer .brands ul {
	  width: 100%;
	  padding-left: 0;
	}

		#footer .brands li {
		  float: left;
		  padding: 0 0.4em;
		}

	#footer .brands p {
	  padding-left: 0;
	}

		#footer .site_links a {
		  text-decoration: underline;
		  color: black;
		}

		#footer .brands a:hover {
		  text-decoration: underline;
		}

	#footer ul {
		float: left;
		padding-left: 8em;
	}

  #footer ul.first {
    padding-left: 3em;
  }
  
/*	#footer p#address {
		clear: both;
		margin-bottom: 0;
	}
*/
	ul#company_info {
		clear: both;
		float: none;
		padding: 1em 0 0 0;
	}

	#main ul.address, #lightbox_html ul.address {
	  margin: 0;
	}

	#main ul.address li, #lightbox_html ul.address li {
	  list-style-type: none;
	  margin-bottom: 0.5em;
	}

/* Help section - nested lists */

#help_menu li ul {
	margin-bottom: 1em;
	margin-left: 1em;
}

.help_articles .container {
  position: relative;
  height: 100%;
}

.help_articles .content {
  
}

.help_articles .content div {
  padding-bottom: 1.2em;
}

.help_articles .toggle {
  clear: both;
  padding: 0 0 0 30px;
  background: url(/images/button_sprite.png) no-repeat left -180px;
}

.help_articles .toggle_active {
  background: url(/images/button_sprite.png) no-repeat left -230px;
}

.help_articles h3 {
	border-top: 1px solid #B2B5AB;
	line-height: 1.8;
	/*position: relative;*/
}

.help_articles .content h3 {
	border: none;
}

.help_articles {
	border-bottom: 1px solid #B2B5AB;
}

.help_articles h3 a {
  padding: 0;
  color: #4E1A00;
}

/* End help section - nested lists */

/* Lists end */


/* Forms */

fieldset {
	border: none;
}

/* Link styles */
  
  #nav a:hover, #nav2 li a:hover, #nav2 li a:visited:hover, #promise li a:hover, #leftnav a:hover, #leftnav a:visited:hover, #rightnav a:hover, #rightnav a:visited:hover, #main a:hover, #main a:visited:hover, #shoppingbasket td a:hover, #shoppingbasket td a:visited:hover, #quotebox a:hover, #quotebox a:visited:hover, #footer a:hover, #footer a:visited:hover, #main .list .head a:hover, #main a.info:hover, #main .compatible_printers .printer_list li a:hover,#main .list .results .product a.info:hover, #carts_list .price a:hover, #carts_list .product .image a.flypage_link:hover {
  	color: #FF781F;
  }
  	
	#header a {
		color: black;
	}

	#shoppingbasket a, #main a {
		text-decoration: none;
	}

  #main .list .results .product .details a:hover {
    text-decoration: underline;
  }
  
  #main .family a {
    color: #4E1A00;
  	font-weight: 700;
  	text-decoration: none;
  }
  
	#header a:link {
		color: black;
	}

	#header a:visited {
		color: black;
	}

  #header a:hover {
    color: #FF781F;
  }
  
		#categories a {
			display:block;
			text-decoration: none;
			}

 		#categories > li > a:visited, #categories > li > a:link {
			color: white;
			line-height: 1;
			}

		#categories > li > a:hover, #categories > li.show_menu > a:link, #categories > li.show_menu > a:visited, #categories > li.current > a  {
			color: black;
			}
			
				#categories li ul li a:hover {
				  text-decoration: underline;
				}

				#categories > li > a {
				  height: 24px;
          padding: 10px 0.9em 0 0.9em;
				}
				
				#categories > li li a {
			  	cursor: pointer;
					padding: 0.5em;
				}
				
	#main h1 a, #main h2 a {
		font-weight: normal;
		text-decoration: underline;
	}
	
	#secondary dl dd em {
		font-style: normal;
		text-decoration: underline;
	}

	#delivery_message, #pricepromise_message, #guarantee_message {
		text-decoration: none;
		color: black;
	}
	
	#footer ul a {
		color: #000;
	}
	
  #help_menu h2 a {
    color: black;
    font-size: 100%;
    text-decoration: none;
  }

/* Vcard */

.adr, .tel {
	display: inline;
  float: left;
  margin-right: 2em;
  width: 46%;
}


/** Alternatice Products **/

/** Compatibles styles **/

.compatibles {
  clear: both;
	background: #ffff93;
  border: 1px solid #b1b1b1;
	color: #a62113;
	font-weight: bold;
	padding: 0.5em;
	margin: 5px 0;
	text-align: left;
	width:170px;
}

#product_main .compatibles a {
  color: black;
}

#shopping_cart .genuine {
	background: #ffff93;
	padding: 5px;
}

.compatibles a {
  font-weight: normal;
}

.compatibles p {
  line-height: 1.2;
  margin: 0 0 0.4em 0;
}

#shopping_cart .compatibles p {
  font-size: 1em;
  margin: 0;
}