@charset "utf-8";
/*============================================================
    COLORS
============================================================*/
:root {
    /* ============== CONTENT + TEXT ============== */
    /* content area elements */
    --clr-text: #212121;
    --clr-text-link: #0c57a3;
    --clr-text-link-hover: #002d5a;
    --clr-maincontent-bg: #f1f1f1;
    --clr-maincontent-border: #dddddd;
    --clr-card-bg: #ffffff;
    --clr-hp-welcome-bg: #0c57a3;
    --clr-hp-welcome-text: #ffffff;
    /* ============== LEFT NAV ============== */
    /* left nav main */
    --clr-leftnav-bg: #ffffff;
    --clr-leftnav-border: #dddddd;
    --clr-leftsubnav-bg: #f9f9f9;
    /* left nav menu items */
    --clr-leftnav-item-text: #212121;
    --clr-leftnav-item-border: transparent;
    --clr-leftnav-icon: #0c57a3;
    /* left nav menu items ACTIVE */
    --clr-leftnav-item-text-active: #0c57a3;
    --clr-leftnav-item-bg-active: rgba(12, 87, 163, 0.08);
    --clr-leftnav-item-border-active: #0c57a3;
    /* left nav menu items HIGHLIGHTED */
    --clr-leftnav-item-text-highlighted:;
    --clr-leftnav-item-bg-highlighted: #f1f1f1;
    --clr-leftnav-item-border-highlighted: #0c57a3;
    /* ============== BUTTONS ============== */
    /* button primary */
    --clr-button-filled-text: #ffffff;
    --clr-button-filled-bg: #0c57a3;
    --clr-button-filled-border: #0c57a3;
    /* button primary hover */
    --clr-button-filled-text-hover: #ffffff;
    --clr-button-filled-bg-hover: #002d5a;
    --clr-button-filled-border-hover: #002d5a;
    /* button outlined */
    --clr-button-outlined-text: #0c57a3;
    --clr-button-outlined-bg: #ffffff;
    --clr-button-outlined-border: #0c57a3;
    /* button outlined hover */
    --clr-button-outlined-text-hover: #ffffff;
    --clr-button-outlined-bg-hover: #002d5a;
    --clr-button-outlined-border-hover: #002d5a;
    /* button disabled */
    --clr-button-disabled-text: #ffffff;
    --clr-button-disabled-bg: #c1c1c1;
    --clr-button-disabled-border: #c1c1c1;
    /* ============== PROFILE BTN + SUBNAV ============== */
    /* profile button */
    --clr-btnprofile-icon: #595959;
    --clr-btnprofile-fill: #f1f1f1;
    --clr-btnprofile-border: #dddddd;
    /* profile button hover */
    --clr-btnprofile-icon-hover: #0C57A3;
    --clr-btnprofile-fill-hover: #ffffff;
    --clr-btnprofile-border-hover: #0C57A3;
    /* profile sub menu */
    --clr-profilemenu-bg: #333333;
    --clr-profilemenu-item-text: #ffffff;
    --clr-profilemenu-item-bg-hover: rgba(255, 255, 255, 0.15);
    /* ============== PAGE HEADER ============== */
    --clr-pagehdr-bg: #0C57A3;
    --clr-pagehdr-title: #ffffff;
    --clr-pagehdr-text: #ffffff;
    --clr-pagehdr-pill-bg: rgba(255, 255, 255, 0.08);
    --clr-pagehdr-pill-border: rgba(255, 255, 255, 0.35);
    --clr-pagehdr-pill-text: rgba(255, 255, 255, 0.72);
    /* ============== FOOTER ============== */
    --clr-footer-border: #dddddd;
    --clr-footer-bg: #ffffff;
    --clr-footer-link: #0C57A3;
    --clr-footer-link-hover: #002d5a;
    --clr-footer-icon: #0c57a3;
    --clr-footer-icon-border: #0c57a3;
    --clr-footer-icon-background: #e8f2fa;
    /* ============== FEEDBACK ICON ============== */
    --clr-icon-fback: #0c57a3;
    --clr-icon-fback-bg: #ffffff;
    --clr-icon-fback-border: #0c57a3;
    --clr-icon-fback-hover: #0c57a3;
    --clr-icon-fback-bg-hover: #e8f2fa;
    --clr-icon-fback-border-hover: #002D5A;
}
    /*#region GENERAL + TYPOGRAPHY */
    /*============================================================
    GENERAL + TYPOGRAPHY 
============================================================*/
    body {
        font-family: 'Roboto', sans-serif !important;
        color: #4A4A4A;
        overflow-x: hidden;
    }

    a {
        color: var(--clr-text-link) !important;
        text-decoration: underline;
    }

        a:hover {
            color: var(--clr-text-link-hover) !important;
            text-decoration: underline;
        }

    .SpecialHeader a {
        color: #333 !important;
    }
    /* had to declare this to make sure SVG icons scale properly */
    svg {
        box-sizing:content-box;
    }

    h1, h2, h3, h4 {
        font-family: "Poppins", sans-serif !important;
        font-weight: 600 !important;
        color: var(--clr-text);
    }

    h2 {
        font-size: 27px;
        padding-top: 10px;
        font-weight: 600;
        margin-bottom: 30px;
    }

        h2.cbis {
            color: #3b414e !important;
        }

    h3 {
        font-size: 20px;
    }

    .dataList.hide-all,
    .empty-table,
    .hide,
    .hideME {
        display: none;
        overflow: hidden;
    }

    .notopmargin {
        margin-top: 0 !important;
    }

    .nobotmargin {
        margin-bottom: 0 !important;
    }

    .noleftmargin {
        margin-left: 0 !important;
    }

    .norightmargin {
        margin-right: 0 !important;
    }

    .notoppadding {
        padding-top: 0 !important;
    }

    .nobotpadding {
        padding-bottom: 0 !important;
    }

    .noleftpadding {
        padding-left: 0 !important;
    }

    .norightpadding {
        padding-right: 0 !important;
    }

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

    .top-margin-30 {
        margin-top: 30px;
    }

    .top-margin-45 {
        margin-top: 45px;
    }

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

    .brdr-top {
        border-top: solid 1px #e4e4e4;
    }
    /*#endregion GENERAL + TYPOGRAPHY */
    /*#region BUTTONS */
    /*======= BUTTONS =======*/
    .btn,
    .btn-primary,
    input[type="submit"].btnCancel,
    input[type="button"].btnSave {
        background: var(--clr-button-filled-bg) !important;
        border: none !important;
        border-radius: 6px !important;
        padding: 10px 22px !important;
        font-size: 14px !important;
        color: var(--clr-button-filled-text) !important;
        font-weight: 600 !important;
        font-family: 'Roboto', sans-serif;
        height: 100% !important;
        line-height: 1 !important;
    }

        .btn:hover,
        .btn-primary:hover,
        input[type="submit"].btnCancel:hover,
        input[type="button"].btnSave:hover {
            background: var(--clr-button-filled-bg-hover) !important;
            color: var(--clr-button-filled-text-hover) !important;
            transition: all 0.2s ease;
        }

    .HollowButton {
        cursor: pointer;
        text-decoration: none !important;
        border-color: var(--clr-button-outlined-border);
        border: solid 2px;
        color: var(--clr-button-outlined-text);
        border-radius: 8px;
        padding: 10px 15px;
        font-weight: 600;
        margin: 15px 0;
        display: inline-block;
        background: var(--clr-button-outlined-bg);
        line-height: 1 !important;
    }

        .HollowButton:hover {
            background: var(--clr-button-outlined-bg-hover);
            color: var(--clr-button-outlined-text-hover) !important;
            border-color: var(--clr-button-outlined-border-hover);
            transition: all 0.2s ease;
        }

    .btn.btn-search {
        height: 40px !important;
    }
    /* Feedback Popup Window */
    .FbackSaveBtn {
        display: inline-block;
    }

        .FbackSaveBtn a {
            margin-top: -14px;
        }
    /*Upload Button*/
    .upload-btn-wrapper {
        position: relative;
        overflow: hidden;
        display: inline-block;
        bottom: -13px;
    }

        .upload-btn-wrapper input[type=file] {
            /*font-size: 100px;*/
            position: absolute;
            left: 0;
            top: 0;
            opacity: 0;
        }

        .upload-btn-wrapper .btn {
            cursor: pointer;
            background: var(--clr-button-filled-bg); /* #5489C9 backgournd color when files not selected */
            line-height: 20px !important;
        }

        .upload-btn-wrapper input[type=file]:not(:empty) + .btn {
            background: #61BB46 !important; /* #61BB46 background color when files are selected */
        }

        .upload-btn-wrapper .btn:hover {
            background: #61bb46 !important
        }

        .upload-btn-wrapper .btn.green {
            background: #61bb46 !important;
        }
    /*#endregion BUTTONS */
    /*#region FBACK ICON */
    .FeedbackIcon {
        position: fixed;
        right: 24px;
        bottom: 24px;
        width: 52px !important;
        height: 52px !important;
        border: 2px solid !important;
        border-color: var(--clr-icon-fback-border) !important;
        border-radius: 50% !important;
        background: var(--clr-icon-fback-bg) !important;
        color: var(--clr-icon-fback) !important;
        cursor: pointer;
        box-shadow: 0 4px 16px rgba(12, 87, 163, 0.08) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 100 !important;
        padding: 0;

        svg {
            width: 24px;
            height: 24px;
        }
    }

        .FeedbackIcon:hover {
            color: var(--clr-icon-fback-hover) !important;
            border-color: var(--clr-icon-fback-border-hover) !important;
            background: var(--clr-icon-fback-bg-hover) !important;
        }
    /* button {
        width: 52px !important;
        height: 52px !important;
        border: 2px solid !important;
        border-color: var(--clr-icon-fback-border) !important;
        border-radius: 50% !important;
        background: var(--clr-icon-fback-bg) !important;
        color: var(--clr-icon-fback) !important;
        cursor: pointer;
        box-shadow: 0 4px 16px rgba(12, 87, 163, 0.08) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 100 !important;
        padding: 0;

        svg {
            width: 24px;
            height: 24px;
        }
    }

        button:hover {
            color: var(--clr-icon-fback-hover) !important;
            border-color: var(--clr-icon-fback-border-hover) !important;
            background: var(--clr-icon-fback-bg-hover) !important;
        }*/
    /*#endregion FBACK ICON */
    /*#region POPUPS */
    /*============================================================ 
    POPUPS
 ============================================================*/
    .popup-hide-h2 div.section-header {
        margin-top: 0 !important;
    }

        .popup-hide-h2 div.section-header > div.col {
            display: none !important;
        }
    /*#endregion POPUPS */
    /*#region COMPONENTS */
    /*============================================================ 
    COMPONENTS
 ============================================================*/
    /*======= ACCORDION =======*/
    .mint-accordion {
    }

    .mint-accordion-section {
    }

        .mint-accordion-section .card-body {
            border-bottom: solid 1px #E4E4E4;
            padding: 30px 30px 10px !important;
        }

    .mint-accordion-header {
        cursor: pointer;
        border-bottom: solid 1px #E4E4E4;
        font-weight: 700 !important;
        padding-top: 20px;
        background-image: url('../images/icons/expand_less.svg');
        background-position: right;
        background-repeat: no-repeat;
    }

        .mint-accordion-header.collapsed {
            background-image: url('../images/icons/expand_more.svg') !important;
        }
    /*======= SECTION HEADERS + TOGGLE SECTION/PANEL =======*/
    .header-btn {
        padding: 15px;
    }

    .fav-btn {
        border-left: solid 1px #e4e4e4;
        margin-bottom: 5px;
        padding: 15px;
    }

        .fav-btn .FlagButton {
            width: 25px;
            height: 25px;
        }

    .col-header-with-btn {
        padding-right: 15px;
        -ms-flex-pack: end !important;
        justify-content: flex-end !important;
        display: -ms-flexbox !important;
        display: flex !important;
    }

    .section-header {
        border-bottom: solid 1px #e4e4e4;
        margin-top: 45px;
        margin-bottom: 30px;
    }
        /*.section-header:hover {
        cursor: pointer;
    }*/

        .section-header h2 {
            display: inline-block;
            margin-bottom: 10px;
        }



    .tgl-header {
        border-bottom: solid 1px #e4e4e4;
        margin-top: 45px;
        margin-bottom: 30px;
    }

        .tgl-header:hover {
            cursor: pointer;
        }

        .tgl-header h2 {
            display: inline-block;
            margin-bottom: 10px;
            font-size: 22px;
        }

    .tgl-header-icon {
        display: block;
        float: right;
        border-left: 2px solid #e4e4e4;
        height: 45px;
        width: 45px;
        -ms-flex-negative: 0 !important;
        flex-shrink: 0 !important;
        -ms-flex-item-align: end !important;
        align-self: flex-end !important;
        margin-bottom: 10px;
        margin-left: 10px;
    }

        .tgl-header.collapsed .tgl-header-icon, .tgl-header-icon.tgl-closed {
            background-image: url('../images/icons/expand_more.svg');
            background-size: 30px;
            background-position: center center;
            background-repeat: no-repeat;
        }

        .tgl-header .tgl-header-icon, .tgl-header-icon.tgl-open {
            background-image: url('../images/icons/expand_less.svg');
            background-size: 30px;
            background-position: center center;
            background-repeat: no-repeat;
        }

    .tgl-content {
        padding-bottom: 30px;
    }

    .tgl-header > div.col {
        display: -ms-flexbox !important;
        display: flex !important;
        width: 100% !important;
    }

        .tgl-header > div.col > h2 {
            -ms-flex-positive: 1 !important;
            flex-grow: 1 !important;
        }
    /*======= BREADCRUMB =======*/

    .mint-breadcrumb {
        padding-bottom: 15px;
        border-bottom: solid 1px #e4e4e4;
        margin-bottom: 30px;
    }
    /*======= TABLES =======*/
    /* Make the first td bold in the table */
    table.first-td-bold tr td:first-child {
        font-weight: 700 !important;
    }
    /* Make first td not wrap its text */
    table.first-td-nowrap tr td:first-child {
        white-space: nowrap;
    }
    /* ROOM FLOW table */
    .roomflow td .date + .day,
    .roomflow th .date + .day {
        padding-left: 1em;
    }
    /*#endregion COMPONENTS */
    /*#region FORMS */
    /*============================================================ 
    FORMS
 ============================================================*/
    .form-label {
        font-weight: 700;
        margin-bottom: 5px;
    }

    input[type=text].full-width {
        width: 100% !important;
    }
    /* Description text underneath a form field */
    .form-description {
        color: #58595B;
        font-size: 12px;
        margin-top: 5px;
    }

    input[type=checkbox], input[type=radio] {
        margin-right: 10px !important;
    }
    /*#endregion FORMS */
    /*#region HEADER + PROFILE NAV + SEARCH */
    /*============================================================ 
    HEADER + PROFILE NAV + SEARCH
 ============================================================*/
    /*======== MASTER PAGE HEADER + SEARCH + PROFILE =======*/

    #header {
        display: flex;
        flex-wrap: nowrap;
        padding: 0;

        .HeaderSpace {
            flex: 0 0 240px;
            padding: 12px 0 12px 20px;
            border-right: solid 1px var(--clr-leftnav-border);

            img {
                width: 115px;
            }
        }

        .HeaderTop {
            display: flex;
            flex-wrap: nowrap;
            justify-content: space-between;
            gap: 20px;
            width: 100%;
            padding: 12px 24px;
            border-bottom: solid 1px var(--clr-leftnav-border);
        }

        .HeaderSearch {
            flex-grow: 1;

            #AccountSearch > input[type="text"]#AccountLookup {
                outline: none !important;
                box-shadow: none !important;
                color: var(--clr-text) !important;
                width: 100% !important;
                height: 40px;
                background: #fff;
                border: solid 1px var(--clr-content-border);
                border-radius: 4px;
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                padding: 0 12px;
            }

            .SearchContainer {
                display: flex;
                flex-wrap: nowrap;
                gap: 12px;
            }
        }

        .HeaderProfile {

            #AccountDropdown {
                a.btn-profile {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 40px;
                    height: 40px;
                    border: 1px solid var(--clr-btnprofile-border);
                    border-radius: 50%;
                    background: var(--clr-btnprofile-fill);
                    cursor: pointer;

                    svg {
                        color: var(--clr-btnprofile-icon);
                        width: 20px;
                        height: 20px;
                    }
                }

                    a.btn-profile.show,
                    a.btn-profile:hover {
                        background: var(--clr-btnprofile-fill-hover);
                        border-color: var(--clr-btnprofile-border-hover);

                        svg {
                            color: var(--clr-btnprofile-icon-hover);
                        }
                    }

                a.dropdown-toggle::after {
                    display: none !important;
                }

                .dropdown-menu {
                    min-width: 210px;
                    background: var(--clr-profilemenu-bg);
                    padding: 8px 0;
                    border-radius: 8px;
                    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
                    margin-top: 15px;

                    a {
                        display: flex;
                        align-items: center;
                        gap: 12px;
                        padding: 10px 16px;
                        color: var(--clr-profilemenu-item-text) !important;
                        font-size: 14px;
                        font-weight: 600;
                        text-decoration: underline;
                        text-underline-offset: 2px;

                        svg {
                            width: 18px;
                            height: 18px;
                            flex-shrink: 0;
                        }
                    }

                        a:hover {
                            background: var(--clr-profilemenu-item-bg-hover);
                        }
                }

                    .dropdown-menu.show {
                        transform: translate(0px, 48px) !important;
                    }
            }
        }
    }

    .loginSearch {
        width: 100% !important;
    }

    @media (max-width: 595px) {
        .search-wrapper {
            display: none;
        }
    }
    /*======= PROFILE MENU =======*/
    /*#endregion HEADER + PROFILE NAV + SEARCH */
    /*#region FOOTER */
    /*============================================================
    FOOTER
 ===========================================================*/
    .browser-message {
        background: #e4e4e4;
        padding: 10px 10px 10px 30px !important;
        font-size: 12px;
    }

    .footer-login {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .footer {
        margin-left: -54px;
        margin-top: 60px;
        border-top: solid 24px var(--clr-maincontent-bg);
        width: calc(100% + 108px);
        background: var(--clr-footer-bg);
        color: var(--clr-text);
        /*border-top: 1px solid var(--clr-footer-border);*/
        padding: 18px 24px 22px;
        font-size: 12.5px;
        line-height: 1.6;

        a {
            color: var(--clr-footer-link);
            text-decoration: none;
        }

            a:hover {
                text-decoration: underline;
            }
    }

    .footer-border-line {
        margin-left: -54px;
        width: calc(100% + 108px);
        border-top: solid 1px var(--clr-footer-border);
        margin-top: -18px;
        padding-bottom: 18px;
    }

    .footer-inner {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        grid-auto-rows: 1fr; /* Forces all rows to be equal height */
        align-items: start;
        gap: 0;
        margin: 0 auto;
        padding: 24px 10px;
        max-width: none;
        border: 1px solid var(--clr-footer-border);
        border-radius: 12px;
    }

    .footer-col {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 14px;
        min-width: 0;
        padding: 10px 28px;
        height: 90%;
    }

    .footer-col-mint {
        .footer-logo-mint {
            width: 100px;
            height: auto;
        }

        .footer-tagline {
            max-width: 24ch;
            padding-bottom: 10px;
            border-bottom: 2px solid #c5daf0;
        }

        .footer-copyright {
            max-width: 24ch;
            font-size: 11.5px;
        }
    }

    .footer-col-contact {
        border-left: solid 1px var(--clr-footer-border);

        .footer-contact-row {
            display: flex;
            align-items: center;
            gap: 10px;
            justify-content: flex-start;

            .footer-contact-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 16px;
                height: 16px;
                padding: 7px;
                flex-shrink: 0;
                border-radius: 50%;
                border: 1.5px solid var(--clr-footer-icon-border);
                color: var(--clr-footer-icon);
            }
        }
    }

