@import url(../fonts/stylesheet.css);
@import url(../fonts/stylesheet.css);
@import url(../notoFonts/stylesheet.css);

.date_red input, .send_invoice_report .custom_range input:focus {
    border: 1px solid #d7d7d7 !important
}

#peopleWeb li a, #receivedWeb li a, #reportsWeb li a {
    text-transform: unset;
    padding-left: 8px;
    padding-bottom: 2px
}

.navInv .container .nav2 ul li.tooltip:hover .tooltiptext, .tooltips6:hover .tooltiptext, .tooltips:hover .tooltiptext {
    visibility: visible;
    opacity: 1
}

:root {
    --primary-theme-color: #f76600;
    --primary-text-color: #00234B;

    --primary-border-color: #E3E7EB;
    --secondary-border-color: #E6E6E6;

    --list-heading-color: #8C98A3;
    --primary-main-heading: #2A2E34;
    --primary-sub-heading: #4F5A63;

    --secondary-theme-color: #19874D;
    --secondary-theme-color-hover: #076534;
    --secondary-btn-color: #C8FFE2;

}

/* input[type=text] {
    color: var(--primary-text-color);
    padding-left: 5px;
} */

html {
    overflow: hidden;
}

body {
    padding-top: env(safe-area-inset-top);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
}

input[type=checkbox] {
    accent-color: var(--primary-theme-color);
    width: 15px !important;
    height: 15px !important
}

.date_red, .date_red input {
    float: left;
    height: 28px;
    margin: 0
}

* {
    font-family: Inter;
    /* background: #FCF8F3; */
}



.date_red input.text_error {
    background: 0 0 !important;
    border: 1px solid #818181
}

.date_red {
    background: url(../images/newDropDown.png) right center no-repeat #fff !important;
    color: #000;
    font-size: 12px;
    line-height: 17px;
    padding: 0 !important;
    width: 111px !important
}

.date_red span.errormsg {
    margin: 6px -36px 0 0 !important
}

.date_red input {
    width: 108px !important;
    background: 0 0;
    display: inline;
    line-height: 17px !important;
    padding-top: 0 !important;
    cursor: pointer
}

.custom_drag input.text_error {
    background: url(../images/calender.png) right center no-repeat !important
}

.custom_range input, .custom_range input.text_error {
    background: url(../images/newDropDown.png) right center no-repeat #fff !important
}

.allocate_client.no_bor ul.options, .content_right #pgHelp .head_row, .custom_range, .import_sec ul.options, .select_box_date, .sucess .options, .total_row ul.options {
    background: 0 0 !important
}

.custom_delete {
    margin: 10px
}

.custom_range_delete {
    margin: 12px 26px
}

a.button, a.button:link, a.button:visited, button {
    padding: 0;
    margin: 0;
    border: none;
    cursor: pointer;
    text-decoration: none;
    outline: 0;
    white-space: nowrap;
    overflow: visible
}

