@charset "utf-8";
/* CSS Document */

body {
    font-family: 'Open Sans';
    font-size: 14px;
    color: #111111;
    font-weight: 400;
    overflow: auto !important
}
.modal-open{
    overflow:hidden !important;
}

.container {
    width: 100%;
    padding: 0 15px;
    max-width: 1400px;
}
.w18 {
    width: 180px !important;
}
.f10 {
    font-size: 10px !important;
}

.f12 {
    font-size: 12px !important;
}

.f16 {
    font-size: 16px !important;
}

.f17 {
    font-size: 17px !important;
}

.f18 {
    font-size: 18px !important;
}

.f19 {
    font-size: 19px !important;
}

.f20 {
    font-size: 20px !important;
}

.f21 {
    font-size: 21px !important;
}

.f22 {
    font-size: 22px !important;
}

.f23 {
    font-size: 23px !important;
}

.f24 {
    font-size: 24px !important;
}

.mb5 {
    margin-bottom: 5px !important
}

.mb2 {
    margin-bottom: 2px !important
}

.mb0 {
    margin-bottom: 0px;
}

.medium {
    font-weight: 500 !important;
}

.semibold {
    font-weight: 600 !important;
}

.bold {
    font-weight: 700 !important;
}

.extrabold {
    font-weight: 800 !important;
}

.text-deco-none {
    text-decoration: none !important;
}

.c-1 {
    color: #111 !important;
}

.c-2 {
    color: #202020 !important;
}

.c-3 {
    color: #4C4849 !important;
}

.c-4 {
    color: #2196F3 !important;
}

.c-5 {
    color: #8D8D8D !important;
}

.lh18 {
    line-height: 18px !important;
}

.white-box {
    width: 100%;
    float: left;
    border-radius: 10px;
    margin-bottom: 30px;
    border: 1px solid #F2F2F2;
    background: #fff;
    padding: 20px;
    box-shadow: 0 0 6px rgba(0,0,0,0.05);
}

.content-area {
    width: 100%;
    float: left;
    margin: 20px 0;
}
#deal-board .content-area {
    margin: 10px 0 !important;
}

    .content-area h3 {
        width: 100%;
        float: left;
        color: #111111;
        font-size: 24px;
        font-weight: 600;
        margin: 0 0 20px 0;
        line-height: 50px;
    }

.no-data {
    width: 100%;
    float: left;
    border-radius: 10px;
    text-align: center;
    margin-bottom: 30px;
    border: 1px solid #F2F2F2;
    background: #fff;
    padding: 20px 10px;
    font-size: 24px;
    color: #111;
    font-weight: 600;
    box-shadow: 0 0 6px rgba(0,0,0,0.05);
}

.no-bg {
    border-radius: 0;
    border: 0;
    background: none;
    box-shadow: none;
}

.no-border {
    border: 0 !important;
}

.cursor-pointer {
    cursor: pointer;
}

.max-width-200 {
    width: 100%;
    max-width: 200px;
}

.thumb-120 {
    width: 120px;
    height: 120px;
}

.btn-success.focus, .btn-success:focus {
    outline: none !important;
    box-shadow: none !important;
}

.w-auto {
    width: auto !important;
}

button:focus {
    outline: none !important;
}

button:disabled {
    cursor: default;
    opacity: 0.6;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.input-box {
    width: 100%;
    float: left;
    margin-bottom: 20px;
}

    .input-box .red {
        color: #ff0000;
    }

    .input-box .error {
        font-size: 12px;
        color: #ff0000;
        font-weight: bold;
    }

    .input-box .field-validation-valid {
        display: none;
    }

.field-validation-error {
    font-size: 12px;
    color: #ff0000;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

.input-box .fieldTitle {
    width: 100%;
    float: left;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    padding-right: 15px;
    color: #202020;
}

.pos-rel {
    position: relative;
    width: 100%;
    float: left;
}

.input-box .date-box {
    width: 100%;
    float: left;
    overflow: hidden;
    position: relative;
}

    .input-box .date-box .ui-datepicker-trigger {
        position: absolute;
        top: 15px;
        right: 15px;
        z-index: 10;
    }

.input-box input[type="text"],
.input-box input[type="email"],
.input-box input[type="number"],
.input-box input[type="password"],
.input-box input[type="date"],
.input-box input[type="name"] {
    width: 100%;
    padding: 10px 10px;
    float: left;
    background: #ffffff;
    border: 1px solid #c6c6c6;
    border-radius: 6px;
    font-size: 16px;
    color: #111111;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;
    height: 50px;
}

input:focus::placeholder {
    color: transparent;
}

textarea:focus::placeholder {
    color: transparent;
}

.input-box input.search {
    background: #fff url(../Images/web-images/search-ico.png) no-repeat center left 10px;
    padding-left: 40px;
}

.input-box textarea {
    width: 100%;
    padding: 10px 10px;
    float: left;
    background: #ffffff;
    border: 1px solid #c6c6c6;
    border-radius: 6px;
    font-size: 16px;
    color: #111111;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 25px;
    height: 120px;
    resize: none;
}

.input-box input[type="radio"] {
    display: none;
}

    .input-box input[type="radio"] + label {
        font-size: 16px;
        padding-left: 40px;
        color: #111111;
        font-weight: 500;
        width: 100%;
        line-height: 30px;
        height: 30px;
    }

.input-box [type="radio"]:not(:checked) + label:before,
.input-box [type="radio"]:checked + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(../Images/web-images/radio-normal.png) no-repeat top left;
    background-size: 30px 30px;
}

/* Check symbol aspect */
.input-box [type="radio"]:checked + label:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(../Images/web-images/radio-active-full-blue.png) no-repeat top left;
    background-size: 30px 30px;
}

.vp-steps .input-box [type="radio"]:checked + label {
    font-weight: bold !important
}

.input-box input[type="checkbox"] {
    display: none;
}

.input-box [type="checkbox"] + label {
    padding-left: 25px;
    line-height: 25px;
    font-size: 16px;
    font-weight: 600;
    position: relative;
}

.input-box [type="checkbox"] + [type="hidden"] + label {
    padding-left: 25px;
    line-height: 25px;
    position: relative;
    font-size: 16px;
    color: #017CB7;
    font-weight: 600;
}

.input-box [type="checkbox"]:not(:checked) + label:before,
.input-box [type="checkbox"]:checked + label:before,
.input-box [type="checkbox"]:not(:checked) + [type="hidden"] + label:before,
.input-box [type="checkbox"]:checked + [type="hidden"] + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    width: 20px;
    height: 20px; /* dim. of the box */
    border: 2px solid #017CB7;
    border-radius: 3px;
    background: #fff;
}

.input-box input[type="checkbox"]:disabled + label:after,
.input-box input[type="checkbox"]:disabled + label:before,
.input-box input[type="checkbox"]:disabled + [type="hidden"] + label:after {
    background-color: #ccc !important;
    top: 4px;
    border: none;
}
/* Check symbol aspect */
.input-box [type="checkbox"]:checked + label:after,
.input-box [type="checkbox"]:checked + [type="hidden"] + label:after {
    content: '';
    position: absolute;
    top: 3px;
    left: 0px;
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 3px;
    background: #017CB7 url("../Images/web-images/white-tick.png")no-repeat center center;
    background-size: 14px 10px;
    transition: all .2s; /* animation incoming :p */
}

.clear {
    width: 100%;
    float: left;
    clear: both;
}

.lh-30 {
    line-height: 30px !important;
}

.lh-50 {
    line-height: 50px !important;
}

.radio-btn-block {
    width: 100%;
    float: left;
}

    .radio-btn-block .radio-btn {
        background: url("../Images/web-images/radio-normal.png") no-repeat top 2px left;
        border: 0;
        background-size: 20px 20px;
        font-size: 20px;
        color: #017CB7;
        font-weight: 500;
        padding-left: 30px;
        line-height: 20px;
        margin-right: 25px !important;
        margin-bottom: 15px !important;
        text-align: left;
    }

    .radio-btn-block.state-name .radio-btn {
        min-width: 125px;
    }

    .radio-btn-block .radio-btn.btn-success {
        background: url("../Images/web-images/radio-active.png") no-repeat top left;
        background-size: 20px 20px;
    }

.multiselect-holder {
    width: 100%;
    float: left;
    margin-top: 10px;
}

    .multiselect-holder .multiselect__select {
        display: none;
    }

    .multiselect-holder .multiselect__tags {
        border: 1px solid #c6c6c6;
        padding: 8px 8px 0 8px;
    }

.purpule .multiselect-holder .multiselect__tags {
    border: 1px solid #3A3189
}

.multiselect-holder .multiselect__tag {
    background-color: #009ada;
    border: 0;
    border-radius: 4px;
    cursor: default;
    line-height: 24px;
    margin: 0 8px 3px 0;
    padding: 5px 20px 5px 5px;
    color: #fff;
}

.purpule .multiselect-holder .multiselect__tag {
    background-color: #e7e4ff;
    border: 1px solid #3a398f;
    border-radius: 5px;
    line-height: 24px;
    font-size: 18px;
    font-weight: 500;
    margin: 0 8px 3px 0;
    padding: 5px 20px 5px 5px;
    color: #3a398f;
}

.multiselect-holder .multiselect__tag-icon {
    width: 20px;
    top: 6px;
    margin: 0;
}

.purpule .multiselect__tag-icon:after {
    color: #000;
}

.multiselect-holder .multiselect__option--highlight, .multiselect-holder .multiselect__option--highlight:after {
    background-color: #017CB7 !important;
}

.custom-select-web {
    display: block;
    padding: 0;
    position: relative;
    width: 100%;
    float: left;
}

    .custom-select-web::after {
        background: #fff url("../Images/web-images/select-arrow.png") no-repeat scroll center center;
        content: "";
        height: 46px;
        pointer-events: none;
        position: absolute;
        right: 2px;
        top: 2px;
        border-radius: 6px;
        width: 40px;
    }

    .custom-select-web select {
        background: #ffffff;
        border: 1px solid #c6c6c6;
        border-radius: 6px;
        box-sizing: border-box;
        color: #111111;
        font-size: 16px;
        font-weight: normal;
        height: 50px;
        line-height: 44px;
        margin: 0;
        outline: medium none;
        padding-left: 10px;
        width: 100%;
    }

        .custom-select-web select.form-control:not([size]):not([multiple]) {
            height: 50px;
        }

        .custom-select-web select option {
            border-left: 1px solid #c6c6c6;
            border-right: 1px solid #c6c6c6;
            font-weight: normal;
            padding: 5px;
            width: 100%;
            font-size: 16px;
        }

option:hover {
    color: #fff;
    background: #3a398f;
}

.custom-select-web .select2 {
    background: #ffffff;
    border: 1px solid #c6c6c6;
    border-radius: 6px;
    box-sizing: border-box;
    color: #111111;
    font-size: 16px;
    font-weight: normal;
    min-height: 50px;
    line-height: 44px;
    margin: 0;
    outline: medium none;
    padding: 0 10px;
    width: 100% !important;
}

.custom-select-web.multiple:before, .custom-select-web.multiple:after {
    display: none;
}

.custom-select-web.multiple .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #009ada;
    border: 0;
    border-radius: 4px;
    cursor: default;
    line-height: 24px;
    float: left;
    margin-right: 6px;
    margin-top: 6px;
    padding: 5px;
    color: #fff;
}

.purpule .custom-select-web.multiple .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #e7e4ff;
    border: 1px solid #3a398f;
    border-radius: 5px;
    color: #3a398f;
}

.custom-select-web.multiple .select2-container .select2-search--inline {
    line-height: 34px;
}

.custom-select-web.multiple .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 0;
}

.custom-select-web.multiple .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    float: right;
    margin: 0 2px 0 4px;
}



.custom-select-web .select2 .select2-selection--multiple {
    border: 0 !important;
    outline: 0 !important;
    line-height: 24px;
    padding: 0;
    color: #111111;
    font-size: 16px;
    font-weight: normal;
}

.custom-select-web .select2 .select2-selection--single {
    border: 0;
    line-height: 48px;
    padding: 0;
    color: #111111;
    font-size: 16px;
    font-weight: normal;
}

.custom-select-web .select2-container--default .select2-selection--single .select2-selection__rendered {
    height: 48px;
    line-height: 48px;
    padding: 0;
    width: calc(100% - 40px);
}

.select2-dropdown {
    border: 1px solid #f2f2f2;
    background: #fff;
    color: #111111;
    font-size: 16px;
    font-weight: normal;
}

    .select2-dropdown .select2-search__field {
        border: 1px solid #c6c6c6;
        color: #111111;
        font-size: 16px;
        font-weight: normal;
        font-family: 'Open Sans', sans-serif;
        outline: none !important;
    }

    .select2-dropdown .select2-results .select2-results__option {
        color: #111111;
        font-size: 16px;
        font-weight: normal;
        font-family: 'Open Sans', sans-serif;
    }

        .select2-dropdown .select2-results .select2-results__option:hover {
            background: #009ada !important;
        }

        .select2-dropdown .select2-results .select2-results__option:hover,
        .select2-container--default .select2-results__option--highlighted[aria-selected] {
            background: #009ada;
            color: #fff;
        }

.purpule .select2-dropdown .select2-results .select2-results__option:hover,
.purpule .select2-dropdown .select2-results .select2-results__option:hover,
.purpule .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #3a398f !important;
    color: #fff;
}

.input-box .SumoSelect {
    width: 100%;
}

    .input-box .SumoSelect > .CaptionCont {
        background: #ffffff;
        border: 1px solid #c6c6c6;
        box-shadow: none;
        border-radius: 6px;
        box-sizing: border-box;
        color: #111111;
        font-size: 16px;
        font-weight: normal;
        height: 50px;
        line-height: 30px;
        margin: 0;
        outline: medium none;
        padding-left: 10px;
        width: 100%;
        overflow: hidden;
        padding: 10px;
    }

.SumoSelect > .CaptionCont > label {
    margin: 0;
    background: #fff url("../Images/web-images/select-arrow.png") no-repeat scroll center center;
    height: 46px;
    pointer-events: none;
    width: 30px;
    top: 1px;
    right: 1px;
}

    .SumoSelect > .CaptionCont > label i {
        display: none;
    }

.input-box .SumoSelect.open > .CaptionCont, .input-box .SumoSelect:focus > .CaptionCont, .input-box .SumoSelect:hover > .CaptionCont {
    box-shadow: none;
}

.input-box .SumoSelect.open > .optWrapper {
    top: 54px;
}

.input-box .SumoSelect > .optWrapper {
    border: 1px solid #c6c6c6;
}

.input-box .SumoSelect .reset-all {
    padding: 10px;
    font-size: 16px;
    font-weight: 500;
}

    .input-box .SumoSelect .reset-all span {
        display: none;
    }

    .input-box .SumoSelect .reset-all label {
        margin: 0;
        line-height: 20px;
        opacity: 1;
    }

.input-box .SumoSelect > .optWrapper > .options li.opt {
    padding: 8px 10px 8px 10px;
}

.input-box .SumoSelect > .optWrapper.multiple > .options li.opt {
    padding: 8px 10px 8px 35px;
}

    .input-box .SumoSelect .select-all > span i, .input-box .SumoSelect > .optWrapper.multiple > .options li.opt span i {
        width: 20px;
        height: 20px;
        border-radius: 2px;
        border: 2px solid #027BB6;
        background: #fff;
    }

.purpule .input-box .SumoSelect .select-all > span i, .purpule .input-box .SumoSelect > .optWrapper.multiple > .options li.opt span i {
    border: 2px solid #7066C8;
}

.input-box .SumoSelect .select-all.partial > span i, .input-box .SumoSelect .select-all.selected > span i, .input-box .SumoSelect > .optWrapper.multiple > .options li.opt.selected span i {
    background: #027BB6 url("../Images/web-images/white-tick.png")no-repeat center center;
}

