@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

:root {
    --header-height: 3rem;
    --nav-width: 60px;
    --first-color-light: #3EB35C;
    --first-color-dark: #001689;
    --white-color: #ffffff;
    --body-font: "Poppins", serif;
    --normal-font-size: 1rem;
    --z-fixed: 100;
    --input-background: #f9f9f9;
}

* {
    box-sizing: border-box;
}

*,
::before,
::after {
    box-sizing: border-box;
}

body,
html {
    height: 100%;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

p {
    font-size: 18px;
}

body {
    font-family: "Poppins", sans-serif;
    background-color: #f3f3f3;
    padding: 0;
    margin: 0;
}

.bg-light {
    background-color: #ffffff;
}

a {
    text-decoration: none;
    color: #686767;
    cursor: pointer;
}

input {
    background-color: var(--input-background);
}

::-webkit-scrollbar {
    width: 5px;
    height: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #ffffff;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgb(0, 51, 102);
    background: linear-gradient(180deg, rgba(0, 51, 102, 1) 0%, rgba(0, 101, 203, 1) 100%);
    border-radius: 10px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #003366;
    }


/* ========Login Page START======= */
/* =============================== */

.container-bg {
    background: url(../images/login-background.jpg);
    height: 100vh;
    display: flex;
    color: #ffffff;
    justify-content: center;
    align-items: center;
}

.commercial {
    display: flex;
    flex-direction: column;
    width: 50%;
    transform: translate(160px, 0px);
}

.container-login img {
    width: 25%;
    margin: 25px;
    z-index: 1;
}

.container-bg h1 {
    color: #3EB35C;
}

.container-bg .commercial-service {
    width: 90%;
}

.container-login {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 35%;
}

.login-icon img {
    width: 35%;
}

.main-login {
    padding: 3rem;
    border-radius: 35px;
    border: none;
    box-shadow: 0px 0px 25px 0px #00178938;
    transform: translate(195px, 0);
}

    .main-login p {
        margin-bottom: 50px;
    }

.login-type {
    width: 100%;
    border: 1px solid black;
    display: flex;
    position: relative;
}

.login-icon {
    height: 40px;
    width: 4rem;
    background: #001689;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    border-radius: 5px;
}

.login-type input {
    display: block;
    width: 100%;
    padding: 0.375rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: none;
    appearance: none;
    outline: none;
    border-radius: 5px;
}

.login-type {
    width: 100%;
    border: 1px solid #c5c5c5;
    display: flex;
    border-radius: 5px;
}

.forgot-pass {
    display: flex;
    justify-content: flex-end;
}

.submit {
    width: 100%;
    height: 3rem;
    border: none;
    color: #fff;
    background: #001689;
    border-radius: 5px;
    font-size: 20px;
    padding: 0;
}

.toggle-password {
    display: flex;
    align-items: center;
    margin-right: 0;
    position: absolute;
    right: 10px;
    top: 12px;
}

.dropdown-placeholder {
    color: #CECECE !important;
}

/* ========Login Page END======= */
/* =============================== */

/* ======================= DASHBOARD START ====================== */
/* ================================================================ */

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}

::placeholder {
    color: #ccc !important;
    font-weight: 300;
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #ccc !important;
    font-weight: 300;
}

:-ms-input-placeholder {
    color: #ccc !important;
    font-weight: 300;
}

.dollerInputProfit {
    position: absolute;
    top: 8px;
    left: 10px;
}

.Select-Job-Status-div {
    gap: 10px;
}

    .Select-Job-Status-div .btn-danger {
        height: 40px;
        width: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

input {
    height: 40px !important;
    border: 1px solid #ddd;
    border-radius: 18px !important;
    background: #fff;
    padding: 10px 12px;
    font-weight: 300 !important;
}

.form-control:disabled,
.form-control[readonly] {
    background-color: #f6f7fb;
}

/*button.btn {
    border-radius: 2px !important;
    box-shadow: none !important;
}*/

button.btn.btn-primary {
    background-color: #0e9aee !important;
}

    button.btn.btn-primary:hover {
        background-color: #0879c8 !important;
    }

.menu-list {
    margin-top: 40px !important;
}

.table > :not(:last-child) > :last-child > * {
    font-weight: 500;
    font-size: 15px;
    border-bottom-color: currentColor;
}

#left-menu {
    position: fixed;
    top: 0;
    left: 0;
    background: rgb(0, 51, 102);
    background: linear-gradient(180deg, rgba(0, 51, 102, 1) 0%, rgba(0, 101, 203, 1) 100%);
    width: 280px;
    overflow-y: auto;
    height: 100vh;
    border-right: 1px solid #e6ecf5;
    margin-top: 32px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    overflow-x: hidden;
    z-index: 2;
}

#show-lable {
    opacity: 0;
    visibility: hidden;
    left: 80px;
    font-weight: 300;
    padding: 6px 15px;
    background-color: #001689;
    position: fixed;
    color: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#left-menu.small-left-menu,
#logo.small-left-menu {
    width: 60px;
    text-align: center;
}

#left-menu ul {
    padding: 0;
    margin: 0;
    /*    height: calc(100vh - 150px);
    overflow-y: scroll;
    overflow-x: hidden;*/
}

    #left-menu ul li a:hover,
    #left-menu ul li a.active {
        background: rgb(62, 179, 92);
        background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    }

#left-menu > ul > li {
    margin: 10px 0;
}

#left-menu ul li a {
    color: #ffffff;
    width: 100%;
    display: inline-block;
    width: 280px !important;
    padding: 10px;
    height: 45px;
    display: flex;
    align-items: center;
    font-size: 16px;
    position: relative;
}

    #left-menu ul li a i {
        font-size: 22px;
        text-align: center;
        width: 35px;
        height: 35px;
        display: inline-block;
    }

div#example_length {
    margin-bottom: 5px;
}

#left-menu ul li a span {
    font-weight: 400;
    font-size: 16px;
    padding-left: 18px;
    color: #ffffff;
    /* font-weight: 300; */
}

#left-menu ul li.active a span {
    color: #fff;
}

#left-menu ul li.active a i {
    color: #fff;
}

#left-menu li.has-sub ul {
    background-color: #003e7c;
    margin: 0 -10px;
    padding-left: 45px;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

#left-menu .dropdown-list {
    list-style: disc;
}

    #left-menu .dropdown-list li {
        background: #003e7c;
        list-style-type: disc;
        margin-left: 18px;
    }

        #left-menu .dropdown-list li:hover {
            background: #003e7c;
            color: greenyellow;
        }

        #left-menu .dropdown-list li a:hover {
            background: #003e7c;
            color: greenyellow;
        }

a:hover {
    text-decoration: none;
}

.bar {
    color: #003569;
}

#logo {
    position: fixed;
    top: 0;
    z-index: 2;
    left: 0;
    border-color: #464e62;
    height: 60px;
    width: 280px;
    font-size: 30px;
    line-height: 2em;
    border-right: 1px solid #e6ecf5;
    z-index: 4;
    color: #fff;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    display: flex;
    justify-content: left !important;
    align-items: center !important;
    gap: 43px !important;
}


#header {
    background-color: #fff;
    height: 65px;
    border-bottom: 1px solid #e6ecf5;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 3;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    #header .header-left {
        padding-left: 300px;
        line-height: 10px;
        margin-top: 10px;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        #header .header-left h5 {
            font-size: 16px;
            color: #3EB35C;
        }

        #header .header-left .opened {
            font-size: 13px;
        }

    #header .header-right img {
        margin: 5px;
        border: 1.5px solid #efefef;
        border-radius: 50%;
        object-fit: cover;
        width: 42px;
        height: 42px;
    }

    #header .header-right {
        display: flex;
        padding-right: 40px;
        justify-content: flex-end;
    }

        #header .header-right i,
        #header .header-left i {
            font-size: 20px;
            line-height: 2em;
            padding: 0 5px;
            cursor: pointer;
            color: #001689;
        }

.header-right button {
    border: none;
    background: #ffffff;
    color: #000000;
}

.fixed-footer {
    background: #ffffff;
    padding: 1rem;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 1;
}

#main-content {
    min-height: calc(100vh - 60px);
    clear: both;
}

#page-container {
    padding-left: 300px;
    padding-top: 80px;
    padding-right: 25px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    #page-container.small-left-menu,
    #header .header-left.small-left-menu {
        padding-left: 80px;
    }

.card {
    border: 1px solid #e6ecf5;
    margin-bottom: 1rem;
    font-weight: 300;
    border-radius: 8px;
}

    .card .title {
        padding: 15px 20px;
        border-bottom: 1px solid #e6ecf5;
        margin-bottom: 10px;
        color: #000;
        font-size: 18px;
    }

#left-menu.small-left-menu li.has-sub::after {
    content: '';
}

#left-menu.small-left-menu li.has-sub ul {
    position: fixed;
    width: 280px;
    z-index: 123;
    height: 0;
    left: 69px;
    padding-left: 15px;
}

.dashboard-logo img.company-logo {
    height: 100px;
    display: block;
    /* position: absolute; */
    /* right: 83px; */
    /* top: 7px; */
    transition: all 0.3s ease;
}

.small-left-menu img.company-logo {
    display: none;
}

.dropdown-toggle,
.dropdown-toggle:active,
.dropdown-toggle:hover {
    border: 0;
}

.user_section .dropdown-toggle {
    color: #4d4f5c;
    cursor: pointer;
}

.logout-dropdown::before {
    content: "";
    position: absolute;
    top: -20px;
    right: 15px;
    border: 10px solid;
    border-color: transparent transparent #fff transparent;
}

.logout-dropdown {
    padding: 0;
    box-shadow: 10px 10px 35px rgba(0, 0, 0, 0.125), -10px -10px 35px rgba(0, 0, 0, 0.125);
    /* inset: -18px auto auto 28px !important; */
    /* position: absolute; */
    border: 1px solid #ededed;
    /* top: 58px; */
    transform: translate(45px, 60px) !important;
    /* border: none; */
    /* transform: translate(41px, 76px) !important; */
}

.logout {
    font-size: 15px;
    color: #000000 !important;
    padding: 0.75rem 1rem !important;
}

.pro-drop-li {
    border-bottom: 1px solid #005fbf1f;
}

.logout-btn:focus {
    box-shadow: unset;
}

.logout:hover {
    background: #eff7ff;
    color: #323232;
}

#left-menu .dropdown-list li {
    color: #ffffff;
}

.has-sub .down-arrow {
    width: 5%;
    position: absolute;
    right: 18px;
    cursor: pointer;
    transform: rotate(0deg);
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* <!-- =====Breadcrumb Section Start=========
============================================ --> */
.dashboard-breadcrumb {
    padding: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: #f6f6f6;
    border: none;
}

    .dashboard-breadcrumb .select-breadcrumb {
        color: #2a8d43;
    }

.add-button .button-green {
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    display: block;
    border-radius: 45px;
    border: none;
    color: #ffffff;
    height: 40px;
    padding: 8px 46px;
    text-align: center;
}

.active-breadcrumb a {
    color: #3dba5d;
}

.add-button .button-green:hover {
    background: #2a8d43;
}

.add-button .cancel-button {
    background: rgb(220, 53, 69);
    background: linear-gradient(0deg, rgba(220, 53, 69, 1) 0%, rgba(251, 47, 66, 1) 100%);
    padding: 7px 46px;
    border: 1px solid #dc3545;
    outline: none;
    color: rgb(255, 255, 255);
    /* background: rgb(0, 51, 102); */
    border-radius: 45px !important;
}

    .add-button .cancel-button:hover {
        background: #dc3545;
    }

.add-button .add-member {
    padding: 10px 14px !important;
}

.save-button {
    margin-left: 5px;
}

.page-name h4 {
    margin-bottom: 5px;
    color: #003366;
    font-size: 20px;
}

.page-name p {
    font-size: 16px;
    color: #000;
}

.container .row {
    padding: 5px 3px 10px 3px;
}

#single {
    height: 100%;
    background: url(../images/arrow-black.svg)no-repeat 96% 50%;
    background-color: rgb(255, 255, 255);
    padding: 10px 0 10px 15px;
}

/* #create-invitation svg{
  width: 10%;
} */

/* <!-- =====Breadcrumb Section End=========
============================================ --> */

/* <!-- =====Filter Section Start=========
======================================== --> */
.filter-section input,
.filter-section select {
    border: 1px solid rgb(223, 223, 223);
    height: 2.9rem;
    border-radius: 45px !important;
    padding: 0px 24px;
    background: #ffffff;
    width: 100%;
}

.dollerInputOverHeadPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputCost {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputExtPart {
    position: absolute;
    top: 8px;
    left: 10px;
}

.btn-danger {
    border-radius: 45px;
    color: #ff2424;
    background-color: #ffc1c1;
    border-color: #ffc1c1;
}

.filter-section input:focus {
    outline: #686767;
}

.filter-section select {
    height: 100%;
    background: url(../images/arrow-black.svg)no-repeat 96% 50%;
    background-color: rgb(255, 255, 255);
    padding: 10px 0 10px 15px;
}


.search {
    display: flex;
    /*justify-content: flex-end;*/
}

#single:focus {
    box-shadow: none !important;
    border-color: #dadada;
}

/* <!-- =====Filter Section End=========
======================================= --> */

/* <!-- =====Table Section Start=========
======================================= --> */
/*.table {
    width: 100% !important;
}*/
table.table.table-striped.opportunity-table.dataTable.no-footer {
    overflow-x: auto;
    min-width: 100%;
}

/*.opportunity-table tr td {
    text-align: center;
}*/

/*table.opportunity-table tr th {
    text-align: center;
}*/

.fixwithforusermagagement td {
    width: 14% !important;
}

    .fixwithforusermagagement td:last-child {
        width: 8% !important;
    }

.table-striped thead {
    background: rgb(0, 51, 102);
    background: linear-gradient(180deg, rgba(0, 51, 102, 1) 0%, rgba(0, 70, 140, 1) 100%);
    padding: 12px 10px;
    color: #ffffff;
}

table.dataTable.no-footer {
    white-space: nowrap;
}

.table-wrapper {
    background-color: var(--white-color);
    padding: 30px;
    border-radius: 8px;
    position: relative;
}

.dataTables_length label,
.dataTables_filter label {
    display: inline-flex;
    align-items: center;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0;
    margin-left: 0;
    border: none;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        background: no-repeat;
        border: none;
    }

.table-striped > tbody > tr:nth-of-type(odd) > * {
    box-shadow: none;
}

.table-striped > tbody > tr:hover {
    background-color: #f4f6f9;
}

table.dataTable thead th,
table.dataTable thead td {
    border: none;
}

.table-striped > tbody > tr:nth-of-type(odd) > *,
.table-striped > tbody > tr:nth-of-type(even) > * {
    border-color: #f0f2ff !important;
}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    padding-top: 0;
}

.editQtyCstPrft {
    padding: 2px;
    height: auto !important;
    border: none;
    width: 100px;
    /* background-color: #ccc; */
    border: 1px solid #686767;
    border-radius: 3px !important;
}

table.dataTable thead th,
table.dataTable thead td {
    font-weight: 500;
    font-size: 15px;
    padding: 12px 10px;
}

.dataTables_scroll {
    /* margin-top: 1rem; */
    margin-bottom: 1rem;
}

.dataTables_scroll {
    width: auto !important;
    overflow-x: auto;
    display: block;
}

.active > .page-link,
.page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: #001689;
    border-color: #001689;
}

.delete-listing {
    padding: 0;
    border: none;
    background: #F1F1F1;
    border-radius: 10px;
}

table.dataTable.table-striped > tbody > tr.odd > * {
    box-shadow: inset 0 0 0 9999px rgb(98 98 98 / 5%);
}

.form-check-input:checked {
    background-color: #001689;
    border-color: #001689;
}

div.dataTables_wrapper div.dataTables_filter input {
    border-radius: 45px !important;
    width: 100% !important;
}

.page-item.active .page-link {
    background-color: #003366;
    border-color: #003366;
}

.user-image img {
    margin-right: 10px;
    border-radius: 50%;
}

.user-form {
    border-radius: 10px;
}

table#example,
.dataTables_scrollHeadInner {
    /*   width: 100% !important;*/
    margin: auto;
    /*overflow-x: auto;*/
    white-space: nowrap;
    min-width: 100%;
}

table#example1,
table#example2,
table#example3,
table#example4,
table#example5,
table#example6,
table#example7,
table#example8 {
    /*   width: 100% !important;*/
    margin: auto;
    /*overflow-x: auto;*/
    white-space: nowrap;
    min-width: 100%;
}

/* ===========Active or Inactive Button in table Start=========== */
.active button {
    background-color: #3EB35C;
    border-radius: 5px;
    border: none;
    color: #fff;
    border: 5px;
    padding: 8px 46px;
}

.inactive button {
    border-radius: 30px;
    border: none;
}

.logged a {
    border-radius: 45px;
    background-color: darkgray;
    color: #fff;
    cursor: not-allowed;
}

.table-listing {
    padding-bottom: 2rem !important;
}

/* ===========Active or Inactive Button in table End===========
=========================================================--> */

/* ======================= DASHBOARD END ====================== */
/* ================================================================ */


/* ======================= Add New User Start ====================== */
/* ================================================================ */

.upload-options {
    position: relative;
    height: 75px;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    transition: background-color ease-in-out 150ms;
}

.js--image-preview {
    height: 160px;
    width: 160px;
    border-radius: 100%;
    border: 4px solid #efefef;
    overflow: hidden;
    background-image: url(../images/image-upload-icon.png);
    background-color: white;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
}

i.material-icons {
    transition: color 100ms ease-in-out;
    font-size: 2.25em;
    line-height: 55px;
    color: white;
    display: block;
}

.drop {
    display: block;
    position: absolute;
    border-radius: 100%;
    transform: scale(0);
}

.animate {
    animation: ripple 0.4s linear;
}

.upload-image {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    padding: 20px;
    height: 440px;
    max-height: 440px;
}

/* <!-- ========== Upload porfile image End========= --> */

/* ======================= Add New User End ====================== */
/* ================================================================ */

/* ======================= User Role Start ====================== */
/* ================================================================ */

.add-role {
    padding: 20px;
    height: 100%;
    display: flex;
    border-radius: 10px;
    background: #F6F6F6;
}

.filter-section p {
    font-size: 14px;
    margin-top: 20px;
}

.permission-main {
    display: flex;
    justify-content: space-between;
}

.permission {
    display: flex;
    justify-content: space-between;
}

/* ======================= User Role End ====================== */
/* ================================================================ */


/* ======================= Date Picker ====================== */

input:focus {
    outline: none;
}

#ui-datepicker-div {
    display: none;
    background-color: #fff;
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.1);
    margin-top: 0.25rem;
    border-radius: 0.5rem;
    padding: 0.5rem;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.ui-datepicker-calendar thead th {
    padding: 0.25rem 0;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 400;
    color: #78909C;
}

.ui-datepicker-calendar tbody td {
    width: 2.5rem;
    text-align: center;
    padding: 0;
}

    .ui-datepicker-calendar tbody td a {
        display: block;
        border-radius: 0.25rem;
        line-height: 2rem;
        transition: 0.3s all;
        color: #001689;
        font-size: 0.875rem;
        text-decoration: none;
    }

        .ui-datepicker-calendar tbody td a:hover {
            background-color: #E0F2F1;
        }

        .ui-datepicker-calendar tbody td a.ui-state-active {
            background-color: #3EB35C;
            color: white;
        }

.ui-datepicker-header a.ui-corner-all:hover {
    background-color: #ECEFF1;
}

.ui-datepicker-header a > span {
    display: none;
}

.ui-datepicker-header a > span {
    display: none;
}

.ui-datepicker-title {
    text-align: start;
    line-height: 2rem;
    margin-bottom: 0.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    padding-bottom: 0.25rem;
}

.ui-datepicker-week-col {
    color: #78909C;
    font-weight: 400;
    font-size: 0.75rem;
}

/*.date-picker input {
    background: url(../images/date.svg) no-repeat 96% 50% !important;
}*/

.btn-close:focus {
    box-shadow: none;
}

.modal-footer {
    display: flex;
    justify-content: end;
}

.ui-datepicker-title select.ui-datepicker-month,
.ui-datepicker-title .ui-datepicker-year {
    padding: 3px 5px;
    border: 1px solid #ddd;
    border-radius: 3px;
    color: #000;
    margin-right: 10px;
    font-family: inherit;
    color: #001689;
}

/* ======================= Date Picker ====================== */


/* ======================= Client CRM Start ====================== */
/* ================================================================ */

.active-customer {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    color: #fff;
}

.nav-link {
    color: #000000;
}

    .nav-link:hover {
        color: #000000;
    }


.assign-btn {
    margin-bottom: 20px;
}

    .assign-btn button {
        border: none;
        background: #3eb35c;
        color: #ffffff;
        border-radius: 3px;
    }

        .assign-btn button:hover {
            background: #1E8438
        }


.client-crm {
    padding-bottom: 2rem !important;
}

.multi-field-wrapper {
    border: 1px solid #CFCFCF;
    padding-left: 10px;
    position: relative;
    /*    right: 5px;*/
    /* margin-bottom: 15px; */
    border-radius: 10px;
}

.key-information {
    width: 94%;
}

.add-more-contact {
    border-radius: 10px;
    padding: 0px 0px 20px 0px;
    width: 100%;
}

.create-invitation-btn button {
    border-radius: 5px;
    border: none;
    outline: none;
    color: #ffffff;
    background: #3EB35C;
}

.gap-y-filter {
    gap: 24px 0px;
}

.create-invitation-btn button:hover {
    background: #1E8438;
}

.search-button button {
    border-radius: 5px;
    padding: 0.7rem;
    border: none;
    outline: none;
    color: #ffffff;
    background: #3EB35C;
    margin-top: 10px;
}


.table-form input {
    border: 1px solid rgb(223, 223, 223);
    height: 2.9rem;
    border-radius: 45px !important;
    padding: 0 19px;
    background: #ffffff;
    width: 100%;
}

.check-box-normail-radius input#flexCheckDefault {
    border-radius: 4px !important;
}

.coast2 {
}

.costtoatl2 {
    width: 100%;
}

td.table-form.coast2 {
    width: 1% !important;
    padding-right: 6.5rem;
}

td.table-form {
    width: 20%;
    padding: 0 15px 15px 0;
}

td.table-button {
    /*display: flex;*/
    padding: 9px;
    margin-top: 13px;
}

.table-button button {
    /*padding: 10px;*/
}

.table-button button {
    padding: 5px;
    margin: 3px;
    font-size: 23px;
    border: none;
    background: none;
    color: #3EB35C;
}

label.table-lable {
    margin-top: 7px;
}

.select2 {
    width: 100% !important;
}

/* ======================= Client CRM End ====================== */
/* ================================================================ */


/* ======================= Triage Center Start ====================== */
/* ================================================================ */
.plus-button {
    padding-left: 0px;
}

.opportunity-plus button {
    padding: 8px;
    display: flex;
    height: 40px;
    border-radius: 32px;
    border: none;
    outline: none;
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    color: #ffffff;
    align-items: center;
}

.view-triage {
    border: none;
    background: none;
    padding: 0;
}

.triage-information {
    line-height: 300%;
}

.mail-body {
    line-height: 150%;
}

.triage-lable {
    color: #686767;
}

.modal-title {
    color: #001689;
}

/* ======================= Triage Center End ====================== */
/* ================================================================ */

/* ======================= Opportunities Details Page Startr ====================== */
/* ================================================================================= */
/* ========================Multi-Selector START==================== */

.tabs-button {
    font-size: 14px;
}

    .tabs-button button {
        cursor: pointer !important;
        font-size: 14px;
        padding: 10px 20px 10px 20px;
        min-width: 20%;
    }

span.select2-selection.select2-selection--multiple {
    border-radius: 35px;
    padding: 0px;
    background: #ffffff;
    width: 100%;
    min-height: 40px;
    border: 1px solid #dfdfdf;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: solid #dfdfdf 1px;
    outline: 0;
}


.select2-container--default .select2-search--inline .select2-search__field {
    background: transparent;
    border: none;
    outline: 0;
    box-shadow: none;
    position: absolute;
    top: 0;
}

.select2-container .select2-search--inline .select2-search__field {
    margin-top: 0;
    padding-left: 10px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #3eb35c;
    border-radius: 4px;
    cursor: default;
    float: left;
    margin-right: 5px;
    margin-top: 5px;
    padding: 0 5px;
    color: #fff;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    margin-right: 2px;
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
    color: #ababab;
    margin-top: 5px;
    margin-right: 10px;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: 3px 5px;
    width: 100%;
}

