@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
::placeholder {
    color: #4D4D4D !important; 
}

/* High contrast mode */
@media (forced-colors: active) {
    :focus-visible {
        outline: 2px solid Highlight !important;
        outline-offset: 2px;
    }
}
:focus {
    scroll-margin-bottom: 100px; /* adjust to your header height */
}
a, h1 {
    color: #6d29d4
}

    a:hover, body, p {
        color: #3c4959
    }

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

.btn-outline-primary, .btn-primary {
    border-color: #396fb8
}

a:-webkit-any-link.logout-warp:focus-visible {
    box-shadow: 0 0 0 2px #fff, /* Inner white shadow */
    0 0 0 3px #000 !important; /* Outer black shadow */
}
a.logout-warp:focus {
    box-shadow: 0 0 0 2px #fff, /* Inner white shadow */
    0 0 0 3px #000 !important; /* Outer black shadow */
}
.center-box, body, html {
    height: 100%
}

.main-title-faq .main-title, .main-title-profile .main-title, .main-title.main-title-cp, .main-title.th-title, h1 {
    margin-bottom: 0
}

.login-left h1, .switch, .txt-link {
    position: relative
}

aside, body.back-gradient {
    background: #3c4959
}

    .login-left h1, aside label {
        margin-bottom: 30px;
        margin-top: 30px
    }

    .txt-link::after, aside label, aside nav li .hover-bg {
        transition: .1s ease-in-out
    }

    aside nav li .hover-bg, header {
        left: 50%;
        transform: translateX(-50%)
    }

.header-top nav li ul li a, body, p {
    font-family: Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif
}

.breadcrum-list div.active, .btn, .btn-primary, .chat-box a, .forgot-pass-link, .form-group label, .nt-box-1-content-inner-bold, .quote-comment-p, .txt-link, aside label, h1, h2, h3, h4, h5, h6 {
    font-weight: 700
}

.dropdown-menu-2, .main, .switch--no-label label, table {
    overflow: hidden
}

.breadcrum-list, .dd-menu, .header-top ul, aside ul {
    list-style-type: none
}

#tblOrderDetails tbody, .quto-bg .quote-id, .text-box p, .user-approve-docname {
    word-break: break-all
}

.chat-toggle, .chat-toggle img, .dot-toggle, .logo, aside label {
    align-self: center
}

.box-margin, .transaction-history.table-responsive.tbl-scroll-wrap, body, html {
    overflow-x: hidden
}

.quote-text-width-overflow p, .td-limit {
    text-overflow: ellipsis;
    white-space: nowrap
}

.dd-button, .dd-menu li, .price-subtotal p, .quote-text-width-overflow p, .td-limit, .wrap p {
    white-space: nowrap
}

    .dd-button p {
        color: #6d29d4;
    }

body, p {
    font-size: 13px;
    line-height: 26px
}

img {
    max-width: 100%
}

h1 {
    font-size: 28px
}

h2 {
    font-size: 1.5rem
}

.btn-primary, .login-left a:hover, .start-listing a, .start-proj-wrap a, .txt-link, aside nav li a, aside nav li a:hover {
    text-decoration: none
}

.header-top nav li a:visited {
    color: #2a63f8
}

aside a:visited label {
    /*color: #a2dafc !important*/
}

a.menulink.active label {
    color: #a2dafc !important;
    text-decoration: underline;
}

.btn {
    color: #fff;
    font-size: 12px;
    padding: 10px 20px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.2);
    line-height: 1em
}

.btn-outline-primary {
    color: #396fb8
}

.btn-info, .login-left a, .login-left h1, .login-left h2, .login-left p {
    color: #fff
}

.btn-info {
    background-color: #8b63aa;
    border-color: #8b63aa
}

    .btn-info:hover, .btn-outline-primary:hover, .btn-primary:hover {
        background-color: #001e31;
        border-color: #001e31;
        color: #fff
    }

.btn-check:focus + .btn-primary, .btn-primary:focus, .form-control:focus, input.custchkinput:focus {
    border-color: #6D29D4 !important;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #6D29D4 !important;
}

.btn i {
    display: inline-flex
}

.center-box {
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.center-box-inner.set-center {
    justify-content: center
}

.login-left {
    width: 520px;
    margin-right: 165px
}

    .login-left p {
        font-size: 18px
    }

        .login-left p.txt-small {
            font-size: 14px;
            line-height: 26px
        }

.dd-menu-drop-1 h1, .main-title p {
    font-size: 14px
}

.txt-link {
    font-size: 20px;
    margin-top: 30px;
    display: inline-block;
    cursor: context-menu
}

    .txt-link::after {
        content: '';
        position: absolute;
        right: -30px;
        background: url(../images/arrow-white.svg) top right/17px auto no-repeat;
        display: block;
        width: 17px;
        height: 17px;
        top: 6px
    }

.login-left h1 {
    font-size: 62px;
    padding-top: 20px
}

    .login-left h1::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 2px;
        background-color: #fff;
        left: 0;
        top: 0;
        display: block
    }

.login-left img {
    max-width: 350px;
    display: block
}

.login-right h2 {
    color: #6d29d4;
    text-align: center;
    font-size: 46px;
    margin-bottom: 35px
}

    .login-right h2 p {
        font-size: 18px;
        font-weight: 400;
        line-height: 40px
    }

.center-box-inner {
    display: flex;
    align-items: center;
    width: 1220px
}

.bg-pattern {
    background-image: url(../images/lock-pattern.png);
    background-position: left -141px center;
    background-repeat: no-repeat
}

.login-right {
    background-color: #fff;
    padding: 40px 34px;
    border-radius: 20px;
    width: 475px;
    box-shadow: 30px 0 50px rgba(0,0,0,.1)
}

.form-group label {
    display: block;
    font-size: 14px;
    margin-bottom: 5px
}

    .form-group label span {
        color: /*red*/ #E00000;
    }

.form-control {
    height: 50px;
    border: 1px solid #394959;
    padding-left: 20px;
    font-size: 14px
}

.form-group {
    margin: 0 0 17px
}

.form-control:focus, input.custchkinput:focus {
    color: #3c4959;
    background-color: #fff
}

.custchk-main .custchk-label:before, input.custchkinput:before {
    box-shadow: 0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgba(0,0,0,.05)
}

::placeholder {
    color: #3c4959;
    opacity: .7
}

:-ms-input-placeholder {
    color: #3c4959;
    opacity: .7
}

::-ms-input-placeholder {
    color: #3c4959;
    opacity: .7
}

.form-submit {
    text-align: center;
    margin-top: 50px
}

.btn-primary {
    font-size: 16px;
    padding: 14px 30px;
    display: inline-block;
    background-color:#6d29d4;
    box-shadow: none;
    color: #fff
}

.toast-close-button:focus-visible {
    border-color: #220A3D !important;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #220A3D !important;
}

#toast-container > .toast-success {
    background-color: #218740 !important;
}

    .btn-primary:focus, .btn-primary:hover {
        background-color: #5617b4;
        text-decoration: none
    }

.login-right p a, .othermenulist.open > .othermenulistcontent .othermenulist span, .transaction-history table {
    color: #3c4959
}

    .activeplist-orderhistory a:hover, .forgot-pass-link:hover, .header-top nav li a.active, .header-top nav li a:hover, .login-right p a:hover, .main-menu-toggle ul li a:hover, .menu-right-toggle ul li a:hover, .othermenulist.open span, .profile-text p strong {
        color: #6d29d4
    }

.switch {
    width: 24rem
}

    .switch input {
        position: absolute;
        top: 0;
        z-index: 2;
        opacity: 0;
        cursor: pointer
    }

        .switch input:checked {
            z-index: 1
        }

            .switch input:checked + label {
                opacity: 1;
                cursor: default
            }

        .switch input:not(:checked) + label:hover {
            opacity: .5
        }

    .switch label {
        color: #fff;
        opacity: .33;
        transition: opacity .25s;
        cursor: pointer
    }

.breadcrum-list a, .chat-box a, .forgot-pass-link, .header-top nav li a, .profile-text p a {
    color: #3c4959;
    text-decoration: none
}

.switch .toggle-outside {
    height: 100%;
    border-radius: 2rem;
    padding: .25rem;
    overflow: hidden;
    transition: .25s
}

.switch .toggle-inside {
    border-radius: 5rem;
    background: #4a4a4a;
    position: absolute;
    transition: .25s
}

.switch--horizontal {
    width: 50px;
    height: 25px;
    font-size: 0;
    margin-bottom: 20px;
    display: inline-flex;
    vertical-align: top;
    margin-right: 8px
}

    .switch--horizontal input {
        height: 20px;
        width: 40px;
        left: 6rem;
        margin: 0
    }

    .switch--horizontal label {
        font-size: 1.5rem;
        line-height: 3rem;
        display: inline-block;
        width: 6rem;
        height: 100%;
        margin: 0;
        text-align: center
    }

        .switch--horizontal label:last-of-type {
            margin-left: 6rem
        }

    .switch--horizontal .toggle-outside {
        background: #636d79;
        position: absolute;
        width: 50px;
        left: 20px;
        height: 28px
    }

    .switch--horizontal .toggle-inside {
        height: 20px;
        width: 20px
    }

    .switch--horizontal input:checked ~ .toggle-outside .toggle-inside {
        left: .25rem
    }

    .switch--horizontal input ~ input:checked ~ .toggle-outside .toggle-inside {
        left: 25px
    }

.switch--no-label label {
    width: 0;
    height: 0;
    visibility: hidden
}

/*.tooltip:hover > .tooltiptext,*/
span.tooltiptext-form {
    visibility: visible;
    opacity: 1
}

.switch--no-label input:checked ~ .toggle-outside .toggle-inside {
    background: #fff !important
}

.switch--no-label input ~ input:checked ~ .toggle-outside {
    background: #6d29d4;
    opacity: 1
}

    .switch--no-label input ~ input:checked ~ .toggle-outside .toggle-inside {
        background: #6d29d4
    }

.switch--no-label.switch--horizontal .toggle-outside, .switch--no-label.switch--horizontal input {
    left: 0
}

.switch--expanding-inner input:checked + label:hover ~ .toggle-outside .toggle-inside {
    height: 2.5rem;
    width: 2.5rem
}

.switch--expanding-inner.switch--horizontal input:hover ~ .toggle-outside .toggle-inside {
    width: 3.5rem
}

.switch--expanding-inner.switch--horizontal input:hover ~ input:checked ~ .toggle-outside .toggle-inside {
    left: 2.25rem
}

.forgot-pass-link {
    text-align: right;
    display: inline-flex;
    margin-left: auto
}

.logo-favicon {
    position: absolute;
    left: 80px;
    bottom: 80px;
    width: 132px;
    height: 150px
}

.custchk-main .custchk-input {
    padding: 0;
    height: initial;
    width: initial;
    margin-bottom: 0;
    display: none;
    cursor: pointer
}

.custchk-main .custchk-label {
    position: relative;
    cursor: pointer;
    font-weight: 400;
    font-size: 16px
}

    .custchk-main .custchk-label:before {
        content: '';
        -appearance: none;
        background-color: rgba(169,169,169,.1);
        border: 2px solid #545454;
        padding: 10px;
        display: inline-block;
        position: relative;
        vertical-align: middle;
        cursor: pointer;
        margin-right: 15px;
        border-radius: 5px
    }

.custchk-main .custchk-input:checked + .custchk-label:before {
    background-color: #6d29d4;
    border: 2px solid #6d29d4
}

.custchk-main .custchk-input:checked + .custchk-label:after {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: 8px;
    width: 8px;
    height: 14px;
    border: 2px solid #fff;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg)
}

.login-right.fullwidth {
    width: 950px;
    margin: 0 auto
}

    .login-right.fullwidth .form-group {
        display: inline-block;
        width: 46%;
        vertical-align: top;
        margin-left: 2.5%
    }

        .login-right.fullwidth .form-group.singlecol {
            width: 95%;
            margin: 0 2.5%
        }

.mob-num .statefield {
    width: 85px;
    padding: 0 5px 0 15px;
    display: inline-flex
}

.mob-num .numberfield {
    display: inline-flex;
    margin-left: 10px
}

.custchk-main {
    display: flex;
    margin-top: 10px
}

.main {
    padding: 10px 20px 20px
}

.logo {
    width: 255px;
    display: flex;
    padding-left: 0;
    height: 36px;
}

aside {
    width: 170px;
    border-radius: 20px;
    position: absolute;
    left: 20px;
    top: 86px;
    height: calc(100vh - 170px)
}

    aside ul {
        padding: 40px 0 0;
        margin: 0
    }

    aside a:hover label, aside nav li:hover .hover-bg {
        opacity: 1;
        transition: .1s ease-in-out
    }

    aside label {
        color: #fff;
        font-size: 14px;
        text-align: center;
        display: block;
        cursor: pointer
    }

.profile-sidebar.active {
    display: block;
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    right: 0;
    text-align: right;
    padding: 0;
    z-index: 999
}

    .profile-sidebar.active::before {
        content: "";
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: rgba(245,246,250,.9);
        z-index: -1
    }

a.close-toggle {
    position: absolute;
    right: 30px;
    top: 20px;
    display: none;
    z-index: 1
}

.chat-box.active, .dropdown-menu-2:hover .dropdown-1-content, .getcall-box.active, .header-top nav li ul li, .header-top ul li:hover ul, .logout, .main-menu-toggle.active, .menu-right-panel.active, .othermenulist.open > .othermenulistcontent, .profile-sidebar.active a.close-toggle {
    display: block
}

aside nav li {
    align-items: center;
    justify-content: center;
    position: relative;
    text-align: center
}

    aside nav li .hover-bg {
        opacity: 0;
        position: absolute;
        top: -25px;
        z-index: -1;
        background-size: contain;
        height: 90px;
        width: 90px
    }

.main {
    width: 100%;
    height: auto
}

header {
    padding: 10px 10px 10px 20px;
    position: absolute;
    top: 15px;
    width: calc(100% - 151px);
    background-color: #f1f9ff;
    border-radius: 25px;
    width: 100%;
    max-width: min(calc(100vw - 2 * 25px), 1750px);
    background-image: -webkit-linear-gradient( -178deg, rgb(241,252,255) 0%, rgb(241,250,255) 37%, rgb(240,247,255) 100%);
    padding: 30px 69px 28px !important;
    top: 20px;
}

    header a.logo img {
        display: inline-block;
        width: 249px;
        max-width: 249px;
        max-height: 100px;
        height: 45px;
        /*height: auto;*/
    }