@media all {
    *, fieldset, img {
        padding: 0;
        margin: 0
    }

    #ui-datepicker-div{
        display: none;
    }

    /* #header p, #header p span {
        font-size: 11px;
        line-height: 15px
    } */

    #header *, #menu ul li {
        box-sizing: border-box
    }

    #menu ul li, #menu ul li a {
        line-height: 35px;
        font-weight: 400
    }

    .heading h2, .newHeading h2 {
        color: var(--primary-text-color);
        font-size: 24px;
        font-style: normal;
    }

    .error_mid_box .inner_message_box .error_msg, .heading h2, .newHeading h2, .sucess_mid_box .inner_message_box .success_msg {
        font-kerning: none;
        font-feature-settings: 'ss04'on, 'cv04'on, 'ss01'on, 'cv03'on, 'cv02'on, 'cv10'on, 'ss03'on, 'cv05'on, 'calt'off
    }

    #addInventory #popup_container .content.addHeight_inventry, .dhtmlwindow, .scroller {
        max-height: 500px
    }

    *, a, a:focus, button:focus, html.safari a.button:focus, html.safari span.button button:focus, span.button, span.button button {
        outline: 0
    }


    .clear, span.clear {
        clear: both
    }

    #pop_up_container .left, #pop_up_container_new .alertmeassage ul.button li a span small, #popup_container .proceed_row p span, .left, .menu_sec, .proceed_row_inner .button012 {
        float: left
    }

    #pop_up_container .content_area .content_row1 h3 img, #pop_up_container .right, #pop_up_container_new .content_row1 h3 img, .right {
        float: right
    }

    #pop_up_container .right_shadow, #sucess_sec, .account_grid_container, .curves, .inner_container, fieldset, form {
        width: 100%;
        float: left
    }

    fieldset, form, input, label, selectbox, textarea {
        font-size: 13px;
        color: #000
    }

    textarea {
        resize: none
    }

    a {
        cursor: pointer
    }

    html>body #layout {
        margin: 0 auto;
        width: 992px;
        min-height: 554px
    }

    html .fa {
        font-family: FontAwesome !important
    }

    #header {
        /* width: 100%;
        float: left;
        position: relative; */
    }

    .add_forms {
        min-height: 149px;
        margin-top: 30px;
        width: 100%
    }

    .add_forms .search_row1, .txtar {
        border: none !important
    }

    #header .header_top_section {
        float: left;
        width: 100%;
        z-index: 99998
    }

    #header .logo {
        float: right;
        width: 230px;
        padding: 10px;
        display: inline;
        color: #fff;
        left: 0;
        background: #474747
    }

    #menu .sub, #menu .sub:hover {
        background: url(../../images/arrow.gif) right center no-repeat
    }

    #header .logo strong, #popup_container .tabs li {
        float: left;
        width: auto
    }

    #header .helps {
        float: right;
        margin-top: -15px;
        margin-right: 100px
    }

    #header .helps a {
        text-decoration: none;
        color: #fff
    }

    #header .helps ul li {
        list-style-type: none;
        float: left;
        margin-left: 10px
    }

    /* #header p {
        float: left;
        width: auto;
        color: var(--primary-text-color);
        padding: 3px 0 0
    } */

    #header p span {
        width: auto;
        color: #ff8c00
    }

    #menu li ul, #menu li ul.last_tab {
        width: 290px;
        padding: 0;
        margin: 0;
        position: absolute
    }

    #menu * html ul li {
        float: left;
        height: 1%
    }

    #menu * html ul li a {
        height: 1%
    }

    #menu {
        width: auto;
        float: left;
        margin-top: 10px
    }



    #menu li ul {
        top: 45px;
        left: -10%;
        display: none;
        background-color: #fff;
        border: 1px solid #d6d6d6;
        -moz-box-shadow: -2px 1px 3px var(--secondary-border-color);
        -webkit-box-shadow: -2px 1px 3px var(--secondary-border-color);
        box-shadow: -2px 1px 3px var(--secondary-border-color)
    }

    .scroller {
        overflow: auto
    }

    #menu li ul.last_tab {
        top: 35px;
        display: none;
        left: -198px;
        background: #fff;
        border: 1px solid #c3c3c3;
        border-top: 0
    }

    #menu .drop ul {
        margin: 0;
        padding: 0;
        z-index: 1110
    }

    .menu_drop_top_arrow, .menu_drop_top_arrow2 {
        width: 17px;
        height: 10px;
        background: url(../images/nav_top_img.png) no-repeat;
        position: absolute;
        left: 50%;
        top: -10px
    }

    #body_container_inner.client_login, #menu ul li, #menu>ul>li>a:hover, .heading, .sucess_mid_box .inner_message_box, .theme_color {
        position: relative
    }

    #menu .drop li {
        width: 100%;
        display: block;
        list-style: none;
        margin: 0;
        background: 0;
        height: auto !important;
        border-bottom: 1px solid #e2e2e2;
        padding-top: 5px;
        padding-bottom: 5px
    }

    #menu .drop li a {
        color: #3c3c3c !important;
        text-align: left;
        font-size: 13px !important;
        width: auto !important;
        height: auto !important;
        text-transform: none;
        font-weight: 400 !important;
        line-height: 18px !important;
        background: 0 0;
        display: block
    }

    #menu .drop li a:hover, #menu .drop li a:hover i {
        color: #f68337 !important
    }

    #menu .drop li a.add {
        float: right;
        padding-right: 8px;
        padding-left: 14px;
        background: url(../images/plus_sign.png) -1px -9px no-repeat;
        color: #929292 !important
    }

    #menu .drop li a.add.active {
        color: #f68337 !important;
        text-decoration: underline;
        background: url(../images/plus_sign.png) -1px 15px no-repeat
    }

    #menu .drop li #menu .drop li a:hover {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #ec6b16 !important
    }

    #menu .drop li img {
        padding-right: 5px;
        float: left;
        height: 14px;
        width: 14px
    }

    #menu .drop li span.link {
        padding: 0;
        background: 0;
        height: auto !important;
        width: auto
    }

    #menu .drop li span.link i.fa {
        font-size: 17px;
        color: #3c3c3c;
        margin-right: 10px
    }

    #menu .drop li span.link strong {
        font-size: 14px;
        text-decoration: none;
        background: 0;
        padding: 0 0 0 20px;
        width: 230px
    }

    #menu .drop li span.link strong.active, #menu .drop li span.link strong.active i {
        color: #ec6b16
    }

    #menu .drop li span.link small {
        float: right;
        padding: 0 0 0 21px;
        font-size: 11px;
        background: url(../images/plus_sign.png) 0 -12px no-repeat;
        height: auto !important;
        color: gray
    }

    #menu .drop li span.link small.active {
        color: #f68337;
        background: url(../images/plus_sign.png) 0 1px no-repeat;
        text-decoration: underline
    }

    #menu li li.last {
        color: #fff;
        padding: 3px 0 2px;
        height: auto !important;
        text-align: left;
        border-bottom: 0
    }

    #content_section_tab_data1 a.btn span, #pop_up_container_new .content_area .alertmeassage ul.btn li a span {
        background: url(../images/button.gif) right -75px no-repeat;
        line-height: 31px;
        padding: 1px 15px 0 5px !important
    }

    #menu .sub {
        display: block
    }

    #menu ul {
        float: left;
        list-style: none;
        margin: 0;
        padding: 0
    }

    #menu ul li {
        float: left;
        width: auto;
        height: 35px;
        font-size: 12px;
        color: #fff;
        z-index: 20;
        padding: 0;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box
    }

    #menu>ul>li {
        margin-right: 22px
    }

    #menu>ul>li>a>span>i {
        font-size: 19px;
        display: inline;
        padding-right: 5px;
        line-height: 30px
    }

    #menu ul li a {
        float: left;
        width: auto;
        height: 35px;
        font-size: 13px;
        color: #fff;
        text-decoration: none;
        display: block;
        cursor: pointer;
        text-shadow: none
    }

    #menu ul li a.active, #pop_up_container_new .alertmeassage ul.button li a:hover, .dyn_var a:hover, .error_mid_box .inner_message_box p a:hover, .error_norecord .error .error_mid_box .inner_message_box p a:hover, .error_signup .error .error_mid_box .inner_message_box p a:hover, .message_mid_box .inner_message_box1 .credit_note_pay a:hover, .message_mid_box .inner_message_box1 p a:hover, .note_msg a:hover, .note_msg01 a:hover, .notification_msg_new .inner_note ul li a:hover, .sucess_mid_box .inner_message_box p a:hover, .sucess_outer .sucess_mid_box .inner_message_box p a:hover, .sucess_small_mid_box .inner_message_box p a:hover {
        text-decoration: none
    }

    #menu>ul>li>a>span {
        font-size: 13px;
        text-transform: uppercase
    }

    #menu>ul>li>a {
        background: url(../images/setting_downArrow.png) right center no-repeat rgba(0, 0, 0, 0) !important;
        padding-right: 15px
    }

    #menu>ul>li>a:hover {
        top: 1px
    }

    #menu ul li a span.bill.active {
        color: #f68236
    }

    #menu ul li a span.account_statement, #menu ul li a span.estimate, #menu ul li a span.invoice, #menu ul li a span.order_preview {
        float: left;
        width: auto;
        height: 35px;
        padding: 0 0 0 41px
    }

    #menu ul li.dashboard {
        float: left;
        height: 35px;
        margin: 0 30px 0 18px;
        width: 30px !important
    }

    #menu ul li.dashboard a {
        width: auto;
        display: block;
        color: #fff;
        background: 0 0 !important;
        font-size: 30px
    }

    .theme_color {
        float: left;
        width: 160px;
        padding-left: 275px;
        z-index: 99;
        display: none
    }

    #divComment, #footer, #home_error, #popup_container .tabs .descriptions, #popup_container .tabs .descriptions .row_tab, #popup_container .tabs .descriptions .row_tab form, .client_currency, .error_mid_box, .mceEditor, .message_mid_box, .message_mid_box .inner_message_box1 .credit_note_pay, .theme_color ul, table.project_list {
        float: left;
        width: 100%
    }

    .theme_color ul li {
        display: inline;
        float: left;
        margin: 0 7px 0 0;
        width: 19px
    }

    .theme_color ul li a {
        background: url(../images/color_theme_icons.gif) no-repeat;
        float: left;
        height: 19px;
        text-decoration: none;
        width: 19px
    }

    #body_container.createInvoice {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        padding: 0;
        min-height: 700px;
    }

    #body_container_inner.ci_bodyContainer, #invoice_container_outer.ci_bodyContainer {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: end;
        max-width: 1360px;
        width: 100%
    }



    .heading {
        max-width: 100%
    }

    .table_div {
        display: flex;
        flex-direction: column;
        gap: 15px
    }

    .cFooter, .main_loader_sec {
        justify-content: center;
        display: flex
    }

    .txtar:focus {
        border: none
    }

    .newHeading h2 {
        font-weight: 600;
        line-height: normal
    }

    .ci_heading .gnerateFrom {
        margin: 0 20px;
        padding: 0;
        float: none
    }

    #pop_up_container #content_section_inner .tab, #pop_up_container_new .content_area .form_row.big_row, .error_pad, .heading_alt {
        width: 100%
    }

    .heading h2 {
        float: left;
        width: auto;
        padding: 20px 0 2px;
        line-height: 35px;
        margin-bottom: 10px;
        font-weight: 500;
        line-height: normal
    }

    .heading h3 {
        float: left;
        width: auto;
        color: #000;
        padding: 14px 0 2px 5px;
        font-size: 22px;
        line-height: 26px
    }

    .heading>img {
        float: right;
        padding: 10px 0
    }

    #content_container {
        float: left;
        background-color: #fff
    }

    #content_container_inner {
        float: left;
        width: 980px;
        background-color: #fff;
        margin-top: 19px
    }

    #content_container_error {
        width: 100%;
        background-color: #fff;
        margin: 0 auto
    }

    #left_container {
        float: left;
        width: 556px;
        padding: 20px 0 0 16px
    }

    #right_container {
        float: right;
        width: 348px;
        padding: 4px 15px 0 0
    }

    .main_container_inner {
        float: left;
        width: 980px;
        padding: 15px 0
    }

    .blk_box1 {
        background: #fcfcfc;
        border: 1px solid #bbb;
        float: left;
        margin-top: 15px;
        padding-bottom: 15px;
        width: 472px
    }

    .grey_box_gradient {
        background: #ececec;
        float: left;
        height: 41px;
        padding-left: 15px;
        width: 457px
    }

    span.button button, span.button input {
        padding-top: 0;
        line-height: 2
    }

    .main_success_container {
        margin: 0 auto;
        width: 100% !important
    }

    .sucess {
        float: left;
        width: 98%;
        font-size: 3px;
        margin: 12px 0;
        border: 1px solid #6da919;
        background: #5fc15c
    }

    .mar_lef {
        padding: 12px 0 12px 12px
    }

    .sucess_mid_box {
        float: left;
        width: 100%;
        padding: 5px;
        box-sizing: border-box
    }

    .sucess_mid_box .inner_message_box {
        float: left;
        width: 100%;
        background: url(../images/banner_success.svg) no-repeat;
        margin: 8px 0 6px;
        display: inline;
        padding: 0 0 2px 42px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box
    }

    .sucess_mid_box .inner_message_box .success_msg {
        font-weight: 400;
        color: var(--2, #05164d);
        font-size: 16px;
        font-style: normal;
        line-height: normal
    }

    .sucess_mid_box .inner_message_box p {
        float: left;
        width: auto;
        padding: 5px 0 0;
        color: var(--font-2-WS, #525f7f);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 140%
    }

    .error_mid_box .inner_message_box p.bottom_space, .message_mid_box .inner_message_box1 p.bottom_space, .sucess_mid_box .inner_message_box p.bottom_space, .sucess_outer .sucess_mid_box .inner_message_box p.bottom_space, .sucess_small_mid_box .inner_message_box p.bottom_space {
        padding: 8px 0 0
    }

    .error_norecord .error .error_mid_box .inner_message_box p a, .error_signup .error .error_mid_box .inner_message_box p a, .message_mid_box .inner_message_box1 p a, .sucess_mid_box .inner_message_box p a, .sucess_outer .sucess_mid_box .inner_message_box p a, .sucess_small_mid_box .inner_message_box p a {
        color: #1a7b1a;
        font-weight: 400;
        text-decoration: underline
    }

    .message_mid_box .inner_message_box1 ul.options, .notification_msg_new .inner_note ul.options, .sucess_mid_box .inner_message_box ul.options, .sucess_outer .sucess_mid_box .inner_message_box ul.options, .sucess_small_mid_box .inner_message_box ul.options {
        float: left;
        width: auto;
        list-style: none;
        padding: 0 0 0 10px
    }

    .message_mid_box .inner_message_box1 ul.options li, .sucess_mid_box .inner_message_box ul.options li, .sucess_outer .sucess_mid_box .inner_message_box ul.options li, .sucess_small_mid_box .inner_message_box ul.options li {
        float: left;
        width: auto;
        padding-right: 10px
    }

    .sucess_mid_box .inner_message_box ul.options li a {
        background: url(../images/time-tracking/button_bg.jpg) repeat-x;
        border: 1px solid #b6b6b8;
        color: #fff;
        float: left;
        font-size: 12px;
        font-weight: 400;
        height: 23px;
        line-height: 14px;
        padding: 0;
        text-decoration: none;
        width: auto !important
    }

    .sucess_mid_box .inner_message_box ul.options li a span {
        cursor: pointer;
        float: left;
        padding: 0 10px !important;
        width: auto !important
    }

    .sucess_mid_box .inner_message_box ul.options li a span small.send {
        float: left;
        font-size: 12px;
        line-height: 22px;
        width: auto;
        color: #515151
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.ok:hover, .sucess_mid_box .inner_message_box ul.options li a:hover, .template1_lower_tab ul.options li a:hover {
        background-position: 0 bottom
    }

    .secess_outer1 {
        margin: 0 auto;
        width: 640px
    }

    .sucess_outer2 {
        margin: 0 auto;
        width: 712px
    }

    .sucess_small {
        float: left;
        width: 100%;
        font-size: 3px;
        padding: 20px 0 0
    }

    .sucess_small_top_curve {
        float: left;
        width: 100%;
        /* background: url(../images/sucessfull_top_bg.gif) repeat-x */
    }

    .sucess_small_top_curve .sucess_top_left {
        float: left;
        width: 5px;
        height: 5px;
        background: url(../images/sucessfull_cor.gif) no-repeat;
        font-size: 1px;
        line-height: 5px
    }

    .sucess_small_top_curve .sucess_top_right {
        float: right;
        width: 5px;
        height: 5px;
        background: url(../images/sucessfull_cor.gif) right 0 no-repeat;
        font-size: 1px;
        line-height: 5px
    }

    .sucess_small_bot_curve {
        float: left;
        width: 100%;
        /* background: url(../images/sucessfull_bot_bg.gif) repeat-x */
    }

    .sucess_small_bot_curve .sucess_bot_left {
        float: left;
        width: 5px;
        height: 5px;
        background: url(../images/sucessfull_cor.gif) 0 bottom no-repeat;
        font-size: 1px;
        line-height: 5px
    }

    .sucess_small_bot_curve .sucess_bot_right {
        float: right;
        width: 5px;
        height: 5px;
        background: url(../images/sucessfull_cor.gif) right bottom no-repeat;
        font-size: 1px;
        line-height: 5px
    }

    .sucess_small_mid_box {
        float: left;
        width: 99.8%;
        border-left: 1px solid #a6e7a6;
        border-right: 1px solid #a6e7a6;
        background: #efe
    }

    .sucess_small_mid_box .inner_message_box {
        float: left;
        width: 88%;
        background: url(../images/event_icons.gif) 0 -45px no-repeat;
        margin: 1px 0 0 10px;
        display: inline;
        padding: 0 0 7px 63px;
        position: relative
    }

    .error_norecord .error .error_mid_box .inner_message_box .cancel_btn, .error_signup .error .error_mid_box .inner_message_box .cancel_btn, .sucess_small_mid_box .inner_message_box .cancel_btn {
        position: absolute;
        top: -2px;
        right: 0;
        width: 24px;
        text-decoration: none;
        height: 23px;
        float: right;
        background: url(../images/event_icons.png) 0 -170px no-repeat
    }

    .sucess_small_mid_box .inner_message_box .success_msg {
        float: left;
        width: 88%;
        font-size: 12px;
        color: #1a7b1a;
        line-height: 18px;
        font-weight: 400;
        padding-top: 4px
    }

    .sucess_outer .sucess_mid_box .inner_message_box p, .sucess_small_mid_box .inner_message_box p {
        float: left;
        width: auto;
        color: #515151;
        font-size: 12px;
        line-height: 18px;
        padding: 4px 0 0
    }

    .cFooter span, .error_mid_box .inner_message_box p, .message_mid_box .inner_message_box1 p {
        line-height: 140%;
        font-size: 12px;
        font-weight: 400;
        font-style: normal
    }

    .sucess_small_mid_box .inner_message_box ul.options li a {
        float: left;
        width: auto;
        background: url(../images/button.gif) 0 -137px no-repeat;
        height: 25px;
        font-size: 12px;
        line-height: 13px;
        color: #000;
        text-decoration: none;
        cursor: pointer
    }

    .sucess_small_mid_box .inner_message_box ul.options li a span {
        float: left;
        background: url(../images/button.gif) right -162px no-repeat;
        height: 25px;
        padding: 0 6px 0 4px
    }

    .sucess_mid_box .inner_message_box1 ul.options li a span small.send, .sucess_outer .sucess_mid_box .inner_message_box ul.options li a span small.send, .sucess_small_mid_box .inner_message_box ul.options li a span small.send {
        float: left;
        width: auto;
        background: url(../images/all_icons.gif) 0 -70px no-repeat;
        font-size: 12px;
        line-height: 13px;
        color: #000;
        padding: 5px 0 5px 23px
    }

    .message {
        float: left;
        width: 100%;
        border: .5px solid #b0cded;
        border-radius: 5px;
        background: #eff6ff
    }

    .message_mid_box .inner_message_box1 {
        float: left;
        width: 100%;
        margin: 0;
        display: inline;
        padding: 7px;
        position: relative;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box
    }

    .message_mid_box .inner_message_box1 a.cancel {
        background: url(../images/banner_info_cross.svg) -1px 3px no-repeat;
        float: right;
        height: 23px;
        position: absolute;
        right: 0;
        text-decoration: none;
        top: -1px;
        width: 24px
    }

    .message_mid_box .inner_message_box1 .success_msg {
        float: left;
        width: 825px;
        font-size: 12px;
        color: #c75f19;
        line-height: 18px;
        font-weight: 400;
        padding-top: 4px
    }

    .message_mid_box .inner_message_box1 .credit_note_pay a {
        color: #ed4e00;
        text-decoration: underline
    }

    .message_mid_box .inner_message_box1 p {
        float: left;
        width: 95%;
        margin: 5px 0;
        padding: 8px 0 3px 35px;
        background: url(../images/time-tracking/banner_info.svg) 2px 6px no-repeat;
        color: var(--font-2-WS, #525f7f)
    }

    .message_mid_box .inner_message_box1 ul.options li a, .sucess_outer .sucess_mid_box .inner_message_box ul.options li a {
        float: left;
        width: auto;
        background: url(../images/button_left_curve.gif) no-repeat;
        height: 25px;
        font-size: 12px;
        line-height: 13px;
        color: #000;
        text-decoration: none;
        cursor: pointer
    }

    .notification_msg_new .inner_note ul.options li a span, .sucess_mid_box .inner_message_box1 ul.options li a span, .sucess_outer .sucess_mid_box .inner_message_box ul.options li a span {
        float: left;
        background: url(../images/button_right_curve.gif) right 0 no-repeat;
        height: 25px;
        padding: 0 6px 0 4px
    }

    .sucess_outer {
        float: left;
        width: 890px
    }

    .sucess_outer .sucess {
        background: #c1e765;
        border: 1px solid #6da919;
        float: left;
        font-size: 3px;
        margin: 12px 0;
        width: 906px
    }

    .sucess_outer .sucess_mid_box .inner_message_box {
        background: url(../images/event_icons.png) 0 -48px no-repeat;
        display: inline;
        float: left;
        margin: 14px 0 6px 15px;
        padding: 0 0 12px 35px;
        position: relative;
        width: 856px
    }

    .sucess_mid_box .inner_message_box .cancel_btn {
        position: absolute;
        top: -2px;
        right: 0;
        width: 24px;
        text-decoration: none;
        float: right;
        background: url(../images/banner_success_close.svg) no-repeat;
        min-height: 24px
    }

    .login_error_wdth .error {
        width: 690px;
        margin-left: 6px
    }

    .login_error_wdth .error_mid_box .inner_message_box {
        width: 99.5%
    }

    .plan_error_none .error {
        background: 0 0 !important;
        border: none
    }

    .plan_error_none .error_mid_box .inner_message_box .cancel_btn {
        background-image: none;
        font-size: 16px
    }

    .plan_error_none .error_mid_box .inner_message_box .error_msg {
        font-size: 16px;
        line-height: 20px
    }

    .error_container {
        margin: 0;
        width: 100%;
        float: left
    }

    .error {
        float: left;
        width: 100%;
        border-radius: 5px;
        border: .5px solid #ffd3d3;
        background: #fff2f2
    }

    .error_mid_box .inner_message_box {
        display: inline;
        float: left;
        margin: 8px 0 11px;
        padding: 0 0 0 5px;
        position: relative;
        width: 100%
    }

    .error_container .error_mid_box .inner_message_box {
        background: 0 0 !important;
        padding: 0 0 0 42px !important
    }

    .error_container .error_mid_box .inner_message_box .cancel_btn {
        background: url(../images/banner_fail_cross.svg) no-repeat
    }

    .error_mid_box .inner_message_box.product {
        float: left;
        width: 98.4%;
        background: url(../images/banner_fail.svg) no-repeat;
        padding: 0 0 2px 42px !important;
        position: relative
    }

    .error_mid_box .inner_message_box.product small {
        float: left;
        height: 25px;
        width: 30px
    }

    .error_mid_box .inner_message_box .cancel_btn {
        background: url(../images/banner_fail_cross.svg) no-repeat;
        float: right;
        height: 23px;
        position: absolute;
        right: 4px;
        text-decoration: none;
        top: 0;
        width: 24px
    }

    .error_mid_box .inner_message_box .right_msg {
        float: left;
        width: 775px
    }

    .error_mid_box .inner_message_box .error_msg {
        color: var(--2, #05164d);
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal
    }

    .error_mid_box .inner_message_box p {
        color: var(--font-2-WS, #525f7f);
        padding-top: 2px
    }

    .error_mid_box .inner_message_box p a, .notification_msg_new .inner_note ul li a {
        color: #f43838;
        font-weight: 400;
        text-decoration: underline
    }

    #footer ul li a, #footer ul li a:hover, .deleted_users a, .no_record_found a, .no_record_found a:hover, .paging a {
        text-decoration: none
    }

    .error_mid_box .inner_message_box ul, .error_norecord .error .error_mid_box .inner_message_box ul, .error_signup .error .error_mid_box .inner_message_box ul {
        float: left;
        width: 94%;
        margin: 0;
        padding: 0 0 0 2%
    }

    .error_mid_box .inner_message_box ul li, .error_norecord .error .error_mid_box .inner_message_box ul li, .error_signup .error .error_mid_box .inner_message_box ul li {
        float: left;
        font-size: 11px;
        list-style: disc;
        width: 100%;
        color: #515151;
        line-height: 18px;
        margin: 0
    }

    .error_invite {
        width: 100%
    }

    .error_invite .error {
        width: 100%;
        margin-top: 15px
    }

    .error_invite .error_mid_box {
        width: 100%;
        float: left
    }

    .error_signup {
        float: left;
        width: 640px;
        font-size: 3px;
        padding: 0 0 0 18px
    }

    .error_norecord .error, .error_signup .error {
        float: left;
        width: 640px;
        font-size: 3px;
        padding-top: 19px
    }

    .error_norecord .error .error_top_curve, .error_signup .error .error_top_curve {
        float: left;
        width: 100%;
        background: url(../images/error_top_bg.gif) repeat-x
    }

    .error_norecord .error .error_top_curve .error_top_left, .error_signup .error .error_top_curve .error_top_left {
        float: left;
        width: 5px;
        height: 5px;
        background: url(../images/error_cor.gif) no-repeat
    }

    .error_norecord .error .error_top_curve .error_top_right, .error_signup .error .error_top_curve .error_top_right {
        float: right;
        width: 5px;
        height: 5px;
        background: url(../images/error_cor.gif) right 0 no-repeat
    }

    .error_norecord .error .error_bot_curve, .error_signup .error .error_bot_curve {
        float: left;
        width: 100%;
        background: url(../images/error_bot_bg.gif) repeat-x
    }

    .error_norecord .error .error_bot_curve .error_bot_left, .error_signup .error .error_bot_curve .error_bot_left {
        float: left;
        width: 5px;
        height: 5px;
        background: url(../images/error_cor.gif) 0 bottom no-repeat
    }

    .error_norecord .error .error_bot_curve .error_bot_right, .error_signup .error .error_bot_curve .error_bot_right {
        float: right;
        width: 5px;
        height: 5px;
        background: url(../images/error_cor.gif) right bottom no-repeat
    }

    .error_norecord .error .error_mid_box, .error_signup .error .error_mid_box {
        float: left;
        width: 638px;
        border-left: 1px solid #ff8282;
        border-right: 1px solid #ff8282;
        background: #ffdada
    }

    .error_signup .error .error_mid_box .inner_message_box {
        float: left;
        width: 565px;
        background: url(../images/error_icon.gif) no-repeat;
        margin: 1px 0 0 10px;
        display: inline;
        padding: 0 0 7px 63px;
        position: relative
    }

    .error_norecord .error .error_mid_box .inner_message_box .error_msg, .error_signup .error .error_mid_box .inner_message_box .error_msg {
        float: left;
        width: 565px;
        font-size: 11px;
        color: #c60000;
        line-height: 18px;
        font-weight: 400;
        padding-top: 4px
    }

    .error_norecord .error .error_mid_box .inner_message_box p, .error_signup .error .error_mid_box .inner_message_box p {
        float: left;
        width: 565px;
        color: #515151;
        font-size: 11px;
        line-height: 18px
    }

    .error_norecord {
        float: left;
        width: 640px;
        font-size: 3px;
        padding: 0
    }

    .error_norecord .error .error_mid_box .inner_message_box {
        float: left;
        width: 565px;
        background: url(../images/alert_icons.gif) no-repeat;
        margin: 1px 0 0 10px;
        display: inline;
        padding: 0 0 7px 63px;
        position: relative
    }

    #outer_footer {
        float: left;
        width: 99.9%;
        padding: 0;
        margin-top: 80px;
    }

    .fixed-footer {
        position: fixed !important;
        bottom: 0 !important
    }

    #outer_footer.no_bg {
        background: 0;
        border: 0;
        margin: 0
    }

    .cFooter {
        align-items: center;
        width: 99.9%;
        float: unset;
        height: 70px;
        border: 1px solid #e2e8f0;
        background: #f8fafc
    }

    .cFooter1 {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 1360px;
        padding: 0 15px
    }

    .cFooter img {
        width: 135px;
        height: 23px
    }

    .cFooter span {
        width: fit-content;
        padding: 0;
        float: none;
        color: #525f7f
    }

    input.hidden_field, input.hidden_field_bold {
        line-height: 15px;
        float: left;
        text-align: right;
        background: 0;
        cursor: default;
        font-size: 11px
    }

    .center {
        float: left;
        width: 100%;
        list-style: none;
        padding-left: 0;
        background: #e3e3e3;
        min-height: 52px
    }

    #footer ul {
        list-style: none
    }

    #footer ul.increase li {
        width: 18%
    }

    #footer ul li {
        float: none;
        display: inline-block
    }

    #footer ul li a {
        display: block;
        width: auto;
        font-size: 15px;
        line-height: 28px;
        color: #3c3c3c;
        cursor: pointer;
        padding: 0 10px
    }

    #footer ul li a.small {
        width: auto;
        padding: 19px 25px 0 56px;
        height: 46px
    }

    #footer ul li a i {
        font-size: 29px;
        float: left;
        padding-right: 10px
    }

    #footer ul li a:hover {
        color: #da5c00 !important
    }

    #footer span {
        float: left;
        width: 100%;
        font-size: 12px;
        text-align: center;
        padding: 20px 0 0;
        color: #3c3c3c
    }

    .snippet {
        float: left;
        width: 909px;
        font-size: 3px;
        padding: 19px 0 0
    }

    .snippet_pad {
        padding: 0 0 15px
    }

    input.hidden_field {
        border: none !important
    }

    .total_row .total label.price input[type=text]:focus {
        border: 0 solid #878a8b !important;
        -webkit-box-shadow: 0 0 0 #007eff;
        -moz-box-shadow: 0 0 0 #007eff;
        -khtml-box-shadow: 0 0 0 #007eff;
        box-shadow: 0 0 0 #a4a6a7;
        outline: 0;
        border-radius: 0;
        -khtml-border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0
    }

    input.hidden_field_bold {
        border: none !important;
        font-weight: 400;
        width: 130px
    }

    input.hidden_field_net_balance {
        float: left;
        text-align: right;
        width: 152px;
        border: none !important;
        background: 0;
        font-size: 20px;
        cursor: default
    }

    input.text_error, select.text_error, textarea.text_error {
        border: 1px solid red !important;
        background: #fef0ed !important
    }

    .discount_error {
        background: red !important
    }

    .discount_error input {
        color: #fff !important
    }

    .paging {
        float: right;
        width: auto;
        padding-right: 10px;
        padding-top: 8px
    }

    .paging label {
        float: left;
        width: auto !important;
        padding: 0 8px !important;
        color: #000;
        font-size: 13px !important;
        line-height: 24px !important
    }

    label.error, span.errormsg {
        background: url(../images/invoice_page_bg.gif) -123px -232px no-repeat;
        padding: 0 0 0 10px !important
    }

    .paging img {
        float: left;
        /* margin: 2px 0 0 */
    }

    .paging a {
        float: none;
        margin: 3px 0 0
    }

    .paging .select_bg {
        float: left;
        width: 47px;
        border: 0;
        background: url(../images/invoice_page_bg.gif) 0 -406px no-repeat;
        height: 22px
    }

    .paging .newListSelected {
        color: #000;
        float: left;
        height: 19px;
        padding: 2px 0 0;
        width: 100%
    }

    .paging .newListSelected .selectedTxt {
        color: #000;
        float: left;
        font-size: 11px;
        height: 19px;
        overflow: hidden;
        padding: 0 0 0 8px;
        text-align: left;
        width: 88%
    }

    .paging .newListSelected ul.newList li {
        border: none !important;
        float: left;
        font-size: 11px;
        padding: 0 0 0 16%;
        width: 84% !important
    }

    .no_record_found span {
        color: #667382 !important
    }

    .no_record_found {
        width: 100%;
        font-weight: 400;
        font-size: 13px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 25px;
        text-align: center;
        box-sizing: border-box;
        margin-top: 30px
    }

    .no_record_found h1 {
        color: var(--Secondary-Blue, var(--primary-text-color));
        font-size: 20px;
        font-style: normal;
        font-weight: 500;
        line-height: normal
    }

    .no_record_found a {
        font-weight: 400;
        font-size: 12px;
        color: var(--primary-theme-color)
    }

    .no_record_found a:hover {
        color: #dc7800;
        text-align: center
    }

    .deleted_users a, .deleted_users a:hover {
        color: #c75f19;
        font-size: 11px
    }

    #pop_up_container_new .content_row1 a.close:hover, .deleted_users a:hover, .po_ref ul li a.filename:hover {
        text-decoration: underline
    }

    #pop_up_container .selectbox_bg.pad_none, #pop_up_container_new .alertmeassage ul.button li.last, #tooltip div, #tooltip h3, .no_record_found.pad_bot {
        margin: 0
    }

    #tooltip {
        position: absolute;
        z-index: 111111;
        width: auto;
        border: 1px solid #dc7800;
        background-color: #fff;
        padding: 5px
    }

    .deleted_users {
        float: left;
        width: auto;
        padding: 2px 0 0
    }

    .blockUI.blockMsg.blockPage {
        background: 0 0 !important;
        width: auto !important
    }

    .main_loader_sec {
        background: 0 0 !important;
        align-items: center
    }

    .loader_block {
        width: 100px;
        height: 100px;
        background: 0 0 !important;
        display: flex;
        justify-content: center;
        align-items: center
    }

    .loader_block .loader_block_inner {
        background: url(../images/loading.gif?rand=1) center center/contain no-repeat;
        width: 110px;
        height: 110px
    }

    .loader_block .loader_text {
        text-align: center;
        text-transform: uppercase
    }

    label.error {
        float: left;
        width: auto;
        font-size: 11px;
        color: red !important;
        font-weight: 400;
        line-height: 15px;
        margin: 4px 0 10px 5px;
        display: inline
    }

    div.group_tax_msg, span.errormsg {
        float: left;
        color: red;
        font-weight: 90%;
        line-height: 15px;
        display: inline
    }

    span.errormsg {
        width: auto;
        margin: 6px 0 0 5px !important
    }

    #client_gst_treatment {
        color: #428bca;
        font-size: 13px;
        line-height: 27px
    }

    div.group_tax_msg {
        width: 97%;
        margin: 6px 0 0;
        padding: 5px 0 5px 3% !important;
        background: url(../images/remove_file.png) 10px 7px no-repeat, #fef0ed
    }

    span.errormsg_1, span.sign_up_errormsg {
        float: left;
        width: auto;
        padding: 0 0 0 10px !important;
        font-weight: 90%
    }

    span.errormsg3, span.errormsg_1, span.errormsg_2, span.sign_up_errormsg {
        background: url(../images/invoice_page_bg.gif) -123px -232px no-repeat;
        color: red;
        line-height: 15px;
        display: inline;
        font-size: 11px
    }

    span.sign_up_errormsg {
        margin: 6px 0 0 5px
    }

    #pop_up_container_new .content_row1 h3, span.errormsg3, span.errormsg_2 {
        padding: 0 0 0 10px;
        float: left;
        width: auto
    }

    span.errormsg_2 {
        font-weight: 90%;
        margin: 4px 0 10px 155px
    }

    span.errormsg3 {
        font-weight: 95%
    }

    span.errormsg3.pad {
        margin-left: 92px
    }

    .payment_gateway_error {
        float: left;
        width: 962px;
        padding-bottom: 13px;
        padding-top: 15px
    }

    .payment_gateway_error p {
        font-size: 11px;
        width: 962px;
        text-align: center;
        color: #000;
        line-height: 18px
    }

    .payment_gateway_error p a {
        font-size: 11px;
        color: #c9590f;
        line-height: 18px;
        text-decoration: underline
    }

    .payment_gateway_error p a:hover {
        font-size: 11px;
        color: #c9590f;
        line-height: 18px;
        text-decoration: none
    }

    #pop_up_container_new {
        height: 275%;
        width: 620px;
        float: left;
        margin: 0;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        background: #fff;
        box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .06)
    }

    /* .alertmeassage .popup_cancel, .alertmeassage a {
        height: 37px;
        width: 101px;
        border-radius: 5px;
        text-align: center;
        cursor: pointer
    } */

    #pop_up_container_new .content_row1 {
        padding: 0;
        float: left;
        width: 100%;
        height: 40px;
        background: #ebebeb;
        border-radius: 5px 5px 0 0;
        display: none !important
    }

    #pop_up_container_new .content_row1 h3 {
        margin: 0;
        text-transform: uppercase;
        color: #525252
    }

    #content_section_tab_data1 a.btn, #pop_up_container_new .content_area .alertmeassage ul.btn li a {
        background: url(../images/button.gif) 0 -106px no-repeat;
        padding-left: 8px;
        height: 31px;
        text-decoration: none
    }

    #pop_up_container_new .content_area_outer {
        width: 100%;
        background: #fff;
        border-radius: 0 0 5px 5px;
        float: left
    }

    #pop_up_container_new .content_area_outer.mail_popup {
        text-align: left;
        overflow: auto;
        background: #fff;
        height: 400px;
        padding: 10px;
        width: 100%;
        float: left;
        box-sizing: border-box
    }

    #pop_up_container_new .content_area_outer.invoiceMailOuterContent {
        padding: 15px
    }

    #pop_up_container_new .content_area_outer.mail_popup p {
        text-align: left;
        width: 98%;
        font-weight: 400;
        padding: 0;
        font-size: 12px
    }

    #pop_up_container_new .content_row1 a.close {
        float: right;
        padding: 9px 39px 0 0;
        color: #000;
        text-decoration: none;
        font-size: 12px
    }

    #pop_up_container_new .content_area {
        background: 0;
        float: left;
        margin: 0 2%;
        width: 96%
    }

    #pop_up_container_new div.notes {
        float: left;
        font-size: 12px;
        width: auto
    }

    #pop_up_container_new div.notes span.note {
        width: 100%;
        font-size: 12px
    }

    #pop_up_container_new .content_area .alertmeassage {
        width: 100%;
        display: flex;
        flex-direction: column;
        padding: 25px;
        box-sizing: border-box
    }

    .alertmeassage h1 {
        color: var(--primary-text-color);
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        margin-top: 15px
    }

    /* .alertmeassage .popup_cancel, .alertmeassage a, .alertmeassage label {
        font-size: 14px;
        font-style: normal;
        font-weight: 400
    } */

    .alertmeassage label {
        color: #667382;
        font-feature-settings: 'clig'off, 'liga'off;
        line-height: 140%;
        margin-top: 15px;
        margin-bottom: 15px
    }

    .alertmeassage ul.button {
        display: flex;
        justify-content: end;
        margin-top: 60px
    }

    .alertmeassage ul.sendMail {
        margin-top: 0 !important
    }

    .alertmeassage ul a {
        text-decoration: none;
        display: block;
        background: var(--primary-theme-color);
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        height: 37px;
        width: 101px;
        border-radius: 5px;
        text-align: center;
        cursor: pointer;
    }

    .alertmeassage .popup_cancel {
        text-decoration: none;
        display: block;
        color: var(--primary-theme-color);
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid var(--primary-theme-color);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        height: 37px;
        width: 101px;
        border-radius: 5px;
        text-align: center;
        cursor: pointer;
    }

    .alertmeassage .formButtons {
        margin-top: 30px;
        /* text-decoration: none;
        display: block;
        background: var(--primary-theme-color);
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center */
    }


    /* #thanks_container .success_container_main1 a:hover, .alertmeassage a:hover {
        background-color: #fd8530
    } */

    /* .alertmeassage .popup_cancel:hover {
        background-color: #ffddc6
    } */

    .invoiceMailContent {
        padding: 18p x 0
    }

    .invoiceMailContent a {
        cursor: pointer;
        text-decoration: underline;
        height: unset;
        width: unset;
        background: unset;
        color: unset;
        border-radius: unset;
        text-align: unset;
        font-size: unset;
        font-style: normal;
        font-weight: unset;
        display: unset
    }

    .alertmeassage .popup_cancel {
        text-decoration: none;
        display: block;
        color: var(--primary-theme-color);
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid var(--primary-theme-color)
    }

    .alertmeassage .button {
        display: flex;
        gap: 20px
    }

    #pop_up_container_new .content_area .alertmeassage>span {
        background: url(../images/time-tracking/warning.svg) no-repeat;
        color: #525252;
        float: left;
        font-size: 15px;
        line-height: 19px;
        margin: 10px 0 5px;
        padding: 10px 0 10px 65px;
        width: 84%
    }

    #pop_up_container_new .popup_icon_warning {
        height: 43px;
        width: 43px;
        background: url(../images/time-tracking/warning.svg) no-repeat
    }

    #pop_up_container_new .popup_icon_success {
        height: 43px;
        width: 43px;
        background: url(../images/time-tracking/success_popup.svg) no-repeat
    }

    #pop_up_container_new .content_area .alertmeassage span.success {
        background: url(../images/event_icons.png) 0 -48px no-repeat;
        color: #525252;
        float: left;
        font-size: 15px;
        line-height: 19px;
        margin: 10px 0 5px;
        padding: 3px 0 22px 35px;
        width: 84%;
        font-weight: 500
    }

    #pop_up_container_new .content_area .alertmeassage .help_span {
        background: url(../images/help_icon01.png) no-repeat;
        color: #525252;
        float: left;
        font-size: 15px;
        line-height: 19px;
        margin: 10px 0 5px;
        padding: 0 0 22px 65px;
        width: 84%
    }

    #pop_up_container_new .alertmeassage ul.button {
        width: auto;
        list-style: none;
        padding: 0 0 0 68px
    }

    #pop_up_container_new .alertmeassage ul.button li {
        margin-right: 10px;
        border: 0;
        float: left;
        margin-bottom: 10px
    }

    #pop_up_container_new .alertmeassage ul.button li a {
        float: left;
        text-decoration: none;
        line-height: 37px
    }

    #pop_up_container_new .alertmeassage ul.button li a span {
        padding: 0 !important
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.ok {
        background: url(../images/time-tracking/cancel_ok_btn.jpg) no-repeat;
        width: 66px;
        height: 35px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.cancel {
        width: 89px;
        height: 35px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.cancel:hover {
        background-position: -68px bottom
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.send {
        background: var(--primary-theme-color);
        width: 89px;
        height: 35px;
        color: #fff;
        border-radius: 5px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.send:hover {
        opacity: .9
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.yes {
        background: url(../images/time-tracking/cancel_ok_btn.jpg) -232px 0 no-repeat;
        width: 61px;
        height: 35px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.yes:hover {
        background-position: -232px bottom
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.no {
        background: url(../images/time-tracking/cancel_ok_btn.jpg) -298px 0 no-repeat;
        width: 52px;
        height: 35px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.no:hover {
        background-position: -298px bottom
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.reload {
        background: url(../images/time-tracking/cancel_ok_btn.jpg) right 0 no-repeat;
        width: 86px;
        height: 35px
    }

    #pop_up_container_new .alertmeassage ul.button li a span small.reload:hover {
        background-position: right bottom
    }

    #content_section_tab_data1 a.btn {
        float: left;
        width: auto;
        color: #000;
        margin-top: 4px
    }

    .dyn_var a, a.more {
        text-decoration: underline
    }

    #content_section_tab_data1 a.btn span {
        float: left;
        width: auto;
        height: 31px;
        color: #000 !important;
        font-size: 12px
    }

    #pop_up_container_new .content_area .alertmeassage ul.button.no_magin {
        margin: 5px 0 0
    }

    #pop_up_container_new .content_area .alertmeassage.no_pad {
        float: left;
        width: 100%;
        padding-left: 4px
    }

    #pop_up_container_new.mail_notification {
        position: fixed;
        top: 20%;
        left: 30%
    }

    #pop_up_container_new .content_area.pad {
        padding: 10px 0
    }

    #pop_up_container_new p {
        float: left;
        width: 100%;
        font-size: 12px;
        padding: 10px 0;
        color: #000;
        font-weight: 400;
        text-align: center
    }

    #pop_up_container_new .content_area .form_row {
        float: left;
        width: 95%;
        font-size: 12px;
        padding: 0 0 10px
    }

    #pop_up_container_new .content_area .form_row label {
        float: left;
        width: 107px;
        font-weight: 400;
        font-size: 13px
    }

    #pop_up_container_new .content_area .form_row label.small_label {
        width: 55px;
        font-weight: 400;
        padding-bottom: 3px
    }

    #pop_up_container_new .content_area .form_row label.left_text {
        text-align: left
    }

    #pop_up_container_new .content_area .form_row .outer_input {
        float: left;
        width: 272px
    }

    #pop_up_container_new .content_area .form_row input {
        width: 188px;
        background: #f8f8f8;
        border: 1px solid #d6d6d6;
        color: #818181;
        display: block;
        float: left;
        font-size: 12px;
        height: 20px;
        padding: 3px
    }

    #pop_up_container_new .content_area .form_row input.big_input {
        width: 371px;
        padding: 0 5px
    }

    #pop_up_container_new .content_area .form_row textarea {
        width: 100%;
        height: 250px;
        background: #f8f8f8;
        border: 1px solid #e1e0e0;
        color: #818181;
        float: left;
        font-size: 12px;
        margin: 0;
        padding: 3px
    }

    #pop_up_container_new .content_area .form_row_bot {
        float: left;
        width: auto;
        padding: 0 0 20px 142px
    }

    #pop_up_container_new .content_area .alertmeassage.new_width {
        width: auto;
        padding-left: 10px
    }

    #pop_up_container_new .content_area .alertmeassage ul.btn {
        float: left;
        width: auto;
        list-style: none;
        background: 0;
        margin: 4px 0 0
    }

    #pop_up_container_new .content_area .alertmeassage ul.btn li {
        float: left;
        width: auto;
        padding-right: 10px;
        background: 0
    }

    #pop_up_container_new .content_area .alertmeassage ul.btn li a {
        float: left;
        width: auto;
        color: #000;
        font-size: 12px
    }

    #pop_up_container_new .content_area .alertmeassage ul.btn li a span {
        float: left;
        width: auto !important;
        font-size: 12px;
        height: 31px;
        margin: 0;
        text-decoration: none
    }

    #pop_up_container_new .proceed_row {
        float: left;
        width: 65%;
        padding: 10px 0 10px 107px;
        margin: 0
    }

    #pop_up_container_new .proceed_row .submit, #popup_container .proceed_row .submit {
        float: left;
        width: auto;
        font-size: 12px;
        line-height: 36px;
        height: 36px;
        color: #fff;
        margin-left: 10px;
        display: inline;
        border: 0
    }

    #pop_up_container_new .proceed_row button.submit span {
        padding: 0 14px 0 0;
        height: 36px;
        background: url(../images/button_new.gif) right 0 #fff
    }

    #pop_up_container_new .proceed_row button.submit span span {
        padding: 0 0 0 13px;
        height: 36px;
        line-height: 36px !important;
        background: url(../images/button_new.gif) left 0 #fff
    }

    #pop_up_container_new .proceed_row .cancel, #popup_container .proceed_row .cancel {
        border: 0;
        cursor: pointer;
        margin-left: 10px
    }

    #pop_up_container_new .content_area .alertmeassage .wait_box {
        float: left;
        width: 100%;
        text-align: center;
        padding: 3px 0
    }

    #pop_up_container_new .content_area .alertmeassage .notes {
        float: left;
        width: 95%;
        padding: 5px;
        margin: 4px 0;
        background: #f8f8f8;
        border: 1px solid #efefef
    }

    #pop_up_container_new .alertmeassage.no_pad ul.button {
        padding: 15px !important
    }

    #pop_up_container_new .alertmeassage.no_pad ul.sendMail {
        padding: 15px 15px 15px 2px !important
    }

    #pop_up_container_new.varbox_sec {
        margin: 0;
        border-radius: 5px;
        background: #fff;
        box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .06)
    }

    .varbox_sec .alertmeassage {
        float: left;
        padding: 10px;
        width: 475px
    }

    .varbox_sec .alertmeassage h3 {
        color: #000;
        padding: 0
    }

    #pop_up_container_new.varbox_sec .alertmeassage p {
        color: #000;
        font: 12px/18px verdana;
        padding: 6px 0;
        text-align: left
    }

    .varbox_sec .alertmeassage ul {
        float: left;
        width: 455px;
        margin: 8px 0 10px 20px;
        list-style-type: square
    }

    .varbox_sec .alertmeassage ul li {
        float: left;
        width: 100%;
        padding: 1px 0
    }

    .varbox_sec .alertmeassage div {
        background: #f1f1f1;
        padding: 5px;
        display: block;
        clear: both
    }

    .varbox_sec .alertmeassage div h4 {
        color: #000
    }

    .varbox_sec .alertmeassage div.note1 {
        color: #666
    }

    .dyn_var {
        float: left;
        clear: left
    }

    .dyn_var a {
        color: var(--primary-text-color)
    }

    #in_temp_container_outer #error_container {
        width: 978px;
        margin: 15px 20px;
        float: left
    }

    #content_container #error_container {
        width: 908px;
        margin: 15px 20px 0;
        float: left
    }

    .template1_lower_tab .compound_tax {
        float: right;
        width: auto;
        color: #000
    }

    #content_container .error_container_main {
        width: 960px;
        float: left;
        padding: 25px 10px;
        margin: 15px 0;
        text-align: center;
        border: 1px solid #fecaca;
        background: #fff3f3;
        color: var(--primary-text-color);
        border-radius: 5px
    }

    #content_container .error_container_main a {
        color: var(--primary-theme-color);
        text-decoration: underline
    }

    #content_container .error_container_main a:hover {
        color: var(--primary-theme-color);
        text-decoration: none
    }

    .dhtmlwindow {
        position: absolute;
        visibility: hidden;
        background-color: #d17100;
        border: 1px solid #cfcfcf;
        font-size: 12px;
        box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .06) !important;
        overflow-y: auto
    }

    .drag-handle {
        text-indent: 3px;
        background-color: #fff;
        color: var(--primary-main-heading);
        cursor: move;
        overflow: hidden;
        width: auto;
        padding: 10px;
        -moz-opacity: 1;
        opacity: 1;
        z-index: 99999;
        display: flex;align-items: center;
        justify-content: space-between;
    }

    .middle_row p{
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .middle_row p textarea{
        height: 100px;
        border: 1px solid var(--primary-border-color);
        border-radius: 5px;
        padding: 10px;
    }

    .blockMsg, body .blockUI {
        opacity: 1
    }

    .drag-handle .drag-controls {
        position: absolute;
        right: 2px;
        top: 5px;
        cursor: pointer;
        display: flex;
        gap: 7px
    }

    .drag-controls img {
        float: right;
        width: 18px;
        height: 18px
    }

    .drag-contentarea {
        background-color: #fff;
        color: #000;
        height: auto;
        overflow: auto;
        padding-bottom: 10px
    }

    .drag-statusarea {
        border-top: 1px solid gray;
        background-color: #e97b30;
        height: 18px;
        padding-top: 5px
    }

    .drag-statusarea #loadStatus {
        padding-left: 3px;
        width: auto;
        float: left
    }

    .drag-resizearea {
        width: 13px;
        height: 13px;
        cursor: nw-resize;
        font-size: 0;
        margin-top: 10px
    }

    .dhtmlwindow span.button {
        background: url(../images/button.gif) no-repeat;
        display: inline;
        margin: 1px 6px 0 0;
        border: 0;
        color: #fff;
        cursor: pointer;
        font-style: normal;
        height: 36px;
        padding: 0 10px;
        text-decoration: none;
        vertical-align: middle
    }

    .more_content_icon {
        cursor: pointer;
        color: #e97b30;
        float: right;
        font-weight: 500
    }

    #pop_up_container {
        width: 700px;
        float: left;
        margin: 0;
        display: inline;
        font-size: 3px
    }

    #pop_up_container .curve .top_row {
        width: 672px;
        float: left;
        background: url(../images/popup_top_bot.png) repeat-x;
        height: 10px
    }

    #pop_up_container .curve_bot .bottom_row {
        float: left;
        width: 672px;
        height: 10px;
        background: url(../images/popup_top_bot.png) 0 bottom repeat-x
    }

    #pop_up_container .selectbox_bg {
        float: left;
        width: 95px;
        height: 22px;
        background: url(../images/invoice_page_bg.gif) 0 -81px no-repeat;
        color: #000
    }

    #pop_up_container .selectbox_big {
        float: left;
        width: 238px;
        background: url(../images/invoice_page_bg.gif) 0 -200px no-repeat;
        height: 22px;
        margin: 0
    }

    #pop_up_container .left_shadow {
        width: 100%;
        background: #f3f3f3;
        float: left;
        border: 1px solid #cfcfcf;
        box-shadow: 0 0 8px 0 #000;
        -ms-box-shadow: 0 0 8px 0 #000;
        -moz-box-shadow: 0 0 8px 0 #000;
        -o-box-shadow: 0 0 8px 0 #000;
        -webkit-box-shadow: 0 0 8px 0 #000
    }

    #pop_up_container .content_area {
        background: #f3f3f3;
        float: left;
        width: 96%;
        margin-left: 2%;
        display: inline;
        padding: 5px 0 1px
    }

    #pop_up_container .content_area .content_row1 {
        padding: 0;
        float: left;
        width: 100%
    }

    #pop_up_container .content_area .content_row1 h2, #pop_up_container .content_area .content_row1 h3 {
        padding: 0;
        margin: 0;
        float: left;
        width: 100%
    }

    #pop_up_container .content_area .content_row1 h3 a.cancel {
        float: right;
        width: 19px;
        height: 17px;
        margin: 0 2px 0 0;
        display: inline;
        text-decoration: none;
        background: url(../images/all_icons.gif) 0 -1888px no-repeat
    }

    #pop_up_container .content_area .content_row2 {
        margin: 5px 0;
        float: left;
        text-align: left;
        width: 100%
    }

    #content_section_inner .content_sec_tab1 {
        float: left;
        width: 100%;
        font-size: 12px;
        color: #000;
        line-height: 16px;
        display: block;
        margin-top: 6px
    }

    #popup_container {
        width: 698px;
        background: #fff;
        border: 1px solid #dcdcdc;
        border-radius: 5px;
        box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .06);
        float: left;
        margin: 0;
        box-sizing: border-box
    }

    #popup_container .head {
        display: flex;
        align-items: center;
        padding: 15px;
        height: 40px;
        width: 100%
    }

    #popup_container .head.popupNewHeading h2 {
        color: var(--primary-text-color);
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: normal
    }

    #popup_container .content.appApprovalSetings {
        padding: 10px
    }

    #popup_container .content.appApprovalSetings form {
        display: flex;
        flex-direction: column;
        gap: 10px
    }

    #popup_container a.cancel_btn {
        float: right;
        width: auto;
        margin: 5px 5px 0 0;
        display: inline;
        text-transform: uppercase;
        font-size: 12px;
        font-weight: 400;
        color: #673800;
        text-decoration: none;
        cursor: pointer
    }

    #popup_container a.cancel_btn span.cancel_icon {
        float: left;
        width: 21px;
        height: 21px;
        background: url(../images/time-tracking/close_btn.png) no-repeat;
        margin: 0
    }

    #popup_container .content {
        float: left;
        width: 100%;
        background: #fff;
        border-radius: 0 0 5px 5px;
        box-sizing: border-box;
        max-height: 500px
    }

    #addInventory #popup_container .content {
        max-height: initial
    }

    .blockPage #popup_container .content table {
        border-collapse: collapse
    }

    .blockPage #popup_container .content table th {
        font-weight: 500 !important;
        padding: 2px
    }

    .blockPage #popup_container .content table th:first-child {
        min-width: 85px
    }

    .blockPage #popup_container .content table td, .blockPage #popup_container .content table th {
        border: 1px solid var(--primary-border-color)
    }

    .blockPage #popup_container .content table td {
        padding: 5px
    }

    #popup_container .content p:first-child {
        display: inline-block;
        font-weight: 500
    }

    #popup_container .content p {
        margin-bottom: 10px
    }

    .black {
        position: relative;
        float: left;
        width: 100%
    }

    #popup_container .tabs {
        float: left;
        width: 698px;
        position: relative;
        margin-top: 31px
    }

    #popup_container .tabs ul {
        float: left;
        width: 665px;
        padding-left: 13px;
        list-style: none;
        position: absolute;
        top: -30px;
        left: 0
    }

    #popup_container .tabs li a {
        float: left;
        font-size: 12px;
        line-height: 26px;
        height: 29px;
        text-decoration: none;
        padding: 0 13px;
        color: #000;
        cursor: pointer;
        border: 1px solid #cecece;
        margin-right: 6px;
        display: inline;
        background: url(../images/spacer_white.jpg) repeat-x #ebebeb
    }

    #popup_container .tabs .newList li a {
        display: inline-block !important
    }

    #popup_container .tabs li a:hover {
        color: #000;
        text-decoration: none
    }   

    #popup_container .tabs li a.current {
        color: #000;
        font-weight: 400;
        text-decoration: none;
        background: #fff;
        border-bottom: 1px solid #fff
    }

    #popup_container .tabs li.last {
        background: 0;
        padding-right: 0
    }

    #popup_container .tabs .descriptions.border {
        border-top: 1px solid #cecece
    }

    #popup_container .tabs .descriptions.border #content_section_tab_data1 table {
        max-height: 450px !important;
        width: 132%;
        background: #fff;
        height: auto !important
    }

    #popup_container .tabs .descriptions .row_tab fieldset {
        float: left;
        width: 100%;
        padding: 14px 0 0
    }

    #popup_container .tabs.bor_none {
        border: 0
    }

    #popup_container .content_area {
        float: left;
        padding: 5px 0 1px;
        width: 100%
    }

    #popup_container .proceed_row {
        float: left;
        width: 94.4%;
        border-top: 1px solid #e0e0e0;
        padding: 15px 20px;
        margin: 0
    }

    #popup_container .proceed_row .submit span span {
        line-height: 36px !important
    }

    #popup_container .proceed_row p {
        float: right;
        width: auto
    }

    #content_section {
        width: 100%;
        background: #f9f9f9;
        float: left
    }

    #content_section fieldset {
        width: 100%;
        float: left;
        margin: 0;
        display: inline
    }

    #content_section_inner .import_exp_sec_tab2 {
        float: left;
        width: 909px;
        font-size: 11px;
        color: #000;
        line-height: 16px;
        display: block;
        margin-top: 5px
    }

    .inner_popup {
        float: left;
        width: 97%;
        margin: 7px 0 10px;
        padding: 0 0 15px 10px
    }

    .inner_popup ul {
        float: left;
        width: 100%;
        list-style: none;
        margin: 0;
        padding: 0
    }

    .inner_popup ul li {
        float: left;
        width: 100%;
        color: #c75f19;
        line-height: 20px
    }

    .inner_popup ul li ul {
        float: left;
        width: 95%;
        padding: 2px 0 0
    }

    .inner_popup ul li ul li {
        float: left;
        width: 98%;
        background: url(../images/gray_bullet_new.gif) 0 6px no-repeat;
        padding: 0 0 0 14px;
        font-size: 12px;
        color: #000;
        line-height: 20px;
        margin-left: 16px;
        display: inline
    }

    a.more {
        float: right;
        width: auto;
        padding: 0;
        color: #ed4e00;
        text-align: right;
        margin: 10px 32px 0 0
    }

    span.error_msg, span.error_msg2, span.error_msg3, span.error_msg4 {
        background: url(../images/redcol_arrow.gif) 0 3px no-repeat;
        font-size: 11px;
        color: red;
        font-weight: 90%;
        line-height: 15px;
        padding-left: 10px
    }

    a.more:hover {
        text-decoration: none;
        color: #f06b10
    }

    #import_exp_section_inner .content_section_tab3 {
        float: left;
        width: 909px;
        font-size: 11px;
        color: #000;
        line-height: 16px;
        display: block;
        margin-top: 6px
    }

    .pop_error {
        border: 1px solid red;
        width: 122px;
        float: left;
        background: #fff;
        height: 17px;
        padding: 3px 22px 0 5px;
        font-size: 11px;
        margin: 0 0 6px
    }

    .button_hover, .button_status {
        border: 1px solid #bdc3ec;
        margin: 5px 5px 8px 0;
        float: left;
        width: auto;
        display: inline;
        padding: 2px;
        cursor: pointer
    }

    span.error_msg {
        float: left;
        width: auto;
        margin: 6px 0 0 5px;
        display: inline
    }

    span.error_msg2 {
        float: left;
        width: auto;
        margin: 6px 0 0 94px;
        display: inline
    }

    span.error_msg3 {
        float: left;
        width: auto;
        margin: 3px 0 0 106px;
        display: inline
    }

    span.error_msg4 {
        float: left;
        width: auto;
        margin: 6px 0 0 112px;
        display: inline
    }

    span.button {
        float: left
    }

    span.button button {
        cursor: pointer
    }

    a.button, del.button, span.button {
        display: inline;
        cursor: pointer;
        border: 0;
        font-size: 0;
        line-height: 0;
        background-position: 0 0;
        background-repeat: no-repeat;
        height: 36px;
        text-decoration: none;
        color: #2e523b;
        font-style: normal;
        margin: 0;
        padding: 0 10px;
        vertical-align: middle
    }

    .account_tablebg_detail a, a.calculator {
        color: #ed4e00
    }

    .extra_features .outer_table td, .invoice_aging .outer_table td, .submit_btn>span.button {
        padding: 0
    }

    html.safari a.button span, html.safari del.button span {
        line-height: 1.3
    }

    html.safari span.button button {
        line-height: 2.6
    }

    del.button {
        background-position: 0 -120px
    }

    del.button span {
        cursor: default;
        color: #aaa !important;
        background-position: 100% -120px
    }

    button::-moz-focus-inner {
        border: 0
    }

    a.button:active, a.button:focus span {
        color: #444
    }

    del.button-behavior-hover, del.button-behavior-hover span, del.button:hover, del.button:hover span {
        background: url(../images/button.gif) 0 -36px no-repeat
    }

    .button_status {
        background: url(../images/buttons/input_rp.gif) repeat-x #e1e3f8
    }

    .button_hover {
        background: url(../images/buttons/input_rp_hover.gif) repeat-x #e1e3f8
    }

    .account_tablebg3, .account_tablebg6, .account_tableheading2 {
        border-left: 1px solid #e7e7e7
    }

    a.calculator {
        background: url(../images/time-tracking/calculator.gif) right 0 no-repeat;
        float: left;
        padding-right: 38px;
        line-height: 29px;
        font-size: 12px;
        font-weight: 400;
        text-decoration: none
    }

    #invoice_history {
        width: 100%;
        margin: 15px 0;
        float: left;
        margin-left: 0 !important
    }

    #invoice_history.pad_none {
        margin-left: 0;
        width: 891px
    }

    .account_grid_container1 {
        float: left;
        width: 920px;
        margin-bottom: 15px;
        border: 1px solid #e7e7e7;
        border-top: 0
    }

    .account_grid_container.small_grid {
        width: 979px;
        margin-bottom: 10px
    }

    .account_gridrow1 {
        padding: 7px 5px
    }

    .account_column1 {
        width: 49%;
        float: left;
        color: #000;
        font-size: 12px;
        padding: 9px 9px 9px 14px;
        text-align: left
    }

    .account_column2 {
        width: 46%;
        float: right;
        color: #000;
        font-size: 12px;
        text-align: right;
        padding: 9px 13px 9px 9px
    }

    .account_tablebg2, .account_tablebg3 {
        padding: 3px 5px;
        border-right: 1px solid #e7e7e7;
        border-top: 1px solid #e7e7e7
    }

    .account_tablebg2 {
        border-bottom: 1px solid #fff;
        color: #000
    }

    .account_table_bottom, .account_tablebg6, .brdr_bot {
        border-bottom: 1px solid #e7e7e7
    }

    .account_tablebg3 {
        text-align: center
    }

    .account_tablebg4 {
        border-top: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        color: #000;
        text-align: center
    }

    .account_tablebg5 {
        border-top: 1px solid #e7e7e7;
        padding: 3px 10px;
        color: #000;
        text-align: center
    }

    .account_tablebg6 {
        border-right: 1px solid #e7e7e7;
        padding: 3px 10px;
        color: #000
    }

    .account_tablebg {
        border-top: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        padding: 3px 10px;
        text-align: center
    }

    .account_tablebg_detail {
        border-top: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        padding: 3px 10px;
        color: #000;
        text-align: left
    }

    .account_tablebg_digit {
        border-top: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        padding: 3px 10px;
        color: #000;
        text-align: right;
        font-size: 12px;
        width: 100px !important
    }

    .account_tableheading, .account_tableheading2 {
        border-top: 0;
        border-right: 1px solid #e7e7e7;
        font-weight: 500
    }

    .account_tableheading {
        padding: 0;
        font-size: 12px
    }

    .mail_content .mail_content_inner {
        float: left;
        width: 242px;
        padding: 4px 10px 10px;
        text-align: left;
        border: 1px solid #e3e3e3;
        background: #f5f5f5;
        margin: 5px 0
    }

    .mail_content .mail_content_inner br {
        height: 1px;
        line-height: 3px
    }

    .mail_content a {
        color: #f06b10;
        text-decoration: underline
    }

    .mail_content a:hover {
        color: #f06b10;
        text-decoration: none
    }

    .mail_content a.hide {
        float: right;
        color: #f06b10;
        text-decoration: underline
    }

    .account_table_top_brdr {
        border-top: 1px solid #e7e7e7
    }

    .account_table_total {
        float: right;
        width: 100%;
        font-weight: 400;
        font-size: 12px
    }

    .account_table_total .amount {
        font-size: 12px;
        font-weight: 400
    }

    .account_grid_container .rowcolordark {
        background: #fbfbfb
    }

    .account_grid_container .row_last {
        border-bottom: 1px solid #f7f7f7
    }

    .account_grid_container .rowcolorlight, table.project_list tr.even {
        background: #fff
    }

    .top_row_credit2_space {
        height: 15px;
        border-left: 1px solid #e8e8e8;
        border-right: 1px solid #e8e8e8
    }

    .top_row_credit2 {
        background: #f1f1f1;
        border: 1px solid #bbb;
        float: left;
        margin: 0;
        padding: 0;
        width: 980px
    }

    .top_row_credit2 h3 {
        color: #535353;
        float: left;
        font-size: 14px;
        font-weight: 400;
        padding: 11px 10px;
        text-transform: uppercase;
        width: auto
    }

    .top_row_credit2 .top_sec {
        background: #ececec;
        float: left;
        margin-bottom: 0;
        padding-left: 15px;
        width: 964px
    }

    .top_row_credit2 .top_sec h2 {
        color: #535353;
        float: left;
        font-size: 12px;
        font-weight: 400;
        line-height: 25px;
        padding: 7px 0;
        width: auto
    }

    .top_row_credit2 a.plus {
        width: 16px;
        background: url(../images/all_icons.gif) 0 -1504px no-repeat;
        text-decoration: none
    }

    .top_row_credit2 a.minus {
        width: 16px;
        background: url(../images/all_icons.gif) 0 -1616px no-repeat;
        text-decoration: none
    }

    .top_row_credit2 .top_sec a {
        margin: 9px 10px 0 0;
        float: right
    }

    .top_row_credit2.big_head {
        margin-top: 15px
    }

    .top_row_credit2 .account_grid_container.small_grid {
        margin: 0 0 1px
    }

    .top_row_credit2 .account_tableheading, .top_row_credit2 .account_tableheading2 {
        background: 0;
        border: 0;
        font-weight: 400;
        font-size: 12px
    }

    .top_row_credit2 .account_grid_container .rowcolordark {
        border-top: 1px solid #e1e1e1;
        font-size: 12px
    }

    #invoice_history .top_row_credit2 {
        background: #ececec;
        border: 1px solid #e8e8e8;
        float: left;
        height: 25px;
        width: 963px;
        border-radius: 2px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -khtml-border-radius: 2px;
        padding: 7px 0 7px 15px;
        font-size: 14px;
        font-weight: 400;
        line-height: 25px;
        color: #535353;
        margin: 0;
        text-transform: uppercase
    }

    #invoice_history .top_row_credit2 a {
        padding-left: 30px
    }

    #invoice_history .top_row_credit2 a.plus {
        width: 16px;
        background: url(../images/all_icons.gif) 0 -1507px no-repeat;
        text-decoration: none
    }

    #invoice_history .top_row_credit2 a.minus {
        width: 16px;
        background: url(../images/all_icons.gif) 0 -1619px no-repeat;
        text-decoration: none
    }

    .notification_area_outer {
        float: left;
        margin: 0 0 10px 12px;
        width: 922px
    }

    .notification_area {
        float: left;
        width: 94%;
        padding: 15px
    }

    .notification_area .form_row {
        float: left;
        width: 100%;
        padding: 0 0 15px
    }

    .notification_area .form_row label {
        float: left;
        width: 100%;
        font-weight: 400;
        text-align: left;
        font-size: 12px;
        padding-bottom: 2px
    }

    .notification_area .form_row input {
        float: left;
        width: 380px;
        background: #fff;
        border: 1px solid #d6d6d6;
        color: #818181;
        font-size: 12px;
        height: 38px;
        padding: 3px;
        border-radius: 5px
    }

    .notification_area .form_row textarea {
        float: left;
        width: 460px;
        height: 250px;
        border: 1px solid #bebebe;
        margin-left: 15px;
        display: inline
    }

    .notification_area ul.button li {
        float: left;
        width: auto;
        margin-right: 7px;
        display: inline;
        border: 1px solid #d1d1d1
    }

    .notification_area ul.button li a {
        float: left;
        width: auto;
        font-weight: 400;
        background-color: #ebebeb;
        color: #000;
        text-decoration: none;
        line-height: 18px;
        cursor: pointer
    }

    .notification_area ul.button li a:hover {
        color: #fff !important;
        text-decoration: none
    }

    .notification_area ul.button li a span {
        float: left;
        width: auto;
        margin: 0 !important;
        padding: 2px 4px 2px 5px !important
    }

    .notification_area ul.button li a span:hover {
        color: #000 !important
    }

    .notification_area span.note {
        background: #fef6ed !important;
        border: 1px solid #df7b03;
        float: left;
        margin: 0 0 10px !important;
        padding: 5px !important;
        width: 97% !important;
        font-size: 12px !important
    }

    .mceEditor table.mceLayout, .template1_lower_tab .selectbox_bg01 .newListSelected ul.newList li {
        width: 100% !important
    }

    .alert div.message {
        font-size: 12px !important
    }

    a.help {
        background: url(../images/all_icons.gif) 0 -1474px no-repeat;
        display: inline;
        float: left;
        height: 20px;
        margin: 3px 0 0 3px;
        text-decoration: none;
        width: 20px
    }

    #thanks_container {
        float: left;
        width: 100%;
        height: 400px;
        background-color: #fff;
        margin-top: 15px
    }

    #thanks_container .error_container_main1 {
        width: 96%;
        padding: 25px 1%;
        margin: 0 1%;
        text-align: center;
        background: #ffdada;
        border-radius: 10px;
        height: 250px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 120px;

    }

    #thanks_container .error_container_main1 a:hover, .non_sub_msg a:hover {
        color: #dc7800;
        text-decoration: none
    }

    .delete_icon2 {
        display: inline;
        float: left;
        margin: 3px 0 0 5px;
        width: auto
    }

    .delete_icon2 a.delete {
        background: url(../images/all_icons.gif) 0 -1418px no-repeat;
        float: left;
        height: 15px;
        text-decoration: none;
        width: 13px
    }

    .template1_lower_tab ul.options {
        margin-right: 10px;
        display: inline;
        background: 0 0 !important
    }

    #showAgingDetailFrm {
        float: left;
        display: none;
        width: 600px;
        background: #fff;
        padding: 0 0 10px;
        border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border: 1px solid #d17100
    }

    #showAgingDetailFrm span, #showextrafeaturesFrm span {
        float: left;
        height: 30px;
        background: #d17100;
        width: 100%;
        padding: 4px 0
    }

    #showAgingDetailFrm h3, #showextrafeaturesFrm h3 {
        float: left;
        font-size: 18px;
        color: #fff;
        width: 97%;
        padding: 6px 0 3px 10px
    }

    .extra_features, .invoice_aging {
        float: left;
        width: 598px;
        background: #fff;
        margin: 10px 0 0
    }

    .extra_features .outer_table, .invoice_aging .outer_table {
        margin: 0 auto;
        width: 578px
    }

    .extra_features .inner_table, .invoice_aging .inner_table {
        float: left;
        width: 578px;
        background: #ededed;
        font-size: 12px;
        color: #000;
        line-height: 18px
    }

    .extra_features .inner_table .head, .invoice_aging .inner_table .head {
        background: #f8f8f8;
        color: #000 !important;
        font-weight: 500
    }

    .extra_features .inner_table td, .invoice_aging .inner_table td {
        padding: 4px 0;
        background: #fff
    }

    #showextrafeaturesFrm {
        float: left;
        width: 600px;
        background: #fff;
        padding: 0 0 10px;
        border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border: 1px solid #d17100
    }

    .note_msg, .note_msg01 {
        border: 1px solid #87abcd;
        background: #cbe3f8;
        padding: 10px 0 10px 10px
    }

    .non_sub_msg {
        margin: 200px auto 0;
        width: 600px;
        text-align: center;
        font-size: 18px;
        line-height: 22px
    }

    a.delete_payment_history {
        float: left;
        width: 16px;
        height: 16px;
        background: url(../images/all_icons.gif) 0 -50px no-repeat;
        text-decoration: none
    }

    a.delete_payment_history.pad_left {
        margin-left: 36px;
        display: inline
    }

    a.delete_payment_history.pad_left1 {
        margin-left: 16px;
        display: inline
    }

    span.successmsg {
        float: left;
        width: auto;
        font-size: 12px;
        color: green;
        font-weight: 90%;
        line-height: 15px;
        display: inline
    }

    #mailContent_bold .mceButton {
        height: 30px !important;
        width: 20px
    }

    span.mceIcon {
        color: #000;
        float: left;
        font-size: 12px;
        line-height: 18px;
        margin: 0 0 5px !important;
        width: 100%
    }

    .note_msg {
        color: #000;
        margin: 0 0 10px 1%;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        width: 98%
    }

    .note_msg a, .note_msg01 a {
        text-decoration: underline;
        color: #000
    }

    .note_msg01 {
        float: left;
        width: 906px;
        position: relative;
        color: #000;
        margin: 0 0 10px
    }

    .note_msg01.template {
        width: 936px;
        margin: 10px 15px
    }

    .note_msg01 .cancel {
        background: url(../images/all_icons.gif) 0 -1711px no-repeat;
        height: 16px;
        width: 16px;
        position: absolute;
        top: 5px;
        right: 5px
    }

    .note_msg01 p {
        float: left;
        width: 100%;
        padding: 4px 0
    }

    .note_msg01 ul {
        float: left;
        list-style: disc;
        padding-left: 25px
    }

    .note_msg01 ul li {
        float: left;
        width: 100%;
        color: #000;
        padding: 2px
    }

    .notification_msg_new {
        float: left;
        width: 892px;
        padding: 4px 7px;
        background: #ffecd7;
        border: 1px solid #fbd0b0;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        margin-top: 10px
    }

    .notification_msg_new .inner_note {
        float: left;
        width: 888px;
        background: 0;
        padding: 0 0 7px;
        position: relative
    }

    .notification_msg_new .inner_note .right_sec {
        float: left;
        width: 820px;
        padding: 4px 0 0
    }

    .notification_msg_new .inner_note .right_sec p {
        float: left;
        width: auto;
        padding: 4px 0 0
    }

    .notification_msg_new .inner_note .note_head {
        float: left;
        width: 100%;
        font-size: 11px;
        font-weight: 400;
        color: #c75f19;
        line-height: 18px;
        padding-top: 4px
    }

    .notification_msg_new .inner_note small {
        background: url(../images/alert_icon.gif) 0 2px no-repeat;
        float: left;
        height: 52px;
        width: 66px
    }

    .notification_msg_new .inner_note .cancel_btn {
        position: absolute;
        top: -2px;
        right: -4px;
        width: 24px;
        text-decoration: none;
        height: 23px;
        float: right;
        background: url(../images/event_icons.png) 0 -170px no-repeat
    }

    .notification_msg_new .inner_note ul {
        float: left;
        width: 90%;
        margin: 0;
        padding: 0
    }

    .notification_msg_new .inner_note ul li {
        float: left;
        font-size: 12px;
        list-style: disc;
        width: 100%;
        color: #515151;
        line-height: 18px;
        margin: 0
    }

    .notification_msg_new .inner_note ul.options li {
        float: left;
        width: auto;
        padding-right: 10px;
        list-style: none
    }

    .notification_msg_new .inner_note ul.options li a {
        float: left;
        width: auto;
        background: url(../images/button_left_curve.gif) no-repeat;
        height: 25px;
        font-size: 11px;
        line-height: 13px;
        color: #000;
        text-decoration: none;
        cursor: pointer;
        font-weight: 400
    }

    ul.ui-widget li a.ui-corner-all, ul.ui-widget li a.ui-corner-all:hover {
        border-width: 0 !important;
        line-height: 24px !important;
        font-size: 12px !important
    }

    .notification_msg_new .inner_note ul.options li a span small.send {
        float: left;
        width: auto;
        background: url(../images/all_icons.gif) 0 -70px no-repeat;
        font-size: 11px;
        line-height: 13px;
        color: #000;
        padding: 5px 0 5px 23px;
        height: auto
    }

    #thanks_container .success_container_main1 {
        width: 96%;
        float: left;
        padding: 25px 1%;
        margin: 20px 1%;
        text-align: center;
        border-radius: 10px;
        height: 250px;
        background: #e3f6ee !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 120px
    }

    #thanks_container .success_container_main1 a.loginPayment {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5px;
        width: 101px;
        height: 37px;
        border-radius: 5px;
        background: var(--primary-theme-color);
        color: #fff;
        border: none;
        font-weight: 500;
        text-decoration: none;
        font-size: 14px;
        margin-left: auto;
        margin-right: auto
    }

    .inventory_available {
        color: red;
        float: left;
        width: 100%
    }

    .blockMsg {
        background: 0
    }

    ul.ui-widget {
        max-height: 200px;
        overflow: auto;
        background: #fff !important;
        border: none !important;
        color: #333;
        width: 300px !important;
        border-radius: 0;
        position: absolute !important;
        box-shadow: 0 2px 6px rgba(57, 35, 195, .15) !important;
        scrollbar-width: thin
    }

    .frmpkUserCompanyIDText, ul.frmpkUserCompanyIDText, ul.ul_id_ExpenseStaff, ul.ul_id_ExpenseStatus, ul.ul_id_expenseCategoryName, ul.ul_id_frmAdditionalField, ul.ul_id_frmAutoBilled, ul.ul_id_frmInventoryStatus, ul.ul_id_frmInventoryTax, ul.ul_id_frmInventoryTrackInventory, ul.ul_id_frmInvoicePrefix, ul.ul_id_frmInvoiceStatus, ul.ul_id_frmInvoiceTag, ul.ul_id_frmPurchaseOrderTag, ul.ul_id_frmServiceStatus, ul.ul_id_frmServiceTax, ul.ul_id_frmStaffID, ul.ul_id_frmUserCompanyStatus, ul.ul_id_frmUserCurrency {
        width: 139px !important;
        position: absolute !important
    }

    ul.ui-widget li {
        padding: 0 5px;
        width: auto
    }

    ul.ui-widget li a.ui-corner-all {
        background: 0 0 !important;
        display: block;
        padding: 0;
        text-decoration: none;
        color: var(--primary-text-color)
    }

    ul.ui-widget li a.ui-corner-all:hover {
        color: var(--primary-theme-color);
        margin: 0 !important;
        background: #fff7f1 !important;
        font-weight: 400 !important
    }

    .ui-combobox input.bg_none, .ui-select a .ui-state-default .ui-icon {
        background: 0 0 !important
    }

    .ui-combobox a {
        float: right;
        background: 0;
        border: 0;
        margin: 0;
        width: 21px;
        height: 25px
    }

    .ui-combobox a span, .ui-combobox a.active span, .ui-combobox a:focus span, .ui-combobox a:hover span, .ui-select a span {
        background: 0 0 !important;
        border: 0;
        float: left;
        width: 26px;
        height: 25px
    }

    ul.ul_id_paging {
        width: 50px !important;
        overflow: auto;
        max-height: 80px
    }

    ul.ul_id_ProjectPriority, ul.ul_id_TaskPriority, ul.ul_id_frmInvoiceCurrency {
        width: 136px !important
    }

    ul.ul_id_frmInvoiceConvertFrom {
        width: 141px !important
    }

    ul.ul_id_Status, ul.ul_id_frmInvoiceRecordStatus {
        width: 140px !important
    }

    .ui-select {
        float: left;
        min-height: 24px;
        padding-top: 4px;
        width: 125px
    }

    .ui-select input {
        float: left;
        width: 80px;
        border: 0;
        background: 0;
        padding: 4px 5px;
        margin: 0;
        font-weight: 400;
        font-size: 12px;
        color: #818181;
        cursor: pointer
    }

    .ui-select a {
        float: right;
        background: 0;
        border: 0;
        margin: 0;
        width: 26px;
        height: 25px
    }

    .ui-select .ui-state-focus .ui-icon, .ui-select .ui-state-hover .ui-icon, .ui-select a.button_active:active span, .ui-select a:active:active span, button.button_active span, button:active span {
        background: 0 0 !important
    }

    ul.ul_id_ExpenseStaff, ul.ul_id_ExpenseStatus {
        width: 309px !important
    }

    ul.ul_id_fkCountryID {
        width: 267px !important
    }

    ul.ul_id_frmAdditionalField, ul.ul_id_frmInvoiceFrequency, ul.ul_id_frmInvoicePrefix, ul.ul_id_frmInvoiceRecordStatus, ul.ul_id_frmInvoiceStatus, ul.ul_id_frmInvoiceTag, ul.ul_id_frmPurchaseOrderRecordStatus, ul.ul_id_frmPurchaseOrderTag, ul.ul_id_frmStaffID {
        position: absolute !important
    }

    ul.ul_id_ExpenseStatus, ul.ul_id_expenseCategoryName, ul.ul_id_fkCategoryID, ul.ul_id_fkCountryID, ul.ul_id_fkUserClientID, ul.ul_id_frmClient, ul.ul_id_frmClientType, ul.ul_id_frmGroupBy, ul.ul_id_frmReportType, ul.ul_id_frmUserCompanyStatus, ul.ul_id_userID {
        position: absolute !important;
        font-family: 'Times New Roman', Times, serif
    }

    .ui-combobox.client_inp .dhx_combo_box {
        width: 273px !important;
        background: 0;
        border: 0 solid #7f9db9
    }

    .ui-combobox.client_inp .dhx_combo_box input[type=text] {
        width: 262px !important;
        font-size: 12px;
        height: 20px;
        padding: 0 5px 4px
    }

    ul.ul_id_frmEstimateCurrency, ul.ul_id_frmInvoiceStatus {
        width: 137px !important
    }

    ul.ul_id_frmPurchaseOrderRecordStatus {
        width: 124px !important
    }

    .invoice_table tr td.col2 .input_bg_list_outer.product_sec_list .dhx_combo_box {
        width: 135px !important;
        background: 0;
        border: 0 solid #7f9db9
    }

    .invoice_table tr td.col2 .input_bg_list_outer.product_sec_list .dhx_combo_box input[type=text] {
        width: 112px !important;
        font-size: 12px;
        height: 20px;
        padding: 0 5px;
        background: 0
    }

    .abc {
        float: left;
        width: 320px;
        position: absolute;
        right: -320px;
        top: 0
    }

    table.project_list tr {
        float: left;
        width: 866px;
        border-bottom: 1px solid #eee;
        padding: 0 20px
    }

    table.project_list tr td table tr {
        float: left;
        width: 100%;
        border: 0;
        padding: 0
    }

    table.project_list tr td table tr td {
        float: left;
        color: #000
    }

    table.project_list tr td table tr td a.close {
        float: left;
        width: 12px;
        height: 12px;
        background: url(../images/time-tracking/cross_btn.png) left top no-repeat;
        display: block
    }

    table.project_list tr.odd {
        background: #fcfcfc
    }

    #invoice_template1 .total_amounts {
        text-align: right
    }

    #in_temp_container_inner {
        float: left;
        width: 100%;
        background: #fdfdfd;
        display: inline;
        border: 1px solid #eaeaea;
        padding-bottom: 0
    }

    #invoice_template1 .template1_second_row {
        display: inline;
        float: left;
        padding: 0;
        width: 100%
    }

    #invoice_template1 .invoice_row_top3 {
        width: 100%;
        float: left;
        padding: 0 0 17px;
        position: relative
    }

    #invoice_template1 .invoice_row4 {
        width: 100%;
        float: left;
        margin-left: unset;
        display: inline;
        border-left: 1px solid #e7e7e7
    }

    #invoice_template1 .invoice_row_top2, .template2_grey_bg {
        border-left: 1px solid #eaeaea;
        border-right: 1px solid #eaeaea;
        float: left
    }

    #invoice_template1 .invoice_row4.blk_border {
        border-left: 0 solid #000;
        width: 100%
    }

    .template2_grey_bg {
        width: 100%;
        background: url(../images/template2_greybg.gif) 0 bottom no-repeat #fff;
        display: inline;
        min-height: 178px
    }

    #invoice_template1 .invoice_row_top2 {
        width: 100%;
        padding: 31px 0 34px;
        position: relative;
        border-top: 1px solid #eaeaea;
        background: #fff
    }

    #invoice_template1 p.title {
        color: #000;
        font-size: 20px;
        font-weight: 400;
        padding: 10px 0 17px;
        text-align: center;
        width: 100%;
        float: left
    }

    .invoice_add_new {
        float: left;
        width: 100%;
        border-right: 1px solid #eaeaea;
        display: inline;
        border-left: 1px solid #e7e7e7;
        margin-bottom: 10px
    }

    .invoice_add_new_section, .template3_bottom_row {
        float: left;
        width: 100%;
        background: #fff
    }

    .invoice_total_row {
        float: left;
        width: 100%;
        padding-bottom: 10px;
        border-bottom: 1px solid var(--secondary-border-color);
        border-right: 1px solid var(--secondary-border-color)
    }



    .legend_sec, .legend_sec_error {
        background: var(--secondary-border-color);
        border: 1px solid #626262 !important;
        position: relative
    }

    .template1_first_row p.title {
        float: right;
        width: 906px;
        text-align: center;
        padding: 10px 0 0;
        color: #000
    }

    .template1_first_row .field {
        float: left;
        width: 129px;
        background: url(../images/combo_bg.gif) no-repeat;
        border: 0;
        color: #505050;
        font-size: 11px;
        line-height: 17px;
        height: 19px;
        margin: 0 0 0 2px;
        display: inline;
        padding: 3px 22px 0 3px
    }

    .template1_first_row label {
        float: left;
        width: auto;
        padding: 5px 10px 0 0;
        text-align: right;
        color: #505050;
        font-size: 12px;
        line-height: 17px;
        font-weight: 500
    }

    .template1_first_row .selectbox_bg {
        color: #000;
        float: left;
        font-size: 12px;
        height: 26px;
        line-height: 26px;
        width: 165px;
        margin-left: 10px;
        padding-top: 0
    }

    .template1_first_row .color_themes {
        float: left;
        width: auto;
        border-left: 1px solid #e3e3e3;
        margin: 0 0 0 15px;
        display: inline;
        padding: 5px 0 4px
    }

    .options .selectbox_bg01, .template1_lower_tab .selectbox_bg01 {
        width: 110px;
        color: #fff;
        float: left;
        font-size: 12px;
        line-height: 14px;
        height: 26px
    }

    .template1_first_row .color_themes p {
        float: left;
        width: 40px;
        text-align: right;
        font-size: 12px;
        color: #000;
        font-weight: 500
    }

    .template1_first_row .color_themes ul {
        float: left;
        width: auto;
        padding: 0 0 0 10px
    }

    .template1_first_row .color_themes li {
        float: left;
        width: 19px;
        margin: 0 7px 0 0;
        display: inline
    }

    .template1_first_row .color_themes li a {
        float: left;
        width: 19px;
        height: 19px;
        text-decoration: none;
        background: #acda1f;
        border: 1px solid #000;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -o-box-sizing: border-box
    }

    .template1_first_row .color_themes li a:hover {
        opacity: .7
    }

    .template1_first_row .color_themes li a.blue_theme {
        background: #00aae2
    }

    .template1_first_row .color_themes li a.orange_theme {
        background: #ffa800
    }

    .template1_first_row .color_themes li a.grey_theme {
        background: #a1b3bb
    }

    .template1_first_row .color_themes li a.red_theme {
        background: #ce1a1a
    }

    .template1_first_row .color_themes li a.black_theme {
        background: #000
    }


    .template1_lower_tab.top_margin {
        margin-top: 25px
    }

    .template1_lower_tab ul.options {
        float: left;
        width: auto;
        list-style: none;
        padding: 0 0 11px;
        margin-left: 10px
    }

    .template1_lower_tab ul.options li {
        float: left;
        width: auto;
        padding-right: 5px
    }

    .template1_lower_tab ul.options li a {
        text-decoration: none;
    }

    .template1_lower_tab ul.options li a span {
        cursor: pointer;
        float: left;
        padding: 2px 5px !important;
        width: auto !important
    }

    .template1_lower_tab ul.options li a span small {
        float: left;
        font-size: 12px;
        line-height: 22px;
        width: auto;
        color: #515151 !important
    }

    .template1_lower_tab ul.options li.last {
        padding-right: 0
    }

    .template1_lower_tab .selectbox_bg01 {
        background: url(../images/time-tracking/button_bg.jpg) repeat-x;
        border: 1px solid #b6b6b8;
        font-weight: 400;
        padding: 0
    }

    .template1_lower_tab .selectbox_bg01 .selectedTxt {
        color: #515151;
        height: 23px;
        line-height: 23px;
        padding-right: 15px;
        width: auto
    }

    .template1_lower_tab .selectbox_bg01 ul.newList {
        width: 110px !important
    }

    .template1_lower_tab .selectbox_bg01 ul.newList li {
        padding: 0;
        font-weight: 400
    }

    .options .selectbox_bg01 {
        font-weight: 400;
        padding: 0
    }

    .options .selectbox_bg01 .selectedTxt {
        color: #515151;
        height: 23px;
        line-height: 23px;
        width: 95%;
        padding-right: 0
    }

    .options .selectbox_bg01 ul.newList {
        top: 26px !important
    }

    .bottomActionBtn .options .selectbox_bg01 ul.newList li {
        border-bottom: 1px solid #f3f7fa !important
    }

    .options .selectbox_bg01 ul.newList li {
        padding: 0;
        font-weight: 400;
        width: 100% !important
    }

    .template3_bottom_row .content {
        float: left;
        width: 100%;
        background: #f5f5f5;
        margin-top: 7px;
        padding: 0 0 12px;
        border-bottom: 1px solid var(--secondary-border-color)
    }

    .down_maintence .down_layout .down_content {
        background: url(../images/time-tracking/information_img.png) 0 10px no-repeat
    }

    .legend_sec {
        float: left;
        /* width: 940px !important; */
        padding: 9px;
        margin: 10px 10px 15px !important
    }

    .legend_sec .cancel, .legend_sec_error .cancel {
        background: url(../images/legandCross.png) no-repeat;
        height: 16px;
        width: 16px;
        position: absolute;
        top: 10px;
        right: 5px
    }

    .legend_sec ul, .legend_sec_error ul {
        float: left;
        width: 95%;
        list-style: none;
        padding: 0 0 0 10px
    }

    .legend_sec ul li {
        background: url(../images/gray_bullet.gif) 0 8px no-repeat;
        color: #000;
        display: block;
        float: left;
        padding: 4px 0 2px 15px;
        width: 90%
    }

    .legend_sec ul li span {
        color: red
    }

    .legend_sec ul li span.sent {
        float: left;
        width: 16px;
        height: 16px;
        background: url(../images/time-tracking/sent_btn.gif) repeat-x;
        margin: 0 5px 0 0;
        display: inline
    }

    .legend_sec ul li span.unsent {
        float: left;
        width: 16px;
        height: 16px;
        background: url(../images/time-tracking/draft_btn.gif) repeat-x;
        margin: 0 5px 0 0;
        display: inline
    }

    .legend_sec ul li span.recurring_inv {
        float: left;
        width: 16px;
        height: 16px;
        background: #e7f0f6;
        border: 1px solid #cae5f4;
        margin: 0 5px 0 0;
        display: inline
    }

    .legend_sec p {
        float: left;
        width: 95%;
        font-size: 14px;
        color: #515151;
        text-align: left
    }

    .tds_legend_sec {
        float: left;
        width: 680px
    }

    .legend_sec_error {
        float: left;
        width: 96%;
        padding: 10px 2%;
        margin: 10px 0 15px !important
    }

    .comment_top_container, .po_ref .head_top {
        background: #ececec;
        min-height: 40px;
        padding-left: 2%;
        width: 98%;
        border-bottom: 1px solid var(--secondary-border-color);
        float: left
    }

    .legend_sec_error ul li {
        background: url(../images/time-tracking/info_icon.png) 0 8px no-repeat;
        color: #000;
        display: block;
        float: left;
        padding: 10px 18px 6px 30px;
        width: 90%
    }

    .total_row .total .selectbox_bg_small.po_select {
        background: url(../images/time-tracking/sml_select_bg.gif) right -58px no-repeat;
        width: 175px;
        border-left: 1px solid #e1e0e0;
        border-radius: 5px 0 0 5px
    }

    .total_row .total .additional_charges label.title.po_text {
        left: -30px
    }

    .comment_top_container {
        border-top: 1px solid var(--secondary-border-color)
    }

    .apply_credit_head h4, .comment_top_container h3, .po_ref .head_top h3 {
        color: #535353;
        float: left;
        font-size: 14px;
        font-weight: 400;
        padding: 11px 0;
        text-transform: uppercase;
        width: auto
    }

    .po_ref {
        float: left;
        width: 100%;
        border: 1px solid var(--secondary-border-color);
        border-bottom: 0;
        margin-bottom: 25px
    }

    #credit_apply ul, .po_ref ul {
        float: left;
        width: 100%;
        list-style: none
    }

    .po_ref ul li {
        float: left;
        width: 94%;
        padding: 5px 3%;
        border-bottom: 1px solid var(--secondary-border-color)
    }

    .po_ref ul li h4 {
        float: left;
        width: 16px;
        height: 16px;
        background: url(../images/invoice_ic.png) no-repeat;
        margin-right: 15px
    }

    .po_ref ul li h3 {
        float: left;
        width: 16px;
        height: 16px;
        background: url(../images/attachment.png) no-repeat;
        margin-right: 15px
    }

    .po_ref ul li small.file {
        width: 340px;
        float: left;
        overflow: auto;
        margin-right: 20px
    }

    .po_ref ul li a.filename {
        float: left;
        width: auto;
        color: #ed4e00;
        font-size: 12px;
        text-decoration: none;
        margin-right: 5px
    }

    .po_ref ul li span.filetype, .po_ref ul li span.filetype01 {
        color: #b2b0b0;
        margin-right: 20px;
        float: left;
        font-size: 12px;
        overflow: auto
    }

    .po_ref ul li span.filetype {
        width: 80px
    }

    .po_ref ul li span.filetype01 {
        width: 340px
    }

    .po_ref ul li a.remove_attachment {
        float: left;
        width: 10px;
        margin-top: 5px;
        height: 10px;
        background: url(../images/remove_file.png) no-repeat;
        text-indent: -9999px
    }

    .successfile_remove {
        float: left;
        width: 840px;
        background: #c1e765
    }

    #clickComment, .form-item, .form-item label {
        width: 100%;
        float: left
    }

    .successfile_remove span {
        float: left;
        background: url(../images/success_remove_icon.png) no-repeat;
        color: #000;
        height: 16px;
        line-height: 16px;
        padding-left: 30px
    }

    .form-item {
        padding-top: 15px
    }

    .form-item label {
        font-weight: 500
    }

    #frmInvoiceDocumentUpload .form-item, #frmPODocumentUpload .form-item {
        padding-left: 15px
    }

    .total_row div.last_row {
        float: right;
        margin: 10px 20px 0 0
    }

    .total_row div.last_row .check {
        float: left;
        width: auto;
        line-height: 14px;
        margin: 3px 10px 0 0;
        display: inline
    }

    .total_row div.last_row label.note {
        float: left;
        width: auto;
        font-size: 12px;
        color: #535353
    }

    .proceed_row_inner.credit_note_comment {
        float: left;
        width: 90%;
        padding: 7px 0 0 88px
    }

    .proceed_row_inner .button012 button.blk_button, .proceed_row_inner .button012 input.blk_button {
        height: 24px;
        padding: 0 7px;
        margin-right: 5px
    }

    .proceed_row_inner .button012 button.save_blk_btn, .proceed_row_inner .button012 input.save_blk_btn {
        height: 24px;
        padding: 0 7px
    }

    .account_tableheading.cr_pad_list {
        padding: 5px 0 5px 12px
    }

    #clickComment {
        color: var(--primary-theme-color);
        font-size: 14px;
        font-weight: 400;
        cursor: pointer;
        text-decoration: underline;
        margin-bottom: 15px
    }

    #divComment .input_bg_pref_text_area {
        float: left;
        width: 97%;
        padding: 5px 13px
    }

    #divComment .input_bg_pref_text_area label {
        float: left;
        width: 10%;
        font-weight: 500
    }

    #divComment .input_bg_pref_text_area textarea.text {
        background: #fff;
        border: 1px solid #e1e0e0;
        color: #818181;
        float: left;
        font-size: 12px;
        height: 76px;
        margin: 0;
        padding: 3px;
        width: 360px
    }

    #divComment .input_bg_pref_text_area div.button01 {
        float: left;
        width: 80%;
        padding: 15px 0 5px 85px
    }

    #divComment .input_bg_pref_text_area div.button01 .blk_button, #divComment .input_bg_pref_text_area div.button01 .orange_button {
        margin-right: 10px;
        height: 26px;
        padding: 0 10px
    }

    #credit_apply {
        float: left;
        width: 948px;
        border: 1px solid #dcdcdc;
        padding: 15px
    }

    #credit_apply ul li {
        float: left;
        width: 50%;
        padding: 2px 0
    }

    #credit_apply ul li span {
        float: left;
        width: 30%
    }

    #credit_apply ul li strong {
        float: left;
        width: 35%
    }

    .apply_credit_head {
        background: #ececec;
        float: left;
        height: 40px;
        width: 963px;
        border: 1px solid #e1e1e1;
        margin-top: 25px;
        padding-left: 15px
    }

    .apply_credit_head01 {
        background: #ececec !important;
        height: 40px;
        width: 906px !important;
        border-radius: 0 0 5px 5px;
        border: 1px solid #e1e1e1 !important;
        margin: 0 !important;
        border-top: 0 !important
    }

    table.estimates tr td.fifth input.input {
        float: right;
        width: 263px;
        background: #fff;
        border: 1px solid #d6d6d6;
        color: #818181;
        display: block;
        font-size: 12px;
        height: 18px;
        padding: 3px;
        border-radius: 5px;
        text-align: right
    }

    .sign_notification {
        float: left;
        width: 87%;
        background: #fff5c3;
        border: 1px solid #efbc8a;
        padding: 10px;
        color: #090909;
        font-size: 12px
    }

    #dueInvoice {
        background: #f9f9f9;
        float: left;
        padding: 0 0 3px;
        width: 100%;
        margin: 10px 0 0;
        border: 1px solid #ccc;
        display: none
    }

    #dueInvoice .due_inv_heading {
        color: #535353;
        background: #f5f5f5;
        min-height: 25px;
        /* text-transform: uppercase; */
        padding: 7px 0 7px 2%;
        width: 98%
    }

    #dueInvoice .due_inv_heading a {
        text-transform: none;
        text-decoration: none;
        color: #ed4e00;
        float: right;
        padding-right: 15px;
        font-size: 14px;
        line-height: 25px
    }

    /* #dueInvoice .due_inv_heading span {
        color: #090909;
        float: right;
        margin: 5px 2% 0 0
    } */

    .dueinvoice_list {
        float: left;
        width: 100%;
        max-height: 110px;
        overflow: auto
    }

    ul.dueinvoice_list_head {
        float: left;
        width: 100%;
        background: #ececec;
        list-style: none
    }

    ul.dueinvoice_list_head li {
        float: left;
        width: 100%;
        padding: 5px 0
    }

    .dueinvoice_list li {
        float: left;
        width: 100%;
        padding-top: 9px
    }

    .dueinvoice_list li span.check, ul.dueinvoice_list_head li span.check {
        float: left;
        width: 5%;
        margin: 3px 1% 0
    }

    .dueinvoice_list li span.inv_no, ul.dueinvoice_list_head li span.inv_no {
        float: left;
        width: 40%
    }

    .dueinvoice_list li span.no_format, ul.dueinvoice_list_head li span.no_format {
        float: left;
        width: 20%;
        margin-right: 18%;
        text-align: center
    }

    .dueinvoice_list li span.datetime, ul.dueinvoice_list_head li span.datetime {
        float: left;
        width: 14%
    }

    .send_due_invoice_btn {
        border: 1px solid #b6b6b8;
        float: left;
        width: 83px;
        text-align: center;
        color: #515151;
        margin: 0 0 10px 10px;
        text-decoration: none
    }

    .send_due_invoice_btn:hover {
        border: 1px solid #b7b7b7
    }

    .help_due_invoice {
        display: inline-block;
        background: url(../images/helpIconNew.png) center center no-repeat rgba(0, 0, 0, 0) !important;
        float: none !important;
        margin: 0 0 0 5px;
        vertical-align: middle;
        min-width: 7px;
        width: 23px
    }
}

