﻿
/*========================= Styles specific to accordions ===============*/

.Accordion
{
    width: 100%;
}

.AccordionSelected
{
}


/* ======================Accordion Contents ========================*/

.AccordionContent
{
    background-color: #000000;
    border-style: solid;
    border-color: #AECF78;
    border-width: 2px;
/*    border: 0 3px 3px 3px; */
    text-align: right;
}

/* Left hand contents of the accordion */
.ContentLeft
{
/*    border: solid 1px black;  */
    width: 300px;
    height: 400;
    padding: 5px;
    float: left;
    clear: left;
    text-align: left;
}

/* Right hand contents of the accordion */
.ContentRight
{
/*    border: solid 1px Blue; */
    padding: 5px 5px 5px 5px;
    width: 100;
    float: right;
}


/* CheckBoxes in an accordion */
.AccordionContentCheckBox
{
    padding-right: 50px;
    font-family:Arial;
    font-size:small;
    clear: both;
    float: left;
    padding-top: 5px;
}

/* ComboBox labels in an accordion */
.AccordionContentComboBoxLabel
{
    font-family:Arial;
    font-size:small;
    padding-right: 5px;
/*    clear: left;
    float: left; */
}    

/* ComboBoxes in an accordion */
.AccordionContentComboBox
{
    color:Black;
}

/* RadioGroup labels in an accordion */
.AccordionContentRadioGroupLabel
{
   padding-top: 7px;
   font-family:Arial;
    font-size:small;
    padding-right: 10px;
    color: #ffffff;
    background-color: #000000;
}

/* RadioGroups in an accordion */
.AccordionContentRadioGroup
{
    font-family:Arial;
    font-size:small;
    clear: both;
    float: left;
    color: #ffffff;
    background-color: #000000;
}

/* Radio buttons in an accordion */
.AccordionContentRadioButton
{
    font-family:Arial;
    font-size:small;
    padding-right: 10px;
    padding-top: 5px;
    color: #ffffff;
    background-color: #000000;
}

.AccordionContentPromotion
{
    background-color: #E8FDC4;
    background-image: url("../Img/GreenPromotionsPanel.jpg");
    background-repeat: repeat-x;
    padding: 0 5px 0 5px;
    text-align: left;
/*    border: solid 1px blue; */
}

.PromotionsMessage
{
    padding-top: 8px;
    color: #527A1A;
    font-size: 95%;
}

.OfferMessageImage
{
    float: left;
    margin-right: 5px;
    width: 34px;
    height: 28px;
}


/* ======================Accordion Header ========================*/


 .AccordionHeader
 {
    width: auto;
    color: #507918;
    margin-top: 5px; 
    cursor: pointer;
    background-color: #aFD079;
}
 
 
 /* Collection of items in the accordion header */
.AccordionHeaderItems
{
/*     border: solid 1px GREEN; */
   height: 21px;
    padding: 4px 5px 1px 5px;
}


.ProductIcon
{
    float: left;
    height: 18px;
    margin-right: 5px;
}

/* Title of product in accordion header */
.HeaderProductTitle
{
    float: left; 
    font-weight: bold;
    margin-top: 1px;
/*    border: solid 1px BLUE; */
}

.HeaderIconPanel
{
/*   border: solid 1px RED;  */
    float: left;
    margin-left: 10px;   
    height: 18px;
    width: 150px;    
}
 .SlotIconHolder
 {
    background-image: url("../Img/Button_SlotsCentre.gif");
    background-repeat: repeat-x;
    height: 18px; 
    margin-right: 6px;
    float: left;
    text-align: center;
}
 
 .SlotIcon
 {
    padding: 0 3px 0 3px;
    color: White;
    font-size: 12px;
 }

/* e.g. Modifier icons */
.ServiceParameterIcon
{
    margin-right: 6px;
    width: 18px;
    height: 18px;
}

.AccordionChargeGroup
{
/*    border: solid 1px yellow; */ 
    float: right;
    clear: right;
   text-align: right;
   padding-top: 1px;
   height: 18px;
}

/* Charge for product in accordion header */
.AccordionCharge
{
/*   border: solid 1px white;  */
    margin-top: 1px;
}

.AccordionSpecialOfferHead
{    
/*    border: solid 1px red;  */ 
    float: left;
    width: 34px;
    height: 18px; /* can't be more than this as causes scrollbars in Safari */
}

.SpecialOfferIcon
{
/*     border: solid 1px blue;  */ 
   width: 34px;
    height: 18px; /* can't be more than this as causes scrollbars in Safari */
/*    position: relative; 
    top: -4px;
    right: -3px; */
}




