/*============================== Dashboard Start =============================*/
.department_wise_chart_page {
    padding-bottom: 7px
}

.dprt_wise_div .chart-responsive {
    height: auto !important
}

.dprt_wise_div.second_box {
    box-shadow: 2px 2px 6px rgba(0,0,0,0.9);
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.9);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.9);
    -ms-box-shadow: 2px 2px 6px rgba(0,0,0,0.9);
    -o-box-shadow: 2px 2px 6px rgba(0,0,0,0.9);
    color: #000;
    border-top-color: #1a4d59;
    margin-bottom: 20px
}

    .dprt_wise_div.second_box .small-box {
        background: rgba(0,0,0,0)
    }

        .dprt_wise_div.second_box .small-box > .small-box-footer {
            background: rgba(0,0,0,0.03);
            color: #000;
            box-shadow: 2px 2px 6px rgba(0,0,0,0.7);
            -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.7);
            -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.7);
            -ms-box-shadow: 2px 2px 6px rgba(0,0,0,0.7);
            -o-box-shadow: 2px 2px 6px rgba(0,0,0,0.7);
            text-align: center;
            cursor: default
        }

            .dprt_wise_div.second_box .small-box > .small-box-footer:hover {
                background: rgba(0,0,0,0.05);
                color: #000
            }

    .dprt_wise_div.second_box .box-header {
        color: #444
    }

        .dprt_wise_div.second_box .box-header h3 {
            font-size: 20px
        }

.dprt_wise_div .small-box-size .head_cont {
    margin-top: 12px;
    margin-bottom: 8px;
    font-size: 16px
}

.dprt_wise_div .small-box-size .coCont_div {
    margin-top: 8px;
    margin-bottom: 12px;
    font-size: 16px;
    font-family: Verdana Bold;
    font-weight: normal
}

.dprt_wise_div .progress.sm, .dprt_wise_div .progress-sm {
    height: 4px
}

.dprt_wise_div .progress {
    margin-bottom: 15px
}

.dprt_wise_div .progress-group .progress-text, .dprt_wise_div .progress-group .progress-number {
    font-size: 13px
}

.dprt_wise_div .progress-group .progress-number {
    float: right
}

    .dprt_wise_div .progress-group .progress-text b, .dprt_wise_div .progress-group .progress-number b {
        font-family: Verdana Bold
    }

.dprt_wise_div .chart-responsive .box-content {
    margin-top: 10px
}

.color_sugetion {
    margin-top: 15px !important
}

    .color_sugetion .box_div {
        border: 2px solid #000;
        width: 65px;
        height: 23px;
        float: left;
        margin-right: 5px
    }

    .color_sugetion .box_label {
        float: left;
        line-height: 23px
    }
 
    .color_sugetion .a .box_div {
        border-color: #f16745;
        background-color: rgba(241, 103, 69, 0.7)
    }

    .color_sugetion .b .box_div {
        border-color: #ffc65d;
        background-color: rgba(255, 198, 93, 0.7)
    }

    .color_sugetion .c .box_div {
        border-color: #7bc8a4;
        background-color: rgba(123, 200, 164, 0.7)
    }

    .color_sugetion .d .box_div {
        border-color: #93648d;
        background-color: rgba(147, 100, 141, 0.7)
    }

    .color_sugetion .e .box_div {
        border-color: #4cc3d9;
        background-color: rgba(76, 195, 217, 0.7)
    }

    .color_sugetion .f .box_div {
        border-color: #666;
        background-color: rgba(102, 102, 102, 0.7)
    }

.chart_box {
    background-color: #fff;
    border-left: 1px solid #e9e7f1;
    border-top: 1px solid #e9e7f1;
    margin: 0 0 15px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.3)
}

    .chart_box .head_div {
        color: #444;
        padding: 10px !important;
        font-size: 17px;
        border-bottom: none !important;
        height: 48px
    }

        .chart_box .head_div a {
            color: #444;
            cursor: pointer
        }

    .chart_box .chart_part {
        width: 100%;
        padding: 10px;
        margin-top: 25px;
        position: relative
    }

        .chart_box .chart_part .otherDetail {
            background-color: #fff;
            padding: 5px 10px;
            border-left: 1px solid #e9e7f1;
            border-top: 1px solid #e9e7f1;
            position: absolute;
            right: 10px;
            top: -65px;
            z-index: 1;
            box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
            -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
            -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
            -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
            -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.4)
        }

            .chart_box .chart_part .otherDetail .fild_div {
                margin: 3px 0;
                line-height: 24px;
                font-size: 11px
            }

                .chart_box .chart_part .otherDetail .fild_div span {
                    color: #666
                }

                    .chart_box .chart_part .otherDetail .fild_div span:first-child {
                        font-size: 11px;
                        color: #333;
                        width: 70px;
                        display: inline-block
                    }

                    .chart_box .chart_part .otherDetail .fild_div span:last-child {
                        /*font-family: Verdana;*/
                        font-family: var(--font-body-font);
                        color: #000
                    }

        .chart_box .chart_part .progressCartPart ul {
            list-style: none;
            padding: 0;
            margin-top: -5px
        }

            .chart_box .chart_part .progressCartPart ul li {
            }

        .chart_box .chart_part .progressCartPart span {
            font-family: Verdana Bold;
            font-size: 13px;
            color: #222
        }

        .chart_box .chart_part .progressCartPart .progress {
            height: 2px;
            background-color: #eee;
            margin-bottom: 10px
        }

    .chart_box .chartFooterBar {
        padding: 10px;
        width: 100%;
        border-top: 1px solid #eaeaea;
        display: flow-root;
        position: relative;
    }

        .chart_box .chartFooterBar::before {
            position: absolute;
            content: '';
            left: 0;
            right: 0;
            top: 0;
            margin: auto;
            border-top: 10px solid #fff;
            border-right: 10px solid transparent;
            border-bottom: 10px solid transparent;
            border-left: 10px solid transparent;
            width: 10px;
        }

    .chart_box:hover .chartFooterBar::before {
        border-top: 10px solid #dedeab;
    }

    .chart_box:hover .chartFooterBar {
        background: beige;
    }

    .chart_box .chartFooterBar .twoPart {
        width: 50%;
        border-right: 1px solid #eaeaea;
        padding: 5px;
        text-align: center;
        float: left
    }

        .chart_box .chartFooterBar .twoPart:last-child {
            border-right: none
        }

        .chart_box .chartFooterBar .twoPart .dataDisplayDiv {
            font-size: 17px;
            color: #000;
            font-family: Verdana Bold
        }

        .chart_box .chartFooterBar .twoPart .dataHeadDiv {
            font-size: 13px;
            color: #999
        }

.chart svg text:last-child tspan:after {
    content: '\0025'
}
/*=============================== Dashboard End ==============================*/

/*========================= Rough Purchase Detail List Start =========================*/
.grid_table tbody tr td .sticer_img {
    background: #c8e3f3;
    font-size: 11px;
    border-radius: 3px;
    border: 1px solid #76b1d4;
    box-shadow: 1px 1px 2px rgba(0,0,0,.5);
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.5);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.5);
    -ms-box-shadow: 1px 1px 2px rgba(0,0,0,.5);
    -o-box-shadow: 1px 1px 2px rgba(0,0,0,.5);
    text-align: center;
    padding: 0px 4px 2px !important
}

.sticker_img_popup {
    position: fixed;
    top: 0;
    z-index: 11;
    left: 0;
    width: 100%;
    height: 100%
}

    .sticker_img_popup .stickerImg {
        position: relative;
        display: inline-block;
        background: #eee;
        border: 1px solid #ddd;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%)
    }

    .sticker_img_popup .close_img {
        position: absolute;
        right: -10px;
        top: -10px;
        background: #fff;
        width: 25px;
        height: 25px;
        text-align: center;
        border-radius: 50%;
        border: 1px solid var(--third-color);
        color: var(--third-color);
        line-height: 22px;
        cursor: pointer;
        box-shadow: -2px 2px 4px rgba(0,0,0,0.5);
        -webkit-box-shadow: -2px 2px 4px rgba(0,0,0,0.5);
        -moz-box-shadow: -2px 2px 4px rgba(0,0,0,0.5);
        -ms-box-shadow: -2px 2px 4px rgba(0,0,0,0.5)
    }

    .sticker_img_popup .stickerImg img {
        max-width: 100%;
        max-height: 100%;
        box-shadow: 3px 3px 7px rgba(0,0,0,0.7);
        -webkit-box-shadow: 3px 3px 7px rgba(0,0,0,0.7);
        -moz-box-shadow: 3px 3px 7px rgba(0,0,0,0.7);
        -ms-box-shadow: 3px 3px 7px rgba(0,0,0,0.7);
        -o-box-shadow: 3px 3px 7px rgba(0,0,0,0.7)
    }
/*========================== Rough Purchase Detail List End ==========================*/

/*============================== Master Book List Start ==============================*/
.roughPurchaseMasterBook .search_bar_div, .masterBookPage .search_bar_div { 
    width: 100%;
    position: relative;
    z-index: 1
}

.roughPurchaseMasterBook .date_search_table .form-group.search_bar { 
    width: calc(100% - 875px);
    min-width: 320px;
    max-width: 410px;
    margin-bottom: 4px !important;
}

.roughPurchaseMasterBook .date_search_table .rightBtnBar {
    display: inline-block;
    float: left
}

.roughPurchaseMasterBook .date_search_table .search_bar .input-group {
    width: calc(100% - 130px)
}
    
    .roughPurchaseMasterBook .date_search_table .search_bar .input-group.masterBookSearch {
        width: calc(100% - 30px)
    }


.roughPurchaseMasterBook .date_search_table .form-group {
    width: 165px
}

    .roughPurchaseMasterBook .date_search_table .form-group.fromDate {
        width: 165px !important
    }

    .roughPurchaseMasterBook .date_search_table .form-group:nth-child(2) {
        width: 135px
    }

    .roughPurchaseMasterBook .date_search_table .form-group.toDate {
        width: 135px !important
    }

    .roughPurchaseMasterBook .date_search_table .form-group.columnPart {
        width: 130px
    }

    .roughPurchaseMasterBook .date_search_table .form-group.search_bar .columnPart .form-control {
    }

.roughPurchaseMasterBook .date_search_table .search_drop_down {
    width: 55px
}

    .roughPurchaseMasterBook .date_search_table .search_drop_down .form-control {
        padding: 5px 0
    }

.roughPurchaseMasterBook .date_search_table .form-control {
    font-size: 13px;
    height: 32px;
    line-height: 18px
}

.roughPurchaseMasterBook .search_bar .search_drop_down {
    width: 100px;
    margin-right: 10px
}

.roughPurchaseMasterBook ul.code_btn_bar li {
    margin: 0px 3px 5px !important
}

    .roughPurchaseMasterBook ul.code_btn_bar li a button {
        height: 34px
    }

ul.dept_group_popup {
    display: none;
    background-color: #e5e5e5;
    color: #fff;
    border-radius: 0 5px 5px 5px;
    position: absolute;
    border: 1px solid #aaa;
    z-index: 1;
    top: 0%;
    left: 110%;
    padding: 0;
    margin: 0;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -ms-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -o-box-shadow: 2px 2px 6px rgba(0,0,0,0.6)
}

.dept_group_popup li, .issue_option_div li {
    list-style: none
}

.dept_group_popup li, .issue_option_div li {
    width: 90px;
    padding: 0px 10px;
    text-align: center;
    border-bottom: 1px solid #ccc;
    color: #333;
    cursor: pointer;
    height: 28px;
    line-height: 28px;
    display: block;
    font-weight: 600
}

    .dept_group_popup li:first-child, .issue_option_div li:first-child {
        border-radius: 4px 4px 0 0
    }

    .dept_group_popup li:last-child, .issue_option_div li:last-child {
        border-radius: 0 0 4px 4px;
        border-bottom: none
    }

    .dept_group_popup li:hover, .issue_option_div li:hover {
        background-color: #999;
        color: #fff
    }

ul.dept_group_popup::before {
    content: "";
    border: 25px solid #e5e5e5;
    border-right: none;
    border-bottom-color: transparent;
    border-top-color: transparent;
    left: -11px;
    top: 3px;
    position: absolute;
    border-bottom: 30px solid transparent;
    border-top: 0px solid transparent;
    box-shadow: -1px -1px 1px #949494;
    -webkit-box-shadow: -1px -1px 1px #949494;
    -moz-box-shadow: -1px -1px 1px #949494;
    -ms-box-shadow: -1px -1px 1px #949494;
    -o-box-shadow: -1px -1px 1px #949494;
    transform: rotate(-39deg);
    -webkit-transform: rotate(-39deg);
    -moz-transform: rotate(-39deg);
    -ms-transform: rotate(-39deg);
    -o-transform: rotate(-39deg)
}