.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin: 0;
    position: relative;
    vertical-align: middle;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    border: 1px solid #fff;
}

/* ========================Multi-Selector END==================== */
.note textarea:focus {
    outline: none !important;
    border: 1px solid #ababab;
}

.note textarea {
    border-radius: 5px;
}

/* ========================Note Section Start==================== */
.note-heading {
    background: #CFCFCF;
    border-radius: 4px;
    padding: 0.7rem;
}

.note-comments {
    border: 1px solid #dadada;
    margin: 10px 0 10px 0;
    border-radius: 5px;
    padding: 0.7rem;
}

.date-time {
    display: flex;
    justify-content: space-between;
    padding: 0 20px 0 90px;
}

.note-history-heading {
    font-weight: 600;
    font-size: 18px;
    color: #001689;
}

.note-heading:first-child {
    font-weight: 500;
}

/* ========================Note Section End==================== */
/* ======================= Opportunities Details Page Startr ====================== */
/* ================================================================================= */

/* ======================= Bid Management START ====================== */
/* ================================================================ */
.status-table p {
    background: #AFBDF2;
    color: #001689;
    border-radius: 2px;
    text-align: center;
    margin-bottom: 0px;
    font-size: 13px;
    padding: 5px;
    border-radius: 4px;
}

.Contat-person {
    font-size: 16px;
    font-weight: 400;
    color: rgb(104 103 103);
}

.client-company-name {
    margin-bottom: 24px;
}

.client-heading {
    font-weight: 600;
    font-size: 18px;
    color: #001689;
    background: #F6F6F6;
    padding: 5px 0 5px 15px;
    border-radius: 5px;
    margin-bottom: 5px;
}

/* ======================= View Bid START ====================== */
.bid-graph-info {
    color: #89817e;
}

.bid-row {
    width: 50%;
    float: left;
    margin-bottom: 10px;
    padding: 0 15px;
}

    .bid-row p span {
        width: 185px;
        display: inline-block;
    }

    .bid-row span {
        color: #686767;
    }

.bid-information {
    display: flex;
    flex-direction: row;
}

select.form-select.form-select-sm {
    border-radius: 13px;
    margin: 0 8px;
}

#Dashboard-accordian .accordion-item {
    border-radius: 45px;
    overflow: hidden;
}

/* ======================= View Bid START ====================== */

/* ======================= Bid Management END ====================== */
/* ================================================================ */


/* ======================= Opportunity Document Tab Start ====================== */
/* ============================================================================== */

.drop_box {
    margin: 20px auto !important;
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: 2px dashed #999999;
    border-radius: 8px;
}

    .drop_box p {
        margin-top: 10px;
        margin-bottom: 20px;
        font-size: 12px;
        color: #a3a3a3;
    }

.uoload-button {
    text-decoration: none;
    background-color: #3EB35C;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    outline: none;
    transition: 0.3s;
    border-radius: 5px;
}

    .uoload-button:hover {
        text-decoration: none;
        background-color: #1E8438;
        color: #ffffff;
        padding: 10px 20px;
        border: none;
    }

.form input {
    margin: 10px 0;
    width: 100%;
    background-color: #e2e2e2;
    border: none;
    outline: none;
    padding: 12px 20px;
    border-radius: 4px;
}

.upload {
    display: flex;
    align-items: center;
}

.upload-file h4 {
    margin-top: 10px;
    color: #001689;
    font-size: 18px;
}

.add-opportunity {
    display: flex;
    justify-content: center;
    padding: 0px;
}


/* ======================= Opportunity Document Tab End ====================== */
/* ============================================================================== */

/* ======================= View User Page Start ====================== */
/* =================================================================== */

.user-info {
    display: flex;
    flex-direction: row;
    line-height: 242%;
    margin: 0;
}

.user-data {
    width: 100%;
}

.wrapper img {
    width: 100%;
    /*border-radius: 100%;
  border: 8px solid #efefef ;
  border-style: double;
  margin-bottom: 20px;*/
}

.view-user-image {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .view-user-image h5 {
        color: #001689;
    }

.view-user-profile {
    box-shadow: 0px 5px 10px #e1e1e1;
    border-radius: 10px;
}

/* ======================= View User Page End ====================== */
/* =================================================================== */

/* ======================= Active or Inactive toggle popup Start ====================== */
/* =================================================================================== */
.active-msg {
    display: flex;
    justify-content: center;
    font-size: large;
}

/* ======================= Active or Inactive toggle popup End ====================== */
/* =================================================================================== */

/* ==========for development direct Start========== */
.uoload {
    display: flex;
}

.card.upload {
    width: 100%;
}

.upload-file {
    display: flex;
    text-align: center;
    flex-direction: column;
    width: 80%;
}

.file-dopdown {
    width: 60%;
}

select {
    border-radius: 18px !important;
}

.add-folders {
    border-radius: 5px;
    padding: 0.7rem;
    border: none;
    outline: none;
    color: #ffffff;
    background: #3EB35C;
}

/* ==========for development direct End========== */

/* ======================= Cost Type Start ====================== */
/* ============================================================== */

/* ======================= Cost Type End ====================== */
/* ============================================================== */

.editalbe {
    color: #cbcbcb;
}

/*.takeoff-button {
    padding: 15px 0 0 0;
}
*/
button#import-template {
    background: #ffff;
    color: #707070;
    border: 1.5px solid #3EB35C;
}

.item-package {
    width: 46% !important;
    padding: 0 19px 19px 0px !important;
}

.add-item-button {
    padding-bottom: 150px;
    display: flex;
    justify-content: flex-end;
    padding-right: 30px;
}

/* ==================Opportunity Listing Table Data START==================
======================================================================== */
td.details-control {
    background: url('https://www.datatables.net/examples/resources/details_open.png') no-repeat center center;
}

tr.shown td.details-control {
    background: url('https://www.datatables.net/examples/resources/details_close.png') no-repeat center center;
}

.opportunity-table a {
    text-decoration: underline;
    color: #0070C7;
}

.opp-table {
    font-weight: 400;
}

/* ==================Opportunity Listing Table Data END==================
======================================================================== */

/* ==================Page Loader START==================
======================================================= */

.content1 {
    max-width: 650px;
    margin: 0 auto;
    top: 35%;
    position: relative;
}

/* PRELOADER CSS */
.page-loader {
    width: 100%;
    height: 100vh;
    position: absolute;
    background: #ffffff7b;
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
}

/* SPINNER ANIMATION */
.spinner {
    position: relative;
    top: 35%;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    background-color: #001689;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0)
    }

    100% {
        -webkit-transform: scale(1.0);
        opacity: 0;
    }
}

@keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    100% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
        opacity: 0;
    }
}

/* ==================Page Loader START==================
======================================================= */


/*========20-01-2023=========*/
.table-listing {
    margin: 0px;
}

.exportBTN {
    background: #3eb35c;
    color: #fff;
    border-radius: 3px !important;
    border: none;
}

.heightCover {
    height: 100%;
}

.triage-information .triage-lable {
    color: #343434;
    line-height: normal;
    padding: 10px 15px;
    font-weight: 600;
}

.input-design input {
    width: 100%;
    background: none;
    border: 1px solid #dedede;
    margin: 5px 0px;
    border-radius: 10px;
    padding: 0px 14px;
}

.arrowdropjselect {
    height: 100%;
    background: url(../images/arrow-black.svg)no-repeat 96% 50%;
    background-color: rgb(255, 255, 255);
    padding: 10px 0 10px 15px;
}

.input-design {
    margin-bottom: 15px;
}

a.Sepration_text:last-child span {
    display: none;
}

.filter-section select {
    height: 40px !important;
    padding: 0px 35px 0px 15px !important;
    font-family: inherit;
}

.triage-lable.custom-heading {
    font-weight: bold;
    color: #000;
    background: #001689;
    border-bottom: 1px solid #dedede;
    color: #fff;
}


/*propsal pop sup css 15 march 2023
*/


.custom-container {
    max-width: 1640px;
}

.cstm-card {
    box-shadow: 0 7px 16px rgb(0 0 0 / 5%);
    padding: 20px 20px;
    border-radius: 10px;
    background-color: #fff;
}

.cstmcardhead {
    padding: 0 20px 20px;
}

    .cstmcardhead h2 {
        margin: 0;
        position: relative;
        font-size: 24px;
        line-height: 24px;
        padding: 5px 0 5px 15px;
        color: #000;
        font-weight: 500;
    }

    .cstmcardhead .card-head h2 {
        margin: 0;
        position: relative;
        line-height: 24px;
        padding: 5px 0 5px 15px;
        color: #000;
        font-weight: 500;
        font-size: 16px !important;
    }

    .cstmcardhead h2:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 6px;
        background-color: #071689;
        border-radius: 5px 0 0 5px;
    }

.cstmcardbody {
    padding-top: 20px;
}

.cstm-contrl {
    height: 50px;
}

p.prjctdescription {
    font-size: 20px;
}

    p.prjctdescription strong {
        font-weight: 500;
    }

table.tablemodule thead {
    background-color: #F5F6FA;
}

table.tablemodule td {
    vertical-align: middle;
}

    table.tablemodule td table td {
        border-bottom: 0;
    }

        table.tablemodule td table td:not(:first-child) {
            border-left: 1px solid #dee2e6;
            text-align: center;
        }

table.moduletablewidth tbody > tr > td:not(:first-child) {
    width: 12%;
}

table.moduletablewidth2 tbody > tr > td:not(:first-child) {
    width: 15%;
}

.acpinfo p {
    text-align: center;
    margin: 0;
    color: #FF0000;
}

.cstmlisting {
    padding: 0 0 0 25px;
}

    .cstmlisting li {
        line-height: 30px;
        color: #707070;
    }

        .cstmlisting li::marker {
            color: #000;
            width: 20px;
            font-size: 25px;
        }

        .cstmlisting li p {
            margin: 0;
            color: #000000;
            font-weight: 500;
        }

.color-dark {
    color: var(--bs-black);
}

.subheading2 {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.ClsOptPrice {
    width: 50px;
    height: 40px;
    cursor: pointer;
    position: absolute;
}


/*upload propsal*/
.Proposalupload-button {
    text-decoration: none;
    background-color: #3EB35C;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    outline: none;
    transition: 0.3s;
    border-radius: 5px;
}

    .Proposalupload-button:hover {
        text-decoration: none;
        background-color: #1E8438;
        color: #ffffff;
        padding: 10px 20px;
        border: none;
    }

.Proposalupload {
    display: flex;
}


/*26-04-2023 Css Here*/
.customOptional {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .customOptional .ClsOptPrice {
        width: 15px;
        height: 15px;
        position: static;
    }


.bidBTN a {
    background: #3eb35c;
    color: #fff;
}

input[type="text"]#Currentdate,
.div#OpportunityName input[type="text"],
div.triage-lable input[type="text"] {
    height: 40px !important;
    border: 1px solid #ddd;
    border-radius: 4px !important;
    background: #fff;
    padding: 10px 12px;
}

.biliingInfo .form-check input.form-check-input {
    box-shadow: none;
    height: 22px !important;
    width: 22px !important;
    border: 1px solid rgb(0, 0, 0) !important;
    padding: 10px;
    margin-top: 0;
}

    .biliingInfo .form-check input.form-check-input:checked {
        accent-color: #001689;
    }


div#RenderDocTableHtml {
    width: 100%;
    overflow: hidden;
}

/*.add-button .button-green, .search-button button, .opportunity-plus button, .add-button .cancel-button {
    height: 40px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}*/

.exportBTN {
    padding-top: 0;
    padding-bottom: 0;
}

.dataTables_wrapper .row:nth-child(2) {
    margin: 0;
}

    .dataTables_wrapper .row:nth-child(2) > div {
        padding: 0;
        overflow: auto;
    }

input[type=checkbox] {
    height: 15px !important;
    width: 15px;
    padding: 0;
}

/*input[type=file] {
    border: none;
    height: auto !important
}*/

.addbtncstm {
    display: flex;
}

.btn-success {
    border-radius: 45px;
    background-color: #3eb35c;
    border-color: #3eb35c;
}

.fixwithforusermagagement .btn-success {
    color: #3eb35c;
    font-size: 14px;
    border-radius: 45px;
    border-color: #3eb35c;
    background-color: transparent;
}

    .fixwithforusermagagement .btn-success:hover {
        background-color: #3eb35c;
        color: #ffff;
    }

.fixwithforusermagagement .logged a {
    font-size: 14px;
    border-radius: 45px;
    background-color: transparent;
    color: #ababab;
    cursor: not-allowed;
    border: 1px solid #ababab;
}

    .fixwithforusermagagement .logged a:hover {
        background-color: #ababab;
        color: #292929;
    }


.uploadcstmbtn {
    background: rgb(0, 51, 102);
    background: linear-gradient(180deg, rgba(0, 51, 102, 1) 0%, rgba(0, 101, 203, 1) 100%);
    border: none;
    color: rgb(255, 255, 255);
    padding: 6px 10px;
    border-radius: 5px !important;
}

.client-crm-button {
    display: flex;
    justify-content: flex-end;
    padding-right: 30px;
    padding-right: 0rem !important;
}


/* CSS */
.hide {
    display: none !important;
}

div#TemplatePartList_wrapper th:nth-last-child(2),
div#TemplatePartList_wrapper th:last-child {
}

