/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */
:root {
    --font-family: 'GothamBook', sans-serif;
    --link-colour: '#D6A4AB';
    --store-divider: '#D6A4AB';
    max-width: 100%;
}

a {
    color: var(--link-colour);
}

a:hover {
    color: var(--link-colour);
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #00d1d2;
}

main a {
    color: #712958;
}

#cookies-termsConditions a {
    color: #712958;
}


.btn-primary:not(:disabled):not(.disabled):active {
    background-color: #00587C !important;
    border-color: #4C1739 !important;
}

.btn-primary.focus, .btn-primary:focus {
    box-shadow: 0 0 0 0.2rem rgb(113 41 88 / 50%);
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #712958;
    border-color: #712958;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 13px;
}

@media (min-width: 768px) {
    html {
        font-size: 13px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
}

.field-validation-error {
    font-weight: bolder;
    font-size: 12px;
    color: red;
}

/*
.cookie-text {
    font-family: var(--font-family);
}
*/

.consent-btn {
    color: white;
}

.i-accept {
    color: white;
}

.age-confirmation {
    /*font-family: var(--font-family);*/
    color: #FFF;
    font-size: 25px;
    margin-bottom: 5px;
    text-transform: uppercase;
    font-weight: bolder;
}

.age-plus {
    /*font-family: var(--font-family);*/
    font-size: 25px;
    font-weight: bolder;
    color: #FFF;
}

.prod-info {
    font-family: var(--font-family);
    font-size: 11px;
    margin-top: 30px;
    margin-left: 40px;
    margin-right: 40px;
}


#btnNo {
    width: 100px;
    color: #fff;
    text-transform: uppercase;
    /*border-radius: unset;*/
    border-color: #fff;
    font-size: 20px;
    font-weight: bold;
}

#btnYes {
    width: 100px;
    color: #fff;
    margin-right: 15px;
    text-transform: uppercase;
    /*border-radius: unset;*/
    border-color: #fff;
    font-size: 20px;
    font-weight: bold;
}


.top-heading {
    font-size: 28px;
    /*font-family: var(--font-family);*/
    font-weight: bold;
}

body {
    /* Margin bottom by footer height */
    /*margin-bottom: 60px;
    max-width: 100%;*/
    font-family: var(--font-family);
    background-color: #fff;
}

.container {
    padding-right: 0px;
    padding-left: 0px;
}

.phone-email {
    padding-bottom: 10px;
}

.footer {
    position: relative;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.footer-text {
    font-family: var(--font-family);
    margin-top: 15px;
    font-size: 8px;
    color: #000;
}

a.f-links {
    color: #712958;
}

#logoD {
    width: 100%;
    height: 70%;
}

#bodyD {
    width: 70%;
    height: 70%;
    margin-right: 50px;
}

input[type=checkbox] {
    -ms-transform: scale(1); /* IE */
    -moz-transform: scale(1); /* FF */
    -webkit-transform: scale(1); /* Safari and Chrome */
    -o-transform: scale(1); /* Opera */
    transform: scale(1);
    vertical-align: text-bottom;
}

.send-voucher-button {
    color: black;
    /*font-family: var(--font-family);*/
    font-size: 18pt;
    border: 1px solid #fff;
}

.send-voucher-button :hover {
        background-color:red;
        color:red;
    }

.trademark {
    color: #F40009;
}

.popup-logo {
    width: 100%;
}

.policy-links {
    margin: auto;
    padding: 10px;
    text-align: center;
}

#main-container {
    /*background-color: #FFF;
    font-family: var(--font-family);*/
    font-size: 18px;
    /*padding-left: 10px;
    padding-right: 10px;*/
}

#pop-up-container {
    margin-left: auto;
    margin-right: auto;
    width: max(60%, 400px);
    
}

.logo-container {
    padding-right: unset !important;
    padding-left: unset !important;
}

.success-image {
    margin-left: 40px;
    margin-bottom: 20px;
}