@media print {
    #body_container, body {
        background: 0 0
    }

    #breadecrumb, #disputedBox, #footer1, #header, #invoice_history, #invoice_status_message, #ju_bbox, #outer_footer, #payment_section, #relatedData, #scrollingBar, .dispute_box_outer, .heading, .message, .template1_first_row, .template1_lower_tab {
        display: none
    }
}

#client_selectbox:focus, #frmClientCompanyName:focus, #frmCountry:focus {
    background: 0 0 !important;
    box-shadow: none
}

#ExpReciptHead h4 {
    color: var(--primary-text-color);
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize
}

#ExpReciptHead a.help {
    margin: 12px 0 0 15px;
    background: url(../image/helpIconNew.png) center center no-repeat !important
}

a.help {
    margin: 9px 9px 0 3px;
    background: url(../images/helpIconNew.png) center center no-repeat !important;
    width: 22px !important;
    height: 22px !important
}

#ExpReceiptID {
    padding: 0 0 10px
}

#ExpReceiptID .expense_attach input[type=checkbox], #ExpReceiptIDPrew .expense_attach input[type=checkbox] {
    float: left;
    width: auto;
    margin: 3px 8px 0 0
}

#ExpReceiptID .expense_attach a, #ExpReceiptIDPrew .expense_attach a {
    float: left;
    width: auto;
    color: #ed4e00;
    font-size: 12px;
    text-decoration: none
}

