/* Forms Section - to be included properly */

/* For customers to enter details */

/*.customer input { Removed for now as doesn't seem to be necessary. May just be TD from old stylesheet
  font-size: 1.1em;
}
*/

.hidden {
	display: none;
}

#header .wrap {
  padding-top: 0.3em;
}

#find_carts_widget legend {
	display: none;
}

#main .searchform { /*Lame! I put this in specifically for the error page. It doesn't feel like a good way to do it, but I'm putting it in for now.*/
	float: none;
	font-size: 76%;
	width: 26em;
}

.customer ol {
  margin: 0 auto;
/*  width: 760px; I think I'm setting width too many times within this form, so I'm turning this off here, in the hope that it will then just take the appropriate width within the form*/

}

.checkout h2 {
  clear:both;
  border-bottom: 1px solid black;
  margin-bottom: 1em;
}

form.customer li {
  clear: both;
  display: inline;
  float: left;
  line-height: 1.2;
  margin: 0;
/*  padding: 0.5em 0; This is tricky, as there's a bit of a problem nesting multiple li and fieldset elements, as the padding stacks up a bit messily at the bottom of the form, leaving irregular gaps at where the submit button is placed. I've changed it for now to have padding just on the top, so spacing in general is not very different, but there might be a bit more at the top of some. Also needs browser checking.*/
	padding: 1em 0 0;
  width: 100%;
  position: relative;
}

.customer label, .customer .label, .stored_cards .address label {
  float: left;
  font-weight: bold;
  margin-right: 1em;
  width: 11.6em;
  text-align: right;
}

.checkout form ol.payment_method li {
  width: auto;
  clear: none;
  padding-top: 5px;
}

.checkout form ol.payment_method li.cards {
  margin: 0;
  padding: 0;
  float: right;
}

.checkout form ol.payment_method li.cards span {
  float: left;
  padding: 5px 15px 0 0;
}

.checkout form ol.payment_method li.cards img {
  float: left;
}

.customer label, .stored_cards .address label {
  margin: 0.4em 1em 0 0;
}

.payment_method label {
  text-align: left;
  margin-top: 2px;
}

.customer label.coupon {
  margin-top: 0;
}

#main .customer li.exclusive { /* TD - name is wrong, meant originally to apply to options where choices were mutually exclusive, now just using it as positional style for anything in a form that isn't a label and text input combo */
	clear: both;
	margin-bottom: 0;
 	padding: 1em 0 0 12.6em;
	width: 33em;

}

#main .customer p.exclusive {
  clear: both;
  margin-bottom: 0;
  padding: 1em 0 1em 12.6em;
	width: 31em;
}

#main .checkout .customer p.exclusive { /* TD - name is wrong, meant originally to apply to options where choices were mutually exclusive, now just using it as positional style for anything in a form that isn't a label and text input combo */
  padding: 0 0 1em 12.6em;
}

#main .checkout .longer_delivery {
  padding: 1em 0;
  font-weight: 700;
  color: red;
  font-size: 110%;
}

#main .checkout a.email_preferences {
  color: #898989;
  font-size: 0.9em;
  text-decoration: underline;
}

#main .checkout .hide {
  display: none;
}

.read_only li {
  padding: 0.3em 0;
}

.read_only .submit {
  font-size: 1em;
}

.customer fieldset {
  margin: 0 0 1em 0;
}

.customer fieldset fieldset {
	margin: 0;
}


#main p.submit {
  text-align: right;
}  

#main p.submit img {
  margin: 0;
}

#main p.option {
  font-weight: bold;
  margin: 0.8em 0 0.8em 4em;
  float: left;
}

#main div.submit h3 {
  background: none;
  border: none;
  padding: 0;
  font-size: 1.4em;
  margin-top: 0.2em;
}

#main div.submit h3, #main div.submit p {
  width: 60%;
  float: left;
}

#main div.submit img {
  float: right;
}

#main p.submit {
  margin: 0 0 1em 12.6em;
}
         
