/* - - GENERAL - - */
body { font-size: 15px; font-family: "TMSans Regular", Arial, sans-serif,  Helvetica, Sans-Serif; color: #414141;background-color: #e8e8e8;}

.body-container-action-payment { padding-top: 5px; }

.title:not(.sub) { font-size: 18px; margin-bottom: 10px; font-family:"TMSans Bold"; }
.title.carousel-title { margin-bottom: 27px; }
.title-row { margin-bottom: 15px; }
.title.basket-title { margin-bottom: 7px; }

a { color: #404040; text-decoration: underline; }
a:hover { cursor: pointer; color: #404040; text-decoration: none; }

.sub, .small { font-size: 12px; }
.title ~ .sub { margin-bottom: 5px; }
.country-selection-container .title, .language-selection-container .title { display: block; }

hr { margin: 30px 0 20px 0; border-color: #CCCCCC; }
hr.delivery-details{ margin-top: 5px;margin-bottom: 25px;}
p { margin: 0; }

.img-responsive { width: auto; }

.error { color:red; }

.dont-break-out {
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    word-break: break-word;

    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

@media screen and (min-width: 767px) {
    .hidden-on-desktop { display: none !important; }
}
@media screen and (max-width: 768px) {
    .hidden-on-mobile { display: none !important; }
}

.checkbox-image-container.col-xs-1, .checkbox-image-container.col-xs-2 { padding-right: 0; }
.checkbox-option-column{ width: 5%; padding-right: 0;}
.same-address-checkbox-label{ padding-left: 0; top: 2px;}

@media screen and (max-width: 400px) {
    .checkbox-option-column{ padding-right: 15px;}

}
@media screen and (min-width: 1200px) {
  .container { width: 970px; }
}
@media screen and (max-width: 767px) {
    hr { margin: 10px -15px 15px -15px; }
    hr.delivery-details{ margin-top: 10px; }

    .title.carousel-title { margin-bottom: 16px; }
    .title.message-title { margin-bottom: 0; }

    .same-address-checkbox-label{ padding-left: 30px; padding-right: 70px; bottom: 10px;}
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    .same-address-checkbox-label { padding-left: 15px; }
}

/* - - HEADER - - */
.header {
    background-color: #fff;
    color: #A0A0A0;
    padding: 15.5px 0;
    -webkit-box-shadow: 0px 4px 4px 0px rgba(160,160,160,0.5);
    -moz-box-shadow: 0px 4px 4px 0px rgba(160,160,160,0.5);
    box-shadow: 0px 4px 4px 0px rgba(160,160,160,0.5);
}

.header-left-container img { margin-top: 6px; margin-left: 10px; margin-left: 1px; padding-left: 27px; }
.header-right-container { text-align: center;margin-top: 20px; }
.header-basket-container { float: left; }
.header-telephone-number { padding-top: 6px;font-size: 16px;}
.need-help{ color: #024ddf;}
.telephone-number{ color: #024ddf; font-family: "TMSans Bold";}

.basket-container a { text-decoration: none; color: #414141; }
.basket-icon, .number-of-items, .basket-total { display: inline; position: relative; }
.number-of-items { top: 6px; width: 15px; text-align: center; left: -25px; font-size: 14px; }
.basket-total { top: 5px; }

.header-controller-generategiftcard { margin-bottom: 15px; }

@media screen and (min-width: 768px) {
    .header-telephone-button { display: none; }
    .header-right-container { padding-right: 30px; }
}
@media screen and (max-width: 767px) {
    .header-left-container img { padding-left:0;}
    .header-right-container{ margin-top: 10px;}
    .header-telephone-number { display: none; }
    .basket-total { display: none; }
}

/* - - PAGE (GENERAL) - - */ 
.page-container {
    background-color: #fff;
    padding: 0 30px 0 30px;
    margin-bottom: 15px;
    -webkit-box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
    -moz-box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
    box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
}

@media screen and (max-width: 767px) {
    .page-container { 
        padding: 11px 15px 0 15px; 
        margin-top: 0; 
        margin-bottom: 0;
        -webkit-box-shadow: 0 0 0 0;
        -moz-box-shadow: 0 0 0 0;
        box-shadow: 0 0 0 0;
    }
}

@media screen and (max-width: 400px) {
    .page-container {
        -webkit-box-shadow: 0 0 0 0;
        -moz-box-shadow: 0 0 0 0;
        box-shadow: 0 0 0 0;
        margin-bottom: 0;
        padding-top: 0;
        margin-top: -15px;
    }
    .activation-form-inner .title.big-title{
        margin-top: 15px;
    }
}

/* - - BANNER & STEPS - - */
.banner-container {
    max-width: 970px;
    margin: 0 auto;
    margin-top: 20px;
    -webkit-box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
    -moz-box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
    box-shadow: 4px 4px 4px 0 rgba(160,160,160,0.5), -4px 4px 4px 0 rgba(160,160,160,0.5);
}
.activation-banner { margin-left: -30px; margin-right: -30px; }
.steps-container { margin-bottom: 20px;  margin-top: 20px; }
.step-section-container { display: inline-block; width: 33.33%; float: left; text-align: center;padding-left: 1px;padding-right: 1px;font-weight: bold;}
.step-section-container.step-1 { padding-left: 0; }
.step-section-container.step-3 { padding-right: 0; }
.step-section { border-bottom: 1px solid #e8e8e8;background-color: #e8e8e8; color: #414141; padding: 5px 10px 5px 10px;  }
.step-current .step-section { border: 1px solid #024ddf; color: #fff;background-color: #024ddf;}
.step-section-number, .step-section-name { vertical-align: middle; }
.step-section-number { font-family:"TMSans Bold"; font-size: 18px; margin-right: 10px;color: #024ddf; }
.step-section-name { font-family: "TMSans Bold";  font-size: 13.1px; }
.step-current .step-section .step-section-number{ color: #fff;}

@media screen and (max-width: 400px) {
    .steps-container{ margin-bottom: 15px; margin-top: 10px; }
}

@media screen and (max-width: 991px) {
    .banner-container { max-width: 750px; }
}

@media screen and (max-width: 767px) {
    .banner-container, .activation-banner { margin-top: -15px; }
    .banner-container { padding-top: 15px; }
    .banner-container img, .activation-banner img { width: 100%;}
    .steps-container{ margin-left: -15px;margin-right: -15px;}
    .step-section-container { width: 100%; display: none; padding-left: 0; padding-right: 0; }
    .step-section-container.step-current { display: inline-block; }
}

/* - - FOOTER - - */
.footer { padding-top: 12px; }
.footer img { margin: 0 auto; }
.footer-icons { float: right; }
.footer-second-row { padding: 11px 0; }
.footer-third-row { margin-bottom: 15px; }

.footer-require-help, .footer-links { float: left; clear: left; }
.title.footer-require-help { color: #024ddf; margin-bottom: 2px; word-break: break-word; max-width: 650px; font-size: 16px; }
.title.footer-require-help a { color: #024ddf; text-decoration: underline; }

@media screen and (min-width: 768px) and (max-width: 992px) {
    .title.footer-require-help { max-width: 425px; }
}
@media screen and (max-width: 767px) {
    .title.footer-require-help { padding-top: 12px; padding-bottom: 12px; }
}

.footer-copyright, .footer-ve { font-size: 10px; }

.footer-link { color: #404040; text-decoration: none;font-size: 14px; }
.footer-link:hover { color: #404040; text-decoration: underline; }
.footer-link-divider { display: inline-block; width: 14px; text-align: center; }

.footer-copyright { float: left; }
.footer-ve { float: right; }

@media screen and (min-width: 768px) and (max-width: 992px) {
    .footer-require-help { max-width: 425px;}
    .step-section-number,
    .step-section-name { font-size: 9.5px; }
}
@media screen and (max-width: 767px) {
    .footer-icons, .footer-require-help, .footer-links { float: none; text-align: center;margin-bottom: 0; }
    .footer-icons{ margin-bottom: 20px;}
    .footer-icons img { margin-left: auto; margin-right: auto; }
    .footer-copyright, .footer-ve { float: none; text-align: center; margin-bottom: 5px; }
    .footer-link-divider-terms-faqs{ display: block; visibility: hidden; height: 5px; }
    .footer{ background-color: #fff;}
}

@media screen and (max-width: 400px) {
    .footer-require-help{ padding-left: 11px; padding-right: 11px; margin-left: auto; margin-right: auto; }
    .footer { background-color: #fff; }
}
/* - - BUTTONS - - */
.btn { border: 1px solid; border-radius: 0; padding: 8px 25px; text-decoration: none; }
.btn:not(.dropdown-toggle) { font-family: "TMSans Regular";  }
.btn-arrow-left { padding-right: 0; padding-left: 15px; }
.btn-arrow-right { padding-right: 15px; padding-left: 0; }

.btn-primary { background-color: #414141; border-color: #414141; color: #FFF; font-size: 17px; }
.btn-primary:hover, .btn-primary:focus { background-color: #363636; border-color: #363636; color: #FFF; }

.btn-secondary { background-color: #024ddf; border-color: #024ddf; color: #FFF; font-size: 17px; }
.btn-secondary:hover, .btn-secondary:focus { background-color: #0238A3; border-color: #0238A3; color: #FFF; }
.btn#find-address { padding-left: 10px; padding-right: 10px;}

@media screen and (max-width: 400px) {
    .btn-add-another {white-space:normal;}
    .btn { padding: 8px 18px; }
    .btn-secondary{ font-size: 15px; }
}


.btn-tertiary { background-color: #e8e8e8; border-color: #e8e8e8; color: #414141; font-size: 15px; }
.btn-tertiary:hover, .btn-tertiary:focus  { background-color: #d4d4d4; border-color: #d4d4d4; color: #414141; }

.proceed-to-checkout-container .btn { width: 100%; max-width: 330px; }

.order-complete-buttons-container a.btn { font-size: 15px; padding-top: 8px; padding-bottom: 8px; width: 200px; }

/* - - PRODUCT AND DELIVERY - - */
.channel-hopper-container {
    display: flex;
    flex-wrap: wrap;
    margin-left: -5px;  /* Needs to mirror `.channel` padding */
    margin-right: -5px; /* Needs to mirror `.channel` padding */
    margin-top: 20px;
}

    .channel-hopper-container .channel {
        padding: 5px; /* Needs to mirror `.channel-hopper-container` left/right margin */
        flex: 1 0 0;
    }

        .channel-hopper-container .channel a {
            text-decoration: none;
        }

        .channel-hopper-container .channel .content {
            display: flex;
            align-items: center;
            justify-content: center;
            border: 2px solid #024ddf;
            height: 100%;
            padding: 10px;
            color: #024ddf;
        }

            .channel-hopper-container .channel .content .icon-container {
                flex-grow: .15;
            }

            .channel-hopper-container .channel .content .text-container {
                text-align: center;
            }

                .channel-hopper-container .channel .content .text-container .title {
                    margin-top: 0;
                    margin-bottom: 4px;
                }

                .channel-hopper-container .channel .content .text-container .supporting-text {
                    margin: 0;
                }

        .channel-hopper-container .channel.current .content {
            background-color: #024ddf;
            color: #ffffff;
        }

@media screen and (min-width: 768px) {
    .channel-hopper-container[data-channel-count="4"] .channel .content,
    .channel-hopper-container[data-channel-count="5"] .channel .content {
        flex-direction: column;
    }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    .channel-hopper-container[data-channel-count="3"] .channel .content {
        flex-direction: column;
    }
}

@media screen and (max-width: 767px) {
    .channel-hopper-container .channel {
        min-width: 100%;
    }
}

.product-price-and-delivery .title { font-size: 18px; margin-bottom: 0; margin-top: 10px;}

.product-price-and-delivery .title, .product-price-and-delivery .sub { height: 25px; padding-bottom: 20px; }
.product-price-and-delivery .sub { font-size: 15px; font-weight: normal; margin-bottom: 20px;}
.product-price-and-delivery .title.sub{ margin-bottom: 0;}
.product-price-and-delivery .title.sub{ margin-bottom: 0;}

.product-b2b-settings .title { font-size: 18px; margin-bottom: 0; margin-top: 10px;}
.product-b2b-settings .title, .product-b2b-settings .sub { height: 25px; padding-bottom: 20px; }
.product-b2b-settings .sub { font-size: 15px; font-weight: normal; margin-bottom: 20px; }
.product-b2b-settings .title.sub { margin-bottom: 0; }
.product-b2b-settings .title.sub { margin-bottom: 0; }
.product-b2b-settings hr { margin-top: 1rem; margin-bottom: 1rem; }
.product-b2b-settings .mid { margin-bottom:0px; display:inline-block; }
.product-b2b-settings .mid.sub { padding-left: 1rem; padding-right: 1rem; }
.product-b2b-settings { margin-top:1rem; }

@media screen and (min-width: 768px) and (max-width: 992px) {
    .product-price-and-delivery .sub{ font-size: 12px;}
    .input-with-inset-text-container .input-inset-text{ top: 80px; }
}

.message-characters-remaining { text-align: right; font-size: 12px; margin-bottom: 20px; margin-top: 5px; }
.preview-button-container { text-align: right; }

@media screen and (max-width: 400px) {
    .product-price-and-delivery .sub { margin-bottom: 10px; }
}

@media screen and (min-width: 993px) {
    .specific-amount-container .title.sub { width: 110%; }
    .product-price-and-delivery .col-md-3{ padding-left: 10px;padding-right: 10px;}
}
@media screen and (min-width: 767px) and (max-width: 992px) {
    .delivery-charges-container { margin-top: 15px; }
}
@media screen and (max-width: 767px) {
    .product-price-and-delivery .title, .product-price-and-delivery .sub { height: auto; padding-bottom: 0; }
    .language-selection-container .title { padding-bottom: 15px; }
    .product-price-and-delivery .col-xs-12 { margin-bottom: 15px; }
}
#message{ height: 109px; resize: vertical; }
.message-characters-remaining { text-align: right; font-size: 12px; margin-bottom: 20px; margin-top: 5px; }
.preview-button-container { text-align: right; }

.form-group { margin-bottom: 14px; }
.form-group .info-popup-link { margin-left: 5px; }
.form-horizontal .control-label.text-left { text-align: left; padding-right: 0; }

.form-control, .form-control .dropdown-toggle { border-radius: 0; border: 1px solid #ccc; height: 40px; background: #fff; box-shadow: none; padding: 6px 12px; }

@media screen and (max-width: 767px) {
    .form-title-container .dropdown-toggle { width: 63%; }
}

.dropdown-toggle, .dropdown-toggle:active, .dropdown-toggle:focus, .dropdown-menu li a, .dropdown-menu li a:active, .dropdown-menu li a:focus { outline: none !important; }
.dropdown-toggle .bs-caret { display: none; }
.dropdown-menu { border-radius: 0; border: 1px solid #ccc; padding: 0; margin-top: -1px; }
.dropdown-menu li a { padding: 5px 12px !important; border-bottom: none; }
.dropdown-menu li.selected a { background: #fff; }
.dropdown-menu li a:hover { background: #024ddf; color: #fff; }
.dropdown-menu .dropdown-header { display: none; }
.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active,
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholderfind-address:hover { color: #404040; }


.field-validation-error { color: #ed1c24;}
.input-validation-error, .definitely-not-valid, .input-validation-error ~ .dropdown-toggle { border-color: #ed1c24; }

.form-control:focus,
.form-control.valid:focus {
    border-color: #024ddf;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,156,222,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,156,222,1);
    box-shadow: 0px 0px 5px 0px rgba(0,156,222,1);
}

.form-control.valid[readonly] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.form-control.input-validation-error:focus,
.form-control.definitely-not-valid:focus {
    border-color: #ed1c24;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(237,28,36,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(237,28,36,1);
    box-shadow: 0px 0px 5px 0px rgba(237,28,36,1);
}

.form-control.input-validation-error[readonly],
.form-control.definitely-not-valid[readonly]
 {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.form-control.hasDatepicker { width: 86%; display: inline-block; margin-right: 15px; background-color: #FFFFFF; }
.form-control.hasDatepicker:hover, .ui-datepicker-trigger:hover { cursor: pointer; }

.ui-datepicker-trigger { position: relative; top: -4px; }

@media screen and (max-width: 767px) {
    .form-control.hasDatepicker { width: 80%; display: inline; margin-right: 0; }
    /*.form-control.hasDatepicker + .ui-datepicker-trigger img { display: none; }*/
    img.ui-datepicker-trigger{display: inline; margin-left: 10px;}
}

.delivery-date-container { padding: 10px 0; }
.delivery-date-time-label { margin-bottom: 10px; }

#deliveryDateTextbox:read-only, #deliveryDateTextbox-standard:read-only, #deliveryDateTextbox-named:read-only {
    background-color: unset;
    cursor: pointer;
}

.form-control::-ms-clear { display: none; width:0; height:0; }
.form-control.valid::-ms-clear { display: none; width:0; height:0; }
.form-control.valid:focus::-ms-clear { display: none; width:0; height:0; }

label { font-weight: normal; }

input[type="radio"].rbx, input[type="checkbox"].cbx { display: none; }
input[type="radio"].rbx ~ img, input[type="checkbox"].cbx ~ img { pointer-events: none; }
input[type="radio"].rbx ~ .image-radio-off, input[type="checkbox"].cbx ~ .image-checkbox-off { display: inline-block; }
input[type="radio"].rbx ~ .image-radio-on, input[type="checkbox"].cbx ~ .image-checkbox-on { display: none; }
input[type="radio"].rbx:checked ~ .image-radio-off, input[type="checkbox"].cbx:checked ~ .image-checkbox-off { display: none; }
input[type="radio"].rbx:checked ~ .image-radio-on, input[type="checkbox"].cbx:checked ~ .image-checkbox-on { display: inline-block; }
.radio-option-container:hover, .checkbox-option-container:hover, label.rbx:hover, .checkbox-label-container label:hover { cursor: pointer; }
.checkbox-label-container label { position: relative; top: -3px; }

.send-now-option-container { margin-bottom: 5px; }
@media screen and (max-width: 767px) {
    .send-now-option-container { margin-bottom: 10px; }
}
@media screen and (max-width: 400px) {
    .checkbox-option-container{ margin-top: 10px;}
    .col-xs-11.checkbox-label-container { padding-left: 25px; }
}

.delivery-charge { font-size: 15px; padding-top: 5px; line-height: 15px;}
.delivery-charge-title { display: inline-block; width: 70%; max-width: 160px; }
.delivery-charge-amount { display: inline-block; width: 30%; }

.delivery-option { margin-top: 8px; }
.delivery-option-left { float: left; padding-right: 8px; }
.delivery-option-right { cursor: pointer; }
.delivery-option-named .delivery-option-right { padding-top: 11px; }
.named-del-input-container { margin-top: 8px; }
.delivery-option-right label { font-weight: normal; display: initial; }
.delivery-option-right span.sub { display: block; }

.dateInner input.form-control { display: inline-block; width: 75%; }
.dateInner img.ui-datepicker-trigger { display: inline-block; width: 10%; margin-left: 2.5% }

@media screen and (max-width: 450px) {
    .dateInner img.ui-datepicker-trigger { width: 20%; }
}

.chooseProductPaymentButton { padding-top: 250px; }
.chooseEVoucherProductPaymentButton { padding-top: 30px; }

.owlNavLeft, .owlNavRight { cursor: pointer; height: 150px; }

@media screen and (min-width: 768px) and (max-width: 992px) {
    .owlNavLeft, .owlNavRight { height: 190px; }
}

.owlNavLeft, .owlNavLeftEmail { background: url('flexise-button-previous.png') no-repeat center center; }
.owlNavRight, .owlNavRightEmail { background: url('flexise-button-next.png') no-repeat center center; }

.owl-item { text-align: center; }
div.owl-item .card.item { text-align: center; margin: 0 auto; float: none; }
div.owl-item .wallet.item { text-align: center; margin: 0 auto; float: none; }
div.owl-item button.item { padding: 0; background: transparent; border: none; }
.owl-theme .owl-controls { width: 100%;}
.owl-theme .owl-controls .owl-page span { background-color: #404040 !important; }
div.owl-controls div.owl-pagination { margin: 0 auto; width: 100%; overflow: visible; text-align: center; float: none;  }
.card.item img, .wallet.item img { border: 2px solid #ffffff; margin: auto; padding: 4px; }
.item.outlined img { border: 2px solid #024ddf; border-radius: 10px; }
.owl-pagination { display: none; }
.owl-carousel-items-container { padding-left: 0; padding-right: 0; }
#no-product-selected { clear: both; }

@media screen and (min-width: 768px) {
    .row.owlHolder { margin-bottom: -15px }
}
@media screen and (max-width: 400px) {
    div.owlHolder div.col-xs-10 { width: 80%; }
    .col-xs-1.owlNavLeft.cards { width: 9%; }
}

.input-with-inset-text-container .input-inset-text { position: absolute; top: 80px; left: 25px; color: #555; font-weight: normal; }
.input-with-inset-text-container .input-with-inset-text { padding-left: 30px; }
@media screen and (max-width: 400px) {
    .input-with-inset-text-container .input-inset-text { top: 63px; }
}

@media screen and (min-width: 400px) and (max-width: 767px) {
    .input-with-inset-text-container .input-inset-text { top: 73px; }
}

.dont-break-out-card-message { max-width: 350px; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; }

.required-fields-label { float: right; padding-top: 8px; }

/* - - Find address  - - */

#reset-address { display: none; }
#reset-address-button:hover { text-decoration: none; cursor: pointer; }

.find-address-buttons { padding-left: 0; }
.find-address-buttons .btn, .basket-totals-row .btn-add-another, .add-more-items-mobile .btn-add-another, .complete-payment-buttons-container .btn { width: 100%; }
.find-address-buttons .btn, .basket-totals-row .btn-add-another, .add-more-items-mobile .btn-add-another { font-size: 15px; padding-top: 9px; }
.add-more-items-mobile .btn-add-another, .complete-payment-buttons-container .btn:not(.pay-by-bacs) { max-width: 190px; }
.basket-totals-row .btn-add-another{ max-width: 320px; padding-right: 10px; padding-left: 10px; }

.afd-typeahead-container {
    font-size: small;
    font-family: inherit;
}

.afd-typeahead-container .afd-typeahead-result .afd-typeahead-list {
    background-color: #fafafa;
}

.afd-typeahead-container .afd-typeahead-result .afd-typeahead-item {
    border-top: none;
}

.afd-typeahead-container .afd-typeahead-result.active {
    background-color: #f0f0f0;
}

@media screen and (max-width: 400px) {
    .find-address-buttons{ padding-top: 10px; padding-left: 15px; }
    .find-address-button-container{ margin-right: -15px;}
}

@media screen and (max-width: 992px) {
    .find-address-button-container .btn { background-position: right 8px center }
}
@media screen and (max-width: 767px) {
    .find-address-buttons{ padding-top: 10px; padding-left: 15px; }
    .postcode-container .find-address-buttons { padding-left: 0; }
}

/*CONTAINERS*/
#productCarouselContainer, #walletCarouselContainer {
    margin-left: 0;
}

/* MEDIA QUERIES */

@media screen and (min-width: 768px) and (max-width: 992px) {

    .card.item img {
        margin: 0;
    }
}

@media screen and (min-width: 480px) and (max-width: 767px) {

    .card.item img {
        float: left;
    }

    #walletCarouselContainer > .owl-carousel-items-container {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    div.owl-item .card.item > .img-responsive {
        float: left;
    }
}


.enter-address-manually-container, .reset-address-container { margin-top: 10px; }

.message-and-delivery .title { margin-bottom: 0; }
.message-and-delivery .title + .sub { font-size: 14px; margin-bottom: 14px; }
.message-and-delivery .sub label { margin-bottom: 0; }

.select-delivery-date-container .row:not(#requestedDeliveryDateContainer) { margin-bottom: 15px; }
.select-delivery-date-container .requested-delivery-date { padding-left: 15px; margin-top: -10px; padding-bottom: 15px; }

@media screen and (max-width: 767px) {
    .select-delivery-date-container .title + .sub { margin-bottom: 0; }
}

.delivery-details-header, .title.message-title { margin-bottom: 10px; }
#delivery-details .message-title label { margin-bottom: 0; cursor: text; }
.delivery-details-container .title { display: inline-block; margin-bottom: 22px; }
.select-previous-address-container .col-sm-1.col-xs-2 { padding-right: 0; }

.proceed-to-checkout-container { margin: 15px 0 35px 0; text-align: right; }
    .proceed-to-checkout-container .btn-add-another { margin-right: 15px; padding-left: 13px; padding-right:13px; }
.requestedDeliveryTitle { font-size: 14px; }
@media screen and (max-width: 767px) {
    .proceed-to-checkout-container { text-align: center; }
    .proceed-to-checkout-container .btn { display: block; margin: 0 auto; }
    .proceed-to-checkout-container .btn-add-another { margin-bottom: 15px; }
    .requestedDeliveryTitle span { display: block; }
}
@media screen and (max-width: 400px) {
 
    .proceed-to-checkout-container { margin-bottom: 0; }
}

.table { margin-bottom: 22px; }
.table thead tr th, .table tbody tr td { padding-left: 0; }

.table thead tr th { padding: 0 5px 7px 10px; }
.table tbody tr td { padding: 15px 5px 15px 10px; }
.table tbody tr.basket-delivery-totals-row td { padding-top: 17.5px; padding-bottom: 17.5px; }

.table tbody tr.item-in-combined-delivery:not(.final-combined-delivery-item) { border-bottom: none; }
.table tbody tr.item-in-combined-delivery:not(.final-combined-delivery-item) td { padding-bottom: 0; }

.basket-lines-container.desktop { display: block; }
.basket-lines-container.mobile { display: none; }

@media screen and (max-width: 767px) {
    .basket-lines-container.desktop { display: none; }
    .basket-lines-container.mobile { display: block; }
}

.basket-lines-container thead tr th, div.basket-lines-container tbody tr td { border-left: none; }
.basket-lines-container thead tr th, div.basket-lines-container tbody tr:not(.basket-totals-row) td { border-right: 1px solid #DCDDDE; }
.basket-lines-container thead tr th { border-bottom: none; font-weight: normal; }
.basket-lines-container thead tr th:first-child, div.basket-lines-container tbody tr td:first-child { padding-left: 0; }
.table tbody tr.basket-totals-row:not(.basket-delivery-totals-row) td { padding-top: 8px; padding-bottom: 8px; }
.basket-lines-container thead tr th:last-child, div.basket-lines-container tbody tr td:last-child { border-right: none; }
.basket-lines-container thead tr { border-bottom: 1px solid #DCDDDE; }
.basket-lines-container tbody tr td { border-top: none; }
.basket-lines-container tbody tr td:last-child { border-right: none; }
.basket-lines-container tbody tr { border-bottom: 1px solid #DCDDDE; }

.table tbody tr td { padding-right: 15px; padding-bottom: 15px; }
.table tbody tr td.basket-line-product-cell { padding-right: 0; }

.basket-table-address { margin: 10px 0; }
.basket-table-quantity { margin-top: 10px; }
.basket-table-orderid { margin-bottom: 10px; }
.basket-lines-container tbody tr td.basket-line-buttons { padding-right: 0; }
.basket-item-image{ height: 92px;}

.total-label-cell, .total-value-cell:not(.confirmation-totals-cell), .basket-totals-mobile:not(.basket-delivery-totals-row), .ordercomplete-totals-mobile {font-size: 23px;font-family: "TMSans Regular";white-space: nowrap;}
.table tbody tr.basket-totals-row td.total-label-cell, .table tbody tr.basket-totals-row td.total-value-cell { padding-top: 15px; }
.total-label-cell, .basket-totals-delivery-label-cell { text-align: right; }
.total-label-cell .btn-add-more { float: left; }
.table tbody tr td.total-value-cell { padding-right: 65px; }
.table tbody tr td.total-value-cell .title { font-size: 23px;}
.body-container-action-ordercompletethankyou .total-value-cell { font-family: "TMSans Bold" }
.body-container-action-ordercompletethankyou .total-value-cell .total-promo-savings { font-family: "TMSans Regular"; font-size: 15px; }

.billing-info-cell { max-width: 250px; }
.billing-info-cell p { margin-bottom: 8px; line-height: 15px; }
.billing-info-cell .billing-details, .billing-info-cell .totals-labels { padding-top: 7px; }
.billing-info-cell .billing-details { float: left; max-width: 70%; }
.billing-info-cell .totals-labels { float: right; }
.billing-info-cell .totals-labels label { display: block; }

.billing-info-row p { margin-bottom: 5px; }
.order-complete-contact-details p{ margin-bottom: 10px;}
.order-complete-contact-details .title { font-family:"TMSans Regular"}
.payment-basket-items-mobile .row, .ordercomplete-basket-items-mobile .row, .basket-totals-mobile, .add-more-items-mobile { border-bottom: 1px solid #DCDDDE; padding-bottom: 15px; margin-bottom: 15px; }
.payment-basket-items-mobile .col-xs-5 { padding-right: 25px; }
.payment-basket-items-mobile .col-xs-7 { padding-left: 5px; }
.basket-totals-mobile .total-label { text-align: right; }
.ordercomplete-totals-mobile .total-label, .ordercomplete-physical-totals-mobile .total-label { text-align: right; }
.ordercomplete-physical-totals-mobile .title { margin-bottom: 0; margin-top: 5px; }

.basket-table-address, .basket-table-message { max-width: 385px; }

@media screen and (max-width: 767px) {
    .basket-totals-mobile .col-xs-7 strong { padding-left: 30px; }
}

.basket-line-buttons, .add-more-items-mobile { text-align: center; }
.basket-line-buttons .btn { padding-left: 0; padding-right: 0; width: 90px; margin-bottom: 10px; }
.payment-basket-items-mobile .basket-line-buttons .btn { margin: 0 5px; }

.confirmation-totals-cell .title { margin-top: 5px; }

.TnC, .TnC label { font-weight: normal; }

.paymentCompleteButton { margin-top: 20px; }

#preview{ font-size: 15px; }
#previewPopup { border: 1px solid #C9C9C9; display: none; background-color: #FFF; position: absolute; z-index: 101; line-height: initial; padding: 40px; width: 800px; }
#previewPopupHolder { border: 1px solid #C9C9C9; padding: 20px; }

@media screen and (min-width: 993px) {
    #previewPopup {
        left: 50%;
        -webkit-transform: translate(-50%, -30%);
        -moz-transform: translate(-50%, -30%);
        -ms-transform: translate(-50%, -30%);
        -o-transform: translate(-50%, -30%);
        transform: translate(-50%, -30%);
    }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    #previewPopup { left: 10px; }
}

#previewPopupClose { position: absolute; right: 2px; top: 10px; width: 30px; height: 30px; cursor: pointer; }
#previewPopup_BackgroundOverlay { position: absolute; width: 100%; height: 200%; left: 0; top: 0; z-index: 100; background-color: #404040; opacity: .5; filter: alpha(opacity=60); }

#SecurityPopupLink { cursor: pointer; }

.MessagePopup { position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: none; max-width: 400px; padding: 10px; z-index: 10000001; border: 1px solid #024ddf; background: #fff; -webkit-box-shadow: 10px 10px 10px 1px rgba(0,0,0,0.1); -moz-box-shadow: 10px 10px 10px 1px rgba(0,0,0,0.1); box-shadow: 10px 10px 10px 1px rgba(0,0,0,0.1); }

.same-address-checkbox-container, .same-address-dropdown-container { margin-bottom: 5px; }

.payment-form-fields-container { padding-bottom: 150px; }
#payment-details{ margin-top: -40px;}

@media screen and (min-width: 451px) and (max-width: 767px) {
    #payment-details{ margin-top: 30px;}
    .subscribe-main-text .TnC { padding-left: 15px;}
    .accept-terms-container .TnC{ padding-left: 25px; padding-top: 6px;}
    .OptIn, .OptOut{ padding-top: 8px; padding-left: 10px; }
}

@media screen and (max-width: 450px) {
    #payment-details{ margin-top: 30px;}
    .payment-form-fields-container { padding-bottom: 0; }    
    .accept-terms-container .TnC{ padding-left: 25px; padding-top: 6px;}
    .subscribe-main-text .TnC{ padding-left: 15px;}
    .OptIn, .OptOut{ padding-top: 10px; padding-left: 10px; }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    #payment-details{ margin-top: 0;}
    .payment-form-fields-container { padding-bottom: 50px; }
    .OptIn, .OptOut{ padding-left: 10px; }
    .accept-terms-container .TnC{ padding-left: 25px;}
}

@media screen and (min-width: 768px) {
    .split-phone-number-with-validate .countrycode-container { padding-right: 0; }
}

.mandatory-fields-message { padding-left: 0; }

.complete-payment-buttons-container .btn:not(.pay-by-bacs) { width: 47.5%; }
.complete-payment-buttons-container .btn-pay-by-card { float: left; }
.complete-payment-buttons-container .btn-pay-by-paypal { float: right; }

@media screen and (max-width: 767px) {
    .complete-payment-buttons-container .btn { width: 190px; display: block; margin-left: auto; margin-right: auto; }
    .complete-payment-buttons-container .btn-pay-by-card, .complete-payment-buttons-container .btn-pay-by-paypal { float: none; }
    .complete-payment-buttons-container .btn-pay-by-card { margin-bottom: 15px; }
}

/* iPhone 6 Plus */
@media only screen
  and (min-device-width: 414px)
  and (max-device-width: 736px)
  and (-webkit-min-device-pixel-ratio: 3){ 
    .accept-terms-container .TnC, .OptIn, .OptOut{ padding-top: 0;} 
}

.accept-terms-validation-message { margin-top: 10px; }
.subscribe-terms-validation-message{ margin-bottom: 10px;}
.accept-terms-validation-message .editor-label { margin-bottom: 0; }
.payment-terms-tick-message{ font-size: 14px;}
.payment-terms-title{ margin-top: 20px; }

#braintree_PayByCard, button.pay-by-bacs { padding-left: 5px; padding-right: 5px; font-size: 14px; line-height: 1; }
button.pay-by-bacs { height: 48px; }
.braintree-wrapper { padding-left: 0; padding-right: 0; }
.braintree-hosted-fields .form-group { margin-left: 0; margin-right: 0; }
.braintree-hosted-fields-buttons .btn-link { border: none; margin-left: 0 !important; }
.braintree-hosted-fields-buttons .btn-primary { margin-right: 0 !important; }
.gpay-button-fill, .gpay-button-fill > .gpay-button { height: 100% !important; }
#braintree_PayByPayPal, button.pay-by-lpm { border: none; background-color: #f3f3f3; }

#braintree_PayByCard, #braintree_PayByPayPal, #braintree_GooglePayButtonPlaceholder, #braintree_ApplePayButtonPlaceholder, button.pay-by-lpm, button.pay-by-bacs { height: 42px; }

@media screen and (min-width: 768px) {
    #braintree_PayByCard, #braintree_PayByPayPal, #braintree_GooglePayButtonPlaceholder, #braintree_ApplePayButtonPlaceholder, button.pay-by-lpm, button.pay-by-bacs { flex: 0 0 32% !important; max-width: 32% !important; margin: 0 1% 1% 0 !important; }
    .braintree-hosted-fields-buttons .btn-link { margin-right: 3% !important; }
}

@media screen and (max-width: 767px) {
    #braintree_PayByPayPal, button.pay-by-lpm { padding-top: 0; padding-bottom: 0; }
}

@media print {
    .hidden-on-print { display: none !important; }
    .visible-on-print { display: initial !important; }
}

#PromoCode { width: 50%; float: left; margin-right: 10px; }
#PromoCode.valid { background: none; }
.promoCode-validation-error { display: inline-block;}

@media screen and (max-width: 767px) {
    #PromoCode { width: 100%; float: none; margin-right: 0; margin-top: 10px; margin-bottom: 10px; }
}

td.promos-container { padding-left: 0 !important; padding-right: 0 !important; }

.promo-code-label { display: inline-block; width: 80px; }
.promo-input-container { display: inline-block; width: 230px; }

@media screen and (max-width: 767px) {
    .promo-code-label { display: block; width: 100%; font-size: 18px; }
}

.order-complete-header { margin-top: 5px; margin-bottom: 30px; text-align: center; }
.order-complete-header .title { margin-bottom: 5px; }
.order-complete-header p { font-size: 15px; }
.order-complete-header .octy-b2b-egift-text { padding: 0 5rem; }

.order-complete-contact-details { margin-bottom: 15px; }
.order-complete-buttons-container { text-align: right; margin-top: 35px; margin-bottom: 60px;font-size: 15px;font-weight: bold;}

@media screen and (max-width: 767px) {
    .order-complete-buttons-container { text-align: center; margin-bottom: 0;}
    .order-complete-buttons-container .btn { margin-bottom: 15px; }
}

/* - - ACTIVATION - - */
.activation-form { text-align: center; margin-bottom: 50px; }

.activation-form .title { margin-bottom: 0; font-size: 22px; }
.activation-form .subtitle, .activation-form .small-title { font-size: 18px; font-family: Arial;  }
.activation-form .big-title { font-size: 28px; line-height: 28px; color: #024ddf; margin-top: 20px; }

.activation-form .small-title { font-size: 22px; line-height: 24px; color: #024ddf; }
.activation-form .form-control { max-width: 425px; margin: 0 auto; font-size: 15px; }
.activation-form .submit-button-container .btn { min-width: 140px; padding: 5px 30px;}
.activation-form .submit-button-container .btn-arrow-right { padding-right: 45px; }
.activation-form .activation-information { color: #024ddf; font-weight: normal;margin-bottom: 10px;}
.activation-form .redeem-card-number { padding-right: 20px; text-align: right; }
.activation-form .redeem-serial-number { padding-left: 40px; text-align: left; }
.activation-form .item-particulars { font-family: "TMSans Bold"; text-align: left; margin-top: 75px; }
.activation-form .claim-on-device { margin-top: 30px; }

@media screen and (min-width: 768px) {
    .activation-form .item-particulars { margin-left: -15px; }
}

@media screen and (max-width: 400px) {
    .activation-form { margin-bottom: 10px; }
    .activation-form .redeem-card-number { padding-right: 15px; text-align: center; width: 100%; }
    .activation-form .redeem-serial-number { padding-left: 15px; text-align: center;padding-top: 20px; width: 100%; }
    .activation-form .subtitle, .activation-form .small-title { font-size: 15px;  }
    .activation-form .big-title{ font-size: 22px; }
    .big-title-line2{ display: block; }
    #activationPage_ThankYou .activation-form .big-title{ font-size: 22px; margin-top: 0; }
    #activationPage_Index .activation-form .submit-button-container .btn { width: 168px; height: 50px; line-height: 40px;}
    #activationPage_ThankYou .activation-form .submit-button-container .btn { height: 40px; line-height: 30px;}
}

#activationPage_ThankYou .activation-form { margin-bottom: 5px; }
#activationPage_ThankYou .activation-form .submit-button-container .btn { background-color: #d0006f; border: 1px solid #d0006f;font-weight: bold; }
#activationPage_ThankYou .activation-form .small-title, #activationPage_ThankYou .activation-form .title{ font-size: 20px;font-weight: normal;}
#activationPage_ThankYou .activation-form .big-title { font-size: 53px; line-height: 53px;font-weight: bold; margin-top: 0; }

/* - - Helpers - - */
.no-pad-right {
    padding-right: 0;
}
/* - - PayPAl - - */
#paypal {
    margin-top: 30px;
}

.payment-tabs .btn-tertiary {
    width: 100%;
    font-size: 15px;
    font-weight: normal;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #2e2d2c;
    text-decoration: none;
}
#paypal-tab {
    position: relative;
    z-index: 100;
}
#paypal-icon {
    height: 23px;
    position: absolute;
    top: 8px;
    right: 25px;
}
.paypal-normal {
    padding-right: 40px;
}
.paypal-mobile {
    padding-right: 50px;
}

/* - - Releax Embedded Tabs - - */
.tab-left, .tab-right {
    display: block !important;
    width: 50% !important;
}
.tab-left {
    padding-right: 10px;
    float: left !important;
}
.tab-right {
    float: right !important;
}
.tab-left.active .btn-tertiary, .tab-right.active .btn-tertiary {
    background: #0238A3;
    color: white;
}
#paypalImage {
    padding-top: 30px;
}


/* - - Popup Screens - - */
.popup-body .title{ color: #024ddf; font-size: 28px; }
.popup-body .page-container{ padding-bottom: 20px;}

/* - - Realex / SecurePay iFrame - - */
.realex-iframe, .securepay-iframe {
    z-index: 10000;
    padding: 0 0;
    border: none;
    height: 800px;
}

/*.secure-pay-container iframe {
    border: none;
    width: 100%;
    min-height: 250px;
    padding-top: 20px;
}*/

.fz-iframe-container img {
    margin: 10px auto 0 auto;
}

/*Cropic*/

#croppic {
    position: relative;
    margin: 0;
    border: 1px solid black;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    border-radius: 2px;
    background-repeat: no-repeat;
    background-position: center;
    float: right;
    max-width: 100%;
}

.cropControls {
    height: 40px;
    left: 0;
    padding-left: 10%;
    background-color: #333333;
    bottom: 0;
    top: unset;
}

.cropControls i {
    width: 60px;
    height: 40px;
}

.cropControlCrop {
    display: none !important;
}

.cropControlReset {
    position: absolute;
    right: 0;
    width: 40px !important;
    height: 40px !important;
}

.cropControlReset {
    background-image: url(fieldError.png) !important;
    background-repeat: no-repeat;
    background-position: center !important;
}

.cropControlZoomIn {
    background-image: url(zoomin.png) !important;
    background-repeat: no-repeat;
    background-position: center !important;
}

.cropControlZoomOut {
    background-image: url(zoomout.png) !important;
    background-repeat: no-repeat;
    background-position: center !important;
}

.cropControlRotateLeft {
    background-image: url(rotateleft.png) !important;
    background-repeat: no-repeat;
    background-position: center !important;
}

.cropControlRotateRight {
    background-image: url(rotateright.png) !important;
    background-repeat: no-repeat;
    background-position: center !important;
}

.upload-button {
    height: 50px;
    width: 50px;
    margin-right: 15px;
    cursor: pointer;
}

.upload-button-container .btn {
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
    width: 440px !important;
}

.upload-choices {
    margin-top: 30px;
}

.upload-choice {
    padding: 8px;
    background-color: #f1f1f1;
    margin-top: 20px;
    margin-bottom: 20px;
    cursor: pointer;
    z-index: 10;
}

.upload-choice-label {
    cursor: pointer;
    margin-bottom: 0;
}

#personalisationUploadLoadingSpinner {
    position: absolute;
    top: 47%;
    left: 47%;
}

.file-input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.custom-image {
    padding: 10px;
    max-width: 150px;
}

.personalisation-toggle label {
    font-weight: normal;
    font-size: 15px;
    font-family: "TMSans Regular", Arial, sans-serif, Helvetica, Sans-Serif;
    color: #414141;
}

.personalisation-toggle label img,
.upload-choices .checkbox-option-container img {
    margin-right: 5px;
}

@media (min-width: 768px) {
    .personalisation-toggle {
        display: inline;
        float: right;
    }

    .upload-button-container .btn {
        width: 50% !important;
    }
    
    .upload-button-container {
        margin-top: 15px;
        text-align: right;
    }

    #PromoCode, #applyPromo {
        width: auto;
    }
}

@media (max-width: 767px) {
    .personalisation-toggle {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .upload-button-container .btn {
        width: 100% !important;
    }

    .upload-choices {
        width: 100%;
    }

    .upload-choices .checkbox-option-container img,
    .upload-choices .checkbox-option-container span {
        position: relative;
        display: inline-block;
    }

    .upload-choices .checkbox-option-container img {
        top: -10px;
    }

    .upload-choices .checkbox-option-container span {
        max-width: 85%;
    }

    #croppic {
        float: none;
        margin-top: 40px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 40px;
    }

    .upload-button-container {
        margin-bottom: 30px;
        text-align: center;
    }

    .upload-save-button {
        position: relative;
        margin: 0 auto;
        display: block;
    }

    .upload-remove-button {
        position: relative;
        margin: 0 auto;
        display: block;
    }
}

.information-banner {
    /* Rest of styling in information-banner.css */
    background-color: #024ddf;
    font-size: 12px;
}

@media screen and (max-width: 991px) and (min-width: 768px) {
    .basket-item-image {
        max-width: 180px;
        height: auto;
        padding-right: 0.5em;
    }

    .text-wrap-normal {
        white-space:normal;
    }
}

.scam-warning-div {
    margin: 10px;
    margin-left: 40px;
    padding: 5px;
    font-size: 12px;
}

.skip-to-content a {
    z-index: 100;
    position: absolute;
    top: -100px;
    left: 0px;
    background-color: white;
    border: 1px solid #009cde;
    padding: 6px;
    margin: 6px;
}

.skip-to-content a:focus {
    top: 0px;
}