#ExpReceiptID .expense_attach a:hover, #ExpReceiptIDPrew .expense_attach a:hover {
    float: left;
    width: auto;
    color: #ed4e00;
    font-size: 12px;
    text-decoration: underline
}

#ExpReceiptID .expense_attach p, #ExpReceiptIDPrew .expense_attach p {
    float: left;
    width: auto;
    padding: 0 10px
}

#ExpReciptHeadPrevw {
    float: left;
    width: 904px;
    margin: 15px 0 0
}

#ExpReciptHeadPrevw span {
    float: left;
    width: auto;
    text-indent: 15px;
    text-transform: uppercase;
    color: #535353;
    text-decoration: underline
}

#ExpReceiptIDPrew {
    float: left;
    width: 904px;
    padding: 0 0 10px
}

#ExpReceiptIDPrew .expense_attach {
    float: left;
    width: 46%;
    margin: 15px 0 0 15px
}

#reminder_management #searchDiv1 .gray_box .search_row1 .search_column1 .search_col_row1 .ui-combobox input {
    width: 84px
}

#reminder_management #searchDiv1 .gray_box .search_row1 .search_column2 .search_col_row1 .ui-combobox input {
    width: 99px
}

ul.ul_id_frmreminderType {
    width: 118px !important;
    position: absolute !important
}

ul.ul_id_frmReminderOcurrance {
    width: 133px !important;
    position: absolute !important
}

#body_container_inner #content_container #invoice_sec .no_record_found {
    margin: 0 0 15px 20px
}

ul.ul_id_frmReportOrderBy, ul.ul_id_frmReportSortBy {
    float: left;
    width: 123px !important
}

ul.companyDropDown, ul.countryDropDown, ul.currencyDropDown {
    background: #fff;
    height: 100px !important;
    line-height: 22px;
    min-height: 200px;
    max-height: 100px !important;
    overflow-x: hidden;
    padding-left: 0;
    text-align: left;
    width: auto;
    z-index: 99997;
    float: left;
    position: relative;
    left: 0
}

.close {
    background: url(http://localhost/invoicera/common/orange_theme/images/time-tracking/cross_btn.png) left top no-repeat;
    display: block;
    float: left;
    height: 12px;
    margin-top: 2px;
    width: 11px
}

ul.companyDropDown {
    width: 98%;
    min-width: 272px;
    top: 49px;
    filter: drop-shadow(0px 2px 10px rgba(57, 35, 195, .15)) !important
}

ul.companyDropDown li {
    float: none;
    list-style: none;
    padding: 10px 15px;
    /* height: 43px; */
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #4F5A63;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 25px;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
}

ul.companyDropDown li:hover {
    background: #fff7f1;
    cursor: pointer;
    width: 100%;
    color: var(--primary-theme-color)
}

ul.companyDropDown li.active, ul.currencyDropDown li.active {
    background: #F9FAFB !important;
    color: #f76600 !important;
    cursor: pointer;
    float: left;
    width: 100%
}

ul.currencyDropDown {
    border: 1px solid #ccc;
    max-width: 100%;
    top: 47px
}

#currency_box, #in_temp_container_inner.new_in_temp_container_inner, #in_temp_container_outer.irp_outer, .navInv .container .nav2 ul.myProfile li, .tab {
    width: 100%
}

#currency_box ul.currencyDropDown {
    top: 29px;
    max-height: 100px;
    width: 100% !important
}

#currency_box ul.currencyDropDown>li {
    text-indent: 5px
}

#currency_box  ul.currencyDropDown li {
    float: none;
    list-style: none;
    padding: 10px 15px;
    /* height: 43px; */
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #4F5A63;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 25px;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
}


ul.currencyDropDown li:hover {
    background: #eee;
    cursor: pointer;
    width: 100%
}

ul.countryDropDown li.active, ul.countryDropDown li:hover {
    background: #fff7f1 !important;
    cursor: pointer;
    width: 100%;
    color: var(--primary-theme-color)
}

ul.countryDropDown {
    border: none;
    max-width: 100%;
    min-width: 272px;
    top: 42px;
    box-shadow: 0 2px 10px 1px rgba(57, 35, 195, .15) !important;
    scrollbar-width: thin
}

ul.countryDropDown li {
    float: none;
    list-style: none;
    padding: 10px 15px;
    /* height: 43px; */
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #4F5A63;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 25px;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
}

ul.countryDropDown li.active {
    float: left
}

@media only screen and (max-width:1500px) {
    #footer span {
        font-size: 10px
    }
}

@media only screen and (max-width:1024px) {
    .showDragHandle a.drag_row, .showDragHandle a.remove_row {
        float: right;
        text-decoration: none;
        display: inline;
        height: 25px
    }

    .menu_sec {
        width: 984px;
        margin: 0 auto
    }

    .invoice_table tr td.dragHandle {
        height: 24px;
        margin: 5px 0 0;
        left: 0;
        padding: 0;
        width: 52px;
        position: absolute;
        border: none
    }

    .invoice_table tr td.showDragHandle {
        width: 58px;
        height: 25px;
        float: left;
        background: url(../images/time-tracking/lisiting_rt_btn1.png) no-repeat;
        border: none
    }

    .showDragHandle a.drag_row {
        width: 16px;
        margin: 0 7px 0 4px;
        cursor: move
    }

    .showDragHandle a.remove_row {
        width: 25px;
        margin: 0 3px 0 0
    }
}

.common_minus_img, .common_minus_img.new, .common_plus_img, .common_plus_img.new {
    height: 26px;
    margin: 0 9px 0 0;
    width: 27px;
    float: left;
    text-decoration: none;
    display: inline
}

.common_plus_img {
    background: url(../images/time-tracking/plus_sign.gif) no-repeat
}

.common_plus_img.new {
    background: url(../../images/expand.svg) no-repeat
}

.common_minus_img.new {
    background: url(../images/time-tracking/collapse.svg) 0 bottom no-repeat
}

.common_minus_img {
    background: url(../images/time-tracking/plus_sign.gif) 0 bottom no-repeat
}

#as_download, .mendatory, .start_stop_btn {
    margin-right: 10px
}

#footer, #footer *, .login_message p.index_message {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box
}

.newCenter {
    width: 100%;
    float: left;
    min-height: 50px;
    background: #515151;
    padding: 8px 0;
    text-align: center
}

#header, .top_nav {
    /* min-height: 56px */
}

.newCenter a {
    display: inline-block;
    vertical-align: middle;
    margin: 0 7px
}

#footer .center ul.centerUl {
    width: 60%;
    text-align: center
}

#footer .copyRightSpan {
    width: 20.5%;
    float: left
}

.mailSectionInfo, .part_b .radio_section, ul.centerUl {
    display: flex;
    gap: 20px
}

ul.centerUl li {
    list-style: none;
    color: #525f7f;
    font-size: 14px
}

ul.centerUl li a {
    text-decoration: none;
    color: #525f7f;
    font-size: 14px
}

ul.centerUl li a:hover {
    color: var(--primary-theme-color);
    text-decoration: underline
}

.rightLogo {
    padding: 0 10px;
    width: 15%;
    float: right;
    text-align: right
}

.rightLogo img {
    float: none;
    max-width: 100%
}

.top_nav {
    float: right;
    width: auto;
    background: #ff6d01;
    padding-left: 15px
}

.top_nav * {
    font-weight: 400 !important
}

.dashboard_top_shadow #content_container {
    box-shadow: 0 0;
    -moz-box-shadow: 0 0;
    border-width: 0 !important
}

table#task_container {
    box-shadow: none !important;
    border-width: 0 !important
}

#send_mail, #send_mail_container, .error_container {
    margin-bottom: 0 !important
}

.add_new_section ul.adjust_credit li .col_2 .select_bg>input.txt, .billing_add, .content_right .invoice_notes, .invoice_table_outer, .search_row1 {
    border-width: 0 !important
}

.invoice_table tr.head {
    background: #f1f1f1 !important;
    border: none;
    color: #3c3c3c !important;
    float: left;
    font-size: 13px;
    font-weight: 400;
    width: 100%
}

.invoice_table tr.head th {
    font-size: 13px !important
}

.total_row ul.options li a span small.add_line {
    font-size: 16px !important;
    font-weight: 400 !important
}

.total_row .total label.title strong {
    color: #000;
    font-size: 15px !important
}

.reports_colum1>label, .total_row .net_balance label.title_total span, .total_row .net_balance01 .net_balance012 .net_balance label.price_total input[type=text] {
    color: #000 !important;
    font-weight: 400 !important
}

.total_row .net_balance01, .total_row .net_balance01 .net_balance012 {
    border-width: 0 !important;
    background: #f1f1f1 !important
}

.content_right .head_row {
    background: #f0f0f0 !important;
    max-width: 100%
}

#pgHelp .head_row h3, .content_right .head_row h3, .content_right .invoice_notes label {
    color: #000 !important;
    font-weight: 400 !important;
    font-size: 15px !important
}

.allocate_client h2, .billing_add h2 span.head {
    font-weight: 400 !important;
    font-size: 15px !important;
    border-width: 0 !important
}

#invoice_container_rec_inner .auto_bill .year_bg, #invoice_make_payement .invoice_sage .client_detail .selectbox_bg_month, #invoice_make_payement .invoice_sage .client_detail .selectbox_bg_year, #list_actions, #taxes_data .selectbox_bg1, .cancel_acc_box .row .select_box, .client_form_row .select_bg_new1, .date_bg_tax, .inv_add_inp, .invoice_table tr td.col2 .input_bg_list_outer input[type=text]:focus, .optional_sec .gray_box .selectbox_payment.paymentNew .newListSelected, .select_bg, .select_bg2, .select_bg_pop, .select_box1, .select_box_big, .select_box_date, .selectbox_bg, .selectbox_bg01, .selectbox_bg2, .selectbox_bg_new, .selectbox_bg_new01, .selectbox_bg_small, .selectbox_big, .selectbox_payment, .selectbox_pop, .selectbox_small, .ui-select {
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -o-border-radius: 2px;
    -khtml-border-radius: 2px;
    -ms-border-radius: 2px;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff !important;
    border: 1px solid var(--primary-border-color)
}

.ui-combobox>input.inv_add_inp {
    background: 0 0 !important;
    border-width: 0 !important
}

.content_right .invoice_notes textarea {
    background: #fff !important;
    border: 1px solid #d7d7d7 !important
}

.reports_colum1>label {
    font-size: 13px !important;
    line-height: 22px !important
}

#estimates_management, #expense_management {
    margin-top: 0;
    padding-bottom: 0
}

.proceed_row .lft-single, button#btnClientAccount {
    margin-left: 10px
}

#add_client .account_sec .submit_btn button.load_client, #invoice_container_inner #clientExpense .top_button ul li a, #service_add_sec_inner ul.button li a, .edit_profile ul.edit_btn li a, .green_btn, .import_sec ul.options li a, .quick_bar_link, .save_btn {
    background: #5c9f00 !important;
    color: #fff;
    cursor: pointer;
    border-width: 0 !important;
    float: left;
    min-height: 36px;
    padding: 0 15px;
    text-decoration: none;
    width: auto;
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    -khtml-border-radius: 0px !important;
    margin-left: 10px;
    margin-bottom: 10px
}

#service_add_sec_inner ul.button li a:hover, .import_sec ul.options li a:hover {
    background: #6ca919 !important
}

.save__green_btn, .save_orange_btn {
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    -khtml-border-radius: 0px !important
}

#preferences_tab_data1 label {
    font-weight: 400;
    font-size: 13px
}

.logo p {
    margin: 0
}

.tab div#ddtabs>ul>li, .tab ul.tabbing li, .tab ul.tabbing_report li {
    margin-right: 0 !important;
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    -khtml-border-radius: 0px !important
}

.tab ul.tabbing li a.current, .tab ul.tabbing_report li a.current, .tab>div#ddtabs ul li a.current {
    position: relative;
    font-weight: 400 !important;
    color: var(--primary-theme-color) !important;
    font-size: 14px
}

.as_layout #account_container_inner, .hero .header div .date, .hero .header div .widgets, .navInvHead .container, .navInvHead .container .nav1, .relateMedia, .tab>div#ddtabs {
    position: relative
}

.invoice_notes .content_left .col2, .staff_allocation .tab>div#ddtabs, .table-responsive .estimates {
    margin-top: 0
}

.allocate_client {
    padding-bottom: 10px;
    border-width: 0 !important
}

.invoice_notes .col2, .options_row3 {
    margin-top: 10px
}

.delete_icon a.delete, .delete_icon1 a.delete, .delete_icon2 a.delete {
    background: url(../../../images/Dlt.svg) 0 0/100% 100% no-repeat !important;
    height: 17px !important
}

.delete_icon_new, .details_section_inner, .hero .header div {
    display: flex;
    gap: 10px
}

#as_download ul, #closeMainNav, #header_login .top_nav, #menu ul li.dashboard a span, #poFrm .checkdisplay, #timeZn .newListSelected+.newListSelected, #timer_link .timerActiveImg, #timer_link .timerActiveImgHover, #timer_link .timerPauseImgHover, #timer_link.active-timer .timerActiveImgHover, #timer_link.active-timer .timerPauseImg, #timer_link.active-timer .timerPauseImgHover, #timer_link.active-timer:hover .timerActiveImg, #timer_link:hover .timerPauseImg, .QuickLinksMobile, .adv_search_help, .displayNone, .fSignup .curve, .fSignup .curve_bot, .mobileMenu, .navInv .container .logo .mobileNavMenu, .navInv .container .nav1 li .active img.normal, .navInv .container .nav1 li a img.mobileimg, .navInv .container .nav1 li a img.subnavmenu, .navInv .container .nav1 li a:hover img.normal, .navInv .container .nav2 ul li a img#settingRotImg, .navInv .container .nav2 ul li a img.img2, .navInv .container .nav2 ul li button img.img2, .navInv .container .nav2 ul li:hover a img.img1, .navInv .container .nav2 ul li:hover button img.img1, .navInvHead .container .mobilenav2, .part_b .radio_section input[type=radio], .payHistory tbody tr.tabledata td label, .selectbox_bg .newListSelected+.newListSelected, .tooltips-container .tooltips2, .tooltips-container:hover .tooltips1, div.error_pad {
    display: none
}

.delete_icon a.deleteSchedule {
    display: flex;
    width: 17px;
    height: auto !important
}

.delete_icon input.schedInv {
    background: url(../../../images/calender.svg) 95% center no-repeat
}

.buttom_sec {
    border-top-width: 0 !important
}

#client_reports_form fieldset {
    border-width: 0 !important;
    background: #fff !important
}

#payment_section_inner {
    margin-top: 0;
    border-width: 0
}

div.error_pad {
    margin-bottom: 0 !important
}

.green_btn {
    background: #5c9f00 !important;
    border-width: 0 !important
}

th.form_headings {
    font-size: 14px !important
}

.start_stop_btn {
    margin-bottom: 10px
}

thead .table_head>th {
    font-size: 15px;
    color: #535353;
    line-height: 20px
}

* textarea, .importantInfo ul li, .ui-combobox.ci_addCustomer input {
    color: var(--primary-text-color)
}

.options_row_outer .options_row ul li a.nav_current {
    background: #474747 !important;
    color: #fff !important;
    border-color: #474747 !important
}

.options_row_outer {
    background: url(../images/unchecked_arrow_down.png) 21px 26px no-repeat #f2f2f2 !important;
    border-top: 1px solid #ddd !important;
    border-bottom: 1px solid #ddd !important;
    margin-top: 0 !important
}

.options_row_outer_boot {
    background: url(../images/unchecked_arrow_up.png) 20px 17px no-repeat #f2f2f2 !important
}

.options_row_outer .options_row>ul {
    padding-left: 35px !important
}

ul.options li.last a.green_btn {
    padding-right: 0 !important;
    line-height: 36px !important
}

ul.options li.last a.green_btn span {
    border-left: 1px solid #fff;
    padding: 1px 0
}

.alertmeassage ul.button li a span small.ok {
    background: url(../images/okbutton.png) no-repeat !important
}

.alertmeassage ul.button li a span small.cancel {
    background: url(../images/cancelBtn.png) no-repeat !important
}

.alertmeassage ul.button li a span small.cancel:hover, .alertmeassage ul.button li a span small.ok:hover {
    opacity: .9 !important
}

.quick_bar_link:hover, .tab li a.start_stop_btn:hover, a.daily:hover, a.monthly:hover {
    background-position: 0 0 !important;
    opacity: .9
}

.tooltips .tooltiptext, .tooltips6 .tooltiptext {
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s
}

.quick_bar_link {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.options_row .deleted_users {
    padding-top: 9px !important;
    background-position: 0 10px !important
}

.invoice_amount .invoice_amount_top ul li.mycustomised {
    float: right;
    margin-right: 10px !important
}

tr td.col6_1 .selectedTxt {
    font-size: 10px !important;
    height: 15px
}

.navInv .container .nav2 ul li button#toggleButton3 p, table tr td {
    font-size: 13px
}

table.ui-datepicker-calendar tr td {
    padding: 1px !important;
    border:none;
    width: 43px !important;
    height: 43px !important;
    box-sizing: border-box;
}

.header_top_section {
    z-index: 99999;
    box-shadow: 0 0 2px #000;
    -moz-box-shadow: 0 0 2px #000;
    -o-box-shadow: 0 0 2px #000;
    -webkit-box-shadow: 0 0 2px #000;
    -ms-box-shadow: 0 0 2px #000;
    background: #e45b00
}

#txtCaptcha {
    line-height: 34px;
    font-size: 26px;
    font-weight: bolder;
    text-decoration: line-through;
    font-style: italic;
    letter-spacing: -4px
}

#left_sec_login form label {
    padding-top: 6px !important;
    font-size: 13px
}

table tr td.col3 textarea, table tr td.col4 input.txt, table tr td.col5 input.txt, table tr td.col6 .outer_input input.input_discount1, table tr td.col6_1 .input_bg_text2_outer, table tr td.col7 .input_bg_text1_outer, table tr td.col8 .input_bg_text1_outer, table tr td.col9 input.txt {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.head_row a.help {
    margin-top: 9px !important
}

table.invoice_mgmt tr td.date {
    width: 110px !important
}

#client_address textarea#frmUserClientCompanyAddress, .mar_top .checkradios-checkbox {
    float: left !important
}

.mar_top .checkradios-checkbox+label {
    padding-top: 2px !important
}

.category_manag thead .table_head>th:first-child {
    padding-left: 10px;
    width: 30px
}

.category_manag thead .table_head>th:first-child .check, .newDiv, .search_col_row1 .checkbox, .send_invoice_report .checkbox_area .checkbox_inner .checkradios-checkbox, table.invoice_mgmt {
    float: left
}

#templateContent {
    border-left-width: 0;
    border-right-width: 0;
    margin-left: 0;
    width: 100%;
    border-radius: 0 !important
}

#templateContent.templateContent {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

tr.even {
    background: #fcfcfc !important
}

tr.even:hover, tr.odd:hover {
    background: #eaeaea !important
}

tr.odd {
    background: #f1f1f1 !important
}

.proceed_sectionNote {
    width: 100%;
    float: left;
    padding: 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box
}

#add_client .billing_add h2 .checkbox+span.head, #peopleWeb li a, .ui-combobox {
    padding-top: 2px
}

#send_invoice_mail *, .add_business_outer *, .fileUp ul li, .new_ui_popup *, .poInner *, .right_text_comp {
    box-sizing: border-box
}

.search_col_row1 .checkbox_container {
    max-width: 100%
}

.fg-menu-container {
    overflow: initial !important;
    background: #fff !important
}

.upgradeDivContent, .upgradeDivContent ul li {
    overflow: hidden;
    display: block
}

.fg-menu-container .menu_drop_top_arrow {
    left: 182px !important
}

#content_container_userlogin #txtCaptcha {
    display: inline-block;
    width: 70px
}

#content_container_userlogin .fa.fa-refresh {
    color: #e45b00;
    margin: 8px 0 8px 11px
}

table tr>td.options {
    width: 75px !important
}

.blockUI {
    background: rgba(66, 66, 66, .5) !important;
    z-index: 99999 !important
}

.checkradios-checkbox, .form_col1_inner .checkradios-checkbox, .settingDiv {
    float: left;
    margin-right: 5px
}

.rightBiggerCols {
    width: 623px !important
}

#popup_container .form_row a.help {
    margin-top: 3px !important
}

.content_left .additional_options .col1 a.preview {
    margin-left: 5px !important
}

#tooltip strong {
    font-size: 15px
}

.report_buttom_sec ul.button li a, .report_buttom_sec012 ul.button li a {
    float: left;
    width: auto;
    height: 38px !important;
    color: #fff;
    padding: 0 15px;
    cursor: pointer;
    text-decoration: none;
    background: #5c9f00;
    margin-left: 10px;
    border-width: 0
}

.blk_button:hover, .report_buttom_sec ul.button li a:hover, .report_buttom_sec012 ul.button li a:hover, .save__green_btn:hover {
    background: #6ca919
}

.edit_inv_est_rec_client_name {
    border-radius: 0 !important;
    overflow: hidden;
    min-height: 20px
}

.bottom_sec ul {
    border-width: 0 !important;
    margin-left: 0 !important
}

.right_text_comp {
    padding-left: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box
}

#invoice_container_rec_inner .auto_bill {
    width: 100% !important;
    max-width: 100% !important
}

#invoice_make_payement .enter_payement_heading {
    background: #e5e5e5 !important;
    border-width: 0 !important
}

.client_form_row .outer_select {
    position: relative;
    width: 236px
}

.client_form_row .outer_select #currency_box {
    top: 21px
}

#divLogTaskProject .SSContainerDivWrapper, #divLogUserName .SSContainerDivWrapper, #divTask .SSContainerDivWrapper {
    top: -2px !important
}

.select_box1 .ui-combobox {
    border-width: 0
}

.error_pad .sucess {
    width: 100% !important;
    border-radius: 5px !important;
    border: .5px solid #afe2b1 !important;
    background: #f2ffeb !important;
    overflow: hidden;
}

.error_pad .sucess .cancel_btn {
    border: none !important
}

.error_pad {
    box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box
}

#exchangeRateHelp>.help, #template_customization__frm #additional_help .help, .form_col1_inner #inventoryHelp .help, .martopZero, .no_marginTop {
    margin-top: 0 !important
}

.subscriptionPage .edit_profile2 {
    float: left;
    margin-left: 100px
}

.subscriptionPage .heading {
    padding-top: 30px
}

.subscriptionPage .heading h2 {
    padding-top: 0
}

#menu_frmMailMessage_frmMailMessage_fontselect_menu, #menu_frmMailMessage_frmMailMessage_fontsizeselect_menu, ul.clientDropDown, ul.itemDropDown {
    z-index: 99997 !important
}

.dashboard_top_shadow.dashboardOuterContainer {
    display: flex;
    flex-direction: column;
    align-items: center
}

.myHidden {
    -moz-box-shadow: -2px 1px 3px var(--secondary-border-color);
    -webkit-box-shadow: -2px 1px 3px var(--secondary-border-color);
    box-shadow: -2px 1px 3px var(--secondary-border-color);
    -ms-box-shadow: -2px 1px 3px var(--secondary-border-color);
    border: 1px solid #d6d6d6
}

#invoice_container_inner1 .error, .error_pad .error {
    width: 100%;
    margin: 10px 0 !important
}

.ui-combobox {
    float: left;
    height: 24px;
    padding-bottom: 2px;
    width: 271px;
    border: 1px solid #e1e0e0;
    border-radius: 2px;
    position: relative;
    background: url(../../../images/Path.svg) 97% center no-repeat #fff
}

.ui-combobox.addCustomer {
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    width: 394px;
    height: 37px
}

.ui-combobox.ci_addCustomer {
    background: url(../images/dropdown.png) 97% center no-repeat #fff
}

.add-customer .clientName, .ui-combobox.ci_addCustomer .clientName {
    height: 100%;
    color: var(--primary-text-color);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: center;
    padding-left: 10px
}