div.jtable-main-container > table.jtable > tbody > tr:last-child td ul.dept_group_popup, div.jtable-main-container > table.jtable > tbody > tr:nth-last-child(2) td ul.dept_group_popup, div.jtable-main-container > table.jtable > tbody > tr:nth-last-child(3) td ul.dept_group_popup {
    top: auto;
    bottom: 0;
    border-radius: 5px 5px 5px 0
}

    div.jtable-main-container > table.jtable > tbody > tr:last-child td ul.dept_group_popup::before, div.jtable-main-container > table.jtable > tbody > tr:nth-last-child(2) td ul.dept_group_popup::before, div.jtable-main-container > table.jtable > tbody > tr:nth-last-child(3) td ul.dept_group_popup::before {
        border-left: none;
        border-right: 25px solid #e5e5e5;
        border-top: 30px solid transparent;
        border-bottom: 0 solid transparent;
        bottom: 3px;
        top: auto;
        box-shadow: 1px 1px 1px #949494;
        -webkit-box-shadow: 1px 1px 1px #949494;
        -moz-box-shadow: 1px 1px 1px #949494;
        -ms-box-shadow: 1px 1px 1px #949494;
        -o-box-shadow: 1px 1px 1px #949494;
        transform: rotate(140deg);
        -webkit-transform: rotate(140deg);
        -moz-transform: rotate(140deg);
        -ms-transform: rotate(140deg);
        -o-transform: rotate(140deg)
    }

.issue_option_div {
    display: none;
    background-color: #e5e5e5;
    color: #fff;
    border-radius: 5px;
    position: absolute;
    border: 1px solid #aaa;
    z-index: 1;
    padding: 0;
    margin: 0;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -o-box-shadow: 0px 0px 3px rgba(0,0,0,0.7); 
    border-radius: 0; 
}

.buyer_option_div {
    display: none;
    background-color: #e5e5e5;
    color: #fff;
    border-radius: 5px;
    position: absolute;
    border: 1px solid #aaa;
    z-index: 1;
    padding: 0;
    margin: 0;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -o-box-shadow: 0px 0px 3px rgba(0,0,0,0.7); 
    border-radius: 0; 
}

.broker_option_div {
    display: none;
    background-color: #e5e5e5;
    color: #fff;
    border-radius: 5px;
    position: absolute;
    border: 1px solid #aaa;
    z-index: 1;
    padding: 0;
    margin: 0;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.7);
    -o-box-shadow: 0px 0px 3px rgba(0,0,0,0.7); 
    border-radius: 0; 
}

div.jtable-main-container > table.jtable > tbody > tr:last-child td ul.issue_option_div, div.jtable-main-container > table.jtable > tbody > tr:nth-last-child(2) td ul.issue_option_div {
    top: auto;
    bottom: 0;
    border-radius: 5px 5px 5px 0
}

.issue_option_div li {
    width: auto;
    text-align: left
}

    .issue_option_div li a {
        margin-left: 8px;
        font-size: 11px;
        cursor: pointer
    }

.editSubKapanDetail .box_col {
    width: 285px
}

.ui-grid-row .ui-grid-cell {
    position: relative;
    overflow: visible
}

.roughPurchaseMasterBook ul.dept_group_popup {
    top: -4px;
    left: 57px
}

.roughPurchaseMasterBook .ui-grid-row .departGroup {
    position: fixed;
    left: 50%;
    margin-left: -122px
}

.roughPurchaseMasterBook .ui-grid-row .depart {
    position: relative;
    z-index: 1
}

.roughPurchaseMasterBook .ui-grid-row:last-child .ui-grid-cell ul.dept_group_popup, .roughPurchaseMasterBook .ui-grid-row:nth-last-child(2) .ui-grid-cell ul.dept_group_popup, .roughPurchaseMasterBook .ui-grid-row:nth-last-child(3) .ui-grid-cell ul.dept_group_popup {
    top: auto;
    bottom: 1px;
    border-radius: 5px 5px 5px 0
}

    .roughPurchaseMasterBook .ui-grid-row:last-child .ui-grid-cell ul.dept_group_popup::before, .roughPurchaseMasterBook .ui-grid-row:nth-last-child(2) .ui-grid-cell ul.dept_group_popup::before, .roughPurchaseMasterBook .ui-grid-row:nth-last-child(3) .ui-grid-cell ul.dept_group_popup::before {
        border-left: none;
        border-right: 25px solid #e5e5e5;
        border-top: 30px solid transparent;
        border-bottom: 0 solid transparent;
        bottom: 3px;
        top: auto;
        box-shadow: 1px 1px 1px #949494;
        -webkit-box-shadow: 1px 1px 1px #949494;
        -moz-box-shadow: 1px 1px 1px #949494;
        -ms-box-shadow: 1px 1px 1px #949494;
        -o-box-shadow: 1px 1px 1px #949494;
        transform: rotate(140deg);
        -webkit-transform: rotate(140deg);
        -moz-transform: rotate(140deg);
        -ms-transform: rotate(140deg);
        -o-transform: rotate(140deg)
    }

.roughPurchaseMasterBook .ui-grid-row .issueOption {
    position: fixed 
}

.roughPurchaseMasterBook .ui-grid-row .issue {
    position: relative;
    z-index: 1
}

.roughPurchaseMasterBook .ui-grid-row:last-child .ui-grid-cell ul.issue_option_div, .roughPurchaseMasterBook .ui-grid-row:nth-last-child(2) .ui-grid-cell ul.issue_option_div {
    top: auto;
    bottom: 0;
    border-radius: 5px 5px 5px 0
}

@media(max-width:1280px) {
    .roughPurchaseMasterBook .date_search_table .search_drop_down {
        width: 55px;
        margin-bottom: 4px
    }
}

.issue_option_div {
    background-color: #fff
}
    
    .issue_option_div .listPart .select2.select2 select2-container {
        border-top: 1px solid #aaa;
        border-left: 1px solid #aaa
    }

    .issue_option_div .listPart .select2-container--default .select2-selection--single {
        border: none !important;
        border-right: 1px solid #aaa !important;
        border-top: 1px solid #aaa !important;
        border-left: 1px solid #aaa !important
    }

    .issue_option_div .listPart .select2-selection__rendered {
        padding-left: 0
    }

    .issue_option_div .linkPartDiv {
        width: 34px;
        float: left;
        border-top: 1px solid #aaa
    }

        .issue_option_div .linkPartDiv a {
            width: 28px;
            height: 28px;
            border-radius: 8px;
            display: block;
            margin: 0;
            float: right;
            border: 1px solid #1c949a;
            text-align: center;
            line-height: 28px;
            background-color: var(--second-color);
            color: #fff;
            margin-top: 3px;
            margin-right: 3px;
            cursor: pointer
        }
/*=============================== Pending Confirmation Popup Start ==============================*/
.top_btn_serch .all_select_box {
    margin-bottom: 10px;
    height: 30px;
    line-height: 30px
}

.top_btn_serch .search_bar {
    margin-bottom: 10px
}

    .top_btn_serch .search_bar .search_box {
        width: calc(100% - 40px);
        margin-right: 5px
    }

        .top_btn_serch .search_bar .search_box .form-control {
            height: 30px;
            width: 100%
        }

    .top_btn_serch .search_bar button {
        height: 30px;
        width: 33px
    }
/*================================ Pending Confirmation Popup End ===============================*/
.popup_div .divmixtable {
    overflow: auto;
    max-height: 400px;
    margin-bottom: 10px
}

    .popup_div .divmixtable table {
        text-align: center
    }

        .popup_div .divmixtable table tfoot td {
            text-align: center;
            border-color: #ddd
        }

.popup_div .subKapanCaratsPopup {
    width: 870px
}

    .popup_div .subKapanCaratsPopup .dataTables_scrollBody {
        max-height: 290px !important;
        height: auto !important
    }

    .popup_div .subKapanCaratsPopup table .qualityNameTd {
        width: 300px
    }

.popup_div .edit_sub_kapan_popup .dataTables_scroll {
    width: 900px
}

.popup_div .edit_sub_kapan_popup .dataTables_scrollBody {
    max-height: 300px !important;
    height: auto !important
}

.popup_div .edit_sub_kapan_popup .dataTables_info {
    margin-right: -50px
}

.select2-container--default .select2-dropdown.kapanList ul .select2-results__option[aria-selected=true] table tbody tr {
    background-color: #eee
}

.select2-dropdown.kapanList ul li {
    padding: 0
}

    .select2-dropdown.kapanList ul li table {
        width: 100%
    }

        .select2-dropdown.kapanList ul li table tbody tr td {
            font-size: 13px;
            line-height: 19px
        }

            .select2-dropdown.kapanList ul li table tbody tr td.kapan {
                width: 75px
            }

            .select2-dropdown.kapanList ul li table tbody tr td.lotno {
                width: 75px
            }

.lightTheme .popup_div .mixKapanPopup .table_div {
    max-height: 213px;
    overflow-y: auto;
    border: 1px solid #bbb
}

    .lightTheme .popup_div .mixKapanPopup .table_div table {
        border-bottom: none !important
    }

        .lightTheme .popup_div .mixKapanPopup .table_div table thead th {
            border-top: none !important
        }

        .lightTheme .popup_div .mixKapanPopup .table_div table tbody tr:last-child, .lightTheme .popup_div .mixKapanPopup .table_div table tbody tr:last-child td {
            border-bottom: none !important
        }

        .lightTheme .popup_div .mixKapanPopup .table_div table tbody tr td {
            height: 30px !important
        }

        .lightTheme .popup_div .mixKapanPopup .table_div table tbody tr.jtable-no-data-row, .lightTheme .popup_div .mixKapanPopup .table_div table tbody tr.jtable-no-data-row td {
            border-bottom: none !important
        }
/*=============================== Master Book List End ===============================*/

/*=============================== Kapan Creation Start ===============================*/
.kapanCreation_page .box_div, .lotMixing_page .box_div, .assortmentSelection_page .box_div {
    padding: 15px;
    border-radius: 6px;
    background-color: #f1f1f1;
    margin-bottom: 25px;
    border: 1px solid #e4e4e4
}

    .kapanCreation_page .box_div table, .lotMixing_page .box_div table {
        margin-bottom: 0;
        width: max-content;
        width: -moz-max-content;
        max-width: max-content;
        max-width: -moz-max-content;
        min-width: 100%
    }

    .kapanCreation_page .box_div .table_div, .lotMixing_page .box_div .table_div {
        border: 1px solid #ccc;
        overflow-x: auto
    }

.kapanCreation_page .box.box_search {
    margin-bottom: 25px
}

    .kapanCreation_page .box.box_search .box-header.with-border {
        background: #f7f7f7
    }

.kapanCreation_page .box_div .control-label {
    width: 100px;
    float: left;
    margin-right: 10px;
    font-size: 14px;
    padding-right: 0;
    text-align: right
}

.kapanCreation_page .box_div .text_box_div {
    width: calc(100% - 110px);
    float: left;
    height: 32px
}

.kapanCreation_page .box_div .bottom_box .form-group {
    margin-top: 7px;
    margin-bottom: 7px
}

    .kapanCreation_page .box_div .bottom_box .form-group .control-label {
        padding: 0;
        line-height: 30px;
        font-size: 13px;
        width: 85px
    }

    .kapanCreation_page .box_div .bottom_box .form-group .text_box_div {
        width: calc(100% - 100px);
        height: 30px;
        position: relative
    }

    .kapanCreation_page .box_div .bottom_box .form-group .with_add_btn i.dropdown_arrow {
        right: 40px !important
    }

    .kapanCreation_page .box_div .bottom_box .form-group .form-control {
        height: 30px
    }

    .kapanCreation_page .box_div .bottom_box .form-group .longValidation {
        letter-spacing: -1px
    }

    .kapanCreation_page .box_div .bottom_box .form-group .text_box_div i.dropdown_arrow {
        right: 7px
    }

.kapanCreation_page .box_div .bottom_box .calculation_btn_bar .btn {
    height: 30px;
    padding: 4px 12px
}

.kapanCreation_page .box_div .calculation_btn_bar .btn {
    padding: 5px 12px
}

.kapanCreation_page .AssortmentSelectAll_btn {
    margin: 0;
    display: inline-block
}

    .kapanCreation_page .AssortmentSelectAll_btn label {
        vertical-align: text-bottom;
        margin: 0
    }
/*================================ Kapan Creation End ================================*/

/*=============================== Lot Mixing Page Start ==============================*/
.lotMixing_form .form-group {
    margin-bottom: 16px;
    position: relative
}

    .lotMixing_form .form-group .field-validation-error {
        position: absolute
    }

.lotMixing_form .control-label {
    text-align: left
}

.lotMixing_form .form-control {
    height: 32px
}

.lotMixing_form .bottom_btn_bar {
    float: right
}

/*==================== Treeview Start ====================*/
.acidjs-css3-treeview, .acidjs-css3-treeview *, .acidjs-css3-treeview-lotmix, .acidjs-css3-treeview-lotmix * {
    padding: 0;
    margin: 0;
    list-style: none
}

