/* overrides */

.ultimenu--main .ultimenu__link, .ultimenu .ultimenu__ajax {
    padding: 0.5em 1em;
}

/* mobile-first */

/* home grid */

.justify-center.grid {
    text-align: center;
    -moz-text-align-last: center;
    text-align-last: center;
}
.container-full .grid, .container .grid {
    margin-right: -16px;
    margin-left: -16px;
}
.related-content {
    margin-bottom: 16px;
}
[class^=col-] {
    box-sizing: border-box;
    letter-spacing: normal;
    word-spacing: normal;
    white-space: normal;
    position: relative;
    width: 100%;
    vertical-align: top;
    padding: 16px;
    display: inline-block;
    zoom: 1;
}
.related-content__entry {
    position: relative;
}
#map *, .container, [class*=col-] {
    margin-top: 0;
}
.col-24 {
    width: 100%;
}

.related-content__image {
    width: 100%;
    /*margin-bottom: 2em;*/
}

/* new homepage */

.homepagegrids{
    max-width: 930px !important;
}

.hero--homepage {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.hero__text-wrapper {
    padding: 32px;
    color: #fff;
    font-weight: 700;
    background-color: #4d036e; /* sands 2025 purple */
}

.hero__img-and-cta {
    width: 100%;
    height: 400px;
    margin-top: 0;
    position: relative;
}

.hero__img-and-cta, .hero--image__wrapper {
    background-image: url('../images/mast.jpg');
    background-size: cover;
    background-position: 100% 80%;
    margin-bottom: 0;
}

.related-content__title {
    font-size: 20px;
    background-color: #4d036e; /* sands 2025 purple */
    border-radius: 22px;
    color: #fff;
    padding: 16px;
    width: 75%;
    position: absolute;
    top: 40px;
    left: 13%;
}
.u-text-center {
    text-align: center;
    -moz-text-align-last: center;
    text-align-last: center;
}

.feature-panel {
    font-size: 18px;
    margin-top: 27px;
    color: #323232; /* sands 2025 body */
    margin-bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

.feature-panel__text-wrap {
    padding: 32px;
    min-height: 100%;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display: block;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    background-color: #ffb56b; /* sands 2025 orange */
}
.feature-panel__figure {
    width: 100%;
    margin-top: 0;
}
.feature-panel__image {
    width: 100%;
    margin: 0 auto;
    display: block;
}
.feature-panel__description {
    margin-top: 27px;
}
.section-header{
    font-weight: 600;
}

@media (min-width: 500px){
    .hero__text-wrapper {
        padding: 64px 128px;
    }
}

@media (min-width: 768px){
    .feature-panel__text-wrap {
        padding: 32px 64px;
    }
    .object-fit .feature-panel__figure--object-fit {
        display: block;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        min-height: 100%;
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
    .object-fit .feature-panel__figure--object-fit img {
        -o-object-fit: cover;
        object-fit: cover;
    }
}

@media (min-width: 992px){
    .hero__bg {
        background-color: #4d036e; /* sands 2025 purple */
    }

    .hero--homepage {
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        width: 100%;
        max-width: 1200px;
        margin-right: auto;
        margin-left: auto;
    }
    .hero__text-wrapper {
        width: 40%;
        background-color: transparent;
        padding: 100px 32px 32px;
    }
    .hero__img-and-cta {
        width: 100%;
        margin-bottom: 0;
    }

    .col-md-12 {
        width: 49%;
    }

    .feature-panel--light-teal {
        background-color: #ffd9e8;
    }

    .feature-panel {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        width: 100%;
        max-width: 1200px;
        margin-right: auto;
        margin-left: auto;
    }
    .feature-panel__text-wrap {
        background-color: transparent;
        width: 50%;
        padding: 64px;
    }
    .feature-panel__figure {
        height: auto;
        min-height: 400px;
        width: 50%;
    }
}

/* end home grid */

.shopbreadcrumb {
    padding: 16px 0;
    margin-top: 16px;
    margin-bottom: 16px;
    color: #2e2f64;
}
.shopbreadcrumb a{
    color: #2e2f64;
}
.shopbreadcrumb a:hover{
    text-decoration: none;
}

.shopcontainer, .container{
    position: relative;
    margin: 0 auto;
    text-align: left;
    padding-right: 32px;
    padding-left: 32px;
}

.shopcontainer div, #productform{
    margin-top: 0;
}

.shopcontainer strong{
    font-weight: 600;
}
.shopcontainer img{
    max-width: 100%;
}
.shopcontainer.checkout, .shopcontainer.marginbottom{
    margin-bottom: 3.2em;
}

.shopcontainer a{
    /*color: #ffb56b; /* sands 2025 orange */
    text-decoration: none;
}
.shopcontainer a.lined{
    text-decoration: underline;
}
.shopcontainer p{
    margin-top: 0;
}
/*.shopcontainer a:hover{
    color: #2e2f64;
}*/
span.span{
    display: block;
    overflow: hidden;
    text-indent: -1500px;
    font-size: 1px;
}

.warn{
    font-weight: 600;
    color: #f00;
}

.productbanner p.price_and_btn{
    float: left;
    font-size: 1.8em;
    margin-right: 1em;
    margin-top: 0;
    color: #fff;
}
.productbanner p.imagebtn{
    margin: 0;
}
.productbanner .imagebtn button{
    margin-top: 0;
}
.js-clickable{
    cursor: pointer;
}

/* cart and account */

.cart-account-holder{
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 3em;
}
.cart-account-holder a, #account{
    text-decoration: none;
}

/* cart */

#cart{
    position: absolute;
    bottom: -52px;
    right: 5em;
    margin: 0;
    padding: 0;
}