div#RendorPartialIndexPage {
    gap: 15px;
    display: flex;
    flex-direction: column;
}

input#NewField,
.customFildesforJS > input[type="text"] {
    width: 100% !IMPORTANT;
}

div#examples_wrapper table {
    width: 100% !important;
}

div#UpdateSumbitleDataRequest:has(table.datatabale) {
    width: 100%;
}

table.tableCstm tr td:nth-child(4) {
    text-align: center;
}

table.tableCstm tr td:nth-child(5) {
    text-align: center;
}

table.tableCstm tr td:nth-child(6) {
    text-align: center;
}

table.tableCstm tr td:nth-child(7) {
    text-align: center;
}

table.tableCstm tr td:nth-child(8) {
    text-align: center;
}

table.tableCstm tr td:nth-child(9) {
    text-align: right;
}

table.tableCstm tr td:nth-child(10) {
    text-align: right;
}

table.tableCstm tr td:nth-child(11) {
    text-align: right;
}

table.tableCstm tr td:nth-child(12) {
    text-align: right;
}

table.tableCstm tr td:nth-child(13) {
    text-align: right;
}

/*.add-button {
    padding: 1rem 0;
}*/

/*    .add-button button {
        background-color: #3EB35C;
        border-radius: 30px;
        border: none;
        color: #fff;
    }*/

.btnChatter {
    background: rgb(62, 179, 92) !important;
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%) !important;
    border-radius: 28px !important;
    color: #fff;
}

i.fa.fa-solid.fa-bell {
    font-size: 28px;
    margin-top: 1rem;
    color: #b3af3e;
}

.username {
    margin-bottom: 1rem;
    border-radius: 7px;
    border: none;
    padding: 20px;
    background: darkblue;
    color: #fff;
}

.chat-box {
    width: 400px;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 5px;
    position: absolute;
    right: 24px;
    max-height: 515px;
    height: 515px;
}

.message-input {
    display: flex;
    align-items: center;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    position: absolute;
    z-index: 1;
    width: 100%;
    bottom: 10px;
}

.change-order-list-info .btn-success {
    border-radius: 45px;
    font-size: 14px;
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    border-color: #2a8d43;
}

    .change-order-list-info .btn-success:hover {
        background: #2a8d43;
    }

.change-order-list-info .btn-danger {
    border-radius: 45px;
    font-size: 14px;
    color: #ffff;
    background: rgb(220, 53, 69);
    background: linear-gradient(0deg, rgba(220, 53, 69, 1) 0%, rgba(251, 47, 66, 1) 100%);
    border-color: #dc3545;
}

    .change-order-list-info .btn-danger:hover {
        background: #dc3545;
    }

.message-input input {
    min-width: 85% !important;
}

button#sendButton {
    padding: 8px;
    background: #001689;
    color: #fff;
    border-radius: 4px;
}

.user-bx {
    position: absolute;
    bottom: 37px;
    background: #fff;
    padding: 10px;
    width: 100%;
    z-index: 0;
    left: 0px;
}

ul#userlist {
    max-height: 180px;
    overflow: auto;
    color: black;
    cursor: default;
    padding-left: 15px;
}

div#conversation {
    max-height: 430px;
    overflow: auto;
}

#userlist {
    list-style: none;
    padding: 0;
}

/*Chatter Css Here*/
.username {
    padding: 25px 20px;
    position: relative;
    background: darkblue;
}

    .username span:nth-child(3) {
        position: absolute;
        right: 10px;
        bottom: 0px;
        font-size: 14px;
    }

/* Notification and Popover Css Here */
.notification-count {
    top: 1px;
    position: absolute;
    cursor: pointer;
    right: -10px;
    padding: 2px 4px;
    border-radius: 119%;
    background: black;
    color: white;
    margin-right: 295px;
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: larger;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-top: 0px;
}

.popover {
    width: 500px;
    cursor: pointer;
}

.popover-body {
    padding: 0rem;
    color: #212529;
}

.notification_IconBox {
    border: 1.4px solid #00336617;
    width: 40px;
    height: 40px;
    background-color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-right: 15px;
    margin-top: 10px;
}

    .notification_IconBox #notification {
        margin: 0;
        padding: 0;
        font-size: 20px;
        color: #003366;
    }

    .notification_IconBox .badge.notification-count {
        margin: 0;
        position: absolute;
        right: -6px;
        top: -2px;
        background: #ff1229;
        width: 20px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

.popover .popover-header {
    width: 346px;
    background: linear-gradient(180deg, rgba(0, 51, 102, 1) 0%, rgba(0, 70, 140, 1) 100%);
    /* background: #001689; */
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}

    .popover .popover-header::before {
        content: '';
        border-bottom: 0px:
    }

.popover .popover-body {
    -webkit-box-shadow: -1px 21px 43px -2px rgba(0, 0, 0, 0.12);
    -moz-box-shadow: -1px 21px 43px -2px rgba(0, 0, 0, 0.12);
    box-shadow: -1px 21px 43px -2px rgba(0, 0, 0, 0.12);
    width: 346px;
    background-color: #fff;
    border: none;
    border-radius: 0;
    max-height: 310px;
    overflow-y: auto;
}

    .popover .popover-body ul li {
        font-size: 16px;
        font-weight: 400;
        color: #000;
    }

        .popover .popover-body ul li a b {
            font-size: 16px !important;
            font-weight: 400 !important;
            color: #000 !important;
        }

/* Calendar Css Here */
/*#calendar {
    padding-left: 19%;
    padding-top: 7%;
    padding-right: 4%;
}*/

.calendaR-DASHBOARD {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
    padding: 24px;
}

.fc-scroller.fc-day-grid-container {
    overflow: hidden scroll;
    height: 100% !important;
}


.calendaR-DASHBOARD h2:first-child {
    font-size: 24px;
}


/*ui change*/
.my-content_my {
    width: 433px !important;
}

#page-container {
    padding-bottom: 1rem;
}

table.opportunity-table tr th:nth-child(3) {
    text-align: left !important;
}

table.opportunity-table tr td:nth-child(3) {
    text-align: left !important;
}

table.opportunity-table tr th:nth-child(5) {
    text-align: left !important;
}

table.opportunity-table tr td:nth-child(5) {
    text-align: left !important;
}

table.opportunity-table tr th:nth-child(4) {
    text-align: left !important;
}

table.opportunity-table tr td:nth-child(4) {
    text-align: left !important;
}

table.opportunity-table tr th:nth-child(6) {
    text-align: left !important;
}

table.opportunity-table tr td:nth-child(6) {
    text-align: left !important;
}

#oppListing1_wrapper table.table.table-striped.opportunity-table.dataTable.no-footer tr th {
    font-size: 15px;
    min-width: 164px;
    padding: 14px;
}

.all-Opportunities-style tr th {
    padding: 14px;
}

#oppListing1_wrapper table.table.table-striped.opportunity-table.dataTable.no-footer tr th:nth-child(1) {
    width: 0px !important;
    min-width: 0px !important;
}

#oppListing1_wrapper table.table.table-striped.opportunity-table.dataTable.no-footer tr th:nth-child(2) {
    width: 0px !important;
    min-width: 0px !important;
}

#pills-tab {
    align-items: center;
    display: flex;
}

.anchor-text {
    text-decoration: underline;
    color: blue;
    cursor: pointer
}

/*.button-green {
    background-color: green;
    color: white;
    height:40px;
}*/

.button-green2 {
    background-color: green;
    color: white;
    border-radius: 5px !important;
    height: auto !important;
    margin-left: -84px;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
    color: rgba(0, 0, 0, .7);
    background-color: #f3f3f3;
}


.input-boxes {
    width: 100%;
    border: 2px solid #aaa;
    border-radius: 4px;
    margin: 8px 0;
    outline: none;
    padding: 8px;
    box-sizing: border-box;
    transition: .3s;
}

    .input-boxes:focus {
        border-color: dodgerBlue;
        box-shadow: 0 0 8px 0 dodgerBlue;
    }

/* UI Utils */
.content {
    width: 100%;
    padding: 16px;
}

    .content.centered {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

/* UI Elements */
h1 {
    font-size: 32px;
    font-weight: 300;
}

h2 {
    font-size: 16px;
    font-weight: 300;
}

.text-message {
    resize: none;
    width: 100%;
    font-size: 14px;
    line-height: 16px;
    padding: 16px 0px;
}

textarea:focus {
    outline: none;
    box-shadow: 0 13px 38px 0 rgba(0, 0, 0, 0.4);
}

.separator {
    width: 50%;
    height: 2px;
    background: rgba(0, 0, 0, .1);
    margin: 16px 0;
}

.text-message textarea {
    width: 100%;
    border-radius: 3px;
    min-height: 160px;
    max-height: 180px;
    padding: 11px 0px;
}

.model-heading {
    font-size: 23px;
    font-weight: 500;
    color: #000000;
}

div#estimatingTab .dataTables_scroll {
    overflow-x: inherit !important;
}

span#SpanGrossMargin {
    position: absolute;
    bottom: 7px;
    left: 5px;
}


/*16-02-2024 Css Here*/
#TemplatePartList,
#parttabledata table {
    display: block;
}

    #TemplatePartList tr th {
        white-space: nowrap;
    }

table tr td > select {
    font-size: 15px;
    font-weight: 300;
    padding: 4px;
    border: 1px solid #ddd;
    color: #404040;
    border-radius: 5px;
}

.partInput {
    padding: 2px;
    height: auto !important;
    border: none;
    width: 100px;
    /*background-color: #ccc;*/
    border: 1px solid #686767;
    border-radius: 3px;
}

    .partInput:focus {
        border: 2px solid black;
        background-color: lightgray;
    }

select.partInput {
    height: 31px !important;
}

#TemplatePartList tr td:focus-visible {
    outline: none;
}

#EmailBodyContent:focus,
#story:focus {
    outline: none;
    box-shadow: unset;
}

.custm-email-block {
    display: none;
}

.modal-lg.custm-Modal-checkbox {
    max-width: 1140px;
}

.custm-Modal-checkbox .custm-left-w {
    width: 58.33333333%;
}

.custm-Modal-checkbox .custm-email-block {
    display: block;
}

.email-head {
    line-height: 0;
    margin-top: 10px;
    margin-bottom: 4px;
}

table#TemplatePartList {
    display: table;
}

/*27-02-24 new css*/
.btn-custmImport {
    margin-top: 10px;
    margin-left: auto;
}

.custm-flex-btn {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.custm-mt-auto {
    margin-top: auto;
}

/*18-04-2024 new css*/
#parttabledata table.Custm-tableW {
    display: table;
}

/*.actin-btnGrp {
    padding-left: 80px !important;
}*/

table.custmTable-itemsListing tr th.sorting {
    width: 10%;
}

.errorSolveIndx {
    position: absolute;
    left: 0;
    top: 72px;
}


/* 02-may-2024  */

div#GetEmailData .modal-content.p-4 {
    overflow-y: scroll !important;
}

.takeoff-new-model {
    min-width: 1500px !important;
}

textarea#Note {
    outline: none;
    box-shadow: unset;
}

.lock-icon {
    color: white !important;
}

@media(min-width:2400px) and (max-width:4000px) {

    div #TemplatePartList_wrapper th:nth-last-child(2),
    div#TemplatePartList_wrapper th:last-child {
        width: 240px !important;
    }
}