.acidjs-css3-treeview, .acidjs-css3-treeview-lotmix {
    max-height: 550px;
    overflow-y: auto
}

    .acidjs-css3-treeview ul li ul {
        display: none
    }

    .acidjs-css3-treeview label[for]::before, .acidjs-css3-treeview label span::before {
        content: "\25b6";
        display: inline-block;
        margin: 8px 0 0;
        width: 19px;
        height: 19px;
        vertical-align: top; 
        color: #e74c3c;
        font-size: 24px;
        line-height: 19px; 
    }

    .acidjs-css3-treeview label span::before {
        font-size: 19px
    }

    .acidjs-css3-treeview li ul, .acidjs-css3-treeview-lotmix li ul {
        margin: 0 0 0 40px;
        border-left: 1px dotted;
        border-bottom: 1px solid #ddd;
        border-top: 1px solid #ddd
    }

        .acidjs-css3-treeview li ul:last-child, .acidjs-css3-treeview-lotmix li ul:last-child {
            border-bottom: none
        }

    .acidjs-css3-treeview *, .acidjs-css3-treeview-lotmix * {
        vertical-align: middle
    }

.acidjs-css3-treeview, .acidjs-css3-treeview-lotmix {
    font: normal 11px/16px "Segoe UI", Arial, Sans-serif;
    border: 1px solid #ccc
}

    .acidjs-css3-treeview li, .acidjs-css3-treeview-lotmix li {
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        border-bottom: 1px solid #ddd;
        padding-left: 5px
    }

        .acidjs-css3-treeview li:last-child, .acidjs-css3-treeview-lotmix li:last-child {
            border-bottom: none
        }

    .acidjs-css3-treeview input[type="checkbox"] {
        display: none
    }

    .acidjs-css3-treeview label, .acidjs-css3-treeview-lotmix label {
        cursor: pointer;
        height: 34px;
        line-height: 35px
    }

        .acidjs-css3-treeview label[for]::before {
            -webkit-transform: translatex(-35px);
            -moz-transform: translatex(-35px);
            -ms-transform: translatex(-35px);
            -o-transform: translatex(-35px);
            transform: translatex(-35px)
        }

        .acidjs-css3-treeview label span::before {
            -webkit-transform: translatex(20px);
            -moz-transform: translatex(20px);
            -ms-transform: translatex(20px);
            -o-transform: translatex(20px);
            transform: translatex(20px)
        }

    .acidjs-css3-treeview input[type="checkbox"][id]:checked ~ label[for]::before {
        content: "\25bc"
    }

    .acidjs-css3-treeview input[type="checkbox"][id]:not(:checked) ~ ul {
        display: none
    }

    .acidjs-css3-treeview label:not([for]) {
        margin: 0 8px 0 0
    }

    .acidjs-css3-treeview label span::before {
        content: "";
        border: solid 1px #1375b3;
        color: #1375b3;
        opacity: .50
    }

    .acidjs-css3-treeview label input:checked + span::before {
        content: "\2714";
        box-shadow: 0 0 2px rgba(0,0,0,.25) inset;
        -webkit-box-shadow: 0 0 2px rgba(0,0,0,.25) inset;
        -moz-box-shadow: 0 0 2px rgba(0,0,0,.25) inset;
        -ms-box-shadow: 0 0 2px rgba(0,0,0,.25) inset;
        -o-box-shadow: 0 0 2px rgba(0,0,0,.25) inset;
        opacity: 1
    }

    .acidjs-css3-treeview.treeviewTable li > ul {
        margin: -31px 0 0 25%
    }

    .acidjs-css3-treeview.treeviewTable li {
    }

        .acidjs-css3-treeview.treeviewTable li > ul > li > ul {
            margin-left: 33%
        }

            .acidjs-css3-treeview.treeviewTable li > ul > li > ul > li > ul {
                margin-left: 50%
            }

.table_head ul {
    width: 100%;
    display: inline-block;
    padding: 0;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #9cabaf), color-stop(1, #758d94));
    background: -ms-linear-gradient(bottom, #9cabaf, #758d94);
    background: -moz-linear-gradient(center bottom, #9cabaf 0%, #758d94 100%);
    background: -o-linear-gradient(#758d94, #9cabaf)
}

    .table_head ul li {
        float: left;
        width: 25%;
        list-style: none;
        font-weight: 600;
        color: #fff;
        text-align: center;
        line-height: 38px;
        border-left: 1px solid #ddd
    }

.acidjs-css3-treeview-lotmix li label {
    padding: 0 15px
}
/*===================== Treeview End =====================*/

/*================================ Lot Mixing Page End ===============================*/

/*============================== Confirmation Page Start =============================*/
.note_div {
    padding: 15px
}

    .note_div .callout {
        background-color: #e7ebec;
        border-color: var(--second-color);
        box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
        -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
        -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
        -ms-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
        -o-box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
        border-top: 1px solid #ddd
    }

        .note_div .callout h4 {
            margin-top: 0;
            margin-bottom: 10px;
            color: var(--second-color)
        }

.top_btn_serch .all_select_box {
}

    .top_btn_serch .all_select_box input {
        width: 18px;
        height: 18px;
        margin-top: 0;
        position: relative;
        top: 4px
    }

    .top_btn_serch .all_select_box label {
        line-height: 30px;
        margin-bottom: 0;
        margin-left: 5px;
        color: #000;
        font-size: 13px
    }

.top_btn_serch .search_bar {
    width: 385px;
    float: right
}
/*=============================== Confirmation Page End ==============================*/

/*================================ User Master Start =================================*/
.userManageDashboard .chart_box {
    background-color: #f9f9f9;
    border-left: 1px solid #e9e7f1;
    border-top: 1px solid #e9e7f1;
    margin: 0 0 15px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.3)
}

    .userManageDashboard .chart_box:hover {
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    }

.chart_box .head_div {
    color: #fff;
    padding: 10px 20px 10px 10px !important;
    width: auto; 
    position: relative;
    background: #166882; 
    font-size: 20px;
    font-family: "Gotham_SSm_5r", Helvetica, Arial, sans-serif;
    border-bottom: none !important;
    height: 48px
}

.userManageDashboard .chart_box .head_div {
    margin-left: -8px;
    float: left;
    clip-path: polygon(0% 0%,95% 0%,100% 50%,95% 100%,25% 100%,25% 116%,0 116%);
}

.head_div::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -8px;
    border-top: 4px solid #166882;
    border-right: 4px solid #166882;
    border-bottom: 4px solid transparent;
    border-left: 4px solid transparent;
}

.chart_box:hover .head_div::after {
    height: 100%;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    transition-duration: 1.3s;
    width: 100%;
}

.head_div::after {
    background: rgba(255,255,255,.41) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 0;
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    position: absolute;
    right: 0;
    width: 0;
}

.userManageDashboard.dashboard_page_div .chart_box .head_div::before {
    display: block
}

.dashboard_page_div .chart_box .head_div::before {
    display: none
}

.chart_box .chart_part {
    width: 100%;
    padding: 10px;
    margin-top: 25px;
    position: relative;
    float: left;
}

.userManageDashboard .chart_box .chart-responsive {
    max-width: 318px;
    margin: 0 auto 15px
}

.chart_box .chart_part .chart-legend {
    float: right;
    margin-right: 25px
}

    .chart_box .chart_part .chart-legend li {
        font-family: Verdana Bold;
        padding: 10px 0;
        color: #34495e;
        font-size: 13px
    }

        .chart_box .chart_part .chart-legend li i {
            margin-right: 5px;
            font-size: 16px
        }

.chart_box .chartFooterBar {
    padding: 10px;
    width: 100%;
    border-top: 1px solid #eaeaea;
    display: flow-root
}

    .chart_box .chartFooterBar .onePart {
        width: 100%;
        padding: 10px;
        display: flow-root
    }

        .chart_box .chartFooterBar .onePart .dataHeadDiv {
            font-size: 15px;
            color: #999;
            float: left
        }

        .chart_box .chartFooterBar .onePart .dataDisplayDiv {
            font-size: 16px;
            color: #000;
            font-family: Verdana Bold;
            float: right
        }

.sideDetailDiv {
    float: left;
    width: 100%;
    border-left: 1px solid #e9e7f1;
    border-top: 1px solid #e9e7f1;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.3)
}

    .sideDetailDiv:hover {
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    }

    .sideDetailDiv .sideDetailHead {
        color: #fff;
        padding: 10px 20px 10px 10px;
        width: auto;
        float: left;
        position: relative;
        margin-left: -8px;
        background: var(--third-color);
        clip-path: polygon(0% 0%,95% 0%,100% 50%,95% 100%,25% 100%,25% 116%,0 116%);
        font-size: 19px;
        font-family: "Gotham_SSm_5r", Helvetica, Arial, sans-serif;
    }

        .sideDetailDiv .sideDetailHead::before {
            content: '';
            position: absolute;
            left: 0;
            bottom: -8px;
            border-top: 4px solid var(--third-color);
            border-right: 4px solid var(--third-color);
            border-bottom: 4px solid transparent;
            border-left: 4px solid transparent;
        }

    .sideDetailDiv:hover .sideDetailHead::after {
        height: 100%;
        opacity: 0;
        -moz-opacity: 0;
        -khtml-opacity: 0;
        -webkit-opacity: 0;
        transition-duration: 1.3s;
        width: 100%;
    }

    .sideDetailDiv .sideDetailHead::after {
        background: rgba(255,255,255,.41) none repeat scroll 0 0;
        bottom: 0;
        content: "";
        height: 0;
        opacity: 1;
        -moz-opacity: 1;
        -khtml-opacity: 1;
        -webkit-opacity: 1;
        position: absolute;
        right: 0;
        width: 0;
    }


    .sideDetailDiv .sideDetailBox {
        background-color: #fff;
        font-size: 23px;
        font-family: Verdana Bold;
        float: left;
        width: 100%
    }

        .sideDetailDiv .sideDetailBox .detail_div {
            border-bottom: 1px solid #eee;
            padding: 30px 31px;
            font-size: 14px;
            font-family: Verdana
        }

            .sideDetailDiv .sideDetailBox .detail_div .count_div {
                display: inline-block;
                float: right;
                width: 40px;
                height: 30px !important;
                text-align: right
            }

.userMasterPage .box_div, .addRolePage .box_div {
    padding: 15px;
    padding-bottom: 0;
    border-radius: 6px;
    background-color: var(--light_theme);
    margin-bottom: 20px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.6);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.6);
    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.6);
    -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.6)
}

.switch {
    width: 44px;
    height: 20px;
    margin-bottom: 0
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s
    }

input:checked + .slider {
    background-color: var(--main-color)
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
    -webkit-box-shadow: 0 0 1px #2196F3;
    -moz-box-shadow: 0 0 1px #2196F3;
    -ms-box-shadow: 0 0 1px #2196F3;
    -o-box-shadow: 0 0 1px #2196F3
}

input:checked + .slider:before {
    -webkit-transform: translateX(24px);
    -ms-transform: translateX(24px);
    -moz-transform: translateX(24px);
    -o-transform: translateX(24px);
    transform: translateX(24px)
}

input[type="checkbox"]:checked + input[type="hidden"] + .slider, input[type="checkbox"]:checked + .slider {
    background-color: var(--main-color)
}

input[type="checkbox"]:focus + input[type="hidden"] + .slider, input[type="checkbox"]:focus + .slider {
    box-shadow: 0 0 1px var(--main-color);
    -webkit-box-shadow: 0 0 1px var(--main-color);
    -moz-box-shadow: 0 0 1px var(--main-color);
    -ms-box-shadow: 0 0 1px var(--main-color);
    -o-box-shadow: 0 0 1px var(--main-color)
}

input[type="checkbox"]:checked + input[type="hidden"] + .slider:before, input[type="checkbox"]:checked + .slider:before {
    transform: translateX(24px);
    -webkit-transform: translateX(24px);
    -moz-transform: translateX(24px);
    -ms-transform: translateX(24px);
    -o-transform: translateX(24px)
}

.slider.round {
    border-radius: 15px
}

    .slider.round:before {
        border-radius: 50%
    }

.userMasterPage #list table.dataTable.vAlignMiddle {
    width: 100% !important
}

.userMasterPage table tr td select, .addRolePage table tr td select {
    width: 100%;
    border: none;
    background-color: rgba(0,0,0,0)
}

    .userMasterPage table tr td select:focus, .addRolePage table tr td select:focus {
        outline: none
    }

.userMasterPage .select2-container--default .select2-selection--multiple, .addRolePage .select2-container--default .select2-selection--multiple {
    border:none;
    padding-right: 20px;
    line-height: 13px;
    background-color: rgba(0,0,0,0);
    height: auto
}

.userMasterPage .select2-container--default.select2-container--focus .select2-selection--multiple, .addRolePage .select2-container--default.select2-container--focus .select2-selection--multiple {
    border: none
}