.white-body {
    left: 210px;
    width: calc(100% - 190px);
    margin-left: 190px;
    margin-top: 79px;
    background-color: #f4f4f5;
    border-radius: 10px;
    padding: 30px
}

.header-top, .quote-table-total, .qutoe-total {
    display: flex;
    justify-content: space-between;
    align-items: center
}

    .head-right, .header-top nav, .profile-text, .rightmenu-toggle {
        display: flex;
        align-items: center
    }

.rightmenu-toggle {
    margin-left: 10px
}

.main-title {
    margin-bottom: 14px
}

.approved-main, .header-top ul li:hover .icon-minus, .invoice-date, .othermenulist .sub-menu-toggle .icon-plus, .othermenulist.open .sub-menu-toggle .icon-minus, .quote-comment-p:hover .icon-minus, .quote-id, .search-flex, .womain-title, a.close-toggle {
    display: flex
}

.main-title-flx .form-group {
    margin-left: auto
}

.header-top nav li ul li a {
    padding-top: 2px;
    padding-bottom: 0;
    display: flex;
    font-size: 14px
}

.header-top nav li a {
    font-size: 15px;
    font-weight: 500;
}

.header-top ul {
    padding: 0 20px 0 0;
    margin: 0
}

.header-top nav li {
    display: inline-block;
    margin: 0 15px
}

.chat-box, .getcall-box, .header-top ul ul {
    display: none;
    background: #fff;
    border-radius: 10px
}

.header-top ul ul {
    position: absolute;
    top: auto;
    right: 0;
    width: 220px;
    padding: 10px;
    box-shadow: 2px 1px 15px rgba(0,0,0,.1);
    min-width: max-content;
}

.header-top ul a, .header-top ul li, .profile-toggle, .rightmenu-toggle .profile-toggle, .start-listing .order-file {
    position: relative
}

.profile-text {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
    margin-left: 30px
}

    .profile-text p, .profile-text span {
        margin-bottom: 0;
        line-height: normal
    }

    .profile-text p {
        position: relative;
        font-size: 18px
    }

        .profile-text p span {
            display: block;
            font-size: 14px
        }

.breadcrum-list div:last-child, .mCSB_inside > .mCSB_container {
    margin-right: 0
}

.breadcrum-list {
    margin: 0;
    padding: 0
}

    .breadcrum-list div {
        display: inline-flex;
        margin: 0 10px
    }

        .breadcrum-list div:first-child {
            margin-left: 0
        }

    .breadcrum-list a {
        font-size: 14px
    }

.chat-sticky {
    position: fixed;
    bottom: 25px;
    right: 30px;
    z-index: 9
}

.chat-box, .getcall-box {
    position: absolute;
    right: 0;
    bottom: 80px;
    box-shadow: 1px 1px 10px rgba(0,0,0,.2);
    width: 286px
}

.cb-chat, .cb-cont-salesteam, .cb-get-call-back {
    background-position: top 14px left 22px
}

.getcall-box {
    padding: 20px;
    height: 150px
}

    .getcall-box .form-group label {
        font-size: 18px;
        margin-bottom: 15px
    }

.chat-toggle {
    width: 64px;
    height: 64px;
    border-radius: 100%;
    background-color: #6d29d4;
    display: flex;
    justify-content: center
}

.getcall-box .btn-primary {
    border: 0;
    padding: 12px 0 0;
    float: right;
    margin: 0;
    top: -50px;
    position: relative;
    width: 55px;
    height: 50px;
    background: 0 0;
    text-align: center;
    vertical-align: middle
}

.accordion-button::after, .cb-chat, .cb-cont-salesteam, .cb-get-call-back {
    background-repeat: no-repeat
}

.chat-box a:hover, .dot-box a:hover {
    color: #0a58ca
}

.chat-box a {
    font-size: 16px;
    display: flex;
    border-bottom: 1px solid rgba(0,0,0,.1);
    padding: 14px 20px 14px 65px
}

.cb-chat {
    background-image: url(../images/chat-icon.png)
}

.cb-get-call-back {
    background-image: url(../images/get-call-back.png)
}

.cb-cont-salesteam {
    background-image: url(../images/contact-team.png)
}

.profile-toggle img {
    width: 75%
}

.login-right .mob-num .numberfield, .start-proj-add-link .input-txt {
    width: calc(100% - 100px)
}

nav.dropdown-menu1 a {
    text-align: center;
    padding: 14px 16px;
    text-decoration: none
}

.dropdown-1-content a {
    float: none;
    color: #000;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left
}

.dropdown-1-content {
    display: none;
    position: absolute;
    top: auto;
    width: 220px;
    background: #fff;
    border-radius: 10px;
    padding: 10px;
    box-shadow: 2px 1px 15px rgba(0,0,0,.1);
    z-index: 1
}

    .dropdown-1-content ul li {
        display: flex;
        flex-direction: column;
        align-items: center
    }

.profile-login-rt {
    background: 0 0;
    box-shadow: none
}

.profile-form .form-group {
    width: 47%;
    display: inline-block;
    margin-right: 2%
}

    .profile-form .form-group.singlecol {
        width: 96.5%
    }

.profile-form {
    max-width: 782px
}

    .profile-form .mob-num .numberfield {
        width: calc(100% - 99px);
        display: inline-flex;
        margin-left: 10px
    }

    .profile-form .form-group label span.verified {
        background-color: #6d29d4;
        color: #fff;
        border-radius: 5px;
        font-size: 13px;
        font-weight: 200;
        font-style: italic;
        padding: 3px 10px;
        margin-left: 15px
    }

.input-group .btn {
    position: relative;
    z-index: 2;
    margin-right: 28px
}

.profile-form .input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    margin-top: -17px;
    margin-bottom: 13px
}

.custom-file-upload-hidden {
    display: none;
    visibility: hidden;
    position: absolute;
    left: -9999px
}

.custom-file-upload {
    display: block;
    width: auto;
    font-size: 16px
}

    .custom-file-upload label {
        display: block;
        margin-bottom: 5px
    }

.file-upload-wrapper {
    position: relative;
    margin-bottom: 5px
}

.file-upload-input {
    width: 647px;
    float: left;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.custom-img .file-upload-input {
    width: 573px
}

.file-upload-button {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    padding: 12px 20px;
    border: none;
    margin-left: -1px;
    background-color: #6d29d4;
    float: left;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    -webkit-transition: .2s ease-in;
    transition: .2s ease-in;
    list-style: outside
}

.active-pl-row, .activeplist-orderhistory, .transaction-history-table table {
    border-radius: 10px
}

.file-upload-button:hover {
    background-color: #5617b4
}

.transaction-history-table {
    background-color: #fff;
    border-radius: 10px;
    margin-bottom: 7px
}

.active-pl-row, .table-whitebody .main-title {
    margin-bottom: 10px
}

.transaction-history-table th {
    border-bottom: 0 !important;
    white-space: nowrap
}

.table > :not(caption) > * > * {
    padding: 1rem 2rem;
    background-color: var(--bs-table-bg);
    box-shadow: none;
    border-bottom: 1px solid #dedede
}

.tb-bold, .tc-txt-1-inner h4 {
    font-size: 16px;
    font-weight: 700
}

.fw-reg {
    font-weight: 200;
    font-size: 12px
}

.bd-clr {
    font-weight: 700;
    color: #6d29d4;
    font-size: 14px
}

.btn-wrap-2 {
    position: relative;
    left: 59px
}

.left-1 {
    display: flex;
    align-items: center;
    margin-left: auto
}

    .left-1 img, label.form-check-label.font-weight-normal input[type=radio] {
        margin-right: 10px
    }

.calender-1 .searchTerm {
    width: 188px
}

.calender-1 input {
    padding-left: 8px
}

.active-pl-row {
    background: #fff
}

    .active-pl-row h3 {
        color: #3c4959;
        font-size: 20px
    }

    .active-pl-row a {
        text-decoration: none;
        position: unset;
        display: flex;
        vertical-align: middle;
        padding: 20px 100px 10px 30px
    }

    .active-pl-row span {
        position: absolute;
        right: 50px;
        background: #6d29d4;
        color: #fff;
        padding: 4px 18px;
        margin-top: -6px
    }

        .active-pl-row span::after {
            content: '';
            background: url(../images/active-ribbon.png) left center/auto 34px no-repeat;
            height: 34px;
            width: 14px;
            position: absolute;
            left: -13px;
            top: 0
        }

table {
    border-radius: 10px 10px 0 0;
    background: #fff
}

    table td {
        padding: 11px 33px !important
    }

    table th {
        text-transform: uppercase;
        line-height: normal
    }

    table tbody tr:last-child() {
        border-radius: 0 0 10px 10px;
        overflow: hidden
    }

thead.thead-dark {
    background: #3c4959;
    color: #fff
}

.table-whitebody .table > :not(caption) > * > * {
    border-bottom: 1px solid #dedede;
    padding: 11px 33px
}

.table > :not(:first-child) {
    border-left: 1px solid #dedede;
    border-right: 1px solid #dedede
}

.activeplist-orderhistory h4 {
    font-size: 20px;
    color: #6d29d4
}

.comp-icon, .in-prg-icon {
    margin-right: 7px
}

.active-proj-wrap .active-pl-row {
    padding-right: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.active-proj-wrap .btn {
    margin: 0 !important;
    padding: 16px 30px
}

.start-listing, .start-proj-wrap {
    display: flex;
    grid-column-gap: 20px
}

    .start-proj-wrap > div {
        text-align: center;
        width: 50%;
        border-radius: 15px;
        background-color: #fff
    }

        .start-first-proj a, .start-proj-wrap > div a {
            padding: 60px 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 100%;
            width: 100%
        }

        .start-first-proj img, .start-proj-wrap > div img {
            height: 70px;
            width: auto
        }

    .start-proj-wrap p {
        font-size: 20px;
        line-height: 1.5
    }

    .start-listing .desc, .start-proj-wrap .desc, .upload-reset-wrap {
        padding: 20px 0 0
    }

.order-file-name .btn.cancel img, .quote-file-preview .order-file-name button img {
    margin: auto
}

.first-proj.upload {
    border: 2px dashed #3c4959;
    padding: 0
}

.profile-btn-wrapper a.btn-primary img, .upload-reset-wrap a {
    margin-right: 15px
}

.info-txt p {
    font-style: italic;
    font-size: 14px
}

.start-proj-add-link input {
    float: left;
    /*height: 50px*/
}

.txt-wrap {
    width: 100%;
    background-color: #f4f4f5;
    text-align: left
}

.clear {
    clear: both
}

.info-txt {
    padding-top: 10px
}

.input-txt p, .pf-change-pw .form-control {
    font-size: 20px
}

.start-proj-add-link [type=submit] {
    outline: 0;
    border: 0;
    border-radius: .25rem;
    padding: 15px 33px;
    line-height: 1
}

.accordion-item.ai-b, .start-proj-add-link {
    border-top: 1px solid #3c4959
}

.start-proj-add-link {
    padding-top: 15px
}

.submit-wrap {
    float: right
}

.main-menu-toggle {
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    text-align: right;
    z-index: 999;
    display: none;
    width: 100%;
    background: rgba(245,246,250,.9)
}

    .contact-detail, .dd-button, .dd-menu, .main-menu-toggle nav, .profile-menu, .quto-bg {
        background-color: #fff
    }

    .main-menu-toggle nav {
        padding: 60px 30px;
        width: 400px;
        margin-left: auto;
        height: 100%
    }

    .main-menu-toggle ul li ul {
        padding-left: 15px
    }

.main-mn-close a {
    position: absolute;
    right: 30px;
    top: 20px;
    height: 16px;
    width: 16px
}

.main-menu-toggle ul {
    margin: 0;
    padding: 0
}

    .main-menu-toggle ul li {
        text-align: left;
        list-style-type: none
    }

        .main-menu-toggle ul li a {
            padding: 10px 0;
            font-size: 16px;
            display: flex;
            text-decoration: none;
            font-family: Poppins,sans-serif;
            font-weight: 700;
            color: #3c4959
        }

        .main-menu-toggle ul li ul li a {
            font-size: 14px;
            padding: 8px
        }

.main-menu-icon {
    height: 36px;
    width: 36px;
    display: none
}

.profile-menu {
    position: relative;
    max-width: 480px;
    margin-left: auto;
    text-align: left;
    padding: 30px;
    height: 100%
}

    .profile-menu .info-wrp {
        padding: 8px 0;
        display: flex;
        border-bottom: 1px solid #e2e2e2
    }

    .profile-menu h2 {
        margin: 20px 0 0;
        color: #6d29d4;
        font-size: 16px;
        text-decoration: underline
    }

.dd-button, .dd-button.active, .invoice-status span {
    text-decoration: none
}

.profile-menu .info-wrp .main-lbl {
    width: 180px
}

.profile-menu .info-wrp .main-lbl, .profile-menu .info-wrp .main-txt {
    font-size: 14px;
    color: #000
}

.profile-btn-wrapper {
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 20px;
    width: calc(100% - 60px)
}

.dd-button, .dropdown, .form-img {
    position: relative
}

.profile-btn-wrapper a.btn-primary {
    margin-bottom: 0 !important;
    width: 100%
}

.profile-btn-wrapper .btn-wrp {
    padding-top: 12px;
    display: flex
}

.profile-menu .profile-text {
    margin: 0 0 10px
}

.pt-m {
    margin: 4px
}

.registration-pass-1 .singlecol.form-submit .btn-primary {
    margin: 8px 0
}

.form-img {
    top: 0;
    left: 15px
}

.cf-mg .form-control, .confirm-form .contact-form, .subtoal, .table-whitebody .table-complete-overflow .lbltxtbox, .word-box-main, .workorderlistuser .wrap .searchTerm, .wrap .searchTerm {
    width: 100%
}

.input-sz input[type=checkbox] {
    width: 26px;
    height: 26px;
    border-radius: 50%
}

label.form-check-label.font-weight-normal {
    /*font-weight: 100;*/
    font-weight: 600;
    margin-left: 0
}

.input-sz label {
    margin: 5px 20px
}

label.form-check-label.font-weight-normal input[type=checkbox] {
    vertical-align: middle;
    position: relative;
    margin-right: 10px
}

.justify-content-between {
    justify-content: space-between !important
}

.send-btn {
    bottom: 80px
}

.contact-detail {
    height: 220px
}

.icon-col {
    text-align: center;
    padding-top: 30px
}

.pb-5 {
    padding-bottom: 3rem !important
}

.d-xl-flex.justify-content-between {
    margin-bottom: 20px
}

.accordion-button {
    border-radius: 5px;
    font-weight: 700;
    color: #3c4959;
    font-size: 14px
}

.accordion-item {
    border-radius: 5px;
    margin: 10px 0;
    border: 1px solid #3c4959
}

.accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url("../images/faq+.png");
    background-size: 1.25rem;
    transition: transform .2s ease-in-out
}

.accordion-button:not(.collapsed)::after {
    background-image: url("../images/faq-.png");
    transform: rotate(-180deg)
}

.accordion-button:not(.collapsed) {
    color: #0c63e4;
    background: 0 0;
    box-shadow: none
}

.dd-button.active, .dd-button:hover {
    color: #fff;
    background-color: #6d29d4;
    text-decoration: none;
}

    .dd-button:hover p {
        color: #fff;
        background-color: #6d29d4;
    }

.btn-nt-1 {
    padding: 0 20px;
    border-radius: 5px;
    border: none;
    background: #fff
}

.nt-p-1 button {
    font-weight: 700;
    color: #3c4959
}

.nt-box-1 {
    padding: 5px 28px 5px 8px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #3c4959;
    margin: 10px 0
}

.nt-box-1-content {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.nt-box-1-content-inner {
    display: flex;
    align-items: center;
    grid-column-gap: 10px
}

.nt-box-txt-2 {
    line-height: 20px
}

.nt-box-1:hover {
    background: #e3f5fa;
    transition: .3s
}

.nt-box-1-content-inner-color {
    color: #888e96
}

.nt-box-1-content-inner-clr-black {
    color: #000
}

.nf-dtls {
    margin: 30px 0 0
}

.thankyou-msg {
    margin-top: 35px
}

.tc-txt-date h1 {
    color: #3c4959;
    font-size: 14px
}

.tc-txt-1 h1 {
    color: #3c4959;
    font-size: 20px;
    margin-bottom: 12px
}

.tc-txt-1 p {
    color: #3c4959;
    line-height: 22px
}

.tc-mg {
    margin: 30px 0
}

.ab-txt-1-clr {
    color: #6b28d0
}

.ab-d-flex {
    display: flex;
    grid-column-gap: 10%;
    align-items: center
}

.ab-inner-width, .forgotpass-right {
    width: 60%
}

.breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: .5rem;
    color: #6c757d;
    content: var(--bs-breadcrumb-divider, ">")
}

.dropdown {
    display: block;
    margin: 17px 2px 35px 0
}

.dd-button {
    display: inline-block;
    border: 1px solid #3c4959;
    border-radius: 10px;
    padding: 10px 30px;
    cursor: pointer
}

    .dd-button:after {
        opacity: 0;
        content: '';
        position: absolute;
        top: 45px;
        left: 39%;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 15px solid transparent;
        border-left: 15px solid transparent;
        border-top: 15px solid #6d29d4;
        border-bottom: 0
    }

.all-check .form-check-input, .quote-chekbox .form-check-input {
    width: 25px;
    height: 25px;
    background: 0 0;
    position: relative;
    text-align: center
}

.dd-button.active::after {
    opacity: 1
}

.dd-menu-display {
    display: block !important;
    margin: 10px 0 0 !important;
    width: 70%;
}

.dd-input, .dd-input + .dd-menu, .header-top ul li:hover .icon-plus, .login-left .login-left-heading:before, .logout-warp, .othermenulist .sub-menu-toggle .icon-minus, .othermenulist.open .sub-menu-toggle .icon-plus, .profile-sidebar, .quote-comment-p:hover .icon-plus, .quote-remarks-toggle .icon-minus, .sub-menu-toggle .icon-minus, .transmenuresponsive, .version-desc-responsive {
    display: none
}

.dd-menu {
    top: 100%;
    border-radius: 15px;
    padding: 1px 20px;
    margin: 2px 0 0;
    box-shadow: 6px 8px 30px 0 rgba(0,0,0,.2)
}

.dd-input:checked + .dd-menu {
    display: block;
    margin: 10px 0 0;
    width: 440px
}

.dd-menu li {
    padding: 10px 20px;
    cursor: pointer
}

    .dd-menu li:hover {
        background-color: #f6f6f6
    }

    .dd-menu li a {
        display: block;
        margin: -10px -20px;
        padding: 10px 20px
    }

    .dd-menu li.divider {
        padding: 0;
        border-bottom: 1px solid #ccc
    }

.our-experts-info-txt p {
    font-size: 11px;
    line-height: 11px
}

body .our-exp-full {
    height: calc(100vh - 140px)
}

.dd-menu-drop-1 p {
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0
}

.dd-menu-drop-1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5% 0;
    border-bottom: 1px solid #e5e5e5
}