/*.dataTables_scroll .dataTables_scrollHead .dataTables_scrollHeadInner table thead th {
    text-align: center;
}
.dataTables_scrollBody table#PartialTakeoffListTable tbody td {
    text-align: center;
}
td.action-fields {
    padding-left: 220px;
}*/
/*----11-06-2024----*/
table#TemplatePartList tr td,
table#ApproveTakeOffTemplatePartList tr td {
    height: 6px !important;
    padding: 0px 5px !important;
    vertical-align: baseline;
}

.cstm-input-file {
    background: transparent !important;
}

table#takeOffTemplateTable tr th {
    min-width: 110px;
}

.OHRate,
.ProfitRate {
    width: 100px !important;
}


.adds-button .cancel-button {
    border-radius: 5px;
    padding: 4px 12px;
    border: none;
    outline: none;
    border-radius: 35px;
    color: #ffffff;
    background: #C23C3C;
}

.adds-button .button-green {
    border-radius: 5px;
    padding: 4px 0;
    border: none;
    outline: none;
    color: #ffffff;
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
}

.adds-button .button-green,
.cancel-button {
    padding: 4px 12px;
    height: 40px;
}

.gap-plus-close {
    gap: 10px
}

.bg-enhance-the-ui {
    border: 1.3px solid #e4e4e4;
    background: #f6f6f6;
    padding: 14px;
    border-radius: 8px;
}

    .bg-enhance-the-ui h5 {
        font-weight: 600;
        font-size: 16px;
        margin-bottom: 0px;
    }

.advance-delete-btnn {
    height: 40px !important;
    width: 40px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

li.nav-item.border.rounded-2.m-2 {
    border-radius: 25px !important;
    overflow: hidden;
}

/*select2 css*/
.select2-container .select2-selection--single {
    border-radius: 35px;
    border: 1px solid rgb(223, 223, 223);
    height: 40px !important;
    padding: 7px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 8px !important;
}

table#takeOffTemplateTable {
    table-layout: fixed;
}

    table#takeOffTemplateTable tr th {
        padding-left: 1.5rem;
    }

table#costTable tr td.table-button {
    padding-top: 25px;
}

input#myChangeorderFile[type=file] {
    background: #fff !important;
    height: 40px !important;
    border: 1px solid #d4e0eb !important;
    padding: 8px;
}

div#TakeoffAdd span.select2-selection.select2-selection--multiple {
    overflow: hidden;
    border-radius: 35px !important;
    /* max-height: 30px; */
}

table.opportunity-table {
    table-layout: fixed;
}

    table.opportunity-table tr th,
    table.opportunity-table tr td {
        white-space: nowrap !important;
    }

        table.opportunity-table tr th:first-child {
            width: 0px !important;
        }

        /*        table.opportunity-table tr th:nth-child(5),
        table.opportunity-table tr td:nth-child(5) {
            width: 240px !important;
        }*/

        table.opportunity-table tr th:nth-child(4),
        table.opportunity-table tr td:nth-child(4) {
            white-space: normal;
            /*            width: 330px !important;*/
        }

    table.opportunity-table tr td {
        padding-top: 14px;
        padding-left: 14px;
        padding-right: 14px;
    }

        table.opportunity-table tr td:last-child {
            padding: 5px !important;
        }

table#Traigecentre th.sorting:nth-child(2) {
    width: 0 !important;
}

table#Traigecentre tbody tr td:nth-child(2) {
    width: 0% !important;
}

table#Traigecentre input {
    border-radius: 3px !important;
}

/*-----19-08-2024----*/
.cstm-add-button {
    display: flex;
    align-items: center;
    gap: 61px;
    margin-top: 35px;
    justify-content: start;
}

    .cstm-add-button span {
        color: #262626;
        font-weight: 600;
        font-size: 18px;
    }

.input-alias {
    width: 70% !important;
}

.button-green-save-filter {
    color: #fff;
    padding: 8px 18px !important;
    border-radius: 35px;
    border: 0;
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
}

.cstm-head {
    margin-top: 38px;
    width: 100%;
    justify-content: space-between;
}

    .cstm-head div#input-container {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
    }

.justify-content-unset {
    justify-content: unset !important;
}

div#input-container {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 12px;
}

    div#input-container input {
        width: 48%;
    }

/*button#save-btn {
    width: 30% !important;
    padding: unset !important;
    margin-left:5px !important;
}*/
select#filterData {
    width: 82%;
}

.delete-button {
    margin-left: 6px;
    max-width: 15%;
}

/*.mail-navigation {
    display: none;
}*/

.mail-navigation.show-left-bar {
    display: none;
}

@media only screen and (max-width: 1024px) {

    .mail-navigation {
        display: none;
    }

        .mail-navigation.show-left-bar {
            display: block;
            position: absolute;
            top: 70px;
            left: 0;
            z-index: 2;
            width: 50%;
        }

    .total-mails {
        width: 100% !important;
    }

    .email-view {
        width: 100% !important;
        position: absolute;
        display: none;
    }

        .email-view.border.checkChita {
            display: block;
        }

    .backarrow-email-dash {
        display: block !important;
        padding-left: 20px;
    }
}


@media only screen and (max-width: 539px) {
    .delete-button {
        margin-left: 4px;
    }

    select#filterData {
        width: 80%;
    }
}

@media only screen and (min-width: 540px) and (max-width: 766px) {
    select#filterData {
        width: 87%;
    }
}

@media only screen and (min-width: 767px) and (max-width: 1024px) {


    .delete-button {
        margin-left: 4px;
    }
}

.bg-color-email-dash {
    align-items: center;
    background: lightgray;
}

.backarrow-email-dash {
    display: none;
}


.search select,
.search .select2-container {
    /*min-width: 100%;*/
}

.top-approvetakeOff-bg {
    border: 1px solid #e6ecf5;
    padding: 1.5rem;
    border-radius: 5px;
    background: #ffffff;
}

.btnpadding {
    position: relative;
    top: 7px;
}

    .btnpadding .plus-button {
        align-self: flex-start;
    }

.notification-list-view {
    background: #f5f5f5;
    text-align: center;
    padding: 10px 10px 10px 10px;
    font-size: 15px;
}


b {
    font-size: x-large;
    font-weight: bold;
}

hr {
    margin: 5px 0px 5px 0px;
}

.indent-item {
    text-indent: 20px;
}


.menu-tab2 {
    text-indent: 20px;
}


/*07-10-2024 fixes css*/
table#Traigecentre tbody tr td {
    text-wrap: wrap;
}

.action-table {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.col.delete-button.index-dlt-btn {
    margin-left: -22px;
    margin-top: 3px;
}

button.btn.add-folders.add-btn-submittal {
    border-radius: 45px !important;
    padding: 0.5rem;
    border: none;
    outline: none;
    color: #ffffff;
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    height: 40px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 38px !important;
}

.table-button button#myElem,
td.table-button button.remove-field {
    padding: 24px 5px 0px 0px;
}

li.list-unread.list-group-item.notification-text .list-group-item {
    background: #f1f1f1;
    border: 1px solid #d5d5d5;
}

.dashboard-logo img.company-logo {
    width: 100px;
    object-fit: contain;
}

.email-slect {
    display: flex;
    gap: 20px;
    align-items: center;
}

    .email-slect label {
        min-width: 10%;
        display: block;
    }

.proposal-email-error-message {
    margin: -26px 0px -22px 0px;
}

#EmailBodyContent {
    background-color: white;
    height: 220px;
}

.cstm-takeoff-popup-part-list-wrap {
    text-wrap: nowrap;
}

#Opportunitydata #RendorPartialIndexPage td {
    text-wrap: auto;
}

.addbtncstmtemplate {
    display: flex;
    margin-top: 10px;
}

/*registration page*/
#togglePassword,
#toggleConPassword {
    margin-left: -30px;
    cursor: pointer;
}

.file-label {
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    padding: 10px 22px;
    min-width: 150px;
    font-size: 15px;
    border-radius: 21px;
    cursor: pointer;
    color: #ffff;
    margin-top: 10px;
}


/*anuj css*/
.page-container {
    padding-left: 300px;
    padding-top: 80px;
    padding-right: 25px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.search-btn {
    background: #3eb35c;
    border: none;
    outline: none;
    color: #fff;
    padding: 8px 20px;
    border-radius: 4px;
}

.or-text {
    height: 40px;
    align-items: center;
    transform: translateX(10px);
}


b {
    font-size: x-large;
    font-weight: bold;
}

hr {
    margin: 5px 0px 5px 0px;
}

.user-management-card .accordion-collapse {
    position: absolute;
    height: 272px;
    overflow: auto;
    z-index: 1;
    padding: 6px;
    background: white;
    width: 100%;
    border: 1px solid rgb(238, 238, 238);
    box-shadow: -10px 13px 24px -7px rgba(207, 207, 207, 0.64);
    -webkit-box-shadow: -10px 13px 24px -7px rgba(207, 207, 207, 0.64);
    -moz-box-shadow: -10px 13px 24px -7px rgba(207, 207, 207, 0.64);
}

.counting-no-ofcheck {
    position: absolute;
    right: 60px;
    font-size: 12px;
    background-color: #003469;
    padding: 4px 8px;
    border-radius: 6px;
    color: #fff;
}

.user-management-card h2 {
    margin: 0 !important;
}

.user-management-card .accordion {
    position: relative;
}

/*.main-card-permintion {
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #dee2e6 !important;
}
*/
.menu-tab {
    font-weight: bold;
    text-indent: 20px;
    font-size: 18px;
    color: #001689;
}

ul.list-ul-perminstion {
    list-style: none;
    padding: 0;
    margin: 0;
}

    ul.list-ul-perminstion li {
        padding: 10px 0px;
        border-bottom: 1px solid #dee2e6;
    }


.event-header {
    background: #003366;
    padding: 0.8rem 1rem;
}

.modal-header .btn-close {
    padding: 10px;
    background-color: #ffffff;
    margin: -0.5rem -0.0rem -.5rem auto !important;
    border-radius: 30px;
}

.event-spacing-bt {
    margin-bottom: 16px;
}

.event-heading {
    font-weight: 600;
    font-size: 22px;
    color: #ffffff;
}

.event-header .event-heading i {
    margin-right: 10px;
    font-size: 24px;
    border: 1px solid #0016894d;
    padding: 6px;
    border-radius: 6px;
}

/*.add-new-user-box-height {
    margin: 0px;
    height: calc(100vh - 334px);
    max-height: 650px;
    min-height: 626px;
    overflow: overlay;
}*/

.list-ul-perminstion label {
    font-size: 16px;
}

    .list-ul-perminstion label input {
        margin-right: 10px;
    }

.main-card-permintion .headin-area b {
    color: #393939;
    font-size: 16px;
    font-weight: 600;
    margin-left: 8px;
}

.opportunity-plus {
    display: flex;
    border-radius: 45px !important;
    height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
}

.table > tbody {
    color: #000000 !important;
    font-size: 15px !important;
    vertical-align: middle !important;
}

table.dataTable.table-striped > tbody > tr.odd > * {
    box-shadow: inset 0 0 0 9999px rgb(255 255 255 / 5%) !important;
}

.card-header .inn-heading {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    padding: 6px 0px;
}

.add-use {
    background-image: url(/images/add-user-bg.png);
    width: 100%;
    display: flex;
    align-items: center;
    height: 60px;
    justify-content: center;
    border-radius: 6px 6px 0px 0px;
}

table#Traigecentre tbody tr td {
    text-wrap: wrap;
    text-overflow: ellipsis;
    max-height: 100px !important;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100px !important;
}
table#ChangeOrderReportData tbody tr td {
    text-wrap: wrap;
    text-overflow: ellipsis;
    max-height: 100px !important;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100px !important;
}

.add-use h5 {
    font-weight: 600;
    margin: 0;
    color: #fff;
    font-size: 27px;
}

.button-green {
    background: rgb(62, 179, 92);
    background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%);
    border-radius: 45px !important;
    border: none;
    color: #ffffff;
    /* background: #FD7702; */
    height: 40px;
    padding: 8px 26px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    margin-left: -14px !important;
}

.modal-header .btn-close {
    margin: -0.5rem -0.0rem -.5rem auto !important;
}

.view-user-image img {
    margin-bottom: 34px;
    height: 160px;
    width: 160px;
    border-radius: 100%;
    border: 4px solid #efefef;
    overflow: hidden;
}

.view-profile-image-border {
    border-right: 1px solid #ededed;
}