.success-right-img {
    margin-right: 50px;
    margin-bottom: 20px;
    height: 520px;
}

.error-image {
    margin-left: 40px;
    margin-bottom: 20px;
    position: absolute;
    top: 0;
}

#cookie-btn {
    padding-right: 20px;
}

.modal-footer {
    padding-top: 0px;
}

.modal-body {
    /*background-color: #000;*/
    color: #FFF;
    font-size: 25px;
}

a .btn {
    font-size: 25px;
}

.modal-dialog {
    margin-top: 0rem;
    max-width: 100%;
}  
.modal-content {
    border-radius: 0rem;
  }
  
  .buttons .btn {

      margin: 0.2rem;
    
  }


.error-message-div {
    background-image: url('../images/pop-up-background.png');
    width: 1000px;
    height: 1000px;
    background-repeat: no-repeat;
}

.error-message-hex {
    position: relative;
    width: 100%;
}

.error-message-image {
    max-width: 100%;
}


.error-message {
    color: #F40009;
    /*position: absolute;*/
    text-align: center;
    font-size: 32px;
    /*top: 180px;
    left: 0;
    width: 100%;
    padding-left: 70px;
    padding-right: 70px;
    font-weight: bolder;*/
}

.error-message-TCs {
    color: #F40009;
    text-align: center;
    font-size: 21px;
    /*top: 340px;
    left: 0;
    width: 100%;
    padding-left: 70px;
    position: absolute;
    padding-right: 70px;
    font-weight: bolder;*/
}

.popup-btn-div {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.alert-msg {
    background-color: #E55555 !important;
    color: #FFF !important;
    display: none;
}

.terms-error {
    padding-top: 10px;
}

.margin-left-3 {
    margin-left: 3px;
}

#cookies-termsConditions {
    margin-top: 3vh !important;
    margin-left: 10px;
    margin-right: 10px;
}

#cookies-termsConditions h5 {
    margin-top: .5rem;
}

#cookies-termsConditions ol li {
    margin-left: 2rem;
}


#cookies {
    margin-top: 10vh !important;
}

#ageGate {
    top: 65px;
}