#cart #btn{
    font-weight: bold;
    line-height: 39px;
    height: 39px;
    display: block;
    color: #4d036e; /* sands 2025 purple */
    background: #babfff;
    width: 5em;
    text-decoration: none;
}
#cart #btn:hover{
    background-color: #b2b7fc;

}
#cart .cartitemwrapper{
    font-size: 1.2em;
    letter-spacing: 0.05em;
    margin-left: 0.5em;
}
#cart svg{
    width: 20px;
    height: 20px;
    fill: #4d036e; /* sands 2025 purple */
    vertical-align: middle;
}

/* cart preview */

#cartpreview{
    font-weight: normal;
    position: absolute;
    right: 0;
    background: #fff;
    padding: 0.7em 1em;
    width: 10em;
    border: 2px solid #b2b7fc;
    -webkit-box-shadow: 0 5px 5px rgba(0,0,0,0.3);
    -moz-box-shadow:    0 5px 5px rgba(0,0,0,0.3);
    box-shadow:         0 5px 5px rgba(0,0,0,0.3);
    display: none;
    z-index: 100;
    margin-top: 0;
}
#cartpreview p{
    font-size: 0.7em;
    margin: 0 0 0.5em 0;
    text-align: right;
}
#cartpreview p.item{
    float: left;
}
#cartpreview a{
    font-weight: bold;
    text-decoration: none;
}
#cartpreview a:hover{
    color: #000;
}

/* account btn */

#account{
    font-weight: bold;
    position: absolute;
    bottom: -52px;
    right: 0;
    margin: 0;
    padding: 0;
}
#account a{
    display: block;
    background: #ffb56b;
    color: #4d036e; /* sands 2025 purple */
    width: 5em;
    text-align: center;
    line-height: 39px;
    height: 39px;
    text-decoration: none;
}
#account a:hover{
    background: #FF8625;
}
#account svg{
    width: 16px;
    height: 16px;
    fill: #4d036e; /* sands 2025 purple */
    vertical-align: middle;
    margin-right: 0.2em;
}

#account span{
    font-size: 0.9em;
}

#account span.youraccount{
    font-size: 0.85em;
}

/* main */

.shopcontainer h1, .shopcontainer h2, .shopcontainer h3{
    font-weight: 600;
    color: #4d036e; /* sands 2025 purple */
    font-style: normal;
}
.shopcontainer .prefs h3{
    line-height: 1em;
}
.shopcontainer .prefs h3 label{
    font-size: 1em;
    color: #4d036e; /* sands 2025 purple */
}
.prefs .last{
    margin-bottom: 2em;
}

.shopcontainer h1{
    font-size: 2.2em;
    margin: 0 0 0.45em;
    line-height: 1.3em;
}
.shopcontainer h2{
    font-size: 1em;
}
.shopcontainer h3{
    font-size: 1.5em;
    margin: 0 0 0.66em;
}
.shopcontainer.checkout h3{
    color: #ffb56b; /* sands 2025 orange */
}

.shopcontainer p{
    margin: 0 0 0.7em;
}

#homemain h1{
    font-size: 1.2em;
    margin-bottom: 0;
    font-weight: bold;
}

.shopfront p{
    font-size: 1.2em;
}


/* sidebar */