.purpule .input-box .SumoSelect .select-all.partial > span i, .purpule .input-box .SumoSelect .select-all.selected > span i, .purpule .input-box .SumoSelect > .optWrapper.multiple > .options li.opt.selected span i {
    background: #7066C8 url("../Images/web-images/white-tick.png")no-repeat center center;
}

.input-box .SumoSelect > .CaptionCont > span.placeholder {
    color: #111;
    font-style: normal;
}

.input-box .SumoSelect .select-all > label, .input-box .SumoSelect > .CaptionCont, .input-box .SumoSelect > .optWrapper > .options li.opt label {
    margin: 0;
}

input[type=checkbox]:disabled {
    cursor: default;
}

    input[type=checkbox]:disabled ~ label {
        cursor: default;
    }

.switch-box {
    width: 60px;
    height: 24px;
    display: inline-block;
}

    .switch-box .switch {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 60px;
        height: 24px;
        border-radius: 360px;
        cursor: pointer;
    }

    .switch-box label {
        font-weight: inherit;
    }

    .switch-box input[type=checkbox], .switch-box input[type=radio] {
        margin: 4px 0 0;
        line-height: normal;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0;
    }


    .switch-box .switch-input {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        box-sizing: content-box;
    }

    .switch-box .switch-left-right .switch-input:checked ~ .switch-label {
        background: #00BC71;
    }

    .switch-box .switch-input:checked ~ .switch-label {
        background: #E1B42B;
    }

    .switch-box .switch-input:disabled ~ .switch-label,
    .switch-box .switch-input:disabled ~ .switch-handle {
        cursor: default;
        opacity: 0.6;
    }

    .switch-box .switch-left-right .switch-label {
        overflow: hidden;
    }

    .switch-box .switch-label, .switch-box .switch-handle {
        transition: All 0.3s ease;
        -webkit-transition: All 0.3s ease;
        -moz-transition: All 0.3s ease;
        -o-transition: All 0.3s ease;
    }

    .switch-box .switch-label {
        position: relative;
        display: block;
        height: inherit;
        font-size: 12px;
        font-weight: 600;
        text-transform: uppercase;
        background: #C60404;
        height: 24px;
        width: 60px;
        padding: 3px;
        border-radius: 360px;
    }

    .switch-box .switch-left-right .switch-input:checked ~ .switch-label:before {
        opacity: 1;
        left: 100px;
    }

    .switch-box .switch-input:checked ~ .switch-label:before {
        opacity: 0;
    }

    .switch-box .switch-left-right .switch-label:before {
        text-align: left;
        padding-left: 40px !important;
    }

    .switch-box .switch-left-right .switch-label:before, .switch-box .switch-left-right .switch-label:after {
        width: 20px;
        height: 20px;
        top: 4px;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 3px 0 0 0;
        border-radius: 20px;
    }

    .switch-box .switch-label:before {
        content: attr(data-off);
        right: 11px;
        color: #fff;
    }

    .switch-box span.switch-label:after {
        content: attr(data-on);
        left: 11px;
        color: #FFFFFF;
        position: absolute;
    }

    .switch-box .switch-label:before, .switch-box .switch-label:after {
        position: absolute;
        top: 50%;
        line-height: 1;
        -webkit-transition: inherit;
        -moz-transition: inherit;
        -o-transition: inherit;
        transition: inherit;
        box-sizing: content-box;
    }

    .switch-box .switch-left-right .switch-input:checked ~ .switch-label:after {
        left: 0 !important;
        opacity: 1;
        padding-left: 20px;
    }


    .switch-box .switch-input:checked ~ .switch-label:after {
        opacity: 1;
    }


    .switch-box .switch-left-right .switch-label:after {
        text-align: left;
        text-indent: 9px;
        left: -100px !important;
        opacity: 1;
        width: 100% !important;
    }

    .switch-box .switch-left-right .switch-label:before, .switch-box .switch-left-right .switch-label:after {
        width: 20px;
        height: 20px;
        top: 4px;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 3px 0 0 0;
        text-indent: -12px;
        border-radius: 20px;
    }

    .switch-box .switch-input:checked ~ .switch-handle {
        left: 39px;
    }

    .switch-box .switch-label, .switch-box .switch-handle {
        transition: All 0.3s ease;
        -webkit-transition: All 0.3s ease;
        -moz-transition: All 0.3s ease;
        -o-transition: All 0.3s ease;
    }

    .switch-box .switch-handle {
        position: absolute;
        top: 3px;
        left: 3px;
        width: 18px;
        height: 18px;
        background: #fff;
        border-radius: 360px;
    }

.switch-card {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
}

.switch-card-child-ul {
    padding-top: 15px;
}

.switch-card li {
    width: 100%;
    float: left;
    background: #FAFAFA;
    border: 1px solid #F3F3F3;
    border-radius: 4px;
    padding: 10px;
    list-style: none;
    margin-bottom: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

    .switch-card li .switch-box {
        vertical-align: top;
    }

    .switch-card li .label-data {
        width: calc(100% - 70px);
        line-height: 24px;
        float: right;
        display: inline-block;
        font-size: 16px;
    }

.popup-form .input-box {
    width: 100%;
    float: left;
    margin-bottom: 20px;
}

    .popup-form .input-box .fieldTitle {
        width: 100%;
        float: left;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
        padding-right: 15px;
        color: #202020;
    }

    .popup-form .input-box input[type="text"],
    .popup-form .input-box input[type="email"],
    .popup-form .input-box input[type="number"],
    .popup-form .input-box input[type="password"],
    .popup-form .input-box input[type="date"],
    .popup-form .input-box input[type="name"] {
        width: 100%;
        padding: 10px 10px;
        float: left;
        background: #F6F8FA;
        border: 0;
        border-radius: 0;
        font-size: 16px;
        color: #111111;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 28px;
        height: 50px;
    }

    .popup-form .input-box input.search {
        background: #fff url(../Images/web-images/search-ico.png) no-repeat center left 10px;
        padding-left: 40px;
    }

    .popup-form .input-box textarea {
        background: #F6F8FA;
        border: 0;
        border-radius: 0;
    }

.popup-form .custom-select-web select {
    background: #F6F8FA;
    border: 0;
    border-radius: 0;
}

.popup-form .custom-select-web::after {
    background: #F6F8FA url("../Images/web-images/select-arrow.png") no-repeat scroll center center;
}

.popup-form .custom-select-web .select2 {
    background: #F6F8FA;
    border: 0;
    border-radius: 0;
}

.popup-form .custom-select-web .select2-container .select2-selection--single {
    height: 48px;
    background: none;
}

.details-card-pop {
    width: 100%;
    float: left;
    position: relative;
}

    .details-card-pop img {
        max-width: 100%;
    }

    .details-card-pop h3 {
        font-size: 22px;
    }

    .details-card-pop ul {
        width: 100%;
        float: left;
        margin: 0;
        padding: 0;
    }

        .details-card-pop ul li {
            width: 100%;
            float: left;
            margin: 0 0 10px 0;
            padding: 0;
            list-style: none;
            font-size: 16px;
            color: #4C4849;
            font-weight: 400;
        }

            .details-card-pop ul li b {
                font-weight: 600;
                margin-right: 10px;
            }

            .details-card-pop ul li .profile-pic {
                max-width: 100px;
                width: 100%;
                height: 100px;
            }


.hours-set-block {
    width: 140px;
    display: inline-block;
    border: 1px solid #766CD0;
    border-radius: 6px;
    height: 40px;
}

    .hours-set-block .decrease-btn {
        width: 40px;
        height: 40px;
        margin-top: -1px;
        margin-left: -1px;
        float: left;
        border: 1px solid #766CD0;
        border-radius: 6px;
        background: url(/Images/web-images/blue-minus.png) no-repeat center center;
    }

    .hours-set-block .increase-btn {
        width: 40px;
        height: 40px;
        margin-top: -1px;
        margin-right: -1px;
        float: right;
        border: 1px solid #766CD0;
        border-radius: 6px;
        background: url(/Images/web-images/blue-plus.png) no-repeat center center;
    }

    .hours-set-block input {
        width: 60px;
        height: 38px;
        float: left;
        text-align: center;
        line-height: 40px;
        font-size: 16px;
        font-weight: 700;
        color: #202020;
        border: 0;
        -moz-appearance: textfield;
    }

    .hours-set-block .number-input--inline > input {
        width: 138px !important;
        padding: 0 !important;
    }

.field-label {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    float: left;
    margin-right: 15px;
}

.digit-group {
    width: auto;
    float: left;
}

    .digit-group input[type="text"] {
        width: 60px;
        height: 40px;
        border: 0;
        background: #F6F8FA;
        border: 1px solid #e1e1e1;
        margin: 0 10px 0 0;
        text-align: center;
        line-height: 40px;
        font-size: 16px;
        font-weight: 600;
        color: #202020;
    }

        .digit-group input[type="text"]:last-child {
            margin: 0;
        }

.status-green {
    width: auto;
    border: 1px solid #8BF1AA;
    background: #CCFFE7;
    border-radius: 6px;
    text-align: center;
    height: 40px;
    line-height: 38px;
    color: #1CA000;
    font-size: 16px;
    font-weight: 400;
    padding: 0 25px;
    display: inline-block;
    margin: 0 5px;
    vertical-align: middle;
}

.status-red {
    width: auto;
    border: 1px solid #F18B8B;
    background: #FFCCCC;
    border-radius: 6px;
    text-align: center;
    height: 40px;
    line-height: 38px;
    color: #A00000;
    font-size: 16px;
    font-weight: 400;
    padding: 0 25px;
    display: inline-block;
    margin: 0 5px;
    vertical-align: middle;
}

.green {
    color: #1CA000;
}

.red {
    color: #A00000;
}
.yellow {
    color: #E3BC4D;
}
.orange {
    color: #E88125;
}

.black {
    color: #202020;
}

.g-shadow {
    box-shadow: 0 3px 6px rgba(0,0,0,0.16);
}

.bor-rad-360 {
    border-radius: 360px;
}

.tabs-menu {
    width: 100%;
    float: left;
    padding-bottom: 20px;
    overflow: auto;
}

    .tabs-menu .nav-pills {
        width: 100%;
        float: left;
        border-bottom: 1px solid #E8EAEA;
        margin: 0;
    }

        .tabs-menu .nav-pills li {
            width: auto;
            float: left;
            border-bottom: 1px solid #E8EAEA;
            margin: 0 0 -1px 0;
        }

            .tabs-menu .nav-pills li a {
                width: 100%;
                float: left;
                font-size: 16px;
                color: #111;
                font-weight: 400;
                text-align: left;
                padding: 0 20px 20px 0;
                text-decoration: none;
            }

            .tabs-menu .nav-pills li.active {
                border-bottom: 2px solid #017CB7;
            }

                .tabs-menu .nav-pills li.active a {
                    color: #017CB7;
                }

.custom-tabs {
    width: 100%;
    float: left;
    padding-bottom: 20px;
    overflow: auto;
}

    .custom-tabs .nav-tabs {
        width: 100%;
        float: left;
        border-bottom: 1px solid #E8EAEA;
        margin: 0;
    }

    .custom-tabs .nav-fill .nav-item {
        flex: 0 0 auto;
    }

    .custom-tabs .nav-tabs .nav-item {
        width: auto;
        float: left;
        border-bottom: 1px solid #E8EAEA;
        color: #8D8D8D;
        padding: 5px 10px;
        font-size: 15px;
        font-weight: 500;
    }

        .custom-tabs .nav-tabs .nav-item.active {
            border-bottom: 1px solid #017CB7;
            background: none;
            color: #2196F3;
        }

    .custom-tabs .nav-tabs .nav-link.active, .custom-tabs .nav-tabs .nav-link:hover {
        border-color: transparent transparent #017CB7 transparent;
    }

.custom-button-tabs .nav-fill .nav-item {
    margin: 2px;
    border: solid 2px;
    border-radius: 20px
}

.custom-button-tabs .nav-tabs .nav-item.active {
    margin: 2px;
    border: solid 2px;
}

.custom-button-tabs .nav-tabs .nav-link.active, .custom-button-tabs .nav-tabs .nav-link:hover {
    border-color: transparent transparent #017CB7 transparent;
    color: #2196F3;
    border: solid 2px;
}

.custom-button-tabs .details-card {
    border: none !important
}

.blut-text-btn {
    color: #017CB7;
    font-weight: 700;
    font-size: 20px;
    text-decoration: underline;
    display: inline-block;
    border: 0;
    background: none;
}

.blut-text-btn-small {
    color: #017CB7;
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    display: inline-block;
    border: 0;
    background: none;
    cursor: pointer;
}

.blue-text-btn-small {
    color: #017CB7;
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    display: inline-block;
    border: 0;
    background: none;
    cursor: pointer;
}

.red-text-btn-small {
    color: #C60404;
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    display: inline-block;
    border: 0;
    background: none;
    cursor: pointer;
}

.green-text-btn-small {
    color: #00BC71;
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    display: inline-block;
    border: 0;
    background: none;
    cursor: pointer;
}

.bor-right {
    border-right: 1px solid #BDBDBD;
}

.txt-nowrap {
    white-space: nowrap;
}



h2.page-heading {
    width: 100%;
    float: left;
    color: #111111;
    font-size: 30px;
    font-weight: 700;
    margin: 0 20px 0 0;
    line-height: 50px;
}

h3.section-heading {
    width: 100%;
    float: left;
    color: #111111;
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 20px 0;
    line-height: 40px;
}

.wrapper-block {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    overflow: hidden;
    font-family: 'Open Sans', sans-serif;
    background: #f6f8fa;
}

    .wrapper-block #wrapper {
        width: 100%;
        padding: 0;
        max-width: 1400px;
        position: relative;
    }

.wrapper-block-locked {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    overflow: hidden;
    font-family: 'Open Sans', sans-serif;
    background: #f6f8fa;
}