.add-btn-style {
    margin-top: 12px;
    border-radius: 40px !important;
    border: none;
    color: #3EB35C !important;
    background: #3eb35c33 !important;
    padding: 4px 14px !important;
}

    .add-btn-style:hover {
        color: #ffff !important;
        background: rgb(62, 179, 92) !important;
        background: linear-gradient(0deg, rgba(62, 179, 92, 1) 0%, rgba(57, 209, 96, 1) 100%) !important;
    }


ul.ui-menu.ui-autocomplete {
    list-style-type: none;
    padding-left: 0px;
    width: 300px;
}

    ul.ui-menu.ui-autocomplete li {
        padding: 5px;
        background-color: floralwhite;
    }

.dollerInputCostTotal {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputTProfit {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputTExtPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputAdExtPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}


.dollerInputTOverHeadPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}

.custom-pl24 {
    padding-left: 24px !important;
}

.hidden {
    display: none;
}

.input-dollor {
    position: relative;
    padding-top: 2px;
}

.input-percentage {
    position: relative;
    padding-top: 2px;
}

.input-dollor.left input {
    padding-left: 12px;
}

.input-percentage.right input {
    padding-right: 18px;
    text-align: left;
}

.input-dollor:before {
    position: absolute;
    top: 0;
    content: "$";
}

.input-percentage:before {
    position: absolute;
    top: 0;
    content: "%";
}

.input-dollor.left:before {
    left: -10px;
}

.input-percentage.right:before {
    right: -15px;
}

.dollerInputCostTotal {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputTProfit {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputTExtPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputTOverHeadPrice {
    position: absolute;
    top: 8px;
    left: 10px;
}

.dollerInputgrossmargin {
    position: absolute;
    top: 8px;
    left: 10px;
}

.custom-pl24 {
    padding-left: 24px !important;
}

.modal-body.body-overflow-popup {
    padding: 24px 34px;
    height: calc(100vh - 170px);
    overflow-y: scroll;
}


/**mail css starts**/
.main-mail-container {
    position: relative;
    overflow: hidden;
}

.mail-navigation,
.total-mails,
.email-view,
.mail-recepients {
    background-color: #ffff;
    height: calc(100vh - 12.9rem);
    overflow: hidden;
    border-radius: 0.3rem;
}

.cursor-pointer {
    cursor: pointer;
}

.mail-info-body {
    max-height: calc(100vh - 28.6rem);
}

@media (min-width: 1400px) {
    .total-mails .mail-msg .mail-msg-content {
        display: inline-block;
    }
}

@media (min-width: 1400px) and (max-width: 1489.98px) {
    .responsive-mail-action-icons .dropdown {
        display: block;
    }

    .responsive-mail-action-icons .close-button {
        display: none;
    }

    .mail-action-icons {
        display: none;
    }
}

@media (max-width: 1399.98px) {
    .responsive-mail-action-icons {
        display: block;
        display: flex;
    }

    .mail-action-icons {
        display: none;
    }
}

@media (max-width: 575.98px) {
    .mail-recepients {
        display: none;
    }
}

@media (min-width: 1489px) {
    .responsive-mail-action-icons {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .mail-navigation {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .mail-navigation {
        min-width: 16rem;
        max-width: 16rem;
    }
}

.total-mails {
    width: 35%;
    position: relative;
}

.email-next-and-pre-btn {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #dee2e6;
    background: #fff;
}

/*.email-toggle-top-btn {
    position: absolute;
    top: 0;
    width: 100%;
    background:#fff;
}*/

.email-view {
    width: 65%;
}

    .email-view .mail-messages {
        overflow: scroll;
        max-height: calc(100vh - 19rem);
    }

.total-mails .mail-messages {
    overflow: scroll;
    max-height: calc(100vh - 22.8rem);
}

    .total-mails .mail-messages li {
        /*        padding: 1.1rem 1rem 0.625rem 1rem;*/
        border-bottom: 1px solid var(--default-border);
    }

.read-email-div {
    width: 10px;
    padding: 6px;
}

.side-bar-menu-list-ul {
    height: calc(100vh - 140px) !important;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

.read-email-div:hover {
    background: #00468b26;
}

.total-mails .mail-messages li.active,
.total-mails .mail-messages li:hover {
    background-color: var(--primary005);
    border-left: 4px solid #00468b !important;
}

.read-email-div.active {
    border-left: 4px solid #00468b !important;
    background-color: var(--primary005);
}

.total-mails .mail-messages li:last-child {
    border-bottom: 0;
}

.total-mails .mail-messages li .avatar.mail-msg-avatar {
    width: 2rem;
    height: 2rem;
}

    .total-mails .mail-messages li .avatar.mail-msg-avatar.online:before,
    .total-mails .mail-messages li .avatar.mail-msg-avatar.offline:before {
        width: 0.55rem;
        height: 0.55rem;
    }

.total-mails .mail-messages li .mail-msg .mail-starred i {
    color: var(--text-muted);
    opacity: 0.5;
}

.total-mails .mail-messages li .mail-msg .mail-starred.true i {
    color: rgb(var(--warning-rgb));
    opacity: 1;
}

.mail-recepients {
    min-width: 4.4rem;
    max-width: 4.4rem;
}

    .mail-recepients .total-mail-recepients {
        max-height: calc(100vh - 13rem);
    }

    .mail-recepients .mail-recepeint-person .avatar {
        width: 2rem;
        height: 2rem;
        margin-block-end: 1rem;
    }

        .mail-recepients .mail-recepeint-person .avatar.online:before,
        .mail-recepients .mail-recepeint-person .avatar.offline:before {
            width: 0.55rem;
            height: 0.55rem;
        }

    .mail-recepients .mail-recepeint-person:last-child {
        margin-block-end: 0;
    }

.mail-navigation ul.mail-main-nav {
    max-height: calc(100vh - 14.5rem);
    padding: 1rem;
    margin-block-end: 0;
}

    .mail-navigation ul.mail-main-nav li {
        padding: 0.55rem 0.8rem;
        border-radius: var(--default-border);
        border-radius: 0.3rem;
        font-weight: 500;
    }

        .mail-navigation ul.mail-main-nav li div {
            color: var(--text-muted);
        }

        .mail-navigation ul.mail-main-nav li.active {
            background-color: var(--primary01);
        }

            .mail-navigation ul.mail-main-nav li.active div {
                color: var(--primary-color);
                font-weight: 600;
            }

        .mail-navigation ul.mail-main-nav li:hover div {
            color: var(--primary-color);
        }

@media (min-width: 576px) {
    .mail-msg-content {
        width: 100%;
    }
}

.mails-information {
    width: 100%;
}

    .mails-information .mail-info-header {
        padding: 0.75rem;
        border-block-end: 1px solid var(--default-border);
    }

    .mails-information .mail-info-footer {
        padding: 0.75rem;
        border-block-start: 1px solid var(--default-border);
    }

    .mails-information .mail-attachment {
        padding: 0.25rem;
        width: 12rem;
        height: 2.75rem;
        border: 1px solid var(--default-border);
        border-radius: 0.3rem;
        display: flex;
        align-items: center;
    }

        .mails-information .mail-attachment .attachment-icon svg,
        .mails-information .mail-attachment .attachment-icon i {
            width: 1.5rem;
            height: 1.5rem;
            font-size: 2rem;
            margin-inline-end: 0.5rem;
        }

        .mails-information .mail-attachment .attachment-name {
            max-width: 7rem;
            display: inline-block;
            font-size: 0.75rem;
            font-weight: 500;
        }

.mail-reply .ql-toolbar.ql-snow .ql-formats {
    margin-top: 5px;
    margin-bottom: 5px;
}

#mail-compose-editor .ql-editor {
    min-height: 12.62rem !important;
}

.mail-compose .ql-toolbar.ql-snow .ql-formats {
    margin-top: 5px;
    margin-bottom: 5px;
}

.offcanvas.offcanvas-end.mail-info-offcanvas {
    width: 50rem;
}

.mail-notification-settings,
.mail-security-settings {
    width: 60%;
}

@media (max-width: 575.98px) {
    #account-settings .btn-group label {
        font-size: 0.625rem;
    }
}

.choices__list--dropdown .choices__item--selectable,
.choices__list[aria-expanded] .choices__item--selectable {
    padding: 10px !important;
}

    .choices__list--dropdown .choices__item--selectable::after,
    .choices__list[aria-expanded] .choices__item--selectable::after {
        display: none;
    }

.mail-settings-tab.nav-tabs-header .nav-item .nav-link {
    padding: 0.65rem 0.8rem;
    border: 0;
}

    .mail-settings-tab.nav-tabs-header .nav-item .nav-link:hover,
    .mail-settings-tab.nav-tabs-header .nav-item .nav-link:focus {
        border: 0;
    }

.TASK-kanban-board {
    display: flex;
    overflow-x: auto;
    align-items: stretch;
    margin-bottom: 0.75rem;
    padding-bottom: 1rem;
}

    .TASK-kanban-board .kanban-tasks-type {
        min-width: 20rem;
        margin-inline-end: 0.5rem;
        width: 100%;
    }

        .TASK-kanban-board .kanban-tasks-type .kanban-tasks .card {
            touch-action: none;
        }

    .TASK-kanban-board::-webkit-scrollbar-thumb {
        background: #00468c;
        border-radius: 0.3125rem;
    }

    .TASK-kanban-board::-webkit-scrollbar-track {
        border-radius: 0.3125rem;
    }

    .TASK-kanban-board .task-image .kanban-image {
        height: 150px;
        width: 100%;
    }

    .TASK-kanban-board .kanban-content {
        margin-top: 0.75rem;
    }

    .TASK-kanban-board .kanban-task-description {
        color: var(--text-muted);
    }

    .TASK-kanban-board .kanban-tasks-type.new .kanban-tasks .card {
        border: 1px solid rgba(var(--primary-rgb), 0.2);
    }

    .TASK-kanban-board .kanban-tasks-type.todo .kanban-tasks .card {
        border: 1px solid rgba(var(--primary-tint1-rgb), 0.2);
    }

    .TASK-kanban-board .kanban-tasks-type.in-progress .kanban-tasks .card {
        border: 1px solid rgba(var(--primary-tint2-rgb), 0.2);
    }

    .TASK-kanban-board .kanban-tasks-type.inreview .kanban-tasks .card {
        border: 1px solid rgba(var(--primary-tint3-rgb), 0.2);
    }

    .TASK-kanban-board .kanban-tasks-type.completed .kanban-tasks .card {
        border: 1px solid rgba(var(--secondary-rgb), 0.2);
    }

    .TASK-kanban-board #new-tasks .card.custom-card:last-child,
    .TASK-kanban-board #todo-tasks .card.custom-card:last-child,
    .TASK-kanban-board #inprogress-tasks .card.custom-card:last-child,
    .TASK-kanban-board #inreview-tasks .card.custom-card:last-child,
    .TASK-kanban-board #completed-tasks .card.custom-card:last-child {
        margin-bottom: 0;
    }

    .TASK-kanban-board #new-tasks,
    .TASK-kanban-board #todo-tasks,
    .TASK-kanban-board #inprogress-tasks,
    .TASK-kanban-board #inreview-tasks,
    .TASK-kanban-board #completed-tasks {
        position: relative;
        max-height: 35rem;
    }

        .TASK-kanban-board #new-tasks .simplebar-content,
        .TASK-kanban-board #todo-tasks .simplebar-content,
        .TASK-kanban-board #inprogress-tasks .simplebar-content,
        .TASK-kanban-board #inreview-tasks .simplebar-content,
        .TASK-kanban-board #completed-tasks .simplebar-content {
            padding: 0 1rem 0 0 !important;
        }

    .TASK-kanban-board .task-Null {
        position: relative;
        min-height: 12.5rem;
    }

        .TASK-kanban-board .task-Null::before {
            position: absolute;
            content: "";
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            background-color: var(--custom-white);
            border-radius: 0.3rem;
            background-image: url("./media-92-EVJRGFI7.svg");
            background-size: cover;
            background-position: center;
            height: 12.5rem;
            width: 100%;
            margin: 0 auto;
        }

    .TASK-kanban-board .view-more-button {
        margin-right: 1rem;
    }

.task-details-key-tasks {
    list-style-type: decimal;
}

    .task-details-key-tasks li {
        margin-bottom: 0.5rem;
        color: var(--text-muted);
    }

        .task-details-key-tasks li:last-child {
            margin-bottom: 0;
        }