.footer-col-feedback {
    border-left: solid 1px var(--clr-footer-border);

    .footer-feedback-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        justify-content: flex-start;
    }

    .footer-feedback-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        height: 16px;
        padding: 10px;
        flex-shrink: 0;
        border-radius: 50%;
        color: var(--clr-footer-icon);
        background: var(--clr-footer-icon-background);
    }

    .feedback-text {
        display: flex;
        flex-direction: column;
        gap: 6px;

        .feedback-heading {
            font-family: 'Poppins', sans-serif;
            font-size: 13px;
            font-weight: 700;
            line-height: 1.3;
            letter-spacing: 0.03em;
            text-transform: uppercase;
        }

        .btn-footer-feedback {
            font-size: 12px !important;
            margin-top: 10px;
        }
    }
}

    .footer-col-partners {
        border-left: solid 1px var(--clr-footer-border);

        .footer-DI-logo {
            border-bottom: solid 1px var(--clr-footer-border);
            padding-bottom: 15px;
            margin-bottom: 15px;
            width: 100%;
        }

            .footer-DI-logo img {
                height: 38px;
                max-width: 100%;
            }

        .footer-Granicus-logo {
            width: 100%;
        }

            .footer-Granicus-logo img {
                height: 32px;
                max-width: 100%;
            }
    }

    @media (max-width: 1100px) {
        .footer-inner {
            grid-template-columns: 1fr 1fr;
            padding: 18px 6px;
        }

        .footer-col-feedback {
            border-left: none !important;
        }
    }

    @media (max-width: 768px) {
        .footer-inner {
            grid-template-columns: 1fr;
            padding: 8px 14px 14px;
        }

        .footer-col-contact {
            border-left: none !important;
        }

        .footer-col-partners {
            border-left: none !important;
        }
    }
    /*#endregion FOOTER */
    /*#region MAIN CONTENT */
    /*============================================================
    MAIN CONTENT
 ===========================================================*/

    #main_content_container {
        padding: 0;
    }

    #main_content_row {
        margin: 0;
        align-items: flex-start;
    }

    #main_content_right {
        padding-left: 30px !important;
        padding-right: 30px !important;
        border-width: 0 24px;
        border-style: solid;
        border-color: var(--clr-maincontent-bg);
    }

        #main_content_right #aspnetForm {
            width: 100%;
        }
    /*#endregion MAIN CONTENT */
    /*#region LEFT NAVIGATION */
    /*============================================================
    LEFT NAVIGATION
 ===========================================================*/


    #leftNav {
        flex: 0 0 240px;
        padding: 0 8px !important;
        margin: 0;
        background: var(--clr-leftnav-bg);
        border-right: solid 1px var(--clr-leftnav-border);
        margin-top: -65px;
        position: sticky;
        top: 0;
        min-height: 100vh;

        .LeftNavLogo {
            padding: 15px 15px 20px 15px;

            img {
                width: 100px;
            }
        }

        a {
            color: var(--clr-leftnav-item-text) !important;
            padding: 8px 12px;
            border-left: solid 3px var(--clr-leftnav-item-border);
            display: flex;
            align-items: center;
            gap: 10px;
            border-radius: 6px;
            line-height: 1;
        }

            a.active {
                background: var(--clr-leftnav-item-bg-active);
                font-weight: 600;
                border-left: solid 3px var(--clr-leftnav-item-border-active) !important;
                color: var(--clr-leftnav-item-text-active) !important;
            }

            a:hover {
                text-decoration: none;
                border-left: solid 3px var(--clr-leftnav-item-border) !important;
                background: var(--clr-leftnav-item-bg-highlighted);
            }

        .leftnav-img-icon, i {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
            color: var(--clr-leftnav-icon);
            font-size: 16px;
        }

        ul {
            padding-left: 0;
            list-style: none;
        }

            ul li {
                color: var(--clr-leftnav-item-text);
                font-size: 13px;
            }

        .left_subnav {
            border: solid 1px var(--clr-leftnav-border);
            border-radius: 4px;
            background-color: var(--clr-leftsubnav-bg);
        }
    }
    /*======== Collapse Left Nav =======*/
    /*    #leftNav.forceClose {
    }

#leftNavCollapse {
    display: none;
}

@media (max-width: 1135px) {
    #leftNav {
        flex: 0 0 60px;
        width: 60px;
    }

        #leftNav li {
            width: 60px;
            white-space: nowrap;
            overflow: hidden;
            height: 50px
        }

            #leftNav li a {
                padding-left: 10px;
            }

                #leftNav li a i, #leftNav li a img {
                    margin-right: 30px;
                }

        #leftNav a .leftnav-esp-icon, #leftNav a.active:hover .leftnav-esp-icon {
            margin-right: 30px !important;
        }

        #leftNav.forceOpen {
            flex: 0 0 240px;
            width: 240px;
            z-index: 9999;
        }

            #leftNav.forceOpen li {
                width: auto;
                height: auto;
                white-space: initial;
                overflow: auto;
            }

                #leftNav.forceOpen li a {
                    padding-left: 20px;
                }

                    #leftNav.forceOpen li a i, #leftNav.forceOpen li a img {
                        margin-right: 10px;
                    }

    #leftNavCollapse {
        background-color: #8DC43E;
        display: block;
        border: none;
        padding-bottom: 6px;
    }

        #leftNavCollapse i {
            color: #fff;
            margin-right: 0 !important
        }

    #leftNav #leftNavCollapse .material-icons-outlined {
        display: none;
    }

        #leftNav #leftNavCollapse .material-icons-outlined.right {
            display: inline;
        }

    #leftNav.forceOpen #leftNavCollapse .material-icons-outlined.right {
        display: none;
    }

    #leftNav.forceOpen #leftNavCollapse .material-icons-outlined.left {
        display: inline;
    }
}*/
    /*======== END Collapse Left Nav =======*/

    .dropdown[data-bs-toggle].collapsed:after {
        font-family: "Material Icons Outlined";
        content: "\e5cf";
        width: inherit;
        height: inherit;
        display: inline-block;
        position: relative;
        top: 3px;
        float: right;
        font-size: 20px;
    }

    .dropdown[data-bs-toggle]:not(.collapsed):after {
        font-family: "Material Icons Outlined";
        content: "\e5ce";
        width: inherit;
        height: inherit;
        display: inline-block;
        position: relative;
        top: 3px;
        float: right;
        font-size: 20px;
    }
    /*======= GOOGLE MATERIAL ICONS =======*/
    .material-icons {
        font-family: 'Material Icons Outlined';
        font-weight: normal;
        font-style: normal;
        font-size: 20px !important;
        display: inline-block;
        line-height: 1;
        text-transform: none;
        letter-spacing: normal;
        word-wrap: normal;
        white-space: nowrap;
        direction: ltr;
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
        /* Support for IE. */
        font-feature-settings: 'liga';
    }
    /*#endregion LEFT NAVIGATION */
    /*#region PAGE HEADER */
    /*============================================================
    INTERIOR PAGE BASE STYLES
 ===========================================================*/
    .PageHeader {
        background: var(--clr-pagehdr-bg);
        padding: 12px 24px;
        color: var(--clr-pagehdr-text);
        display: flex;
        gap: 4px;
        flex-direction: column;
        margin-left: -54px;
        width: calc(100% + 108px);
        border-bottom: solid 24px var( --clr-maincontent-bg);
        margin-bottom: 24px;
        position: sticky;
        top: 0;
        z-index: 900;

        h1 {
            color: var(--clr-pagehdr-title);
            font-size: 22px;
            line-height: 1.2;
            margin: 0;
        }
    }

    .PageHeader-row {
        min-height: 50px;
        display: flex;
        align-items: center;
    }
    /* Old Styles */
    .page-header-container {
        padding-right: 0 !important;
        margin-right: 0 !important;
        margin-left: -30px !important;
        margin-bottom: 45px;
    }

    .page-header-row {
        background: #8DC63F;
        margin-right: -60px;
        padding: 0 0 30px 0;
    }

    .page-header-col-left {
        padding-left: 30px;
    }

    .page-header-container h1 {
        font-size: 20px;
        color: #ffffff;
        padding: 22px 40px;
        background: rgba(59,65,78,0.5) none no-repeat scroll 0 0;
        border-bottom: solid 4px #ffffff;
        display: inline-block;
    }
    /*#endregion PAGE HEADER */
    /*#region SIGN-IN PAGE */
    /*============================================================
    SIGN-IN PAGE
 ===========================================================*/
    .signin-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 15px 30px;

        .singnin-logo {
        }

        .signin-nav {

            a {
                display: flex;
                gap: 6px;
                align-content: center;
            }
        }
    }
    /*======= SIGNIN FORM COL =======*/
    .sign-in-form {
        padding: 30px !important;
        background: var(--clr-maincontent-bg);
        flex: 0 0 360px;
    }

        .sign-in-form h2::before {
            display: none;
        }

        .sign-in-form .form-remember label {
            font-size: 15px;
            margin-left: 6px;
        }

    @media (max-width: 767px) {
        .sign-in-form {
            flex: 0 0 100%;
        }

        .hero-signin .hero {
            -ms-flex-pack: center !important;
            justify-content: center !important
        }
    }

    .btn.btn-login {
        padding: 15px 40px !important;
        font-size: 15px !important;
    }

    .errorCode > span {
        display: block;
        padding: 15px;
        color: #cb0101;
        font-weight: 700;
        border: solid 1px #cb0101;
        margin-bottom: 15px;
    }
    /*======= HERO SECTION COL =======*/
    .hero-signin {
        border-bottom: solid 1px #e4e4e4;
        background-color: #F4F4F4;
    }

    .hero {
        background-image: url('../images/bgs/GettyImages-1166085458-50.jpg');
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        padding-left: 0 !important;
    }

    .hero-text {
        flex: 0 0 360px;
    }

    .hero-headline {
        background-color: rgba(0, 0, 0, 0.7);
        background: rgba(0, 0, 0, 0.7);
        color: rgba(0, 0, 0, 0.7);
        padding: 15px;
        color: #ffffff;
        text-transform: uppercase;
        font-size: 40px;
        font-weight: 300;
        line-height: 1em;
    }

    .hero-subtext {
        background: #8DC63F;
        color: #ffffff;
        padding: 15px;
    }
    /*======= LOGO ROW =======*/
    .login-logos {
        padding: 15px !important;
    }

    @media (max-width: 950px) {
        div.login-logos div.row > div {
            width: 100% !important;
            text-align: center !important;
            padding: 10px !important;
        }
    }
    /*======= CONTENT SECTION =======*/
    .login-content {
        background: var(--clr-hp-welcome-bg);
        border-bottom: solid 1px #e4e4e4;
        border-top: solid 1px #e4e4e4;
    }

    .login-content-left {
        padding: 50px 30px !important;
        background: #FAFAFA;
    }

    .login-content-right {
        background-image: url('../images/bgs/hp-content-rt-bg.png');
        background-repeat: repeat-y;
        background-position: left;
        padding: 50px 0 !important;
    }

        .login-content-right h3 {
            font-family: 'Roboto', sans-serif !important;
            font-size: 44px !important;
            color: #ffffff !important;
            font-weight: 700 !important;
        }

        .login-content-right h4 {
            font-family: 'Roboto', sans-serif !important;
            font-size: 28px !important;
            color: #ffffff !important;
            font-weight: 400 !important;
            border-bottom: none !important;
        }

        .login-content-right .circle-image {
            width: 160px;
        }

    @media (max-width: 767px) {
        .circle-image {
            margin-left: 25%;
        }

        .login-content-right {
            background-image: none !important;
        }
    }
    /* Basic Content pages - like FAQ*/
    .login-regular-content {
        padding-left: 30px !important
    }

    .page-header-container.login-header {
        padding-left: 45px !important
    }
    /*#endregion SIGN-IN PAGE */
    /*#region  HOMEPAGE */
    /*============================================================
    HOMEPAGE - DASHBOARD
 ===========================================================*/
    /*======= WELCOME TOP SECTION =======*/
    .hp-welcome {
        display: flex;
        flex-wrap: nowrap;
        margin-left: -30px;
        width: calc(100% + 60px);
        margin-bottom: 30px;
    }

    .hp-welcome-left {
        background-color: var(--clr-hp-welcome-bg);
        color: var(--clr-hp-welcome-text) !important;
        padding: 30px 30px 30px 45px !important;
        width: 50%;
    }

        .hp-welcome-left h1 {
            font-size: 26px;
            color: var(--clr-hp-welcome-text) !important;
        }

        .hp-welcome-left h3 {
            font-size: 18px;
            text-transform: uppercase;
            font-weight: 600 !important;
            margin-top: 40px;
            color: var(--clr-hp-welcome-text) !important;
        }

        .hp-welcome-left .last_login {
            font-size: 13px;
        }

        .hp-welcome-left i {
            position: relative;
            top: 7px;
            margin-right: 10px;
        }

    .hp-welcome-right {
        background-image: url('../images/bgs/GettyImages-1024307672-50.jpg');
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: left top;
        padding-left: 0 !important;
        width: 50%;
    }
    /*======= TOP UPDATES =======*/
    .hp-updates {
        text-transform: uppercase !important;
        color: var(--clr-hp-welcome-text);
        font-size: 15px;
        margin-top: 20px;
    }

    .hp-updates-brdr-row {
        border-color: var(--clr-hp-welcome-text);
        border-top: solid 1px;
        border-bottom: solid 1px;
    }

    .hp-updates-title {
        padding: 10px 20px 20px 0;
        border-color: var(--clr-hp-welcome-text);
        border-right: solid 1px;
    }

    .hp-updates-number {
        padding: 10px 0px 15px 20px;
    }

        .hp-updates-number span {
            font-size: 18px;
            font-weight: 700;
        }

    .hp-updates i {
        position: relative;
        top: 7px;
        margin-right: 10px;
        margin-left: 15px;
    }

    .hp-updates-arrow i {
        position: static;
        padding: 0;
        padding-right: 10px;
    }
    /*======= YOUR STATS =======*/
    .hp-your-stats {
    }

    .stat-row {
        margin-bottom: 45px;
    }

    .stat-col {
        flex: 0 0 300px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .stat-table {
        border-spacing: 0;
        padding: 0;
        border: none;
        width: 240px;
    }

        .stat-table td {
            padding: 0 !important;
        }

    .stat-title {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
        border-bottom: solid 1px #E4E4E4;
    }

    .stat-month,
    .stat-year {
        font-size: 15px;
        color: #939393;
        text-align: center;
    }

        .stat-month span,
        .stat-year span {
            font-size: 18px;
            font-weight: 700;
            color: #4a4a4a;
        }

    .stat-icon {
        text-align: center;
    }
    /*#endregion  HOMEPAGE */
    /*#region  QUERY BUILDER */
    /*============================================================
    QUERY BUILDER
 ===========================================================*/
    .query-Search {
    }
    /*======= Save report container */
    .query-save-container {
        border: solid 1px #e4e4e4;
    }

    .query-save-results h3 {
        margin-top: 15px;
        color: #4a4a4a;
    }

    .query-save-report {
    }

        .query-save-report i {
            position: relative;
            top: 5px;
        }
    /*#endregion  QUERY BUILDER */
    /*============================================================
    ORGANIZATIONS
 ===========================================================*/

    .org-info-small-text {
        color: #58595B;
        font-size: 13px;
        align-items: center;
    }

    .org-info-acronym {
        text-align: right;
        /*border-left: solid 1px #e4e4e4;
    margin-bottom: 5px;*/
    }

    .org-phone-web i {
        position: relative;
        top: 7px;
        margin-right: 10px;
        color: #27AAE1;
    }

    table[class*=use-] td:not(.use-Ignore).useHere:not(:empty):before, table[class*=use-] td:not(.use-Ignore) > span:not(:empty):before {
        visibility: visible;
        /*content: "icon";
    ;
    font-size: 1.5em;*/
        font-family: "Material Icons Outlined";
        content: "\e86c";
        display: inline-block;
        font-size: 20px;
        color: #8dc43e
    }

    table[class*=use-] td:not(.use-Ignore).useHere:not(:empty), table[class*=use-] td:not(.use-Ignore) > span:not(:empty) {
        color: rgba(255, 255, 255, 0);
    }

    a .txt-white {
        color: black;
    }

    a:hover .txt-white {
        color: #0088A4;
    }



    .ClassMajorGroup {
        display: block;
        padding-left: 20px;
    }

    .ClassMinorGroup {
        display: block;
        padding-left: 30px;
        color: #8DC63F;
        font-weight: 500;
        margin-bottom: 5px;
    }

    body.feedback {
        overflow: hidden;
        padding-bottom: 50px;
    }

    .questionicon {
        display: inline-block;
        vertical-align: middle;
        width: 17px;
        height: 17px;
        overflow: hidden;
        text-indent: 100px;
        white-space: nowrap;
        background-image: url(/images/icons/information.svg);
        background-repeat: no-repeat;
        margin: 0 5px;
        padding: 0;
        background-size: contain;
    }

        .questionicon.unclickable {
            cursor: default;
        }

    .spinnerP {
        position: absolute;
        left: 50%;
        top: 50%;
    }

    .spinnerC {
        position: absolute;
        top: 50%;
        left: 50%;
    }

    .overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0); /* Semi-transparent background */
        z-index: 9999999; /* Place overlay on top */
    }

    .uploadmsg {
        color: red;
        font-size: 12px;
        position: absolute;
        left: 16%;
        margin-top: 10px;
    }

    .daystext {
        width: 80px !important;
    }

    .duplicateheader {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .customHeaderStyleRadGrid {
        white-space: pre-wrap !important;
        text-align: center !important;
    }

    .centeredColumn {
        text-align: center !important;
    }

    .gridItemCss {
        color: #27AAE1 !important;
    }

    .top250Warning {
        font-size: 13px;
        color: red;
    }
    /* CSS styles for the button */
    .button {
        font-family: 'Roboto', sans-serif !important;
        display: inline-block;
        padding: 5px 5px;
        background-color: #27AAE1;
        color: #000000 !important;
        text-decoration: none;
        border: none;
        border-radius: 0.25rem;
        font-size: 12px;
        cursor: pointer;
        text-transform: uppercase;
        white-space: nowrap;
    }
        /* Additional styles for when the button is hovered */
        .button:hover {
            background-color: #8DC63F;
            text-decoration: none;
        }
    /*MtgLog Duplicate Occurence table*/

    .occur2LineEllipses {
        height: 50px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .occurTable {
        margin-left: 10px;
    }

        .occurTable tr td {
            border: 1px solid !important;
        }

        .occurTable th {
            border: 1px solid !important;
            height: 20px !important;
        }

            .occurTable th a {
                color: white !important;
            }

    .rowformat {
        text-align: center;
    }

    .headerColor {
        background-color: #27AAE1 !important;
    }

    .scroll {
        margin-right: 20px;
        max-width: 85%;
        max-height: 50%;
        // overflow-x: auto !important;
    }

    .roomFlowTable {
        width: 100%;
        padding: 0px;
    }

    .rowsetting {
        height: 67px !important;
        max-height: 67px !important;
    }

    .roomhead {
        width: 30%;
    }

    .btnHolder {
        margin-bottom: 10px;
        margin-left: 10px;
    }

    #floating-scrollbar {
        border-bottom: 2px solid #000 !important;
    }


    .sample {
        overflow: auto;
        /*border: 2px solid #000;
    background: #181818;
    color: #F8F8F8;*/
    }

        .sample + #floating-scrollbar {
            margin-left: 2px;
        }
    /* adapted from http://beautifulpixels.com/goodies/create-custom-webkit-scrollbar/ */
    .webkit-scrollbar::-webkit-scrollbar,
    .webkit-scrollbar + #floating-scrollbar::-webkit-scrollbar {
        height: 12px;
    }

    ::-webkit-scrollbar-button:start, ::-webkit-scrollbar-button:end {
        display: none;
    }

    ::-webkit-scrollbar-track-piece, ::-webkit-scrollbar-thumb {
        -webkit-border-radius: 8px;
    }

    ::-webkit-scrollbar-track-piece {
        background-color: #444;
    }

    ::-webkit-scrollbar-thumb:horizontal {
        width: 50px;
        background-color: #777;
    }

    ::-webkit-scrollbar-thumb:hover {
        background-color: #aaa;
    }

    .tooltip-inner {
        max-width: 400px;
        text-align: left;
    }

    .BetaTag {
        display: inline-block;
        background-color: lightgreen;
        border: 1px solid green;
        border-radius: 10px;
        font-size: 12px;
        padding: 5px;
    }

    .RankTag {
        background-color: #8DC63F;
        border-radius: 10px;
        padding: 5px 10px;
        color: white;
        border: solid 2px black;
    }

    .CRMTagCheckbox label b {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .CRMTag {
        text-transform: uppercase;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 1.5em;
        padding: 0.25em 1em;
        background-color: #8dc63f;
        border-radius: 4px;
        color: white !important;
        box-sizing: content-box;
        /*     height: 33px; width: 65px; padding: 8px; background-color:#2dd2bf !important; font-weight: bold !important; color: black !important;*/
    }

        .CRMTag span {
            margin-right: .3em;
            font-size: 1.5em;
        }

    a.CRMTag[href]:hover {
        background-color: #27aae1;
        text-decoration: none;
    }

    .wintergreenicon {
        background-image: url(../images/Wintergreen.svg);
        background-repeat: no-repeat;
        display: inline-block;
        width: 20px;
        height: 20px;
    }

    .wintergreenicon-prospect {
        background-image: url(../images/Wintergreen.svg);
        background-repeat: no-repeat;
        display: inline-block;
        width: 50px;
        height: 35px;
        background-size: 100% 100%;
    }

    .confirmedicon {
        background-image: url(../images/confirm.svg);
        background-repeat: no-repeat;
        display: inline-block;
        width: 25px;
        height: 25px;
    }

    .unlikelyicon {
        border: 2px dashed #939393;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
    }

    .verylowicon {
        margin: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
        background-color: #FB9700;
    }


    .veryhighicon {
        margin: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
        background-color: #61A601;
    }

    .highicon {
        margin: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
        background-color: #8DC63F;
    }

    .mediumicon {
        margin: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
        background-color: #FFD910;
    }

    .lowicon {
        margin: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        display: inline-block;
        background-color: #F4BA4A;
    }


    .Circle {
        width: 15px;
        height: 15px;
        border-radius: 100px;
    }

    .ellipse {
        width: 15px;
        height: 15px;
        background-color: #F4733C;
        border: 3px solid #D00F0F;
        border-radius: 100px;
    }

    .marker-label {
        font-size: 2px;
        font-weight: bold;
    }

    .filename-ellipsis {
        display: inline-block;
        max-width: 300px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: middle;
        margin-bottom: 15px;
    }

    notewindow {
        min-width: 420px !important;
        min-height: 420px !important;
        max-width: 700px !important;
        max-height: 700px !important;
    }

    .rwContentRow {
        overflow: scroll !important;
    }


    .note-popup-wrapper {
        display: flex;
        flex-direction: column;
        min-width: 400px !important;
        min-height: 400px !important;
        max-width: 100% !important;
        max-height: 100% !important;
    }

        .note-popup-wrapper .rowdiv {
            padding: 0 3px 3px 0;
        }

        .note-popup-wrapper .lable {
            margin: 0 20px 0 0;
            line-height: 30px;
            font-weight: bold;
        }

    .RadWindow table {
        width: 100%;
        table-layout: fixed;
        word-wrap: break-word;
    }

    *:focus-visible {
        outline: 2px solid black !important;
        outline-offset: 2px !important;
    }

    .RadComboBox input:focus {
        outline: 2px solid black !important;
        outline-offset: 2px !important;
        box-shadow: none !important;
    }

    .RadComboBox input:not(.rcbReadOnly),
    .RadComboBox input:not(.rcbReadOnly):focus {
        outline: none !important;
    }

    html body .RadInput .riTextBox:focus {
        outline: 2px solid black !important;
        outline-offset: 2px !important;
    }

    .RadForm.RadForm_Bootstrap.rfdTextbox input[type="text"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextbox input[type="password"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextbox input[type="search"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextbox input[type="url"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextbox input[type="tel"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextbox input[type="email"].rfdDecorated:focus, .RadForm.RadForm_Bootstrap.rfdTextarea textarea:focus {
        outline: 2px solid black !important;
        outline-offset: 2px !important;
    }
    /*#leftNav a:hover .sub-icon {
    color: #6db1ff !important;
}*/
    .RadForm.RadForm_Bootstrap.rfdLabel label:focus-within {
        outline: 2px solid black;
        outline-offset: 2px;
        border-radius: 2px;
    }

    .RadComboBox .rcbFocused .rcbInputCell,
    .RadComboBox_Bootstrap .rcbFocused .rcbInputCell {
        outline: none !important;
    }

    div.RadPicker table.rcSingle .riTextBox:focus, .RadPicker table.rcTable td:focus {
        outline: none !important;
    }

    .RadPicker table.rcTable:focus-within {
        outline: 2px solid black;
        outline-offset: 2px;
        border-radius: 2px;
    }

.next-navigation-panel {
    background: #F9F9F9;
    padding: 20px 8px;
    border: 1px Solid #595959;
    border-radius: 10px;
    margin-bottom: 10px;
}