.userMasterPage .select2-container--default .select2-selection--multiple:after, 
.addRolePage .select2-container--default .select2-selection--multiple:after {
    content:'';
    display: inline-block;
    position: absolute;
    right: 10px !important;
    top: 43% !important;
    width: 8px !important;
    height: 8px !important;
    background: transparent;
    text-indent: -9999px;
    border-top: 2px solid #707070;
    border-left: 2px solid #707070;
    transition: all 250ms ease-in-out;
    text-decoration: none;
    color: transparent;
    transform: translateY(-50%) rotate(-134deg) !important;
}

.userMasterPage .select2-container--default.select2-container--open .select2-selection--multiple:after {
    transform: translateY(-50%) rotate(44deg) !important;
}

.userMasterPage .disable_div {
    cursor: not-allowed;
    opacity: 0.5
}

    .userMasterPage .disable_div label, .userMasterPage .disable_div input {
        cursor: not-allowed
    }

.userMasterPage .box_div .form-group .control-label {
    width: 110px;
    padding: 0;
    padding-top: 8px
}

.userMasterPage .box_div .form-group .input_box_div {
    width: calc(100% - 110px)
}

    .userMasterPage .box_div .form-group .input_box_div .show_password_div {
        padding-right: 0;
        width: 135px;
        padding-left: 5px
    }

    .userMasterPage .box_div .form-group .input_box_div .password_box {
        width: calc(100% - 135px)
    }

    .userMasterPage .box_div .form-group .input_box_div input[type=checkbox] {
        margin-top: 10px
    }

    .userMasterPage .box_div .form-group .input_box_div label.checkbox_label {
        font-size: 12px;
        font-weight: 400;
        margin: 0;
        height: 34px;
        line-height: 34px
    }

.userMasterPage .box_div .form-group {
    margin-bottom: 25px
}

    .userMasterPage .box_div .form-group .field-validation-error {
        position: absolute
    }

    .userMasterPage .box_div .form-group .input_box_div .switch_div {
        width: 85px
    }

    .userMasterPage .box_div .form-group .input_box_div .hide_div {
        float: left;
        width: calc(100% - 85px);
        display: none
    }

    .userMasterPage .box_div .form-group .input_box_div .btn_div {
        width: 90px
    }

    .userMasterPage .box_div .form-group .input_box_div .input_div {
        width: calc(100% - 90px)
    }

    .userMasterPage .box_div .form-group .input_box_div .btn_div .btn {
        font-size: 12px;
        padding: 7px 12px
    }

.userMasterPage #list .dataTables_wrapper .row:nth-child(2) .col-sm-12 {
    overflow: hidden
}
/*.userMasterPage .dataTables_scrollBody{max-height:341px!important;border-bottom:1px solid #969595;width:calc(100% + 16px)!important;overflow-y:auto}*/
.userMasterPage .dataTables_scrollBody {
    max-height: 350px;
    height: auto !important
}
/*.userMasterPage .grid_table tbody tr td{padding:3px 8px 3px}*/
.userMasterPage table .select2-container .select2-selection--single {
    height: 25px !important
}

.userMasterPage table .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 20px
}

.form-group label.switch {
    margin-top: 5px
}

.form-group .control-label .switch {
    margin-top: -2px
}
/*.formName_col{width:20%}
.activeSwitch_col{width:50px}
.right_col{width:35%}
.field_col{width:40%}
.appName_col{width:230px}
.roels_col{width:20%}
.selectBranch_col{width:30%}
.selectDepart_col{width:30%}*/

.userAppSearchBar {
    width: 450px;
    float: right;
    padding: 0
}

    .userAppSearchBar .search_drop_down {
        width: 400px;
        margin-right: 10px
    }

.appFieldSearchBar .search_drop_down {
    margin-right: 10px;
    width: 350px
}
/*.shapeGroupList .rightSearchBarWithTowTextBox{width:200px}*/
/*================================= User Master End ==================================*/

/*=================================== Add Role Start =================================*/
.addRoleTab .nav-tabs-custom > .nav-tabs {
    border-bottom-color: #646464
}

    .addRoleTab .nav-tabs-custom > .nav-tabs > li.active {
        border-top-color: var(--main-color);
        border-left: 1px solid #646464
    }

    .addRoleTab .nav-tabs-custom > .nav-tabs > li:first-child.active {
        border-left: none
    }

    .addRoleTab .nav-tabs-custom > .nav-tabs > li {
        margin-right: 0
    }

        .addRoleTab .nav-tabs-custom > .nav-tabs > li > a {
            font-family: Verdana Bold;
            font-size: 13px;
            padding: 10px 25px
        }

        .addRoleTab .nav-tabs-custom > .nav-tabs > li:hover {
            background-color: #e6e6e6
        }

            .addRoleTab .nav-tabs-custom > .nav-tabs > li:hover > a {
                color: #444
            }

        .addRoleTab .nav-tabs-custom > .nav-tabs > li.active > a, .addRoleTab .nav-tabs-custom > .nav-tabs > li.active:hover > a {
            background-color: #fff;
            border-right-color: #646464;
            color: var(--main-color)
        }

.addRoleTab .nav-tabs-custom {
    background: var(--light_theme);
    border: 1px solid #646464
}
/*==================================== Add Role End ==================================*/

/*==================================== Assortment List Start ==================================*/
.tabel_display_view {
    width: 900px;
    margin: 0 auto
}

    .tabel_display_view .tabel_head_div {
        width: 100%; /*text-align:center;*/
        font-weight: 600;
        font-size: 22px;
        margin-bottom: 5px
    }

    .tabel_display_view .display_tabel, .tabel_display_view .display_summery {
        width: 100%;
        border: 1px solid #222;
        display: table;
        border-top: none;
        border-right: none;
        border-left-width: 2px
    }

        .tabel_display_view .display_tabel:first-child, .tabel_display_view .display_summery:first-child {
            border-top-width: 1px !important
        }

        .tabel_display_view .display_tabel:last-child, .tabel_display_view .display_summery:last-child {
            border-bottom: 2px solid #222
        }

        .tabel_display_view .display_tabel .tabel_row, .tabel_display_view .display_summery .tabel_row {
            width: 100%;
            font-weight: 600;
            font-size: 16px
        }

            .tabel_display_view .display_tabel .tabel_row.sub_row {
                width: 100%;
                font-weight: normal;
                font-size: 13px
            }

            .tabel_display_view .display_tabel .tabel_row .col, .tabel_display_view .display_summery .tabel_row .col {
                border: 1px solid #222;
                float: left;
                height: 32px;
                padding: 4px 8px;
                border-bottom: none;
                border-right: none
            }

            .tabel_display_view .display_tabel .tabel_row:first-child .col {
                border-bottom: 1px solid #222
            }

            .tabel_display_view .display_tabel .tabel_row:nth-child(2) .col {
                border-top: none
            }

            .tabel_display_view .display_tabel .tabel_row .col:first-child, .tabel_display_view .display_summery .tabel_row .col:first-child {
                border-left: none
            }

            .tabel_display_view .display_tabel .tabel_row .col:last-child, .tabel_display_view .display_summery .tabel_row .col:last-child {
                border-right: 2px solid #222
            }

            .tabel_display_view .display_tabel .tabel_row.sub_row .col {
                height: 26px
            }

                .tabel_display_view .display_tabel .tabel_row.sub_row .col:first-child, .tabel_display_view .display_tabel .tabel_row.sub_row .col:nth-child(2), .tabel_display_view .display_tabel .tabel_row.sub_row .col:nth-child(3) {
                    border: none
                }

            .tabel_display_view .display_tabel .tabel_row .col_1 {
                width: 12%
            }

            .tabel_display_view .display_tabel .tabel_row .col_2 {
                width: 12%
            }

            .tabel_display_view .display_tabel .tabel_row .col_3 {
                width: 12%
            }

            .tabel_display_view .display_tabel .tabel_row .col_4 {
                width: 16%
            }

            .tabel_display_view .display_tabel .tabel_row .col_5 {
                width: 12%;
                text-align: right
            }

            .tabel_display_view .display_tabel .tabel_row .col_6 {
                width: 12%;
                text-align: right
            }

            .tabel_display_view .display_tabel .tabel_row .col_7 {
                width: 12%;
                text-align: right
            }

            .tabel_display_view .display_tabel .tabel_row .col_8 {
                width: 12%;
                text-align: right
            }

    .tabel_display_view .display_summery {
        width: 550px
    }

        .tabel_display_view .display_summery .tabel_row:first-child .col {
            border-top-width: 2px
        }

        .tabel_display_view .display_summery .tabel_row .col_1 {
            width: 25%
        }

        .tabel_display_view .display_summery .tabel_row .col_2 {
            width: 25%
        }

        .tabel_display_view .display_summery .tabel_row .col_3 {
            width: 25%
        }

        .tabel_display_view .display_summery .tabel_row .col_4 {
            width: 25%
        }

.popup_div .addAssortPopup .box_col .control-label {
    padding-left: 0 !important
}

@media(min-width:1200px) {
    .assortmentPagePart {
        width: 1200px
    }
}

@media(max-width:991px) {
    .popup_div .addAssortPopup .box_col .margintop20 {
        margin-top: 0
    }
    .lightTheme .tabs-container .tabs-panels{
        height: calc(100% - 105px) !important;
    }
}

@media(max-width:1199px) {
    .assortmentPagePart {
        width: 100%
    }
}

@media(max-width:595px) {
    .assortmentPagePart .nestedGridPart {
        border-right: 1px solid #aaa;
        border-left: 1px solid #aaa
    }

        .assortmentPagePart .nestedGridPart > table {
            margin: 0 !important
        }
}
/*===================================== Assortment List End ===================================*/

/*===================================== Price Forcasting Popup Start ==================================*/
/*.popup_div .priceForecastingPopup .box_col{width:750px}*/
.popup_div .priceForecastingPopup {
    width: 750px
}

    .popup_div .priceForecastingPopup .displayBox {
        border: 1px solid #666;
        border-radius: 3px;
        margin: 0 10px;
        display: flow-root;
        padding: 5px;
        position: relative;
        margin-bottom: 10px
    }

        .popup_div .priceForecastingPopup .displayBox .boxLabel {
            position: absolute;
            top: -10px;
            left: 10px;
            background: #fff;
            padding: 0 3px;
            color: var(--second-color);
            font-family: Verdana Bold;
            font-size: 12px
        }

        .popup_div .priceForecastingPopup .displayBox .form-group {
            line-height: 28px
        }

        .popup_div .priceForecastingPopup .displayBox .control-label {
            color: #555;
            font-size: 10.85px;
            font-weight: normal;
            padding-top: 0
        }

        .popup_div .priceForecastingPopup .displayBox .input_div label {
            line-height: 27px;
            font-size: 13px;
            font-family: Verdana Bold;
            font-weight: normal
        }

    .popup_div .priceForecastingPopup .box_div {
        border: 1px solid #afb1b5;
        border-radius: 3px;
        margin: 0 10px;
        display: flow-root;
        padding: 5px;
        background-color: #e7ebec;
        margin-bottom: 10px
    }

        .popup_div .priceForecastingPopup .box_div .form-group {
            margin: 5px 0
        }

        .popup_div .priceForecastingPopup .box_div .control-label {
            font-size: 11px;
            font-weight: normal;
            font-family: Verdana Bold;
            color: #111
        }

        .popup_div .priceForecastingPopup .box_div .disFlex {
            height: 85px
        }

            .popup_div .priceForecastingPopup .box_div .disFlex textarea {
                width: 100%;
                height: 85px
            }

        .popup_div .priceForecastingPopup .box_div .bottom_btn_bar {
            margin-top: 62px
        }

            .popup_div .priceForecastingPopup .box_div .bottom_btn_bar .btn {
                height: 28px;
                padding: 0 12px;
                margin: 0;
                line-height: 26px
            }

    .popup_div .priceForecastingPopup .dataTables_scrollBody {
        max-height: 140px;
        height: auto !important
    }
/*====================================== Price Forcasting Popup End ===================================*/

/*============================== User Management Dashboard Start ==============================*/
.userRoleChartBox {
    background-color: #f9f9f9;
    padding: 10px;
    width: 100%;
    border: 1px solid #dedede;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -moz-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -ms-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -o-box-shadow: 3px 3px 6px rgba(0,0,0,0.4)
}

    .userRoleChartBox .chart-responsive {
        max-width: 450px
    }

    .userRoleChartBox .boxHeader {
        width: 100%;
        color: #34495e;
        font-size: 23px;
        border-bottom: 2px solid #646464;
        margin-bottom: 25px;
        padding: 5px 10px 10px
    }

    .userRoleChartBox .chart-legend li {
        font-family: Verdana Bold;
        padding: 10px 0;
        color: #34495e;
        font-size: 13px
    }

        .userRoleChartBox .chart-legend li i {
            margin-right: 5px;
            font-size: 16px
        }

        .userRoleChartBox .chart-legend li span {
            width: 50px;
            height: 20px;
            line-height: 20px;
            text-align: center;
            border-radius: 3px
        }