.task-description {
    font-size: 0.875rem;
}

.avatar {
    position: relative;
    height: 2.625rem;
    width: 2.625rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    color: #fff;
    font-weight: 500;
}

    .avatar a.badge:hover {
        color: #fff;
    }

    .avatar img {
        width: 100%;
        height: 100%;
        border-radius: 0.25rem;
    }

    .avatar svg {
        width: 1.5rem;
        height: 1.5rem;
    }

    .avatar.avatar-rounded {
        border-radius: 50%;
    }

        .avatar.avatar-rounded img {
            border-radius: 50%;
        }

    .avatar.avatar-radius-0 {
        border-radius: 0;
    }

        .avatar.avatar-radius-0 img {
            border-radius: 0;
        }

    .avatar .avatar-badge {
        position: absolute;
        inset-block-start: -4%;
        inset-inline-end: -0.375rem;
        width: 1.4rem;
        height: 1.4rem;
        font-size: 0.625rem;
        border: 2px solid var(--custom-white);
        border-radius: 50% !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .avatar.online:before,
    .avatar.offline:before {
        position: absolute;
        content: "";
        width: 0.5rem;
        height: 0.5rem;
        border-radius: 50%;
        inset-inline-end: 0;
        inset-block-end: 0;
        border: 2px solid var(--custom-white);
    }

    .avatar.online:before {
        background-color: rgb(var(--success-rgb));
    }

    .avatar.offline:before {
        background-color: var(--gray-5);
    }

    .avatar.avatar-xs {
        width: 1.25rem;
        height: 1.25rem;
        line-height: 1.25rem;
        font-size: 0.65rem;
    }

        .avatar.avatar-xs .avatar-badge {
            padding: 0.25rem;
            width: 1rem;
            height: 1rem;
            line-height: 1rem;
            font-size: 0.5rem;
            inset-block-start: -25%;
            inset-inline-end: -0.5rem;
        }

    .avatar.avatar-sm {
        width: 1.75rem;
        height: 1.75rem;
        line-height: 1.75rem;
        font-size: 0.75rem;
    }

        .avatar.avatar-sm .avatar-badge {
            padding: 0.3rem;
            width: 1.1rem;
            height: 1.1rem;
            line-height: 1.1rem;
            font-size: 0.5rem;
            inset-block-start: -38%;
            inset-inline-end: -0.5rem;
        }

        .avatar.avatar-sm.online:before,
        .avatar.avatar-sm.offline:before {
            width: 0.5rem;
            height: 0.5rem;
        }

        .avatar.avatar-sm svg {
            width: 1rem;
            height: 1rem;
        }

    .avatar.avatar-md {
        width: 2.5rem;
        height: 2.5rem;
        line-height: 2.5rem;
        font-size: 0.8rem;
    }

        .avatar.avatar-md .avatar-badge {
            padding: 0.4rem;
            width: 1.2rem;
            height: 1.2rem;
            line-height: 1.2rem;
            font-size: 0.65rem;
            inset-block-start: -6%;
            inset-inline-end: -13%;
        }

        .avatar.avatar-md.online:before,
        .avatar.avatar-md.offline:before {
            width: 0.75rem;
            height: 0.75rem;
        }

        .avatar.avatar-md svg {
            width: 1.25rem;
            height: 1.25rem;
        }

    .avatar.avatar-lg {
        width: 3rem;
        height: 3rem;
        line-height: 3rem;
        font-size: 1rem;
    }

        .avatar.avatar-lg .avatar-badge {
            inset-block-start: -15%;
            inset-inline-end: -0.25%;
        }

        .avatar.avatar-lg.online:before,
        .avatar.avatar-lg.offline:before {
            width: 0.8rem;
            height: 0.8rem;
        }

        .avatar.avatar-lg svg {
            width: 1.5rem;
            height: 1.5rem;
        }

    .avatar.avatar-xl {
        width: 4rem;
        height: 4rem;
        line-height: 4rem;
        font-size: 1.25rem;
    }

        .avatar.avatar-xl .avatar-badge {
            inset-block-start: -8%;
            inset-inline-end: -0.2%;
        }

        .avatar.avatar-xl.online:before,
        .avatar.avatar-xl.offline:before {
            width: 0.95rem;
            height: 0.95rem;
        }

    .avatar.avatar-xxl {
        width: 5rem;
        height: 5rem;
        line-height: 5rem;
        font-size: 1.5rem;
    }

        .avatar.avatar-xxl .avatar-badge {
            inset-block-start: -4%;
            inset-inline-end: 0rem;
        }

        .avatar.avatar-xxl.online:before,
        .avatar.avatar-xxl.offline:before {
            width: 1.05rem;
            height: 1.05rem;
            inset-block-end: 0.25rem;
        }

.avatar-list-stacked {
    padding: 0;
}

    .avatar-list-stacked .avatar {
        margin-inline-end: -0.65rem !important;
        border: 2px solid transparent;
        vertical-align: middle;
        transition: transform ease 200ms;
    }

        .avatar-list-stacked .avatar:last-child {
            margin-inline-end: 0 !important;
        }

        .avatar-list-stacked .avatar:hover {
            z-index: 1;
            transform: scale(1.15);
            border: 2px solid var(--custom-white);
        }

[dir=rtl] .avatar-list-stacked .ri-arrow-right-s-line {
    transform: rotate(180deg);
}

.main-mail-container button.btn.btn-sm.btn-primary1-light.btn-wave {
    color: #fff;
    background: #3eb35c80;
}

.main-mail-container button.btn.btn-sm.btn-primary2-light.btn-wave {
    color: #fff;
    background: #c4e871;
}

.main-mail-container .bg-primary2 {
    background-color: #ff5d9f !important;
}


.main-mail-container button.btn.btn-primary1-light.btn-icon.rounded-pill {
    background: red;
    padding: 18px;
    border-radius: 82px !IMPORTANT;
}

.main-mail-container .text-muted {
    color: var(--text-muted) !important;
    font-size: 0.6875rem;
    font-weight: 500 !important;
}

.main-mail-container .mail-navigation ul.mail-main-nav li {
    padding: 0.55rem 0.8rem;
    border-radius: var(--default-border);
    border-radius: 0.3rem;
    /* font-weight: 500; */
}

    .main-mail-container .mail-navigation ul.mail-main-nav li.active {
        background-color: #3eb35c;
    }

        .main-mail-container .mail-navigation ul.mail-main-nav li.active div {
            color: #ffff;
            font-weight: 600;
        }

.main-mail-container .text-nowrap {
    font-size: 0.9rem;
}

.main-mail-container .bg-primary1 {
    background-color: #0e9aee !important;
}

.main-mail-container button.btn.btn-primary {
    background-color: #001689 !important;
    border-radius: 5px;
}

.main-mail-container .total-mails .mail-messages li.active,
.total-mails .mail-messages li:hover {
    background: #f7f7ff;
}

.main-mail-container .total-mails .mail-messages li {
    /*    padding: 1.1rem 1rem 0.625rem 1rem;*/
    border-left: 4px solid transparent;
}
/*.unread-email-fuc {
   
}*/
.unread-email-fuc {
    width: 20px;
    background-color: #0050a0;
}

.main-mail-container .btn.btn-primary3-light {
    color: #ff8e6f;
    background: #fff3f0;
}

.main-mail-container .btn-icon.btn-sm {
    padding: 0.36rem .5rem;
    font-size: 0.8rem;
}

.main-mail-container .bg-primary3 {
    background: #ff8e6f;
}


.main-mail-container .btn.btn-primary1-light {
    background-color: rgba(var(--primary-tint1-rgb), 0.1);
}

.fs-12 {
    color: #000;
    font-size: 1rem;
    font-weight: 500 !important;
}

.fs-20 {
    font-size: 1.25rem;
}

.mail-info-offcanvas .fs-11 {
    font-size: 11px;
}

.mail-info-offcanvas .text-muted {
    color: var(--text-muted) !important;
}

.mail-info-offcanvas .btn-icon {
    width: 2.1rem;
    height: 2.1rem;
    font-size: 0.95rem;
    padding: 0.375rem;
    flex-shrink: 0;
}

    .mail-info-offcanvas .btn-icon.btn-sm {
        width: 1.75rem;
        height: 1.75rem;
        font-size: 0.8rem;
        padding: 0.1875rem;
    }

.mail-info-offcanvas .btn-outline-light {
    color: #212b37;
    border-color: rgb(var(--light-rgb));
}

.mail-info-offcanvas .border {
    border: 1px solid #ecf3fb !important;
}

.mail-info-offcanvas .mails-information .mail-info-header {
    padding: 0.75rem;
    border-block-end: 1px solid #ecf3fb;
}

.mail-info-offcanvas .fs-14 {
    font-size: 0.875rem;
    color: #212b37;
}

.mail-info-offcanvas .text-muted {
    font-size: 14px;
    color: #6e829f !important;
}

.mail-info-offcanvas .btn.btn-primary-light {
    background-color: #eef0fe;
    color: #5c67f7;
}

    .mail-info-offcanvas .btn.btn-primary-light:hover,
    .btn.btn-primary-light:focus,
    .btn.btn-primary-light:active {
        background-color: #5c67f7;
        color: #fff;
        border-color: var(--primary-color);
    }

.mail-info-offcanvas .bg-primary {
    background-color: #5c67f7 !important;
}

.mail-info-offcanvas .btn.btn-primary1-light {
    background-color: #fceefb;
    color: #e360d5;
}

    .mail-info-offcanvas .btn.btn-primary1-light:hover,
    .btn.btn-primary1-light:focus,
    .btn.btn-primary1-light:active {
        background-color: #e360d5;
        color: #fff;
        border-color: #e360d5;
    }


.mail-info-offcanvas .bg-primary-transparent {
    background-color: #eef0fe;
    color: #5c67f7;
}

.to-send-email {
    position: relative;
}

    .to-send-email i.ti.ti-mail.align-middle.icon-set-compose-email {
        z-index: 99;
        font-size: 18px;
        position: absolute;
        top: 0;
        bottom: 0;
        height: 100%;
        transform: translate(70%, 28%);
    }

    .to-send-email input#fromMail {
        padding-left: 44px;
    }

.verticle-gap {
    gap: 26px;
    display: flex;
    flex-direction: column;
}

.user-management-card .accordion-button {
    background-color: #f6f6f6;
}


/*changs*/

.user-management-filter-page div.dataTables_wrapper div.dataTables_filter {
    position: absolute !important;
    right: 142px !important;
}

.user-management-filter-page input.button-green.exportBTN {
    top: 24px;
    position: absolute;
    right: 24px;
}

.user-management-filter-page table {
    margin-top: 16px !important;
}

.unread-email {
    font-weight: bold;
    color: darkblue;
}

.read-email {
    color: black;
}

.selected-email-subject {
    background: lightgray;
    font-size: larger;
    /*font-weight: bold;*/
    color: darkblue;
}

.flag-and-delete {
    font-size: larger;
    color: grey;
}

.email-flag:hover {
    color: red;
}

.email-delete:hover {
    color: black;
}

.email-id-listing {
    font-size: large;
    /*font-weight: bold;*/
    color: darkblue;
}

.email-folder-refresh {
    font-size: x-large;
}

@media (min-width: 450px) {
    .main-card {
        width: 96%;
        max-width: 400px;
        height: calc(100% - 430px) !important;
        border-radius: 8px !important;
        max-height: 600px;
        margin: 16px !important;
    }
}

.my-b-tag-manag b {
    font-size: 14px !important;
    font-weight: 600 !important;
}

.logo-project-info-img .upload-info {
    position: relative;
    display: flex;
    align-items: center;
    padding: 9px 16px;
    fill: #919191;
    color: #919191;
    width: 100%;
    flex-flow: row-reverse;
    justify-content: space-between;
}

.border-radius-btn {
    border-radius: 0px 35px 35px 0px !important;
}

.logo-project-info-img .upload {
    height: 40px !important;
    border-radius: 35px 0px 0px 35px !important;
    width: 100%;
    position: relative;
    display: inline-flex;
    background: #e5e5e5;
    border-radius: 19px;
    overflow: hidden;
    transform: rotate(0);
}

.logo-project-info-img .upload-button {
    height: 100%;
    width: 100%;
    position: absolute;
    margin: 0;
    font-size: 100%;
    /* padding: 0 3px; */
    font-family: inherit;
    background: none;
    border: none;
    border-radius: inherit;
    outline: none;
    opacity: 0;
}