.admin-header {
    width: 100%;
    float: left;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

    .admin-header .navbar {
        margin-bottom: 0;
        background: #fff !important;
        padding: 0;
    }

    .admin-header .navbar-brand {
        /*height: 80px;*/
        height: 70px;
        padding: 0;
        margin: 10px 0;
    }

    .admin-header .navbar-form {
        height: 50px;
        width: 450px;
        margin-top: 6px;
    }

        .admin-header .navbar-form .form-control {
            width: 100%;
            float: left;
            padding: 10px 10px 10px 40px;
            line-height: 30px;
            height: 50px !important;
            border: 1px solid #E8EAEA !important;
            background: #F6F8FA url("../Images/web-images/search-ico.png") no-repeat center left 10px;
            border-radius: 6px;
            box-shadow: none;
        }

    .admin-header .navbar-light .navbar-toggler {
        border: 0;
        padding: 5px;
    }

    .admin-header .navbar-light .navbar-toggler-icon {
        background: url(../Images/web-images/3-dots.png) no-repeat top left;
        width: 5px;
        height: 23px;
    }

    .admin-header .navbar .navbar-nav li a {
        font-size: 13px;
        font-weight: 600;
        color: #111111;
        line-height: 25px;
        letter-spacing: 1px;
        padding: 0;
    }

.createnew-drop {
    position: relative;
}

.creat-new {
    margin: 0 20px;
    background: url("../Images/web-images/create-new-ico.png") no-repeat top center;
    padding: 35px 0 0 0;
}

    .creat-new:hover, .creat-new.active {
        background: url("../Images/web-images/create-new-ico-hover.png") no-repeat top center;
        color: #1d7fae;
    }

.createnew-drop:hover .dropdown-menu {
    display: block;
}

.createnew-drop .dropdown a:after {
    display: none;
}

.createnew-drop .dropdown-menu {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    min-width: 200px;
    border-radius: 10px;
    top: 58px;
    left: auto;
    right: 0;
}

    .createnew-drop .dropdown-menu li a {
        width: 100%;
        float: left;
        padding: 8px 15px;
        border-bottom: 1px solid #F2F2F2;
        font-size: 16px;
        font-weight: 600;
        color: #4C4849;
    }

    .createnew-drop .dropdown-menu a.dropdown-item {
        width: 100%;
        float: left;
        padding: 8px 15px;
        border-bottom: 1px solid #F2F2F2;
        font-size: 16px;
        font-weight: 600;
        color: #4C4849;
    }

.notification {
    margin: 0 20px;
    position: relative;
    background: url("../Images/web-images/notification-ico.png") no-repeat top 8px center;
    padding: 35px 0 0 0;
}

    .notification:hover, .notification.active {
        background: url("../Images/web-images/notification-ico-hover.png") no-repeat top 8px center;
        color: #1d7fae;
    }

.notification-drop {
    position: relative;
}

    .notification-drop .notification-panel {
        width: 100%;
        display: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
        top: 60px;
        right: 0;
        max-width: 500px;
        min-width: 500px;
        position: absolute;
        background: rgba(255, 255, 255, 0.9);
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 10px;
        z-index: 100;
    }
        /*.admin-header .navbar .nav .notification-drop .notification-panel:before{content:""; position:absolute; top:-12px; right:70px; border-color:transparent transparent #fff transparent; border-width:0 12px 12px 12px; border-style:solid;}*/
        .notification-drop .notification-panel h2 {
            width: 100%;
            float: left;
            padding: 10px 15px;
            border-bottom: 2px solid #ccc;
            color: #212121;
            font-size: 20px;
            margin: 0 0 10px 0;
        }

        .notification-drop .notification-panel .notification-list {
            width: 100%;
            float: left;
            overflow: auto;
            max-height: 300px;
        }

            .notification-drop .notification-panel .notification-list ul {
                width: 100%;
                float: left;
                margin: 0;
                padding: 0;
            }

                .notification-drop .notification-panel .notification-list ul li {
                    width: 100%;
                    float: left;
                    margin: 0;
                    border-bottom: 1px solid #ccc;
                    padding: 10px;
                    text-align: left;
                }

                    .notification-drop .notification-panel .notification-list ul li:hover {
                        background: #027BB6;
                        color: #fff;
                    }

                        .notification-drop .notification-panel .notification-list ul li:hover span {
                            color: #fff;
                        }

                    .notification-drop .notification-panel .notification-list ul li span {
                        width: calc(100% - 36px);
                        float: left;
                        font-size: 16px;
                        color: #212121;
                        word-break: break-word;
                    }

                    .notification-drop .notification-panel .notification-list ul li .dismiss {
                        width: 16px;
                        height: 16px;
                        float: left;
                        margin: 4px 10px;
                        background: url(../Images/web-images/dismissIco.png) no-repeat center center;
                        cursor: pointer;
                    }

                    .notification-drop .notification-panel .notification-list ul li:hover .dismiss {
                        background: url(../Images/web-images/dismissIco-white.png) no-repeat center center;
                    }

    .notification-drop:hover .notification-panel {
        display: block;
    }

.search-handle .trigger {
    display: none;
}

.search-handle .search-close {
    display: none;
}

.admin-header .navbar .navbar-nav .user-drop-block {
    width: 100%;
    float: left;
    margin-left: 30px;
    margin-top: 5px;
}

    .admin-header .navbar .navbar-nav .user-drop-block .user-info {
        width: auto;
        float: left;
        white-space: nowrap;
        text-align: right;
        margin-top: 5px;
    }

        .admin-header .navbar .navbar-nav .user-drop-block .user-info .name {
            font-weight: 600;
            color: #027BB6;
            font-size: 14px;
            line-height: 25px;
            float: right;
        }

        .admin-header .navbar .navbar-nav .user-drop-block .user-info .role {
            font-weight: 500;
            color: #4B4747;
            font-size: 13px;
            line-height: 15px;
            float: right;
        }

    .admin-header .navbar .navbar-nav .user-drop-block .user-pic {
        width: 50px;
        height: 50px;
        float: left;
        margin: 0 15px;
    }

        .admin-header .navbar .navbar-nav .user-drop-block .user-pic img {
            width: 50px;
            height: 50px;
            border-radius: 360px;
            border: 1px solid #ccc;
        }

    .admin-header .navbar .navbar-nav .user-drop-block .carot {
        margin-top: 10px;
        float: left;
    }

.admin-header .navbar .navbar-nav .dropdown a:after {
    display: none;
}

.admin-header .navbar .navbar-nav .dropdown-menu {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    min-width: 200px;
    border-radius: 10px;
    top: 58px;
    left: auto;
    right: 0;
}

    .admin-header .navbar .navbar-nav .dropdown-menu li a {
        width: 100%;
        float: left;
        padding: 8px 15px;
        border-bottom: 1px solid #F2F2F2;
        font-size: 16px;
        font-weight: 600;
        color: #4C4849;
    }

    .admin-header .navbar .navbar-nav .dropdown-menu a.dropdown-item {
        width: 100%;
        float: left;
        padding: 8px 15px;
        border-bottom: 1px solid #F2F2F2;
        font-size: 16px;
        font-weight: 600;
        color: #4C4849;
        cursor: pointer
    }

.top-nav-holder {
    flex-grow: 4;
    flex-basis: auto;
}

.top-nav {
    margin: 0;
    padding: 0;
    text-align: center;
    width: 100%;
}

    .top-nav li {
        display: inline-block;
        list-style: none;
    }

        .top-nav li a {
            font-size: 13px;
            font-weight: 600;
            color: #111111;
            line-height: 25px;
            letter-spacing: 1px;
        }

        .top-nav li .dropdown-menu li {
            width: 100%;
        }


.left-menu {
    width: 300px;
    position: relative;
    height: calc(100vh - 100px);
    float: left;
    background: rgb(0,80,142);
    background: linear-gradient(90deg, rgba(0,80,142,1) 7%, rgba(0,102,162,1) 57%, rgba(1,124,183,1) 100%);
    transition: width .3s ease-in-out;
    overflow: auto;
}

.menu-collapse-slot {
    position: absolute;
    top: 25px;
    left: 0;
    display: none;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url(../Images/web-images/ham-menu-blue.png) no-repeat top left;
    background-size: contain;
}

.left-menu-collapse .menu-collapse-slot {
    background: url(../Images/web-images/ham-menu-blue-close.png) no-repeat top left;
    background-size: contain;
}

.purpule .menu-collapse-slot {
    background: url(../Images/web-images/ham-menu.png) no-repeat top left;
    background-size: contain;
}

.purpule.left-menu-collapse .menu-collapse-slot {
    background: url(../Images/web-images/ham-menu-close.png) no-repeat top left;
    background-size: contain;
}

.purpule .left-menu {
    background: rgb(75,66,156);
    background: linear-gradient(90deg, rgba(75,66,156,1) 0%, rgba(101,91,187,1) 48%, rgba(125,115,216,1) 100%);
}

.left-menu ul {
    width: 100%;
    float: left;
    margin: 20px 0;
    padding: 0;
}

    .left-menu ul li {
        width: 100%;
        float: left;
        overflow: hidden;
    }

        .left-menu ul li a {
            width: 100%;
            float: left;
            white-space: nowrap;
            padding: 8px 25px 8px 60px;
            position: relative;
            line-height: 24px;
            font-size: 16px;
            font-weight: 400;
            color: #fff;
            background-repeat: no-repeat;
            background-position: center left 20px;
        }

            .left-menu ul li a span.hassublevel {
                background: url(../Images/web-images/arrow-white-close.png) no-repeat top left;
                width: 16px;
                height: 16px;
                top: 12px;
                right: 10px;
                position: absolute;
            }

        .left-menu ul li.active > a span.hassublevel {
            background: url(../Images/web-images/arrow-white-open.png) no-repeat top left;
        }

        .left-menu ul li a:hover {
            background-color: #092D49;
            border-left: 10px solid #2196F3;
            padding-left: 50px;
            background-position: center left 10px !important;
        }

        .left-menu ul li.active > a {
            background-color: #092D49;
            border-left: 10px solid #2196F3;
            padding-left: 50px;
            background-position: center left 10px !important;
        }

.purpule .left-menu ul li.active > a, .purpule .left-menu ul li a:hover {
    background-color: #3a3189;
    border-left: 10px solid #fff;
}

.purpule .left-menu ul li.active > a {
    background-color: #3a3189;
    border-left: 10px solid #ffffff;
}

.left-menu ul li a.dashboard {
    background-image: url(../Images/web-images/dashboard-ico.png);
}

.left-menu ul li a.forms {
    background-image: url(../Images/web-images/forms-ico.png);
}

.left-menu ul li a.reports {
    background-image: url(../Images/web-images/reports-ico.png);
}

.left-menu ul li a.inventory {
    background-image: url(../Images/web-images/inventory-ico.png);
}

.left-menu ul li a.training {
    background-image: url(../Images/web-images/training-ico.png);
}

.left-menu ul li a.users {
    background-image: url(../Images/web-images/users-ico.png);
}

.left-menu ul li a.dealerships {
    background-image: url(../Images/web-images/dealerships-ico.png);
}

.left-menu ul li a.companyowner {
    background-image: url(../Images/web-images/company-owner-ico.png);
}

.left-menu ul li a.billing {
    background-image: url(../Images/web-images/billing-ico.png);
}

.left-menu ul li a.settings {
    background-image: url(../Images/web-images/settings-ico.png);
}

.left-menu ul li a.customersupport {
    background-image: url(../Images/web-images/customer-support-ico.png);
}

.left-menu ul li a.partners {
    background-image: url(../Images/web-images/partners-ico.png);
}

.left-menu ul li a.websitecontent {
    background-image: url(../Images/web-images/website-content-ico.png);
}

.left-menu ul li a.logs {
    background-image: url(../Images/web-images/logs-ico.png);
}

.left-menu ul li a.alert-setting {
    background-image: url(../Images/web-images/alert-ico.png);
}

.left-menu ul li a.carmooo {
    background-image: url(../Images/web-images/carmooo_logo_white.png);
}

.left-menu ul li .sub-menu-level-1 {
    width: 100%;
    float: left;
    background: #144973;
    margin: 0;
    padding: 0;
    height: 0;
    display: none;
    transition: height .3s ease-in-out;
}

.left-menu ul li.active > .sub-menu-level-1 {
    height: auto;
    display: block;
    transition: height .3s ease-in-out;
}

.purpule .left-menu ul li .sub-menu-level-1 {
    background: #3a3189;
}

.left-menu ul li .sub-menu-level-1 li {
    width: 100%;
    float: left;
}

    .left-menu ul li .sub-menu-level-1 li a {
        width: 100%;
        float: left;
        padding: 8px 5px 8px 60px;
        line-height: 24px;
        font-size: 16px;
        font-weight: 400;
        color: #fff;
    }

        .left-menu ul li .sub-menu-level-1 li a:hover, .left-menu ul li .sub-menu-level-1 li.active > a {
            background: #4B7697;
            border: 0;
        }

.purpule .left-menu ul li .sub-menu-level-1 li a:hover, .purpule .left-menu ul li .sub-menu-level-1 li.active > a {
    background: #5349ac;
    border: 0;
}

.left-menu ul li .sub-menu-level-2 {
    width: 100%;
    float: left;
    background: #5348ad;
    margin: 0;
    padding: 0;
    display: none;
}

.left-menu ul li.active > .sub-menu-level-2 {
    height: auto;
    display: block;
}

.purpule .left-menu ul li .sub-menu-level-2 {
    background: #5348ad
}

.left-menu ul li .sub-menu-level-2 li {
    width: 100%;
    float: left;
}

    .left-menu ul li .sub-menu-level-2 li a {
        width: 100%;
        float: left;
        padding: 8px 5px 8px 80px;
        line-height: 24px;
        font-size: 16px;
        font-weight: 400;
        color: #fff;
    }

        .left-menu ul li .sub-menu-level-2 li a:hover, .left-menu ul li .sub-menu-level-2 li.active > a {
            background: #5348ad;
            border: 0;
        }

.purpule .left-menu ul li .sub-menu-level-2 li a:hover, .purpule .left-menu ul li .sub-menu-level-2 li.active > a {
    background: #8479e0;
    border: 0;
}


.page-data-container {
    width: calc(100% - 300px);
    /*max-height:4000px; 
    min-height:2000px;*/
    /*height:calc(100vh - 100px); */
    overflow-x: auto;
    float: right;
    padding: 15px;
    /*padding: 30px;*/
    transition: width .3s ease-in-out;
}

.mid-data-container {
    width: 100%;
    float: left;
    margin-bottom: 50px;
}

.content-header {
    width: 100%;
    float: left;
    border-bottom: 1px solid #E8EAEA;
    padding-bottom: 20px;
}

    .content-header h2 {
        width: auto;
        float: left;
        color: #111111 !important;
        font-size: 30px;
        font-weight: 700;
        margin: 0 20px 0 0;
        line-height: 50px;
    }

.green-btn {
    background: #00BC71;
    border-radius: 6px;
    height: 50px;
    min-width: 150px;
    cursor: pointer;
    text-align: center;
    color: #fff;
    font-size: 18px;
    border: 0;
    font-weight: 500;
    line-height: 50px;
    padding: 0 25px;
}

    .green-btn:hover {
        background: #00aa66;
        color: #fff;
        text-decoration: none;
    }

.green-btn-medium {
    background: #00BC71;
    border-radius: 6px;
    height: 40px;
    min-width: 150px;
    cursor: pointer;
    text-align: center;
    color: #fff;
    font-size: 18px;
    border: 0;
    font-weight: 400;
    line-height: 40px;
    padding: 0 25px;
}

    .green-btn-medium:hover {
        background: #00aa66;
        color: #fff;
        text-decoration: none;
    }

.blue {
    color: #017CB7;
}

.blue-btn-add {
    background: #017CB7 url(../Images/web-images/white-plus.png) no-repeat center center;
    border-radius: 6px;
    width: 50px;
    height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 50px;
}

.blue-btn-delete {
    background: #017CB7 url(../Images/web-images/white-close.png) no-repeat center center;
    border-radius: 6px;
    width: 50px;
    height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 50px;
}

.blue-btn-delete-small {
    background: #017CB7 url(../Images/web-images/white-close.png) no-repeat center center;
    background-size: 20px 20px;
    border-radius: 6px;
    width: 24px;
    height: 24px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 24px;
}

.red-btn-delete-small {
    background: #C60404 url(../Images/web-images/white-close.png) no-repeat center center;
    padding: 6px;
    background-size: 10px;
    border-radius: 6px;
    width: 24px;
    height: 24px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 24px;
}

.green-btn-edit-small {
    background: #00BC71 url(../Images/web-images/edit-white-ico.png) no-repeat center center;
    padding: 6px;
    margin: 6px;
    background-size: 10px;
    border-radius: 6px;
    width: 24px;
    height: 24px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 24px;
}

.blue-btn {
    background: #017CB7;
    border-radius: 6px;
    height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff !important;
    font-size: 18px;
    border: 0;
    font-weight: 500;
    line-height: 50px;
    padding: 0 25px;
}

    .blue-btn:hover {
        background: #017CB7;
        color: #fff;
        text-decoration: none;
    }

.purpule .blue-btn {
    background: #3a3189;
}

    .purpule .blue-btn:hover {
        background: #3a3189;
    }

.blue-btn-small {
    background: #017CB7;
    border-radius: 6px;
    height: 30px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    border: 0;
    font-weight: 500;
    line-height: 30px;
    padding: 0 25px;
}

    .blue-btn-small:hover {
        background: #017CB7;
        color: #fff;
        text-decoration: none;
    }

.remove-btn {
    background: url(../Images/web-images/dismissIco.png) no-repeat center center;
    vertical-align: middle;
    background-size: 10px 10px;
    width: 16px;
    height: 16px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    border: none;
    font-size: 30px;
    border: 0;
    font-weight: 500;
    line-height: 16px;
}

.blue-bor-btn {
    border: 2px solid #017CB7;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    height: 50px;
    text-align: center;
    color: #111;
    font-size: 18px;
    font-weight: 500;
    line-height: 50px;
    padding: 0 25px;
}

.blue-bor-btn-small {
    border: 2px solid #017CB7;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    height: 30px;
    text-align: center;
    color: #111;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    padding: 0 25px;
}

.purpule .blue-bor-btn {
    border: 2px solid #3a3189;
}

.blue-bor-btn:hover {
    color: #111;
    text-decoration: none;
}

.blue-text-btn {
    background: none;
    border: 0;
    color: #017CB7;
    font-size: 16px;
    text-decoration: underline;
    font-weight: 500;
    cursor: pointer;
}

.yellow-btn {
    background: #E3BC4D;
    border-radius: 6px;
    height: 50px;
    min-width: 100px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 50px;
    padding: 0 25px;
}

    .yellow-btn:hover {
        background: #E3BC4D;
        color: #fff;
    }

.purpule-btn-big {
    background: #017CB7;
    border-radius: 6px;
    cursor: pointer;
    height: 50px;
    border: none;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 50px;
    padding: 0 25px;
}

    .purpule-btn-big:hover {
        background: #017CB7;
        color: #fff;
    }

.purpule .purpule-btn-big {
    background: #7A70D4;
    border-radius: 6px;
    cursor: pointer;
    height: 50px;
    border: none;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 50px;
    padding: 0 25px;
}

    .purpule .purpule-btn-big:hover {
        background: #5348B9;
        color: #fff;
    }

.purpule-bor-btn-big {
    background: #fff;
    border: 2px solid #7A70D4;
    cursor: pointer;
    border-radius: 6px;
    height: 50px;
    min-width: 250px;
    text-align: center;
    color: #7A70D4;
    font-size: 20px;
    font-weight: 700;
    line-height: 46px;
    padding: 0 20px;
}

    .purpule-bor-btn-big:hover {
        background: #5348B9;
        color: #fff;
    }

.dark-blue-btn-big {
    background-color: #092D49;
    border-radius: 360px;
    cursor: pointer;
    height: 50px;
    border: none;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: 50px;
    padding: 0 25px;
}

    .dark-blue-btn-big:hover {
        background-color: #092D49;
        color: #fff;
    }

.edit-ico {
    background-image: url(../Images/web-images/edit-white-ico.png);
    background-repeat: no-repeat;
    background-position: center left 25px;
    padding-left: 45px;
}

.change-password-ico {
    background-image: url(../Images/web-images/change-password-ico.png);
    background-repeat: no-repeat;
    background-position: center left 25px;
    padding-left: 45px;
}

.controls-panel {
    width: 100%;
    float: left;
    margin: 20px 0 20px;
    border-bottom: 1px solid #E8EAEA;
}

    .controls-panel .blue-bor {
        border: 2px solid #017CB7 !important;
    }

.purpule .controls-panel .blue-bor {
    border: 2px solid #3a3189 !important;
}

.controls-panel .filterrange {
    width: 100%;
    padding: 10px 10px;
    float: left;
    position: relative;
    background: #ffffff;
    border: 1px solid #F2F2F2;
    border-radius: 6px;
    font-size: 16px;
    color: #111111;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;
    height: 50px;
    overflow: hidden;
}

    .controls-panel .filterrange .fa-caret-down {
        width: 15px;
        position: absolute;
        right: 12px;
        top: 19px;
    }

        .controls-panel .filterrange .fa-caret-down img {
            float: left;
        }

        .controls-panel .filterrange .fa-caret-down:before {
            display: none;
        }

.respo-table {
    width: 100%;
    float: left;
    overflow: auto;
}

.blue-head-table table {
    width: 100%;
    margin: 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

    .blue-head-table table thead tr th {
        background: #00294A;
        padding: 15px;
        line-height: 25px;
        height: auto;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
    }

.purpule .blue-head-table table thead tr th {
    background: #3a3189;
}

.blue-head-table table thead th:first-child {
    border-radius: 10px 0 0 0;
}

.blue-head-table table thead th:last-child {
    border-radius: 0 10px 0 0;
}

.blue-head-table.less-padd table thead tr th, .blue-head-table.less-padd table tbody tr td, .blue-head-table.less-padd table tbody tr:nth-child(even) td {
    padding: 10px 15px;
}

.blue-head-table table tbody tr td {
    /*padding: 20px 15px;*/
    padding: 10px 7px;
    background: #E8F3FE;
    font-size: 16px;
    color: #111111;
    /*line-height: 28px;*/
}

.purpule .blue-head-table table tbody tr td {
    background: #eceaf5;
}

.blue-head-table table tbody tr:nth-child(even) td {
    /*padding: 20px 15px;*/
    padding: 10px 7px;
    background: #fff;
    font-size: 16px;
    color: #111111;
    /*line-height: 28px;*/
}
/*.blue-head-table tbody tr td:first-child{border-radius:10px 0 0 10px;}
.blue-head-table tbody tr td:last-child{border-radius:0 10px 10px 0;}*/
.blue-head-table table tbody tr td .id {
    white-space: nowrap;
    color: #017CB7;
}

.blue-head-table table tbody tr td .pass-btn {
    width: 90px;
    height: 30px;
    background: #00BC71;
    text-align: center;
    border-radius: 4px;
    float: left;
    margin-bottom: 10px;
    line-height: 30px;
    color: #fff;
    font-size: 16px;
}

.blue-head-table table tbody tr td .fail-btn {
    width: 90px;
    height: 30px;
    background: #D20000;
    text-align: center;
    border-radius: 4px;
    float: left;
    margin-bottom: 10px;
    line-height: 30px;
    color: #fff;
    font-size: 16px;
}

.blue-head-table table tbody tr td .check-price {
    font-size: 16px;
    color: #00294A;
    text-decoration: underline !important;
}

.blue-head-table table tbody tr td .buyer-name {
    font-weight: 600;
    background: url(../Images/web-images/line-bg.png) no-repeat center left;
    line-height: 26px;
    padding-left: 13px;
    margin-bottom: 15px;
}

    .blue-head-table table tbody tr td .buyer-name.no-bg {
        background: none;
        padding-left: 0;
    }

    .blue-head-table table tbody tr td .buyer-name img {
        width: 45px;
        height: 30px
    }

.blue-head-table table tbody tr td .status {
    border-radius: 6px;
    padding: 5px 10px;
    width: 110px;
    float: left;
}

    .blue-head-table table tbody tr td .status.purpule {
        background: #DFCCFF;
        border: 1px solid #958BF1;
        color: #6000A0;
    }

.status-yellow {
    background: #F7B401;
    border: #F6BE00;
    color: #fff;
}

.status-orange {
    background: #E88125;
    border: #E88125;
    color: #fff;
}

.status-.purpule {
    background: #da25e8;
    border: #E88125;
    color: #fff;
}

.status-white-blue {
    background: #fff;
    border: #017CB7 2px solid;
    font-weight: bold;
    text-align: center;
    color: #017CB7;
}

.blue-head-table table tbody tr td .status.red {
    background: #FFCCCC;
    border: 1px solid #F18B8B;
    color: #A00000;
}

.blue-head-table table tbody tr td .dropdown .btn {
    background: none;
    padding: 5px;
    border: 0;
}

    .blue-head-table table tbody tr td .dropdown .btn:after {
        display: none;
    }

    .blue-head-table table tbody tr td .dropdown .btn:focus, .blue-head-table table tbody tr td .dropdown .btn:active {
        box-shadow: none !important;
        border: none;
        background-color: transparent;
    }

.blue-head-table table tbody tr td .dropdown .dropdown-menu {
    width: auto;
    right: 0;
    left: auto !important;
    transform: none !important;
    top: 36px !important;
    border-radius: 6px;
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.blue-head-table table tbody tr td .dropdown .dropdown-item {
    width: 100%;
    float: left;
    padding: 10px 15px;
    border-bottom: 1px solid #f2f2f2;
    color: #111111;
    font-size: 16px;
    line-height: 18px;
    font-weight: 500;
}

    .blue-head-table table tbody tr td .dropdown .dropdown-item:hover {
        color: #017CB7;
        background: #f2f2f2;
    }

.blue-head-table table tbody tr td .dropdown a:last-child {
    border-bottom: none;
}

.white-rounded-btn {
    color: #017CB7;
    height: 50px;
    text-align: center;
    margin: 25px auto;
    background: #fff;
    line-height: 50px;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    border-radius: 360px;
    padding: 0 40px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

    .white-rounded-btn:hover {
        background: #f9f9f9;
    }

.divider {
    width: 100%;
    float: left;
    border-bottom: 1px solid #E8EAEA;
    margin-bottom: 30px;
}

table.dataTable.fixedHeader-floating {
    border-radius: 10px 10px 0 0;
}

    table.dataTable.fixedHeader-floating thead th {
        background: #00294A;
        padding: 15px;
        line-height: 25px;
        border-bottom: 0;
        font-family: 'Open Sans';
        vertical-align: top;
        height: auto;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
    }

        table.dataTable.fixedHeader-floating thead th:first-child {
            border-radius: 10px 0 0 0;
        }

        table.dataTable.fixedHeader-floating thead th:last-child {
            border-radius: 0 10px 0 0;
        }

.data-table-custom {
    width: 100%;
    float: left;
}

    .data-table-custom .table {
        width: 100% !important;
        margin: 0;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
        border-radius: 10px 10px 0 0;
    }

        .data-table-custom .table thead th {
            background: #00294A;
            padding: 15px;
            line-height: 25px;
            border-bottom: 0;
            vertical-align: top;
            height: auto;
            font-size: 16px;
            color: #fff;
            font-weight: 500;
        }

.purpule .data-table-custom .table thead th {
    background: #3a3189;
}

.data-table-custom .table thead th:first-child {
    border-radius: 10px 0 0 0;
}

.data-table-custom .table thead th:last-child {
    border-radius: 0 10px 0 0;
}

.data-table-custom .table tbody tr td {
    padding: 20px 15px;
    background: #E8F3FE;
    font-size: 16px;
    color: #111111;
    line-height: 28px;
    border-bottom: 5px solid transparent;
}

.purpule .data-table-custom .table tbody tr td {
    background: #eceaf5;
}

.data-table-custom .table tbody tr:nth-child(even) td {
    padding: 20px 15px;
    background: #fff;
    font-size: 16px;
    color: #111111;
    line-height: 28px;
}

.data-table-custom .table tbody tr td .id {
    white-space: nowrap;
    color: #017CB7;
}

.data-table-custom .table tbody tr td .pass-btn {
    width: 90px;
    height: 30px;
    background: #00BC71;
    text-align: center;
    border-radius: 4px;
    float: left;
    margin-bottom: 10px;
    line-height: 30px;
    color: #fff;
    font-size: 16px;
}

.data-table-custom .table tbody tr td .fail-btn {
    width: 90px;
    height: 30px;
    background: #D20000;
    text-align: center;
    border-radius: 4px;
    float: left;
    margin-bottom: 10px;
    line-height: 30px;
    color: #fff;
    font-size: 16px;
}

.data-table-custom .table tbody tr td .check-price {
    font-size: 16px;
    color: #00294A;
    text-decoration: underline !important;
}

.data-table-custom .table tbody tr td .buyer-name {
    font-weight: 600;
    background: url(../Images/web-images/line-bg.png) no-repeat center left;
    line-height: 26px;
    padding-left: 13px;
    margin-bottom: 15px;
    float: left;
}

    .data-table-custom .table tbody tr td .buyer-name.no-bg {
        background: none;
        padding-left: 0;
    }

.data-table-custom .table tbody tr td .status {
    border-radius: 6px;
    padding: 5px 10px;
    width: 110px;
    float: left;
}

.deal-detail-status {
    border-radius: 6px;
    padding: 5px 10px;
    width: 110px;
}

.data-table-custom .table tbody tr td .status.purpule {
    background: #DFCCFF;
    border: 1px solid #958BF1;
    color: #6000A0;
}

.data-table-custom .table tbody tr td .status.red {
    background: #FFCCCC;
    border: 1px solid #F18B8B;
    color: #A00000;
}

.data-table-custom .table tbody tr td .dropdown {
    text-align: center;
}

table.dataTable > tbody > tr.child ul.dtr-details {
    width: 100%;
}

.data-table-custom .table tbody tr td.child .dropdown {
    float: right;
}

.data-table-custom .table tbody tr td .dropdown .btn {
    background: none;
}

.data-table-custom .table tbody tr td .dropdown .dropdown-menu {
    width: auto;
    min-width: 200px;
    right: 0;
    left: auto;
    border-radius: 6px;
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.data-table-custom .table tbody tr td .dropdown .dropdown-item {
    width: 100%;
    cursor: pointer;
    float: left;
    padding: 10px 15px;
    border-bottom: 1px solid #f2f2f2;
    color: #111111;
    font-size: 16px;
    line-height: 18px;
    font-weight: 500;
}

    .data-table-custom .table tbody tr td .dropdown .dropdown-item:hover {
        color: #017CB7;
        background: #f2f2f2;
    }

.data-table-custom .table tbody tr td .dropdown a:last-child {
    border-bottom: none;
}

.data-table-custom .table tbody tr td .btn-link {
    padding: 10px;
    cursor: pointer;
}

.data-table-custom .dataTables_info {
    color: #A1A1A1;
    font-size: 16px;
    font-weight: 600;
    margin: 10px 0 10px 0;
}

.dataTables_info_global {
    color: #A1A1A1;
    font-size: 16px;
    font-weight: 600;
    margin: 10px 0 10px 0;
    float: left;
}

.data-table-custom .bottom {
    width: 100%;
    float: left;
    margin: 15px 0;
}

.data-table-custom .dataTables_length {
    float: left;
    font-size: 16px;
    color: #111;
    font-weight: 500;
}

    .data-table-custom .dataTables_length select {
        margin: 0 5px;
    }

.data-table-custom .dataTables_paginate {
    float: right;
    padding: 0;
}

.data-table-custom .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0;
    margin: 0 3px;
}

    .data-table-custom .dataTables_wrapper .dataTables_paginate .paginate_button a {
        border: 1px solid #BDBDBD;
        background: #fff;
        border-radius: 3px;
        min-width: 30px;
        width: auto;
        height: 30px;
        text-align: center;
        line-height: 28px;
        font-size: 14px;
        font-weight: 500;
        color: #111;
        display: inline-block;
    }

    .data-table-custom .dataTables_wrapper .dataTables_paginate .paginate_button.active a {
        font-weight: bold;
        color: #fff !important;
        background: #3a3189;
    }

    .data-table-custom .dataTables_wrapper .dataTables_paginate .paginate_button.previous a {
        border: 0;
        background: none;
        border-radius: 0;
        width: auto;
        height: 30px;
        text-align: left;
        line-height: 30px;
        font-size: 16px;
        color: #111;
        font-weight: 600;
        padding-left: 15px;
        background: url(../Images/web-images/pagination-prev.png) no-repeat center left;
        display: inline-block;
    }

    .data-table-custom .dataTables_wrapper .dataTables_paginate .paginate_button.next a {
        border: 0;
        background: none;
        border-radius: 0;
        width: auto;
        height: 30px;
        text-align: left;
        line-height: 30px;
        font-size: 16px;
        color: #111;
        font-weight: 600;
        padding-right: 15px;
        background: url(../Images/web-images/pagination-next.png) no-repeat center right;
        display: inline-block;
    }

.data-table-custom .pagination > li > a, .data-table-custom .pagination > li > span {
    margin-left: 0;
}

.popover {
    width: 260px !important;
    border-radius: 6px !important;
    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
    margin-top: 0 !important;
}

    .popover.bottom > .arrow {
        display: none;
    }

    .popover .popover-content {
        padding: 0;
        border: 1px solid #f2f2f2 !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
        margin-right: 50px;
        background: #fff;
    }

        .popover .popover-content .list-group-item {
            width: 100%;
            float: left;
            padding: 10px 15px;
            margin-bottom: 0;
            font-family: 'Open Sans';
            border: 0;
            border-bottom: 1px solid #f2f2f2;
            color: #111111;
            font-size: 16px !important;
            line-height: 18px;
            font-weight: 500;
        }

.data-table-custom .table tbody tr td .dropdown .btn {
    background: none;
    padding: 5px;
    border: 0;
}

    .data-table-custom .table tbody tr td .dropdown .btn:after {
        display: none;
    }

    .data-table-custom .table tbody tr td .dropdown .btn:focus, .blue-head-table table tbody tr td .dropdown .btn:active {
        box-shadow: none !important;
        border: none;
        background-color: transparent;
    }

.data-table-custom .table tbody tr td .dropdown .dropdown-menu {
    width: auto;
    min-width: 200px;
    right: 0;
    left: auto !important;
    transform: none !important;
    top: 36px !important;
    border-radius: 6px;
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.data-table-custom .table tbody tr td .dropdown .dropdown-item {
    width: 100%;
    float: left;
    padding: 10px 15px;
    border-bottom: 1px solid #f2f2f2;
    color: #111111;
    font-size: 16px;
    line-height: 18px;
    font-weight: 500;
}

    .data-table-custom .table tbody tr td .dropdown .dropdown-item:hover {
        color: #017CB7;
        background: #f2f2f2;
    }


.respo-table .data-table-custom table.dataTable > tbody > tr.child span.dtr-title {
    float: left;
    margin-right: 8px;
}

.respo-table .data-table-custom .table.dataTable > tbody > tr.child ul.dtr-details > li {
    width: 100%;
    float: left;
}

.data-table-single-column {
    width: 100%;
    float: left;
}

    .data-table-single-column table.dataTable tbody tr {
        background: none;
    }

    .data-table-single-column table.dataTable thead th, .data-table-single-column table.dataTable thead td {
        border-bottom: 0;
    }

    .data-table-single-column table.dataTable tbody th, .data-table-single-column table.dataTable tbody td {
        padding: 0;
    }

    .data-table-single-column .table td, .data-table-single-column .table th {
        border: 0;
    }

    .data-table-single-column table.dataTable.no-footer {
        border-bottom: 0;
    }

    .data-table-single-column .dataTables_info {
        color: #A1A1A1;
        font-size: 16px;
        font-weight: 600;
        margin: 10px 0 5px 0;
    }

    .data-table-single-column .bottom {
        width: 100%;
        float: left;
        margin: 15px 0;
    }

    .data-table-single-column .dataTables_length {
        float: left;
        font-size: 16px;
        color: #111;
        font-weight: 500;
    }

        .data-table-single-column .dataTables_length select {
            margin: 0 5px;
        }

    .data-table-single-column .dataTables_paginate {
        float: right;
        padding: 0;
    }

    .data-table-single-column .dataTables_wrapper .dataTables_paginate .paginate_button {
        padding: 0;
        margin: 0 3px;
    }

        .data-table-single-column .dataTables_wrapper .dataTables_paginate .paginate_button a {
            border: 1px solid #BDBDBD;
            background: #fff;
            border-radius: 3px;
            width: 30px;
            height: 30px;
            text-align: center;
            line-height: 28px;
            font-size: 14px;
            font-weight: 500;
            color: #111;
            display: inline-block;
        }

        .data-table-single-column .dataTables_wrapper .dataTables_paginate .paginate_button.previous a {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            line-height: 30px;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding-left: 15px;
            background: url(../Images/web-images/pagination-prev.png) no-repeat center left;
            display: inline-block;
        }

        .data-table-single-column .dataTables_wrapper .dataTables_paginate .paginate_button.next a {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            line-height: 30px;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding-right: 15px;
            background: url(../Images/web-images/pagination-next.png) no-repeat center right;
            display: inline-block;
        }

    .data-table-single-column .pagination > li > a, .data-table-custom .pagination > li > span {
        margin-left: 0;
    }

.setting-card {
    width: 100%;
    float: left;
    margin: 15px 0;
}

    .setting-card h2 {
        width: calc(100% - 80px);
        float: left;
        font-size: 20px;
        font-weight: 700;
        margin: 0 0 20px 0;
    }

    .setting-card h3 {
        width: 100%;
        float: left;
        font-size: 20px;
        font-weight: 400;
        margin: 0;
        line-height: 30px;
    }

    .setting-card ul {
        width: 100%;
        float: left;
        margin: 15px 0 0 0;
        padding: 0 0 0 20px;
        ;
    }

        .setting-card ul li {
            width: 100%;
            float: left;
            font-size: 18px;
            font-weight: 700;
            list-style: disc;
        }

.enter-otp-block {
    width: 100%;
    float: left;
}

    .enter-otp-block p {
        font-size: 20px;
        font-weight: 500;
        margin: 0 0 20px 0;
    }

.tp-setting-card {
    width: 100%;
    float: left;
}

    .tp-setting-card .thirdparty-logo {
        width: calc(100% - 300px);
        float: left;
    }

        .tp-setting-card .thirdparty-logo img {
            width: auto;
            max-width: 200px;
        }

    .tp-setting-card .edit-btn {
        width: 100px;
        text-align: center;
        height: 44px;
        float: right;
        background: #092D49;
        border-radius: 360px;
        line-height: 16px;
        padding: 14px 5px;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
    }

    .tp-setting-card .cancel-btn {
        width: 100px;
        text-align: center;
        height: 44px;
        float: right;
        background: #fff;
        border: 2px solid #092D49;
        border-radius: 360px;
        line-height: 16px;
        padding: 14px 5px;
        font-size: 16px;
        color: #092D49;
        font-weight: 500;
    }

    .tp-setting-card .field-label {
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        float: left;
        margin-right: 15px;
    }

    .tp-setting-card .hours {
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        margin-left: 10px;
        display: inline-block;
        vertical-align: top;
    }

    .tp-setting-card .selected-states {
        border: 1px solid #3A3189;
        display: inline-block;
        padding: 20px;
        min-height: 80px;
        border-radius: 10px;
        width: 100%;
        float: left;
    }

.popup-jumbo .modal-dialog {
    width: 100%;
    max-width: 1000px;
}

.popup-jumbo .modal-title {
    font-size: 24px;
    font-weight: 600;
    color: #111111;
}

.popup-jumbo .modal-body {
    padding: 20px;
}

.popup-big .modal-dialog {
    width: 100%;
    max-width: 800px;
}

.popup-big .modal-title {
    font-size: 24px;
    font-weight: 600;
    color: #111111;
}

.popup-big .modal-body {
    padding: 20px;
}

.popup-big .mid-data-container {
    margin-bottom: 0;
}

    .popup-big .mid-data-container .content-area {
        margin-top: 0;
    }

.popup-mid .modal-dialog {
    width: 100%;
    max-width: 600px;
}

.popup-mid .modal-title {
    font-size: 24px;
    font-weight: 600;
    color: #111111;
}

.popup-mid .modal-body {
    padding: 20px;
}

.card-panel {
    width: 100%;
    float: left;
    margin-bottom: 25px;
}

    .card-panel h3 {
        width: 100%;
        float: left;
        margin-bottom: 20px;
        font-size: 20px;
        font-weight: 700;
    }

    .card-panel h4 {
        width: 100%;
        float: left;
        margin-bottom: 10px;
        font-size: 18px;
        font-weight: 600;
    }

    .card-panel .details-card {
        width: 100%;
        float: left;
        border: 1px solid #F2F2F2;
        background: #fff;
        border-radius: 10px;
        padding: 15px 0px 0px 0px;
        position: relative;
    }

        .card-panel .details-card.buyer:after {
            content: "";
            height: 6px;
            width: calc(100% - 10px);
            top: -2px;
            left: 5px;
            border-radius: 360px;
            background: #2196F3;
            position: absolute;
        }

        .card-panel .details-card.vehicle:after {
            content: "";
            height: 6px;
            width: calc(100% - 10px);
            top: -2px;
            left: 5px;
            border-radius: 360px;
            background: #2D397F;
            position: absolute;
        }

        .card-panel .details-card.transaction:after {
            content: "";
            height: 6px;
            width: calc(100% - 10px);
            top: -2px;
            left: 5px;
            border-radius: 360px;
            background: #F3AD21;
            position: absolute;
        }

        .card-panel .details-card ul {
            width: 100%;
            float: left;
            margin: 0;
            padding: 0;
        }

            .card-panel .details-card ul li {
                width: 100%;
                float: left;
                margin: 0 0 10px 0;
                padding: 0;
                list-style: none;
                font-size: 20px;
                color: #4C4849;
                font-weight: 400;
            }

                .card-panel .details-card ul li b {
                    font-weight: 600;
                    margin-right: 10px;
                }

        .card-panel .details-card .img-list {
            width: 100%;
            float: left;
            margin-bottom: 20px;
        }

            .card-panel .details-card .img-list .img-item {
                max-width: 120px;
                max-height: 120px;
                float: left;
                margin: 0 10px 10px 0;
                overflow: hidden;
                cursor: pointer;
            }

                .card-panel .details-card .img-list .img-item img {
                    max-width: 120px;
                    max-height: 120px;
                    background: url(/Images/ajax-loader.gif) no-repeat;
                }

.progressSubmitDiv {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding-top: 20%;
    font-size: 13px;
}

.progressOfflineDiv {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    padding-top: 40%;
    font-size: 13px;
}

    .progressOfflineDiv span {
        background: red
    }
/*.txtCenter { text-align: center !important;}*/

.ai-logic h3 {
    font-size: 30px;
    font-weight: 600;
    margin: 0 0 10px 0;
}

.ai-logic p {
    font-size: 20px;
    font-weight: 400;
    margin: 0 0 30px 0;
}

.details-card {
    width: 100%;
    float: left;
    position: relative;
}

    .details-card .company-logo {
        width: 100px;
        height: 100px;
        background: #fff;
        margin-top: -70px;
        margin-bottom: 20px;
        border-radius: 360px;
        overflow: hidden;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
        float: left;
    }

        .details-card .company-logo img {
            width: 100%;
            height: 100%;
        }

    .details-card .user-pic {
        width: 100px;
        height: 100px;
        background: #fff;
        position: relative;
        margin-top: -70px;
        margin-bottom: 20px;
        border-radius: 360px;
        overflow: hidden;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
        float: left;
    }

        .details-card .user-pic img {
            width: 100%;
            height: 100%;
            display: block;
        }

        .details-card .user-pic .edit-image {
            position: absolute;
            bottom: 0px;
            left: 0px;
            min-width: 100px;
        }

    .details-card ul {
        width: 100%;
        float: left;
        margin: 0;
        padding: 0;
    }

        .details-card ul.pushup {
            margin-top: -40px;
            position: relative;
            z-index: 1;
        }

        .details-card ul li {
            width: 100%;
            float: left;
            margin: 0 0 10px 0;
            padding: 0;
            list-style: none;
            font-size: 20px;
            color: #4C4849;
            font-weight: 400;
        }

            .details-card ul li b {
                font-weight: 600;
                margin-right: 10px;
            }

            .details-card ul li .result-box {
                width: 100%;
                float: left;
                border-radius: 10px;
                padding: 15px 15px 5px 15px;
                position: relative;
                background: #fff;
                border: 1px solid #3A3189;
            }

                .details-card ul li .result-box .edit-btn {
                    background: url(../Images/web-images/edit-blue-ico.png) no-repeat center left;
                    height: 16px;
                    padding-left: 20px;
                    line-height: 16px;
                    font-size: 16px;
                    font-weight: 600;
                    color: #3A3189;
                    position: absolute;
                    top: 20px;
                    right: 15px;
                    width: auto;
                }

                .details-card ul li .result-box .result-item {
                    width: auto;
                    float: left;
                    border-radius: 6px;
                    font-size: 16px;
                    font-weight: 500;
                    color: #3A3189;
                    padding: 10px;
                    background: #E7E4FF;
                    border: 1px solid #776DD0;
                    margin: 0 10px 10px 0;
                }

    .details-card .blue-edit-btn {
        position: relative;
        text-decoration: none;
        z-index: 2;
        width: auto;
        text-align: center;
        height: 44px;
        float: right;
        background: #092D49;
        border-radius: 360px;
        line-height: 16px;
        padding: 14px 25px;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    }

    .details-card .transaction-btn {
        position: relative;
        text-decoration: none;
        z-index: 2;
        width: auto;
        text-align: center;
        height: 44px;
        float: right;
        background: #E3BC4D;
        border-radius: 360px;
        line-height: 16px;
        padding: 14px 25px;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    }

    .details-card .purpule-btn {
        position: relative;
        z-index: 2;
        width: auto;
        text-align: center;
        height: 44px;
        float: right;
        background: #766CD0;
        border-radius: 360px;
        line-height: 16px;
        padding: 14px 25px;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    }

.featured-report-cards {
    width: 100%;
    float: left;
    margin: 15px 0;
}

    .featured-report-cards .number-card {
        width: 100%;
        height: 100%;
        float: left;
        background: #7A70D4;
        text-align: center;
        border-radius: 10px;
        padding: 10px 10px 15px 10px;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    }

        .featured-report-cards .number-card .card-count {
            width: 100%;
            float: left;
            font-size: 120px;
            color: #7A70D4;
            line-height: 140px;
            text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
        }

        .featured-report-cards .number-card .card-text {
            width: 100%;
            float: left;
            min-height: 50px;
            line-height: 25px;
            font-size: 20px;
            color: #fff;
            font-weight: 600;
            vertical-align: bottom;
        }

        .featured-report-cards .number-card .card-text-small {
            width: 100%;
            float: left;
            min-height: 22px;
            line-height: 16px;
            font-size: 14px;
            color: #fff;
            font-weight: 600;
            vertical-align: bottom;
        }

        .featured-report-cards .number-card .card-count-small {
            width: 100%;
            float: left;
            font-size: 40px;
            color: #7A70D4;
            line-height: 50px;
            text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
        }

.switch-control-panel {
    width: 100%;
    float: left;
    position: relative;
    padding-right: 20px;
    margin: 20px 0;
}

    .switch-control-panel .img-holder {
        max-width: calc(100% - 20px);
        width: auto;
        float: left;
    }

        .switch-control-panel .img-holder img {
            max-width: 100%;
            float: left;
        }

.vehicle-history-pop .switch-control-panel {
    padding-right: 0;
    margin: 0 0 20px;
}

    .vehicle-history-pop .switch-control-panel .dropdown-slot {
        top: -2px;
    }

.switch-control-panel img {
    max-width: 130px;
}

.switch-control-panel .blue-text-label {
    font-size: 16px;
    font-weight: 500;
    color: #3A3189;
    margin-bottom: 0;
}

.switch-control-panel .dropdown-slot {
    position: absolute;
    top: 12px;
    right: 0;
}

    .switch-control-panel .dropdown-slot .dropdown .btn {
        background: none;
        padding: 5px;
        border: 0;
        text-align: center;
    }

        .switch-control-panel .dropdown-slot .dropdown .btn:hover {
            background: #f2f2f2;
        }

        .switch-control-panel .dropdown-slot .dropdown .btn:after {
            display: none;
        }

        .switch-control-panel .dropdown-slot .dropdown .btn:focus {
            box-shadow: none !important;
            border: none;
            background: #f2f2f2;
            ;
        }

    .switch-control-panel .dropdown-slot .dropdown .dropdown-menu {
        min-width: 200px;
        width: auto;
        right: 0;
        left: auto !important;
        transform: none !important;
        top: 36px !important;
        border-radius: 6px;
        border: 1px solid #f2f2f2;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    }

    .switch-control-panel .dropdown-slot .dropdown .dropdown-item {
        width: 100%;
        float: left;
        padding: 10px 15px;
        border-bottom: 1px solid #f2f2f2;
        color: #111111;
        font-size: 16px;
        line-height: 18px;
        font-weight: 500;
    }

        .switch-control-panel .dropdown-slot .dropdown .dropdown-item:hover {
            color: #017CB7;
            background: #f2f2f2;
        }

    .switch-control-panel .dropdown-slot .dropdown a:last-child {
        border-bottom: none;
    }

.progress-round {
    position: relative;
    margin: 4px;
    float: left;
    text-align: center;
}

    .progress-round .data {
        width: 100%;
        float;
        text-align: center;
        color: #202020;
        padding-top: 20px;
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
    }

        .progress-round .data b {
            font-size: 18px;
            line-height: 22px;
            font-weight: 700;
        }

    .progress-round .barOverflow { /* Wraps the rotating .bar */
        position: relative;
        overflow: hidden; /* Comment this line to understand the trick */
        width: 120px;
        height: 60px; /* Half circle (overflow) */
    }

    .progress-round .bar {
        position: absolute;
        top: 0;
        left: 0;
        width: 120px;
        height: 120px; /* full circle! */
        border-radius: 50%;
        box-sizing: border-box;
        border: 15px solid #C5D7E9; /* half gray, */
        border-bottom-color: #10A6FA; /* half azure */
        border-right-color: #10A6FA;
    }


.pagination-box .pagination {
    float: right;
    padding: 0;
}

    .pagination-box .pagination .paginate_button {
        padding: 0;
        margin: 0 4px;
    }

        .pagination-box .pagination .paginate_button a {
            border: 1px solid #BDBDBD;
            background: #fff;
            border-radius: 3px;
            width: 30px;
            height: 30px;
            text-align: center;
            line-height: 28px;
            font-size: 14px;
            font-weight: 500;
            color: #111;
            display: inline-block;
        }

            .pagination-box .pagination .paginate_button a.active {
                font-weight: bold;
                color: #fff !important;
                background: #3a3189;
            }

        .pagination-box .pagination .paginate_button.previous a {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            line-height: 30px;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding-left: 15px;
            background: url(/Images/web-images/pagination-prev.png) no-repeat center left;
            display: inline-block;
        }

        .pagination-box .pagination .paginate_button.next a {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            line-height: 30px;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding-right: 15px;
            background: url(/Images/web-images/pagination-next.png) no-repeat center right;
            display: inline-block;
        }

        .pagination-box .pagination .paginate_button button {
            border: 1px solid #BDBDBD;
            background: #fff;
            border-radius: 3px;
            min-width: 30px;
            width: auto;
            height: 30px;
            text-align: center;
            font-size: 14px;
            font-weight: 500;
            color: #111;
            display: inline-block;
        }

            .pagination-box .pagination .paginate_button button.active {
                font-weight: bold;
                color: #fff !important;
                background: #3a3189;
            }

        .pagination-box .pagination .paginate_button.previous button {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding: 0px !important;
            padding-left: 15px !important;
            background: url(/Images/web-images/pagination-prev.png) no-repeat center left;
            display: inline-block;
        }

        .pagination-box .pagination .paginate_button.next button {
            border: 0;
            background: none;
            border-radius: 0;
            width: auto;
            height: 30px;
            text-align: left;
            font-size: 16px;
            color: #111;
            font-weight: 600;
            padding: 0px !important;
            padding-right: 15px !important;
            background: url(/Images/web-images/pagination-next.png) no-repeat center right;
            display: inline-block;
        }

    .pagination-box .pagination > li > a, .pagination-box .pagination > li > span {
        margin-left: 0;
    }

.multiselect-wrapper .multiselect-list .multiselect-checkbox {
    display: inline-block !important;
}

.btn-control-box {
    width: auto;
    float: right;
    margin-bottom: 20px;
}

.ui-menu {
    width: 100%;
    max-width: 400px !important;
    float: left;
    padding: 0 !important;
    border: 1px solid #E8EAEA !important;
}

    .ui-menu .ui-menu-item {
        margin: 0 !important;
        border-bottom: 1px solid #ccc;
        float: left;
        padding: 0 !important;
    }

        .ui-menu .ui-menu-item a {
            padding: 10px !important;
            border: 0 !important;
            border-radius: 0 !important;
            float: left;
        }

.ui-state-hover, .ui-widget-content .ui-state-hover,
.ui-state-focus, .ui-widget-content .ui-state-focus {
    background: #F6F8FA !important;
}

.ui-menu .ui-menu-item .name {
    width: 100%;
    float: left;
    font-weight: 600;
    font-size: 18px;
    margin: 0;
}

.ui-menu .ui-menu-item .autocomplete-type {
    width: 100%;
    float: left;
    font-weight: 600;
    font-size: 16px;
    margin: 0;
}

.ui-menu .ui-menu-item .autocomplete-Details {
    width: 100%;
    float: left;
    font-weight: 400;
    font-size: 15px;
    margin: 0;
}

.dealerflow-bg {
    background: #f6f8fa;
}

.vehicle-photo-block {
    width: 100%;
    margin: 0 auto;
    height: 100vh;
    position: relative;
}

    .vehicle-photo-block .logo-div {
        width: 100%;
        float: left;
        background: #fff;
        padding: 10px;
        height: 80px;
        line-height: 60px;
        text-align: center;
        box-shadow: 0 3px 6px rgba(0,0,0,0.1)
    }

        .vehicle-photo-block .logo-div img {
            max-height: 60px;
            max-width: 400px;
        }

    .vehicle-photo-block .mid-body {
        width: 100%;
        margin: 0 auto;
    }

    .vehicle-photo-block .vp-steps {
        width: 100%;
        float: left;
        padding: 8px 7px 70px;
        position: relative;
        min-height: 500px;
        height: calc(100vh - 80px);
        overflow: auto;
    }

        .vehicle-photo-block .vp-steps .no-data {
            font-size: 16px;
        }
        /*.vehicle-photo-block .vp-steps .mid-body-controls{position:absolute; bottom:20px; left:15px; right:15px;}*/
        .vehicle-photo-block .vp-steps .mid-body-controls-not-fix {
            bottom: 10px;
            left: 15px;
            right: 15px;
            text-align: center
        }

        .vehicle-photo-block .vp-steps .mid-body-controls {
            position: fixed;
            bottom: 10px;
            left: 15px;
            right: 15px;
            z-index: 100;
            text-align: center
        }

            .vehicle-photo-block .vp-steps .mid-body-controls .orange-btn {
                display: inline-block;
                background: #E29907;
                min-width: 240px;
                border-radius: 6px;
                height: 40px;
                text-align: center;
                cursor: pointer;
                color: #fff !important;
                font-size: 18px;
                border: 0;
                font-weight: 500;
                line-height: 40px;
                padding: 0 25px;
                box-shadow: 0px 3px 3px rgba(0,0,0,0.4);
            }

    .vehicle-photo-block .shrink-block {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto;
        display: table;
    }

    .vehicle-photo-block .vp-steps .stickyContainer {
        position: fixed;
        bottom: 60px;
        left: 15px;
        right: 15px;
        z-index: 100;
    }

    .vehicle-photo-block .vp-steps h2 {
        width: 100%;
        float: left;
        text-align: center;
        font-size: 24px;
        font-weight: 700;
        color: #222;
        margin-bottom: 10px;
    }

        .vehicle-photo-block .vp-steps h2.wauto {
            width: auto;
            margin: 0 2px 2px;
            float: none;
            display: inline-block;
        }

        .vehicle-photo-block .vp-steps h2 img {
            height: 40px;
            width: 40px;
            vertical-align: text-top;
        }

    .vehicle-photo-block .vp-steps h3 {
        width: 100%;
        float: left;
        font-size: 18px;
        font-weight: 700;
        color: #222;
        margin-bottom: 10px;
    }

    .vehicle-photo-block .vp-steps ul {
        width: 100%;
        float: left;
        margin: 0;
        padding: 0 0 0 15px;
    }

        .vehicle-photo-block .vp-steps ul li {
            width: 100%;
            float: left;
            padding: 0;
            font-size: 18px;
            font-weight: 400;
            color: #202020;
            margin-bottom: 15px;
        }

        .vehicle-photo-block .vp-steps ul.small { /*text-align:center;*/
        }

            .vehicle-photo-block .vp-steps ul.small li {
                font-size: 18px;
                color: #111;
                margin-bottom: 7px;
                float: none; /*width:auto;*/
                margin-right: 30px;
                display: inline-block;
                background: url(/Images/web-images/black-dot.png) no-repeat top 9px left;
                background-size: 10px 10px;
                padding-left: 20px;
            }

        .vehicle-photo-block .vp-steps ul.white-box-list {
            width: 100%;
            float: left;
            overflow: hidden;
            margin: 0;
            padding: 0;
            list-style: none;
        }

            .vehicle-photo-block .vp-steps ul.white-box-list label {
                height: auto;
                line-height: 30px;
                margin: 0;
                font-size: 20px;
                font-weight: 400;
            }

            .vehicle-photo-block .vp-steps ul.white-box-list li {
                width: 100%;
                float: left;
                padding: 15px;
                border-radius: 6px;
                background: #fff;
                margin-bottom: 10px;
                box-shadow: 2px 2px 6px rgba(0,0,0,0.1);
                font-size: 16px;
                font-weight: 400;
                color: #202020;
                list-style: none;
            }

                .vehicle-photo-block .vp-steps ul.white-box-list li.lowpad {
                    padding: 10px 5px 5px 6px;
                }

                .vehicle-photo-block .vp-steps ul.white-box-list li:last-child {
                    border-bottom: 0;
                }

    .vehicle-photo-block .vp-steps .capture-photo {
        width: 30px;
        height: 30px;
        border: 0;
        float: right;
        background: url(/Images/web-images/capture-photo.png) no-repeat top left;
    }

    .vehicle-photo-block .vp-steps .camera-box {
        width: 100%;
        float: left;
        text-align: center;
    }

        .vehicle-photo-block .vp-steps .camera-box video, .vehicle-photo-block .vp-steps .camera-box canvas {
            width: 100%; /*height:220px;*/
        }

    .vehicle-photo-block .vp-steps .camera-box-round {
        width: 100%;
        float: left;
        text-align: center;
    }

        .vehicle-photo-block .vp-steps .camera-box-round canvas { /*width:200px; height:200px; border-radius:360px; */
        }

        .vehicle-photo-block .vp-steps .camera-box-round #outer {
            width: 240px;
            height: 240px;
            border-radius: 360px;
            overflow: hidden;
            position: relative;
            margin: 0 auto;
            border: 3px solid #017CB7;
        }

        .vehicle-photo-block .vp-steps .camera-box-round .video { /*position: absolute; left: -35px; top: -35px;  opacity: 1; width:270px; height:270px;*/
        }

    .vehicle-photo-block .vp-steps .camera-button {
        width: 100%;
        float: left;
        font-size: 20px;
        color: red;
        font-weight: 500;
        margin: 10px 0;
    }

    .vehicle-photo-block .vp-steps .photo-list {
        width: 100%;
        float: left;
        border-radius: 5px;
        border: 1px solid #EAEAEA;
        background: #fff;
        padding: 5px;
        margin-bottom: 10px;
        height: auto;
        overflow: auto;
    }

    .vehicle-photo-block .vp-steps .photo-item {
        width: 100px;
        margin: 3px auto 3px;
        display: inline-block;
        text-align: center;
        border-radius: 5px;
        overflow: hidden;
        height: 75px;
        position: relative;
        background: #EAEAEA;
        border: 1px solid #3a3189;
    }

        .vehicle-photo-block .vp-steps .photo-item .photo-delete {
            position: absolute;
            top: 5px;
            right: 5px;
            background: url(../Images/web-images/dismissIco-white.png) no-repeat top left;
            width: 10px;
            height: 10px;
            border: 0;
            font-size: 15px;
            color: #111;
        }

        .vehicle-photo-block .vp-steps .photo-item.height-auto {
            height: auto;
        }

        .vehicle-photo-block .vp-steps .photo-item .photo {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%
        }

        .vehicle-photo-block .vp-steps .photo-item .plus {
            border: none;
            background: url(/images/web-images/blue-plus.png) no-repeat top left;
            background-size: cover;
            width: 15px;
            height: 15px;
            margin-top: 12px;
        }

        .vehicle-photo-block .vp-steps .photo-item .photo-name {
            position: absolute;
            bottom: 5px;
            text-align: left;
            left: 5px;
            right: 5px;
            font-size: 13px;
            color: #3a3189;
            text-align: center;
            font-weight: 700;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .vehicle-photo-block .vp-steps .photo-item.added .photo-name {
            color: #fff;
            z-index: 10;
        }

        .vehicle-photo-block .vp-steps .photo-item.added .overlay {
            width: 100%;
            height: 100%;
            z-index: 8;
            position: absolute;
            top: 0;
            right: 0;
            left: 0;
            bottom: 0;
            background: rgba(0,0,0,0.2);
        }

    .vehicle-photo-block .vp-steps .photo-item-blank {
        float: left;
        width: calc(100% - 6px);
        position: relative;
        height: 80px;
        margin: 3px;
        cursor: pointer;
    }

        .vehicle-photo-block .vp-steps .photo-item-blank .type-of-vehicle {
            position: absolute;
            width: 50px;
            height: 50px;
            top: 15px;
            left: 0;
            z-index: 10;
            border: 3px solid #fff;
            border-radius: 360px;
            background: #017cb7;
            overflow: hidden;
        }

            .vehicle-photo-block .vp-steps .photo-item-blank .type-of-vehicle img {
                width: 44px;
                height: 44px;
                opacity: 0.4;
            }

        .vehicle-photo-block .vp-steps .photo-item-blank .block {
            float: right;
            width: calc(100% - 20px);
            background: #eaeaea;
            height: 40px;
            border-radius: 15px;
            line-height: 40px;
            margin-top: 20px;
            color: #017cb7;
            padding-left: 35px;
            border: 0;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 13px;
            font-weight: 700;
        }

    .vehicle-photo-block .vp-steps .camera-shoot {
        width: 100%;
        float: left;
        margin: 10px 0;
        text-align: center;
    }

        .vehicle-photo-block .vp-steps .camera-shoot .take-photo {
            width: auto;
            cursor: pointer;
            min-width: 60px;
            font-size: 18px;
            color: #202020;
            font-weight: 600;
            background: url(/Images/web-images/take-photo-ico.png) no-repeat top center;
            padding-top: 52px;
            border: 0;
            background-size: 50px 50px;
        }

    .vehicle-photo-block .vp-steps .number-list {
        width: 100%;
        max-width: 800px;
        margin: 0 auto;
        padding: 0 0 0 20px;
        display: inline-block;
        float: none;
    }

        .vehicle-photo-block .vp-steps .number-list li {
            width: 100%;
            float: left;
            margin: 0;
            text-align: left;
            font-size: 24px;
            line-height: 30px;
            color: #111;
            background: #fff;
            margin-bottom: 20px;
            padding: 20px 20px 20px 40px;
            border: 2px solid #00294A;
            border-radius: 6px;
            counter-increment: listStyle;
            list-style: none;
            position: relative;
        }

            .vehicle-photo-block .vp-steps .number-list li:before {
                width: 40px;
                height: 40px;
                position: absolute;
                z-index: 10;
                top: 50%;
                left: -20px;
                border-radius: 360px;
                border: 2px solid #00294A;
                background: #fff;
                margin-top: -20px;
                text-align: center;
                color: #168cdd;
                content: counter(listStyle, decimal);
                line-height: 36px;
                font-size: 20px;
                font-weight: 600;
            }
            /*.vehicle-photo-block .vp-steps .number-list li:after{width:2px; height:100%; content:""; position:absolute; z-index:9; top:0; left:14px; bottom:0; background:#017CB7; }*/
            .vehicle-photo-block .vp-steps .number-list li:last-child:after {
                display: none;
            }

.complition-box {
    width: 100%;
    float: left;
    position: relative;
    height: 2px;
    background: #ccc;
    margin-bottom: 30px;
    margin-top: 20px;
}

    .complition-box span {
        width: 50px;
        height: 50px;
        z-index: 999;
        position: absolute;
        top: -25px;
        border-radius: 360px;
        border: 1px solid #017CB7;
        color: #017CB7;
        background: #fff;
        text-align: center;
        line-height: 48px;
        font-size: 18px;
        font-weight: 500;
    }

        .complition-box span:first-child {
            left: 0;
        }

        .complition-box span:nth-child(2) {
            left: 50%;
            margin-left: -25px;
        }

        .complition-box span:last-child {
            right: 0;
        }

        .complition-box span.completed {
            background: #017CB7 url(/images/web-images/white-tick-big.png) no-repeat center center;
        }

.vehicle-photo-block .blue-bor-box {
    background: #fff;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    border-radius: 6px;
    border: 2px solid #168CDD;
    padding: 5px 10px;
}

    .vehicle-photo-block .blue-bor-box h3 {
        margin: 0;
    }

.vehicle-detail-block {
    width: 100%;
    float: left;
}

    .vehicle-detail-block p {
        width: 100%;
        float: left;
        text-align: center;
        font-size: 20px;
        color: #111;
        font-weight: 400;
    }

    .vehicle-detail-block .vehicle-image {
        width: 100%;
        text-align: center;
        margin: 15px auto;
        display: inline-block;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 0 6px rgba(0,0,0,0.3);
        padding: 10px;
    }

        .vehicle-detail-block .vehicle-image img {
            max-width: 100%;
        }

.footer-sticky-block {
    width: 100%;
    position: fixed;
    z-index: 99;
    background: #fff;
    padding: 10px;
    height: 72px;
    bottom: 0;
    left: 0;
    right: 0;
    line-height: 60px;
    text-align: center;
    box-shadow: 0 0 9px rgba(0,0,0,0.3);
}

    .footer-sticky-block .powered {
        width: 100%;
        text-align: right;
        position: fixed;
        bottom: 0;
        right: 5px;
        z-index: 1;
        height: 45px;
        line-height: 45px;
        margin: 2px 0;
        font-size: 7px;
        font-weight: 700;
        color: #202020;
    }

        .footer-sticky-block .powered img {
            vertical-align: top;
            max-height: 25px;
        }

.vehicle-history-pop {
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    float: left;
    margin-bottom: 20px;
    max-height: 80vh;
    overflow-x: hidden;
    overflow-y: scroll;
}

.vehicle-history-pop-noscroll {
    max-height: 100% !important;
    overflow-y: auto !important
}

.vehicle-history-pop h3 {
    width: 100%;
    float: left;
    color: #111111;
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 15px 0;
    line-height: 30px;
}

.vehicle-history-pop .input-box [type="checkbox"] + label {
    font-weight: 500;
    color: #017CB7;
    font-size: 15px;
    margin-bottom: 10px;
}

.vehicle-history-pop .disclosure-items label {
    display: inline !important
}

.vehicle-history-pop .details-card {
    width: 100%;
    float: left;
    border: 1px solid #017CB7;
    border-radius: 5px;
    background: #F6F8FA;
    padding: 10px;
}

    .vehicle-history-pop .details-card ul li {
        font-size: 16px;
    }

.vehicle-history-pop .vehicle-image {
    width: auto;
    overflow: hidden;
    max-width: 100%;
    float: left;
    border: 1px solid #017CB7;
    border-radius: 5px;
    text-align: center;
}

    .vehicle-history-pop .vehicle-image img {
        max-width: 120px;
        max-height:155px;
    }

.third-party-logo-box {
    padding: 0 0 10px 0;
    text-align: center;
    max-width: 250px;
}

    .third-party-logo-box .logo-box {
        padding: 15px;
        width: 100%;
        max-width: 250px;
        text-align: center;
        line-height: 60px;
        background: #F2F2F2;
        border-radius: 10px 10px 0 0;
        margin-bottom: 10px;
    }

        .third-party-logo-box .logo-box.on {
            border: 1px solid #48D600;
        }

        .third-party-logo-box .logo-box.off {
            border: 1px solid #C60404;
        }

        .third-party-logo-box .logo-box img {
            width: 100%;
            max-width: 250px;
        }

        .third-party-logo-box .logo-box .logo-name {
            font-size: 18px;
            font-weight: 600;
            line-height: 30px;
            min-width: 218px;
        }

.third-party-control-box {
    padding: 0;
    float: left;
    width: 100%;
    width: 280px;
}

    .third-party-control-box ul {
        width: 100%;
        float: left;
        margin: 0;
        padding: 0;
    }

        .third-party-control-box ul li {
            width: 100%;
            float: left;
            list-style: none;
            border-bottom: 1px solid #F2F2F2;
            padding: 10px;
        }

            .third-party-control-box ul li:last-child {
                border-bottom: 0;
            }

            .third-party-control-box ul li .label-text {
                width: calc(100% - 80px);
                float: left;
                font-size: 16px;
                font-weight: 500;
            }

.autocomplete-wrapper {
    width: 100%;
    float: left;
    position: relative;
}

    .autocomplete-wrapper .autocomplete-list {
        width: 100%;
        float: left;
        max-height: 400px;
        overflow: auto;
    }

        .autocomplete-wrapper .autocomplete-list ul {
            width: 100%;
            z-index: 999;
            max-height: 330px;
            overflow-x: auto;
            margin-top: 0;
        }

.ui-autocomplete {
    max-height: 500px !important;
    overflow-y: auto !important;
    /* prevent horizontal scrollbar */
    overflow-x: hidden !important;
    /* add padding to account for vertical scrollbar */
    padding-right: 5px !important;
}

.upload-clt {
    width: 100%;
    float: left;
}

    .upload-clt .gallery {
        width: 100%;
        float: left;
        margin-top: 10px;
    }

        .upload-clt .gallery .apnd-img {
            width: 80px;
            height: 80px;
            float: left;
            margin: 0 5px 5px 0;
            position: relative;
        }

            .upload-clt .gallery .apnd-img i {
                position: absolute;
                top: 5px;
                width: 18px;
                height: 18px;
                border-radius: 360px !important;
                right: 5px;
                z-index: 99;
                background: #fff;
                border-radius: 3px;
                padding: 3px;
                font-size: 13px;
                text-align: center;
                font-weight: 400;
            }

            .upload-clt .gallery .apnd-img img {
                width: 100%;
                height: 100%;
            }

.photo-item {
    width: 100%;
    max-width: 150px;
    float: left;
    position: relative;
}

    .photo-item .closeBtn {
        position: absolute;
        top: 3px;
        right: 3px;
        z-index: 99;
    }

    .photo-item .imgPhoto {
        width: 100%;
        max-width: 150px;
    }

.upload-crop-clt {
    width: 100%;
    float: left;
}

    .upload-crop-clt .img-container {
        width: 100%;
        float: left;
    }

        .upload-crop-clt .img-container .cropper-container {
            height: 400px !important;
            float: left;
        }

            .upload-crop-clt .img-container .cropper-container .cropper-canvas,
            .upload-crop-clt .img-container .cropper-container .cropper-crop-box {
                top: 0 !important;
                left: 0 !important;
            }

    .upload-crop-clt .preview {
        max-width: 200px !important;
        max-height: 200px !important;
        border: 1px solid #ccc;
    }

        .upload-crop-clt .preview img {
            max-width: 200px !important;
            max-height: 200px !important;
        }

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

#custom-scroll::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    background-color: #F5F5F5;
}

#custom-scroll::-webkit-scrollbar-thumb:horizontal:hover,
#custom-scroll::-webkit-scrollbar-thumb:vertical:hover {
    background: #999;
}

#custom-scroll::-webkit-scrollbar-thumb:horizontal:active,
#custom-scroll::-webkit-scrollbar-thumb:vertical:active {
    background: #777;
}

#custom-scroll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #258dbf;
}

.select2-search__field {
    width: 100% !important
}

.select2-search__field {
    width: 100% !important
}

.sb-dealerType .switch-label {
    background: rgba(0,0,0,.7) !important;
}

.sb-dealerType .switch-left-right .switch-input ~ .switch-label {
    background: #017CB7 !important;
}

.sb-dealerType .switch-left-right .switch-input:checked ~ .switch-label {
    background: #017CB7 !important;
}




.ali3-loader-pic img {
    max-width: 100px;
}

.ali3-disclosure-pic img {
    max-width: 130px;
}

.sampleImgSec {
    width: 100%;
    float: left;
    height: 50px;
    margin-bottom: 10px;
}

    .sampleImgSec img {
        max-height: 50px;
        max-width: 80px;
    }

#boxscroll {
    height: 100% !important;
    width: 100% !important;
    overflow: auto;
}

::-webkit-scrollbar {
    width: 12px;
}

/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 6px;
    border-radius: 12px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 12px;
    border-radius: 12px;
    background: rgba(9,45,73,1);
    -webkit-box-shadow: inset 0 0 12px rgba(0,0,0,0.5);
}

    ::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(9,45,73,0.4);
    }


