/*

  NEW Basket CSS. Gotta make sure all our shop sites are compatible with this 
  before it goes live.
  
  Because we never use underscores in class or id names at Inventive Labs 
  (preferring Javascript-influenced camelCase), we can use the underscore
  character to denote namespaces.

  For this Shopping Basket module, all id and class names will be prefixed
  with 'basket_', to prevent clashes with any other elements on the page.
*/
/*

/* The drop-down basket */


#basket_ {
	width:380px;
  background: url(/static/images/basket.png) left bottom no-repeat;
  color: #fff;
  position: absolute;
  top: 0;
  right: 0;
}


#basket_ a, 
#basket_ a:hover {
  position:relative;
	font-weight:normal;
}

#basket_ a:hover {
	color:#60cae4;
}

#basket_ a:focus, 
#basket_ a:active {
  outline: none !important;
}

 
#basket_ a.basket_summary {
  color: #4d4d4d;
  font-size: 15px;
  padding: 6px 12px;  
	width:356px;
	float:right;
	text-align:right;
}
#basket_ a:hover.basket_summary {
  text-decoration: none;
  color: #4d4d4d;
}

/* The open basket */

.basket_details, 
.basket_notice {
  overflow: hidden;
  width: 100%;
}

.basket_details table {
  border-collapse: collapse;
	width:98%;
}

.basket_details td {
  vertical-align: top;
  line-height: 1.2em;
	border:0;
	font-size:140%;
  padding: 10px 2px 10px 0;
}

.basket_details td.basket_itemControls {
  width: 38px;
	margin-top:10px;
	font-size:1em;
}

.basket_details .basket_alt {

}

td.basket_itemDetails {
  border-bottom:1px solid #ffffff;  
}
td.basket_itemDetails a {
  position: relative;  
}

.basket_details td.basket_itemImage img {
  height: 32px;
  margin-left: 4px;
  margin-bottom: 6px;
	display:none;
}

.basket_details td.basket_itemDetails strong {
  display: block;
  white-space: nowrap;
}

.basket_details a.basket_itemRemoveLink {
  font-size: 10px;
  color: white;
  font-family: "Arial Narrow", sans-serif;
  text-transform: uppercase;
  position: relative;  
}
tr.basket_total {
  font-size: 1.2em;
}
.basket_checkoutLink {
  text-align: right;
  font-weight:bold;
  display:block;
  font-size: 1.3em;
  padding-right:4px;
}


/* Quantity widget */

.basket_quantifier {
  width: 32px;
  height: 16px;
  background: #E9E9E9;
  border: 1px solid #999;
}
.basket_quantifier .basket_quantity {
  text-align: right;
  padding-top: 2px;
  color: #777;
  cursor: default;
}
.basket_quantifier .basket_quantityControls {
  width: 12px;
  float: right;
  margin-left: 3px;
}
.basket_quantifier .basket_quantityUp {
  background: url(/images/shp/quantity_up.gif) #CCC no-repeat;
  width: 12px;
  height: 8px;
  float: left;
  position: relative;  
}
.basket_quantifier .basket_quantityDown {
  background: url(/images/shp/quantity_down.gif) #BBB no-repeat;
  width: 12px;
  height: 8px;
  float: left;
  position: relative;  
}

/* Notification in basket dropdown */
.basket_notice div {
  position: relative;
  padding: 10px 5px;
  margin-right: 32px;
}
.basket_notice img { /* This is the spinner */
  float: left;
  position: relative;
  margin-top: -5px;
  height: 32px;
  margin-right: 7px;
}
.basket_notice strong {
  display: block;
  white-space: nowrap;
}
.basket_empty {
  text-align:center;
  padding-top:2px;
  font-size:11px;
  margin-bottom:3px;
}
.basket_notice span.basket_addMessage {
  text-transform: uppercase;
  font-weight: bold;
  display: block;
  font-size: 11px;
  margin-bottom: 4px;
  color: #F3110B;
  height: 20px;
}

.basket_notice span.basket_errorMessage {
  text-transform: uppercase;
  color: red;
  font-size: 10px;
  font-family: "Arial Narrow", sans-serif;
  display: block;
  height: 22px;
}

.basket_notice div img {
  width:16px;
  height:16px;
  margin:0 10px 0 4px;
}

.notForSale { 
/* this needs to be name-spaced to fall in line with 
the rest - maybe basket_fillerNotForSale ? */  
}