/* BASKET CONTROL CSS STYLES */

#divBasketHolder
{
    /* this is the holding div for the whole basket control */
    float: left;
    width: 960px; 
}

#divEmptyBasket{height: 400px;}
#divEmptyBasket h2{margin: 0; padding: 0 0 5px 0; color: #FF9D0F; font-size: 22pt;}
#divEmptyBasket h3{color: #fff; font-size: 12pt; line-height: 14pt; margin: 0 0 15px 0;}
#divEmptyBasket p{margin: 0; padding: 0; color: #fff; line-height: 22pt;}
#divEmptyBasket p a{color: #FF9D0F;}
#divEmptyBasket p a:hover{padding: 0 0 1px 0; border-bottom: solid 1px #FF9D0F;}

#divBasketContents
{
    /* this is the container div for the contents of the basket */
    width: 717px;
    float: left;
    padding: 0 12px 0 0;
}
#divBasketContents h2{margin: 0; padding: 0 0 5px 0; color: #FF9D0F; font-size: 22pt;}
#divBasketContents h3{color: #fff; font-size: 12pt; line-height: 14pt; margin: 0 0 15px 0;}

/* basket error content */
#divBasketContents #divBasketError{float: left; width: 686px; padding: 10px; margin: 0 0 10px 0; background-color: #FBF7AA; color: #A27D4B; border: solid 5px #F9E98E;}
#divBasketContents #divBasketError p{margin: 0; padding: 0; font-size: 12pt;}

#divBasketSideContent
{
    /* this is the container div for the side content - houses the promo code entry and related basket products */
    float: left;
    width: 231px;
}    

#divPromoCode
{
    /* this is the promo code div, lives inside the SideContent div */
    float: left;
    width: 207px;
	height: 130px;
    background: url(../images/promo-box.png) top left no-repeat;
    padding: 10px 12px 10px 12px;    
}

/* promo code styles */
#divPromoCode h3{margin: 0; padding: 5px 0 10px 0; font-size: 14pt; color: #fff;;}
#divPromoCode p{margin: 0; padding: 0 0 5px 0; color: #fff; font-size: 10pt; line-height: 12pt;}
#divPromoCode dl{margin: 0; padding: 0;}
#divPromoCode dt{margin: 0; padding: 0; float: left; font-weight: normal; width: 40px; color: #fff; font-size: 10pt; line-height: 20pt;}
#divPromoCode dd{margin: 0; padding: 0; float: left; font-size: 10pt; line-height: 20pt;}
#divPromoCode dd input{width: 70px;}
#divPromoCode dd a{color: #fff; text-decoration: none; margin: 0 0 0 5px;}
#divPromoCode dd a:hover{border-bottom: solid 1px #fff; padding: 0 0 1px 0;}
#divPromoCode .clsPromoCodeInput{text-transform: uppercase; width:100px;}

/* basket buttons */
#divCheckoutButtons{float: left; margin: 10px 0 0 0;}
#divCheckoutButtons a.clsAddToBasket{text-align: center; display: block; width: 231px; height: 51px; line-height: 51px; background-image: url(../images/add-button-wide.png); font-size: 12pt; color: #000; text-decoration: none; margin: 10px 0 0 0;}
#divCheckoutButtons a.clsAddToBasket:hover{background-position: 0 -51px; color: #ff9d0f;}
#divCheckoutButtons a.clsContinueShopping{background: url(../images/continue-wide.png) top left no-repeat;}
#divCheckoutButtons a.clsContinueShopping{text-align: center; display: block; width: 231px; height: 51px; line-height: 51px; font-size: 12pt; color: #fff; text-decoration: none;}
#divCheckoutButtons a.clsContinueShopping:hover{background-position: 0 -51px; color: #ff9d0f;}

/* basket items area */
#divBasketItems{padding: 0 0 10px 0;}