.add-customer .input_bg {
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    width: 394px;
    height: 32px
}

.ui-combobox.addCustomer .inv_addCustomer::placeholder {
    color: #667382;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.thrd_box {
    width: 386px;
    float: left;
    position: relative;
    margin: 20px 0 0 20px
}

.create_invoice_box3 {
    border-radius: 15px;
    background: no-repeat #fff;
    position: absolute;
    padding: 18px 20px;
    top: 27px;
    left: 17px;
    width: 315px;
    -moz-box-shadow: 2px 4px 1px 2px #c4c4c4;
    -webkit-box-shadow: 2px 4px 1px 2px #c4c4c4;
    box-shadow: 2px 4px 1px 2px #c4c4c4
}

.create_invoice_box4, .create_invoice_box5 {
    width: 98%;
    margin: 20px auto;
    background: #f1f1f1;
    float: left
}

.create_invoice_box4 {
    padding: 15px 10px;
    border-radius: 3px
}

.create_invoice_box5 {
    padding: 18px 10px;
    border-radius: 5px
}

.recieved_invoice_box {
    float: left;
    width: 100%
}

.recieved_estimate_box {
    width: 100%;
    float: left;
    position: relative
}

.green_btn_dash1 {
    float: right;
    background: #5c9f00 !important;
    border: 1px solid #789823;
    margin: 8px 8px 0 0;
    padding: 0 10px;
    text-align: left;
    width: auto
}

.green_btn_dash1 a {
    text-decoration: none;
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    line-height: 32px
}

.green_btn_dash1 span {
    float: right;
    height: auto;
    margin: 0 0 0 10px;
    width: auto
}

.display_outstanding {
    float: left;
    margin-top: 3px
}

.display_outstanding_box {
    float: right;
    margin: 4px 0 0 5px
}

.settingDiv>a.fg-button {
    font-size: 13px !important;
    color: #fff;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 34px;
    width: auto;
    padding-right: 23px !important;
    padding-left: 5px;
    text-transform: uppercase !important
}

.settingDiv>a.fg-button:hover {
    text-decoration: underline !important
}

.settingDiv>a>i {
    font-size: 20px
}

.settingDiv>a.fg-button>span.ui-icon {
    background: url(../images/setting_downArrow.png) right center no-repeat !important;
    top: 44%
}

#add_client .billing_add h2 .checkbox {
    margin-right: 5px
}

.allocate_client.no_bor {
    border-bottom: 1px solid #ddd !important
}

#import_exp_sec_tab_data1 .template_row .clear_both .outer_sec1 input.field_long.base_field {
    margin-left: 0
}

#currencyHelp .help {
    margin-top: 2px !important
}

#send_invoice_mail input.attachment#frmMailAttachment {
    width: 245px !important;
    margin-bottom: 3px
}

.what_s_this .quick_bar_link {
    background: 0 0 !important;
    padding: 0 !important;
    height: 25px !important
}

.input_est {
    background: rgba(0, 0, 0, 0);
    border: none;
    color: #818181;
    float: left;
    font-size: 12px;
    height: 27px !important;
    line-height: 20px !important;
    border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    padding: 0 0 0 4px
}

.week-calendar-time-slots td {
    padding: 0 !important
}

.add_new_section ul.adjust_credit li .col_2 input.amount_txt, .add_new_section ul.adjust_credit li .col_3 .textarea {
    margin-top: 3px;
    height: 28px !important;
    padding-top: 0 !important
}

.new_error_pad {
    width: 98% !important;
    margin-left: 1%
}

.new_error_pad .error, .new_error_pad .error .error_mid_box .inner_message_box.product {
    width: 100% !important;
    margin-left: 0 !important;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box
}

.error_mid_box .inner_message_box.product {
    width: 100%;
    box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

#menu.clientsMenu>ul>li {
    margin-right: 25px !important
}

#menu.clientsMenu ul li a span {
    padding-left: 0 !important
}

.table-responsive {
    width: 100%;
    float: left
}

.mobileMenu {
    color: #fff;
    padding: 10px;
    cursor: pointer;
    font-size: 25px;
    border-bottom: 1px solid #fff;
    line-height: 35px
}

.beforeLogin#header_login {
    width: 100% !important;
    margin-left: 0;
    background: #515153;
    min-height: 65px;
    margin-bottom: 20px
}

#in_temp_container_inner1, .add_business_inner.bn, .add_business_inner.bn input, .po_ref ul li, .upgrade_container_outer .error_container {
    width: 100% !important
}

.template1_first_row {
    width: 950px;
    margin-left: 0 !important
}

.InvPreBott, .bottomPricing, .manyDiv {
    width: 98%;
    float: left
}

.vAccountStatement {
    font-size: 25px !important;
    margin: 0 auto;
    background: #ff6d01 !important
}

.vAccountStatement a {
    color: #fff
}

.InvPreBott {
    background: #f0f0f0;
    margin-left: 10px
}

.bottomPricing {
    padding: 0 1%;
    display: flex;
    justify-content: space-between
}

.invoice_qr_section {
    display: flex;
    gap: 8px;
    padding-top: 10px;
    padding-left: 10px
}

.bottomPricing .qr_section img, .qr_section img {
    height: 100px;
    width: 100px
}

.details_section_inner label {
    font-weight: 700;
    font-size: 13px
}

.manyDiv {
    padding: 0 1%
}

.PricingTable {
    float: right;
    width: 35%
}

.InvPreBott .ternsLeft, .td_rel_position .second_colum {
    width: 51%;
    float: left
}

.InvPreBott .invoicenotest {
    width: 44%;
    float: right
}

.td_rel_position .left_colum {
    width: 45%;
    float: left
}

#invoice_template1 .company_logo {
    width: 15%;
    float: left
}

#invoice_template1 td.company_logo, #invoice_template1 td.left_colum, #invoice_template1 td.second_colum {
    float: none
}

#invoice_template1 .company_logo img {
    max-width: 100%;
    float: none
}

.td_rel_position .left_colum.withImage {
    width: 30%;
    float: left
}

input.hasDatepicker, input.hasDatepicker:focus {
    background: url(../../../images/calender.svg) 97% center no-repeat !important;
    cursor: pointer
}

.selectbox_bg input.hasDatepicker {
    background: 0 0
}

* textarea {
    float: none !important;
    font-weight: 400
}

.boxsized {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box
}

.edit_email_boxx {
    width: 470px;
    float: left
}

#invoice_management .options_row_outer1 {
    background: #f2f2f2
}

.ui-combobox input {
    border-width: 0 !important;
    background: #fff !important;
    text-indent: 5px;
    color: #818181;
    font-size: 12px;
    width: 80%;
    cursor: pointer
}

.blk_button, .save__green_btn, .save_btn {
    float: left;
    width: auto;
    height: 38px !important;
    color: #fff;
    padding: 0 15px;
    cursor: pointer;
    text-decoration: none;
    background: #5c9f00;
    margin-left: 10px;
    border-width: 0;
    border-radius: 0 !important
}

.blk_button .blk_button_img {
    float: left;
    background: 0 0;
    color: #fff;
    padding: 0;
    margin: 0
}

.add_credit_search .options_row3 ul li a.cancel, .orange_button, .save_blk_btn, .save_orange_btn {
    float: left;
    width: auto !important;
    height: 38px !important;
    border-width: 0;
    color: #fff !important;
    text-decoration: none;
    padding: 0 21px;
    cursor: pointer;
    background: #979797 !important;
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    -khtml-border-radius: 0px !important
}

.orange_button:hover, .save_blk_btn:hover, .save_orange_btn:hover {
    background: #a1a1a1
}

#expense_add_sec_inner .add_staff_box .button .save_btn, #import_search .add_staff_box .button .save_btn, #invoice_container_rec_inner .auto_bill label.options, .search_row2 .options_row3 ul li .save_btn {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    behavior: url(../images/border-radius.htc)
}

#add_client .selectbox_bg, #invoice_container_rec_inner .auto_bill .selectbox_bg_small, #invoice_container_rec_inner .auto_bill .year_bg, #invoice_make_payement .invoice_sage .client_detail .selectbox_bg, #invoice_make_payement .invoice_sage .client_detail .selectbox_bg_month, #invoice_make_payement .invoice_sage .client_detail .selectbox_bg_year, #invoice_make_payement_outer .client_detail .selectbox_bg, .invoice_sage .white_row .selectbox_bg {
    border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    -khtml-border-radius: 5px 0 0 5px;
    behavior: url(../images/border-radius.htc)
}

.send_invoice_report input.input_est:focus {
    border: 1px solid #d6d6d6 !important
}

#account_container_inner2 .statement input.field, #add_credit .topleft input.current_credit:focus, #expense_reports_form fieldset .reports_colum1 input.date:focus, #invoice_container_rec_inner .client_detail input.date:focus, #invoice_make_payement_outer .client_detail input.field:focus, #invoice_make_payement_outer .client_detail input.mid_text:focus, #invoice_search input.unit_input1:focus, #invoice_search input.unit_input:focus, #team_timesheet_container input.field:focus, #timetracking_reports_form fieldset .reports_colum1 input.date:focus, #tracking_new_task input.no_bg:focus, .content_left .additional_options .selectbox_bg input, .content_left .additional_options input.date:focus, .invoice_table tr td.col2 .input_bg_list_outer.product_sec_list .dhx_combo_box input[type=text]:focus, .invoice_table tr td.col9 input.txt:focus, .search_col_row2 .statement input.field:focus, .search_col_row2 .statement input:focus, .send_invoice_report input.field, .send_invoice_report input:focus, .total_row .net_balance label.price_total input[type=text], .total_row .total label.price input[type=text]:focus, .ui-combobox.client_inp .dhx_combo_box input[type=text] {
    border: 0 solid #878a8b !important;
    -webkit-box-shadow: 0 0 0 #007eff;
    -moz-box-shadow: 0 0 0 #007eff;
    -khtml-box-shadow: 0 0 0 #007eff;
    box-shadow: 0 0 0 #a4a6a7;
    outline: 0;
    border-radius: 0;
    -khtml-border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    behavior: url(../images/border-radius.htc)
}

#frmMailMessage_ifr {
    width: 100% !important;
    border-radius: 3px;
    color: var(--primary-text-color) !important
}

.help_doc .content {
    padding: 10px
}
.freeTrialAndSample{
    width: 100%;
    /* float: left; */
    min-height: 15px;
    position:absolute;
    right: 10px;
    z-index: 998;
    box-sizing: content-box;
    border-radius: 8px;
    border: 1px solid var(--primary-border-color);
    background: #F9FAFB;
    box-shadow: 0px 3px 6.4px 0px rgba(166, 166, 166, 0.14);

}
.upgradeNow{
    border-radius: 40px;
    background: var(--primary-border-color);
    padding: 5px 12px;
    box-sizing: border-box;
    text-decoration: none;
    font-size: 13px;
    color: var(--primary-main-heading);
    font-weight: 500;
    letter-spacing: 0.13px;
}

.topInfo {
    width: 100%;
    /* float: left; */
    min-height: 15px;
    padding: 8px;
    position:absolute;
    right: 10px;
    z-index: 998;
    box-sizing: content-box;
    border-radius: 8px;
    border: 1px solid var(--primary-border-color);
    background: #F9FAFB;
    box-shadow: 0px 3px 6.4px 0px rgba(166, 166, 166, 0.14);
}

.centerlayout {
    text-align: center;
    font-size: 13px;
    color: #333
}

.centerlayout .upgradeBttn {
    color: #e45b00;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.centerlayout .upgradeBttn:hover {
    color: #e45b00;
    text-decoration: none;
    border-bottom: none
}

.fg-button span.sup {
    position: relative !important;
    background: #fff;
    border-radius: 50%;
    color: #e45b00;
    display: inline-block;
    height: 16px;
    text-align: center;
    line-height: 16px;
    text-decoration: none;
    top: -18px;
    width: 16px;
    font-size: 10px;
    right: 10px
}

#new_notification {
    right: 0;
    cursor: pointer;
    font-size: 13px;
    max-width: 250px;
    padding: 5px;
    position: fixed;
    text-align: left;
    transition: top 650ms ease-in-out;
    width: 90%;
    z-index: 9999;
    display: none;
    bottom: 0;
    background-color: #dff0d8;
    border-bottom: 1px solid #d6e9c6;
    color: #3c763d;
    opacity: .9
}

#new_notification .not_msg {
    border: 2px solid #fff;
    padding: 5px;
    text-shadow: 0 1px 2px #fff
}

.settingDiv>a.fg-button.messagebtn {
    padding-right: 0 !important
}

.headingh2 {
    padding: 12px 20px 7px !important;
    background: #efefef;
    font-size: 13px;
    float: left;
    width: 100%
}

.headingh2 span.ptext {
    text-align: center;
    display: block;
    color: #3c3c3c;
    font-size: 12px
}

.upgradeDiv {
    float: right;
    position: relative;
    padding: 10px 20px
}

.upgradeDiv .upgradeButton {
    background: #9a3f02;
    padding: 0 30px;
    margin: 0
}

.upgradeDiv .upgradeButton:focus, .upgradeDiv .upgradeButton:hover {
    text-decoration: none;
    color: #fff;
    background: #ba4b00
}

.myHidden.upgradeNowDiv {
    right: 20px;
    left: inherit;
    top: calc(100% + 9px);
    width: 750px;
    padding: 30px 20px;
    z-index: 1000
}

.upgradeNowDiv .menu_drop_top_arrow {
    right: 40px;
    left: inherit
}

.upgradeDivImg {
    float: left;
    margin-right: 20px;
    padding-top: 30px
}

.upgradeDivContent ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%
}

.upgradeDivContent ul li {
    line-height: 24px;
    font-size: 13px;
    color: #ba4b00;
    padding-left: 18px;
    background: url(../images/green_tick.png) left 7px no-repeat
}

.upgradeDivContent ul li:first-child {
    font-weight: 700 !important;
    font-size: 16px;
    border-bottom: 1px solid #e2e2e2;
    padding: 0 0 13px;
    margin-bottom: 10px;
    color: #333;
    background: 0 0
}

.upgradeDivContent ul li:last-child {
    background: 0 0;
    margin-top: 20px
}

.upgradeDivContent ul li:last-child span {
    float: left;
    margin: 8px 0 0 10px
}

.upgradeDivContent ul li:last-child span a {
    color: #333
}

.padlefrig50 {
    padding: 0 40px;
    margin-left: 0
}

.useGlbOut, .useLclOut {
    float: right;
    width: auto;
    padding-right: 20px;
    color: #ed4e00
}

input[readonly=readonly].addFldReadonly {
    border: 0 !important;
    color: transparent !important;
    text-shadow: 0 0 0 #000 !important;
    background: 0 0 !important
}

.useGlbOut {
    font: 11px/22px Arial, Helvetica, sans-serif
}

.useGlbOut a, .useLclOut a {
    float: left;
    display: inline-block;
    padding: 0 10px;
    line-height: 28px;
    color: #dc7800;
    font-size: 15px
}

.useLclOut {
    display: none;
    font: 11px/22px Arial, Helvetica, sans-serif
}

.navInv .container .nav1 li button, .navInv .container .nav1 ul.mainnav1 li a, .navInvHead .container .nav1 li a.hname {
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    text-transform: uppercase
}

#ui-datepicker-div.as_dateFilter .ui-datepicker-header select, #ui-datepicker-div.as_dateFilter .ui-datepicker-header select option, .mandate-f {
    color: #000
}

#popup_container .tabs .newListSelected li a {
    margin-right: 0
}

.posiQuestion {
    position: absolute;
    right: 10%;
    top: 13px
}

@media (max-width:767px) {
    .defaultSkin .mceListBox .mceText {
        width: 50px !important
    }

    .defaultSkin table.mceToolbar {
        margin-right: 3px !important
    }

    #pop_up_container_new .alertmeassage ul.button li a span small {
        margin-bottom: 0
    }

    .po_ref ul li small.file, .po_ref ul li span.filetype, .po_ref ul li span.filetype01 {
        width: auto !important;
        margin-right: 10px !important
    }
}

#pop_up_container_new .alertmeassage ul.button li a span small {
    height: 35px !important
}

.fSignup #pop_up_container {
    width: 730px
}

.fSignup #pop_up_container .left_shadow {
    padding: 20px 25px
}

.fSignup #pop_up_container .content_area {
    width: 100%;
    margin: 0
}

.fSignup #pop_up_container .content_area .content_row1 h3 {
    font-size: 17px;
    text-align: center
}

.fSignup #content_section_tab_data1 .template_row, .fSignup #content_section_tab_data1 .template_row2 {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    border: 0
}

.fSignup #content_section_inner .content_sec_tab1 {
    margin: 35px 0
}

.fSignup #content_section_inner .buttom_sec {
    padding: 0
}

.fSignup .blk_button {
    margin-left: 250px;
    width: 120px
}

.fSignup #content_section_tab_data1 .template_row .form_row, .fSignup #content_section_tab_data1 .template_row2 .form_row {
    width: 100%;
    display: table;
    padding-bottom: 20px
}

.fSignup #content_section_tab_data1 .template_row label, .fSignup #content_section_tab_data1 .template_row2 label {
    display: table-cell;
    float: none;
    padding: 0 20px;
    vertical-align: middle;
    width: 250px
}

.fSignup #content_section_tab_data1 .template_row .outer_input, .fSignup #content_section_tab_data1 .template_row2 .outer_input {
    display: table-cell;
    float: none;
    width: auto
}

.fSignup #content_section_tab_data1 .select_bg_pop {
    height: 40px;
    width: 295px;
    padding: 0
}

.fSignup #content_section_tab_data1 .newListSelected {
    padding: 8px !important;
    height: auto !important
}

.fSignup #content_section_tab_data1 .newListSelected ul.newList {
    top: 100% !important
}

.fSignup #content_section_tab_data1 .template_row2 textarea {
    background: #fff;
    height: 60px;
    width: 300px
}

.mandate-f {
    line-height: 37px;
    width: auto;
    float: left;
    padding-left: 50px
}

.file-UP, .fileUP {
    color: #999;
    font-size: 10px;
    padding-top: 7px;
    width: 300px;
    margin-top: 10px;
    float: left
}

.fSignup span.error_msg {
    width: 100%;
    margin: 5px 0 0
}

a.help-approval, a.help-approval.info {
    height: 22px !important;
    width: 22px !important;
    font-size: 0px
}

#content_section_tab_data1 .template_row2 input[type=file] {
    border: 0;
    height: auto;
    width: auto
}

.fSignup #content_section_tab_data1 .template_row2 label.upContent {
    padding-top: 6px;
    vertical-align: top
}

.fileUP {
    border-top: 1px solid #e9e9e9
}

.file-UP {
    text-align: left
}

@media(max-width:767px) {
    .fSignup #pop_up_container {
        width: 450px
    }

    .fSignup #content_section_tab_data1 .template_row label, .fSignup #content_section_tab_data1 .template_row2 label {
        width: 100%;
        float: left;
        text-align: left;
        margin-bottom: 5px
    }

    .fSignup #content_section_tab_data1 .template_row .outer_input, .fSignup #content_section_tab_data1 .template_row2 .outer_input {
        width: 100%;
        float: left;
        padding: 0 25px
    }

    .fSignup #content_section_inner .buttom_sec, .fSignup #content_section_tab_data1 .select_bg_pop, .fileUP {
        width: 100%
    }

    .fSignup .blk_button {
        margin-left: 25px
    }

    .fSignup #content_section_tab_data1 .template_row2 label.upContent {
        padding-top: 0
    }

    #addInventory #popup_container .content {
        max-height: 500px;
        width: 100%
    }

    #popup_container .tabs .descriptions.border #content_section_tab_data1 table {
        height: 250px !important
    }

    .blockUI.blockMsg.blockPage {
        width: 85% !important
    }
}

@media(max-width:479px) {
    .fSignup #pop_up_container {
        width: 300px
    }

    .fSignup #pop_up_container .left_shadow {
        padding: 20px 15px
    }

    .fSignup #content_section_tab_data1 .template_row .outer_input, .fSignup #content_section_tab_data1 .template_row label, .fSignup #content_section_tab_data1 .template_row2 .outer_input, .fSignup #content_section_tab_data1 .template_row2 label {
        padding: 0 15px
    }

    .fSignup .blk_button {
        margin-left: 15px;
        width: 100px
    }

    .mandate-f {
        font-size: 11px;
        padding: 0 15px 0 0;
        float: right
    }
}

.private_btn {
    float: right;
    width: auto !important;
    height: 33px !important;
    border-width: 0;
    color: #fff !important;
    text-decoration: none;
    padding: 0 21px;
    cursor: pointer;
    background: #7ba90e !important;
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0px !important;
    -o-border-radius: 0 !important;
    -ms-border-radius: 0px !important;
    -khtml-border-radius: 0px !important
}

textarea#private_comments {
    resize: none;
    padding: 15px
}

a.help-approval {
    background: url("../images/time-tracking/info_icon.png") center center no-repeat !important;
    margin: -3px 9px 0 3px;
    display: inline-block
}

a.help-approval.info {
    background: url("../images/time-tracking/info.svg") center center no-repeat !important
}

.input-wid {
    width: 20px !important
}

.label-wid {
    width: 325px !important
}

.font-style {
    font-weight: 700 !important
}

/* .navInv {
    width: 100%;
    background: #f6f8fa;
    padding-bottom: 7px;
    position: relative;
    border-bottom: 1px solid #e2e8f0
} */

.navInvHead {
    display: flex;
    justify-content: center
}

#nav1 #closeMainNav, .trial-tooltips::after {
    visibility: hidden
}

/* .navInv .container {
    display: flex;
    padding-top: 10px;
    align-items: center;
    width: 100%;
    max-width: 1385px;
    gap: 34px
} */

.navInv .clientContainer {
    justify-content: space-between;
    position: relative
}

.navInv .container .logo {
    width: 115px;
    margin-right: 22px;
    background: 0 0 !important;
    width: fit-content !important
}

.navInv .container .clientLogo {
    margin-right: 64px
}

#mainnav1, .navInv .container .nav1 {
    display: flex;
    justify-content: space-between;
    width: 100%
}

.navInv .container .nav1 ul {
    list-style: none;
    display: flex
}

.navInvHead .container .nav1 ul {
    align-items: center;
    gap: 32px
}

.navInv .container .nav1 ul.logout, .navInv .container .nav1 ul.mainnav1 {
    align-items: center
}

.navInv .container .nav1 ul.mainnav1 li a {
    color: #424653;
    font-weight: 400
}

.navInvHead .container .nav1 li a.hname {
    text-decoration: none;
    color: var(--primary-text-color) !important;
    font-weight: 500;
    border-radius: 5px;
    display: flex;
    gap: 5px;
    align-items: center;
    padding: 5px 10px
}

.navInv .container .nav1 li button {
    color: #424653;
    font-weight: 400;
    margin-right: 32px
}

.navInv .container .nav1 li a img {
    width: 10px;
    height: 10px
}

.navInv .container .nav1 li a.add:hover, .navInv .container .nav1 li.active a:hover {
    color: var(--primary-theme-color) !important;
    border-radius: 39px;
    background: rgba(255, 191, 146, .17)
}

.navInv .container .nav1 li a:hover img.hover, .navInv .container .nav1 li.active img.selected, .navInv .container .nav1 li.nav-link.active img.selected {
    display: block !important
}

#timer_link.active-timer .timerActiveImg, #timer_link.active-timer:hover .timerActiveImgHover, #timer_link:hover .timerPauseImgHover, .navInv .container .nav1 li a img.img1, .tooltips-container:hover .tooltips2 {
    display: block
}

.navInv .container .nav1 li.active.nav-link {
    display: flex;
    padding: 5px px;
    justify-content: center;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: var(--primary-theme-color) !important;
    color: #fff !important
}

.mainfilters label.filtertxt, .myProfile .organizationDiv .cname a {
    color: var(--primary-text-color);
    font-size: 14px;
    line-height: normal;
    font-weight: 400;
    font-style: normal
}

.navInv .container .nav1 li.active.nav-link a.hname {
    color: var(--primary-theme-color) !important
}

.navInv .container .nav1 li.active a.hname {
    color: #fff !important;
    background-color: var(--primary-theme-color);
    border-radius: 39px
}

.navInv .container .nav1 li.active:hover a.hname, .navInvHead .container .nav1 li a.hname:hover {
    color: var(--primary-theme-color) !important;
    background: rgba(255, 191, 146, .17) !important;
    border-radius: 39px
}

.navInv .container .nav2 .dialog-box1, .navInv .container .nav2 .dialog-box2 {
    position: fixed;
    padding: 20px;
    border: 1px solid #ccc;
    display: none;
    box-shadow: 0 0 10px rgba(0, 0, 0, .5);
    z-index: 1000;
    background-color: #fff;
    transform: translate(-50%, -50%)
}

.navInv .container .nav1 li.active.nav-link:hover a {
    color: var(--primary-theme-color);
    background: rgba(255, 191, 146, .17) !important
}

.navInv .container .nav1 li .active img.hover, .navInv .container .nav1 li .active:hover img.selected {
    display: none !important
}

.navInvHead .container .nav2 {
    width: 100%;
    display: flex;
    justify-content: end
}

.navInv .container .nav2 ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 20px
}

.navInv .container .nav2 ul.myProfile {
    align-items: start;
    width: 100%
}

.navInv .container .nav2 ul li img, .tooltips2 {
    width: 15px;
    height: 15px
}

.navInv .container .nav2 ul li button {
    width: 15px;
    height: 15px;
    background: #f6f8fa;
    border: none;
    display: flex
}

#estimate_search .mainfilters, .navInv .container .nav2 ul li button#toggleButton3 {
    width: fit-content
}

.navInv .container .nav2 ul li button#toggleButton3 p:hover {
    background: #fff;
    color: var(--primary-theme-color)
}

.navInv .container .nav2 ul li button p {
    color: rgba(102, 115, 130, .8);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.navInv .container .nav2 .dialog-box1 {
    top: 50%;
    left: 50%
}

.navInv .container .nav2 .dialog-box2 {
    top: 10%;
    left: 75%
}


.navInvHead .container .nav2 .myAccountDiv, .myProfile .organizationDiv {
    border-radius: 5px 0 5px 5px;
    background: #fff;
    left: 100%;
    width: 221px;
    box-shadow: 0 4px 11px 0 rgba(0, 0, 0, .5);
    z-index: 1000;
    position: absolute
}



.accessDeniedContent .accessDeniedText p a, .navInv .container .nav2 ul li:hover a, .myProfile .organizationDiv .cname:hover a, .payHistory tbody tr td a {
    color: var(--primary-theme-color)
}

.navInv .container .nav2 ul li:hover a img.img2, .navInv .container .nav2 ul li:hover button img.img2 {
    display: inline-block
}

.myProfile .organizationDiv {
    top: 50px
}

.navInvHead .container .nav2 .myAccountDiv ul li a {
    padding-left: 18px
}

.myProfile .organizationDiv .cname {
    height: 45px;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--primary-border-color)
}

.myProfile .organizationDiv .cname a.business, .payHistory tbody tr.tabledata_mail td:nth-child(6) a {
    text-decoration: none;
    color: var(--primary-theme-color)
}

.as_layout #body_container #body_container_inner .heading div, .mailInvoiceDetails .invoiceDetailsOuter .invoiceDetailsInner, .navInvHead .container .mainlogo {
    display: flex
}

.hero .header div .date .custom-select, .navInv .container .nav2 ul li.tooltip {
    position: relative;
    display: inline-block
}

.navInv .container .nav2 ul li.shortcut img {
    margin-top: -4.1px
}

.navInv .container .nav2 ul li.notification {
    margin-top: 2px
}

.navInv .container .nav2 ul li.notification img {
    margin-top: -5px
}

.navInv .container .nav2 ul li.notification a {
    padding: 0;
    width: fit-content
}

.navInv .container .nav2 ul li.profile {
    margin-top: -8px
}

.navInv .container .nav2 ul li.profile button {
    height: fit-content
}

.navInv .container .nav2 ul li.profile p {
    margin-top: 5px
}

.navInv .container .nav2 ul li.tooltip .tooltiptext {
    visibility: hidden;
    width: fit-content;
    border-radius: 5px;
    background: #525f7f;
    color: #f6f8fa;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 140.023%;
    letter-spacing: .12px;
    text-align: center;
    padding: 5px;
    position: absolute;
    z-index: 1;
    top: 23px;
    right: 0;
    margin-left: -60px;
    opacity: 0;
    transition: opacity .3s
}

.navInv .container .nav2 ul li.tooltip .tooltiptext::before {
    content: '';
    position: absolute;
    bottom: 100%;
    right: 7%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #555
}

#billingWeb li, #peopleWeb li, #projectsweb li, #receivedWeb li, #referWeb li, #reportsWeb li {
    border-left: 2px solid var(--primary-border-color);
    padding-bottom: 4px;
    padding-top: 4px
}

#billingWeb, #peopleWeb, #receivedWeb, #referWeb, #reportsWeb {
    position: absolute;
    z-index: 1000;
    top: 144px;
    left: -29% !important
}

#billingWeb li a, #projectsweb li a, #referWeb li a {
    color: var(--primary-text-color) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: unset;
    text-decoration: none;
    padding: 5px
}

#billingWeb li:hover, #peopleWeb li:hover, #projectsweb li:hover, #referWeb li:hover {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #f6f6f6
}

#billingWeb li.active, #peopleWeb li.active, #projectsweb li.active, #receivedWeb li.active, #referWeb li.active, #reportsWeb li.active {
    border-left: 2px solid var(--primary-theme-color)
}

#billingWeb li.active a:hover, #referWeb li.active a:hover {
    border-radius: 5px;
    background: #f6f6f6
}

#billingWeb li.active a, #people li.active a {
    color: var(--primary-theme-color) !important;
    font-weight: 500
}

#billingWeb li.active a {
    color: #e45b00;
    background: 0 0;
    justify-content: start;
    border-radius: 0;
    padding: 0 0 0 8px
}

#peopleWeb li.active a, #projectsweb li.active a, #receivedWeb li.active a, #reportsWeb li.active a {
    color: var(--primary-theme-color) !important;
    justify-content: start;
    border-radius: 0;
    padding: 0 0 0 8px;
    background: 0 0
}

#receivedWeb li a, #reportsWeb li a {
    color: #667382 !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-top: 2px;
    text-decoration: none
}

#peopleWeb li.active a, #receivedWeb li.active a, #reportsWeb li.active a {
    color: #e45b00
}

#projectsweb {
    position: absolute;
    z-index: 100;
    top: 144px;
    left: -29% !important
}

#projectsweb li {
    white-space: nowrap
}

#projectsweb li.active a {
    font-weight: 500;
    color: #e45b00
}

#peopleWeb li a {
    color: var(--primary-text-color) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration: none;
    width: 145px;
    display: block
}

#referWeb li {
    list-style: none
}

#referWeb li.active a {
    color: var(--primary-theme-color) !important;
    font-weight: 500;
    color: #e45b00;
    background: 0 0;
    justify-content: start;
    border-radius: 0;
    padding: 0 0 0 8px
}

@media (min-width:1297px) and (max-width:1440px) {
    #reportsWeb {
        left: 2%
    }

    #billingWeb, #peopleWeb, #projectsweb {
        left: 2%;
        width: 150px
    }
}

@media (min-width:1260px) and (max-width:1296px) {
    #billingWeb, #peopleWeb, #projectsweb, #reportsWeb {
        left: 2%;
        width: 150px
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    .navInv .container .nav1 li button {
        margin-right: 15px
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .navInv .container {
        width: 100%
    }

    .navInv .container .nav1 li button {
        font-size: 10px;
        font-weight: 400;
        margin-right: 5px
    }

    .navInv .container .nav2 ul {
        gap: 13px
    }
}

@media (min-width:1261px) and (max-width:1335px) {
    .navInvHead .container .nav1 ul#submenu3 {
        right: 13%
    }

    .navInvHead .container .nav1 ul#submenu4 {
        right: 3%
    }

    .navInvHead .container .nav1 ul#submenu2 {
        right: 32%
    }
}