#sidebar{
    display: none;
    background: #fff2e3;
    width: 19%;
    padding: 2%;
    float: left;
    margin-top: 0;
}
#sidebar h3{
    font-style: normal;
    color: #4d036e; /* sands 2025 purple */
    line-height: 1em;
    margin-bottom: 0.5em;
}

#sidebar nav ul{
    margin: 0;
    padding: 0;
    /*font-weight: bold;*/
    list-style-type: none;
}
#sidebar nav li{
    margin-bottom: 1em;
    color: #323232; /* sands 2025 body */
}

#sidebar nav a{
    color: #323232; /* sands 2025 body */
    font-weight: normal;
}
#sidebar nav a:hover, #sidebar nav a.sel{
    color: #323232; /* sands 2025 body */
    text-decoration: underline;
}

/* grid */

.crumb{
    font-size: 0.9em;
    margin: 1em 0;
}
.crumb,  .crumb a{
    font-weight: normal;
    color: #000;
}
.crumb a:hover{
    color: #a1aeae;
}

#packgrid{
    float: left;
    width: 570px;
}
#grid h1, .middlepanel h1{
    margin: -0.28em 0 0.5em;
}

.product{
    margin: 1.5em 1% 1.5em;
    text-align: center;
}

.product img, .middlepanel img, .interested img, table .img img{
    /*border-radius: 0.25em;*/
}

#promos .product{
    margin-bottom: 0;
    background: none;
}
#packgrid .product{
    width: 176px;
}

.detail strong{
    color: red;
    font-weight: normal;
}

.product p{
    color: #4d036e; /* sands 2025 purple */
    margin: 0;
    height: 3.25em;
    font-weight: 600;
    font-size: 1.2em;
}
.product.interested p{
    height: auto;
}

.product h3{
    color: #ffb56b; /* sands 2025 orange */
    font-style: normal;
    font-weight: normal;

}
.product a:hover h3{
    color: #FF8625; /* sands 2025 orange hover */
}

/* product detail */

.detailimg{
    margin-top: 1.5em;
}
.links h3{
    font-size: 1em;
    margin: 0;
}
.links p{
    margin: 0;
}
#mainimage{
    float: left;
}
.thumbs a{
    float: left;
    width: 24%;
    margin: 2em 1.333% 2em 0;
}
.thumbs a.end{
    margin-right: 0;
}

.withline{
    background: url(../images/divide-big.gif) no-repeat bottom center;
    padding-bottom: 40px;
}

#buypanel {
    padding: 0 1em;
    position: relative;
}

#buypanel h3, #buypanel h4{
    color: #ffb56b; /* sands 2025 orange */
    font-size: 2.2em;
    font-style: normal;
    font-weight: 600;
}
#buypanel h4{
    font-size: 2em;
    margin-left: -0.5em;
}
.imagebtn.fullwidth button, .imagebtn.fullwidth a{
    width: 100%;
    display: block;
}
.shopcontainer .maxorders{
    text-align: center;
    margin-bottom: 0;
    color: #2e2f64;
    font-weight: 600;
    font-size: 1.2em;
}

#readmore{
    text-align: right;
}
#readmore a{
    font-weight: bold;
    color: #2e2f64;
}
#readmore a:hover{
    color: #ffb56b; /* sands 2025 orange */
}

.product-load-overlay{
    position: absolute;
    background: #f2f4f4 url(../images/ajax-loader.gif) no-repeat 50% 50%;
    opacity: 0.5;
    top: 0;
    left: 1em;
    margin: 0;
}

/* download banner */

.download-banner{
    background: #d2e8ea;
    padding: 1em 0;
}

.download-banner-panel{
    text-align: center;
}

.download-banner p{
    margin: 0 0 0.5em;
    padding: 0;
    font-size: 1.3em;
    font-weight: bold;
    color: #2e2f64;
}
.download-banner .downloadbtn{
    margin: 0;
    padding: 0;
    font-size: 1.55em;
}
.download-banner .downloadbtn a{
    margin: 0;
    padding: 0.3em 2em 0.2em;
    background: #2e2f64;
    font-size: 1em;
    width: 100%;
    display: inline-block;
}
.download-banner .downloadbtn a:hover{
    background: #ffb56b; /* sands 2025 orange */
}

/* interested */

.interested_holder{
    background: #fff;
}

.interested h4{
    text-align: center;
    color: #2e2f64;
    font-weight: 600;
    font-size: 1.4em;
    margin: 1em 0;
}