.quote-th-1, .quote-th-2, .quote-th-3, .quote-th-4, .quote-th-5, .quote-th-6 {
    padding: 11px 20px !important
}

.dd-menu-drop-1-none, .searchTerm {
    border: none
}

.dd-menu-drop-1-inner-clr {
    color: #595959;
    font-size: 12px
}

.quote-comment, .quto-id-list {
    border-right: 1px solid #cfd2d6;
    height: auto
}

.quote-th-1 {
    width: 22%
}

.quote-th-2 {
    width: 13%
}

.quote-th-3 {
    width: 10%
}

.quote-th-4, .quote-th-5 {
    width: 20%
}

.quote-th-6 {
    width: 15%
}

.quto-bg {
    border-radius: 12px
}

    .quto-bg h2 {
        padding: 1%
    }

.quote-status .invoice-status {
    padding: 40px 40px 20px
}

    .quote-btn-download .form-group, .quote-status .invoice-status, .quote-status .invoice-status p, .quote-table, .quto-bg hr {
        margin: 0
    }

hr:not([size]) {
    height: 1px
}

.quto-id-list {
    padding: 10px 0 10px 10px
}

.table-content span {
    font-weight: 700;
    margin-left: 10px
}

.feedback-form, .order-file, .quote-text-width {
    width: 52%
}

    .quote-text-width p {
        margin-bottom: 5px
    }

.quote-comment {
    padding: 10px 10px 30px 40px;
    width: 30%
}

    .quote-comment p {
        width: 400px
    }

.quote-comment-span {
    font-weight: 400 !important
}

.quote-remarks {
    padding: 10px 10px 10px 20px
}

.sab-table, .sab-table .accordion-body, .table-whitebody .table-adminapprove-overflow table td.sab-table, .table-whitebody .table-review-overflow table td.sab-table {
    padding: 0 !important
}

.download-all {
    display: flex;
    justify-content: end;
    float: right;
    display: block;
    width: 100%;
    background: #f4f4f5;
    text-align: right;
}

    .download-all .form-group {
        float: right;
    }

.quote-download {
    width: 54%
}

.quote-table .accordion-button::after {
    background-image: url("../images/down.png") !important;
    position: relative
}

.quote-table .accordion-button:not(.collapsed)::after {
    background-image: url("../images/up.png") !important;
    transform: rotate(0);
    position: relative
}

.subtotal-price {
    border-bottom: 1px solid #a3aeb7;
    width: 400px;
    margin: 0 10px auto auto
}

.subtoal p {
    font-size: 14px;
    margin-bottom: 0
}

.price-subtotal span {
    font-size: 16px;
    font-weight: 700;
    color: #6d29d4
}

.cwo-tbl-1 td, .dataTable.table thead th, .table-whitebody .quote-table-1 > :not(caption) > * > * {
    border-bottom: 0
}

.table-whitebody .quote-table-1 > :not(:first-child) {
    border-left: 0;
    border-right: 0
}

.sab-table {
    border: 0
}

.quote-table .accordion-button:focus {
    border: 0;
    box-shadow: none
}

.quote-table .accordion-button {
    padding: 0
}

.quote-chekbox .form-check-input {
    top: -2px;
    left: 0;
    border: 1px solid #fff
}

.all-check .form-check-input {
    left: 42px;
    border: 1px solid #d9dbe3
}

    .all-check .form-check-input:checked[type=checkbox] {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%236d29d4' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e")
    }

.cwo-btn {
    font-weight: 100;
    font-size: 11px;
    background-color: red;
    border-color: red;
    border-radius: 6px
}

.overlay, .start-first-proj, .text-box {
    background-color: #fff
}

.cwo-btn:hover {
    font-weight: 100;
    background-color: #ff4646;
    border-color: #ff4646
}

.cwo-btn-delet {
    padding: 14px 27px
}

.table-cwo-1 .table > tbody {
    vertical-align: middle
}

.table-cwo-1 .quote-table-1 > :not(:first-child) {
    border-left: 0;
    border-right: 0;
    border-top: 0
}

.table-cwo-1 td.sab-table {
    border: 0 !important
}

.table-cwo-1 .accordion-body {
    border-bottom: 1px solid #e5e5e5
}

.table-cwo-1 .table > :not(:first-child) {
    border-top: 0
}

thead.quote-table-2 {
    border-bottom: 1px
}

.table-cwo-1 th.approved-table-1, .user-bill-table-2 {
    width: 20%
}

.table-cwo-1 th.approved-table-2 {
    width: 11%
}

#tblOrderDetails .thdocument, .table-cwo-1 th.approved-table-3 {
    width: 9%
}

.form-check-input.chk-round:checked, .form-check-input.chk-squre:checked, .page-item.active .page-link {
    background-color: #6d29d4;
    border-color: #6d29d4
}

.form-check-input:focus {
    box-shadow: none;
    box-shadow: 0 0 0 0.17rem #6D29D4 !important;
}

.verified-top {
    margin-top: 17px
}

.invoice-number {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ced2d5;
    margin-bottom: 15px
}

    .confirm-form p, .invoice-number p {
        font-weight: 700;
        font-size: 20px
    }

.invoice-date p {
    font-weight: 400;
    font-size: 14px
}

.invoice-date span {
    font-weight: 700;
    font-size: 14px
}

.invoice-status {
    margin-left: 20px
}

    .invoice-status span {
        background-color: #a1ff2f;
        width: 50px;
        height: 20px;
        color: #3c4959;
        font-weight: 700;
        padding: 8px 15px;
        border-radius: 5px;
        text-align: center
    }

.bill-time {
    display: flex;
    justify-content: start
}

.order-file-name, .text-box {
    align-items: center;
    display: flex
}

.bil-to {
    margin-left: 40px
}

.bill-id {
    border-right: 0;
    height: 100%
}

.in-progress, .in-progress1 {
    background-repeat: no-repeat;
    margin-top: 34px;
    height: 40px
}

.bill-table-1 {
    width: 30%
}

.bill-table-2 {
    width: 13.7%
}

.bill-table-3 {
    width: 16%
}

.bill-table-4 {
    width: 23.6%
}

.page-link:hover {
    background-color: #6d29d4db;
    border-color: #6d29d4db;
    color: #fff
}

.in-progress {
    background-image: url("../images/in-progress.png");
    width: 144px
}

    .in-progress p, .in-progress1 p {
        text-align: center;
        margin-top: 4px;
        color: #fff;
        font-weight: 700
    }

.in-progress1 {
    background-image: url("../images/in-progress1.png");
    width: 190px
}

.quote-table-2 tr, .tb-border tr {
    border-bottom: 1px solid #dedede
}

.Confirm-page {
    width: 100%;
    display: flex;
    grid-column-gap: 40px
}

.confirm-form {
    width: 50%;
    /*position: relative;*/
    top: -35px;
    margin-top: -3%;
}

.order-file-name {
    margin-bottom: 20px
}

    .order-file-name img {
        margin: 10px
    }

.text-box {
    height: 42px;
    width: 100%;
    padding: 20px;
    justify-content: space-between;
    margin-bottom: 0;
    border-radius: 5px
}

    .text-box p {
        font-size: 16px;
        margin-bottom: 0
    }

.Confirm-page a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%
}

.form-check-input.chk-squre[type=checkbox] {
    border-radius: .25em;
    width: 26px;
    height: 26px
}

.form-check-input.chk-round[type=radio] {
    width: 26px;
    height: 26px
}

.form-check-input:checked[type=radio] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e")
}

.confirm-btn {
    width: 42%;
    display: flex;
    justify-content: space-between
}

.start-first-proj {
    border: 2px dashed #3c4959;
    text-align: center;
    width: 50%;
    height: 300px;
    border-radius: 15px;
    box-shadow: 0 3px 10px rgba(0,0,0,.05)
}

.listing-warp {
    position: relative;
    bottom: 560px;
    max-width: 43%
}

.border-bottom-order-1 {
    border-bottom: 3px solid #6d29d4;
    position: absolute;
    width: 96.5%;
    top: 44px;
    right: 0;
    border-radius: 13px
}

.border-bottom-order-10, .border-bottom-order-11, .border-bottom-order-12, .border-bottom-order-2, .border-bottom-order-3, .border-bottom-order-4, .border-bottom-order-5, .border-bottom-order-6, .border-bottom-order-7, .border-bottom-order-8, .border-bottom-order-9 {
    border-bottom: 3px solid #6d29d4;
    position: absolute;
    width: 96%;
    right: 0
}

.border-bottom-order-2 {
    top: 105px;
    border-radius: 13px
}

.border-bottom-order-3 {
    top: 167px;
    border-radius: 13px
}

.border-bottom-order-4 {
    top: 237px;
    border-radius: 13px
}

.border-bottom-order-5 {
    top: 297px;
    border-radius: 13px
}

.border-bottom-order-6 {
    top: 357px;
    border-radius: 13px
}

.border-bottom-order-7 {
    top: 417px;
    border-radius: 13px
}

.border-bottom-order-8 {
    top: 477px;
    border-radius: 13px
}

