﻿body {
    font-family: museo-sans, sans-serif!important;
    font-weight: 300!important;
    font-style: normal!important;
}

.descriptionText {
    color: #25235d;
    font-size: 17px;
    line-height: 25px;
}

.descriptionTextBold {
    color: #25235d;
    font-size: 17px;
    line-height: 25px;
    font-weight:700;
}

.descriptionClose {
    color: #25235d;
    font-size: 17px;
    line-height: 15px;
}

.blueHeading {
    color: #25235d;
    font-size: 24px;
    line-height: 29px;
    margin-bottom:25px;
    display:block;
}

.blueBackground {
    background-color: #25235d !important;
    color:white !important;
}

.modalInputLabel {
    color: #25235d;
    font-size: 16px;
    line-height: 29px;
    font-weight:500;
}

.calTitle td{
    padding:15px;
}

.activeStep {
    background-color: white !important;
    cursor: pointer !important;
    color: #25235d !important;
    font-size: 17px;
    border: none;
    border-bottom: 2px solid #ffcd00 !important;
}

.Steps, .steps {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 25px;
    padding-bottom: 25px;
    width: 100% !important;
    height: 100%;
    outline: none !important;
    background-color: white !important;
    border: none;
    border-bottom: 2px solid #e8e8e8;
    cursor: pointer !important;
    font-weight: 500;
    border-bottom: 2px solid #ffcd00 !important;
    color: #d5d6d7;
}


.Steps:hover {
    color: #25235d !important;
    cursor: pointer !important;
    border-bottom: 2px solid #ffcd00 !important;
}

.Steps:hover .stepsCircle {
    background: #25235d;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-block;
    color: white;
    margin-right: 10px;
    font-size: 18px;
}


.Steps:disabled:hover {
    width: 100% !important;
    height: 100%;
    background-color: white !important;
    border: none !important;
    border-bottom: 2px solid #f3f4f4 !important;
    color: #d5d6d7 !important;
}

.Steps:disabled:hover .stepsCircle {
    background: #d5d6d7;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-block;
    color: white;
    margin-right: 10px;
    font-size: 18px;
}

.Steps:disabled {
    width: 100% !important;
    height: 100%;
    background-color: white !important;
    border: none !important;
    border-bottom: 2px solid #f3f4f4 !important;
    color: #d5d6d7 !important;
}

.stepsCircleActive {
    background: #25235d;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-block;
    color:white;
    margin-right:10px;
    font-size:18px;
}

.stepsCircle {
    background: #d5d6d7;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-block;
    color: white;
    margin-right: 10px;
    font-size: 18px;
}

.stepsCircle > span{
    padding-top:4px;
    display:block;
}

.stepsCircleActive > span {
    padding-top: 4px;
    display: block;
}