#main .customer li.exclusive input {
  display: block;
  line-height: 1.4;
  margin: 0.6em 0 0 0;
  width: auto;
}

#stored_cards .customer li.exclusive input, #credit_card .stored_cards li.exclusive input {
  display: inline;
}

#main .customer li.exclusive label {
  display: block;
  float: none;
  font-weight: 400;
  line-height: 1.4;
  margin: -1.3em 0 0 25px;
  text-align: left;
  width: 28em;
}

.customer input {
  width: 20em;
}

.customer input.manual_search {
  width: auto;
}

.customer .postcode_search select {
  width: 27em;
}

.customer #postcode_dropdown_menu {
  margin-left: 8.3em;  
}

.customer .number, .customer .postcode {
  width: 6em;
}

.customer .shortnumber {
  width: 3em;
}

.customer input.submit {
  margin-left: 13.3em;
  width: auto;
}

#addresses {
  float: left;
  margin-top: 2em;
  width: 760px;
}

#addresses .billing, #addresses .delivery {
  float: left;
  margin-right: 2em;
  width: 46%;
}

#addresses .billing legend span, #addresses .delivery legend span {
  width: 320px;
}

#credit_card .cards label {
  font-weight: normal;
}

.postcode_search legend {
  background: transparent;
  font-weight: bold;
  border: none
}

.postcode_search input.submit {
  margin: 0;
}

#placeorder { 
  font-size: 1.6em;
  width: 10em;
}

#main .accessible {
  text-align: left;
  text-indent: -9999px;
}

#finalize form.checkout {
  float: left;
  margin-top: 2em;
}

/* Validation errors */

.help {
  background: url(/images/help_icon.png) no-repeat left center;
  padding: 4px 0px 2px 20px;
}

.error {
  display: inline;
  background: url("/images/cs_sprite.png") no-repeat scroll -238px -9px transparent;
  color: #ffffff;
  font-weight: 400;
  padding: 0 0 0 20px;
  letter-spacing: 0.1em;   
  margin-left: 0.5em;
  position: absolute;
}

.error div {
  background:none repeat scroll 0 0 #FF0000;
  padding: 5px 10px;
}

.no_arrow {
  background-image: none;
  margin:0 0 10px;
  padding-left:10px;
}

.error_no_arrow {
  background: #ff0000;
  color: white;
  margin:0 0 10px;
  padding: 5px 10px;
  letter-spacing: 0.1em;
  font-weight: 400;
  clear: both;
}

#main .error_no_arrow a {
  color: white;
  text-decoration: underline;
}

#main .error_no_arrow a:hover {
  color: white;
  text-decoration: none;
}

.postcode_error {
  background: #ff0000;
  color: #ffffff;
  padding: 0.3em 0.5em;
  font-size: 1.2em;
  margin-top: 1em;
  display: block;
}

.success {
  background: url("/images/cs_sprite.png") no-repeat scroll -238px -102px transparent;
}

.success div {
  background: #009210;
}

.basket_error_box {
  background: #F6DADF;
  border: 1px solid red;
  padding: 1em;
}

#find_carts_widget .search_error {
	color: red;
	background: #FFEFEF url(/images/icon_alert.gif) no-repeat 1% center;
	padding: 4px 4px 4px 22px;
	width: 18em;
	display: block;
	position: relative;
	margin-left: 1.6em;
	margin-top: 0.1em;
}

span.hide_loader {
  display: none;
}

#printer_model {
  width: 20em;
  margin-top: 0.4em;
}

.business_account label {
  width: 20em;
}

.business_account input {
  width: 18em;
}

#main .business_account li.exclusive {
 	padding: 0 0 0 22em;
}

#main label.not_required {
  font-weight: normal;
}

form#find_carts_widget div.search_box {
  padding-left: 4em;
}

form#find_carts_widget div.search_box h3 {
  color: black;
  font-weight: normal;
}