/* pack detail */

#packfloatpanel{
    float: right;
    margin-right: -20px;
    width: 164px;
    padding: 8px;
    background: red;
    color: #d0daea;
}
#packfloatpanel h1{
    color: #fff;
    margin: 0 0 0.5em 0;
    line-height: 1em;
}
#packfloatpanel h2{
    color: #fff;
    font-size: 0.95em;
    margin: 0 0 0.7em 0;
    line-height: 1.1em;
}
#packfloatpanel h3{
    color: #eff3f8;
    font-size: 1em;
    font-weight: normal;
    margin: 0 0 0.9em 0;
    line-height: 1em;
}
#packfloatpanel p{
    margin: 0 0 1em 0;
    font-size: 0.7em;
}


#packaddpanel{
    color: purple;
    background: #fff;
    text-align: center;
    padding: 1em 10px;
    font-size: 1.4em;
    color: #58595b;
}

#packaddpanel p{
    font-weight: bold;
    color: red;
}

#packaddpanel p.cost{
    color: #000;
}

#packaddpanel p.imagebtn{
    margin: 0;
}


/* forms */

.shopcontainer form{
    margin-top: 0;
    margin-bottom: 1em;
}
.zend_form{
    margin: 0 0 1em 0;
}
.zend_form dt{
    margin: 0 0 0.1em 0;
}
.zend_form dd{
    margin: 0 0 0.2em 0;
}
.zend_form dd.imagebtn{
    margin-top: 1em;
}
p.imagebtn{
    margin: 2em 0;
}
.imagebtn button, .imagebtn a, #getaddress_button{
    color: #fff;
    border: 2px solid #4d036e; /* sands 2025 purple */
    width: 208px;
    border-radius: 22px;
    display: block;
    text-align: center;
    line-height: 18px;
    font-weight: 600;
    background: #4d036e; /* sands 2025 purple */
    padding: 13px 0;
    transition: all 0.5s;
}
.imagebtn button:hover, .imagebtn a:hover, #getaddress_button:hover{
    background: #FF8625; /* sands 2025 orange hover */
    border-color: #FF8625; /* sands 2025 orange hover */
    color: #4d036e; /* sands 2025 purple */
    text-decoration: none;
}
.imagebtn.dark button, .imagebtn.dark a{
    color: #4d036e; /* sands 2025 purple */
    background: #ff8625;
    border: 2px solid #ff8625;
}
.imagebtn.dark button:hover, .imagebtn.dark a:hover{
    color: #fff;
    background: #4d036e; /* sands 2025 purple */
    border-color: #4d036e; /* sands 2025 purple */
}

.imagebtn .secondary{
    color: #4d036e; /* sands 2025 purple */
    background: none;
    font-family:inherit;
    font-weight: normal;
}
.imagebtn .secondary.bordered{
    /*padding: 0.3em 1em 0.35em;*/
    color: #4d036e; /* sands 2025 purple */
    background: #ff8625;
    border: 2px solid #ff8625;
    font-weight: 400;
}
.imagebtn .secondary:hover{
    background: none;
    color: #ffb56b; /* sands 2025 orange */
}
.imagebtn .secondary.bordered:hover{
    color: #fff;
    background: #4d036e; /* sands 2025 purple */
    border-color: #4d036e; /* sands 2025 purple */
}

.imagebtn.promo{
    margin: 1em 0;
}
/*.imagebtn.promo button{
    padding: 0.25em 0.8em 0.2em;
}*/
.imagebtn button:disabled, .imagebtn button:disabled:hover{
    background: #e6ebea;
    border: 2px solid #e6ebea;
    cursor: default;
}

.zend_form .errors{
    list-style-type: none;
    color: #cb1b24;
    margin: 0;
    padding: 0;
    font-size: 0.8em;
}
input{
}
.zend_form input, #promo, .qty{
    /*width: 97.8%;*/
    width: 100%;
    color: #000;
    padding: 0.95em 2%;
    border: 1px solid #2e2f64;
    border-radius: 22px;
    font-size: 15px;
}
label.required:after, legend.required:after {
    content: " *";
    color: #ffb56b; /* sands 2025 orange */
    font-weight: 600
}
/*#promo{
    width: 60%;
}*/

.zend_form input[type="checkbox"], .zend_form input[type="radio"]{
    width: auto;
}

label em{
    font-style: normal;
    color: #de1520;
}

label{
    color: #2e2f64;
    display: inline;
    font-weight: 600;
}

