﻿
.countdown {
    text-align: center;
    font-size: 2em !important;
    margin-top: 0px;
    vertical-align: middle;
}

.right-form {
    margin-left: 0 !important
}

.box-shadow {
    margin: 0 0 13px 0;
    box-shadow: 0 0 3px 2px #e1e1e1;
}

.form-control {
    width: 100%
}

.normal_vaccine_opt_div_header {
}

.error_vaccine_opt_div_header {
    background-color: red;
    color: white;
}

input[type="radio"] {
    display: inline-block;
    width: 19px;
    height: 19px;
    margin: -1px 10px 0 0;
    vertical-align: middle;
    cursor: pointer;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.error-label {
    color: red;
}

.succ-label {
    color: green;
}

.payment-icon-parent {
    text-align: center;
    margin-bottom: 10px
}

    .payment-icon-parent span {
        font-weight: 600;
    }

.voucherBTN {
    padding: 10px;
}

.voucherInput {
    width: 225px;
    height: 34px;
    font-size: 14px;
    padding: 6px 12px;
    border: 1px solid #ccc;
}

.cancel-btn-gray {
    color: #fff !important;
    background-color: #808080 !important;
    border-color: #808080 !important;
}

img.payment-icon {
    margin-left: 3px;
    margin-right: 7px;
}

.paymentMethodContainer {
    padding: 10px 0
}

.btn-lg {
    margin: .5em .2em;
    padding: .5em 2em;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.1);
    text-transform: uppercase
}

.btn-exlg {
    padding: .5em 5em
}

.text-grey {
    color: #777
}

.check-green {
    background: green;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.1)
}

.green-check input[type='checkbox'] {
    /*margin: 0 10px;*/
    font-weight: normal;
    color: #FFF;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    vertical-align: middle;
    outline: none;
    font-size: inherit;
    cursor: pointer;
    width: 1.0em;
    height: 1.0em;
    background: #FFF;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 2px;
    position: relative;
}

    .green-check input[type='checkbox']:checked {
        background: #07c32f; /*background: #adf;*/
    }

        .green-check input[type='checkbox']:checked:after {
            content: "✓"; /*"✔";*/
            position: absolute;
            font-size: 90%;
            left: 0.0625em;
            top: -0.25em;
        }

.ExplanationText ul {
    margin: 0;
    padding: 15px !important;
}

#divCorporateBookingSummary {
    display: none;
}

@media screen and (min-width: 767px) {
    #divCorporateBookingSummary span[id$="lblCpStoreName"] {
        display: inline-table;
        max-width: 250px;
    }
}

@media screen and (max-width:767px) {
    .payment-icon-parent span {
        display: block;
        margin-bottom: 8px;
    }
}

.navbar .container div.container-inner {
    padding: 0;
}

.container div.container-inner {
    padding: 20px
}

.pre-confirmation div.container-inner {
    border: 1px solid #C4C4C4;
    box-sizing: border-box;
    border-radius: 4px;
    margin: 20px 0px;
    padding-left: 5px;
}

.pre-confirmation.contact-details div.container-inner {
    padding-left: 20px;
}

/*Styles Start for Pre-Confirmation and Corfirmation 


.confirmation {
    font-family: Arial;
    font-style: normal;
    border-top: 1px solid #DEDEDE;
    border-bottom: 1px solid #DEDEDE;
}*/

.confirmation .page-title {
    font-weight: bold;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    text-transform: uppercase;
    color: #00B648;
    margin-top: 20px;
}

.pre-confirmation .page-title {
    font-weight: bold;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    text-transform: uppercase;
    color: #2D529D;
    margin-top: 20px;
    margin-bottom: 20px;
}

.confirmation div.container-inner {
    border-bottom: 1px solid #C4C4C4;
    box-sizing: border-box;
    margin: 20px 0px;
    margin-top: 0;
    padding-left: 0;
}