.border-bottom-order-9 {
    top: 537px;
    border-radius: 13px
}

.border-bottom-order-10 {
    top: 607px;
    border-radius: 13px
}

.border-bottom-order-11 {
    top: 667px;
    border-radius: 13px
}

.border-bottom-order-12 {
    top: 727px;
    border-radius: 13px
}

.border-bottom-order-13, .border-bottom-order-14 {
    border-bottom: 3px solid #6d29d4;
    width: 75%;
    right: 190px;
    border-radius: 13px;
    position: absolute
}

.border-bottom-order-13 {
    top: 787px
}

.border-bottom-order-14 {
    top: 847px
}

.overlay {
    opacity: .7;
    position: fixed;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    z-index: 2;
    text-align: center
}

.overlaywithbg {
    background-color: #fff;
    opacity: 0.7;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    z-index: 2;
    text-align: center;
}

.overlaynobg {
    opacity: .7;
    position: fixed;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    z-index: 2;
    text-align: center;
    background-color: #fff;
}

.overlayout {
    opacity: .7;
    position: fixed;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    z-index: 2;
    text-align: center;
    background-color: #fff;
}

.overlay-1 {
    background-color: #fff !important;
    opacity: .7 !important;
    position: absolute !important;
    bottom: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 10px !important;
    z-index: 2 !important;
    text-align: center !important
}

.card, .card-header {
    border: 0;
    background-color: transparent
}

.registration-thankyou .main-title, .searchButton {
    text-align: center
}

.logout img {
    width: 36px
}

.card {
    width: 500px;
    margin-top: 20px
}

.work-no-box, .work-yes-box {
    width: 20px;
    height: 20px;
    display: flex
}

.work-no-box, .work-yes-box, .wrap {
    border-radius: 5px
}

.word-box-id {
    padding: 30px 30px 0
}

.word-box-p {
    color: #a3aeb7;
    margin-bottom: 0
}

.work-id {
    font-size: 16px
}

.work-box-hrs p {
    font-weight: 700;
    margin-right: 38px;
    margin-left: 15px
}

.work-yes-box {
    background-color: #a1ff2e;
    align-items: center;
    justify-content: center
}

.work-no-box {
    background-color: #ae1313;
    align-items: center;
    justify-content: center
}

.payment-model label, .work-yes-box span {
    color: #3c4959;
    font-weight: 700
}

.work-no-box span {
    color: #fff;
    font-weight: 700
}

.dot-box a, .header-top nav li span, .menu-right-toggle ul li a {
    text-decoration: none;
    color: #3c4959
}

.work-box-date p {
    font-weight: 400;
    margin-left: 15px
}

.work-box-price p span {
    font-weight: 700;
    color: #6d29d4;
    font-size: 16px
}

.work-box-price {
    color: #000;
    font-weight: 400;
    font-size: 16px
}

.box-margin {
    margin-right: 20px;
    overflow-y: scroll;
    width: 100%;
    height: 600px
}

    .box-margin::-webkit-scrollbar {
        width: 10px
    }

    .box-margin::-webkit-scrollbar-track {
        background-color: #f8f8f8;
        border-radius: 10px
    }

    .box-margin::-webkit-scrollbar-thumb {
        background: #ced2d5;
        border-radius: 10px
    }

        .box-margin::-webkit-scrollbar-thumb:hover {
            background: #ced2d5
        }

.worr-grid {
    grid-column-gap: 64px !important
}

.search-flx, .search-transaction {
    display: flex;
    align-items: center;
    margin: 10px 0 20px
}

.word-box-ln-1, .wrap {
    align-items: center;
    display: flex
}

.wrap {
    height: 46px;
    background-color: #fff;
    margin-right: 10px
}

    .wrap p {
        margin: auto;
        padding-left: 10px
    }

.search {
    width: 100%;
    position: relative;
    display: flex;
    margin: 0 5px
}

.searchTerm {
    width: 170px;
    border-right: none;
    height: 36px;
    border-radius: .25rem;
    outline: 0;
    background-color: #fff;
    border: 1px solid #394959;
}

.calender-1 button {
    position: unset;
    padding: 0;
    margin: 0 0 0 2%
}

input.custchkinput, input.custchkinput:before {
    position: relative;
    margin-right: 15px;
    padding: 10px;
    vertical-align: middle;
    cursor: pointer
}

.searchButton {
    border: none;
    color: #000;
    cursor: pointer;
    /*position: relative;*/
    background-color: #f5f6f7;
    border-radius: 5px
}

.word-box-ln-1 {
    grid-column-gap: 125px;
    padding: 20px 0;
    background-color: #f4f4f5;
    z-index: 999;
    width: 100%;
    position: relative
}

.word-box-ln-2-inner {
    text-align: right;
    width: 5%
}

.worr-grid {
    grid-column-gap: 95px !important
}

.word-box-ln-1-inner {
    display: flex;
    align-items: center;
    grid-column-gap: 10px;
    width: 95%
}

    .word-box-ln-1-inner p {
        margin-top: 0;
        margin-bottom: 0
    }

        .word-box-ln-1-inner p span {
            margin-left: 5px
        }

.word-box-in-2 {
    height: 100%;
    background: #fff;
    border-radius: 10px;
    padding-bottom: 20px;
    position: relative
}

.payment-model p {
    font-weight: 700;
    margin-bottom: 0
}

.cwo-btn img, .icon-container img {
    width: 15px
}
.icon-container img { /*for accessibility*/
    width: 30px
}

button.btn.cancel img {
    height: auto
}

.previewlist {
    background-color: transparent !important
}

.btn-group .btn.cancel {
    background-color: #fff;
    height: 44px !important;
    width: 55px
}

.userwoprojview {
    margin-right: 20px
}

.box-margin-auto {
    overflow: auto
}

.price-subtotal {
    width: auto;
    text-align: left
}

div#invoicedata {
    padding-bottom: 65px
}

.quote-btn-download {
    display: flex;
    justify-content: end;
    margin: 10px;
    padding: 0 !important;
    align-items: center
}

.tb-border {
    background: #fff;
    border-radius: 10px
}

    .tb-border .table > :not(caption) > * > * {
        border: 0
    }

.transaction-history .transaction-history-table table.table {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    table-layout: inherit;
}

.aquote-inner-tbl-11, .forgotpass-left, .user-bill-table-1 {
    width: 40%
}

#tblOrderDetails .thamount, .aquote-inner-tbl-21, .aquote-inner-tbl-31, .aquote-inner-tbl-41, .aquote-inner-tbl-51, .aquote-inner-tbl-61, .aquote-inner-tbl-71, .user-bill-table-3, .user-bill-table-4, .user-bill-table-5 {
    width: 10%
}

.aquote-inner-invoice-tbl {
    width: 20%;
}

.table > thead {
    height: 55px;
    vertical-align: middle
}

.quote-table-1 > :not(:first-child) {
    border-top: 1px solid #dedede
}

th.bill-table-1-1 {
    width: 617px
}

th.bill-table-1-2 {
    width: 261px
}

th.bill-table-1-3, th.bill-table-1-4 {
    width: 315px
}

th.bill-table-1-5 {
    width: 121px
}

.form-group label.custchklabel {
    margin-bottom: 5px;
    position: relative;
    cursor: pointer;
    font-weight: 400;
    font-size: 16px
}

input.custchkinput {
    appearance: none;
    background-color: rgba(169,169,169,.1) !important;
    border: 2px solid #545454;
    box-shadow: 0 1px 2px rgba(0,0,0,.05),inset 0 -15px 10px -12px rgb(0 0 0 / 5%);
    display: inline-block;
    width: 24px;
    border-radius: 5px;
    height: 24px;
    top: 1px
}

    input.custchkinput:before {
        content: '';
        background-color: rgba(169,169,169,.1);
        border: 2px solid #545454;
        border-radius: 5px;
        display: none
    }

    input.custchkinput:checked {
        appearance: none;
        background-color: #6d29d4 !important;
        border: 2px solid #6d29d4 !important;
        content: '';
        display: block
    }

        input.custchkinput:checked:after {
            appearance: none;
            content: '';
            display: block;
            position: absolute;
            top: 0;
            left: 4px;
            width: 8px;
            height: 14px;
            border: 2px solid #fff;
            border-width: 0 3px 3px 0;
            transform: rotate(45deg)
        }

.dot-box, .menu-right-panel {
    background: #fff;
    position: absolute;
    border-radius: 10px
}

.profile-toggle ul {
    position: absolute;
    right: 0;
    top: 0;
    display: none
}

.menu-right-panel {
    display: none;
    top: 100%;
    right: 50px;
    padding: 25px 30px !important;
    box-shadow: 0 0 10px 5px rgba(0,0,0,.1);
    z-index: 99
}

.menu-right-toggle ul li a {
    padding: 4px 0
}

.menu-right-panel:before {
    content: '';
    position: absolute;
    top: -10px;
    right: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #fff;
    border-top: 0
}

.dot-box a, .dot-box h2 {
    border-bottom: 1px solid rgba(0,0,0,.1);
    font-size: 15px
}

aside nav li a {
    width: 80px;
    height: 140px;
    display: inline-block
}

.btnCancelPayment {
    font-size: 16px;
    font-weight: 700;
    padding: 14px 30px;
    display: inline-block;
    box-shadow: none;
    text-decoration: none;
    color: #fff
}

.dot-toggle {
    display: flex;
    justify-content: center
}

.dot-sticky {
    z-index: 9
}

.dot-box {
    display: none;
    right: 0;
    box-shadow: 1px 1px 10px rgb(0 0 0 / 20%);
    width: 210px
}

.d-flex.align-items-center.justify-content-center {
    width: 29px
}

.dot-box a {
    font-weight: 400;
    display: flex;
    padding: 12px 20px 12px 50px
}

.cb-right {
    background-image: url(../images/cb-right.png);
    background-position: top 19px left 22px;
    background-repeat: no-repeat
}

.dot-box h2 {
    color: #5617b4;
    padding: 14px 20px;
    text-align: left
}

.dot-box.active {
    display: block;
    box-shadow: 0 0 10px 10px rgb(0 0 0 / 10%);
    top: 26%;
    left: 26%
}

    .dot-box.active::before {
        content: '';
        position: absolute;
        top: 17px;
        right: -20px;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 15px solid transparent;
        border-left: 15px solid transparent;
        border-top: 15px solid #fff;
        border-bottom: 0;
        transform: rotateZ(-90deg)
    }

.loginform .form-switch .form-check-input {
    width: 40px !important;
    height: 20px !important
}

.loginform .form-check-input:checked {
    background-color: #6d29d4 !important;
    border-color: #6d29d4 !important
}

.login-left .txt-link {
    font-size: 21px
}

.dropzone .dz-message {
    margin: 0 !important
}

.cwo-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-column-gap: 2px;
    padding: 11px 20px 11px 13px
}

.workorderlistuser .wrap p, .wrap p {
    width: auto
}

.login-right.set-pass-for-ipad-mini .confirmpasswordwrongMsg, .login-right.set-pass-for-ipad-mini .passwordwrongMsg {
    color: #767676;
    font-size: 11px
}

.dropzone.dz-clickable .createwoimgicon, .tooltipimg {
    cursor: pointer
}

.main-scrolbar::-webkit-scrollbar {
    width: 6px
}

.main-scrolbar::-webkit-scrollbar-track {
    background-color: #f8f8f8;
    border-radius: 10px
}

.main-scrolbar::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.75);
    border-radius: 10px
}

    .main-scrolbar::-webkit-scrollbar-thumb:hover {
        background: #ced2d5
    }

.previewlist .border-bottom-order-1 {
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
    width: 100%
}

.previewlist .order-file-name .text-box {
    height: auto;
    position: relative;
    padding: 10px
}

.previewlist .order-file {
    background-color: #fff
}

.previewlist .order-file-name .btn-group .btn.cancel {
    background-color: transparent;
    box-shadow: none
}

.active-pl-row-h3 {
    padding: 20px 100px 10px 30px
}

.quote-file-preview {
    overflow: auto;
    height: 50vh !important
}

div#divPreviewUploadedFiles {
    max-height: 50vh;
    overflow: auto
}

.order-file .order-file-name div.text-box {
    padding: 10px;
    height: auto
}

.daterangepicker {
    z-index: 9999;
    margin: .5% 2%
}

.table-review-overflow .table thead.thead-dark th, .table-whitebody .table-review-overflow table .accordion .quote-tbody tr td, .table-whitebody .table-review-overflow table td, table .quote-table-2 th {
    padding: 1% 2% !important
}

input.chkterms:checked:after {
    top: 1px;
    left: 4px;
    width: 7px;
    height: 13px
}

.reg-flex .custchk-main .custchkinput {
    width: 20px;
    height: 20px;
    padding: 8px
}

.btn-primary:disabled {
    color: #fff;
    background-color: #6d29d4;
    border-color: #6d29d4
}

#tblOrderDetails .thinstructions, #tblOrderDetails .thorderid, #tblOrderDetails .thproject {
    width: 15%
}

#tblOrderDetails .thdate {
    width: 13%
}

#tblOrderDetails .thstatus {
    width: 18%
}

#tblOrderDetails .thpages {
    width: 5%
}

.dataTables_wrapper .table > thead {
    height: auto;
    vertical-align: middle;
    position: sticky;
    top: -1px;
    z-index: 2
}

.dataTables_wrapper .tb-border::-webkit-scrollbar {
    width: 5px
}

.dataTables_wrapper .tb-border::-webkit-scrollbar-track {
    background-color: #f8f8f8;
    border-radius: 5px
}

.dataTables_wrapper .tb-border::-webkit-scrollbar-thumb {
    background: #ced2d5;
    border-radius: 5px
}

    .dataTables_wrapper .tb-border::-webkit-scrollbar-thumb:hover {
        background: #ced2d5
    }

.dataTables_wrapper .tb-border {
    max-height: 307px;
    overflow: auto
}

.table-review-overflow .tb-border {
    max-height: 253px
}

.table-orderlist-overflow .tb-border {
    max-height: calc(100vh - 420px)
}

