@charset "UTF-8";

.feather {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
}

.drop-down-menu {
    position: absolute;
    opacity: 0;
    right: 0;
    visibility: hidden;
    background-color: #fff;
    padding: 10px 5px;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-radius: 4px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

    .drop-down-menu ul li {
        padding: .5rem 1.28rem;
        margin-right: 0;
        color: #151515;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .drop-down-menu ul li a {
            color: #151515;
        }

        .drop-down-menu ul li:hover {
            -webkit-transform: translateX(10px);
            transform: translateX(10px);
        }

.drop-down-menu-2 {
    position: absolute;
    opacity: 0;
    top: 27px;
    right: 10px;
    visibility: hidden;
    background-color: #fff;
    padding: 10px 5px;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-radius: 4px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-shadow: 0 0 5px 1px #ddd;
    box-shadow: 0 0 5px 1px #ddd;
}

    .drop-down-menu-2 ul li {
        padding: .5rem 1.28rem;
        margin-right: 0;
        color: #151515;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .drop-down-menu-2 ul li a {
            color: #151515;
        }

        .drop-down-menu-2 ul li:hover {
            -webkit-transform: translateX(10px);
            transform: translateX(10px);
        }

.drop-dwn-hvr:active .dropdown-arrow-2, .drop-dwn-hvr:focus .dropdown-arrow-2, .drop-dwn-hvr:hover .dropdown-arrow-2 {
    -webkit-animation-name: rotate;
    animation-name: rotate;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: .3s all ease;
    transition: .3s all ease;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

@keyframes rotate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

.drop-dwn-hvr:active, .drop-dwn-hvr:focus, .drop-dwn-hvr:hover .drop-down-menu-2 {
    opacity: 1 !important;
    visibility: visible;
    display: block !important;
    -webkit-transform: translateY(19px);
    transform: translateY(19px);
    z-index: 99999;
    -webkit-box-shadow: 0 0 5px 1px #d2d2d2;
    box-shadow: 0 0 5px 1px #d2d2d2;
}

.dropdwn:active, .dropdwn:focus, .dropdwn:hover .drop-down-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(19px);
    transform: translateY(19px);
    z-index: 99999;
    -webkit-box-shadow: 0 0 5px 1px #d2d2d2;
    box-shadow: 0 0 5px 1px #d2d2d2;
}

.custom-btn {
    border: 1px solid transparent;
    padding: 9px 15px;
    border-radius: 0.358rem;
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    line-height: 19px;
    display: inline-block;
}

    .custom-btn:hover {
        -webkit-transform: scale(1.04);
        transform: scale(1.04);
        -webkit-transition: .3s all ease;
        transition: .3s all ease;
    }

.custom-btn-2 {
    border: 1px solid transparent;
    padding: 9px 15px;
    width: 100%;
    border-radius: 0.358rem;
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    line-height: 19px;
    display: inline-block;
}

.custom-btn:hover {
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
    -webkit-transition: .3s all ease;
    transition: .3s all ease;
    color: #fff;
}

a.custom-btn-2:hover {
    color: #fff;
}

.action-btn {
    font-size: 16px;
    font-weight: 500;
    padding: 2px 5px;
}

.excel-btn {
    background: #21a366;
    color: #fff;
}

.trasnparent-btn {
    background: transparent;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    color: #6e6b7b;
    font-weight: 600;
}

.fixed-edit-btn {
    position: absolute;
    right: 0;
    top: 0;
}

    .fixed-edit-btn button {
        border: none;
        background-color: transparent;
        color: #6e6b7b;
    }

        .fixed-edit-btn button .feather {
            width: 30px;
            height: 30px;
        }

.edit-btn {
    border-color: #7897AB;
    background-color: #7897AB;
}

    .edit-btn:active, .edit-btn:focus {
        background-color: #A0BCC2;
    }

    .edit-btn:hover {
        -webkit-box-shadow: 0 8px 25px -8px #A0BCC2;
        box-shadow: 0 8px 25px -8px #A0BCC2;
    }

.primary-btn {
    /* For browsers that do not support gradients */
    background-image: linear-gradient(45deg, #008ff8, #046bb4);
    border: 1px solid #fff;
}

/* custom-success-button css */
.custom-success-btn {
    border-color: #28c76f;
    background-image: -webkit-gradient(linear, right top, left top, from(#009432), to(#28c76f));
    background-image: linear-gradient(to left, #009432, #28c76f);
}

    .custom-success-btn:active, .custom-success-btn:focus {
        background-position: right;
    }

    .custom-success-btn:hover {
        -webkit-box-shadow: 0 8px 25px -8px #28c76f;
        box-shadow: 0 8px 25px -8px #28c76f;
    }

/* custom-danger-button css */
.custom-danger-btn {
    border-color: #ea5455;
    background-image: -webkit-gradient(linear, right top, left top, from(#ea5455), to(#f08080));
    background-image: linear-gradient(to left, #ea5455, #f08080);
    color: #fff;
}

    .custom-danger-btn:active, .custom-danger-btn:focus {
        background-position-x: right;
        color: #fff;
    }

    .custom-danger-btn:hover {
        -webkit-box-shadow: 0 8px 25px -8px #ea5455;
        box-shadow: 0 8px 25px -8px #ea5455;
        color: #fff !important;
    }

button {
    background-color: transparent;
    border: none;
}

.custom-primary-btn {
    background: #f4f4f4;
    color: #82868b;
    border: 1px solid #82868b;
}

    .custom-primary-btn:active, .custom-primary-btn:focus, .custom-primary-btn:hover {
        background: #c3eed9;
        color: #59CE8F;
        border: 1px solid #59CE8F;
    }

.custom-negative-btn {
    background: #f4f4f4;
    color: #82868b;
    border: 1px solid #82868b;
}

    .custom-negative-btn:active, .custom-negative-btn:focus, .custom-negative-btn:hover {
        background: #f3a4a4;
        color: #E64848;
        border: 1px solid #E64848;
    }

/* custom-warning-button css */
.custom-warning-btn {
    background: #f4f4f4;
    color: #82868b;
    border: 1px solid #82868b;
}

    .custom-warning-btn:active, .custom-warning-btn:focus, .custom-warning-btn:hover {
        background: #f7eabf;
        color: #FDB827;
        border: 1px solid #FDB827;
    }

.custom-warning-btn-2 {
    border-color: #82868b;
    color: #82868b;
    background-color: #f4f4f4;
    -webkit-transition: .2s all ease;
    transition: .2s all ease;
}

    .custom-warning-btn-2:active, .custom-warning-btn-2:focus {
        background: #eed7c1;
        color: #ff922a;
        border-color: #ff922a;
        -webkit-transition: .2s all ease;
        transition: .2s all ease;
    }

::-moz-selection {
    background: #01afae;
    color: #fff;
}

::selection {
    background: #01afae;
    color: #fff;
}

.fixed-card-body::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    position: fixed;
}

.fixed-card-body::-webkit-scrollbar-thumb {
    background-color: #ddd;
}

::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

::-webkit-scrollbar-thumb {
    background-image: linear-gradient(45deg, #008ff8, #046bb4);
    border: 3px solid #FFF;
    border-radius: 10px;
}

::-webkit-scrollbar-track {
    background-color: #FFF;
}

.frm-label {
    font-size: 15px;
    display: block;
    padding-bottom: 10px;
    text-transform: capitalize;
    font-weight: 600;
    color: #6e6b7b;
}

.frm-label-2 {
    font-size: 15px;
    display: inline;
    padding-bottom: 10px;
    text-transform: capitalize;
    font-weight: 600;
    color: #6e6b7b;
}

.frm-label-val {
    font-size: 14px;
    color: #151515;
    font-weight: 600;
}

.frm-label-val-2 {
    font-size: 14px;
    color: #6e6b7b !important;
    font-weight: 600;
}

.form-control-2 {
    font-size: 14px;
    padding: 0.48rem 0.75rem;
    width: 100%;
}

.form-control {
    font-size: 14px;
    padding: 0.48rem 0.75rem;
}

.normal-form-control {
    font-size: 14px;
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
    position: absolute;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    right: 15px;
    background: transparent;
    outline: none;
    border: none;
    font-weight: 500;
    padding: 0;
    text-align: right;
}

    .normal-form-control:focus {
        outline: none !important;
        border: none;
    }

.custom-textarea {
    height: 100px;
}

.sub_event_mdl .modal-dialog {
    width: 32% !important;
}

.show-content {
    display: none !important;
}

.hide-content {
    display: block;
}

.modal .modal-header {
    background-color: #c9e4ef;
    border-bottom: none;
    -webkit-box-pack: initial;
    -ms-flex-pack: initial;
    justify-content: initial;
}

    .modal .modal-header h3 {
        font-size: 22px;
    }

    .modal .modal-header .modal-title {
        color: #6e6b7b;
        font-weight: 600;
        font-size: 16px;
    }

.modal .modal-body .light-txt {
    color: #6e6b7b !important;
    font-size: 12px !important;
}

.modal .modal-body .cmt-wrap h6 {
    color: #6e6b7b;
    font-weight: 600;
    font-size: 16px;
    padding-bottom: 10px;
}

.modal .modal-body .cmt-wrap p {
    color: #6e6b7b;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
}

.popup-modal .modal-content {
    border-radius: 20px !important;
}

    .popup-modal .modal-content::after {
        content: '';
        position: absolute;
        top: calc(-1 * 10px);
        left: calc(-1 * 10px);
        height: calc(100% + 10px * 2);
        width: calc(100% + 10px * 2);
        background: linear-gradient(60deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);
        border-radius: 20px;
        z-index: -1;
        -webkit-animation: moving-border 3s ease alternate infinite;
        animation: moving-border 3s ease alternate infinite;
        background-size: 300% 300%;
    }

@-webkit-keyframes moving-border {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes moving-border {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.popup-modal .modal-body {
    border: 1px solid #fff;
    border-radius: 20px;
}

    .popup-modal .modal-body .create-cont {
        padding: 20px;
        margin-top: 30px;
    }

        .popup-modal .modal-body .create-cont h5 {
            text-align: center;
            text-transform: uppercase;
            color: #6e6b7b;
            font-weight: 600;
            margin-bottom: 40px;
        }

        .popup-modal .modal-body .create-cont .btn-conainer {
            margin-top: 25px;
        }

.right-modal-form .menu {
    display: none;
}

    .right-modal-form .menu.active {
        display: block;
    }

.right-modal-form .softshow {
    display: none;
}

    .right-modal-form .softshow.active {
        display: block !important;
    }

.right-modal-form .align-margin-chck {
    margin-top: 40px;
}

.right-modal-form p {
    font-size: 16px;
    font-weight: 600;
    margin: 15px 0 5px 0;
}

.right-modal-form .right-div-cntrl {
    margin-bottom: 15px;
    margin-top: 5px;
}

.right-modal-form .right-submit-btn {
    margin: 20px 0 0 0;
}

.right-modal-form .frm-label-checkbx {
    font-size: 15px;
    padding-bottom: 10px;
    text-transform: capitalize;
    font-weight: 600;
    color: #6e6b7b;
    margin-left: 5px;
}

/*mobile-menu Top Area*/
.mobile-menu-top {
    font-size: 13px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
}

.mobile-menu-user-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .mobile-menu-user-menu > li {
        margin-right: 40px;
        position: relative;
    }

        .mobile-menu-user-menu > li:last-child {
            margin-right: 0;
        }

        .mobile-menu-user-menu > li::after {
            position: absolute;
            content: "|";
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            right: calc(0% - 20px);
        }

        .mobile-menu-user-menu > li:last-child::after {
            display: none;
        }

        .mobile-menu-user-menu > li > a {
            display: inline-block;
            line-height: 46px;
            color: #666 !important;
        }

            .mobile-menu-user-menu > li > a:hover {
                color: #261146;
            }

.has-mobile-user-dropdown {
    position: relative;
    padding-right: 15px;
}

    .has-mobile-user-dropdown::before {
        content: "";
        font-family: "FontAwesome";
        position: absolute;
        top: 50%;
        right: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        font-weight: 400;
    }

.mobile-user-sub-menu {
    position: absolute;
    top: calc(100%);
    left: 50%;
    -webkit-transform: translate(-50%, -30px);
    transform: translate(-50%, -30px);
    padding: 10px 15px;
    width: 160px;
    background: #FFF;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    opacity: 0;
    z-index: 99;
}

    .mobile-user-sub-menu > li {
        display: block;
        border-bottom: 1px solid #eee;
        padding: 5px 0;
    }

        .mobile-user-sub-menu > li:last-child {
            border-bottom: none;
        }

        .mobile-user-sub-menu > li > a {
            position: relative;
            color: #666;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
        }

            .mobile-user-sub-menu > li > a:hover {
                color: #261146;
            }

.user-sub-menu-link-icon {
    padding-right: 5px;
}

.has-mobile-user-dropdown:hover .mobile-user-sub-menu {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

/*Mobile Menu Center Area*/
.mobile-menu-customer-support {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-family: "Raleway", sans-serif;
}

.mobile-menu-customer-support-icon {
    max-width: 50px;
    overflow: hidden;
    margin-right: 30px;
}

    .mobile-menu-customer-support-icon img {
        width: 100%;
    }

.mobile-menu-customer-support-text-phone {
    display: block;
    font-size: 18px;
    font-weight: 700;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

    .mobile-menu-customer-support-text-phone:hover {
        color: #261146;
    }

.mobile-menu-customer-support-text {
    font-size: 14px;
    margin: 20px 0;
}

.mobile-action-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.mobile-action-icon-item {
    margin-right: 40px;
}

    .mobile-action-icon-item:last-child {
        margin-right: 0;
    }

.mobile-action-icon-link {
    position: relative;
    font-size: 27px;
    color: #333;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

    .mobile-action-icon-link:hover {
        color: #261146;
    }

.mobile-action-icon-item-count {
    position: absolute;
    top: 0;
    right: calc(0% - 10px);
    font-size: 11px;
    display: inline-block;
    background: #333;
    color: #FFF;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.mobile-action-icon-link:hover .mobile-action-icon-item-count {
    background: #261146;
}

/*Mobile Menu Bottom Area*/
.mobile-menu-bottom {
    position: fixed;
    bottom: 5%;
}

.offcanvas-menu {
    margin: 20px 0;
}

    .offcanvas-menu li {
        position: relative;
        padding: 10px 5px;
    }

    .offcanvas-menu > ul > li {
        border-bottom: 1px solid transparent;
    }

        .offcanvas-menu > ul > li:last-child {
            border-bottom: none;
        }

.mobile-sub-menu {
    border-left: 2px solid #ddd;
    margin: 20px 0;
    padding-left: 10px;
    list-style-type: none;
}

    .mobile-sub-menu li {
        padding: 12px 0;
        transition: background-color 0.3s ease;
    }



        .mobile-sub-menu li a {
            font-weight: 500 !important;
            text-decoration: none;
            color: #000;
            display: block;
            transition: color 0.3s ease;
        }



            /* Optional: Add icons for a more modern look */
            .mobile-sub-menu li a::before {
                content: '\f0da'; /* Font Awesome icon code for a right arrow */

                margin-right: 10px;
            }


.offcanvas-menu li a {
    display: block;
    color: #6e6b7b;
    text-decoration: none;
    text-transform: capitalize;
    font-weight: 600;
}

/*.offcanvas-menu li a:hover {
            color: #ddd;
        }*/
.offcanvas-menu li .mobile-sub-menu {
    display: none;
}

.offcanvas-menu-expand::after {
    content: "\f107";
    position: absolute;
    font-family: "FontAwesome";
    right: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    color: #666;
    font-weight: 600;
}

.offcanvas-menu .active > .offcanvas-menu-expand:last-child,
.sub-menu > .active .offcanvas-menu-expand:last-child {
    border-bottom: none;
}

.offcanvas-menu .active > .offcanvas-menu-expand::after,
.sub-menu > .active .offcanvas-menu-expand::after {
    color: #777;
    content: "\f106";
}

.mobile-menu-email {
    color: #999;
    text-align: center;
    display: block;
}

    .mobile-menu-email:hover {
        color: #261146;
    }

.mobile-menu-social {
    margin-top: 25px;
    text-align: center;
}

    .mobile-menu-social > li {
        display: inline-block;
        margin-right: 13px;
    }

        .mobile-menu-social > li:last-child {
            margin-right: 0px;
        }

        .mobile-menu-social > li > a {
            display: inline-block;
            font-size: 14px;
            padding: 0;
            line-height: 30px;
            width: 30px;
            height: 30px;
            border-radius: 100%;
            text-align: center;
            color: #FFF !important;
        }

            .mobile-menu-social > li > a:hover {
                opacity: 0.7;
            }

            .mobile-menu-social > li > a.facebook {
                background: #4867AA;
            }

            .mobile-menu-social > li > a.twitter {
                background: #1DA1F2;
            }

            .mobile-menu-social > li > a.youtube {
                background: #FE0000;
            }

            .mobile-menu-social > li > a.pinterest {
                background: #BD081B;
            }

            .mobile-menu-social > li > a.instagram {
                background: #B23A94;
            }

/*!
 * Quill Editor v1.3.6
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    height: 100px;
    margin: 0px;
    position: relative;
}

    .ql-container.ql-disabled .ql-tooltip {
        visibility: hidden;
    }

    .ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
        pointer-events: none;
    }

.ql-clipboard {
    left: -100000px;
    height: 1px;
    overflow-y: hidden;
    position: absolute;
    top: 50%;
}

    .ql-clipboard p {
        margin: 0;
        padding: 0;
    }

.ql-editor {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1.42;
    height: 100%;
    outline: none;
    overflow-y: auto;
    padding: 12px 15px;
    -o-tab-size: 4;
    tab-size: 4;
    -moz-tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
    word-wrap: break-word;
}

    .ql-editor > * {
        cursor: text;
    }

    .ql-editor p,
    .ql-editor ol,
    .ql-editor ul,
    .ql-editor pre,
    .ql-editor blockquote,
    .ql-editor h1,
    .ql-editor h2,
    .ql-editor h3,
    .ql-editor h4,
    .ql-editor h5,
    .ql-editor h6 {
        margin: 0;
        padding: 0;
        counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    }

    .ql-editor ol,
    .ql-editor ul {
        padding-left: 1.5em;
    }

        .ql-editor ol > li,
        .ql-editor ul > li {
            list-style-type: none;
        }

            .ql-editor ul > li::before {
                content: '\2022';
            }

        .ql-editor ul[data-checked=true],
        .ql-editor ul[data-checked=false] {
            pointer-events: none;
        }

            .ql-editor ul[data-checked=true] > li *,
            .ql-editor ul[data-checked=false] > li * {
                pointer-events: all;
            }

            .ql-editor ul[data-checked=true] > li::before,
            .ql-editor ul[data-checked=false] > li::before {
                color: #777;
                cursor: pointer;
                pointer-events: all;
            }

            .ql-editor ul[data-checked=true] > li::before {
                content: '\2611';
            }

            .ql-editor ul[data-checked=false] > li::before {
                content: '\2610';
            }

    .ql-editor li::before {
        display: inline-block;
        white-space: nowrap;
        width: 1.2em;
    }

    .ql-editor li:not(.ql-direction-rtl)::before {
        margin-left: -1.5em;
        margin-right: 0.3em;
        text-align: right;
    }

    .ql-editor li.ql-direction-rtl::before {
        margin-left: 0.3em;
        margin-right: -1.5em;
    }

    .ql-editor ol li:not(.ql-direction-rtl),
    .ql-editor ul li:not(.ql-direction-rtl) {
        padding-left: 1.5em;
    }

    .ql-editor ol li.ql-direction-rtl,
    .ql-editor ul li.ql-direction-rtl {
        padding-right: 1.5em;
    }

    .ql-editor ol li {
        counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
        counter-increment: list-0;
    }

        .ql-editor ol li:before {
            content: counter(list-0, decimal) ". ";
        }

        .ql-editor ol li.ql-indent-1 {
            counter-increment: list-1;
        }

            .ql-editor ol li.ql-indent-1:before {
                content: counter(list-1, lower-alpha) ". ";
            }

        .ql-editor ol li.ql-indent-1 {
            counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-2 {
            counter-increment: list-2;
        }

            .ql-editor ol li.ql-indent-2:before {
                content: counter(list-2, lower-roman) ". ";
            }

        .ql-editor ol li.ql-indent-2 {
            counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-3 {
            counter-increment: list-3;
        }

            .ql-editor ol li.ql-indent-3:before {
                content: counter(list-3, decimal) ". ";
            }

        .ql-editor ol li.ql-indent-3 {
            counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-4 {
            counter-increment: list-4;
        }

            .ql-editor ol li.ql-indent-4:before {
                content: counter(list-4, lower-alpha) ". ";
            }

        .ql-editor ol li.ql-indent-4 {
            counter-reset: list-5 list-6 list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-5 {
            counter-increment: list-5;
        }

            .ql-editor ol li.ql-indent-5:before {
                content: counter(list-5, lower-roman) ". ";
            }

        .ql-editor ol li.ql-indent-5 {
            counter-reset: list-6 list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-6 {
            counter-increment: list-6;
        }

            .ql-editor ol li.ql-indent-6:before {
                content: counter(list-6, decimal) ". ";
            }

        .ql-editor ol li.ql-indent-6 {
            counter-reset: list-7 list-8 list-9;
        }

        .ql-editor ol li.ql-indent-7 {
            counter-increment: list-7;
        }

            .ql-editor ol li.ql-indent-7:before {
                content: counter(list-7, lower-alpha) ". ";
            }

        .ql-editor ol li.ql-indent-7 {
            counter-reset: list-8 list-9;
        }

        .ql-editor ol li.ql-indent-8 {
            counter-increment: list-8;
        }

            .ql-editor ol li.ql-indent-8:before {
                content: counter(list-8, lower-roman) ". ";
            }

        .ql-editor ol li.ql-indent-8 {
            counter-reset: list-9;
        }

        .ql-editor ol li.ql-indent-9 {
            counter-increment: list-9;
        }

            .ql-editor ol li.ql-indent-9:before {
                content: counter(list-9, decimal) ". ";
            }

    .ql-editor .ql-indent-1:not(.ql-direction-rtl) {
        padding-left: 3em;
    }

    .ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
        padding-left: 4.5em;
    }

    .ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
        padding-right: 3em;
    }

    .ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
        padding-right: 4.5em;
    }

    .ql-editor .ql-indent-2:not(.ql-direction-rtl) {
        padding-left: 6em;
    }

    .ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
        padding-left: 7.5em;
    }

    .ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
        padding-right: 6em;
    }

    .ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
        padding-right: 7.5em;
    }

    .ql-editor .ql-indent-3:not(.ql-direction-rtl) {
        padding-left: 9em;
    }

    .ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
        padding-left: 10.5em;
    }

    .ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
        padding-right: 9em;
    }

    .ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
        padding-right: 10.5em;
    }

    .ql-editor .ql-indent-4:not(.ql-direction-rtl) {
        padding-left: 12em;
    }

    .ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
        padding-left: 13.5em;
    }

    .ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
        padding-right: 12em;
    }

    .ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
        padding-right: 13.5em;
    }

    .ql-editor .ql-indent-5:not(.ql-direction-rtl) {
        padding-left: 15em;
    }

    .ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
        padding-left: 16.5em;
    }

    .ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
        padding-right: 15em;
    }

    .ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
        padding-right: 16.5em;
    }

    .ql-editor .ql-indent-6:not(.ql-direction-rtl) {
        padding-left: 18em;
    }

    .ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
        padding-left: 19.5em;
    }

    .ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
        padding-right: 18em;
    }

    .ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
        padding-right: 19.5em;
    }

    .ql-editor .ql-indent-7:not(.ql-direction-rtl) {
        padding-left: 21em;
    }

    .ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
        padding-left: 22.5em;
    }

    .ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
        padding-right: 21em;
    }

    .ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
        padding-right: 22.5em;
    }

    .ql-editor .ql-indent-8:not(.ql-direction-rtl) {
        padding-left: 24em;
    }

    .ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
        padding-left: 25.5em;
    }

    .ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
        padding-right: 24em;
    }

    .ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
        padding-right: 25.5em;
    }

    .ql-editor .ql-indent-9:not(.ql-direction-rtl) {
        padding-left: 27em;
    }

    .ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
        padding-left: 28.5em;
    }

    .ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
        padding-right: 27em;
    }

    .ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
        padding-right: 28.5em;
    }

    .ql-editor .ql-video {
        display: block;
        max-width: 100%;
    }

        .ql-editor .ql-video.ql-align-center {
            margin: 0 auto;
        }

        .ql-editor .ql-video.ql-align-right {
            margin: 0 0 0 auto;
        }

    .ql-editor .ql-bg-black {
        background-color: #000;
    }

    .ql-editor .ql-bg-red {
        background-color: #e60000;
    }

    .ql-editor .ql-bg-orange {
        background-color: #f90;
    }

    .ql-editor .ql-bg-yellow {
        background-color: #ff0;
    }

    .ql-editor .ql-bg-green {
        background-color: #008a00;
    }

    .ql-editor .ql-bg-blue {
        background-color: #06c;
    }

    .ql-editor .ql-bg-purple {
        background-color: #93f;
    }

    .ql-editor .ql-color-white {
        color: #fff;
    }

    .ql-editor .ql-color-red {
        color: #e60000;
    }

    .ql-editor .ql-color-orange {
        color: #f90;
    }

    .ql-editor .ql-color-yellow {
        color: #ff0;
    }

    .ql-editor .ql-color-green {
        color: #008a00;
    }

    .ql-editor .ql-color-blue {
        color: #06c;
    }

    .ql-editor .ql-color-purple {
        color: #93f;
    }

    .ql-editor .ql-font-serif {
        font-family: Georgia, Times New Roman, serif;
    }

    .ql-editor .ql-font-monospace {
        font-family: Monaco, Courier New, monospace;
    }

    .ql-editor .ql-size-small {
        font-size: 0.75em;
    }

    .ql-editor .ql-size-large {
        font-size: 1.5em;
    }

    .ql-editor .ql-size-huge {
        font-size: 2.5em;
    }

    .ql-editor .ql-direction-rtl {
        direction: rtl;
        text-align: inherit;
    }

    .ql-editor .ql-align-center {
        text-align: center;
    }

    .ql-editor .ql-align-justify {
        text-align: justify;
    }

    .ql-editor .ql-align-right {
        text-align: right;
    }

    .ql-editor.ql-blank::before {
        color: rgba(0, 0, 0, 0.6);
        content: attr(data-placeholder);
        font-style: italic;
        left: 15px;
        pointer-events: none;
        position: absolute;
        right: 15px;
    }

.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
    clear: both;
    content: '';
    display: table;
}

.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    height: 24px;
    padding: 3px 5px;
    width: 28px;
}

    .ql-snow.ql-toolbar button svg,
    .ql-snow .ql-toolbar button svg {
        float: left;
        height: 100%;
    }

    .ql-snow.ql-toolbar button:active:hover,
    .ql-snow .ql-toolbar button:active:hover {
        outline: none;
    }

.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
    display: none;
}

.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
    color: #06c;
}

    .ql-snow.ql-toolbar button:hover .ql-fill,
    .ql-snow .ql-toolbar button:hover .ql-fill,
    .ql-snow.ql-toolbar button:focus .ql-fill,
    .ql-snow .ql-toolbar button:focus .ql-fill,
    .ql-snow.ql-toolbar button.ql-active .ql-fill,
    .ql-snow .ql-toolbar button.ql-active .ql-fill,
    .ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
    .ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
    .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
    .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
    .ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
    .ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
    .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
    .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
    .ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
        fill: #06c;
    }

    .ql-snow.ql-toolbar button:hover .ql-stroke,
    .ql-snow .ql-toolbar button:hover .ql-stroke,
    .ql-snow.ql-toolbar button:focus .ql-stroke,
    .ql-snow .ql-toolbar button:focus .ql-stroke,
    .ql-snow.ql-toolbar button.ql-active .ql-stroke,
    .ql-snow .ql-toolbar button.ql-active .ql-stroke,
    .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
    .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
    .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
    .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
    .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
    .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
    .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
    .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
    .ql-snow.ql-toolbar button:hover .ql-stroke-miter,
    .ql-snow .ql-toolbar button:hover .ql-stroke-miter,
    .ql-snow.ql-toolbar button:focus .ql-stroke-miter,
    .ql-snow .ql-toolbar button:focus .ql-stroke-miter,
    .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
    .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
    .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
    .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
    .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
    .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
    .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
    .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
    .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
    .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
        stroke: #06c;
    }

@media (pointer: coarse) {
    .ql-snow.ql-toolbar button:hover:not(.ql-active),
    .ql-snow .ql-toolbar button:hover:not(.ql-active) {
        color: #444;
    }

        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
            fill: #444;
        }

        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
            stroke: #444;
        }
}

.ql-snow {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .ql-snow * {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .ql-snow .ql-hidden {
        display: none;
    }

    .ql-snow .ql-out-bottom,
    .ql-snow .ql-out-top {
        visibility: hidden;
    }

    .ql-snow .ql-tooltip {
        position: absolute;
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
    }

        .ql-snow .ql-tooltip a {
            cursor: pointer;
            text-decoration: none;
        }

        .ql-snow .ql-tooltip.ql-flip {
            -webkit-transform: translateY(-10px);
            transform: translateY(-10px);
        }

    .ql-snow .ql-formats {
        display: inline-block;
        vertical-align: middle;
    }

        .ql-snow .ql-formats:after {
            clear: both;
            content: '';
            display: table;
        }

    .ql-snow .ql-stroke {
        fill: none;
        stroke: #444;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 2;
    }

    .ql-snow .ql-stroke-miter {
        fill: none;
        stroke: #444;
        stroke-miterlimit: 10;
        stroke-width: 2;
    }

    .ql-snow .ql-fill,
    .ql-snow .ql-stroke.ql-fill {
        fill: #444;
    }

    .ql-snow .ql-empty {
        fill: none;
    }

    .ql-snow .ql-even {
        fill-rule: evenodd;
    }

    .ql-snow .ql-thin,
    .ql-snow .ql-stroke.ql-thin {
        stroke-width: 1;
    }

    .ql-snow .ql-transparent {
        opacity: 0.4;
    }

    .ql-snow .ql-direction svg:last-child {
        display: none;
    }

    .ql-snow .ql-direction.ql-active svg:last-child {
        display: inline;
    }

    .ql-snow .ql-direction.ql-active svg:first-child {
        display: none;
    }

    .ql-snow .ql-editor h1 {
        font-size: 2em;
    }

    .ql-snow .ql-editor h2 {
        font-size: 1.5em;
    }

    .ql-snow .ql-editor h3 {
        font-size: 1.17em;
    }

    .ql-snow .ql-editor h4 {
        font-size: 1em;
    }

    .ql-snow .ql-editor h5 {
        font-size: 0.83em;
    }

    .ql-snow .ql-editor h6 {
        font-size: 0.67em;
    }

    .ql-snow .ql-editor a {
        text-decoration: underline;
    }

    .ql-snow .ql-editor blockquote {
        border-left: 4px solid #ccc;
        margin-bottom: 5px;
        margin-top: 5px;
        padding-left: 16px;
    }

    .ql-snow .ql-editor code,
    .ql-snow .ql-editor pre {
        background-color: #f0f0f0;
        border-radius: 3px;
    }

    .ql-snow .ql-editor pre {
        white-space: pre-wrap;
        margin-bottom: 5px;
        margin-top: 5px;
        padding: 5px 10px;
    }

    .ql-snow .ql-editor code {
        font-size: 85%;
        padding: 2px 4px;
    }

    .ql-snow .ql-editor pre.ql-syntax {
        background-color: #23241f;
        color: #f8f8f2;
        overflow: visible;
    }

    .ql-snow .ql-editor img {
        max-width: 100%;
    }

    .ql-snow .ql-picker {
        color: #444;
        display: inline-block;
        font-size: 14px;
        font-weight: 500;
        height: 24px;
        position: relative;
        vertical-align: middle;
    }

    .ql-snow .ql-picker-label {
        cursor: pointer;
        display: inline-block;
        height: 100%;
        padding-left: 8px;
        padding-right: 2px;
        position: relative;
        width: 100%;
    }

        .ql-snow .ql-picker-label::before {
            display: inline-block;
            line-height: 22px;
        }

    .ql-snow .ql-picker-options {
        background-color: #fff;
        display: none;
        min-width: 100%;
        padding: 4px 8px;
        position: absolute;
        white-space: nowrap;
    }

        .ql-snow .ql-picker-options .ql-picker-item {
            cursor: pointer;
            display: block;
            padding-bottom: 5px;
            padding-top: 5px;
        }

    .ql-snow .ql-picker.ql-expanded .ql-picker-label {
        color: #ccc;
        z-index: 2;
    }

        .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
            fill: #ccc;
        }

        .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
            stroke: #ccc;
        }

    .ql-snow .ql-picker.ql-expanded .ql-picker-options {
        display: block;
        margin-top: -1px;
        top: 100%;
        z-index: 1;
    }

    .ql-snow .ql-color-picker,
    .ql-snow .ql-icon-picker {
        width: 28px;
    }

        .ql-snow .ql-color-picker .ql-picker-label,
        .ql-snow .ql-icon-picker .ql-picker-label {
            padding: 2px 4px;
        }

            .ql-snow .ql-color-picker .ql-picker-label svg,
            .ql-snow .ql-icon-picker .ql-picker-label svg {
                right: 4px;
            }

        .ql-snow .ql-icon-picker .ql-picker-options {
            padding: 4px 0px;
        }

        .ql-snow .ql-icon-picker .ql-picker-item {
            height: 24px;
            width: 24px;
            padding: 2px 4px;
        }

        .ql-snow .ql-color-picker .ql-picker-options {
            padding: 3px 5px;
            width: 152px;
        }

        .ql-snow .ql-color-picker .ql-picker-item {
            border: 1px solid transparent;
            float: left;
            height: 16px;
            margin: 2px;
            padding: 0px;
            width: 16px;
        }

    .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
        position: absolute;
        margin-top: -9px;
        right: 0;
        top: 50%;
        width: 18px;
    }

    .ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
    .ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
    .ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
    .ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
    .ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
    .ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
        content: attr(data-label);
    }

    .ql-snow .ql-picker.ql-header {
        width: 98px;
    }

        .ql-snow .ql-picker.ql-header .ql-picker-label::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item::before {
            content: 'Normal';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
            content: 'Heading 1';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
            content: 'Heading 2';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
            content: 'Heading 3';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
            content: 'Heading 4';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
            content: 'Heading 5';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
            content: 'Heading 6';
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
            font-size: 2em;
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
            font-size: 1.5em;
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
            font-size: 1.17em;
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
            font-size: 1em;
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
            font-size: 0.83em;
        }

        .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
            font-size: 0.67em;
        }

    .ql-snow .ql-picker.ql-font {
        width: 108px;
    }

        .ql-snow .ql-picker.ql-font .ql-picker-label::before,
        .ql-snow .ql-picker.ql-font .ql-picker-item::before {
            content: 'Sans Serif';
        }

        .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
        .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
            content: 'Serif';
        }

        .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
        .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
            content: 'Monospace';
        }

        .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
            font-family: Georgia, Times New Roman, serif;
        }

        .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
            font-family: Monaco, Courier New, monospace;
        }

    .ql-snow .ql-picker.ql-size {
        width: 98px;
    }

        .ql-snow .ql-picker.ql-size .ql-picker-label::before,
        .ql-snow .ql-picker.ql-size .ql-picker-item::before {
            content: 'Normal';
        }

        .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
            content: 'Small';
        }

        .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
            content: 'Large';
        }

        .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
            content: 'Huge';
        }

        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
            font-size: 10px;
        }

        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
            font-size: 18px;
        }

        .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
            font-size: 32px;
        }

    .ql-snow .ql-color-picker.ql-background .ql-picker-item {
        background-color: #fff;
    }

    .ql-snow .ql-color-picker.ql-color .ql-picker-item {
        background-color: #000;
    }

.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
    padding: 8px;
    background: #f2f2f2;
}

    .ql-toolbar.ql-snow .ql-formats {
        margin-right: 15px;
    }

    .ql-toolbar.ql-snow .ql-picker-label {
        border: 1px solid transparent;
    }

    .ql-toolbar.ql-snow .ql-picker-options {
        border: 1px solid transparent;
        -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
        box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
    }

    .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
        border-color: #ccc;
    }

    .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
        border-color: #ccc;
    }

    .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
    .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
        border-color: #000;
    }

    .ql-toolbar.ql-snow + .ql-container.ql-snow {
        border-top: 0px;
    }

.ql-snow .ql-tooltip {
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 5px #ddd;
    box-shadow: 0px 0px 5px #ddd;
    color: #444;
    padding: 5px 12px;
    white-space: nowrap;
}

    .ql-snow .ql-tooltip::before {
        content: "Visit URL:";
        line-height: 26px;
        margin-right: 8px;
    }

    .ql-snow .ql-tooltip input[type=text] {
        display: none;
        border: 1px solid #ccc;
        font-size: 13px;
        height: 26px;
        margin: 0px;
        padding: 3px 5px;
        width: 170px;
    }

    .ql-snow .ql-tooltip a.ql-preview {
        display: inline-block;
        max-width: 200px;
        overflow-x: hidden;
        text-overflow: ellipsis;
        vertical-align: top;
    }

    .ql-snow .ql-tooltip a.ql-action::after {
        border-right: 1px solid #ccc;
        content: 'Edit';
        margin-left: 16px;
        padding-right: 8px;
    }

    .ql-snow .ql-tooltip a.ql-remove::before {
        content: 'Remove';
        margin-left: 8px;
    }

    .ql-snow .ql-tooltip a {
        line-height: 26px;
    }

    .ql-snow .ql-tooltip.ql-editing a.ql-preview,
    .ql-snow .ql-tooltip.ql-editing a.ql-remove {
        display: none;
    }

    .ql-snow .ql-tooltip.ql-editing input[type=text] {
        display: inline-block;
    }

    .ql-snow .ql-tooltip.ql-editing a.ql-action::after {
        border-right: 0px;
        content: 'Save';
        padding-right: 0px;
    }

    .ql-snow .ql-tooltip[data-mode=link]::before {
        content: "Enter link:";
    }

    .ql-snow .ql-tooltip[data-mode=formula]::before {
        content: "Enter formula:";
    }

    .ql-snow .ql-tooltip[data-mode=video]::before {
        content: "Enter video:";
    }

.ql-snow a {
    color: #06c;
}

.ql-container.ql-snow {
    border: 1px solid #ccc;
}

.text-editor {
    height: 200px;
}

body {
    margin: 0;
    padding: 0;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    background: linear-gradient(-45deg, #F1F6F9, #FFF5FD, #F4F4F2);
    background-size: 300% 300%;
    position: relative;
}

@-webkit-keyframes change {
    0% {
        background-position: 0 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0 50%;
    }
}

@keyframes change {
    0% {
        background-position: 0 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0 50%;
    }
}

.b-none {
    border: none !important;
}

h1, h2, h3, h4, h5, h6, p, figure, label {
    padding: 0;
    margin: 0;
}

ul, li {
    list-style: none;
    margin: 0;
    padding: 0;
    color: #151515;
}

a {
    color: #EF5B0C;
}

ul .heading-li {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #000;
}

ul .sub-hding-li {
    font-size: 12px;
    font-weight: 500;
}

a {
    text-decoration: none;
}

.dark-txt {
    color: #151515 !important;
}

.light-txt {
    color: #6e6b7b !important;
    font-size: 12px !important;
}

.highlight-txt {
    color: #008ff8 !important;
    font-weight: 500;
}

.sub_event_mdl .modal-dialog {
    width: 30%;
}

.modal-close .feather {
    width: 30px;
    height: 30px;
    stroke: #6e6b7b;
    stroke-width: 3;
}

.modal-close {
    outline: none;
    background: none;
    border: none;
    font-size: 26px;
    color: #6e6b7b;
    position: absolute;
    right: 10px;
}

.mm-menu {
    display: none;
}

/*.login-pg-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  height: 100vh;
  background-image: url(../images/login-pg-bg-2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -o-object-fit: cover;
     object-fit: cover;
}*/
.login-pg-wrapper {
    display: flex;
    justify-content: end;
    align-items: center; /* Center content vertically, adjust as needed */
    width: 100%;
    height: 100vh; /* Cover the full viewport height */
    background-size: cover;
    background-position: center;
    overflow: hidden; /* Prevent any overflow */
}


.background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: opacity 1s ease-out;
    opacity: 0; /* Start with hidden to manage via JS */
}

.background-1 {
    background-image: url('../images/login-pg-bg.jpg');
}

.background-2 {
    background-image: url('../images/login-pg-bg-2.jpg');
}

.background-3 {
    background-image: url('../images/CorporateSocialResponsibility.jpg');
}

.background-4 {
    background-image: url('../images/groupImage.png');
}

.background-5 {
    background-image: url('../images/light-bulb-ideas-creative-diagram-concept-scaled.jpg');
}

.background-6 {
    background-image: url('../images/research-discovery.jpeg');
}

.background-7 {
    background-image: url('../images/Reunion2022_Saturday_240.jpg');
}

.background-8 {
    background-image: url('../images/scholarship-concept-590165986-5b0db22d1d640400376afb04.jpg');
}

.background-9 {
    background-image: url('../images/shutterstock_286492934-e1564757386671.jpg');
}

/* Initially set the first background to be visible */
.background-1 {
    opacity: 1;
}

.loader-container {
    position: absolute; /* Make sure it's positioned over the entire page */
    top: 0;
    left: 0;
    width: 100vw; /* Full width of the viewport */
    height: 100vh; /* Full height of the viewport */
    background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent white background */
    backdrop-filter: blur(8px); /* Apply a blur effect on the background */
    display: none; /* Initially hidden */
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Ensure the loader is above everything else */
    display: flex; /* Flexbox to center the loader */
}

/* Loader Spinner Styling */
.loader {
    width: 60px;
    height: 60px;
    border: 8px solid rgba(0, 0, 0, 0.1); /* Light grey border */
    border-top: 8px solid #3498db; /* Blue color for rotating part */
    border-radius: 50%;
    animation: spin 1s linear infinite; /* Rotation animation */
}



.login-form-wrap {
    position: relative;
    background: rgba(255, 255, 255, 0.7);
    border: 2px solid hsla(0, 0%, 100%, .7);
    border-radius: 1rem;
    backdrop-filter: blur(16px);
    padding: 2rem 2rem 2rem 2rem; /* Reduced top padding */

    -webkit-backdrop-filter: blur(16px);
}


    .login-form-wrap .frm-label {
        display: block;
        color: #151521;
        font-weight: bold;
    }

.form-control:focus {
    border-color: #01afae;
    box-shadow: 0 0 8px rgba(1, 175, 174, 0.5);
    outline: none;
}

.login-form-wrap p {
    font-size: 14px;
    color: #6d7781;
    padding-bottom: 15px;
    font-weight: 500;
}

.login-form-wrap a {
    background-color: #01afae;
    width: 100%;
    color: #fff;
    padding: 10px;
    margin-top: 10px;
    border: none;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
}

.input-with-icon {
    position: relative;
    display: flex;
    align-items: center;
}

    .input-with-icon input.form-control {
        width: 100%;
        padding: 20px 15px 20px 50px; /* Added left padding to make space for the icon */
        border: 1px solid #ccc;
        border-radius: 10px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        transition: all 0.3s ease;
    }

    .input-with-icon i {
        position: absolute;
        left: 10px;
        font-size: 20px;
    }

    /* Input field focus */
    .input-with-icon input.form-control:focus {
        border-color: #01afae;
        box-shadow: 0 0 8px rgba(1, 175, 174, 0.5);
        outline: none;
    }

.login-btn:hover {
    background-color: #018f8e;
}

.fixed-search-panel {
    background-color: #fff;
    width: 330px;
    height: 100vh;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 999999;
    -webkit-transform: translateX(-330px);
    transform: translateX(-330px);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    padding: 5px 20px;
    overflow-y: auto;
}

    .fixed-search-panel .srch-label {
        border-bottom: 1px solid #ddd;
        padding-bottom: 13px;
        padding-top: 8px;
    }

        .fixed-search-panel .srch-label label {
            font-weight: 600;
            text-transform: capitalize;
            color: #6e6b7b;
        }

    .fixed-search-panel .frm-label {
        padding-bottom: 5px;
    }

.search-panel .frm-label {
    padding-bottom: 5px;
}

.active-search-panel {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
}

.header-txt {
    font-size: 24px !important;
    color: #00a1e4;
    margin-top: 20px;
    padding-bottom: 0 !important;
    border-bottom: 2px solid #00a1e4;
    display: inline-block !important;
}

.srch-pnl-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.top-header {
    background-color: #151515;
    padding: 0px 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

    .top-header .row:nth-child(1) {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .top-header .app-setting-wrap {
        padding-right: 15px;
    }

        .top-header .app-setting-wrap button {
            color: #6e6b7b;
        }

    .top-header .toggle-wrap {
        padding-right: 15px;
    }

        .top-header .toggle-wrap .toggle-btn {
            border: none;
            background-color: transparent;
            color: #6e6b7b;
            font-size: 18px;
        }

        .top-header .toggle-wrap #light-mode {
            display: none;
        }

    .top-header .dropdown-content {
        opacity: 0;
        visibility: hidden;
        position: absolute;
        width: 160px;
        background-color: #fff;
        z-index: 1;
        padding: 5px 0;
        right: 0;
        top: 58px;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        border-radius: 4px;
    }

        .top-header .dropdown-content .pop-profile-list {
            text-align: initial !important;
        }

            .top-header .dropdown-content .pop-profile-list li {
                font-size: 14px;
                line-height: 18px;
            }

                .top-header .dropdown-content .pop-profile-list li a {
                    padding: 0.65rem 1.28rem;
                    display: block;
                    color: #6e6b7b;
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    .top-header .dropdown-content .pop-profile-list li a:hover {
                        background-color: rgba(115, 103, 240, 0.12);
                    }

    .top-header .profile-info-wrap .show {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }

    .top-header .profile-info-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: 62px;
        position: relative;
    }

        .top-header .profile-info-wrap .notification-wrap {
            padding-right: 30px;
        }

            .top-header .profile-info-wrap .notification-wrap .dropdown-menu {
                visibility: hidden;
                opacity: 0;
                border: none !important;
                border-radius: 4px !important;
                -webkit-transition: all .3s ease-in-out !important;
                transition: all .3s ease-in-out !important;
                -webkit-transform: translate(-330px, 30px) !important;
                transform: translate(-330px, 30px) !important;
                display: initial !important;
                top: 35px !important;
            }

                .top-header .profile-info-wrap .notification-wrap .dropdown-menu.show {
                    visibility: visible;
                    opacity: 1;
                    -webkit-transform: translate(-330px, 0px) !important;
                    transform: translate(-330px, 0px) !important;
                }

            .top-header .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-item {
                font-size: 16px;
                color: rgba(0, 0, 0, 0.7);
                font-weight: 400;
                padding: 12px 20px;
                border-bottom: 1px solid rgba(0, 0, 0, 0.05);
            }

            .top-header .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-header {
                font-size: 16px;
                color: rgba(0, 0, 0, 0.7);
                font-weight: 400;
                padding: 12px 20px;
                border-bottom: 1px solid rgba(0, 0, 0, 0.05);
            }

                .top-header .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-header .text h4 {
                    font-size: 18px !important;
                }

            .top-header .profile-info-wrap .notification-wrap .dropdown-item:focus, .top-header .profile-info-wrap .notification-wrap .dropdown-item:hover {
                background-color: rgba(115, 103, 240, 0.12) !important;
            }

            .top-header .profile-info-wrap .notification-wrap .text h4 {
                font-size: 15px !important;
                font-weight: 500 !important;
                color: #6e6b7b;
                padding-bottom: 5px;
            }

                .top-header .profile-info-wrap .notification-wrap .text h4 span {
                    font-weight: 400;
                }

            .top-header .profile-info-wrap .notification-wrap .noti-icon-container {
                color: #6e6b7b;
                position: relative;
                font-size: 18px;
                cursor: pointer;
            }

                .top-header .profile-info-wrap .notification-wrap .noti-icon-container .notification-nmbr {
                    position: absolute;
                    background-color: #ea5455;
                    color: #fff;
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    top: -11px;
                    right: -13px;
                    width: 20px;
                    height: 20px;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    border-radius: 50%;
                    font-size: 12px;
                    font-weight: 600;
                }

        .top-header .profile-info-wrap .profile-cred-list {
            padding-right: 15px;
            text-align: end;
        }

            .top-header .profile-info-wrap .profile-cred-list .profile-name {
                font-weight: 600;
                color: #fff;
                font-size: 15px;
                line-height: 13px;
            }

            .top-header .profile-info-wrap .profile-cred-list .profile-desig {
                font-weight: 400;
                color: #fff;
                font-size: 13px;
            }

.dropdown-content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    width: 160px;
    background-color: #fff;
    z-index: 1;
    padding: 5px 0;
    right: 0;
    top: 58px;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    border-radius: 4px;
}

    .dropdown-content .pop-profile-list {
        text-align: initial !important;
    }

        .dropdown-content .pop-profile-list li {
            font-size: 14px;
            line-height: 18px;
        }

            .dropdown-content .pop-profile-list li a {
                padding: 0.65rem 1.28rem;
                display: block;
                color: #6e6b7b;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
            }

                .dropdown-content .pop-profile-list li a:hover {
                    background-color: rgba(115, 103, 240, 0.12);
                }

.profile-info-wrap .show {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

.profile-info-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 62px;
    position: relative;
}

    .profile-info-wrap .notification-wrap {
        padding-right: 30px;
    }

        .profile-info-wrap .notification-wrap .dropdown-menu {
            visibility: hidden;
            opacity: 0;
            border: none !important;
            border-radius: 4px !important;
            -webkit-transition: all .3s ease-in-out !important;
            transition: all .3s ease-in-out !important;
            -webkit-transform: translate(-330px, 30px) !important;
            transform: translate(-330px, 30px) !important;
            display: initial !important;
            top: 35px !important;
        }

            .profile-info-wrap .notification-wrap .dropdown-menu.show {
                visibility: visible;
                opacity: 1;
                -webkit-transform: translate(-330px, 0px) !important;
                transform: translate(-330px, 0px) !important;
            }

        .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-item {
            font-size: 16px;
            color: rgba(0, 0, 0, 0.7);
            font-weight: 400;
            padding: 12px 20px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        }

        .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-header {
            font-size: 16px;
            color: rgba(0, 0, 0, 0.7);
            font-weight: 400;
            padding: 12px 20px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        }

            .profile-info-wrap .notification-wrap .btn-group .dropdown-menu .dropdown-header .text h4 {
                font-size: 18px !important;
            }

        .profile-info-wrap .notification-wrap .dropdown-item:focus, .profile-info-wrap .notification-wrap .dropdown-item:hover {
            background-color: rgba(115, 103, 240, 0.12) !important;
        }

        .profile-info-wrap .notification-wrap .text h4 {
            font-size: 15px !important;
            font-weight: 500 !important;
            color: #6e6b7b;
            padding-bottom: 5px;
        }

            .profile-info-wrap .notification-wrap .text h4 span {
                font-weight: 400;
            }

        .profile-info-wrap .notification-wrap .noti-icon-container {
            color: #6e6b7b;
            position: relative;
            font-size: 18px;
            cursor: pointer;
        }

            .profile-info-wrap .notification-wrap .noti-icon-container .notification-nmbr {
                position: absolute;
                background-color: #ea5455;
                color: #fff;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                top: -11px;
                right: -13px;
                width: 20px;
                height: 20px;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                border-radius: 50%;
                font-size: 12px;
                font-weight: 600;
            }

    .profile-info-wrap .profile-cred-list {
        padding-right: 15px;
        text-align: end;
    }

        .profile-info-wrap .profile-cred-list .profile-name {
            font-weight: 600;
            color: #6e6b7b;
            font-size: 15px;
            line-height: 13px;
        }

        .profile-info-wrap .profile-cred-list .profile-desig {
            font-weight: 400;
            color: #6e6b7b;
            font-size: 13px;
        }

    .profile-info-wrap .profile-img-container img {
        border-radius: 50%;
    }

.layout-header .nav-menu {
    margin: 8px 0;
    padding: 0 17px;
    border-radius: 4px;
}

    .layout-header .nav-menu .nav-menu-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
    }

        .layout-header .nav-menu .nav-menu-list .pop-profile-list li {
            margin: 0 !important;
            padding: 0 !important;
        }

            .layout-header .nav-menu .nav-menu-list .pop-profile-list li a {
                padding: 0.65rem 1.28rem !important;
                color: #fff !important;
            }

        .layout-header .nav-menu .nav-menu-list .search-box-li {
            position: absolute;
            right: -5px;
            top: -6px;
        }

        .layout-header .nav-menu .nav-menu-list .search-bar {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            background: #d9d9d9;
            /* width: 240px; */
            height: 35px;
            border-radius: 40px;
        }

            .layout-header .nav-menu .nav-menu-list .search-bar .search-btn-txt {
                display: none;
                outline: none;
                background: none;
                border: none;
                padding: 10px;
                color: #6e6b7b;
                -webkit-transition: .3s all ease;
                transition: .3s all ease;
                line-height: 40px;
                width: 165px;
                padding: 0 6px;
                -webkit-box-shadow: none !important;
                box-shadow: none !important;
            }

            .layout-header .nav-menu .nav-menu-list .search-bar .search-btn {
                color: #6e6b7b;
                float: right;
                width: 40px;
                height: 35px;
                border-radius: 50%;
                background: #fff;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-transition: .3s all ease;
                transition: .3s all ease;
                border: 1px solid #ddd;
                position: absolute;
                right: 0;
            }

        .layout-header .nav-menu .nav-menu-list .search-btn:focus {
            background: #fff;
            color: #49c8e8;
        }

        .layout-header .nav-menu .nav-menu-list li {
            margin-right: 13px;
            text-transform: capitalize;
            position: relative;
            font-size: 15px;
            padding: 0;
            margin-top: 6px;
        }

            .layout-header .nav-menu .nav-menu-list li a {
                color: #fff;
            }

            .layout-header .nav-menu .nav-menu-list li:hover .drop-down-menu {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(19px);
                transform: translateY(19px);
            }

            .layout-header .nav-menu .nav-menu-list li:hover .dropdown-arrow {
                -webkit-animation-name: rotate;
                animation-name: rotate;
                -webkit-animation-duration: 0.5s;
                animation-duration: 0.5s;
                -webkit-animation-iteration-count: 1;
                animation-iteration-count: 1;
                -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
                -webkit-transition: .3s all ease;
                transition: .3s all ease;
            }

@keyframes rotate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

.layout-header .nav-menu .nav-menu-list li .active {
    background-image: -webkit-gradient(linear, left top, right top, from(#008ff8), to(#046bb4));
    background-image: linear-gradient(to right, #008ff8, #046bb4);
    border-radius: 4px;
    padding: 8px 12px;
    color: #fff;
}

.layout-header .nav-menu .nav-menu-list .drop-down-menu {
    position: absolute;
    opacity: 0;
    right: -30px;
    visibility: hidden;
    background-color: #fff;
    padding: 10px 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-radius: 4px;
    width: 200px;
    color: #6e6b7b;
}

    .layout-header .nav-menu .nav-menu-list .drop-down-menu ul li {
        padding: .5rem 1.28rem;
        margin-right: 0;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .layout-header .nav-menu .nav-menu-list .drop-down-menu ul li:hover {
            -webkit-transform: translateX(10px);
            transform: translateX(10px);
        }

        .layout-header .nav-menu .nav-menu-list .drop-down-menu ul li a {
            color: #6e6b7b;
        }

.layout-header .nav-menu .trigger.active .trigger-hide {
    display: none !important;
}

.layout-header .nav-menu .trigger.active .search-box-li {
    width: 100% !important;
    margin-left: 0 !important;
}

.layout-header .nav-menu .trigger.active .search-bar .search-btn-txt {
    width: 100%;
    display: block !important;
}

.primary-table {
    color: #151515;
}

    .primary-table a {
        color: #151515;
    }

    .primary-table th {
        border: none;
    }

    .primary-table thead tr {
        background: #c3d8eb;
    }

    .primary-table .table-btn button svg {
        color: #000;
    }

.light-table table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ddd;
}

    .light-table table tr th {
        background-color: #f3f2f7;
        letter-spacing: .5px;
        font-size: 13px;
        text-transform: uppercase;
        font-weight: 600;
        padding: 8px 10px;
    }

    .light-table table tr td {
        border-top: 1px solid #ebe9f1;
        font-size: 13px;
        padding: 8px 10px;
        font-weight: 600;
        color: #151515;
    }

.collapse-panel {
    background-color: #ffffff;
    padding: 15px;
    text-align: left;
    border-top: 1px solid #ddd;
}

.toggle-btn[data-bs-toggle="collapse"]::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: 'FontAwesome';
    font-weight: 700;
    content: "\f06e";
    margin-left: auto;
    color: #212529;
    font-size: 20px;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.toggle-btn[data-bs-toggle="collapse"][aria-expanded="true"]:after {
    color: #212529;
    content: "\f070";
}

.text-left {
    text-align: left;
}

.attachments-cont {
    margin: 10px auto;
}

    .attachments-cont .card {
        border-radius: 10px;
        width: 600px !important;
        height: 260px;
        background-color: #ffffff;
        padding: 10px 30px 40px;
        margin: 10px auto !important;
    }

    .attachments-cont h3 {
        font-size: 22px;
        font-weight: 600;
        color: #6e6b7b;
        text-align: center;
    }

    .attachments-cont .drop_box {
        margin: 10px 0;
        padding: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        border: 3px dotted #a3a3a3;
        border-radius: 5px;
    }

        .attachments-cont .drop_box h4 {
            font-size: 16px;
            font-weight: 400;
            color: #2e2e2e;
        }

        .attachments-cont .drop_box p {
            margin-top: 10px;
            margin-bottom: 20px;
            font-size: 12px;
            color: #a3a3a3;
        }

    .attachments-cont .btn {
        text-decoration: none;
        background-color: #005af0;
        color: #ffffff;
        padding: 10px 20px;
        border: none;
        outline: none;
        -webkit-transition: 0.3s;
        transition: 0.3s;
    }

        .attachments-cont .btn:hover {
            text-decoration: none;
            background-color: #ffffff;
            color: #005af0;
            padding: 10px 20px;
            border: none;
            outline: 1px solid #010101;
        }

    .attachments-cont .form input {
        margin: 10px 0;
        width: 100%;
        background-color: #e2e2e2;
        border: none;
        outline: none;
        padding: 12px 20px;
        border-radius: 4px;
    }

.badge-clr {
    background: #FF8B8B !important;
    color: #fff;
}

.search-input {
    position: relative;
    padding-right: 45px;
}

.search-bx {
    background: #EFF8FF;
    padding: 10px 5px;
    border: 1px solid #F4F6FF;
    border-radius: 10px;
}

    .search-bx .search-input-2 {
        position: relative;
    }

    .search-bx .search-icn-4 {
        position: absolute;
        right: -5px;
        padding: 9px;
        top: 26px;
        background: #d2d2d2;
    }

    .search-bx .search-icn-5 {
        position: absolute;
        right: 0px;
        padding: 9px;
        top: 12px;
    }

.search-icn {
    position: absolute;
    top: 44px;
    margin: 0 0px 0 -21px;
}

.search-icn-2 {
    position: absolute;
    /* top: 44px; */
    margin: 10px 0px 0 -21px;
}

.custom-scrch-bx {
    position: relative;
}

.custom-search-icn {
    background: #ddd;
    position: absolute;
    top: 1px !important;
    right: 0 !important;
    padding: 8px 10px !important;
}

.check-bx {
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    height: 15px;
    width: 15px;
    background-color: #ddd;
    border-radius: 3px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .check-bx::after {
        content: '\002714';
        font-size: 12px;
        font-weight: 600;
        color: white;
        display: none;
    }

    .check-bx:hover {
        background-color: #a5a5a5;
    }

    .check-bx:checked {
        background-color: #14C38E;
    }

        .check-bx:checked::after {
            display: block;
        }

.check-bx-2 {
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    background-color: #ddd;
    border-radius: 3px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .check-bx-2::after {
        content: '\002714';
        font-size: 17px;
        font-weight: 600;
        color: white;
        display: none;
    }

    .check-bx-2:hover {
        background-color: #a5a5a5;
    }

    .check-bx-2:checked {
        background-color: #14C38E;
    }

        .check-bx-2:checked::after {
            display: block;
        }

.switch-check {
    position: relative;
    width: 50px;
    height: 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #c6c6c6;
    outline: none;
    border-radius: 20px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-transition: .5s ease;
    transition: .5s ease;
}

    .switch-check:checked {
        background-image: -webkit-gradient(linear, left top, right top, from(#008ff8), to(#046bb4));
        background-image: linear-gradient(to right, #008ff8, #046bb4);
    }

    .switch-check::before {
        content: '';
        position: absolute;
        width: 20px;
        height: 19px;
        border-radius: 20px;
        top: -2px;
        left: 0;
        background: #fff;
        border: 1px solid #ddd;
        -webkit-transition: .5s;
        transition: .5s;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    }

    .switch-check:checked::before {
        left: 30px;
    }

.nav-pills .nav-link {
    color: #6e6b7b;
}

    .nav-pills .nav-link.active {
        background-image: -webkit-gradient(linear, left top, right top, from(#008ff8), to(#046bb4)) !important;
        background-image: linear-gradient(to right, #008ff8, #046bb4) !important;
    }

.nav-pills .active {
    background-image: linear-gradient(45deg, #008ff8, #046bb4);
    color: #fff;
}

.filter-body {
    background: #fff;
}

.img-td {
    position: relative;
}

    .img-td .kebab {
        position: absolute;
        bottom: 8px;
        left: 17px;
    }

.dropdown-menu li:hover {
    background: #f2f2f2;
}

.dropdown-iteam {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

    .dropdown-iteam:hover {
        background: #f2f2f2;
    }

.kebab .white-kebab {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
}

.kebab .kebab-btn-round {
    background: #d2d2d2;
    padding: 7px 15px;
    border-radius: 50%;
}

.kebab .profpic-edt {
    background: #d2d2d2;
    padding: 1px 5px;
    border-radius: 4px;
}

.status-sec {
    text-transform: capitalize;
}

    .status-sec .status {
        width: 100%;
        padding: 7px 13px;
        border-radius: 6px;
    }

    .status-sec .positive {
        background: #ddf1e7;
        color: #20b365;
    }

    .status-sec .negative {
        background: #f1dddd;
        color: #ca3d3d;
    }

    .status-sec .waiting {
        background: #f1f1dd;
        color: #d4b734;
    }

    .status-sec .raw {
        background: #F4F5F6;
        color: #333C44;
    }

    .status-sec .draft {
        background: #f1e3dd;
        color: #e27250;
    }

    .status-sec .submited {
        background: #dde5f1;
        color: #2f5ad1;
    }

.constituent-flter-secound-hdr {
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.cntnt-sec {
    text-align: left;
    font-size: 14px;
    padding: 10px;
    border-top: 1px solid #ddd;
    border-width: 50%;
    text-transform: capitalize;
}

    .cntnt-sec .menu {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .cntnt-sec .menu.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .cntnt-sec .menu-2 {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .cntnt-sec .menu-2.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .cntnt-sec .menu-3 {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .cntnt-sec .menu-3.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .cntnt-sec .value {
        color: #0984e3;
        font-weight: 500;
    }

    .cntnt-sec .dark-txt {
        color: #1c1c1c;
        font-weight: 500;
        padding-bottom: 5px !important;
    }

.note-cntnt {
    text-align: left;
    font-size: 14px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-top: 1px solid #ddd;
    border-width: 50%;
}

    .note-cntnt .read-more-sec {
        text-align: left;
    }

        .note-cntnt .read-more-sec li {
            margin-bottom: 7px;
            list-style-type: circle;
        }

        .note-cntnt .read-more-sec .heading-li {
            text-align: center;
            list-style-type: none !important;
        }

    .note-cntnt .menu {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .note-cntnt .menu.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .note-cntnt .menu-2 {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .note-cntnt .menu-2.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .note-cntnt .menu-3 {
        display: none;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
        font-weight: 500;
    }

        .note-cntnt .menu-3.active {
            display: block;
            -webkit-transition: 1s all ease;
            transition: 1s all ease;
        }

    .note-cntnt .value {
        color: #0984e3;
        font-weight: 500;
    }

.select-sndr {
    cursor: pointer;
}

    .select-sndr .view-prfl-btn {
        margin-top: -39px;
        float: right;
        opacity: 0;
        -webkit-transition: .3s all ease-in-out;
        transition: .3s all ease-in-out;
    }

    .select-sndr:hover .view-prfl-btn {
        opacity: 1;
    }

.add-member {
    display: none;
}

    .add-member.active {
        display: block !important;
    }

.details-mdl-data {
    background: #f2f2f2;
    border: 1px solid rgba(156, 156, 156, 0.2);
    padding: 15px 5px;
    margin: 0 10px 0px 0px;
    border-radius: 5px;
}

.floating-btn-container {
    position: fixed;
    top: 70%;
    right: -7px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 100;
}

    .floating-btn-container .collapse-btn-float {
        background: #14C38E;
        border-radius: 50%;
        border: none;
        color: #fff;
        padding: 1px 2px;
        position: relative;
    }

    .floating-btn-container ul {
        list-style: none;
    }

        .floating-btn-container ul li {
            width: 40px;
            height: 40px;
            position: relative;
            background: #dd4b39;
            margin: 10px 0;
            cursor: pointer;
            border-radius: 50px;
            -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
        }

            .floating-btn-container ul li i {
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                font-size: 20px;
                color: #fff;
            }

            .floating-btn-container ul li .fa {
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                font-size: 20px;
                color: #fff;
            }

    .floating-btn-container .slider {
        content: "";
        position: absolute;
        top: 0;
        right: 51px;
        width: 0px;
        height: 40px;
        background: #f17564;
        border-radius: 30px;
        -webkit-transition: all 0.5s 0.3s ease;
        transition: all 0.5s 0.3s ease;
    }

        .floating-btn-container .slider p {
            font-family: arial;
            text-transform: uppercase;
            font-size: 14px;
            font-weight: 600;
            color: #fff;
            text-align: center;
            line-height: 40px;
            opacity: 0;
            -webkit-transition: all 0.6s ease;
            transition: all 0.6s ease;
        }

    .floating-btn-container ul li:hover .slider {
        width: 180px;
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

        .floating-btn-container ul li:hover .slider p {
            opacity: 1;
            -webkit-transition: all 1s 0.2s ease;
            transition: all 1s 0.2s ease;
        }

.guest-img-sec {
    border-radius: 50%;
    width: 40px;
    height: 40px;
}

.status-lbl {
    margin-top: 7px;
    padding: 3px 10px;
    text-align: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    background: #eee;
    font-weight: 400;
    font-size: 12px;
    height: 25px;
    border-radius: 6px;
    -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

.footer-sec {
    position: -webkit-sticky;
    position: sticky;
    bottom: -15px;
    left: 0px;
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    background: #fff;
    z-index: 99999;
}

.layout-body {
    padding: 0 0 18px 0;
    /*****************************
    Layout - Offcanvas
    *****************************/
    /*mobile-menu Top Area*/
}

    .layout-body .heading-bg {
        background: #fddbb5;
        border-bottom: 1px solid #d2d2d2 !important;
    }

    .layout-body .view-platform-div .top-bnr-img {
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.5))), url(../images/banner-2.jpg) no-repeat;
        background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.5)), url(../images/banner-2.jpg) no-repeat;
        background-size: cover;
        height: 350px;
        width: 100%;
    }

        .layout-body .view-platform-div .top-bnr-img h3 {
            color: #fff !important;
            font-weight: 600;
        }

            .layout-body .view-platform-div .top-bnr-img h3 span {
                display: block;
                color: #5db2f0;
                font-size: 75px;
            }

        .layout-body .view-platform-div .top-bnr-img a {
            color: #fff;
            font-weight: 500;
            font-size: 16px;
            -webkit-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            padding: 10px 15px;
            margin-top: 15px;
            width: 15px;
            background: rgba(255, 255, 255, 0.3);
            border-top: 1px solid rgba(255, 255, 255, 0.5);
            border-left: 1px solid rgba(255, 255, 255, 0.5);
            -webkit-backdrop-filter: blur(7px);
            backdrop-filter: blur(7px);
        }

            .layout-body .view-platform-div .top-bnr-img a:hover span {
                -webkit-transition: all 0.6s ease-in-out;
                transition: all 0.6s ease-in-out;
                margin-right: 5px;
            }

        .layout-body .view-platform-div .top-bnr-img.curve-border {
            border-bottom-right-radius: 50px;
            border-bottom-left-radius: 50px;
        }

    .layout-body .view-platform-div .info-1-sec {
        padding: 15px 5px;
    }

    .layout-body .view-platform-div .info-2-sec {
        background: #FEFBF6;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        padding: 15px 10px;
    }

    .layout-body .view-platform-card .view-platform-card-1 {
        width: 100%;
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content;
        margin-right: 20px;
        padding: 15px;
    }

        .layout-body .view-platform-card .view-platform-card-1 .img-sec img {
            height: 320px;
        }

        .layout-body .view-platform-card .view-platform-card-1 .msg-sec {
            position: relative;
            width: 700px;
            margin: 0 auto;
            padding: 10px;
            background: #d2d2d2;
            height: 100px;
            border-radius: 10px;
        }

            .layout-body .view-platform-card .view-platform-card-1 .msg-sec p {
                text-align: center;
                margin-top: 27px;
                color: #008ff8;
            }

            .layout-body .view-platform-card .view-platform-card-1 .msg-sec .top-left-edge {
                position: absolute;
                top: 0;
                left: 0;
                border-top: 20px solid #fff;
                border-right: 20px solid transparent;
                border-bottom: 20px solid transparent;
                border-left: 20px solid #fff;
                -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
                box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
                border-bottom-right-radius: 10px;
            }

    .layout-body .view-platform-card .view-platform-card-2 {
        width: 100%;
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content;
        padding: 15px;
    }

    .layout-body .tab-content .export-sec {
        padding: 10px 10px;
        background: #EEEEEE;
        border: 1px solid #ddd;
        width: 100%;
    }

        .layout-body .tab-content .export-sec .icn {
            color: #00a1e4;
            padding: 10px 15px;
            font-size: 24px;
        }

        .layout-body .tab-content .export-sec .info-sec {
            cursor: pointer;
        }

            .layout-body .tab-content .export-sec .info-sec p {
                font-size: 16px;
                font-weight: 500;
            }

            .layout-body .tab-content .export-sec .info-sec span {
                font-size: 11px;
            }

    .layout-body .create-evnt-tab-sec {
        height: 460px;
        overflow-y: scroll;
    }

        .layout-body .create-evnt-tab-sec .Guest-manager-tab .guest-img-sec {
            border-radius: 50%;
            width: 40px;
            height: 40px;
        }

        .layout-body .create-evnt-tab-sec .Guest-manager-tab .status-lbl {
            margin-top: 7px;
            padding: 3px 10px;
            text-align: center;
            width: -webkit-fit-content;
            width: -moz-fit-content;
            width: fit-content;
            background: #eee;
            font-weight: 400;
            font-size: 12px;
            height: 25px;
            border-radius: 6px;
            -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
        }

        .layout-body .create-evnt-tab-sec .Guest-manager-tab .neg-status {
            background: #F37878 !important;
            color: #fff !important;
        }

    .layout-body .Compose-email-tab-sec .email-sec-tabs .right-align {
        text-align: right;
    }

    .layout-body .Compose-email-tab-sec .email-sec-tabs .email-content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 200px;
        height: 250px;
        background: #ddd;
    }

    .layout-body .Compose-email-tab-sec .email-sec-tabs .select-btn {
        padding: 3px 10px;
        text-align: center;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        background: #eee;
        color: #6e6b7b;
        font-weight: 500;
        font-size: 14px;
        height: 25px;
        border-radius: 6px;
        -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
    }

    .layout-body .template-cont .nav-tabs-2 li button {
        border: 1px solid #ddd;
    }

        .layout-body .template-cont .nav-tabs-2 li button.active {
            border: 1px solid #008ff8;
            background: none;
            color: #046bb4;
        }

    .layout-body .template-cont .editor-cont .edit-artboard {
        padding: 10px;
        border: 5px solid #ddd;
        border-radius: 6px;
        height: 450px;
    }

    .layout-body .template-cont .editor-cont .editor-btn-cont {
        padding: 15px;
    }

        .layout-body .template-cont .editor-cont .editor-btn-cont .editor-btn {
            width: 120px;
            height: 100px;
            background: #f9f9f9;
            font-size: 13px;
            -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
            text-transform: uppercase;
            color: #6e6b7b;
        }

            .layout-body .template-cont .editor-cont .editor-btn-cont .editor-btn p {
                font-weight: 500;
            }

            .layout-body .template-cont .editor-cont .editor-btn-cont .editor-btn:hover {
                background: #D6E5FA;
                -webkit-transform: scale(1.05);
                transform: scale(1.05);
                -webkit-transition: .5s all ease-in-out;
                transition: .5s all ease-in-out;
            }

    .layout-body .email-template-div .nav-tabs li {
        display: block;
        width: 100%;
        text-align: left;
    }

        .layout-body .email-template-div .nav-tabs li button {
            width: 100%;
            text-align: left;
        }

            .layout-body .email-template-div .nav-tabs li button.active {
                background-image: -webkit-gradient(linear, left top, right top, from(#008ff8), to(#046bb4));
                background-image: linear-gradient(to right, #008ff8, #046bb4);
            }

    .layout-body .email-template-div .template-product-sec {
        height: 300px;
        background: #fff;
        -webkit-box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.3);
        border-radius: 6px;
        -webkit-transition: .5s all ease-in-out;
        transition: .5s all ease-in-out;
    }

        .layout-body .email-template-div .template-product-sec .img-sec img {
            height: 200px;
            width: 100%;
            cursor: pointer;
            border-bottom-left-radius: 30px;
            border-bottom-right-radius: 30px;
        }

        .layout-body .email-template-div .template-product-sec .temp-det {
            height: 50px;
            background: #fff;
            padding: 0 15px;
        }

        .layout-body .email-template-div .template-product-sec:hover {
            -webkit-transform: scale(1.02);
            transform: scale(1.02);
            -webkit-transition: .5s all ease-in-out;
            transition: .5s all ease-in-out;
        }

    .layout-body .list-sec-cont h5 {
        color: #000;
    }

        .layout-body .list-sec-cont h5 a {
            color: #000;
        }

    .layout-body .list-sec-cont .card-body {
        padding: 0 0 15px 0 !important;
    }

    .layout-body .list-sec-cont .contituent-frm-1 button {
        margin-right: 15px;
    }

    .layout-body .list-sec-cont .tab-sec .nav-tabs li {
        padding: 10px 15px;
    }

        .layout-body .list-sec-cont .tab-sec .nav-tabs li a {
            color: #1c1c1c !important;
        }

            .layout-body .list-sec-cont .tab-sec .nav-tabs li a i {
                font-size: 16px;
            }

        .layout-body .list-sec-cont .tab-sec .nav-tabs li span {
            border-radius: 50% !important;
            padding: 5px 7px;
        }

        .layout-body .list-sec-cont .tab-sec .nav-tabs li a.active {
            background: linear-gradient(45deg, #008ff8, #046bb4);
            padding: 10px 15px;
            border-top-right-radius: 10px;
            border-top-left-radius: 10px;
            -webkit-box-shadow: none !important;
            box-shadow: none !important;
            color: #fff !important;
        }

    .layout-body .list-sec-cont .tab-sec .nav-tabs > li > span {
        opacity: 1;
        cursor: pointer;
        border-radius: 50% !important;
        padding: 5px 7px;
        text-align: center;
        font-size: 13px;
    }

    .layout-body .list-sec-cont .tab-sec .list-pannel {
        margin: 0 auto;
        border: 1px solid #ddd;
        border-top: 1px solid #00a1e4;
        border-radius: 6px;
        -webkit-box-shadow: 0 0 7px 1px #dfdfdf;
        box-shadow: 0 0 7px 1px #dfdfdf;
        padding: 10px 15px;
    }

        .layout-body .list-sec-cont .tab-sec .list-pannel .box-cont {
            width: 100%;
            margin: 20px auto;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

            .layout-body .list-sec-cont .tab-sec .list-pannel .box-cont .box {
                margin: 0 auto;
                height: 250px;
                width: 350px;
                border: dashed 2px #008ff8;
                padding: 30px;
            }

                .layout-body .list-sec-cont .tab-sec .list-pannel .box-cont .box img {
                    width: 100px;
                    height: 100px;
                    margin-bottom: 10px;
                }

    .layout-body .list-sec-cont .constituent-stts {
        border-bottom: 1px solid #ddd;
        padding: 10px 0;
    }

        .layout-body .list-sec-cont .constituent-stts span {
            font-weight: 600;
        }

    .layout-body .list-sec-cont .constituent-contrl-1 {
        border-bottom: 1px solid #ddd;
        padding: 10px 0;
        background-color: darkslategrey;
    }

    .layout-body .list-sec-cont .constituent-contrl-mobile {
        display: none;
        border-bottom: 1px solid #ddd;
        padding: 10px 0;
    }

    .layout-body .list-sec-cont .constituent-contrl-2 {
        border-bottom: 1px solid #ddd;
        padding: 10px 0;
    }

    .layout-body .list-sec-cont .modal.modal-right .modal-body {
        padding: 15px 10px !important;
    }

    .layout-body .create-event-tabs li {
        margin-right: 15px;
    }

        .layout-body .create-event-tabs li .active {
            background: -webkit-gradient(linear, left top, right top, from(#008ff8), to(#046bb4));
            background: linear-gradient(to right, #008ff8, #046bb4);
        }

        .layout-body .create-event-tabs li button {
            color: #1c1c1c;
            font-weight: 500;
        }

    .layout-body .tabs-2 li {
        margin-right: 15px;
    }

        .layout-body .tabs-2 li .active {
            border-top: 4px solid #008ff8;
            background: none !important;
            -webkit-box-shadow: none;
            box-shadow: none;
            outline: none;
            color: #6e6b7b !important;
        }

        .layout-body .tabs-2 li button {
            color: #1c1c1c;
            font-weight: 500;
        }

    .layout-body .create-event-accordian-sec {
        margin-top: 20px;
    }

        .layout-body .create-event-accordian-sec .accordion-item {
            margin-bottom: 20px;
        }

        .layout-body .create-event-accordian-sec .accordion-header {
            position: relative;
        }

            .layout-body .create-event-accordian-sec .accordion-header .toggle_icon {
                position: absolute;
                right: 20px;
                top: 13px;
                height: 27px;
                width: 27px;
                font-size: 18px !important;
                background: #fff;
                line-height: 25px !important;
                text-align: center;
                color: black !important;
                border: 1px solid #ddd;
                border-radius: 50%;
                font-weight: 600 !important;
            }

        .layout-body .create-event-accordian-sec a {
            color: #6e6b7b;
        }

        .layout-body .create-event-accordian-sec .upload {
            position: relative;
            display: inline-block;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-line-pack: center;
            align-content: center;
            width: 250px;
            padding: 120px 0 0 0;
            height: 200px;
            overflow: hidden;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            background: url("../images/upload.png") center center no-repeat #e4e4e4;
            border: 2px dashed #008ff8;
            border-radius: 6px;
            background-size: 120px 120px;
            background-color: #ddd;
            -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
        }

            .layout-body .create-event-accordian-sec .upload .custom-upload {
                width: 100%;
                height: 100%;
                -webkit-transform: scale(4);
                transform: scale(4);
                opacity: 0;
            }

            .layout-body .create-event-accordian-sec .upload p {
                position: absolute;
                bottom: 0;
                left: 45px;
                z-index: 999;
                padding: 15px;
                opacity: 1;
                text-align: center;
            }

    .layout-body .floating-add-btn-container {
        position: fixed;
        bottom: 20%;
        right: 3%;
        z-index: 1;
    }

        .layout-body .floating-add-btn-container button {
            background-color: transparent;
            border: none;
            width: 45px;
            height: 45px;
            /*background: #35a989; */
            background: #3a3a3a;
            border-radius: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: #fff;
        }

    .layout-body .floating-search-btn-container {
        position: fixed;
        bottom: 10%;
        right: 3%;
        z-index: 1;
    }

        .layout-body .floating-search-btn-container button {
            background-color: transparent;
            border: none;
            width: 45px;
            height: 45px;
            /*background: #35a989; */
            background: #4f6bf2;
            border-radius: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: #fff;
        }

    .layout-body .show-hide-panel {
        display: none;
    }

    .layout-body .panel-active {
        display: block;
    }

    .layout-body .btn-conainer {
        margin-top: 30px;
    }

    .layout-body .status-txt {
        font-weight: 600;
        text-transform: capitalize;
        color: #6e6b7b;
    }

        .layout-body .status-txt .pndg-txt {
            font-weight: 400;
            color: #ef6000;
        }

        .layout-body .status-txt .rjct-txt {
            color: #ea5455;
            font-weight: 400;
        }

    .layout-body .mobile-header-wrapper {
        padding: 10px 18px;
        background-color: #fff;
    }

    .layout-body .mobile-menu {
        padding: 5px;
        display: block;
        border-radius: 4px;
    }

    .layout-body .mobile-menu-dash {
        display: block;
        width: 25px;
        height: 2px;
        background: #6e6b7b;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .layout-body .offcanvas {
        z-index: 999999;
        position: fixed;
        top: 0;
        overflow: auto;
        height: 100vh;
        padding: 20px;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-box-shadow: none;
        box-shadow: none;
        background: #fff;
        color: #6e6b7b;
        width: 300px;
        overflow-x: hidden;
        visibility: visible;
    }

    .layout-body .nav-transparent-bg-active {
        background-color: rgba(0, 0, 0, 0.5);
        position: fixed;
        width: 100%;
        height: 100%;
        z-index: 999998;
        top: 0;
        bottom: 0;
    }

    .layout-body .offcanvas-leftside {
        left: 0%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }

    .layout-body .offcanvas-rightside {
        right: 0%;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

    .layout-body .offcanvas.offcanvas-open {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    .layout-body .offcanvas-overlay {
        position: fixed;
        z-index: 999;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: none;
        background-color: rgba(0, 0, 0, 0.5);
    }

    .layout-body .offcanvas-header {
        margin-bottom: 30px;
        padding: 0;
    }

    .layout-body .offcanvas-close {
        width: 28px;
        height: 28px;
        line-height: 28px;
        background: #fff;
        border-radius: 50%;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        border: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: auto 0 auto auto;
    }

        .layout-body .offcanvas-close:hover {
            color: #261146;
            border-color: #261146;
        }

    .layout-body .offcanvas-title {
        margin-bottom: 40px;
    }

    .layout-body .mobile-menu-top {
        font-size: 13px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
    }

    .layout-body .mobile-menu-user-menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        .layout-body .mobile-menu-user-menu > li {
            margin-right: 40px;
            position: relative;
        }

            .layout-body .mobile-menu-user-menu > li:last-child {
                margin-right: 0;
            }

            .layout-body .mobile-menu-user-menu > li::after {
                position: absolute;
                content: "|";
                top: 50%;
                -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
                right: calc(0% - 20px);
            }

            .layout-body .mobile-menu-user-menu > li:last-child::after {
                display: none;
            }

            .layout-body .mobile-menu-user-menu > li > a {
                display: inline-block;
                line-height: 46px;
                color: #666 !important;
            }

                .layout-body .mobile-menu-user-menu > li > a:hover {
                    color: #261146;
                }

    .layout-body .has-mobile-user-dropdown {
        position: relative;
        padding-right: 15px;
    }

        .layout-body .has-mobile-user-dropdown::before {
            content: "";
            font-family: "FontAwesome";
            position: absolute;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            font-weight: 400;
        }

    .layout-body .mobile-user-sub-menu {
        position: absolute;
        top: calc(100%);
        left: 50%;
        -webkit-transform: translate(-50%, -30px);
        transform: translate(-50%, -30px);
        padding: 10px 15px;
        width: 160px;
        background: #FFF;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        border-radius: 3px;
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        visibility: hidden;
        opacity: 0;
        z-index: 99;
    }

        .layout-body .mobile-user-sub-menu > li {
            display: block;
            border-bottom: 1px solid #eee;
            padding: 5px 0;
        }

            .layout-body .mobile-user-sub-menu > li:last-child {
                border-bottom: none;
            }

            .layout-body .mobile-user-sub-menu > li > a {
                position: relative;
                color: #666;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
            }

                .layout-body .mobile-user-sub-menu > li > a:hover {
                    color: #261146;
                }

    .layout-body .card-wrap-clr-one {
        background: linear-gradient(87deg, #7da0fa, #5f89f1) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-backdrop-filter: blur(5px);
        backdrop-filter: blur(5px);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-one:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .card-wrap-clr-two {
        background: linear-gradient(87deg, #636fe5, #805fe4) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-two:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .card-wrap-clr-three {
        background: linear-gradient(87deg, #7878e8, #6060f3) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-three .card-wrap-head h5 {
            border-bottom: 1px solid #fff !important;
        }

        .layout-body .card-wrap-clr-three:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .card-wrap-clr-four {
        background: #4747a1 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-four .card-wrap-head h5 {
            border-bottom: 1px solid #fff !important;
        }

        .layout-body .card-wrap-clr-four:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .card-wrap-clr-five {
        background: #f4797e !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-five .card-wrap-head h5 {
            border-bottom: 1px solid #fff !important;
        }

        .layout-body .card-wrap-clr-five:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .card-wrap-clr-six {
        background: #fd5552 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        border-left: 1px solid rgba(255, 255, 255, 0.5);
        -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
        color: #fff !important;
        font-size: 15px !important;
    }

        .layout-body .card-wrap-clr-six .card-wrap-head h5 {
            border-bottom: 1px solid #fff !important;
        }

        .layout-body .card-wrap-clr-six:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
        }

    .layout-body .header-txt {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding-bottom: 12px;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .layout-body .header-txt h4 {
            font-size: 17px;
            text-transform: capitalize;
            color: #6e6b7b;
            text-align: initial;
        }

        .layout-body .header-txt .header-icon {
            background-color: #fe8767;
            color: #fff;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            font-size: 13px;
            margin-left: 8px;
        }

    .layout-body .breadcrumb {
        margin-bottom: 5px;
    }

        .layout-body .breadcrumb i {
            font-size: 18px;
        }

        .layout-body .breadcrumb li a {
            color: #008ff8;
        }

    .layout-body .clr-card-wrap {
        height: 87%;
    }

        .layout-body .clr-card-wrap .header-txt h4 {
            color: #6e6b7b;
        }

        .layout-body .clr-card-wrap .clr-card-wrap-five {
            background-color: #00a1e4 !important;
            color: #fff;
            cursor: pointer;
            height: 150px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
        }

            .layout-body .clr-card-wrap .clr-card-wrap-five img {
                width: 60px;
                margin-bottom: 10px;
            }

        .layout-body .clr-card-wrap .approval-list-wrap {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            padding: 18px 0;
            text-align: center;
        }

            .layout-body .clr-card-wrap .approval-list-wrap .approval-list li:nth-child(1) {
                font-size: 15px;
                font-weight: 500;
                text-transform: capitalize;
                padding-bottom: 8px;
            }

            .layout-body .clr-card-wrap .approval-list-wrap .approval-list li:nth-child(2) {
                font-size: 22px;
                font-weight: 500;
            }

    .layout-body .card-wrap {
        background-color: #fff;
        /*padding: 20px 17px;*/

        border-radius: 15px;
        color: #6e6b7b;
        overflow: hidden;
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content;
    }

        .layout-body .card-wrap .dashboard-icns {
            width: 40px;
            height: 40px;
        }

        .layout-body .card-wrap .card-wrap-head h5 {
            padding: 10px 17px;
            border-bottom: 1px solid #ddd;
            font-size: 15px;
            text-transform: capitalize;
            font-weight: 600;
            line-height: 19px;
            text-align: initial;
        }

        .layout-body .card-wrap .cus-body-wrap {
            /*padding: 5px 17px 17px !important;*/
            padding: 0 0 17px 0 !important;
        }

        .layout-body .card-wrap .card-wrap-body {
            padding: 10px 17px 17px 17px;
            position: relative;
        }

            .layout-body .card-wrap .card-wrap-body .filter-panel-wrap {
                border-bottom: 1px solid #ddd;
                padding-bottom: 12px;
                background-color: #bfe0eb;
                padding-left: 20px;
                padding-top: 4px;
            }

            .layout-body .card-wrap .card-wrap-body .side-img-card-wrap {
                height: 100%;
                background-color: #cdc9f3;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
            }

            .layout-body .card-wrap .card-wrap-body .clr-two {
                background-color: #e8f2ff !important;
            }

            .layout-body .card-wrap .card-wrap-body .fixed-edit-btn {
                position: absolute;
                right: 0;
                top: 0;
            }

                .layout-body .card-wrap .card-wrap-body .fixed-edit-btn button {
                    border: none;
                    background-color: transparent;
                    color: #6e6b7b;
                }

                    .layout-body .card-wrap .card-wrap-body .fixed-edit-btn button .feather {
                        width: 30px;
                        height: 30px;
                    }

            .layout-body .card-wrap .card-wrap-body .chart-wrap {
                width: 300px !important;
                height: 300px !important;
                margin: auto;
            }

        .layout-body .card-wrap .stat-list-wrap {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            height: 80px;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
        }

            .layout-body .card-wrap .stat-list-wrap .stat-list {
                text-align: center;
            }

                .layout-body .card-wrap .stat-list-wrap .stat-list li:nth-child(1) {
                    font-size: 15px;
                    font-weight: 600;
                    color: #fff;
                    margin-bottom: 6px;
                    text-transform: capitalize;
                }

                .layout-body .card-wrap .stat-list-wrap .stat-list li:nth-child(2) {
                    font-size: 15px;
                    font-weight: 600;
                    color: #fff;
                    margin-bottom: 6px;
                    text-transform: capitalize;
                }

                .layout-body .card-wrap .stat-list-wrap .stat-list li:nth-child(3) {
                    font-size: 15px;
                    font-weight: 600;
                    color: #fff;
                    margin-bottom: 6px;
                    text-transform: capitalize;
                }

                    .layout-body .card-wrap .stat-list-wrap .stat-list li:nth-child(3) span {
                        font-size: 13px;
                        font-weight: 500;
                    }

        .layout-body .card-wrap h2 {
            font-size: 15px;
            text-transform: capitalize;
        }

        .layout-body .card-wrap h4 {
            font-size: 20px;
            text-transform: capitalize;
            padding-bottom: 15px;
        }

        .layout-body .card-wrap .add-btn-container {
            padding: 0px 0 20px 15px;
        }

    .layout-body .custom-progress-bar {
        margin-top: 7px;
        border-radius: 10px;
    }

        .layout-body .custom-progress-bar .progress-line {
            position: relative;
            height: 10px;
            width: 100%;
            background: #f0f0f0;
            border-radius: 10px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), 0px 1px rgba(255, 255, 255, 0.8);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), 0px 1px rgba(255, 255, 255, 0.8);
            -webkit-transform: scale(0);
            transform: scale(0);
            -webkit-transform-origin: left;
            transform-origin: left;
            -webkit-animation: animate 1s cubic-bezier(1, 0, 0.5, 1) forwards;
            animation: animate 1s cubic-bezier(1, 0, 0.5, 1) forwards;
        }

            .layout-body .custom-progress-bar .progress-line span {
                -webkit-transform: scale(0);
                transform: scale(0);
                -webkit-transform-origin: left;
                transform-origin: left;
                -webkit-animation: animate 1s 1s cubic-bezier(1, 0, 0.5, 1) forwards;
                animation: animate 1s 1s cubic-bezier(1, 0, 0.5, 1) forwards;
                height: 100%;
                width: 75%;
                background: -webkit-gradient(linear, right top, left top, from(#24A19C), to(#66BFBF));
                background: linear-gradient(to left, #24A19C, #66BFBF);
                position: absolute;
                left: 0;
                border-radius: 10px;
            }

                .layout-body .custom-progress-bar .progress-line span::before {
                    position: absolute;
                    right: 0;
                    top: -10px;
                    content: '';
                    height: 0;
                    width: 0;
                    border: 7px solid transparent;
                    border-bottom-width: 0px;
                    border-right-width: 0px;
                    border-top-color: #000;
                    -webkit-animation: showtxt 0.5s 1.5s liner forwards;
                    animation: showtxt 0.5s 1.5s liner forwards;
                }

                .layout-body .custom-progress-bar .progress-line span::after {
                    position: absolute;
                    right: 0;
                    top: -34px;
                    content: '75%';
                    background: #3D3C42;
                    color: #fff;
                    font-size: 12px;
                    font-weight: 500;
                    overflow: visible;
                    z-index: 99999;
                    padding: 2px;
                    -webkit-animation: showtxt 0.5s 1.5s liner forwards;
                    animation: showtxt 0.5s 1.5s liner forwards;
                }

@-webkit-keyframes animate {
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes animate {
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes showtxt {
    100% {
        opacity: 1;
    }
}

@keyframes showtxt {
    100% {
        opacity: 1;
    }
}

.step-wizard .step-wizard-list {
    color: #333;
}

    .step-wizard .step-wizard-list .step-wizard-item {
        padding: 20px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        min-height: 100px;
        position: relative;
    }

    .step-wizard .step-wizard-list .step-wizard-item {
        z-index: 10;
    }

        .step-wizard .step-wizard-list .step-wizard-item .progress-status {
            float: left;
            overflow: visible;
            margin-right: 10px;
            position: absolute;
            left: -4px;
            font-weight: 400;
            font-size: 16px;
            top: 20px;
            color: #fff;
            z-index: 10;
            cursor: pointer;
        }

            .step-wizard .step-wizard-list .step-wizard-item .progress-status:hover {
                -webkit-transform: scale(1.2);
                transform: scale(1.2);
                -webkit-transition: 1s all ease-in-out;
                transition: 1s all ease-in-out;
            }

            .step-wizard .step-wizard-list .step-wizard-item .progress-status.success {
                background: #16C79A;
                height: 20px;
                width: 20px;
                border-radius: 50%;
                text-align: center;
                margin-right: 10px;
            }

            .step-wizard .step-wizard-list .step-wizard-item .progress-status.waiting {
                background: #F5A31A;
                height: 20px;
                width: 20px;
                border-radius: 50%;
                text-align: center;
                margin-right: 10px;
            }

            .step-wizard .step-wizard-list .step-wizard-item .progress-status.cancel {
                background: #FD5E53;
                height: 20px;
                width: 20px;
                border-radius: 50%;
                text-align: center;
                margin-right: 10px;
            }

            .step-wizard .step-wizard-list .step-wizard-item .progress-status.notifications {
                background: #008FF8;
                border: 3px solid #ddd;
                width: 15px;
                height: 15px;
                border-radius: 50%;
                position: absolute;
                left: -1px;
            }

        .step-wizard .step-wizard-list .step-wizard-item .progress-label {
            margin-left: 25px;
            margin-bottom: 5px;
            padding: 3px 10px;
            text-align: center;
            background: #eee;
            font-weight: 600;
            height: 25px;
            border-radius: 6px;
            -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
        }

        .step-wizard .step-wizard-list .step-wizard-item .progress-status.current-event::before {
            content: '';
            height: 20px;
            width: 20px;
            border-radius: 50%;
            background: #008FF8;
            position: absolute;
            left: 0px;
            top: 0px;
            z-index: -5;
        }

.step-wizard .step-wizard-item + .step-wizard-item::before {
    position: absolute;
    content: '';
    left: 5px;
    top: -65px;
    width: 2px;
    height: 100%;
    z-index: -10;
    background: #d9d9d9;
}

.mobile-header-wrapper {
    padding: 10px 18px;
    background-color: #fff;
}

.mobile-menu {
    padding: 5px;
    display: block;
    border-radius: 4px;
}

.mobile-menu-dash {
    display: block;
    width: 25px;
    height: 2px;
    background: #6e6b7b;
    margin-top: 5px;
    margin-bottom: 5px;
}

@media (max-width: 1303px) {
    .layout-header .bottom-header .header-layout .nav-menu .nav-menu-list li {
        font-size: 14px;
        margin-right: 23px;
    }

    .layout-header .bottom-header .header-layout .nav-menu .nav-menu-list .search-box-li {
        margin-left: 148px !important;
    }
}

@media (max-width: 1199px) {
    .layout-header .bottom-header .header-layout .nav-menu .nav-menu-list .search-box-li {
        margin-left: 72px !important;
    }

    .top-header-content {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .big-screen-logo {
        display: none;
    }

    .top-header-left-content {
        display: none;
    }

    .lg-res-space {
        padding-top: 25px;
    }
}

@media (max-width: 767px) {
    /*.login-pg-wrapper {
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .login-form-wrap {
        padding: 2rem 2rem 2rem 2rem;
        background: rgba(255, 255, 255, 0.7);
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
        width: 100%;
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content;
    }*/
    .login-pg-wrapper {
        justify-content: center; /* Center content horizontally on mobile */
        align-items: center; /* Center content vertically on mobile */
    }

    .login-form-wrap {
        width: 90%; /* Make the form width responsive on mobile */
        max-width: 400px; /* Max width for larger mobile devices */
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        margin: 0; /* Remove margin for mobile view */
    }

    .res-space {
        padding-top: 25px;
    }

    .hori-form {
        display: initial !important;
    }

        .hori-form .frm-label {
            width: auto !important;
            padding-bottom: 10px !important;
        }

    .top-header {
        background-color: #fff;
        padding: 0;
    }

    .layout-body {
        padding: 18px 0px;
    }

    .mm-menu {
        display: block;
    }

    .sm-res-space {
        padding-top: 25px;
    }

    .main-sec-mobile {
        display: block !important;
    }

    .main-sec-desktop {
        display: none !important;
    }

    .modal-dialog {
        width: 100% !important;
    }

    .modal-content {
        width: 96% !important;
    }

    .layout-body .create-event-tabs li {
        width: 100%;
    }

        .layout-body .create-event-tabs li button {
            width: 100% !important;
        }

    .layout-body .tabs-2 li {
        width: 100%;
    }

        .layout-body .tabs-2 li button {
            width: 100% !important;
        }

    .sub_event_mdl .modal-dialog {
        width: 96% !important;
    }

    .layout-body .create-evnt-tab-sec {
        height: 765px !important;
    }

    .show-content {
        display: block !important;
    }

    .hide-content {
        display: none !important;
    }

    .card-body {
        padding: 0 !important;
    }

    .note-cntnt ul {
        margin-bottom: 15px;
    }

    .custom-d-sm-none {
        display: none;
    }

    .profile-info {
        display: none;
    }

    .sdg-wrap label {
        margin: 10px 0px !important;
    }

    .nav-tabs > .nav-item > .nav-link {
        padding: 8px 0px !important;
    }

    .note-cntnt {
        text-align: left !important;
    }

    .right-modal-form {
        padding: 5px;
    }

        .right-modal-form .menu {
            display: none;
        }

            .right-modal-form .menu.active {
                display: block;
            }

    .form-control-2 {
        width: 97%;
    }

    .search-icn {
        position: absolute !important;
        top: 48px !important;
    }

    .align-margin-chck {
        margin-top: 5px !important;
    }

    .action-tab {
        padding-left: 33px !important;
    }

    .constituent-contrl-1 {
        display: none;
    }

    .constituent-contrl-mobile {
        display: block !important;
    }

    .search-icn-3 {
        position: fixed;
        top: 38% !important;
        right: 7% !important;
        padding: 8px 10px !important;
    }

    .read-more-sec {
        padding: 0 !important;
    }

        .read-more-sec .heading-li {
            text-align: left !important;
        }

    .constituent-flter-secound-hdr .third-hdr {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .box-cont {
        width: 100%;
        margin: 20px auto !important;
        display: block !important;
    }

        .box-cont .box {
            margin: 10px auto !important;
            width: 100% !important;
            border: dashed 2px #008ff8;
            padding: 20px !important;
        }

            .box-cont .box img {
                width: 100px;
                height: 100px;
                margin-bottom: 10px;
            }
}

@media (max-width: 400px) {
    .constituent-flter-secound-hdr {
        display: block !important;
    }

        .constituent-flter-secound-hdr .first-hdr {
            display: inline;
        }

        .constituent-flter-secound-hdr .scnd-hdr {
            display: inline;
        }

        .constituent-flter-secound-hdr .third-hdr {
            display: -webkit-box !important;
            display: -ms-flexbox !important;
            display: flex !important;
            margin-top: 7px !important;
        }

    .search-bx .search-icn-4 {
        position: absolute;
        right: -5px;
        padding: 9px;
        top: 12px;
        background: #d2d2d2;
    }

    .log-flex-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: 100vh;
    }

        .log-flex-wrap .login-form-wrap {
            height: initial;
            height: 100vh;
            padding: 180px 30px;
        }

            .log-flex-wrap .login-form-wrap .input-icon {
                right: 70px !important;
            }

    .sm-pad {
        padding: 0 !important;
    }

    .custom-d-sm-none {
        display: none;
    }

    .profile-info {
        display: none;
    }

    .sdg-wrap label {
        margin: 10px 0px !important;
    }

    .nav-tabs > .nav-item > .nav-link {
        padding: 8px 0px !important;
    }

    .note-cntnt {
        text-align: left !important;
    }

    .right-modal-form {
        padding: 5px;
    }

        .right-modal-form .menu {
            display: none;
        }

            .right-modal-form .menu.active {
                display: block;
            }

    .form-control-2 {
        width: 97%;
    }

    .search-icn {
        position: absolute !important;
        top: 48px !important;
    }

    .align-margin-chck {
        margin-top: 5px !important;
    }

    .action-tab {
        padding-left: 33px !important;
    }

    .constituent-contrl-1 {
        display: none;
    }

    .constituent-contrl-mobile {
        display: block !important;
    }
}

@media (max-width: 375px) {
    .log-flex-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: 100vh;
    }

        .log-flex-wrap .login-form-wrap {
            height: initial;
            height: 100vh;
            padding: 150px 30px;
        }

            .log-flex-wrap .login-form-wrap .input-icon {
                right: 65px !important;
            }
}

.frm-header {
    display: inline-block;
    color: #00a1e4;
    border-left: 3px solid #E2191F;
    padding-left: 10px;
    font-size: 20px;
}

.all-wrap {
    padding: 0 0 0 0;
}

    .all-wrap .view-single-panel {
        position: absolute;
        right: 20px;
        top: 17px;
    }

        .all-wrap .view-single-panel button {
            color: #6e6b7b;
            font-size: 25px;
        }

.top-header .noti-show {
    opacity: 1;
    visibility: visible;
}

.login-left-sec {
    background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);
    background-size: 400% 400%;
    position: relative;
    -webkit-animation: change 10s ease-in-out infinite;
    animation: change 10s ease-in-out infinite;
}

@keyframes change {
    0% {
        background-position: 0 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0 50%;
    }
}

.liquid {
    background: url("../images/edge.png");
    background-position-x: right;
    background-repeat: no-repeat;
    width: 100%;
    height: 100vh;
}

    .liquid h4 {
        color: #fff;
        font-weight: 700;
    }

.login-btn {
    background: -webkit-gradient(linear, left top, right top, from(#61d0e3), color-stop(0%, #1e6fad), to(#00d4ff)) !important;
    background: linear-gradient(90deg, #61d0e3 0%, #1e6fad 0%, #00d4ff 100%) !important;
}

.owl-carousel {
    width: 74%;
    margin-top: 120px;
    min-height: 450px;
}

    .owl-carousel .owl-item .login_img {
        float: right;
        width: 600px;
        height: 350px;
        background-repeat: no-repeat;
        background-size: cover;
        padding-right: 3rem;
    }

.owl-dots {
    position: fixed;
    padding: 3.3rem 1.3rem;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transform: translateY(-240px);
    transform: translateY(-240px);
}

    .owl-dots button {
        border-radius: 5rem;
        margin: .3rem 0;
    }

        .owl-dots button span {
            background: #fff !important;
            margin: 0rem .6rem !important;
        }

    /* .owl-dots .active{
    border: 1px solid #E8630A !important;
} */
    .owl-dots .active span {
        border: 1px solid #000;
        background: #E8630A !important;
        -webkit-transform: scale(1);
        transform: scale(1);
        margin: .1rem .6rem !important;
    }

.login-form-wrap h3 {
    font-weight: 600;
    font-size: 24px;
    color: #3a3a3a;
    padding-bottom: 10px;
}

.login-form-wrap p {
    font-size: 14px;
    color: #8898aa;
    padding-bottom: 15px;
}

.login-form-wrap .form-label .input-icon {
    display: inline;
    position: absolute;
    right: 81px;
    padding: 8px 7px;
    margin-top: -36px;
}

.login-form-wrap .form-label a {
    background-color: #01afae;
    width: 100%;
    color: #fff;
    padding: 10px;
    margin-top: 10px;
    border: none;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
}

.filter-header-panel {
    display: none;
}

    .filter-header-panel.active, .fy-active, .program-wrap-active, .project-wrap-active, .partner-wrap-activate {
        display: block;
    }

.disable {
    display: none;
}

.rotate {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.sdg-wrap input[type="checkbox"][id^="cb"] {
    display: none;
}

.sdg-wrap label {
    border: 1px solid #fff;
    padding: 10px;
    display: block;
    position: relative;
    margin: 10px;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .sdg-wrap label::before {
        background-color: white;
        color: white;
        content: "";
        display: block;
        border-radius: 50%;
        border: 1px solid #01afae;
        position: absolute;
        top: -5px;
        left: -5px;
        width: 25px;
        height: 25px;
        text-align: center;
        line-height: 28px;
        -webkit-transition-duration: 0.4s;
        transition-duration: 0.4s;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    .sdg-wrap label img {
        width: 100%;
        -webkit-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }

.sdg-wrap :checked + label {
    border-color: #ddd;
}

    .sdg-wrap :checked + label::before {
        content: "✓";
        background-color: #35a989;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    .sdg-wrap :checked + label img {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -webkit-box-shadow: 0 0 5px #333;
        box-shadow: 0 0 5px #333;
        z-index: -1;
    }

    .sdg-wrap :checked + label .schedule-box-wrap {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -webkit-box-shadow: 0 0 5px #333;
        box-shadow: 0 0 5px #333;
        z-index: -1;
    }

.sdg-wrap .schedule-box-wrap img {
    width: 40px !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.schedule-box input[type="checkbox"][id^="cb"] {
    display: none;
}

.schedule-box :checked + .schedule-box-wrap {
    border-color: #ddd;
}

    .schedule-box :checked + .schedule-box-wrap::before {
        content: "✓";
        background: #35a989;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

.schedule-box .schedule-box-wrap {
    background: #46496a;
    border-radius: 4px;
    color: #fff;
    padding: 20px 15px;
}

    .schedule-box .schedule-box-wrap .cntrl-label {
        font-size: 17px;
        line-height: 22px;
        font-weight: 500;
        color: #f7f135;
    }

    .schedule-box .schedule-box-wrap .label-txt {
        font-size: 15px;
        display: block;
        padding-bottom: 10px;
        text-transform: capitalize;
        font-weight: 500;
        color: #fff;
    }

    .schedule-box .schedule-box-wrap .label-txt-value {
        font-size: 14px;
        color: #fff;
        text-align: justify;
        font-weight: 500;
    }

    .schedule-box .schedule-box-wrap figure {
        padding-bottom: 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .schedule-box .schedule-box-wrap figure .num {
            font-size: 40px;
            line-height: 44px;
            font-family: 'Oswald', sans-serif;
        }

        .schedule-box .schedule-box-wrap figure img {
            width: 50px;
        }

    .schedule-box .schedule-box-wrap figcaption p {
        font-size: 14px;
        line-height: 22px;
    }

    .schedule-box .schedule-box-wrap.active {
        background: #35a989;
    }

.schedule-box label {
    margin: 0;
}

.number-wrap {
    position: relative;
    padding: 20px;
    margin-left: 40px;
    background-color: #d6ddff;
}

.num-box {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #424964;
    color: #fff;
    padding: 14px 7px;
}

    .num-box p {
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
        font-size: 17px;
        font-weight: 500;
        margin: 0;
        position: relative;
    }

    .num-box .number-box {
        position: absolute;
        left: 0;
        padding: 5px 0px;
        background-color: #b6b6b5;
        font-weight: 600;
        bottom: -29px;
        color: #151515;
        width: 34px;
        text-align: center;
    }

.pending-wrap {
    border-right: 5px solid #ff7949;
}

.success-wrap {
    border-right: 5px solid #28c76f;
}

.rejected-wrap {
    border-right: 5px solid #ea5455;
}

.hori-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .hori-form .frm-label {
        width: 330px;
        padding-bottom: 0;
    }

.profile-list li {
    text-transform: capitalize;
    margin-bottom: 10px;
}

    .profile-list li span {
        font-weight: 600;
        margin-right: 10px;
    }

    .profile-list li:last-child {
        margin-bottom: 0;
    }

.note-label {
    background-color: lightblue;
    padding: 8px 30px;
    color: #404040;
    font-weight: 600;
    float: right;
    -webkit-clip-path: polygon(100% 0%, 95% 50%, 100% 100%, 0 100%, 5% 50%, 0 0);
    clip-path: polygon(100% 0%, 95% 50%, 100% 100%, 0 100%, 5% 50%, 0 0);
}

.checkbox-wrap {
    border: 1px solid #dddd;
    padding: 22px;
}

    .checkbox-wrap .checkbox-list li {
        margin-bottom: 15px;
    }

        .checkbox-wrap .checkbox-list li:last-child {
            margin-bottom: 0;
        }

.form-group {
    display: block;
}

    .form-group input {
        padding: 0;
        height: initial;
        width: initial;
        margin-bottom: 0;
        display: none;
        cursor: pointer;
    }

    .form-group label {
        position: relative;
        cursor: pointer;
        color: #6e6b7b;
    }

        .form-group label:before {
            content: '';
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background-color: transparent;
            border: 2px solid #01afae;
            -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
            padding: 10px;
            display: inline-block;
            position: relative;
            vertical-align: middle;
            cursor: pointer;
            margin-right: 20px;
            top: -2px;
        }

    .form-group input:checked + label:after {
        content: '';
        display: block;
        position: absolute;
        top: 1px;
        left: 9px;
        width: 6px;
        height: 14px;
        border: solid #01afae;
        border-width: 0 2px 2px 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

.noti-wrap label {
    font-weight: 600;
}

    .noti-wrap label span {
        font-weight: 400;
    }

.tab-wrap {
    position: relative;
}

.wrap-content {
    margin-left: 33px;
}

    .wrap-content .num-box {
        position: absolute;
        top: 0;
        left: 0;
        background-color: #424964;
        color: #fff;
        padding: 14px 4px;
    }

        .wrap-content .num-box p {
            -webkit-writing-mode: vertical-rl;
            -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
            -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
            font-size: 17px;
            font-weight: 600;
            margin: 0;
            position: relative;
        }

    .wrap-content .nav-tabs {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .wrap-content .header-tab-box label {
        font-weight: 500;
    }

    .wrap-content #progressbar {
        margin-bottom: 0px;
        overflow: hidden;
        color: lightgrey;
    }

        .wrap-content #progressbar .active {
            color: #2F8D46;
        }

        .wrap-content #progressbar .in-progress {
            color: #b48134;
        }

        .wrap-content #progressbar li {
            list-style-type: none;
            font-size: 15px;
            width: 20%;
            float: left;
            position: relative;
            font-weight: 400;
        }

        .wrap-content #progressbar #step1:before {
            content: "";
        }

        .wrap-content #progressbar #step2:before {
            content: "";
        }

        .wrap-content #progressbar #step3:before {
            content: "";
        }

        .wrap-content #progressbar #step4:before {
            content: "";
        }

        .wrap-content #progressbar #step5:before {
            content: "";
        }

        .wrap-content #progressbar li:before {
            line-height: 45px;
            display: block;
            font-size: 20px;
            color: #ffffff;
            background: lightgray;
            padding: 2px;
        }

        .wrap-content #progressbar li:after {
            content: '';
            width: 100%;
            height: 2px;
            background: lightgray;
            position: absolute;
            left: 0;
            top: 25px;
            z-index: -1;
        }

        .wrap-content #progressbar li.Y:before,
        .wrap-content #progressbar li.Y:after {
            background: #2F8D46;
        }

        .wrap-content #progressbar li.N:before,
        .wrap-content #progressbar li.N:after {
            background: #f29623;
        }

    .wrap-content .progress {
        height: 20px;
    }

    .wrap-content .progress-bar {
        background-color: #b2d135 !important;
    }

    .wrap-content .tab-header-txt {
        margin-bottom: 6px;
    }

    .wrap-content .header-tab-box label span {
        font-weight: 400;
    }

    .wrap-content .pr-0 {
        padding-right: 0;
    }

    .wrap-content .header-tab-box {
        padding: 5px 0px;
        /* background-color: #63b0f4; */
        background-color: #788793;
        /* background-color: #008fd9; */
        color: #fff;
    }

    .wrap-content .body-tab-box {
        padding: 30px 20px;
        border: 1px solid #9e9e9e;
    }

    .wrap-content .main-bg {
        background-color: #d3d3d3 !important;
    }

        .wrap-content .main-bg.active {
            background-color: #46496a !important;
            color: #fff !important;
        }

    .wrap-content .pill_nav .nav-tabs a {
        -webkit-clip-path: polygon(90% 0, 100% 50%, 90% 100%, 0% 100%, 11% 50%, 0% 0%);
        clip-path: polygon(90% 0, 100% 50%, 90% 100%, 0% 100%, 11% 50%, 0% 0%);
        padding: 12px 27px;
        font-size: 16px;
        line-height: 22px;
        color: #151515;
        font-weight: 500;
        border: none;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .wrap-content .form-box ul li, .wrap-content .form-box2 ul li, .wrap-content .form-box3 ul li, .wrap-content .form-box4 ul li, .wrap-content .form-box5 ul li, .wrap-content .form-box6 ul li, .wrap-content .form-box7 ul li {
        font-size: 15px;
        padding: 8px 10px;
        border-bottom: 1px solid #959595;
        background-color: #ececec;
    }

        .wrap-content .form-box ul li:nth-child(1) {
            background-color: #6e6e6e;
            color: #fff;
            font-weight: 500;
        }

        .wrap-content .form-box ul li:last-child {
            border-bottom: none;
        }

    .wrap-content .form-box ul, .wrap-content .form-box2 ul, .wrap-content .form-box3 ul, .wrap-content .form-box4 ul, .wrap-content .form-box5 ul, .wrap-content .form-box6 ul, .wrap-content .form-box7 ul {
        border: 1px solid #959595;
        font-weight: 500;
        color: #626262;
    }

        .wrap-content .form-box ul li span, .wrap-content .form-box2 ul li span, .wrap-content .form-box3 ul li span, .wrap-content .form-box4 ul li span, .wrap-content .form-box5 ul li span, .wrap-content .form-box6 ul li span, .wrap-content .form-box7 ul li span {
            float: right;
        }

.colp-pnl-hdr {
    font-weight: 600;
    color: #6e6b7b;
}

.last-dropdown-menu {
    left: -156px;
}

.border-label {
    display: inline-block;
    border-bottom: 2px solid #ddd;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.border-label-val {
    display: block;
    text-align: center;
}

.priority-wrap .priority-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px solid #ddd;
    padding: 10px;
    width: 300px;
    margin: auto;
}

    .priority-wrap .priority-list .high-prior {
        color: #ff2a2a;
    }

    .priority-wrap .priority-list .medium-prior {
        color: #fe8239;
    }

    .priority-wrap .priority-list .low-prior {
        color: #25bfb1;
    }

    .priority-wrap .priority-list li {
        text-transform: capitalize;
        font-weight: 600;
        color: #6e6b7b;
        margin-right: 10px;
    }

        .priority-wrap .priority-list li span {
            font-weight: 500;
            margin-left: 5px;
            color: #6e6b7b;
        }

/*.fund-box */
.fund-box .form-group {
    display: inline-block;
}

    .fund-box .form-group label::before {
        margin-right: 10px;
    }

.workflow-wrap {
    /*background-color: #a578e1;*/
    padding: 10px;
    background: linear-gradient(87deg, #5e72e4, #825ee4);
    border-radius: 3px;
}

    .workflow-wrap .frm-label, .workflow-wrap .frm-label-val {
        color: #fff;
    }

.indicator-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

    .indicator-wrap .indi-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .indicator-wrap .indi-list li {
            position: relative;
            text-transform: capitalize;
            font-weight: 500;
            color: #6e6b7b;
        }

            .indicator-wrap .indi-list li:nth-child(1) {
                margin-right: 30px;
            }

    .indicator-wrap .sel-indi::before {
        position: absolute;
        content: "";
        background-color: #35a989;
        height: 10px;
        width: 10px;
        border-radius: 50%;
        left: -15px;
        top: 6px;
    }

    .indicator-wrap .not-sel-indi::before {
        position: absolute;
        content: "";
        background-color: #46496a;
        height: 10px;
        width: 10px;
        border-radius: 50%;
        left: -15px;
        top: 6px;
    }

.show-read-more .more-text {
    display: none;
}

.read-more {
    color: dodgerblue;
    font-weight: bold;
}

    .read-more:hover {
        color: dodgerblue;
        font-weight: bold;
    }

.dropdown-item {
    padding: 8px 10px !important;
}

.logo-container img {
    max-width: 60px;
}

.main_panel .header-bg {
    background: #ddd;
    padding: 7px 10px;
}

.main_panel table thead tr th {
    text-align: left !important;
}

.main_panel table tbody tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
    font-size: 12.5px;
}

    .main_panel table tbody tr td {
        text-align: left !important;
        font-size: 12.5px;
    }

.main_panel .main-sec-mobile {
    display: none;
}

.main_panel .media img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}
/*body {
    font-family: Arial, sans-serif;
}*/

.offcanvas {
    z-index: 999999;
    position: fixed;
    top: 0;
    overflow: auto;
    height: 100vh;
    padding: 20px;
    transition: all 0.3s ease;
    transform: translateX(100%);
    box-shadow: none;
    background: #fff;
    color: #6e6b7b;
    width: 300px;
    overflow-x: hidden;
    visibility: hidden;
}

.offcanvas-leftside {
    left: 0;
    transform: translateX(-100%);
}

.offcanvas.offcanvas-open {
    transform: translateX(0);
    visibility: visible;
}

.offcanvas-overlay {
    position: fixed;
    z-index: 999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    background-color: rgba(0, 0, 0, 0.5);
}

    .offcanvas-overlay.active {
        display: block;
    }

.offcanvas-header {
    display: flex;
    justify-content: flex-end;
}

.offcanvas-close {
    font-size: 24px;
    background: none;
    border: none;
    cursor: pointer;
}

.offcanvas-menu ul {
    list-style: none;
    padding: 0;
}

.offcanvas-menu li {
    padding: 10px 0;
}

    .offcanvas-menu li a {
        text-decoration: none;
        color: #6e6b7b;
    }

.main_panel .header-body-bg {
    padding: 12px 10px;
    /* background-color: #67696c; */
    /* background-color: #5c5d5e; */
    /* background-color: #fef4db; */
    /* background-color: rgb(37,40,43); */
    background: #FFF;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

    .main_panel .header-body-bg .collapse-card-header {
        background-color: #fff;
        font-weight: 400;
        padding: 10px 20px;
        color: #333;
    }

    .main_panel .header-body-bg .collapse-card-body {
        background-color: #fff;
        padding: 10px 20px;
        border-top: 1px solid #a7a7a7;
    }

    .main_panel .header-body-bg .media {
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        -ms-flex-align: start;
        -webkit-box-align: start;
        align-items: flex-start;
    }

        .main_panel .header-body-bg .media .media-body {
            margin-left: 15px;
        }

    .main_panel .header-body-bg label {
        color: #000;
        font-size: 14px;
        font-weight: 600;
    }

        .main_panel .header-body-bg label span {
            color: #000;
            font-weight: 400;
        }

    .main_panel .header-body-bg .more_btn {
        padding: 3px 17px 4px;
        border-radius: 40px;
        margin-top: 10px;
        border: 2px solid #fff;
        color: #151515;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        cursor: pointer;
        background-color: #fff;
        font-weight: 500;
        display: block;
        border: 1px solid #ddd;
    }

    .main_panel .header-body-bg .media-body h5 {
        color: #000;
        font-size: 20px;
        text-transform: capitalize;
        padding-bottom: 5px;
    }

        .main_panel .header-body-bg .media-body h5 a {
            color: #000;
        }

    .main_panel .header-body-bg .media-body h3 {
        /* font-weight: 500; */
        font-size: 14px;
        color: #fff;
        font-style: italic;
        font-weight: 400;
    }

.main_panel label {
    font-size: 14px;
    color: #151515;
    font-weight: 600;
}

.expandAllBtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-bottom: 15px;
}

.accordion .card {
    margin-bottom: 20px;
    border: none;
}

    .accordion .card .card-header {
        background: #c5ccec;
        padding: 15px 20px;
        font-weight: 600;
        color: #1c1c1c;
        border: 1px solid #cfd7df;
        font-weight: 500;
    }

    .accordion .card .card-body {
        padding: 15px 20px;
        border: 1px solid #ddd;
        background-color: #f2f2f2;
    }

        .accordion .card .card-body h5 {
            color: #151515;
            font-weight: 600;
        }

        .accordion .card .card-body .frm-label {
            color: #000 !important;
            font-size: 14px;
            font-weight: 600;
        }

        .accordion .card .card-body .frm-label-val {
            font-size: 14px;
            color: #151515;
            font-weight: 500 !important;
        }

.toggle_icon {
    position: absolute;
    right: 20px;
    top: 13px;
    height: 27px;
    width: 27px;
    font-size: 18px !important;
    background: #fff;
    line-height: 25px !important;
    text-align: center;
    color: black !important;
    border: 1px solid #ddd;
    border-radius: 50%;
    font-weight: 600 !important;
}

.fa-minus::before {
    content: '\f106' !important;
}

.edit-btn {
    position: absolute;
    right: 55px;
    top: 13px;
    height: 27px;
    width: 27px;
    font-size: 15px !important;
    background: #fff;
    line-height: 21px !important;
    text-align: center;
    color: black !important;
    border: 1px solid #ddd;
    border-radius: 50%;
    font-weight: 600 !important;
}

.highlight-btn {
    color: #0984e3;
}

.accordion-body {
    padding: 0;
}

.past-due {
    padding: 10px 5px;
    border-radius: 6px;
    background: #ffd597;
    display: inline;
    font-size: 11px;
    font-weight: 600;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}

    .past-due p {
        display: inline;
        margin-left: 5px;
    }

.read-more-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    color: #111;
}

table {
    text-align: center;
}

#constituent-details-view thead tr th:nth-child(3) {
    width: 20%; /* Adjust width as needed */
}

.action-table tbody tr td, th {
    border: 1px solid #8d8d8d;
}

.highlight-btn {
    color: #0984e3;
}

.accordion-body {
    padding: 0;
}

.expand-btn {
    color: #000;
    background-color: #94DAFF;
    border: 1px solid #94DAFF;
}

.collapse-btn {
    color: #fff;
    background-color: #00a1e4;
    border: 1px solid #94DAFF;
}

/* Full screen modal menu indicators */
a.has-sub:after {
    font-family: "FontAwesome";
}

a.has-sub:after {
    content: "\f107";
    margin-left: 1rem;
}

a.has-sub[aria-expanded="true"]:after {
    content: "\f106";
}

.left-tab-heading {
    color: #000;
    background-color: #94DAFF;
    border: 1px solid #94DAFF;
    padding: 10px 2px;
    margin: 2px 0 5px 0;
    border-radius: 6px;
}

    .left-tab-heading:hover {
        color: #fff;
        background-color: #00a1e4;
        border: 1px solid #94DAFF;
    }

    .left-tab-heading:focus {
        color: #fff;
        background-color: #00a1e4;
        border: 1px solid #94DAFF;
    }

.custom-pri-btn {
    border-color: #82868b;
    background-color: #82868b;
}

    .custom-pri-btn:hover {
        border-color: #82DBD8;
        background-color: #3BACB6;
        -webkit-transition: 0.5s all ease;
        transition: 0.5s all ease;
    }

    .custom-pri-btn:focus {
        border-color: #82DBD8;
        background-color: #3BACB6;
    }

.custom-pri-dan-btn {
    border-color: #82868b;
    background-color: #82868b;
}

.custom-excla-btn {
    border-color: #82868b;
    background-color: #82868b;
}

    .custom-excla-btn:hover {
        border-color: #ffd597;
        background-color: #ffd597;
    }

    .custom-excla-btn:focus {
        border-color: #ffd597;
        background-color: #ffd597;
    }

.list-pannel {
    margin: 0 auto;
    border-radius: 6px;
    padding: 10px 15px;
    background-color: darkslategrey
}


.list-pannels .box-cont {
    width: 100%;
    margin: 20px auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .list-pannels .box-cont .box {
        height: 250px;
        width: 350px;
        border: dashed 2px #008ff8;
        padding: 30px;
    }

        .list-pannels .box-cont .box img {
            width: 100px;
            height: 100px;
            margin-bottom: 10px;
        }

    .list-pannels .box-cont .box-1 {
        margin-right: 20px;
    }

    .list-pannels .box-cont .box-2 {
        margin-left: 20px;
    }

.no-data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .no-data img {
        width: 50px !important;
        -webkit-transform: translate(60%, 0%);
        transform: translate(60%, 0%);
    }

    .no-data p {
        text-align: center;
    }

.copy-txt {
    position: relative;
}

    .copy-txt .icn {
        position: absolute;
        top: 0;
        right: 0;
        padding: 11px 10px;
        background: #209cf4;
        color: #fff;
    }

.add-summary-note-sec {
    padding: 7px;
}

@media screen and (max-width: 768px) {
    .layout-body .list-sec-cont .constituent-contrl-1 {
        display: block;
        padding: 10px;
    }

    .layout-body .constituent-contrl-1 {
        display: block;
        padding: 10px;
    }

    .ul.d-flex {
        flex-direction: column;
    }

        .ul.d-flex button {
            width: 100%;
            margin-bottom: 10px;
        }

        .ul.d-flex .me-3 {
            width: 100%;
            margin-bottom: 10px;
        }

    .row {
        flex-direction: column;
    }

        .row .col-3 {
            width: 100%;
            margin-bottom: 10px;
        }

    .ul.d-flex .custom-btn,
    .ul.d-flex .excel-btn {
        width: 100%;
        margin-bottom: 10px;
    }

    .custom-btn.excel-btn {
        background-color: #007bff;
        color: white;
        border: none;
        padding: 5px 10px;
        cursor: pointer;
        margin-right: 10px;
        margin-top: 10px; /* Ensure proper spacing */
    }

        .custom-btn.excel-btn:hover {
            background-color: #0056b3;
        }

    #btnFilterSearch, #btnFilterReset {
        width: 100%;
        margin-bottom: 10px;
    }

    Adjust input heights for mobile
    .form-control {
        height: auto;
    }

    .col-3 input, .col-3 select {
        width: 100%;
        margin-bottom: 10px;
    }


    /* Active state for buttons */

}


/*.list-pannel {
    background-color: rgba(31, 122, 88, 0.1);   
    backdrop-filter: blur(5px);  
    padding: 20px;  
    margin: 0;  
    height: 100vh;  
    overflow: auto;  
}*/



thead th {
    padding: 10px !important;
    color: white !important;
    background-color: #2196F3 !important; /* Solid blue color */
    /*background: linear-gradient(135deg, #2196F3, #0D47A1) !important;*/
   /* text-align: left;*/
}

@media screen and (max-width: 768px) {
    html, body {
        overflow: auto; /* Allow scrolling for the entire page */
    }

    .profile-info-wrap {
        overflow: auto; /* Hide overflow for the profile info */
    }

    .profile-img-wrap {
        position: fixed;
        top: 5px;
        right: 20px;
    }
}
/*# sourceMappingURL=style.css.map */
.buttonfiltter {
    background: #009cf8e3;
    width: 204px;
    border-radius: 12px;
    height: 40px;
    margin-bottom: 15px;
    color: white;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .buttonfiltter.active {
        background-color: #0056b3 !important; /* Adjust the color as needed */
        color: #fff !important;
    }

@media (max-width: 768px) {
    /* Adjust modal content alignment for small screens */
    .modal-content {
        text-align: left;
    }

    .media {
        flex-direction: column;
        align-items: flex-start;
    }

        .media img {
            margin-bottom: 10px;
        }

    .profile-drpdwm {
        width: 100%;
    }

    .dropdown-iteam {
        width: 100%;
        text-align: left;
    }
}

/* Styles for small screens */
@media (max-width: 768px) {
    /* Adjust modal padding */
    .modal-content {
        padding: 10px;
    }

    /* Adjust header padding */
    .modal-header {
        padding: 10px 10px;
    }

    /* Adjust body padding */
    .modal-body {
        padding: 10px;
    }

    /* Make action tabs full width */
    .action-tab {
        width: 100%;
    }

    /* Stack tabs horizontally */
    .nav-pills {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }

        /* Adjust tab button styles */
        .nav-pills .left-tab-heading {
            flex: 1;
            text-align: center;
            padding: 5px 0;
            font-size: 14px;
        }

    /* Make tab content full width */
    .tab-content {
        width: 100%;
    }

    /* Adjust form field styles */
    .form-control {
        margin-bottom: 10px;
    }

    /* Adjust row and column margins */
    .row {
        margin: 0;
    }

    .col-md-4, .col-6 {
        width: 100%;
        padding: 0 5px;
        margin-bottom: 10px;
    }

    /* Adjust label and input field spacing */
    .frm-label {
        font-size: 14px;
        margin-bottom: 5px;
    }

    .form-control {
        padding: 5px;
        font-size: 14px;
    }

    /* Adjust button sizes and spacing */
    .right-submit-btn {
        width: 100%;
        padding: 10px;
        margin-bottom: 10px;
    }

    /* Stack buttons vertically */
    .row.mt-4 > .col-md-2,
    .row.mt-4 > .col-md-1,
    .row > .col-md-3 {
        width: 100%;
        margin-bottom: 10px;
        padding: 0 5px;
    }

    .row .col-md-2.col-4,
    .row .col-md-1.col-4 {
        width: 100%;
        margin-bottom: 10px;
        padding: 0 5px;
    }



    .row.mt-4 {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .right-div-cntrl {
        width: 100%;
        margin-bottom: 10px;
        padding: 0 5px;
    }

    .form-control-2 {
        width: 100%;
    }

    .row {
        display: flex;
        flex-direction: column;
        align-items: center;
    }





    .right-div-cntrl .row {
        flex-direction: column;
        align-items: center;
    }


    .right-div-cntrl .col-md-2,
    .right-div-cntrl .col-md-3 {
        width: auto;
        margin-bottom: 10px;
        text-align: center;
    }


        .right-div-cntrl .col-md-2 li,
        .right-div-cntrl .col-md-3 li {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

            /* Maintain button width and ensure they are centered */
            .right-div-cntrl .col-md-2 li button,
            .right-div-cntrl .col-md-3 li button {
                width: auto;
            }

            /* Adjust label margins for better spacing */
            .right-div-cntrl .col-md-2 li label,
            .right-div-cntrl .col-md-3 li label {
                margin-top: 5px;
            }

    .col-md-2.col-6 {
        width: 100%;
        padding: 0;
    }

        .col-md-2.col-6 button {
            width: 100%;
            margin-bottom: 10px; /* Add spacing between buttons */
        }

    #cancelButton, #cancelButton2, #btnCancel {
        width: 100%;
        margin-top: 5px; /* Optional: Add some margin-top for spacing */
    }

    .custom-scrch-bx,
    .col-md-11.pe-0.col-10,
    #TXT_AddGiftConstiDDL {
        width: 100%;
    }

    #Btn_Add_New_MOUData,
    #Btn_Update_New_MOUData,
    #btnSaveProjectData,
    #btnUpdateProjectData,
    .modal-footer .btn-danger {
        width: 100%;
        margin-bottom: 5px; /* Add some space between buttons */
    }

    .modal-footer .custom-danger-btn {
        width: 100%;
        margin-bottom: 5px; /* Add some space between buttons */
    }
}

@media (max-width: 768px) {
    .topnav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px;
    }

        .topnav button {
            flex: 1 1 45%; /* flex-grow, flex-shrink, flex-basis */
            height: auto;
            margin-bottom: 5px;
        }

        .topnav #getemaildata {
            margin-right: 35%;
        }

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

    #txtEmailSender, #txtEmailSubject {
        width: 100% !important; /* Increase the width to 100% */
        height: auto; /* Adjust height if necessary */
    }

    .col-md-1 {
        width: 100%;
    }

    .col-md-10 {
        width: 100%;
    }

    .row > .col-md-1 {
        display: flex;
        align-items: center;
    }

    .layout-body .tab-content .email-sec-tabs .row .col-md-12 .row {
        margin-left: 0 !important;
    }

    .layout-body .tab-content .email-sec-tabs .row .col-md-12 .col-md-2 p {
        text-align: left;
        margin-left: 10px;
    }

    .layout-body .tab-content .email-sec-tabs .row .col-md-12 #editor {
        width: 110%;
        margin-left: -5%;
        margin-right: -5%;
    }

    .layout-body .tab-content .email-sec-tabs .row .col-md-12 .col-md-2 .custom-btn {
        width: 100%;
    }

    #role_modal .modal-xl {
        width: 50% !important;
    }

    #role_modal .modal-body {
        padding: 0 !important;
    }

    #role_modal .modal-xl .modal-content .modal-body .row .col-md-6 .form-control {
        width: 100% !important;
    }

    #role_modal .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    .layout-body .container-fluid .card-wrap.main_panel.shadow-main .all-wrap .custom-btn {
        width: 49%;
    }

    .layout-body .container-fluid .all-wrap .position #Display_Data {
        overflow-x: auto;
    }

    #btnsubmit_user {
        width: 100%;
    }

    #master_modal_institute .modal-xl {
        width: 50% !important;
    }

    #master_modal_institute .modal-body {
        padding: 0 !important;
    }

    #master_modal_institute .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_institute .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_institute .modal-xl {
        width: 50% !important;
    }

    #master_modal_institute .modal-body {
        padding: 0 !important;
    }

    #master_modal_institute .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_institute .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Specialization .modal-xl {
        width: 50% !important;
    }

    #master_modal_Specialization .modal-body {
        padding: 0 !important;
    }

    #master_modal_Specialization .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Specialization .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Department .modal-xl {
        width: 50% !important;
    }

    #master_modal_Department .modal-body {
        padding: 0 !important;
    }

    #master_modal_Department .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Department .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Hostel .modal-xl {
        width: 50% !important;
    }

    #master_modal_Hostel .modal-body {
        padding: 0 !important;
    }

    #master_modal_Hostel .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Hostel .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Chapter .modal-xl {
        width: 50% !important;
    }

    #master_modal_Chapter .modal-body {
        padding: 0 !important;
    }

    #master_modal_Chapter .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Chapter .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_ProspectClass .modal-xl {
        width: 50% !important;
    }

    #master_modal_ProspectClass .modal-body {
        padding: 0 !important;
    }

    #master_modal_ProspectClass .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_ProspectClass .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_MainCause .modal-xl {
        width: 50% !important;
    }

    #master_modal_MainCause .modal-body {
        padding: 0 !important;
    }

    #master_modal_MainCause .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_MainCause .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_SubCause .modal-xl {
        width: 50% !important;
    }

    #master_modal_SubCause .modal-body {
        padding: 0 !important;
    }

    #master_modal_SubCause .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_SubCause .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Cause .modal-xl {
        width: 50% !important;
    }

    #master_modal_Cause .modal-body {
        padding: 0 !important;
    }

    #master_modal_Cause .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Cause .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_Degree .modal-xl {
        width: 50% !important;
    }

    #master_modal_Degree .modal-body {
        padding: 0 !important;
    }

    #master_modal_Degree .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_Degree .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_MouType .modal-xl {
        width: 50% !important;
    }

    #master_modal_MouType .modal-body {
        padding: 0 !important;
    }

    #master_modal_MouType .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_MouType .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    #master_modal_CustomField .modal-xl {
        width: 50% !important;
    }

    #master_modal_CustomField .modal-body {
        padding: 0 !important;
    }

    #master_modal_CustomField .modal-xl .modal-content .modal-body .row .col-md-12 .form-control {
        width: 100% !important;
    }

    #master_modal_CustomField .modal-xl .modal-content .row button {
        width: 100% !important;
    }

    .d-flex {
        flex-direction: column;
    }

        .d-flex button {
            width: 100%;
            margin-bottom: 10px;
        }

    #project-mobal .modal-xl .modal-content .modal-body .custom-btn {
        width: 100%;
    }

    #project-mobal .modal-xl .modal-footer .custom-btn {
        width: 100%;
    }

    .custom-excla-btn {
        width: 100%; /* Make the button full width on smaller screens */
        font-size: 14px; /* Reduce the font size */
        padding: 6px 3px; /* Reduce padding */
        white-space: normal; /* Allow text to wrap */
        justify-content: end;
    }

    #project-mobal .modal-body {
        overflow: visible;
    }


        /* Alternatively, if you want to center the button itself */
        #project-mobal .modal-body .row .btn {
            margin-left: auto;
            margin-right: auto;
            display: block; /* Center the button */
            width: 80%; /* Adjust as needed */
        }
}