.confirmation.contact-details div.container-inner {
    padding-left: 20px;
}

    .confirmation.contact-details div.container-inner .title {
        border-top: 1px solid #C4C4C4;
        border-bottom: 1px solid #C4C4C4;
        padding: 16px 0;
    }


.confirmation #btnManageBooking {
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    text-decoration-line: underline;
    text-transform: uppercase;
    color: #6F535E;
    background: white;
    border: none;
    margin-right: 20px;
}

.confirmation .btn-success {
    background: #00B648;
    border-radius: 3px;
    max-width: 300px;
    padding: 15px 65px;
    font-weight: bold;
    font-size: 18px;
    line-height: 21px;
}

.confirmation #btnBackToHome {
    font-weight: bold;
    font-size: 18px;
    line-height: 21px;
    text-align: center;
    text-transform: uppercase;
    color: #6F535E;
    background: #FFFFFF;
    border: 1px solid #6F535E;
    box-sizing: border-box;
    border-radius: 3px;
    padding: 15px 55px;
}

.confirmation .special-note {
    font-size: 14px;
    line-height: 20px;
    color: #5E5E5E;
    padding-left: 30px;
}

.container .sectionTitle {
    color: #2D529D;
    font-weight: bold;
    font-size: 24px;
    line-height: 20px;
    /*padding-bottom: 20px;*/
}



.confirmation.contact-details div.container-inner #SectionTitle {
    margin-left: -15px;
}

.title a {
    float: right;
    /*margin: 20px;*/
    background: #FFFFFF;
    border: 1px solid rgba(0,0,0,.4);
    font-size: 12px;
    font-weight: bold;
    min-width: 140px;
    text-align: center;
    padding: 5px 8px;
    border-radius: 3px;
    text-decoration: none;
    color: rgba(0,0,0,.7);
    margin-bottom: 0;
    cursor: pointer;
}


confirmation .container .row.title {
    border-bottom: 1px solid #DEDEDE;
}

.confirmation.booking-details .row.title {
    border-bottom: none;
}

.container .row.details {
    margin-top: 25px;
}

.container h1.text-CWH-Blue {
    color: #234994;
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 1.7em;
    font-weight: bold;
}

.container h1 {
    font-weight: bold;
    font-size: 20px;
    line-height: 23px;
    margin-top: 16px;
    color: #000000;
}

.container.confirmation.booking-details h1 {
    font-weight: bold;
    font-size: 24px;
    line-height: 20px;
    color: #2D529D;
    margin-top: 20px;
}

.container .green {
    color: #00B648;
}

.mb10 {
    margin: 5px 0px
}

.container h1 {
    padding: 0;
    margin: 0
}
/*Styles End Pre-Confirmation and Corfirmation */

.errorCheckOuter {
    font-size:2rem;
    border: 2px solid #d80000;
    border-radius: 10px;
    padding: 1rem;
    text-transform: none;
    margin:0 1em 1em;
}

    .errorCheckOuter .heading {
        color: #d80000;
        font-weight: 600;
        text-transform: uppercase;
        margin:0 1em .4em 1em
    }

    .errorCheckOuter .subHeading {
        font-size: .8em ;
        color: #444;
    }


.pnlOuter {
    margin-bottom: 50px;
}
/*Styles Start for Covid-Questioner */
.covid-questioner {
    color: #2D529D;
    /*text-align: center;
    text-transform: uppercase;*/
    font-size: 18px !important;
    margin: 0px 0 20px 0;
    padding:20px;
    border:1px solid #EFEFEF;
}

.btn__covid-questioner {
    color: #6F535E;
    padding: 10px 30px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 2px;
    cursor: pointer;
    font-weight: 500;
    line-height: 21px;
    background: #FFFFFF;
    border: 1px solid #6F535E;
    box-sizing: border-box;
    border-radius: 3px;
    text-transform: uppercase;
}