.screen-reader-text {
    border: 0;
    clip: rect(1px,1px,1px,1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
    word-break: normal
}

.quote-remarks-toggle, .sub-menu-toggle {
    background: 0 0;
    color: currentColor;
    border: none;
    color: #3c424a;
}

    .quote-remarks-toggle .icon-minus, .quote-remarks-toggle .icon-plus, .sub-menu-toggle .icon-minus, .sub-menu-toggle .icon-plus {
        height: 100%;
        display: flex;
        align-items: center
    }

    .quote-remarks-toggle .icon-minus {
        display: none;
    }

.price-subtotal span .lbltxtbox {
    text-align: end !important;
    font-size: 14px;
    border: 0 !important
}

.tooltip-wrapper {
    position: relative;
}

.tooltiptext, span.tooltiptext-form {
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 5px;
    z-index: 1;
    bottom: 100%;
    margin-right: 0;
    font-weight: 700;
    left: 0;
    background-color: #3c4959;
    transition: opacity 1s
}

.header-top nav li span b {
    font-weight: 600
}

.header-top nav li span {
    font-size: 15px;
    font-weight: 600;
    font-family: Poppins,sans-serif
}

.first-proj.upload.dropzone.fileinput-button:hover, .start-proj-wrap .request-for-volume:hover {
    opacity: .8
}

.first-proj.upload.dropzone.fileinput-button .choosefile {
    padding: 10% 2.5%;
    width: 100%;
    display: inline-block;
    cursor: pointer
}

.form-check .form-check-input {
    cursor: pointer;
    margin-top: auto;
    border: 1px solid #545454;
}

div#requestquotation {
    top: -30px;
    position: relative
}

.tooltip {
    position: relative;
    display: block;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    opacity: 1;
    font-family: inherit;
    z-index: auto
}

.tooltiptext {
    font-size: 14px;
    /*width: 540px;*/
    /*visibility: hidden;*/
    /*position: absolute;*/
    /*opacity: 0*/
}

span.tooltiptext-form {
    display: none;
    position: absolute
}

.tooltip-inner {
    max-width: 500px;
    background-color: #3c4959;
    font-weight: 400
}

.text-align-right, .text-right {
    text-align: right !important
}

.lbltxtbox.text-align-right {
    text-align: right !important
}

.iti--allow-dropdown .iti__flag-container:focus-visible, .iti--separate-dial-code .iti__flag-container:focus-visible {
    color: #3c4959;
    background-color: #fff;
    border-color: #6D29D4;
    outline: 0;
    box-shadow: 0 0 0 0.2rem #6D29D4 !important;
}

.iti--separate-dial-code .iti__selected-flag:focus-visible {
    color: #3c4959;
    background-color: #fff;
    border-color: #6D29D4;
    outline: 0;
    box-shadow: 0 0 0 0.2rem #6D29D4 !important;
}

a:-webkit-any-link:focus-visible {
    border-color: #6D29D4;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #6D29D4 !important;
}

.searchTerm:focus-visible {
    color: #3c4959;
    border-color: #6D29D4;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #6D29D4 !important;
}

:focus-visible {
    border-color: #6D29D4 !important;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #6D29D4 !important;
}

.logout a:-webkit-any-link:focus-visible, a.profile-toggle:-webkit-any-link:focus-visible {
    border-color: #6D29D4 !important;
    box-shadow: none !important;
    outline: #6D29D4 auto 1px
}

.start-proj-wrap > div a:-webkit-any-link:focus-visible {
    border-radius: 15px
}

.border-none, .lbltxtbox {
    border: none !important
}

select#searchWOStatus {
    /*height: 36px;*/
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>") no-repeat;
    background-position-x: 100%;
    background-position-y: 5px
}

.login-left .login-left-heading {
    font-size: 18px;
    font-weight: 400;
    margin-top: 0;
    padding-top: 0;
    margin-bottom: 1rem
}

.swal-modal .swal-button--danger {
    background-color: #a81b15
}

.hidetrtdheader {
    /*color: #3c4959;
    font-size: 0*/
    text-indent: -9999px;
}

.hidetrtdcategory {
    /*color: #fff;
    font-size: 0*/
    visibility: hidden;
}

div.dataTables_wrapper {
    position: inherit !important
}

.dataTables_wrapper table.table {
    overflow-y: scroll;
    position: relative;
    overflow: scroll;
    z-index: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    table-layout: fixed;
}

.table-adminapprove-overflow .table td, .table-adminapprove-overflow .table thead.thead-dark th, .table-adminapprove-overflow .table.quote-table .quote-table-2 th, .table-adminapprove-overflow .table.quote-table td, .table-whitebody .table-adminapprove-overflow table .accordion .quote-tbody tr td, .table-whitebody .table-adminapprove-overflow table td {
    padding: .5% 1% !important
}

.quote-text-width-overflow p {
    width: calc(90%);
    overflow: hidden
}

    .quote-text-width-overflow p:hover {
        overflow: visible;
        position: relative;
        background-color: #3c4959;
        color: #fff;
        transition: opacity 1s;
        width: fit-content
    }

.accordion img {
    width: 1.25rem;
    height: 1.25rem
}

.login-right .loginform .form-check {
    min-height: unset
}

.td-limit {
    max-width: 70px;
    overflow: hidden
}

#exportToExcel img {
    width: 77%
}

.lbltxtbox {
    background: 0 0 !important;
    outline: 0 !important;
    padding: 0 !important;
    cursor: default !important;
    text-align: left !important
}

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

textarea {
    resize: none
}

.activeplist-orderhistory #divDocument .row.tb-border.tb-overflow {
    max-height: 585px
}

#divDocument.table-approve-review-overflow.dataTables_wrapper .tb-border {
    max-height: 243px
}

.table-client-open-overflow {
    max-height: 465px
}

.othermenulist span:hover {
    cursor: pointer;
    color: #6d29d4
}

table.dataTable > thead .sorting:before, table.dataTable > thead .sorting_asc:before, table.dataTable > thead .sorting_asc_disabled:before, table.dataTable > thead .sorting_desc:before, table.dataTable > thead .sorting_desc_disabled:before {
    bottom: 27% !important
}

table.dataTable > thead .sorting:after, table.dataTable > thead .sorting_asc:after, table.dataTable > thead .sorting_asc_disabled:after, table.dataTable > thead .sorting_desc:after, table.dataTable > thead .sorting_desc_disabled:after {
    top: 27% !important;
    bottom: 0 !important
}

.daterangepicker td.off, .daterangepicker td.off.end-date, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date {
    color: #575757
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #2a5b8e
}

.daterangepicker .drp-buttons .btn {
    padding: 8px
}

.griddata3 tr td {
    padding: 11px 20px !important
}

.version-desc {
    position: absolute;
    right: 20px;
    font-size: 10px;
    color: #000;
    line-height: 0;
    bottom: 1.2%
}

.watermark {
    position: absolute;
    opacity: .1;
    color: gray;
    width: 100%;
    text-align: center;
    z-index: 1000;
    top: 10%;
    transform: translate(-50%,-50%);
    transform: rotate(-45deg);
    font-size: 9vw;
}

.tooltip {
    display: inline;
    /*width: auto;*/
}

.tooltiptext {
    bottom: 100%;
    color: #fff;
    margin-bottom: 2%;
    display: none;
    padding: 15px;
    border-radius: 3px;
    position: absolute;
}

    .tooltiptext:before {
        bottom: -20px;
        content: " ";
        display: block;
        height: 20px;
        left: 0;
        position: absolute;
        width: 100%;
    }

.history-title {
    color: #6d29d4;
}

.reg-thankyou-msg p {
    font-size: 14px;
}


.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #3c4959;
}

.bs-tooltip-end .tooltip-arrow::before {
    border-right-color: #3c4959;
}

.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #3c4959;
}

.bs-tooltip-start .tooltip-arrow::before {
    border-left-color: #3c4959;
}

.start-proj-add-link .input-txt p {
    font-size: 14px;
}

.dd-button.active p {
    color: #fff;
    background-color: #6d29d4;
}

.color-ff0000 {
    color: #ff0000;
}

.quote-alt-text .quote-text-width {
    width: 57%;
}

.btncancellink {
    display: none;
}

.start-proj-add-link .input-txt {
    width: 60%;
}

.float-right {
    float: right;
}

.swal-button.swal-button--confirm {
    background-color: #a81b15;
}

    .swal-button.swal-button--confirm:not([disabled]):hover {
        background-color: #910d08;
    }

a.dz-remove {
    display: none !important;
}

.overlay-disable {
    background-color: #EFEFEF;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1000;
    top: 0px;
    left: 0px;
    opacity: .5; /* in FireFox */
    filter: alpha(opacity=50); /* in IE */
}

.work-input .search {
    position: unset;
}

.btn-check:active + .btn-primary:focus, .btn-check:checked + .btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem #5617b4;
}

.dataTables_wrapper table.table.orderlist-client {
    position: unset;
}

    .dataTables_wrapper table.table.orderlist-client > thead {
        position: unset;
    }

.dd-menu-drop-1-inner {
    width: 85%;
}

.form-switch .form-check-input {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba%60, 73, 89, 1%29'/></svg>");
    /*background-color: #6d29d4 !important;*/
    border-color: rgba(60, 73, 89,1) !important;
}

    .form-switch .form-check-input:checked:focus {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    }

    .form-switch .form-check-input:focus {
        background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba%60, 73, 89, 1%29'/></svg>");
    }

aside nav li a:-webkit-any-link:focus-visible {
    border-color: #E8E8E8 !important;
    box-shadow: 0 0 0 0.1rem #E8E8E8 !important;
}
/*Media query start*/
@media screen and (min-device-width:1366px) and (max-device-width:1500px) and (-webkit-min-device-pixel-ratio:2) and (min-resolution:192dpi) {
    .start-proj-wrap > div img {
        height: 60px;
        width: auto
    }

    .start-proj-wrap p {
        font-size: 16px;
        line-height: 1.5
    }

    .body-height {
        height: calc(100vh - 160px)
    }

    .start-proj-wrap > div {
        height: 220px;
        min-height: 100% !important
    }
}

@media only screen and (max-width:1920px) and (min-width:1280px) {
    header {
        padding: 31px 68px 27px !important;
        top: 20px;
    }

    .white-body {
        width: calc(100% - 171px);
        margin-left: 170px;
        margin-top: 145px !important
    }

    aside {
        width: 150px;
        top: 151px !important
    }

    .menu-right-panel {
        top: 80px;
        right: 112px
    }
}

@media screen and (max-height:1024px) {
    .dataTables_wrapper .tb-border {
        height: 100%;
        min-height: auto
    }
}

@media screen and (max-height:760px) {
    .login-right.fullwidth {
        max-height: 650px
    }
}

@media screen and (max-height:700px) {
    .login-right.fullwidth {
        max-height: 600px
    }
}

@media screen and (max-height:620px) {
    .login-right.fullwidth {
        max-height: 550px
    }
}

@media screen and (max-width:1366px) and (max-height:700px) {
    #tblOrderDetails_wrapper.dataTables_wrapper.table-client-review-overflow .row.tb-border.tb-overflow {
        /* max-height: calc(100vh - 310px)*/
        max-height: 335px;
    }
}

@media screen and (max-width:1700px) {
    .logo-favicon {
        position: absolute;
        left: 50px;
        bottom: 50px;
        width: 100px;
        height: auto
    }

    th.bill-table-1-1 {
        width: 532px
    }

    th.bill-table-1-2 {
        width: 225px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 272px
    }

    th.bill-table-1-5 {
        width: 104px
    }

    .switch--horizontal {
        font-size: 0
    }

    .price-subtotal span .lbltxtbox, .subtoal p, body, p {
        font-size: 12px
    }

    #tblOrderDetails_wrapper.dataTables_wrapper .tb-border {
        max-height: 345px
    }

    body, p {
        line-height: 22px
    }

    .start-proj-add-link [type=submit], .btn btn-secondary, .btn-primary, .btnCancelPayment {
        font-size: 12px;
        padding: 9px 18px
    }

    .alert {
        padding: 0 1rem
    }

    .upload-reset-wrap {
        padding: 0 !important
    }

    .quote-text-width {
        width: 40%
    }

    .tbl-scroll-wrap #divDocument .row.tb-border.tb-overflow {
        /* max-height: calc(100vh - 479px)*/
        max-height: 200px;
    }

    .chat-toggle {
        width: 44px;
        height: 44px
    }

        .chat-toggle img {
            width: 43%
        }

    .activeplist-orderhistory #divDocument .row.tb-border.tb-overflow.ms-0.me-0 {
        max-height: 550px
    }

    .quote-text-width span:nth-child(1) {
        display: block;
    }
}

