﻿/* <----- button ------->*/
.button-long-text {
    text-align: start;
    padding: 2px 16px 2px 16px !important;
    height: 36.5px;
    font-size: 19.5px;
    line-height: 1;
}

.k-button {
    font-family: 'Lato', sans-serif;
    background: #13499f;
    color: #fff;
    text-transform: capitalize;
    line-height: 1.5;
    letter-spacing: 1.25px;
    border-radius: 4px;
    min-height: 36px;
    font-size: 14px;
    padding: 6px 16px 10px 16px;
    font-weight: bold;
}

    .k-button .button-icon {
        margin-left: -5px;
        margin-right: 5px;
    }

    .k-button .k-icon {
        font-size: 20px;
    }

    .k-button:active {
        transition: all 0.1s ease-in-out;
        background-color: white;
    }

    .k-button.k-state-disabled {
        background-color: #ececec !important;
        color: #6a6969;
    }

    .k-button:disabled {
        background-color: #ececec !important;
        color: #6a6969;
    }

    .k-button:active {
        background-color: #102548;
        box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f;
        padding-top: 6px;
    }

    .k-button:hover {
        background-color: #0b2d65;
        border-color: #0b2d65;
    }

    .k-button.k-state-focused {
        background-color: #102548;
        box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f;
        padding-top: 6px;
    }

    .k-button:focus {
        background-color: #102548;
        box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f;
    }

    .k-button.k-outline {
        border: solid 1px #13499f;
        color: #13499f;
        padding: 5px 16px 10px 16px;
        min-height: 36px;
    }

    .k-button.k-myvisitsoutline {
        border: none;
        color: #0f71d3;
        padding: 5px 16px 10px 16px;
        min-height: 36px;
        background: white;
        box-shadow: none;
    }

    .k-button.k-myvisitVerifyoutline {
        border: none;
        color: white;
        padding: 5px 16px 10px 16px;
        min-height: 36px;
        background: #0066cc;
        box-shadow: none;
    }

    .k-button.k-outline:focus {
        background-color: #e3e9f3;
        box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f;
    }

    .k-button.k-outline:active {
        transition: all 0.1s ease-in-out;
        background-color: #b5c4dc;
    }

    .k-button.k-outline:hover {
        background-color: #e3e9f3;
        border: solid 1px #13499f;
    }

    .k-button.k-outline.k-state-disabled {
        border: solid 1px #d6d6d6;
        background-color: #ececec !important;
        color: #6a6969;
    }

    .k-button.k-outline:disabled {
        border: solid 1px #d6d6d6;
        background-color: #ececec !important;
        color: #6a6969;
    }

    .k-button.k-flat {
        color: #0c306a;
        border: none;
        border-radius: 4px;
        height: 36px;
        font-size: 14px;
        font-weight: bold;
    }

        .k-button.k-flat:focus {
            background-color: #e3e9f3 !important;
            box-shadow: 0 0 0 2px #13499f !important;
        }

        .k-button.k-flat:hover {
            background-color: #e3e9f3 !important;
            color: #0c306a;
        }

        .k-button.k-flat.k-state-disabled {
            color: #acacac !important;
            background-color: transparent !important;
        }

        .k-button.k-flat:disabled {
            color: #acacac !important;
            background-color: transparent !important;
        }

    .k-button.primary-icons {
        font-size: 18px;
        width: 60px;
        height: 44px;
    }

        .k-button.primary-icons:focus {
            box-shadow: 0 0 0 2px white, 0 0 0 3px #13499f;
        }

.switch {
    /* <----- Button Switch ------->*/
    font-family: 'Lato', sans-serif;
    box-shadow: none;
    display: grid;
    grid-template-columns: 69px 69px;
    grid-gap: 0px;
}

    .switch .k-button {
        width: 69px;
        height: 44px;
        padding: 5px 5px !important;
        background-color: #fff;
        color: #13499f;
        display: block;
        border: solid 1px #13499f;
    }

        .switch .k-button:first-child {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
            border-top-left-radius: 4px;
            border-bottom-left-radius: 4px;
            border-right: solid 1px #13499f;
        }

        .switch .k-button:last-child {
            border-top-right-radius: 4px;
            border-bottom-right-radius: 4px;
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
            border-left: solid 0px #13499f;
        }

        .switch .k-button.k-state-active {
            background-color: #c4d1e7;
            color: #13499f;
            font-weight: bold;
        }

            .switch .k-button.k-state-active:hover {
                background-color: #edf2fb;
            }

        .switch .k-button.k-state-focused {
            border: solid 2px #13499f;
            box-shadow: none;
            background-color: #edf2fb;
        }

            .switch .k-button.k-state-focused:last-child {
                border-left: solid 1px #13499f;
            }

            .switch .k-button.k-state-focused:hover {
                background-color: #edf2fb;
            }

        .switch .k-button:hover {
            background-color: #edf2fb;
        }


/* <----- HyperLink ------->*/
.hyperLink, .link-light, .myvisits-hyperLink {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    line-height: 0.94;
    letter-spacing: 0.24px;
    color: #13499f;
    outline: none;
    text-decoration: none;
    border-bottom: 1px solid #13499f;
}




    .hyperLink:focus, .link-light:focus, .myvisits-hyperLink:focus {
        box-shadow: 0 0 0 0.2px white, 0 0 0 1px white, 0 0 0 2px white, 0 0 0 3px white, 0 0 0 5px #13499f;
        color: #0b1e3d;
        border-bottom: 1px solid #0b1e3d;
        text-shadow: 1px 0 0 #0b1e3d;
        cursor: pointer;
    }

    .hyperLink:hover, .link-light:hover, .myvisits-hyperLink:hover {
        color: #0b1e3d;
        border-bottom: 2px solid #0b1e3d;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
        text-decoration: none;
        text-shadow: 1px 0 0 #0b1e3d !important;
        cursor: pointer;
    }

    .hyperLink:visited, .link-light:visited, .myvisits-hyperLink:visited {
        color: #0b1e3d;
        border-bottom: 2px solid #0b1e3d;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
        text-decoration: none;
        text-shadow: 1px 0 0 #0b1e3d;
    }


.myvisits-hyperLink {
    box-shadow: none;
    color: black;
    font-weight: bold;
    border-bottom: .25px solid black;
}

    .myvisits-hyperLink:hover {
        box-shadow: none;
        font-weight: bold;
        color: black;
        border-bottom: 2px solid black;
    }


/* <----- date picker ------->*/
.k-animation-container {
    font-family: 'Lato', sans-serif;
}

    .k-animation-container .k-calendar .k-header {
        color: #221e1e;
    }

        .k-animation-container .k-calendar .k-header .k-state-hover {
            background-color: #c4d1e7;
        }

    .k-animation-container .k-calendar .k-footer .k-nav-today {
        color: #13499f;
        display: none;
    }

    .k-animation-container .k-calendar .k-content th {
        color: #767676;
        opacity: 1;
    }

    .k-animation-container .k-calendar .k-content tr {
        color: #221e1e;
    }

    .k-animation-container .k-calendar .k-content td {
        color: #221e1e;
    }

    .k-animation-container .k-calendar .k-state-hover .k-link {
        background-color: #c4d1e7;
    }

    .k-animation-container .k-calendar .k-state-selected .k-link {
        content: "\e13a";
        background-color: #13499f;
        color: #fff;
    }

    .k-animation-container .k-calendar .k-state-selected .k-state-hover .k-link {
        background-color: #13499f;
        color: #fff;
        background-color: none;
    }

    .k-animation-container .k-calendar .k-state-focused .k-link {
        border: solid 2px #13499f;
    }

    .k-animation-container .k-calendar .k-state-focused:hover .k-link {
        background-color: #c4d1e7;
    }

    .k-animation-container .k-calendar .k-state-focused.k-state-selected .k-link {
        box-shadow: 0 0 0 1px transparent, 0 0 0 3px #13499f;
    }

    .k-animation-container .k-calendar .k-other-month {
        color: #767676 !important;
    }

    .k-animation-container .k-calendar .k-today {
        border-radius: 4px;
        border: solid 1px #221e1e;
        color: #221e1e;
        background-color: transparent;
    }

        .k-animation-container .k-calendar .k-today .k-link {
            width: 38px !important;
            height: 39px !important;
        }

        .k-animation-container .k-calendar .k-today:hover .k-link {
            background-color: #c4d1e7;
        }

        .k-animation-container .k-calendar .k-today.k-state-focused.k-state-selected .k-link {
            margin-left: 2px;
            width: 33px !important;
            height: 33px !important;
            box-shadow: 0 0 0 1px transparent, 0 0 0 3px #13499f;
        }

.termsandconditions {
    background: #E9F1FE;
    padding-top: 25px;
    padding-bottom: 25px;
    padding-left: 0px;
}

.datepickeLabel {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #666;
    display: block;
    margin-left: 19px;
}

.k-date-picker.k-datepicker {
    border: none;
}

    .k-date-picker.k-datepicker .k-state-default {
        border: solid 1px #767676;
        border-radius: 4px;
        margin: 1px;
    }

        .k-date-picker.k-datepicker .k-state-default .k-select {
            padding-left: 15px !important;
            padding-right: 15px !important;
        }

    .k-date-picker.k-datepicker .k-maskedtextbox {
        border: 1px solid transparent;
    }

    .k-date-picker.k-datepicker .k-state-focused {
        border: solid 2px #13499f;
        margin: 0px;
    }

    .k-date-picker.k-datepicker .k-state-hover {
        border: solid 2px #13499f;
        margin: 0px;
    }

.k-date-picker .k-input {
    margin-left: 16px;
}

.datepicker-textfield {
    min-width: 36px !important;
    width: 198px !important;
    height: 36px !important;
}

    .datepicker-textfield .k-textbox {
        width: 198px !important;
    }

.k-textbox.myvisit-textbox {
    border: 1px solid #e1e1e1;
}


#calendar2 {
    margin-left: 0px;
    padding-left: 2px;
}

.k-date-picker2 {
    font-family: 'Lato', sans-serif;
}

    .k-date-picker2.k-datepicker {
        border: none;
        width: 40px;
    }

        .k-date-picker2.k-datepicker .k-state-default {
            border: solid 1px transparent;
            border-radius: 4px;
            margin: 1px;
        }

            .k-date-picker2.k-datepicker .k-state-default .k-select {
                position: absolute;
                left: 6px;
            }

        .k-date-picker2.k-datepicker .k-maskedtextbox {
            width: 0px !important;
        }

        .k-date-picker2.k-datepicker .k-state-focused {
            border: solid 2px #13499f;
            margin: 1px;
        }

            .k-date-picker2.k-datepicker .k-state-focused .k-maskedtextbox {
                width: 0px !important;
            }

            .k-date-picker2.k-datepicker .k-state-focused:hover {
                background-color: #e3e9f3;
            }

        .k-date-picker2.k-datepicker .k-state-hover {
            background-color: #e3e9f3;
            margin: 1px;
        }

    .k-date-picker2 .k-input {
        margin-left: 0px;
    }

.k-date-picker3 {
    font-family: 'Lato', sans-serif;
}

    .k-date-picker3.k-datepicker {
        border: none;
    }

        .k-date-picker3.k-datepicker .k-state-default {
            border: solid 1px #767676;
            border-radius: 4px;
            margin: 1px;
        }

            .k-date-picker3.k-datepicker .k-state-default .k-select {
                padding-left: 15px !important;
                padding-right: 15px !important;
            }

        .k-date-picker3.k-datepicker .k-maskedtextbox {
            border: 1px solid transparent;
        }

        .k-date-picker3.k-datepicker .k-state-focused {
            border: solid 2px #13499f;
            margin: 0px;
        }

        .k-date-picker3.k-datepicker .k-state-hover {
            border: solid 2px #13499f;
            margin: 0px;
        }

    .k-date-picker3 .k-input {
        margin-left: 16px;
    }

.k-widget {
    border-radius: 4px;
}

    .k-widget::after, .k-state-focused::after {
        display: none;
    }
/* <----- textbox ------->*/
.textbox-labels {
    font-family: 'Lato', sans-serif;
    color: #666;
    line-height: 1.5;
    letter-spacing: 0.04px;
    font-size: 16px;
    display: block;
    margin-bottom: 4px;
    margin-left: 8px;
}

.myvist-labels {
    color: #000;
}

.textbox-helperText {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #666;
    margin-top: 4px;
    margin-left: 8px;
}

.textbox-sideIcon {
    font-size: 24px;
    margin-left: 8px;
    border-radius: 4px;
    color: #767676;
    cursor: pointer;
}

    .textbox-sideIcon:hover {
        background-color: #e3e9f3;
        box-shadow: 0 0 0 2px #e3e9f3;
    }

    .textbox-sideIcon:focus {
        background-color: #e3e9f3;
        box-shadow: 0 0 0 2px #e3e9f3, 0 0 0 4px #13499f;
        outline: none;
    }

.textbox-search-sideIcon {
    right: -2px !important;
    color: white;
    top: 8px !important;
    background-color: #13499f;
    width: 50px;
    height: 50px;
    padding-top: 15px;
    padding-left: 13px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    font-size: 24px;
}

.textbox-error-label {
    color: #e51937;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    /*padding-left: 5px;*/
    margin-top: 4px;
    /*margin-left: 8px;*/
}

    .textbox-error-label .k-icon {
        color: #e51937;
        font-size: 10px;
        margin-left: 2px;
    }

.textbox-disabled-helperText {
    color: rgba(117, 117, 117, 0.7) !important;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #666;
    margin-top: 4px;
    margin-left: 8px;
}