.purpule::-webkit-scrollbar {
    width: 12px;
}

/* Track */
.purpule::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 12px rgba(0,0,0,0.3);
    -webkit-border-radius: 12px;
    border-radius: 12px;
}

/* Handle */
.purpule::-webkit-scrollbar-thumb {
    -webkit-border-radius: 12px;
    border-radius: 12px;
    background: rgba(58,49,137,1);
    -webkit-box-shadow: inset 0 0 12px rgba(0,0,0,0.5);
}

    .purpule::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(58,49,137,0.4);
    }

.ImgDivList .imgView_slider_thum {
    width: 100% !important;
    height: 100% !important;
    max-width: 80px !important;
    max-height: 80px !important;
}

.imageDiv .imageModelVehicle {
    width: 100% !important;
    height: 100% !important;
    max-width: 80px !important;
    max-height: 80px !important;
}


.light-green div {
    background-color: #B2FF99 !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-green td {
    background-color: #B2FF99 !important;
    color: #000 !important;
}

.light-yellow div {
    background-color: #FFE699 !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-yellow td {
    background-color: #FFE699 !important;
    color: #000 !important;
}

.light-orange div {
    background-color: #F8AE86 !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-orange td {
    background-color: #F8AE86 !important;
    color: #000 !important;
}

.light-pink div {
    background-color: #FF99B2 !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-pink td {
    background-color: #FF99B2 !important;
    color: #000 !important;
}