@media screen and (max-width:1600px) {
    table .tb-pd-1 td {
        padding: 8px 18px !important;
        line-height: normal
    }

    .login-left h1 {
        font-size: 55px;
        padding-top: 15px;
        margin-top: 25px;
        margin-bottom: 25px
    }

    .login-right h2 p {
        font-size: 16px;
        line-height: 36px
    }

    .login-right {
        width: 40%;
        padding: 30px 20px
    }

    .forgotpass-right {
        width: 60%
    }

    .ab-inner-img, .forgotpass-left {
        width: 40%
    }

    .login-left {
        max-width: 50%;
        margin-right: auto
    }

    .txt-link {
        margin-top: 15px;
        font-size: 16px
    }

    .center-box-inner {
        width: 100%;
        max-width: 1220px;
        padding: 0 40px
    }

    .logo-favicon {
        left: 50px;
        bottom: 50px;
        width: 80px;
        height: auto
    }

    aside {
        width: 100px
    }

    .main {
        padding: 10px 0
    }

    .white-body {
        margin-left: 139px;
        left: 210px;
        width: calc(100% - 159px)
    }

    .main-title h1 {
        font-size: 26px
    }

    aside ul {
        padding: 35px 0 0
    }

    .login-right.fullwidth {
        padding: 15px 20px 30px 15px;
        max-height: initial
    }

    .form-control {
        height: 34px
    }

    .login-right h2 {
        font-size: 36px;
        margin-bottom: 15px
    }

    .info-txt p, aside label {
        font-size: 10px
    }

    .login-right.fullwidth .form-group {
        margin-bottom: 14px
    }

    .main-title, .table-whitebody .main-title {
        margin-bottom: 10px
    }

    .active-pl-row h3, .quto-bg h2 {
        font-size: 18px
    }

    .start-proj-wrap p {
        line-height: 1.3
    }

    .upload-reset-wrap {
        padding: 10px 0 0 !important
    }

    .start-listing .start-proj-wrap > div {
        height: 250px
    }

    .first-proj.upload.dropzone.fileinput-button .choosefile {
        padding: 7% 2.5%
    }

    .profile-form .form-group {
        margin-top: 13px
    }

    table td {
        padding: 11px 33px !important
    }

    .table > :not(caption) > * > * {
        padding: 10px 20px
    }

    .active-pl-row a {
        padding: 15px 100px 6px 20px
    }

    .active-pl-row span {
        padding: 4px 18px
    }

    aside label {
        margin-bottom: 20px;
        margin-top: 10px
    }

    aside nav li a img {
        height: 22px
    }

    .form-group {
        margin: 0 0 12px
    }

    aside nav li .hover-bg {
        top: -16px;
        height: 60px;
        width: 60px
    }

    .profile-btn-wrapper {
        display: flex;
        flex-direction: column;
        position: relative;
        bottom: auto;
        width: auto
    }

        .profile-btn-wrapper a.btn-primary {
            margin-bottom: 0 !important;
            width: auto;
            min-width: 250px
        }

    .white-body {
        padding: 20px
    }

    .embed-responsive iframe {
        margin-top: 0;
        width: 600px
    }

    .btn-wrap-2 {
        position: relative;
        left: 35px
    }

    .confirm-btn {
        width: 50%
    }

    .worr-grid {
        grid-column-gap: 64px !important
    }

    .word-box-ln-1 {
        width: auto;
        grid-column-gap: 102px
    }

    .word-box-in-2 {
        width: 100%
    }

    .box-margin {
        margin-right: 0;
        margin-left: 8px
    }

    .quote-comment, .quote-remarks, .quto-id-list {
        padding: 10px 10px 10px 20px;
        height: auto
    }

    .quto-bg h2 {
        padding: 15px;
        margin: 0
    }

    th.bill-table-1-1 {
        width: 530px
    }

    th.bill-table-1-2 {
        width: 222px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 271px
    }

    th.bill-table-1-5 {
        width: 104px
    }

    aside nav li a {
        width: 90px;
        height: 90px;
        display: inline-block
    }

    .in-progress1 {
        margin-top: 8px;
        height: 35px
    }
}

@media screen and (max-width:1440px) {
    th.bill-table-1-1 {
        width: 470px
    }

    th.bill-table-1-2 {
        width: 196px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 240px
    }

    th.bill-table-1-5 {
        width: 94px
    }

    .center-box-inner {
        width: 100%;
        max-width: 980px;
        padding: 0 20px
    }

    .login-left h1 {
        font-size: 48px
    }

    .main-title h1 {
        font-size: 24px
    }

    .header-top nav li a, .main-title p, .txt-link {
        font-size: 14px
    }

    .profile-text p {
        font-size: 16px
    }

        .form-group label, .profile-text p span, .tooltip {
            font-size: 12px
        }

    .header-top nav li ul li a, .transaction-history-table th, .work-box-hrs p {
        font-size: 13px
    }

    .chat-toggle {
        width: 54px;
        height: 54px
    }

        .chat-toggle img {
            max-width: 22px
        }

    aside ul {
        padding: 30px 0 0
    }

    .main-title {
        margin-bottom: 20px
    }

    .login-right.fullwidth .form-group {
        margin-bottom: 5px !important
    }

    .use-of-data-upto1600 {
        display: none
    }

    .btn-wrap-2 {
        left: 15px
    }

    .quote-comment p {
        width: 280px
    }

    .confirm-btn {
        width: 55%
    }

    .word-box-ln-1 {
        grid-column-gap: 65px
    }

    .worr-grid {
        grid-column-gap: 37px !important
    }

    .word-box-id {
        padding: 30px 19px 0
    }

    .word-box-main {
        width: 1165px;
        margin: 0 auto
    }

    aside nav li a {
        width: 90px;
        height: 90px;
        display: inline-block
    }

    .transaction-history-table {
        overflow-x: auto;
        overflow-y: hidden
    }

    .modal-dialog {
        margin: 1.05rem auto
    }

    #tblOrderDetails_wrapper.dataTables_wrapper .tb-border {
        max-height: 335px
    }

    .activeplist-orderhistory #divDocument .row.tb-border.tb-overflow.ms-0.me-0 {
        max-height: 430px
    }

    .tbl-scroll-wrap #divDocument .row.tb-border.tb-overflow {
        /* max-height: calc(100vh - 620px)*/
        max-height: 200px;
    }

    #actions .info-txt p {
        /*font-size: 9px;*/
        font-size: 11px;
        margin: 0
    }

    .request-for-volume {
        height: 244px !important
    }

    .upload-reset-wrap {
        padding: 1% 0 !important
    }

    .start-proj-add-link {
        padding-top: 5px
    }

    .form-control {
        height: 40px
    }

    .form-group {
        margin: 0 0 4px
    }

    .start-proj-wrap p {
        font-size: 15px
    }
}

@media screen and (max-width:1366px) {
    aside nav li a {
        width: 70px;
        height: 70px;
        display: inline-block
    }

    .active-pl-row h3, .breadcrum-list a, .dd-menu-drop-1 h1, .header-top nav li a, .header-top nav li span, .header-top nav li ul li a, .icon-col p, .pf-change-pw .form-control {
        font-size: 12px
    }

    .upload-reset-wrap {
        padding: 10px 0 0 !important
    }

    .confirm-form p {
        font-size: 14px;
        margin-bottom: 0
    }

    .start-proj-wrap > div a {
        padding: 20px
    }

    .first-proj.upload.dropzone.fileinput-button .choosefile {
        padding: 7% 2.5%
    }

    .start-proj-wrap > div img {
        height: 47px;
        width: auto
    }

    .icon-col, .start-proj-add-link {
        padding-top: 10px
    }

        .start-proj-add-link input, .text-box {
            height: 27px
        }

        .start-proj-add-link [type=submit] {
            padding: 7px 14px;
            height: 27px;
        }

    .request-for-volume {
        height: 160px !important
    }

    .input-txt p {
        font-size: 16px;
        margin-bottom: 10px
    }

    .form-group.singlecol p, .info-txt p, .invoice-number, .login-right.fullwidth h2, .price-subtotal p {
        margin-bottom: 0
    }

    .info-txt p {
        font-style: italic
    }

    .form-submit {
        margin-top: 30px
    }

    .login-left h1 {
        font-size: 36px;
        margin-bottom: 15px
    }

    .logo-favicon {
        left: 20px;
        bottom: 20px;
        width: 50px;
        height: auto
    }

    .login-right {
        width: 40%;
        padding: 40px 15px
    }

    .forgotpass-right {
        width: 60%
    }

    .forgotpass-left {
        width: 40%
    }

    .profile-text p {
        font-size: 16px;
        line-height: normal
    }

        .bd-clr, .bill-number h2, .custchk-main .custchk-label, .invoice-date span, .profile-text p span {
            font-size: 13px
        }

    aside ul {
        padding: 30px 0 0
    }

    .white-body {
        margin-top: 125px !important
    }

    .login-right h2 p {
        font-size: 13px;
        line-height: 26px;
        margin-bottom: 0
    }

    .subtotal-price, tbody.accordionExample td {
        line-height: 22px /*for accessibility*/
    }

    .login-right h2 {
        font-size: 30px
    }

    .form-group {
        margin: 0 0 5px
    }

    .file-upload-button {
        padding: 12px 20px
    }

    .login-right.fullwidth {
        width: 850px;
        padding: 15px;
        max-height: initial
    }

    .mob-num .statefield {
        width: 80px
    }

    .bg-pattern {
        background-image: url(../images/lock-pattern.png);
        background-position: left -100px center;
        background-repeat: no-repeat;
        background-size: 200px auto
    }

    .cb-chat, .cb-cont-salesteam, .cb-get-call-backt, .chat-box a {
        background-size: 20px
    }

    .mob-num .numberfield {
        width: 281px
    }

    .getcall-box .btn-primary {
        top: -44px
    }

    .chat-toggle img {
        max-width: 24px
    }

    .cb-cont-salesteam {
        background-position: top 11px left 22px
    }

    .custchk-main .custchk-label:before {
        margin-right: 5px;
        padding: 9px
    }

    .form-control {
        padding-left: 15px
    }

    .custchk-main, .thankyou-msg {
        margin-top: 0
    }

        .custchk-main .custchk-input:checked + .custchk-label:after {
            content: '';
            display: block;
            position: absolute;
            top: 5px;
            left: 8px;
            width: 7px;
            height: 12px;
            border: 2px solid #fff;
            border-width: 0 3px 3px 0;
            transform: rotate(45deg)
        }

    aside nav li .hover-bg {
        height: 60px;
        width: 60px;
        top: -17px
    }

    .dd-menu-drop-1-inner-clr, .price-subtotal span .lbltxtbox, .quote-comment-p, .table-borderless .tb-bold, .table-content span, .tooltip, .transaction-history-table th {
        font-size: 11px
    }

    .confirm-form {
        top: -37px
    }

    .btn-primary, .btnCancelPayment {
        padding: 7px 14px;
        font-size: 11px
    }

    .main-title h1 {
        font-size: 18px
    }

    .active-proj-wrap .btn {
        margin: 0 !important;
        padding: 11px 15px;
        font-size: 12px
    }

    .activeplist-orderhistory .mt-4 {
        margin-top: 10px !important;
        font-size: 16px
    }

    .table > :not(caption) > * > * {
        padding: 10px 33px;
        font-size: 12px
    }

    .table > thead {
        height: 45px;
        vertical-align: middle
    }

    .chat-box, .getcall-box {
        bottom: 60px;
        width: 246px
    }

        .chat-box a {
            font-size: 14px;
            padding: 11px 20px 11px 65px
        }

    .comp-icon img, .form-check-input.chk-squre[type=checkbox], .in-prg-icon img {
        width: 20px;
        height: 20px
    }

    header {
        padding: 31px 64px 27px !important;
        /*height: 94px;*/
        /*top: 21px;*/
        border-radius: 25px;
        width: calc(100% - 28px);
    }

    .logo {
        /*width: 249px;*/
        display: flex;
        /*padding-left: 5px;*/
        max-width: 249px;
        max-height: 100px;
        /*height: auto;*/
        width: auto;
    }

    .profile-text {
        margin-left: 10px
    }

    .header-top nav li {
        margin: 0 1px
    }

        .header-top nav li a {
            font-weight: 600;
            padding: 5px;
        }

    .bill-time p, .main-title {
        margin-bottom: 10px
    }

    .form-control {
        height: auto;
        font-size: 12px
    }

    .form-group label, .quote-text-width p {
        font-size: 11px;
        margin-bottom: 0
    }

    .lead, .order-file-name .text-box p {
        font-size: 11px !important
    }

    label.form-check-label.font-weight-normal input[type=checkbox] {
        top: 0
    }

    .form-check-input.chk-round[type=radio] {
        width: 20px;
        height: 20px;
        top: 0
    }

    .confirm-btn {
        width: 37%
    }

    .thankyou-msg p {
        font-size: 16px;
        margin-bottom: 0
    }

    .dropdown {
        margin: 12px 2px 8px 0
    }

    .dd-button {
        padding: 5px 20px;
        font-size: 12px
    }

    .dd-menu-drop-1 p {
        font-size: 11px;
        line-height: 16px;
        margin-bottom: 0
    }

    .dd-button:after {
        top: 30px;
    }

    .info-txt {
        padding-bottom: 10px;
        padding-top: 0px;
    }

    .icon-col img {
        width: 40px
    }

    .quto-bg h2 {
        font-size: 16px
    }

    .quote-status .invoice-status {
        padding: 12px
    }

    .quote-comment, .quote-remarks, .quto-id-list {
        padding: 1% 1% 5px;
        height: auto
    }

        .quote-comment p {
            width: auto;
            font-size: 12px;
            margin-bottom: 0
        }

    .switch--horizontal {
        height: auto
    }

    .modal-title {
        font-size: 15px
    }

    th.bill-table-1-1 {
        width: 366px
    }

    th.bill-table-1-2 {
        width: 202px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 248px
    }

    button.btn.cancel img {
        height: auto;
        width: 15px;
        margin: auto
    }

    .btn-group .btn.cancel {
        background-color: #fff;
        height: 35px !important;
        width: 55px;
        padding: 0
    }

    .wrap {
        height: 40px
    }

        .wrap p {
            padding-left: 12px;
            font-size: 13px
        }

    .searchTerm {
        height: 30px
    }

    button.btn.btn-primary.searchdata {
        padding: 10px 20px !important
    }

    .left-1 img {
        width: 20px
    }

    .fw-reg {
        font-weight: 200;
        font-size: 12px
    }

    .btn-wrap-2 {
        bottom: 0;
        top: 2px;
        padding: 0 !important;
        left: 0
    }

    .main-title p {
        font-size: 12px;
        margin-bottom: 10px
    }

    .invoice-number p {
        font-size: 13px;
        margin-bottom: 4px
    }

    .in-progress1 p, .start-proj-wrap p {
        font-size: 12px;
        margin-bottom: 0
    }

    .bill-number hr {
        margin-bottom: 0;
        margin-top: 3px
    }

    .price-subtotal {
        text-align: left
    }

    .profile-form .form-group {
        margin-top: 8px
    }

    aside {
        top: 131px !important;
        height: calc(100vh - 150px)
    }

    .d-flex.justify-content-between.quote-status {
        align-items: center
    }

    .dropzone .dz-message {
        text-align: center;
        margin: 0
    }

    .word-box-main {
        width: 1165px;
        margin: 0 auto
    }

    .review-subtotal .subtoal, .switch--horizontal {
        margin-bottom: 0 !important
    }

    .word-box-ln-1 {
        grid-column-gap: 0;
        justify-content: space-between;
        padding: 10px 0
    }

    .box-margin {
        height: 420px
    }

    .menu-right-panel {
        top: 73px;
        right: 140px
    }

    th.bill-table-1-5 {
        width: 99px
    }

    .profile-form .form-group label span.verified {
        font-size: 9px
    }

    .form-group label.custchklabel {
        font-size: 14px
    }

    .dataTables_wrapper .tb-border {
        overflow: auto;
        max-height: 285px
    }

    .transmenuresponsive {
        display: block
    }

    .transmenudesktop {
        display: none
    }

    .info-txt p {
        /*font-size: 10px;*/
        font-size: 12px;
    }

    .contact-detail {
        height: 140px
    }

    .cf-mg .form-control {
        height: 27px
    }

    .d-flex.align-items-center.justify-content-center {
        width: 16px
    }

    #divDocument.dataTables_wrapper .tb-border {
        max-height: 200px
    }

        #divDocument.dataTables_wrapper .tb-border img {
            width: 1.25rem;
            height: 1.25rem
        }

        #divDocument.dataTables_wrapper .tb-border button img {
            width: .75rem;
            height: .75rem
        }

    .quote-text-width-date {
        /*text-align: center*/
    }

    .subtoal p, body, p {
        font-size: 12px;
        line-height: 22px
    }

    .subtotal-price {
        margin-top: 0 !important;
        font-size: 11px
    }

    #divDocument.table-client-review-overflow.dataTables_wrapper .tb-border {
        max-height: 80px
    }

    #divDocument.table-approve-review-overflow.dataTables_wrapper .tb-border {
        max-height: 90px
    }

    .switch--horizontal .toggle-inside {
        height: 11px;
        width: 11px
    }

    .download-all .switch--horizontal .toggle-outside {
        height: 18px;
        width: 36px
    }

    .SLA48Hours, .SLAStandard {
        white-space: nowrap
    }

    .switch--horizontal input ~ input:checked ~ .toggle-outside .toggle-inside {
        left: 22px
    }

    .accordion-button::after {
        background-size: .85rem
    }

    .invoice-status span {
        padding: 3px 9px;
        font-size: 11px
    }

    .bill-number .quto-id-list.bill-id {
        padding: 0 1%
    }

    .bill-number .qutoe-total img {
        width: 13px
    }

    .chat-toggle {
        width: 35px;
        height: 35px
    }

        .chat-toggle img {
            align-self: center;
            width: 20px
        }

    table.dataTable > thead .sorting:after, table.dataTable > thead .sorting:before, table.dataTable > thead .sorting_asc:after, table.dataTable > thead .sorting_asc:before, table.dataTable > thead .sorting_asc_disabled:after, table.dataTable > thead .sorting_asc_disabled:before, table.dataTable > thead .sorting_desc:after, table.dataTable > thead .sorting_desc:before, table.dataTable > thead .sorting_desc_disabled:after, table.dataTable > thead .sorting_desc_disabled:before {
        bottom: 1.4em
    }

    .header-top nav li ul li a {
        padding-top: 2px;
        padding-bottom: 2px
    }

    .activeplist-orderhistory #divDocument.table-client-review-overflow.dataTables_wrapper .tb-border {
        max-height: 360px
    }

    .table-client-review-overflow table.table {
        width: 100%;
        table-layout: fixed
    }

    .activeplist-orderhistory #divDocument .row.tb-border.tb-overflow.ms-0.me-0 {
        max-height: 500px
    }

    .activeplist-orderhistory .table-client-review-overflow table.table {
        width: 100%
    }

    div#invoicedata {
        padding-bottom: 25px
    }

    tbody#accordionExample td {
        line-height: 10px;
    }

    .dd-menu-drop-1 {
        padding: 0.2% 0;
    }

    .dd-menu-drop-1-inner {
        width: 100%;
    }

    .dd-menu-drop-1 p {
        font-size: 10px;
    }
}