.shopcontainer div.pullbox{
    background: #e7f4ff;
    margin-top: 1em;
    padding: 1em;
}
.pullbox label.headline, p.headline{
    font-size: 1.35em;
    color: #2e2f64;
    font-weight: 600;
}
p.headline{
    font-size: 1.25em;
    margin-top: 1em;
    margin-bottom: 0;
}
.pullbox label em{
    font-size: 0.741em;
    font-weight: normal;
}

.zend_form .big{
    margin: 1em 0;
    font-weight: 600;
}
.zend_form .tight{
    margin-top: 0;
}



/* basket / confirm */

table{
    /*margin-top: 1.3em;*/
    width: 100%;
}
.shopcontainer table h1{
    margin-top: 0;
}
th{
    vertical-align: bottom;
    color: #2e2f64;
    text-align: center;
    padding: 0 0 14px;
    background: none;
}
th h1{
    margin: 0;
    line-height: 0.9em;
    text-align: left;
}
td{
    padding: 1.5em 0 0;
    border-bottom: none;
}
.lastrow td{
    padding-bottom: 1.5em;
}
.standard{
    width: 20%;
    text-align: center;
    font-size: 1.25em;
}
table .last{
    width: 10%;
    text-align: right;
    font-weight: bold;
}
table td.last, td.standard{
    color: #ffb56b; /* sands 2025 orange */
}
.standard.noqtyctrl{
    color: #000;
}
.qtyctrl{
    color: #ffb56b; /* sands 2025 orange */
    font-size: 2em;
    margin: 0 0.1em;
}
.qtyctrl:hover{
    color: #2e2f64;
}
.qtyctrl.disabled{
    color: #ccc;
    cursor: default;
}
.total{
    font-size: 1.6em;
    color: #2e2f64;
    text-align: right;
    vertical-align: top;
    padding-top: 0.2em;
    font-weight: bold;
}

.sub{
    font-size: 1.3em;
    color: #2e2f64;
    text-align: right;
    vertical-align: top;
    padding-top: 0.2em;
}
.sub.toprow, .total.toprow{
    padding-top: 1em;
}
table .img{
    width: 11%;
}
table .desc{
    color: #2e2f64;
    padding-left: 1em;
    font-size: 1.3em;
    line-height: 1em;
}
table .desc em{
    font-style: normal;
    font-size: 0.55em;
    color: #839995;
}
table .promo td{
    padding-bottom: 1em;
}

.line th{
    border-bottom: 1px solid #839995;
}
.line td{
    border-top: 1px solid #839995;
}
.line td td{
    border-top: none;
}
.qty{
    text-align: center;
    width: 2.4em;
    display: inline-block;
    border-radius: 0;
    padding: 0.2em 0;
    background: #fff;
}
.remove {
    margin-left: 0.2em;
}
.remove svg{
    width: 26px;
    height: 26px;
    fill: #4d036e; /* sands 2025 purple */
}
.remove:hover svg{
    fill: #ffb56b; /* sands 2025 orange */
}
.left{
    float: left;
}
.right{
    float: right;
}

p.small{
    width: 200px;
}
.smallcopy{
    font-size: 0.9em;
}

.promolabel label{
    color: #2e2f64;
    font-size: 1.3em;
    font-weight: 600;
}
.promolabel label em{
    color: #000;
    font-size: 0.77em;
    font-weight: normal;
}

/* basket product */
.basketheadings p{
    display: none;
}
.basketproduct, .basketvouchercode{
    /*border-bottom: 3px solid #008c95;*/
    /*border-bottom: 1px solid #ffb56b; /* sands 2025 orange */
    padding-bottom: 1em;
}
.voucher-totals-holder{
    border-top: 1px solid #ffb56b; /* sands 2025 orange */
}
.basketproduct, .basketvouchercode, .baskettotal{
    padding-top: 1em;
    clear: both;
}
.basketproduct.nopad, .basketvouchercode.nopad, .baskettotal.nopad{
    padding-top: 0;
}
.basketproduct-image{
    float: left;
    width: 50%;
}
.basketproduct-desc{
    color: #2e2f64;
    font-size: 1.2em;
    line-height: 1em;
    text-align: right;
    font-weight: 600;
}
.basketproduct-desc em{
    font-style: normal;
    font-size: 0.65em;
    color: #ffb56b; /* sands 2025 orange */
}
.basketproduct-desc p{
    font-style: normal;
    font-size: 0.65em;
    color: #839995;
    line-height: 1em;
}