.light-blue {
    background-color: #61a4ca !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-sky-blue {
    background-color: #99FFE5 !important;
    color: #000 !important;
}

.light-purple {
    background-color: #99B2FF !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-purple-col {
    background-color: #99B2FF !important;
    color: #000 !important;
}

.light-baby-pink {
    background-color: #E599FF !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.light-baby-pink-col {
    background-color: #E599FF !important;
    color: #000 !important;
}

.dark-sky-blue div {
    background-color: #48D6DB !important;
    color: #000 !important;
    border-radius: 5px;
    padding: 5px;
    margin: 2px;
}

.royal-blue {
    color: #0063d1 !important;
}

.bs-example {
    width: 100%;
    float: left;
}

    .bs-example .panel {
        width: 100%;
        float: left;
        border: 1px solid #ccc;
        background: #fff;
        margin-bottom: 10px;
        border-radius: 5px;
        overflow: hidden;
    }

        .bs-example .panel .panel-heading {
            background: #00294A;
            padding: 5px 10px;
            cursor: pointer;
        }

            .bs-example .panel .panel-heading h3 {
                margin: 0;
            }

                .bs-example .panel .panel-heading h3 a {
                    color: #fff;
                    font-size: 20px;
                    line-height: 30px;
                    vertical-align: top;
                    text-transform: capitalize;
                }

        .bs-example .panel .panel-body {
            padding: 10px;
        }

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

    .search-result-list li {
        width: 100%;
        float: left;
        margin: 0 0 20px 0;
        background: #fff;
        border: 1px solid #F2F2F2;
        border-radius: 10px;
        padding: 10px;
        font-size: 16px;
        color: #111;
        line-height: 28px;
        box-shadow: 0 0 5px rgba(0,0,0,0.1)
    }

        .search-result-list li .search-details {
            width: calc(100% - 140px);
            float: left;
        }

        .search-result-list li .btn-control {
            width: 130px;
            float: right;
            margin-top: 40px;
        }

            .search-result-list li .btn-control .blue-btn-small {
                width: 120px;
                display: inline-block;
                padding: 0 10px;
                text-align: center;
                border-radius: 15px;
            }

