@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap");

@font-face {
    font-family: 'Roboto-Medium';
    src: url('../../fonts/Roboto-Medium.ttf') format('truetype')
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('../../fonts/Roboto-Regular.ttf') format('truetype')
}

html {
    scroll-behavior: smooth
}

.OnHold_Details_model fieldset {
    border-radius: 2px;
    border: solid 1px #e7e7e7;
    padding: 10px;
}

.OnHold_Details_model .block {
    margin-bottom: 15px;
}

.OnHold_Details_model fieldset legend {
    margin: 0 5px;
    padding: 0 5px;
    width: auto;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.OnHold_Details_model table, th, td {
    padding: 0;
    vertical-align: top;
}

.OnHold_Details_model table, th, td {
    padding: 0;
    vertical-align: top;
}

.OnHold_Details_model .block fieldset p {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    /* line-height: 1.71; */
    letter-spacing: 0.13px;
    color: #000;
    margin: 0;
    /*font-weight: 500;*/
    /* word-break: break-word; */
}

    .OnHold_Details_model .block fieldset p span {
        color: #848484;
    }

.OnHold_Details_model .modal-content {
    width: 100%;
}

.OnHoldPhotos fieldset .image-section {
    display: flex;
    justify-content: flex-start;
    padding-top: 0px;
    gap: 1rem;
}

    .OnHoldPhotos fieldset .image-section a:hover, .OnHoldPhotos fieldset .image-section a:focus {
        text-decoration: none;
    }

.lbl_OnHold {
    background: #5b605b;
    color: #fff;
    padding: 5px 12px;
    border-radius: 4px;
    margin: 0;
    border: none;
}

    .lbl_OnHold:hover {
        color: #fff;
        text-decoration: none;
    }
.lbl_Completed {
    background: #03de73;
    color: #fff;
    padding: 5px 12px;
    border-radius: 4px;
    margin: 0;
    border: none;
}

    .lbl_Completed:hover {
        color: #fff;
        text-decoration: none;
    }

.lbl_RIStatus {
    background: #c3002f;
    color: #fff;
    padding: 5px 12px;
    border-radius: 4px;
    margin: 0;
    border: none;
}

    .lbl_RIStatus:hover {
        color: #fff;
        text-decoration: none;
    }

.OnHold_Details_head {
    display: flex;
    font-size: 1.7rem;
    align-items: center;
}

.lbl_textred {
    color: #C3002F;
    text-transform: uppercase;
    margin: 0 0 0 15px;
}

.lbl_textblack {
    color: #333;
    text-transform: uppercase;
    margin: 0 0 0 10px;
}
a.lbl_red:hover {
    cursor: pointer;
    text-decoration: none;
}
/*.OnHold_Details_model .modal-body {
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    padding: 0 15px 0 15px;
}*/
body {
    font-family: 'Roboto',sans-serif;
    /*background-color: #f6f8f8;*/
    padding: 72px 0 0 206px;
    padding-right: 0 !important;
}

.ml-4 {
    margin-left: 4px;
}
.ml-5 {
    margin-left: 3rem;
}
.mr-4 {
    margin-right: 4px;
}

.mr-5 {
    margin-right: 5px;
}

.mt-10 {
    margin-top: 10px !important;
}

.mt-20 {
    margin-top: 20px;
}

.mt-0 {
    margin-top: 0px !important;
}

.mb-5 {
    margin-bottom: 5px !important;
}

.mb-10 {
    margin-bottom: 10px;
}

.ml-10 {
    margin-left: 10px !important;
}

.mt-120 {
    margin-top: 120px;
}
.w-15 {
    width: 15%;
}
.w-60 {
    width: 60%;
}

.navbar-brand > img {
    width: 157px;
    max-width: 100%;
}

.pt-0 {
    padding-top: 0px !important;
}

.plr-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.pop-item-details table tr th {
    color: #848484;
    padding-bottom: 5px;
}

.pop-tech-note table tr td {
    vertical-align: top;
}

.text-field .input-group {
    width: 100%;
}

#enquiryadd {
    padding-right: 32px;
}

.top-head-issued h4 a img {
    width: 30px;
    margin-right: 20px;
}

.top-head-issued h4 a:hover img {
    cursor: pointer;
    filter: brightness(0.5);
}

.top-head-issued {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    align-items: center;
}

.top-head-used h4 a img {
    width: 30px;
    margin-right: 20px;
}

.top-head-used h4 a:hover img {
    cursor: pointer;
    filter: brightness(0.5);
}

.top-head-used {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    align-items: center;
}

.color-red {
    color: #C3002F;
}

.color-green {
    color: #009587;
}

.mid-head-issued {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.qtydetails .table > tbody > tr > td {
    vertical-align: middle;
}

.qtydetails .table .view_details {
    font-size: 12px;
    font-weight: 500;
    color: #c3002f;
    cursor: pointer;
    white-space: nowrap;
}
/*-----------qty update-------------*/
.sect-btnqytupdate {
    display: flex;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 2px;
    padding: 0px;
}

    .sect-btnqytupdate input {
        border: none;
        width: 100%;
    }

    .sect-btnqytupdate a {
        padding: 6px 10px;
        color: #9A9FAA;
        cursor: pointer;
    }

        .sect-btnqytupdate a i {
            -webkit-text-stroke: 0.5px #FFFFFF;
        }
/*-----------inventory tabs-------------*/
.tabs-custom .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: #fff;
    cursor: default;
    background-color: #353935;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}
#myProfile .tabs-custom .nav-tabs > li > a.active, #myProfile .nav-tabs > li > a.active:focus, #myProfile .nav-tabs > li > a.active:hover {
    color: #fff;
    cursor: default;
    background-color: #353935;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

.tabs-custom .nav-tabs > li > a {
    color: #353935;
    font-weight: 500;
    border-color: #ddd;
    margin-right: 0px;
    border-radius: unset;
}

.tabs-custom .nav-tabs > li:first-child > a {
    border-radius: 4px 0 0 4px;
}

.tabs-custom .nav-tabs > li > a:hover {
    border-bottom: none;
}

.tabs-custom .nav-tabs > li {
    float: none;
    margin-bottom: -1px;
    width: 100%;
    display: block;
    text-align: center;
}

.tabs-custom .nav-tabs {
    border-bottom: 1px solid #ddd;
    display: flex;
}

.tabs-custom .task_header {
    grid-template-columns: 300px auto;
}

    .tabs-custom .task_header .main {
        margin-top: 0;
        width: 100%;
    }

.tbl-itminventory-img img {
    width: 20px;
    height: 20px;
}

.tbl-itminventory-item img {
    border: 1px solid #ddd;
    margin-right: 7px;
}
/*--------------------------------------*/
.pop-top-title {
    display: flex;
    justify-content: space-between;
}

    .pop-top-title h5, .pop-top-title p {
        margin: 0;
    }

.pop-sub-tittle {
    margin-bottom: 0;
}

.align-items-center {
    align-items: center;
}

.add_task.btn-info:active:hover {
    color: #ffc2c2;
    background-color: #c3002f;
    border-color: #c3002f;
}

.mr-10 {
    margin-right: 10px !important;
}

.slick-vertical .slick-slide {
    padding: 0px 0;
}

.screen-center {
    /*position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 500px;
    min-width: 20rem;*/
}

.screen-center-signup {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 1%);
    width: 500px;
    min-width: 20rem;
    padding-bottom: 0.5rem;
}

.login_section {
    width: 100%;
    background-color: #fff;
    /*-webkit-box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.14);*/
    padding: 3rem 0;
}

    /*.login_section {
    width: 500px;
    margin: 0 auto;
    background-color: #fff;
    -webkit-box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.14);
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 550px
}*/

    .login_section .logo {
        width: 100%;
        height: 75px;
        margin: 0 auto;
        display: block;
    }

/*.login_section .logo {
        width: 300px;
        height: auto;
        margin: 0 auto;
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding-top: 75px
    }*/

.login-version {
    margin: 0;
    font-size: 14px;
    opacity: 0.4;
    color: #000;
    font-weight: bold;
    cursor: pointer;
    text-align: center;
    display: block;
    margin-top: 5rem;
}

.login_section .login_body {
    text-align: center
}

    .login_section .login_body h1 {
        font-style: normal;
        font-weight: normal;
        font-size: 30px;
        line-height: 26px;
        text-align: center;
        letter-spacing: 0.666667px;
        color: #10131F;
    }

.login_section .otp-body {
    display: none;
    text-align: center;
    /*margin-bottom: 5rem;*/
}

    .login_section .otp-body .sub-line {
        font-style: normal;
        font-weight: normal;
        font-size: 15px;
        line-height: 18px;
        text-align: center;
        color: #9A9FAA;
    }

    .login_section .otp-body h1 {
        font-style: normal;
        font-weight: normal;
        font-size: 30px;
        line-height: 26px;
        text-align: center;
        letter-spacing: 0.666667px;
        color: #10131F;
    }

    .login_section .otp-body .otp-form {
        padding: 0px 18%;
    }

        .login_section .otp-body .otp-form .input-section {
            margin: 3rem 0rem;
        }

            .login_section .otp-body .otp-form .input-section div {
                display: flex;
                flex-wrap: nowrap;
                gap: 20px;
            }

        .login_section .otp-body .otp-form .footer-section {
            margin: 3rem 0rem;
            font-style: normal;
            font-weight: normal;
            font-size: 15px;
            line-height: 18px;
            text-align: center;
            color: #888888;
        }

            .login_section .otp-body .otp-form .footer-section a {
                font-style: normal;
                font-weight: 600;
                font-size: 15px;
                line-height: 18px;
                color: #C3002F;
                cursor: pointer;
            }

        .login_section .otp-body .otp-form .input-section input {
            width: 100%;
            border: none;
            border: 1px solid #9A9FAA;
            font-style: normal;
            font-weight: 500;
            font-size: 18px;
            line-height: 22px;
            display: flex;
            align-items: center;
            text-align: center;
            color: #1D2536;
            outline: none;
            font-weight: bold;
            font-size: 32px;
            letter-spacing: 27px;
            color: #c3002f;
            padding: 10px 0px 10px 20px;
            border-radius: 10px;
            background: #fbfbfb;
            text-align: center;
        }

        .login_section .otp-body .otp-form .btn {
            padding: 10px 0;
            border-radius: 6px;
            -webkit-box-shadow: 0 10px 24px 0 rgb(0 0 0 / 8%);
            box-shadow: 0 10px 24px 0 rgb(0 0 0 / 8%);
            background-color: #c3002f;
            border: none;
            font-weight: 500;
            font-size: 16px;
            letter-spacing: 2px;
            width: 100%;
            text-transform: uppercase;
            outline: none;
        }

        .login_section .otp-body .otp-form .back-btn {
            cursor: pointer;
        }

.login_section .login_body .sub-line {
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
    text-align: center;
    color: #9A9FAA;
}

.login_section .login_body .credentials {
    font-weight: normal;
    font-size: 18px;
    color: #10131f;
    width: 70%;
    margin: 0 auto;
    margin-bottom: 10px
}

.login_form .btn-primary:active:focus, .login_form .btn:active:focus, .login_form .btn:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.login_form .btn-primary:not(:disabled):not(.disabled):active {
    color: #fff;
    background-color: #c3002f;
    border-color: #c3002f;
}

.login_section .login_form {
    /*padding: 0px 22%;*/
    padding: 0px 18%;
}

    .login_section .login_form .text-field {
        margin-bottom: 8px;
    }

    .login_section .login_form select {
        text-transform: uppercase;
        border: solid 1px #dedede;
        border-radius: 0px;
    }

    .login_section .login_form input {
        border: solid 1px #dedede;
        border-radius: 6px;
        color: #000;
    }

        .login_section .login_form input::placeholder {
            color: #000;
        }

    .login_section .login_form .action-section {
        margin-top: 20px;
    }

    .login_section .login_form .footer-section {
        font-family: Roboto;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 24px;
        color: #343434;
        margin-top: 5rem;
    }

        .login_section .login_form .footer-section a {
            color: #c3002f;
            cursor: pointer;
        }

    .login_section .login_form .form-control {
        border: solid 1px #5d5d5d;
        opacity: 0.8;
        border-radius: 0px
    }

    .login_section .login_form .mobileContainer {
        display: block;
    }

    .login_section .login_form .emailContainer {
        display: none;
    }

    .login_section .login_form .forgot_password {
        text-align: left;
        margin-top: 5px;
        margin-bottom: 1rem
    }

        .login_section .login_form .forgot_password a {
            font-size: 14px;
            opacity: 0.4;
            color: #000;
            cursor: pointer
        }

            .login_section .login_form .forgot_password a:hover {
                color: #c3002f;
                opacity: initial
            }

    .login_section .login_form .btn {
        padding: 10px 0;
        border-radius: 6px;
        -webkit-box-shadow: 0 10px 24px 0 rgba(0, 0, 0, 0.08);
        box-shadow: 0 10px 24px 0 rgba(0, 0, 0, 0.08);
        background-color: #c3002f;
        border: none;
        font-weight: 500;
        font-size: 16px;
        letter-spacing: 2px;
        width: 100%;
        text-transform: uppercase;
        outline: none;
    }

        .login_section .login_form .btn:hover {
            background-color: #9F1B29
        }

.login_section .not_yet {
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #343434;
    margin-bottom: 0
}

    .login_section .not_yet a {
        color: #c3002f;
        cursor: pointer
    }

@media only screen and (max-width: 520px) {
    .screen-center {
        width: 95%;
    }

    .screen-center-signup {
        width: 95%;
    }
    /*.login_section {
        min-width: 100%;
    }*/
    .login_section .login_form {
        /*padding: 0px 18%;*/
        padding: 0px 12%;
    }

    .login_section .otp-body .otp-form {
        padding: 0px 12%;
    }

    .otp-section {
        padding: 4rem 2rem !important;
    }
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #353935;
    border-color: #353935
}

::-webkit-input-placeholder {
    color: #5d5d5d !important;
    opacity: 0.3
}

::-moz-placeholder {
    color: #5d5d5d !important;
    opacity: 0.3
}

:-ms-input-placeholder {
    color: #5d5d5d !important;
    opacity: 0.3
}

:-moz-placeholder {
    color: #5d5d5d !important;
    opacity: 0.3
}

.navbar-default {
    -webkit-box-shadow: 0 2px 4px 0 rgba(212, 212, 212, 0.5);
    box-shadow: 0 2px 4px 0 rgba(212, 212, 212, 0.5);
    background-color: #fff;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    min-height: 70px
}

    .navbar-default .profile_image {
        border-radius: 50%;
        height: 40px;
        width: 40px;
        margin-right: 5px
    }

    .navbar-default .navbar-right .dropdown a .caret {
        border-top: 6px dashed;
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
    }

    .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbarnav > .open > a:hover {
        background-color: transparent !important
    }

.navbar-nav > li > a {
    line-height: 40px
}

.navbar-nav > li > .dropdown-menu > li > a > i {
    font-size: 22px;
    top: 2px;
    position: relative;
    opacity: 0.4;
    color: #000;
    margin-right: 2px;
    width: 22px;
}

/*#signup {
    width: 700px;
    margin: 0 auto;
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 15px 1px rgba(162, 162, 162, 0.28);
    box-shadow: 0px 0px 15px 1px rgba(162,162,162,0.28);
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: table;
    height: auto
}*/
.table-cells {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    padding: 70px 0
}

.login_section .table-cells .logo {
    padding-top: 0
}

.login_section .table-cells .signup_form .form-inline .text-danger {
    float: left;
    margin-left: 0;
    margin-bottom: -10px
}

.login_section .table-cells .signup_form .form-inline {
    align-items: flex-start
}

.login_section .reg-otp-summary h1 {
    font-style: normal;
    font-weight: normal;
    font-size: 30px;
    line-height: 26px;
    text-align: center;
    letter-spacing: 0.666667px;
    color: #10131F;
}

.login_section .reg-otp-summary .sub-line {
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
    text-align: center;
    color: #9A9FAA;
}

.login_section .reg-otp-summary .back-btn {
    text-align: center;
    cursor: pointer;
    margin-top: 2rem;
}

#signup #regContainer {
    display: block;
}

#signup #regOtpContainer {
    display: none;
    margin-top: 3rem;
    margin-bottom: 2rem;
}

    #signup #regOtpContainer .otp-form .input-section {
        margin: 2rem 0rem;
    }

#signup #regSummaryContainer {
    display: none;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

    #signup #regSummaryContainer .no-of-field-workers-section {
        position: relative;
        text-align: center;
        border: solid 1px #dedede;
        padding: 10px 10px 5px;
        margin-top: 15px;
    }

        #signup #regSummaryContainer .no-of-field-workers-section label {
            position: absolute;
            top: -14px;
            left: 8px;
            background: #ffffff;
            padding: 0px 5px;
            color: rgba(0,0,0,0.6);
        }

        #signup #regSummaryContainer .no-of-field-workers-section .d-flex {
            justify-content: space-between;
            padding-left: 4px;
        }

            #signup #regSummaryContainer .no-of-field-workers-section .d-flex div {
                font-size: 14px;
                font-weight: 600;
            }

        #signup #regSummaryContainer .no-of-field-workers-section input[type=range] {
            width: 100%;
            border: none;
        }

        #signup #regSummaryContainer .no-of-field-workers-section input[type=text] {
            text-align: center;
            width: 30%;
            border-radius: 4px;
        }

        #signup #regSummaryContainer .no-of-field-workers-section small {
            font-size: 70%;
            color: #dc3545;
        }

/*Range Styling start*/
.no-of-field-workers-section input[type=range] {
    height: 33px;
    -webkit-appearance: none;
    /*margin: 10px 0;*/
    width: 100%;
}

    .no-of-field-workers-section input[type=range]:focus {
        outline: none;
    }

    .no-of-field-workers-section input[type=range]::-webkit-slider-runnable-track {
        width: 100%;
        height: 8px;
        cursor: pointer;
        animate: 0.2s;
        box-shadow: 1px 1px 1px #000000;
        background: #C3002F;
        border-radius: 6px;
        border: 0px solid #000000;
    }

    .no-of-field-workers-section input[type=range]::-webkit-slider-thumb {
        box-shadow: 1px 1px 8px #000000;
        border: 1px solid #000000;
        height: 25px;
        width: 15px;
        border-radius: 4px;
        background: #FFFFFF;
        cursor: pointer;
        -webkit-appearance: none;
        margin-top: -9px;
    }

    .no-of-field-workers-section input[type=range]:focus::-webkit-slider-runnable-track {
        background: #C3002F;
    }

    .no-of-field-workers-section input[type=range]::-moz-range-track {
        width: 100%;
        height: 8px;
        cursor: pointer;
        animate: 0.2s;
        box-shadow: 1px 1px 1px #000000;
        background: #C3002F;
        border-radius: 6px;
        border: 0px solid #000000;
    }

    .no-of-field-workers-section input[type=range]::-moz-range-thumb {
        box-shadow: 1px 1px 8px #000000;
        border: 1px solid #000000;
        height: 25px;
        width: 15px;
        border-radius: 4px;
        background: #FFFFFF;
        cursor: pointer;
    }

    .no-of-field-workers-section input[type=range]::-ms-track {
        width: 100%;
        height: 8px;
        cursor: pointer;
        animate: 0.2s;
        background: transparent;
        border-color: transparent;
        color: transparent;
    }

    .no-of-field-workers-section input[type=range]::-ms-fill-lower {
        background: #C3002F;
        border: 0px solid #000000;
        border-radius: 12px;
        box-shadow: 1px 1px 1px #000000;
    }

    .no-of-field-workers-section input[type=range]::-ms-fill-upper {
        background: #C3002F;
        border: 0px solid #000000;
        border-radius: 12px;
        box-shadow: 1px 1px 1px #000000;
    }

    .no-of-field-workers-section input[type=range]::-ms-thumb {
        margin-top: 1px;
        box-shadow: 1px 1px 8px #000000;
        border: 1px solid #000000;
        height: 25px;
        width: 15px;
        border-radius: 4px;
        background: #FFFFFF;
        cursor: pointer;
    }

    .no-of-field-workers-section input[type=range]:focus::-ms-fill-lower {
        background: #C3002F;
    }

    .no-of-field-workers-section input[type=range]:focus::-ms-fill-upper {
        background: #C3002F;
    }
/*Range Styling end*/

#signup .table-cells .btn {
    grid-column-start: 1;
    grid-column-end: 3;
    margin-top: 10px;
    margin-bottom: 10px;
}

#signup .form-inline {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 20px
}

#signup .btn {
    padding: 9px 50px;
    border-radius: 6px;
    -webkit-box-shadow: 0 10px 24px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 10px 24px 0 rgba(0, 0, 0, 0.08);
    background-color: #c3002f;
    border: none;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
    margin: 0 auto;
    cursor: pointer
}

}

#signup .btn:hover {
    background-color: #9F1B29
}

.form-inline .form-control {
    display: inline-block;
    width: 90%;
    vertical-align: middle;
    margin: 10px 12px
}

.signup_form {
    padding: 0px 5%
}

.analytics {
    /*display: flex*/
}

nav {
    border: solid 1px #e5e5e5;
    background-color: #fff
}

    nav ul {
        list-style: none;
        padding: 0px;
        position: -webkit-sticky;
        position: sticky;
        top: 0
    }

        nav ul .link {
            position: relative;
            display: block;
            /*padding: 18px 10px;*/
            cursor: pointer;
            font-size: 16px;
            border-left: 4px solid #fff
        }

            nav ul .link:hover {
                border-left: 4px solid #c22032;
                background-color: #fafafa
            }

            nav ul .link a {
                color: rgba(0, 0, 0, 0.87);
                text-decoration: none
            }

                nav ul .link a:hover {
                    color: #c22032;
                }

            nav ul .link span {
                margin-left: 10px;
                font-family: 'Roboto',sans-serif;
                font-size: 14px;
                font-weight: bold;
                text-decoration: none;
                white-space: nowrap;
            }

        nav ul .active {
            border-left: 4px solid #c22032;
            background-color: #fafafa
        }

            nav ul .active a {
                color: #c22032;
                font-family: 'Roboto',sans-serif;
                font-size: 14px;
                font-weight: 500;
                text-decoration: none
            }

    nav .quick_link {
        padding: 18px 20px
    }

        nav .quick_link P {
            font-size: 14px;
            color: #10131f;
            margin-bottom: 20px;
            font-weight: 500
        }

        nav .quick_link ul li {
            margin-bottom: 20px
        }

            nav .quick_link ul li button {
                width: 150px;
                padding: 4px 10px;
                text-align: left;
                background-color: transparent;
                border: 1px solid;
                border-radius: 6px;
                border: solid 1px rgba(0, 0, 0, 0.12);
                font-size: 14px;
                font-weight: 500;
                color: rgba(0, 0, 0, 0.87)
            }

                nav .quick_link ul li button img,
                nav .quick_link ul li a button img {
                    height: 22px;
                    margin-top: -4px;
                }

                nav .quick_link ul li button:hover {
                    background-color: #e5e5e5
                }

                nav .quick_link ul li button:focus {
                    outline: 0
                }

.navbar-fixed-left nav.side_nav {
    width: 206px;
    position: fixed;
    border-radius: 0;
    z-index: 99;
    top: 71px;
    left: 0;
    bottom: 0;
}

.navbar-fixed-left nav ul {
    position: unset;
    /*max-height: calc(100vh/1.2);*/
    overflow-y: auto;
}

.side_nav ul.custom-scrollbar {
    padding-bottom: 25px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 5px;
    background-color: #F5F5F5;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #c3002f;
}

nav.side_nav li img {
    width: 24px;
    height: 24px;
    /*filter: brightness(0);*/
}

nav.side_nav li.link.dropdown {
    border-left: none;
    padding: 0px;
}

    nav.side_nav li.link.dropdown:hover {
        border-left: none;
        background-color: inherit !important;
    }

    nav.side_nav li.link.dropdown .nav-item {
        border-left: 4px solid #fff;
        padding: 18px 10px;
        position: relative;
    }

        nav.side_nav li.link.dropdown .nav-item:hover {
            border-left: 4px solid #c22032;
            background-color: #fafafa;
        }

        nav.side_nav li.link.dropdown .nav-item .item-toggle {
            position: absolute;
            right: 15px;
        }

    nav.side_nav li.link.dropdown .sub-menu {
        border-top: 1px solid rgb(229, 229, 229);
        border-bottom: 1px solid rgb(229, 229, 229);
        /*padding: 0px 5px 0 15px;*/
        box-shadow: 0 0 3px #ccc;
        display: none;
    }

        nav.side_nav li.link.dropdown .sub-menu .link {
            /*margin: 6px 0;
    border-radius: 4px;
    -moz-box-shadow: 0 0 3px #ccc;
    -webkit-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
    padding: 5px 5px;*/
        }

.new-quick-link {
    position: fixed;
    bottom: 10px;
    right: 18px;
    z-index: 1;
    text-align: right;
}

    .new-quick-link .btn {
        color: #FFFFFF;
        border-color: #FFFFFF;
        background-color: #c22032;
        padding: 9px 9.5px;
    }
        .new-quick-link .btn:hover {
            color: #FFFFFF;
            border-color: #333333;
            background-color: #333333;
        }
            .new-quick-link .btn:hover i {
                -webkit-text-stroke: 4px #333333;
            }
        .new-quick-link .btn i {
            -webkit-text-stroke: 4px #C22032;
            font-size: 2.2em;
        }

    .new-quick-link.show .btn {
        padding: 7.5px 8.5px;
    }

        .new-quick-link.show .btn i {
            transform: rotate(45deg);
            margin-left: -1px;
            margin-top: 0.5px;
        }

    /*For icon only*/
    /*.new-quick-link .items .item {
    color: #4e73df;
    background: #FFFFFF; 
    margin: 15px 0;
    text-align: center;
    border: solid 1px;
    border-radius: 50%;
    padding: 9px 5px 9px 5px;
    -webkit-box-shadow: -1px 1px 12px 2px rgba(0,0,0,0.75);
    -moz-box-shadow: -1px 1px 12px 2px rgba(0,0,0,0.75);
    box-shadow: -1px 1px 12px 2px rgba(0,0,0,0.75);
    display: none;
}*/
    .new-quick-link.show .items {
        padding: 5px 10px;
    }

    .new-quick-link .items {
        width: 100%;
        background-color: rgba(255,255,255,1);
        /*padding: 8px 19px;*/
        padding: 5px 10px;
        /* margin-left: -20px;
        margin-right: 20px;*/
        transition: 1s ease-in-out;
        border: 1px solid #ddd;
        border-radius: 10px;
        margin-bottom: 5px;
    }

        .new-quick-link .items .item {
            background: #FFFFFF;
            margin: 15px 0;
            /*border: solid 1px;*/
            border-radius: 6px;
            /*padding: 5px 10px;*/
            white-space: nowrap;
            width: 130px;
            -webkit-box-shadow: -1px 1px 12px 1px rgba(0,0,0,0.2);
            -moz-box-shadow: -1px 1px 12px 1px rgba(0,0,0,0.2);
            box-shadow: -1px 1px 12px 1px rgba(0,0,0,0.2);
            display: none;
        }

body .btn {
    padding: 6px 18px;
}

.new-quick-link .items .item button {
    padding: 6px 8px 4px;
    text-align: left;
    background-color: transparent;
    border: none;
    font-weight: 500;
    width: 100%;
    color: rgba(0, 0, 0, 0.87);
}

    .new-quick-link .items .item button img {
        margin-top: -3px;
        margin-right: 10px;
        width: 24px;
        height: 24px;
    }


.grid_container {
    background-color: #ffffff;
    display: flex
}

    .grid_container #grid {
        display: -ms-grid;
        display: grid;
        grid-template-areas: "a a";
        grid-gap: 10px;
        grid-auto-columns: 69% 30%;
        -ms-grid-rows: 25px auto 25px auto;
        grid-template-rows: 25px auto 25px auto;
        padding: 2% 3%;
        border-right: solid 1px #e5e5e5
    }
@media (max-width: 1480px) {
    .sectRequsetedItems .page_header {
        -ms-grid-columns: 200px auto !important;
        grid-template-columns: 200px auto !important;
    }

    .select2-container {
        min-width: auto!important;
    }
}
@media (max-width: 1250px) {
    .grid_container #grid {
        grid-auto-columns: 59% 40%;
    }
}

.grid_container #grid .title {
    font-size: 14px;
    font-weight: 500;
    color: #101420;
    margin: 0;
    padding-bottom: 2px;
}

.grid_container #grid .title2 {
    font-size: 14px;
    font-weight: 500;
    color: #101420;
    margin: 0;
    padding-bottom: 2px;
    text-align: left;
}

.grid_container #grid .attendance_details {
    -ms-grid-row: 3;
    grid-row-start: 3;
    grid-row-end: 4
}

.grid_container #grid .item {
    border-radius: 5px;
    -webkit-box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff;
    display: grid;
    display: -ms-grid;
    grid-template-columns: 1fr 1fr;
    -ms-grid-columns: 1fr 1fr;
    padding: 1% 0px;
    position: relative;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (max-width: 1250px) {
    .grid_container #grid .item {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr
    }
}

.grid_container #grid #doughnut-chart {
    height: 160px !important;
    width: 160px !important;
    margin: 0 auto;
    position: relative
}

.grid_container #grid .total_days {
    position: absolute;
    top: 33%;
    text-align: center;
    width: 50%;
    left: 25%;
}

@media (max-width: 1250px) {
    .grid_container #grid .total_days {
        position: absolute;
        top: 26%;
        text-align: center;
        width: 100%;
        left: 0;
    }
}

.grid_container #grid .total_days p {
    margin: 0;
    font-size: 27px;
    color: #101420
}

.grid_container #grid .total_days span {
    font-size: 14px;
    color: #888
}

@media (max-width: 1250px) {
    .legend {
        margin: 0 auto
    }
}

.legend ul {
    list-style: none;
    padding: 0
}

    .legend ul li {
        margin: 0;
        width: 49%;
        display: -ms-inline-grid;
        display: inline-grid;
        -ms-grid-columns: auto 1fr;
        grid-template-columns: auto 1fr;
        grid-gap: 10px;
        padding: 12px 0
    }

@media (max-width: 1250px) {
    .legend ul li {
        width: auto
    }
}

.legend ul li .dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-top: 12px
}

.legend ul li .status.completed p {
    color: #03de73;
    font-weight: bold;
}

.legend ul li .status.ongoing p {
    color: #ff9b00;
    font-weight: bold;
}

.legend ul li .status.OnHold p {
    color: #353935;
    font-weight: bold;
}

.legend ul li .status.inactive p {
    color: #9a9faa;
    font-weight: bold;
}

.legend ul li .status.rejected p {
    color: #c3002f;
    font-weight: bold;
}

.legend ul li .status {
    margin: 0
}

    .legend ul li .status p {
        margin: 0px;
        color: #101420;
        font-size: 27px
    }

    .legend ul li .status span {
        font-weight: 500;
        font-size: 14px;
        line-height: 17px;
        color: #000000;
    }

.status {
    border: none
}

#two .estimate {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 3;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    /*padding: 5%;*/
    width: 50%;
}

.estimate_title {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
}

#two .estimate .today_estimate {
    /*display: table;*/
    width: 100%
}

    #two .estimate .today_estimate .right_side {
        display: table-cell;
        vertical-align: middle
    }

        #two .estimate .today_estimate .right_side p {
            font-size: 14px;
            color: #8f8f8f;
            margin: 0
        }

        #two .estimate .today_estimate .right_side span {
            font-size: 27px;
            font-weight: 500;
            color: #101420
        }

    #two .estimate .today_estimate .left_side {
        display: table-cell;
        float: right;
        text-align: center;
        margin-top: 10px
    }

        #two .estimate .today_estimate .left_side p {
            font-size: 14px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #03de73;
            margin: 0px
        }

            #two .estimate .today_estimate .left_side p img {
                margin-top: -4px
            }

        #two .estimate .today_estimate .left_side span {
            font-size: 12px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #54617a
        }

        #two .estimate .today_estimate .left_side .earned_money {
            color: #f52d56
        }

        #two .estimate .today_estimate .left_side .earned_money_time {
            font-weight: 400;
            font-size: 12px;
            line-height: 14px;
            color: #54617A;
            opacity: 0.5;
        }

.text-field {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    margin: .75em .5em .25em 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff
}

#signup .footer-section {
    margin-top: 2rem;
}

    #signup .footer-section p {
        margin-bottom: 0px;
    }

#signup .login_section {
    padding: 2.5rem 0;
}

.google-sign-section button {
    font-family: 'Roboto-Medium';
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    display: flex;
    line-height: 16px;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;
    justify-content: center;
    color: #121319;
    background: #FFFFFF;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    border: none;
    width: 100%;
    padding: 10px 0px;
    cursor: pointer;
}

    .google-sign-section button .img {
        width: auto !important;
    }

    .google-sign-section button .text {
        margin-top: 2px;
    }

.text-field select {
    background: transparent;
    width: 100%;
    /*padding: 4%;*/
    padding: 7px;
    border: solid 1px #5d5d5d;
    border-radius: 4px;
    z-index: 99;
    color: #000
}

.my-profile-content .text-field input#MyProfileEmailID {
    padding-right: 33px;
}

.text-field input {
    background: transparent;
    width: 100%;
    padding: 6px;
    border: solid 1px #5d5d5d;
    border-radius: 4px;
    z-index: 99;
    color: #000
}

.text-field textarea {
    background: transparent;
    border: solid 1px #5d5d5d;
    color: #000;
    width: 100%;
    padding: 6px;
    border-radius: 4px;
    z-index: 99;
    color: #000;
    outline: 0;
    display: block;
}

.text-field input:focus {
    outline: none
}

.text-field label {
    position: absolute;
    background-color: #fff;
    left: 0.7em;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: 85ms ease-in-out;
    transition: 85ms ease-in-out;
    padding: 0;
    max-width: calc(100% - (1em * 2));
    cursor: text;
    font-size: 14px;
    /*line-height: 1.71;*/
    letter-spacing: 0.1px;
    color: rgba(0, 0, 0, 0.6);
    font-weight: normal
}

.text-field.has-focus label, .text-field.has-value label {
    top: -1px;
    left: 1em !important;
    padding: 0 4px;
    color: #c3002f;
    z-index: 99;
}

.line-with-center-text {
    width: auto;
    height: 20px;
    border-bottom: 2px solid #9A9FAA;
    text-align: center;
    margin: 15px 15px 30px;
}

    .line-with-center-text span {
        background-color: #ffffff;
        padding: 0 10px;
        font-style: normal;
        font-weight: normal;
        font-size: 15px;
        line-height: 38px;
        text-align: center;
        color: #121319;
    }

.text-field.has-focus {
    color: #c3002f
}

.text-field.text-field--is-disabled.text-field--outlined, .text-field.text-field--is-disabled.text-field--outlined:hover {
    border-color: #aaa
}

.text-field.text-field--is-disabled input, .text-field.text-field--is-disabled label {
    color: #aaa
}

.text-field.text-field--is-disabled.has-value label {
    color: black
}

.text-field.text-field--outlined:hover {
    border-color: black
}

.text-field.text-field--outlined.has-focus {
    border-color: #c3002f;
    -webkit-box-shadow: 0px 0px 1px 1px #c3002f;
    box-shadow: 0px 0px 1px 1px #c3002f;
    border-radius: 4px;
    outline: 0;
}

.text-field.text-field--outlined.has-value {
    border-color: #c3002f;
    -webkit-box-shadow: 0px 0px 1px 1px #c3002f;
    box-shadow: 0px 0px 1px 1px #c3002f;
    border-radius: 4px
}

.date .text-field.text-field--outlined.has-focus, .taskaddress .text-field.text-field--outlined.has-focus {
    border-color: #c3002f;
    -webkit-box-shadow: 0px 0px 1px 1px #c3002f;
    box-shadow: 0px 0px 1px 1px #c3002f;
    border-radius: 4px;
    z-index: unset
}

.line {
    border: solid 1px #e5e5e5;
    height: 2px;
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 3;
    background-color: #e5e5e5;
}

#three {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 3;
    padding: 0px !important
}

#canvas {
    padding: 10px 35px
}

.right_nav {
    padding: 9% 6%;
}

    .right_nav .title {
        font-size: 14px;
        font-weight: 500;
        color: #101420
    }

    .right_nav .item {
        border-radius: 5px;
        -webkit-box-shadow: 0 0 6px #ddd;
        box-shadow: 0 0 6px #ddd;
        background-color: #fff;
        display: grid;
        display: -ms-grid;
        grid-template-columns: 1fr 1fr;
        -ms-grid-columns: 1fr 1fr;
        padding: 3% 0px;
        margin-bottom: 5px;
        border: 1px solid #ddd;
    }

        .right_nav .item .estimate {
            -ms-grid-column: 1;
            grid-column-start: 1;
            grid-column-end: 3
        }

            .right_nav .item .estimate .technician_task {
                padding: 10px 16px;
            }

                .right_nav .item .estimate .technician_task .techniciantask_name {
                    margin-bottom: -2px;
                    font-size: 14px;
                    letter-spacing: 0.3px;
                    color: #101420;
                    font-weight: 500
                }

                    .right_nav .item .estimate .technician_task .techniciantask_name span {
                        font-size: 13px;
                        letter-spacing: 0.3px;
                        text-align: right;
                        color: #101420
                    }

                .right_nav .item .estimate .technician_task .techniciantsak_location {
                    font-size: 12px;
                    letter-spacing: 0.3px;
                    color: #a8a8a8;
                    white-space: nowrap;
                    width: 200px;
                    overflow: hidden;
                    text-overflow: ellipsis
                }

                .right_nav .item .estimate .technician_task .technician_details {
                    display: table;
                    width: 100%;
                    margin-top: 10px;
                }
/*------pagination css------*/
@media screen and (max-width: 1920px) {
    #pageNumber-section a:nth-child(n + 17) {
        display: none;
    }
}
@media screen and (max-width: 1600px) {
    #pageNumber-section a:nth-child(n + 22) {
        display: none;
    }
}
@media screen and (max-width: 1480px) {
    #pageNumber-section a:nth-child(n + 20) {
        display: none;
    }
}
@media screen and (max-width: 1280px) {
    #pageNumber-section a:nth-child(n + 17) {
        display: none;
    }
    body .right_nav .item .estimate .technician_task .technician_details {
        display: block
    }

    body .rating-star {
        font-size: 2.5rem;
        width: 3rem;
        height: 3rem;
        padding: 0 1.5rem;
    }

    body .half-star:after {
        left: 11px;
        text-indent: -1.1rem;
    }

    body .star_rating .count p {
        font-size: 16px;
    }

    body .star_rating .count {
        margin-top: 8px;
    }

    body .btn-dowloadfwdata {
        position: relative;
        margin: 0 auto 10px;
    }
    .grid_container #grid .title2{
        font-size:12px;
    }
    .attendanceBlock a.primary-btn {
        padding: 3px 6px;
        font-size: 12px;
    }
}

@media screen and (max-width: 1180px) {
    #pageNumber-section a:nth-child(n + 14) {
        display: none;
    }
}
@media screen and (max-width: 1024px) {
    #pageNumber-section a:nth-child(n + 10) {
        display: none;
    }
}
@media screen and (max-width: 768px) {
    #pageNumber-section a:nth-child(n + 7) {
        display: none;
    }
}
.right_nav .item .estimate .technician_task .technician_details .technician_image {
    display: table-cell;
    vertical-align: middle;
    width: 30px
}

    .right_nav .item .estimate .technician_task .technician_details .technician_image img {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        margin-right: 5px
    }

.right_nav .item .estimate .technician_task .technician_details .technician_info {
    display: table-cell;
    vertical-align: middle
}

    .right_nav .item .estimate .technician_task .technician_details .technician_info p {
        font-size: 12px;
        /*margin-bottom: -2px;*/
        color: #101420;
        font-weight: 500;
    }

    .right_nav .item .estimate .technician_task .technician_details .technician_info span {
        font-size: 11px
    }

.right_nav .item .estimate .technician_task .work_status {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: right;
    align-items: center;
    font-size: 12px
}

@media (max-width: 1250px) {
    .right_nav .item .estimate .technician_task .work_status {
        float: left
    }
}

.right_nav .item .estimate .technician_task .work_status .ongoing_dot {
    width: 12px;
    height: 12px;
    background-color: #ff9b00;
    border-radius: 50%;
    margin: 0;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .ongoing {
    color: #ff9b00
}

.right_nav .item .estimate .technician_task .work_status .complete_dot {
    width: 10px;
    height: 10px;
    background-color: #03de73;
    border-radius: 50%;
    margin: 0;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .complete {
    color: #03de73
}

.right_nav .item .estimate .technician_task .work_status .inactive_dot {
    width: 12px;
    height: 12px;
    background-color: #9a9faa;
    border-radius: 50%;
    margin: 0;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .inactive {
    color: #9a9faa
}

.right_nav .item .estimate .technician_task .work_status .OnHold_dot {
    width: 12px;
    height: 12px;
    background-color: #101420;
    border-radius: 50%;
    margin: 0;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .OnHold {
    color: #101420
}

.right_nav .item .estimate .technician_task .work_status .rejected_dot {
    width: 12px;
    height: 12px;
    background-color: #c3002f;
    border-radius: 50%;
    margin: 0;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .rejected {
    color: #c3002f
}

.tab_container {
    padding-top: 20px;
    position: relative
}

    .tab_container input, .tab_container section {
        clear: both;
        display: none
    }

    .tab_container label {
        font-size: 14px;
        letter-spacing: 0.5px;
        text-align: center;
        color: #545454;
        display: block;
        float: left;
        width: 33.33%;
        padding: 1.5px;
        color: #757575;
        cursor: pointer;
        text-decoration: none;
        text-align: center;
        line-height: 30px
    }

#tab1:checked ~ #content1, #tab2:checked ~ #content2, #tab3:checked ~ #content3, #tab4:checked ~ #content4, #tab5:checked ~ #content5 {
    display: block;
    color: #999
}

.technician_task_status #tab1:checked ~ #content1, .technician_task_status #tab2:checked ~ #content2, .technician_task_status #tab3:checked ~ #content3, .technician_task_status #tab4:checked ~ #content4, .technician_task_status #tab5:checked ~ #content5 {
    max-height: 500px;
    overflow-y: scroll
}

.tab_container .tab-content, .tab_container .tab-content {
    -webkit-animation: fadeInScale 0.7s ease-in-out;
    animation: fadeInScale 0.7s ease-in-out
}

    .tab_container .tab-content h3 {
        text-align: center
    }

.tab_container [id^="tab"]:checked + label {
    /*-webkit-box-shadow: inset 0 -2px #c3002f;
    box-shadow: inset 0 -2px #c3002f;*/
    color: #000;
    line-height: 30px
}

    .tab_container [id^="tab"]:checked + label .fa {
        color: #0CE
    }

label .fa {
    font-size: 1.3em;
    margin: 0 0.4em 0 0
}

@media only screen and (max-width: 900px) {
    .tab_container {
        width: 98%
    }
}

@-webkit-keyframes fadeInScale {
    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        opacity: 0
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

@keyframes fadeInScale {
    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        opacity: 0
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

.no_wrap {
    text-align: center;
    color: #0ce
}

.main {
    margin-top: 10px
}

    .main .input-group {
        position: relative;
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        -ms-flex-align: stretch;
        width: 100%
    }

    .main .form-control {
        background-color: #f6f3f4;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        border: 1px solid #c6cbd4;
        border-top-right-radius: 4px !important;
        border-bottom-right-radius: 4px !important;
    }

    .main .btn {
        background-color: #f6f3f4;
        position: absolute;
        right: 0;
        z-index: 3;
        margin: 2px 1px;
        padding: 5px 16px
    }

.technician_passbook_info .input-group .form-control {
    padding: 12px 16px;
    border: 1px solid #c6cbd4
}

.bar_legend {
    -ms-grid-column: 1;
    grid-column-start: 1;
    grid-column-end: 3;
    padding: 15px 30px
}

    .bar_legend ul {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        padding: 0
    }

        .bar_legend ul li {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            margin: 0px 5px
        }

            .bar_legend ul li .dot {
                width: 12px;
                height: 12px;
                border-radius: 50%;
                margin-right: 5px
            }

            .bar_legend ul li .present {
                background-color: #9ccc65
            }

            .bar_legend ul li .absent {
                background-color: #ef5350
            }

            .bar_legend ul li .idle {
                background-color: #A8A8A8
            }

            .bar_legend ul li p {
                margin: 0;
                line-height: 15px;
                font-size: 14px;
                font-weight: 500;
                font-style: normal;
                font-stretch: normal;
                color: #101420
            }

    .bar_legend .select_week {
        text-align: right
    }

        .bar_legend .select_week .select {
            border-radius: 17px;
            border: solid 1px rgba(0, 0, 0, 0.12);
            padding: 5px 10px 5px 4px;
            cursor: pointer
        }

            .bar_legend .select_week .select:focus {
                outline: 0
            }

.resetpassword .login_form .btn {
    margin-top: 20px
}

.task_grid_container {
    padding: 1% 2%;
    -ms-grid-column: 2
}

.task_header {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 200px auto;
    grid-template-columns: 200px auto;
    -ms-grid-rows: 66px;
    grid-template-rows: 66px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .task_header p {
        font-size: 14px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #101420;
        margin: 0
    }

.task_header2 {
    margin-bottom: 20px;
}

.task_button_group {
    /* text-align: right;
    -ms-grid-column: 2;*/
    display: flex;
    justify-content: end;
}

.task_header p {
    margin: 0
}

.task_header select {
    /*height: 34px;*/
    border-radius: 4px;
    border: solid 1px #c6cbd4;
    line-height: inherit;
    background-color: transparent;
    padding: 8px 10px
}

.task_header .add_task {
    width: 112px;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .task_header .add_task:hover {
        background-color: #b3012c;
    }

.task_header2 select {
    height: 34px;
    border-radius: 2px;
    border: solid 1px #c6cbd4;
    line-height: inherit;
    background-color: transparent;
    padding: 3px 10px
}

.task_header2 .add_task {
    width: 112px;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    /*border: 2px solid #c3002f;*/
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .task_header2 .add_task:hover {
        background-color: #b3012c;
    }

.btn.btn_red {
    width: 112px;
    height: 34px;
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    /*border: 2px solid #c3002f;*/
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

.btn_red:hover {
    background-color: #b3012c;
}

.btn.btn_red_full {
    width: auto;
    height: 34px;
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    /*border: 2px solid #c3002f;*/
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

.btn_red_full:hover {
    background-color: #b3012c;
}

.btn.btn-black {
    width: 112px;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #353935;
    font-size: 14px;
    border: 1px solid #353935;
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

.btn-black:hover, .btn-black:focus {
    background-color: #474747;
}


.btn.btn-black3 {
    height: 34px;
    border-radius: 4px;
    background-color: #353935;
    border-radius: 20px;
    font-size: 14px;
    border: 2px solid #353935;
    padding: 5px 28px;
    font-weight: 500;
    color: #fff;
}

.btn-black3:hover, .btn-black3:focus {
    background-color: #474747;
}


.task_header .get_link {
    width: 112px;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #353935;
    font-size: 14px;
    /*border: 2px solid #1f1f1f;*/
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
}

    .task_header .get_link:hover {
        background-color: #474747;
    }

.task_header2 .get_link {
    width: 112px;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #353935;
    font-size: 14px;
    /*border: 2px solid #1f1f1f;*/
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    cursor: pointer;
}

    .task_header2 .get_link:hover {
        background-color: #474747;
    }

.task_header .cancel {
    width: 112px;
    height: 34px;
    border-radius: 4px;
    background-color: transparent;
    font-size: 14px;
    border: 2px solid transparent;
    padding: 7px;
    font-weight: 500;
    color: #000
}

.task_header .btn-info:active:focus {
    background-color: #c3002f;
    border-color: #c3002f;
    outline: 0
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: 0;
    outline-offset: -2px
}

.task_details {
    border-radius: 5px;
    -webkit-box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff
}

    .task_details .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th, .table > thead > tr > th {
        vertical-align: middle;
        border-top: none;
        border-bottom: none
    }

    .task_details .table > tbody > tr > th {
        font-weight: normal;
        display: inline-flex;
        align-items: center
    }

.TechnicianProfileImage {
    position: relative;
    margin-right: 10px;
    width: 40px
}

.task_details .table > thead > tr > th {
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #10131f
}

.task_details .table .view_details {
    font-size: 12px;
    font-weight: 500;
    color: #c3002f;
    cursor: pointer;
    white-space: nowrap;
}

.task_details .ongoing, .completed, .rejected, .inactive {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.service_details {
    border-radius: 5px;
    -webkit-box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff
}

    .service_details .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th, .table > thead > tr > th {
        vertical-align: middle;
        border-top: none;
        border-bottom: none
    }

    .service_details .table > tbody > tr > th {
        font-weight: normal;
        display: inline-flex;
        align-items: center
    }

    .service_details .table > thead > tr > th {
        font-size: 14px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.71;
        letter-spacing: normal;
        color: #10131f
    }

    .service_details .table .view_details {
        font-size: 12px;
        font-weight: 500;
        color: #c3002f;
        cursor: pointer;
        white-space: nowrap;
    }

    .service_details .ongoing, .completed, .rejected, .inactive {
        display: inline-flex;
        align-items: center;
        position: relative;
    }

.title-section {
    display: none;
    position: absolute;
    padding: 5px 10px;
    border-radius: 4px;
    width: 220px;
    background: rgba(0, 0, 0, 0.7);
    color: #ffffff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: -2px 0 6px rgba(55, 66, 59, 0.8);
    z-index: 1;
}

.rejected:hover .title-section {
    transform: translate(-45%, 10px);
    display: block;
}

.exp-credit,
.exp-deduct {
    position: relative;
}

    .exp-credit:hover .title-section,
    .exp-deduct:hover .title-section {
        transform: translate(-15%, 10px);
        display: block;
    }

/*-------task details status color-------*/
.task_details .ongoing .status {
    width: 8px;
    height: 8px;
    background-color: #ff9b00;
    border-radius: 50%;
    margin-right: 5px
}

.task_details .ongoing p {
    color: #ff9b00
}

.task_details .inactive .status {
    width: 8px;
    height: 8px;
    background-color: #9a9faa;
    border-radius: 50%;
    margin-right: 5px
}

.task_details .inactive p {
    color: #9a9faa;
    font-weight: 500;
}

.task_details .completed .status {
    width: 8px;
    height: 8px;
    background-color: #03de73;
    border-radius: 50%;
    margin-right: 5px
}

.task_details .completed p {
    color: #03de73;
    font-weight: 500;
}

.task_details .OnHold .status {
    width: 8px;
    height: 8px;
    background-color: #353935;
    border-radius: 50%;
    margin-right: 5px
}

.task_details .OnHold p {
    color: #353935;
    font-weight: 500;
}

.task_details .rejected .status {
    width: 8px;
    height: 8px;
    background-color: #c3002f;
    border-radius: 50%;
    margin-right: 5px
}

.task_details .rejected p {
    color: #c3002f
}
/*-------task details status color-------*/

/*-------task details status color-------*/
.common_page_stat .ongoing .status {
    width: 8px;
    height: 8px;
    background-color: #ff9b00;
    border-radius: 50%;
    margin-right: 5px
}

.common_page_stat .ongoing p {
    color: #ff9b00
}

.common_page_stat .inactive .status {
    width: 8px;
    height: 8px;
    background-color: #9a9faa;
    border-radius: 50%;
    margin-right: 5px
}

.common_page_stat .inactive p {
    color: #9a9faa;
    font-weight: 500;
}

.common_page_stat .completed .status {
    width: 8px;
    height: 8px;
    background-color: #03de73;
    border-radius: 50%;
    margin-right: 5px
}

.common_page_stat .completed p {
    color: #03de73;
    font-weight: 500;
}

.common_page_stat .OnHold .status {
    width: 8px;
    height: 8px;
    background-color: #353935;
    border-radius: 50%;
    margin-right: 5px
}

.common_page_stat .OnHold p {
    color: #353935;
    font-weight: 500;
}

.common_page_stat .rejected .status {
    width: 8px;
    height: 8px;
    background-color: #c3002f;
    border-radius: 50%;
    margin-right: 5px
}

.common_page_stat .rejected p {
    color: #c3002f;
    font-weight: 500;
}
/*-------task details status color-------*/

.more {
    position: relative
}

.more-menu {
    width: 160px
}

.more-btn, .more-menu-btn {
    background: none;
    border: 0 none;
    line-height: normal;
    overflow: visible;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    text-align: left;
    outline: none;
    cursor: pointer
}

.more-dot {
    background-color: #aab8c2;
    margin: 3px auto;
    display: block;
    width: 4px;
    height: 4px;
    margin-right: 1px;
    border-radius: 50%;
    transition: background-color 0.3s
}

.more-menu {
    position: absolute;
    z-index: 900;
    right: 5px;
    float: left;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.25);
    opacity: 0;
    -webkit-transform: translate(0, 15px) scale(.95);
    transform: translate(0, 15px) scale(.95);
    transition: transform 0.1s ease-out, opacity 0.1s ease-out;
    pointer-events: none
}

.more-menu-items {
    margin: 0;
    list-style: none;
    padding: 0
}

.more-menu-item {
    display: block;
    padding: 10px 15px;
    cursor: pointer;
}

    .more-menu-item:first-child {
        border-bottom: solid 0.5px #f3f3f3
    }

    .more-menu-item img {
        margin-right: 5px;
        width: 14px;
        height: 14px;
        object-fit: contain;
    }

.more-menu-btn {
    min-width: 100%;
    color: #66757f;
    cursor: pointer;
    display: block;
    font-size: 13px;
    line-height: 18px;
    padding: 5px 15px;
    position: relative;
    white-space: nowrap
}

.more-menu-item:hover {
    background-color: #fafafa;
    /*color: #c22032*/
}

    .more-menu-item:hover .more-menu-btn {
        color: #fff
    }

.more-btn:hover .more-dot, .show-more-menu .more-dot {
    background-color: #516471
}

.show-more-menu .more-menu {
    opacity: 1;
    -webkit-transform: translate(0, 0) scale(1);
    transform: translate(0, 0) scale(1);
    pointer-events: auto;
    border-radius: 4px;
    box-shadow: 0 2px 8px 0 rgba(0,0,0,0.16);
    background-color: #fff
}

#add_task {
    text-align: initial
}

.task_model .modal-dialog {
    width: 700px
}

.addtask_form .form-inline {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    position: relative;
    margin-bottom: 15px
}

.addtask_form .text-field-container {
    /*margin: 10px*/
}

.addtask_form .text-field {
    margin: 0
}

.addtask_form label {
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0.1px;
    color: rgba(0, 0, 0, 0.6);
    font-weight: normal
}

.task_model select {
    width: 100%;
    /*height: 39px;*/
    border-radius: 4px;
    border: solid 1px #5d5d5d;
    font-size: 14px;
    line-height: 1.71;
    letter-spacing: 0.1px;
    color: rgba(0, 0, 0, 0.6)
}

.addtask_form .text-field-container:nth-child(1) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3
}

.addtask_form .text-field-container:nth-child(2) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    margin-top: 30px
}

.addtask_form .text-field-container:nth-child(3) {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    margin-top: 12px
}

.addtask_form .text-field-container:nth-child(4) {
    -ms-grid-column: 5;
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    margin-top: 30px
}

.addtask_form .text-field-container:nth-child(5) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 4
}

.addtask_form .text-field-container:nth-child(6) {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-row: 3;
    grid-row-start: 4
}

.addtask_form .text-field-container:nth-child(7) {
    -ms-grid-column: 5;
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 4
}

.addtask_form .text-field-container:nth-child(8) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 5;
    grid-row-start: 6
}

.addtask_form .text-field-container:nth-child(9) {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-row: 5;
    grid-row-start: 6
}

.addtask_form .text-field-container:nth-child(10) {
    -ms-grid-column: 5;
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 5;
    grid-row-start: 6
}

.addtask_form .text-field-container:nth-child(11) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 7;
    grid-row-start: 7
}

.addtask_form .text-field-container:nth-child(12) {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-row: 7;
    grid-row-start: 7
}

.addtask_form .text-field-container:nth-child(13) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 3;
    grid-column-end: 4;
    -ms-grid-row: 9;
    grid-row-start: 9
}

.addtask_form .text-field-container:nth-child(14) {
    -ms-grid-column: 4;
    grid-column-start: 4;
    -ms-grid-column-span: 3;
    grid-column-end: 7;
    -ms-grid-row: 9;
    grid-row-start: 9
}

#add_task .modal-footer .cancel, #view_details .modal-footer .cancel, #assign_item .modal-footer .cancel, #edit_details .modal-footer .cancel, #Edit_technician .modal-footer .cancel, #add_technician_quickLink .modal-footer .cancel, #add_task_QuickLink .modal-footer .cancel, #amcAddTaskModal .modal-footer .cancel, #edit_enquiry .modal-footer .cancel, #Edit_enquiry_details .modal-footer .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#add_task .modal-footer .add_task_submit, #view_details .modal-footer .add_task_submit, #assign_item .modal-footer .add_task_submit, #edit_details .modal-footer .add_task_submit, #Edit_technician .modal-footer .add_task_submit, #add_technician_quickLink .modal-footer .add_task_submit, #add_task_QuickLink .modal-footer .add_task_submit, #amcAddTaskModal .modal-footer .add_task_submit, #edit_enquiry .modal-footer .add_task_submit, #Edit_enquiry_details .modal-footer .add_task_submit, #Update_leadstatus .modal-footer .Update_leadstatus_submit {
    border-radius: 2px;
    background-color: #353935;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.task_track {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 70% 30%;
    grid-template-columns: 70% 30%
}

.location img {
    width: 100%;
    height: 100%
}

.technician_details {
    display: table;
    width: 100%
}

    .technician_details .technician_images {
        display: table-cell;
        vertical-align: middle;
        width: 40px;
        padding: 0 10px
    }

        .technician_details .technician_images img {
            height: 50px;
            width: 40px;
            border-radius: 50%;
        }

.track_map .technician_details .technician_images img {
    height: 75px;
    width: 75px;
    border-radius: 50%;
}

#task_track .technician_details .technician_images img {
    height: 50px;
    width: 50px;
    border-radius: 50%;
}

.technician_details .technician_info {
    display: table-cell;
    vertical-align: middle;
    width: 100%
}

    .technician_details .technician_info p {
        margin: 0px;
        font-size: 20px;
        line-height: 1.2;
        letter-spacing: 0.2px;
        color: #212121
    }

    .technician_details .technician_info span {
        font-size: 17px;
        line-height: 1.41;
        letter-spacing: 0.2px;
        color: #7b7b7b
    }

.task_description {
    margin-top: 15%
}

    .task_description p {
        font-weight: 600;
        font-size: 15px;
        line-height: 18px;
        letter-spacing: 0.165441px;
        color: #C3002F;
    }

    .task_description span {
        font-size: 15px;
        letter-spacing: 0.2px;
        color: #212121;
        font-weight: normal
    }

.location_address {
    margin-bottom: 1.5rem;
}

    .location_address p {
        font-weight: 600;
        font-size: 15px;
        line-height: 18px;
        letter-spacing: 0.165441px;
        color: #212121;
        margin: 5px 0;
    }

    .location_address span {
        font-size: 15px;
        letter-spacing: 0.2px;
        color: #727272;
        font-weight: normal
    }

.track_info {
    -ms-grid-column: 2
}

.direction {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.from {
    border-bottom: solid 0.2px #b0b0b0;
    margin-top: 50px
}

.direction input[type="text"] {
    border: none;
    background-color: #f4f4f4;
    padding: 0px 10px
}

.direction button {
    width: 50px;
    padding: 16px 10px;
    border: none;
    background-color: #c3002f;
    color: #fff
}

.distance_estimate {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    margin-top: 20px;
    padding: 10px 0px
}

.distance, .time {
    border: 1px solid #5d5d5d;
    text-align: center
}

.distance_estimate p {
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 24px;
    letter-spacing: 0.9px;
    color: #212121;
    margin: 0
}

.distance_estimate span {
    font-size: 11px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.09;
    letter-spacing: 0.9px;
    color: #000
}

.time {
    -ms-grid-column: 2
}

.track {
    cursor: pointer
}

/*.distance_details {
    border: 1px solid #5d5d5d;
}*/

.distance_details .container {
    background: #F4F4F4;
    border-radius: 3px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

    .distance_details .container .label {
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 14px;
        letter-spacing: 0.165441px;
        color: #727272;
    }

    .distance_details .container .value {
        font-style: normal;
        font-weight: 500;
        font-size: 26px;
        letter-spacing: 0.165441px;
        color: #212121;
    }

button.btn-track {
    cursor: pointer;
    border: none;
    background: transparent;
}

    button.btn-track[disabled] {
        cursor: not-allowed;
        opacity: 0.3;
    }

.add-audio-section {
    /*padding: 1rem 1rem 0.5rem;*/
    padding: 0.5rem 1rem;
    border: solid 1px rgba(0,0,0,0.7);
    border-radius: 4px;
    /*margin: 1rem;*/
    margin: 0;
}

    .add-audio-section .d-flex {
        display: flex;
        gap: 1rem;
    }

    .add-audio-section button {
        border-radius: 2px;
        background-color: #c3002f;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #fff;
        padding: 0.4rem 2rem;
        margin-bottom: 5px;
        width: 120px;
    }

    .add-audio-section .player ol {
        margin-bottom: -3px;
    }

    /*.add-audio-section .player audio {
    height: 28px;
}*/

    .add-audio-section label {
        margin-bottom: 0px;
    }

audio {
    background: #f5f5f5;
    border: solid 1px #ddd;
    border-radius: 6px;
    height: 28px;
}

.audio .text-field-container:nth-child(2) {
    grid-column-start: 1;
    grid-column-end: 7;
    margin-top: 30px;
}

.audio .d-flex div {
    margin: auto 0;
}

.audio .on-recording {
    font-weight: 600;
    background-color: #eee;
    border: solid 1px #ddd;
    padding: 3px 10px;
    height: 28px;
    border-radius: 12px;
    /*height: 38px;
    margin-top: -6px;*/
}

.audio a {
    cursor: pointer;
}

    .audio a img {
        width: 40px;
    }

#Task_Closure_view_details .audio-section .audio-container {
    display: flex;
    /*margin-top: 0.5rem;*/
}

    #Task_Closure_view_details .audio-section .audio-container div:first-child {
        width: max-content;
        margin-top: 3px;
    }

#Task_Closure_view_details .audio-section audio {
    width: 238px;
    margin-left: 5px;
}
/*audio::-webkit-media-controls-play-button,
audio::-webkit-media-controls-panel {
    background-color: #fff;
    color: #fff;
}*/
#add_task_QuickLink .add-audio-section {
    /*margin-right: 10px !important;*/
}
/*button.btn-track[disabled] img {
    cursor: not-allowed;
}*/
.attendance_grid_container {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 30% 70%;
    grid-template-columns: 30% 70%;
    -ms-grid-column: 2
}

.today_attendance .tab_container {
    padding: 0;
    border-radius: 5px;
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff
}

.today_attendance label {
    font-size: 27px;
    letter-spacing: 0.5px;
    text-align: center;
    color: #545454;
    display: block;
    float: left;
    width: 33.33%;
    padding: 1.5px;
    color: #757575;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    line-height: 15px;
    border-right: solid 0.5px #dcdcdc;
    border-bottom: solid 0.5px #dcdcdc;
    padding: 17px 10px
}

    .today_attendance label span {
        font-size: 14px;
        color: #a6a6a6;
        font-weight: normal
    }

.a:nth-child(3) {
    border-right: none
}

.today_attendance .tab_container [id^="tab"]:checked + label {
    box-shadow: none;
    border-bottom: solid 1.5px #c3002f;
    color: #101420;
    line-height: 15px
}

.all_technician {
    padding: 10px
}

    .all_technician .technician_details {
        margin-top: 15px
    }

    .all_technician .technician_images {
        display: table-cell;
        vertical-align: middle;
        width: 46px
    }

        .all_technician .technician_images img {
            width: 46px;
            height: 46px;
            border-radius: 50%
        }

    .all_technician .technician_info p {
        font-size: 16px;
        letter-spacing: 0.2px;
        color: #212121;
        margin: 0
    }

    .all_technician .technician_info span {
        font-size: 14px;
        letter-spacing: 0.2px;
        color: #7b7b7b
    }

    .all_technician .calender {
        display: table-cell;
        vertical-align: middle;
        cursor: pointer
    }

.all_technician_attendance_details {
    padding: 4% 2%;
    -ms-grid-column: 2
}

    .all_technician_attendance_details .header {
        display: flex;
        justify-content: space-between;
    }

    .all_technician_attendance_details p {
        font-size: 14px;
        font-weight: 500;
        color: #101420;
        margin-top: auto;
    }

    .all_technician_attendance_details .export {
        width: 112px;
        height: 34px;
        border-radius: 4px;
        color: #fff;
        background-color: #353935;
        font-size: 14px;
        border: 2px solid #353935;
        /*padding: 7px;*/
        font-weight: 500;
        margin-top: -10px;
    }

.technician_tab_container {
    border-radius: 5px;
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff
}

    .technician_tab_container .horizontalbar {
        padding: 20px 0px
    }

    .technician_tab_container .horizontalbar {
        -webkit-animation: fadeInScale 0.7s ease-in-out;
        animation: fadeInScale 0.7s ease-in-out
    }

.tab button {
    background-color: transparent;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 8px 16px;
    transition: 0.3s;
    font-size: 14px;
    border-bottom: solid 1.5px #d7d7d7;
    color: #10131f;
    width: 8.33%
}

    .tab button:hover {
        border-bottom: 1.5px solid #c3002f
    }

    .tab button.active {
        border-bottom: 1.5px solid #c3002f;
        background-color: #c3002f;
        color: #ffffff;
    }

.tabcontent {
    display: none;
    padding: 6px 12px;
    border-top: none;
    height: 500px;
    overflow-y: auto
}

#technician_calender .modal-header, #employee_calender .modal-header {
    border-radius: 2px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
    background-color: #fff
}

    #technician_calender .modal-header p, #employee_calender .modal-header p {
        font-size: 12px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #262934;
        margin: 0
    }

    #technician_calender .modal-header h4, #employee_calender .modal-header h4 {
        font-size: 18px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #262934
    }

#technician_calender .modal-footer, #employee_calender .modal-footer {
    padding: 0;
    border-top: solid 1px #e9e9e9;
    padding-bottom: 15px
}

    #technician_calender .modal-footer ul, #employee_calender .modal-footer ul {
        list-style: none;
        border-bottom: solid 1px #e9e9e9;
        padding: 0
    }

        #technician_calender .modal-footer ul li {
            display: inline-block;
            border-right: solid 1px #e9e9e9;
            width: 32%;
            text-align: center;
            padding: 20px 0
        }

        #employee_calender .modal-footer ul li {
            display: inline-block;
            border-right: solid 1px #e9e9e9;
            width: 24%;
            text-align: center;
            padding: 20px 0
        }

            #technician_calender .modal-footer ul li p, #employee_calender .modal-footer ul li p {
                font-size: 22px;
                font-weight: 500;
                font-style: normal;
                font-stretch: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #101420;
                margin: 0
            }

    #technician_calender .modal-footer .calender_legend, #employee_calender .modal-footer .calender_legend {
        display: inline-flex;
        align-items: center
    }

        #technician_calender .modal-footer .calender_legend .present, #employee_calender .modal-footer .calender_legend .present {
            width: 8px;
            height: 8px;
            background-color: #9ccc65;
            border-radius: 50%;
            margin-right: 5px
        }

        #technician_calender .modal-footer .calender_legend .absent, #employee_calender .modal-footer .calender_legend .absent {
            width: 8px;
            height: 8px;
            background-color: #ef5350;
            border-radius: 50%;
            margin-right: 5px
        }

        #technician_calender .modal-footer .calender_legend .idle, #employee_calender .modal-footer .calender_legend .idle {
            width: 8px;
            height: 8px;
            background-color: #A8A8A8;
            border-radius: 50%;
            margin-right: 5px
        }

        #technician_calender .modal-footer .calender_legend .OnLeave, #employee_calender .modal-footer .calender_legend .OnLeave {
            width: 8px;
            height: 8px;
            background-color: orange;
            border-radius: 50%;
            margin-right: 5px
        }

        #technician_calender .modal-footer .calender_legend span, #employee_calender .modal-footer .calender_legend span {
            font-size: 13px;
            font-weight: 500;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: -0.1px;
            color: #626262
        }

.footer_btns {
    padding: 15px
}

#technician_calender .modal-footer .cancel, #employee_calender .modal-footer .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#technician_calender .modal-footer .add_task_submit, #employee_calender .modal-footer .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500
}

.text-danger {
    text-align: initial;
    margin-left: 0px;
    /*white-space:nowrap;*/
}

.signup_form .text-field-container {
    margin: 10px
}

.rounded-circle {
    width: 45px;
    height: 45px;
    border-radius: 50%
}

.active_indicator {
    content: '';
    position: absolute;
    right: 0;
    bottom: 3px;
    border-radius: 50%;
    animation: heartbeat 1s infinite;
    width: 12px;
    height: 12px;
    border: solid 2px #fff;
    background-color: #9ccc65
}

@keyframes heartbeat {
    0% {
        transform: scale( .75 )
    }

    20% {
        transform: scale( 1 )
    }

    40% {
        transform: scale( .75 )
    }

    60% {
        transform: scale( 1 )
    }

    80% {
        transform: scale( .75 )
    }

    100% {
        transform: scale( .75 )
    }
}

.technician_status {
    display: inline-flex;
    align-items: center
}

    .technician_status .active {
        width: 8px;
        height: 8px;
        background-color: #2dc76d;
        border-radius: 50%;
        margin-right: 5px
    }

    .technician_status .active_label {
        font-size: 14px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.71;
        letter-spacing: normal;
        color: #2dc76d
    }

.absent_indicator {
    content: '';
    position: absolute;
    right: 0;
    bottom: 3px;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    border: solid 2px #fff;
    background-color: #ef5350
}

.technician_status .absent {
    width: 8px;
    height: 8px;
    background-color: #ef5350;
    border-radius: 50%;
    margin-right: 5px
}

.technician_status .absent_label {
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #ef5350
}

.idle_indicator {
    content: '';
    position: absolute;
    right: 0;
    bottom: 3px;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    border: solid 2px #fff;
    background-color: #A8A8A8
}

.technician_status .idle {
    width: 8px;
    height: 8px;
    background-color: #A8A8A8;
    border-radius: 50%;
    margin-right: 5px
}

.technician_status .idle_label {
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #A8A8A8
}

@media (min-width: 768px) {
    .modal-lg {
        width: 100%;
        margin: 30px auto
    }
}

@media (min-width: 1024px) {
    .modal-lg {
        width: 900px;
        margin: 30px auto
    }
}

.addtechnician_form .text-field {
    max-width: 100%
}

    .addtechnician_form .text-field input {
        padding: 2%
    }

.add_technician_model .modal-dialog {
    width: 350px
}

.assign_item .modal-dialog {
    width: 450px
}

.assign_item_form .text-field-container {
    margin: 10px
}

.assign_item_form .text-field {
    margin: 0px
}

.assign_item_form select {
    width: 100%;
    height: 35px;
    border-radius: 4px;
    border: solid 1px rgba(0, 0, 0, 0.32);
    font-size: 14px;
    line-height: 1.71;
    letter-spacing: 0.1px;
    color: rgba(0, 0, 0, 0.6);
    padding: 0 3%
}

.assign_item_form input {
    height: 34px
}

.assign_item_form label {
    font-size: 14px;
    line-height: 1.71;
    letter-spacing: 0.1px;
    color: rgba(0, 0, 0, 0.6);
    font-weight: normal
}

.assign_item_form .form-inline {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 65% 25% 10%;
    grid-template-columns: 65% 25% 10%
}

.assign_item .assign_item_form .form-inline {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 65% 25% 10%;
    grid-template-columns: 65% 25% 10%
}

.add_more {
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.4;
    letter-spacing: 0.1px;
    color: #c3002f;
    margin: 0px 10px;
    cursor: pointer
}

.assgin_item {
    max-height: 386px;
    overflow-y: auto
}

.item_description {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    grid-row-start: 3
}

#itemName-error {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    margin-left: 10px;
    margin-bottom: 0
}

#itemQuality-error {
    grid-column-start: 2;
    grid-column-end: 4;
    margin-left: 10px;
    margin-bottom: 0
}

#itemDescription-error {
    grid-column-start: 1;
    grid-column-end: 3;
    margin-left: 10px;
    margin-bottom: 0;
    grid-row-start: 4
}

.add_technician_model table, th, td {
    border-collapse: collapse;
    padding: 10px
}

@media (min-width: 768px) {
    .passbook .modal-dialog {
        width: 100%;
        margin: 30px auto
    }
}

@media (min-width: 1024px) {
    .passbook .modal-dialog {
        width: 1100px;
        margin: 30px auto
    }
}

.technician_passbook {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 15% 85%;
    grid-template-columns: 20% 80%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.technician_passbook_info {
    text-align: center
}

    .technician_passbook_info p {
        font-size: 16px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: 0.2px;
        color: #212121;
        text-align: center;
        margin: 0
    }

    .technician_passbook_info span {
        font-size: 14px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: 0.2px;
        color: #7b7b7b;
        text-align: center
    }

.earning_estimation {
    list-style: none;
    padding: 0
}

    .earning_estimation li {
        display: inline-block;
        margin: 10px 5px;
        color: #a1a1a1;
        vertical-align: middle
    }

        .earning_estimation li p {
            font-size: 16px;
            font-weight: 500;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #10131f;
            margin: 0
        }

        .earning_estimation li span {
            font-size: 13px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #a1a1a1
        }

.earning_legends {
    float: right;
    padding: 0;
    padding-right: 10px;
    line-height: 35px;
    list-style: none
}

    .earning_legends li {
        display: inline-block
    }

.estimate_earning, .total_earning, .total_expenses {
    display: inline-flex;
    align-items: center
}

.earning_legends .estimate_earning p {
    width: 8px;
    height: 8px;
    background-color: #276ee5;
    margin: 0;
    margin-right: 7px;
    border-radius: 50%
}

.earning_legends .estimate_earning span {
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #276ee5
}

.earning_legends .total_earning p {
    width: 8px;
    height: 8px;
    background-color: #ffb52f;
    margin: 0;
    margin-right: 7px;
    border-radius: 50%
}

.earning_legends .total_earning span {
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffb52f
}

.earning_legends .total_expenses p {
    width: 8px;
    height: 8px;
    background-color: #09baa6;
    margin: 0;
    margin-right: 7px;
    border-radius: 50%
}

.earning_legends .total_expenses span {
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #09baa6
}

.earning_legends select {
    border-radius: 4px;
    border: solid 1px rgba(0, 0, 0, 0.32);
    padding: 5px 0px
}

.model_bottom {
    border-top: none
}

    .model_bottom .cancel {
        background-color: transparent;
        border: none;
        color: #000;
        box-shadow: none;
        font-size: 14px;
        font-weight: 500
    }

    .model_bottom .add_task_submit {
        border-radius: 2px;
        background-color: #c3002f;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #fff
    }

.modal-footer .cancel, .modal-footer .cancel:active:focus {
    background-color: transparent;
    border: 1px solid #ddd;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500;
    border-radius: 2px;
}

    .modal-footer .cancel:hover {
        color: #c3002f;
    }

.modal-footer .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

    .modal-footer .add_task_submit:active:focus {
        background-color: #c3002f;
        color: #fff
    }

.all_technician_earning {
    border-radius: 4px;
    border: solid 1px #e2e2e2;
    background-color: #fff;
    padding: 5px;
    padding-right: 20px
}

.legend {
    -ms-grid-column: 2
}

#one {
    -ms-grid-column: 1;
    -ms-grid-row: 3;
    -ms-grid-rows: 206px
}

#two {
    -ms-grid-column: 2;
    -ms-grid-row: 3;
    -ms-grid-rows: 70px 20px 70px
}

#three {
    -ms-grid-column: 1;
    -ms-grid-row: 5
}

#chart-parent {
    -ms-grid-column: 2
}

.assgin_item .text-field-container:nth-child(2) {
    -ms-grid-column: 2
}

.pagination {
    margin: 0 10px
}

.table-pagination {
    display: inline-flex;
    align-items: center;
    float: right
}

.btn-tablepage {
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 6px 12px;
    cursor: pointer
}

    .btn-tablepage:hover {
        background-color: #eee;
        border: 1px solid #ddd
    }

    .btn-tablepage:focus {
        outline: 0
    }

.pagination p {
    margin: 0;
    color: #333;
    font-size: 14px;
    margin-right: 15px
}

.table {
    margin-bottom: 0
}

.pagination span {
    font-weight: bold
}

.previous {
    background-color: transparent;
    color: black;
    /*border-radius: 2px;
    border: solid 1px #c6cbd4*/
}

.next {
    background-color: transparent;
    color: black;
    /*border-radius: 2px;
    border: solid 1px #c6cbd4*/
}

.pagination a {
    text-decoration: none;
    display: inline-block;
    padding: 8px 16px;
    cursor: pointer
}

.today_attendance .right_nav {
    display: block
}

.track_info .cancel {
    background-color: transparent;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-align: center;
    color: #3b3b3b;
    border: none;
    position: absolute;
    right: 10px;
    bottom: 20px;
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.task_track .cancel {
    background-color: transparent;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-align: center;
    color: #3b3b3b;
    border: none;
    position: absolute;
    right: 30px;
    bottom: 20px;
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

#sucessmessage .modal-dialog {
    width: 400px;
    margin: 60px auto
}

.modalbox.success {
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #fff;
    padding: 25px 25px 15px;
    text-align: center
}

    .modalbox.success.animate .icon {
        -webkit-animation: fall-in 0.75s;
        -moz-animation: fall-in 0.75s;
        -o-animation: fall-in 0.75s;
        animation: fall-in 0.75s;
        box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)
    }

    .modalbox.success button, .modalbox.success button:active, .modalbox.success button:focus {
        -webkit-transition: all 0.1s ease-in-out;
        transition: all 0.1s ease-in-out;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        border-radius: 30px;
        margin-top: 15px;
        width: 20%;
        background: transparent;
        color: #9F1B29;
        border-color: #9F1B29;
        outline: none
    }

        .modalbox.success button:hover, .modalbox.success button:active:hover, .modalbox.success button:focus:hover {
            color: #fff;
            background: #9F1B29;
            border-color: transparent
        }

    .modalbox.success .icon {
        position: relative;
        margin: 0 auto;
        margin-top: -70px;
        background: #9F1B29;
        height: 60px;
        width: 60px;
        border-radius: 50%
    }

        .modalbox.success .icon span {
            font-size: 2em;
            color: #fff;
            text-align: center;
            padding-top: 17px
        }

.center {
    float: none;
    margin-left: auto;
    margin-right: auto
}

    .center .change {
        clearn: both;
        display: block;
        font-size: 10px;
        color: #ccc;
        margin-top: 10px
    }

@-webkit-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-moz-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-o-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-webkit-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 25%
    }
}

@-moz-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 25%
    }
}

@-o-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 25%
    }
}

@-moz-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-webkit-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-o-keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@keyframes fall-in {
    0% {
        -ms-transform: scale(3,3);
        -webkit-transform: scale(3,3);
        transform: scale(3,3);
        opacity: 0
    }

    50% {
        -ms-transform: scale(1,1);
        -webkit-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1
    }

    60% {
        -ms-transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1)
    }

    100% {
        -ms-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-moz-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 15%
    }
}

@-webkit-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 15%
    }
}

@-o-keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 15%
    }
}

@keyframes plunge {
    0% {
        margin-top: -100%
    }

    100% {
        margin-top: 15%
    }
}

.all_technician_learning .all_technician_passbook {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 20% 80%;
    grid-template-columns: 20% 80%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: initial
}

.technician_earning_header {
}

.graph_legends {
    text-align: right;
    -ms-grid-column: 2;
    line-height: 50px
}

.all_technician_passbook .technician_passbook_info {
    text-align: center;
    padding: 20px
}

    .all_technician_passbook .technician_passbook_info .main {
        margin-bottom: 30px
    }

@media (max-width: 1018px) {
    .technician_earning_header {
        grid-template-columns: 1fr
    }

    .all_technician_learning .earning_estimation {
        text-align: center
    }

    .all_technician_learning .graph_legends {
        text-align: center
    }
}

.graph_lbl {
    font-size: 15px;
    font-weight: 500;
    color: #101420;
    margin-top: 15px
}

.expenditure_grid_container {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 25% 75%;
    grid-template-columns: 25% 75%;
    background-color: #f6f8f8;
    -ms-grid-column: 2;
    grid-template-rows: 50px auto;
    padding: 15px
}

.column {
    display: none;
    -ms-grid-column: 2;
    background-color: #fff;
    -ms-grid-row: 2
}

.show {
    display: block
}

.btn {
    border: none;
    outline: none;
    padding: 12px 16px;
    background-color: white;
    cursor: pointer
}

.technician_details.active {
    box-shadow: 0 4px 24px 0 rgba(124,124,124,0.1);
    background-color: #fff
}

.form-control {
    height: auto;
    padding: 7px 12px;
}

.technician_list .technician_info p {
    font-size: 14px
}

#myBtnContainer .main {
    padding: 20px 10px 20px;
    background-color: #fff;
    margin: 0
}

.technician_list .technician_images {
    padding-right: 15px
}

.technician_list {
    padding: 15px 10%;
    cursor: pointer
}

.img {
    width: 50px !important
}

.expenditure_grid_container .task_details {
    padding: 5px 20px;
    border-radius: 0px;
    box-shadow: 0 0px 0px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff
}

.expenditure_grid_container .table {
    border: solid 1px #e9e9e9;
    border-radius: 5px
}

.amount_credit {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.71;
    color: #43a047
}

.expenses {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.71;
    color: #e53935
}

.task_header span {
    font-weight: bold
}

#addBalance p, #deductBalance p {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.71;
    letter-spacing: 0.1px;
    color: #212121
}

#addBalance .ExpenditureAddBalanceOuterDiv {
    max-width: 60%;
}

#addBalance #ExpenditureAddBalanceAmountID {
    padding: 3% 4%;
}

#addBalance #ExpenditureAddBalanceDescription {
    padding: 6% 4%;
}

#deductBalance .ExpenditureDeductAmountOuterDiv {
    max-width: 60%;
}

#deductBalance #ExpenditureDeductAmountID {
    padding: 3% 4%;
}

#deductBalance #ExpenditureDeductBalanceDescription {
    padding: 6% 4%;
}

.column .task_header {
    line-height: 50px
}

    .column .task_header p {
        line-height: 50px
    }

#myBtnContainer {
    grid-column: 1;
    box-shadow: 0 4px 24px 0 rgba(124,124,124,0.1);
    -ms-grid-row: 2
}

.page_heading {
    margin: 0px;
    padding: 15px 0px;
    font-size: 14px;
    font-weight: 500;
    color: #101420
}

.floatLeft {
    width: 20px;
    height: 20px;
    content: url('../../images/left_arrow.svg')
}

.logoHeader {
    padding: 0px 30px;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    color: #101420;
    margin: 0
}

.floatLeft {
    float: left
}

.floatRight {
    float: right;
    width: 20px;
    height: 20px;
    content: url('../../images/right_arrow.svg')
}

.navigator {
    display: inline-flex;
    align-items: center
}

.attendance_details_chart .bar_legend {
    display: grid;
    display: -ms-grid;
    grid-template-columns: 80% 20%;
    -ms-grid-columns: 80% 20%;
    align-items: center
}

@media (max-width: 1000px) {
    .bar_legend {
        padding: 10px
    }
}

.month_select, .year_select, .navigator {
    display: none
}

.form-inline legend {
    position: absolute;
    top: 0px;
    left: 10px;
    background-color: #fff;
    width: auto;
    border-bottom: none;
    font-size: 14px;
    color: #333;
    margin-bottom: 0px;
    font-weight: 500;
    padding: 0px 3px 0px 3px
}

.customer_details .text-field-container:nth-child(5) {
    -ms-grid-column: 3;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 4;
    -ms-grid-row: 3;
    grid-row-start: 4;
    margin-bottom: 20px
}

.customer_details .text-field-container:nth-child(6) {
    -ms-grid-column: 3;
    grid-column-start: 4;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 4;
    margin-bottom: 20px
}

.special_instruction .text-field-container:nth-child(2) {
    grid-column-start: 1;
    grid-column-end: 7;
    margin-top: 30px
}

.view-audio-section legend {
    position: relative;
}

.view-audio-section .text-field-container:nth-child(2) {
    grid-column-start: 1;
    grid-column-end: 7;
    margin-top: 10px;
}

.view-audio-section .text-field {
    padding: 0.5rem;
}

.view-audio-section audio {
    /*height: 28px;*/
    width: 100%;
}

.special_instruction {
    margin-bottom: 0px
}

.task_model select {
    padding: 7px;
}

.model_header_color {
    color: #353935;
    word-break: break-word
}

select {
    outline: none
}

#two .estimate .today_estimate .right_side {
    display: table-cell;
    vertical-align: middle;
}

    #two .estimate .today_estimate .right_side span {
        color: #0cb763;
        font-weight: 600;
        font-size: 30px;
        word-break: break-all;
    }

@media (max-width: 1250px) {
    .grid_container #grid {
        display: grid;
        -ms-grid-columns: 69% 30%;
        grid-template-columns: 59% 40%;
        grid-template-rows: 25px auto 25px auto;
        padding: 3%;
        border-right: solid 1px #e5e5e5
    }
}

.task-status {
    /*border-radius: 5px;
    -webkit-box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff;
    padding: 2% 1%;*/
    border-right: solid 2px #ddd;
    margin-top: 10px;
    margin-right: 5px;
}

    .task-status .item {
        border-radius: 0px !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        background-color: transparent !important;
        padding: 0px !important;
    }

select.status-classic {
    background-color: white;
    border-radius: 30px;
    display: inline-block;
    line-height: 1.5em;
    padding: 0.4em 3.5em 0.4em 3em;
    cursor: pointer;
    margin: 0 0 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}

select.status-classic {
    background-image: linear-gradient(45deg, transparent 50%, grey 50%), linear-gradient(135deg, grey 50%, transparent 50%);
    background-position: calc(100% - 20px) calc(1em + 1px), calc(100% - 15px) calc(1em + 1px), 100% 0;
    background-size: 5px 5px, 5px 5px, 2.5em 2.5em;
    background-repeat: no-repeat
}

.bar_legend select {
    background-color: white;
    border-radius: 30px;
    display: inline-block;
    line-height: 1.5em;
    padding: 0.5em 2.5em 0.5em 1em;
    cursor: pointer;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none
}

select.classic {
    background-image: linear-gradient(45deg, transparent 50%, grey 50%), linear-gradient(135deg, grey 50%, transparent 50%);
    background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), 100% 0;
    background-size: 5px 5px, 5px 5px, 2.5em 2.5em;
    background-repeat: no-repeat
}

#passbook .modal-header {
    border-bottom: none
}

#canvas, .loadbar {
    padding: 10px 35px;
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3
}

.right_nav .item .estimate .technician_task .work_status .reject_dot {
    width: 12px;
    height: 12px;
    background-color: #c3002f;
    border-radius: 50%;
    margin-top: 3px;
    margin-right: 3px
}

.right_nav .item .estimate .technician_task .work_status .reject {
    color: #c3002f
}

input:-internal-autofill-selected {
    background-color: transparent !important
}

#addTaskNameError, #addTaskCustomerNameError, #editTaskNameError, #editTaskCustomerNameError, #addTaskCustomerNameErrorQuickLink {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskSelectTaskTypeError, #editTaskSelectTaskTypeError, #addTaskCustomerNumberError, #editTaskCustomerNumberError, #addTaskSelectTaskTypeErrorQuickLink, #addTaskCustomerNumberErrorQuickLink {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskRateError, #addTaskItemQuantityError, #addTaskItemQuantityErrorQuickLink, #addTaskZipCodeError, #editTaskInactiveError, #editTaskItemQuantityError, #editTaskZipCodeError, #addTaskZipCodeErrorQuickLink {
    grid-column-start: 5;
    grid-column-end: 7;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskDateError, #addTaskDateErrorQuickLink, #editTaskDateError {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 5;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskTimeError, #addTaskTimeErrorQuickLink, #editTaskTimeError {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 5;
    margin-left: 0px;
    margin-bottom: 0
}

#editTaskRateError {
    grid-column-start: 5;
    grid-column-end: 7;
    grid-row-start: 5;
    margin-left: 10px;
    margin-bottom: 0
}

#addTaskAssigntoError, #addTaskAssigntoErrorQuickLink, #editTaskAssigntoError {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskAssignitemError, #addTaskAssignitemErrorQuickLink, #editTaskAssignitemError {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskAddressError, #editTaskAddressError, #addTaskAddressErrorQuickLink {
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row-start: 5;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskLandmarkError, #editTaskLandmarkError, #addTaskLandmarkErrorQuickLink {
    grid-column-start: 4;
    grid-column-end: 7;
    grid-row-start: 5;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTaskSpecialInstructionError, #editTaskSpecialInstructionError, #addTaskSpecialInstructionErrorQuickLink {
    grid-column-start: 1;
    grid-column-end: 7;
    grid-row-start: 3;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#editTaskEndDateError {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 7;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#editTaskEndTimeError {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 7;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#editTaskEarnedAmountError {
    grid-column-start: 5;
    grid-column-end: 7;
    grid-row-start: 7;
    /*margin-left: 10px;*/
    margin-bottom: 0
}

#addTechnicianUserNameError, #addTechnicianPhoneNumberError, #editTechnicianNameerror, #editTechnicianContactNumbererror, #editTechnicianEmailiderror {
    margin-left: 10px;
    margin-bottom: 0px
}

#addTechnicianUserNameErrorQuickLink, #addTechnicianPhoneNumberErrorQuickLink {
    margin-left: 0px !important
}

.btn-info:active:focus {
    background-color: transparent;
    border: none;
    color: #ffc2c2;
}

.btn:active {
    box-shadow: none
}

.time .text-field input {
    z-index: auto
}

@media (min-width: 1024px) {
    #task_track .modal-lg {
        // width: 1200px !important;
        margin: 30px auto
    }
}

.form-inline .form-control {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    margin: 0px
}

.input-group .form-control:focus {
    z-index: 2
}

.ExpeditureHeader {
    background-color: #fff;
    padding: 0 20px
}

@media (max-width:1040px) {
    .loadbars, #chart-parent {
        height: 100vh
    }

    #chart-parent {
        height: 100vh
    }

    .all_technician_learning .earning_estimation, .earning_legends {
        text-align: center;
        float: none
    }

    .all_technician_passbook .technician_passbook_info {
        text-align: center;
        padding: 10px
    }

        .all_technician_passbook .technician_passbook_info .main {
            margin-bottom: 10px;
            margin-top: 0
        }
}

@media (max-width:991.5px) {
    .row > * {
        width: 100%;
    }

    table > thead > tr > th, .table > thead > tr > th {
        padding: 10px
    }

    .task_grid_container, .expenditure_grid_container {
        overflow-x: scroll
    }

    .task_details {
        overflow-y: scroll
    }

    .task_header {
        -ms-grid-columns: 1fr 2fr;
        grid-template-columns: 1fr 2fr
    }

    .attendance_grid_container {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 30% 70%;
        grid-template-columns: 30% 70%;
        -ms-grid-column: 2;
        overflow-x: scroll
    }

    .add_technician_model .modal-dialog {
        width: 350px;
        margin: 30px auto
    }

    .task_header {
        -ms-grid-columns: 70px auto;
        grid-template-columns: 70px auto
    }

        /*.task_header select {
            padding: 0
        }*/

    .all_technician .technician_images img {
        width: 40px
    }

    .today_attendance label span {
        font-size: 11px
    }

    .all_technician .technician_info p {
        font-size: 12px
    }

    .all_technician .technician_info span {
        font-size: 12px
    }
}

.passbookTechnicianProfileImage {
    width: 60px;
    border-radius: 50%
}

@media (max-width:780px) {
    .tab_container label {
        font-size: 11px
    }

    .legend {
        -ms-grid-column: 2;
        padding-left: 20px
    }

    .grid_container #grid .total_days {
        top: 20%
    }

    .attendance_details_chart .bar_legend {
        grid-template-columns: 70% 30%
    }

    #two .estimate .today_estimate .right_side span {
        font-size: 18px
    }

    .tab button {
        padding: 0
    }

    .today_attendance label {
        padding: 17px 0px
    }

    .all_technician .technician_images img {
        width: 40px
    }

    .today_attendance label span {
        font-size: 11px
    }

    .all_technician .technician_info p {
        font-size: 12px
    }

    .all_technician .technician_info span {
        font-size: 12px
    }

    .technician_details .technician_images img {
        width: 40px !important
    }

    .technician_list .technician_images {
        padding-right: 10px
    }

    .task_header {
        -ms-grid-columns: 70px auto;
        grid-template-columns: 70px auto
    }

        .task_header select {
            padding: 0
        }
}

.field-icon {
    position: absolute;
    right: 15px;
    z-index: 99999
}

@media (max-width:973px) {
    .legend ul {
        margin-left: 50px
    }

        .legend ul li {
            width: 49%
        }
}

@media (max-width:781px) {
    .legend ul {
        margin-left: 0px
    }
}

.pagination_hide {
    display: none
}

.pagination_show {
    display: block
}

@media only screen and (max-width: 1440px) {
    .right_nav {
        padding: 9% 4%
    }

        .right_nav .item .estimate .technician_task .techniciantsak_location {
            font-size: 12px;
            letter-spacing: 0.3px;
            color: #a8a8a8;
            white-space: nowrap;
            width: 150px;
            overflow: hidden;
            text-overflow: ellipsis
        }
}

.main .form-control {
    padding: 7px 16px
}

.pac-container {
    z-index: 1100 !important
}

.date .text-field.text-field--outlined.has-focus {
    z-index: unset
}

.create_task {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
    border-radius: 4px;
    background-color: #c3002f;
    font-family: 'Roboto',sans-serif;
    padding: 10px 12px;
    cursor: pointer;
    white-space: nowrap;
}

    .create_task a {
        color: #fff
    }

        .create_task a:hover {
            text-decoration: none
        }

.enquiry-task-details .text-field-container:nth-child(5) {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3
}

.enquiry-task-details .text-field-container:nth-child(6) {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 3
}

.enquiry-task-details .text-field-container:nth-child(7) {
    -ms-grid-column: 3;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-row: 3;
    grid-row-start: 5
}

.enquiry-task-details .text-field-container:nth-child(8) {
    -ms-grid-column: 3;
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 5
}

.enquiry-task-details .text-field-container:nth-child(6) .text-field input {
    padding: 6px
}

.enquiry-task-details .text-field-container:nth-child(7) .text-field input {
    padding: 8px
}

.technicial_details .text-field-container:nth-child(2) {
    grid-column-start: 1;
    grid-column-end: 4
}

.technicial_details .text-field-container:nth-child(3) {
    grid-column-start: 4;
    grid-column-end: 7
}

.technicial_details .text-field-container:nth-child(4) {
    grid-column-start: 1;
    grid-column-end: 7;
    grid-row-start: 3;
    margin-top: 20px
}

.technicial_details select {
    /*height: 47px*/
}

#add_enquiry .modal-footer .cancel, #view_enquiry_details .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#add_enquiry .modal-footer .add_task_submit, #view_enquiry_details .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

#add_enquiry .modal-footer, #view_enquiry_details .modal-footer {
    border-top: none
}

.specialinstruction .text-field input {
    /*padding: 4%*/
}

.enquiry_detail_content .task_button_group {
    display: grid;
    grid-template-columns: auto auto auto;
    /*grid-gap: 10px;*/
    justify-content: end
}

    .enquiry_detail_content .task_button_group .main {
        margin-top: 0
    }

        .enquiry_detail_content .task_button_group .main .form-control, .enquiry_detail_content .task_button_group .main .btn {
            padding: 8px 16px
        }

#enquiryCustName, #enquiryCustNameQuickLink {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    margin-bottom: 0;
}

#enquiryCustNo, #enquiryCustNoQuickLink {
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5
}

#enquiryEmailId, #enquiryEmailIdQuickLink {
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7
}

#DdlServiceTypeAddEnquiryListError, #DdlServiceTypeAddEnquiryListErrorQuickLink {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    margin-bottom: 0
}

#DdlTaskTypeAddEnquiryListError, #DdlTaskTypeAddEnquiryListErrorQuickLink {
    -ms-grid-column: 3;
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    margin-bottom: 0
}

#EnquiryFrmTaskdatepickerError, #EnquiryFrmTaskdatepickerErrorQuickLink {
    -ms-grid-column: 5;
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    margin-bottom: 0
}

#PrefTimeError, #PrefTimeErrorQuickLink {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 4
}

#enquiryaddError, #enquiryaddErrorQuickLink {
    grid-column-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 4
}

#enquirylandmarkError, #enquirylandmarkErrorQuickLink {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-row: 3;
    grid-row-start: 6
}

#zipcodeError, #zipcodeErrorQuickLink {
    grid-column-start: 5;
    -ms-grid-column-span: 2;
    grid-column-end: 7;
    -ms-grid-row: 3;
    grid-row-start: 6
}

#techproblemError, #techproblemErrorQuickLink {
    grid-column-start: 1;
    grid-column-end: 4;
    margin-bottom: 0;
}

#DdlReferenceTypeAddEnquiryListError, #DdlReferenceTypeAddEnquiryListErrorQuickLink {
    grid-column-start: 4;
    grid-column-end: 7
}

#specialinstructionError, #specialinstructionErrorQuickLink {
    grid-column-start: 1;
    grid-column-end: 7;
    grid-row-start: 4
}

#enquiry_add_task .modal-footer .cancel, #view_enquiry_details .cancel, #Lead_add_task .modal-footer .cancel, #add_enquiry_QuickLink .modal-footer .cancel, #add_lead_QuickLink .modal-footer .cancel, #view_enquiry_details .cancel, .enquiry-form .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#enquiry_add_task .modal-footer .add_task_submit, #add_lead_QuickLink .modal-footer .add_task_submit, #view_enquiry_details .add_task_submit, #add_enquiry_QuickLink .modal-footer .add_task_submit, #view_enquiry_details .add_task_submit, .enquiry-form .add_task_submit, #Lead_add_task .modal-footer .add_task_submit, #view_lead_details .add_task_submit, #add_lead_QuickLink .modal-footer .add_task_submit, #view_lead_details .add_task_submit, .lead-form .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

#add_enquiry .technicial_details select, #add_lead .technicial_details select {
    height: 47px
}

#add_enquiry .enquiry-task-details select, #add_enquiry_QuickLink .enquiry-task-details select, #enquiry_add_task .addtask_form select, #add_task .addtask_form select, #add_task_QuickLink .addtask_form select, #view_enquiry_details .enquiry-task-details select, #Lead_add_task .addtask_form select, #view_lead_details .lead-task-details select {
    height: 38px
}

.EnquiryListDeletebutton, .EnquiryListEditbutton {
    cursor: pointer
}

#TfooterEnquiryListTableId .table-filter {
    display: block !important
}

    #TfooterEnquiryListTableId .table-filter .search, #TfooterCustomerListId .table-filter .search {
        background-color: #f6f3f4;
        border: none;
        padding: 8px 16px;
        position: absolute;
        top: 101px;
        right: 191px;
        background-image: url('../../images/search.png');
        background-repeat: no-repeat;
        background-position: 95% 50%;
        background-size: 14px
    }

#TfooterCustomerListId .table-filter .search {
    right: 55px !important
}

#sentEmail .modal-footer .cancel, #sentSMS .modal-footer .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#sentEmail .modal-footer .add_task_submit, #sentSMS .modal-footer .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.card-header .btn {
    padding: 12px 10px
}

.note-insert {
    display: none
}

#sentEmail .dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent
}

#sentEmail .btn-light {
    color: #1f2d3d;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    box-shadow: none
}

#sentEmail .dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0
}

.note-editor.note-frame .note-editing-area .note-editable {
    height: 150px
}

#editCustomerList p {
    margin: 0
}

#editCustomerList .modal-footer .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

#editCustomerList .modal-footer .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.sidenav {
    position: fixed;
    width: 355px;
    right: 0;
    /*top: 0;
    height: 100%;*/
    top: 71px;
    bottom: 0;
    box-shadow: 0 16px 16px 0 rgba(0, 0, 0, 0.24), 0 0 16px 0 rgba(0, 0, 0, 0.18);
    background-color: #f5f5f5;
    z-index: 999;
    -moz-transform: translateX(105%);
    -ms-transform: translateX(105%);
    -o-transform: translateX(105%);
    -webkit-transform: translateX(105%);
    transform: translateX(105%);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    padding: 16px 24px;
    font-family: "Roboto",sans-serif;
    overflow-y: scroll
}

#overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 11;
    cursor: pointer
}

.notification-sidenav-header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 24px;
    align-items: center;
    font-family: "Roboto",sans-serif
}

    .notification-sidenav-header .tittle p {
        font-size: 14px;
        font-weight: 500;
        color: #000;
        margin: 0
    }

    .notification-sidenav-header .clearall p {
        font-size: 14px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #c3002f;
        margin: 0;
        cursor: pointer
    }

    .notification-sidenav-header .tittle img {
        margin-right: 13px;
        cursor: pointer
    }

.notification-content .tittle {
    font-size: 12px;
    color: #757575;
    margin: 0;
    margin-bottom: 0
}

.notification-content h5 {
    margin-top: 0
}

.notification-status {
    border-radius: 2px;
    background-color: #fff;
    padding: 9px 9px 16px 9px;
    margin-bottom: 20px
}

    .notification-status .tittle {
        display: flex;
        justify-content: space-between;
        align-items: center
    }

        .notification-status .tittle span {
            font-size: 10px;
            font-weight: 500;
            letter-spacing: 0.12px;
            color: #a8a8a8
        }

.notification-content .reject p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: #c3002f;
    margin: 0
}

.ongoing p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: #ff9b00;
    margin: 0
}

.info p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: #80cbc4;
    margin: 0
}

.complete p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: #03de73;
    margin: 0
}

.earned p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: #42cb83;
    margin: 0
}

.notification-status img {
    margin-right: 9px;
    width: 20px;
    height: 20px;
}

.notification-status h5 {
    padding-left: 33px;
    line-height: 1.43;
    word-break: break-word
}

.notification-status .btn-view-details {
    border-radius: 2px;
    border: solid 1px #c3002f;
    font-size: 13px;
    text-align: center;
    color: #c3002f;
    padding: 7px 13px;
    margin-left: 33px !important
}

    .notification-status .btn-view-details a {
        color: #c3002f
    }

.notification-status .btn-reassign {
    border-radius: 2px;
    background-color: #c3002f;
    border: solid 1px #c3002f;
    font-size: 13px;
    text-align: center;
    color: #fff;
    padding: 7px 13px
}

.toggle .btn {
    border: solid 1px #5d5d5d;
    /*    padding: 4px 29px;*/
    padding: 4px;
    width: 50%;
    /*    font-size: 14px;
*/ font-size: 13px;
    line-height: 1.71;
    letter-spacing: 0.13px;
    color: rgba(0, 0, 0, 0.6);
    font-family: "Roboto",sans-serif
}

.toggle .btn-lg {
}

.border-right {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px
}

.border-left {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px
}

.rate {
    display: none
}

.maintance-message {
    width: 600px;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Roboto",sans-serif
}

    .maintance-message img {
        display: block;
        margin: 0 auto
    }

    .maintance-message h1 {
        font-weight: bold;
        line-height: 1.33;
        letter-spacing: -0.17px;
        text-align: center;
        color: #c3002f;
        padding: 37px 0
    }

    .maintance-message p {
        font-size: 28px;
        line-height: 1.11;
        letter-spacing: -0.16px;
        text-align: center;
        color: #10131f
    }

    .maintance-message a {
        font-size: 28px;
        line-height: 1.11;
        letter-spacing: -0.16px;
        text-align: center;
        color: #10131f;
        margin: auto;
        display: block
    }

        .maintance-message a:hover {
            color: #337ab7
        }

    .maintance-message .footer {
        margin-top: 43px
    }

        .maintance-message .footer h3 {
            font-size: 21px;
            letter-spacing: -0.12px;
            text-align: center;
            color: #10131f;
            font-weight: 600
        }

        .maintance-message .footer p {
            font-size: 21px;
            letter-spacing: -0.12px;
            text-align: center;
            color: #10131f
        }

.login_form .text-danger {
    margin-left: 0
}

.distance-covered {
    margin-top: 63px;
    font-family: "Roboto",sans-serif
}

    .distance-covered p {
        font-size: 16px;
        font-weight: 500;
        letter-spacing: 0.2px;
        color: #727272
    }

    .distance-covered h1 {
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: 1.07px;
        color: #212121
    }

.bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"] {
    background-color: #c3002f !important
}

.profile-pic {
    width: 80px;
    height: 80px;
    margin: 0px 15px 0px 0px;
    position: relative
}

.upload-button {
    position: absolute;
    /*right: 13px;
    bottom: 13px;*/
    right: 0px;
    bottom: 0px;
    cursor: pointer
}

.avatar-edit .upload-button {
    right: 209px;
}

.file-upload {
    display: none !important
}

.notification--num {
    position: absolute;
    top: 26%;
    left: 47%;
    font-size: 10px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    background-color: #9ccc65;
    border: 4px solid #9ccc65;
    color: #fff;
    text-align: center;
    animation: beat 0.25s infinite alternate;
    line-height: 14px;
    font-family: "Roboto",sans-serif
}

@keyframes beat {
    to {
        transform: scale(0.9)
    }
}

.dropdown-menu > li > a {
    padding: 11px 20px;
    cursor: pointer
}

.dropdown-menu > li {
    border-bottom: solid 0.5px #f3f3f3
}

    .dropdown-menu > li:last-child {
        border-bottom: none
    }

.marginR {
    margin-right: 4px
}

.noborder {
    border: none
}

.myprofilemodal {
    position: relative;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0,0,0,0.5);
    outline: 0;
}
    .myprofilemodal .tab-content > .tab-pane {
        /*height: 440px;*/
        height: auto;
    }
.my-profile-content {
    display: grid;
    /*grid-template-columns: 130px auto*/
    /*grid-gap: 20px;*/
    padding: 0 10px;
}

.myprofilemodal .my-profile-content .profileMobileOTP {
    /*grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 3;
    grid-row-start: 3;*/
    display: none;
}

.myprofilemodal .my-profile-content .profileMobileVerifySection {
    /*grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 3;
    grid-row-start: 3;*/
    display: none;
}

.myprofilemodal .my-profile-content .profileMobileVerifySection {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.13125px;
    color: #4CAF50;
    margin-bottom: 0px;
}

    .myprofilemodal .my-profile-content .profileMobileVerifySection img {
        width: 14px;
    }

.myprofilemodal .my-profile-content .profileEmailOTP.indian {
    /*grid-column-start: 2;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3;*/
    display: none;
}

.myprofilemodal .my-profile-content .profileEmailOTP.nonindian {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 3;
    grid-row-start: 3;
    display: none;
}

.myprofilemodal .my-profile-content .profileEmailVerifySection.indian {
    /*grid-column-start: 2;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3;*/
    display: none;
}

.myprofilemodal .my-profile-content .profileEmailVerifySection.nonindian {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 3;
    grid-row-start: 3;
    display: none;
}

.myprofilemodal .my-profile-content .profileEmailVerifySection {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.13125px;
    color: #4CAF50;
    margin-bottom: 0px;
}

    .myprofilemodal .my-profile-content .profileEmailVerifySection img {
        width: 14px;
    }

.myprofilemodal #MyProfileMobileNo:disabled,
.myprofilemodal #MyProfileEmailID:disabled {
    background-color: #f6f3f4;
}

.myprofilemodal .my-profile-content .profileAddress {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 4;
    grid-row-start: 4;
}

.myprofilemodal .my-profile-content .profileDOB {
    /*grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 5;
    grid-row-start: 5;*/
}

.myprofilemodal .my-profile-content .profileNoOfEmp {
    /*grid-column-start: 2;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 5;
    grid-row-start: 5;*/
}


.myprofilemodal .my-profile-content .companyAddress {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 2;
    grid-row-start: 2;
}

.myprofilemodal .my-profile-content .company-details-title {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 2;
    grid-row-start: 2;
    /*border-top: solid 2px #ddd;
    padding: 8px 0px 25px;*/
}

.myprofilemodal .my-profile-content .profileAddress input,
.myprofilemodal .my-profile-content .profileOTP input {
    height: 40px;
}

.profile-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 20px
}

.btn-cancel-nobg {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500;
    padding: 12px 16px
}

.btn-submit-withbg {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 12px 16px
}

.bootstrap-datetimepicker-widget table td span {
    display: inline-block;
    width: 54px;
    height: 28px;
    line-height: 28px;
    margin: 2px 1.5px;
    cursor: pointer;
    border-radius: 4px
}

.bootstrap-datetimepicker-widget table td {
    height: 24px;
    line-height: 24px;
    width: 24px
}

.otp-section {
    /*padding: 0px 200px*/
    padding: 5rem;
}

    .otp-section .login_body .credentials {
        font-size: 16px;
        width: 100%;
        margin: 0
    }

    .otp-section .signup_form {
        padding: 0;
        margin: 32px 0
    }

    .otp-section .not_yet {
        margin-bottom: 20px
    }

    .otp-section .btn {
        font-size: 18px;
        font-weight: bold;
        line-height: 1.44;
        letter-spacing: 0px;
        text-align: center;
        color: #fff;
        border-radius: 6px !important;
        padding: 13px 0 !important;
        width: 73% !important
    }

.sidenav-trigger {
    cursor: pointer
}

.noMargin {
    margin: 0
}

.step-2 {
    display: none
}

.back {
    font-family: "Roboto",sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.71;
    color: #343434;
    margin-top: 20px;
    cursor: pointer
}

    .back img {
        margin-right: 5px
    }

#SignUpSection {
    display: none
}

.otp-sucess-message {
    font-size: 16px;
    color: green
}

.add_task_quickLink_footer {
    display: flex;
    justify-content: flex-end
}

.profile-pic #MyProfilePicsId {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
}

/*.input-group-addon {
    border: 1px solid #5d5d5d
}*/

.text-field .input-group .form-control:not(:first-child):not(:last-child), .text-field .input-group-addon:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child) {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.text-field .form-control {
    box-shadow: none
}

.rate .text-field input {
    padding: 3%
}

.rate .text-field.has-focus label,
.rate .text-field.has-value label {
    top: -1.5px;
}

.mandatory-field {
    position: absolute;
    right: 18px
}

.add_task_QuickLink_form-inline {
    display: grid;
    grid-template-columns: auto auto auto
}

.section-heading {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 6
}

.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 10px
}

.grid-item {
}

#add_task_QuickLink .addtask_form .text-field-container {
    margin-right: 10px;
    margin-left: 0
}

    #add_task_QuickLink .addtask_form .text-field-container:last-child {
        margin-right: 0px
    }

.rate_toggle-btn {
    margin-bottom: 20px
}

    .rate_toggle-btn .toggle {
        width: 100%
    }

.zeroMargin {
    margin-left: 0
}

.rate_toggle_btn .toggle, .toggle {
    width: 100%;
    display: flex
}

.quicklink_task_details {
    margin: 0 0 15px 0;
}

    .quicklink_task_details legend {
        top: 15px
    }

.flex-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

.total_distance {
    text-align: center
}

    .total_distance h2 {
        font-size: 30px;
        line-height: 1.2;
        letter-spacing: 0.2px;
        color: #212121;
        text-align: center;
        margin-bottom: 0;
        font-weight: bold
    }

    .total_distance p {
        margin: 0;
        font-size: 17px;
        line-height: 1.41;
        letter-spacing: 0.2px;
        color: #7b7b7b;
        text-align: center
    }

#add_task_QuickLink .mandatory-field {
    position: absolute;
    right: 18px;
    top: 17px
}

.iffyTip {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.hideText_A8 {
    max-width: 80px;
}

.hideText_A15 {
    max-width: 130px;
}

.hideText2 {
    max-width: 200px;
}

.hideText270 {
    max-width: 270px;
}

.hideText100 {
    max-width: 100px;
}

.track_info .content {
    background-color: #c3002f;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    color: #fff;
    padding: 15px;
    margin-top: 26px
}

    .track_info .content p {
        margin: 0
    }

.track_info .footer {
    text-align: center;
    padding: 26px 0
}

    .track_info .footer .kilometer {
        font-size: 36px;
        font-weight: 500;
        color: #212121;
        margin: 0
    }

    .track_info .footer select {
        font-size: 18px;
        font-weight: 300;
        color: #7b7b7b;
        border: none
    }

#task_track .modal-lg {
    margin: 60px auto
}

.task_track {
    display: -ms-grid;
    display: grid;
    grid-template-columns: 70% 30%
}

#task_track .modal-body {
    padding: 0
}

.track_info .technician_details {
    /*padding: 15px;*/
    padding: 1rem 0rem;
}

#companyDetails .companyAddress {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3
}

#inventory_details .number {
    display: flex
}

.add_technician_model .modal-dialog {
    width: 450px
}

#Export_task .modal-dialog, #Export_lead .modal-dialog, #Export_FOCtask .modal-dialog, #Export_CRMtask .modal-dialog, #Export_ItemLst .modal-dialog, #Export_ENQtask .modal-dialog, #Export_payment .modal-dialog {
    width: 450px;
    /*-webkit-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);*/
}

    #Export_task .modal-dialog .btn-download, #Export_lead .modal-dialog .btn-download, #Export_FOCtask .modal-dialog .btn-download, #Export_CRMtask .modal-dialog .btn-download, #Export_ItemLst .modal-dialog .btn-download, #Export_ENQtask .modal-dialog .btn-download, #Export_payment .modal-dialog .btn-download{
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 7px;
        font-weight: 500;
        color: #fff;
    }

    #Export_task .modal-dialog .modal-body .content-section, #Export_lead .modal-dialog .modal-body .content-section, #Export_FOCtask .modal-dialog .modal-body .content-section, #Export_CRMtask .modal-dialog .modal-body .content-section, #Export_ItemLst .modal-dialog .modal-body .content-section, #Export_ENQtask .modal-dialog .modal-body .content-section, #Export_payment .modal-dialog .modal-body .content-section{
        border: 0.6px dashed #C7C7C7;
        box-sizing: border-box;
        border-radius: 4px;
        padding: 6% 10%;
    }

#inventory_details .minus, #inventory_details .plus {
    width: 30px;
    background: #f2f2f2;
    padding: 6px 5px;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    color: #c3002f;
    cursor: pointer
}

#inventory_details tbody {
    display: block;
    height: 200px;
    overflow-x: hidden;
    overflow-y: auto
}

    #inventory_details thead, #inventory_details tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed
    }

#inventory_details input {
    height: 34px;
    font-weight: bold;
    width: 50px;
    text-align: center;
    font-size: 16px;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle
}

#inventory_details tbody .assign_item_note {
    display: none
}

.assign_item_note input {
    width: 100% !important;
    font-weight: normal !important;
    text-align: initial !important
}

#inventory_details tbody tr {
    display: block !important
}

#inventory_details .break {
    float: left;
    line-height: 22px;
    width: 100%
}

.item_inventary_view_details {
    display: flex;
    flex-wrap: wrap
}

.AssignItemTable .header p {
    /*font-weight: bold;*/
    font-weight: 400;
    font-size: 16.183px;
    line-height: 28px;
    color: #000000;
    white-space: nowrap;
}

.w-33 {
    width: 31%;
    margin-right: 2%
}

.item_inventary_view_details .block {
    width: 100%
}

.assign_item_note {
    display: none
}

.invertary-details-content {
    margin-bottom: 10px
}

.company_Profile_Upload {
    display: none !important
}

.Companyuploadbutton {
    position: absolute;
    right: 0;
    bottom: 0;
    cursor: pointer
}

.profile-pic #CompanyProfilePicsId {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
}

.setu_status .green_status {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #64dd17;
    font-family: "Roboto-Medium"
}

.setu_status .red_status {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #dd2c00;
    font-family: "Roboto-Medium"
}

.temp_status .green {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #64dd17;
    font-family: "Roboto-Regular"
}

.temp_status .red {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #dd2c00;
    font-family: "Roboto-Regular"
}

.technician_status p {
    margin: 0
}

.setu_status .orange_status {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #ff9b00;
    font-family: "Roboto-Medium";
}

#companyDetails .companyAddress {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    -ms-grid-row: 3;
    grid-row-start: 3
}

#companyDetails .companyCity {
    grid-column-start: 1;
    -ms-grid-column-span: 2;
    grid-column-end: 2;
    -ms-grid-row: 4;
    grid-row-start: 4;
}

#inventory_details .number {
    display: flex
}

#ItemInventoryTableID .show-more-menu .active {
    padding: 10px 0px;
}

.add_technician_model .modal-content {
    /*padding-bottom: 35px;*/
    padding-bottom: 0px;
}

.add_technician_model .modal-header {
    /*border-bottom: none;*/
    padding: 15px;
}

.add_technician_model .close {
    color: #C22032;
    opacity: 1;
    font-size: 30px;
    font-weight: 500;
}

.add_technician_model .modal-dialog {
    width: 725px;
}

    .add_technician_model .modal-dialog h4 {
        font-weight: 500;
        font-size: 22px;
        /*line-height: 0px;*/
        text-align: center;
        color: #121319;
        /*margin-bottom: 30px;*/
    }

.add_technician_model .modal-body {
    /*padding: 15px 50px;*/
}

.add_technician_model .modal-dialog .form-inner {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 30px;
}

    .add_technician_model .modal-dialog .form-inner .d-flex {
        flex-wrap: wrap;
        justify-content: space-between;
    }

        .add_technician_model .modal-dialog .form-inner .d-flex .sec {
            width: 40%;
        }

    .add_technician_model .modal-dialog .form-inner .fields {
        width: 60%;
        margin-top: 10px;
    }

.add_technician_model .modal-dialog .field-container {
    position: relative;
    margin-bottom: 35px;
}

    .add_technician_model .modal-dialog .field-container.qty div {
        display: flex;
        background: #FFFFFF;
        border: 1px solid #9A9FAA;
        border-radius: 2px;
        padding: 0px 15px;
    }

        .add_technician_model .modal-dialog .field-container.qty div a {
            margin-top: 11px;
            color: #9A9FAA;
            cursor: pointer;
        }

            .add_technician_model .modal-dialog .field-container.qty div a i {
                -webkit-text-stroke: 0.5px #FFFFFF;
            }

        .add_technician_model .modal-dialog .field-container.qty div input {
            border: none;
        }

    .add_technician_model .modal-dialog .field-container label {
        position: absolute;
        top: -7px;
        left: 12px;
        background: #FFFFFF;
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        color: #888888;
        padding: 0 5px;
        z-index: 1;
    }

    .add_technician_model .modal-dialog .field-container input,
    .add_technician_model .modal-dialog .field-container select,
    .add_technician_model .modal-dialog .field-container textarea {
        width: 100%;
        background: #FFFFFF;
        border: 1px solid #9A9FAA;
        border-radius: 2px;
        outline: none;
        padding: 10px 15px;
        height: auto;
        font-weight: 400;
        font-size: 15px;
        line-height: 18px;
        color: #1D2536;
    }
/*.add_technician_model .modal-dialog .form-inner .fields .field-container input:focus-visible,
.add_technician_model .modal-dialog .form-inner .fields .field-container select:focus-visible,
.add_technician_model .modal-dialog .form-inner .fields .field-container textarea:focus-visible {
    outline: none;
}*/


.add_technician_model .modal-dialog .form-inner .image {
    width: 40%;
    padding: 10px 0px 0px 10px;
}

    .add_technician_model .modal-dialog .form-inner .image .upload-btn-wrapper {
        position: relative;
        overflow: hidden;
        display: inline-block;
        width: 100%;
        height: 100%;
    }

        .add_technician_model .modal-dialog .form-inner .image .upload-btn-wrapper .close {
            position: absolute;
            top: 15px;
            right: 15px;
            z-index: 99;
        }

    .add_technician_model .modal-dialog .form-inner .image .container {
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        border: 1px solid #9A9FAA;
        border-radius: 2px;
        padding: 0px;
    }

        .add_technician_model .modal-dialog .form-inner .image .container .center {
            width: 100%;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

            .add_technician_model .modal-dialog .form-inner .image .container .center p {
                font-weight: 500;
                font-size: 16px;
                line-height: 30px;
                text-align: center;
                color: #9A9FAA;
                margin: 0;
            }

    .add_technician_model .modal-dialog .form-inner .image .upload-btn-wrapper input[type=file] {
        font-size: 100px;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        width: 100%;
        height: 100%;
    }

.add_technician_model .modal-dialog .video-link {
    text-align: center;
    /*padding: 50px 0px 25px;*/
}

    .add_technician_model .modal-dialog .video-link a {
        font-weight: 500;
        font-size: 16px;
        line-height: 19px;
        text-align: center;
        color: #9A9FAA;
        text-decoration: none;
        cursor: pointer;
    }

        .add_technician_model .modal-dialog .video-link a i {
            -webkit-text-stroke: 0.5px #FFFFFF;
        }

.add_technician_model .modal-footer {
    /*text-align: center;*/
}

    .add_technician_model .modal-footer .add_task_submit {
        /*font-weight: 600;*/
        /*font-size: 16px;*/
        text-align: center;
        /*letter-spacing: 1px;*/
        color: #FFFFFF;
        /*border-radius: 36px;*/
        width: fit-content;
        max-width: 290px;
        text-transform: capitalize;
    }

.modal-footer .add_task_submit:active:focus {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.modal-footer button {
    text-transform: capitalize;
}

.add_technician_model .text-danger {
    padding-top: 5px;
}

.mb-0 {
    margin-bottom: 0px !important;
}

#inventory_details .minus, #inventory_details .plus {
    width: 50px;
    background: #f2f2f2;
    padding: 6px 5px;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    color: #c3002f
}

#inventory_details tbody {
    display: block;
    height: 200px;
    overflow-x: hidden;
    overflow-y: auto
}

    #inventory_details thead, #inventory_details tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed
    }

#inventory_details input {
    height: 34px;
    font-weight: bold;
    width: 50px;
    text-align: center;
    font-size: 16px;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle
}

#inventory_details tbody .assign_item_note {
    display: none
}

.assign_item_note input {
    width: 100% !important;
    font-weight: normal !important;
    text-align: initial !important
}

#inventory_details tbody tr {
    display: block !important
}

#inventory_details .break {
    float: left;
    line-height: 22px;
    width: 100%
}

.secondtd {
    text-align: center
}

.secondtd, .secondth {
    width: 33.33%
}

.firsttd, .firstth {
    width: 33.33%
}

.thirdtd, .thirdth {
    width: 33.33%
}

#inventory_details .modal-dialog {
    width: 400px;
}

.firsttd {
    width: 48%;
}

.thirdtd {
    width: 42%;
}

    .thirdtd input {
        width: 100% !important;
    }

.task-view-details .modal-header {
    border: none
}

.task-view-details .modal-body {
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    padding: 0 15px 0 15px;
}

    .task-view-details .modal-body.vd-body {
        display: block;
        grid-auto-columns: unset;
        grid-auto-flow: unset;
        padding: 0 15px 0 15px;
    }


.task-view-details fieldset {
    border-radius: 2px;
    border: solid 1px #e7e7e7;
    padding: 10px;
    position:relative;
}

    .task-view-details fieldset legend {
        margin: 0 5px;
        padding: 0 5px;
        width: auto;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #333
    }

.task-view-details table, th, td {
    padding: 0;
    vertical-align: top;
}

.task-view-details .block {
    margin-bottom: 15px;
}

    .task-view-details .block fieldset p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        /*line-height: 1.71;*/
        letter-spacing: 0.13px;
        color: #000;
        margin: 0;
        /*font-weight: 500;*/
        /*word-break: break-word*/
    }

        .task-view-details .block fieldset p span {
            color: #848484;
            text-wrap: wrap;
        }

.task-view-details .technical_notes table {
    height: 118px;
    display: block;
    overflow-x: auto
}

.task-view-details .work_mode .flex {
    display: flex
}

.task-view-details .radio_label {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 0;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-right: 18px;
    color: #d8d8d8
}

.task-view-details .block fieldset .radio_label p {
    color: #d8d8d8
}

.task-view-details .radio_label input {
    position: absolute;
    opacity: 0;
    cursor: pointer
}

.task-view-details .checkmark {
    position: absolute;
    top: 3px;
    left: 0;
    height: 14px;
    width: 14px;
    background-color: #fff;
    border-radius: 50%;
    border: 3px solid #d8d8d8;
    border-radius: 50%
}

.task-view-details .radio_label input:checked ~ .checkmark {
    background-color: #c3002f;
    border: 3px solid #c3002f
}

.task-view-details .radio_label input:checked ~ p {
    color: #c3002f
}

.task-view-details .checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.task-view-details .radio_label input:checked ~ .checkmark:after {
    display: block
}

.task-view-details .radio_label .checkmark:after {
    top: 0px;
    left: 0px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: white
}

.task-view-details .device_list {
    padding-bottom: 20px;
    border-bottom: solid 1px #e7e7e7;
    margin-bottom: 13px
}

    .task-view-details .device_list .images {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        margin-top: 6px;
        grid-gap: 17px
    }

        .task-view-details .device_list .images img {
            width: 100%
        }

    .task-view-details .device_list a.images:hover img {
        box-shadow: 0px 2px 5px #bbbbbb;
    }

.task-view-details .all_device_list {
    max-height: 205px;
    overflow-y: auto;
}

@media (min-width: 767px) {
    #view_details table td {
        display: block;
        width: 100%
    }
}

@media (min-width: 1200px) {
    .task-view-details .modal-lg {
        width: 800px;
        max-width: 95%;
        margin: 30px auto
    }

    #TrackSLViewDetails_mdl .modal-lg {
        width: 1000px;
        margin: 30px auto;
    }

    #Issued_Qty_mdl .modal-lg, #Used_Qty_mdl .modal-lg {
        width: 1000px;
        margin: 30px auto;
    }

    #mdl_useditem .modal-dialog {
        width: 400px;
        margin: 30px auto;
    }

    #View_details .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }

    #view_details table td {
        display: table-cell;
        width: auto
    }
}

.star_rating {
    display: flex;
    align-items: center
}

    .star_rating .count p {
        margin: 0 0 0 10px;
        font-size: 20px;
        font-weight: 500;
        letter-spacing: 0.19px;
        color: #333
    }

.rating {
    border: none;
    /*float: left*/
}

    .rating > input {
        display: none
    }

    .rating > label:before {
        margin: 5px;
        font-size: 24px;
        font-family: FontAwesome;
        display: inline-block;
        content: "f005"
    }

    .rating > .half:before {
        content: "f089";
        position: absolute
    }

    .rating > label {
        color: #ddd;
        float: right
    }

    .rating > input:checked ~ label, .rating:not(:checked) > label:hover, .rating:not(:checked) > label:hover ~ label {
        color: #c3002f
    }

        .rating > input:checked + label:hover, .rating > input:checked ~ label:hover, .rating > label:hover ~ input:checked ~ label, .rating > input:checked ~ label:hover ~ label {
            color: #c3002f
        }

.task-view-details .ok_btn {
    /*margin-top: -40px;*/
    border-radius: 4px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 8px 40px
}

    .task-view-details .ok_btn:hover {
        background-color: #b3012c;
        color: #fff;
    }

.Customer_Signature .signature {
    text-align: center;
    padding: 0 20px
}

.rating-box {
    color: #f0f0f0
}

.rating-star {
    font-size: 3rem;
    width: 4rem;
    height: 4rem;
    padding: 0 2rem;
    position: relative;
    /*display: block;
    float: left;*/
    color: #c8baba;
}

.full-star:before {
    color: #c3002f;
    content: "\2605";
    position: absolute;
    left: 0;
    overflow: hidden
}

.empty-star:before {
    content: "\2605";
    position: absolute;
    left: 0;
    overflow: hidden;
    color: #c8baba
}

.half-star:before {
    color: #c3002f;
    content: "\2605";
    /*width: 33%;*/
    position: absolute;
    left: 0px;
    overflow: hidden;
    z-index: 1
}

.half-star:after {
    content: "\2605";
    position: absolute;
    left: 13px;
    /*width: 50%;*/
    text-indent: -1.3rem;
    overflow: hidden;
    z-index: 1;
}

.star_rating .count {
    /*margin-top: 11px*/
}

.task_header {
    grid-template-columns: 120px auto
}

    .task_header .Mright {
        margin-right: 5px
    }

    .task_header .main {
        margin-top: 0;
        width: 30%
    }

    .task_header .task_button_group {
        display: flex;
        align-items: center;
        justify-content: flex-end
    }

    .task_header .main .input-group .form-control {
        padding: 7px 10px;
        border: 1px solid #c6cbd4
    }

    .task_header .main .input-group .input-group-append .btn {
        padding: 5px 10px;
        margin-top: 3px;
        margin-right: 3px
    }

.task_header2 {
    grid-template-columns: 120px auto
}

    .task_header2 .Mright {
        margin-right: 5px
    }

    .task_header2 .main {
        margin-top: 0;
        width: 30%
    }

    .task_header2 .task_button_group {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .task_header2 .main .input-group .form-control {
        padding: 7px 10px;
        border: 1px solid #c6cbd4
    }

    .task_header2 .main .input-group .input-group-append .btn {
        padding: 5px 10px;
        margin-top: 3px;
        margin-right: 3px
    }

.loginMarginTop {
    margin-top: 15px
}

.ellipsis p.fullwidth_text {
    max-width: 100%;
    white-space: normal;
}

.ellipsis {
    position: relative
}

    .ellipsis p {
        max-width: 500px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .ellipsis .box {
        max-width: 350px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .ellipsis .tooltiptext, .box .tooltiptext {
        visibility: hidden;
        max-width: 200px;
        background-color: black;
        color: #fff !important;
        text-align: center;
        border-radius: 6px;
        padding: 5px 10px;
        position: absolute;
        z-index: 1;
        right: 0;
        top: -32px;
        left: 0
    }

.box .tooltiptext {
    visibility: hidden;
    max-width: 350px;
    background-color: black;
    color: #fff !important;
    text-align: center;
    border-radius: 6px;
    padding: 5px 10px;
    position: absolute;
    z-index: 1;
    right: 0;
    top: -32px;
    left: 0
}

.ellipsis_tooltip:hover .tooltiptext {
    visibility: visible
}

.task-view-details .block:last-child {
    /*margin-bottom: 0*/
}

#Task_Closure_view_details .modal-footer {
    padding: 5px 15px;
    margin-top: 10px;
}

.Pright {
    padding-right: 10px
}

.dnone {
    display: none
}

.authError {
    position: absolute;
    background: transparent !important;
    display: block;
    transform: translate(0, 12%) !important;
    top: 100% !important;
    left: 0 !important;
    color: red !important
}

.BackToHome, .BackToSignupForm {
    font-family: "Roboto",sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.71;
    color: #343434;
    margin-top: 20px;
    cursor: pointer;
    margin-bottom: 0
}

    .BackToHome:hover {
        text-decoration: none;
        color: #343434
    }

.ellipsis .ellipsis_tooltip .tooltiptext {
    white-space: break-spaces !important
}

#TechnicalNoteTableID #TechnicalNoteTbody p {
    width: 300px;
    word-break: break-word
}

.SearchBoxBorder {
    border: 1px solid #c6cbd4 !important
}

#task_track .modal-lg {
    width: 1200px !important;
    margin: 10px auto
}

#task_track .task_track {
    display: block
}

.track_map {
    display: grid;
    grid-template-columns: 75% 25%;
    overflow: hidden
}

.technician_details {
    display: table;
    width: 100%
}

    .technician_details .technician_images {
        display: table-cell;
        vertical-align: middle;
        width: 40px;
        padding: 0 10px 0 0
    }

    .technician_details .technician_info {
        display: table-cell;
        vertical-align: middle;
        width: 100%
    }

        .technician_details .technician_info p {
            word-break: break-word
        }

#task_track .close {
    position: absolute;
    right: 30px;
    top: 10px
}

.task_track body {
    background-color: #fff
}

.track_info .task_description {
    margin-top: 0
}

.track_all_menu {
    padding: 5px 15px !important
}

.technicial_task_track .task_track {
    display: grid !important
}

.technicial_task_track .track_info {
    padding: 10px
}

.technicial_task_track .modal-lg {
    width: 900px !important;
    margin: 60px auto !important
}

.more-menu {
    display: none
}

.show-more-menu .more-menu {
    display: block
}

.form-inline .form-group {
    width: 100%;
}

.form-inline .input-group {
    width: 100%
}

.ExpeditureHeader .deduct {
    margin-left: 5px
}

.displayclass {
    position: relative
}

.time_tooltip {
    border-radius: 4px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    background-color: rgba(255,255,255, 0.9);
    padding: 9px;
    width: 280px;
    position: absolute;
    z-index: 100;
    display: none
}

    .time_tooltip .checkin-section {
        padding: 0 0 10px 0;
        border-bottom: solid 1px #e9e9e9;
    }

    .time_tooltip .checkout-section {
        padding: 10px 0 0 0;
    }



    .time_tooltip p {
        margin: 0;
        text-align: left;
        line-height: 22px
    }

        .time_tooltip p:last-child {
            margin: 0
        }

.expenditure_grid_container .over {
    height: 577px;
    overflow-y: scroll
}

.date input[disabled] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1
}

.appointments {
    padding: 15px;
    overflow-x: scroll
}

    .appointments .mainTitle p {
        padding: 15px
    }

    .appointments .filters select {
        margin-left: 10px;
        padding: 7px 50px;
        padding-left: 10px
    }

    .appointments .block .subFilters {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 15px
    }

        .appointments .block .subFilters .date {
            display: flex;
            justify-content: space-between;
            background-color: #FAFBFD;
            padding: 10px 25px;
            border-radius: 8px
        }

            .appointments .block .subFilters .date p {
                padding: 0 20px
            }

        .appointments .block .subFilters .right_side {
            display: flex;
            align-items: center
        }

    .appointments .block .searchBox .searchField {
        width: auto;
        background-position: bottom 12px right 11px
    }

    .appointments .block .active {
        background-color: #fff;
        color: #56f000;
        -moz-box-shadow: 0px 3px 8px rgba(23, 122, 226, 0.13);
        -webkit-box-shadow: 0px 3px 8px rgba(23, 122, 226, 0.13);
        box-shadow: 0px 3px 8px rgba(23, 122, 226, 0.13)
    }

    .appointments .block table {
        border-collapse: collapse;
        width: 100%;
        border-radius: 5px;
        box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
        background-color: #fff
    }

    .appointments .block td, .appointments .block th {
        border-right: 1px solid #e6e6e6;
        border-left: 1px solid #e6e6e6;
        padding: 30px 30px;
        font-size: 14px;
        text-align: center;
        position: relative;
        height: 30px;
        white-space: nowrap;
        border-top: 1px solid #e6e6e6
    }

    .appointments .block th {
        border-bottom: 1px solid #e6e6e6
    }

    .appointments .block tbody tr td:first-child {
        border-top: none
    }

        .appointments .block tbody tr td:first-child p {
            position: absolute;
            top: -8px
        }

    .appointments .block tbody tr .grey {
        background-color: #f7f7f7
    }

    .appointments .block tbody tr .completed {
        background-color: #34d1bf
    }

    .appointments .block tbody tr .green {
        background-color: #56f000
    }

    .appointments .block tbody tr .reject {
        background-color: #f17105
    }

    .appointments .block tbody tr .disable {
        background-image: url(../../../assets/images/disable.svg);
        background-size: cover;
        background-position: center
    }

    .appointments .block tbody tr .plus {
        background-color: #fafbfd
    }

    .appointments .block .indication {
        display: flex;
        justify-content: flex-end;
        padding: 30px 10px
    }

        .appointments .block .indication .new .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .new .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #9ccc65;
                margin-right: 5px
            }

            .appointments .block .indication .new .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .pending .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .pending .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #9a9faa;
                margin-right: 5px
            }

            .appointments .block .indication .pending .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .reject .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .reject .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #ed0423;
                margin-right: 5px
            }

            .appointments .block .indication .reject .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .completed .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .completed .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #34d1bf;
                margin-right: 5px
            }

            .appointments .block .indication .completed .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .dna .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .dna .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #0496ff;
                margin-right: 5px
            }

            .appointments .block .indication .dna .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .ongoing .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .ongoing .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #6665dd;
                margin-right: 5px
            }

            .appointments .block .indication .ongoing .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

        .appointments .block .indication .rescheduled .flex {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin: 0 15px
        }

            .appointments .block .indication .rescheduled .flex .circle {
                width: 12px;
                height: 12px;
                background-color: #fff;
                border-radius: 50%;
                border: 2px solid #f17105;
                margin-right: 5px
            }

            .appointments .block .indication .rescheduled .flex .label {
                font-size: 10px;
                line-height: 20px;
                letter-spacing: 0.42px;
                color: #414d55
            }

.reject_btn {
    border-radius: 3px;
    background-color: #177ae2;
    padding: 10px 23px;
    border: none;
    color: #fff;
    font-size: 14px;
    font-weight: 500
}

.modal-section .task_model .modal-dialog {
    width: 900px
}

.add-amc legend, .edit-amc legend {
    background-color: #fff;
    width: auto;
    border-bottom: none;
    font-size: 14px;
    color: #333;
    margin-bottom: 0px;
    font-weight: 500;
    padding: 0px 3px 0px 3px
}

.add-amc, .edit-amc {
    margin-bottom: 15px;
    margin-top: 0
}

.under-warrenty {
    position: relative
}

    .under-warrenty .sub-tittle {
        margin: 0;
        position: absolute;
        top: -11px;
        font-size: 10px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.4;
        letter-spacing: 0.09px;
        text-align: center;
        color: rgba(0, 0, 0, 0.6)
    }

/*.add-amc .text-field input {
    padding: 8px
}*/
/*
.add-amc select {
    margin: .75em .5em .25em 0;
    height: auto
}*/

.amc-footer .cancel {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

.amc-footer .add_task_submit {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.intro {
    max-width: 1280px;
    margin: 1em auto
}

.table-scroll {
    position: relative;
    width: 100%;
    z-index: 1;
    margin: auto;
    overflow: auto
}

    .table-scroll table {
        width: 100%;
        min-width: 1280px;
        margin: auto;
        border-collapse: separate;
        border-spacing: 0
    }

.table-wrap {
    position: relative
}

.table-scroll th, .table-scroll td {
    padding: 20px 30px;
    border: 1px solid #e6e6e6;
    background: #fff;
    vertical-align: top
}

.table-scroll tfoot, .table-scroll tfoot th, .table-scroll tfoot td {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    background: #666;
    color: #fff;
    z-index: 4
}

.table-scroll th:first-child {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 6;
    background: #fff
}

.table-scroll tr td:first-child {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 2;
    background: #fff;
    border: none;
    border-right: 1px solid #e6e6e6;
    padding: 0 4px
}

.table-scroll tbody tr td:first-child p {
    position: absolute;
    font-size: 14px;
    color: #10131f
}

.table-scroll thead th:first-child, .table-scroll tfoot th:first-child {
    z-index: 5;
    border: 1px solid #e6e6e6
}

.table-scroll th {
    background: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #10131f;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    white-space: nowrap;
    z-index: 2;
    text-align: center
}

.task-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    // border-left: 5px solid;
    padding: 0px 5px 0 0;
    cursor: pointer;
    position: relative
}

    .task-info p {
        font-size: 10px;
        margin: 0;
        padding: 0 5px 5px;
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 110px
    }

        .task-info p:nth-child(2) {
            margin-top: 2px;
            padding-top: 0
        }

    .task-info h2 {
        font-size: 19px;
        margin: 0
    }

.timeAssignForTask .gray p {
    border-left: 5px solid rgba(117, 117, 117, 0.8)
}

.timeAssignForTask .red p {
    border-left: 5px solid rgba(229, 57, 53, 0.8)
}

.timeAssignForTask .yellow p {
    border-left: 5px solid rgba(249, 168, 37, 0.8)
}

.timeAssignForTask .blue p {
    border-left: 5px solid rgba(30, 136, 229, 0.8)
}

.timeAssignForTask .green p {
    border-left: 5px solid #56f000
}

.task-info .tittle {
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.36px;
    color: #c3002f;
    margin-top: 0 !important;
    padding-top: 3px !important
}

.main-table .active {
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    text-align: center;
    color: #c3002f;
}

.wrapper .tooltip {
    padding: 10px;
    background: #fff;
    bottom: 100%;
    display: block;
    left: -25px;
    margin-bottom: 15px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
    -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    border-radius: 8px
}

    .wrapper .tooltip:before {
        bottom: -20px;
        content: " ";
        display: block;
        height: 20px;
        left: 0;
        position: absolute;
        width: 100%
    }

    .wrapper .tooltip:after {
        border-left: solid transparent 10px;
        border-right: solid transparent 10px;
        border-top: solid #1496bb 10px;
        bottom: -10px;
        content: " ";
        height: 0;
        left: 50%;
        margin-left: -13px;
        position: absolute;
        width: 0
    }

.wrapper:hover .tooltip {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
}

.wrapper:hover .tooltip {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px)
}

.tooltip .task-info {
    display: block;
    border: 1px solid #eee;
    margin-bottom: 10px
}

.tooltiptext .task-info {
    border: 1px solid #eee;
    margin-bottom: 10px
}

.tooltip .task-info:last-child {
    margin-bottom: 0
}

.tooltip .task-info p {
    padding: 5px 5px;
    border: none;
    line-height: 8px
}

.tooltip .gray {
    border-left: 5px solid rgba(117, 117, 117, 0.8)
}

.tooltip .red {
    border-left: 5px solid rgba(229, 57, 53, 0.8)
}

.tooltip .yellow {
    border-left: 5px solid rgba(249, 168, 37, 0.8)
}

.tooltip .blue {
    border-left: 5px solid rgba(30, 136, 229, 0.8)
}

.tooltip a {
    color: #c3002f;
    font-size: 11px;
    font-weight: bold
}

    .tooltip a:hover {
        text-decoration: none
    }

.amc_report_details fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
    display: block;
    margin-inline-start: 2px;
    margin-inline-end: 2px;
    padding-block-start: 0.35em;
    padding-inline-start: 0.75em;
    padding-inline-end: 0.75em;
    padding-block-end: 0.625em;
    min-inline-size: min-content;
    border-width: 2px;
    border-radius: 2px;
    border: solid 1px #e7e7e7;
    border-image: initial;
    margin-bottom: 20px
}

    .amc_report_details fieldset legend {
        display: block;
        width: auto;
        padding: 0;
        margin-bottom: 0px;
        font-size: 21px;
        line-height: inherit;
        color: #333;
        border: 0;
        display: block;
        padding-inline-start: 2px;
        padding-inline-end: 2px;
        border-width: initial;
        border-style: none;
        border-color: initial;
        border-image: initial;
        font-size: 14px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #333
    }

    .amc_report_details fieldset p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.71;
        letter-spacing: 0.13px;
        color: #848484;
        margin: 0;
        word-break: break-word
    }

        .amc_report_details fieldset p span {
            color: #000;
            font-weight: 500
        }

    .amc_report_details fieldset .service-details {
        padding: 10px 0;
        border-bottom: 1px solid #e7e7e7;
        margin-right: -10px;
        margin-left: -10px
    }

        .amc_report_details fieldset .service-details:last-child {
            border: none
        }

        .amc_report_details fieldset .service-details h1 {
            color: #000;
            font-weight: 500;
            font-size: 14px;
            margin: 0
        }

.month_Navigation {
    display: flex;
    border-radius: 4px;
    border: solid 1px rgba(0, 0, 0, 0.32);
    padding: 6px 20px;
    margin-right: 5px;
    justify-content: space-between;
    width: 180px;
    align-items: center
}

    .month_Navigation span {
        cursor: pointer
    }

    .month_Navigation a {
        color: #010203;
        font-weight: bold
    }

.notification-sidenav-header .main {
    margin: 0;
    width: 71%
}

    .notification-sidenav-header .main .form-control, .notification-sidenav-header .main .btn {
        background-color: #fff
    }

.search_list .search_block {
    border-radius: 5px;
    box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
    background-color: #fff;
    padding: 10px;
    margin-bottom: 20px
}

.search_list ul {
    padding: 0;
    list-style: none
}

.search_list .search_block h2 {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.57px;
    color: #c3002f;
    margin: 0
}

.search_list .search_block p {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #212121
}

.amc_sidenav {
    width: 425px
}

    .amc_sidenav .datetime {
        opacity: 36%
    }

    .amc_sidenav .yellow {
        border-left: 5px solid rgba(249, 168, 37, 0.8)
    }

    .amc_sidenav .red {
        border-left: 5px solid rgba(229, 57, 53, 0.8)
    }

    .amc_sidenav .gray {
        border-left: 5px solid rgba(117, 117, 117, 0.8)
    }

    .amc_sidenav .blue {
        border-left: 5px solid rgba(30, 136, 229, 0.8)
    }

    .amc_sidenav .green {
        border-left: 5px solid #56f000
    }

.amc_module_header .sidenav-trigger {
    display: flex;
    align-items: center;
    justify-content: center
}

    .amc_module_header .sidenav-trigger svg {
        margin-left: 10px
    }

.expenditure_view_btn {
    width: 60px;
    height: 34px;
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    color: #fff
}

.HelpModal .modal-content {
    max-width: 100%;
    width: 100%;
    background-color: transparent;
    box-shadow: none;
    margin: 0 auto;
    border: none
}

    .HelpModal .modal-content .modal-body {
        margin-top: 20px
    }

    .HelpModal .modal-content .section .content {
        width: 50%
    }

        .HelpModal .modal-content .section .content ul {
            color: #65656c;
            list-style: lower-alpha;
            padding-left: 20px;
            font-size: 16px
        }

            .HelpModal .modal-content .section .content ul li {
                margin: 8px 0
            }

            .HelpModal .modal-content .section .content ul span {
                color: #2d2d2f;
                font-weight: bold
            }

            .HelpModal .modal-content .section .content ul svg {
                height: 20px;
                width: 20px
            }

    .HelpModal .modal-content .section .image {
        width: 50%;
        text-align: center
    }

        .HelpModal .modal-content .section .image img {
            width: 300px;
            margin: 50px
        }

.lightbox-target {
    position: fixed;
    top: -100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    opacity: 0;
    overflow: scroll;
    right: 0
}

    .lightbox-target #navbar {
        position: fixed;
        left: 0;
        z-index: 9;
        right: 0
    }

.device_list #navbar {
    position: fixed;
    left: 0;
    z-index: 9;
    right: 0
}

#navbar .button {
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    color: #fff;
    margin: 0 5px
}

.lightbox-target img {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 0%;
    width: 0%;
    border-radius: 5px;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 30%);
    box-sizing: border-box;
    text-align: center;
    margin: 0 auto
}

a.lightbox-close {
    display: block;
    width: 50px;
    font-size: 22px;
    box-sizing: border-box;
    background: white;
    color: black;
    text-decoration: none;
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 4px;
    padding: 10px;
    text-align: center;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    z-index: 10
}

.lightbox-target:target {
    opacity: 1;
    top: 0;
    bottom: 0;
    z-index: 10
}

    .lightbox-target:target img {
        max-height: 100%;
        width: 300px
    }

.modal-center {
    padding-top: 100px
}

#Task_Closure_view_details .modal-content {
    margin: 0 auto
}

.renewal-amc-notification p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.22px;
    color: rgba(229, 57, 53, 0.8);
    margin: 0
}

.side_nav ul li a svg {
    /*filter: brightness(0);*/
}

.side_nav ul li a {
    display: flex;
    align-items: center;
    padding: 18px 10px;
    cursor: pointer;
}

.side_nav ul li ul li a {
    color: #777;
}

.table-scroll td:first-child {
    padding: 0
}

.tooltip {
    position: absolute;
    opacity: 1;
    z-index: auto
}

.tooltiptext {
    visibility: hidden;
    color: #000;
    text-align: center;
    border-radius: 6px;
    padding: 10px;
    -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    height: 126px;
    overflow-y: scroll;
    position: absolute;
    right: 0;
    bottom: 40px;
    width: 170px;
    border-radius: 4px;
    background-color: white;
    box-shadow: 0 0 4px 0 rgb(0 0 0 / 29%);
    z-index: 1500;
    top: -87px
}

.dd .tooltiptext::after {
    content: "";
    position: absolute;
    top: 15%;
    right: 100%;
    margin-top: -5px
}

.tooltip:hover .tooltiptext {
    visibility: visible
}

.single_amc .tooltip:hover .tooltiptext {
    visibility: hidden
}

.single_amc {
    position: relative
}

    .single_amc .tooltiptext {
        max-height: 100px;
        top: -87px
    }

    .single_amc:hover .tooltiptext {
        visibility: visible
    }

    .single_amc a {
        color: #c3002f;
        font-size: 11px;
        font-weight: bold;
        cursor: pointer
    }

.increment-group {
    position: relative;
    display: flex;
    margin: .75em 0em .25em 0
}

.increment-group__field .control {
    text-align: center
}

.control--text {
    border-radius: 2px;
    height: 34px;
    font-weight: bold;
    width: 100%;
    text-align: center;
    font-size: 16px;
    border: solid 1px #5d5d5d;
    display: inline-block;
    vertical-align: middle
}

.control--button {
    border: 1px solid #ccc;
    border-radius: 3px;
    width: 30px;
    background: #f2f2f2;
    padding: 6px 5px;
    border: solid 1px #5d5d5d;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    color: #c3002f
}

    .control--button:focus {
        outline: 0
    }

.is-vhidden {
    position: absolute !important;
    clip: rect(0, 0, 0, 0) !important;
    overflow: hidden !important;
    height: 1px !important;
    width: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    border: 0 !important
}

#AmcNotesId {
    resize: vertical
}

#paged, #reqpaged, #approvepaged, #declinepaged {
    display: flex;
    align-items: center;
    /*justify-content: flex-end;*/
    justify-content: flex-start;
    padding-left: 8px;
}

    #paged p, #reqpaged p, #approvepaged p, #declinepaged p {
        margin: 0
    }

.pager {
    margin: 0;
    display: flex;
    align-items: center;
}

    /*.pager .page-navigation, .page-list-dropdown {
        display: none !important
    }*/
    .page-list-dropdown {
        display: none !important
    }

.next-previous-page-navigation {
    border: none !important
}

.pager li > a {
    border-radius: 0;
    color: #000
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.pager li > a, .pager li > span {
    padding: 6px 12px
}

    .pager li > a:focus, .pager li > a:hover {
        background-color: transparent
    }

.pager li:nth-child(3) .page-number:nth-child(4), .pager li:nth-child(3) .page-number:nth-child(5), .pager li:nth-child(3) .page-number:nth-child(6) {
    /*display: none*/
}

.pager li > .page-number {
    color: #23527c
}

.pager li > .active {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #353935;
    border-color: #353935;
}

.pager li > .page-number:hover {
    z-index: 2;
    color: #23527c;
    background-color: #eee;
    border-color: #ddd
}

#pageNumber-section .disabled {
    cursor: not-allowed
}

.tab-section {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center
}

    .tab-section .col-span-4 {
        flex-basis: 50%
    }

    .tab-section .col {
        flex-grow: 0;
        flex-shrink: 0;
        padding-right: 9px;
        padding-left: 9px;
        box-sizing: border-box
    }

#viewExpensImg {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    overflow: auto;
    margin: 0px;
    padding-top: 40px;
    padding-bottom: 0px
}

.HelpModal .modal-content .modal-body {
    margin: 0;
    padding: 0;
    background-color: transparent;
    padding: 25px 25px 25px 25px
}

.tab-section .col-span-4 {
    flex-basis: 100%
}

#TechnicianTableTbodyID tr td {
    position: relative
}

    #TechnicianTableTbodyID tr td .tooltip {
        position: absolute !important
    }

.login_form .field-icon {
    z-index: 99
}

.timeAssignForTask .tooltip .task-info {
    display: flex;
    text-align: left
}

.amc_addTask_btn {
    /*position: absolute;*/
    right: 36px;
    width: 112px;
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: none;
    padding: 7px;
    font-weight: 500;
    color: #fff
}

    .amc_addTask_btn:hover {
        background-color: #b3012c;
    }

#amcAddTaskModal .modal-dialog {
    width: 700px
}

#amcAddTaskModal .mandatory-field {
    top: 17px
}

#amcAddTaskModal {
    overflow-x: hidden;
    overflow-y: auto
}

.amc-addtask-toggle {
    width: 100%
}

    .amc-addtask-toggle .border-left {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px
    }

    .amc-addtask-toggle .btn {
        width: 100%;
        padding: 8px 29px
    }

.renewal-amc-notification .amc-due-date {
    margin: 5px 0 0
}

    .renewal-amc-notification .amc-due-date span {
        font-weight: normal
    }

.renewal-amc-notification .amc-total-services span {
    font-weight: normal
}

.renewal-amc-notification .amc-total-services {
    margin: 0 0 10px
}

.notification-content .tittle .urgent {
    background-color: #c3002f;
    padding: 3px 14px;
    color: #fff;
    margin-bottom: 5px;
    border-radius: 4px;
    font-size: 10px
}

.amc-dashboard_section {
    overflow: hidden !important
}

.HelpModal .section {
    text-align: center
}

.HelpModal .navbar {
    margin-bottom: 10px
}

.HelpModal .close {
    float: right;
    font-size: 45px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: 1
}

#addAmc .mandatory-field, #EditAmc .mandatory-field, #QTaddAmc .mandatory-field {
    top: 17px
}

#amcReportDetails .modal-dialog, #amcListReportDetails .modal-dialog {
    width: 900px !important
}

.HelpModal .navbar {
    margin-bottom: 10px
}

#TbodyExpenditureDetailsId tr td:nth-child(2) {
    text-transform: capitalize
}

#AmcTbodyId .border {
    border-bottom: 1px solid #c3002f;
}

    #AmcTbodyId .border:first-child {
        border-bottom: none
    }

.border:last-child {
    border: 1px solid #56f000
}

#tbodytaskdetailstbl tr td, #TbleEnquiryListDetailsId tr td, #TbleLeadListDetailsId tr td, #CustomerListTbaleId tr td, .list tr td {
    position: relative
}

    #tbodytaskdetailstbl tr td .tooltip, #TbleEnquiryListDetailsId tr td .tooltip, #TbleLeadListDetailsId tr td .tooltip, #CustomerListTbaleId tr td .tooltip, .list tr td .tooltip {
        position: absolute !important;
        word-break: break-word
    }

.north {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg)
}

.west {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg)
}

.south {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg)
}

.east {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg)
}

.norths {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg)
}

.wests {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg)
}

.souths {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg)
}

.easts {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg)
}

.tooltip .green {
    border-left: 5px solid #56f000
}

.task-view-details .device_list .deviceimg-list {
    display: flex;
    flex-wrap: wrap
}

    .task-view-details .device_list .deviceimg-list .images {
        display: block;
        margin: 5px;
        /*width: 30%*/
    }

        .task-view-details .device_list .deviceimg-list .images img {
            height: 100px;
            width: 100px;
            border-radius: 5px;
        }

.square {
    width: 150px;
    height: 100px;
    background-color: red;
    margin-bottom: 50px
}

.rotate-90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.table-clockicon svg {
    margin-top: 10px
}

.HelpModal #navbar {
    z-index: 9;
    position: fixed;
    bottom: 0;
    left: 0;
    bottom: 16px;
    height: 50px
}

/*#addAmc .add-amc {
    margin: 0
}
*/
.amcreport-serialno {
    position: relative
}

    .amcreport-serialno .tooltip {
        position: absolute;
        top: -50px;
        right: 0px
    }

        .amcreport-serialno .tooltip .tooltip-inner:before {
            content: "Serial Number : ";
            position: absolute;
            top: 0;
            left: 0;
            color: #000
        }

.underwarrenty-toggle {
    width: 100%;
    display: flex
}

    .underwarrenty-toggle .btn {
        border: solid 1px #5d5d5d;
        padding: 4px 29px;
        width: 50%;
        font-size: 14px;
        line-height: 1.71;
        letter-spacing: 0.13px;
        color: rgba(0,0,0,0.6);
        font-family: "Roboto",sans-serif
    }

/*.magnify-modal {
    position: absolute;
    z-index: 1090;
    width: 320px;
    height: 320px;
    background-color: #111;
    background-color: rgba(0, 0, 0, 0.85);
    box-shadow: 0 0 3px 1px rgba(0,0,0,0.3);
    cursor: default
}*/

.magnify-modal {
    position: absolute;
    z-index: 1090;
    width: 320px;
    height: 320px;
    background-color: #ffffff;
    /*box-shadow: 0 0 3px 1px rgba(0,0,0,0.3);*/
    cursor: default;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.magnify-maximize {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.magnify-toolbar {
    font-size: 0
}

.magnify-header {
    position: relative;
    z-index: 2;
    height: 40px;
    color: #fff
}

    .magnify-header .magnify-toolbar {
        float: right
    }

[dir='rtl'] .magnify-header .magnify-toolbar {
    float: left
}

.magnify-title {
    padding: 13px 10px;
    font-size: 14px;
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: hidden
}

.magnify-stage {
    position: absolute;
    top: 40px;
    right: 10px;
    bottom: 40px;
    left: 10px;
    z-index: 1;
    border: 1px solid #ccc;
    overflow: hidden
}

    .magnify-stage.stage-ready {
        text-align: center;
        font-size: 0
    }

        .magnify-stage.stage-ready::before {
            content: '';
            display: inline-block;
            height: 100%;
            vertical-align: middle;
            overflow: hidden
        }

.magnify-image {
    position: absolute;
    display: inline-block
}

    .magnify-image.image-ready {
        position: static;
        max-width: 100%;
        max-height: 100%;
        vertical-align: middle
    }

.magnify-footer {
    position: absolute;
    bottom: 0;
    z-index: 2;
    width: 100%;
    height: 40px;
    color: #fff;
    text-align: center
}

    .magnify-footer .magnify-toolbar {
        display: inline-block
    }

.magnify-button {
    display: inline-block;
    min-width: 40px;
    height: 40px;
    box-sizing: border-box;
    margin: 0;
    padding: 10px;
    font-size: 14px;
    color: #ccc;
    line-height: 1;
    text-align: center;
    background: none;
    border-width: 0;
    border-radius: 0;
    cursor: pointer;
    outline: none
}

    .magnify-button:hover {
        /*color: #fff*/
        color: #000
    }

    .magnify-button svg {
        display: inline-block;
        font-size: inherit;
        width: 1em;
        height: 1em;
        overflow: visible;
        vertical-align: -.125em
    }

.magnify-button-close:hover {
    background-color: #c3002f;
    border-top-right-radius: 6px;
}

.magnify-button-maximize:hover {
    background-color: #525252
}

.magnify-button-minimize:hover {
    background-color: #525252
}

.magnify-resizable-handle {
    position: absolute;
    z-index: 10
}

.magnify-resizable-handle-e {
    top: 0;
    right: -5px;
    bottom: 0;
    left: auto;
    width: 10px;
    cursor: e-resize
}

.magnify-resizable-handle-s {
    top: auto;
    right: 0;
    bottom: -5px;
    left: 0;
    height: 10px;
    cursor: s-resize
}

.magnify-resizable-handle-w {
    top: 0;
    right: auto;
    bottom: 0;
    left: -5px;
    width: 10px;
    cursor: w-resize
}

.magnify-resizable-handle-n {
    top: -5px;
    right: 0;
    bottom: auto;
    left: 0;
    height: 10px;
    cursor: n-resize
}

.magnify-resizable-handle-se {
    top: auto;
    right: -5px;
    bottom: -5px;
    left: auto;
    width: 10px;
    height: 10px;
    cursor: se-resize
}

.magnify-resizable-handle-sw {
    top: auto;
    right: auto;
    bottom: -5px;
    left: -5px;
    width: 10px;
    height: 10px;
    cursor: sw-resize
}

.magnify-resizable-handle-nw {
    top: -5px;
    right: auto;
    bottom: auto;
    left: -5px;
    width: 10px;
    height: 10px;
    cursor: nw-resize
}

.magnify-resizable-handle-ne {
    top: -5px;
    right: -5px;
    bottom: auto;
    left: auto;
    width: 10px;
    height: 10px;
    cursor: ne-resize
}

:-webkit-full-screen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

    :-webkit-full-screen .magnify-header, :-webkit-full-screen .magnify-footer, :-webkit-full-screen .magnify-resizable-handle {
        display: none
    }

    :-webkit-full-screen .magnify-stage {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-width: 0;
        background-color: #000
    }

:-moz-full-screen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

    :-moz-full-screen .magnify-header, :-moz-full-screen .magnify-footer, :-moz-full-screen .magnify-resizable-handle {
        display: none
    }

    :-moz-full-screen .magnify-stage {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-width: 0;
        background-color: #000
    }

:-ms-fullscreen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

    :-ms-fullscreen .magnify-header, :-ms-fullscreen .magnify-footer, :-ms-fullscreen .magnify-resizable-handle {
        display: none
    }

    :-ms-fullscreen .magnify-stage {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-width: 0;
        background-color: #000
    }

:full-screen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

    :full-screen .magnify-header, :full-screen .magnify-footer, :full-screen .magnify-resizable-handle {
        display: none
    }

    :full-screen .magnify-stage {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-width: 0;
        background-color: #000
    }

:-webkit-full-screen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

:-ms-fullscreen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

:fullscreen {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important
}

:-webkit-full-screen .magnify-header, :-webkit-full-screen .magnify-footer, :-webkit-full-screen .magnify-resizable-handle {
    display: none
}

:-ms-fullscreen .magnify-header, :-ms-fullscreen .magnify-footer, :-ms-fullscreen .magnify-resizable-handle {
    display: none
}

:fullscreen .magnify-header, :fullscreen .magnify-footer, :fullscreen .magnify-resizable-handle {
    display: none
}

:-webkit-full-screen .magnify-stage {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-width: 0;
    background-color: #000
}

:-ms-fullscreen .magnify-stage {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-width: 0;
    background-color: #000
}

:fullscreen .magnify-stage {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-width: 0;
    background-color: #000
}

::-webkit-backdrop {
    background-color: #000
}

::backdrop {
    background-color: #000
}

::-ms-backdrop {
    background-color: #000
}

.is-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab
}

.is-grabbing {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.magnify-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    text-align: center;
    background-color: rgba(0,0,0,0.3);
    color: #333
}

    .magnify-loader::before {
        content: '';
        display: inline-block;
        position: relative;
        width: 36px;
        height: 36px;
        box-sizing: border-box;
        border-width: 5px;
        border-style: solid;
        border-color: rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.5) rgba(255, 255, 255, 0.5);
        border-radius: 100%;
        vertical-align: middle;
        -webkit-animation: magnifyLoading 1s infinite linear;
        animation: magnifyLoading 1s infinite linear
    }

    .magnify-loader::after {
        content: '';
        display: inline-block;
        width: 0;
        height: 100%;
        vertical-align: middle;
        overflow: hidden
    }

@-webkit-keyframes magnifyLoading {
    0% {
        transform: rotateZ(0deg) translate3d(0,0,0)
    }

    100% {
        transform: rotateZ(360deg) translate3d(0, 0, 0)
    }
}

@keyframes magnifyLoading {
    0% {
        transform: rotateZ(0deg) translate3d(0,0,0)
    }

    100% {
        transform: rotateZ(360deg) translate3d(0,0,0)
    }
}

.magnify-title, .magnify-button-actualSize, .magnify-button-prev, .magnify-button-fullscreen, .magnify-button-next {
    display: none
}

#TbodyExpenditureDetailsId tr {
    height: 50px;
}

    #TbodyExpenditureDetailsId tr td {
        padding: 0 8px;
    }

        #TbodyExpenditureDetailsId tr td p {
            margin: 0;
        }

#TbodyExpenditureDetailsId img {
    vertical-align: middle;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
    width: 37px;
    height: 37px
}

.after-add-more {
    border: 1px solid #e5e5e5;
    padding: 2px 15px 0;
    /*margin: 28px;*/
    margin: 20px;
    position: relative
}

    .after-add-more:first-child {
        margin-top: 0
    }

    .after-add-more .add-more {
        padding: 5px;
        cursor: pointer;
        color: #c3002f !important;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        background-color: transparent !important
    }

    .after-add-more .remove {
        position: absolute;
        top: -12px;
        right: 5px;
        font-size: 14px;
        padding: 0 6px;
        cursor: pointer;
        border-radius: 50%
    }

.bulk-technician .modal-dialog {
    width: 550px;
    /*top:100px;*/
}

.footer-transprent-btn {
    background-color: transparent;
    border: none;
    color: #000;
    box-shadow: none;
    font-size: 14px;
    font-weight: 500
}

    .footer-transprent-btn:hover {
        background-color: transparent;
        color: #000;
        border: none
    }

.footer-red-btn {
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

    .footer-red-btn:hover {
        border-radius: 2px;
        background-color: #c3002f;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #fff
    }

.addtechnician_form {
    /*max-height: 450px;*/
    max-height: calc(100vh/2);
    overflow-x: hidden;
    padding: 0 5px;
}

.bulk-technician .modal-body {
    padding-top: 40px
}

.msg-success {
    color: #5cb85c
}

.bulk-technician .text-field input {
    padding: 5%
}

.after-add-more .d-flex {
    display: flex;
    flex-wrap: wrap
}

    .after-add-more .d-flex .text-field-container {
        width: 45%;
        margin: 0 10px
    }

.closeinputicon {
    position: relative;
    cursor: pointer
}

    .closeinputicon:first-child {
        display: none
    }

    .closeinputicon svg {
        position: absolute;
        top: -51px;
        right: -12px
    }

.after-add-more .text-danger {
    margin-left: 0;
    width: 100%;
    white-space: normal;
}

.after-add-more .text-field.has-focus label, .after-add-more .text-field.has-value label {
    top: 0;
    z-index: 999
}

.after-add-more .text-field.text-field--outlined.has-focus input {
    border-color: #c3002f;
    -webkit-box-shadow: 0px 0px 1px 1px #c3002f;
    box-shadow: 0px 0px 1px 1px #c3002f;
    border-radius: 4px;
    z-index: 999
}

.after-add-more .text-field.text-field--outlined.has-focus {
    box-shadow: none
}

.addtechnician_form [placeholder]::-webkit-input-placeholder {
    opacity: 0
}

.addtechnician_form [placeholder]:-moz-placeholder {
    opacity: 0
}

.addtechnician_form [placeholder]::-moz-placeholder {
    opacity: 0
}

.addtechnician_form [placeholder]:-ms-input-placeholder {
    opacity: 0
}

#addBalance .text-danger, #deductBalance .text-danger {
    color: #a94442;
    font-weight: normal;
    margin-left: 0
}

.devversion {
    margin: 0;
    font-size: 12px;
    /* opacity: 0.4; */
    color: #aaa !important;
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translate(-50%);
    font-weight: bold;
    cursor: pointer;
    background: #fff;
}

    .devversion:hover {
        text-decoration: none;
        opacity: 0.4;
        color: #000
    }

.side_nav {
    position: relative;
    flex: 1 190px
}

    .side_nav .devversion {
        padding: 0px 10px 0;
        border-top: solid 1px #e5e5e5;
        width: 100%;
        line-height: 25px;
        left: initial;
        transform: inherit;
        bottom: 0;
        text-align: center;
        white-space: nowrap;
    }

.ellipsis .tooltiptext {
    visibility: hidden;
    max-width: initial;
    width: fit-content;
    height: 50px;
    background-color: black;
    color: #fff !important;
    text-align: center;
    border-radius: 6px;
    padding: 5px 10px;
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 20px;
    top: auto;
    height: auto;
    overflow: inherit
}

.tooltip_triangle {
    visibility: hidden;
    position: absolute;
    top: 3px;
    left: 16px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent
}

.ellipsis_tooltip:hover .tooltip_triangle {
    visibility: visible
}

.serviceName {
    width: 200px
}

#tbodytaskdetailstbl td .btn, #TechnicianTableTbodyID td .btn {
    background-color: transparent
}

#tbodytaskdetailstbl .dropdown-menu, #TechnicianTableTbodyID .dropdown-menu {
    padding: 0;
    margin-left: calc(100% - 115px)
}

#TbodyLeadListDetails .dropdown-menu {
    padding: 0;
    margin-left: calc(100% - 60px)
}

#tbodytaskdetailstbl .dropdown-item, #TechnicianTableTbodyID .dropdown-item {
    color: #333;
    display: block;
    padding: 10px 15px;
    cursor: pointer;
    border-bottom: solid 0.5px #f3f3f3
}

.open > .dropdown-menu {
    display: none
}

.show > .dropdown-menu {
    display: block
}

#DdlTaskStatusEditDetails {
    -moz-appearance: none;
    -webkit-appearance: none;
    opacity: 1
}

    #DdlTaskStatusEditDetails::-ms-expand {
        display: none
    }

.dashboard_content {
    display: block !important
}

    .dashboard_content .task-status-passbook-details {
        border-radius: 5px;
        -webkit-box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
        box-shadow: 0 4px 24px 0 rgba(124, 124, 124, 0.1);
        background-color: #fff;
        /*padding: 2% 1%;*/
        padding: 1% 2%;
    }

        /*
.dashboard_content .task-status-passbook-details .title {
    border-bottom: solid 2px #ddd;
}
*/

        .dashboard_content .task-status-passbook-details .item {
            box-shadow: none !important;
        }

        .dashboard_content .task-status-passbook-details #LblTaskStatusRange {
            font-size: 14px;
            color: #8f8f8f;
            font-weight: 400;
        }

            .dashboard_content .task-status-passbook-details #LblTaskStatusRange span {
                color: #000;
                font-weight: 500;
            }

    .dashboard_content .d-flex {
        display: flex
    }

        .dashboard_content .d-flex .flex-block {
            flex: 1 65%;
            /*margin-right: 2%;*/
            padding: 0
        }

.flex-second-block {
    flex: 1 35%;
    padding: 0
}

    .flex-second-block .item {
        /*height: calc(100% - 20px);*/
        height: calc(100% - 13px);
    }

.char-Mtop {
    margin-top: 2%
}

.form-control:focus {
    border-color: #c3002f
}

#edit_item .modal-dialog {
    width: 725px;
}

#LogOutConfirmationDiv .modal-dialog {
    width: 350px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
}

.btn-withoutbg {
    border-radius: 2px;
    width: 100%;
    color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    padding: 12px 16px;
    margin-left: 15px;
    background-color: transparent;
}

.signup-customer-details {
    position: relative;
    margin-top: 15px;
    display: none;
}

.company_details_tittle {
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #343434;
    margin-bottom: 20px;
}

    .company_details_tittle span {
        color: #c3002f;
        cursor: pointer;
    }

.signup-customer-details .row {
    margin-right: -9px;
    margin-left: -6px;
    margin-top: 10px;
}

.signup-customer-details .col-md-6 {
    padding: 0
}

.signup-customer-details .text-danger {
    float: left;
    margin-top: -10px;
}

.signup-customer-details legend {
    top: -9px;
    position: absolute;
    background: #fff;
}


/*.upload-info {
    display: flex;
    align-items: center;
    padding: 16px;
    fill: #000;
    color: #000;
}

.upload-filename {
    padding-left: 8px;
    transition: opacity 300ms ease;
}

    .upload-filename.inactive {
        opacity: 0.6;
    }

.upload-button {
    position: relative;
    margin: 0;
    font-size: 100%;
    padding: 0 8px;
    font-family: inherit;
    background: none;
    border: none;
    border-radius: inherit;
    outline: none;
    right: auto;
    bottom: auto;
}

    .upload-button:focus {
        outline: 0;
    }

.upload-button-text {
    padding: 8px 16px;
    color: white;
    background-color: #c3002f;
    border-radius: inherit;
    outline: none;
    cursor: pointer;
    transition: background-color 200ms ease, box-shadow 300ms ease;
    margin: 0;
}

    .upload-button-text:hover, .upload-button-text:focus {
        background-color: #c3002f;
    }

    .upload-button-text.inactive {
        background-color: rgba(255, 255, 255, 0.38);
        cursor: not-allowed;
    }

.upload-hint {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: white;
    transform: translateY(100%);
}

.upload-progress {
    position: absolute;
    top: 90%;
    left: -100%;
    width: 100%;
    height: 100%;
    color: white;
    background: linear-gradient(270deg, #87e0c2 0%, #65cca9 50%, #26b082 100%);
    transform-origin: left;
}



.drop-area {
    border: 1px solid #485461;
}

    .drop-area.droppable {
        border: 1px dashed rgba(255, 255, 255, 0.6);
    }

    .drop-area.highlight {
        border: 1px dashed #29b586;
    }

.upload-button [type=file] {
    height: 0;
    overflow: hidden;
    width: 0;
    cursor: pointer;
}*/

/*.upload {
    clear: both;
    position: relative;
    display: flex;
    background: #485461;
    border-radius: 10px;
    box-shadow: 0 1.7px 1.4px rgb(0 0 0 / 2%), 0 4px 3.3px rgb(0 0 0 / 3%), 0 7.5px 6.3px rgb(0 0 0 / 4%), 0 13.4px 11.2px rgb(0 0 0 / 4%), 0 25.1px 20.9px rgb(0 0 0 / 5%), 0 60px 50px rgb(0 0 0 / 7%);
    overflow: hidden;
    transform: rotate(0);
    width: 50%;
    border: none;
}*/

.customer-fields-close {
    position: absolute;
    right: -8px;
    top: -11px;
    background: #c3002f;
    padding: 2px 6px 0 6px;
    border-radius: 50%;
    box-shadow: 0 10px 24px 0 rgb(0 0 0 / 8%);
}


.avatar-upload {
    position: relative;
    /*max-width: 205px;*/
    margin: 10px auto;
}

    .avatar-upload .avatar-edit {
        position: absolute;
        right: 48px;
        z-index: 1;
        bottom: 7px;
    }

        .avatar-upload .avatar-edit input {
            display: none;
        }


    .avatar-upload .avatar-preview {
        width: 100px;
        height: 100px;
        position: relative;
        border-radius: 100%;
        border: 6px solid #F8F8F8;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
        margin: 0 auto;
    }

        .avatar-upload .avatar-preview > div {
            width: 100%;
            height: 100%;
            border-radius: 100%;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }


.checkinPlace, .checkoutPlace {
    position: absolute;
    background-color: black;
    color: #fff;
    padding: 5px;
    border-radius: 6px;
    top: auto;
    z-index: 2;
    bottom: 48px;
    width: 270px;
}

.checkin-section p, .checkout-section p {
    font-size: 11px;
    line-height: 18px;
}

.checkin-section .address, .checkout-section .address {
    display: -webkit-box;
    height: 30px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}



.checkinPlace:after, .checkoutPlace:after {
    content: " ";
    position: absolute;
    left: 20px;
    bottom: -5px;
    border-top: 5px solid black;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: none;
}

.primaty-text-color {
    color: #c3002f;
}

#tbodyViewAssignItemListId p {
    font-weight: 400;
    font-size: 16.183px;
    line-height: 28px;
    color: #000000;
    word-break: break-all;
}

.signup-company-address {
    padding-right: 9px;
    padding-left: 11px;
}

    .signup-company-address .text-field-container {
        margin: 10px 0 10px 0;
    }

    .signup-company-address input {
        padding: 3%;
    }

.downloadAMC {
    right: 156px;
}

.broadcast-message {
    margin: 1rem;
}

    .broadcast-message .form-control {
        min-width: 15rem;
        height: 36px;
        width: 100%;
        border-radius: 4px;
        border: solid 1px #5d5d5d;
        font-size: 14px;
        line-height: 1.71;
        letter-spacing: 0.1px;
        color: rgba(0, 0, 0, 0.6);
        background: #fff;
    }

    .broadcast-message .show-date-field {
        display: none;
    }

    .broadcast-message .show-Service-Type {
        display: none;
    }

    .broadcast-message .show-Device-Type {
        display: none;
    }

    .broadcast-message .show-City-field {
        display: none;
    }

    .broadcast-message .well {
        background-color: #fff;
    }

    .broadcast-message .btn-submit {
        border-radius: 4px;
        background-color: #c3002f;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #fff;
        padding: 12px 16px;
    }

    .broadcast-message input[type=file] {
        padding: 0.6rem;
        width: auto;
    }

    .broadcast-message .profile-pic {
        width: 150px;
        height: 150px;
    }

        .broadcast-message .profile-pic #NotifyPicsId {
            width: 100%;
            height: 100%;
            border: solid 1px #eee;
            object-fit: cover;
        }


    .broadcast-message input[type=file]:focus {
        outline: none;
    }

    .broadcast-message .btn-cancel {
        background-color: transparent;
        border: none;
        color: #000;
        box-shadow: none;
        font-size: 14px;
        font-weight: 500;
        padding: 12px 16px;
    }

    .broadcast-message textarea {
        resize: none;
        height: auto !important;
    }

    .broadcast-message .list-group {
        border-bottom: 1px solid #ddd;
    }

        .broadcast-message .list-group .list-group-item {
            border: none;
        }

    .broadcast-message .list-group-horizontal .list-group-item {
        display: inline-block;
        cursor: pointer;
        border-radius: 0;
    }

        .broadcast-message .list-group-horizontal .list-group-item a {
            font-size: 14px;
            color: #757575;
            cursor: pointer;
            text-decoration: none;
            text-align: center;
        }

        .broadcast-message .list-group-horizontal .list-group-item.disabled {
            background-color: transparent;
            cursor: not-allowed;
        }

            .broadcast-message .list-group-horizontal .list-group-item.disabled a {
                pointer-events: none; /*This makes it not clickable*/
                opacity: 0.6; /*This grays it out to look disabled*/
                background-color: transparent;
            }

        .broadcast-message .list-group-horizontal .list-group-item.active {
            box-shadow: 0 2px #c3002f;
            background-color: transparent;
        }

            .broadcast-message .list-group-horizontal .list-group-item.active a {
                color: #000;
                font-weight: 600;
            }

    .broadcast-message .forNotificationandEmail,
    .broadcast-message .forNotificationandSMS,
    .broadcast-message .forEmail {
        display: none;
    }
/*For excel file upload start*/
#drop-area .modal-dialog {
    margin: 50px auto;
}

#drop-area .modal-content {
    border-radius: 0;
}

    #drop-area .modal-content .modal-body {
        background-color: #f6f8f8;
    }

    #drop-area .modal-content .close {
        margin-top: -6px;
        font-size: 30px;
    }

    #drop-area .modal-content .top {
        margin-bottom: 1rem;
    }

        #drop-area .modal-content .top .sample-file {
            font-size: 14px;
            font-weight: 500;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #101420;
        }

            #drop-area .modal-content .top .sample-file a {
                cursor: pointer;
            }


    #drop-area .modal-content .middle {
        position: relative;
        border: dotted #ddd;
    }

    #drop-area .modal-content .progress {
        height: 16px;
        margin: 5px;
        display: none;
    }

    #drop-area .modal-content .middle .before-choose {
        display: block;
        padding: 5rem 0rem;
    }

    #drop-area .modal-content .middle .after-choose {
        display: none;
        padding: 8.5rem 0rem;
    }

    #drop-area .modal-content .middle .icon {
        margin-bottom: 2rem;
    }

        #drop-area .modal-content .middle .icon img {
            width: 50px;
        }

    #drop-area .modal-content .middle .btn {
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 8px 15px 8px 20px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 2rem;
    }

        #drop-area .modal-content .middle .btn span {
            position: relative;
        }

            #drop-area .modal-content .middle .btn span i {
                margin-left: 30px;
            }

            #drop-area .modal-content .middle .btn span:before {
                content: '';
                border-left: solid 0.5px #f6f8f8;
                position: absolute;
                top: -11px;
                height: 38.5px;
                margin-left: 15px;
            }

    #drop-area .modal-content .middle .text {
        font-size: 15px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #101420;
    }

    #drop-area .modal-content .middle input[type=file] {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        outline: none;
        opacity: 0;
        z-index: 1;
    }

    #drop-area .modal-content .bottom {
        margin-top: 1rem;
    }

        #drop-area .modal-content .bottom .msg-success {
            margin-bottom: 0.5rem;
            color: darkgreen;
        }

        #drop-area .modal-content .bottom .msg-error {
            display: flex;
            justify-content: space-between;
        }

            #drop-area .modal-content .bottom .msg-error .msg {
                color: #ff0000;
                margin: auto 1rem auto 0;
            }

            #drop-area .modal-content .bottom .msg-error .btn-download {
                border-radius: 4px;
                background-color: #c3002f;
                font-size: 14px;
                border: 2px solid #c3002f;
                padding: 5px 15px 5px 20px;
                font-weight: 500;
                color: #fff;
            }

                #drop-area .modal-content .bottom .msg-error .btn-download span {
                    position: relative;
                }

                    #drop-area .modal-content .bottom .msg-error .btn-download span i {
                        margin-left: 30px;
                    }

                    #drop-area .modal-content .bottom .msg-error .btn-download span:before {
                        content: '';
                        border-left: solid 0.5px #f6f8f8;
                        position: absolute;
                        top: -8px;
                        height: 33px;
                        margin-left: 15px;
                    }
/*For excel file upload end*/

#Enquiry_Form_Link .copy_link, #Lead_Form_Link .copy_link {
    display: block;
    width: auto;
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    /*margin: 2rem auto;*/
}

    #Enquiry_Form_Link .copy_link i, #Lead_Form_Link .copy_link i {
        margin-right: 5px;
    }

#Enquiry_Form_Link #LblTxtCopied, #Lead_Form_Link #LblTxtCopied {
    color: #000000;
    font-weight: 600;
    display: none;
}

#Enquiry_Form_Link.modal, #Lead_Form_Link.modal {
    text-align: center;
    padding: 0 !important;
}

    #Enquiry_Form_Link.modal:before, #Lead_Form_Link.modal:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -4px;
    }

#Enquiry_Form_Link .modal-dialog, #Lead_Form_Link .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}

#Enquiry_Form_Link .modal-body, #Lead_Form_Link .modal-body {
    text-align: center;
    padding: 25px 15px 25px;
}

/*For enquiry form start*/
.navbar .d-flex {
    display: flex;
    justify-content: space-between;
}

    .navbar .d-flex .logo {
        margin: 8px 15px;
        /*height: 65px;
        width: 200px;*/
        height: 75px;
        width: 125px;
    }

        .navbar .d-flex .logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    .navbar .d-flex .title {
        color: #c3002f;
        font-size: 25px;
        font-family: inherit;
        font-weight: bold;
        margin: auto;
    }

    .navbar .d-flex .owner-name {
        font-size: 15px;
        margin: auto 15px;
    }

        .navbar .d-flex .owner-name b {
            border-bottom: solid;
            padding-bottom: 1px;
        }

.enquiry-form {
    background-color: #ffffff;
    margin: 2rem auto;
}

    .enquiry-form.well {
        -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    }

    .enquiry-form .header {
        color: #c3002f;
        font-size: 18px;
        font-family: inherit;
        font-weight: 500;
        border-bottom: 1px solid #e5e5e5;
        padding: 15px 10px;
        margin-bottom: 15px;
    }

    .enquiry-form .customer-details-title {
        display: flex;
        justify-content: space-between;
        padding: 0 18px 0 0px;
        align-items: center;
    }

        .enquiry-form .customer-details-title legend {
            font-size: 14px;
            color: #333;
            font-weight: 500;
            border-bottom: none;
            margin-bottom: 10px;
        }

    .enquiry-form legend {
        font-size: 14px;
        color: #333;
        font-weight: 500;
        border-bottom: none;
        margin-top: 10px;
        margin-bottom: 0;
        padding-left: 10px;
    }

    .enquiry-form .form-inline {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        position: relative;
        /*margin-bottom: 15px;*/
    }

    .enquiry-form select, .enquiry-form input {
        width: 100%;
        /*height: 39px;*/
        border-radius: 4px;
        border: solid 1px #5d5d5d;
        font-size: 14px;
        /*line-height: 1.71;*/
        letter-spacing: 0.1px;
        color: rgba(0, 0, 0, 0.6);
        padding: 6px;
    }

    .enquiry-form #EnqPrefTime input {
        width: 100%;
    }

    .enquiry-form .text-field-container:nth-child(2) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 3;
        margin-top: 0px;
    }

    .enquiry-form .text-field-container:nth-child(3) {
        -ms-grid-column: 3;
        grid-column-start: 3;
        -ms-grid-column-span: 2;
        grid-column-end: 5;
        margin-top: 0px;
    }

    .enquiry-form .text-field-container:nth-child(4) {
        -ms-grid-column: 5;
        grid-column-start: 5;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        margin-top: 0px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(2) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 3;
        margin-top: 30px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(3) {
        -ms-grid-column: 3;
        grid-column-start: 3;
        -ms-grid-column-span: 2;
        grid-column-end: 5;
        margin-top: 30px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(4) {
        -ms-grid-column: 5;
        grid-column-start: 5;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(2) {
        grid-column-start: 1;
        grid-column-end: 4;
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(3) {
        grid-column-start: 4;
        grid-column-end: 7;
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(4) {
        grid-column-start: 1;
        grid-column-end: 7;
        grid-row-start: 3;
        /*margin-top: 20px;*/
    }

    .enquiry-form .text-field-container {
       /* margin: 10px;*/
    }

.sectleadform .enquiry-form .text-field-container {
    margin: 10px 0;
}

.sectleadform .enquiry-form legend {
    padding-left: 0;
}

.enquiry-form .text-field {
    margin: 3px 0;
}

.enquiry-form .footer {
    border-top: 1px solid #e5e5e5;
    padding: 15px 10px 0px;
    /*display: flex;
    justify-content: space-between;*/
    display: block;
}

    .enquiry-form .footer .captcha-section {
        display: flex;
        grid-gap: 30px;
    }

        .enquiry-form .footer .captcha-section #divGenerateRandomValues {
            display: flex;
            grid-gap: 10px;
            width: 100%;
        }

            .enquiry-form .footer .captcha-section #divGenerateRandomValues .capcode {
                font-style: italic;
                opacity: 0.7;
                margin-top: -7px;
            }

            .enquiry-form .footer .captcha-section #divGenerateRandomValues .captcha #txtNewCaptcha {
                background: transparent;
                font-weight: bold;
                font-size: 35px;
                /*width: 145px;*/
                height: 39px;
                border: none;
                color: #858585;
                text-align: center;
                letter-spacing: 8px;
                padding: 0;
            }

    .enquiry-form .footer .btn-refresh {
        padding: 9px 12px;
        background-color: #c3002f;
        color: #fff;
    }

.enquiry-form-footer {
    text-align: center;
    padding: 15px;
    box-shadow: 0 -2px 4px 0 rgba(212, 212, 212, 0.5);
    background-color: #fff;
    border: none !important;
    border-radius: 0 !important;
    margin-top: auto;
}

    .enquiry-form-footer img {
        margin-left: 10px;
        height: 25px;
    }

.lead-form-footer {
    text-align: center;
    padding: 15px;
    box-shadow: 0 -2px 4px 0 rgba(212, 212, 212, 0.5);
    background-color: #fff;
    border: none !important;
    border-radius: 0 !important;
    margin-top: auto;
    position: fixed;
    z-index: 999999;
    bottom: 0;
    width: 100%;
    left: 0;
    right: 0;
}

    .lead-form-footer img {
        margin-left: 10px;
        height: 25px;
    }

.enquiry-form .footer .captcha-section #txtEnterCaptcha {
    min-width: 140px;
    width: 100%;
}

@media (max-width: 600px) {
    .navbar .d-flex {
        display: block;
    }
    .navbar .d-flexlogo {
        display: flex !important;
    } 

    .navbar .d-flex .logo {
        margin: 15px auto;
    }

        .navbar .d-flex .title {
            text-align: center;
            margin: 10px auto;
        }

        .navbar .d-flex .owner-name {
            text-align: center;
            margin-bottom: 5px;
        }

    .enquiry-form .customer-details .text-field-container:nth-child(2) {
        grid-column-end: 7;
    }

    .enquiry-form .customer-details .text-field-container:nth-child(3) {
        grid-column-start: 1;
        grid-column-end: 7;
        margin-top: 10px;
    }

    .enquiry-form .customer-details .text-field-container:nth-child(4) {
        grid-column-start: 1;
        grid-column-end: 7;
        margin-top: 10px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(2) {
        grid-column-end: 4;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(3) {
        grid-column-start: 4;
        grid-column-end: 7;
        margin-top: 30px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(4) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        margin-top: 10px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(5) {
        -ms-grid-column: 4;
        grid-column-start: 4;
        grid-column-end: 7;
        -ms-grid-row: 2;
        grid-row-start: 2;
    }

        .enquiry-form .enquiry-task-details .text-field-container:nth-child(5) .form-group {
            margin-bottom: 0px;
        }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(6) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 3;
        grid-row-start: 3;
        margin: 0px 10px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(2) {
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(3) {
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(4) {
        margin-top: 0px;
    }

    .enquiry-form .footer {
        display: block;
    }

        .enquiry-form .footer .captcha-section {
            margin-bottom: 10px;
        }
    .flexTask .d-flex {
        flex-direction: column;
    }

        .flexTask .d-flex .w-50 {
            width: 100% !important;
        }

    .flexTask .d-flex-row {
        flex-direction: row !important;
        gap: 10px;
    }

    .ptitle {
        font-size: 10px;
    }

   
    .customer-details .row .col-xs-6{
        width:50%;
    }
    .enquiry-task-details .row .col-xs-6 {
        width: 50%;
    }
    .technicial_details .row .col-xs-6 {
        width: 50%;
    }

    .CrmRow .row .col-xs-6 {
        width: 50%;
    }
    .hiderefresh{
        display:none !important;
    }
    .SelectCRM .w-75{
        width:100% !important;
    }
    .SWidth {
        width: 47% !important;
    }
    .margintp{
        margin-top:10px;
    }
    .text-field.has-focus label, .text-field.has-value label {
        top: -5px;
        left: 1em !important;
        padding: 0 4px;
        font-size:12px;
        white-space:nowrap;
    }
    .fDiv{
        width:95% !important;
        margin:0 auto;
    }
    .SelectCRM .Mright .searchBlock {
        width: 200px !important;
    }
    .tasktitle {       
        font-size: 10px !important;
    }
    .text-muted {
        font-size: 10px !important;
    }
    /*.enquiry-form.well{
        width:90%;
    }*/
}

@media (max-width: 420px) {
    .enquiry-form .footer .captcha-section {
        display: block;
    }

        .enquiry-form .footer .captcha-section #divGenerateRandomValues {
            margin-bottom: 10px;
        }

    .enquiry-form .customer-details-title {
        display: block;
    }

        .enquiry-form .customer-details-title legend {
            margin-bottom: 0px;
        }

        .enquiry-form .customer-details-title .text-danger {
            margin-left: 0px;
            text-align: left;
            margin-bottom: 10px;
        }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(2) {
        grid-column-end: 7;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(3) {
        grid-column-start: 1;
        grid-column-end: 7;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(4) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        -ms-grid-row: 3;
        grid-row-start: 3;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(5) {
        -ms-grid-column: 4;
        grid-column-start: 4;
        grid-column-end: 7;
        -ms-grid-row: 3;
        grid-row-start: 3;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(6) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 3;
        grid-row-start: 4;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(7) {
        -ms-grid-column: 3;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        margin-top: 15px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(8) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 6;
        grid-row-start: 6;
        margin-top: 5px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(2) {
        grid-column-start: 1;
        grid-column-end: 7;
        margin-top: 30px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(3) {
        grid-column-start: 1;
        grid-column-end: 7;
        margin-top: 5px;
    }

    .enquiry-form .technicial_details .text-field-container:nth-child(4) {
        margin-top: 5px;
    }

    #sectWhatsapptoCustomer .modal-dialog {
        width: 100%;
    }
}

@media (max-width: 320px) {
    .enquiry-form .customer-details .text-field-container:nth-child(2) {
        grid-column-end: 7;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(4) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        grid-column-end: 7;
        -ms-grid-row: 3;
        grid-row-start: 3;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(5) {
        -ms-grid-column: 4;
        grid-column-start: 1;
        grid-column-end: 7;
        -ms-grid-row: 3;
        grid-row-start: 4;
        margin-top: 5px;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(6) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 5;
        grid-row-start: 5;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(7) {
        -ms-grid-column: 3;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 6;
        grid-row-start: 6;
    }

    .enquiry-form .enquiry-task-details .text-field-container:nth-child(8) {
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-column-span: 2;
        grid-column-end: 7;
        -ms-grid-row: 7;
        grid-row-start: 7;
        margin-top: 5px;
    }
}
/*For enquiry form end*/

.field-photo fieldset .image-section {
    display: flex;
    justify-content: flex-start;
    padding-top: 0px;
    gap: 1rem;
}

    .field-photo fieldset .image-section img {
        border-radius: 5px;
        width: 100px;
        height: 100px;
        object-fit: cover;
    }

    .field-photo fieldset .image-section a:hover img {
        box-shadow: 0px 2px 5px #ccc;
    }

    .field-photo fieldset .image-section a {
        display: inline-block;
    }

.field-photo fieldset .note-section {
    padding-top: 0.5rem;
}

.field-photo fieldset .section .photo-label {
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #848484;
}

/*Make modal center of screen start*/
.center-modal.modal {
    text-align: center;
    padding: 0 !important;
}

    .center-modal.modal:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -4px;
    }

.center-modal .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}
/*Make modal center of screen end*/

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    opacity: 0.9;
}

::-moz-placeholder { /* Firefox 19+ */
    opacity: 0.9;
}

:-ms-input-placeholder { /* IE 10+ */
    opacity: 0.9;
}

:-moz-placeholder { /* Firefox 18- */
    opacity: 0.8;
}

.background-layer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    background: #000000;
    opacity: 0.5;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    text-align: left;
}

.select2-container .select2-selection--single {
    height: auto;
    border-radius: 0px;
    border: solid 1px #dedede;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: auto;
    top: 22px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    /*padding: 2% 4%;*/
    padding: 2.3% 4% 2%;
    text-transform: uppercase;
}

    .select2-container .select2-selection--single .select2-selection__rendered .img-flag {
        width: 28px;
        height: 20px;
        margin-right: 0.8rem;
        margin-top: -3px;
        -moz-box-shadow: 0 0 8px #ddd;
        -webkit-box-shadow: 0 0 8px #ddd;
        box-shadow: 0 0 8px #ddd;
    }

.select2-results__option {
    text-transform: uppercase;
}

    .select2-results__option span .img-flag {
        width: 28px;
        height: 20px;
        margin-right: 1rem;
        /*border: solid 1px #dddddd;*/
        -moz-box-shadow: 0 0 8px #ddd;
        -webkit-box-shadow: 0 0 8px #ddd;
        box-shadow: 0 0 8px #ddd;
    }

.select2-search--dropdown .select2-search__field {
    outline: none;
}

.profile-completion-section {
    border-radius: 5px;
    box-shadow: -10px -10px 20px rgb(0 0 0 / 2%), 10px 10px 20px rgb(0 0 0 / 2%), 0px 4px 24px rgb(124 124 124 / 10%);
    background-color: #fff;
    padding: 1% 2%;
    margin-bottom: 15px;
}

    .profile-completion-section .d-flex {
        justify-content: space-between;
        padding: 0 2px;
    }

    .profile-completion-section .title {
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 17px;
        display: flex;
        align-items: center;
        color: #10131F;
    }

        .profile-completion-section .title a {
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 17px;
            display: flex;
            align-items: center;
            color: #C3002F;
            text-decoration: none;
            cursor: pointer;
            margin-left: 10px;
        }

    .profile-completion-section .percentage-text {
        font-style: normal;
        font-weight: 600;
        font-size: 15px;
        line-height: 18px;
        display: flex;
        align-items: center;
        color: #10131F;
    }

    .profile-completion-section .progress {
        height: 8px;
        margin: 5px 0px 2px;
    }

        .profile-completion-section .progress .progress-bar {
            background-color: #C3002F;
        }

/*To remove input type number arrow*/
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}
/*End*/

.app-tour-btn {
    cursor: pointer;
}

    .app-tour-btn img {
        height: 30px;
    }

.tour-step-backdrop-on-action {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100vh * 2);
    background-color: transparent;
    opacity: 0.8;
    filter: alpha(opacity=80);
    z-index: 1099;
}

#locationLoader {
    display: none;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-color: #000;
    background-image: url('../../images/loader.gif');
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 10000000;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.btn-location {
    position: absolute;
    right: 0px;
    z-index: 99;
    cursor: pointer;
    background: transparent;
    border: none;
    filter: opacity(0.6);
}

    .btn-location img {
        height: 22px;
        width: 22px;
    }

.text-field a.edit-btn,
.text-field a.sent-otp-btn,
.text-field a.confirm-mobile-otp-btn,
.text-field a.confirm-email-otp-btn {
    position: absolute;
    right: 10px;
    z-index: 99;
    cursor: pointer;
}

    .text-field a.edit-btn img {
        width: 15px;
    }

    .text-field a.sent-otp-btn img {
        width: 18px;
    }

.d-flex {
    display: flex;
}

/* enable absolute positioning */
.inner-addon {
    position: relative;
}

    /* style icon */
    .inner-addon .glyphicon {
        position: absolute;
        padding: 10px;
        pointer-events: none;
        opacity: 0.6;
    }

/* align icon */
.left-addon .glyphicon {
    left: 0px;
}

.right-addon .glyphicon {
    right: 0px;
}

#myProfile .modal-header {
    position: absolute;
    right: 0;
    z-index: 1;
}

    #myProfile .modal-header .close {
        opacity: 1;
    }

#myProfile .profile-details-title,
#myProfile .company-details-title {
    margin: 15px 0px;
}

/*#myProfile .modal-dialog {
    width: 80%;
}*/

#myProfile .modal-body {
    padding: 0px 5px;
}

/*#myProfile .modal-body .my-profile-content .row {
    border-bottom: solid 1px #dddddd;
}

#myProfile .modal-body .my-profile-content .row .col-md-6 {
    padding-bottom: 30px;
}

#myProfile .modal-body .my-profile-content .row .col-md-6:first-child {
    border-right: solid 1px #dddddd;
}*/

#myProfile .modal-dialog .my-profile-content .profile-info-outer {
    width: 100%;
}

#myProfile .modal-dialog .text-danger {
    margin-left: 2px;
    font-size: 13px;
    white-space: normal;
}

#myProfile .modal-footer {
    /*padding-top: 0px;*/
}

    #myProfile .modal-footer .d-flex {
        justify-content: space-between;
    }

    #myProfile .modal-footer .deleteAccount {
        margin: auto 0;
    }

        #myProfile .modal-footer .deleteAccount a {
            font-style: normal;
            font-weight: 500;
            font-size: 14px;
            letter-spacing: 0.5px;
            text-decoration-line: underline;
            color: #212121;
            cursor: pointer;
        }
/* add padding  */
.left-addon input {
    padding-left: 30px;
}

.right-addon input {
    padding-right: 30px;
}

#exportTaskDateRange, #exportItemDateRange {
    background-color: #ffffff;
    cursor: pointer;
}

.daterangepicker .btn-success {
    color: #fff;
    background-color: #c3002f;
    border-color: #c3002f;
}

    .daterangepicker .btn-success:hover {
        color: #fff;
        background-color: #c3002f;
        border-color: #c3002f;
    }

.daterangepicker .btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.daterangepicker .btn-group-sm > .btn, .btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.required:after {
    color: red;
    content: '*';
    margin-left: 4px;
    margin-top: 0px;
    position: absolute;
    font-weight: 600;
    width: 12px;
    background: #ffffff;
}

/*#path_travel .modal-dialog {
   width: 800px;
}*/

#path_travel .modal-body {
    padding: 0px;
}

#path_travel .modal-header {
    padding: 0px;
    border-bottom: none;
}

    #path_travel .modal-header .modal-title-section {
        padding: 5px 15px;
    }

    #path_travel .modal-header .close {
        margin-top: -25px;
    }

#path_travel .modal-content {
    border: 0px;
}

/**************************/
.path-travel .tech-details {
    display: flex;
    justify-content: space-between;
    padding: 5px 15px;
    border-bottom: solid 1px #ddd;
}

    .path-travel .tech-details .tech-info {
        display: flex;
        column-gap: 5px;
    }

        .path-travel .tech-details .tech-info .tech-img img {
            height: 55px;
            width: 55px;
            border-radius: 50%;
        }

        .path-travel .tech-details .tech-info .details {
            margin: auto 0;
        }

            .path-travel .tech-details .tech-info .details .name {
                font-style: normal;
                font-weight: 400;
                font-size: 20px;
                line-height: 24px;
                letter-spacing: 0.1875px;
                color: #212121;
            }

            .path-travel .tech-details .tech-info .details .type {
                font-style: normal;
                font-weight: 400;
                font-size: 17px;
                line-height: 24px;
                letter-spacing: 0.1875px;
                color: #7B7B7B;
            }

    .path-travel .tech-details .date-selection {
        margin: auto;
        position: relative;
    }

        .path-travel .tech-details .date-selection span.cal {
            position: absolute;
            right: 8px;
            top: 7px;
            z-index: -1;
        }

        .path-travel .tech-details .date-selection .next,
        .path-travel .tech-details .date-selection .prev {
            border: none !important;
        }

        .path-travel .tech-details .date-selection .form-control {
            line-height: 1.42857143;
            background-color: transparent;
        }

    .path-travel .tech-details .tech-distance-coverd {
        margin: auto 0;
    }

        .path-travel .tech-details .tech-distance-coverd .title {
            font-style: normal;
            font-weight: 400;
            font-size: 15px;
            line-height: 20px;
            color: #7B7B7B;
        }

        .path-travel .tech-details .tech-distance-coverd .value {
            font-style: normal;
            font-weight: 500;
            font-size: 30px;
            line-height: 42px;
            color: #212121;
        }

.path-travel .path-travel-details {
    display: grid;
    grid-template-columns: 45% 55%;
}

    .path-travel .path-travel-details .path-info {
        /*background: #EDEDED;*/
        padding: 20px 15px 20px 25px;
        border-bottom-left-radius: 6px;
        height: calc(100vh/1.17);
        overflow: auto;
    }

        .path-travel .path-travel-details .path-info h4 {
            font-style: normal;
            font-weight: 500;
            font-size: 20px;
            letter-spacing: 0.1875px;
            color: #000000;
        }

        .path-travel .path-travel-details .path-info .list {
            position: relative;
        }

            .path-travel .path-travel-details .path-info .list ul {
                position: relative;
                list-style: none;
                margin-left: 0;
                padding-left: 1.2em;
                z-index: 1;
            }

            .path-travel .path-travel-details .path-info .list .path-travel-border {
                border-left: 0.6px dashed #ABABAB;
                position: absolute;
                top: 10px;
                bottom: 10px;
                z-index: 0;
            }

            .path-travel .path-travel-details .path-info .list li {
                display: flex;
                justify-content: space-between;
                border-bottom: 0.6px solid #CFCFCF;
                margin-top: 20px;
            }

                .path-travel .path-travel-details .path-info .list li .place {
                    font-style: normal;
                    font-weight: 400;
                    font-size: 15px;
                    line-height: 18px;
                    color: #000000;
                    padding-bottom: 5px;
                }

                .path-travel .path-travel-details .path-info .list li .time {
                    white-space: nowrap;
                    border: none !important;
                    margin-top: auto;
                    margin-bottom: 4px;
                    margin-left: 10px;
                    font-size: 12px;
                    font-weight: 600;
                    color: #5d5d5d;
                }

                    .path-travel .path-travel-details .path-info .list li .time i {
                        margin-right: 2px;
                    }

                .path-travel .path-travel-details .path-info .list li:first-child {
                    margin-top: 0;
                }

                .path-travel .path-travel-details .path-info .list li:before {
                    content: url("../../images/path_route.png");
                    position: absolute;
                    left: -5px;
                }

                .path-travel .path-travel-details .path-info .list li.start:before {
                    content: url("../../images/path_start.png");
                    position: absolute;
                    left: -5px;
                }

                .path-travel .path-travel-details .path-info .list li.end:before {
                    content: url("../../images/path_end.png");
                    position: absolute;
                    left: -6px;
                }

    .path-travel .path-travel-details .path-travel-map .map {
        width: 100%;
        height: 100%;
        border-bottom-right-radius: 6px;
    }

    .path-travel .path-travel-details .path-travel-map img {
        width: 100%;
        height: 100%;
    }
/*************************/

.delete-account .modal-dialog {
    width: 350px;
}

.delete-account .contents {
    margin: 20px 8px;
}

.delete-account h4 {
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 0.13125px;
    color: #10131F;
    margin: 10px;
}

.delete-account p {
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 0.13125px;
    color: #888888;
    margin-bottom: 2rem;
}

.delete-account .actions {
    text-align: center;
}

    .delete-account .actions .btn-no {
        width: 112px;
        height: 34px;
        border-radius: 4px;
        background-color: transparent;
        border: none;
        color: #000;
        box-shadow: none;
        font-size: 14px;
        font-weight: 500;
        padding: 8px;
    }

    .delete-account .actions .btn-yes {
        width: 112px;
        height: 34px;
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 7px;
        font-weight: 500;
        color: #fff;
    }

#delete_woner_modal #wonerDeleteConfirmation {
    display: block;
}

#delete_woner_modal #msgAfterWonerDelete {
    display: none;
}

#delete_tech_modal #techAccountDeleteConfirmation {
    display: block;
}

#delete_tech_modal #msgAfterTechAccountDelete {
    display: none;
}

.tech-initial-msg .modal-dialog {
    width: 370px;
}

.tech-initial-msg .contents {
    margin: 20px 0px;
}

.tech-initial-msg h4 {
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 0.13125px;
    color: #10131F;
    margin: 10px;
}

.tech-initial-msg p {
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 0.13125px;
    color: #888888;
    margin-bottom: 2rem;
}

.tech-initial-msg .actions {
    text-align: center;
    margin-top: 2rem;
}

    .tech-initial-msg .actions .btn {
        width: 112px;
        height: 38px;
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 7px;
        font-weight: 500;
        color: #fff;
    }

.table-borderless td, .table-borderless th {
    border: none !important;
}

#TbodyCustomerListID .CustomerName, #TbodyCustomerListID .MobileNo, #TbodyCustomerListID .Email, #TbodyCustomerListID .Address {
    /*color: #C3002F;*/
    cursor: pointer;
}

.customer-details-container {
    display: none;
    padding: 1% 3%;
    -ms-grid-column: 2;
}

    .customer-details-container .personal-details {
        margin-bottom: 1rem;
        position: relative;
        display: flex;
        justify-content: space-between;
    }

        .customer-details-container .personal-details .action-section {
            /*position: absolute;
    top: 10px;
    right: 0;
    display: flex;
    gap: 10px;*/
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-top: 8px;
        }

            .customer-details-container .personal-details .action-section button {
                width: 80px;
                border-radius: 4px;
                background-color: #c3002f;
                font-size: 14px;
                border: 2px solid #c3002f;
                padding: 5px;
                font-weight: 500;
                color: #fff;
            }

                .customer-details-container .personal-details .action-section button .fa-arrow-left {
                    -webkit-text-stroke: 1.5px #C22032;
                }

        .customer-details-container .personal-details table thead th {
            font-weight: 700;
            font-size: 16px;
            line-height: 24px;
            color: #10131F;
        }

        .customer-details-container .personal-details table tbody td {
            font-weight: 400;
            font-size: 14px;
            line-height: 24px;
            color: #000000;
        }

    .customer-details-container .task-amc-details-container .section {
        margin-bottom: 2rem;
    }

        .customer-details-container .task-amc-details-container .section .header {
            background-color: #FFFFFF;
            color: #333;
            padding: 10px 15px;
            border-bottom: 1px solid #ddd;
        }

            .customer-details-container .task-amc-details-container .section .header a {
                text-decoration: none;
                display: flex;
                justify-content: space-between;
                cursor: pointer;
            }

                .customer-details-container .task-amc-details-container .section .header a:hover {
                    text-decoration: none;
                }

                .customer-details-container .task-amc-details-container .section .header a .name-count {
                    display: flex;
                    flex-wrap: nowrap;
                    gap: 20px;
                }

                    .customer-details-container .task-amc-details-container .section .header a .name-count .name {
                        margin: auto 0;
                        font-weight: 500;
                        font-size: 14px;
                        color: #C3002F;
                        text-transform: uppercase;
                    }

                    .customer-details-container .task-amc-details-container .section .header a .name-count .count {
                        background: #D9D9D9;
                        padding: 4px 8px;
                        border-radius: 50%;
                        font-weight: 600;
                        font-size: 10px;
                        line-height: 14px;
                        color: #000000;
                    }

                .customer-details-container .task-amc-details-container .section .header a .arrow {
                    margin: auto 0;
                    color: #C22032;
                }

                    .customer-details-container .task-amc-details-container .section .header a .arrow i {
                        font-size: 1.8em;
                    }

        .customer-details-container .task-amc-details-container .section .details {
            display: none;
            background-color: #FFFFFF;
            border-bottom: 1px solid #ddd;
        }

            .customer-details-container .task-amc-details-container .section .details .download-section {
                display: flex;
                justify-content: flex-end;
                padding: 5px 15px;
            }

                .customer-details-container .task-amc-details-container .section .details .download-section button {
                    width: 100px;
                    border-radius: 4px;
                    background-color: #353935;
                    font-size: 14px;
                    border: none;
                    padding: 7px;
                    font-weight: 500;
                    color: #fff;
                }

            /*.customer-details-container .task-amc-details-container .section .details table {
    border-bottom: 1px solid #ddd;
}*/

            .customer-details-container .task-amc-details-container .section .details table th {
                font-weight: 500;
                font-size: 12.8824px;
                line-height: 22px;
                /*color: #FF4A4A;*/
            }

            .customer-details-container .task-amc-details-container .section .details table td {
                vertical-align: middle;
            }

            .customer-details-container .task-amc-details-container .section .details table .ongoing, .completed, .OnHold, .rejected, .inactive, .active {
                display: inline-flex;
                align-items: center;
                position: relative;
                justify-content: center;
            }

                .customer-details-container .task-amc-details-container .section .details table .ongoing .status {
                    width: 8px;
                    height: 8px;
                    background-color: #ff9b00;
                    border-radius: 50%;
                    margin-right: 5px;
                }

            .customer-details-container .task-amc-details-container .section .details table .active .status {
                width: 8px;
                height: 8px;
                background-color: #03DE73;
                border-radius: 50%;
                margin-right: 5px;
            }

            .customer-details-container .task-amc-details-container .section .details table .active p {
                font-size: 14px;
                font-weight: 500;
                letter-spacing: 0.22px;
                color: #03DE73;
                margin: 0;
            }

            .customer-details-container .task-amc-details-container .section .details .pagging-section {
                display: flex;
                justify-content: flex-end;
                padding-top: 10px;
            }

                .customer-details-container .task-amc-details-container .section .details .pagging-section p {
                    margin: 7px 0 auto;
                }

                .customer-details-container .task-amc-details-container .section .details .pagging-section nav {
                    border: none;
                }

                    .customer-details-container .task-amc-details-container .section .details .pagging-section nav .active {
                        border-left: none;
                    }

    .customer-details-container .task-amc-details-container table .view_details {
        font-size: 12px;
        font-weight: 500;
        color: #c3002f;
        cursor: pointer;
    }

    .customer-details-container .task-amc-details-container table td .btn,
    .customer-details-container .task-amc-details-container table td .btn {
        background-color: transparent;
    }

    .customer-details-container .task-amc-details-container table td .dropdown.show .dropdown-menu {
        transform: translate3d(0px, 48px, 0px) !important;
        left: auto !important;
        right: 0;
    }

        .customer-details-container .task-amc-details-container table td .dropdown.show .dropdown-menu .dropdown-item {
            color: #333;
            display: block;
            padding: 10px 15px;
            cursor: pointer;
            border-bottom: solid 0.5px #f3f3f3;
        }

#view_cust_list_amc_details .modal-dialog {
    width: 100%;
    max-width: 1000px;
}

#view_cust_list_amc_details .modal-header {
    border-bottom: none;
}

#view_cust_list_amc_details .export-report {
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    float: right;
    margin-right: 50px;
    color: #fff;
}

    #view_cust_list_amc_details .export-report:active:focus {
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 7px;
        font-weight: 500;
        float: right;
        margin-right: 50px;
        color: #fff;
    }

#view_cust_list_amc_details .close {
    opacity: 1;
    font-size: 28px;
    font-weight: 300;
    margin-top: 4px;
}

#view_cust_list_amc_details .modal-title {
    margin-top: 8px;
}

#view_cust_list_amc_details .modal-body {
    padding-bottom: 25px;
}

    #view_cust_list_amc_details .modal-body section {
        border: 1px solid #E7E7E7;
        border-radius: 2px;
        position: relative;
        padding: 15px;
        margin-bottom: 30px;
    }

        #view_cust_list_amc_details .modal-body section:last-child {
            margin-bottom: 0px;
        }

        #view_cust_list_amc_details .modal-body section label {
            position: absolute;
            top: -9px;
            left: 10px;
            background: #fff;
            padding: 0 10px;
            font-weight: 500;
            font-size: 14px;
            line-height: 16px;
            color: #333333;
        }

        #view_cust_list_amc_details .modal-body section .d-flex {
            flex-wrap: wrap;
            column-gap: 40px;
            row-gap: 10px;
        }

            #view_cust_list_amc_details .modal-body section .d-flex div {
                font-weight: 400;
                font-size: 14px;
                line-height: 24px;
                letter-spacing: 0.13125px;
                color: #000000;
            }

                #view_cust_list_amc_details .modal-body section .d-flex div span:first-child {
                    color: #848484;
                }

        #view_cust_list_amc_details .modal-body section.service-details {
            padding: 0px;
        }

            #view_cust_list_amc_details .modal-body section.service-details .service {
                display: flex;
                column-gap: 40px;
                border-bottom: 1px solid #E7E7E7;
                padding: 15px;
            }

                #view_cust_list_amc_details .modal-body section.service-details .service:last-child {
                    border-bottom: none;
                }

                #view_cust_list_amc_details .modal-body section.service-details .service .title {
                    font-weight: 500;
                    font-size: 14px;
                    line-height: 24px;
                    letter-spacing: 0.13125px;
                    color: #000000;
                }

                #view_cust_list_amc_details .modal-body section.service-details .service .details {
                    display: flex;
                    column-gap: 30px;
                }

                    #view_cust_list_amc_details .modal-body section.service-details .service .details div {
                        font-weight: 400;
                        font-size: 14px;
                        line-height: 24px;
                        letter-spacing: 0.13125px;
                        color: #000000;
                    }

                        #view_cust_list_amc_details .modal-body section.service-details .service .details div span:first-child {
                            color: #848484;
                        }

/*****************/

#view_cust_list_task_details .modal-dialog {
    width: 100%;
    max-width: 1200px;
}

#view_cust_list_task_details .modal-header {
    border-bottom: none;
}

#view_cust_list_task_details .export-report {
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    float: right;
    margin-right: 50px;
    color: #fff;
}

    #view_cust_list_task_details .export-report:active:focus {
        border-radius: 4px;
        background-color: #c3002f;
        font-size: 14px;
        border: 2px solid #c3002f;
        padding: 7px;
        font-weight: 500;
        float: right;
        margin-right: 50px;
        color: #fff;
    }

#view_cust_list_task_details .close {
    opacity: 1;
    font-size: 28px;
    font-weight: 300;
    margin-top: 4px;
}

#view_cust_list_task_details .modal-title {
    margin-top: 8px;
}

#view_cust_list_task_details .modal-body {
    padding-bottom: 25px;
}

    #view_cust_list_task_details .modal-body .d-flex {
        justify-content: space-between;
        column-gap: 30px;
    }

        #view_cust_list_task_details .modal-body .d-flex .col {
            width: 33%;
        }

    #view_cust_list_task_details .modal-body section {
        border: 1px solid #E7E7E7;
        border-radius: 2px;
        position: relative;
        padding: 15px 8px;
        margin-bottom: 30px;
    }

        #view_cust_list_task_details .modal-body section:last-child {
            margin-bottom: 0px;
        }

        #view_cust_list_task_details .modal-body section label {
            position: absolute;
            top: -9px;
            left: 10px;
            background: #fff;
            padding: 0 10px;
            font-weight: 500;
            font-size: 14px;
            line-height: 16px;
            color: #333333;
        }

        #view_cust_list_task_details .modal-body section .container {
            width: 100%;
            padding: 0px;
            margin-bottom: 0px;
        }

            #view_cust_list_task_details .modal-body section .container .item-sec {
                display: flex;
                justify-content: space-between;
                column-gap: 15px;
                margin-bottom: 5px;
            }

                #view_cust_list_task_details .modal-body section .container .item-sec:last-child {
                    margin-bottom: 0px;
                }

                #view_cust_list_task_details .modal-body section .container .item-sec .item {
                    font-weight: 400;
                    font-size: 14px;
                    line-height: 24px;
                    letter-spacing: 0.13125px;
                    color: #848484;
                    width: 100%;
                }

                    #view_cust_list_task_details .modal-body section .container .item-sec .item .lbl-radio {
                        position: relative;
                        top: auto;
                        left: auto;
                    }

                    #view_cust_list_task_details .modal-body section .container .item-sec .item.image {
                        text-align: center;
                    }

                        #view_cust_list_task_details .modal-body section .container .item-sec .item.image img {
                            width: 100%;
                        }

                    #view_cust_list_task_details .modal-body section .container .item-sec .item span:last-child {
                        color: #000000;
                    }

        #view_cust_list_task_details .modal-body section.field-photo img {
            width: 300px;
            height: 185px;
        }


        #view_cust_list_task_details .modal-body section.technician-notes {
            padding: 0px;
        }

            #view_cust_list_task_details .modal-body section.technician-notes .inner {
                padding: 15px 8px;
                height: 180px;
                overflow: auto;
            }

        #view_cust_list_task_details .modal-body section.customer-sign {
            padding: 30px 8px;
        }

            #view_cust_list_task_details .modal-body section.customer-sign img {
                width: 150px !important;
            }

        #view_cust_list_task_details .modal-body section.device-list {
            padding: 0px;
        }

            #view_cust_list_task_details .modal-body section.device-list .inner {
                padding: 15px 8px;
                height: 575px;
                overflow: auto;
            }

            #view_cust_list_task_details .modal-body section.device-list .container {
                border-bottom: 1px solid #E7E7E7;
                margin-bottom: 10px;
                padding-bottom: 10px;
            }

                #view_cust_list_task_details .modal-body section.device-list .container:last-child {
                    border-bottom: none;
                    margin-bottom: 0px;
                    padding-bottom: 0px;
                }

                #view_cust_list_task_details .modal-body section.device-list .container .item-sec {
                    justify-content: flex-start;
                }

                    #view_cust_list_task_details .modal-body section.device-list .container .item-sec .item {
                        width: auto;
                    }

                        #view_cust_list_task_details .modal-body section.device-list .container .item-sec .item.image {
                            text-align: left;
                        }

                            #view_cust_list_task_details .modal-body section.device-list .container .item-sec .item.image img {
                                width: 64px;
                            }

        #view_cust_list_task_details .modal-body section .d-flex {
            flex-wrap: wrap;
            column-gap: 40px;
            row-gap: 10px;
        }

            #view_cust_list_task_details .modal-body section .d-flex div {
                font-weight: 400;
                font-size: 14px;
                line-height: 24px;
                letter-spacing: 0.13125px;
                color: #000000;
            }

                #view_cust_list_task_details .modal-body section .d-flex div span:first-child {
                    color: #848484;
                }

        #view_cust_list_task_details .modal-body section.service-details {
            padding: 0px;
        }

            #view_cust_list_task_details .modal-body section.service-details .service {
                display: flex;
                column-gap: 40px;
                border-bottom: 1px solid #E7E7E7;
                padding: 15px;
            }

                #view_cust_list_task_details .modal-body section.service-details .service:last-child {
                    border-bottom: none;
                }

                #view_cust_list_task_details .modal-body section.service-details .service .title {
                    font-weight: 500;
                    font-size: 14px;
                    line-height: 24px;
                    letter-spacing: 0.13125px;
                    color: #000000;
                }

                #view_cust_list_task_details .modal-body section.service-details .service .details {
                    display: flex;
                    column-gap: 30px;
                }

                    #view_cust_list_task_details .modal-body section.service-details .service .details div {
                        font-weight: 400;
                        font-size: 14px;
                        line-height: 24px;
                        letter-spacing: 0.13125px;
                        color: #000000;
                    }

                        #view_cust_list_task_details .modal-body section.service-details .service .details div span:first-child {
                            color: #848484;
                        }

        #view_cust_list_task_details .modal-body section.technician-notes .inner::-webkit-scrollbar,
        #view_cust_list_task_details .modal-body section.device-list .inner::-webkit-scrollbar {
            width: 5px;
        }

        #view_cust_list_task_details .modal-body section.technician-notes .inner::-webkit-scrollbar-track,
        #view_cust_list_task_details .modal-body section.device-list .inner::-webkit-scrollbar-track {
            background-color: #F9F9F9;
        }

        #view_cust_list_task_details .modal-body section.technician-notes .inner::-webkit-scrollbar-thumb,
        #view_cust_list_task_details .modal-body section.device-list .inner::-webkit-scrollbar-thumb {
            box-shadow: inset 0 0 6px rgba(51, 51, 51, 1);
            border-radius: 30px;
        }

.customer-img-block {
    width: 50%;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
    margin-top: 10px;
    height: 192px;
    position: relative;
}

    .customer-img-block .upload-icon-block {
        text-align: right;
        position: absolute;
        /*right: 20px;*/
        /*margin: 5px;*/
        width: 100%;
        height: 100%;
    }

        .customer-img-block .upload-icon-block img {
            margin: 5px;
        }

    .customer-img-block .upload-input {
        z-index: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0;
    }

    .customer-img-block .customer-img {
        width: 100%;
        border: 2px solid;
        border-radius: 12px;
    }

    .customer-img-block .uploaded-img {
        width: 100%;
        border-radius: 12px;
        height: 191px;
    }


.customer-img-block2 {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
    margin-top: 10px;
    height: 170px;
    position: relative;
}

    .customer-img-block2 .upload-icon-block {
        text-align: right;
        position: absolute;
        /*right: 20px;
        margin: 5px;*/
        width: 100%;
        height: 100%;
    }

        .customer-img-block2 .upload-icon-block img {
            margin: 5px;
        }

    .customer-img-block2 .upload-input {
        z-index: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0;
    }

    .customer-img-block2 .customer-img {
        width: 100%;
        border: 2px solid;
        border-radius: 12px;
    }

    .customer-img-block2 .uploaded-img {
        width: 100%;
        border-radius: 12px;
        height: 169px;
        object-fit: cover;
    }

#TechLiveTracking {
    height: 100vh;
}

#task_track .task_track html body {
    padding: 0 !important;
}

#CustomerAMCListpaged, #CustomerTaskListpaged {
    display: flex;
    align-items: center;
    justify-content: end;
}

    #CustomerAMCListpaged p {
        margin-bottom: 0;
    }

#assign_item .modal-dialog,
#Edit_technician .modal-dialog {
    width: 450px;
}

.youtube-video-modal .modal-dialog {
    width: 800px;
}

.youtube-video {
    width: 100%;
    height: 80vh;
}

.youtube-video-modal .close {
    position: absolute;
    right: -32px;
    color: red;
    opacity: 1;
    font-size: 26px;
    background: #fff;
    padding: 3px;
    border-radius: 50%;
    padding: 2px 6px;
}

.youtube-linkIcon img {
    width: 25px;
    height: 25px;
}

.youtube-linkIcon .fa-play-circle {
    color: #c3002f;
    font-size: 22px;
    -webkit-text-stroke: 0px #FFFFFF !important;
}

#addBulkTechnicians .youtube-linkIcon .fa-play-circle {
    margin-top: 4px;
}

.youtube-linkIcon {
    padding: 0;
    cursor: pointer;
}

.youtube-mainBlock {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

#How_to_Add_Video_Link {
    background-color: rgba(0, 0, 0, .3);
}

.new-quick-link.show .btn .fa {
    margin-left: -2px;
    margin-top: 0;
}

.new-quick-link .items .item {
    box-shadow: -1px 1px 12px 1px rgb(0 0 0 / 10%);
}

.attendance_grid_container {
    display: block;
}

    .attendance_grid_container .right_nav {
        padding: 2%;
    }

.modal-footer.model_bottom {
    border-top: 1px solid #e5e5e5;
}

.analytics .grid_container #grid {
    border: none;
}

#ItemUnitId option {
    text-transform: capitalize;
}

.login_section .text-field input {
    padding: 3%;
}

#AssignItemTechnicianFullNameId {
    margin-left: 10px;
}


.justify-content-between {
    justify-content: space-between;
}

.align-center {
    align-items: center;
}

.d-flex-common {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.d-flex-end {
    display: flex;
    align-items: center;
    justify-content: end;
}

/*new dashboard design*/

.profile-completion-section {
    /*width: 78%;*/
    width: 100%;
}

.dashboard_content .task-status-passbook-details {
    box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.02), 10px 10px 20px rgba(0, 0, 0, 0.02), 0px 4px 24px rgba(124, 124, 124, 0.1);
}

.primary-btn {
    height: 34px;
    border-radius: 4px;
    background-color: #c3002f;
    border-radius: 20px;
    font-size: 14px;
    border: 2px solid #c3002f;
    padding: 5px 28px;
    font-weight: 500;
    color: #fff;
}

a.primary-btn:hover, a.primary-btn:focus {
    color: #ffffff;
    text-decoration: none;
}

a.primary-btn {
    display: block;
    padding: 5px 20px;
}

    a.primary-btn img {
        width: 20px;
        transition: 0.3s ease-in;
    }

    a.primary-btn:hover img {
        transform: translateX(30%);
    }

.pt-1r {
    padding-top: 1rem;
}

.pb-1r {
    padding-bottom: 1rem;
}

.pb-2r {
    padding-bottom: 2rem;
}
/*slider*/
/*.bannerSlider {
    width: 40%;
    background: #FFFFFF;
    box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.05), 0px 4px 24px rgba(124, 124, 124, 0.1);
    border-radius: 5px;
}

    .bannerSlider img {
        width: 100%;
        height: 142px;
        border: 1px solid #eee;
        border-radius: 5px;
        margin: 0;
    }*/

.wrap {
    position: relative;
    /*width: 256px;*/
    height: 300px;
    margin: 50px auto;
}

.slider {
    /*width: 256px;*/
    height: 300px;
    margin: 50px auto;
    overflow: hidden;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.slider__row {
    display: flex;
    flex-direction: column;
    position: relative;
    top: 0;
    left: 0;
    height: 1536px;
    overflow: hidden;
    transition: .5s;
}

.right_nav .item .estimate .technician_task .technician_details {
    display: flex;
}

    .right_nav .item .estimate .technician_task .technician_details .technician_image {
        width: 40px;
        margin-right: 8px;
    }

.right_nav .fa-search {
    color: #6C7A89;
}

.right_nav .item {
    padding: 0;
}
/*Today’s Attendance*/
.attendance_legend {
    /*margin-top: 30px;*/
}

    .attendance_legend .present.dot {
        width: 8px;
        height: 8px;
        background-color: #C3002F;
        margin-right: 5px;
        border-radius: 50%;
        margin-top: 10px;
    }

.attendance_chartBlock {
    text-align: center;
    padding-left: 0;
}

    .attendance_chartBlock button {
        margin-top: 2rem;
    }

/*.attendance_legend .absent.dot {
    width: 8px;
    height: 8px;
    background-color: #9CCC65;
    margin-right: 5px;
    border-radius: 50%;
    margin-top: 10px;
}

.attendance_legend .idle.dot {
    width: 8px;
    height: 8px;
    background-color: #ff9b00;
    margin-right: 5px;
    border-radius: 50%;
    margin-top: 10px;
}
.attendance_legend .OnLeave.dot {
    width: 8px;
    height: 8px;
    background-color: #353935;
    margin-right: 5px;
    border-radius: 50%;
    margin-top: 10px;
}*/
.status {
    border: none;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.attendance_legend .present {
    color: #28a745;
}
.attendance_legend .absent {
    color: #C3002F;
}
.attendance_legend .OnLeave {
    color: #ff9b00;
}
.attendance_legend .idle {
    color: #9a9faa;
}

.attendance_legend .status p {
    font-weight: bold;
    font-size: 16px;
    line-height: 29px;
    margin-bottom: 1px;
}

.attendance_legend .status span {
    font-weight: bold;
    font-size: 16px;
    line-height: 17px;
}

.attendance_legend ul {
    margin-right: 3rem;
    padding: 0;
}

.attendance_legend li {
    list-style: none;
    display: flex;
    margin-bottom: 26px;
}

    .attendance_legend li:last-child {
        margin-bottom: 0px;
    }

.attendance_legend .attendance-track {
    list-style: none;
    display: flex;
    margin-bottom: 0;
}

.attendanceBlock {
    width: 30%;
    margin-right: 2%;
    padding: 12px;
    background: #FFFFFF;
    box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.05), 0px 4px 24px rgba(124, 124, 124, 0.1);
    border-radius: 5px;
}
    .attendanceBlock a.primary-btn {
        height: auto;
        padding: 3px 8px;
    }
.today_attendanceBlock {
    display: flex;
    justify-content: space-between;
    flex-direction:column;
    gap:1rem;
}

.attendanceWrapper {
    margin-top: 15px;
}

.legend ul {
    display: flex;
    justify-content: space-between;
    overflow-y: auto;
}

    .legend ul li {
        width: auto;
    }

.grid_container #grid .item {
    /* display: flex;
    width:70%;
    padding: 0;*/
}

#two .estimate .today_estimate {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.grid_container #grid .title {
    text-align: center;
}

.grid_container #grid .item.dashboard_pass_status {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 4rem 0 2rem 0;
}

.create_task_btn {
    /*width: 100%;*/
    text-align: right;
}

.dashboard_flex {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.grid_container #grid .item.dashboard_chart {
    display: block;
}

.section_top {
    height: 40px;
    margin-bottom: 2rem;
    padding-top: 1rem;
}

.task-status-passbook-details .legend {
    padding: 0rem 0;
}

#doughnut-chart {
    /*margin-bottom:4rem !important;*/
}


.grid_container #grid .attendanceWrapper .title {
    margin-bottom: 15px;
}

.dashboard_content {
    background-color: #fff;
}

.right_nav .tab_container #content2::-webkit-scrollbar {
    width: 3px;
}

.right_nav .tab_container #content2::-webkit-scrollbar-thumb {
    background: #E9E9E9;
    margin-right: 5px;
}

.noResult img {
    width: 100%;
    max-width: 60%;
}

.noResult {
    text-align: center;
    margin-bottom: 20px;
}

.right_nav_wrapper {
    width: 25%;
    background-color: #fff;
}

.grid_container #grid #doughnut-chart-attendance {
    height: 160px !important;
    width: 160px !important;
    margin: 0 auto;
    position: relative;
}

.total_days_attendance {
    position: absolute;
    top: 33%;
    text-align: center;
    left: 20%;
}

    .total_days_attendance p {
        margin: 0;
        font-size: 25px;
        color: #101420;
    }

    .total_days_attendance span {
        font-size: 14px;
        color: #888;
    }

.dashboard_content .filter {
    padding-right: 2%;
}


.loader-wrapper {
    position: absolute;
    /*left: 50%;
    top: 40%;
    z-index: 9999;*/
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 9999;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity:1 !important;
}

    .loader-wrapper .loader-text {
        margin-top: 4px;
        color: gray;
    }

.loader {
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #c3002f;
    width: 70px;
    height: 70px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

.loader-sm {
    border: 4px solid transparent;
    border-radius: 50%;
    border-top: 4px solid #c3002f;
    width: 60px;
    height: 60px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    position: absolute;
    margin-top: 1px;
    margin-left: 1px;
}


/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

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

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/*---------------modal centered----------------*/
.modal-dialog-centered {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - 1rem)
}

    .modal-dialog-centered::before {
        display: block;
        height: calc(100vh - 1rem);
        height: -webkit-min-content;
        height: -moz-min-content;
        height: min-content;
        content: ""
    }

    .modal-dialog-centered.modal-dialog-scrollable {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: center;
        justify-content: center;
        height: 100%
    }

/*.modal-dialog-centered.modal-dialog-scrollable .modal-content {
            max-height: none
        }

        .modal-dialog-centered.modal-dialog-scrollable::before {
            content: none
        }*/
.modal-dialog-centered {
    min-height: calc(100% - 3.5rem)
}

    .modal-dialog-centered::before {
        height: calc(100vh - 3.5rem);
        height: -webkit-min-content;
        height: -moz-min-content;
        height: min-content
    }
/*---------------modal centered----------------*/

/*Chatbot start*/

/*body {
    font-family: 'Open Sans', sans-serif;
}*/
#closeBtn img {
    transition: 0.3s ease-in-out;
    width: 18px;
    height: 18px;
}

#closeBtn:hover img {
    transform: scale(1.3);
}

.Messenger_prompt {
    margin: 0;
}

#chatbot {
    /*width: 350px;
    height: 450px;*/
    margin: 0 auto;
    background: #efefef;
    /* padding: 20px;*/
    display: none;
    border-radius: 10px;
    animation: slideIn 1s ease-out;
    box-shadow: 0 4px 16px rgb(0 0 0 / 25%);
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 99;
}

@keyframes slideIn {
    from {
        transform: translateY(100%);
    }

    to {
        transform: translateY(0);
    }
}

/*#openBtn {
    padding: 0px;*/
    /* width: 44px; */
    /* height: 44px; */
    /* background-color: red; */
    /* box-shadow: 0 4px 10px rgb(0 0 0 / 25%); */
    /* background-position: 50%; */
    /* background-size: 300%; */
    /*border-radius: 50%;*/
    /* color: white; */
    /*border: none;
    cursor: pointer;*/
    /* margin-bottom: 20px; */
    /* font-size: 1.7em; */
    /*position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 4;
}*/
#openBtn {
    padding: 0px;
    /* width: 44px; */
    /* height: 44px; */
    /* background-color: red; */
    /* box-shadow: 0 4px 10px rgb(0 0 0 / 25%); */
    /* background-position: 50%; */
    /* background-size: 300%; */
    border-radius: 50%;
    /* color: white; */
    border: none;
    cursor: pointer;
    /* margin-bottom: 20px; */
    /* font-size: 1.7em; */
    position: fixed;
    bottom: 10%;
    right: 15px;
    z-index: 4;
}
.Messenger_messenger iframe {
    width: 100%;
    height: 100%;
    max-width: 100%;
    border: none;
    display: block;
}

#closeBtn {
    position: absolute;
    top: 3px;
    right: 10px;
    z-index: 10000;
    cursor: pointer;
    font-size: 11px; /* Adjust size of the text/icon */
}

#openBtn img {
    width: 55px;
    height: 55px;
    box-shadow: 0 4px 10px rgb(0 0 0 / 25%);
    border-radius: 50%;
}

#chatlogs {
    height: 80%;
    overflow-y: scroll;
    word-wrap: break-word;
    padding: 10px;
    position: relative;
}


#user {
    color: black;
    font-weight: bold;
    font-size: 12px;
    background-color: #fff;
    padding: 10px;
    padding-right: 10px;
    border-radius: 10px 0 10px 10px;
    margin-bottom: 10px;
    position: relative;
}

    #user:before {
        content: '';
        border-left: 15px solid #fff;
        border-top: 0px solid transparent;
        border-bottom: 20px solid transparent;
        /* border-bottom-left-radius: 44%; */
        position: absolute;
        right: -10px;
        top: 0;
    }

#user_message {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

#bot {
    color: #10131f;
    /*font-weight: bold;*/
    font-size: 12px;
    background-color: #fff;
    padding: 6px;
    border-radius: 0 6px 6px 6px;
    word-wrap: break-word;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    overflow-wrap: anywhere;
    position: relative;
}

    #bot:before {
        content: '';
        border-right: 15px solid #fff;
        border-top: 0px solid transparent;
        border-bottom: 20px solid transparent;
        /* border-bottom-left-radius: 44%; */
        position: absolute;
        left: -10px;
        top: 0;
    }

#bot_message {
    display: flex;
    justify-content: flex-start;
    /*align-items: center;*/
    text-align: left;
}

#inputArea {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.Input-blank {
    border-top: 1px solid #ddd;
    background: #fff;
}

#userInput {
    width: 85%;
    padding: 10px;
    /*font-size: 12px;
    font-weight: bold;*/
    color: black;
    border-radius: 6px;
    /*margin-bottom: 10px;*/
    margin-left: 3px;
    border: none;
}

    #userInput:focus {
        outline: 0;
    }

#sendBtn {
    width: 10%;
    padding: 10px;
    background-color: white;
    color: #C22032;
    border: none;
    cursor: pointer; /*
    border-radius: 10px;*/
}

    #sendBtn i {
        font-size: 18px;
    }

/*#closeBtn {*/
    /* width: 20px;
    height: 20px;*/
    /*background-color: #C22032;
    color: white;
    border-radius: 50%;
    text-align: center;
    cursor: pointer;
    font-size: 16px;
    position: absolute;*/
    /*top: 20px;*/
    /*z-index: 9;
    right: 12px;
}*/

#user img {
    border-radius: 30%;
    width: 30px;
    height: 30px;
}

#bot_message img {
    border-radius: 50%;
    width: 25px;
    height: 25px;
    float: left;
    margin-right: 10px;
}

.botIcon .Messenger_header, .botIcon .Messenger_messenger {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.botSubject, .messages, .showBotSubject .botIconContainer, .showMessenger .botIconContainer {
    display: none;
}

.botIcon .Messenger_header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #C22032;
    color: rgb(255, 255, 255);
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 12px 10px;
}

.botIcon .Messenger_messenger {
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    width: 100%;
}

.botIcon .Layout-expand {
    display: none;
    height: 600px;
    width: 350px;
    max-height: 100vh;
    min-height: 300px;
}

.botIcon .Layout-expand {
    display: block;
}

#Messenger_header h4 {
    -webkit-animation: slidein .15s .3s;
    -ms-animation: slidein .15s .3s;
    animation: slidein .15s .3s;
    -webkit-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    font-size: 16px;
    opacity: 0;
}

#Messenger_prompt {
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#Input-blank .Input_field {
    max-height: 20px;
}

#Input {
    background-color: #fff;
    border-top: 1px solid #e6ebea;
    color: #96aab4;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-bottom: 15px;
    padding-top: 17px;
    position: relative;
    width: 100%;
}

.botIcon .Messenger_messenger {
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    width: 100%;
    justify-content: space-between;
}

.iconInner {
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    background: #a64bf4;
    background: -webkit-linear-gradient(to left, white, #C22032, white, #C22032);
    background: -o-linear-gradient(to left, white, #C22032, white, #C22032);
    background: -moz-linear-gradient(to left,white, #C22032, white,#C22032);
    background: linear-gradient(to left, white, #C22032, white, #C22032);
    background-position: 50%;
    background-size: 300%;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 1.7em;
    height: 2em;
    justify-content: center;
    width: 2em;
}


i.fa.fa-commenting {
    font-size: 22px;
}


.Layout {
    -webkit-animation: appear .15s cubic-bezier(.25, .25, .5, 1.1);
    -ms-animation: appear .15s cubic-bezier(.25, .25, .5, 1.1);
    animation: appear .15s cubic-bezier(.25, .25, .5, 1.1);
    -webkit-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    /* background-color: rgb(63, 81, 181);*/
    bottom: 20px;
    border-radius: 10px;
    /*box-shadow: 5px 0 20px 5px rgba(0, 0, 0, .1);*/
    box-sizing: content-box !important;
    color: rgb(255, 255, 255);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    max-height: 30px;
    max-width: 500px;
    min-width: 50px;
    /*opacity: 0;
    pointer-events: auto;
    position: fixed;
    -webkit-transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1), min-width .2s cubic-bezier(.25, .25, .5, 1), max-width .2s cubic-bezier(.25, .25, .5, 1), min-height .2s cubic-bezier(.25, .25, .5, 1), max-height .2s cubic-bezier(.25, .25, .5, 1), border-radius 50ms cubic-bezier(.25, .25, .5, 1) .15s, background-color 50ms cubic-bezier(.25, .25, .5, 1) .15s, color 50ms cubic-bezier(.25, .25, .5, 1) .15s;
    -ms-transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1), min-width .2s cubic-bezier(.25, .25, .5, 1), max-width .2s cubic-bezier(.25, .25, .5, 1), min-height .2s cubic-bezier(.25, .25, .5, 1), max-height .2s cubic-bezier(.25, .25, .5, 1), border-radius 50ms cubic-bezier(.25, .25, .5, 1) .15s, background-color 50ms cubic-bezier(.25, .25, .5, 1) .15s, color 50ms cubic-bezier(.25, .25, .5, 1) .15s;
    transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1), min-width .2s cubic-bezier(.25, .25, .5, 1), max-width .2s cubic-bezier(.25, .25, .5, 1), min-height .2s cubic-bezier(.25, .25, .5, 1), max-height .2s cubic-bezier(.25, .25, .5, 1), border-radius 50ms cubic-bezier(.25, .25, .5, 1) .15s, background-color 50ms cubic-bezier(.25, .25, .5, 1) .15s, color 50ms cubic-bezier(.25, .25, .5, 1) .15s;
    z-index: 999999999;*/
}

.Layout-open {
    border-radius: 10px;
    color: #fff;
    height: 500px;
    /*max-height: 500px;
    max-width: 300px;*/
    overflow: hidden;
    -webkit-transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1.1), min-width .2s cubic-bezier(.25, .25, .5, 1.1), max-width .2s cubic-bezier(.25, .25, .5, 1.1), max-height .2s cubic-bezier(.25, .25, .5, 1.1), min-height .2s cubic-bezier(.25, .25, .5, 1.1), border-radius 0ms cubic-bezier(.25, .25, .5, 1.1), background-color 0ms cubic-bezier(.25, .25, .5, 1.1), color 0ms cubic-bezier(.25, .25, .5, 1.1);
    -ms-transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1.1), min-width .2s cubic-bezier(.25, .25, .5, 1.1), max-width .2s cubic-bezier(.25, .25, .5, 1.1), max-height .2s cubic-bezier(.25, .25, .5, 1.1), min-height .2s cubic-bezier(.25, .25, .5, 1.1), border-radius 0ms cubic-bezier(.25, .25, .5, 1.1), background-color 0ms cubic-bezier(.25, .25, .5, 1.1), color 0ms cubic-bezier(.25, .25, .5, 1.1);
    transition: right .1s cubic-bezier(.25, .25, .5, 1), bottom .1s cubic-bezier(.25, .25, .5, 1.1), min-width .2s cubic-bezier(.25, .25, .5, 1.1), max-width .2s cubic-bezier(.25, .25, .5, 1.1), max-height .2s cubic-bezier(.25, .25, .5, 1.1), min-height .2s cubic-bezier(.25, .25, .5, 1.1), border-radius 0ms cubic-bezier(.25, .25, .5, 1.1), background-color 0ms cubic-bezier(.25, .25, .5, 1.1), color 0ms cubic-bezier(.25, .25, .5, 1.1);
    width: 100%;
}

.Layout-expand {
    display: none;
    height: 400px;
    max-height: 100vh;
    min-height: 300px;
}

.botIcon {
    /*bottom: 15px;
    right: 15px;
    position: fixed;
    z-index: 9999;
    width: 350px;
    height: 450px;
    margin-bottom: 10px;*/
}


/*chat-bot end */
/*-----chatbot loader----*/
/*.chatbot-loader {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    right:0;
    bottom:0;
}
.chatbot-loader-inner {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: block;
    margin: 15px auto;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    background: #FFF;
    box-shadow: -20px 0 #FFF, 20px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulse 2s linear infinite;
}

@keyframes shadowPulse {
    33% {
        background: #FFF;
        box-shadow: -20px 0 #c22032, 20px 0 #FFF;
    }

    66% {
        background: #c22032;
        box-shadow: -20px 0 #FFF, 20px 0 #FFF;
    }

    100% {
        background: #FFF;
        box-shadow: -20px 0 #FFF, 20px 0 #c22032;
    }
}*/
/*------------chatbot ui-------------*/
/*----------------custom scrollbar for chatbot------------------*/
/* width */
#chatlogs::-webkit-scrollbar {
    width: 7px;
}

/* Track */
#chatlogs::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
#chatlogs::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 10px;
}

    /* Handle on hover */
    #chatlogs::-webkit-scrollbar-thumb:hover {
        background: #888;
    }


/*----code by mj----*/
/*==============Start Account mgt===============*/
.page_header .add_task {
    width: 112px;
    /* height: 34px; */
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 1px solid #c3002f;
    padding: 7px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .page_header .add_task:hover {
        background-color: #b3012c;
    }

.page_header .add_task2 {
    /*width: 112px;*/
    /* height: 34px; */
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    /* border: 2px solid #c3002f; */
    padding: 7px 12px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .page_header .add_task2:hover {
        background-color: #b3012c;
    }

.page_header {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 496px auto;
    grid-template-columns: 496px auto;
    -ms-grid-rows: 66px;
    grid-template-rows: 66px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2rem;
}

    .page_header .main {
        margin-top: 0px;
    }

    .page_header .input-group-append .btn:hover {
        color: #c22032;
    }

.Quotation_details .table .dropdown-menu {
    left: auto;
    right: 0;
    min-width: 170px;
}

.Invoice_details .table .dropdown-menu {
    left: auto;
    right: 0;
    min-width: 205px;
}

.service_details .table .dropdown-menu {
    left: auto;
    right: 0;
    min-width: 170px;
}

.status_clr_grey {
    box-sizing: border-box;
    color: #353935;
    text-align: center;
    background: rgba(51, 51, 51, 0.45);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_clr_green {
    box-sizing: border-box;
    color: #2DC76D;
    text-align: center;
    background: #C0EFD4;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_clr_purple {
    box-sizing: border-box;
    color: #4B0082;
    text-align: center;
    background: rgba(75, 0, 130, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_clr_red {
    box-sizing: border-box;
    color: #C22032;
    text-align: center;
    background: rgba(194, 32, 51, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_Assigned {
    box-sizing: border-box;
    color: #FFAA33;
    text-align: center;
    background: rgba(255, 170, 51, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_UnAssigned {
    box-sizing: border-box;
    color: #4B0082;
    text-align: center;
    background: rgba(75, 0, 130, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.status_Completed {
    box-sizing: border-box;
    color: #529A00;
    text-align: center;
    background: rgba(156, 204, 101, 0.21);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;
}

.lnkview_details, .view_details, .lnkreturm_details {
    font-size: 12px;
    font-weight: 500;
    color: #c3002f;
    cursor: pointer;
    white-space: nowrap;
}

    .lnkview_details:hover, .view_details:hover, .lnkreturm_details:hover {
        color: #333;
    }

.lbl_amount {
    color: #529A00 !important;
    font-weight: 600;
}

.lblred_amount {
    color: #C22032 !important;
    font-weight: 600;
}

.lbl_green {
    color: #529A00 !important;
}

.lbl_orange {
    color: #FFAA33 !important;
}

.lbl_indigo {
    color: #4B0082 !important;
}

.lbl_purple {
    color: #353935 !important;
}

.lbl_skyblue {
    color: #69a5fe !important;
}

.hs_blue span {
    color: #353935;
    border-radius: 25px;
    padding: 5px;
    background: rgba(53, 156, 231, 0.45);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_green span {
    color: #00B700;
    border-radius: 25px;
    padding: 5px;
    background: rgba(45, 199, 109, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}
.hs_total_inactive span {
    color: #353935;
    border-radius: 25px;
    padding: 5px;
    background-color: lightgray;
    border: 1px solid #00000033;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}
.hs_purple span {
    color: #353935;
    border-radius: 25px;
    padding: 5px;
    background: rgba(75, 0, 130, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_grey span {
    color: #353935;
    border-radius: 25px;
    padding: 5px;
    background: rgba(51, 51, 51, 0.45);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_red span {
    color: #C3002F;
    border-radius: 25px;
    padding: 5px;
    background: rgba(194, 32, 51, 0.4);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_total_count span {
    color: #077BBC;
    border-radius: 25px;
    padding: 5px;
    background: rgba(115, 202, 252, 0.48);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_total_assigned span {
    color: #FFAA33;
    border-radius: 25px;
    padding: 5px;
    background: #FFE6C2;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_total_unassigned span {
    color: #4B0082;
    border-radius: 25px;
    padding: 5px;
    background: rgba(75, 0, 130, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_total_completed span {
    color: #529A00;
    border-radius: 25px;
    padding: 5px;
    background: rgba(164, 211, 110, 0.6);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}

.hs_total_Lost span {
    color: #c3002f;
    border-radius: 25px;
    padding: 5px;
    background: lightcoral;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}
.hs_total_followup span {
    color: navy;
    border-radius: 25px;
    padding: 5px;
    background: rgb(123 146 214 / 0.60);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: bold;
}
.page_header select {
    border-radius: 4px;
    border: 1px solid #c6cbd4;
    line-height: inherit;
    background-color: transparent;
    padding: 7px 10px;
}

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

.red_btn {
    border-radius: 4px;
    background-color: #c3002f;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 8px 15px;
}

.black_btn {
    border-radius: 4px;
    background-color: #353935;
    border: 1px solid #353935;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 8px 15px;
}

.justify-content-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
}

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

.mr-2 {
    margin-right: 0.5rem !important;
}

.mr-3 {
    margin-right: 1rem !important;
}

.ml-2 {
    margin-left: 0.5rem !important;
}

.Quotation_details .dropdown-toggle {
    background: transparent;
}

.Invoice_details .dropdown-toggle {
    background: transparent;
}

.more-menu-item span {
    color: #333333;
}


.Gen_pop_model fieldset {
    border-radius: 2px;
    border: solid 1px #e7e7e7;
    padding: 10px;
}

.Gen_pop_model .block {
    margin-bottom: 15px;
}

.Gen_pop_model fieldset legend {
    margin: 0 5px;
    padding: 0 5px;
    width: auto;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    position: relative;
}

.Gen_pop_model table, th, td {
    padding: 0;
    vertical-align: top;
}

.Gen_pop_model table, th, td {
    padding: 0;
    vertical-align: top;
}

.Gen_pop_model .block fieldset p {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: 0.13px;
    color: #000000;
    margin: 0;
    /*font-weight: 500;*/
    /* word-break: break-word; */
}

    .Gen_pop_model .block fieldset p span {
        color: #848484;
    }

.Gen_pop_model .modal-content {
    width: 100%;
}

#Delete_Quote_mdl .pop-top-title {
    display: flex;
    justify-content: center;
}

.mt-1 {
    margin-top: 0.25rem !important;
}

.mt-2 {
    margin-top: 0.5rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.mt-4 {
    margin-top: 1.5rem !important;
}

.mt-5 {
    margin-top: 3rem !important;
}

.mt-6 {
    margin-top: 3.5rem !important;
}

.mt-7 {
    margin-top: 4rem !important;
}

.mr-5 {
    margin-right: 3rem !important;
}

.mb-1 {
    margin-bottom: 0.25rem !important;
}

.mb-2 {
    margin-bottom: 0.5rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.rate_toggle_btn .toggle .btn.active {
    color: #fff;
    background-color: #353935;
    border-color: #353935;
}

.Quote_task_details {
    margin: 5px 10px 15px 10px;
}

.text-field .input-group input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.quotation-details h3 {
    margin: 14px 0 0;
    font-size: 1.9rem;
}

#edit_quote_mdl .form-inline .input-group .input-group-addon,
#Update_Status_mdl .form-inline .input-group .input-group-addon,
#add_task_mdl .form-inline .input-group .input-group-addon,
#Add_quote_mdl .form-inline .input-group .input-group-addon,
#AddProduct_mdl .form-inline .input-group .input-group-addon,
#UpdateProduct_mdl .form-inline .input-group .input-group-addon,
#UpdateCustomer_mdl .form-inline .input-group .input-group-addon,
#Add_Quotation_Id .form-inline .input-group .input-group-addon {
    width: 1%;
}

.btn_linkred {
    color: #c3002f;
    font-weight: bold;
    cursor: pointer;
}

    .btn_linkred:hover {
        color: #c3002f;
    }
/*------custom file upload-------*/
/* ===================== FILE INPUT ===================== */
.file-area {
    width: 100%;
    position: relative;
    margin-top: 10px;
}

    .file-area input[type=file] {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;
        cursor: pointer;
    }

    .file-area .file-dummy {
        width: 100%;
        padding: 30px;
        background: rgba(255, 255, 255, 0.2);
        border: 2px dashed #ddd;
        text-align: center;
        transition: background 0.3s ease-in-out;
    }

        .file-area .file-dummy .success {
            display: none;
        }

    .file-area:hover .file-dummy {
        background: rgba(255, 255, 255, 0.1);
    }

    .file-area input[type=file]:focus + .file-dummy {
        outline: 2px solid rgba(255, 255, 255, 0.5);
        outline: -webkit-focus-ring-color auto 5px;
    }

    .file-area input[type=file]:valid + .file-dummy {
        border-color: #7fca7f;
        background-color: rgb(226 253 226);
    }

        .file-area input[type=file]:valid + .file-dummy .success {
            display: inline-block;
        }

        .file-area input[type=file]:valid + .file-dummy .default {
            display: none;
        }

/*------custom file upload-------*/

.tbl_quotesummery {
    width: 100%;
}

    .tbl_quotesummery tr td {
        width: 1%;
        padding: 10px 0;
    }

.tbl_Update_PayStatus tr td {
    width: 1%;
    padding: 10px 0;
}

.border-0 {
    border: 0 !important;
}

.Update_PayStatus_add_amount {
    display: flex;
}

    .Update_PayStatus_add_amount .black_btn {
        padding: 6px 20px;
        white-space: nowrap;
    }

.w-100 {
    width: 100% !important;
}
.w-10 {
    width: 10%!important;
}
.w-60 {
    width: 60% !important;
}
.w-30 {
    width: 30% !important;
}

/*-------copy link*/
.Gen_pop_model .copy_link {
    display: block;
    width: auto;
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 1.5rem;
    border: 2px solid #c3002f;
    padding: 6px 15px;
    font-weight: 500;
    margin: 2rem auto;
}

    .Gen_pop_model .copy_link img {
        width: 25px;
        height: 25px;
        margin-right: 5px;
    }

    .Gen_pop_model .copy_link:active:focus {
        background-color: #b3012c;
        border: 2px solid #b3012c;
        color: #fff;
    }

.Gen_pop_model #LblTxtCopied {
    color: #000000;
    font-weight: 600;
    display: none;
}

.Gen_pop_model #LblLinkText {
    font-weight: normal;
    text-align: center;
    display: block;
    color: #111111;
    font-size: 1.8rem;
}

.InvoiceVD_custdetails {
    width: 100%;
}

    .InvoiceVD_custdetails tr td:first-child {
        white-space: nowrap;
    }

.Invoice_View_ViewDetails {
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    padding: 0 15px 15px;
}

.Invoice2_tophead {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    grid-gap: 10px;
}

    .Invoice2_tophead img {
        width: 100px;
        height: 100px;
        object-fit: contain;
        border: 1px solid #ddd;
    }

    .Invoice2_tophead h3 {
        margin-top: 0;
        color: #C3002F;
    }

    .Invoice2_tophead p {
        margin: 0 0 5px;
    }

.sect-griditems {
    background: rgb(195 0 47 / 16%);
    padding: 10px;
    border-radius: 5px;
    margin-top: 1rem !important;
}

    .sect-griditems table {
        width: 100%;
    }

        .sect-griditems table tr td {
            padding: 5px;
            width: 50%;
        }

            .sect-griditems table tr td p {
                margin-bottom: 0;
            }

.sect-griditems2 {
    background: rgb(195 0 47 / 16%);
    padding: 10px;
    border-radius: 5px;
}

    .sect-griditems2 table {
        width: 100%;
    }

        .sect-griditems2 table tr td {
            padding: 5px;
            width: 50%;
        }

.sect-invoicetable table thead {
    background: #C3002F;
    color: #fff;
}

.tblinvoicetablefoot {
    border: 1px solid #ddd;
    margin-top: 1rem !important;
}

    .tblinvoicetablefoot tr td {
        border-top: 0px !important;
    }

        .tblinvoicetablefoot tr td:first-child {
            text-align: left;
            color: #353935;
            font-weight: bold;
        }

        .tblinvoicetablefoot tr td:last-child {
            text-align: right;
            color: rgba(53, 57, 53, 0.6);
            font-weight: bold;
        }

    .tblinvoicetablefoot tr td {
        vertical-align: middle;
    }

.tblinvoicetable_gen {
    border: 1px solid #ddd;
    margin-top: 1rem;
}

    .tblinvoicetable_gen tr td:last-child {
        text-align: right;
    }

.Invoice2_foot {
    text-align: right;
}

    .Invoice2_foot p {
        font-weight: bold;
        margin-top: 15px;
    }

.DeviceListPhoto a {
    display: inline-block;
    border-radius: 5px;
    padding: 2px;
}

    .DeviceListPhoto a:hover {
        text-decoration: none;
    }

        .DeviceListPhoto a:hover img {
            box-shadow: 0px 2px 5px #ccc;
        }

.device_list_item {
    margin-top: 15px;
}

    .device_list_item:first-child {
        margin-top: 0px;
    }

.prevnextarrows {
    display: flex;
    grid-gap: 15px;
    gap: 15px;
}

.grayarrow {
    font-size: 2rem;
    color: #6C7A89;
}

    .grayarrow:hover {
        color: #6C7A89;
    }

.blackarrow {
    font-size: 2rem;
    color: #353935;
}

    .blackarrow:hover {
        color: #c3002f;
        cursor: pointer;
    }

.Quotation_details table tr td, .Invoice_details table tr td {
    vertical-align: middle;
    border-top: none;
    border-bottom: none;
}
/*==============End Account mgt===============*/
/*==============Product mgt===============*/
.btn.btn-black2 {
    /*width: 112px;*/
    /*height: 34px;*/
    border-radius: 4px;
    background-color: #353935;
    font-size: 14px;
    /*border: 2px solid #c3002f;*/
    padding: 7px 12px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .btn.btn-black2:hover, .btn.btn-black2:focus {
        background-color: #474747;
    }

.rounded-circle2 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #ddd;
}

.modal-noheader .close {
    padding: 8px 15px;
}

.modal-noheader {
    display: flex;
    flex-direction: row-reverse;
}

.lbl_red {
    color: #c3002f !important;
}

    .lbl_red:hover {
        color: #c3002f;
    }

.lbl_purple {
    color: #4B0082 !important;
}

    .lbl_purple:hover {
        color: #4B0082;
    }

.IESection {
    text-align: center;
    margin-top: 1rem;
}

.upload-btn-wrapper {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

.btnupload {
    border: 1px solid #353935;
    color: #353935;
    background-color: white;
    padding: 8px 20px;
    border-radius: 4px;
    font-size: 1.5rem;
}

.btnuploadimage {
    border: 1px solid #353935;
    color: #353935;
    background-color: white;
    padding: 8px 8px;
    border-radius: 4px;
    font-size: 1.5rem;
    position: relative;
    margin-right: 6px;
}

    .btnuploadimage img {
        width: 40px;
        height: 40px;
    }

    .btnuploadimage span {
        display: block;
        color: #9A9FAA;
        font-size: 14px;
        margin-top: 5px;
    }

    .btnuploadimage p img {
        position: absolute;
        right: 5px;
        top: 5px;
        width: 12px;
        height: 12px;
        z-index: 2;
    }

    .btnuploadimage p:hover img {
        filter: grayscale(1);
    }

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

/*------custom checkbox------*/

.cust_radio {
    padding-left: 20px;
}

    .cust_radio label {
        display: inline-block;
        position: relative;
        padding-left: 5px;
        cursor:pointer;
    }

        .cust_radio label::before {
            content: "";
            display: inline-block;
            position: absolute;
            width: 17px;
            height: 17px;
            left: 0;
            margin-left: -20px;
            border: 1px solid #cccccc;
            border-radius: 50%;
            background-color: #fff;
            -webkit-transition: border 0.15s ease-in-out;
            -o-transition: border 0.15s ease-in-out;
            transition: border 0.15s ease-in-out;
        }

        .cust_radio label::after {
            display: inline-block;
            position: absolute;
            content: " ";
            width: 11px;
            height: 11px;
            left: 3px;
            top: 3px;
            margin-left: -20px;
            border-radius: 50%;
            background-color: #c3002f;
            -webkit-transform: scale(0, 0);
            -ms-transform: scale(0, 0);
            -o-transform: scale(0, 0);
            transform: scale(0, 0);
            -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
        }

    .cust_radio input[type="radio"] {
        opacity: 0;
    }

        .cust_radio input[type="radio"]:focus + label::before {
            outline: thin dotted;
            outline: 5px auto -webkit-focus-ring-color;
            outline-offset: -2px;
        }

        .cust_radio input[type="radio"]:checked + label::after {
            -webkit-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            -o-transform: scale(1, 1);
            transform: scale(1, 1);
        }

        .cust_radio input[type="radio"]:disabled + label {
            opacity: 0.65;
        }

            .cust_radio input[type="radio"]:disabled + label::before {
                cursor: not-allowed;
            }

    .cust_radio.radio-inline {
        margin-top: 0;
    }

.radio-primary input[type="radio"] + label::after {
    background-color: #428bca;
}

.radio-primary input[type="radio"]:checked + label::before {
    border-color: #428bca;
}

.radio-primary input[type="radio"]:checked + label::after {
    background-color: #428bca;
}

.radio-danger input[type="radio"] + label::after {
    background-color: #d9534f;
}

.radio-danger input[type="radio"]:checked + label::before {
    border-color: #d9534f;
}

.radio-danger input[type="radio"]:checked + label::after {
    background-color: #d9534f;
}

.radio-info input[type="radio"] + label::after {
    background-color: #5bc0de;
}

.radio-info input[type="radio"]:checked + label::before {
    border-color: #5bc0de;
}

.radio-info input[type="radio"]:checked + label::after {
    background-color: #5bc0de;
}

.radio-warning input[type="radio"] + label::after {
    background-color: #f0ad4e;
}

.radio-warning input[type="radio"]:checked + label::before {
    border-color: #f0ad4e;
}

.radio-warning input[type="radio"]:checked + label::after {
    background-color: #f0ad4e;
}

.radio-success input[type="radio"] + label::after {
    background-color: #5cb85c;
}

.radio-success input[type="radio"]:checked + label::before {
    border-color: #5cb85c;
}

.radio-success input[type="radio"]:checked + label::after {
    background-color: #5cb85c;
}
/*------custom checkbox------*/
.TS_trackalladdress img {
    float: right;
    width: 25px;
    height: 25px;
}

.TrackSLsectscroll {
    max-height: 245px;
    overflow-y: auto;
}

.DMRsectscroll {
    max-height: 450px;
    overflow-y: auto;
}

.TrackSLVD_headicons {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .TrackSLVD_headicons ul {
        list-style: none;
        margin: 0;
    }

        .TrackSLVD_headicons ul li {
            display: inline-block;
            padding: 0 10px;
        }

            .TrackSLVD_headicons ul li a img {
                width: 18px;
                height: 18px;
            }

            .TrackSLVD_headicons ul li a:hover img {
                filter: opacity(0.7);
            }

    .TrackSLVD_headicons p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: 0.13px;
        color: #848484;
        margin: 0;
        font-weight: 500;
    }

.TrackSLViewPhoto a {
    display: inline-block;
    border-radius: 5px;
    padding: 2px;
}

    .TrackSLViewPhoto a:hover {
        text-decoration: none;
    }

        .TrackSLViewPhoto a:hover img {
            box-shadow: 0px 2px 5px #ccc;
        }

    .TrackSLViewPhoto a img {
        border: 1px solid #ddd;
    }

.youtube-mainBlock2 {
    display: flex;
    align-items: center;
    justify-content: left;
    gap: 15px;
}

.Prod_uploadedimage .prod_Uimg {
    border: 1px solid #353935;
    position: relative;
    border-radius: 4px;
    width: 105px;
    height: 105px;
}

.Prod_uploadedimage a {
    position: absolute;
    right: 7px;
    top: 5px;
    z-index: 1;
}

    .Prod_uploadedimage a img {
        width: 12px;
        height: 12px;
    }

    .Prod_uploadedimage a:hover img {
        filter: grayscale(1);
    }

.StatusDetailsPhoto a {
    display: inline-block;
    border-radius: 5px;
    padding: 2px;
    width: 32.90%;
}

.tbl_StatusDetails tr td {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    /* line-height: 1.71; */
    letter-spacing: 0.13px;
    color: #848484;
    margin: 0;
    font-weight: 500;
    padding: 6px 0px;
}

    .tbl_StatusDetails tr td span {
        color: #000;
    }

.lblblk_itemid {
    background: #C22032;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}
.lblblk_itemcode {
    background: #000000;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}
.lblblk_amcid {
    background: #C22032;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}
.lblblk_chatbot {
    background: #28a745;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}
.lblblk_serviceitemid {
    background: #c3002f;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 8px;
}

.issuedqty_info, .usedqty_info {
    margin-left: 4px;
    cursor: pointer;
}

.ln-height-0 {
    line-height: 0 !important;
}

#mdl_assignitem .modal-content {
    width: 100%;
}

.lbl_blue {
    color: #0056D8 !important;
}

.lbl_yellow {
    color: #ff9b00 !important;
}

.mdl_assignitem_head {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
}

.mdl_useditem_head {
    font-weight: bold;
}

.sect_item_inventory .task_header, .sect_service_mgt .task_header {
    grid-template-columns: 300px auto;
}

    .sect_item_inventory .task_header .main, .sect_service_mgt .task_header .main {
        margin-top: 0;
        width: 100%;
    }

#Issued_Qty_mdl .modal-content, #Used_Qty_mdl .modal-content, #View_details .modal-content {
    width: 100%;
}

.Issued_Qty_mdl_head .main, .Used_Qty_mdl_head .main {
    width: 500px;
}

.Issued_Qty_mdl_head, .Used_Qty_mdl_head {
    display: flex;
    gap: 25px;
    column-gap: 25px;
    align-items: center;
}

#mdl_returnitem {
    background: rgb(0 0 0 / 30%);
}

#mdl_useditem {
    background: rgb(0 0 0 / 30%);
}

.IIVD_sect {
    font-weight: bold;
}

    .IIVD_sect table {
        width: 100%;
    }

        .IIVD_sect table tr td {
            padding: 10px 5px;
        }

            .IIVD_sect table tr td:first-child {
                padding-left: 0px;
            }

            .IIVD_sect table tr td:last-child {
                padding-right: 0px;
            }

.VDtopleft p {
    margin: 0 0 15px;
}

#MyProfileAddress {
    padding-right: 32px;
}

.TAddltaskstatus {
    border-radius: 2px;
    border: solid 1px #c6cbd4;
    line-height: inherit;
    background-color: transparent;
    padding: 8px 10px;
    width: 100%;
}

.w-20 {
    width: 18px;
    height: 18px;
}

.sect_service_mgt .table tr td .btn {
    background-color: transparent;
}

.lblII_Itemname {
    font-size: 15px;
}

/*==============Product mgt===============*/
#mdl_useditem hr {
    margin-top: 10px;
    margin-bottom: 10px;
}

#ItemImage_ViewDetails_Id {
    height: 145px;
    width: 100%;
    border: 1px solid #ddd;
    object-fit: contain;
}

.frontviewpop {
    z-index: 1051 !important;
}
/*---------------iteminventory tooltip -----------------*/
.iitooltip {
    position: relative;
    display: inline-block;
    /*border-bottom: 1px dotted black;*/
}

    .iitooltip .iitooltiptext {
        visibility: hidden;
        /*width: 120px;*/
        background-color: #555;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 10px;
        position: absolute;
        z-index: 1;
        opacity: 0;
        transition: opacity 0.3s;
        white-space: nowrap;
        font-size: 10px;
        font-weight: normal;
        left: 24px;
    }

        .iitooltip .iitooltiptext::after {
            content: "";
            position: absolute;
            top: 32%;
            left: 0%;
            margin-left: -9px;
            border-width: 5px;
            border-style: solid;
            border-color: transparent #555 transparent transparent;
        }

    .iitooltip:hover .iitooltiptext {
        visibility: visible;
        opacity: 1;
    }

    .iitooltip img.grayiicon {
        filter: brightness(0.8);
    }
/*---------------iteminventory tooltip -----------------*/
#mdl_useditem .nav-tabs li a .fa-plus {
    /*color: #03de73;*/
    margin-right: 0.5rem;
}

#mdl_useditem .nav-tabs li:first-child a.active {
    background: #0c8e4e;
    /*margin-right: 0.5rem;*/
}

#mdl_useditem .nav-tabs li a .fa-minus {
    /*color: #c3002f;*/
    margin-right: 0.5rem;
}

#mdl_useditem .nav-tabs li:last-child a.active {
    background: #c3002f;
    /*margin-right: 0.5rem;*/
}

#AddOrDelUsedItemName {
    color: #c3002f;
    font-size: 1.8rem;
}

#AddService_mdl .text-field {
    margin: 0em 0.5em 0.25em 0;
}

/*code Added by Lavi form Lead Form-START*/ /*code changes by mj*/
.LeadListheader, .AMCListheader, .EMPListheader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: transparent;
    /*padding: 10px;*/
}

.header-item {
    position: relative;
    /*margin-right: 20px;*/
    font-family: 'Roboto',sans-serif;
    font-weight: bold;
    font-size: 14px;
    /*padding-left: 20px;*/
    display: flex;
    align-items: center;
}

.count-badge {
    border-radius: 50%;
    background-color: lightgoldenrodyellow;
    color: darkgoldenrod;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badge1 {
    border-radius: 50%;
    background-color: lightcoral;
    color: white;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badge2 {
    border-radius: 50%;
    background-color: lightblue;
    color: darkblue;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badgePresent {
    border-radius: 50%;
    background-color: rgba(156, 204, 101, 0.21);
    color: rgba(82, 154, 0, 1);
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}
.count-badge3 {
    border-radius: 50%;
    background-color: lightgreen;
    color: darkgreen;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}
.count-badgeIdle {
    border-radius: 50%;
    background-color: lightgray;
    color: black;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}


.count-badge4 {
    border-radius: 50%;
    background-color: lightgray;
    color: black;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badge5 {
    border-radius: 50%;
    background-color: orange;
    color: white;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badge6 {
    border-radius: 50%;
    background-color: navy;
    color: white;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badge7 {
    border-radius: 50%;
    background-color: palevioletred;
    color: white;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

/*code started form dialer LAVI*/

.modal-content {
    position: center;
    /*margin-top: 130px;*/
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    width: 100%;
}

.modal-title {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.42857143;
}

button.close {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}

#dialer_table {
    width: 100%;
    font-size: 1.5em;
}

    #dialer_table tr td {
        text-align: center;
        height: 50px;
        width: 33%;
    }

    #dialer_table #dialer_input_td {
        border-bottom: 1px solid #fafafa;
    }

        #dialer_table #dialer_input_td input:focus {
            outline: none;
        }


        #dialer_table #dialer_input_td input {
            width: 100%;
            border: none;
            font-size: 1em;
            text-align: center;
            color: #C22032;
        }

            /* Remove arrows from type number input : Chrome, Safari, Edge, Opera */
            #dialer_table #dialer_input_td input::-webkit-outer-spin-button,
            #dialer_table #dialer_input_td input::-webkit-inner-spin-button {
                -webkit-appearance: none;
                margin: 0;
            }

            /* Remove arrows from type number input : Firefox */
            #dialer_table #dialer_input_td input[type=number] {
                -moz-appearance: textfield;
            }

            #dialer_table #dialer_input_td input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
                color: #cccccc;
                opacity: 1; /* Firefox */
            }

            #dialer_table #dialer_input_td input:-ms-input-placeholder { /* Internet Explorer 10-11 */
                color: #cccccc;
            }

            #dialer_table #dialer_input_td input::-ms-input-placeholder { /* Microsoft Edge */
                color: #cccccc;
            }

    #dialer_table #dialer_call_btn_td {
        color: #ffffff;
        background-color: green;
        border: none;
        cursor: pointer;
        width: 100%;
        text-decoration: none;
        padding: 5px 32px;
        text-align: center;
        display: inline-block;
        margin: 10px 2px 4px 2px;
        transition: all 300ms ease;
        -moz-transition: all 300ms ease;
        --webkit-transition: all 300ms ease;
    }

        #dialer_table #dialer_call_btn_td:hover {
            background-color: #009d00;
        }

    #dialer_table .dialer_num_tr td {
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    }

        #dialer_table .dialer_num_tr td:nth-child(1) {
            border-right: 1px solid #fafafa;
        }

        #dialer_table .dialer_num_tr td:nth-child(3) {
            border-left: 1px solid #fafafa;
        }

    #dialer_table .dialer_num_tr:nth-child(1) td,
    #dialer_table .dialer_num_tr:nth-child(2) td,
    #dialer_table .dialer_num_tr:nth-child(3) td,
    #dialer_table .dialer_num_tr:nth-child(4) td {
        border-bottom: 1px solid #fafafa;
    }

    #dialer_table .dialer_num_tr .dialer_num {
        color: #000;
        cursor: pointer;
    }

        #dialer_table .dialer_num_tr .dialer_num:hover {
            background-color: #fafafa;
        }

    #dialer_table .dialer_num_tr:nth-child(0) td {
        border-top: 1px solid #fafafa;
    }

    #dialer_table .dialer_del_td img {
        cursor: pointer;
    }


item.LeadStatusId.InActive {
    color: #03de73;
    font-weight: 500;
}
/*code ended for dialer LAVI*/

#TbodyLeadListDetails tr:hover {
    cursor: pointer
}

.img18 {
    width: 18px;
    height: 18px;
}

#Update_leadstatus .modal-dialog {
    width: 400px
}

.btndownloadqr img {
    width: 20px;
}

body.sectleadform {
    padding: 0px !important;
}

#TbodyLeadListDetails .Location img {
    width: 20px;
    height: 20px;
}

.followhistorylist {
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

    .followhistorylist:last-child {
        border-bottom: none;
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

.outer_followhistorylist {
    max-height: 390px;
    overflow-y: auto;
}
    /* width */
    .outer_followhistorylist::-webkit-scrollbar {
        width: 5px;
    }

    /* Track */
    .outer_followhistorylist::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    /* Handle */
    .outer_followhistorylist::-webkit-scrollbar-thumb {
        background: #aaa;
        border-radius: 10px;
    }

        /* Handle on hover */
        .outer_followhistorylist::-webkit-scrollbar-thumb:hover {
            background: #888;
        }

/*-------for lead details--------*/
.view_lead_details .modal-body {
    /*display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;*/
    padding: 0 15px 0 15px;
}

.view_lead_details .block {
    margin-bottom: 15px;
}

.view_lead_details fieldset {
    border-radius: 2px;
    border: solid 1px #e7e7e7;
    padding: 10px;
}

    .view_lead_details fieldset legend {
        margin: 0 5px;
        padding: 0 5px;
        width: auto;
        border: none;
        font-size: 14px;
        font-weight: 500;
        color: #333;
    }

.view_lead_details table, th, td {
    padding: 0;
    vertical-align: top;
}

.view_lead_details .block fieldset p {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    /* line-height: 1.71; */
    letter-spacing: 0.13px;
    color: #848484;
    margin: 0;
    font-weight: 500;
    /* word-break: break-word; */
}

    .view_lead_details .block fieldset p span {
        color: #000;
    }

.leadlistpop_gallery img {
    width: 100%;
    max-width: 125px;
    height: 125px;
}

.view_lead_details .ok_btn {
    margin-top: 0px;
    border-radius: 2px;
    background-color: #c3002f;
    border: none;
    margin-left: 660px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 12px 40px;
}

    .view_lead_details .ok_btn:hover {
        background-color: #b3012c;
        color: #fff;
    }

/*=============custom file upload===============*/
/*.imagePreview {
    width: 100%;
    height: 180px;
    background-position: center center;
    background: url(http://cliquecities.com/assets/no-image-e3699ae23f866f6cbdf8ba2443ee5c4e.jpg);
    background-color: #fff;
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-block;*/
/*box-shadow: 0px -3px 6px 2px rgba(0,0,0,0.2);*/
/*border: 1px solid #bbb;
}
.outer-Upload {
    width: 100%;
    height: 180px;
    background-position: center center;
    background: url(http://cliquecities.com/assets/no-image-e3699ae23f866f6cbdf8ba2443ee5c4e.jpg);
    background-color: #fff;
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-block;
    border-radius: 10px;
    border: 1px solid #bbb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-primary {
    display: block;
    border-radius: 0px;
    box-shadow: 0px 4px 6px 2px rgba(0,0,0,0.2);
    margin-top: -5px;
}

.imgUp {
    margin-bottom: 15px;
}

.del {
    position: absolute;
    top: 1px;
    right: 16px;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    background-color: rgba(255,255,255,0.6);
    cursor: pointer;
}

.imgAdd {
    width: 50px;
    height: 50px;
    border-radius: 50%;*/
/* background-color: #a2a2a2; */
/*color: #a2a2a2;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
    text-align: center;*/
/* line-height: 30px; */
/* margin-top: 0px; */
/*cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-upload {
    display: block;
    border-radius: 0px;
    margin-top: -5px;
    border: 1px solid #bbb;
    border-top: 0;
    padding: 6px 18px;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0.1px;
    background-color: #353935;
    color: #fff!important;
    font-weight: normal;
    text-align: center;
    cursor:pointer;
}
    .btn-upload:hover {
        background-color: #474747;
    }*/

/*---------------- Start upload multiple images - MJ------------------*/
.lf-upload__box {
    border: solid 1px #5d5d5d;
    border-radius: 4px;
    padding: 10px;
    margin-top: 10px;
}

    .lf-upload__box h5 {
        margin-top: 0;
    }

    .lf-upload__box .upload__box {
        display: flex;
        justify-content: center;
    }

.upload__box {
    display: flex;
}

.upload__inputfile {
    width: 0.1px !important;
    height: 0.1px !important;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.upload__btn-box {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(0, 0, 0, 0.6);
    text-align: center;
    width: 200px;
    height: 200px;
    padding: 5px;
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid #cccccc;
    border-radius: 10px;
    line-height: 26px;
    font-size: 28px;
    /*-webkit-text-stroke: 3px #ffffff;*/
    margin-bottom: 0;
    background: #f8f8f8;
}

    .upload__btn-box:hover {
        background: #ffffff;
        /*background-color: unset;*/
        color: #353935;
        transition: all 0.3s ease;
    }

    .upload__btn-box .fa-plus:before {
        transition: 0.3s;
    }

    .upload__btn-box:hover .fa-plus:before {
        transform: scale(1.1);
    }

    .upload__btn-box .fa {
        margin: 0 !important;
        border: 1px solid #ddd;
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        transition: 0.3s;
    }

.upload__btn-box {
    margin-bottom: 10px;
}

.upload__img-wrap {
    display: flex;
    flex-wrap: wrap;
}

.upload__img-box {
    width: 200px;
    margin-bottom: 12px;
    margin-right: 34px;
    position: relative;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
}

    .upload__img-box:nth-child(3) {
        margin-right: 0;
    }

.upload__img-close {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 10px;
    right: 10px;
    text-align: center;
    line-height: 24px;
    z-index: 1;
    cursor: pointer;
}

    .upload__img-close:hover {
        background-color: rgba(0, 0, 0, 0.6);
    }

    .upload__img-close:after {
        content: "✖";
        font-size: 14px;
        color: white;
    }

.img-bg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    padding-bottom: 100%;
    border-radius: 10px;
    border: 1px solid #cccccc;
}
/*---------------- End upload multiple images - MJ------------------*/


.lead-add-button {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #f6f8f8;
    color: black;
    border: none;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
    text-align: center;
    line-height: 30px;
    margin-top: 50px;
    cursor: pointer;
    font-size: 15px;
    margin-left: 20px;
}

/*#addImageBtn2 {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #f6f8f8;
    color: black;
    border: none;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
    text-align: center;
    line-height: 30px;
    margin-top: 50px;
    cursor: pointer;
    font-size: 15px;
    margin-left: 20px;
}*/

.customer-img-block {
    width: 50%;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
    margin-top: 10px;
    height: 192px;
    position: relative;
}

    .customer-img-block .upload-icon-block {
        text-align: right;
        position: absolute;
        /*right: 20px;*/
        /*margin: 5px;*/
        width: 100%;
        height: 100%;
    }

        .customer-img-block .upload-icon-block img {
            margin: 5px;
        }

    .customer-img-block .upload-input {
        z-index: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0;
    }

    .customer-img-block .customer-img {
        width: 100%;
        border: 2px solid;
        border-radius: 12px;
    }

    .customer-img-block .uploaded-img {
        width: 100%;
        border-radius: 12px;
        height: 191px;
    }

/*
.customer-img-block2 {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
    margin-top: 10px;
    height: 170px;
    position: relative;
}*/

.upload__img-box .upload-icon-block {
    text-align: right;
    position: absolute;
    /*right: 20px;
        margin: 5px;*/
    width: 100%;
    height: 100%;
}

    .upload__img-box .upload-icon-block img {
        margin: 5px;
    }

.upload__img-box .upload-input {
    z-index: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
}

.upload__img-box .customer-img {
    width: 100%;
    border: 2px solid;
    border-radius: 12px;
}

.upload__img-box .uploaded-img {
    width: 100%;
    border-radius: 12px;
    height: 200px;
    object-fit: cover;
}

.del_uploadimgitem {
    padding: 5px;
    color: #fff;
    background: #333;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 5px;
    cursor: pointer;
    z-index: 1;
    -webkit-text-stroke: 1px #000;
}


#ViewLeadnotes {
    word-break: break-all;
}

#FollowUpLeadnotes {
    word-break: break-all;
}

/*------------login help section------------*/
.loginhelp-sect img {
    width: 100px;
    height: auto;
}

.loginhelp-sect p span {
    color: #c3002f;
}

.loginhelp-sect p {
    font-size: 12px;
    margin-bottom: 0;
}

.loginhelp-sect {
    border-top: 1px solid #ddd;
    margin-top: 1rem;
    padding-top: 1rem;
}

@media screen and (min-width: 0px) and (max-width: 730px) {
    .lf-upload__box .upload__img-box {
        width: 190px;
        height: 190px;
        margin-bottom: 12px;
        margin-right: 10px;
        margin-left: 10px;
    }

    .lf-upload__box .upload__btn-box {
        margin-bottom: 10px;
        margin-left: 10px;
        width: 190px;
        height: 190px;
    }

    .upload__img-box .uploaded-img {
        width: 190px;
        height: 190px;
    }
}

@media screen and (min-width: 0px) and (max-width: 706px) {
    .lf-upload__box .upload__img-box {
        width: 180px;
        height: 180px;
        margin-bottom: 12px;
        margin-right: 10px;
        margin-left: 10px;
    }

    .lf-upload__box .upload__img-wrap {
        display: flex;
        flex-wrap: wrap;
    }

    .upload__img-box .uploaded-img {
        width: 180px;
        height: 180px;
    }

    .lf-upload__box .upload__btn-box {
        width: 180px;
        height: 180px;
    }
}

@media screen and (min-width: 0px) and (max-width: 661px) {
    .lf-upload__box .upload__img-box {
        width: 170px;
        height: 170px;
    }

    .upload__img-box .uploaded-img {
        width: 170px;
        height: 170px;
    }

    .lf-upload__box .upload__btn-box {
        width: 170px;
        height: 170px;
    }
}

@media screen and (min-width: 0px) and (max-width: 630px) {
    .lf-upload__box .upload__img-box {
        width: 155px;
        height: 155px;
    }

    .upload__img-box .uploaded-img {
        width: 155px;
        height: 155px;
    }

    .lf-upload__box .upload__btn-box {
        width: 155px;
        height: 155px;
    }
}

@media screen and (min-width: 0px) and (max-width: 586px) {
    .lf-upload__box .upload__img-box {
        width: 140px;
        height: 140px;
    }

    .upload__img-box .uploaded-img {
        width: 140px;
        height: 140px;
    }

    .lf-upload__box .upload__btn-box {
        width: 140px;
        height: 140px;
    }
}

@media screen and (min-width: 0px) and (max-width: 542px) {
    .lf-upload__box .upload__img-box {
        width: 130px;
        height: 130px;
    }

    .upload__img-box .uploaded-img {
        width: 130px;
        height: 130px;
    }

    .lf-upload__box .upload__btn-box {
        width: 130px;
        height: 130px;
    }
}

@media screen and (min-width: 0px) and (max-width: 512px) {
    .lf-upload__box .upload__img-box {
        width: 115px;
        height: 115px;
    }

    .upload__img-box .uploaded-img {
        width: 115px;
        height: 115px;
    }

    .lf-upload__box .upload__btn-box {
        width: 115px;
        height: 115px;
    }
}

@media screen and (min-width: 0px) and (max-width: 468px) {
    .lf-upload__box .upload__img-box {
        width: 100px;
        height: 100px;
    }

    .upload__img-box .uploaded-img {
        width: 100px;
        height: 100px;
    }

    .lf-upload__box .upload__btn-box {
        width: 100px;
        height: 100px;
    }
}

@media screen and (min-width: 0px) and (max-width: 422px) {
    .lf-upload__box .upload__img-box {
        width: 90px;
        height: 90px;
    }

    .upload__img-box .uploaded-img {
        width: 90px;
        height: 90px;
    }

    .lf-upload__box .upload__btn-box {
        width: 90px;
        height: 90px;
    }

    .lf-upload__box .upload__img-close {
        width: 20px;
        height: 20px;
        top: 5px;
        right: 5px;
        line-height: 20px;
    }

        .lf-upload__box .upload__img-close:after {
            font-size: 12px;
        }

    .lf-upload__box .fa {
        font-size: 1em;
    }
}

@media screen and (min-width: 0px) and (max-width: 392px) {
    .lf-upload__box .upload__img-box {
        width: 80px;
        height: 80px;
    }

    .upload__img-box .uploaded-img {
        width: 80px;
        height: 80px;
    }

    .lf-upload__box .upload__btn-box {
        width: 80px;
        height: 80px;
    }
}

@media screen and (min-width: 0px) and (max-width: 362px) {
    .lf-upload__box .upload__img-box {
        width: 70px;
        height: 70px;
        margin-right: 5px;
        margin-left: 5px;
    }

    .lf-upload__box .upload__btn-box {
        margin-bottom: 5px;
        margin-left: 5px;
        width: 70px;
        height: 70px;
    }

    .upload__img-box .uploaded-img {
        width: 70px;
        height: 70px;
    }

    .del_uploadimgitem {
        width: 16px;
        height: 16px;
    }

    .lf-upload__box .fa {
        font-size: 0.8em;
    }
}

@media (min-width: 768px) {
    #Update_PayStatus_mdl .modal-dialog {
        width: 470px;
        margin: 30px auto;
    }
}

.QCounter {
    /*margin: 100px;*/
}

.minus, .plus {
    /*width: 20px;
    height: 20px;
    background: #f2f2f2;
    border-radius: 4px;
    padding: 8px 5px 8px 5px;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    text-align: center;*/
    cursor: pointer;
}

.QCounter input {
    background: transparent;
    width: 100%;
    padding: 6px;
    border: solid 1px #5d5d5d;
    border-radius: 4px;
    z-index: 99;
    color: #000;
    text-align: center;
}

.QCounter.text-field .input-group .form-control {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.Assigned {
    /*box-sizing: border-box;
    color: #FFAA33;
    text-align: center;
    background: rgba(255, 170, 51, 0.3);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
    cursor: default;*/
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .Assigned .status {
        width: 8px;
        height: 8px;
        background-color: #FFAA33;
        border-radius: 50%;
        margin-right: 5px;
    }

    .Assigned p {
        color: #FFAA33;
        font-weight: 500;
    }

.NotAssigned {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .NotAssigned .status {
        width: 8px;
        height: 8px;
        background-color: #4B0082;
        border-radius: 50%;
        margin-right: 5px;
    }

    .NotAssigned p {
        color: #4B0082;
        font-weight: 500;
    }

.TaskCompleted {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .TaskCompleted .status {
        width: 8px;
        height: 8px;
        background-color: #529A00;
        border-radius: 50%;
        margin-right: 5px;
    }

    .TaskCompleted p {
        color: #529A00;
        font-weight: 500;
    }

.Lost {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .Lost .status {
        width: 8px;
        height: 8px;
        background-color: #c3002f;
        border-radius: 50%;
        margin-right: 5px;
    }

    .Lost p {
        color: #c3002f;
        font-weight: 500;
    }
/*----------for invoice-------------*/
.Paid {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .Paid .status {
        width: 8px;
        height: 8px;
        background-color: #529A00;
        border-radius: 50%;
        margin-right: 5px;
    }

    .Paid p {
        color: #529A00;
        font-weight: 500;
    }

.UnPaid {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .UnPaid .status {
        width: 8px;
        height: 8px;
        background-color: #4B0082;
        border-radius: 50%;
        margin-right: 5px;
    }

    .UnPaid p {
        color: #4B0082;
        font-weight: 500;
    }

.PartialPaid {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .PartialPaid .status {
        width: 8px;
        height: 8px;
        background-color: #FFAA33;
        border-radius: 50%;
        margin-right: 5px;
    }

    .PartialPaid p {
        color: #FFAA33;
        font-weight: 500;
    }
.FollowUp {
    display: inline-flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .FollowUp .status {
        width: 8px;
        height: 8px;
        background-color: navy;
        border-radius: 50%;
        margin-right: 5px;
    }

    .FollowUp p {
        color: navy;
        font-weight: 500;
    }

/*====================import rules========================*/
.sect_import_rules p {
    margin-bottom: 0;
    color: #777;
}

.sect_import_rules h5 {
    margin-bottom: 0;
    color: #333;
}

.sect_import_rules {
    border: 2px dashed #bbb;
    padding: 10px;
    background: #ededed;
    margin: 0 20px;
    margin: 4rem 20px 0;
}


#TbleQuatationListDetailsId > tbody > tr > td {
    vertical-align: middle;
    border-top: none;
    border-bottom: none;
}

#ViewEQCustomerName, #ViewEQLandMark {
    text-wrap: wrap;
}

.taskAppendForQuotServices, .taskAppendForQuot, .EdittaskAppendForQuotServices, .EdittaskAppendForQuot, .taskAppendForINVServices, .taskAppendForINV {
    position: relative;
}

.m-0 {
    margin: 0 !important;
}

.pt-20 {
    padding-top: 20px !important;
}

.lightgray_btn {
    border-radius: 4px;
    background-color: #e4e4e4;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #353935;
    padding: 8px 15px;
}

.btn-100 {
    width: 100px;
}

.modal-footer2 {
    padding: 15px;
    border-top: 1px solid #e5e5e5;
}

.color_gray {
    color: rgba(53, 57, 53, 0.6) !important;
}

.quotedetailstable {
    width: 100%;
}

    .quotedetailstable tr td {
        width: 50%;
    }

.vscroll-150 {
    max-height: 150px;
    overflow-y: auto;
}

.fb-280 {
    flex-basis: 280px;
}

#viewTncId {
    word-break: break-word;
}

/*===============FSR related css=================*/
.lblblk_taskid, .lblblk_assetid {
    background: #C22032;
    color: #fff;
    padding: 3px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lblblk_tagid {
    background: #5d5d5d;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_FSR_blue {
    color: #2776FF;
}

.lbl_FSR_red {
    color: #C3002F;
}

.btn.btn-red {
    border-radius: 4px;
    background-color: #c3002f;
    font-size: 14px;
    border: 1px solid #c3002f;
    padding: 7px 12px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .btn.btn-red:hover {
        background-color: #b3012c;
    }

.sect-FSR table .more-btn {
    display: inline-block;
}

.sect-FSR table .dropdown .dropdown-menu {
    right: 0px;
    left: auto;
}

.txtwith-crossicon img {
    width: 12px;
    height: 12px;
}

.txtwith-crossicon a {
    position: absolute;
    right: 8px;
    top: 5px;
    cursor: pointer;
    z-index: 100;
}

.fsr_itemList {
    max-height: 170px;
    overflow-y: auto;
    padding: 7px 1px;
}

.mr-0 {
    margin-right: 0px !important;
}

.btn-black {
    border-radius: 2px;
    background-color: #353935;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    padding: 6px 18px;
    text-transform: capitalize;
}

#sectInputform .input-group-addon {
    line-height: unset;
    padding: 0;
}

    #sectInputform .input-group-addon .btn-black {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

#btnEditFromText:hover {
    filter: opacity(0.5);
}

#btnEditFromText {
    cursor: pointer;
}

.w-25 {
    width: 25%;
}
.w-50 {
    width: 50%;
}

#TbleFSRListDetailsId.table tr td {
    border-top: 0px solid #ddd;
}

/*================mj 21122023=================*/
.gap-1 {
    gap: 0.25rem !important;
}

.gap-2 {
    gap: 0.5rem !important;
}

.gap-3 {
    gap: 0.75rem !important;
}
.gap-4 {
    gap: 1rem !important;
}
.gap-5 {
    gap: 2rem !important;
}
.gap-6 {
    gap: 3rem !important;
}
.lbl_fsrname {
    color: #c3002f;
    font-weight: 500;
}

.btncheckpoints {
    cursor: pointer;
}

    .btncheckpoints:hover {
        filter: grayscale(1);
    }

.signature img {
    object-fit: contain;
}

.table .dropdown .dropdown-menu {
    left: auto;
    right: 0;
}

.table .dropdown .dropdown-toggle {
    background: transparent;
}

.AMC_listview .table tr:last-child .dropdown .dropdown-menu {
    top: auto !important;
    bottom: 0;
}

.AMC_listview .table {
    margin-bottom: 20px;
}

    .AMC_listview .table tr td {
        vertical-align: middle;
    }
/*.sect_Searchbox .input-group-addon {
    padding: 0;
    background-color: none;
}*/
.sect_Searchbox .form-control {
    background-color: #f6f3f4;
}

.sect_Searchbox .btn {
    background-color: #f6f3f4;
    position: absolute;
    right: 0;
    z-index: 3;
    margin: 2px 1px;
    padding: 5px 16px;
}

.sect_Searchbox .input-group {
    position: relative;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: stretch;
    width: 100%;
}

    .sect_Searchbox .input-group .form-control {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

/*------------code for services-------------*/
.sect_servicelist_item h5 {
    color: #C22032;
    font-size: 16px;
}

.sect_servicelist_item {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 5px;
    margin-bottom: 10px;
}

    .sect_servicelist_item:hover {
        text-decoration: none;
        cursor: pointer;
    }

        .sect_servicelist_item:hover h5 {
            color: #333;
        }

    .sect_servicelist_item:last-child {
        margin-bottom: 0;
    }

.sect_servicelist_outer {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
}

    .sect_servicelist_outer .sect_Searchbox {
        margin-bottom: 10px;
        width: 100%;
    }

.sect_servicelist {
    max-height: 577px;
    overflow-y: auto;
}

.page_heading2 {
    margin: 0px;
    padding: 0 15px 15px 0px;
    font-size: 14px;
    font-weight: 500;
    color: #101420
}

.sect_graylayout {
    background-color: #f6f8f8;
    padding: 15px;
}

.sect_whitelayout {
    background-color: #ffffff;
    padding: 15px;
}

.accordian_services .collapse.show {
    display: none !important;
}

    .accordian_services .collapse.show.in {
        display: block !important;
    }

.rotate {
    -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
    -moz-transform: rotate(-180deg); /* Firefox */
    -ms-transform: rotate(-180deg); /* IE 9 */
    transform: rotate(-180deg); /* Standard syntax */
}

.sub_category_head {
    display: flex;
    align-items: center;
    gap: 12px;
}

    .sub_category_head:hover {
        text-decoration: none;
    }

.sub_category_count {
    background: #D9D9D9;
    border-radius: 50%;
    font-weight: 600;
    font-size: 10px;
    color: #000000;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sub_category_name {
    color: #C22032;
}

.sub_cat_head_right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.accordian_services .panel-default > .panel-heading {
    color: #C22032;
    background-color: #ffffff;
}

.accordian_services .dropdown .dropdown-menu {
    left: auto;
    right: 0;
}

.accordian_services .panel-heading {
    padding: 8px;
}

.sub_cat_head_right span {
    cursor: pointer;
}

/*============================*/
.upload-img-block {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #9A9FAA;
    border-radius: 12px;
    margin-top: 10px;
    height: 207px;
    position: relative;
    border-radius: 6px;
}

    .upload-img-block .upload-icon-block {
        text-align: right;
        position: absolute;
        /*right: 20px;*/
        /*margin: 5px;*/
        width: 100%;
        height: 100%;
    }


    .upload-img-block .upload-input {
        z-index: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0;
        cursor: pointer;
    }

    .upload-img-block .customer-img {
        width: 100%;
        border: 2px solid;
        border-radius: 12px;
    }

    .upload-img-block .uploaded-img {
        width: 100%;
        border-radius: 6px;
        height: 205px;
        object-fit: contain;
    }

.Gen_pop_model .modal-footer .cancel {
    border: 0;
}


/*==========================custom chckbox/radio========================*/
/* Create a custom checkbox */
.custom-checkobx {
    position: relative;
    cursor: pointer;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: #eee;
    border-radius: 3px;
    border: 1px solid #ccc;
}

/* On mouse-over, add a grey background color */
.custom-checkobx:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.custom-checkobx input:checked ~ .checkmark {
    background-color: #2196F3;
    border-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.custom-checkobx input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.custom-checkobx .checkmark:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.custom-checkobx input[type=checkbox] {
    margin: 0;
}
/*==========================custom chckbox/radio========================*/
.sect-selectedamcitems {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #353535;
}

.ml-3 {
    margin-left: 0.75rem !important;
}

.ml-4 {
    margin-left: 1rem !important;
}

.sect-popfsrdetails h5 {
    font-weight: bold;
}

.sect-popfsrdetails table {
    width: 100%;
}

.sect-popfsrdetails thead tr th {
    color: #c3002f;
}

.sect-popfsrdetails {
    max-height: 558px;
    overflow-y: auto;
}

.category {
    color: #C22032;
}

.pt-3 {
    padding-top: 1rem !important;
}

.lblblk_FSRname {
    background: #C22032;
    color: #fff;
    padding: 3px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.table .dropdown .dropdown-toggle:hover .more-dot {
    background-color: #353935;
}

#tbodyServiceCATList tr {
    text-transform: capitalize;
}

    #tbodyServiceCATList tr:hover, #tbodyServiceCATList tr:active, #tbodyServiceCATList tr:focus {
        background-color: rgba(194, 32, 50, 0.14);
        color: #C22032;
        cursor: pointer;
    }

.ServiceCATList_ActiveRow {
    background-color: rgba(194, 32, 50, 0.14) !important;
    color: #C22032;
}

.progress {
    margin-top: 20px;
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
}

.progress-bar-task {
    background-color: #C22032 !important;
}

.progress-bar-custom {
    background-color: #C22032 !important;
}

.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.5); /* Gray transparent background */
}

/* CSS for progress bar animation */
@keyframes progressBarAnimation {
    from {
        width: 0%;
    }
}

.progress-bar-custom {
    animation: progressBarAnimation 1s linear;
}

.animatedd-background {
    animation: colorAnimation 5s linear infinite alternate;
    background: linear-gradient(to right, #eee, #eee 50%, #ddd 50%, #ddd);
    background-size: 200% 100%;
}

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

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

.sect_service_mgt .service_details {
    max-height: 208px;
    overflow-y: auto;
}

.sect_servicelist_outer .sub_category_head {
    padding: 5px 10px;
}

    .sect_servicelist_outer .sub_category_head:hover {
        background-color: rgba(194, 32, 50, 0.14);
        color: #C22032;
        cursor: pointer;
    }
/*================custom file upload=================*/

.custom-file {
    position: relative;
    display: inline-block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    margin-bottom: 0;
}

.custom-file-input {
    position: relative;
    z-index: 2;
    width: 100%;
    /*height: calc(1.5em + .75rem + 2px);*/
    margin: 0;
    overflow: hidden;
    opacity: 0;
}

    .custom-file-input:focus ~ .custom-file-label {
        border-color: #80bdff;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }


.custom-file-label {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    /*height: calc(1.5em + 0.75rem + 2px);*/
    padding: 0.375rem 0.75rem;
    overflow: hidden;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border-radius: 0.25rem;
    padding: 6px;
    border: solid 1px #5d5d5d;
    border-radius: 4px;
}

.custom-file-input:lang(en) ~ .custom-file-label::after {
    content: "Browse";
}

.custom-file-label::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    /*height: calc(1.5em + 0.75rem);*/
    padding: 0.375rem 0.75rem;
    line-height: 1.8;
    color: #495057;
    content: "Browse";
    background-color: #e9ecef;
    border-left: inherit;
    border-radius: 0 0.25rem 0.25rem 0;
}

.tl_btndelete {
    position: relative;
    left: 0;
    top: 15px;
    display: block;
}

hr {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #ddd;
}

@media (min-width: 768px) {
    .input-group-addon {
        width: 1% !important;
    }
}

.ycroll-210 {
    overflow-y: auto;
    max-height: 210px;
}
.yscroll440 {
    overflow-y: auto;
    height: 440px;
    overflow-x: hidden;
    padding-right: 10px;
}
.yscroll330 {
    overflow-y: auto;
    max-height: 330px;
    overflow-x: hidden;
    padding-right: 10px;
}
.yscroll285 {
    overflow-y: auto;
    max-height: 285px;
    overflow-x: hidden;
    padding-right: 10px;
}

.yscroll330::-webkit-scrollbar-track, .yscroll440::-webkit-scrollbar-track, .yscroll285::-webkit-scrollbar-track, tagList::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.yscroll330::-webkit-scrollbar, .yscroll440::-webkit-scrollbar, .yscroll285::-webkit-scrollbar, tagList::-webkit-scrollbar {
    width: 5px;
    background-color: #F5F5F5;
}

.yscroll330::-webkit-scrollbar-thumb, .yscroll440::-webkit-scrollbar-thumb, .yscroll285::-webkit-scrollbar-thumb, tagList::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #c3002f;
}

@media (min-width: 768px) {
    #myProfile .modal-dialog {
        width: 1100px;
        margin: 30px auto;
    }
}

@media (max-width: 767px) {
    #myProfile .modal-dialog {
        width: 100%;
        margin: 30px auto;
    }
}

/* CSS Animation for Success messages - 20/03/2024*/
@keyframes slideInUp {
    0% {
        transform: translateY(100%);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.animated.slideInUp {
    animation-name: slideInUp;
    animation-duration: 0.5s;
}

/*Delete popup design*/
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    border: 0;
    border-radius: 0.25em;
    background: initial;
    background-color: #7066e0;
    color: #fff;
    padding: 6px 14px !important;
    font-size: 13px !important;
}

.swal2-cancel.cancel-button-class,
.swal2-confirm.confirm-button-class {
    background-color: #fff !important;
    color: #000 !important;
    border-color: #000 !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}
/* Custom styles for both buttons */
.swal2-container .swal2-confirm,
.swal2-container .swal2-cancel {
    border: 0; /* Remove border */
    border-radius: 0.25em;
    background: initial;
    background-color: #7066e0;
    color: #fff;
    font-size: 1em;
    padding: 10px 20px;
}

/* Custom style for the confirm button */
.swal2-container .swal2-confirm {
    background-color: #C22032 !important;
}


.input-group-addon {
    border: 1px solid #ccc !important;
   /* border-left: 0px !important;*/
}
/*=========for select2=========*/
.text-field-container .select2-container {
    width: 100% !important;
}

#edit_item .select2-container {
    width: 100% !important;
}

.p-0 {
    padding: 0 !important;
}

.custom-scrollbar {
    height: 100%;
}


/*=====================login page=====================*/
.sect-login-signup {
    display: flex;
    width: 100%;
    height: 100vh;
    align-items: center;
}

.login_section {
    width: 40%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.sect-lft-loginsignup {
    width: 60%;
    height: 100%;
    background: #C22032;
    /* background: url('../../images/login-pattern.svg'), url('../../images/login-pattern.svg'), #C22032;
    background-size: 450px, 450px;
    background-repeat: no-repeat;
    background-position: right -100px top -200px, left -100px bottom -200px;*/
}

    .sect-lft-loginsignup .carousel-inner .item img {
        width: 100%;
        height: 100vh;
    }

.innersect_loginsignup {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

    .innersect_loginsignup .carousel {
        width: 100%;
    }

@media (max-width: 767px) {
    .sect-login-signup {
        flex-direction: column;
    }

    .sect-lft-loginsignup {
        width: 100%;
    }

    .login_section {
        width: 100%;
    }
}

/*=========send message though whatsapp to customers========*/
.icon-20 {
    width: 20px;
    height: 20px;
}

    .icon-20:hover {
        filter: grayscale(1);
        cursor: pointer;
    }

.badge2 {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    color: #000;
    text-align: left;
    white-space: normal;
    vertical-align: middle;
    background-color: #ebebeb;
    border-radius: 10px;
}

#sectWhatsapptoCustomer .modal-dialog {
    width: 450px;
}

.red_btn:hover {
    background-color: #b3012c;
}

#sectWhatsapptoCustomer .lbl_red {
    font-size: 12px;
}

.lbl_Designation_portal {
    background: #000;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_Designation_app {
    background: #4B0082;
    color: #fff;
    padding: 2px 2px;
    border-radius: 4px;
    font-size: 10px;
}

text-field-container {
}

@media (max-width: 768px) {
    .text-field-container {
        width: 100%;
        margin-bottom: 6px;
    }
}
/*==================start user management====================*/
.drp-right.dropdown-menu {
    left: auto !important;
    right: 0 !important;
}

.lblred {
    color: #C3002F;
}

.lblDesignationName {
    font-size: 15px;
    color: #C3002F;
    font-weight: 500;
    cursor: default;
}

.linkview {
    color: #C3002F;
    text-decoration: underline;
    cursor: pointer;
    font-weight: 500;
}

.sect_service-zone .task_header {
    grid-template-columns: 300px auto;
}

    .sect_service-zone .task_header .main {
        margin-top: 0;
        width: 100%;
    }

.form-inline .input-group .input-group-addon {
    width: 1%;
}

#AddServiceZone_mdl .modal-body {
    position: relative;
    padding: 5px 5px 0;
}

.tbl-zone-manager img {
    border: 1px solid #ddd;
    margin-right: 7px;
}

.sect-assignzonemgr {
    border: 1px solid #ddd;
    border-width: 2px;
    padding: 10px;
}

    .sect-assignzonemgr p {
        margin-bottom: 0;
    }

.sect-KYCDoc {
    border: 1px dotted #ddd;
    border-width: 2px;
    padding: 10px;
}

    .sect-KYCDoc p {
        margin-bottom: 0;
    }

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

#btnremovezonemgr {
    cursor: pointer;
}

    #btnremovezonemgr:hover {
        filter: grayscale(1);
    }

.gap-1 {
    gap: 0.25rem !important;
}

.gap-2 {
    gap: 0.5rem !important;
}

.sect_empprofile {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lbl_ELEmpid {
    background-color: #C22032;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_ELDesignation_black {
    background-color: #333333;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_ELDesignation_red {
    background-color: #C3002F;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_ELEmail {
    color: #524195;
}

.lbl_ELZone {
    color: #C3002F;
}

.lbl_Designation_portal {
    background-color: #353935;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.lbl_Designation_app {
    background-color: rgba(31, 0, 156, 0.6);
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.battery-life-red {
    background-image: url('../../images/battery-red-icon.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    width: 45px;
    height: 22px;
    font-size: 10px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    color: #C3002F;
    font-weight: 600;
    padding-right: 6px;
}

.battery-life-lightgreen {
    background-image: url('../../images/battery-light-green-icon.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    width: 45px;
    height: 22px;
    font-size: 10px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    color: #9CCC65;
    font-weight: 600;
    padding-right: 6px;
}

.lbl_gps_off {
    color: #C22032;
    text-transform: uppercase;
    font-weight: bold;
}

.lbl_gps_on {
    color: #9CCC65;
    text-transform: uppercase;
    font-weight: bold;
}

.BG-Status {
    display: flex;
    flex-direction: column;
    width: fit-content;
    align-items: center;
}

    .BG-Status p {
        margin-bottom: 0;
    }

.status_present {
    background-color: rgba(156, 204, 101, 0.21);
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: rgba(82, 154, 0, 1);
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
}

.status_absent {
    background-color: rgba(194, 32, 50, 0.42);
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: #C22032;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
}

.status_idle {
    background-color: lightgray;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: rgb(85, 85, 85);
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
}
.status_OnLeave {
    background-color: orange;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: white;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
}

.link_track {
    cursor: pointer;
}

    .link_track:hover {
        filter: opacity(0.6);
    }

.link_Date {
    cursor: pointer;
}

    .link_Date:hover {
        filter: opacity(0.6);
    }

.lbl_ELDesignation_zoneHead {
    background: #000;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}


.sect_service-zone .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}

.d_designations {
    display: flex;
    justify-content: space-between;
}

#tblServiceZone.table > tbody > tr > td {
    border-top: none;
    vertical-align: middle;
}

.edit-icon {
    cursor: pointer;
    display: flex;
    gap: 5px;
    color: #000;
    border: 1px solid #bbb;
    padding: 3px 8px;
}

    .edit-icon:hover {
        background: #efefef;
        color: #000;
        text-decoration: none;
    }

.yscroll170 {
    overflow-y: auto;
    max-height: 170px;
    overflow-x: hidden;
   /* padding-right: 10px;*/
}

    .yscroll170::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 10px;
        background-color: #F5F5F5;
    }

    .yscroll170::-webkit-scrollbar {
        width: 5px;
        background-color: #F5F5F5;
    }

    .yscroll170::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
        background-color: #c3002f;
    }

.prof_designation {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #eee;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    border: 2px solid #c3002f;
}

.lblblk_Time {
    background: #353935;
    color: #fff;
    padding: 3px 5px;
    border-radius: 4px;
    font-size: 10px;
    text-align: center;
}


.copy-icon {
    cursor: pointer;
    width: 20px;
    height: auto;
}

header .navbar-nav {
    display: flex;
    align-items: center;
}

.btnreload {
    border: none;
    background-color: unset;
}

    .btnreload span {
        font-weight: bold;
        color: #c3002f;
        text-decoration: underline;
    }

/*===========page header============*/
.main-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .main-header .navbar-brand {
        padding: 4px;
    }


/*User management Code start by dev team*/
.designation-name::before {
    content: "•";
    margin-right: 5px;
    color: black;
    font-weight: bold;
}
/* Style for even rows */
.even-designationrow {
    background-color: #f9f9f9;
}

/* Style for odd rows */
.odd-designationrow {
    background-color: #ffffff;
}

.btn-green {
    border-radius: 4px;
    background-color: #0d8c22;
    font-size: 14px;
    border: 1px solid #0d8c22;
    padding: 7px 12px;
    font-weight: 500;
    color: #ffffff;
    transition: 0.3s ease-in-out;
}

    .btn-green:hover {
        background-color: #0e7e21;
        border: 1px solid #0e7e21;
    }

.pl-2 {
    padding-left: 2px;
}

.BetaVersionBadge {
    position: absolute;
    border-radius: 4px;
    background-color: #c3002f;
    border: none;
    font-size: 10px;
    font-weight: 500;
    color: #fff;
    padding: 0px 4px;
    display: inline-block;
    width: fit-content;
    top: 6px;
}

.lbl_gray {
    color: #6a6a6a !important;
    font-size: 12px;
}



.page_header2 {
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 25px;
    justify-content: space-between;
}

    .page_header2 .main {
        margin-top: 0px;
    }

.col-40 {
    width: 40%;
}

.col-60 {
    width: 60%;
}

.col-80 {
    width: 80%;
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -14px;
    margin-left: -14px;
}

#sectEditKYCDoc .custom-file-label {
    position: absolute;
    max-width: 100% !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 1;
    padding: 0.375rem 0.75rem !important;
    padding: 6px !important;
}

.dropdown-menu-right {
    right: 0;
    left: auto;
    position: absolute;
    top: 100%;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}



/*=========================Fieldworker KPI==========================*/
.fwinput-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

    .fwinput-group .input-group-addon {
        border: 1px solid #ccc !important;
        padding: 0;
    }

.default_container {
    padding: 1.5rem 1.5rem;
}

.fwinput-group > .form-control:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.fwinput-group .form-control:focus {
    border-color: #c3002f;
    outline: 0;
    -webkit-box-shadow: unset;
    box-shadow: unset;
}



.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    vertical-align: middle;
}

.sect-nolist {
    text-align: center;
    margin: 10rem 0;
}

    .sect-nolist img {
        width: 55px;
    }

.IndivisualFWData {
    border: 2px solid #C3002F;
    border-radius: 5px;
    padding: 20px;
    /*height: 80vh;*/
}

.sect-noFWdata {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    color: #6C7A89;
    font-weight: 400;
    text-align: center;
    /*margin: 50px 0;*/
    height: calc(100vh - 185px);
}

.active-emp {
    background: rgba(195, 0, 47, 0.11);
}

.tbl-emplist tr {
    cursor: pointer;
}

.user-prof-cirle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.tbl_IndivisualFWData {
    width: 100%;
}

    .tbl_IndivisualFWData thead tr td {
        text-align: center;
        position: relative;
    }

    .tbl_IndivisualFWData tbody tr td {
        padding: 5px 0;
    }

        .tbl_IndivisualFWData tbody tr td table {
            width: 100%;
        }

    .tbl_IndivisualFWData h4 {
        font-weight: bold;
        color: #C3002F;
        margin-bottom: 0;
    }

    .tbl_IndivisualFWData tr td:first-child {
        /*    font-weight:bold;
*/
    }

    .tbl_IndivisualFWData tr td:last-child {
        /*    font-weight:bold;
*/ color: rgba(53, 57, 53, 0.6);
    }

.pb-5 {
    padding-bottom: 3rem !important;
}

.btn-dowloadfwdata {
    background: rgba(206, 13, 59, 0.21);
    padding: 10px;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    position: absolute;
    right: 0;
    cursor: pointer;
}

    .btn-dowloadfwdata:hover {
        filter: grayscale(1);
    }


.yesno_toggle_btn .toggle, .toggle {
    width: 100%;
    display: flex
}

    .yesno_toggle_btn .toggle .btn.active {
        color: #fff;
        background-color: #353935;
        border-color: #353935;
    }

    .yesno_toggle_btn .toggle #NoResponseTrigger.btn.active {
        color: #fff;
        background-color: #C22032;
        border-color: #C22032;
    }

    .yesno_toggle_btn .toggle #YesResponseTrigger.btn.active {
        color: #fff;
        background-color: #0d8c22;
        border-color: #0d8c22;
    }

    .yesno_toggle_btn .toggle #NoHappyTrigger.btn.active {
        color: #fff;
        background-color: #C22032;
        border-color: #C22032;
    }

    .yesno_toggle_btn .toggle #YesHappyTrigger.btn.active {
        color: #fff;
        background-color: #0d8c22;
        border-color: #0d8c22;
    }

    .yesno_toggle_btn .toggle #NoTaskPDFTrigger.btn.active {
        color: #fff;
        background-color: #C22032;
        border-color: #C22032;
    }

    .yesno_toggle_btn .toggle #YesTaskPDFTrigger.btn.active {
        color: #fff;
        background-color: #0d8c22;
        border-color: #0d8c22;
    }

.CF_yesno_toggle_btn .toggle, .toggle {
    width: 100%;
    display: flex
}

    .CF_yesno_toggle_btn .toggle .btn.active {
        color: #fff;
        background-color: #353935;
        border-color: #353935;
    }

/*input multiple tag*/
.tags-input-wrapper {
    background: transparent;
    padding: 10px;
    width: 100%;
    border-radius: 4px;
    border: solid 1px #5d5d5d;
    border-radius: 4px;
}

    .tags-input-wrapper input {
        border: none;
        background: transparent;
        outline: none;
        width: 140px;
        margin-left: 8px;
    }

    .tags-input-wrapper .tag {
        display: inline-block;
        background-color: transparent;
        color: #2E2E2E;
        border-radius: 3px;
        padding: 0 10px;
        margin: 3px;
        border: 1px solid #c3002f;
    }

        .tags-input-wrapper .tag a {
            margin: 5px 0px 5px 9px;
            display: inline-block;
            cursor: pointer;
            color: #c3002f;
        }


.has-focusMultiSelect {
    border-color: #c3002f !important;
    -webkit-box-shadow: 0px 0px 1px 1px #c3002f !important;
    box-shadow: 0px 0px 1px 1px #c3002f !important;
    border-radius: 4px !important;
    outline: 0 !important;
}

.text-field.has-focusMultiSelect label, .text-field.has-value label {
    top: -1px;
    left: 1em !important;
    padding: 0 4px;
    color: #c3002f;
    z-index: 99;
}

.tbl-default tr td {
    width: 1%;
    padding: 0 5px;
}

    .tbl-default tr td:first-child {
        white-space: nowrap;
    }

.task_details table tr td p {
    margin: 0;
}

/*===========Requested item page===========*/
.RIItems_details table tr td {
    vertical-align: middle;
    border-top: none;
    border-bottom: none;
}

.RIItems_details .table-striped tr td {
    cursor: pointer;
}

.sect_RIItemsDetails table {
    width: 100%;
}

    .sect_RIItemsDetails table tr td {
        vertical-align: middle;
        padding: 0 5px 5px;
    }

.SectRI_ItemDetails .SectRIFieldset fieldset {
    background: #f6f6f6;
}

.SectRI_ItemDetails .block fieldset legend {
    background: #c22032;
    color: #fff;
    border-radius: 3px;
}

#Request_details .modal-dialog {
    width: 900px;
}

.ritemfootbtns {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.lbl_black {
    color: #000 !important;
}


.address-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.address-item {
    margin: 0 10px;
}

    .address-item label {
        margin-right: 5px;
        font-size: 10px;
        font-weight: bold; 
    }

#taskstateQuickLink, #taskcityQuickLink, #taskpincodeQuickLink, #addtaskstateQuickLink, #addtaskcityQuickLink, #addtaskpincodeQuickLink, #SZstate, #SZcity, #SZpincode, #leadcityQuickLink, #leadpincodeQuickLink, #leadstateQuickLink, #EQcity, #EQpincode, #EQstate {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
}

#taskstateQuickLink, #taskcityQuickLink, #taskpincodeQuickLink {
    font-size: 12px;
    font-weight: 600;
}

/*#leadstateQuickLink, #leadcityQuickLink, #leadpincodeQuickLink {
    font-size: 10px;
}*/

/*#SZstate, #SZcity, #SZpincode, #EQpincode, #EQcity, #EQstate {
    font-size: 10px;
}*/

    .default-view-details .block {
        margin-bottom: 15px;
    }

    .default-view-details fieldset {
        border-radius: 2px;
        border: solid 1px #e7e7e7;
        padding: 10px;
    }

        .default-view-details fieldset legend {
            margin: 0 5px;
            padding: 0 5px;
            width: auto;
            border: none;
            font-size: 14px;
            font-weight: 500;
            color: #333;
        }

    .default-view-details table, th, td {
        padding: 0;
        vertical-align: top;
    }
    .default-view-details .block fieldset p span {
        color: #848484;
        text-wrap: wrap;
    }
    .default-view-details .block fieldset p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: 0.13px;
        color: #000;
        margin: 0;
    }

#ItemInventoryTableID tr{
    cursor:pointer;
}
#Request_detailsDirectSource.task-view-details .modal-lg {
    width: 1000px;
    max-width: 95%;
    margin: 30px auto;
}

/*--------------box separated tags start--------------*/
    .custom-tags > span {
        cursor: pointer;
        display: block;
        float: left;
        color: #000000;
        border-radius: 3px;
        padding: 5px;
        padding-right: 25px;
        margin: 4px;
        border: 1px solid #c3002f;
        position: relative;
    }

        .custom-tags > span:hover {
            opacity: 0.7;
        }
        .custom-tags > span:after {
            position: absolute;
            content: "×";
            padding: 2px 5px;
            margin-left: 3px;
            font-size: 15px;
            color: #c3002f;
            top: 4px;
        }

    .custom-tags > input {
        background: #eee;
        border: 0;
        margin: 4px;
        padding: 7px;
        width: auto;
    }
/*--------------box separated tags end--------------*/


.fieldset-btn-edit {
    position: absolute;
    right: 5px;
    top: -5px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    color: #000000;
}
.fieldset-btn-edit:hover {
    color: #c22032;
    cursor:pointer;
}



/*-----------------------start Leave Manangement-----------------------*/
.LeaveMgtTabs .nav-tabs > li {
    width: 33.33%;
    margin-bottom: 0;
}
.LeaveMgtTabs .nav-tabs > li a{
    color: #353935;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
}
.nav-tabs > li > a:hover {
    border-bottom: 4px solid #C3002F;
    background-color:transparent;
}
.LeaveMgtTabs .nav-tabs > li.active > a, .LeaveMgtTabs .nav-tabs > li.active > a:focus, .LeaveMgtTabs .nav-tabs > li.active > a:hover {
    border: 1px solid transparent;
    border-bottom: 4px solid #C3002F;
    background-color: #f2f2f2;
    color: #353935;
}
.roundedbox-lightskyblue {
    color: #077BBC;
    border-radius: 25px;
    padding: 5px;
    background: rgba(115, 202, 252, 0.48);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: 400;
    font-size: 14px;
}
.roundedbox-lightgreen {
    color: #529A00;
    border-radius: 25px;
    padding: 5px;
    background: rgba(164, 211, 110, 0.6);
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: 400;
    font-size: 14px;
}
.roundedbox-lightred {
    color: #c3002f;
    border-radius: 25px;
    padding: 5px;
    background: #fecdcd;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: 400;
    font-size: 14px;
}
.btn-accept {
    background-color: #67b909;
    border-radius: 25px;
    border: 1px solid #67b909;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}
    .btn-accept:hover {
        background-color: #5ea809;
        border: 1px solid #5ea809;
    }
        .btn-accept:hover span {
            background-color: #539308;
            border: 1px solid #539308;
        }
    .btn-accept span {
        width: 20px;
        height: 20px;
        background: #5d9916;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #5d9916;
    }
        .btn-accept span img {
            width: 15px;
            height: 15px;
        }

.btn-decline {
    background-color: #d94343;
    border-radius: 25px;
    border: 1px solid #d94343;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}
    .btn-decline:hover {
        background-color: #ca3d3d;
        border: 1px solid #ca3d3d;
    }
.btn-decline:hover span {
    background-color: #ad3838;
    border: 1px solid #ad3838;
}
    .btn-decline span {
        width: 20px;
        height: 20px;
        background: #bd3b3b;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #bd3b3b;
    }

        .btn-decline span img {
            width: 15px;
            height: 15px;
        }
.btn-requested {
    background-color: #E8C400;
    border-radius: 25px;
    border: 1px solid #E8C400;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}

    .btn-requested:hover {
        background-color: #d5b503;
        border: 1px solid #d5b503;
    }

        .btn-requested:hover span {
            background-color: #c9ab03;
            border: 1px solid #c9ab03;
        }

    .btn-requested span {
        width: 20px;
        height: 20px;
        background: #c9ab03;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #c9ab03;
    }

        .btn-requested span img {
            width: 15px;
            height: 15px;
        }
.LMStatus-Halfday {
    position: absolute;
    background-color: #353935;
    color: #ffffff;
    padding: 2px;
    font-size: 10px;
    writing-mode: vertical-rl;
    left: 0;
    top: 0;
    bottom: 0;
    text-wrap: wrap;
    text-align: center;
    transform: scale(-1);
    display: flex;
    align-items: center;
    justify-content: center;
}
.LMStatus-fullday {
    position: absolute;
    background-color: #5DAE00;
    color: #ffffff;
    padding: 2px;
    font-size: 10px;
    writing-mode: vertical-rl;
    left: 0;
    top: 0;
    bottom: 0;
    text-wrap: wrap;
    text-align: center;
    transform: scale(-1);
    display: flex;
    align-items: center;
    justify-content: center;
}
.LMStatus-SickLeave {
    position: absolute;
    background-color: #ffa500;
    color: #ffffff;
    padding: 2px;
    font-size: 10px;
    writing-mode: vertical-rl;
    left: 0;
    top: 0;
    bottom: 0;
    text-wrap: wrap;
    text-align: center;
    transform: scale(-1);
    display: flex;
    align-items: center;
    justify-content: center;
}
.LMStatus-CasualLeave {
    position: absolute;
    background-color: #3088e8;
    color: #ffffff;
    padding: 2px;
    font-size: 10px;
    writing-mode: vertical-rl;
    left: 0;
    top: 0;
    bottom: 0;
    text-wrap: wrap;
    text-align: center;
    transform: scale(-1);
    display: flex;
    align-items: center;
    justify-content: center;
    /*width: 34px;*/
}
.user-status-wrapper {
    position: relative;
}
.tbl-RequestedLeave tr {
    border: 1px solid #dddddd;
}
.tbl-RequestedLeave p{
    margin-bottom:0;
}
.tbl-RequestedLeave.table > tbody > tr > td {
    padding: 0;
    border-top: 4px solid #f5f5f5;
}
.tbl-RequestedLeave .sect_empprofile {
    margin-left: 1.5rem;
}
.p-3 {
    padding: 1rem !important;
}
.p-4 {
    padding: 1.5rem !important;
}
.emp-profile-head {
    text-align:center;
}
.emp-profile-head img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
}
    .emp-profile-head p {
        color:#aaaaaa;
    }
    .emp-profile-head h4 {
        margin-bottom:0;
    }
.tblUserLeaveDetails{
    width:100%;
}
.tblUserLeaveDetails tr td {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    width: 50%;
}
.tblUserLeaveDetails tr td span{
    color: #aaaaaa;
}
.tblUserLeaveDetails textarea {
    background: #efefef;
    border: solid 1px #bbbbbb;
    color: #aaaaaa;
    width: 100%;
    padding: 6px;
    border-radius: 4px;
    outline: 0;
    display: block;
}
.mdl-header-close {
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 1;
}
.btn-confirm {
    background-color: #67b909;
    border-radius: 25px;
    border: 1px solid #67b909;
    color: #ffffff;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 8px;
    width:100%;
    justify-content:center;
}

    .btn-confirm:hover {
        background-color: #5ea809;
        border: 1px solid #5ea809;
    }

        .btn-confirm:hover span {
            background-color: #539308;
            border: 1px solid #539308;
        }

    .btn-confirm span {
        width: 25px;
        height: 25px;
        background: #5d9916;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #5d9916;
    }

        .btn-confirm span img {
            width: 20px;
            height: 20px;
        }
#AcceptLeave_mdl .modal-dialog, #DeclineLeave_mdl .modal-dialog {
    width: 500px;
}

.btn-confirm-decline {
    background-color: #d94343;
    border-radius: 25px;
    border: 1px solid #d94343;
    color: #ffffff;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 8px;
    width:100%;
    justify-content:center;
}

    .btn-confirm-decline:hover {
        background-color: #ca3d3d;
        border: 1px solid #ca3d3d;
    }

        .btn-confirm-decline:hover span {
            background-color: #ad3838;
            border: 1px solid #ad3838;
        }

    .btn-confirm-decline span {
        width: 25px;
        height: 25px;
        background: #bd3b3b;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #bd3b3b;
    }

        .btn-confirm-decline span img {
            width: 20px;
            height: 20px;
        }
.monthyearpicker.form-control{
    width:120px;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    input [type=date].form-control, input[type=time].form-control, input[type=datetime-local].form-control, input[type=month].form-control {
        line-height: normal;
    }
}

.btn-pending {
    background-color: #E8C400;
    border-radius: 25px;
    border: 1px solid #E8C400;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}

    .btn-pending:hover {
        background-color: #d5b503;
        border: 1px solid #d5b503;
        color: white;
        text-decoration: none;
        cursor:default;
    }
.btn-declined {
    background-color: #c3002f;
    border-radius: 25px;
    border: 1px solid #c3002f;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}

    .btn-declined:hover {
        background-color: #c3002f;
        border: 1px solid #c3002f;
        color: white;
        text-decoration: none;
        cursor: default;
    }
.btn-approved {
    background-color: #529A00;
    border-radius: 25px;
    border: 1px solid #529A00;
    color: #ffffff;
    font-weight: 600;
    padding: 3px 6px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 100px;
    justify-content: center;
}

    .btn-approved:hover {
        background-color: #529A00;
        border: 1px solid #529A00;
        color: white;
        text-decoration: none;
        cursor: default;
    }
.modal-open #EditmdlApplyLeave.modal {
    overflow-y: hidden;
}
.modal-backdrop.fade.show {
    opacity: 0.5;
}
    /*-----------------------end Leave Manangement-----------------------*/

.pt-4 {
    padding-top: 1.5rem !important;
}
.pt-5 {
    padding-top: 3rem !important;
}

/*-------------------start Counter plus minus------------------------*/
.dft_counter {
    border: solid 1px #5d5d5d;
    border-radius: 4px;
    display: flex;
    align-items: center;
}
.dft_counter a {
    padding: 4px 8px;
    color: #333;
    font-size: 1rem;
}
.dft_counter a:hover {
    color: #C22032;
}
    .dft_counter input {
        width: 100%;
        padding: 6px;
        border-width: 0 1px;
        border-color: #b9b9b9;
        border-style: solid;
        outline: none;
    }
    .dft_counter input:focus {
        border-color: #b9b9b9;
    }
/*-------------------end Counter plus minus------------------------*/
.serviceCounter label, .EditserviceCounter label {
    position: absolute;
    top: -7px;
    left: 45px;
    background: #FFFFFF;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    color: #888888;
    padding: 0 5px;
    z-index: 1;
}

.attendance-chartBlock {
    width: 70%;
    padding: 12px;
    background: #FFFFFF;
    box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.05), 0px 4px 24px rgba(124, 124, 124, 0.1);
    border-radius: 5px;
}
.resolutionTime {
    color: #C3002F;
    font-weight: 600;
    font-size: 22px;
    margin-top: 5px;
}
.sect-average .title {
    text-align:left!important;
}
.sect-average .EarnedMoneyCount {
    color: #0cb763;
    font-weight: 600;
    font-size: 22px;
    margin-top: 5px;
}
.sect-average .rating-star {
    font-size: 2.5rem;
    padding: 0 0.3rem;
    margin-right: 1px;
    width: 18px;
    height: 18px;
}
.sect-average .half-star:after {
    left: 10px;
    text-indent: -1rem;
}
.sect-average .star_rating {
    gap: 0.3rem;
}
.sect-average .star_rating .count p{
    font-weight: 600;
    font-size: 22px;
    margin-left: 0;
}
.sect-average .rating-star.half-star {
    background: linear-gradient(to right, #c3002f 50%, #ccc 50%);
}

.my-profile-content fieldset {
    min-width: unset;
    padding: .35em .625em .75em;
    margin: 0 2px;
    border: 1px solid silver;
    border-radius: 4px;
}
.my-profile-content legend {
    display: unset;
    width: auto;
    padding: 0 5px;
    margin-bottom: unset;
    font-size: unset;
    line-height: inherit;
    color: #333;
    border: unset;
    border-bottom: unset;
    font-weight: 500;
}
.tblUserLeaveDetails p, .tblUserLeaveDetails hr {
    margin: 0;
}
.w-26{
    width:26%;
}
.AchartBlock {
    position: relative;
    width: fit-content;
    margin: 0 auto;
}

.lvmgt_status p span.used-count {
    font-weight: bold;
    font-size: 20px;
    color: #000000;
}
.lvmgt_status p span {
    color: #C22032;
}

.col-35 {
    width: 35%;
    padding: 0 15px;
}
.col-30 {
    width: 30%;
    padding: 0 15px;
}


/* start General styles for the weekend dropdown */
.dropdown-container {
    position: relative;
    width: 100%;
}

#WeekendTrigger {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 7px 12px;
    cursor: pointer;
    background-color: #fff;
    display: inline-block;
    width: 100%;
}

    #WeekendTrigger:hover {
        background-color: #f9f9f9;
    }

#WeekendOptions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: none;
    max-height: 200px;
    overflow-y: auto;
    padding: 10px;
}

    #WeekendOptions.show {
        display: block;
    }

.dropdown-option {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
    cursor: pointer;
}

    .dropdown-option input[type="checkbox"] {
        margin: 0 4px 0 0;
        cursor: pointer;
    }

#SelectedWeekend {
    display: none;
    margin-top: 10px;
    font-size: 14px;
    color: #555;
}
/* end General styles for the weekend dropdown */

.modal-header.bg-success {
    background-color: #28a745 !important;
}

.modal-header.bg-danger {
    background-color: #dc3545 !important;
}

.tbl_TaskClosure tr{
    position:relative;
}
.remove-field {
    position: absolute;
    right: 8px;
    top: 7px;
    cursor: pointer;
    z-index: 100;
}


.Typenumber-icon {
    content: "";
    background-image: url('../../images/number-icon.png');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100%;
}
.Typetext-icon {
    content: "";
    background-image: url('../../images/text-icon.png');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100%;
}
.Typedate-icon {
    content: "";
    background-image: url('../../images/date-icon.png');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100%;
}
.Typeboolean-icon {
    content: "";
    background-image: url('../../images/boolean-icon.png');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100%;
}
.Typedropdown-icon {
    content: "";
    background-image: url('../../images/dropdown.svg');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100%;
}
.Sect_ClosType .bootstrap-select .dropdown-menu li a span.text {
    display: flex;
    gap: 0.5rem;
}
.Sect_ClosType .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    display: flex;
    gap: 0.5rem;
}
.Sect_ClosType .bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
    color: #333;
}
.Sect_ClosType .dropdown-menu > .active > a, .Sect_ClosType .dropdown-menu > .active > a:focus, .Sect_ClosType .dropdown-menu > .active > a:hover {
    color: #333;
    background-color: #ededed;
}
.Sect_ClosType .bootstrap-select .dropdown-menu.show {
    top: 100% !important;
    transform: none !important;
}
.Sect_ClosType .select2-container .select2-selection__rendered span {
    display: flex;
    align-items: center;
}
.select2-results__options .select2-results__option span {
    display: flex;
    align-items: center;
    padding:5px;
}
.remove-field img {
    width: 20px;
    height: 20px;
}
.tbl_taskdetails tr td {
    width: 50% !important;
}

/*Customer Address card View*/
.card {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.1); /* Add a slight shadow for pop-up effect */
    margin-bottom: 20px; /* Add some space between card views */
}

.card-body {
    padding: 20px;
}

.card-title {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: bold;
}

.card-text {
    margin-bottom: 5px;
    font-size: 16px;
}

.card-separator {
    margin-top: 20px; /* Add space above the separator */
    border: none;
    height: 1px;
    background-color: #ddd; /* Change color of the separator */
}

.card-body {
    position: relative; /* Set position to relative */
}

.addressCard-top {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    padding-bottom: 1rem;
}

.address-tab {
    max-height: 300px; /* Set a max height for the address tab */
    overflow-y: auto; /* Add vertical scrollbar when needed */
}

.address-card-container p{
    margin-bottom:0;
}
.address-card-container .card {
    margin-bottom: 0;
    height: 100%;
}
.address-card-container .card-body {
    padding: 10px;
}
.address-card-container .btn.btn-red, .address-card-container .btn.btn-black2 {
    padding: 2px 7px;
}
.card-separator {
    margin-top: 20px; /* Add margin between cards */
}

/* Adjust styles for the "Add more" button */
#addMoreButton {
    margin-top: 10px; /* Add some space between the button and cards */
}


.sectRequsetedItems .page_header {
    -ms-grid-columns: 320px auto;
    grid-template-columns: 320px auto;
}
.RejectedPhotos .image-section img, .OnHoldPhotos .image-section img {
    border-radius: 5px;
    width: 100px;
    height: 100px;
    object-fit: cover;
}
/*=============popup close icon==============*/
.close img {
    width: 30px;
    height: 30px;
}
.close {
    opacity:1;
}
.close:focus, .close:hover {
    opacity: .8;
}
.modal-header {
    padding: 10px;
}
/*=============popup close icon==============*/
.amc-dashboard_section .page_header {
    -ms-grid-columns: 350px auto;
    grid-template-columns: 350px auto;
}

.sectEmplist {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}



/*--------custom rounded switch--------*/
.toggle-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.switch-circle {
    position: relative;
    display: inline-block;
    width: 55px;
    height: 26px;
    margin-bottom: 0;
}

    .switch-circle input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider-circle {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.4s;
    border-radius: 34px;
}

    .slider-circle:before {
        position: absolute;
        content: "";
        height: 22px;
        width: 22px;
        left: 3px;
        top: 2px;
        background-color: white;
        transition: 0.4s;
        border-radius: 50%;
    }

input:checked + .slider-circle {
    background-color: #4caf50;
}

    input:checked + .slider-circle:before {
        transform: translateX(27px);
    }

.switch-label {
    font-weight: bold;
    font-size: 16px;
    min-width: 30px;
}
/*--------custom rounded switch--------*/

.tagList {
    overflow-y: auto;
    max-height: 330px;
    overflow-x: hidden;
    padding: 1rem 0.5rem;
}

.serviceZoneTbl {
    max-height: 350px;
    overflow-y: auto;
}
.whiteSpaceNoWrap {
    white-space: nowrap;
}
.itemRequestDetailsScroll{
    height:65vh;
    overflow-y:auto;
}

.addresss-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 10px;
}

.input-groupp {
    display: flex;
    align-items: center;
    border: 1px solid #5d5d5d;
    border-radius: 6px;
    padding:0 10px;
    background-color: #fff;
}

    .input-groupp i {
        margin-right: 8px;
        color: rgba(0, 0, 0, 0.6);
        
    }

    .input-groupp input {
        border: none;
        outline: none;
        font-size: 14px;
        width: 100%;
        background: transparent;
    }
.profile-info-outer textarea {
    height: auto !important;
}
textarea {
    height: 100px !important;
}

/*.suggestion-box {
    display: none;
    max-height: 150px;
    overflow-y: auto;
    background-color: #ffffff;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    z-index: 999;
}*/
.suggestion-box {
    position: absolute;
    z-index: 9999;
    background-color: #fff;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    width: 100%; 
    border-radius: 6px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    display: none;
}


    .suggestion-box div {
        padding: 2px 1px;
        cursor: pointer;
        transition: background-color 0.2s ease-in-out;
    }

        .suggestion-box div:last-child {
            border-bottom: none;
        }

        .suggestion-box div:hover {
            background-color: #c2203221;
        }

    .suggestion-box::-webkit-scrollbar {
        width: 6px;
    }

    .suggestion-box::-webkit-scrollbar-track {
        background: #f9f9f9;
        border-radius: 10px;
    }

    .suggestion-box::-webkit-scrollbar-thumb {
        background-color: #C22032;
        border-radius: 10px;
    }

        .suggestion-box::-webkit-scrollbar-thumb:hover {
            background-color: #C22032;
        }

.suggestion-box {
    position: absolute;
    z-index: 9999;
}
.bg-red {
    background-color: #c3002f;
}
.text-white{
    color:#FFFFFF;
}

.subscription .modal-header .close {
    margin-top: -28px !important;
}
.overflowHeight{
    height:60vh;
    overflow-y:auto;
}


/* Download btn img task image*/
.download-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: rgb(195, 0, 47);
    color: white;
    font-size: 10px;
    padding: 2px 6px;
    cursor: pointer;
    border: none;
    border-radius: 4px;
}

.magnify-download-btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
    color: white;
    padding: 6px 10px;
    font-size: 16px;
    cursor: pointer;
    background-color: #c3002f;
    border: none;
}


.serviceDetails th, td {
    padding: 0 10px;
    vertical-align: top;
}

.navbar-brand > img.premium-logo {
    width: 140px !important;
}
.multiselect-container .multiselect-item.multiselect-all a{
    background:#FFFFFF !important;
    border-left:1px solid #ccc !important;
    border-right:1px solid #ccc !important;
}
.selectbtn .btn-group{
                  display:flex;
              }
.selectbtn .multiselect {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #5d5d5d;
    background:transparent !important;
}
.selectbtn .multiselect-container {
   /* display: flex;
    flex-direction: column;*/
    text-align: left;
    height: 80px;
    overflow-y: scroll;
    width:100%;
}
    .selectbtn .multiselect-container .active {
        justify-content: flex-start;
        width: 100%;
    }
    .textfieldMargin {
    margin: .75em .5em .25em 3.5px;
}
.selectbtn .dropdown-menu > .active > a {
    width:100%;
    background:transparent;
    color:#000;
}
.selectbtn .multiselect-container .multiselect-item.multiselect-all a {
    
    border-left: 0 !important;
    border-right:0 !important;
}
.selectbtn .btn-group.open .dropdown-toggle {
    -webkit-box-shadow: none !important; 
    box-shadow: none !important;
}
.selectbtn .multiselect-selected-text {
    max-width: 150px !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
}

.textfieldborder {
    border: 2px solid #c3002f !important;
    border-radius: 6px;
}
.ptitle {
    color: #000000;
    font-size: 14px;
    font-family: inherit;
    font-weight: bold;
    margin: auto;
}
.tasktitle {
    color: #333;
    font-weight: 500;
    font-size:12px;
}

.bbottom {
    border-bottom: 1px solid #ccc;
}

.wellDistance {
    padding: 12px !important;
}

.gap5 {
    gap: 5px;
}
.gap10{
    gap:10px;
}
.well {
    background-color: #ffffff !important;
    box-shadow: 0 -2px 4px 0 rgba(212, 212, 212, 0.5) !important;
}

.page-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background: #f9f9ff;
}


.containerOTP {
    width: 100%;
    max-width: 400px;
}

    .containerOTP .card {
        background: #fff;
        border-radius: 20px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        padding: 30px 20px;
        margin:10px;
        position: relative;
        text-align: center;
    }

    .containerOTP .back-btn {
        position: absolute;
        top: 15px;
        left: 20px;
        background: none;
        border: none;
        font-size: 20px;
        cursor: pointer;
    }

    .containerOTP .illustration img {
        width: 70px;
        margin-bottom: 20px;
    }

.containerOTP h2 {
    font-size: 22px;
    margin-bottom: 10px;
    color: #333;
}

    .containerOTP .description {
        font-size: 14px;
        color: #666;
        margin-bottom: 20px;
    }

.containerOTP label {
    display: block;
    font-size: 14px;
    margin-bottom: 8px;
    color: #444;
    text-align: left;
}

.containerOTP input[type="tel"] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 16px;
    margin-bottom: 20px;
}

.input-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

    .input-wrapper label {
        font-size: 14px;
        color: #444;
        margin-bottom: 8px;
        text-align: center;
    }

    .input-wrapper input[type="tel"] {
       /* width: 80%;*/ /* Adjust width as needed */
        padding: 12px;
        border: 1px solid #ccc;
        border-radius: 10px;
        font-size: 16px;
        text-align: center;
    }

.containerOTP .otp-inputs {
    display: flex;
    justify-content: space-evenly;
    margin: 20px;
}
    .containerOTP .otp-inputs input {
        width: 50px;
        height: 50px;
        font-size: 24px;
        text-align: center;
        border: none;
        border-bottom: 2px solid #ccc;
        outline: none;
        background: transparent;
        transition: border-color 0.2s;
    }
        .containerOTP .otp-inputs input:focus {
            border-bottom: 2px solid #c3002f;
        }

.containerOTP .resend-text {
    font-size: 13px;
    color: #888;
    margin-bottom: 20px;
}

.containerOTP .resend-link {
    color: #e74c3c;
    font-weight: 600;
    text-decoration: none;
}

@media (max-width: 360px) {
    .containerOTP .otp-inputs {
        gap: 5px;
    }

        .containerOTP .otp-inputs input {
            width: 40px;
            height: 45px;
            font-size: 20px;
        }
}
.autoScroll {
    height: 55vh;
    overflow-y: auto; /* Hide scrollbar by default */
}

   

.autoCrmScroll {
    height: 65vh;
    overflow-y: auto;
}

.CursorPointer{
    cursor:pointer;
}

.task-card {
    width: 250px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    background: white;
    font-family: Arial, sans-serif;
    position: relative;
    margin-top: 10px;
    width:100%;
}

.status-inactive {
    position: absolute;
    top: 0;
    left: 0;
    background: #d3d6db;
    color: #666;
    font-size: 11px;
    padding: 4px 16px;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
    font-weight: bold;
    text-transform: uppercase;
}
.status-ongoing {
    position: absolute;
    top: 0;
    left: 0;
    background: #ff9b00;
    color: #FFFFFF;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
}
.status-completed {
    position: absolute;
    top: 0;
    left: 0;
    background: #03de73;
    color: #333;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
}

.status-rejected {
    position: absolute;
    top: 0;
    left: 0;
    background: #c3002f;
    color: #FFFFFF;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
}
.status-onhold {
    position: absolute;
    top: 0;
    left: 0;
    background: #353935;
    color: #FFFFFF;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
}
.status-redbadge {
    position: absolute;
    top: 0;
    right: 0;
    background: #c3002f;
    color: #FFFFFF;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 0;
    border-bottom-left-radius: 15px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 2px;
}
.status-blackbadge {
    position: absolute;
    top: 0;
    left: 0;
    background: #333;
    color: #FFFFFF;
    font-size: 11px;
    padding: 3px 8px;
    font-weight: bold;
    text-transform: uppercase;
    width: fit-content;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 20px;
}
.task-title {
    font-size: 14px;
    font-weight: 600;
    margin-top: 25px;
    margin-bottom: 4px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

.task-code {
    color: #c3002f;
    font-size: 12px;
    text-decoration: none;
    font-weight: 600;
}

.task-meta {
    font-size: 12px;
    color: #555;
   
}

.task-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .task-footer .name {
        font-size: 13px;
        font-weight: 500;
        color: #333;
    }

.edit-icon {
    color: #c3002f;
    font-size: 16px;
    cursor: pointer;
}
.well {
    padding: 18px !important;
}

.btn-link-grey {
    border-radius: 2px;
    background-color:transparent;
    border: 1px solid #ccc;
    font-size: 14px;
    font-weight: 500;
    color: #000;
    padding: 12px 16px;
}
.marginDflex{
    margin:15px;
}
.paddingBtn {
    padding: 6px 16px !important;
}

.loginhelp-sect img {
    width: 100px;
    height: auto;
    vertical-align: middle; /* add this line */
}

.loginhelp-sect .d-flex a {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .loginhelp-sect .d-flex a img.call-audio-icon {
        width: 100px;
        height: 46px;
        margin-bottom: 2px;
    }
 .logo img{
     width:70px;
     height:100%;
     object-fit:contain;
 }
.img15{
    width:15px;
    height:15px;
}

.accordion-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    width: 100%;
}

    .accordion-toggle .fa {
        transition: transform 0.3s ease;
    }

.collapsed .fa {
    transform: rotate(-90deg); /* Point right when collapsed */
}

.panel-heading {
    padding: 0;
}

.panel-title a {
    display: flex;
    padding: 15px;
    text-decoration: none;
}


.dropdown-tag-container {
    border: 1px solid #ccc;
    padding: 5px;
    min-height: 38px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.dropdown-tag {
    background: #C22032;
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
    display: flex;
    align-items: center;
}

    .dropdown-tag span {
        margin-left: 8px;
        cursor: pointer;
    }

    .dropdown-tag input {
        border: none;
        outline: none;
        flex: 1;
    }
.searchBlock {
    width: 265px !important;
}
.page-flex{
    display:flex;
    gap:1rem;
    align-items:center;
}
.w240 {
    width: 235px !important;
}
@media (max-width: 768px) {
    #map_canvas {
        height: 40vh !important;
    }
}
.text-muted
 {
    font-size:12px !important;
}

.designationTitleList .text-field.text-field--outlined.has-focus {
    border-color: #000000;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    outline: 0;
}
    .designationTitleList .text-field.text-field--outlined.has-focus input.order {
        border-color: #c3002f;
        box-shadow: none!important;
        border-radius: 4px;
        outline: 0;
    }

.detailscroll {
    height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
}
.col-22{
    width:22%;
}
.col-65 {
    width: 65%;
}

/*=====================Asset mgt======================*/

.count-badgeLightBlue {
    border-radius: 50%;
    background-color: #a4d2f4;
    color: #086bb4;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badgeLightGreen {
    border-radius: 50%;
    background-color: rgba(164, 211, 110, 0.6);
    color: #529A00;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badgeLightMegento {
    border-radius: 50%;
    background-color: rgba(75, 0, 130, 0.3);
    color: #4B0082;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badgeLightGray {
    border-radius: 50%;
    background-color: lightgray;
    color: black;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.count-badgeLightRed {
    border-radius: 50%;
    background-color: #ffb6b6;
    color: #7a1919;
    font-weight: bold;
    font-size: 14px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}


.status_badgeRed {
    background-color: rgba(194, 32, 50, 0.42);
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: #C22032;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    max-width: 120px;
}

.status_badgeMegento {
    background-color: rgba(75, 0, 130, 0.3);
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: #4B0082;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    max-width: 120px;
}

.status_badgeGray {
    background-color: lightgray;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: #555555;
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    max-width: 120px;
}

.status_badgeGreen {
    background-color: rgba(156, 204, 101, 0.21);
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    color: rgba(82, 154, 0, 1);
    font-weight: 600;
    padding: 5px 10px;
    text-align: center;
    max-width: 120px;
}

.smBox_black {
    background-color: #333333;
    color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
}

.tooltip.top .tooltip-arrow {
    bottom: 1px;
}

/*code by Nikita */
.cursor-pointer {
    cursor: pointer;
}

.modal-header-downloadqr {
    padding: 8px 15px;
    border-bottom: none !important;
}

.notesTextarea .form-control {
    border: 0 !important;
    -webkit-box-shadow: none !important;
}

.widthMapicon {
    width: 40px !important;
}
/*.whiteBlock{
    border:1px solid #ccc;
    padding:10px;
    border-radius:4px;
}*/

.whiteBlock {
    position: relative; /* Establishes positioning context */
    padding-top: 1rem; /* Adjust based on your spacing needs */
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px;
}

    /* Style and position the date badge */
    .whiteBlock .date-badge {
        position: absolute;
        top: 0;
        right: 0px;
        background-color: red;
        color: white;
        padding: 0.25rem 0.8rem;
        font-size: 0.9rem;
        border-radius: 0.25rem;
    }
.modelBlock{
    min-height:400px;
    overflow-y:auto;
}


#EditEmployee_mdl .bootstrap-select .dropdown-menu {
    max-height: 120px !important;
}
#EditEmployee_mdl .bootstrap-select .dropdown-menu.show{
    left:0;
    right:0;
}
#EditEmployee_mdl .bootstrap-select .dropdown-menu.inner {
    margin-bottom: auto;
    min-width: 100%;
}
#EditEmployee_mdl .inner.open {
    max-height: 100%;
    min-height: auto;
}

/* Common grid layout for before & after photo sections */
#fieldPhotoBefore,
#fieldPhotoAfter {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 12px;
    justify-items: center;
    align-items: center;
}
#fieldPhotoBefore1,
#fieldPhotoAfter1 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    justify-items: center;
    align-items: center;
}

    /* Each photo wrapper */
    #fieldPhotoBefore > div,
    #fieldPhotoAfter > div {
        position: relative;
    }

    /* Image style */
    #fieldPhotoBefore img,
    #fieldPhotoAfter img {
        width: 100px;
        height: 100px;
        object-fit: cover;
        border-radius: 8px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    }
/* Each photo wrapper */
#fieldPhotoBefore1 > div,
#fieldPhotoAfter1 > div {
    position: relative;
}

/* Image style */
#fieldPhotoBefore1 img,
#fieldPhotoAfter1 img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

#OnHoldPhotos {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    justify-items: center;
    align-items: center;
    width: 100%;
}

    #OnHoldPhotos .photo-item {
        position: relative;
        width: 90px;
        height: 90px;
    }

    #OnHoldPhotos img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 6px;
        border: 1px solid #ccc;
        cursor: pointer;
    }

.download-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgb(195, 0, 47);
    border: none;
    border-radius: 3px;
    cursor: pointer;
    padding: 2px 4px;
}

    .download-btn i {
        color: white;
        font-size: 14px;
    }