.basketproduct-subtotal, .basketproduct-total{
    display: none;
}
.basketproduct-subtotal, .basketproduct-mobile-total, .basketproduct-total{
    color: #ffb56b; /* sands 2025 orange */
    text-align: right;
    font-weight: 600;
    font-size: 1.25em;
}
.basketproduct-subtotal, .basketproduct-total{
    display: none;
}
.basketproduct-quantity{
    clear: both;
}
.basketproduct-quantity.noqtyctrl{
    display: none;
}

.basketvouchercode #promo{
    margin: 0;
    float: left;
    width: 63%;
}
.basketvouchercode .imagebtn{
    float: right;
    width: 36%;
    margin: 0;
}
/*.basketvouchercode .imagebtn button{
    padding: 0.2em 0.5em 0.28em;
}*/

.baskettotal-label, .baskettotal-amount{
    font-size: 1.6em;
    color: #2e2f64;
    font-weight: bold;
    float: left;
}
.basketsubtotal-label, .basketsubtotal-amount{
    font-size: 1.3em;
    color: #2e2f64;
    float: left;
}
.baskettotal-amount, .basketsubtotal-amount{
    float: right;
    color: #ffb56b; /* sands 2025 orange */
}
.baskettotal-amount em, .basketsubtotal-amount em{
    display: none;
}

.line{
    border-bottom: 1px solid #839995;
    padding-top: 1em;
    padding-bottom: 1em;
}
.line.nopad{
    padding-top: 0;
}

/* checkout */

.info{
    margin-bottom: 2em;
    font-weight: bold;
    font-size: 1.2em;

}
.info svg{
    width: 20px;
    height: 20px;
    margin-right: 0.3em;
    vertical-align: middle;
}


.banner{
    background: #4d036e; /* sands 2025 purple */
    padding: 0.4em 0.9em 0.6em;
    margin: 0.75em 0;
}
.banner.active{
    background: #4d036e; /* sands 2025 purple */
}
.banner:hover{
    background: #ffb56b; /* sands 2025 orange */
}
.banner.active:hover{
    background: #4d036e; /* sands 2025 purple */
}
.banner.disabled{
    background: #babfff;
}
.banner h2{
    color: #fff;
    margin: 0;
    font-weight: 600;
    line-height: 1.8em;
}
.banner:hover h2{
    color: #4d036e; /* sands 2025 purple */
}
.banner.active:hover h2, .banner.disabled:hover h2{
    color: #fff;
}
/*.banner.disabled h2{
    color: red;
}*/
.banner h2 span{
    font-size: 2em;
    float: right;
    line-height: 0;
    margin-top: 0.35em;
}
.checkout .col{
    margin-bottom: 1em;
}
.checkout .col.border.last{
    border-top: 1px solid #2e2f64;
    padding-top: 1em;
}
.checkout .col.last h3.empty{
    display: none;
}


.rightbtn, .rightbtnsubmit dd.imagebtn{
    float: right;
}
.rightbtnsubmit .imagebtn button{
    width: 15em;
}
.rightbtnsubmit dd.imagebtn{
    margin-bottom: 1em;
}

/* donation */

.donation_form{
    text-align: center;
}
.donation_form label{
    font-weight: bold;
}
.donation_form input{
    padding-left: 1em;
}

.amount{
    display: inline-block;
    font-size: 2em;
    font-weight: 600;
    border-radius: 22px;
    width: 100%;
    margin: 0 0 0.4em;
    padding: 0.5em 0;
    background: #ffb56b; /* sands 2025 orange */
    color: #4d036e; /* sands 2025 purple */
    border: 1px solid #ffb56b; /* sands 2025 orange */
}
.amount:hover, .amount:active, .amount.sel{
    border-color: #4d036e; /* sands 2025 purple */
    background: #4d036e; /* sands 2025 purple */
    color: #fff;
    text-decoration: none;
}

.amount_wrapper{
    position: relative;
    text-align: left;
}
.amount_wrapper span{
    position: absolute;
    top: 2.6em;
    left: 0.45em;
}

.giftaid-info{
    text-align: center;
}

.giftaid-info img{
    width: 50%;
}
.giftaid-info p{
    text-align: left;
}



/* confirm */

.shopcontainer div.agreement{
    /*margin: 1em 0 2em;*/
    margin-bottom: 1em;
}


