/*
 * Mamas & Papas Style Sheet
 * Description : A product_details specific stylesheet
 * It is loaded on the product_details page

 *
 * Author : Tom Llewellyn/Rob Farnell/Charles Jackson
 * Dated : 2007, last update 2010.
 *
 */

/* WUPSELL related - the new related items */
/* the container */
div#related {
    background-color:#FFFFFF;
    background-position:center bottom;
    background-repeat:repeat-x;
	margin-left:373px;
    margin-top:10px;
}
div#related h1 {
	display:none
}
/* tabs */
div#related ul.tabs { /* tab container */
	height:30px
}
div#related ul.tabs li { /* tab */
    float:left;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin-right:4px
}
div#related .tabs li a { /* link in the tab */
    display:block;
    font-size:14px;
    font-weight:bold;
    height:30px;
    line-height:30px;
    outline:none;
    padding:0;
    text-transform:uppercase;
}
div#related .tabs li a span { /* text inside tab */
    cursor:pointer;
    display:block;
    margin-left:8px;
    padding-right:8px;
    white-space:nowrap;
}
/* value added tab */

/* Much of the colour CSS has been moved into the /css/colourway/sale.css and offers.css files */

div#related ul.tabs li#tab_value_added.CODE_tab_active a {
    background-position:0 0;
}

div#related ul.tabs li#tab_value_added.CODE_tab_active a span {
    background-position:right 0;
}
div#related ul.tabs li#tab_value_added a:hover {
    text-decoration:none;
}
div#related ul.tabs li#tab_value_added.CODE_tab_active a {
    color: #FFFFFF;
}

/* related items tab */
div#related ul.tabs li#tab_related_items a{
    background:url(/images/backgrounds/relateditems-tab.jpg) 0 0 no-repeat;
    color:#afafaf
}
div#related ul.tabs li#tab_related_items a span{
  background:url(/images/backgrounds/relateditems-tab.jpg) right 0 no-repeat;
}
div#related ul.tabs li#tab_related_items.CODE_tab_active a { /* the active tab */
    background-position:0 -30px;
    color:#797979;
}
div#related ul.tabs li#tab_related_items.CODE_tab_active a span { /* the active tab */
    background-position:right -30px;
    color:#797979; /*#b9b309;*/
}
div#related ul.tabs li#tab_related_items a:hover {
    color:#797979;/*#ee8610;*/
    text-decoration:none;
}
div#related ul.tabs li#tab_related_items.CODE_tab_active a {
    color: #797979;
}
div#related ul.tabs li#tab_related_items.CODE_tab_active a:hover {
/*    color:#524E00*/
}
div#related div#related_items {
    border:1px solid #E4E4E4;
}
/* alternate items tab */
div#related ul.tabs li#tab_alternate_items a{
    background:url(/images/backgrounds/relateditems-tab.jpg) 0 0 no-repeat;
    color:#afafaf
}
div#related ul.tabs li#tab_alternate_items a span{
  background:url(/images/backgrounds/relateditems-tab.jpg) right 0 no-repeat;
}
div#related ul.tabs li#tab_alternate_items.CODE_tab_active a { /* the active tab */
    background-position:0 -30px;
    color:#797979;
}
div#related ul.tabs li#tab_alternate_items.CODE_tab_active a span { /* the active tab */
    background-position:right -30px;
    color:#797979; /*#696300;*/
}
div#related ul.tabs li#tab_alternate_items a:hover {
    color:#797979;/*#ee8610;*/
    text-decoration:none;
}
div#related ul.tabs li#tab_alternate_items.CODE_tab_active a {
    color: #797979;
}
div#related ul.tabs li#tab_alternate_items.CODE_tab_active a:hover {
/*    color:#524E00*/
}
div#related div#alternate_items {
    border:1px solid #E4E4E4;
}
/* the promotions concertina inside the tab */
div#related dl.relatedPromHeader{
}
div#related dl.relatedPromHeader dt.relatedPromHeader{ /* clickable header in the outer concertina */
    border-bottom:1px solid #fff;
    cursor:pointer;
}
div#related dl.relatedPromHeader dt.CODE_concertina_active {
    cursor:default;
    border-bottom-style:none;
}
div#related dl.relatedPromHeader dt.relatedPromHeader a {
    font-size:14px;
    margin-right:10px;
    padding:8px;
    display:block;
    background: url(/images/buttons/arrow_white_trans.gif) no-repeat center right;    /* state indicator */
    outline:none
}
div#related dl.relatedPromHeader dt.relatedPromHeader a:hover {
    color:#fff;
    text-decoration: none;
}
div#related dl.relatedPromHeader dt.CODE_concertina_active a {
    cursor:default;
    background-image:url(/images/buttons/arrow_white_trans_down.gif);
    border-bottom-style:none;
}
div#related dl.relatedPromHeader dt.CODE_concertina_active a:hover {
    text-decoration:none;
}
div#related dl.relatedPromHeader dd.relatedPromHeader { /* body of each item in the outer concertina */
    background-color:#fafafa;
	display:inline-block;
	padding:10px 0 7px 0;
}
div#related dl.relatedPromHeader dd.relatedPromHeader div.relatedPromHeaderDesc { /* body of each item in the outer concertina */
    width:391px;
    display:inline-block;
    padding:7px;
    margin:7px 7px 0 7px;
    background-color:#f0f0f0;
}
div#related dl.relatedPromHeader dd.relatedPromHeader div.relatedPromHeaderDesc p { /* body of each item in the outer concertina */
    margin:0;
}
div#related dl.relatedPromHeader dd.relatedPromHeader div.relatedPromHeaderDesc ins.price {
    font-size:1.5em;
    vertical-align:middle
}