form#find_carts_widget div.search_box input {
  width: 34em;
}

form#find_carts_widget div.search_box p {
  margin-top: 0.5em;
}

/** Stored cards **/

.stored_cards li {
  background-color: #f1f1f1;
  margin-bottom: 10px;
  padding: 10px;
  float: left;
  width: 97%;
}

.stored_cards li table {
  width: 100%;
}

.stored_cards li table td {
  vertical-align: middle;
}

.stored_cards li table td.card_type {
  width: 62px;
}

.stored_cards li table td.card_details {
  color: #595959;
  font-size: 1.2em;
}

.stored_cards li table td.card_details .name {
  font-weight: bold;
  color: #3e3e3e;
  margin-right: 5px;
}

.stored_cards li table td.card_details .number {
  font-style: italic;
  font-size: 0.9em;
  margin-right: 5px;
}

.stored_cards li .expired {
  color: red;
  font-weight: 700;
}

.stored_cards li table td.edit {
  text-align: right;
}

.stored_cards li table td.edit a.edit {
  border-right:1px solid black;
  padding-right:5px;
}

.stored_cards li .address {
  border-top: 1px solid #dbdbdb;
  margin-top: 10px;
  padding: 10px 0;
  width: 100%;
  float: left;
  position: relative;
}

.stored_cards li .address p {
  margin: 0px;
  color: #404040;
}

.stored_cards li .address p span {
  font-weight: bold;
  margin-right: 5px;
  color: #727272;
}

#main .stored_cards a.cancel {
  color: #0000fe;
  text-decoration: underline;
}

#new_stored_card.closed, #card_request_loader.closed {
  display: none;
}

#stored_cards {
  padding-bottom:20px;
}

#credit_card .stored_cards span.number {
  font-style:italic;
  color:#595959;
  font-weight:normal;
}

#credit_card .stored_cards .address {
  clear: left;
  font-weight: normal;
  width: 100%;
}

#credit_card .stored_cards span, #credit_card .stored_cards img {
  float: left;
  margin-right: 5px;
  width: auto;
}

#credit_card .stored_cards span.error {
  float: none;
}

#credit_card .stored_cards img {
  margin: 0 10px;
}

div#credit_card {
  margin: 20px 0;
  float: left;
  width: 760px;
}

#credit_card .stored_cards {
  float: left;
  width: 100%;
}

#credit_card .stored_cards .details {
  float: left;
  font-size: 100%;
  width: 90%
}

#credit_card .stored_cards .address input {
  margin: 0;
  width: 20em;
  float: none;
}

#credit_card .stored_cards .address li {
  padding-top: 0;
  padding-bottom: 0;
}
#credit_card .stored_cards .address li.first {
  padding-top: 10px;
}

#credit_card .stored_cards li .edit {
  margin-left: 20px;
  margin-top: 10px;
  border: none;
}

#credit_card .stored_cards input {
  margin: 20px 15px 0 15px;
  float: left;
  width: auto;
}

#credit_card .stored_cards .new_card input {
  margin-top: 0;
}

#credit_card .stored_cards .new_card label {
  width: auto;
}

#credit_card .stored_cards .new_card label.different_card {
  margin: 0;
} 

#credit_card .stored_cards li {
  margin-bottom:10px;
  padding:10px 0;
  background: none;
}

#credit_card .stored_cards li.selected {
  background-color: #f1f1f1;
}

#new_stored_card li.exclusive {
  padding-left: 0;
}

.stored_cards .address .card_error {
  background-image: none;
  float:left;
  padding:4px 10px;
  position: static;
}

li.store_my_card label, #credit_card #new_stored_card .store_my_card label {
  float: left;
  font-weight:400;
  line-height:1.4;
  margin:0;
  text-align:left;
  width:28em;
}

#credit_card #new_stored_card .store_my_card label {
  margin-top: 0;
}

li.store_my_card input {
  float:left;
  margin:0 10px 0 0;
  width:auto;
}