.prefs strong{
    /*width: 25%;*/
    width: 50%;
    display: inline-block;
}
.prefs p.smallprint{
    line-height: 1.3em;
    font-size: 80%;
}
.addresses, .addresses td{
    vertical-align: top;
}
.addresses, .addresses table, .addresses tr, .addresses td{
    padding-top: 0;
    margin-top: 0;
}
.addresses h3{
    margin: 1em 0 0.2em;
}
.addresses p{
    line-height: 1.19em;
}

.paymentbanner{
    background: #e7f4ff;
    padding: 1.4em 4%;
    margin-top: 2em;
    text-align: center;
}
.paymentbanner p.imagebtn {
    margin: 0;
    padding: 0;
    line-height: 1em;
}
.paymentbanner strong{
    color: #323232; /* sands 2025 body */
    font-size: 2.1em;
    line-height: 1em;
    padding-top: 0.25em;
}
.paymentbanner em{
    display: block;
    padding-bottom: 1em;
    line-height: 2.1em;
    font-style: normal;
    padding-top: 0.5em;
    color: #323232; /* sands 2025 body */
}

/* form validation */

form label.error{
    font-weight: bold;
    color: #f00;
    margin-left: 10px;
    font-size: 0.8em;
    /*background: url("../images/Red-Cross.gif") no-repeat 0px 0px;*/
}
form label.checked{
    /*background: url("../images/Green-Tick.gif") no-repeat 0px 0px;*/
}

#postcode_lookup{
    margin-top: 1.73em;
}
#postcode_lookup #getaddress_input{
    width: 58%;
    float: left;
    margin-right: 2%;
    margin-bottom: 0.2em;
}
#postcode_lookup button{
    float: left;
    width: 40%;
    margin-bottom: 0.2em;
    line-height: 1.1em;
    /*

        font-size: 0.7em;
        padding: 0.5em 0;

    */
}
#postcode_lookup #getaddress_dropdown{
    margin-bottom: 0.2em;
}

/* cookie banner */

#cookiebanner{
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff url(../../../images/cookiewarning.gif) no-repeat 19px 1.35em;
    z-index: 1000;
    padding: 1em 1em 1em 67px;

}
.display{
    overflow-x:auto;
}
.display table{
    margin: 0;
    padding-bottom: 1.5em;
    border-spacing: 0;
}
.display table th, .display table td{
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    padding: 1em;
}

/* mobile */
@media (min-width: 480px){
    .shopcontainer, .container {
        max-width: 480px;
    }
}