@media screen and (max-width:1280px) {
    header {
        /*padding: 28px 60px !important*/
        max-width: min(calc(100vw - 1.5 * 25px), 1750px);
    }

    .btn-wrap {
        top: 140px
    }

    .login-right.fullwidth {
        width: 700px
    }

    .custchk-main .custchk-label {
        font-size: 14px
    }

    .volumepricedropdown {
        line-height: 10px !important
    }

    .switch--horizontal {
        width: 30px;
        height: 20px
    }

    .mob-num .numberfield {
        width: 280px
    }

    .form-control {
        height: 40px;
        font-size: 13px;
        line-height: normal !important
    }

    .login-right h2 {
        font-size: 26px
    }

    .login-right .mob-num .numberfield {
        width: calc(100% - 94px)
    }

    .embed-responsive iframe {
        margin-top: 0;
        width: 500px
    }

    .quote-comment p {
        width: auto
    }

    .quote-text-width {
        width: 35%
    }

    .quote-th-1, .quote-th-2, .quote-th-3, .quote-th-4, .quote-th-5, .quote-th-6 {
        width: 20%;
        padding: 11px 33px !important
    }

    .standard-td .span-1 {
        margin-right: 58px
    }

    .quote-chekbox .form-check-input {
        top: 0;
        left: 16px
    }

    .confirm-btn {
        width: 50%
    }

    .profile-form .form-group label span.verified {
        font-size: 11px
    }

    aside nav li a {
        width: auto;
        display: inline-block;
        height: 65px;
    }

    aside {
        height: calc(100vh - 143px);
        top: 131px
    }

        aside label {
            font-size: 10px;
            margin-bottom: 5px;
            margin-top: 5px
        }

    .box-margin {
        height: 500px
    }

    th.bill-table-1-1 {
        width: 339px
    }

    th.bill-table-1-2 {
        width: 188px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 230px
    }

    th.bill-table-1-5 {
        width: 91px
    }

    label.form-check-label.font-weight-normal input[type=radio] {
        top: 0
    }

    .word-box-main {
        width: 1075px;
        margin: 0 auto
    }

    .userwoprojview {
        margin-right: 10px
    }

    .cwo-btn img {
        width: 15px
    }

    .cwo-btn {
        display: flex;
        justify-content: space-between;
        align-items: center;
        grid-column-gap: 2px
    }

    .user-complete-docname {
        word-break: break-word
    }

    .menu-right-panel {
        right: 100px
    }

    aside nav li .hover-bg {
        height: 50px;
        width: 50px;
        top: -14px
    }

    .tbltransactionlist a.btn.btn-primary.mb-1 {
        font-size: 12px
    }

    .table-whitebody .table > :not(caption) > * > * {
        font-size: 10px;
        padding: 5px 20px
    }

    .review-subtotal .subtoal {
        margin-bottom: 0 !important
    }

    .tbl-scroll-wrap #divDocument .row.tb-border.tb-overflow {
        /*  max-height: calc(100vh - 520px)*/
        max-height: 200px;
    }

    #tblOrderDetails .thdate {
        width: 10%
    }

    #tblOrderDetails .thdocument {
        width: 7%
    }

    #tblOrderDetails, .table-client-review-overflow table.table {
        width: 100%
    }

        #tblOrderDetails .thinstructions {
            width: 12%
        }
}

@media screen and (max-width:1279px) {
    #tblOrderDetails {
        width: 1186px
    }
}

@media screen and (min-width:1200px) {
    .profile-menu .profile-text {
        display: none
    }
}

@media screen and (max-width:1200px) {
    .logout-warp .main-lbl, .logout-warp a {
        color: #fff !important
    }

    .hover-bg, .logout {
        display: none
    }

    .confirm-btn {
        width: 53%
    }

    .logout-warp {
        display: block;
        background-color: #3c4959;
        border-radius: 5px
    }

        .logout-warp a {
            font-weight: 400;
            padding: 8px 20px !important
        }

        .logout-warp:hover {
            background-color: #3c4959d4
        }

    .menu-right-panel .logout-warp img {
        width: 15px;
        margin-left: 6px;
        margin-right: 6px
    }
}

@media screen and (max-width:1199px) {
    header {
        padding: 30px 25px !important;
        height: 94px;
        top: 20px;
        border-radius: 25px;
        width: calc(100% - 28px)
    }

    .main-menu-toggle nav {
        overflow: scroll
    }

    .head-right nav, .header-top .profile-text {
        display: none
    }

    aside nav li:hover .hover-bg {
        opacity: 0
    }

    .main-menu-icon {
        display: flex;
        align-items: center;
        height: 100%
    }

    .white-body {
        padding: 20px
    }

    .active-proj-wrap .btn {
        padding: 16px 15px
    }

    .tbl-scroll-wrap {
        overflow: hidden
    }

    .active-project-list .active-proj-wrap .btn {
        margin-bottom: 10px !important
    }

    .main-title h1 {
        font-size: 22px;
        line-height: 1.5;
        margin-bottom: 5px
    }

    .active-pl-row h3 {
        font-size: 16px
    }

    .active-project-list.no-rt-spc .active-pl-row a {
        padding-right: 30px
    }

    .main-menu-icon a img {
        max-width: 30px
    }

    .profile-toggle img {
        max-width: 30px;
        width: auto
    }

    .main-menu-toggle ul li ul li a {
        font-size: 13px;
        padding: 8px;
        font-weight: 400;
        line-height: normal
    }

    .profile-menu .info-wrp {
        padding: 5px 0
    }

    .profile-btn-wrapper .btn-wrp {
        padding-top: 6px
    }

    .cf-mg .form-control {
        width: 100%
    }

    .embed-responsive iframe {
        margin-top: 40px;
        width: 100%
    }

    .contact-form {
        width: auto
    }

    .contact-detail {
        height: auto
    }

    .transaction-history .transaction-history-table table.table {
        margin-bottom: 0;
        table-layout: auto;
    }

        .transaction-history .transaction-history-table table.table .tb-bold {
            white-space: nowrap;
            padding: 11px !important
        }

    th.bill-table-1-1 {
        width: 300px
    }

    th.bill-table-1-2 {
        width: 177px
    }

    th.bill-table-1-3, th.bill-table-1-4 {
        width: 217px
    }

    th.bill-table-1-5 {
        width: 86px
    }

    .activeplist-orderhistory, .activeplist-orderhistory .tbl-scroll-wrap {
        overflow: auto
    }

        #tblOrderDetails tr td, #tblOrderDetails tr th, .activeplist-orderhistory td, .activeplist-orderhistory th {
            white-space: nowrap
        }

    .menu-right-panel {
        right: 30px
    }

    .tbl-scroll-wrap table.table {
        table-layout: fixed
    }
}

@media screen and (max-width:1080px) {
    .forgot-pass-link {
        margin-left: auto;
        display: flex
    }

    .active-proj-wrap .active-pl-row {
        align-items: flex-start;
        /*flex-direction: column*/
    }

    .active-proj-wrap .btn.btn-primary {
        font-size: 14px !important;
        margin-left: 20px !important
    }

    .no-rt-spc.active-pl-row a {
        padding-right: 30px !important
    }
}

@media screen and (max-width:1050px) {
    .profile-form .file-upload-input {
        width: calc(100% - 100px)
    }

    .profile-form .form-group, .profile-form .form-group.singlecol {
        width: 100%;
        margin-right: 0
    }

    .start-first-proj, .start-proj-wrap > div {
        width: 100%;
        margin-bottom: 20px
    }

    .header-top nav li a {
        font-size: 12px
    }

    .login-right.fullwidth {
        padding: 35px 15px
    }

    .profile-btn-wrapper {
        display: flex;
        flex-direction: column;
        position: relative;
        bottom: auto;
        width: 100%
    }

    .profile-menu {
        height: 100%;
        overflow: scroll;
        max-width: 100%
    }

        .profile-menu h2 {
            font-size: 16px;
            margin: 20px 0
        }

        .profile-menu .info-wrp, .start-listing {
            flex-direction: column
        }

    .main-menu-toggle nav {
        width: 100%
    }

    .profile-menu .profile-text {
        margin: 0 0 10px
    }

    .activeplist-orderhistory .table-client-review-overflow table.table {
        width: 900px
    }

    .request-for-volume {
        height: 150px !important
    }
}

@media (min-width:1025px) {
    aside.sticky {
        top: 20px !important
    }
}

@media screen and (min-width:1024px) {
    .start-first-proj {
        min-height: 286px
    }
}

@media screen and (max-width:1024px) {
    .custom-file-upload, aside ul {
        display: flex
    }

    .start-listing .start-proj-wrap > div, aside, aside nav li a {
        height: auto
    }

        aside nav li a {
            width: auto;
            display: inline-block
        }

    .profile-form {
        max-width: 100%
    }

    .chat-sticky {
        position: fixed;
        /*bottom: 11%;*/
        bottom: 14%;
        right: 30px
    }

    .main, .main-scrolbar {
        position: relative
    }

    aside {
        width: 100%;
        left: 0;
        top: unset !important;
        bottom: 0;
        position: fixed;
        z-index: 99;
        border-radius: 0
    }

        aside ul {
            justify-content: space-between;
            align-items: center;
            padding: 2% 7%
        }

        aside nav img {
            height: 22px;
            width: auto
        }

        aside label {
            margin: 0
        }

    body .white-body {
        width: 97%;
        padding-bottom: 25px;
        margin-bottom: 90px;
        margin-left: auto;
        margin-right: auto
    }

    .white-body {
        margin-top: 51px;
        max-height: none
    }

    .custom-img .file-upload-input {
        width: 813px
    }

    .order-file, .quto-id-list.bill-id {
        width: 100%
    }

    .listing-warp {
        bottom: 0;
        max-width: 66%
    }

    .total-table {
        padding-bottom: 50px
    }

    .quote-comment, .quote-remarks, .quto-id-list {
        padding: 0 20px;
        border: 0;
        height: auto
    }

    th.bill-table-1-2 {
        width: 167px
    }

    .menu-right-panel {
        right: 25px;
        padding: 14px !important
    }

    .transaction-history .transaction-history-table table.table .tb-bold {
        padding: 11px 9px !important
    }

    .main {
        padding: 0
    }

    #divDocument.table-approve-review-overflow.dataTables_wrapper .tb-border, #divDocument.table-client-review-overflow.dataTables_wrapper .tb-border {
        max-height: 200px
    }

    .subtotal-price {
        width: auto
    }

    .transaction-history-table table.table {
        table-layout: auto
    }

    .start-proj-wrap {
        flex-direction: column
    }

    .version-desc {
        top: calc(100% - 85px);
        position: fixed;
        font-size: 9px;
        right: 10px
    }

    .version-desc-desktop {
        display: none
    }

    .version-desc-responsive {
        display: block
    }
}