#new_stored_card {
  float:left;
  margin:0 0 10px 15px;
  width:90%;
}

#stored_cards_list #new_stored_card {
  margin-top:10px;
  width:96%;
}

#credit_card #new_stored_card li {
  padding: 1em 0 0 0;
  margin: 0;
}

#credit_card #new_stored_card label {
  width: 11.6em;
  text-align: right;
}

#credit_card #new_stored_card input {
  margin: 0;
  float: none;
}

#credit_card #new_stored_card .store_my_card input {
  float: left;
  margin: 0 10px 0 0;
}

#card_request_loader {
  background:none repeat scroll 0 0 #000000;
  height:100%;
  position:absolute;
  text-align:center;
  width:100%;
  left: 0;
  top: 0;
}

#card_request_loader img, #credit_card #card_request_loader img {
  margin-top: 150px;
  float: none;
}

#coupon {
  clear: both;
  margin-top: 15px;
  float: left;
  width: 100%;
}

#coupon input.submit {
  margin-left: 0;
}

.reset_password p {
  margin: 0 0 20px 0;
}

.reset_password label {
  margin-top: 0;
}

.reset_password input.submit {
  width: auto;
  margin-left: 10px;
}

/** Genuine Customer Comments **/

.grey_rounded_border {
  border: 1px solid #999;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

.customer_comments {
  clear: both;
  float: left;
  width: 902px;
  height: 202px;
  padding: 10px;
  margin: 0 0 30px 3px;
  background: url(/images/testimonials_bg.png) no-repeat 0 0;
}

#body .customer_comments h2 {
  margin-top: 12px;
  padding-top: 0;
  padding-left: 35px;
  font-size: 1.2em;
}

.customer_comments ul {
  clear: left;
  float: left;
  margin: 0;
  padding: 0;
}

.customer_comments li {
  float: left;
  width: 250px;
  padding: 0 0 0 35px;
}

.customer_comments li.extra {
  padding-right: 20px;
}

.customer_comments .name {
  color: #999;
  margin-top: 10px;
}

#body h3 {
  color: black;
  margin-bottom: 10px;
}

#body h2 {
  padding-top: 35px;
}

#body .testimonials li {
  margin-bottom: 10px;
}

.testimonials h3.what_you_say {
  margin-top: 30px;
}

.testimonials li .name {
  color: #999;
}

.testimonials ul.no_list_style li {
  margin-left: 10px;
  width: 700px;
}

/** Blog Posts **/

.blog_posts {
  width: 900px;
  padding: 10px;
  margin: 0 0 50px 3px;
  border: 1px solid #c0c0c0;
  clear: both;
  float: left;
}

.blog_posts .post {
  padding: 5px 0 0 10px;
}

.blog_posts .image {
  float: left;
  width: 120px;
}

.blog_posts .details {
  float: left;
  width: 750px;
}

.blog_posts .details .head a {
  font-size: 1.2em;
  font-weight: bold;
  color: #0000ef;
}

.blog_posts .details .head .posted {
  color: #999;
  margin: 2px 0 15px 0;
}

/** Ink / Toner cartridge text + links **/

.cartridges {
  clear: both;
  float: left;
  width: 100%;
  margin-top: 50px;
}

#body .cartridges h2 {
  padding-top: 0;
}

.cartridges .text {
  width: 500px;
  float: left;
}
  
  .cartridges .text h2 {
    border-bottom: 1px solid #999;
    font-size: 1.4em;
  }
  
.cartridges .products {
  width: 360px;
  float: right;
  margin: 0 20px 0 0;
  padding: 10px;
}

  .cartridges .products h2 { 
    padding: 0;
    color: #999;
    font-size: 1.2em;
  }
  
  .cartridges .products ul {
    margin-bottom: 10px;
  }
  
  #main .cartridges .products li {
    margin-top: 20px;
    height: 155px;
  }
  
  .cartridges .products a {
    width: 105px;
  }

#body h2 {
  clear: both;
}