/* tablet */
@media (min-width: 768px){
    .imagebtn.short{
        width: 40%;
    }
    .shopcontainer, .container{
        max-width: 768px;
    }
    .product {
        width: 32%;
        float: left;
        margin-left: 0;
        margin-right: 2%;
    }
    .product.end{
        margin-right: 0;
    }
    .detailimg{
        float: left;
        margin-top: 1.5em;
        width: 45%;
    }
    .detail{
        float: right;
        width: 52%;
        padding-left: 10%;
    }
    .download-banner-panel {
        text-align: right;
    }

    .download-banner p{
        margin-right: 0.5em;
        font-size: 1.55em;
        display: inline;
    }
    .download-banner .downloadbtn a{
        padding-left: 3em;
        padding-right: 3em;
        width: auto;
        display: inline;
    }
    .shopcontainer h2{
        font-size: 1.54em;
    }
    .banner{
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
    .checkout .col{
        float: left;
        width: 50%;
        padding: 0 2% 0 3%;
    }
    .checkout .col.border{
        border-right: 1px solid #ffb56b; /* sands 2025 orange */
    }
    .checkout .col.last{
        padding: 0 3% 0 2%;
        border-right: none;
    }
    .checkout .col.border.last{
        border-left: 1px solid #2e2f64;
        border-top: none;
        padding-top: 0;
    }
    .imagebtn button, .imagebtn a{
        /*width: auto;*/
        /*display: inline;*/
    }

    .checkout .col.last h3.empty{
        display: block;
    }

    .noncheckout .col{
        padding-left: 0;
        width: 50%;
        padding: 0 2% 0 3%;
    }
    .noncheckout .col.last{
        padding: 0 3% 0 2%;
    }
    .wide_single_col{
        padding: 0 3%;
    }

    .short{
        width: 75%;
    }
    .cart-account-holder{
        margin-top: 27px;
    }
    .productbanner p.price_and_btn{
        /*margin-top: 27px;*/
        margin-top: 34px;
    }
    .productbanner .imagebtn button{
        margin-top: 23px;
    }

    /* basket */

    .basketheadings h1, .basketheadings p{
        display: block;
        float: left;
        width: 15%;
        border-bottom: 1px solid #ffb56b; /* sands 2025 orange */
        font-size: 1.25em;
        font-weight: 600;
        line-height: 2.25em;
        color: #2e2f64;
    }
    .basketheadings h1{
        width: 50%;
    }
    .basketheadings p{
        text-align: center;
    }
    .basketheadings p.qtyheading{
        width: 20%;
    }
    .basketheadings p.totalheading{
        text-align: right;
    }

    .basketproduct-image{
        float: left;
        width: 10%;
    }
    .basketproduct-desc{
        float: left;
        width: 40%;
        text-align: left;
        padding-left: 1em;
        padding-top: 0.85em;
    }
    .basketproduct-quantity{
        float: left;
        width: 20%;
        clear: none;
        text-align: center;
    }
    .basketproduct-subtotal, .basketproduct-total{
        float: left;
        width: 15%;
        display: block;
        padding-top: 0.5em;
    }
    .basketproduct-quantity.noqtyctrl{
        display: block;
        padding-top: 0.5em;
        font-size: 1.25em;
    }
    .basketproduct-desc span{
        display: none;
    }
    .basketproduct-subtotal{
        text-align: center;
    }
    .basketproduct-mobile-total{
        display: none;
    }
    .voucher-totals-holder .clearfix:after, .addresses-totals-holder .clearfix:after {
        clear: none;
    }
    .basketvouchercode, .baskettotal{
        float: left;
        border: none;
        clear: none;
        width: 60%;
    }
    .baskettotal{
        width: 40%;
        float: right;
    }
    .baskettotal-label, .basketsubtotal-label{
        display: none;
    }
    .baskettotal-amount em, .basketsubtotal-amount em{
        display: inline;
        color: #2e2f64;
        font-style: normal;
        /*margin-right: 0.5em;*/
    }
    .totals-holder .baskettotal-amount, .totals-holder .basketsubtotal-amount {
        float: none;
    }
    .totals-holder .baskettotal{
        width: auto;
        float: none;
        text-align: right;
    }

    .address{
        width: 29.5%;
        float: left;
    }
    .totals-holder{
        width: 41%;
        float: right;
    }
    .baskettotal span{
        width: 3.7em;
        display: inline-block;
    }
    .baskettotal .basketsubtotal-amount span{
        width: 4.75em;
    }

    .continue-btn{
        float: left;
    }
    .checkout-btn{
        float: right;
    }
    .imagebtn.continue-btn a{
        padding-left: 0;
    }

    .shopcontainer .donation_form{
        margin: 2.9em 0 4em;
    }
    .donation_form input{
        width: auto;
    }

    .amount{
        font-size: 4.5em;
        width: 170px;
        height: 170px;
        line-height: 170px;
        margin-left: 0.295em;
        margin-right: 0.295em;
        padding: 0;
    }

    .amount_wrapper span{
        position: absolute;
        top: 0.68em;
        left: auto;
        margin-left: 0.5em;
    }
    .donation_label{
        margin-right: 0.5em;
    }
    .larger{
        font-size: 1.3em;
        line-height: 1.22em;
        margin-bottom: 1.3em;
    }

    .giftaid-info{
        text-align: left;
    }

    .giftaid-info img{
        float: left;
        margin-right: 2em;
        margin-bottom: 2.9em;
        width: auto;
    }
    .paymentbanner strong{
        margin-right: 0.8em;
        float: left;
    }
    .paymentbanner em{
        float: left;
    }
    .paymentbanner .imagebtn button {
        float: right;
    }
    .line{
        border: none;
    }
}

/* small desktop */
@media (min-width: 992px){
    .shopcontainer, .container{
        max-width: 992px;
    }
    #sidebar{
        display: block;
    }
    #grid, .middlepanel, .download-banner-panel {
        float: right;
        width: 77.7%;
    }
    .short{
        width: 55%;
    }
    .amount{
        margin-left: 0.32em;
        margin-right: 0.32em;
    }
    .prefs strong{
        width: 35%;
        display: inline-block;
    }
}

/* mid desktop */
@media (min-width: 1100px){
    .shopcontainer, .container{
        max-width: 1100px;
    }
}

/* large desktop */
@media (min-width:1200px){
    .shopcontainer, .container{
        max-width: 1200px;
    }
}



/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
*/

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
*/

.clearfix {
    *zoom: 1;
}