@media screen and (max-width:820px) {
    .active-pl-row h3 {
        font-size: 14px
    }

    .login-right {
        width: 40%
    }

    .login-left h1::before {
        width: 93%
    }

    .set-pass-for-ipad-mini {
        width: 70%
    }

    .custom-img .file-upload-input {
        width: 613px
    }

    .search-flx.transactionlist .left-1 {
        display: block
    }

    .search-flx.transactionlist .wrap p {
        white-space: nowrap
    }

    .feedback-form {
        width: 100%
    }

    .form-group.db-mg-top-2 {
        margin: 10px 0
    }

    .quote-comment, .quote-remarks, .quto-id-list {
        padding: 2px 10px !important
    }

    #divDocument.dataTables_wrapper .tb-border, #divDocument.table-client-review-overflow.dataTables_wrapper .tb-border {
        max-height: 200px
    }

    body .white-body {
        max-height: none
    }
}

@media screen and (max-width:768px) {
    .left-1, .login-left {
        margin-top: 20px
    }

    .ab-inner-width, .calender-1 .searchTerm, .forgotpass-left.login-left, .order-file, .quote-comment p, .quote-text, .searchTerm, .wrap {
        width: 100%
    }

    .center-box-inner {
        /*flex-direction: column-reverse*/
        flex-direction: column; /*for accessibility*/
    }

    .login-left {
        max-width: 100% !important;
        margin-right: 4%;
        width: 90%
    }

    .login-right {
        width: 60%;
        padding: 40px 15px;
        margin-top: 60px
    }

    .set-pass-for-ipad-mini {
        width: 70%
    }

    .forgot-pass-1 .login-right {
        width: 40%;
        padding: 40px 15px
    }

    .forgotpass-right.login-right {
        width: 90% !important;
        max-width: 100% !important
    }

    .custom-img .file-upload-input {
        width: 553px
    }

    .ab-d-flex {
        flex-direction: column
    }

    .ab-inner-img {
        width: 100%;
        justify-content: center;
        display: flex;
        margin: 10px 0 20px
    }

    .quto-id-list {
        height: 100%;
        border-right: 0;
        padding: 2px 10px !important
    }

    .quote-comment {
        height: 100%;
        border-top: 1px solid #cfd2d6;
        border-right: 0;
        padding-bottom: 20px
    }

    .quote-remarks {
        border-right: 0;
        padding-top: 20px
    }

    .bill-id {
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 8px
    }

    .main-title h1 {
        font-size: 20px;
        margin-bottom: 0
    }

    .bill-number h2 {
        font-size: 16px
    }

    .invoice-number p {
        font-size: 14px
    }

    .Confirm-page, .invoice-number {
        display: block
    }

    .invoice-date {
        justify-content: space-between
    }

    .confirm-form {
        width: 100%;
        top: auto
    }

    .confirm-btn {
        width: 29%;
        margin-top: 13px
    }

    .border-bottom-order-13, .border-bottom-order-14 {
        right: 146px
    }

    .center-box {
        align-items: flex-start;
        height: auto;
        position: relative
    }

    .logo-favicon {
        top: 100%;
        /*display: none*/ /*for accessibility*/
    }

    .login-left img {
        width: 350px;
        height: 53px;
    }

    .transaction-history .transaction-history-table table.table .btn-wrap-2.tb-bold {
        text-align: revert
    }

    .transaction-history .transaction-history-table table.table .btn-primary {
        padding: 11px 6px;
        font-size: 10px;
        line-height: .4em
    }

    .form-check .form-check-input {
        margin-top: auto
    }

    .search {
        position: unset
    }
}

@media screen and (max-width:767px) {
    .profile-btn-wrapper {
        display: flex;
        flex-direction: column;
        position: relative;
        bottom: auto;
        width: 100%;
        margin-top: 20px
    }

        .profile-btn-wrapper a.btn-primary {
            padding: 8px;
            font-size: 14px
        }

    .forgot-pass-1 .login-right .form-group p {
        font-size: 13px;
        line-height: normal
    }

    .profile-form .mob-num .numberfield {
        width: calc(100% - 100px)
    }

    .profile-form .file-upload-button {
        padding: 12px 20px
    }

    .login-left h1::before, .login-right.fullwidth {
        width: 100%
    }

    .center-box-inner {
        /*flex-direction: column-reverse*/
        flex-direction: column /*for accessibility*/
    }

    .forgot-pass-1 .login-right {
        max-width: 400px;
        width: 400px
    }

    .login-left {
        margin-top: 30px;
        width: 100%;
        /*margin-bottom: 50px*/ /*for accessibility*/
    }

    .login-right {
        /*margin-top: 25%;*/ /*for accessibility*/
        width: 70%
    }

        .login-right h2 {
            font-size: 28px
        }

    .form-group label {
        margin-bottom: 5px;
        line-height: normal
    }

    .form-control {
        font-size: 14px
    }

    .form-group {
        margin: 0 0 15px
    }

    .login-left h1 {
        font-size: 32px;
        margin-bottom: 15px
    }

    .registration-pass-1 .center-box {
        margin-top: 50px;
        margin-bottom: 50px
    }

    .login-right.fullwidth .reg-flex .form-group {
        width: 100%;
        margin-left: auto !important
    }

    .login-right.fullwidth .form-group.singlecol {
        width: 100%;
        margin: 0
    }

    .set-pass-1 .center-box {
        height: 100%;
        padding: 0;
        margin: auto;
        display: flex;
        align-items: flex-start;
        justify-content: center
    }

    .set-pass-1 .login-right {
        margin-bottom: 50px
    }

    .chat-box, .getcall-box {
        width: 225px;
        bottom: 65px
    }

        .chat-box a {
            font-size: 14px;
            padding: 10px 20px 10px 55px
        }

        .getcall-box .form-group label {
            font-size: 16px;
            margin-bottom: 10px
        }

    body .form-group {
        margin: 0 0 5px
    }

    .tbl-scroll-wrap table.table {
        min-width: 850px
    }
}

@media screen and (max-width:650px) {
    .custom-img .file-upload-input {
        width: 439px
    }

    .quto-bg h2 {
        margin-bottom: 0;
        padding: 10px;
        font-size: 16px
    }

    .quto-id-list {
        height: 100%
    }

    .bill-number .quto-id-list {
        padding: unset
    }

    .quote-comment, .quote-remarks {
        padding: 20px
    }

    .in-progress, .in-progress1 {
        margin-top: 12px
    }

        .in-progress1 p {
            font-size: 12px
        }

    .confirm-btn {
        width: 34%;
        margin-top: 13px !important
    }

    .border-bottom-order-13, .border-bottom-order-14 {
        right: 118px
    }

    .border-bottom-order-1, .border-bottom-order-10, .border-bottom-order-11, .border-bottom-order-12, .border-bottom-order-2, .border-bottom-order-3, .border-bottom-order-4, .border-bottom-order-5, .border-bottom-order-6, .border-bottom-order-7, .border-bottom-order-8, .border-bottom-order-9 {
        width: 94%
    }

    .transaction-history .transaction-history-table table.table .tb-bold, .transaction-history .transaction-history-table table.table .tb-bold span {
        font-size: 10px
    }

    .quto-bg .d-flex.justify-content-between.quote-status.approvedwo {
        display: block !important
    }

        .quto-bg .d-flex.justify-content-between.quote-status.approvedwo .in-progress1 {
            position: relative
        }

            .quto-bg .d-flex.justify-content-between.quote-status.approvedwo .in-progress1 p {
                position: absolute;
                left: 0;
                width: 100%
            }

    .table-review-overflow .table.quote-table .quote-table-2 th {
        padding: 11px 26px !important
    }
}

@media screen and (max-width:576px) {
    .text-col-left, .text-sm-left {
        text-align: left !important
    }
}

@media screen and (min-width:576px) {
    .text-sm-left {
        text-align: left !important
    }
}

@media (min-width:768px) {
    .text-md-left {
        text-align: left !important
    }
}

@media screen and (max-width:500px) {
    .search-flx {
        display: block
    }

    .menu-right-panel {
        top: 60px;
        right: 35px
    }

    .logo {
        padding: 0
    }

    body .white-body {
        padding-bottom: 60px !important
    }

    .transactionlistuser .wrap p, .workorderlistuser .wrap p {
        width: 45%
    }

    div#divPreviewUploadedFiles {
        margin-bottom: 4%
    }
}

@media screen and (max-width:480px) {
    .rightmenu-toggle {
        margin-left: 10px
    }

    .d-flex.justify-content-between.quote-status {
        display: block !important
    }

    .in-progress1 {
        margin: 10px
    }

        .in-progress1 p {
            line-height: 2.9
        }

    header {
        height: auto;
        top: auto;
        border-radius: 25px;
        position: sticky;
        margin: 20px auto 0;
        padding: 0 25px;
        z-index: 330;
        -webkit-transition: .15s;
        -moz-transition: .15s;
        -o-transition: .15s;
        transition: .15s;
        max-width: min(calc(100vw - 1.3 * var(--global--spacing-horizontal)),1750px);
        width: 93.2%;
        left: 0;
        transform: none
    }

    body .white-body {
        margin-top: 3% !important
    }
}

@media screen and (max-width:479px) {
    .login-right.bg-pattern {
        width: 95%
    }

    .custom-img .file-upload-input {
        width: 268px
    }

    .breadcrumb {
        font-size: 13px
    }

    .subtotal-price {
        width: 100%
    }

    .confirm-btn {
        width: 48%
    }

    .border-bottom-order-1, .border-bottom-order-10, .border-bottom-order-11, .border-bottom-order-12, .border-bottom-order-2, .border-bottom-order-3, .border-bottom-order-4, .border-bottom-order-5, .border-bottom-order-6, .border-bottom-order-7, .border-bottom-order-8, .border-bottom-order-9 {
        width: 92%
    }

    .quote-btn-download {
        display: flex !important
    }

    .daterangepicker {
        width: auto
    }

    .logo {
        height: auto
    }

    .tbl-scroll-wrap #divDocument .row.tb-border.tb-overflow {
        max-height: unset
    }

    .daterangepicker .drp-buttons .btn {
        margin-left: 0
    }
}

@media screen and (max-width:414px) {
    .forgot-pass-1 .login-right {
        width: 100%;
        max-width: 100%
    }

    .login-right.bg-pattern, .login-right.fullwidth, .login-right.set-pass-for-ipad-mini {
        width: 100%
    }

    .reg-flex {
        display: flex;
        flex-direction: column
    }

    .invoice-date, .main-title.main-title-flx.womain-title.align-items-center, .qutoe-total {
        display: block
    }

    .invoice-status {
        margin-left: 0
    }

    .quote-table-total {
        display: flex;
        justify-content: start;
        align-items: center;
        width: 100%
    }

    .quote-text-width {
        width: 84%;
        margin: 0 auto
    }

    .in-progress {
        width: 220px
    }

    .confirm-btn {
        width: 55%
    }

    .custom-img .file-upload-input {
        width: 200px
    }

    .main-title.main-title-flx.womain-title.align-items-center .addbutton .btn-primary {
        font-size: 13px
    }

    aside ul {
        padding: 10px
    }

    .dd-menu-display {
        max-width: 290px
    }

    .chat-sticky {
        bottom: 30%
    }

    .white-body {
        min-height: 470px
    }

    .dropzone.dz-clickable {
        min-height: unset
    }

    .confirm-form p {
        font-size: 12px
    }

    .form-group label, .text-box p {
        font-size: 11px
    }

    .form-control::placeholder {
        font-size: 11px
    }
}

@media screen and (max-width:393px) {
    .dd-button {
        padding: 10px 15px
    }

    .dd-input:checked + .dd-menu {
        width: 322px
    }

    .dd-menu-2 {
        left: -150px
    }

    .confirm-btn {
        width: 60%
    }
}

@media screen and (max-width:390px) {
    .mob-num-input, .reg-flex {
        display: flex
    }

    .login-right.bg-pattern {
        width: 100%
    }

    .login-left {
        max-width: 100% !important;
        margin-right: auto
    }

    .login-right.fullwidth {
        width: 100%;
        padding: 40px 15px
    }

    .reg-flex {
        flex-direction: column
    }

    .set-pass-1 .center-box {
        height: auto
    }

    .custom-img .file-upload-input {
        width: 180px
    }

    .daterangepicker {
        height: 350px;
        overflow: auto;
        width: auto
    }

        .daterangepicker .calendar-table table th, .daterangepicker .drp-calendar.left, .daterangepicker .drp-calendar.right {
            padding: 0 !important
        }
}

@media screen and (max-width:375px) {
    .custom-img .file-upload-input {
        width: 164px
    }

    .table-review-overflow .table td {
        font-size: 9px;
        word-break: break-all !important
    }
}

@media screen and (max-width:360px) {
    .custom-img .file-upload-input {
        width: 150px
    }

    .breadcrumb {
        width: 54%
    }

    .dd-button {
        padding: 10px 15px
    }

    .dd-input:checked + .dd-menu {
        width: 322px
    }

    .dd-menu-2 {
        left: -167px
    }

    .bill-number h2 {
        font-size: 14px
    }

    .bill-time {
        display: block
    }

    .bil-to {
        margin-left: 0
    }

    .confirm-btn {
        width: 66%
    }

    .border-bottom-order-1, .border-bottom-order-10, .border-bottom-order-11, .border-bottom-order-12, .border-bottom-order-2, .border-bottom-order-3, .border-bottom-order-4, .border-bottom-order-5, .border-bottom-order-6, .border-bottom-order-7, .border-bottom-order-8, .border-bottom-order-9 {
        width: 90%
    }

    .quote-status {
        display: block !important
    }

    .in-progress1 p {
        line-height: 3
    }
}

@media screen and (max-width:320px) {
    .set-pass-1 .center-box {
        padding: 0;
        margin: 19px 0 0;
        display: flex;
        justify-content: flex-start;
        height: auto;
        align-items: flex-start
    }

    .custom-img .file-upload-input {
        width: 109px
    }

    .dd-button {
        font-size: 12px
    }

    .dd-input:checked + .dd-menu {
        width: 281px
    }

    .dd-menu-2 {
        left: -145px
    }

    .daterangepicker {
        height: 225px
    }
}