.btn__covid-questioner-success {
    padding: 10px 30px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 18px;
}



.btn__covid-questioner:active {
    background: #6F535E;
    color: #FFFFFF;
    border: none;
}

.visited {
    background: #6F535E;
    color: #FFFFFF;
    border: none;
}

.covid-questioner-header {
    font-weight: bold;
    font-size: 18px;
    padding-bottom: 15px;
}

.covid-questioner .input_box {
    width: 480px;
    height: 30px;
    left: 252px;
    top: 1182px;
    background: #FFFFFF;
    border: 1px solid #C4C4C4;
    box-sizing: border-box;
    border-radius: 4px;
    color: #6F535E;
}

.covid-questioner .date {
    text-transform: uppercase;
}

.mb-2 {
    margin-bottom: 1em;
}

.mb-4 { margin-bottom: 2em; }

.covid-questioner-error {
    font-size: 12px;
    color: #FF0000;
    text-transform: none;
    display: block;
    width: 480px;
    text-align: left;
    margin: 5px auto 20px;
}

.covid-questioner-error-input {
    border: 1px solid #FF0000 !important;
}

input::-webkit-calendar-picker-indicator {
    display: none;
}

@media only screen and (max-width: 600px) {
    .covid-questioner .input_box {
        width: 260px;
    }
}
/*Styles End for Covid-Questioner */

/*Styles Start for BreadCrumbs */
.btn-breadcrumb {
    margin-bottom: 50px;
}

    .btn-breadcrumb .btn:not(:last-child):after {
        content: " ";
        display: block;
        width: 0;
        height: 0;
        border-top: 37px solid transparent;
        border-bottom: 37px solid transparent;
        border-left: 37px solid white;
        position: absolute;
        top: 23.5%;
        margin-top: -17px;
        left: 99.5%;
        z-index: 3;
    }

    .btn-breadcrumb .btn:not(:last-child):before {
        content: " ";
        display: block;
        width: 0;
        height: 0;
        border-top: 37px solid transparent;
        border-bottom: 37px solid transparent;
        border-left: 37px solid rgb(173, 173, 173);
        position: absolute;
        top: 23.5%;
        margin-top: -17px;
        margin-left: 1px;
        left: 100%;
        z-index: 3;
    }

    /** The Spacing **/
    .btn-breadcrumb .btn {
        padding: 6px 12px 6px 24px;
        width: 25%;
        height: 80px;
        border-radius: 5px !important;
        background: #DFDFDF;
        font-weight: 500;
        font-size: 13px;
        line-height: 16px;
        text-align: center;
        color: #7B7B7B;
        border-color: white;
        padding: 23px 23px 23px 67px;
    }


        .btn-breadcrumb .btn.selected {
            background: #6F535E;
            color: white;
        }

    .btn-breadcrumb #lnkConfirmation.btn.selected {
        background: #00B648;
    }

    .btn-breadcrumb .btn:first-child {
        padding-left: 40px;
    }

    .btn-breadcrumb .btn:last-child {
        padding: 30px 23px 23px 50px;
    }

    /** Default button **/
    .btn-breadcrumb .btn.btn-default:not(:last-child):after {
        border-left: 45px solid #DFDFDF;
    }

    .btn-breadcrumb .btn.btn-default.selected:not(:last-child):after {
        border-left: 45px solid #6F535E;
    }

    .btn-breadcrumb .btn.btn-default:not(:last-child):before {
        border-left: 45px solid white;
    }

    .btn-breadcrumb .btn.btn-default:hover:not(:last-child):after {
        border-left: 45px solid #DFDFDF;
    }

    .btn-breadcrumb .btn.btn-default:hover.selected:not(:last-child):after {
        border-left: 45px solid #6F535E;
    }

    .btn-breadcrumb .btn.btn-default:hover:not(:last-child):before {
        border-left: 45px solid white;
    }
/*Styles End for BreadCrumbs */