.userCountDiv {
    border: 1px solid #dedede;
    border-right-color: #a5a5a5;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -moz-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -ms-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -o-box-shadow: 3px 3px 6px rgba(0,0,0,0.4)
}

    .userCountDiv .userCountHead {
        background-color: var(--third-color);
        padding: 20px;
        color: #fff;
        font-size: 23px;
        line-height: 30px
    }

    .userCountDiv .userCountContent {
        background-color: #f9f9f9;
        font-size: 23px;
        font-family: Verdana Bold;
        padding: 25px;
        color: #34495e
    }

    .userCountDiv small {
        font-size: 18px;
        line-height: 30px;
        font-family: Verdana Bold
    }

.singleAssortmentChart_page .top_section {
    margin-bottom: 10px
}

    .singleAssortmentChart_page .top_section .form-group {
        margin: 5px 0;
        padding: 0 8px
    }

    .singleAssortmentChart_page .top_section label.control-label {
        width: 90px;
        float: left;
        margin-right: 5px;
        height: 28px;
        line-height: 28px;
        font-size: 12px;
        margin-bottom: 0;
        padding-top: 0
    }

    .singleAssortmentChart_page .top_section .input_div {
        width: calc(100% - 95px);
        float: left;
        line-height: 28px
    }

        .singleAssortmentChart_page .top_section .input_div .form-control {
            height: 28px
        }

    .singleAssortmentChart_page .top_section .btn {
        height: 28px;
        line-height: 26px;
        padding: 0 10px
    }

.singleAssortmentChart_page .table_div {
    overflow-x: auto;
    border: none
}

.singleAssortmentChart_page #list table.dataTable {
    margin-top: 6px !important;
    margin-bottom: 6px !important
}

.singleAssortmentChart_page .table_div table {
    border-collapse: collapse !important;
    border-bottom-color: #646464 !important
}

.singleAssortmentChart_page .editable_grid table {
    margin-top: 6px !important
}

    .singleAssortmentChart_page .editable_grid table.noHeader {
        border: 2px solid #646464
    }

.singleAssortmentChart_page table.body_colapse tbody {
    display: none
}

    .singleAssortmentChart_page table.body_colapse tbody tr td table tbody {
        display: table-header-group
    }

    .singleAssortmentChart_page table.body_colapse tbody tr:last-child td {
        border-bottom: 1px solid
    }

    .singleAssortmentChart_page table.body_colapse tbody tr td table tr td {
        border-bottom: none !important
    }

    .singleAssortmentChart_page table.body_colapse tbody tr td table tbody {
        border-bottom: 1px solid #9eb8a3;
        border-right: none !important
    }

.singleAssortmentChart_page .body_colapse thead tr th {
    font-family: Verdana Bold !important;
    text-align: center;
    color: #305637;
    font-weight: 600 !important;
    font-size: 11px;
    border-color: #646464 !important;
    border-bottom: 1px solid #646464 !important;
    background: #04666a29;
    padding: 6px 4px;
    border-right-width: 1px;
    border-top-width: 0px !important
}

.singleAssortmentChart_page .editable_grid .body_colapse thead tr th table, .singleAssortmentChart_page .editable_grid .body_colapse tbody tr td table, .singleAssortmentChart_page .editable_grid .body_colapse tfoot tr td table {
    margin: 0 !important
}

    .singleAssortmentChart_page .editable_grid .body_colapse thead tr th table thead {
        background: transparent !important
    }

        .singleAssortmentChart_page .editable_grid .body_colapse thead tr th table thead th {
            font-size: 11px !important
        }

        .singleAssortmentChart_page .editable_grid .body_colapse thead tr th table thead tr th {
            background: transparent;
            border-bottom: none !important
        }

            .singleAssortmentChart_page .editable_grid .body_colapse thead tr th table thead tr th:first-child {
                border-left: none !important
            }

            .singleAssortmentChart_page .editable_grid .body_colapse thead tr th table thead tr th:last-child {
                border-right: none !important
            }

.singleAssortmentChart_page .body_colapse thead tr th .form-control {
    background-color: transparent;
    text-align: right;
    color: #000;
    border: none;
    font-size: 16px
}

.singleAssortmentChart_page .body_colapse thead tr th:first-child {
    border-left-width: 1px
}

.singleAssortmentChart_page .editable_grid .body_colapse thead tr th:first-child {
    border-left: 1px solid #646464 !important
}

.singleAssortmentChart_page .editable_grid .body_colapse thead tr th:last-child {
    border-right: 1px solid #646464 !important
}

.singleAssortmentChart_page .body_colapse thead tr th.no-border {
    border: none !important
}

.singleAssortmentChart_page .body_colapse thead tr th i.fa {
    cursor: pointer;
    font-size: 11px
}

.singleAssortmentChart_page .body_colapse thead tr:first-child th {
    border: none;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 16px;
    font-family: Verdana Bold !important;
    border-width: 1px !important;
    border-style: solid
}

.singleAssortmentChart_page .body_colapse thead tr th table tr:first-child th {
    font-size: 11px;
    border-top: none !important
}

.singleAssortmentChart_page .editable_grid table tbody tr td table tbody tr {
    background-color: #fff;
    border-bottom: 1px solid #646464 !important
}

    .singleAssortmentChart_page .editable_grid table tbody tr td table tbody tr:nth-of-type(odd) {
        background: #fff
    }

.singleAssortmentChart_page .editable_grid table .editable_grid table tbody tr.collapse_row td table tbody tr td:first-child {
    border-left: none !important
}

.singleAssortmentChart_page .body_colapse tbody tr td {
    height: 19px;
    box-sizing: border-box;
    border-color: #646464 !important;
    border-right: none !important;
    border-left: 1px solid #646464 !important;
    font-size: 11px;
    padding: 0 5px !important
}

.singleAssortmentChart_page .editable_grid tbody tr td {
    padding: 3px 5px !important;
    border-color: #646464 !important
}

.singleAssortmentChart_page .editable_grid .body_colapse tbody tr td table tbody tr td:first-child, .singleAssortmentChart_page .editable_grid .body_colapse tbody tr td table tfoot tr td:first-child {
    border-left: none !important
}

.singleAssortmentChart_page .editable_grid .body_colapse tbody tr td:first-child {
    border-left: 1px solid #646464 !important
}

.singleAssortmentChart_page .body_colapse tbody tr td.no-padding {
    padding: 0 !important
}

.singleAssortmentChart_page .body_colapse tbody tr td.no-border {
    border: none !important
}

.singleAssortmentChart_page .body_colapse tbody {
    border-right: 1px solid #646464 !important
}

    .singleAssortmentChart_page .body_colapse tbody tr td.no-border:last-child {
        border-right: none !important
    }

    .singleAssortmentChart_page .body_colapse tbody tr td.rowspan_div {
        background: #fff;
        text-align: center;
        vertical-align: middle;
        font-weight: 600;
        font-family: Verdana Bold;
        border-bottom: 1px solid #646464 !important;
        line-height: 22px !important
    }

        .singleAssortmentChart_page .body_colapse tbody tr td.rowspan_div i {
            display: inline-block;
            width: auto;
            float: left;
            line-height: 22px;
            color: #000;
            margin-right: 5px;
            cursor: pointer
        }

    .singleAssortmentChart_page .body_colapse tbody tr td.border-bottom {
        border-bottom: 1px solid #9eb8a3 !important
    }

.singleAssortmentChart_page .table-striped > tbody > tr td table tr, .singleAssortmentChart_page table > tbody > tr td table tbody tr:nth-of-type(odd), .singleAssortmentChart_page .editable_grid .table-striped > tbody > tr {
    background-color: #f1f1f1
}

.singleAssortmentChart_page table > tbody > tr:nth-of-type(odd), .singleAssortmentChart_page .table-striped > tbody > tr td table tbody tr, .singleAssortmentChart_page .editable_grid table > tbody > tr:nth-of-type(odd) {
    background-color: #fff
}

.singleAssortmentChart_page .body_colapse tbody tr.total_row td {
    font-family: Verdana Bold;
    font-weight: 600;
    font-size: 12px;
    border-bottom: 1px solid
}

.singleAssortmentChart_page .body_colapse tbody tr td input.form-control {
    color: #000;
    text-align: right
}

.singleAssortmentChart_page .editable_grid table tbody tr td .form-control.activeRow {
    border: 1px solid #aaa;
    line-height: 14px
}

.singleAssortmentChart_page .body_colapse tfoot {
    background: #fff !important;
    color: #303531;
    padding: 8px 3px
}

.singleAssortmentChart_page .editable_grid .body_colapse tfoot tr td table tr td:last-child {
    border-right: none
}

.singleAssortmentChart_page .body_colapse tbody tr td table tfoot {
    padding: 0
}

    .singleAssortmentChart_page .body_colapse tbody tr td table tfoot tr td {
        height: 28px; /*border-bottom:1px solid #9eb8a3!important;*/
        border-top: none
    }

.singleAssortmentChart_page .body_colapse tfoot tr.total_row {
    background: #efefef
}

.singleAssortmentChart_page .body_colapse tfoot tr td {
    height: 32px;
    box-sizing: border-box;
    font-weight: 600;
    font-size: 15px;
    border-color: #646464 !important;
    line-height: 14px;
    border-width: 1px 1px 0 0;
    border-top: none;
    font-family: Verdana Bold !important
}

.singleAssortmentChart_page .editable_grid .table-bordered > tfoot > tr > td {
    padding: 8px 5px
}

    .singleAssortmentChart_page .editable_grid .table-bordered > tfoot > tr > td:last-child {
        border-right: 1px solid #9eb8a3 !important
    }

.singleAssortmentChart_page .body_colapse tfoot tr td:first-child {
    border-left-width: 1px
}

.singleAssortmentChart_page .remark_div textarea {
    min-height: 127px;
    background-color: #f8f8f8
}

.singleAssortmentChart_page col.pics {
    width: 55px
}

.singleAssortmentChart_page col.crts {
    width: 75px
}

.singleAssortmentChart_page table tbody tr.collapse_row tbody {
    display: table-header-group;
    border-right: none !important;
    border-top: 1px solid #9eb8a3
}

.singleAssortmentChart_page table tbody tr.collapse_row > td {
    padding: 0 !important;
    border: none !important
}

    .singleAssortmentChart_page table tbody tr.collapse_row > td:last-child { 
    }

.singleAssortmentChart_page table tbody tr td i.toggle_btn {
    float: left;
    width: auto;
    line-height: 22px;
    margin-right: 8px;
    color: #305637
}

.singleAssortmentChart_page table.noHeader tbody tr { 
    border-bottom: 1px solid #9eb8a3
}

    .singleAssortmentChart_page table.noHeader tbody tr td .form-control {
        color: #000;
        text-align: right
    }

    .singleAssortmentChart_page table.noHeader tbody tr td:first-child {
        background-color: #d6e9d9;
        height: 28px;
        font-size: 13px
    }

.singleAssortmentChart_page table tr td .switch {
    width: 27px;
    height: 13px
}

.singleAssortmentChart_page table tr td input:checked + .slider:before {
    -webkit-transform: translateX(13.5px);
    -ms-transform: translateX(13.5px);
    transform: translateX(13.5px)
}

.singleAssortmentChart_page table tr td input[type="checkbox"]:checked + input[type="hidden"] + .slider:before, .singleAssortmentChart_page table tr td input[type="checkbox"]:checked + .slider:before {
    -webkit-transform: translateX(13.5px);
    -ms-transform: translateX(13.5px);
    transform: translateX(13.5px)
}

.singleAssortmentChart_page table tr td .slider:before {
    height: 10px;
    width: 10px
}

.singleAssortmentChart_page .form-group label.switch {
    margin-top: 0;
    top: -3px
}

.singleAssortmentChart_page .editable_grid table {
    border: 1px solid #8bb192
}
/*=============================== User Management Dashboard End ===============================*/
.dmndSupplySummaryPage .table_div {
    border: 1px solid #646464;
    border-top: none
}

.dmndSupplySummaryPage .lightTheme table {
    border-color: #646464 !important;
    white-space: nowrap;
    width: max-content;
    width: -webkit-max-content;
    width: -moz-max-content;
    max-width: inherit
}

    .dmndSupplySummaryPage .lightTheme table thead tr:last-child th {
        font-size: 13px !important
    }

    .dmndSupplySummaryPage .lightTheme table thead th {
        font-family: Verdana Bold !important
    }

    .dmndSupplySummaryPage .lightTheme table tbody tr td {
        font-size: 14px;
        height: 27px
    }

.content-wrapper {
    height: 100%
}

a.logoDiv {
    width: 100%;
    padding: 0 15px;
    font-size: 18px;
    height: 39px;
    line-height: 40px;
    border-bottom: 1px solid #b6c7cf;
    background-color: rgba(0,0,0,0.1);
    display: block;
    color: #eee;
    position: absolute;
    top: 0
}

    a.logoDiv:hover {
        color: #fff
    }

.lightTheme .tabs-header { 
}