.SumoSelect > .optWrapper.multiple > .MultiControls > p.btnOk {
    font-weight: bold;
    color: #7799d0;
}

.dis-None {
    color: black !important;
}

.navbar {
    z-index: 2;
}

.close-navbar-toggler {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    cursor: pointer;
}

    .close-navbar-toggler.collapsed {
        z-index: -1;
    }

.modal-header {
    justify-content: flex-start !important;
}

.signed-on-text-font {
    font-size: 4px;
    text-transform: uppercase;
}


.blink-green-btn {
    display: inline-block;
    background-color: #1c87c9;
    min-width: 240px;
    height: 40px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    border: 0;
    font-weight: 500;
    line-height: 40px;
    padding: 0 25px;
    cursor: pointer;
    border-radius: 6px;
    border: none;
    text-decoration: none;
    -webkit-border-radius: 6px;
}

.blink-green-btn {
    animation: glowing-green 1300ms infinite;
}

@keyframes glowing-green {
    0% {
        background-color: #2ba805;
        box-shadow: 0 0 5px #2ba805;
    }

    50% {
        background-color: #49e819;
        box-shadow: 0 0 20px #49e819;
    }

    100% {
        background-color: #2ba805;
        box-shadow: 0 0 5px #2ba805;
    }
}

.blink-sign {
    animation: glowing-sign 1300ms infinite;
}