@media (min-width:320px) and (max-width:1260px) {
    

    .recievedInvoiceNav {
        display: flex;
        flex-direction: column
    }

    .navInv {
        border-bottom: 1px solid var(--primary-border-color);
        box-shadow: none;
        padding-bottom: 30px;
        border-bottom: 1px solid var(--primary-border-color)
    }

    .navInvHead {
        background: #fff !important;
        padding-bottom: 0
    }

    .navInvHead .container {
        padding-bottom: 10px
    }

    .navInvHead .container .nav2 ul li.tooltip #show-shortcuts {
        display: unset
    }

    #billingWeb, #peopleWeb, #projectsweb, #reportsWeb, .navInv .container .nav1 li .active img, .navInvHead .container .nav1 ul.navSubMenu li a i, .navInvHead .container .nav1 ul.navSubMenu li a.add, .navInvHead .container .nav2 ul li.help, .navInvHead .container .nav2 ul li.notification, .navInvHead .container .nav2 ul li.profile, .navInvHead .container .nav2 ul li.profile button .dropdown, .navInvHead .container .nav2 ul li.profile button p, .navInvHead .container .nav2 ul li.shortcut {
        display: none
    }

    .navInv .container .nav1 ul.logout, .navInv .container .nav1 ul.mainnav1, .navInvHead .container .nav1 ul {
        align-items: start
    }

    #closeMainNav, .navInvHead .container .nav1 {
        display: block
    }
    .navInvHead .container .nav1 ul.navLinks li {
        width: 100%
    }

    .myProfile .organizationDiv .cname a {
        color: #667382;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal
    }

    .navInv {
        background: 0 0
    }

    .recievedInvoiceNav {
        display: flex;
        flex-direction: column;
        padding-left: 20px !important;
        position: static !important;
        z-index: 0 !important;
        margin-top: -9px !important;
        top: unset !important;
        margin-right: 0 !important
    }

    .recievedInvoiceNav a, .recievedInvoiceNav a.active {
        border: none
    }

    .navInvHead .container .mainlogo {
        display: flex;
        justify-content: space-between;
        width: 100%
    }

    .navInvHead .container .mobilenav2 {
        display: flex
    }

    .navInvHead .container .mobilenav2 img.img2 {
        margin-top: 7px
    }


    .navInv .container .nav2 ul li img {
        width: 16px;
        height: 16px
    }

    #mainnav1, #nav1 {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 80%;
        height: 100%;
        background-color: #fff;
        z-index: 1000;
        overflow: auto;
        box-shadow: 0 0 10px #999;
        padding: 40px 20px
    }

    #mainnav1 ul, #nav1 ul {
        flex-direction: column;
        align-items: left
    }

    #mainnav1 ul.logout, #nav1 ul.logout {
        margin-top: 20px;
        margin-right: 5px
    }

    .navInv .container .nav1 li .active {
        display: block;
        padding: 0;
        justify-content: left;
        align-items: left;
        gap: 0;
        border-radius: none;
        background: #fff;
        color: #424653 !important
    }

    .navInv .container .nav1 li a:hover, .navInvHead .container .nav1 li#billingmenu .active {
        color: #424653 !important
    }

    .nav .active, .myProfile .organizationDiv .cname {
        border-bottom: none
    }

    .navInv .container .nav1 li a {
        padding: 0
    }

    .navInv .container .nav1 li a img.mobileimg {
        display: block;
        margin-right: 5px
    }

    .navInv .container .nav1 li a img.subnavmenu {
        display: block;
        transition: transform .5s ease-in-out
    }


    #nav1 #closeMainNav {
        visibility: visible
    }

    .navInv .container {
        position: relative
    }

    .navInv .container .logo .mobileNavMenu {
        display: block;
        background: 0 0
    }

    .navInvHead .container .nav2 .myAccountDiv, .myProfile .organizationDiv {
        position: unset;
        box-shadow: none
    }

    .navInvHead .container .nav2 .myAccountDiv ul {
        margin-left: 26px
    }

    .navInvHead .container .nav2 .myAccountDiv ul li {
        padding: 0 0 16px
    }

    .navInvHead .container .nav1 li a.hname, ul.taxSideBar li {
        padding: 0 !important
    }


    .navInv .container .nav1 li.active a.hname {
        background: #fff !important;
        color: var(--primary-text-color) !important
    }

    .navInv .container .nav1 li a img {
        width: 16px !important;
        height: 16px !important
    }

    .navInvHead .container .nav1 li a.hname:hover {
        background: #fff !important
    }

    .subnavmenu {
        margin-left: auto !important
    }


    #myAccountDiv {
        display: none !important
    }

    ul.taxSideBar {
        margin-top: 0;
        border-left: none;
        margin-left: 28px;
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important
    }

    ul.taxSideBar li {
        color: #667382
    }

    ul.taxSideBar li a {
        color: #667382 !important;
        font-size: 14px !important;
        text-transform: none !important
    }
}

#timer, .new_eway_bill_section {
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .06)
}

.recievedInvoiceNav {
    display: flex;
    left: 1.5%;
    flex-direction: column;
    margin-right: 123px;
    margin-top: 86px;
    position: absolute;
    z-index: 1000
}

.recievedInvoiceNav a {
    border-left: 2px solid var(--primary-border-color);
    padding: 5px
}

.recievedInvoiceNav a.active {
    color: #e45b00;
    border-left: 2px solid #e45b00
}

.tooltips .tooltiptext::after, .tooltips6 .tooltiptext::after {
    content: "";
    top: 100%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent;
    position: absolute
}

.nav .active, .recievedInvoiceNav a.active span {
    color: #e45b00
}

.recievedInvoiceNav a:hover {
    background: #f6f6f6;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    text-decoration: none
}

.recievedInvoiceNav a span {
    color: #667382;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: capitalize
}

@media (min-width:1396px) and (max-width:2560px) {
    .recievedInvoiceNav {
        top: 56px
    }
}

@media (min-width:1261px) and (max-width:1296px) {
    .recievedInvoiceNav {
        top: 56px
    }

    #invoice_management.invListing {
        position: relative;
        width: 84.5%;
        float: none !important;
        margin-top: 10px;
        padding: 10px 20px 10px 15px
    }
}

@media (min-width:1297px) and (max-width:1395px) {
    .recievedInvoiceNav {
        top: 56px
    }

    #invoice_management.invListing {
        position: relative;
        width: 87.5%;
        float: none !important;
        margin-top: 10px;
        padding: 10px 20px 10px 15px
    }
}

.fade {
    opacity: 1
}

.hero {
    width: 100%;
    max-width: 1362px
}

.hero .header {
    padding-top: 10px;
    margin: auto auto 20px;
    width: 100%;
    max-width: 1360px;
    display: flex;
    justify-content: space-between
}

.hero .header h1 {
    color: var(--primary-text-color);
    font-size: 24px;
    font-weight: 500;
    text-transform: capitalize;
    margin: 0
}

.hero .header div .date .options-list {
    display: none;
    position: absolute;
    list-style: none;
    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
    background-color: #fff;
    z-index: 1
}

.hero .header div .date .option {
    padding: 8px;
    cursor: pointer
}

.hero .header div .date .option:hover {
    background-color: #f2f2f2
}

.hero .header div .date .select-btn {
    border: 1px solid #ccc;
    cursor: pointer;
    border: 1px solid var(--primary-border-color);
    border-radius: 5px;
    padding: 3px 10px;
    height: 27px;
    min-width: 82px;
    color: #667382;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-transform: capitalize;
    margin: 0
}

.hero .header div .date img {
    position: absolute;
    width: 13px;
    height: 13px;
    right: 10px;
    top: 7px
}

.hero .header div .widgets img {
    position: absolute;
    width: 13px;
    height: 13px;
    top: 7px;
    left: 10px
}

.hero .header div .widgets select {
    border: 1px solid var(--primary-border-color);
    border-radius: 5px;
    padding: 3px 8px 3px 25px;
    height: 27px;
    color: #667382;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-transform: capitalize;
    background: #fff;
    width: 100% !important
}

.tooltips .tooltiptext::after {
    left: 10%
}

.tooltips, .tooltips6 {
    width: 15px !important;
    position: relative;
    display: inline-block
}

.tooltips6 .tooltiptext {
    width: 296px;
    font-size: 12px;
    background-color: #525f7f;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 124%;
    left: -78px;
    margin-left: -60px;
    font-weight: 450;
    line-height: 14px
}

.tooltips6 .tooltiptext::after {
    left: 277px
}

svg:hover {
    fill: var(--primary-text-color)
}

svg:hover path:nth-child(2) {
    fill: #fff
}

.hero svg:hover path:first-child {
    stroke: var(--primary-text-color)
}

.nav {
    gap: 20px
}

.nav button {
    color: #667382;
    font-weight: 500;
    font-size: 12px;
    border-bottom: 1px solid transparent;
    padding: 0 3px
}

.mailAttachment label, .mailSectionInner label, .mail_section .mailInfo p {
    color: var(--Font-1-WS, var(--primary-text-color));
    font-weight: 500;
    line-height: normal
}

.mail_section {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 816px;
    margin-top: 30px
}

.expiredBoxContent, .mail_section .mailAttachment, .mail_section .mailAttachment .mailFileContainer, .mail_section .mailInfo {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.mailSectionInner label, .mail_section .mailInfo p {
    font-size: 12px;
    font-style: normal
}

.mailAttachmentInfo, .mail_section .mailInfo span {
    font-weight: 400;
    line-height: 140%;
    font-style: normal
}

.mailAttachmentInfo {
    color: var(--font-2-WS, #525f7f);
    font-size: 10px
}

.mailAttachmentInner {
    display: flex;
    flex-direction: row-reverse;
    justify-content: start;
    align-items: center;
    border: 1px solid var(--primary-border-color) !important;
    border-radius: 3px;
    padding: 15px;
    width: fit-content
}

.mail_section .mailInfo span {
    max-width: 538px;
    height: 37px;
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    background: #fef4e8;
    color: var(--primary-text-color);
    font-size: 12px;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    padding: 10px
}

.mailAttachment label {
    font-size: 14px;
    font-style: normal
}

#pop_up_container_new.login .expiredInner, .mailSectionInner, .part_a .transaction_details .transaction_details_inner, .part_b .mode_of_transport, .part_b .vehicle_details .vehicle_detail_inner, .part_b .vehicle_type, .popup_items .popup_inner {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.mailSectionInfo .mailSectionInner input {
    width: 258px;
    height: 38px;
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    padding: 5px;
}

.mailSectionInner textarea {
    width: 100%;
    height: 38px;
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    padding: 5px;
    color: var(--primary-text-color)
}

#as_download, button.showOD {
    padding: 3px 10px;
    height: 43px
}

.mailInvoiceDetails, .part_a, .part_a .transaction_details, .part_b {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.mailInvoiceDetails h2 {
    color: var(--primary-text-color);
    font-kerning: none;
    font-feature-settings: 'ss04'on, 'cv04'on, 'ss01'on, 'cv03'on, 'cv02'on, 'cv10'on, 'ss03'on, 'cv05'on, 'calt'off;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase
}

.mailInvoiceDetails .invoiceDetailsOuter .invoiceDetailsInner label {
    color: #667382;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    max-width: 35%;
    width: 200px
}

.mailInvoiceDetails .invoiceDetailsOuter .invoiceDetailsInner p {
    color: var(--primary-text-color);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: capitalize;
    max-width: 35%;
    width: 200px
}

.mailInvoiceDetails .invoiceDetailsOuter {
    display: flex;
    flex-direction: column;
    gap: 8px
}

@media (max-width:450px) {
    .hero .tooltips .tooltiptext, .hero .tooltips6 .tooltiptext {
        visibility: hidden;
        width: 180px;
        font-size: 12px;
        background-color: #525f7f;
        color: #fff;
        text-align: left;
        border-radius: 6px;
        padding: 5px;
        z-index: 1;
        margin-left: -60px;
        opacity: 0;
        transition: opacity .3s;
        font-weight: 450;
        line-height: 14px
    }

    .hero .tooltips .tooltiptext::after, .hero .tooltips6 .tooltiptext::after {
        content: "";
        position: absolute;
        top: 100%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #555 transparent transparent
    }

    .hero {
        /* margin: 0 20px 40px; */
        width: 100%
    }

    .hero .tooltips, .hero .tooltips6 {
        width: 15px !important;
        position: relative;
        display: inline-block
    }

    .hero .tooltips .tooltiptext {
        position: absolute;
        bottom: 160%;
        left: 325%
    }

    .hero .tooltips .tooltiptext::after {
        left: 10%
    }

    .hero .tooltips6:hover .tooltiptext, .hero .tooltips:hover .tooltiptext {
        opacity: 1;
        visibility: visible
    }

    .hero .tooltips6 .tooltiptext {
        position: absolute;
        bottom: 135%;
        left: -92px
    }

    .hero .tooltips6 .tooltiptext::after {
        left: 160px !important
    }
}

.payHistory tbody tr td, .payHistory tbody tr.tableHead td, .payHistory tbody tr.tabledata td, .subMenu {
    border-bottom: 1px solid var(--primary-border-color)
}

@media (min-width:1261px) and (max-width:1351px) {
    .recievedInvoiceNav {
        left: 2.5%
    }

    .hero {
        padding: 0 25px !important
    }

    .navInv .clientContainer {
        padding: 10px 25px 0
    }

    .cFooter1 {
        padding: 0 25px
    }
}

.layout1 {
    padding: 10px;
    display: flex;
    justify-content: center
}

.ASFilters, .buttons .update_btn {
    padding: 0 10px;
    text-decoration: none
}

.body_container_blnk1 {
    width: 100%;
    max-width: 1360px;
    display: flex;
    justify-content: end;
    float: none !important
}

@media (min-width:320px) and (max-width:425px) {
    .recievedInvoiceNav {
        padding-left: 20px;
        position: static;
        z-index: 0;
        margin-top: -9px;
        top: unset;
        margin-right: 0
    }

    .layout1 {
        flex-direction: column
    }
}

.as_layout {
    width: 100%;
}

.as_layout #body_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: end;
    max-width: 1360px;
    padding: 0
}

.as_layout #body_container #body_container_inner {
    width: 1175px;
    position: relative
}

.as_layout #body_container #body_container_inner .heading {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative
}

.as_layout #body_container #body_container_inner .heading input.dateRange {
    width: 245px;
    height: 43px;
    padding: 3px 10px 3px 30px;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    color: #667382;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-transform: capitalize;
    background: url(../../../images/calender.svg) 10px center no-repeat;
    margin-right: 10px
}

button.showOD {
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    color: var(--Primary-Main-Heading, #2A2E34);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-transform: capitalize;
    background: 0 0
}

.showOverdue button.active {
    border: 1px solid var(--primary-theme-color);
    background: #fef4ed;
    color: var(--primary-theme-color)
}

#timer_link, .new_eway_bill_section .both_part h3 {
    color: var(--Secondary-Blue, var(--primary-text-color))
}

.add_transporter_form h1, .as_layout #body_container #body_container_inner .heading p, .new_eway_bill_section h1 {
    color: var(--primary-text-color);
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.ASFilters, .ASFilters button {
    color: #667382;
    font-size: 15px
}

#as_download.active ul li a, .ASFilters, .ASFilters button, .payHistory tbody tr td, .payHistory tbody tr td div {
    font-weight: 400;
    font-style: normal
}

.asfilterOptions {
    display: flex;
    align-items: center;
    gap: 10px
}

#as_download p, .as_layout #body_container #body_container_inner .heading #as_download p {
    color: var(--Primary-Main-Heading, #2A2E34);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

#as_download {
    cursor: pointer;
    width: 123px;
    align-items: center;
    gap: 5px;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    display: flex;
    align-items: center;
    position: relative
}

#as_download:hover, .ASFilters:hover {
    background: #f6f6f6
}

#as_download img {
    width: 12px;
    height: 12px
}

#as_download.active ul {
    width: 123px;
    display: block;
    list-style: none;
    position: absolute;
    z-index: 1000;
    background: #fff;
    top: 33px;
    right: 0;
    border: 1px solid #f2f2f2;
    box-shadow: 0 13px 27px 0 rgba(80, 80, 80, .04)
}

#as_download.active ul li {
    padding: 11px
}

#as_download.active ul li:hover {
    background: rgba(247, 102, 0, .07)
}

#as_download.active ul li:hover a {
    color: var(--primary-theme-color);
    text-decoration: none
}

#as_download.active ul li a {
    color: var(--primary-text-color);
    text-align: center;
    font-size: 12px;
    line-height: normal;
    text-decoration: none
}

.ASFilters {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #fff;
    text-align: right;
    width: fit-content;
    height: 27px
}

.ASFilters button {
    background: 0 0
}

.ASFilters button img {
    margin-top: 4px;
    margin-right: 5px
}

#ui-datepicker-div.as_dateFilter .ui-datepicker-header {
    padding: 0;
    height: fit-content
}

@media (min-width:1261px) and (max-width:1350px) {
    .as_layout #body_container #body_container_inner {
        margin-right: unset;
        width: 84%
    }
}

@media (min-width:1351px) and (max-width:1700px) {
    .as_layout #body_container #body_container_inner {
        margin-right: unset;
        width: 86%
    }
}

@media (min-width:768px) and (max-width:1260px) {
    .as_layout #body_container #body_container_inner {
        margin-right: unset;
        width: 100%
    }
}

@media (min-width:320px) and (max-width:500px) {
    #as_download, .ASFilters button img {
        position: absolute
    }

    .navInv .container .nav2 ul li a img#settingRotImg {
        display: block
    }

    #as_download {
        width: 36px;
        height: 36px;
        right: 0;
        top: -7px
    }

    #as_download img {
        width: 15px;
        height: 15px
    }

    #as_download .downImg, #as_download p, .as_layout #body_container #body_container_inner .heading #as_download p {
        display: none
    }

    #as_download.active ul {
        top: 100%;
        right: 5%
    }

    .as_layout #body_container #body_container_inner {
        margin-right: 0
    }

    .as_layout #body_container #body_container_inner .heading p {
        font-size: 20px
    }

    .asHead {
        flex-wrap: wrap
    }

    .accStatement {
        flex-wrap: wrap;
        margin-top: 20px
    }

    .accStatement .filterdateRange input, .accStatement .ui-combobox {
        width: 100%;
        height: 35px;
        border-radius: 3px
    }

    .accStatement .ui-combobox input {
        height: 100%
    }

    .accStatement .filterdateRange, .accStatement .showOverdue {
        width: 100%
    }

    .accStatement .showOverdue button {
        width: 100%;
        height: 35px;
        border-radius: 3px;
        margin: 0
    }

    .as_layout #body_container #body_container_inner .heading {
        position: relative;
        margin-top: 20px
    }

    .ASFilters {
        width: 36px;
        height: 36px;
        color: #fff;
        position: relative;
        background: 0 0
    }

    .ASFilters button {
        color: #fff;
        background: 0 0;
        width: 100%
    }

    .as_layout #body_container #body_container_inner .heading div.showOverdue button {
        width: 100%;
        height: 36px;
        padding: 10px 6px;
        border-radius: 5px;
        border: 1px solid var(--primary-border-color);
        margin: 20px 0
    }

    .as_layout #body_container #body_container_inner .heading div.filterdateRange {
        width: 100%;
        display: block
    }

    .as_layout #body_container #body_container_inner .heading div.filterdateRange input {
        width: 100%;
        height: 36px;
        border-radius: 5px;
        border: 1px solid var(--primary-border-color);
        margin: 0
    }

    .as_layout #body_container #body_container_inner .heading div.asfilterOptions {
        display: flex;
        flex-direction: column;
        width: 100%
    }
}

#invoice_template1.invoice_template1 {
    display: flex;
    flex-direction: column;
    gap: 25px
}

.payHistory tbody tr {
    height: 45px
}

.payHistory tbody tr td {
    text-decoration: none;
    line-height: normal;
    color: var(--primary-text-color);
    font-size: 14px
}

.payHistory tbody tr td a.viewMail {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center
}

.payHistory tbody tr td div {
    text-decoration: none;
    line-height: normal;
    color: var(--primary-text-color);
    font-size: 14px
}

.payHistory tbody tr td div span {
    text-decoration: none;
    font-style: normal;
    font-weight: 400 !important;
    line-height: normal;
    color: var(--primary-text-color) !important;
    font-size: 14px !important
}

.payHistory tbody tr.tableHead td {
    text-decoration: none;
    color: var(--primary-text-color);
    font-size: 12px;
    font-style: normal;
    line-height: normal;
    font-weight: 500;
    text-transform: uppercase
}

.new_eway_bill_section {
    border-radius: 5px;
    background: #fff;
    width: 768px;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100
}

.transporter_details .transporter_details_inner input {
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    width: 324px !important;
    height: 38px !important
}

.add_transporter_form .cross, .new_eway_bill_section .cross {
    position: absolute;
    top: 10px;
    right: 10px;
    color: var(--primary-text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    cursor: pointer
}

#overlay_div, #overlay_div_canRsn, #overlay_div_extend, #overlay_div_part_b, #overlay_div_transporter {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 99
}

.new_eway_bill_section .both_part {
    display: flex;
    justify-content: space-between;
    gap: 20px
}

.new_eway_bill_section .both_part h3 {
    font-feature-settings: 'clig'off, 'liga'off;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0 !important
}

.new_eway_bill_section .both_part label {
    color: #6e6b7b;
    font-feature-settings: 'clig'off, 'liga'off;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.filter1 div.selectcombo input, .mainfilters input.filterinput {
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    color: #525f7f
}

.new_eway_bill_section .both_part .seperator {
    height: 100%;
    border-left: 1px solid #eaf4ff
}

.vehicle_detail_row {
    gap: 20px !important
}

.part_b .radio_section label {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    padding: 6px;
    gap: 4px;
    align-items: center;
    cursor: pointer;
    width: 66px;
    height: 46px
}

.part_b .vehicle_type_radios {
    display: flex;
    gap: 20px;
    align-items: center
}

.part_b .vehicle_details {
    display: flex;
    flex-wrap: wrap;
    gap: 20px
}

.part_b .vehicle_details .vehicle_detail_inner input {
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    height: 38px;
    width: 152px
}

.part_a .transaction_details .transaction_details_inner input, .part_a .transaction_details .transaction_details_inner select, .popup_inner input {
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    height: 38px;
    width: 324px
}

.buttons {
    display: flex;
    justify-content: end;
    gap: 20px;
    padding-top: 20px;
    border-top: 1px solid #eaf4ff
}

.buttons .update_btn {
    display: flex;
    align-items: center;
    height: 37px;
    border-radius: 5px;
    background: var(--primary-theme-color);
    color: #fff;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-transform: capitalize;
    width: 101px;
    justify-content: center
}

.subMenu {
    display: flex;
    width: 100%;
    gap: 20px
}

#layout.irpLayout {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100% !important
}

#body_container.irp_body_container {
    margin-top: 2px;
    padding: 0;
    position: relative;
    min-height: 580px;
    width: 100%;
    max-width: 1360px;
    display: flex;
    justify-content: end
}


@media (min-width:1261px) and (max-width:1350px) {
    #body_container_inner.irp_body_container_inner {
        width: 83%
    }
}

#estimate_search .advanceSearch {
    display: flex;
    padding: 20px
}

.mainfilters input.filterinput {
    width: 310px;
    height: 41px;
    border-radius: 10px;
    border: .6px solid var(--primary-border-color);
    font-weight: 400;
    padding-left: 10px
}

.mainfilters input.filterinput::placeholder {
    color: #525f7f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.filter1 input.filterinput::placeholder {
    color: #525f7f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.filter1 div.selectcombo {
    width: 310px;
    height: 41px;
    border-radius: 10px;
    border: .6px solid var(--primary-border-color)
}

.filter1 div.selectcombo input {
    height: 37px;
    font-weight: 400;
    padding-left: 10px
}

.filter1 div.selectcombo input::placeholder {
    color: #525f7f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

#estimate_search .line {
    margin: 0 25px;
    border-right: .6px solid var(--primary-border-color)
}

.mainfilters div.poselect, .mainfilters input.filteramount {
    width: 143px;
    height: 41px;
    border-radius: 10px;
    border: .6px solid var(--primary-border-color)
}

#estimate_search .filterbtn .apply, #estimate_search .filterbtn .clear {
    width: 60px;
    height: 25px;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    font-style: normal;
    text-transform: capitalize
}

.mainfilters div.poselect input {
    width: 116px;
    height: 37px;
    color: #525f7f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-left: 10px
}

.mainfilters div.poselect input::placeholder {
    color: #525f7f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.mainfilters div.amountRange {
    display: flex;
    width: 100%
}

.mainfilters .poamount, .mainfilters .pono, .mainfilters .potitle {
    margin-bottom: 25px
}

#estimate_search .filterbtn div ul {
    display: flex;
    list-style: none;
    gap: 20px;
    padding: 0 20px 20px
}

#estimate_search .filterbtn .apply {
    background: var(--primary-theme-color);
    color: var(--White, #fff)
}

#estimate_search .filterbtn .apply:hover {
    background: #fd8530
}

#estimate_search .filterbtn .clear {
    display: block;
    border: 1px solid var(--primary-theme-color);
    color: var(--primary-theme-color)
}

#estimate_search .filterbtn .clear:hover {
    background: #fd8530;
    color: #fff
}

@media (min-width:426px) and (max-width:1169px) {
    #estimate_search .advanceSearch {
        flex-wrap: wrap
    }

    .po_search #estimate_search .line {
        display: none
    }

    #estimate_search .mainfilters {
        width: 100%;
        display: flex;
        gap: 20px
    }
}

.ri_layout {
    display: flex;
    justify-content: center;
    width: 100%
}
.help_sec {
    float: left;
    max-width: 100%;
    width: 100%;
    background: #cbe3f8;
    border: 1px solid #87abcd;
    padding: 10px;
    margin: 10px 0 15px 0;
    position: relative
}

.help_sec .cancel {
    background: url(../images/all_icons.gif) no-repeat 0 -1711px;
    height: 16px;
    width: 16px;
    position: absolute;
    top: 5px;
    right: 5px
}

.help_sec ul {
    float: left;
    width: auto;
    list-style: none;
    padding: 10px 0 0 10px
}

.help_sec ul li {
    float: left;
    width: 100%;
    font: 12px/16px 'Inter';
    color: #000;
    padding: 0 0 10px 0;
    display: block
}


/* .scrollBar {
    scrollbar-width: thin;
    scrollbar-color: #667382 #F4F4F4
} */

.scrollBar::-webkit-scrollbar {
    width: 11px;
}

.scrollBar::-webkit-scrollbar-track {
    background: #F1F1F1;
    border-radius: 10px;
    /* box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.7); */
}

.scrollBar::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: rgba(140, 152, 163, 0.5);
    /* background: linear-gradient(to bottom, #0B0F1F, #d5d9eb); */
}

.scrollBar::-webkit-scrollbar-thumb:hover {
    background: rgba(140, 152, 163, 0.5);
}

.navScroll::-webkit-scrollbar {
    width: 3px;
}
.navScroll::-webkit-scrollbar-thumb {
    border-radius: 20px;
    background: #878EAA;
}

.parent_div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%
}

select {
    background: #fff;
    padding: 5px
}

.additional_charges {
    display: flex !important;
    justify-content: space-between
}

.buttonNext {
    display: flex;
    justify-content: end;
    align-items: center;
    width: 100%;
    gap: 15px;
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid var(--primary-border-color)
}

.buttonNext a {
    color: var(--primary-text-color);
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .4px;
    text-decoration: none
}

.add_business_form h5, .add_business_outer h1 {
    text-align: left;
    color: var(--primary-text-color)
}

.buttonNext .save-btn, .buttonNext button {
    justify-content: center;
    border-radius: 5px;
    background: var(--primary-theme-color);
    font-weight: 500;
    gap: 5px;
    width: 101px;
    height: 37px;
    color: #fff;
    display: flex
}

.buttonNext button {
    align-items: center;
    border: none;
    font-size: 14px !important
}

.accessDeniedContent .save-btn:hover, .buttonNext .save-btn:hover, .buttonNext button:hover {
    background-color: #fd8530
}

.buttonNext .save-btn {
    align-items: center;
    border: none
}

.buttonNext .cancel-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 101px;
    height: 37px;
    border-radius: 5px;
    background: #fff;
    color: var(--primary-theme-color);
    border: 1px solid var(--primary-theme-color)
}

.buttonNext .cancel-btn:hover {
    background-color: #ffddc6
}

.comment_box_area {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 40%
}

.comment_box_area textarea {
    width: 100%;
    height: 90px !important;
    border-radius: 5px !important;
    border: 1px solid var(--primary-border-color) !important;
    padding: 10px !important
}

.comment_box_area label {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .4px;
    color: var(--primary-text-color)
}

#manage_payment_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(188, 188, 188, .5);
    z-index: 999;
    display: none
}

.add_business_outer {
    width: 768px !important;
    box-sizing: border-box !important;
    padding: 50px
}

#timer, .new_ui_popup {
    box-sizing: border-box
}

.add_business_inner {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: fit-content
}

.add_business_form {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 668px
}

.add_business_inner .chosen-container.chosen-container-single, .add_business_inner input {
    width: 324px !important;
    height: 38px !important;
    border-radius: 5px !important;
    padding-left: 5px;
    border: 1px solid var(--primary-border-color) !important
}

#adduserbusinesscountry_chosen .chosen-single, #frmBusinessfkCurrencyID_chosen .chosen-single {
    height: 100% !important;
    border: none !important;
    line-height: 30px !important
}

.add_business_inner label {
    color: #6e6b7b;
    font-feature-settings: 'clig'off, 'liga'off;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: left
}

.add_business_inner .chosen-container-single .chosen-single span {
    text-align: left !important
}

.add_business_form h5 {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    width: 100%
}

.add_business_outer h1 {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

.new_ui_popup h3 {
    font-size: 24px;
    font-weight: 600;
    font-style: normal;
    line-height: normal
}

.popup_inner .selectbox_pop {
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    height: 38px !important;
    width: 324px !important
}

.popup_inner .selectbox_pop .selectedTxt {
    line-height: 29px !important;
    height: 100%
}

.accessDeniedContent {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px
}

.accessDeniedContent h4 {
    text-align: center
}

.accessDeniedContent img {
    max-width: 385px
}


.trial-tooltips {
    bottom: unset;
    top: 29px;
    height: fit-content
}

#temploader, .new_ui_popup {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.trial-tooltips::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 10%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #555
}

.tooltips .tooltiptext {
    width: 296px;
    font-size: 12px;
    background-color: #525f7f;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 160%;
    left: 255%;
    margin-left: -60px;
    font-weight: 450;
    line-height: 14px
}

#body_container.staffDetails {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0
}

#body_container_inner.staffDetailsContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: end;
    max-width: 1360px;
    width: 100%
}

.staffDetailOuter {
    width: 86%
}

.staffHeading {
    width: 100%;
    max-width: 1360px;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 35px
}

.staffHeading h2 {
    padding: 0;
    margin-bottom: 0
}

#content_container.staffContent {
    width: 100%;
    border: none;
    margin-top: unset !important
}

.expiredOuter, .popup_items {
    display: flex;
    gap: 20px;
    flex-wrap: wrap
}

#pop_up_container_new.login {
    padding: 30px !important
}

#pop_up_container_new.login .expiredInner label {
    color: #6e6b7b;
    font-feature-settings: 'clig'off, 'liga'off;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

#pop_up_container_new.login .expiredInner input {
    height: 35px;
    width: 245px;
    border-radius: 5px;
    border: 1px solid #e3e7eb;
    box-sizing: border-box
}

#pop_up_container_new.login p {
    color: #00234b;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 0 !important;
    margin-top: 5px !important;
    margin-bottom: 10px !important;
    text-align: left
}

#add_credit, #client_main_form, #client_management1, #client_reports_form, #estimates_container_inner .total_row, #expense_reports_form_outer, #import_exp_section, #in_temp_container_inner, #invoice_container_inner .total_row, #invoice_container_rec_inner .total_row, #invoice_report, #my_account, #my_account_inner, #payment_section, #preferences_tab_data4, #product_management, #send_mail, #send_mail_container, #staff_add_sec, #staff_add_sec_inner, #staff_management, #task_container1, #team_timesheet_container1, #time_tracking_reports_form_inner, #tracking_new_task1, #tracking_projects1, .account_sec, .add_search_row1, .gray_box, .staff_allocation {
    border-width: 0 !important;
    margin-top: 0 !important
}

.notification_area ul.button li {
    float: left;
    width: auto;
    margin-right: 0 !important;
    display: inline;
    border: 1px solid #d1d1d1
}

.importantInfo {
    border-radius: 5px !important;
    border: .5px solid #b0cded !important;
    background: #eff6ff !important
}

.user_details_payment_inner .selectbox_bg_month, .user_details_payment_inner .selectbox_bg_year {
    border-radius: 3px;
    width: 112px;
    height: 35px;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff !important;
    color: var(--primary-text-color)
}

.importantInfo a {
    background: url(../images/banner_info_cross.svg) 1px -1px no-repeat !important;
    height: 23px !important;
    width: 24px !important
}

.total-outer {
    padding-bottom: 50px !important
}

.user_details_payment_inner .selectbox_bg_month, .user_details_payment_inner .selectbox_bg_year {
    border: 1px solid var(--primary-border-color)
}

.allocate_client .client_form_row input {
    color: var(--primary-text-color);
    font-size: 12px;
    float: left;
    border-radius: 3px;
    border: 1px solid var(--primary-border-color);
    width: 254px;
    height: 32px;
    padding: 3px 2px 3px 4px
}