/* Ensure the form elements stack nicely on smaller screens */
@media (max-width: 768px) {
    .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 .main_panel {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
    }

    .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 {
        width: 100% !important; /* Full width for small screens */
        display: block !important; /* Ensure block display for stacking */
    }

        .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 label {
            margin-bottom: 5px !important;
        }

        .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 select,
        .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 input[type="text"],
        .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .col-md-3 input[type="file"] {
            width: 100% !important;
        }

    .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .custom-btn {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .d-flex {
        flex-direction: column !important;
        gap: 10px !important;
    }


        .layout-body .container-fluid .list-sec-cont-import .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-import .main_panel .d-flex .ms-2 {
            margin-left: 0 !important;
            margin-top: 10px !important;
        }

    .layout-body .container-fluid .list-sec-cont-pledge .col-md-12 .card-wrap .card-wrap-body .all-wrap .list-pannel-pledge .main_panel .col-md-3 {
        width: 100% !important; /* Full width for small screens */
        display: block !important; /* Ensure block display for stacking */
    }

    .layout-body .container-fluid .list-sec-cont .col-md-12 .card-wrap .card-wrap-body .all-wrap .card tab-panel .row .col-md-12 .tab-content .tab-pane .list-pannel .ul .buttonfiltter1,
    #downloadConstituteExcel, #downloadGiftExcel, #btnFilterRecordCount, #downloadMouExcel, #downloadProjectExcel, #downloadOpportunitiesExcel, #downloadActionExcel {
        width: 100% !important; /* Make buttons take full width */
        margin-left: 0 !important; /* Remove left margin */
        margin-bottom: 10px !important; /* Add space between buttons */
        font-size: 11px; /* Adjust font size for better fit */
    }

    #btnFilterSearchGift, #btnMouFilterSearch, #btnProjectFilterSearch, #btnOpportunitiesFilterSearch, #btnActionFilterSearch {
        width: 100%;
        margin-bottom: 6px;
    }

    .btn-full-width {
        display: block !important;
        width: 100% !important;
        margin-bottom: 10px !important; /* Optional: Add some spacing between buttons */
    }

    #endownment-mobal .modal-xl .modal-content .modal-body .row button {
        width: 48% !important;
        margin-left: 0 !important;
        margin-right: 4% !important;
    }

    #utilizationdata_Endownment, .col-12 {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        margin-left: -40% !important;
    }
}