/* concertina of items within an offer */
div#related dl.relatedPromTrigger {
    color:black;
    background-color:#fafafa;
}

div#related dl.relatedPromTrigger dt.relatedPromTrigger { /* clickable header of inner concertina */
    /* WARNING:
     setting a padding/width that makes this wider than the space available in the container
     will kill IE 6 as it goes into an infinite loop trying to find a layout that works
    */
    color:white;
    font-size:1.0em;
    margin-top:2px;
    width: 350px;
	overflow:hidden;
    background-color:#6e6e71;
    margin: 0 auto 0 auto;
    border-bottom: 7px solid #fafafa;
}
div#related dl.relatedPromTrigger dt.CODE_concertina_active { /* as above, for the active one */
}
div#related dl.relatedPromTrigger dt.relatedPromTrigger a span { /* the link in the concertina header */
    display:block;
    padding:8px;
    color:white;
}

div#related dl.relatedPromTrigger dt.relatedPromTrigger a span { /* the link in the concertina header */
    display: block;
    width: 325px;
    background:url(/images/buttons/arrow_white_trans.gif) no-repeat center right;
    color:white;
}
div#related dl.relatedPromTrigger dt.CODE_concertina_active a { /* the link in the active concertina header */
    color:white;
    border-bottom-style:none;
}

div#related dl.relatedPromTrigger dt.CODE_concertina_active a span { /* the link in the active concertina header */
    display: block;
    width: 325px;
    background-image:url(/images/buttons/arrow_white_trans_down.gif);
}
div#related dl.relatedPromTrigger dt.CODE_concertina_active a:hover {
    text-decoration:none;
    color:white;
}
div#related dl.relatedPromTrigger dd.relatedPromTrigger { /* body of inner concertina */
    color:black;
    display:inline-block;
    width: 419px;
    padding-bottom:0;
	/*position:relative*/
}
div#related div#value_added dl.relatedPromTrigger dd.CODE_first {/* supress plus sign on the first value added item */
    background-color:transparent !important;
    background-image:none !important;
}
div#related div#value_added dl.relatedPromTrigger dd.relatedPromTrigger { /* plus signs between value added items*/
    background:transparent url(/images/buttons/plus.gif) no-repeat 52px 5px;
    padding-top:30px;
}
div#related div#value_added dl.relatedPromTrigger dd.CODE_first {
	padding-top:0
}
div#related div#related_items dl.relatedPromHeader dd.relatedPromHeader {/* dotted lines between related items */
    border-top:1px dashed #CCCCCC;
}
div#related div#related_items dl.relatedPromHeader dd.CODE_first{
    border-top:none;
}
div#related div#related_items dl.relatedPromTrigger {
    /*margin-top:10px;*/
}

div#related div#alternate_items dl.relatedPromHeader dd.relatedPromHeader {/* dotted lines between alternate items */
    border-top:1px dashed #CCCCCC;
}
div#related div#alternate_items dl.relatedPromHeader dd.CODE_first{
    border-top:none;
}
div#related div#alternate_items dl.relatedPromTrigger {
    /*margin-top:10px;*/
}