.k-textbox {
    border: 1px solid #767676;
    border-radius: 4px;
    padding: 13px 8px;
    font-size: 16px;
    height: 50px;
    width: 100%;
    max-width: 360px;
    /*min-width: 288px;*/
}

    .k-textbox:hover {
        border-color: #13499f;
        box-shadow: 0 0 0 0.1rem #13499f;
    }

    .k-textbox.myvisit-textbox:hover {
        border-color: #0a62f5;
        box-shadow: 0 0 0 0.1rem #0a5be1;
    }

    .k-textbox:focus {
        border-color: #13499f;
        box-shadow: 0 0 0 0.1rem #13499f;
    }

    .k-textbox.myvisit-textbox:focus {
        border-color: #0a62f5;
        box-shadow: 0 0 0 0.1rem #0a5be1;
    }

    .k-textbox .textbox-error-input {
        width: 100% !important;
        max-width: 360px;
        /*min-width: 288px;*/
        height: 50px;
        border: 1px solid #e51937;
        border-radius: 4px;
        padding-left: 8px;
        padding-right: 53px;
    }

        .k-textbox .textbox-error-input:hover {
            border-color: #e51937;
            box-shadow: 0 0 0 0.1rem #e51937;
        }

        .k-textbox .textbox-error-input:focus {
            border-color: #e51937;
            box-shadow: 0 0 0 0.1rem #e51937;
        }

    .k-textbox .textbox-password-input {
        width: 100% !important;
        max-width: 360px;
        /*min-width: 288px;*/
        height: 50px;
        border: 1px solid #767676;
        border-radius: 4px;
        padding-left: 8px;
        padding-right: 53px;
    }

        .k-textbox .textbox-password-input:hover {
            border-color: #13499f;
            box-shadow: 0 0 0 0.1rem #13499f;
        }

        .k-textbox .textbox-password-input:focus {
            border-color: #13499f;
            box-shadow: 0 0 0 0.1rem #13499f;
        }

    .k-textbox .textbox-search-input {
        width: 100%;
        max-width: 360px;
        min-width: 288px;
        height: 50px;
        border: 1px solid #767676;
        border-radius: 4px;
        padding-left: 8px;
        padding-right: 50px;
    }

        .k-textbox .textbox-search-input:hover {
            border-color: #13499f;
            box-shadow: 0 0 0 0.1rem #13499f;
        }

        .k-textbox .textbox-search-input:focus {
            border-color: #13499f;
            box-shadow: 0 0 0 0.1rem #13499f;
        }

    .k-textbox:disabled {
        border-style: solid;
        background-color: #ececec;
    }

        .k-textbox:disabled:hover {
            border-color: #979797;
            box-shadow: none;
        }

        .k-textbox:disabled:focus {
            border-color: #979797;
            box-shadow: none;
        }

.textbox-error-wraper {
    width: 100% !important;
    max-width: 360px;
    /*min-width: 288px;*/
    border-color: transparent;
    padding: 0px;
    display: block;
}

    .textbox-error-wraper:hover {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }

    .textbox-error-wraper:focus {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }

    .textbox-error-wraper .textbox-error-icon {
        font-size: 24px;
        position: absolute;
        color: #e51937 !important;
        right: 17px;
        top: 21.5px;
    }

.textbox-password-wraper {
    width: 100% !important;
    max-width: 360px;
    /*min-width: 288px;*/
    border-color: transparent;
    padding: 0px;
    display: block;
}

    .textbox-password-wraper:hover {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }

    .textbox-password-wraper:focus {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }

    .textbox-password-wraper .textbox-password-icon {
        font-size: 25px;
        position: absolute;
        color: #767676 !important;
        right: 17px;
        top: 22.5px;
    }

.textbox-search-wraper {
    width: 100% !important;
    max-width: 360px;
    min-width: 288px;
    border-color: transparent;
    padding: 0px;
    display: block;
}

    .textbox-search-wraper:hover {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }

    .textbox-search-wraper:focus {
        border-color: transparent;
        box-shadow: 0 0 0 0.1rem transparent;
    }
/* <----- Interactive Text ------->*/
.interactive-text {
    font-family: 'Lato', sans-serif;
    padding: 4px 11px;
    display: inline-block;
    border-radius: 4px;
    border: solid 2px transparent;
    display: inline;
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.09px;
    color: #221e1e;
}

    .interactive-text:focus {
        border: solid 2px #13499f;
        outline: none;
    }

    .interactive-text span {
        display: inline;
        font-size: 18px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
    }
/* <----- Radio, checkbox and switches ------->*/
.radio-custom {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
    opacity: 0;
    position: absolute;
}

    .radio-custom:checked {
        color: #13499f;
        border-color: #13499f;
        background: #0b2d65;
        box-shadow: inset 0px 0px 0px 4px #13499f;
    }

.required {
    color: #e51937;
}

.radio-custom-label {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    position: relative;
    cursor: pointer;
    padding-right: 2px;
    padding: 5px;
}

    .radio-custom-label::before {
        content: '';
        background: #fff;
        border: 2px solid #13499f;
        display: inline-block;
        vertical-align: middle;
        width: 20px;
        height: 20px;
        margin-right: 8px;
        margin-bottom: 2px;
        margin-left: 2px;
        text-align: center;
        border-radius: 50%;
        box-shadow: inset 0px 0px 0px 4px #fff;
        cursor: pointer;
    }

    .radio-custom-label:hover {
        background: #e3e9f3;
    }

.radio-custom:focus + .radio-custom-label {
    outline: 2px solid #13499f !important;
}

.radio-custom:checked + .radio-custom-label:before {
    background: #13499f;
    box-shadow: inset 0px 0px 0px 4px #fff;
}

.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.radio-custom:focus + .radio-custom:active {
    outline: 2px solid #13499f !important;
}

.radio-error {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
    opacity: 0;
    position: absolute;
}

    .radio-error:checked {
        color: #13499f;
        border-color: #13499f;
        background: #0b2d65;
        box-shadow: inset 0px 0px 0px 4px #13499f;
    }

    .radio-error:focus {
        outline: 2px solid #13499f !important;
    }

.radio-error-label {
    color: #e51937;
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    padding: 5px;
    position: relative;
    cursor: pointer;
    padding-right: 2px;
}

    .radio-error-label::before {
        content: '';
        background: #fff;
        border: 2px solid #e51937;
        display: inline-block;
        vertical-align: middle;
        width: 20px;
        height: 20px;
        margin-right: 8px;
        margin-bottom: 2px;
        margin-left: 2px;
        text-align: center;
        border-radius: 50%;
        box-shadow: inset 0px 0px 0px 4px #fff;
        cursor: pointer;
    }

    .radio-error-label .k-icon {
        font-size: 20px;
        margin-bottom: 2px;
        margin-left: 2px;
    }

    .radio-error-label:hover {
        background: #e3e9f3;
    }

.radio-error:focus + .radio-error-label {
    outline: 2px solid #13499f !important;
}

.radio-error:checked + .radio-error-label:before {
    background: #e51937;
    box-shadow: inset 0px 0px 0px 4px #fff;
}

.radio-error + .radio-error-label:before {
    border-radius: 50%;
}

.radio-disabled {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    padding: 5px;
    cursor: pointer;
    opacity: 0;
    position: absolute;
}

    .radio-disabled:checked {
        color: #13499f;
        border-color: #13499f;
        background: #0b2d65;
        box-shadow: inset 0px 0px 0px 4px #13499f;
    }

    .radio-disabled:focus {
        outline: none;
    }

.radio-disabled-label {
    color: #6a6969;
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    padding: 5px;
    position: relative;
    cursor: pointer;
    padding-right: 2px;
}

    .radio-disabled-label::before {
        content: '';
        background: #fff;
        border: 2px solid #6a6969;
        display: inline-block;
        vertical-align: middle;
        width: 20px;
        height: 20px;
        margin-right: 8px;
        margin-bottom: 2px;
        margin-left: 2px;
        text-align: center;
        border-radius: 50%;
        box-shadow: inset 0px 0px 0px 4px #fff;
        cursor: pointer;
    }

    .radio-disabled-label .k-icon {
        font-size: 20px;
        margin-bottom: 3px;
    }

    .radio-disabled-label:focus {
        outline: none;
    }

.radio-disabled:focus + .radio-disabled-label {
    outline: none;
}

.radio-disabled:checked + .radio-disabled-label:before {
    outline: none;
}

.radio-disabled + .radio-disabled-label:before {
    border-radius: 50%;
}

.k-checkbox {
    border: 2px solid #13499f;
    cursor: pointer;
    margin: 1px 5px 5px 5px;
}

    .k-checkbox:checked {
        border-color: #13499f;
        background-color: #13499f;
    }

        .k-checkbox:checked:focus {
            border-color: #13499f;
            box-shadow: 0 0 0 4px #e3e9f3, 0 0 0 6px #13499f;
        }

    .k-checkbox:focus {
        border-color: #13499f;
        box-shadow: 0 0 0 4px #e3e9f3, 0 0 0 6px #13499f;
    }