@keyframes glowing-sign {
    /*0% {
        background-color: #2ba805;
        box-shadow: 0 0 5px #2ba805;
    }*/

    50% {
        background-color: red;
        box-shadow: 0 0 20px red;
    }
    /*100% {
        background-color: #2ba805;
        box-shadow: 0 0 5px #2ba805;
    }*/
}


.help-tip {
    position: relative;
    text-align: center;
    color: #017CB7;
    border-radius: 50%;
    font-size: 20px;
    cursor: default; /*width: 24px;height: 24px;font-size: 14px;line-height: 26px;background-color: #017CB7; top: 12px; right: 18px;*/
}

    .help-tip:before {
        font-weight: bold;
        color: #fff;
    }

    .help-tip:hover span {
        display: block;
        transform-origin: 100% 0%;
        -webkit-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;
    }

    .help-tip span {
        display: none;
        position: absolute;
        background-color: #017CB7;
        padding: 10px;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        color: #fff;
        border-radius: 3px;
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        font-size: 14px;
        line-height: 1.4;
        z-index: 200;
        text-align: left;
        width: 200px;
    }

    .help-tip .auto {
        left: auto !important;
        transform: none;
    }

    .help-tip .help-transform {
        transform: translateX(-90%) !important;
    }

    .help-tip p:before {
        position: absolute;
        width: 0;
        height: 0;
        border: 6px solid transparent;
        border-bottom-color: #017CB7;
        right: 10px;
        top: -12px;
    }

    .help-tip span:after {
        width: 100%;
        height: 40px;
        position: absolute;
        top: -40px;
        left: 0;
    }