div#related ul.CODE_lazy_susan div.CODE_lazy_susan_control { /* placeholder for the lazy susan buttons (the buttons are added if required by WUPSELL_related.js) */
    float:left;
    margin-left:5px;
    margin-right:5px;
    width:14px;                /* must occupy space for consistent display when there is only one item, should match the image width */
    display: inline;
    font-weight:bolder;
    margin-top:40px;
}
div#related ul.CODE_lazy_susan div.CODE_lazy_susan_control input { /* the lazy susan arrows */
    cursor:pointer;
}
div#related ul.CODE_lazy_susan { /* lazy susan list */
    float:left;
    display:inline;
}
div#related ul.CODE_lazy_susan li { /* lazy susan list item */
    float:left;
    display:inline;
}
div#related .imageInfo { /* product block container */
    float:left;
    display:block;
    width:409px;
    /*min-height:103px;*/
}
div#related .controls { /* add to bag for related items */
    /*width:386px;*/
    /*width:362px;*/
	bottom:8px;
	position:absolute;
	right:6px
}
div#related .imageInfo .image_border_related a { /* thumbnail image of the product */
    float:left;
    display: inline;
    padding:1px;
    border:#eaeaea solid 1px; /* pale grey */
}
div#related .imageInfo .image_border_related a:hover{
    border:#ebe6d9 solid 1px; /* pale grey */
}
div#related div#value_added_promotions .imageInfo {
}
div#related div#value_added_promotions .imageInfo .first {
    background:transparent url(/images/buttons/plus.gif) no-repeat 0px 40px;
    padding-top:30px;
}

div#related .imageInfo h4.productName { /* the web description of the product */
    font-size:1.3em;
    margin-top:5px;
	text-align:right;
}
div#related .imageInfo h4.productName a { /* the web description of the product */
    color: #666666;
}
div#related .imageInfo .productOptions { /* the container for the product options */
    float:left;
    margin-top: 10px;
    width:170px;
    min-height:54px;
}
div#related .imageInfo .productOptions .productOption { /* the product option control containers */
    float:left;
    margin-bottom:2px;
    width:140px;
}
div#related .imageInfo .productOptions .productOption label{
    padding:5px;
    float:left;
}
div#related .imageInfo .productOptions .productOption select,
div#related .imageInfo .productOptions .productOption span{    /* the product option controls */
    float:right;
    font-size:1em;
	padding-left:2px;
    width:90px;
}
div#related .imageInfo .productOptions .productOption span{    /* the product option controls */
    padding-top:5px;
    padding-bottom:5px;
}
div#related div.price{ /* the price block */
    float:right;
}

div#related div.imageInfo div.price{ /* the price block */
    width:80px;
    margin-top:15px;
    min-height:54px;
	text-align:right;
}

/* del/ins/span used for the actual price number and £ */
div#related del.price,
div#related ins.price,
div#related span.price{
    text-align:right;
    font-size:1.2em;
    font-weight:bold;
}
/* strikeout prices */
div#related del.price{
}
/* normal prices */
div#related span.price{
}
/* offer prices */
div#related ins.price{
    text-decoration:none;
}

div#related input.button{ /* the add to bag button */
    float:right;
    font-size:1em;
}

div#related .packageadd { /* added padding for alignment with text */
    margin-top:7px;
    float:right;
}

.btn_details {
    width:auto;
}

/* 1+1 display (2up - player 2 - what was I thinking!*/
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dl.relatedPromTrigger { /* the rest */
}

div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger { /* the rest */
    width:122px;
    padding-left:20px;
    padding-right:5px;
	padding-top:0;
    float:left;
    background-position:0 40px;
}
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.CODE_first { /* first one */
    margin-left:40px;
    background-image:none;
}
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger div.imageInfo {
    width:124px;
    min-height:142px;
}
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger div.imageInfo h4.productName{
    text-align:center;
    padding-top:5px;
    font-size:1.2em;
}
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger div.imageInfo div.productOptions,
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger div.imageInfo div.price,
div#related div#value_added dl.relatedPromHeader dd.CODE_2up dd.relatedPromTrigger div.imageInfo div.controls{
    display:none;
}

/* item with add to bag button */
div#related dl.relatedPromHeader dd.addToBagEnabled {
	padding-bottom:30px;
	position:relative
}

/* end of WUPSELL */