@media only screen and (max-width: 576px) {

    .modal-footer{
        padding-bottom: 8px;
    }

    .popup-logo {
        width: 100%;
    }

    .popup-btn-div {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    #ageGate {
        top: 75px;
    }

    .age-confirmation {
        color: #FFF;
        font-size: 14px;
        margin-bottom: 5px;
        text-transform: uppercase;
        font-weight: bolder;
    }

    #cookie-btn {
        padding-right: 18px;
    }


    .age-plus {
        font-size: 14px;
        margin-bottom: 8px;
    }

    .prod-info {
        font-family: var(--font-family);
        font-size: 6.5px;
        margin-top: 20px;
        margin-left: 30px;
        margin-right: 30px;
    }

    #btnNo {
        font-size: 14px;
    }

    #btnYes {
        font-size: 14px;
    }

    .field-validation-error {
        font-weight: bolder;
        font-size: 14px;
        color: red;
    }

    .consent-btn {
        width: 102px;
        font-size: 14px !important;
    }

    .i-accept {
        width: 102px;
        font-size: 14px !important;
    }

    .cookie-text {
        font-size: 14px !important;
    }

    .buttons {
        font-size: 9px;
    }

    #cookieModal {
        padding-left: 0px !important;
    }

    .popup-text {
        font-size: 0.75rem;
    }

    .side-img {
        display: none;
    }

    .trademark {
        text-align: center;
        color: #F40009;
    }

    .info-img {
        display: block;
        margin: auto;
        width: 180px;
        height: 40px;
    }

    .footer-text {
        font-family: var(--font-family);
        padding-left: 30px;
        padding-right: 30px;
    }

    .f-links {
        display: grid;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        color: #712958;
    }

    .phone-email {
        padding-left: 0px !important;
        padding-bottom: 10px;
    }

    .main-page-fields {
        padding-left: 0px !important;
    }

    .storefinder {
        padding-left: 0px !important;
    }

    .main-TCs {
        padding-left: 0px !important;
    }

    .main-optin {
        padding-left: 0px !important;
    }

    .validation-message {
        padding-left: 0px !important;
    }

    .display-message {
        padding-left: 0px !important;
    }

    .TCs {
        padding-left: 0px !important;
    }

    .terms-error {
        padding-top: 10px;
    }

    .btn-div {
        padding-left: 0px !important;
    }

    #main-container {
        font-size: 13px;
    }

    .container {
        width: 100%;
        padding-right: 0px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .footer-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .right-main-div {
        max-width: 100% !important;
    }

    .modal-dialog {
        margin-top: 0rem;
        max-width: 100%;
    }

    .top-heading {
        padding-left: 0px !important;
        font-size: 30px;
    }

    .or-text {
        margin-top: 15px;
    }

    .send-voucher-button {
        font-size: 4vw;
        width: 100%;
        border: 1px solid #fff;
    }

    .success-side-img {
        display: none;
    }

    .success-image {
        max-width: 320px;
        margin-bottom: 20px;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .summary-message {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-bottom: 10px;
    }

    .parent-div-success-image {
        margin-left: auto;
        margin-right: auto;
        max-width: unset;
    }

    .error-message-image {
        max-width: 230%;
        max-height: 230%;
    }

    .error-message {
        color: #F40009;
        text-align: center;
        font-size: 23px;
        /*position: absolute;
        top: 130px;
        left: 0;
        width: 240%;
        padding-left: 50px;
        padding-right: 70px;
        font-weight: bolder;*/
    }

    .error-message-TCs {
        color: #F40009;
        text-align: center;
        font-size: 14px;
        /*position: absolute;
        //top: 245px;
        //left: 0;
        //width: 230%;
        //padding-left: 0px;
        //padding-right: 0px;
        font-weight: bolder;*/
    }

    #cookies-termsConditions {
        /*margin-left: 30px !important;
        margin-right: 30px !important;*/
    }

    #cookies-termsConditions h4 {
        font-size: 18px !important;
        font-weight: bold;
    }

    #cookies-termsConditions h5 {
        font-size: 15px !important;
        font-weight: bold;
    }

    #cookies-termsConditions ol {
        padding-inline-start: 0px;
    }
}

.btn-Yes {
    color: #fff;
}

.btn-Yes:hover {
    color: #fff;
}

.btn-check:focus + .btn-Yes, .btn-Yes:focus {
    color: #fff;
    box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
}

.hide-container{
    display: none!important;
}
.show-container {
    display: block!important;
}
.summary-message {
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 10px;
}

@media (min-width: 1400px) {
    .container-fluid {
        max-width: 1140px;
    }
}

.btn-default {
    border-radius: 5px !important;
    padding: 6px 12px;
    color: var(--btndefault-textcolour) !important;
    background-color: var(--btndefault-backgroundcolour) !important;
    border-color: var(--btndefault-bordercolour) !important;
    font-family: var(--font-family), 'BrandonGrotesque-Regular', Arial;
    font-size: small;
}

    .btn-default:hover {
        color: var(--btndefault-hovertextcolour) !important;
        background-color: var(--btndefault-hoverbackgroundcolour) !important;
        border-color: var(--btndefault-hoverbordercolour) !important;
    }

.btn-selected {
    border-radius: 5px !important;
    padding: 6px 12px;
    color: var(--btnselected-textcolour) !important;
    background-color: var(--btnselected-backgroundcolour) !important;
    border-color: var(--btnselected-bordercolour) !important;
    font-family: var(--font-family), 'BrandonGrotesque-Regular', Arial;
    font-size: small;
}

    .btn-selected:hover {
        color: var(--btnselected-hovertextcolour) !important;
        background-color: var(--btnselected-hoverbackgroundcolour) !important;
        border-color: var(--btnselected-hoverbordercolour) !important;
    }