.fixedHead {
    position: absolute;
    top: 0;
    padding: 3px;
    z-index: 8011;
    right: 0;
    background: var(--tab-gradient)
}

    .fixedHead .navbar-nav li a.user_photo, .navbar-nav li a.user_name_div {
        padding: 7px 15px 7px;
        color: #000;
        line-height: 23px
    }

        .fixedHead .navbar-nav li a.user_photo .user-image {
            margin-right: 8px
        }

/*================================= New Theme Start =================================*/
:root {
    /*--light-theme-main-color:#079c7e;*/
    /*--light-theme-main-color:#2FA3E6;*/
    /*--light-theme-main-color:#51a1bf;*/
    --light-theme-main-color: #1ca589;
    /*--tab-color:#72b1b7;*/
    --tab-color: #96afbb;
    /*--tab-gradient:-webkit-gradient(linear,left bottom,left top,color-stop(0,#51a1bf),color-stop(1,#a5d1ea));*/
    /*--tab-gradient: -webkit-gradient(linear,left bottom,left top,color-stop(0,#52ab9f),color-stop(1,#92d8d5));*/
    /*--tab-gradient: linear-gradient( #d8e8ff 0%, #8babbb 100%);*/
    /*--tab-gradient: linear-gradient( #a4d8d3 0%, #49b5aa 100%);*/
    /*--tab-gradient:#bcc8ce;*/
    /*--tab-gradient:#97bfc0;*/
    --tab-gradient: #f8f7f7;
}

.content {
    min-height: auto
}

body.lightTheme, .lightTheme, .lightTheme p, .lightTheme ul, .lightTheme ol, .lightTheme table {
    /*font-family: Verdana;*/
    font-family: var(--font-body-font);
    font-size: 13px;
}

    .lightTheme .content-wrapper {
        border-left: none !important;
        min-height: 100px !important
    }

    .lightTheme .btn.fa, .lightTheme .btn .fa {
        font: normal normal normal 14px/1 FontAwesome
    }

    .lightTheme aside .sidebar-toggle {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        right: -12px;
        width: 24px;
        height: 50px;
        border-radius: 50%;
        line-height: 52px;
        text-align: center;
        background-color: #414e54;
        color: #fff
    }

        .lightTheme aside .sidebar-toggle:hover {
            background-color: #59676d
        }

        .lightTheme aside .sidebar-toggle span {
            margin: 0;
            font-size: 20px !important;
            line-height: 24px !important;
        }

    .lightTheme .tabs-container .tabs-panels {
        border-bottom: none
    }

    .lightTheme .btn-default {
        color: #333;
        background-color: #fff;
        border-color: #646464
    }

    .lightTheme .main-header .logo {
        background-color: #efefef;
        color: var(--light-theme-main-color);
        border-right: 1px solid #e4e4e4;
        border-bottom: 1px solid #e6e5e5
    }

    .lightTheme .main-header .navbar {
        background-color: #f8f7f7;
        border-bottom: 1px solid #e0e0e0
    }

        .lightTheme .main-header .navbar .sidebar-toggle {
            color: #000
        }

    .lightTheme .deshheader {
        /*font-family: Verdana;*/
        font-family: var(--font-body-font);
        font-size: 19px !important
    }

    .lightTheme .main-header .navbar .nav > li > a {
        color: #000
    }

        .lightTheme .main-header .navbar .nav > li > a span {
            text-transform: capitalize
        }

    .lightTheme .main-header li.user-header {
        background-color: #eee;
        height: auto !important
    }

    .lightTheme .main-sidebar, .skin-blue-light .left-side {
        background-color: #2d373c; 
    }

    .lightTheme .sidebar-menu > li > a {
        color: #ddd;
        border-left: 3px solid transparent;
        font-family: inherit;
        padding-left: 10px;
        font-size: 13.5px;
        display: flow-root
    }

        .lightTheme .sidebar-menu > li > a .iconDiv {
            width: 21px;
            height: 21px;
            line-height: 21px;
            border-radius: 4px;
            background-color: var(--light-theme-main-color);
            opacity: 0.85;
            text-align: center;
            float: left;
            margin-right: 10px;
            color: #fff
        }

    .lightTheme .sidebar-menu > li:hover > a, .lightTheme .sidebar-menu > li.active > a {
        color: #fff; 
        background-color: rgba(0,0,0,0.4);
        color: #fff !important
    }

        .lightTheme .sidebar-menu > li:hover > a > .iconDiv {
            transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            transition: all 0.3s ease;
            opacity: 1; 
        }

        .lightTheme .sidebar-menu > li.active > a > .iconDiv {
            background-color: var(--light-theme-main-color);
            color: #fff;
            opacity: 1
        }

    .lightTheme .sidebar-menu > li.active > a {
        border-left-color: var(--light-theme-main-color)
    }

    .lightTheme .sidebar-menu > li > a i {
        font-size: 13px
    }

    .lightTheme .sidebar-menu .treeview-menu > li {
        color: #000000
    }

        .lightTheme .sidebar-menu .treeview-menu > li a {
            color: inherit;
            font-family: inherit;
            font-size: 13px;
            font-weight: 400
        }

        .lightTheme .sidebar-menu .treeview-menu > li:hover {
            color: #fff
        }

    .lightTheme .sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > a > span {
        background-color: inherit
    }

    .lightTheme .sidebar-menu > li > .treeview-menu {
        background: transparent;
    }

    .lightTheme .sidebar-menu > li > .treeview-menu {
    }
    }

    .lightTheme .tab_head {
        color: #222;
        font-family: ProximaNovaLight,ProximaNovaRegular,Arial,sans-serif;
        font-size: 26px;
        line-height: 1.1;
        height: 50px;
        border-bottom: 1px solid #ededed;
        margin-bottom: 15px;
    }

    .lightTheme hr.head_border {
        border-top: 2px solid #bfbebe;
        margin: 15px 0
    }

    .lightTheme .btn_bar {
        background-color: #f8f7f7
    }

    .lightTheme table > tbody > tr:nth-of-type(odd), .lightTheme .table-striped > tbody > tr:nth-of-type(odd), .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-row-even {
        background-color: #fff
    }

    .lightTheme .tabs-header {
        background-color: #fff !important
    }

        .lightTheme .tabs-header .tabs-wrap {
        }

    .lightTheme .tabs-scroller-left, .lightTheme .tabs-scroller-right {
        top: 4.5px !important;
        z-index: 3
    }

    .lightTheme .tabs-wrap ul.tabs {
        padding: 0px 30px 0;
        border-bottom: 1px solid #646464;
        display: flow-root;
        height: auto
    }

        .lightTheme .tabs-wrap ul.tabs:before, .lightTheme .tabs-wrap ul.tabs:after {
            display: table;
            content: ""
        }

        .lightTheme .tabs-wrap ul.tabs:after {
            clear: both
        }
        
        .lightTheme .tabs-wrap ul.tabs li {
            margin-bottom: -1px;
            border: none !important
        }

            .lightTheme .tabs-wrap ul.tabs li a.tabs-inner {
                font-family: inherit !important;
                font-weight: normal;
                font-size: 15px;
                position: relative;
                border: 1px solid transparent;
                line-height: 1.42857143 !important;
                background-color: transparent !important;
                padding: 8px 12px;
                height: auto !important
            }

            .lightTheme .tabs-wrap ul.tabs li.tabs-selected a.tabs-inner {
                color: var(--light-theme-main-color) !important; 
                border: 1px solid #646464;
                border-bottom-color: transparent
            }

                .lightTheme .tabs-wrap ul.tabs li.tabs-selected a.tabs-inner::before {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: -1px;
                    right: -1px;
                    z-index: 0 !important;
                    background: #b3a68a;
                    box-shadow: 3px 1px 4px -1px #000;
                }

            .lightTheme .tabs-wrap ul.tabs li a.tabs-close {
                top: 9px !important;
                right: 20px !important
            }

    .lightTheme.newTab .tabs-header .tabs-wrap {
        padding: 0 20px; /*margin-right:0!important;*/
        margin-left: 0 !important;
        width: 100% !important
    }

    .lightTheme.newTab .tabs-header {
        background: var(--tab-gradient) !important
    }

    .lightTheme.newTab .tabs-wrap ul.tabs {
        background: #f8f7f7;
        background: var(--tab-gradient);
        border-bottom: none;
        padding: 0
    }

    .lightTheme.newTab .tabs-wrap ul::before, .lightTheme.newTab .tabs-wrap ul::after {
        display: table;
        content: ""
    }

    .lightTheme.newTab .tabs-wrap ul::after {
        clear: both
    }

    .lightTheme.newTab .tabs-wrap ul.tabs li {
        margin-right: 10px;
        position: relative;
        display: block
    }

        .lightTheme.newTab .tabs-wrap ul.tabs li a.tabs-inner {
            display: block;
            margin-right: 2px;
            line-height: 1.42857143;
            border: 1px solid transparent;
            border-radius: 4px 4px 0 0;
            position: relative;
            padding: 11px 18px;
            color: #444;
            font-size: 17px;
            z-index: 1;
            background: #f8f7f7 !important;
            background: var(--tab-gradient) !important
        }
        


        .lightTheme.newTab .tabs-wrap ul.tabs li.tabs-selected a.tabs-inner {
            color: #fff !important;
            border: 1px solid transparent; 
            z-index: 2
        }

            .lightTheme.newTab .tabs-wrap ul.tabs li.tabs-selected a.tabs-inner::before {
                border-color: transparent;
                z-index: 0;
                display: block;
                color: #000
            }

            .lightTheme.newTab .tabs-wrap ul.tabs li.tabs-selected a.tabs-inner span:first-child { /*z-index:1;*/
                position: relative;
                background-color: #b3a68a;
                font-family: 'Verdana Bold';
            }

        .lightTheme.newTab .tabs-wrap ul.tabs li a.tabs-close {
            z-index: 2;
            top: 11px !important
        }

            .lightTheme.newTab .tabs-wrap ul.tabs li a.tabs-close:hover {
                background: url(/Assets/images/tabclose.png) no-repeat 2px 2px !important
            }

    .lightTheme table > thead, .lightTheme div.jtable-main-container > table.jtable > thead, .lightTheme .ui-grid-top-panel {
        background: #2d373c !important
    }


    .lightTheme .panelPart .panel_head {
        font-family: inherit !important;
        font-weight: 600;
        font-size: 19px;
        color: #333
    }

    .lightTheme .panelPart .dataTables_scrollHead table thead tr th {
        font-family: inherit;
        font-size: 14px;
        color: #444
    }

    .lightTheme .panelPart .dataTables_scrollBody table tbody tr td {
        font-family: inherit;
        font-size: 14px;
        color: #444;
        font-weight: 400
    }

    .lightTheme .panelPart .dataTables_scrollFoot table tfoot tr td {
        font-family: inherit;
        font-size: 14px;
        color: #444;
        font-weight: 600
    }


    .lightTheme .panelPart.highlightPanel .panel_head {
        color: #fff !important
    }

    .lightTheme ul.code_btn_bar li {
        margin: 5px 3px 10px
    }

        .lightTheme ul.code_btn_bar li a button {
            font-family: Verdana Bold;
            letter-spacing: 0
        }

            .lightTheme ul.code_btn_bar li a button:hover, .date_search_table .btn:hover {
                position: relative
            }

            .lightTheme ul.code_btn_bar li a button[aria-label]:hover:after, .date_search_table .btn[aria-label]:hover:after {
                content: attr(aria-label);
                padding: 0px 8px;
                height: 25px;
                line-height: 23px;
                position: absolute;
                left: 0; 
                bottom: -30px;
                white-space: nowrap;
                z-index: 2;
                background: #fff;
                color: #000;
                border: 1px solid #646464;
                border-radius: 3px;
                box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
                -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
                -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
                -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
                -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
                font-family: Verdana
            }

    .lightTheme table > thead, .lightTheme div.jtable-main-container > table.jtable > thead, .lightTheme .ui-grid-top-panel {
    }

    .lightTheme .ui-grid-header-cell {
        font-family: Verdana Bold;
        line-height: 19px;
        font-size: 13px;
        letter-spacing: 0;
        color: #646464;
        font-weight: normal
    }

        .lightTheme .ui-grid-header-cell .ui-grid-cell-contents {
            font-size: inherit
        }

    .lightThemetable > tbody > tr > td, .table-striped > tbody > tr > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-data-row > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-child-row > td, .lightTheme .ul_grid .ui-grid-row, .lightTheme .ul_grid .ui-grid-row .ui-grid-cell {
        height: 37px;
        box-sizing: border-box
    }

    .lightTheme table > tbody > tr > tr, .lightTheme .table-striped > tbody > tr, .lightTheme div.jtable-main-container > table.jtable > tbody > tr, .lightTheme table > tbody > tr:nth-of-type(even), .lightTheme .table-striped > tbody > tr:nth-of-type(even), .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(even) {
        background-color: #f3f3f3
    }

    .lightTheme .ui-grid-row .ui-grid-cell > div {
        position: relative; 
        height: auto
    }

    .lightTheme .ui-grid-row .ui-grid-cell .displayDataPartWidth2Btn {
        width: calc(100% - 35px)
    }

    .lightTheme a.link_btn {
        font-size: 13px
    }

    .lightTheme table > tfoot, .table > tfoot, .lightTheme div.jtable-main-container table.jtable tfoot, .lightTheme .ui-grid-footer-panel {
        background: #fff!important
    }

        .lightTheme table > tfoot, .table > tfoot td, .lightTheme div.jtable-main-container table.jtable tfoot td, .lightTheme .ui-grid-footer-cell {
            font-size: 13px;
            color: #eee;
            font-weight: normal
        }

    .lightTheme .ui-grid-row:hover, .lightTheme .ui-grid-row:hover, .lightTheme .ui-grid-canvas .ui-grid-row .urgentRow:hover, .lightTheme .ui-grid-canvas .ui-grid-row .sampleRow:hover, .lightTheme .ui-grid-row:hover > .ng-isolate-scope .ui-grid-cell, .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(even):hover > .ng-isolate-scope .ui-grid-cell, .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(odd):hover > .ng-isolate-scope .ui-grid-cell {
        background-color: #e0e0e0 !important
    }


    /*zoho theme start*/
    .lightTheme a.logoDiv {
        background-color: #efefef;
        color: #000;
        border-right: 1px solid #ccc
    }

    .lightTheme .sidebar-menu > li > a {
        color: #bbb
    }