.allocate_client .client_form_row {
    float: left;
    padding: 0 15px;
    width: 279px;
    margin-top: 7px
}

.new_ui_popup {
    padding: 50px;
    display: flex;
    width: 771px;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .1);
    border-radius: 5px;
    background: #fff;
    flex-direction: column;
    gap: 16px;
    border: 1px solid #ccc;
    z-index: 1000;
    position: absolute
}

.close-button {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    background: 0 0;
    border: none;
    font-size: 20px;
    color: #6e6b7b
}

.new_ui_popup h3 {
    color: var(--primary-text-color);
    margin: 0 0 5px;
    float: none;
    padding: 0
}

.popup_inner label {
    color: #6e6b7b;
    font-feature-settings: "clig"off, "liga"off;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal
}

#timer_link, .createInvc a {
    font-weight: 600;
    text-decoration: none
}

.ci_container .invoice .add-customer *, .client_form_row * {
    box-sizing: content-box
}

.total .total-inner2 {
    gap: 12px !important
}

table.invoice_management tr.Eway td a.menu2 {
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: var(--primary-text-color);
    font-size: 14px;
    text-decoration: none
}

.createInvc a {
    color: #fff
}

#timer {
    width: 375px !important
}

#timer_link {
    border-radius: 26px;
    border: 1px solid var(--Primary-Orange, var(--primary-theme-color));
    background: #fff5ee;
    padding: 5px 10px;
    font-size: 13px;
    font-style: normal;
    line-height: normal;
    letter-spacing: .26px;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    gap: 5px;
    width: fit-content;
}

#timer_link:hover {
    border: 1px solid var(--Primary-Orange, var(--primary-theme-color));
    background: rgba(247, 102, 0, .09);
    color: var(--primary-theme-color)
}

#timer_link.active-timer:hover {
    background: #fff5ee;
    color: var(--primary-text-color)
}
#timer_link.active-timer:hover .timerPauseImgHover {
    display: none;
}

#timer_link.active-timer {
    background: var(--primary-theme-color);
    color: #fff
}

#tempoverlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 9999
}

#temploader {
    position: fixed;
    z-index: 10000
}

@media (max-width:1100px) {

    .navInvHead .container .nav1 li a.hname img.hover, .navInvHead .container .nav1 li a.hname img.normal, .navInvHead .container .nav1 li a.hname img.selected {
        display: none !important
    }
}


.invoicera-select, .invoicera-search-select {
    position: relative;
}
.inv-select{
    position: relative;
    height: fit-content;
}
.inv-select select{
    display:none !important
}
.inv-search-select{
    position: relative;
    height: fit-content;
}
.inv-search-select select{
    display:none !important
}

.invoicera-search-select.err .select-selected{
    border: 1px solid red !important;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff2f2 !important;

}

.select-selected {
    background-color: #fff;
    padding: 6px;
    width: 100%;
    box-sizing: border-box;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff !important;
    cursor: pointer;
    border-radius: 5px;
    border: 1px solid #e3e7eb;
    display: flex;
    height: 43px;
    align-items: center;
    color: var(--Primary-Main-Heading, #2A2E34);
    font-size: 14px;
    font-weight: 500;
}

.select-items .disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.select-items div.disabled:hover {
    background-color: unset !important;
    color: var(--primary-sub-heading) !important;
}

.smallFont .select-selected {
    background-color: #fff;
    padding: 6px;
    width: 100%;
    box-sizing: border-box;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff !important;
    cursor: pointer;
    border-radius: 5px;
    border: 1px solid #e3e7eb;
    display: flex;
    height: 27px;
    align-items: center;
    color: var(--Primary-Main-Heading, #2A2E34);
    font-size: 12px;
    font-weight: 500;
}

.select-selected.disabled,
.select-items.disabled {
    pointer-events: none;
    opacity: 0.5;
}

.inv-selected {
    background-color: #fff;
    padding: 16px 10px;
    width: 100%;
    box-sizing: border-box;
    background: url(../../../images/Path.svg) calc(100% - 10px) center no-repeat #fff !important;
    cursor: pointer;
    border-radius: 5px;
    border: 1px solid #e3e7eb;
    color: var(--primary-main-heading);
    display: flex;
    align-items: center;
    font-size: 16px;
}

.select-selected:focus {
    outline: none;
}

.select-items {
    position: absolute;
    background-color: #fff;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    max-height: 243px;
    overflow-y: auto;
    width: 100% !important;
    /* padding: 0px 10px; */
    border-radius: 5px;
    border: 1px solid #AFAFAF;
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
}
.search-wrapper {
    padding: 3px;
}

.search-wrapper input {
    width: 100% !important;
    border-radius: 5px !important;
    border: 1px solid #AFAFAF !important;
    height: 43px !important
}

.select-items .options-wrapper {
    max-height: 192px;
    overflow-y: auto;
    width: 100% !important;
    /* padding: 0px 10px; */
    background: #FFF;
}
.inv-select-options {
    position: absolute;
    background-color: #fff;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    max-height: 200px;
    overflow-y: auto;
    width: 100% !important;
    border-radius: 5px;
    border: 1px solid #AFAFAF;
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    padding: 15px;;
}
.inv-select-options > div {
    padding: 10px 0px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border-bottom: 0.6px solid #E6E6E6;
}
.inv-select-options > div:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.inv-select-options > div:first-child {
    padding-top: 0;
}

.inv-select-options .option-desc {
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.inv-select-options .option-name {
    font-size: 16px;
    font-weight: 400;
    color: var(--primary-main-heading);
}
.inv-select-options .option-info {
    font-size: 12px;
    font-weight: 400;
    color: var(--list-heading-color);
}
.select-hide {
    display: none !important;
}

.same-as-selected {
    background-color: #F9FAFB;
    color: #F76600 !important;
}
.same-as-selected:hover {
    background-color: #F9FAFB !important;
    color: #F76600 !important;
}


.select-items .selectOptions:hover {
    background-color: #F9FAFB !important;
    color: #2A2E34 !important;
}

.select-items .selectOptions {
    /* margin: 2px 0px 0px 0px; */
    padding: 0px 15px;
    height: 43px;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #4F5A63;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 25px;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
}

.smallFont .select-items div {
    /* margin: 2px 0px 0px 0px; */
    padding: 0px 15px;
    height: 29px !important;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #4F5A63;
    font-size: 12px !important;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 23px !important;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
    align-items: center;
    flex-direction: row !important;
}

.select-items .optgroup-label{
    padding: 5px 6px;
    cursor: pointer;
    color: #00234B;
    font-size: 12px;
    line-height: 20px;
    font-weight: 700;
    border-bottom: none;
    width: 100% !important;
    pointer-events: none;
}

/* Styles for the search input inside the searchable select */
.select-search {
    padding: 8px 16px;
    width: calc(100% - 32px);
    box-sizing: border-box;
    border: none;
    border-bottom: 1px solid #ccc;
}

.select-search:focus {
    outline: none;
}
.master_div{
    min-height: 700px !important;
}

.selectInvType .select-selected{
    width: 150px;
}







/* Common css for font styles */
input[type=radio]{
    accent-color: var(--primary-theme-color);
}
.heading1{
    font-size: 36px;
    font-weight: 600; /* 700 */
    color: var(--primary-main-heading);
}
.heading2{
    font-size: 30px !important;
    font-weight: 600 !important;  /* 700 */
    color: var(--primary-main-heading);
}

.heading2_1{
    font-size: 28px;
    font-weight: 500;  /* 700 */
    color: var(--primary-main-heading);
}

.themeHeading2{
    font-size: 30px;
    font-weight: 600;  /* 700 */
    color: var(--primary-theme-color);
}

.heading3{
    font-size: 24px;
    font-weight: 500;  /* 600 */
    color: var(--primary-main-heading);
}

.heading4{
    font-size: 20px;
    font-weight: 500;
    color: var(--primary-main-heading);
}

.heading5{
    font-size: 18px;
    font-weight: 500;  /* 600 */
    color: var(--primary-main-heading);
}
.heading5_1{
    font-size: 18px;
    font-weight: 500;  /* 600 */
    color: var(--primary-sub-heading);
}
.heading5_2{
    font-size: 18px;
    font-weight: 500;  /* 600 */
    color: var(--primary-theme-color);
}

.heading6{
    font-size: 16px;
    font-weight: 500;  /* 600 */
    color: var(--primary-main-heading);
}
.heading6_1{
    font-size: 16px;
    font-weight: 500;  /* 600 */
    color: var(--primary-sub-heading);
}
.heading6_2{
    font-size: 16px;
    font-weight: 500;  /* 600 */
    color: var(--list-heading-color);
}
.formHeading{
    position: static !important;
    transform: none !important;
    font-weight: 500;
    font-size: 26px;
    color: var(--primary-main-heading);
}

.leadText{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.leadText_1{
    font-size: 14px;
    font-weight: 400;
    color: var(--list-heading-color);
}
.leadText_2{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.standardText{
    font-size: 12px;
    font-weight: 500;
    color: var(--primary-sub-heading);
}
.standardText_2{
    font-size: 12px;
    font-weight: 500;
    color: var(--list-heading-color);
}
.standardText_3{
    font-size: 12px;
    font-weight: 500;
    color: var(--primary-main-heading);
}
.smallText{
    font-size: 12px;
    font-weight: 400;
    color: var(--list-heading-color);
}
.smallText_1{
    font-size: 12px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.smallText_2{
    font-size: 12px;
    font-weight: 400;
    color: var(--primary-main-heading);
}
.custom1{
    font-size: 34px;
    font-weight: 800;  /* 900 */
    color: var(--primary-sub-heading);
}

.customTheme1{
    font-size: 34px;
    font-weight: 800;  /* 900 */
    color: var(--primary-theme-color);
}

.custom2{
    font-size: 36px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.custom3{
    font-size: 18px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.custom4{
    font-size: 16px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.custom4_1{
    font-size: 16px;
    font-weight: 400;
    color: var(--primary-main-heading);
}
.custom4_2{
    font-size: 16px;
    font-weight: 400;
    color: var(--list-heading-color);
}
.custom5{
    font-size: 14px;
    font-weight: 400;
    color: var(--list-heading-color);
}
.custom5_1{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-main-heading);
}

.custom5_2{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-sub-heading);
}
.custom5_3{
    font-size: 14px !important;
    font-weight: 400;
    color: var(--primary-theme-color);
}

.custom6{
    font-size: 14px;
    font-weight: 500;
    color: var(--list-heading-color);
}
.custom6_1{
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-sub-heading);
}
.custom6_2{
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-main-heading);
}
.custom6_3{
    font-size: 14px !important;
    font-weight: 500;
    color: var(--primary-theme-color);
}
.custom6_4{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-main-heading);
}
.custom6_5{
    font-size: 14px;
    font-weight: 400;
    color: #D1D5DC;
}
.custom7{
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-sub-heading) !important;
    font-family: 'Roboto Mono';
}

/* Similar create green button */
.primaryButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: var(--secondary-theme-color);
    padding: 8px 15px;
    color: #FFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    min-width: 78px;
    text-decoration: none;
    justify-content: center;
}

.secondaryButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: var(--secondary-btn-color);
    padding: 8px 15px;
    color: var(--secondary-theme-color-hover);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
    min-width: 78px;
    justify-content: center;
}

.outlineButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: transparent;
    padding: 8px 15px;
    color: var(--secondary-theme-color-hover);
    border: 1px solid var(--secondary-theme-color-hover);
    font-size: 14px;
    font-weight: 500;
    min-width: 78px;
    line-height: 20px;
    text-decoration: none;
    cursor: pointer;
    justify-content: center;
}

.orangeOutlineButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: transparent;
    padding: 8px 15px;
    color: var(--primary-theme-color);
    border: 1px solid var(--primary-theme-color);
    font-size: 14px;
    font-weight: 500;
    min-width: 78px;
    line-height: 20px;
    text-decoration: none;
    justify-content: center;
}

.greyOutlineButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: transparent;
    padding: 8px 15px;
    color: #667382;
    border: 1px solid var(--primary-border-color);
    font-size: 14px;
    font-weight: 500;
    min-width: 78px;
    line-height: 20px;
    text-decoration: none;
    justify-content: center;
}

.actionButton{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 39px;
    background: transparent;
    padding: 8px 15px;
    color: var(--primary-sub-heading) ;
    border: 1px solid var(--primary-border-color);
    font-size: 14px;
    font-weight: 500;
    min-width: 78px;
    line-height: 20px;
    text-decoration: none;
    justify-content: center;
}


.cancelButton {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 39px;
    background: #fff;
    padding: 7px 15px;
    color: var(--list-heading-color);
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 500;
    min-width: 78px;
    line-height: 20px;
    text-decoration: none;
}

.secondaryButton:hover,.primaryButton:hover{
    background: var(--secondary-theme-color-hover);
    color: #fff;
}

.cancelButton:hover{
    color: var(--secondary-theme-color);
    border: 1px solid var(--secondary-theme-color);
}

.actionButton:hover{
    background: #F9FAFB;
}

.flexRow {
    display: flex;
    align-items: center;
}

.flexColumn {
    display: flex;
    flex-direction: column;
}

.justifySpaceBetween{
    justify-content: space-between;
}
 .g5{
    gap:5px;
 }
 .g10{
    gap:10px;
 }
 .g15{
    gap:15px;
 }
 .g20{
    gap:20px;
 }

 .g25{
    gap: 25px;
 }
 .g30{
    gap: 30px;
 }
 .g35{
    gap: 35px;
 }
 .g40{
    gap: 40px;
 }
 .verticalSeperator{
    width: 100%;
    border-bottom: 1px solid var(--primary-border-color);
 }

 .horizontalSeperator{
    height: 100%;
    border-right: 1px solid var(--primary-border-color);
 }
/* Common css for listing pages */
.mainWrapperDiv *{
    box-sizing: border-box;
}
.formWrapperDiv *{
    box-sizing: border-box;
}


.mainWrapperDiv {
    padding: 18px 30px;
    box-sizing: border-box;
    overflow-y: auto;
}
.formWrapperDiv {
    padding: 18px 30px;
    /* border-radius: 10px; */
    /* border: 1px solid var(--primary-border-color); */
    /* background: #FFF; */
    /* box-shadow: 0px 3px 44.4px -3px rgba(0, 0, 0, 0.06); */
    box-sizing: border-box;
    /* margin-top: 20px; */
    width: 100%;
     display: flex;
    justify-content: center; 
    overflow-y: auto;

}


.mainHeading{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    position: relative;
}

.breadCrumb{
    display: flex;
    align-items: center;
    gap: 5px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--primary-border-color);
    margin-bottom: 15px;
}
.breadCrumb a{
    display: flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
}

.formButtons{
    display: flex;
    align-items: center;
    gap: 10px;
    /* align-items: end; */
    justify-content: end;
}

.mainHeading .searchOptionsOuter{
    display: flex;
    align-items: center;
    gap: 15px;
}

.mainHeading .searchOptions{
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 26px;
    border: 1px solid var(--primary-border-color);
    height: 36px;
    padding: 0 12px;
}

.mainHeading .searchOptions .simpleSearch{
    display: flex;
    align-items: center;
    gap: 5px;
}
.mainHeading .searchOptions .simpleSearch input{
    border-radius: 26px;
    border: none;
    width: 55px;
    height: 100%;
    padding-left: 0;
}

.mainHeading .searchOptions .simpleSearch input#keywordVal:hover{
    width: 178px !important;
}

.mainHeading .searchOptions .simpleSearch input::placeholder{
    color: #949494 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.mainHeading .searchOptions .search{
    background: url(../../../images/search.svg) no-repeat #fff;
    background-position: 0px center;
    width: 13px !important;
}

.mainHeading .searchOptions .advanceFilter{
    display: flex;
    align-items: center;
    gap: 5px;
}
.mainHeading .searchOptions .advanceFilter a{
    color: #949494;
    line-height: 20px;
    text-decoration: none;
}

.mainHeading .separator{
    border-left: 1px solid #E5F2FF;
    height: 12px;
}