.hidde-default {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.k-checkbox_label {
    user-select: none;
    cursor: pointer;
}

    .k-checkbox_label:before {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 18px;
        height: 18px;
        border: 2px solid #13499f;
        border-radius: 2px;
        margin-right: 11px;
    }

.checkbox-wrapper input:checked + .k-checkbox_label:before {
    background: #13499f;
    border-color: #13499f;
    border-radius: 2px;
}

.checkbox-wrapper input:checked + .k-checkbox_label .check_icon {
    stroke: #fff;
    stroke-dashoffset: 0;
}

.k-checkbox_label {
    padding-left: 37px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 8px;
}

    .k-checkbox_label:before {
        position: absolute;
        left: 23px;
        top: 8px;
        width: 18px;
        height: 18px;
        transition: all 0.35s ease-out;
    }

    .k-checkbox_label svg {
        position: absolute;
        left: 4px;
        top: 11px;
        width: 10px;
        height: 10px;
    }

    .k-checkbox_label .check_icon {
        stroke-dashoffset: 111.46px;
        stroke-dasharray: 111.46px;
        stroke: #3863d9;
        transition: all 0.35s ease-out;
    }

.checkbox-wrapper input:focus + .k-checkbox_label {
    box-shadow: 0 0 0 2px #13499f;
}

.checkbox-wrapper input:hover + .k-checkbox_label {
    background-color: #e3e9f3;
}

.checkbox-error {
    color: #e51937;
}

    .checkbox-error .checkbox-errorIcon {
        font-size: 20px;
        margin-bottom: 2px;
        margin-left: 2px;
    }

    .checkbox-error .k-checkbox_label:before {
        border-color: #e51937;
    }

    .checkbox-error input:checked + .k-checkbox_label:before {
        background: #e51937;
        border-color: #e51937;
    }

.checkbox-disabled {
    color: #6a6969;
}

    .checkbox-disabled .k-checkbox_label:before {
        border-color: #acacac;
    }

    .checkbox-disabled input:checked + .k-checkbox_label:before {
        background: #acacac;
        border-color: #acacac;
    }

    .checkbox-disabled input:hover + .k-checkbox_label {
        background-color: transparent;
    }

    .checkbox-disabled input:focus + .k-checkbox_label {
        box-shadow: none;
    }

.md_switch {
    display: inline-flex;
    align-items: center;
    margin: 5px 0;
}

    .md_switch .md_switch-label {
        margin-left: 10px;
    }

    .md_switch .md_switch__toggle {
        cursor: pointer;
    }

        .md_switch .md_switch__toggle::before, .md_switch .md_switch__toggle::after {
            content: '';
            background: #6a6969;
            margin: 0 3px;
            transition: all 100ms cubic-bezier(0.4, 0, 0.2, 1);
            display: block;
        }

        .md_switch .md_switch__toggle::before {
            height: 14px;
            width: 34px;
            border-radius: 0.65em;
            opacity: 0.6;
        }

        .md_switch .md_switch__toggle::after {
            position: absolute;
            top: 50%;
            transform: translate(0, -50%);
            height: 1.2em;
            width: 1.2em;
            border-radius: 50%;
            background-color: white;
            box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
        }

    .md_switch:hover .md_switch__toggle::after {
        box-shadow: 0 0 0 0.3rem rgba(158, 183, 225, 31);
    }

    .md_switch [type=checkbox]:checked + .md_switch__toggle::before, .md_switch [type=checkbox]:checked + .md_switch__toggle::after {
        background: #acacac;
    }

    .md_switch [type=checkbox]:checked + .md_switch__toggle::after {
        transform: translate(calc(3em - 166%), -49%);
        background-color: #13499f;
    }

    .md_switch [type=checkbox]:checked:hover + .md_switch__toggle::after {
        box-shadow: 0 0 0 0.3rem rgba(158, 183, 225, 31);
    }

    .md_switch [type=checkbox]:disabled + .md_switch__toggle {
        cursor: not-allowed;
        filter: grayscale(100%);
        opacity: 0.6;
    }

        .md_switch [type=checkbox]:disabled + .md_switch__toggle::after {
            box-shadow: none;
        }

    .md_switch [type=checkbox]:focus + .md_switch__toggle {
        outline: 2px solid #13499f;
        outline-offset: 4px;
    }

    .md_switch [type=checkbox] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

.switch-wrapper {
    font-size: 16px;
    margin-left: 5px;
}

    .switch-wrapper.diasble-label {
        color: #6a6969;
    }

    .switch-wrapper .k-widget {
        background: white;
        border: none;
        margin-right: 8px;
        padding-top: 2px;
        padding-bottom: 2px;
    }

        .switch-wrapper .k-widget.k-state-focused {
            outline: 2px solid #13499f;
            outline-offset: 5px;
        }

        .switch-wrapper .k-widget.k-state-disabled {
            width: 34px;
        }

            .switch-wrapper .k-widget.k-state-disabled .k-switch-handle {
                background-color: #acacac !important;
            }

            .switch-wrapper .k-widget.k-state-disabled .k-switch-container {
                background-color: #dadada !important;
                width: 34px;
            }

        .switch-wrapper .k-widget .k-switch-container {
            height: 14px;
        }

        .switch-wrapper .k-widget.k-switch-on {
            width: 34px;
        }

            .switch-wrapper .k-widget.k-switch-on .k-switch-container {
                background-color: rgba(0, 78, 154, 0.38);
            }

            .switch-wrapper .k-widget.k-switch-on .k-switch-handle {
                top: -4px;
                left: 43%;
                width: 20px;
                height: 20px;
                color: white;
            }

        .switch-wrapper .k-widget.k-switch-off {
            width: 34px;
        }

            .switch-wrapper .k-widget.k-switch-off .k-switch-container {
                background-color: rgba(0, 0, 0, 0.38);
            }

            .switch-wrapper .k-widget.k-switch-off .k-switch-handle {
                top: -4px;
                left: 0px;
                width: 20px;
                height: 20px;
                color: #f1f1f1;
            }

                .switch-wrapper .k-widget.k-switch-off .k-switch-handle:hover {
                    box-shadow: 0 0 0 0.3rem rgba(158, 183, 225, 31);
                }

.k-widget:focus, .k-switch-container:focus {
    outline: none;
}
/* <----- Calendar ------->*/
.k-calendar .k-header {
    color: #11479d;
}

.k-calendar .k-footer .k-nav-today {
    color: #11479d;
    display: none;
}

.k-calendar .k-content th {
    color: lightslategrey;
}
/* <----- Line chart ------->*/
.k-animation-container .k-popup {
    border-radius: 4px !important;
}

.k-animation-container .k-chart-tooltip {
    border-radius: 4px !important;
}
/* <----- Dropdowns ------->*/
.k-dropdown-wrapper {
    font-family: 'Lato', sans-serif;
    border: none;
    width: 287px;
    height: 50px;
}

    .k-dropdown-wrapper .k-dropdown-wrap {
        border: solid 1px #767676;
        border-radius: 4px;
        margin: 1px;
    }

        .k-dropdown-wrapper .k-dropdown-wrap .k-select {
            padding-left: 15px !important;
            padding-right: 15px !important;
        }

        .k-dropdown-wrapper .k-dropdown-wrap:hover {
            border: solid 2px #13499f;
            margin: 0px;
        }

        .k-dropdown-wrapper .k-dropdown-wrap:focus {
            border: solid 2px #13499f;
            margin: 0px;
        }

        .k-dropdown-wrapper .k-dropdown-wrap .k-input {
            margin-top: 6px;
            margin-left: 16px;
        }

        .k-dropdown-wrapper .k-dropdown-wrap .k-select {
            color: #221e1e;
            opacity: 1 !important;
        }

.k-dropdown-error .k-dropdown-wrap {
    border: solid 1px #e51937;
    color: #e51937;
}

    .k-dropdown-error .k-dropdown-wrap:hover {
        border: solid 2px #e51937 !important;
        margin: 0px;
    }

    .k-dropdown-error .k-dropdown-wrap:focus {
        border: solid 2px #e51937 !important;
        margin: 0px;
    }

.k-dropdown-error .dropdown-errorIcon {
    right: 41px;
    position: absolute;
    font-size: 20px;
    top: 13px;
}

.k-dropdown-error .dropdown-text-errorIcon {
    right: 21px;
    position: absolute;
    font-size: 20px;
    top: 2px;
}

.k-dropdown-error .k-select .k-icon {
    color: #e51937;
}

.dropdown-error-label {
    color: #e51937;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    padding-left: 11px;
    margin-top: 4px;
    margin-left: 8px;
}

    .dropdown-error-label .k-icon {
        color: #e51937;
        font-size: 10px;
        margin-left: 2px;
    }

.dropdown-icon-error-label {
    color: #e51937;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    padding-left: 13px;
    margin-top: 4px;
    margin-left: 8px;
}

    .dropdown-icon-error-label .k-icon {
        color: #e51937;
        font-size: 10px;
        margin-left: 2px;
    }

.dropdown-text-error-label {
    color: #e51937;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.04px;
    padding-left: 10px;
    margin-left: 8px;
}

    .dropdown-text-error-label .k-icon {
        color: #e51937;
        font-size: 10px;
        margin-left: 2px;
    }

.k-dropdown-wrapper-text {
    width: 124px;
    height: 28px;
    border: none;
    font-size: 14px;
}

    .k-dropdown-wrapper-text .k-dropdown-wrap {
        border: solid 2px transparent;
        border-radius: 4px;
    }

        .k-dropdown-wrapper-text .k-dropdown-wrap:hover {
            background-color: #e3e9f3;
            border: solid 2px transparent;
        }

        .k-dropdown-wrapper-text .k-dropdown-wrap:focus {
            border: solid 2px #13499f;
        }

        .k-dropdown-wrapper-text .k-dropdown-wrap .k-input {
            margin-top: -4px;
            margin-left: 16px;
        }

        .k-dropdown-wrapper-text .k-dropdown-wrap .k-select {
            color: #221e1e;
            opacity: 1 !important;
        }

.dropdown-province-input {
    border: solid 1px #767676 !important;
    border-radius: 4px !important;
    margin: 1px !important;
    height: 50px;
    padding: 13px 8px;
}

    .dropdown-province-input.myvisit-dropdown-province-input {
        border: solid 1px #e1e1e1 !important;
        border-radius: 4px !important;
        margin: 1px !important;
        height: 50px;
        padding: 13px 8px;
    }

        .dropdown-province-input.myvisit-dropdown-province-input:hover {
            border-color: #0066cc;
            box-shadow: 0 0 0 0.1rem #0066cc;
        }

        .dropdown-province-input.myvisit-dropdown-province-input:focus {
            border-color: #0066cc;
            box-shadow: 0 0 0 0.1rem #0066cc;
        }

dropdown-province-input:hover {
    border-color: #13499f;
    box-shadow: 0 0 0 0.1rem #13499f;
}

.dropdown-province-input:focus {
    border-color: #13499f;
    box-shadow: 0 0 0 0.1rem #13499f;
}

.k-animation-container {
    margin-top: -3px;
    color: black;
}

    .k-animation-container .k-item {
        padding-left: 16px;
    }

        .k-animation-container .k-item:hover {
            background-color: #e3e9f3;
        }

        .k-animation-container .k-item.k-state-focused {
            color: black;
            background-color: #c4d1e4;
        }

            .k-animation-container .k-item.k-state-focused:hover {
                color: black;
                background-color: #c4d1e4;
            }

        .k-animation-container .k-item.k-state-active {
            color: black;
        }
/* <----- Loading ------->*/
.loading {
    border: 4px solid transparent;
    border-radius: 50%;
    border-top: 4px solid #13499f;
    border-right: 4px solid #13499f;
    border-bottom: 4px solid #13499f;
    background-color: transparent;
    width: 44px;
    height: 44px;
    -webkit-animation: spin 1s linear infinite;
    /* Safari */
    animation: spin 1s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(180deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* <----- Chip component ------->*/
.k-chip {
    color: #13499f;
    background-color: #ecf0f7;
    border: solid 2px transparent;
}

    .k-chip:active {
        transition: all 0.1s ease-in-out;
        background-color: #ecf0f7 !important;
    }

    .k-chip:hover {
        background-color: #c4d1e7;
    }

    .k-chip:focus {
        border: 2px solid #13499f;
        background-color: #ecf0f7;
    }

        .k-chip:focus:hover {
            background-color: #c4d1e7;
        }

    .k-chip.k-chip-disabled {
        background-color: #ececec !important;
        color: #6a6969;
    }

        .k-chip.k-chip-disabled:focus {
            border: 1px solid transparent;
            background-color: #ecf0f7;
        }

.long-label-chip {
    height: 52px;
    width: 175px;
    border-radius: 32px;
}

    .long-label-chip .k-chip-icon {
        margin-bottom: 23px;
        margin-left: 5px;
    }

    .long-label-chip .k-chip-content {
        padding-left: 3px;
    }
/* <----- Tabs ------->*/
.k-tabstrip {
    border: none;
    font-family: 'Lato', sans-serif;
}

    .k-tabstrip .k-item {
        font-size: 18px;
        height: 59px;
        width: 25%;
        max-width: 170px;
        color: #13499f;
        border-left: 0.5px solid #bdbdbd;
        border-bottom: 1px solid #bdbdbd;
        border-top: 3px solid transparent;
        background-color: #ecf0f7;
        opacity: 1 !important;
    }

        .k-tabstrip .k-item .k-link {
            text-align: center !important;
            align-items: center;
            justify-content: center;
            padding: 10px;
        }

        .k-tabstrip .k-item:last-child {
            border-right: 1px solid #bdbdbd;
        }

        .k-tabstrip .k-item:hover {
            color: #13499f;
            background-color: #c4d1e7;
        }

        .k-tabstrip .k-item.k-state-active {
            background-color: #fff;
            color: #13499f;
            border-top: 3px solid #13499f;
            text-shadow: 1px 0 0 #13499f !important;
        }

            .k-tabstrip .k-item.k-state-active::after {
                border-bottom: none !important;
            }

            .k-tabstrip .k-item.k-state-active:focus {
                outline: 2px solid #13499f;
                z-index: 3000;
                border-top: 1px solid #bdbdbd;
            }

            .k-tabstrip .k-item.k-state-active:hover {
                color: #13499f;
                background-color: #c4d1e7;
            }

        .k-tabstrip .k-item.k-state-disabled {
            color: #6a6969;
            background-color: #ececec;
        }

        .k-tabstrip .k-item .tab-icon {
            margin-right: 9px;
            margin-bottom: 5px;
        }

        .k-tabstrip .k-item .tab-icon2 {
            margin-right: 9px;
        }

        .k-tabstrip .k-item .tab-icon-small {
            margin-right: 9px;
            margin-bottom: 5px;
        }

    .k-tabstrip .k-tabstrip-items {
        text-transform: capitalize;
        opacity: 1 !important;
    }

        .k-tabstrip .k-tabstrip-items .k-link {
            text-align: center !important;
        }

    .k-tabstrip.mobile-tab {
        display: block;
    }

.k-tabstrip-optio2 .k-item {
    height: 93px;
    width: 24.9%;
}

.k-tabstrip-2 {
    width: 100%;
}

    .k-tabstrip-2 .k-item {
        font-size: 14px;
        width: 158px;
        height: 40px;
        text-align: center !important;
    }

.k-tabstrip-icons {
    width: 320px;
}

    .k-tabstrip-icons .k-item {
        font-size: 14px;
        width: 105px;
        height: 40px;
    }

    .k-tabstrip-icons .k-link {
        padding-left: 40%;
    }

.testRow {
    align-items: center;
    justify-content: center;
}

@media (max-width: 440px) {
    .k-tabstrip .k-item {
        font-size: 12px;
    }

    .k-tabstrip-2 {
        width: 100%;
    }

        .k-tabstrip-2 .k-item {
            width: 50%;
        }

    .k-tabstrip-icons {
        width: 100%;
    }

        .k-tabstrip-icons .k-item {
            width: 33.3%;
        }
}
/* <----- Dialog Box ------->*/
.k-dialog-wrapper .k-dialog {
    font-family: 'Lato', sans-serif;
    margin: 10px;
}

    .k-dialog-wrapper .k-dialog .dialog-icon {
        margin: 0px 10px -4px 0px;
    }

    .k-dialog-wrapper .k-dialog .dialog-title {
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
    }

    .k-dialog-wrapper .k-dialog .k-window-titlebar {
        padding-bottom: 0px !important;
    }

        .k-dialog-wrapper .k-dialog .k-window-titlebar .k-close-dialog {
            position: absolute;
            top: 27px;
            right: 20px;
            font-size: 24px;
            cursor: pointer;
        }

            .k-dialog-wrapper .k-dialog .k-window-titlebar .k-close-dialog:hover {
                background-color: #e3e9f3;
                box-shadow: 0 0 0 2px #e3e9f3;
            }

            .k-dialog-wrapper .k-dialog .k-window-titlebar .k-close-dialog:focus {
                background-color: #e3e9f3;
                box-shadow: 0 0 0 2px #e3e9f3, 0 0 0 4px #13499f;
                outline: none;
            }

    .k-dialog-wrapper .k-dialog .dialog-body {
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        padding-bottom: 8px;
        padding-left: 0px;
    }

    .k-dialog-wrapper .k-dialog .k-dialog-buttongroup {
        padding: 24px;
    }

        .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button {
            background: #13499f !important;
            color: #fff !important;
            text-transform: capitalize;
            line-height: 1.5;
            letter-spacing: 1.25px;
            border-radius: 4px;
            min-width: 84px !important;
            height: 36px;
            font-size: 16px;
            padding: 6px 16px 10px 16px;
        }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button:active {
                transition: all 0.1s ease-in-out;
                background-color: white;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-state-disabled {
                background-color: #ececec !important;
                color: #6a6969;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button .k-icon {
                font-size: 20px;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button:active {
                background-color: #102548 !important;
                box-shadow: 0 0 0 4px white !important, 0 0 0 5px #13499f !important;
                padding-top: 6px;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button:hover {
                background-color: #0b2d65 !important;
                border-color: #0b2d65 !important;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-state-focused {
                background-color: #102548 !important;
                box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f !important;
                padding-top: 6px;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button:focus {
                background-color: #102548 !important;
                box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f !important;
                padding-top: 6px;
            }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-outline {
                background-color: white !important;
                min-width: 84px !important;
                height: 36px;
                border: solid 1px #13499f !important;
                color: #13499f !important;
                padding: 8px 16px 10px 16px !important;
            }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-outline:focus {
                    background-color: #e3e9f3 !important;
                    box-shadow: 0 0 0 4px white, 0 0 0 5px #13499f !important;
                }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-outline:active {
                    transition: all 0.1s ease-in-out;
                    background-color: #b5c4dc;
                }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-outline:hover {
                    background-color: #e3e9f3;
                    border: solid 1px #13499f;
                }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-outline.k-state-disabled {
                    border: solid 1px #d6d6d6;
                    background-color: #ececec !important;
                    color: #6a6969;
                }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-flat {
                color: #0c306a;
                border: none;
                border-radius: 4px;
                height: 40px;
                font-size: 14px !important;
            }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-flat:focus {
                    background-color: #e3e9f3;
                    box-shadow: 0 0 0 2px #13499f !important;
                }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-flat:hover {
                    background-color: #e3e9f3 !important;
                    color: #0c306a;
                }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.k-flat.k-state-disabled {
                    color: #acacac !important;
                    background-color: white !important;
                }

            .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.primary-icons {
                font-size: 18px;
                width: 60px;
                height: 44px;
            }

                .k-dialog-wrapper .k-dialog .k-dialog-buttongroup .k-button.primary-icons:focus {
                    box-shadow: 0 0 0 2px white, 0 0 0 3px #13499f;
                }

myvisits-button-noborder {
    border: 0px;
}

.k-dialog-wrapper .k-dialog .k-window-actions.k-dialog-actions {
    display: none;
    visibility: hidden;
}

.k-dialog-wrapper .k-dialog .k-window-titlebar {
    padding-bottom: 10px;
    max-width: 500px;
}

.k-dialog-wrapper .k-dialog .k-dialog-buttongroup.k-dialog-small {
    margin-top: 0px !important;
}

.customized-table .k-grid {
    margin-left: -10px;
    margin-right: -10px;
    border-color: transparent;
}

    .customized-table .k-grid .k-grid-content {
        overflow: hidden;
    }

    .customized-table .k-grid .k-grid-header {
        background-color: transparent !important;
        visibility: hidden;
        display: none;
    }

    .customized-table .k-grid td {
        padding: 0px 8px 0px 8px;
        border-color: transparent;
    }

    .customized-table .k-grid tbody tr {
        cursor: pointer;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        z-index: -1 !important;
    }

        .customized-table .k-grid tbody tr:hover {
            background-color: transparent !important;
            box-shadow: none;
        }

        .customized-table .k-grid tbody tr .k-button {
            padding-left: 3px;
            font-weight: bold;
        }

.customized-table2 .k-grid {
    margin-left: -10px;
    margin-right: -10px;
    border-color: transparent;
}

    .customized-table2 .k-grid .k-grid-content {
        overflow: hidden;
    }

    .customized-table2 .k-grid .k-grid-header {
        background-color: transparent !important;
        visibility: hidden;
        display: none;
    }

    .customized-table2 .k-grid td {
        padding: 0px 10px 0px 0px;
        border-color: transparent;
    }

    .customized-table2 .k-grid tbody tr {
        cursor: pointer;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        z-index: -1 !important;
    }

        .customized-table2 .k-grid tbody tr:hover {
            background-color: transparent !important;
            box-shadow: none;
        }
/* <----- Panelbar ------->*/
.k-panelbar {
    font-family: 'Lato', sans-serif !important;
    border: none;
    max-width: 1120px;
}

    .k-panelbar .k-item .k-link {
        font-size: 16px;
        cursor: pointer;
        color: black;
        border: solid 2px transparent;
    }

        .k-panelbar .k-item .k-link:hover {
            background-color: #c4d1e7;
        }

        .k-panelbar .k-item .k-link:active {
            color: black;
        }

        .k-panelbar .k-item .k-link.k-state-selected {
            color: black;
            background-color: none;
        }

        .k-panelbar .k-item .k-link.k-state-focused {
            color: black;
            background-color: #ecf0f7;
            border: solid 2px #13499f;
        }

    .k-panelbar .k-item .k-content {
        margin-left: 22px;
    }

    .k-panelbar .k-group .k-item .k-link {
        cursor: pointer;
    }

        .k-panelbar .k-group .k-item .k-link:hover {
            background-color: #c4d1e7;
        }

        .k-panelbar .k-group .k-item .k-link.k-state-selected {
            color: black;
            background-color: #c4d1e7;
        }

        .k-panelbar .k-group .k-item .k-link.k-state-focused {
            color: black;
            background-color: #c4d1e7;
            border: solid 2px #13499f;
        }

    .k-panelbar .k-panelbar-expand::before {
        content: "\e015";
    }

    .k-panelbar .k-panelbar-collapse::before {
        content: "\e013";
    }
/* <----- Mobile Grid (Cards) ------->*/
.mobile-grid {
    margin: 0px;
    max-width: 712px;
    border: solid 1px #bdbdbd;
    border-radius: 0px;
    font-family: 'Lato', sans-serif;
}

    .mobile-grid:focus {
        outline: 2px solid #13499f;
    }

    .mobile-grid:hover {
        background-color: #edf2fb;
    }

    .mobile-grid .k-card-header {
        padding: 11px 5px 5px 5px !important;
    }

        .mobile-grid .k-card-header .header-icon:focus {
            outline: 2px solid #13499f;
            outline-offset: 2px;
        }

        .mobile-grid .k-card-header .card-header-grid {
            display: grid;
            grid-template-columns: 5% 80% 5% 5%;
            grid-gap: 10px;
        }

    .mobile-grid .k-card-body {
        padding: 5px 16px 5px 48px !important;
    }

        .mobile-grid .k-card-body .card-body-grid {
            display: grid;
            grid-template-columns: 34% 66%;
            grid-gap: 10px;
        }

        .mobile-grid .k-card-body .card-body-subGrid {
            display: grid;
            grid-template-columns: 35% 22%;
            grid-gap: 10px;
        }

        .mobile-grid .k-card-body .card-body-subGrid-status {
            display: grid;
            grid-template-columns: 17% 54%;
            grid-gap: 10px;
        }

        .mobile-grid .k-card-body .card-body-subGrid-section {
            display: grid;
            grid-template-columns: 17% 43%;
            grid-gap: 10px;
        }

    .mobile-grid .k-card-button {
        font-size: 14px !important;
        padding: 5px 10px 5px 10px !important;
        height: 30px;
        transition: none !important;
        font-size: 14px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 1.25px;
        color: #13499f;
    }

        .mobile-grid .k-card-button .k-icon {
            font-size: 24px !important;
            margin-left: 4px;
            margin-top: 2px;
        }

    .mobile-grid .k-card-button-wrapper {
        padding: 5px 15px 5px 15px !important;
    }

        .mobile-grid .k-card-button-wrapper .k-icon-unread {
            margin-top: 12px;
            color: #13499f;
            font-size: 14px;
            margin-right: 8px;
        }

        .mobile-grid .k-card-button-wrapper .k-button.k-flat {
            background-color: transparent !important;
            padding: 4px 5px 4px 5px !important;
        }

    .mobile-grid .k-checkbox:checked:focus {
        border-color: #13499f;
        box-shadow: 0 0 0 4px #e3e9f3, 0 0 0 6px #13499f;
    }

    .mobile-grid .k-checkbox:focus {
        box-shadow: 0 0 0 4px #e3e9f3, 0 0 0 6px #13499f;
    }

.k-card-read {
    background-color: #efefef;
}

    .k-card-read:focus {
        outline: 2px solid #13499f;
        background-color: #ced9ea;
    }

.card-wrapper {
    padding-bottom: 5px !important;
}

.data-item:focus {
    outline: 2px solid #13499f;
}

.data-item-title {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.29;
    letter-spacing: 0.06px;
    color: #6a6969;
    padding-top: 5px;
}

    .data-item-title:focus {
        outline: 2px solid #13499f;
    }
/* <----- Desktop Grid ------->*/
thead tr:nth-child(2) {
    display: none;
}

thead tr:nth-child(1) {
    text-align: center;
}

.k-grid {
    font-family: 'Lato', sans-serif;
    max-width: 1220px;
}

    .k-grid .k-grid-header {
        background-color: #0c306a;
        color: #fff;
        height: 50px;
        padding: 5px;
    }

        .k-grid .k-grid-header .k-icon {
            color: #fff;
            font-size: 20px;
            top: 10px;
            position: absolute;
        }

        .k-grid .k-grid-header .k-i-sort-asc-sm {
            display: none;
            visibility: hidden;
        }

        .k-grid .k-grid-header .k-i-sort-desc-sm {
            display: none;
            visibility: hidden;
        }

        .k-grid .k-grid-header .k-defaultArrow {
            margin-left: 11px;
            top: 10px;
            position: absolute;
            user-select: none;
            /* supported by Chrome and Opera */
            -webkit-user-select: none;
            /* Safari */
            -khtml-user-select: none;
            /* Konqueror HTML */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* Internet Explorer/Edge */
        }

        .k-grid .k-grid-header .k-arrowUp {
            margin-left: 9px;
            top: 12px;
            position: absolute;
            user-select: none;
            /* supported by Chrome and Opera */
            -webkit-user-select: none;
            /* Safari */
            -khtml-user-select: none;
            /* Konqueror HTML */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* Internet Explorer/Edge */
        }

        .k-grid .k-grid-header .k-arrowDown {
            margin-left: 9px;
            top: 12px;
            position: absolute;
            user-select: none;
            /* supported by Chrome and Opera */
            -webkit-user-select: none;
            /* Safari */
            -khtml-user-select: none;
            /* Konqueror HTML */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* Internet Explorer/Edge */
        }

        .k-grid .k-grid-header .k-header {
            margin: -5px -24px;
            padding: 10px 4px;
            border: 2px solid transparent;
            top: 1px !important;
            font-size: 16px;
            font-weight: bold;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.5;
            letter-spacing: 0.02px;
            text-align: start;
        }

            .k-grid .k-grid-header .k-header .k-link {
                position: absolute;
                top: 10px;
            }

            .k-grid .k-grid-header .k-header .k-arrowDown {
                top: 18px;
            }

            .k-grid .k-grid-header .k-header .k-arrowUp {
                top: 18px;
            }

            .k-grid .k-grid-header .k-header .k-defaultArrow {
                top: 16px;
            }

            .k-grid .k-grid-header .k-header:focus {
                outline: 2px solid #fff !important;
                outline-offset: -3px;
            }

            .k-grid .k-grid-header .k-header:hover {
                background-color: rgba(196, 209, 231, 0.35);
                border: 2px solid #0c306a;
            }

                .k-grid .k-grid-header .k-header:hover .k-link {
                    color: #fff;
                }

            .k-grid .k-grid-header .k-header .k-icon {
                margin-left: 5px;
                margin-right: 5px;
            }

    .k-grid th {
        height: 45px;
        padding: 12px 30px;
    }

    .k-grid tbody tr {
        cursor: pointer;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        z-index: -1 !important;
    }

        .k-grid tbody tr .grid-checkbox {
            text-align: center;
        }

        .k-grid tbody tr:hover {
            background-color: #edf2fb !important;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.25);
            z-index: 1000 !important;
        }

        .k-grid tbody tr .k-icon {
            color: #13499f;
            margin-left: 5px;
            margin-right: 5px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 24px;
        }

            .k-grid tbody tr .k-icon:focus {
                outline: 2px solid #13499f;
                outline-offset: 2px;
            }

            .k-grid tbody tr .k-icon:hover {
                background-color: #afc5eb;
            }

        .k-grid tbody tr .k-icon-img {
            color: #13499f;
            margin-left: 5px;
            margin-right: 5px;
            margin-bottom: 2px;
            cursor: pointer;
        }

            .k-grid tbody tr .k-icon-img:focus {
                outline: 2px solid #13499f;
                outline-offset: 2px;
            }

            .k-grid tbody tr .k-icon-img:hover {
                background-color: #afc5eb;
            }

        .k-grid tbody tr .k-checkbox:hover {
            box-shadow: 0 0 0 6px #afc5eb;
        }

        .k-grid tbody tr .k-icon-unread {
            margin-left: -5px;
        }

            .k-grid tbody tr .k-icon-unread:hover {
                background-color: transparent !important;
            }

        .k-grid tbody tr .k-button {
            height: 34px;
            font-size: 14px;
            padding-right: 4px;
            font-weight: bold;
            color: #13499f !important;
            padding-top: 10px;
        }

            .k-grid tbody tr .k-button .k-icon {
                margin-top: 2px;
                font-size: 24px;
            }

        .k-grid tbody tr .k-card-button-icon {
            font-size: 14px !important;
            padding-right: 8px;
            padding-left: 8px;
            padding-top: 2px !important;
            padding-bottom: 2px !important;
            height: 30px;
            transition: none !important;
            font-weight: bold;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.5;
            letter-spacing: 1.25px;
            color: #13499f;
        }

            .k-grid tbody tr .k-card-button-icon .k-icon {
                font-size: 24px !important;
                margin-left: 4px;
                margin-top: 2px;
            }

            .k-grid tbody tr .k-card-button-icon:hover {
                background-color: #afc5eb !important;
            }

        .k-grid tbody tr .k-command-cell {
            border-left: solid 1px rgba(196, 209, 231, 0.35);
        }

            .k-grid tbody tr .k-command-cell .k-icon {
                margin-top: 8px;
            }

    .k-grid tbody td {
        text-overflow: clip;
        overflow-wrap: break-word;
        padding: 8px 5px;
    }

    .k-grid td:focus {
        outline: 2px solid #13499f;
        outline-offset: -2px;
        background-color: #ecf0f7 !important;
    }

    .k-grid td .k-card-unread {
        padding-left: -20px !important;
    }

    .k-grid tr.unread {
        background-color: #fff;
    }

    .k-grid tr.read {
        background-color: #efefef;
    }

.k-card {
    font-family: 'Lato', sans-serif !important;
    border-radius: 4px;
    border: solid 2px transparent;
}

    .k-card:focus {
        border-radius: 4px;
        border: 2px solid #13499f !important;
    }

    .k-card .k-card-body {
        padding: 16px;
    }

    .k-card .k-card-actions {
        padding-bottom: 16px;
    }

        .k-card .k-card-actions .k-button {
            padding: 0px !important;
        }

.timeSlots {
    font-family: 'Lato', sans-serif;
    box-shadow: none;
    display: grid;
    grid-template-columns: 65px 65px 65px 65px;
    grid-gap: 10px;
    background-color: #fff;
    color: #444;
}

    .timeSlots .labTime {
        background-color: #edf2fb;
    }

    .timeSlots .booked {
        border: dashed 1px #13499f;
        background-color: #fff;
        color: #13499f;
    }

    .timeSlots .k-button {
        width: 59px;
        height: 36px;
        padding: 5px 5px !important;
        border-radius: 4px !important;
        display: block;
    }

        .timeSlots .k-button.k-state-active {
            background-color: #13499f !important;
            color: #fff;
        }

        .timeSlots .k-button:hover {
            background-color: #edf2fb;
        }

        .timeSlots .k-button.k-state-disabled {
            border: dashed 1px #13499f;
            background-color: #fff !important;
            color: #13499f !important;
        }

.alert-messages {
    font-family: 'Lato', sans-serif;
    position: relative;
    /*width: 288px;*/
    border-radius: 4px;
    padding: 8px 13px 10px 16px;
}

    .alert-messages:focus {
        box-shadow: 0 0 0 2px #e3e9f3, 0 0 0 4px #13499f;
        outline: none;
    }

    .alert-messages .alert-icons {
        margin-bottom: -5px;
    }

    .alert-messages .title {
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.12px;
        color: #221e1e;
        display: inline;
        margin-left: 4px;
    }

    .alert-messages .body {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        margin-top: 8px;
    }

    .alert-messages .k-close-alert-message {
        position: absolute;
        top: 10px;
        right: 13px;
        font-size: 24px;
        cursor: pointer;
    }

        .alert-messages .k-close-alert-message:hover {
            background-color: #e3e9f3;
            box-shadow: 0 0 0 2px #e3e9f3;
        }

        .alert-messages .k-close-alert-message:focus {
            background-color: #e3e9f3;
            box-shadow: 0 0 0 2px #e3e9f3, 0 0 0 4px #13499f;
            outline: none;
        }

.k-stepper .k-step-current .k-step-indicator {
    border-color: #13499f;
    color: #fff;
    background-color: #13499f;
}

.k-stepper .k-step-done:hover .k-step-indicator, .k-stepper .k-step-done.k-step-hover .k-step-indicator {
    background-color: #13499f !important;
}

.k-stepper .k-step-current:hover .k-step-indicator, .k-stepper .k-step-done.k-step-hover .k-step-indicator {
    background-color: #13499f !important;
}

.k-stepper .k-step:hover .k-step-indicator, .k-stepper .k-step.k-step-hover .k-step-indicator {
    background-color: #e3e9f3;
}

.k-stepper {
    font-family: 'Lato', sans-serif;
    box-shadow: none;
    border: none;
    width: 100% !important;
}

    .k-stepper .k-widget {
        border-color: #13499f;
    }

    .k-stepper .k-step-done .k-step-indicator {
        border-color: #13499f;
        color: #fff;
        background-color: #13499f;
    }

        .k-stepper .k-step-done .k-step-indicator:hover {
            border: solid 1px #0b2d65 !important;
            background-color: #0b2d65 !important;
            transition-duration: 100ms !important;
            color: #fff;
        }

    .k-stepper .k-step-indicator {
        width: 32px;
        height: 32px;
        border: solid 1px #13499f;
        background-color: #fff;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #13499f;
        transition-duration: 100ms !important;
    }

        .k-stepper .k-step-indicator:hover {
            border: solid 1px #13499f;
            background-color: #e3e9f3 !important;
            color: #13499f;
        }

    .k-stepper .k-step-current .k-step-indicator {
        background-color: #13499f;
        color: #fff;
    }

        .k-stepper .k-step-current .k-step-indicator:hover {
            border: solid 1px #0b2d65 !important;
            background-color: #0b2d65 !important;
            transition-duration: 100ms !important;
        }

    .k-stepper .k-step-current .k-step-indicator {
        background-color: #13499f;
        color: #fff;
    }

        .k-stepper .k-step-current .k-step-indicator::after {
            color: red;
        }

            .k-stepper .k-step-current .k-step-indicator::after .k-step-indicator {
                background-color: #0b2d65;
                color: white !important;
            }

    .k-stepper .k-step-label {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        margin-top: 0px !important;
    }

    .k-stepper .k-step-text {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
    }

.k-slider.k-state-disabled .k-slider-track, .k-slider.k-state-disabled .k-slider-selection, .k-slider.k-state-disabled .k-draghandle {
    background-color: #13499f;
}

.k-slider.k-state-focused .k-draghandle {
    box-shadow: 0 0 0 6px #e3e9f3, 0 0 0 8px #13499f !important;
}

.slider-textbox {
    height: 34px;
    width: 43px;
    text-align: center;
    border: 1px solid #767676;
}

    .slider-textbox:hover {
        border-color: #13499f;
        box-shadow: 0 0 0 0.1rem #13499f;
    }

    .slider-textbox .k-state-focused {
        border-color: #13499f;
        border-radius: 4px;
        box-shadow: 0 0 0 2.5px #13499f;
    }

.k-numerictextbox .k-numeric-wrap {
    border: none;
}

    .k-numerictextbox .k-numeric-wrap .k-input {
        text-align: center;
    }

.k-slider {
    font-family: 'Lato', sans-serif;
    width: 288px;
    border: none;
    margin-left: 5px;
}

    .k-slider .k-slider-track {
        border: solid 1px #acacac;
    }

    .k-slider .k-draghandle {
        width: 13px;
        height: 13px;
    }

    .k-slider .k-state-focused .k-draghandle {
        box-shadow: 0 0 0 11px #e3e9f3 !important;
        background-color: red;
    }

    .k-slider .k-draghandle {
        border-color: #13499f;
        color: #fff;
        background-color: #13499f;
        border-radius: 50%;
    }

        .k-slider .k-draghandle:hover {
            background-color: #13499f;
            box-shadow: 0 0 0 6px #e3e9f3;
        }

.slider-control {
    display: grid;
    grid-template-columns: 209px 43px 26px;
    grid-gap: 8px;
}

    .slider-control .slider-box {
        border-radius: 4px;
        border: solid 1px #767676;
        background-color: #fff;
        text-align: center;
        padding-top: 3px;
    }

    .slider-control .slider-title {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
    }

    .slider-control .slider-label {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        padding-top: 3px;
    }

.slider-time-control {
    display: grid;
    width: 283px;
    grid-template-columns: 50% 50%;
    grid-gap: 8px;
}

    .slider-time-control .slider-box {
        border-radius: 4px;
        border: solid 1px #767676;
        background-color: #fff;
        text-align: center;
        padding-top: 3px;
    }

    .slider-time-control .k-dropdown-wrapper {
        width: 136px;
        height: 36px;
    }

        .slider-time-control .k-dropdown-wrapper .k-dropdown-wrap .k-input {
            margin-top: 0px !important;
        }

    .slider-time-control .slider-time-label {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #666;
        padding-left: 16px;
        margin-bottom: 0px;
    }

code {
    display: block;
}

@media only screen and (max-width: 769px) {
    .k-tabstrip .k-item .tab-icon {
        margin-bottom: 0px;
        margin-right: 0px;
    }
}

.labSelector {
    font-family: 'Lato', sans-serif;
}

    .labSelector .k-card {
        box-shadow: none;
        border-radius: 0px;
        border: solid 1px #bdbdbd;
    }

        .labSelector .k-card:focus {
            outline: none !important;
            border: solid 1px #bdbdbd !important;
        }

        .labSelector .k-card .k-card-body {
            padding: 5px 8px 5px 8px !important;
        }

            .labSelector .k-card .k-card-body .radio-custom-label {
                margin: 0px;
                font-size: 16px;
                font-weight: bold;
                font-stretch: normal;
                font-style: normal;
                line-height: 1.5;
                letter-spacing: 0.12px;
                color: #221e1e;
            }

            .labSelector .k-card .k-card-body .checkbox-wrapper .k-checkbox_label:before {
                position: absolute;
                left: 15px;
                top: 13px;
            }

            .labSelector .k-card .k-card-body .checkbox-wrapper .k-checkbox_label svg {
                left: 19px !important;
                top: 17px !important;
            }

            .labSelector .k-card .k-card-body .checkbox-wrapper .k-checkbox_label {
                font-size: 16px;
                font-weight: bold;
                font-stretch: normal;
                font-style: normal;
                line-height: 1.5;
                letter-spacing: 0.12px;
                color: #221e1e;
            }

            .labSelector .k-card .k-card-body .body-content {
                padding-left: 43px;
            }

                .labSelector .k-card .k-card-body .body-content .subTitle {
                    font-size: 14px;
                    font-weight: normal;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: normal;
                    letter-spacing: 0.04px;
                    color: #221e1e;
                }

                .labSelector .k-card .k-card-body .body-content .distance {
                    font-size: 14px;
                    font-weight: normal;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: normal;
                    letter-spacing: 0.04px;
                    color: #767676;
                    margin-top: 5px;
                    margin-bottom: 5px;
                }

                .labSelector .k-card .k-card-body .body-content .action-btn {
                    display: grid;
                    grid-template-columns: 60% 40%;
                    grid-gap: 8px;
                    align-items: center;
                }

                    .labSelector .k-card .k-card-body .body-content .action-btn .k-button {
                        padding: 3px 5px 3px 5px !important;
                        margin-top: 9px;
                    }

                        .labSelector .k-card .k-card-body .body-content .action-btn .k-button .direction-icon {
                            font-size: 22px;
                            margin-right: 5px;
                        }

.custom-calendar {
    font-family: 'Lato', sans-serif;
}

    .custom-calendar .k-i-arrow-chevron-right::before, .custom-calendar .k-i-arrowhead-e::before {
        content: "\e005";
    }

    .custom-calendar .k-i-arrow-chevron-left::before, .custom-calendar .k-i-arrowhead-e::before {
        content: "\e007";
    }

    .custom-calendar .k-button:hover {
        background-color: #c4d1e7 !important;
    }

    .custom-calendar .k-calendar-yearview {
        padding: 10px !important;
    }

        .custom-calendar .k-calendar-yearview .k-calendar-view tbody th {
            padding-left: 5px;
            padding-right: 5px;
        }

        .custom-calendar .k-calendar-yearview .k-calendar-header {
            padding: 0px;
        }

            .custom-calendar .k-calendar-yearview .k-calendar-header .k-today {
                display: none;
            }

            .custom-calendar .k-calendar-yearview .k-calendar-header .k-button {
                width: 207px;
                border-radius: 0px;
                margin-top: -10px;
            }

                .custom-calendar .k-calendar-yearview .k-calendar-header .k-button .k-state-hover {
                    background-color: #c4d1e7 !important;
                }

                .custom-calendar .k-calendar-yearview .k-calendar-header .k-button:hover {
                    background-color: #c4d1e7 !important;
                }

                .custom-calendar .k-calendar-yearview .k-calendar-header .k-button .custom {
                    font-size: 16px;
                    font-weight: bold;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: 1.5;
                    letter-spacing: 0.02px;
                    color: #221e1e;
                }

        .custom-calendar .k-calendar-yearview tbody {
            z-index: 1000;
            margin-right: -1px;
            margin-bottom: -1px;
        }

            .custom-calendar .k-calendar-yearview tbody th {
                width: 41px;
                height: 30px;
                text-align: center;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: 1.33;
                letter-spacing: 0.75px;
                color: #767676;
                text-transform: uppercase;
                opacity: 100%;
                padding: 0px;
            }

            .custom-calendar .k-calendar-yearview tbody .k-link {
                border-radius: 4px;
            }

                .custom-calendar .k-calendar-yearview tbody .k-link:hover {
                    background-color: #13499f;
                    color: #fff;
                }

            .custom-calendar .k-calendar-yearview tbody .k-today .k-link {
                border: 2px solid #13499f !important;
                color: black;
            }

            .custom-calendar .k-calendar-yearview tbody .k-state-focused .k-link {
                border: 2px solid #13499f !important;
            }

                .custom-calendar .k-calendar-yearview tbody .k-state-focused .k-link:hover {
                    background-color: #13499f !important;
                    color: #fff;
                }

    .custom-calendar .k-calendar-decadeview {
        padding: 10px !important;
    }

        .custom-calendar .k-calendar-decadeview .k-calendar-view tbody th {
            padding-left: 5px;
            padding-right: 5px;
        }

        .custom-calendar .k-calendar-decadeview .k-calendar-header {
            padding: 0px;
        }

            .custom-calendar .k-calendar-decadeview .k-calendar-header .k-today {
                display: none;
            }

            .custom-calendar .k-calendar-decadeview .k-calendar-header .k-button {
                width: 207px;
                border-radius: 0px;
                margin-top: -10px;
            }

                .custom-calendar .k-calendar-decadeview .k-calendar-header .k-button .k-state-hover {
                    background-color: #c4d1e7 !important;
                }

                .custom-calendar .k-calendar-decadeview .k-calendar-header .k-button:hover {
                    background-color: #c4d1e7 !important;
                }

                .custom-calendar .k-calendar-decadeview .k-calendar-header .k-button .custom {
                    font-size: 16px;
                    font-weight: bold;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: 1.5;
                    letter-spacing: 0.02px;
                    color: #221e1e;
                }

        .custom-calendar .k-calendar-decadeview tbody {
            z-index: 1000;
            margin-right: -1px;
            margin-bottom: -1px;
        }

            .custom-calendar .k-calendar-decadeview tbody th {
                width: 41px;
                height: 30px;
                text-align: center;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: 1.33;
                letter-spacing: 0.75px;
                color: #767676;
                text-transform: uppercase;
                opacity: 100%;
                padding: 0px;
            }

            .custom-calendar .k-calendar-decadeview tbody .k-link {
                border-radius: 4px;
            }

                .custom-calendar .k-calendar-decadeview tbody .k-link:hover {
                    background-color: #13499f;
                    color: #fff;
                }

            .custom-calendar .k-calendar-decadeview tbody .k-today .k-link {
                border: 2px solid #13499f !important;
                color: black;
            }

            .custom-calendar .k-calendar-decadeview tbody .k-state-focused .k-link {
                border: 2px solid #13499f !important;
            }

                .custom-calendar .k-calendar-decadeview tbody .k-state-focused .k-link:hover {
                    background-color: #13499f !important;
                    color: #fff;
                }

    .custom-calendar .k-calendar-monthview .k-calendar-view tbody th {
        padding-left: 5px;
        padding-right: 5px;
    }

    .custom-calendar .k-calendar-monthview .k-calendar-header {
        padding: 0px;
    }

        .custom-calendar .k-calendar-monthview .k-calendar-header .k-today {
            display: none;
        }

        .custom-calendar .k-calendar-monthview .k-calendar-header .k-button {
            width: 207px;
            border-radius: 0px;
        }

            .custom-calendar .k-calendar-monthview .k-calendar-header .k-button .k-state-hover {
                background-color: #c4d1e7 !important;
            }

            .custom-calendar .k-calendar-monthview .k-calendar-header .k-button:hover {
                background-color: #c4d1e7 !important;
            }

            .custom-calendar .k-calendar-monthview .k-calendar-header .k-button .custom {
                font-size: 16px;
                font-weight: bold;
                font-stretch: normal;
                font-style: normal;
                line-height: 1.5;
                letter-spacing: 0.02px;
                color: #221e1e;
            }

    .custom-calendar .k-calendar-monthview .k-content tbody {
        z-index: 1000;
        margin-right: -1px;
        margin-bottom: -1px;
    }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-today .k-link .available {
            border: 1px solid #221e1e !important;
            color: black;
            border-radius: 4px;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-today .k-link .notAvailable {
            border: 1px solid #221e1e !important;
            color: black;
            border-radius: 4px;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-today .k-link .closed {
            border: 1px solid #221e1e !important;
            color: #221e1e;
            border-radius: 4px;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled {
            background-color: #ececec;
            opacity: 1;
        }

            .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled .k-link {
                opacity: 1;
                background-color: #ececec;
                color: #767676;
            }

                .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled .k-link .available {
                    color: #767676;
                }

                .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled .k-link .notAvailable {
                    color: #767676;
                }

                .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled .k-link .available::after {
                    content: '';
                }

                .custom-calendar .k-calendar-monthview .k-content tbody .k-state-disabled .k-link .closed {
                    color: #221e1e !important;
                    border-radius: 4px;
                }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-state-focused.k-state-disabled .k-link {
            background-color: #ececec !important;
            border: none;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-state-focused.k-state-disabled .available {
            background-color: transparent !important;
            color: #221e1e !important;
            border: 1px solid transparent;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-state-focused.k-state-disabled .notAvailable {
            background-color: transparent !important;
            color: #767676 !important;
            border: 1px solid transparent;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody .k-state-focused.k-state-disabled .closed {
            border: none !important;
            color: #221e1e !important;
            border-radius: 4px;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody th {
            width: 41px;
            height: 30px;
            text-align: center;
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.33;
            letter-spacing: 0.75px;
            color: #767676;
            text-transform: uppercase;
            opacity: 100%;
            padding: 0px;
            border-bottom: solid 1px #acacac;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody td {
            width: 41px;
            height: 50px;
            border-right: solid 1px #acacac;
            border-radius: 0px;
        }

            .custom-calendar .k-calendar-monthview .k-content tbody td .k-link {
                border-radius: 0px;
                width: 41px;
                height: 50px;
                padding-top: 0px;
                align-items: baseline;
                padding: 0px;
                background-color: #fff;
            }

            .custom-calendar .k-calendar-monthview .k-content tbody td:last-child {
                border-right: none;
            }

            .custom-calendar .k-calendar-monthview .k-content tbody td:nth-last-child(1) {
                border-right: solid 1px #acacac;
            }

        .custom-calendar .k-calendar-monthview .k-content tbody tr:nth-child(5) td {
            border-bottom: solid 1px #acacac !important;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr:nth-child(6) td {
            border-bottom: solid 1px #acacac !important;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr:nth-child(7) td {
            border-bottom: solid 1px #acacac !important;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr:nth-child(8) td {
            border-bottom: solid 1px #acacac !important;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr:nth-last-child(0) {
            border-bottom: solid 1px #acacac !important;
            border-color: red;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr td {
            border-bottom: solid 1px #acacac;
            border-radius: 0px;
        }

        .custom-calendar .k-calendar-monthview .k-content tbody tr .k-empty {
            border-top: none;
        }

    .custom-calendar .k-state-selected {
        background-color: white;
    }

        .custom-calendar .k-state-selected .k-link {
            background-color: white !important;
            border-color: #acacac !important;
        }

            .custom-calendar .k-state-selected .k-link .available {
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
            }

            .custom-calendar .k-state-selected .k-link .notAvailable {
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
            }

            .custom-calendar .k-state-selected .k-link .appointmentMade {
                background: none;
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
            }

        .custom-calendar .k-state-selected .k-state-focused .k-link {
            background-color: #13499f !important;
            border-color: #acacac !important;
        }

            .custom-calendar .k-state-selected .k-state-focused .k-link .available {
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
                border: 1px solid #13499f;
            }

            .custom-calendar .k-state-selected .k-state-focused .k-link .notAvailable {
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
                border: 1px solid #13499f;
            }

            .custom-calendar .k-state-selected .k-state-focused .k-link .appointmentMade {
                background: none;
                background-color: #13499f !important;
                border-radius: 50% !important;
                color: #fff !important;
                border: 1px solid #13499f;
            }

    .custom-calendar .k-state-focused {
        background-color: white;
    }

        .custom-calendar .k-state-focused .k-link {
            background-color: white !important;
            border-color: #acacac !important;
        }

            .custom-calendar .k-state-focused .k-link .available {
                background-color: #fff !important;
                border-radius: 50% !important;
                color: #221e1e !important;
                border: 1px solid #13499f;
            }

                .custom-calendar .k-state-focused .k-link .available:hover {
                    background-color: #c4d1e4 !important;
                }

                .custom-calendar .k-state-focused .k-link .available .k-state-selected {
                    background-color: #fff !important;
                }

            .custom-calendar .k-state-focused .k-link .notAvailable {
                background-color: #fff !important;
                border-radius: 50% !important;
                color: #221e1e !important;
                border: 1px solid #13499f;
            }

                .custom-calendar .k-state-focused .k-link .notAvailable:hover {
                    background-color: #c4d1e4 !important;
                }

            .custom-calendar .k-state-focused .k-link .appointmentMade {
                background: none;
                background-color: #fff !important;
                border-radius: 50% !important;
                color: #221e1e !important;
                border: 1px solid #13499f;
            }

                .custom-calendar .k-state-focused .k-link .appointmentMade:hover {
                    background-color: #c4d1e4 !important;
                }

            .custom-calendar .k-state-focused .k-link .closed {
                border: none;
            }

                .custom-calendar .k-state-focused .k-link .closed:hover {
                    background-color: #c4d1e4 !important;
                }

        .custom-calendar .k-state-focused.k-state-selected {
            background-color: white;
        }

            .custom-calendar .k-state-focused.k-state-selected .k-link {
                background-color: white !important;
                border-color: #acacac !important;
            }

                .custom-calendar .k-state-focused.k-state-selected .k-link .available {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-state-selected .k-link .available:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

                .custom-calendar .k-state-focused.k-state-selected .k-link .notAvailable {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-state-selected .k-link .notAvailable:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

                .custom-calendar .k-state-focused.k-state-selected .k-link .appointmentMade {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-state-selected .k-link .appointmentMade:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

        .custom-calendar .k-state-focused.k-today {
            background-color: white;
            border-color: #acacac !important;
        }

            .custom-calendar .k-state-focused.k-today .k-link {
                background-color: white !important;
                border-color: #acacac !important;
            }

                .custom-calendar .k-state-focused.k-today .k-link .available {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-today .k-link .available:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

                .custom-calendar .k-state-focused.k-today .k-link .notAvailable {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-today .k-link .notAvailable:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

                .custom-calendar .k-state-focused.k-today .k-link .appointmentMade {
                    background-color: #13499f !important;
                    border-radius: 50% !important;
                    color: #fff !important;
                    border: 1px solid #13499f;
                    box-shadow: 0 0 0 1px #e3e9f3, 0 0 0 2px #13499f;
                }

                    .custom-calendar .k-state-focused.k-today .k-link .appointmentMade:hover {
                        background-color: #c4d1e4 !important;
                        color: #221e1e !important;
                    }

    .custom-calendar .closed {
        position: relative;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        width: 100%;
        height: 100%;
        background-color: #fbdde1;
    }

        .custom-calendar .closed::after {
            position: absolute;
            bottom: 1px;
            left: 2px;
            top: 26px;
            margin-left: 0px;
            content: "Closed";
            border-radius: 0px;
            font-size: 12px;
            color: #221e1e;
            line-height: 1.5;
            letter-spacing: 0.05px;
        }

    .custom-calendar .notAvailable {
        position: relative;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #767676;
        width: 25px;
        height: 25px;
        border: 1px solid transparent;
        margin-top: 2px;
        margin-left: 0px !important;
    }

        .custom-calendar .notAvailable:hover {
            background-color: #c4d1e4;
            border-radius: 50%;
            color: #221e1e;
        }

        .custom-calendar .notAvailable::after {
            position: absolute;
            bottom: 1px;
            left: 5px;
            top: 26px;
            width: 15px;
            height: 15px;
            margin-left: 0px;
            content: '';
            background-size: contain;
            background-position: center center;
            background-image: url('./assets/close.svg');
            background-repeat: no-repeat;
            border-radius: 0px;
            font-size: 12px;
            color: #767676;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #e51937;
        }

    .custom-calendar .available {
        position: relative;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        width: 25px;
        height: 25px;
        border: 1px solid transparent;
        margin-top: 2px;
    }

        .custom-calendar .available:hover {
            background-color: #c4d1e4;
            border-radius: 50%;
            color: #221e1e;
        }

        .custom-calendar .available::after {
            position: absolute;
            bottom: 1px;
            left: 4px;
            top: 26px;
            width: 16px;
            height: 16px;
            margin-left: 0px;
            content: '';
            background-size: contain;
            background-position: center center;
            background-image: url('./assets/checked.svg');
            background-repeat: no-repeat;
            border-radius: 0px;
            font-size: 12px;
            color: #221e1e;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #2e8532;
        }

    .custom-calendar .appointmentMade {
        position: relative;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #fff;
        width: 25px;
        height: 25px;
        border: 1px solid transparent;
        margin-top: 2px;
        background: url('./assets/made.svg') no-repeat;
        background-size: 24px 24px;
    }

        .custom-calendar .appointmentMade:hover {
            background-color: #c4d1e4;
            border-radius: 50%;
            color: #221e1e;
        }

        .custom-calendar .appointmentMade::after {
            position: absolute;
            bottom: 1px;
            left: 4px;
            top: 26px;
            width: 16px;
            height: 16px;
            margin-left: 0px;
            content: '';
            background-size: contain;
            background-position: center center;
            background-image: url('./assets/checked.svg');
            background-repeat: no-repeat;
            border-radius: 0px;
            font-size: 12px;
            color: #221e1e;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #2e8532;
        }

    .custom-calendar .k-calendar-header {
        justify-content: center;
    }

    .custom-calendar .k-button.k-prev-view, .custom-calendar .k-button.k-next-view {
        position: absolute;
        z-index: 2;
        top: 0.5rem;
    }

    .custom-calendar .k-button.k-next-view {
        right: -19px;
        top: 0px;
        background-color: transparent;
        box-shadow: none;
        color: black;
        border-radius: 0px !important;
    }

        .custom-calendar .k-button.k-next-view.k-i-arrow-chevron-left::before {
            content: "\e007";
        }

    .custom-calendar .k-button.k-prev-view {
        left: -19px;
        top: 0px;
        background-color: transparent;
        box-shadow: none;
        color: black;
        border-radius: 0px !important;
    }

    .custom-calendar.k-calendar.k-calendar-infinite .k-calendar-view.k-calendar-monthview {
        padding-left: 0px;
        padding-right: 0px;
        border-radius: 4px;
    }

.calendar-icons {
    border-radius: 4px;
    color: #767676;
    cursor: pointer;
}

    .calendar-icons:hover {
        background-color: #e3e9f3;
        box-shadow: 0 0 0 2px #e3e9f3;
    }

    .calendar-icons:focus {
        background-color: #e3e9f3;
        box-shadow: 0 0 0 2px #e3e9f3, 0 0 0 4px #13499f;
        outline: none;
    }

.calendar-legend {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #221e1e;
}

.bargraph {
    font-family: 'Lato', sans-serif;
    border: none;
    background-color: #efefef;
    width: 100%;
    max-width: 248px;
    display: block;
}

    .bargraph .k-progress-status {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        padding-bottom: 1px;
        padding-right: 0px;
    }

    .bargraph .k-state-selected {
        background-color: #13499f;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        margin-top: -5px;
    }

.bargraph-label {
    font-family: 'Lato', sans-serif;
    margin-bottom: -8px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #221e1e;
    display: inline-block;
}

    .bargraph-label:focus {
        border: none;
        border-radius: 2px;
        box-shadow: 0 0 0 2px #13499f;
        outline: none;
    }

.barGraph-bottomLabel {
    font-family: 'Lato', sans-serif;
    display: inline-block;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #767676;
    margin-top: -3px;
}

    .barGraph-bottomLabel:focus {
        border: none;
        border-radius: 2px;
        box-shadow: 0 0 0 2px #13499f;
        outline: none;
    }

.archive-card {
    max-width: 1129px;
}

    .archive-card .k-card-body {
        padding: 0px;
    }

    .archive-card .hyperLink {
        color: #13499f;
        border-bottom: 1px solid #13499f;
    }

        .archive-card .hyperLink:focus {
            color: #13499f;
            border-bottom: 1px solid #0b1e3d;
            text-shadow: 1px 0 0 #0b1e3d;
        }

        .archive-card .hyperLink:visited {
            color: #13499f;
            border-bottom: 2px solid #13499f;
            text-shadow: 1px 0 0 #0b1e3d;
        }

.archive-cardWrapper {
    display: grid;
    grid-template-columns: 109px 65%;
    grid-gap: 10px;
}

.archive-image {
    max-height: 100px;
    height: 100%;
}

.archive-information {
    align-self: center;
    font-family: 'Lato', sans-serif;
}

    .archive-information h4 {
        font-size: 18px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #13499f;
        text-decoration: underline;
    }

    .archive-information h5 {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
    }

.ad-card {
    max-width: 1120px;
}

    .ad-card .k-card-body {
        padding: 0px;
    }

    .ad-card .k-button {
        padding-left: 2px;
        padding-right: 2px;
    }

.ad-card-mobile {
    max-width: 700px;
}

    .ad-card-mobile .k-card-body {
        padding: 0px;
    }

    .ad-card-mobile .k-button {
        padding-left: 2px;
        padding-right: 2px;
    }

    .ad-card-mobile .ad-cardWrapper {
        display: grid;
        grid-template-columns: 50% 50%;
        grid-gap: 10px;
    }

.ad-title {
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.03px;
    color: #221e1e;
    padding: 16px 7px 10px 15px;
}

.archive-image {
    max-height: 187px;
    height: 100%;
}

.ad-cardWrapper {
    display: grid;
    grid-template-columns: minmax(100px, 200px) 1fr 1fr;
    grid-template-columns: 12% 28% 58%;
    grid-gap: 10px;
}

.ad-information {
    padding-top: 16px;
    padding-right: 16px;
    font-family: 'Lato', sans-serif;
}

    .ad-information h4 {
        font-size: 18px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.03px;
        color: #13499f;
    }

    .ad-information h5 {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        max-width: 580px;
    }

.ad-mobile-information {
    font-family: 'Lato', sans-serif;
    padding-left: 12px !important;
    padding-right: 23px !important;
}

    .ad-mobile-information h4 {
        font-size: 18px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.03px;
        color: #13499f;
    }

    .ad-mobile-information h5 {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
        max-width: 580px;
    }

.ad-subTitle {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #767676;
}

    .ad-subTitle .ad-text {
        padding-top: 5px;
        font-size: 18px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
    }

.ad-button {
    margin-right: 5px;
    margin-top: 3px;
}

.ad-advertisement {
    font-family: 'Lato', sans-serif;
    align-self: center;
    text-align: end;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #767676;
}

.singlepoll-card {
    border: 1px solid #13499f;
}

    .singlepoll-card:focus {
        box-shadow: 0 0 0 1px #13499f;
        border: 1px solid #13499f !important;
    }

    .singlepoll-card .card-title {
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.02px;
        color: #221e1e;
        margin-bottom: 10px;
    }

    .singlepoll-card .card-body {
        font-family: 'Lato', sans-serif;
        padding: 0px;
        font-size: 18px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
        margin-bottom: 16px;
    }

    .singlepoll-card .thankyou {
        margin-top: 27px;
        margin-bottom: 39px;
    }

        .singlepoll-card .thankyou h5 {
            font-family: 'Lato', sans-serif;
            text-align: center;
            font-size: 18px;
            font-weight: normal;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.5;
            letter-spacing: 0.09px;
            color: #221e1e;
        }

    .singlepoll-card .bottom-text {
        margin-bottom: 0px;
    }

        .singlepoll-card .bottom-text h5 {
            font-family: 'Lato', sans-serif;
            text-align: start;
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #767676;
            margin-bottom: 0px;
        }

    .singlepoll-card .card-subTitle {
        font-family: 'Lato', sans-serif;
        font-size: 14px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #767676;
    }

    .singlepoll-card .card-text {
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.04px;
        color: #221e1e;
    }

.graph-wrapper {
    border-radius: 4px;
    border: solid 1px #bdbdbd;
    background-color: #fff;
    padding: 30px;
}

.hand-cursor {
    cursor: pointer;
}

.graph-header {
    margin-left: 35px;
    display: grid;
    grid-template-columns: 90px 118px 118px 220px;
    margin-bottom: 15px;
    margin-top: 30px;
}

    .graph-header .header-text {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
        color: #221e1e;
        margin-left: 8px;
        margin-right: 20px;
        vertical-align: baseline;
    }

.tooltip-title {
    font-family: 'Lato', sans-serif;
    width: 150px;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.12px;
    color: #221e1e;
}

.tooltip-subTitle {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #767676 !important;
}

.tooltip-value {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #221e1e;
}

.zoom-icon-graph {
    font-size: 14px !important;
}

.graph-note_title {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #000;
}

.graph-note-text {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #000;
}

.graph-note-popup {
    background-color: aliceblue;
    border: 1px solid black;
    position: absolute;
    border: solid 1px #bdbdbd;
    background-color: #fff;
    border-radius: 4px;
    padding: 5px 16px 16px 16px;
    width: 280px;
}

    .graph-note-popup::after {
        content: " ";
        position: absolute;
        width: 25px;
        height: 25px;
        border-top: 0px solid #fff;
        border-right: 1px solid #bdbdbd;
        border-bottom: 1px solid #bdbdbd;
        border-left: 0px solid #fff;
        top: 100%;
        left: 50%;
        margin-left: -12px;
        content: '';
        margin-top: -12px;
        background: #fff;
        transform: rotate(45deg);
    }

.graph-help-message {
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #000;
}

.chunck-graphbar-div {
    position: relative;
    max-width: 683px;
    margin-top: 20px;
}

.chunck-graphbar-wrapper {
    font-family: 'Lato', sans-serif;
    border-radius: 20px;
    display: grid;
    grid-template-columns: 23% 41% 36%;
}

    .chunck-graphbar-wrapper .chunckBar-min-max {
        font-size: 12px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
        color: #221e1e;
        position: absolute;
        right: -12px;
        bottom: -19px;
    }

    .chunck-graphbar-wrapper .lowBar {
        position: relative;
        height: 20px;
        background-color: #e51937;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
    }

    .chunck-graphbar-wrapper .normalBar {
        height: 20px;
        background-color: #0f803e;
        position: relative;
    }

    .chunck-graphbar-wrapper .highBar {
        height: 20px;
        background-color: #e51937;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
    }

.chunck-label-div {
    position: relative;
    max-width: 683px;
    margin-top: 5px;
}

.chunck-graphbar-wrapper {
    border-radius: 20px;
    display: grid;
    grid-template-columns: 23% 41% 36%;
}

    .chunck-graphbar-wrapper .chunck-graphBar-marker {
        position: absolute;
        width: 2px;
        height: 20px;
        left: 37.5%;
        background-color: black;
        z-index: 2;
    }

    .chunck-graphbar-wrapper .chunck-graphBar-popup {
        position: absolute;
        height: 39px;
        border: solid 1px #767676;
        background-color: #fff;
        left: 33%;
        top: -48px;
        font-weight: bold;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
        border-radius: 4px;
        padding: 5px;
    }

        .chunck-graphbar-wrapper .chunck-graphBar-popup .chunck-graphBar-unit {
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: italic;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #767676;
        }

        .chunck-graphbar-wrapper .chunck-graphBar-popup:focus {
            outline: none;
            box-shadow: 0 0 0 4px white, 0 0 0 6px #13499f;
        }

        .chunck-graphbar-wrapper .chunck-graphBar-popup::after {
            content: " ";
            position: absolute;
            width: 5px;
            height: 5px;
            border-top: 0px solid #fff;
            border-right: 1px solid #767676;
            border-bottom: 1px solid #767676;
            border-left: 0px solid #fff;
            top: 100%;
            left: 46%;
            margin-left: -12px;
            content: '';
            margin-top: -2px;
            background: #fff;
            transform: rotate(45deg);
        }

    .chunck-graphbar-wrapper .firstLabel {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbar-wrapper .middleLabel {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #0f803e;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbar-wrapper .lastLabel {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbar-wrapper .low-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbar-wrapper .normal-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #0f803e;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbar-wrapper .high-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

.chunck-graphbarTwo-wrapper {
    font-family: 'Lato', sans-serif;
    border-radius: 20px;
    display: grid;
    grid-template-columns: 23% 77%;
}

    .chunck-graphbarTwo-wrapper .chunck-graphBar-marker {
        position: absolute;
        width: 2px;
        height: 20px;
        left: 37.5%;
        background-color: black;
        z-index: 2;
    }

    .chunck-graphbarTwo-wrapper .chunck-graphBar-popup {
        position: absolute;
        height: 39px;
        border: solid 1px #767676;
        background-color: #fff;
        left: 33%;
        top: -48px;
        font-weight: bold;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
        border-radius: 4px;
        padding: 5px;
    }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-popup .chunck-graphBar-unit {
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: italic;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #767676;
        }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-popup:focus {
            outline: none;
            box-shadow: 0 0 0 4px white, 0 0 0 6px #13499f;
        }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-popup::after {
            content: " ";
            position: absolute;
            width: 5px;
            height: 5px;
            border-top: 0px solid #fff;
            border-right: 1px solid #767676;
            border-bottom: 1px solid #767676;
            border-left: 0px solid #fff;
            top: 100%;
            left: 46%;
            margin-left: -12px;
            content: '';
            margin-top: -2px;
            background: #fff;
            transform: rotate(45deg);
        }

    .chunck-graphbarTwo-wrapper .chunck-graphBar-high-popup {
        position: absolute;
        height: 39px;
        border: solid 1px #767676;
        background-color: #fff;
        left: 33%;
        top: -48px;
        font-weight: bold;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.09px;
        color: #221e1e;
        border-radius: 4px;
        padding: 5px;
    }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-high-popup .chunck-graphBar-unit {
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: italic;
            line-height: 1.5;
            letter-spacing: 0.05px;
            color: #767676;
        }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-high-popup:focus {
            outline: none;
            box-shadow: 0 0 0 4px white, 0 0 0 6px #13499f;
        }

        .chunck-graphbarTwo-wrapper .chunck-graphBar-high-popup::after {
            content: " ";
            position: absolute;
            width: 5px;
            height: 5px;
            border-top: 0px solid #fff;
            border-right: 1px solid #767676;
            border-bottom: 1px solid #767676;
            border-left: 0px solid #fff;
            top: 100%;
            left: 38%;
            margin-left: -12px;
            content: '';
            margin-top: -2px;
            background: #fff;
            transform: rotate(45deg);
        }

    .chunck-graphbarTwo-wrapper .chunckBar-min-max {
        font-size: 12px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
        color: #221e1e;
        position: absolute;
        right: -12px;
        bottom: -19px;
    }

    .chunck-graphbarTwo-wrapper .lowBar {
        position: relative;
        height: 20px;
        background-color: #e51937;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
    }

    .chunck-graphbarTwo-wrapper .normalBar-two {
        height: 20px;
        background-color: #0f803e;
        position: relative;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
    }

    .chunck-graphbarTwo-wrapper .highBar {
        height: 20px;
        background-color: #0f803e;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
    }

    .chunck-graphbarTwo-wrapper .highBar-two {
        position: relative;
        height: 20px;
        background-color: #e51937;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
    }

    .chunck-graphbarTwo-wrapper .low-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbarTwo-wrapper .normal-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #0f803e;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbarTwo-wrapper .high-label {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: center;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
    }

    .chunck-graphbarTwo-wrapper .normal-label-lowGraph {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: end;
        color: #0f803e;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
        margin-right: 10%;
    }

    .chunck-graphbarTwo-wrapper .high-label-highGraph {
        font-family: 'Lato', sans-serif;
        font-size: 12px;
        text-align: end;
        color: #e51937;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: 0.05px;
        margin-right: 10%;
    }

.password-strength-bargrah {
    margin-top: 8px;
    margin-left: 2px;
    max-width: 357px;
}

    .password-strength-bargrah .k-state-selected {
        border-radius: 4px;
    }

.password-strength-sublabel {
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: italic;
    line-height: 1.5;
    letter-spacing: 0.05px;
    color: #221e1e;
    margin-bottom: 10px;
}

.password-strength-title {
    font-family: 'Lato', sans-serif;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #221e1e;
    margin-bottom: 8px;
}

.password-strength-text {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #221e1e;
    margin-bottom: 8px;
}

.textbox-strength-icon {
    font-size: 20px;
    margin-right: 13px;
    margin-bottom: 5px;
}

.barGraphRed .k-state-selected {
    background-color: #e51937 !important;
}

.barGraphOrange .k-state-selected {
    background-color: #d06400 !important;
}

.barGraphGreen .k-state-selected {
    background-color: #0f803e !important;
}

.birthDate-wrapper {
    display: grid;
    grid-template-columns: 73px 117px 82px;
    grid-gap: 8px;
}

.birthDate-dropdown-day {
    max-width: 73px;
}

    .birthDate-dropdown-day .k-dropdown-wrap .k-input {
        margin-left: 8px;
    }

    .birthDate-dropdown-day .k-dropdown-wrap .k-select {
        padding-left: 0px !important;
    }

.birthDate-dropdown-month {
    max-width: 117px;
}

    .birthDate-dropdown-month .k-dropdown-wrap .k-input {
        margin-left: 8px;
    }

    .birthDate-dropdown-month .k-dropdown-wrap .k-select {
        padding-left: 0px !important;
    }

.birthDate-dropdown-year {
    max-width: 82px;
}

    .birthDate-dropdown-year .k-dropdown-wrap .k-input {
        margin-left: 8px;
    }

    .birthDate-dropdown-year .k-dropdown-wrap .k-select {
        padding-left: 0px !important;
    }

.birthDate-dropdown-label {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.04px;
    color: #666;
    margin-left: 8px;
}

.icons-focus:focus {
    border-radius: 4px;
    box-shadow: 0 0 0 2px transparent 0 0 0 4px #13499f;
}

.light-label {
    color: #666;
}

.dark-label {
    color: #212529
}

@media only screen and (max-width: 800px) {
    .ad-cardWrapper {
        grid-template-columns: repeat(auto-fit, minmax(130px, 145px) 70%);
    }

    .ad-image {
        margin-left: 16px;
    }
}

@media only screen and (max-width: 767px) {
    .mobile-grid .k-card-body .card-body-subGrid {
        display: grid;
        grid-template-columns: 17% 54%;
        grid-gap: 10px;
    }

    .mobile-grid .k-card-body .card-body-subGrid-status {
        display: grid;
        grid-template-columns: 17% 38%;
        grid-gap: 10px;
    }

    .mobile-grid .k-card-body .card-body-subGrid-section {
        display: grid;
        grid-template-columns: 17% 43%;
        grid-gap: 10px;
    }
}

@media only screen and (max-width: 700px) {
    .k-tabstrip-optio2 .k-item {
        height: 36px;
        width: 24.9%;
    }

    .graph-header {
        grid-template-columns: repeat(auto-fill, minmax(118px, 218px));
        margin-bottom: 0px;
        margin-top: 10px;
        margin-left: 27px;
    }
}

.k-chart-tooltip-wrapper {
    margin-left: -150px;
}

@media only screen and (max-width: 600px) {
    .k-panelbar {
        width: 288px;
    }

    .card-wrapper {
        margin-bottom: 5px !important;
        padding: 0px !important;
    }
}

@media only screen and (max-width: 500px) {
    .mobile-grid .k-card-body {
        padding-left: 39px !important;
    }

        .mobile-grid .k-card-body .card-body-subGrid {
            grid-template-columns: 32% 65%;
        }

        .mobile-grid .k-card-body .card-body-subGrid-status {
            grid-template-columns: 32% 65%;
        }

        .mobile-grid .k-card-body .card-body-subGrid-section {
            grid-template-columns: 32% 65%;
        }

    .mobile-grid .k-card-header .card-header-grid {
        grid-template-columns: 8% 64% 9% 5%;
    }

    .k-panelbar .k-item .k-content {
        margin-left: 5px;
    }

    .graph-wrapper {
        padding: 1px;
        border: none;
    }
}

@media only screen and (max-width: 400px) {
    .archive-cardWrapper {
        display: block;
        margin: 12px;
    }

    .ad-title {
        padding: 8px 7px 0px 15px;
    }

    .password-strength-text {
        font-size: 15px;
    }
}

.modal-dialog {
    max-width: 700px;
}

.modal-content {
    padding-bottom: 0px;
    color: #444444;
    border-radius: 0px;
    margin: 0px auto;
    border: solid 1px #999999;
    background-color: #FFF;
    box-shadow: 20px 20px 27px 0px rgb(0 0 0 / 20%);
}

.modelbox-header {
    border: none;
    border-top: solid 5px #B5C8E8;
    padding: 16px 16px 0px 16px;
    min-height: 40px;
}

button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.pull-right {
    float: right;
}

.modal-dialog .modal-footer {
    margin-top: 0px;
    border: none;
    padding: 0 16px 16px;
}

.btn-light {
    background-color: #B5C8E8;
    color: #323d43;
    width: 150px;
    border-color: #696969;
}

.btn-secondary {
    border-radius: 7px;
    color: #323d43;
    border-color: #696969;
    background-color: #f5f5f5;
}

    .btn-primary:hover, .btn-primary:focus:hover,
    btn-secondary:hover, .btn-secondary:focus:hover {
        color: #fff;
        background-color: #323d43;
        border-color: #989898;
    }

.fa-question-circle:before {
    content: "\f059";
    color: #0f4291;
    margin-left: 5px;
    font: 14px/1 FontAwesome;
    font-size: large;
    text-rendering: auto;
}

.dropdown-label {
    max-width: 360px;
    width: 100%;
}

.btn-expanded {
    max-width: 260px;
    width: 100%;
}

.mt-25 {
    margin-top: 25px !important;
}

.text-bold {
    font-family: 'Helvetica Neue LT W01_71488914', sans-serif, Arial !important;
}

.text-dark-blue {
    color: #0f4291 !important;
}

.h4-bold {
    font-size: 1.3rem;
}

.navbar-brand .img-logo {
    width: 60px;
    height: auto;
    margin-right: 0.5rem;
}

.myvisits-createaccount-Cancel {
    text-align: left;
}

.myvisits-createaccount-Ok {
    text-align: right;
}

.navbar-brand .img-client {
    width: 100px;
    height: auto;
}

    .navbar-brand .img-client .myvisitimg-client{
        width: 100px;
        height: auto;
    }

.navbar-brand .ecomm-logo {
    width: 100px;
    height: auto;
}

.btn-primary:focus, .btn-secondary:focus {
    outline: solid 2px #2095f2 !important;
}

.k-checkbox_label.myvisitstermsandCondition {
    padding-top: 0px;
}

@media only screen and (max-width: 769px) {
    .navbar-brand .img-logo {
        width: 40px;
        height: auto;
        margin-right: 0.5rem;
    }

    .navbar-brand .img-client {
        width: 50px;
        height: auto;
    }

        .navbar-brand .img-client .myvisitimg-client {
            width: 50px;
            height: auto;
        }

    .myvisits-createaccount-Cancel {
        text-align: center;
    }

    .myvisits-createaccount-Ok {
        text-align: center;
    }
}

@media only screen and (min-width: 481px) {
    .myvisitscreateaccountlabeldesc {
        inline-size: 680px;
    }
}

@media only screen and (max-width:480px) {
    .myvisitscreateaccountlabeldesc {
        inline-size: 300px;
    }
}

@media only screen and (min-width: 1201px) {
    .myvisitstermsandCondition {
        inline-size: 800px;
    }
}

@media only screen and (min-width: 481px) and (max-width: 1200px) {
    .myvisitstermsandCondition {
        inline-size: 500px;
    }
}

@media only screen and (max-width:480px) {
    .myvisitstermsandCondition {
        inline-size: 300px;
    }
}

.page-appointments ul.list-appointment-steps {
    list-style: none;
    padding: 0px;
    width: 100%;
    margin: 0px 0px 25px 0px;
    text-align: center;
    display: inline-block;
    border: solid 1px #e3e3e3;
    pointer-events: none;
}

    .page-appointments ul.list-appointment-steps li {
        width: 33.33%;
        float: left;
        height: 45px;
        display: table;
    }

    .page-appointments ul.list-appointment-steps.four-steps li {
        width: 25%;
    }

    .page-appointments ul.list-appointment-steps li a {
        display: table-cell;
        vertical-align: middle;
        height: 45px;
        color: #323d43;
        position: relative;
        padding: 0px 15px;
        line-height: 1.2;
        background-color: #f5f5f5;
        border-top: 1px solid transparent;
        border-bottom: 1px solid transparent;
    }

        .page-appointments ul.list-appointment-steps li a:hover, .page-appointments ul.list-appointment-steps li a:hover:focus {
            color: #323d43;
            text-decoration: none;
        }

        .page-appointments ul.list-appointment-steps li.active a, .page-appointments ul.list-appointment-steps li.active a:hover, .page-appointments ul.list-appointment-steps li a:focus {
            color: #FFF;
            text-decoration: none;
            background-color: #0f4291;
        }

    .page-appointments ul.list-appointment-steps li.disabled a:focus {
        background-color: #f5f5f5;
    }

    .page-appointments ul.list-appointment-steps li a:after, .page-appointments ul.list-appointment-steps li a:before {
        left: 100%;
        top: -1px;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        z-index: 1;
        position: absolute;
        pointer-events: none;
    }

    .page-appointments ul.list-appointment-steps li a:after {
        border-color: rgba(136, 183, 213, 0);
        border-left-color: #f5f5f5;
        border-width: 23px 23px 23px 13px;
    }

    .page-appointments ul.list-appointment-steps li a:before {
        border-color: rgba(194, 225, 245, 0);
        border-left-color: #e2e2e2;
        border-width: 24px 23px 25px 15px;
    }

    .page-appointments ul.list-appointment-steps li a:hover {
        background: #eef2f9;
        border-top: 1px solid #696969;
        border-bottom: 1px solid #696969;
        border-left: 1px solid #696969;
    }

        .page-appointments ul.list-appointment-steps li a:hover:after {
            border-left-color: #eef2f9;
        }

    .page-appointments ul.list-appointment-steps li.disabled:hover a {
        background: #f5f5f5;
    }

        .page-appointments ul.list-appointment-steps li.disabled:hover a:after {
            border-left-color: #f5f5f5;
        }

    .page-appointments ul.list-appointment-steps li.disabled a {
        color: #777;
    }

    .page-appointments ul.list-appointment-steps li.active a:after, .page-appointments ul.list-appointment-steps li a:active:after {
        border-left-color: #0f4291;
    }
@media only screen and (max-width: 500px) {
    /*.page-appointments ul.list-appointment-steps li a span{
		display: block;
	}*/
    .page-appointments ul.list-appointment-steps {
        font-size: 13px;
    }

    .hidden-xs {
        display: none;
    }

    .page-appointments .early-morning {
        margin-left: 10px;
    }
}

@media only screen and (max-width: 480px) {
    .heading-top {
        padding: 0 0 10px !important;
        font-size: 18px !important;
    }

    .page-appointments .box-search {
        max-width: 428px;
        margin: 0px auto;
    }

    .page-appointments .text-online-appointments span:nth-child(2) {
        font-size: 12px;
    }

    .page-appointments .row-appointments {
        font-size: 12px;
    }

    .page-appointments .row-appointment-booking h3 {
        font-size: 15px;
    }

    .page-appointments .row-appointment-booking .btn-next {
        padding: 0px 23px 0px 7px;
        font-size: 13px;
    }

    .page-appointments ul.list-appointment-steps li a {
        padding: 0px 0 0 15px;
    }

    .hidden-xs {
        display: none;
    }

    .page-appointments ul.list-appointment-steps.four-steps li:first-child a {
        padding: 0px 0 0 5px;
    }

    .page-appointments ul.list-appointment-steps li:last-child a {
        padding: 0px 10px 0 15px;
    }

    .page-appointments .cal-row-fluid .cal-cell:first-child .text-closed {
        font-size: 12px;
    }

    .page-appointments .row-appointment-booking-steps .btn-next, .page-appointments .row-appointment-booking-steps .btn-back {
        font-size: 0;
    }

    .page-appointments .table-time .table > thead > tr > th {
        padding-left: 0;
    }

    .page-appointments .btn-icon-dark {
        width: 25px;
    }

    .page-appointments .inner-content h3 span, .page-appointments .inner-content h3 > .icon {
        font-size: 15px;
    }

    .page-appointments .secondary-tabs .nav-tabs > li > a {
        font-size: 11px;
    }
}

@media only screen and (max-width: 380px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 12px;
    }
}

@media only screen and (max-width: 340px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 11px;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 10px;
    }
}
@media only screen and (max-width: 305px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 9px;
    }
}
@media only screen and (max-width: 280px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 8px;
    }
}
@media only screen and (max-width: 270px) {
    .page-appointments ul.list-appointment-steps {
        font-size: 7px;
    }
}