/* basket: product title header area */
.clsBasketProductTitle-Header{border-bottom: 1px solid #fff; float: left; margin: 0 0 15px 0; padding: 0 0 2px 0; width: 345px; color: #fff; line-height: 12pt; font-size: 10pt;}
.clsBasketProductQty-Header{border-bottom: 1px solid #fff; float: left; margin: 0 0 15px 0; padding: 0 0 2px 0; width: 45px; color: #fff; font-size: 10pt; line-height: 12pt;}
.clsBasketProductPrice-Header{border-bottom: 1px solid #fff; float: left; margin: 0 0 15px 0; padding: 0 0 2px 0; width: 70px; color: #fff; font-size: 10pt; text-align: right; line-height: 12pt;}
.clsBasketProductRemove-Header{border-bottom: 1px solid #fff; float: left; margin: 0 0 15px 0; padding: 0 0 2px 0; width: 140px; color: #fff; text-align: right; line-height: 12pt;}

/* basket: product title area */
.clsBasketProductTitle{float: left; width: 345px; color: #a5a5a5; line-height: 22pt; font-size: 10pt;}
.clsBasketProductTitle a{color: #ff9d0f;}
.clsBasketProductTitle a:hover{padding: 0 0 1px 0; border-bottom: solid 1px #ff9d0f;}
.clsBasketProductTitle dl{margin: 0 0 5px 0; padding: 0;}
.clsBasketProductTitle dt{float: left; font-size: 10pt; line-height: 12px; margin: 0 5px 0 0; padding: 0; color: #a5a5a5;}
.clsBasketProductTitle dd{float: left; font-size: 10pt; line-height: 12px; margin: 0 5px 0 0; padding: 0; color: #a5a5a5;}

.clsBasketProductQty{float: left; width: 45px; font-size: 10pt; color: #fff; line-height: 22px;}
.clsBasketProductQty input{width: 30px;}
.clsBasketProductPrice{float: left; width: 70px; font-size: 10pt; color: #fff; text-align: right; line-height: 22pt;}
.clsBasketProductRemove{float: left; width: 140px; text-align: right;}
.clsBasketProductRemove ul{margin: 6px 0 0 0; padding: 0;}
.clsBasketProductRemove ul li{display: inline; margin: 0; padding: 0 0 0 10px; list-style: none;} 
.clsBasketProductRemove ul li a{font-size: 10pt;}
.clsBasketProductRemove ul li a.clsDelete{color: #a5a5a5;}
.clsBasketProductRemove ul li a.clsUpdate{color: #a5a5a5;}
.clsBasketProductRemove ul li a.clsDelete:hover{color: #cd1e25;}
.clsBasketProductRemove ul li a.clsUpdate:hover{color: #00C520;}
.clsBasketDivide{clear: both; margin: 0; padding: 0;}

/* basket: sub total area */
#divBasketSubTotal{clear: both; margin: 0; padding: 0;}
.clsBasketSubTotalTitle{background-color: #ff9d0f; float: left; width: 415px; color: #000; line-height: 24px; font-size: 12pt; margin: 0; padding: 5px 0 5px 5px;}
.clsBasketSubTotalPrice{background-color: #ff9d0f; float: left; width: 110px; font-size: 12pt; color: #000; text-align: right; line-height: 24px; margin: 0; padding: 5px 140px 5px 0;}
#divBasketContents p{margin: 12px 0 0 0; color: #a5a5a5; font-size: 10pt;}

#divDeliveryChargeInformation
{
    /* this is the delivery charge information div, lives inside the SideContent div */
    float: left;
    width: 670px;
    margin: 15px 0 0 0;   
}

#divDeliveryChargeInformation p{margin: 0; padding: 0 0 10px 0; color: #a5a5a5; font-size: 10pt; line-height: 12pt;}
#divDeliveryChargeInformation a{color: #ff9d0f;}
#divDeliveryChargeInformation a:hover{padding: 0 0 1px 0; border-bottom: solid 1px #ff9d0f;}

/*basket: related products */
#divBasketRelatedProducts{float: left; width: 640px; margin: 10px 0 0 0; background: #222325 url(../images/product-detail-related-back.gif) repeat-x; padding: 15px 15px 10px 15px; }
#divBasketRelatedProducts h3{font-size: 15pt; color: #ff9d0f; margin: 0 0 10px 0; font-weight: normal;}
#divBasketRelatedProducts .clsRelatedThumbs{float: left; width: 930px; margin: 10px 0 5px 0;}
#divBasketRelatedProducts .clsRelatedThumbs li{float: left; display: inline; width: 191px; margin: 0 1px 0 0; padding: 0;}
#divBasketRelatedProducts .clsRelatedThumbs li a{display: block; position: relative; width: 191px; height: 230px;}
#divBasketRelatedProducts .clsRelatedThumbs li a:hover{background-color: #595959;}
#divBasketRelatedProducts .clsRelatedThumbs li a img{position: absolute; top: 0; left: 0; height: 220px; width: 191px;}
#divBasketRelatedProducts .clsRelatedThumbs li a span.clsProductTitle{float: left; color: #fff; margin: 212px 0 0 0; padding: 5px 5px 0 5px; font-size: 10pt; line-height: 12pt; width: 181px;}
#divBasketRelatedProducts .clsRelatedThumbs li a span.clsProductPrice{float: left; color: #ff9d0f; margin: 0; padding: 0 5px 5px 5px; font-size: 10pt; line-height: 12pt; width: 181px;}
#divBasketRelatedProducts .clsRelatedThumbs li a span.clsProductPrice span.clsProductWasPrice{color: #595959;}
#divBasketRelatedProducts .clsRelatedThumbs li a:hover span.clsProductTitle{background-color: #595959;}
#divBasketRelatedProducts .clsRelatedThumbs li a:hover span.clsProductPrice{background-color: #595959;}
#divBasketRelatedProducts .clsRelatedThumbs li a:hover span.clsProductPrice span.clsProductWasPrice{color: #2c2c2c;}