.advance_search_outer{
    position: fixed;
    background: #fff;
    height: calc(100vh - 25px);
    right: 0px;
    /* height: 97vh;
    right: 12px; */
    box-shadow: 0px 23px 15.9px 0px rgba(81, 78, 78, 0.30);
    z-index: 9999;
    top: 25px;
    overflow: visible !important;
    max-width: 519px;
}
.advance_search_inner{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}
.advanceSearchTop{
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.advanceSearchHeading{
    padding: 16px 20px;
    border-bottom: 1px solid var(--primary-border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.advanceSearchHeading h4{
    color: #00234B;
}
.advanceSearchHeading a:hover {
    transform: rotate(90deg);
    transition: transform 0.8s ease;
}

.advanceSearchHeading a {
    width: 27px;
    height: 27px;
    transform: rotate(0deg);
    transition: transform 0.8s ease;
    background: url(../../../images/closed.svg);
}
.advanceSearchHeading .advTooltip{
    display: none;
    position: absolute;
    right: 5px;
    top: -30px;
}
.advanceSearchHeading a:hover + .advTooltip{
    display: block;
}
.advanceSearchOptions{
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 0px 20px 20px 20px;
    height: calc(100vh - 165px);
    overflow-y: auto;
    overflow-x: hidden;
}
.advanceSearchOptions .options{
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.advanceSearchOptions .options .select-selected{
    width: 201px;
    height: 43px;
    border: 1px solid var(--secondary-border-color);
}
.small .select-selected{
    width: 158px !important;
    height: 43px;
    border: 1px solid var(--secondary-border-color);
}
.small .multiselect-button{
    width: 158px !important;
    height: 43px;
    border: 1px solid var(--secondary-border-color);
}
.options.client .select-selected{
    width: 417px;
}
.options.client input{
    width: 417px;
}

.options.client textarea {
    height: 70px;
    border: 1px solid var(--secondary-border-color);
    padding-left: 10px;
    border-radius: 5px;
}
.advanceSearchOptions .options .dateRangeBox{
    display: flex;
    align-items: center;
    gap: 5px;
}
.options input{
    width: 201px;
    height: 43px;
    border: 1px solid var(--secondary-border-color);
    padding-left: 10px;
    border-radius: 5px;
}
.options input[type= "radio"]{
    height: 15px;
    width:15px
}
.options .dateRangeBox input{
    width: 194px;
}
.advanceSearchOptions .optionsOuter{
    display: flex;
    align-items: center;
    gap: 15px;
}
.advFilterBtn{
    padding: 20px 15px;
    border-top: 1px solid var(--primary-border-color);
}

.listingContainer{
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
}

.listingToggle{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.listingToggle .separator{
    width: 100%;
    border-bottom: 1px solid var(--primary-border-color);
}

.listingTabs{
    display: flex;
    border-radius: 39px;
    border: 1px solid var(--primary-border-color);
}

.listingTabs p{
    margin: 0;
    text-align: center;
    line-height: 20px;
    padding: 6px 25px;
    white-space: nowrap;
    cursor: pointer;
}

.listingTabs p.active{
    background: var(--primary-theme-color);
    color: #fff;
    border-radius: 39px;
}

.listingTabs a{
    margin: 0;
    text-align: center;
    line-height: 20px;
    padding: 6px 25px;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    height: 32px;
}

.listingTabs a.active{
    background: var(--primary-theme-color);
    color: #fff;
    border-radius: 39px;
}


.listingSummary{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.listingSummary div{
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    cursor: pointer;
}
.listingSummary .summaryAmt{
    /* border-top: 3px solid #fff; */
    padding: 20px;
    min-width: 18%;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #FFF;
}
.listingSummary.listingPOR .summaryAmt{
    min-width: 15% !important;
}
.listingSummary .summaryAmt label{
    text-transform: uppercase;
}
.listingSummary .summaryAmt:hover{
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.06);
    background: #FEFEFF;
}

.listingSummary .summaryAmt.active{
    
    border-radius: 5px;
    border: 1px solid var(--primary-theme-color);
    background: #FFF8F3;
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.06);
}

.listingSummary h2{
    text-align: center;
    white-space: nowrap;
}

.listingSummary label{
    text-align: center;
}

/* .listingSummary .separator{
    height: 27px;
    border-left: 1px solid var(--primary-border-color);
} */

.recentInvoices{
    min-height: 28px;
}
.recentInvoices:hover .showCardsHover{
    display: flex !important;
}
.recentInvoices .showCards{
    display: none;
    align-items: center;
}
.showCards button{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 35px;
    background: var(--primary-border-color);
}
.showCards .recentSeperator{
    width: 100%;
    border-top: 1px solid var(--primary-border-color);
}

.recentCards{
    display: none;
    flex-direction: column;
    gap: 20px;
}
.cardHeading{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cardHeading h6{
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}
.cardHeading h6 .card2{
    display: none;
}
.cardHeading h6:hover{
    color: #2A2E34;
}
.cardHeading h6:hover .card2{
    display: block;
}
.cardHeading h6:hover .card1{
    display: none;
}
.invoiceCards{
    display: flex;
    justify-content: space-between;
    align-items: center;
    opacity: 1;
}
.cardContainer{
    width: 15%; /* 185px */
    height: 250px;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #D7DDE3;
    padding: 4px;
}
.cardContainerInner{
    height: 100%;
    border-radius: 4px;
    border: 1px solid var(--primary-border-color);
    background: #FFF;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
}
.cardContainerInner .cardTop{
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 15px;
}
.cardContainerInner .cardBottom{
    border-top: 1px solid var(--primary-border-color);
    padding: 15px;
}
.cardContainerInner .cardBottom h6{
    text-align: end;
}
.cardContainerInner a{
    text-decoration: none;
    width: 100%;
    text-align: center;
    padding: 15px 24px;
    display: block;
    pointer-events: none;
}

table.listingTable{
    width: 100%;
    border-collapse: collapse;
    height: fit-content;
}
table.listingTableNew{
    width: 100%;
    border-collapse: collapse;
    height: fit-content;
}
.invoicePreviewDiv{
    flex-grow:1;
    width:0%;
    height: calc(-59px + 100vh);
    overflow-y: auto;
    display: block;
}
table.listingTable tr.listHeading{
    height: 45px;
}
table.listingTableNew tr.listHeadingNew{
    height: 45px;
}


table.listingTable tr.listHeadingNew th{
    border-bottom: 1px solid var(--primary-border-color);
}
table.listingTableNew tr.listHeadingNew th{
    border-bottom: 1px solid var(--primary-border-color);
}

table.listingTable tr.listHeading th {
    border-bottom: 1px solid var(--primary-border-color);
}


table.listingTable tr.listHeading th.listCheckbox{
    width: 2%;
    padding-left: 10px;
    padding-right: 10px;
}

table.listingTable tr.listHeading th.client{
    width: 20%;
}

table.listingTable tr.listHeading th.tag{
    width: 30%;
}

table.listingTable tr.listHeading th.clientEst{
    width: 55%;
}

table.listingTable tr.listHeading th.description{
    width: 35%;
}

table.listingTable tr.listHeading th.clientRec{
    width: 36%;
}

table.listingTable tr.listHeading th.date{
    width: 10%;
}

table.listingTable tr.listHeading th.dateRec{
    width: 15%;
}

table.listingTable tr.listHeading th.amount{
    width: 20%;
    text-align: end;
    padding-right: 100px;
}
table.listingTable tr.listHeading th.amount2{
    padding-right: 20px;
}
table.listingTableNew tr.listHeadingNew td.amount{
    width: 20%;
    text-align: end;
    padding-right: 100px;
}
table.listingTable tr.listHeading th.status{
    width: 10%;
    text-align: center;
}
table.listingTable tr.listHeading th.quantity {
    width: 15%;
}

table.listingTable tr.listingData{
    height: 81px;
    border-bottom: 1px solid var(--primary-border-color);
}
table.listingTableNew tr.listingDataNew{
    height: 60px;
    border-bottom: 1px solid var(--primary-border-color);
}

table.listingTableNew tr.listingDataNew td.receiver_status a {
    text-decoration: none;
    min-width: 85px;
    width: fit-content;
    padding: 5px 10px;
    white-space: nowrap;
}

table.listingTableNew tr.listingDataNew td.receiver_status div{
    align-items: center;
}
table.listingTableNew tr.listingDataNew td a{
    text-decoration: none;
    min-width: 85px;
    width: fit-content;
    padding: 5px 10px;
    white-space: nowrap;
}

table.listingTableNew tr.listingDataNew td a.status{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    text-decoration: none;
}

table.listingTable tr.listingData.paid_invoice {
    background: #E0FFEF !important;
}

table.listingTable tr.listingData.paid_invoice:hover {
   background: #CAF5DE !important;
}

table.listingTable tr.listingData:hover{
    background: #FFFBF5;
}

table.listingTable tr.listingData:hover td.listCheckbox input{
    display: block !important;
}

table.listingTable tr.listingData td.listCheckbox{
    padding-left: 10px;
    padding-right: 10px;
}

table.listingTable tr.listingData td.amount{
    text-align: end;
    padding-right: 100px;
    white-space: nowrap;
}

table.listingTableNew tr.listingDataNew td.amount{
    text-align: end;
    padding-right: 100px;
    white-space: nowrap;
}

table.listingTable tr.listingData td.receiver_status div{
    align-items: center;
}

table.listingTable tr.listingData td.listCheckbox input{
    padding-left: 10px;
    display: none;
    margin-top: 20px;
}
  
table.listingTable tr.listingData td.invbtn {
    position: relative;
    cursor: pointer;
    max-width: 40px;
    min-width: 35px;
}

table.listingTable tr.listingData td.invbtn .viewInv {
    width: 25px;
    height: 20px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: right;
}
table.listingTable tr.listingData td.invbtn .viewInvHover{
    display: none;
}
table.listingTable tr.listingData:hover td.invbtn .viewInvHover{
    display: flex;
}

table.listingTable tr.listingData td.invbtn .moreOptions {
    display: none;
    position: absolute;
    right: 30px;
    top: 45px;
    z-index: 999;
    background: white;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    width: 185px;
    max-height: 259px;
    overflow: auto;
}
/* table.listingTable tr.listingData:nth-last-child(2) td.invbtn .moreOptions, table.listingTable tr.listingData:nth-last-child(3) td.invbtn .moreOptions, table.listingTable tr.listingData:nth-last-child(4) td.invbtn .moreOptions {
    right: 30px;
    top: -231px;
} */

table.listingTable tr.listingData td.invbtn .moreOptions ul {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
    width: 100% !important;
    margin-block-end: 0;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li {
    padding: 14px 19px;
    display: flex;
    gap: 5px;
    align-items: center;
    border-bottom: 1px solid var(--Primary-Stroke, #E3E7EB);
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li a{
    padding: 0;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li:hover {
    background: #fff7f1;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li:hover img.normal {
    display: none;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li:hover img.hover {
    display: block;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li img.hover {
    display: none;
}

table.listingTable tr.listingData td.invbtn .moreOptions ul li:hover a {
    color: #f76600;
}

table.listingTable tr.listingData td.invbtn li:hover a{
    color: #f76600;
}

table.listingTable tr.listingData td a{
    text-decoration: none;
    min-width: 85px;
    width: fit-content;
    padding: 5px 10px;
    white-space: nowrap;
}

table.listingTable tr.listingData .clientInv a{
    padding: 0;
}

table.listingTableNew tr.listingDataNew .clientInv a{
    padding: 0;
}

table.listingTable tr.listingData .clientInv{
    display: flex;
    flex-direction: column;
    gap: 5px;
    position: relative;
    width: fit-content;
    cursor: pointer;
}

table.listingTable tr.listingData .clientInv .invListTooltip{
    display: none;
    position: absolute;
    border-radius: 5px;
    background: var(--primary-main-heading);
    box-shadow: 0px 18px 22px 0px rgba(0, 0, 0, 0.18);
    padding: 15px 4px;
    color: #fff !important;
    left: 100%;
    flex-direction: column;
    gap: 15px;
    top: -72px;
    z-index: 999;
    min-width: 469px;
}

table.listingTable tr.listingData .clientInv .invListTooltip .listTooltipArrow{
    width: 11px;
    height: 25px;
    background: url(../../../images/listTooltipArrow.svg) no-repeat;
    position: absolute;
    left: -10px;
    top: 78px;
    z-index: 999;
}

table.listingTable tr.listingData .clientInv .invListTooltip p{
    white-space: nowrap;
    margin: 0;
    color: #fff;
}

table.listingTable tr.listingData .tooltipContent{
    padding: 0 15px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}
table.listingTable tr.listingData .tooltipContent:not(:last-child){
    padding-bottom: 15px;
    border-bottom: 1px solid #fff;
}

table.listingTable tr.listingData .tooltipContent h6{
    color: #fff !important;
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

table.listingTable tr.listingData .tooltipContent div{
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

table.listingTable tr.listingData .tooltipContent div h6:nth-child(2){
    text-align: end;
}

table.listingTable tr.listingData .clientInv:hover .invListTooltip{
    display: flex;
}

table.listingTable tr.listingData td .tagName{
    width: fit-content;
    padding: 5px 10px;
    border-radius: 18px;
}

.listingTable .listingData td .tagName span{
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
.listingTable .listingData td .tagName span i{
    font-size: 10px;
}



.listHeads{
    text-align: start;
}

.listHeads a{
    text-decoration: none;
    text-align: start;
    white-space: nowrap;
}

.list{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.list .checkFilter{
    position: fixed;
    bottom: 33px;
    border-radius: 8px;
    border: 1px solid #606391;
    background: #323452;
    box-shadow: 0px -1px 20.1px 0px rgba(7, 5, 21, 0.30);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 50px;
    width: 70%;
}

.mobActionImg {
    display: none;
}
table.listingTable tr.listingData td a.status{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    text-decoration: none;
}
table.listingTable tr.total_amount td{
    height: 52px;
    text-align: left;
    font-style: normal;
    line-height: normal;
}
table.listingTable tr.total_amount td span{
    display: flex;
    align-items: center;
    gap: 10px;
}
table.listingTable tr.listingData2{
	display: flex;
    align-items: start;
    height: unset;
    border-bottom: 1px solid var(--primary-border-color);
    max-width: 284px !important;
	/* min-width: 235px; */
}
.listingProduct.listingData2 td:nth-child(2){
    padding-top: 8px;
}
table.listingTable tr.listingData2 td.custom6_1{
	display: none !important;
}
table.listingTable tr.listingData2 .prev{
	display: none !important;
}
table.listingTable tr.listingData2 .listCheckbox input {
    margin-top: 10px !important;
	display: block !important;
}
table.listingTable tr.listingData2 .clientInv{
    display: none;
}
table.listingTable tr.listingData2 .clientInvPrev{
    display: flex !important;
    align-items: start;
    justify-content: space-between;
    padding: 10px 10px 10px 0;
}

table tr.listingData2 .clientInvPrev .invPrevInfo{
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
}
table tr.listingData2 .clientInvPrev .invPrevInfo .preview1{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
table tr.listingData2 .clientInvPrev .invPrevInfo .invPrevAmt{
    /* white-space: nowrap; */
}
table tr.listingData2 .clientInvPrev .invPrevInfo a{
    padding: 0;
}
table tr.listingData2 .clientInvPrev .invPrevNo{
    display: flex;
    gap: 5px;
    cursor: pointer;
}
table tr.listingData2 td:nth-child(2){
    width: 100%;
}
table tr.listingData2 .clientInvPrev .invPrevStatus a{
    background: transparent;
    margin-top: 5px;
    display: block !important;
    text-transform: uppercase;
}
table.listingTable tr.listingData2:hover {
    background: #FFFBF5 !important;
}

a.approval-pending{
    color: #AB810B !important;
    background: rgba(244, 197, 66, 0.20);
}
a.pending{
    color: #AB810B !important;
    background: rgba(244, 197, 66, 0.20);
}
a.paid{
    color: #2D9CDB !important;
    background: rgba(45, 156, 219, 0.20);
}
a.partial-paid{
    color: #E36D3A !important;
    background: rgba(242, 139, 130, 0.20);
}
a.outstanding{
    color: #FF6C6C !important;
    background: rgba(211, 47, 47, 0.20);
}
a.accepted{
    color: #32BA43 !important;
    background: rgba(107, 203, 119, 0.20);
}
a.approved{
    color: #239228 !important;
    background: rgba(143, 255, 148, 0.20);
}
a.viewed{
    color: #81A1C1 !important;
    background: rgba(129, 161, 193, 0.20);
}
a.failed{
    color: #D14343 !important;
    background: rgba(209, 67, 67, 0.20);
}
a.auto-paid{
    color: #26C6DA !important;
    background: rgba(38, 198, 218, 0.20);
}
a.resolved{
    color: #809B60 !important;
    background: rgba(139, 195, 74, 0.20);
}
a.disputed{
    color: #8B5D4F !important;
    background: rgba(255, 112, 67, 0.20);
}
a.auto-failed{
    color: #ED5050 !important;
    background: rgba(183, 28, 28, 0.20);
}
a.approval-rejected{
    color: #9D3432 !important;
    background: rgba(229, 57, 53, 0.20);
}
a.approval-needed{
    color: #FF9C0A !important;
    background: rgba(255, 183, 77, 0.20);
}
a.Archived{
    color: #988FB8;
    background: rgba(203, 203, 203, 0.20);
}
a.Deleted{
    background: rgba(117, 117, 117, 0.20);
    color: #757575;
}
a.Stop{
    color: #FF6868;
    background: rgba(251, 155, 155, 0.20);
}
a.open{
    color: #45ACFF !important;
    background: rgba(100, 181, 246, 0.20);
}
a.closed{
    color: #546E7A !important;
    background: rgba(144, 160, 167, 0.20);
}
a.sent{ 
    color: #A662FF !important;
    background: rgba(192, 182, 255, 0.20);   
}
a.draft{
    color: #808390 !important;
    background: rgba(241, 219, 186, 0.20);
}
a.rejected{
    color: #C02428 !important;
    background: rgba(178, 34, 34, 0.20);
}
a.Active{
    background: rgba(107, 203, 119, 0.20);
    color: #32BA43;
}

a.Inactive{
    color: #808390 !important;
    background: rgba(241, 219, 186, 0.20);
}
a.unBilled{
    background: rgba(74, 74, 74, 0.20);
    color: #3F3F3F;
}

a.billed {
    background: rgba(116, 220, 167, 0.20);
    color: #15934E;
}
a.invoiced{
    background: rgba(139, 195, 74, 0.20);
    color: #809B60;
}

span.contractor{
    display: flex;
    align-items: center;
    color: var(--primary-sub-heading);
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 5px 10px;
    border-radius: 20px;
    background: var(--primary-border-color)
    
}
.checkFilterOptions{
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
}

.checkFilterOptions div a{
    display: flex;
    align-items: center;
    gap: 5px;
    color: #FFF;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    padding: 10px;
    width :100%;
}

.checkFilterOptions div a:hover{
    border-radius: 5px;
    background: #474964;
}

.checkFilter .count{
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 5px;
    border: 1px solid #474964;
    background: #474964;
    padding: 10px;
}

.checkFilter .count:hover{
    border-radius: 5px;
    border: 1px solid #474964;
    background: transparent;
}

.checkFilter .count p{
    color: #FFF;
    font-size: 12px;
    font-weight: 500;
}

.checkFilter button{
    background: transparent;
}







/* Pagination */
.paging {
    width: 100% !important;
    padding: 0;
    margin: 20px 0;
}


.paging p {
    color: var(--list-heading-color);
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px
}

.paging .page1 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.paging .page2{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: #F9FAFB;
    height: 28px;
    /* margin: 0 5px; */
    padding: 0 12px;
    gap:5px;
}
.paging .page2 a{
    color: var(--primary-sub-heading);
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    margin: 0;
    width: 20px !important;
}
.paging .page2 span{
    width: 32px;
    height: 32px;
    border-radius: 29px;
    background: var(--primary-theme-color);
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 21px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.paging .page1 .img1, .paging .page1 .text_blue {
    width: 28px;
    height: 28px;
    margin: 0;
    border-radius: 5px;
    /* border: .5px solid var(--primary-border-color) */
}
.paging .prevPaging{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    width: fit-content;
    gap: 10px;
}

.pagination {
    list-style: none;
    align-items: center;
    border-radius: 16px;
    background: #F9FAFB;
    height: 28px;
    margin: 0 5px;
    padding: 0 12px;
    width: fit-content;
    justify-content: center;
    display: flex;
}
.pagination li.current {
    font-weight: 500;
    font-style: normal;
    width: 32px;
    height: 32px;
    border-radius: 29px;
    background: var(--primary-theme-color);
    color: #fff;
    text-align: center;
    font-size: 14px;
    line-height: 21px;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pagination li a {
    display: block;
    color: var(--primary-sub-heading);
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    text-decoration: none;
    width: 20px !important;
}
.pagination li.current a {
    color: #fff !important;
}
/* New NavBar */
.bodyMainContainer{
    display: flex;
    height: 100vh;
}
.bodyMainContainer.form .navbarOuter{
    pointer-events: none;
    filter: blur(3px);
    border: 1px solid transparent;


}
.bodyMainContainer.form #nav2{
    filter: blur(3px);
}

.navbarOuter *{
    box-sizing: border-box;
}
.navbarOuter{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 207px;
    background: #0B0F1F;
    position: relative;
    height: 100%;
    box-sizing: border-box;
    transition: width 0.5s ease-in-out, padding 0.5s ease-in-out;
    width: 209px;
    /* visibility: hidden; */
    overflow: visible;
}
.navbarOuter.spanish{
    width: 224px;
}
.navbarOuter.french{
    width: 234px;
}
.navbarOuter.german{
    width: 234px;
}

body.loaded .navbarOuter {
    visibility: visible !important;
}

.navToggle{
    position: absolute;
    bottom: 10px;
    right: -10px;
}

.navBarTop{
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 15px 20px;
    flex-grow: 1;
}
.logoDashboard{
    padding-left: 14px;
}

.profileMenuNew {
    margin-top: auto; 
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 10px;
}

.upgradeOption{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    border-top: 1px solid #232323;
    border-bottom: 1px solid #232323;
    color: #878EAA;
    cursor: pointer;
}
.upgradeOption:hover{
    background: #242736;
}
.moreProfileOptions{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    /* border-top: 1px solid #232323; */
}

.moreProfileOptions.moreOptTop{
    border-top: 1px solid #232323;
}

.moreProfileOptions div{
    padding: 10px;
    border-radius: 50%;
}

.moreProfileOptions div:hover{
    background: #242736;
}

.moreProfileOptions img{
    width: 20px;
    height: 20px;
}

.navbarOuter .navSubMenu {
    display: none;
    margin-top: 10px;
    max-height: 300px;
    overflow-y: auto;
}

/* .navSubMenu {
    display: none;
    opacity: 0;
    transform: translateY(10px);
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.navSubMenu.show {
    display: block;
    opacity: 1;
    transform: translateY(0);
} */

.navbarOuter .navSubMenu.active {
    display: block;
}

.navbarOuter .navSubMenu li {
    width: 100%;
    display: block;
    list-style: none;
    margin: 0;
    height: auto !important;
    padding: 8px 5px 8px 10px;
    margin-bottom: 5px;
    cursor: pointer;
}


.navbarOuter .navSubMenu li:hover {
    background: #242736;
    border-radius: 20px;
}


.navbarOuter .navSubMenu li a.name {
    color: #878EAA;
    text-decoration: none;
    display: flex;
    gap: 5px;
    align-items: center;
}

.navbarOuter .navSubMenu li.active {
    background: #242736;
    border-radius: 20px;
}

.navbarOuter .navSubMenu li.active a.name {
    color: #FFF;
}
.navbarOuter .navSubMenu li.active a i{
    color: #FFF;
}

.navbarOuter .navSubMenu li a i {
    margin-right: 10px;
    font-size: 6px;
    color: transparent;
}

.navbarOuter .navSubMenu li:hover i{
    color: #878EAA;
}

.navbarOuter .navbarInner{
    display: flex;
    gap: 10px;
    flex-direction: column;
    /* min-width: 166px; */
}

.navbarOuter .navbarInner .navTab{
    position: relative;
    padding: 8px 5px;
}

.navbarOuter .navbarInner .navTab:hover{
    border-radius: 20px;
    background-color: rgba(36, 39, 54, 0.6);
}

.navbarOuter .navbarInner .navTab.active{
    border-radius: 20px;
    background-color: rgba(36, 39, 54, 0.6);    
}

.navbarOuter .navbarInner .navLink:hover span{
    color: #fff;
}
.navbarOuter .navbarInner .navLink:hover .primary{
    display: none;
}
.navbarOuter .navbarInner .navLink:hover .activeLink{
    display: block;
}

.navbarOuter .navbarInner .navLink.active span{
    color: #FFF;
}

.navbarOuter .navbarInner .navLink .activeLink{
    display: none;
}

.navbarOuter .navbarInner .navLink.active .primary{
    display: none;
}
.navbarOuter .navbarInner .navLink.active .activeLink{
    display: block;
}

.navbarOuter .navbarInner .navLink img{
    background: transparent;
}

.navbarOuter .navbarInner .navLink{
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    padding: 0 5px;
}

.navbarOuter .navbarInner .navLink span{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #878EAA;
}

.subMenuOptions {
    display: flex;
}

.addMore1{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 46px;
    background: var(--secondary-theme-color);
    padding: 8px 10px;
}

.addMore1 a{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}
.addMore1 button{
    background: transparent;
    padding-left: 5px;
    border-left: 1px solid rgba(255, 255, 255, 0.8);
}

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

.addMore2 img{
    width: 33px;
    height: 33px;
}

.quickAddDiv{
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    position: absolute;
    z-index: 999;
    right: -177px;
    min-width: 183px;
}
.quickAddDiv div:first-child{
    padding: 15px 15px 3px 15px;
}
.quickAddDiv .create{
    margin: 5px;
    padding: 8px 10px; 
}
.quickAddDiv .create:hover{
    border-radius: 144px;
    background: #F9FAFB;
}
.quickAddDiv .create a{
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
}
.listImages .hoverImg{
    display: none;
}
.listImages:hover .normalImg{
    display: none;
}
.listImages:hover .hoverImg{
    display: block;
}

.profileMenu{
    position: relative;
}

.profileMenu .profileMenuInner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* gap: 10px; */
    margin: 10px 25px 10px 20px;
    padding: 10px 9px;
    cursor: pointer;
}
.profileMenu .profileMenuInner a {
    text-decoration: none;
}
.profileMenu .profileMenuInner:hover a {
color: #fff
}

.profileMenu .profileMenuInner:hover{
    border-radius: 20px;
    background-color: rgba(36, 39, 54, 0.6);
}
.profileMenu .profileMenuInner:hover span{
    color: #fff;
}
.profileMenu .profileMenuInner .activeLink {
    display: none;
}
.profileMenu .profileMenuInner:hover .activeLink {
    display: block;
}
.profileMenu .profileMenuInner:hover .primary {
    display: none;
}

.profileMenu .profileMenuInner .userCompanyName{
    color: #878EAA;
}

.profileMenu .profileMenuInner .img2{
    width: 35px;
    height: 35px;
}

.profileMenu .profileMenuInner .profileLogo{
    border-radius: 50%;
}

.profileMenu .profileMenuInner .img1{
    width: 8px;
    height: 4px;
}

.profileBox{
    display: none;
    width: 183px;
    position: absolute;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    z-index: 1000;
    left: 220px;
    bottom: 11px;
}

.profileBox ul{
    list-style: none;
}
.profileBox ul li{
    border-bottom: 1px solid var(--primary-border-color);
}
.profileBox ul li a{
    display: flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    padding: 14px 15px;
}


.navbarOuter.shrink {
    width: 80px;
    min-width: unset;
}
.navbarOuter.shrink .navbarInner{
    align-items: center;
    position: relative;
}
.navbarOuter.shrink .logoDashboard{
    padding-left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.navbarOuter.shrink .navBarTop{
    padding: 15px;
    overflow: visible !important;
}

.navbarOuter.shrink .navTab{
    width: fit-content;
}

.navbarOuter.shrink .navTab.active {
    border-radius: 50%;
}

.navbarOuter.shrink .upgradeOption, .navbarOuter.shrink .profileMenuInner{
    padding: 10px 15px;
    justify-content: center;
}
/* NavBar CSS ends */






/* Reports CSS */
.reportsOuter{
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.reportSubMenu{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.favReports{
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
}

.favReports .reportTutorial{
    position: absolute;
    z-index: 999;
}

.favReports .reportTutorial1{
    bottom: 30px;
    left: 150px;
}

.favReports .reportTutorial2{
    bottom: -90px;
    right: 40px;
}

.favReports div{
    height: 261px;
    /* width: 175px; */
    display: flex;
    align-items: center;
    justify-content: center;
}

.favReports div .starFav{
    position: absolute;
    right: 25px;
    top: 30px;
    z-index: 999;
    cursor: pointer;
}

.favReportData{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12.5px;
    position: absolute;
    top: 0;
    width: 160px;
    text-align: center;
    cursor: pointer;
}
.favReportData p{
    margin: 0;
    text-align: center;
}

.generateReportOuter{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
}
.generateReports{
    display: flex;
    justify-content: space-between;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    padding: 25px;
    width: 48%;
    cursor: pointer;
}

.generateReports .details{
    display: flex;
    align-items: center;
    gap: 20px;
}

.generateReports .details .reportHead{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.generateReports .details .reportHead p{
    margin: 0;
}


.generateReports .makeFav{
    position: relative;
}

.generateReports .makeFav:hover .favReportInfo{
    display: flex;
}

.generateReports .makeFav .starHover1{
    display: none;
}

.generateReports .makeFav:hover .starReports{
    display: none !important;
}

.generateReports .makeFav:hover .starHover2{
    display: block;
}

.favInfo{
    display: none;
    align-items: center;
    position: absolute;
    color: #fff;
    background: var(--primary-sub-heading);
    border-radius: 5px;
    z-index: 999;
    padding: 10px;
    width: 150px;
    top: -81px;
    right: -23px;
}

/* Reports CSS ends */







.toggle_tabs {
    display: flex;
    gap: 25px;
}
.toggle_tabs label {
    color: #667382;
    font-weight: 500;
    font-size: 14px;
    line-height: 27px;
    cursor: pointer;
}
.toggle_tabs .active {
    color: var(--primary-theme-color);
    border-bottom: 1px solid var(--primary-theme-color);
}

.toggle_tabs a{
    text-decoration: none;
}

.formContainer {
    display: flex;
    gap: 57px;
}
.formLeftContainer{
    width: 782px;
}

.formRightContainer{
    width: 331px;
}

.rightSectionInner .rightContainerLabel {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.rightSectionInner .img2{
    display: none;
}
.rightSectionInner:hover .img1{
    display: none;
}
.rightSectionInner:hover .img2{
    display: block !important;
}
.rightContainerInner{
    display: flex;
    align-items: start;
    gap: 10px;
}
.rightSectionInner:hover p {
    color: var(--primary-theme-color);
}
.rightSectionInner:hover {
    background: #FFF8F3;
}

.formRightContainer .rightSectionInner {
    padding: 25px 5px;
    border-bottom: 1px solid var(--primary-border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}
.formRightContainer .rightSectionInner:first-of-type {
    border-top: 1px solid var(--primary-border-color);
}
.rightSectionDescInner{
    display: flex;
    gap: 5px;
    flex-direction: column;
}
.otherDropDown{
    position: absolute;
    border-radius: 5px;
    border: 1px solid #AFAFAF;
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    padding: 15px;
    width: 319px;
    display: flex;
    flex-direction: column;
    right: 0;
    z-index: 999;
    top: 40px;
}
.otherDropDown li:first-of-type {
    padding-top: 0;
}

.otherDropDown li {
    border-bottom: 0.6px solid #E6E6E6;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    list-style: none;
    cursor: pointer !important;
}
.otherDropDown li:last-of-type{
    border-bottom: none ;
    padding-bottom: 0;
}

.popupHeader {
    border-bottom: 1px solid #E6E6E6;
    padding-bottom: 10px;
}


.invoicera-multiselect {
    position: relative;
    width: 100%;
}

.invoicera-multiselect-dropdown {
    position: relative;
    width: 100%;
}

.invoicera-multiselect * {
    box-sizing: border-box !important;
}
.multiselect-button {
    width: 100%;
    padding: 8px;
    border: 1px solid #E6E6E6;
    background: #fff;
    cursor: pointer;
    text-align: left;
    border-radius: 5px;
    display: block;
    height: 43px;
    background: url(../../../images/Path.svg) 96% center no-repeat #fff !important;
    color: var(--Primary-Main-Heading, #2A2E34);
    display: flex;
    align-items: center;
    font-weight: 500;
    box-sizing: border-box;
    font-size: 14px;
}

.multiselect-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
    display: none;
    border-radius: 3px;
    padding: 10px 0;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #FFF;
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.06);
}

.multiselect-menu .search-box {
    width: calc(100% - 20px) !important;
    margin: 0 10px 10px;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.multiselect-menu .options-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.multiselect-menu .options-list li {
    padding: 5px 10px;
   
    height: 43px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--primary-border-color);
    line-height: normal;
}
.multiselect-menu .options-list li label {
    color: var(--primary-sub-heading);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
}

.multiselect-menu .options-list li input[type="checkbox"] {
    margin-right: 10px;
}

.multiselect-menu .options-list li:hover{
    background-color: #F9FAFB;
    background-clip: content-box;
}

.selected-chips {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.chip {
    border-radius: 5px;
    border: 1px solid var(--Primary-Stroke, #E3E7EB);
    background: #F9FAFB;
    padding: 5px;
}

.chip-close {
    font-weight: 400;
    font-size: 14px;
    color: #F70004;
}







.projectInfoContainer {
    border: 1px solid #B5BFC7;
    background: #FFF;
    border-radius: 0 0 10px 10px;
    padding: 30px 45px;
    display: flex;
    flex-direction: column;
    gap: 35px;
    position: relative;
}
.projectInfoContainer .selectedClient {
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 10px;
    border: 1px solid #B5BFC7;
    background: var(--Primary-White, #FFF);
    box-shadow: 0px 4px 11px 0px rgba(182, 182, 182, 0.25);
    transform: rotate(5deg);
    padding: 20px;
    width: 269px;
    height: 134px;
    z-index: 1;
    transition: transform 0.3s ease;
}

.projectInfoContainer .selectedClient.normal {
    transform: rotate(0deg);
    /* Normal rotation when active */
}

.projectInfoContainer .clientDropdwon select {
    display: block;
    width: 100%;
    padding: 5px;
}

.projectInfoContainer .clientInformation {
    display: flex;
    align-items: start;
    gap: 8px;
}
.projectInfoContainer .clientInformation .clientName {
    font-weight: bold;
    font-size: 16px;
}

.projectInfoContainer .clientInformation .clientIcon {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #007BFF;
    color: #FFF;
    text-align: center;
    line-height: 30px;
    margin-right: 10px;
}

.projectInfoContainer .assignClient {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 2px dashed rgba(181, 191, 199, 0.50);
    gap: 10px;
}

.projectInfoContainer .clientPin {
    position: absolute;
    height: 57px;
    top: -23px;
    right: 24px;
    z-index: 2;
}


ul.clientDropDown {
    left: 0;
    max-width: 80%;
    min-height: 100px !important;
    min-width: 272px;
    overflow-x: hidden;
    position: relative;
    top: 59px;
    z-index: 99999;


    max-height: 200px;
    overflow-y: auto;
    width: 100% !important;
    border-radius: 5px;
    border: 1px solid #AFAFAF;
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
}

ul.clientDropDown li {
    
    list-style: none outside none;

    padding: 0px 15px;
    height: 43px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    cursor: pointer;
    color: #4F5A63;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    border-bottom: 1px solid #E6E6E6;
    width: 100% !important;
}

ul.clientDropDown li:hover {
    background-color: #F9FAFB !important;
    color: #2A2E34 !important;
}

ul.clientDropDown li.active {
    background-color: #F9FAFB;
    color: #F76600 !important;
}

ul.clientDropDown li span.country {
    color: #aaaaaa;
    display: block;
    font-size: 10px;
    line-height: 13px;
    text-transform: uppercase;
}

ul.clientDropDown li.active span.country {
    color: #F76600 !important;
}

.creditForm input {
	width: 511px;
	height: 43px;
	padding-left: 5px;
	border-radius: 5px;
	border: 1px solid var(--primary-border-color);
}

.creditForm textarea {
	width: 511px;
	height: 96px;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid var(--primary-border-color);
}
.prevQLDiv{
	display: flex;
	flex-direction: column;
	border-radius: 5px;
	border: 1px solid #AFAFAF;
	background: #FFF;
	box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
	padding: 0 15px;
	position: absolute;
	z-index: 999;
	top: 47px;
    right: 52px;
}

.prevQLDiv li{
	padding: 10px 0;
	border-bottom: 1px solid #E6E6E6;
    list-style: none;
}
.prevQLDiv li a{
    text-decoration:none;
}
.prevOptions{
    cursor: pointer;
}
.prevQLDiv{
	display: flex;
	flex-direction: column;
	border-radius: 5px;
	border: 1px solid #AFAFAF;
	background: #FFF;
	box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
	padding: 0 15px;
	position: absolute;
	z-index: 999;
	top: 47px;
    right: 52px;
}

.prevOptionsDiv li a{
	display: flex;
	align-items: center;
	gap: 10px;
}

.prevOptionsDiv li{
	padding: 10px 0;
	border-bottom: 1px solid #E6E6E6;
    list-style: none;
}

.prevOptionsDiv li:hover{
	background: rgba(247, 102, 0, 0.1);
}
.paymentSummaryLower{
    width: 328px;
    margin-left: auto;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
    background: #F9FAFB;
    border-radius: 5px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: end;
}
.importDiv{
    width: 766px;
    border-radius: 5px;
    border: 1px solid #B5BFC7;
    box-shadow: 0px 18px 22px 0px rgba(0, 0, 0, 0.18);
    padding: 15px;
    display:flex;
    position: absolute;
    top: 50%;
    left: 50%;
    background: white;
    transform: translate(-50%, -50%);
}

.additional_options .payGateOptions{
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.selectStore .select-selected{
    /* bottom: 45px; */
    top: unset;
    width:100%;
    color: #878EAA;
    border:1px solid rgba(36, 39, 54, 0.6) !important;
    background: url(../../../images/PathStore.svg) 96% center no-repeat rgba(36, 39, 54, 0.6) !important;
}
.selectStore .select-items {
    bottom: 100% !important;
    top:unset !important;   
}

.selectStore .select-selected:hover{
    color:#fff !important;
}



.switch {
    position: relative;
    display: block;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #667382;
    transition: .4s;
    border-radius: 34px;
    height: 20px;
    width: 33px;
}

.slider.round {
    border-radius: 34px;
}

.slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
}

input:checked+.slider {
    background-color: #F87920;
}

input:checked+.slider:before {
    transform: translateX(12px);
}

.selectStore .select-selected:hover{
    color:#fff !important;
}



.switch {
    position: relative;
    display: block;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #667382;
    transition: .4s;
    border-radius: 34px;
    height: 20px;
    width: 33px;
}

.slider.round {
    border-radius: 34px;
}

.slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
}

input:checked+.slider {
    background-color: #F87920;
}

input:checked+.slider:before {
    transform: translateX(12px);
}

.storeStaff {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    padding: 20px;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    z-index: 1001;
    border-radius: 5px;
    flex-direction: column;
    gap: 30px;
    height: 250px;
    width: 600px;
    overflow:auto;
}

.storeStaff form {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.storeStaff li {
    list-style: none;
    text-align: left;
    padding: 10px 0px;
    border-bottom:1px solid var(--primary-border-color);
}

.staffOverlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}
.productPreview .flexRow > label {
    width: 40%;
}
.productPreview .flexRow > p {
    width: 55%;
}


.import_div {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 30px;
    /* margin-top: 20px; */
}


.import_div a {
    color: var(--Primary-Orange, #F76600);
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration-line: underline;
}

.import_input_div {
    border-radius: 20px;
    border: 2px dashed var(--Primary-Orange, #F76600);
    padding: 35px;
    width: 100%;
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}


.import_input_div p label {
    color: #f76600;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    cursor: pointer;
}

.importInput {
    visibility: hidden;
    height: 1px;
    width: 1px;
}

.anchorTags{
    font-size: 12px;
    color:#f76600;
    text-decoration:none
}

.anchorTags:hover{
    text-decoration:underline;
}

/*  Work Order Items */

.workOrderItems {
    justify-content: space-between;
    padding: 20px 40px 0px 40px;
 }

 .workOrderItems > div {
    width: 15% !important;
 } 
 .workOrderItems input{
    width:140px;
    border:1px solid rgb(227, 231, 235);
    height: 30px;
    border-radius: 3px;
    padding-left: 5px;
 }
 .workOrderItems .select-selected{
    width:160px;
    border:1px solid rgb(227, 231, 235);
    height: 30px;
    border-radius: 3px;
    padding-left: 5px;
 }

 
.poItemsInput {
    height: 27px;
    border: 1px solid var(--primary-border-color);
    border-radius:  2px;
    padding-left: 5px;
    width: 80px;
}

.addTagDiv{
    display: none;
    position: absolute;
    background: #fff;
    right: 0;
    /* border: 1px solid #AFAFAF; */
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
    border-radius: 5px;
    top: 40px;
    padding: 14px;
    z-index: 999;
}

.addTagDiv input{
    height: 43px;
    border: 1px solid var(--secondary-border-color);
    padding-left: 10px;
    border-radius: 5px;
}

.addTagDiv input.search-box{
    height: 33px;
}

.groupByTag .gTagOuter{
    border: 1px solid var(--secondary-border-color);
    border-radius: 10px;
    /* overflow: hidden; */
}

.gTagOuter .gTagName {
    padding: 20px 10px;
    border-radius: 10px 10px 0 0;
}

.gTagOuter .tagName{
    padding: 5px 10px;
    border-radius: 18px;
}
.multilingualList{
    position: absolute;
    background-color: #fff;
    top: -130%;
    /* left: 0; */
    right: 10px;
    z-index: 99;
    max-height: 250px;
    overflow-y: auto;
    width: 85% !important;
    /* padding: 0px 10px; */
    border-radius: 5px;
    border: 1px solid #AFAFAF;
    background: #FFF;
    box-shadow: 0px 2px 15.9px 0px rgba(81, 78, 78, 0.30);
}
.multilingualList .lang{
    padding: 10px 15px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 14px !important;
    font-weight: 500;
    color: #8C98A3 !important;
    border-bottom: 0.6px solid #E6E6E6;
    cursor: pointer;
}
.multilingualList .lang.current {
    color: var(--primary-theme-color) !important;
    background: url(../../../images/selectedCheck.svg) no-repeat 95% #F9FAFB !important  ;

}

.crispSection{
    width: fit-content;
    position: absolute;
    bottom: 9px;
    right: 17px;
}
.crispSection .mainImg {
    width: 75px;
    cursor: pointer;
}

.crispSection:hover .hoverImg {
    display: block;
}

.crispSection .hoverImg {
    position: absolute ;
    right: 4px;
    top: 0;
    border: 1px solid #f76600;
    border-radius: 50px;
    display: none;
}

.crispOptions{
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: end;
    background: transparent;
    position: absolute;
    width: 249px;
    bottom: 100px;
    right: 9px;
    overflow:visible !important

}
.crispSection .supportCall a {
    font-size: 16px;
    font-weight: 500;
    color: white;
    text-decoration:none
}
.crispSection .supportCall {
    padding: 13px 15px;
    background: var(--primary-theme-color);
    border-radius: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    gap:7px;
    width: 249px;
}

.crispSection .watchHelpVideo {
    padding: 13px 15px;
    background: #fff;
    border-radius: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    gap: 7px;
    box-shadow: 0 4px 17.1px 0 rgba(0, 0, 0, 0.25);
    width: fit-content;
}

.onboardingSteps{
    display: flex;
    flex-direction: column;
    border-radius: 5px;
    background: #F9FAFB;
    padding: 30px 25px;
    width: 100%;
    gap: 25px;
}

.addFirstSection {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

.addnewDiv{
    padding: 20px;
    height: 187px;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.addProduct{
    background: #EFF4FF;
}
.addClient{
    background: #FFF2D5;
}
.addInvoice{
    background: #E8F9FF;
}

.addFirstbtn{
    width: 100% !important;
    display: flex;
    border-radius: 46px;
    background: #FFF;
    height: 37px;
    gap: 10px;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.addFirstbtn:hover {
/* background: ; */
}

.betaPopupOverlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); /* semi-transparent black */
    z-index: 9999;
    justify-content: center;
    align-items: center;
    display: flex;
    justify-content: center;
    align-items: start;
    overflow-y: auto;
    padding: 80px 0px;
    backdrop-filter: blur(5px);
}
.popupContainerBeta{
    border-radius: 10px;
    border: 1px solid #B5BFC7;
    background: var(--Primary-White, #FFF);
    box-shadow: 0px 18px 22px 0px rgba(0, 0, 0, 0.18);
    padding: 25px;
    width: 668px ;
}

.formPopup input{
    border-radius: 5px;
    border: 1px solid var(--Primary-Stroke, #E3E7EB);
    width: 321px;
    height: 38px;
    padding-left: 10px;
}

.formPopup textarea{
    border-radius: 5px;
    border: 1px solid var(--Primary-Stroke, #E3E7EB);
    width: 321px;
    height: 68px;
    padding: 10px;
}

.formPopup .select-selected{
    border-radius: 5px !important;
    border: 1px solid var(--Primary-Stroke, #E3E7EB);
    width: 321px !important;
    height: 38px !important;
    padding: 10px;
    color: var(--primary-main-heading) !important;
}
 .popup-wrapper {
  display: none;
  position: fixed;
  z-index: 999;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  background-color: rgba(0,0,0,.6);
}
.popup-wrapper .popWrap {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
 .popup-wrapper .popWrap .popup-content {
  height: 570px;
  width: 945px;
  position: relative;
}
 .popup-wrapper .popWrap .popup-content iframe{
  height: 570px;
  width: 945px;
}
.popup-wrapper .popWrap .popup-content .close {
  background: url(../../../images/cross-icon.png) no-repeat;
  background-size: 100%;
  width: 30px;
  height: 30px;
  float: right;
  z-index: 1;
  position: absolute;
  right: -36px;
  top: 0;
  border-radius: 100%;
  cursor: pointer;
}
.simple-file { position: relative; display:inline-flex; gap:.5rem; align-items:center; }
.simple-file input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.bttns { padding:.4rem .6rem; border:1px solid #ccc; border-radius:6px; background:#fff; }
.nameNoFile { max-width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

#signatureFormDiv input[type=radio]{
    accent-color: var(--primary-theme-color);
    width: 15px;
}

.proposalSection li {
    list-style-position: inside;
}
.estimateItemsInformation{
    border: 1px solid var(--primary-border-color);
    border-radius: 5px;
    padding: 20px 0px;
    height: 350px;
    overflow-y: auto;
}
.estimateItemsInformation table {
    width: 100%;
    border-collapse: collapse;
} 

.estimateItemsInformation table tbody tr{
    height: 90px;
    border-bottom: 1px solid var(--primary-border-color);
}
.estimateItemsInformation table tbody tr.invoiced {
    background: #F9FAFB;    
}

.popupContainerBeta.convertoInvoiceContainer {
    width: 880px;
}

.estimateItemsInformation table tbody tr:last-of-type {
    height: 90px;
    border-bottom: none !important;
}
.selectInvoiceOptions{
    padding: 15px;
    background: #F9FAFB;
}
.invoiceOptionNote {
    border-radius: 5px 5px 0px 0px;
    border: 0px solid #B5BFC7;
    background: #FAFAFA;
    display: flex;
    gap: 10px;
    padding: 8px 15px;
}

.signaturelegalNotice{
    padding: 15px;
    background: #F9FAFB;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
}
.signatureContainer{
    width: 818px !important;
}

.signtatureBox {
    border: 2px dashed var(--primary-border-color);
    border-radius: 5px;
    position: relative;
    padding: 15px;
    min-height:262px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

#drawSignatureDiv canvas {
    width: 400px !important;
}

.commentsSection{
    padding: 15px;
    border-radius: 5px;
    border: 1px solid var(--primary-border-color);
}
.commentsSection .commentContent {
    background: white;
    border-radius: 8px;
    padding: 10px;
    border: 1px solid var(--primary-border-color);
}
.commentsSection textarea{
    min-height: 70px;
    resize:  vertical;
    padding: 5px;
    border: 1px solid var(--primary-border-color);
    border-radius: 5px;
    background: white;
}

.importSubsSection{
    width: 100%;
    max-width: 731px;
}

.importSteps {
    gap: 20px;
    align-items: center;
    max-width: 473px;
}

.importSteps .stepCircle {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #D1D5DC;
    border: 1px solid #D1D5DC !important;
}

.importSteps .stepCircle.active {
    background: #FF6600;
    color: white;
    border: none   !important;
}

.stepSection{
    padding: 60px;
    border-radius: 20px;
    border: 1px dashed #FFCDAA;
    background: #F8FAFC;
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    justify-content: center;
}
.stepSection .importImg {
    height: 57px;
    width: 57px;
}

.planFeatureSection {
    border-collapse: collapse;
    border: 1px solid var(--primary-border-color);
}
.planFeatureSection textarea{
    resize: none;
    width: 100%;
    border:none !important;
    height: 100%;
    padding: 5px;
}
.planFeatureSection input[type="checkbox"]{
    width: 20px;
    height: 20px;
}
.planFeatureSection .deleteFeatureBtn{
    width: 20px;
    height: 20px;
}