.logo-project-info-img .upload::before {
    transform: translate(-50%, -50%);
    bottom: 50%;
    top: 50%;
    content: "";
    display: block;
    width: 2px;
    height: 30.554px;
    border-radius: 10px;
    opacity: 0.5;
    background: #a9a9a9;
    right: 45px;
    position: absolute;
}
/*table#ChangeOrderReportData tbody tr td {
    max-width: 27% !important;
    text-wrap: wrap;
}*/
ul.invitation-list {
    display: inline-flex;
    list-style-type: none;
    gap: 10px;
    padding-left: 0;
    flex-wrap: wrap;
    margin-bottom: 2px;
}

    ul.invitation-list li {
        display: inline-block;
        font-size: 15px;
        padding: 3px 16px;
        border-radius: 25px;
        border: 1px dashed grey;
        cursor: pointer;
    }

.bg-heading-invition {
    background: #dee2e65e;
    padding: 8px 16px;
    margin-bottom: 16px;
    border-radius: 6px;
}

    .bg-heading-invition h5 {
        font-size: 18px;
        margin: 0;
        font-weight: 600;
        color: #003366;
    }

/*New Login Page*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: "Poppins", serif;
}

.min-w100 {
    min-width: 100%;
}

.gridContainer {
    width: 100%;
    height: calc(100vh - 132px);
    display: inline-grid;
    gap: 10px;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, calc(25% - 8px));
    grid-auto-flow: row;
    grid-template-areas: "gridItem11 gridItem12 gridItem13"
        "gridItem21 gridItem22 gridItem23"
        "gridItem31 gridItem32 gridItem32"
        "gridItem41 gridItem42 gridItem43";
}

.gridItem > div img {
    position: absolute;
    bottom: 30px;
    right: 30px;
}

.gridItem > div .gridSlide img {
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    height: 100%;
    object-fit: cover;
    min-height: 100%;
}

.owl-stage-outer, .owl-stage, .owl-item {
    height: 100%;
}

.gridItem > div {
    width: 100%;
    height: 100%;
    position: relative;
    border-radius: 46px;
    overflow: hidden;
    padding: 30px;
}

    .gridItem > div :is(p, h5) {
        color: white;
    }

.gridItem32 > div h5 {
    font-size: 17px;
}

.gridItem32 > div p {
    font-size: 14px;
}

.gridItem11 > div {
    background: url('../images/noice-effect/noise/green-400.png');
    background-position: center;
}

.ACP-logo img {
    width: 130px;
}

.gridItem12 > div {
    background: url('../images/noice-effect/noise/blue-400.png');
    background-position: center;
}

.gridItem13 > div {
    background: url('../images/noice-effect/img/1.jpg');
    background-position: center;
}

.gridItem21 > div {
    background: url('../images/noice-effect/img/4.png');
    background-position: center;
}

.gridItem22 > div {
    background: url('../images/noice-effect/noise/black-400.png');
    background-position: center;
}

.gridItem23 > div {
    background: url('../images/noice-effect/noise/blue-400.png');
    background-position: center;
}

.gridItem31 > div {
    background: url('../images/noice-effect/noise/blue-400.png');
    background-position: center;
}

.gridItem32 > div {
    background: url('../images/noice-effect/img/Avere-Southside-Quarter-7927-Web-b446ef907eafa2d2c603f33a34e8ff43.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.gridItem41 > div {
    background: url('../images/noice-effect/img/5.png');
    background-position: center;
}

.gridItem42 > div {
    background: url('../images/noice-effect/noise/green-400.png');
    background-position: center;
}

.gridItem43 > div {
    background: url('../images/noice-effect/noise/blue-400.png');
    background-position: center;
}

.gridItem11 > div::after {
    content: "";
    position: absolute;
    top: 0;
    right: 30px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/green-p-1.svg);
    background-repeat: no-repeat;
    background-position: top right;
}

.gridItem12 > div::after {
    content: "";
    position: absolute;
    top: 30px;
    right: 0px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/blue-p-2.svg);
    background-repeat: no-repeat;
    background-position: top left;
}

.gridItem22 > div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/pattern-5.svg);
    background-repeat: no-repeat;
    background-position: bottom left;
}

.gridItem23 > div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/pattern-6.png);
    background-repeat: no-repeat;
    background-position: top left;
}

.gridItem31 > div::after {
    content: "";
    position: absolute;
    top: 30px;
    right: 0px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/blue-p-2.svg);
    background-repeat: no-repeat;
    background-position: top left;
}

.gridItem42 > div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/pattern-10.svg);
    background-repeat: no-repeat;
    background-position: bottom left;
}

.gridItem43 > div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    z-index: 1;
    background-image: url(../images/noice-effect/pattern/pattern-6.png);
    background-repeat: no-repeat;
    background-position: top left;
}


.slideshow-container {
    max-width: 100%;
    position: relative;
    margin: auto;
}

@media (max-width: 1919px) {
    .img-compnent {
        display: none !important;
    }

    .image-container-height {
        display: block !important;
    }
}

@media (max-width: 1024px) {
    .login-hide-lg-view {
        display: block;
    }
}

.image-container-height {
    width: 100%;
    display: flex;
    justify-content: end;
}


.img-compnent {
    display: none;
}


.gridItem32 {
    grid-area: gridItem32;
}

.gridItem11 {
    grid-area: gridItem11;
}

.gridItem12 {
    grid-area: gridItem12;
}

.gridItem13 {
    grid-area: gridItem13;
}

.gridItem21 {
    grid-area: gridItem21;
}

.gridItem22 {
    grid-area: gridItem22;
}

.gridItem23 {
    grid-area: gridItem23;
}

.gridItem31 {
    grid-area: gridItem31;
}

.gridItem41 {
    grid-area: gridItem41;
}

.gridItem42 {
    grid-area: gridItem42;
}

.gridItem43 {
    grid-area: gridItem43;
}

.image-container-height {
    height: calc(100vh - 134px);
    object-fit: cover;
}


.login-wrapper {
    background-image: url('../images/bg-border.png');
    height: 100vh;
    padding: 26px;
}

.login-page {
    background: white;
    height: auto;
    border-radius: 36px;
    padding: 40px;
    position: relative;
    box-shadow: inset 0 0 0 20px #A4D1FF;
}

    .login-page::before {
        border: 20px solid #a4d1ff;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        content: "";
        border-radius: 66px;
        z-index: -1;
    }

.r-text-style {
    color: #707070;
    font-size: 14px;
    font-weight: 400;
}

.f-text-style-forgot {
    color: #242424;
    font-size: 14px;
    text-decoration: none;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.ACP-logo {
    padding: 28px;
}

.head-text {
    color: #232323;
    font-size: 31px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.sub-head-text {
    color: #969696;
    font-size: 16px;
    font-weight: 400;
    padding-top: 6px;
}

.head-text::before {
    content: "";
    display: inline-block;
    border-radius: 0px 50px 22px 22px;
    width: 8px;
    height: 36px;
    background-color: #39CC5F;
    margin-right: 10px;
}

.form-inner {
    max-width: 562px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: calc(100% - 102px);
    justify-content: center;
    margin-top: -40px;
}

.login-page .heading {
    padding-bottom: 32px;
}

.acp-email,
.acp-lock {
    padding-left: 50px;
    height: 60px !important;
    background: #F9FAFB;
    border: 1px solid #EDEDED;
    border-radius: 36px !important;
}

.email-icon {
    position: absolute;
    top: 24px;
    left: 20px;
}

.lock-icon {
    position: absolute;
    top: 19px;
    left: 20px;
}

img.eye-icon-login {
    position: absolute;
    top: 0px;
    bottom: 0;
    transform: translate(0px, 17px);
    right: 24px;
}

.ACP-login-inputs {
    display: grid;
    gap: 46px;
}

.acp-primary-btn {
    border: none;
    color: white;
    background-color: #01509F;
    width: 100%;
    border-radius: 25px;
    padding: 10px;
    height: 60px;
    margin-top: 60px;
}

    .acp-primary-btn:hover {
        background-color: #3eb35c;
    }

.checkbox-wrapper-4 * {
    box-sizing: border-box;
}

.checkbox-wrapper-4 .cbx {
    cursor: pointer;
}

    .checkbox-wrapper-4 .cbx span {
        float: left;
        vertical-align: middle;
        transform: translate3d(0, 0, 0);
    }

        .checkbox-wrapper-4 .cbx span:first-child {
            position: relative;
            width: 18px;
            height: 18px;
            border-radius: 4px;
            transform: scale(1);
            border: 1px solid #cccfdb;
            transition: all 0.2s ease;
            box-shadow: 0 1px 1px rgba(0, 16, 75, 0.05);
        }

            .checkbox-wrapper-4 .cbx span:first-child svg {
                position: absolute;
                top: 3px;
                left: 2px;
                fill: none;
                stroke: #fff;
                stroke-width: 2;
                stroke-linecap: round;
                stroke-linejoin: round;
                stroke-dasharray: 16px;
                stroke-dashoffset: 16px;
                transition: all 0.3s ease;
                transition-delay: 0.1s;
                transform: translate3d(0, 0, 0);
            }

        .checkbox-wrapper-4 .cbx span:last-child {
            padding-left: 8px;
            line-height: 18px;
        }

.checkbox-wrapper-4 .inp-cbx {
    position: absolute;
    visibility: hidden;
}

    .checkbox-wrapper-4 .inp-cbx:checked + .cbx span:first-child {
        background: #39CC5F;
        border-color: #EDEDED;
        animation: wave-4 0.4s ease;
    }

        .checkbox-wrapper-4 .inp-cbx:checked + .cbx span:first-child svg {
            stroke-dashoffset: 0;
        }

.checkbox-wrapper-4 .inline-svg {
    position: absolute;
    width: 0;
    height: 0;
    pointer-events: none;
    user-select: none;
}

.bottom-pattern {
    position: absolute;
    bottom: -23px;
    width: 100%;
    text-align: center;
}

    .bottom-pattern img {
        max-width: 100%;
    }

.otp-text-box .otp-verifcation {
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    width: 60px;
    height: 60px !important;
    opacity: 0.91;
    background: #F9FAFB;
    border: 1px solid #cbcbcb;
    border-radius: 36px !important;
}

.Forgot-pass-color a {
    color: #1a1b1b;
    font-size: 18px;
    font-weight: 500;
    text-decoration: none;
}

.label-otp-screen {
    color: #666666;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

/*Login Css End*/


.email-flag.complete {
    color: #04AA6D;
}


.follow-up-btn {
    border-radius: 35px;
}

i.fa.fa-calendar.date-picker-icon-follow {
    position: absolute;
    top: 10px;
    color: #7c7c7c;
    right: 18px;
}

.jobNameTypeEllipses {
    max-width: 115px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.email-flag.complete {
    color: #04AA6D;
}


.follow-up-btn {
    border-radius: 35px;
}

i.fa.fa-calendar.date-picker-icon-follow {
    position: absolute;
    top: 10px;
    color: #7c7c7c;
    right: 18px;
}


/*==Change Password==*/
.change-password-he {
    height: calc(100vh - 600px)
}

i.fa.fa-eye.eyebtn-change-pass {
    position: absolute;
    right: 0;
    transform: translate(-17px, 10px);
}

.bg-change-patter {
    width: 100%;
    position: absolute;
    bottom: 0px;
}

    .bg-change-patter img {
        width: 100%;
    }

.chatbox-received-username {
    color: blueviolet;
    font-weight: bold;
}

.chatbox-sent-username {
    color: green;
    font-weight: bold;
}

.chatbox-span-flex {
    flex-grow: 1;
}

/*#userlistNew {
    border: 1px solid #ccc;
    background-color: white;
    position: absolute;
    z-index: 1000;
}*/

/*21th march 2025*/
input.draggable-heading{
    border:none;
    border-radius:unset !important;
        font-weight:400 !important;
}
.billing-info-card > .card{
    height:96%;
}
/*tr td.heading-title, tr.heading-title{
    font-weight:400;
    padding:7px !important;
}*/
table#ApproveTakeOffTemplatePartList tr td.heading-title,
table#ApproveTakeOffTemplatePartList tr.heading-title td {
    font-weight: 400;
    padding: 7px !important;
}
/*.table-button button {
    height:20px;
    margin-top:0;
}*/
table.table-customize tbody tr td {
    padding: 0;    
}