@media (max-width: 992px) {
    .steps, .Steps, .Steps:hover, .steps:hover, .Steps:disabled, .Steps:disabled:hover {
        border-bottom: none !important;
    }
    .productsContainer {
        padding: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .productsSmallPadding {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    .paddingStyle {
        padding-bottom: 40px;
        padding-top: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }
}
@media (min-width:993px) {
    .paddingStyle {
        padding-bottom: 40px;
        padding-top: 0px;
        padding-left:40px!important;
        padding-right:40px!important;
    }
}


h1 {
    font-size: 35px !important;
    margin-bottom: 20px !important;
    margin-top: 35px !important;
    border-bottom: 2px solid #25235d;
    color: #25235d !important;
    padding-bottom: 35px;
    font-weight: 300 !important;
}

.detailSelection {
    width: 100% !important;
    border: 1px solid #25235d;
    height: 100%;
    padding: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    background-color: #25235d;
    color:white;
    font-weight:300 !important;
    font-size:17px !important;
}

.detailSelection:hover {
    background-color: white !important;
    border: 1px solid #25235d;
    color: #25235d !important;
}

.detailSelection:hover g path {
    fill: #25235d !important;
}

.detailSelection:focus {
    outline: none;
}

.detailSelectionActive {
    background-color: white !important;
    border: 1px solid #25235d;
    color: #25235d !important;
}

.detailSelectionActive g path {
    fill: #25235d !important;
}


.detailOptions{
    display:none;
}

.tblProductsSmall td {
    padding-left: 20px;
    padding-right: 20px;
}

.manyAppointmentsCircle {
    background: #ffcd00;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: block;
    font-size: 17px;
    color: #292769;
    font-family: museo-sans, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
}

.manyAppointmentsCircle span{
    display:block;
    padding-top:3px;
}


@media (max-width: 1200px) and (min-width:992px) {
    .manyAppointmentsCircle, .emptyCircle {
        width: 28px;
        height: 28px;
    }
    .emptyCircle, .manyAppointmentsCircle {
        font-size:13px !important;
    }
    .calApptSelect td{
        padding:5px !important;
    }
    .emptyCircle span, .manyAppointmentsCircle span{
        font-size: 13px !important;
        padding-top:4px !important;
    }
}
    
.emptyCircle {
    background: transparent;
    border-radius: 50%;
    color: #292769 !important;
    width: 30px;
    height: 30px;
    display: block;
    font-size: 17px;
    font-family: museo-sans, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
}

.notCurrentMonth {
    color: #bdbdbd !important;
}

.notCurrentMonth .manyAppointmentsCircle {
    background: transparent;
    color: #bdbdbd !important;
    cursor: default !important;
}

.notCurrentMonth .emptyCircle {
    background: transparent;
    color: #bdbdbd !important;
    cursor:default !important;
}


.calTitle {
    border-bottom: 2px solid #e1e1e1;
    padding:10px;
}

.calDayHeader{
    text-align:center;
}

.selectedBookingDate .emptyCircle {
    background: #25235d;
    color: white !important;
    border: 2px solid #25235d;
}

.selectedBookingDate .manyAppointmentsCircle {
    background: #25235d;
    color: #ffcd00 !important;
    border: 2px solid #25235d;
}

.selectedBookingDate .emptyCircle span, .selectedBookingDate .manyAppointmentsCircle span {
    padding-top: 2px;
}

.selectedDate .manyAppointmentsCircle {
    background: transparent;
    border: 2px solid #25235d;
    color: #25235d !important;
}

.selectedDate .emptyCircle {
    background: transparent;
    color: #25235d !important;
    border: 2px solid #25235d;
}

.selectedDate .manyAppointmentsCircle span {
    padding-top:2px;
}

.selectedDate .emptyCircle span {
    padding-top: 2px;
}

.emptyCircle span {
    display: block;
    padding-top: 5px;
}

.calApptSelect a{
    font-weight:bold;
    display:none;
}

.calNextPrev a {
    color: #292769 !important;
    display:inline-block !important;
}

.calApptSelect a:hover {
    text-decoration: none;
    cursor: pointer;
}

.calApptSelect td {
    cursor: pointer;
}

.dvProductCategory{
    margin-top:25px;
    font-size:20px;
}

.chevron{
    float:right;
    font-size:40px;
    padding-left:10px;
    padding-right:10px;
}

@media (max-width: 992px) {
    .navbarTop {
        background-color: white !important;
        padding: 40px !important;
        top: 0;
        z-index: 99;
    }
}
@media (min-width:993px) {
    .navbarTop {
        background-color: white !important;
        padding: 40px !important;
        position: -webkit-sticky; /* Safari */
        position: sticky;
        top: 0;
        z-index: 99;
    }
}

    .redText {
        color: red;
    }

    .redBorder {
        border: 1px solid red !important;
    }

    .tblProducts {
        width: 100%;
    }


        .tblProducts td {
            padding: 0px !important;
        }

    .displayTable {
        display: table;
    }

    .displayTableRow {
        display: table-row;
    }

    .displayTableCell {
        display: table-cell
    }

    .basketPadding {
        padding: 15px !important;
    }

    .spinner {
        font-size: 16px;
        margin-top: 5px;
        margin-left: 10px;
    }

    .hiddenSpinner {
        display: none !important;
    }




    .darkBlue {
        background-color: #25235d;
        color: white;
    }


    .yellow {
        background-color: #ffcd00;
        color: #25235d;
    }

    .p10 {
        padding: 10px;
    }

    .inlineBlock {
        display: inline-block;
    }



    .plusMinus {
        float: right;
        font-size: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }


    .btnYellow {
        background-color: #FFCD00;
        color: #25235D;
        padding: 13px 35px !important;
        border-radius: 0px !important;
        font-size: 17px;
        cursor: pointer !important;
    }

        .btnYellow:hover {
            background-color: white;
            color: #25235D;
            border: 1px solid #FFCD00;
            padding: 13px 35px !important;
            border-radius: 0px !important;
        }

    .btnBlue {
        background-color: #25235D;
        color: white !important;
        border-radius: 0px !important;
        padding: 8px 25px !important;
        border-radius: 0px;
        white-space: normal;
        width: 100%;
    }

        .btnBlue:hover {
            color: #25235D !important;
            background-color: white;
            border: 1px solid #25235D;
        }

    .btn-link {
        color: #25235D !important;
    }

        .btn-link:hover {
            color: #25235D !important;
            text-decoration: underline;
        }

    .blueLink {
        color: #25235D !important;
    }

        .blueLink:hover {
            color: #25235D !important;
            text-decoration: underline;
        }

    .btnCross {
        background-color: white;
        color: #66648c !important;
        border: none !important;
        white-space: normal;
        width: 100%;
    }

        .btnCross:hover {
            color: red !important;
            background-color: white;
            border: none;
        }

    .btnUpDown {
        background-color: #25235D;
        color: white !important;
        border-radius: 0px !important;
        border-radius: 0px;
        white-space: normal;
        font-size: 13px;
        padding-bottom: 0px !important;
        padding-top: 0px !important;
    }

        .btnUpDown:hover {
            color: #25235D !important;
            background-color: white;
            border: 1px solid #25235D;
        }

    /* Chrome, Safari, Edge, Opera */
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    /* Firefox */
    input[type=number] {
        -moz-appearance: textfield;
    }

    .WFLogo {
        max-width: 237px;
    }

    table.dataTable thead th, table.dataTable thead td {
        padding: 3px 5px !important;
        border-bottom: none !important;
    }


    .tblProducts tr:nth-child(odd) {
        background-color: #efefef !important;
    }

    .tblProducts tr td {
        border-bottom: 1px solid #e1e1e1;
    }

        .tblProducts tr td span {
            padding-top: 10px;
            padding-bottom: 10px;
            padding-left: 5px;
            padding-right: 5px;
            display: block;
        }



    .rightBorder {
        border-right: 1px solid #e1e1e1;
    }

    .stripedTable {
        width: 100%;
        border: 1px solid #e1e1e1;
    }

        .stripedTable tr:nth-child(odd) {
            background-color: #efefef !important;
        }

        .stripedTable tr td span {
            padding: 25px;
        }

        .stripedTable tr td {
            font-size: 16px;
            line-height: 20px;
            color: #25235d;
            font-family: museo-sans, sans-serif !important;
            font-weight: 300 !important;
            font-style: normal !important;
        }

    #btnCheckoutTop {
        color: #25235d;
        background-color: white;
        border: none;
        font-size: 17px;
        font-weight: 700;
        display: inline-block;
    }

    .tblProductsHeader {
        font-size: 13px;
        font-weight: 300 !important;
        line-height: 25px;
        color: #75787b;
    }

    .dropdown-menu {
        min-width: 17rem !important;
        left: -156px !important;
        width: 200px !important;
    }


    @media (max-width: 800px) {
        .dropdown-menu {
            min-width: 17rem !important;
            left: 0px !important;
            width: 200px !important;
        }
    }


    .hideArrow::after {
        display: none !important;
    }

    table.dataTable td.dataTables_empty {
        background-color: white;
        font-style: italic;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .dropdown-toggle:focus {
        box-shadow: none !important;
    }


    #btnCheckoutTop:disabled {
        opacity: 1;
    }