.deal-Log-Panel .pagination {
    float: right !important;
    width: auto !important;
}

.btn-autoRevU {
    max-height: 50px;
}

.btn-share {
    max-width: 80px
}

.shareOn {
    padding-top: 12px;
    font-size: 18px;
}

.trail-Icon {
    height: 100px;
}

.trail .padd10 {
    padding: 10px;
}

.trial-menu .trail-Icon {
    height: 50px !important;
}

.trail-text {
    font-size: large
}

.trial-menu .trail-text {
    font-size: medium;
    color: white !important;
}

.header-logo {
    height: 85px;
}

.RegisterSection-new #RegisterForm .btn {
    background: #017CB7;
    float: none;
    margin: 20px 0px 15px 0px;
    border: none;
    height: 38px;
    font-size: 18px;
    font-family: latosemibold;
    color: #fff;
    text-align: center;
}

.RegisterSection-new .field-box .checkbox input[type="checkbox"]:checked + input[type="hidden"] + label::before {
    background: none;
    top: 4px;
}

.RegisterSection-new .field-box .checkbox input[type="checkbox"]:checked + input[type="hidden"] + label::after, .field-box .checkbox input[type="radio"]:checked + input[type="hidden"] + label::after {
    font-family: "FontAwesome";
    content: "\f00c";
    top: 4px;
}


.tour {
    background: #fff !important;
    margin-top: 10px !important;
    z-index: 2247483646 !important;
    border-radius: 3px !important;
    width: 350px !important;
    max-width: 350px !important;
    padding: 5px !important;
    font-size: 1rem !important
}

    .tour .arrow {
        display: block !important;
    }

    .tour .popover-content {
        width: 100% !important;
        border: 0px !important;
        box-shadow: none !important;
        padding: 5px !important;
        text-align: left !important;
        color: #2F318D !important;
    }

    .tour .popover-title {
        float: right;
        padding: 0px !important;
        color: #2F318D !important
    }

    .tour .popover-navigation {
        padding: 0px 24px !important;
        text-align: center !important;
    }

        .tour .popover-navigation button {
            float: none !important
        }

        .tour .popover-navigation div {
            padding: 5px !important;
            color: #2F318D !important;
        }

    .tour .btn {
        border-color: #ccc !important;
        color: #2F318D !important
    }

    .tour .check-sign {
        width: 30px;
        height: 30px;
        border: 0;
        background: url(/Images/web-images/capture-photo.png) no-repeat top left;
    }

.sign-tick {
    width: 20px !important;
    height: 20px !important;
    margin-left: 2px;
}


.front-camera-box video {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

.btn-tour {
    text-decoration: underline !important;
    font-weight: lighter;
}

.btn-link-decor-underline {
    text-decoration: underline !important;
    font-weight: 600;
}

.alert {
    min-height: 70px;
}

div.dt-buttons {
    position: absolute;
    top: 0;
    right: 0;
}

.display-None {
    display: none;
}

.tooltip-inner {
    text-align: left !important;
    background-color: #017CB7 !important;
    font-size: 14px !important;
}

.multiselect__tag {
    white-space: normal !important;
}

.vehicle-photo-pop {
    max-height: none !important;
    overflow-x: hidden;
    overflow-y: auto !important;
}

.vehicle-photo-capture-block {
    height: auto !important;
}

    .vehicle-photo-capture-block .photo-list {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .vehicle-photo-capture-block .vp-steps {
        padding-left: 0px !important;
        padding-right: 0px !important;
        padding-top: 0px !important;
        padding-bottom: 40px !important;
    }

.photo-popup .modal-dialog {
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    width: 100% !important;
}

.upload-button-while-full {
    background: #fff !important;
    padding-top: 10px !important;
}

.photo-popup .modal-body {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.face-overlay {
    position: absolute;
    top: 4%; /* Adjust to position the face correctly */
    left: 30%; /* Adjust to position the face correctly */
    width: 140px; /* Adjust the size of the face image */
    height: auto;
    z-index: 10; /* Ensure the face is on top of the video */
}

.sigNav a,
.sigNav a:link,
.sigNav a:visited {
    padding: 0px !important;
}

.froadCam-action {
    min-height: 30px;
}

.reset-camera-button {
    position: absolute;
    top: 5px; /* Adjust the position as needed */
    left: 32%; /* Adjust the position as needed */
    /*padding: 10px 20px;*/
    background-color: #017CB7; /* Button color */
    color: #fff; /* Text color */
    border: none;
    border-radius: 5px; /* Rounded corners */
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.vehicle-camera-button {
    position: absolute;
    /*top: 5px;*/ /* Adjust the position as needed */
    bottom: 0px;
    right: 5px; /* Adjust the position as needed */
    /*padding: 10px 20px;*/
    /*background-color: #017CB7;*/ /* Button color */
    color: #fff; /* Text color */
    border: none;
    border-radius: 5px; /* Rounded corners */
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.vehicle-sample-section {
    position: absolute;
    /*top: 5px;*/ /* Adjust the position as needed */
    right: 5px; /* Adjust the position as needed */
    /*padding: 10px 20px;*/
    /*background-color: #017CB7;*/ /* Button color */
    color: #fff; /* Text color */
    border: none;
    border-radius: 5px; /* Rounded corners */
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

/*.reset-camera-button:hover {
        background-color: #e63e3e;
        transform: scale(1.05);
    }

    .reset-camera-button:active {
        background-color: #cc3636;
        transform: scale(0.95);
    }*/

.need-help {
    /*top: 10px;*/ /* Adjust the position as needed */
    /*right: 10px;*/ /* Adjust the position as needed */
    /*padding: 10px 20px;*/
    background-color: #017CB7; /* Button color */
    color: #fff; /* Text color */
    border: none;
    border-radius: 5px; /* Rounded corners */
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.disclosure-items .txt-area {
    margin: 5px;
}

.vehicle-photo-block .progress {
    background-color: #017CB7;
    color: #000;
}

.vehicle-camera-button .number-input__input {
    background-color: transparent !important;
}

.vehicle-camera-button .number-input__button {
    background-color: transparent !important;
}

.version-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    text-align: center;
    /*background-color: #333;*/
    /*color: white;*/
    padding: 10px;
    font-size: 6px; /* Extra small font size */
}

.logo-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    text-align: center;
    /*background-color: #333;*/
    /*color: white;*/
    padding: 10px;
    font-size: 6px; /* Extra small font size */
}

    .logo-footer img {
        max-width: 75px;
        position: fixed;
        bottom: 5px;
        border: solid 1px lightgray;
    }

.signature-pending {
    background-color: #fff3cd; /* light yellow */
    color: #856404; /* dark yellow/brown for contrast */
    padding: 2px 12px;
    border: 1px solid #ffeeba;
    border-radius: 4px;
    font-weight: 500;
    /*font-style: italic;*/
    display: block;
}

.message-box {
    font-size: 1rem;
    padding: 20px 30px;
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    transition: all 0.5s ease-in-out;
    /*background: linear-gradient(to right, #667eea, #764ba2);*/
    color: white;
    /*font-family: 'Segoe UI', sans-serif;*/
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 50px;
}

.message {
    animation: fade 1s ease-in-out;
}

.flip-hide {
    transform: rotateY(90deg);
    opacity: 0;
    transition: transform 0.5s ease, opacity 0.5s ease;
}

.flip-show {
    transform: rotateY(0deg);
    opacity: 1;
    transition: transform 0.5s ease, opacity 0.5s ease;
}

.LeadSourceSec {
    width: 100%;
    float: left;
    border-radius: 10px;
    text-align: left;
    margin-bottom: 30px;
    border: 1px solid #F2F2F2;
    background: #fff;
    padding: 20px 10px;
    font-size: 24px;
    color: #111;
    font-weight: 600;
    font-size: 16px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}
.LeadSource-Sec-yScroll {
    max-height: 350px;
    overflow-y: scroll;
}
.two-column-list {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
}

    .two-column-list li {
        width: 49% !important;
        box-sizing: border-box;
        padding: 5px !important;
        margin: 1px;
    }

.two-column-container {
    display: flex;
    gap: 5px; /* optional spacing between columns */
}

.price-label {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    float: left;
    margin-right: 15px;
    color: #202020;
}

.price-value {
    font-size: 16px;
    line-height: 22px;
    float: left;
    margin-right: 15px;
}

.price-textbox {
    border: 2px solid #d1d5db; /* light gray */
    padding: 8px 12px;
    border-radius: 8px;
    transition: all 0.25s ease-in-out;
    width: 100%;
    font-size: 15px;
    background-position: 98% center;
    background-repeat: no-repeat;
}

    .price-textbox:focus {
        border-color: #d1d1d1; /* same light grey */
        outline: none !important;
        box-shadow: none;
    }

.price-input-container {
    position: relative;
    display: inline-block;
    width: 140px; /* adjust based on your design */
}

    .price-input-container .currency-sign {
        position: absolute;
        left: 3px;
        top: 4px;
        min-width: 10px;
        float: left;
    }

    .price-input-container input {
        width: 142px;
        padding-left: 10px;
        border: 1px solid #c6c6c6;
        border-radius: 6px;
    }

.currency-input-container .currency-sign {
    position: absolute;
    left: 20px;
    top: 44px;
    font-size: 16px;
    font-weight: 500;
}

.currency-input-container input {
    padding-left: 20px !important;
}

.price-textbox-dashboard {
    width: 100%;
    padding-right: 40px; /* space for the button inside */
    padding-left: 10px;
    height: 44px;
}

.inside-icon {
    width: 30px;
    height: 30px;
}

.inside-btn {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    z-index: 10; /* ← IMPORTANT */
}

.date-picker img {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    z-index: 10; /* ← IMPORTANT */
}
/* Red State (Invalid) */
.price-error {
    border-color: #e63946 !important;
    /*background-color: #ffe8e8 !important;*/
    box-shadow: 0 0 6px rgba(230, 57, 70, 0.4);
    /*background-image: url('data:image/svg+xml;utf8,<svg fill="red" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11 15h2v2h-2zm0-8h2v6h-2z"/></svg>');*/
}

/* Green State (Valid) */
.price-valid {
    border-color: #2A9D8F !important;
    /*background-color: #e7ffe7 !important;*/
    box-shadow: 0 0 6px rgba(45, 106, 79, 0.4);
    /*background-image: url('data:image/svg+xml;utf8,<svg fill="green" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.2l-3.5-3.5-1.4 1.4L9 19 20 8l-1.4-1.4z"/></svg>');*/
}


/* Red blinking effect */
.blink-red {
    animation: blinkRed 0.6s infinite;
    border-width: 3px !important;
    box-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
}

@keyframes blinkRed {
    0% {
        border-color: #b30000;
        box-shadow: 0 0 12px rgba(255, 0, 0, 0.7);
    }

    50% {
        border-color: #ff1b1b;
        box-shadow: 0 0 4px rgba(255, 70, 70, 0.3);
    }

    100% {
        border-color: #b30000;
        box-shadow: 0 0 12px rgba(255, 0, 0, 0.7);
    }
}

/* Error text */
.price-error-text {
    color: #e63946;
    font-size: 15px;
    margin-top: 4px;
    font-weight: 700;
}

.price-error-text-small {
    color: #e63946;
    font-size: 11px;
    margin-top: 4px;
    font-weight: 700;
    line-height: 15px;
}

.price-valid-text {
    color: #2A9D8F;
    font-size: 15px;
    margin-top: 4px;
    font-weight: 700;
}

.price-valid-text-small {
    color: #2A9D8F;
    font-size: 11px;
    margin-top: 4px;
    font-weight: 700;
    line-height: 15px;
}


/* Dropdown container */
.dealdetail .dropdown-menu {
    width: 900px; /* desktop */
    max-width: calc(100vw - 20px); /* 🔥 prevent viewport overflow */
    padding: 15px;
    max-height: 450px;
    overflow-y: auto;
    /* 🔥 REMOVE manual positioning */
    left: auto !important;
    right: auto !important;
    background-color: #e7f1ff;
    border-radius: 6px;
    padding: 10px;
}

/* Grid layout */
.dealdetail .dropdown-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

/* 🔥 CRITICAL: fix grid + anchor overflow */
.dropdown-grid > .dropdown-item {
    width: auto;
    min-width: 0;
}

/* Allow text wrapping */
.dealdetail .dropdown-menu .dropdown-item {
    white-space: normal;
    position: relative;
    padding-left: 38px;
}

    .dealdetail .dropdown-menu .dropdown-item::before {
        content: "";
        position: absolute;
        left: 12px;
        top: 8px; /* aligns icon to first line */
        width: 16px;
        height: 16px;
        background-color: #0d6efd;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a1 1 0 0 1 1 1v8.59l2.3-2.3a1 1 0 1 1 1.4 1.42l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 1 1 1.4-1.42l2.3 2.3V4a1 1 0 0 1 1-1Zm-7 14a1 1 0 0 1 1-1h12a1 1 0 1 1 0 2H6a1 1 0 0 1-1-1Z'/%3E%3C/svg%3E") no-repeat center;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a1 1 0 0 1 1 1v8.59l2.3-2.3a1 1 0 1 1 1.4 1.42l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 1 1 1.4-1.42l2.3 2.3V4a1 1 0 0 1 1-1Zm-7 14a1 1 0 0 1 1-1h12a1 1 0 1 1 0 2H6a1 1 0 0 1-1-1Z'/%3E%3C/svg%3E") no-repeat center;
    }

/* Tablets */
@media (max-width: 992px) {
    .dealdetail .dropdown-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Phones */
@media (max-width: 768px) {
    .dealdetail .dropdown-menu {
        width: 450vw;
        max-width: 100vw;
        /* 🔥 override Popper transform */
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
    }

    .dealdetail .dropdown-grid {
        grid-template-columns: 1fr;
    }
}

.dealdetailemail .dropdown-menu {
    width: 300px; /* desktop */
    max-width: calc(100vw - 50px);
    padding: 15px;
    max-height: 450px;
    overflow-y: auto;
    /* 🔥 REMOVE manual positioning */
    left: auto !important;
    right: auto !important;
    background-color: #e7f1ff;
    border-radius: 6px;
    padding: 10px;
}
    .dealdetailemail .dropdown-menu .dropdown-item {
        white-space: normal;
        position: relative;
        padding-left: 38px;
    }

        .dealdetailemail .dropdown-menu .dropdown-item::before {
            content: "";
            position: absolute;
            left: 12px;
            top: 8px; /* aligns icon to first line */
            width: 16px;
            height: 16px;
            background-color: #0d6efd; /* Bootstrap primary */

            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm0 2v.01L12 13l8-6.99V6H4Zm16 12V8.24l-7.38 6.46a1 1 0 0 1-1.24 0L4 8.24V18h16Z'/%3E%3C/svg%3E") no-repeat center;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm0 2v.01L12 13l8-6.99V6H4Zm16 12V8.24l-7.38 6.46a1 1 0 0 1-1.24 0L4 8.24V18h16Z'/%3E%3C/svg%3E") no-repeat center;
        }

/* ===== FORCE SAME LOOK: SELECT ALL & CLEAR ALL ===== */
.SumoSelect .optWrapper p.select-all {
    margin: 10px 0px 0px 0px !important;
    padding: 10px 10px 20px 10px !important; /* SAME spacing */
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    font-size: 16px !important; /* SAME font size */
    line-height: 20px !important; /* SAME line height */
    font-weight: 500;
    color: #7799d0 !important; /* SAME blue */
    background: #fff;
    cursor: pointer;
}

/* Remove paragraph quirks */
.SumoSelect .optWrapper p.select-all {
    min-height: auto;
}

    /* Hide checkbox icon (optional but recommended for parity) */
    .SumoSelect .optWrapper p.select-all > span {
        display: none;
    }

#Div_selectDealershipDD .select2-container {
    top: 0 !important;
    left: 0 !important;
}