[class*="read-more"] {
    color: dodgerblue;
    font-weight: bold;
    cursor: pointer;
}

    [class*="read-more"]:hover {
        color: dodgerblue;
        font-weight: bold;
        text-decoration: underline;
    }


table {
    border: 2px solid black !important; /* Black border for the entire table */
    border-collapse: collapse !important; /* Ensures there are no gaps between cells and border */
    width: 100%; /* Optional: make the table span 100% of its container */
}

th, td {
    border: 1px solid black !important; /* Optional: add black border for individual cells */
    padding: 8px !important; /* Add padding for better readability */
    text-align: left !important; /* Align text to the left */
}

.red-border-row td:hover::after {
    content: 'This row has overdue tasks.';
    position: absolute;
    top: -30px;
    left: 0;
    background-color: red;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.9em;
    white-space: nowrap;
    z-index: 10;
}

.red-border-row {
    background-color: rgba(255, 0, 0, 0.1) !important; /* Light red */
}

    .red-border-row td {
        border: 2px solid red !important;
        box-shadow: 0 0 5px red !important;
    }

.border-row {
    border: 1px solid #a9a9a9 !important;
}

#_btnLoginUser {
    cursor: pointer;
}

.loader-containers {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Advanced Loader Design */
.advanced-loaders {
    position: relative;
    width: 60px;
    height: 60px;
}

    .advanced-loaders .circle {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 8px solid transparent;
        border-top: 8px solid #007bff; /* Blue arc */
        border-radius: 50%;
        animation: rotate 1.5s cubic-bezier(0.6, 0.04, 0.98, 0.335) infinite;
    }

        /* Second circle for layered effect */
        .advanced-loaders .circle:nth-child(2) {
            border-top-color: #00bcd4; /* Cyan arc */
            animation-delay: -0.75s; /* Offset for smooth animation */
            transform: scale(0.9);
        }

        /* Third circle with subtle fade effect */
        .advanced-loaders .circle:nth-child(3) {
            border-top-color: #6f42c1; /* Purple arc */
            animation-delay: -1s;
            transform: scale(0.8);
            opacity: 0.7;
        }

/* Rotation animation */
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(180deg);
    }

    100% {
        transform: rotate(360deg);
    }
}