.fixedHead .navbar-nav li.user-menu { /*min-width:170px*/
}

.fixedHead .navbar-nav li a.user_photo, .navbar-nav li a.user_name_div {
    padding-top: 8px
}

.lightTheme .tabs-wrap ul.tabs li {
    margin-bottom: 0
}

.lightTheme.newTab .tabs-wrap ul.tabs li a.tabs-inner {
    margin-right: 0
}

.lightTheme .tabs-wrap ul.tabs li a.tabs-inner::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: -1px;
    font-size: 17px;
    background: rgba(0,0,0,0);
    border-bottom: 0px none;
    border-radius: 25px;
    z-index: -1;
    -webkit-transform-origin-y: 80%;
}

.lightTheme.newTab .tabs-header .tabs-wrap {
    padding: 0
}

.lightTheme.newTab .tabs-wrap ul.tabs {
    border-bottom: 3px solid #b6c7cf;
    padding: 0 0 0 20px
}

.lightTheme.newTab .fixedHead {
    border-bottom: 3px solid #b6c7cf; /*min-width:240px*/
}

.lightTheme ul.code_btn_bar li a button {
    background: #fff !important;
    border: 1px solid #646464
}

    .lightTheme ul.code_btn_bar li a button.all_icon {
        background-image: radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: radial-gradient( circle at top left, #fb8774,#fb8774,#fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -webkit-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -moz-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -ms-radial-gradient( circle, #fb8774, #fb8774, #f2381a 55% ) !important;
        background-image: -o-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        line-height: 35px
    }

    .lightTheme ul.code_btn_bar li a button.on_hand { 
        background-image: radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -webkit-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -moz-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -ms-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important;
        background-image: -o-radial-gradient( circle, #fb8774,#fb8774, #f2381a 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.on_hand i {
            color: #f95647
        }

    .lightTheme ul.code_btn_bar li a button.branch_issue { 
    }

        .lightTheme ul.code_btn_bar li a button.branch_issue i {
            color: #ff99c3
        }

    .lightTheme ul.code_btn_bar li a button.cleaving_issue { 
        border-color: #fcbb17;
        background-color: #fcbb17 !important;
        background-image: radial-gradient( circle at top left, #f8d98e,#f8d98e,#f8d98e,#f8d98e, #fcbb17 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #f8d98e,#f8d98e,#f8d98e,#f8d98e, #fcbb17 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #f8d98e,#f8d98e,#f8d98e,#f8d98e, #fcbb17 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #f8d98e,#f8d98e,#f8d98e,#f8d98e, #fcbb17 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #f8d98e,#f8d98e,#f8d98e,#f8d98e, #fcbb17 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.cleaving_issue i {
            color: #b383ff
        }

    .lightTheme ul.code_btn_bar li a button.cleaving_return { 
        border-color: #2e44dc;
        background-color: #2e44dc !important;
        background-image: radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.cleaving_return i {
            color: #fff;
            font-size: 16px
        }

    .lightTheme ul.code_btn_bar li a button.grading_issue { 
        border-color: #2e44dc;
        background-color: #2e44dc !important;
        background-image: radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #919dec,#919dec,#919dec,#919dec, #2e44dc 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.grading_issue i {
            color: #fff;
            font-size: 16px
        }

    .lightTheme ul.code_btn_bar li a button.grading_return { 
        border-color: #703d4a;
        background-color: #703d4a !important;
        background-image: radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.grading_return i {
            color: #fff;
            font-size: 16px
        }

    .lightTheme ul.code_btn_bar li a button.manufacture_issue { 
        border-color: #703d4a;
        background-color: #703d4a !important;
        background-image: radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #b28e97,#b28e97,#b28e97,#b28e97, #703d4a 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.manufacture_issue i {
            color: #fff;
            font-size: 16px
        }

    .lightTheme ul.code_btn_bar li a button.manufacture_return { 
        border-color: #96d61f;
        background-color: #96d61f !important;
        background-image: radial-gradient( circle at top left, #add75e,#add75e,#add75e,#add75e,#add75e, #96d61f 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #add75e,#add75e,#add75e,#add75e,#add75e, #96d61f 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #add75e,#add75e,#add75e,#add75e,#add75e, #96d61f 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #add75e,#add75e,#add75e,#add75e,#add75e, #96d61f 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #add75e,#add75e,#add75e,#add75e,#add75e, #96d61f 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.manufacture_return i {
            color: #d29292
        }

    .lightTheme ul.code_btn_bar li a button.out_hand { 
        border-color: #979797;
        background-color: #979797 !important;
        background-image: radial-gradient( circle at top left, #d2d2d2,#d2d2d2,#d2d2d2,#d2d2d2, #979797 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #d2d2d2,#d2d2d2,#d2d2d2,#d2d2d2, #979797 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #d2d2d2,#d2d2d2,#d2d2d2,#d2d2d2, #979797 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #d2d2d2,#d2d2d2,#d2d2d2,#d2d2d2, #979797 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #d2d2d2,#d2d2d2,#d2d2d2,#d2d2d2, #979797 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.out_hand i {
            color: #ff9800
        }

    .lightTheme ul.code_btn_bar li a button.sell {
        border-color: #2bab0b;
        color: #000
    }

        .lightTheme ul.code_btn_bar li a button.sell i {
            color: #2bab0b
        }

    .lightTheme ul.code_btn_bar li a button.forSell { 
        border-color: #9c27b0;
        background-color: #9c27b0 !important;
        background-image: radial-gradient( circle at top left, #c973ef,#c973ef,#c973ef,#c973ef, #9c27b0 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #c973ef,#c973ef,#c973ef,#c973ef, #9c27b0 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #c973ef,#c973ef,#c973ef,#c973ef, #9c27b0 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #c973ef,#c973ef,#c973ef,#c973ef, #9c27b0 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #c973ef,#c973ef,#c973ef,#c973ef, #9c27b0 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.forSell i {
            color: #fff;
            font-size: 18px
        }

    .lightTheme ul.code_btn_bar li a button.sold { 
        border-color: #149aa9;
        background-color: #149aa9 !important;
        background-image: radial-gradient( circle at top left, #42d5da,#42d5da,#42d5da,#42d5da, #149aa9 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #42d5da,#42d5da,#42d5da,#42d5da, #149aa9 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #42d5da,#42d5da,#42d5da,#42d5da, #149aa9 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #42d5da,#42d5da,#42d5da,#42d5da, #149aa9 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #42d5da,#42d5da,#42d5da,#42d5da, #149aa9 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.sold i {
            color: #fff;
            font-size: 18px
        }
    
    .lightTheme ul.code_btn_bar li a button.mix_kapan { 
        border-color: #92b1a3;
        background-color: #dfece6 !important;
        line-height: 32px
    }

        .lightTheme ul.code_btn_bar li a button.mix_kapan i { 
            color: #333;
            font-size: 16px
        }

    .lightTheme ul.code_btn_bar li a button.pendding {
        background-color: #e25a8e !important;
        border-color: #dc236a;
        background-image: radial-gradient( circle at top left, #ff7eb0,#fd74a8,#fb73a7,#f974a7, #e25a8e 55% ) !important;
        background-image: -webkit-radial-gradient( circle at top left, #ff7eb0,#ff7eb0,#ff7eb0,#ff7eb0, #ddd 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left, #ff7eb0,#ff7eb0,#ff7eb0,#ff7eb0,#e25a8e 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left, #ff7eb0,#ff7eb0,#ff7eb0,#ff7eb0,#e25a8e 55% ) !important;
        background-image: -o-radial-gradient( circle at top left, #ff7eb0,#ff7eb0,#ff7eb0,#ff7eb0,#e25a8e 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.pendding i {
            color: #fff
        }

    .lightTheme ul.code_btn_bar li a button.completed {
        background-color: #35a78e !important;
        border-color: #35a78e;
        background-image: radial-gradient( circle at top left,#86fbe1,#71F9DB,#75ffe1,#77fde0,#53d6b9 55%) !important;
        background-image: -webkit-radial-gradient( circle at top left,#86fbe1,#71F9DB,#75ffe1,#77fde0,#53d6b9 55% ) !important;
        background-image: -moz-radial-gradient( circle at top left,#86fbe1,#71F9DB,#75ffe1,#77fde0,#53d6b9 55% ) !important;
        background-image: -ms-radial-gradient( circle at top left,#86fbe1,#71F9DB,#75ffe1,#77fde0,#53d6b9 55% ) !important;
        background-image: -o-radial-gradient( circle at top left,#86fbe1,#71F9DB,#75ffe1,#77fde0,#53d6b9 55% ) !important
    }

        .lightTheme ul.code_btn_bar li a button.completed i {
            color: #000
        }



.lightTheme .ui-grid-viewport {
    min-height: 32px
}

.lightTheme aside .sidebar-toggle {
    bottom: 0;
    width: 100%;
    height: 35px;
    line-height: 35px;
    border-radius: 0;
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    top: auto;
    right: auto;
    background: #222b2f
}

    .lightTheme aside .sidebar-toggle:hover {
        background: #3c474c
    }

 /*   .lightTheme aside .sidebar-toggle span {
        font-size: 35px !important
    }*/

.lightTheme .ui-grid-contents-wrapper {
    border: 1px solid #646464
}

.lightTheme .ui-grid-menu-button {
    border-color: #646464 !important
}

.lightTheme .ui-grid-header {
    border-color: #646464 !important
}

.lightTheme table > thead, .lightTheme div.jtable-main-container > table.jtable > thead, .lightTheme .ui-grid-top-panel {
    background: #fff !important;
    border-color: #646464 !important
}

.lightTheme .ui-grid-header-cell {
    color: #222;
    border-color: #646464 !important
}

.lightTheme .ul_grid .ui-grid-row {
    border-bottom: 1px solid #646464 !important
}

.lightTheme .ui-grid-footer-cell .ui-grid-cell-contents {
    line-height: 30px;
    font-weight: bold;
    margin-right: 3px;
    font-family: Verdana Bold
}

.lightTheme table > tbody > tr > tr, .lightTheme .table-striped > tbody > tr, .lightTheme div.jtable-main-container > table.jtable > tbody > tr, .lightTheme table > tbody > tr:nth-of-type(even), .lightTheme .table-striped > tbody > tr:nth-of-type(even), .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(even) {
    background-color: #fff
}

    .lightThemetable > tbody > tr > td, .table-striped > tbody > tr > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-data-row > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-child-row > td, .lightTheme .ul_grid .ui-grid-row {
        height: 32px
    }

        .lightTheme .ul_grid .ui-grid-row .ui-grid-cell {
            height: 31px;
            display: table-cell;
            vertical-align: middle;
            float: none
        }

        .lightTheme .ul_grid .ui-grid-row .ui-grid-cell {
            background: none;
            border-color: #646464 !important
        }

    .lightTheme .ui-grid-row:hover, .lightTheme .ui-grid-row:hover, .lightTheme .ui-grid-canvas .ui-grid-row .urgentRow:hover, .lightTheme .ui-grid-canvas .ui-grid-row .sampleRow:hover, .lightTheme .ui-grid-row:hover > .ng-isolate-scope .ui-grid-cell, .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(even):hover > .ng-isolate-scope .ui-grid-cell, .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(odd):hover > .ng-isolate-scope .ui-grid-cell {
        background-color: #f5f5f5 !important
    }

.lightTheme table > tfoot, .table > tfoot, .lightTheme div.jtable-main-container table.jtable tfoot, .lightTheme .ui-grid-footer-panel {
    font-family: Verdana Bold;
    background-color: #fff;
    border-color: #646464 !important;
    color: #000;
    border-bottom: none
}

.lightTheme .ui-grid-footer-viewport, .lightTheme .ui-grid-footer-canvas {
    height: 100%
}

.lightTheme table > tfoot, .table > tfoot td, .lightTheme div.jtable-main-container table.jtable tfoot td, .lightTheme .ui-grid-footer-cell {
    color: inherit;
    border-color: #646464 !important
}

.lightTheme table {
    border-color: #646464 !important
}

    .lightTheme table > thead > tr > th, .lightTheme .table > thead > tr.info > th, .lightTheme div.jtable-main-container > table.jtable > thead th {
        color: #222 !important;
        border-color: #646464 !important
    }

    .lightTheme table > tbody > tr > td, .lightTheme .table-striped > tbody > tr, .lightTheme div.jtable-main-container > table.jtable > tbody > tr, .lightTheme table > tbody > tr:nth-of-type(even), .lightTheme .table-striped > tbody > tr:nth-of-type(even), .lightTheme .ui-grid-canvas .ui-grid-row:nth-of-type(even) {
        border-bottom: 1px solid #646464 !important
    }

        .lightTheme table > tbody > tr > td, .table-striped > tbody > tr > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-data-row > td, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-child-row > td, .lightTheme .ul_grid .ui-grid-row, .lightTheme .ul_grid .ui-grid-row .ui-grid-cell {
            border-color: #646464 !important
        }

        .lightTheme table tbody tr:hover, .lightTheme .dataTables_scrollBody table tbody tr:hover, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-data-row:hover, .lightTheme table > tbody > tr:nth-of-type(odd):hover, .lightTheme .table-striped > tbody > tr:nth-of-type(odd):hover, .lightTheme div.jtable-main-container > table.jtable > tbody > tr.jtable-row-even:hover, .lightTheme table > tbody > tr:nth-of-type(even):hover, .lightTheme .table-striped > tbody > tr:nth-of-type(even):hover {
            background-color: #f5f5f5
        }

    .lightTheme table tfoot tr td, .lightTheme .dataTables_scrollFoot table tfoot tr td, .lightTheme div.jtable-main-container > table.jtable > tfoot > tr > td {
        color: #000;
        font-weight: bold;
    }

/*================================= New Theme Start =================================*/

/*================================ New Dashboard Start ==============================*/
.allDataDisplayPart .mainSidebarHeadPart {
    margin-top: 88px
}

    .allDataDisplayPart .mainSidebarHeadPart .sideHead {
        font-family: Verdana Bold;
        margin-bottom: 25px;
        width: 100%;
        padding: 0 15px;
        border-width: 1px;
        border-style: solid;
        font-size: 18px;
        color: #fff;
        height: 55px;
        display: table
    }

        .allDataDisplayPart .mainSidebarHeadPart .sideHead.onHandPart { 
            border-color: #4e94c3;
            background: linear-gradient(90deg, #034a4a 0%, #35dbc4 100%)
        }

        .allDataDisplayPart .mainSidebarHeadPart .sideHead.cleavingIssuePart {
            background-color: #16a086;
            border-color: #d53e5f;
            background: linear-gradient(90deg, #f16f33 0%, #c72577 100%)
        }

        .allDataDisplayPart .mainSidebarHeadPart .sideHead.gradingIssuePart {
            background-color: #f1c40f;
            border-color: #3dc0da;
            background: linear-gradient(90deg, #6fecdb 0%, #1299d8 100%)
        }

        .allDataDisplayPart .mainSidebarHeadPart .sideHead.factoryIssuePart {
            background-color: #fe0000;
            border-color: #512c62;
            background: linear-gradient(90deg, #222655 0%, #76306c 100%)
        }

        .allDataDisplayPart .mainSidebarHeadPart .sideHead span {
            display: table-cell;
            vertical-align: middle
        }

    .allDataDisplayPart .mainSidebarHeadPart .grandTotalPart {
        font-family: Verdana Bold;
        padding: 0 15px;
        display: table;
        height: 80px;
        box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
        -webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
        -moz-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
        -ms-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
        -o-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
        width: 100%;
        margin-top: 15px;
        font-size: 22px;
        border: 1px solid #e2e2e2;
        background-color: #f3f3f3
    }

        .allDataDisplayPart .mainSidebarHeadPart .grandTotalPart span {
            display: table-cell;
            vertical-align: middle
        }

.allDataDisplayPart .detailSidePart {
    background-color: #fff;
    border-left: 1px solid #e9e7f1;
    border-top: 1px solid #e9e7f1;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.3)
}

.allDataDisplayPart .partHead {
    text-align: center;
    padding-bottom: 5px;
    border-bottom: 1px solid #ddd;
    font-family: Verdana Bold
}

    .allDataDisplayPart .partHead .mainHead {
        font-size: 21px;
        margin-bottom: 10px;
        margin-top: 10px
    }

    .allDataDisplayPart .partHead .subHead {
        font-size: 13px;
        display: flow-root;
        color: #999
    }

.allDataDisplayPart .detailBox {
    display: flow-root;
    background-color: #f3f3f3
}

    .allDataDisplayPart .detailBox .detailRow {
        height: 80px;
        padding: 15px 0;
        border-bottom: 1px solid #ddd
    }

        .allDataDisplayPart .detailBox .detailRow .allBranchDetail {
            display: flow-root;
            margin-bottom: 5px
        }

        .allDataDisplayPart .detailBox .detailRow hr {
            margin: 0 auto;
            width: 40%;
            border-color: #ccc
        }

        .allDataDisplayPart .detailBox .detailRow .allBranchDetail .branchDetail {
            text-align: center;
            float: left;
            width: 50%;
            padding: 0 10px;
            font-size: 15px
        }

            .allDataDisplayPart .detailBox .detailRow .allBranchDetail .branchDetail:first-child { 
                border-right: 1px solid #aaa
            }

            .allDataDisplayPart .detailBox .detailRow .allBranchDetail .branchDetail:last-child { 
            }

        .allDataDisplayPart .detailBox .detailRow .branchTotal {
            width: 100%;
            padding: 0 10px
        }

            .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar {
                display: flow-root;
                margin-bottom: 2px;
                display: none
            }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar .branchProcess {
                    float: left;
                    height: 2px;
                    line-height: 2px;
                    font-size: 0px;
                    color: #fff;
                    text-align: center
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.onHandProcessBar .branchProcess:first-child {
                    background-color: #034a4a
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.onHandProcessBar .branchProcess:last-child {
                    background-color: #35dbc4
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.cleavingIssueProcessBar .branchProcess:first-child {
                    background-color: #f16f33
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.cleavingIssueProcessBar .branchProcess:last-child {
                    background-color: #c72577
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.gradingIssueProcessBar .branchProcess:first-child {
                    background-color: #6fecdb
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.gradingIssueProcessBar .branchProcess:last-child {
                    background-color: #1299d8
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.factoryIssueProcessBar .branchProcess:first-child {
                    background-color: #222655
                }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .processBar.factoryIssueProcessBar .branchProcess:last-child {
                    background-color: #76306c
                }

            .allDataDisplayPart .detailBox .detailRow .branchTotal .totalBox {
                text-align: right;
                font-size: 18px;
                font-family: Verdana Bold
            }

                .allDataDisplayPart .detailBox .detailRow .branchTotal .totalBox span {
                    font-size: 13px;
                    line-height: 25px;
                    margin-right: 8px;
                    color: #999
                }

.allDataDisplayPart .grandTotalPart {
    box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -moz-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -ms-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    -o-box-shadow: 3px 3px 6px rgba(0,0,0,0.4);
    border: 1px solid #e2e2e2;
    height: 95px;
    margin-top: 20px;
    font-family: Verdana Bold;
    padding: 20px 0
}

    .allDataDisplayPart .grandTotalPart .allBranchDetail {
        display: flow-root;
        margin-bottom: 10px
    }

    .allDataDisplayPart .grandTotalPart hr {
        margin: 0 auto 5px;
        width: 40%;
        border-color: #ddd
    }

    .allDataDisplayPart .grandTotalPart .allBranchDetail .branchDetail {
        text-align: center;
        float: left;
        width: 50%;
        padding: 0 10px;
        font-size: 15px
    }

        .allDataDisplayPart .grandTotalPart .allBranchDetail .branchDetail:first-child {
            border-right: 1px solid #ddd
        }

    .allDataDisplayPart .grandTotalPart .branchTotal {
        width: 100%;
        padding: 0 10px;
        font-size: 19px;
        text-align: center
    }

        .allDataDisplayPart .grandTotalPart .branchTotal span {
            margin-right: 8px;
            color: #999;
            font-size: 14px
        }

.mainDashboard .dprt_wise_div.second_box {
    margin-bottom: 10px
}

.mainDashboard .color_sugetion .a .box_div {
    border-color: #0c635f;
    background-color: rgba(12,99,95,0.7)
}

.mainDashboard .color_sugetion .b .box_div {
    border-color: #c82776;
    background-color: rgba(200,39,118,0.7)
}

.mainDashboard .color_sugetion .c .box_div {
    border-color: #69e7da;
    background-color: rgba(105,231,218,0.7)
}

.mainDashboard .color_sugetion .d .box_div {
    border-color: #32285a;
    background-color: rgba(50,40,90,0.7)
}
/*================================= New Dashboard End ===============================*/

@media(min-width:1200px) { 
}

@media(min-width:1200px) and (max-width:1245px) {
    .kapan_creation_btn_bar .btn {
        font-size: 12px
    }
}

@media(max-width:1560px) { 
}

@media(max-width:1255px) {
    .popup_div .kapanSplit_form {
        width: 500px
    }

        .popup_div .kapanSplit_form .small_box_top_section .form-group {
            width: 50%
        }

    .popup_div .small_box_col.disable_div.first_col {
        width: 100%;
        margin-bottom: 10px;
        margin-left: 0
    }

    .popup_div .small_box_col.disable_div.second_col {
        width: 100%;
        margin-left: 0
    }

    .popup_div .small_box_col.disable_div .form-group {
        width: 50%;
        float: left;
        margin: 0;
        margin-bottom: 6px
    }
}

@media(max-width:1200px) {
    .kapan_creation_btn_bar .btn {
        margin-bottom: 15px
    }
}

@media(max-width:850px) {
    .dprt_wise_div .small-box-size .head_cont {
        font-size: 13px
    }

    .dprt_wise_div .small-box-size .coCont_div {
        font-size: 14px
    }
}

@media(max-width:767px) {
    .top_btn_serch .all_select_box input {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle
    }

    .top_btn_serch .all_select_box .form-group {
        margin-bottom: 0
    }

    .branchTransferBtn_bar {
        margin-top: 126px
    }

    .lightTheme aside .sidebar-toggle {
        top: 0;
        left: 100%;
        width: 20px;
        height: 27px;
        line-height: 25px;
        border-radius: 0 100% 100% 0;
        text-align: left;
        padding-left: 4px
    }

        .lightTheme aside .sidebar-toggle span {
            font-size: 24px !important;
            line-height: 25px !important
        }
}

@media(max-width:760px) {
    .userMasterPage .box_div .form-group .input_box_div .switch_div {
        width: 100%;
        margin-bottom: 12px
    }

    .userMasterPage .box_div .form-group .input_box_div .hide_div {
        float: none;
        width: 100%;
        clear: both
    }
}

@media(max-width:650px) {
    .userMasterPage .box_div .form-group .input_box_div .input_div {
        width: 100%;
        margin-bottom: 15px
    }
}

@media(max-width:600px) {
    .color_sugetion .a, .color_sugetion .b, .color_sugetion .c, .color_sugetion .d, .color_sugetion .e, .color_sugetion .f {
        width: 33.33%;
        margin: 3px 0
    }

    .popup_div .kapanSplit_form {
        width: 280px
    }

        .popup_div .kapanSplit_form .small_box_top_section .form-group, .popup_div .small_box_col.disable_div .form-group, .popup_div .small_box_col.disable_div.second_col .form-group {
            width: 100%;
            float: none
        }

    .popup_div .note_col {
        width: 100%
    }

    .top_btn_serch .col-xs-4, .top_btn_serch .col-xs-8 {
        float: none;
        width: 100%
    }

    .top_btn_serch .search_bar {
        float: left
    }
}

@media(max-width:500px) {
    .popup_div .edit_sub_kapan_head_row .sub_kapan_div {
        float: none;
        margin-bottom: 3px
    }

    .popup_div .edit_sub_kapan_head_row .remain_cart_div {
        float: none;
        margin-bottom: 3px
    }

    .branchTransferBtn_bar {
        margin-top: 140px
    }
}

@media(max-width:420px) {
    .top_btn_serch .search_bar {
        width: 100%
    }

        .top_btn_serch .search_bar input {
            width: calc(100% - 35px)
        }
}

@media(max-width:325px) {
    .popup_div .popup_body.edit_sub_kapan {
        padding: 10px
    }

    .top_btn_serch .search_bar input {
        width: 100%
    }

    .top_btn_serch .search_bar button {
        margin-top: 10px;
        float: left
    }
}
