body {
}

a {
    text-decoration: none;
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/Materialicons.woff2')format('woff2')
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
}

.navtop {
    background: var(--color-main);
    margin: 0;
    height: 48px;
    border-radius: 0px;
    position: fixed;
    width: 100%;
    z-index: 999;
    border: none;
}

    .navtop .navbar-brand {
        color: #fff;
        font-size: 24px;
        text-shadow: none;
        padding-top: 10px;
        padding-bottom: 10px;
        height: auto;
    }

.sortTime {
    cursor: pointer;
    position: relative;
}

.boxLeft {
    margin-bottom: 0px;
    position: relative;
    clear: both;
}

    .boxLeft .showhideicon {
        font-size: 1rem;
        position: absolute;
        top: 0;
        height: 30px;
        width: 15px;
        text-align: center;
        right: 10px;
        line-height: 30px;
        outline: none !important;
        color: var(--color-main);
    }

.op-filter-title {
    background: var(--color-filter-left);
    border-top: 1px solid var(--color-filter-left);
    border-bottom: 1px solid var(--color-filter-left);
    font-size: 1rem;
    font-weight: bold;
    padding: 7px 2px 8px 10px;
    margin: 0px;
    color: black;
}

.op-filter-container {
    float: left;
    width: 100%;
    padding: 10px;
    background: white;
}

.w100 {
    width: 100% !important;
}

.menuCheckbox, .menuRadio {
    display: block;
}

    .menuCheckbox ul, .menuRadio ul {
        list-style-type: none;
    }

.op-filter-container .treeview {
    list-style-type: none;
}

.fa-info-circle:hover {
    color: #478d00;
}

.fa-info-circle {
    color: #c8c8c8;
}

.tooltip.right > .tooltip-arrow {
    border-right: 5px solid #478d00;
}

.tooltip > .tooltip-inner {
    background-color: #fff;
    border: 1px solid #478d00;
    padding: 5px;
    color: #000;
    width: 200px;
}

.nav-tabs > li > span {
    display: none;
    cursor: pointer;
    position: absolute;
    right: 6px;
    top: 8px;
    color: red;
}

.nav-tabs > li:hover > span {
    display: inline-block;
}

.ss-show {
    display: inline-block;
}

.ss-hide {
    display: none;
}

.ss ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.dash ul li {
    position: relative;
    color: #58595b;
    font-size: 1rem;
    padding-left: 40px;
    text-align: left;
    display: inline-block;
    height: auto;
    min-width: 23%;
    vertical-align: middle;
    min-height: 72px;
    white-space: nowrap;
}

    .dash ul li .dash_icon {
        display: inline-block;
        width: 30px;
        height: 30px;
        margin: 0;
        position: absolute;
        top: 19px;
        left: 0;
        text-align: center;
        border-radius: 100%;
        color: #fff;
        line-height: 30px;
    }

    .dash ul li .dash_title {
        font-size: 1rem;
        color: #58595b;
        margin: 0;
        font-weight: 400;
    }

    .dash ul li span {
        display: block;
        font-size: 25px;
        line-height: 30px;
        color: #32b7b3;
    }

.popover {
    max-width: 600px;
}

    .popover .no-padding {
        padding: 0px;
    }

.parent-price_1 {
    height: 54px;
    top: -4px;
    left: -214px;
}

html, body {
    height: 100%
}

body {
    font-size: 1rem;
    background: #fff
}

*, ul, li {
    list-style: none;
    margin: 0;
    padding: 0
}

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

.list-search .img-search {
    width: 60px;
    position: relative;
    border-radius: 10px
}
/*.btn-sao-chep {
    background: var(--color-sao-chep) !important
}*/
/*.btn-sao-chep:hover {
        background: var(--color-sao-chep-hover) !important
    }*/
.span-label {
    color: #999;
    position: absolute;
    top: 15px;
    font-size: 10px
}

.form-check {
    float: left
}

.form-check-input {
    /*margin: 0 !important;*/
    float: left;
    line-height: 24px !important;
    position: relative;
    text-align: center;
}

.form-check-label {
    padding-left: 5px;
}

.icon-title {
    position: absolute;
    top: 7px;
    right: 0
}

    .icon-title i {
        font-size: 16px
    }

.list-search .detail-search {
    padding-left: 0
}

.pa11 {
    padding-left: 7px
}

.btn-modal-file {
    padding-left: 325px;
    margin-bottom: 30px;
    width: 80px
}

.btn-w100{
    width: 100px;
}

.status-green{
    color: white !important;
    background-color:green !important;
}
.status-red {
    color: white !important;
    background-color: red !important;
}

.margin-botton-15 {
    margin-bottom: 15px
}

.Trinhpv-hovver:hover {
    color: #0094ff
}

.thongtin {
    float: left;
    width: 100%;
    margin-top: 20px
}

.add-icon-date input {
    padding-right: 30px
}

.add-icon-date:after {
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    bottom: 3px;
    right: 7px;
    font-size: 18px;
    top: 3px;
    content: '\f073';
    color: #686868;
    height: 24px;
    line-height: 24px;
}

.money-price-tabs {
    position: absolute;
    top: 15px;
    right: 0;
    width: calc(100% - 250px) !important;
    font-weight: 700
}

.total-money-tabs {
    width: calc(100% - 250px) !important;
    float: right !important
}

.group-add-new-user .form-group label {
    float: left;
    width: 130px;
    line-height: 25px
}

.radio-button-leff p {
    padding-top: 3px !important
}

.icon-search-input {
    position: absolute;
    top: 9px;
    right: 0;
    width: 25px
}

.btn-combobox {
    position: absolute;
    width: 30px;
    top: 0;
    right: 0;
    height: 30px;
    background: #d2d3d5;
    border: none
}

.input-combobox {
    padding-right: 30px
}

.staff-add-new {
    border: 1px solid var(--color-primary);
    margin-bottom: 15px !important
}

.tab-news .nav-tabs {
    border-bottom: 1px solid #32b7b3 !important
}

    .tab-news .nav-tabs li a {
        padding: 10px 15px !important;
        margin-right: 0;
        font-weight: 700
    }

.row-combobox {
    height: 195px
}

.search-result-combobox {
    position: fixed;
    padding: 6px;
    background: #fff;
    border-bottom: 1px dotted #ccc
}

    .search-result-combobox .form-control {
        padding: 5px 8px
    }

.row-combobox ul {
    padding-top: 45px
}

.tab-news li.active {
    border-top: 1px solid #32b7b3 !important;
    border-left: 1px solid #32b7b3 !important;
    border-right: 1px solid #32b7b3 !important;
    border-bottom: none !important
}

    .tab-news li.active a {
        color: #32b7b3 !important
    }

.form-radio span label {
    width: 70px !important
}

.nhom-khach-hang {
    background: #e6e7e8;
    margin-top: 20px
}

    .nhom-khach-hang .form-group {
        padding: 0px !important
    }

        .nhom-khach-hang .form-group .title-radio {
            width: 340px
        }

        .nhom-khach-hang .form-group .form-radio {
            width: auto !important;
            float: right;
            font-weight: 400;
            line-height: 30px
        }

.staff-add-new h4 {
    margin-top: 0;
    font-weight: 700;
    font-size: 16px;
    line-height: 50px;
    padding-left: 12px;
    background: var(--color-title-edit);
}

.header-add-new {
    padding: 15px;
    line-height: 24px;
    margin-top: 0;
    font-weight: 700;
    font-size: 16px;
    /* line-height: 50px; */
    padding-left: 12px;
    background: var(--color-title-edit);
    display: flex;
    justify-content: space-around;
    justify-content: space-between;
}

    .header-add-new h4 {
        line-height: normal;
        /* margin: 3px; */
        font-weight: 700;
        padding: 3px;
        line-height: 24px;
        margin-bottom: 0;
        background: none;
    }

    .header-add-new .pull-right {
        margin-right: 45px
    }

.tree-edit-row .title-tree {
    width: 100%
}

.content-tree {
    width: 100%;
    float: left
}

.title-tree {
    margin-top: 0;
    font-weight: 700;
    font-size: 16px;
    line-height: 30px !important;
    padding-left: 12px;
    padding-right: 30px;
    background: var(--color-title-edit)
}

    .title-tree a {
        position: absolute;
        right: 25px;
        top: 0
    }

    .title-tree label {
        margin-bottom: 0px !important
    }

.staff-add-new h5 {
    font-weight: 700;
    background: #d6d6d6;
    line-height: 24px;
    padding: 3px 7px 3px 25px;
    padding-left: 25px;
    color: black;
    margin-bottom: 15px;
    font-size: 1rem;
}

.group-add-new-user .form-group input {
    float: left
}

.header-report_Tr .dropdown-list ul li label {
    text-align: left
}

.checkbox-loaihang-report ul {
    padding-left: 20px
}

.table-img-user tbody tr:hover td button {
    background: #eaf8f7 !important
}

.col-50 {
    float: left;
    width: 50%
}

.btn-work {
    background: #d1d2d3;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important
}

.label-texarea {
    font-weight: bold !important
}

.detail-label-input label {
    width: 82px;
    padding: 0;
    line-height: 30px
}

.table-new thead tr th a {
    color: #000
}

.table-wh {
    float: left
}

.input-add-btn {
    padding-right: 40px
}

.input-add-select {
    padding-right: 75px
}

.select-add-input {
    position: absolute;
    width: 86px;
    right: 0;
    top: 0
}

.btn-add-button {
    position: absolute;
    right: 0;
    top: 0
}

.form-wrap-bg {
    float: left;
    width: 60%
}

.selected-form-filter {
    width: 152px
}

.tab-pane .table-reponsive table tbody tr {
    border-bottom: 1px solid #ccc
}

.daterangepicker.opensright:before {
    left: -14px !important
}

.daterangepicker.opensright:after {
    left: -12px !important
}

.header-report {
    padding: 0 0 0 0
}

.header-report_Tr {
    padding: 13px 0 0 0
}

.TrinhpvTop:before {
    top: 16px !important;
    border-bottom: 7px solid transparent !important;
    border-top: 7px solid transparent !important;
    border-right: 7px solid #ccc !important
}

.TrinhpvTop:after {
    top: 16px !important;
    border-top: 6px solid transparent !important;
    border-right: 6px solid #fff !important;
    border-bottom: 6px solid transparent !important
}

.TrinhpvCenter:before {
    top: 164px !important;
    border-bottom: 7px solid transparent !important;
    border-top: 7px solid transparent !important;
    border-right: 7px solid #ccc !important
}

.TrinhpvCenter:after {
    top: 164px !important;
    border-top: 6px solid transparent !important;
    border-right: 6px solid #fff !important;
    border-bottom: 6px solid transparent !important
}

.TrinhpvBotton:before {
    top: 310px !important;
    border-bottom: 7px solid transparent !important;
    border-top: 7px solid transparent !important;
    border-right: 7px solid #ccc !important
}

.TrinhpvBotton:after {
    top: 310px !important;
    border-top: 6px solid transparent !important;
    border-right: 6px solid #fff !important;
    border-bottom: 6px solid transparent !important
}

.w120 {
    width: 120px
}

.floatleft {
    float: left;
    width: 100% !important
}

.gb {
    border: 1px solid var(--color-primary) !important;
    background-color: var(--color-primary) !important;
    color: white !important
}

.dropdown-list .checkbox {
    margin: 0
}

.dropdown-list {
    position: absolute;
    width: 170px;
    top: 33px;
    border: 1px solid #ccc;
    background: #fff;
    z-index: 10;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    border-radius: 4px;
    display: none;
    z-index: 9999
}

.information {
    background: #fff;
    position: relative
}

    .information table {
        width: 100%;
        border: 1px solid #e9e9e9
    }

.cashier .header .slide-auto .nav-tabs > li.active > a {
    background: white !important;
    color: #0779a9 !important
}

#showseach a {
    color: #000
}

.content-report {
    padding: 0;
}

.title {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    margin-top: 14px
}

.menuRadio .last .seleted-page {
    border: 1px solid #ccc;
    width: 25%;
    min-width: 107px;
}

@media screen and (max-width:991px) {
    .menuRadio .last .seleted-page {
        min-width: 82px;
    }
}

.header-filter {
    width: 100%;
    float: left;
    margin: 14px 0 14px 0
}

.no-magrin {
    margin: 0px !important
}

.input-search-filter input {
    width: 65%;
    float: right;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.body-content {
    padding-top: 5px
}

.btn-search-modal-icon {
    position: absolute;
    width: 36px;
    height: 30px;
    background: var(--color-button);
    border: none;
    right: 0;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    color: #fff
}

    .btn-search-modal-icon i {
        position: absolute;
        top: 0;
        right: 12px;
        line-height: 30px;
        font-size: 16px;
        color: #fff
    }

.input-search-modal-icon {
    padding-right: 40px
}

.input-search-filter .btn-search-icon {
    width: 36px;
    float: right;
    height: 30px;
    background: var(--color-button);
    border: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    margin-right: 6px;
    color: #fff
}

    .input-search-filter .btn-search-icon i {
        position: absolute;
        top: 0;
        right: 16px;
        line-height: 30px;
        font-size: 16px;
        color: #fff
    }

.input-search-filter .form-control {
    border-right: none
}

.text-search-filter .sum-prduct {
    line-height: 25px;
    font-weight: 700;
    font-size: 15px;
    padding: 0px !important
}

tr td {
    padding: 3px
}

.table-res th, .table-reponsive1 th, .table-reponsive table tr th {
    padding: 3px 5px;
    background: var(--color-table);
    position: relative;
}

.table-res table thead tr th {
    color: #000;
}

.information ul li {
    position: absolute;
    top: 0;
    background: #fff;
    left: 0;
    width: 100%;
    display: none
}

.showhideicon .fa-chevron-circle-up {
    display: none
}

.boxLeft .showhideicon i {
    float: right;
    top: 14px;
    line-height: 28px
}

.callprice {
    border-radius: 3px;
    display: none;
    position: absolute !important;
    top: 46px;
    padding: 10px;
    border: 1px solid var(--color-primary) !important;
    right: 31%;
    background: #fff;
    z-index: 2;
}

    .callprice::before {
        border-bottom: 10px solid var(--color-primary);
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        top: -17px !important;
        right: 20px;
        margin: 0;
        border-top: 7px solid transparent;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

    .callprice::after {
        border-bottom: 7px solid #fff;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        top: -13px !important;
        right: 22px;
        border-top: 6px solid transparent;
        margin: 0;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

.total-money .sum-prduct {
    font-weight: 700;
    line-height: 18px;
    margin-bottom: 5px;
    padding: 3px;
}

.callprice-left {
    float: left;
    width: 30%;
    z-index: 10
}

#saleMenuRight {
    cursor: pointer;
    height: 30px
}

.callprice-right {
    float: left;
    width: 70%
}

    .callprice-right select {
        width: 111px;
        height: 30px;
        float: left
    }

.minus, .plus {
    float: left;
    cursor: pointer;
    min-width: 30px;
    text-align: center;
    line-height: 28px;
    vertical-align: top;
    font-weight: 700;
    margin-left: 1px;
    border-radius: 2px;
    margin-left: 5px;
    font-size: 11px;
    border: none;
    padding: 3px 5px;
    line-height: 24px;
}

.modal {
    z-index: 9999
}

#dropdown-list-two, .dropdown-list-two {
    width: 380px
}

.dropdown-left {
    border-right: 1px solid #ccc;
    padding: 0
}

.dropdown-right {
    padding: 0
}

.col-50 {
    float: left;
    width: 50%
}

.callprice-right .plus {
    border: 1px solid #747474;
    color: #747474
}

    .callprice-right .plus gb {
        color: #32b7b3 !important
    }

.callprice-right .minus {
    color: #fff
}

.cantrol {
    border-radius: 3px;
    padding: 6px 10px;
    background: var(--color-main);
    color: #fff
}

table {
    width: 100%
}

.callprice-discount .number-price {
    width: 150px
}

.callprice-discount {
    left: -100px;
    width: 258px
}

    .callprice-discount .plus {
        width: 28px
    }

.inner-50 {
    padding-left: 18px
}

.callprice-discount .notifi label {
    white-space: initial !important;
    line-height: 20px
}

.number-price {
    width: 85px;
    float: left;
    height: 30px
}

.callprice-right input {
    float: left;
    margin-right: 5px;
    margin-top: 0
}

.notifi {
    margin-bottom: 10px;
    font-size: 1rem;
    font-weight: 400;
    padding-top: 15px
}

    .notifi label {
        font-weight: 400
    }

#tatcanhh a {
    display: none;
    padding-right: 11px;
    float: right;
    font-size: 17px;
    padding-right: 9px
}

#tatcanhh:hover a {
    display: block !important;
    color: #35a8d9
}

.treeview li .fa-pencil-square-o, .treeview li .fa-share {
    display: none;
    float: right;
    font-size: 17px;
    position: absolute;
    right: 5px;
    top: 6px
}

.treeview li .li-oo .square i {
    right: -6px !important
}

.treeview li .fa-share {
    display: none;
    float: right;
    font-size: 17px;
    position: absolute;
    right: 10px;
    top: 6px
}

.add-goods {
    font-size: 1rem
}

.treeview .li-oo:hover i {
    display: block;
    color: #38b8e6 !important
}

.treeview .open .li-top:hover .fa-pencil-square-o, .treeview .open .li-top:hover .fa-share {
    display: block;
    color: #38b8e6 !important
}

.treeview li:hover ul .fa-pencil-square-o, .treeview li:hover ul .fa-share {
    display: none;
    color: #38b8e6 !important
}

.ss-li .li-top {
    line-height: 30px;
    width: 100%;
    float: left
}

.treeview li div {
    padding: 0 10px 0 16px
}

.title-name {
    font-size: 18px;
    font-weight: bold;
    color: var(--color-main);
    line-height: 24px;
    height: 30px;
    padding: 3px 7px;
    margin: 0;
    margin: 5px;
}

.img-product img {
    width: 100%;
    height: 100%
}

.img-product {
    margin: 30px 20px 15px 0;
    border: 1px dashed #ccc
}

.detail-content .form-group {
    border-bottom: 1px solid #ccc
}

.detail-content .form-group {
    margin: 0;
    min-height: 30px;
    padding: 3px 0
}

.detail-content label {
    font-weight: 400;
    min-width: 100px;
    line-height: 24px;
    margin: 0;
}

.name-product_date {
    margin-top: 6px;
    margin-bottom: 6px
}

.name-product {
    line-height: 24px;
    padding: 3px;
    white-space: unset;
}

.detail-content .name-product {
    max-width: calc(100% - 95px);
}

.op-js-tr-hide1, .op-js-tr-hide {
    display: none
}

.group-btn {
    padding: 15px 0 10px 7px
}

.btn-updata i {
    padding-right: 4px
}

.seach-warehouse .fa-search {
    position: absolute;
    line-height: 30px;
    left: 10px;
    color: #6f7072
}

.btn-updata {
    margin-left: 5px;
    z-index: 0;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 5px 14px;
    white-space: nowrap;
    border: none;
    vertical-align: baseline;
    position: relative;
    cursor: pointer;
    height: 30px;
    border-radius: 2px
}

.btn-nhap-file {
    width: 80px;
    height: 80px;
    margin-top: -15px;
    border-radius: 50px
}

.btn-code {
    background: #c6a06e
}

.bg-gray td {
    background: #e6e6e6 !important
}

.btn-business {
    background: #cc4f5b
}

.d {
    display: none
}

.ac {
    display: table-row;
    white-space: inherit !important
}

.active-border {
    border: 1px solid #d1d2d9 !important
}

.sum-prduct {
    padding-top: 0;
    margin-bottom: 5px;
    line-height: 18px;
    padding: 3px;
}

.title-warehouse {
    float: left;
    margin-right: 20px;
    margin-top: 20px
}

    .title-warehouse h3 {
        padding: 0;
        margin: 0;
        line-height: 30px;
        font-weight: 700
    }

.seach-warehouse {
    width: 100%;
    max-width: 460px;
    /* margin: 7px 0; */
    width: 100%;
    position: relative;
}

    .seach-warehouse input {
        font-size: 1rem;
        padding-left: 30px
    }

    .seach-warehouse .btn-b {
        position: absolute;
        top: 1px;
        right: 0;
        height: 28px;
        line-height: 15px
    }

.detail-warehouse {
    margin-top: 15px;
    margin-bottom: 20px
}

.price-pay-end {
    padding: 6px 3px !important;
    background: #ddf7f5;
    color: #000;
    border: none;
    outline: none
}

#modalContainer_delete .modal-body {
    padding: 25px 25px 5px 25px
}

#modalContainer_import .modal-body {
    padding: 25px 25px 5px 25px
}

#modalContainer_importHH .modal-body {
    padding: 25px 25px 5px 25px
}

#modalpopup_selectImport {
    /*  padding: 95px 25px 5px 0*/
}

.modal-smTr {
    width: 600px;
    margin: 30px auto
}

.title-infor {
    border-bottom: 1px solid #14a1d4;
    line-height: 30px
}

    .title-infor div {
        height: 30px;
        background: #14a1d4;
        color: #fff;
        width: 72px;
        text-align: center;
        line-height: 30px
    }

.form-news {
    width: calc(100% - 130px);
    font-weight: 400;
    float: left;
    line-height: 30px;
    position: relative
}

    .form-news > img[src='/Content/images/icon/ngaysinh.png'], .form-wrap > img[src='/Content/images/icon/ngaysinh.png'], .form-wrap > i.fa.fa-calendar {
        position: absolute;
        right: 7px;
        z-index: 9999;
        top: 7px;
    }

.footer-right, .form-wrap, .detail-infor label {
    width: 60%;
    font-weight: 400;
    float: left;
    line-height: 30px
}

.input-price-change {
    border: 0px !important;
    border-bottom: 1px solid #ccc !important;
    border-radius: 0;
    text-align: right;
    box-shadow: none !important
}

.span-number-price {
    text-align: right;
    padding-right: 10px
}

.right-content-infor {
    background: #fff;
    padding: 0 15px;
    float: left
}

.img-producthh {
    width: 193px;
    height: 193px;
}

.img-product-border {
    height: 180px;
    width: 200px;
    background: #fff;
    margin: auto;
    /* margin-top: 15px; */
    padding: 2px;
    border: 1px dotted #ccc;
    border-radius: 5px;
    object-fit: scale-down;
}

    .img-product-border img {
        height: 100%;
        width: 99%
    }

.table-reponsive {
    width: 100%;
    position: static;
    overflow: auto
}

.money-del {
    float: left
}

.table_h {
    overflow: auto
}

table th {
    white-space: nowrap
}

.table-white-space td {
    white-space: nowrap !important;
    position: relative
}

table td {
    white-space: nowrap !important;
    position: relative;
    font-size: 1rem;
    line-height: 24px;
}

table td {
    white-space: nowrap !important;
    position: relative;
    font-size: 1rem;
    line-height: 24px;
    padding: 3px 5px;
}

.hidden-over {
    width: 100%
}

.scroll-table {
    overflow-x: auto;
    width: 100%
}

.op-object-detail {
    box-sizing: border-box;
    border: none;
    background: #fff;
    margin: 0;
    overflow: visible;
    float: left;
    width: 100%;
    border: 1px solid var(--color-primary);
    font-size: 1rem
}

    .op-object-detail.nav-tabs {
        background: #e6e6e6
    }

#table-reponsivetr table thead tr th {
    height: 30px;
    line-height: 30px;
    background: #d6f1f0;
    border-bottom: 2px solid #ddd
}

#table-reponsivetr table tbody tr td {
    border-bottom: 1px solid #ddd;
    padding: 0;
    height: 30px
}

.PhanQuyen tr td {
    background: #F2EED6;
    color: black !important
}

.Report_Empty tr td, .Report_Empty tr td:hover, .Report_Empty tr:hover td {
    background: #F2EED6 !important;
    color: black !important
}

.table-reponsive .Report_Empty tr td, .table-reponsive .Report_Empty tr td:hover, .table-reponsive .Report_Empty tr:hover td {
    background: #F2EED6 !important;
    color: black !important
}

#table-reponsivetr tfoot tr td {
    background: #f3deb7;
    color: black !important
}

.itemCenter {
    text-align: center !important
}

.itemLeft {
    text-align: left !important
}

.itemRight {
    text-align: right !important
}

table {
    border-collapse: collapse;
    color: black !important
}

.nameChiNhanhTr {
    margin-top: 10px;
    margin-bottom: 10px
}

#hedearprinttr {
    font-size: 15px
}

.tablehide_tr table {
    margin-left: 20px;
}

#tablehide_tr tbody tr td {
    color: black !important;
    border-bottom: 1px solid #ddd !important
}

.tablehide_tr table thead tr th {
    height: 30px;
    line-height: 30px;
    background: #d1edbe !important
}

.hi {
    display: none
}

.detail-contentt textarea {
    outline: none;
    border: none
}

.op-object-detailul {
    margin-bottom: 20px
}

.add-dk {
    background: var(--color-primary);
    color: #fff !important;
    border: 1px solid #dadada;
    font-size: 1rem;
    padding: 3px 20px;
    vertical-align: middle;
    border-radius: 2px;
    margin-top: 10px;
    float: left
}

.inner-setup {
    padding-top: 8px;
    padding-bottom: 5px
}

.border-dashed {
    border-bottom: 1px dashed #ccc
}

.add-form .inner-setup {
    padding-bottom: 5px
}

.op-object-detail {
    float: left;
}

.detail-content {
    padding-bottom: 25px
}

.form-group {
    position: relative;
    display: flex;
    align-items: flex-start
}

.modal-body label {
    float: left;
    margin-bottom: 0;
    line-height: 24px !important;
    text-align: left !important
}

.modal-body .op-form-lable {
    width: 130px;
}

.modal-bodyTR label {
    float: left;
    width: 100%;
    margin-bottom: 0;
    line-height: 30px !important;
    text-align: left !important
}

.modal-body {
    position: relative;
    background: #fff;
    width: 100%;
    /*max-height: calc(100vh - 150px);*/
    display: inline-block;
}

.modal-body-scroll {
    overflow-x: hidden;
    overflow-y: auto;
}

.modal-body.scrollable {
    overflow-y: auto;
}

.red {
    color: red
}

.modal-header {
    background: var(--color-main);
    color: #fff;
    font-weight: 700
}

.form-wrap {
    position: relative
}

.iptBtn {
    position: absolute;
    background: var(--color-primary);
    border: none;
    border-left: 1px solid #ccc;
    width: 32px;
    text-align: center;
    color: #fff;
    line-height: 28px;
    border-radius: 0 3px 3px 0;
    float: left;
    top: 1px;
    right: 1px;
    height: 28px
}

.modal-dialog-small {
    width: 500px;
    margin: 85px auto
}

.table-res tr td, .table-reponsive tr td {
    border-top: 1px solid #ccc;
    font-size: 1rem;
    position: relative
}

.border-none tr {
    border-top: none;
    border-right: none;
    border-left: none
}

.close-li {
    display: none
}

.modal-kh {
    width: 900px
}

.k-button {
    overflow: hidden
}

.iptBtn i {
    position: absolute;
    top: 0;
    right: 9px;
    line-height: 28px;
    font-size: 16px;
    color: #fff
}

.img-list {
    width: 160px;
    height: 140px
}

    .img-list img {
        width: 100%;
        height: 100%;
        float: left
    }

.title-kh {
    padding-top: 20px;
    font-size: 15px;
    font-weight: 700;
    padding-left: 30px
}

.header-tab {
    margin-bottom: 10px
}

    .header-tab ul li {
        float: left;
        margin-left: 65px;
        text-align: right;
        font-size: 16px;
        font-weight: 700
    }

        .header-tab ul li h3 {
            font-weight: 400;
            font-size: 16px;
            line-height: 30px;
            margin: 0
        }

.total-revenue {
    color: rgb(14,131,173)
}

.total-expenditure {
    color: rgb(194,3,3)
}

.fund-exists {
    color: rgb(79,158,0)
}

.border-end {
    border-bottom: none !important
}

.nav-tab h1 {
    font-size: 26px;
    margin: 0;
    padding: 0;
    float: left;
    line-height: 34px;
    font-weight: 700;
    color: #333
}

.nav-tab {
    margin-bottom: 7px
}

.btn-bue {
    padding: 0 10px;
    line-height: 30px;
    height: 30px;
    vertical-align: top;
    background: var(--color-button);
    border-radius: 3px;
    position: relative;
    cursor: pointer;
    border: none;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    float: left;
    margin-right: 5px;
    margin-bottom: 0
}

    .btn-bue i {
        margin-right: 4px
    }

.w-880 {
    width: 880px
}

    .w-880 .modal-body label {
        line-height: 19px
    }

    .w-880 .op-object-detail label {
        width: 86px
    }

.tabs-main {
    height: 35px;
    background: #fff;
    float: left;
    width: 100%
}

    .tabs-main li {
        float: left;
        padding-top: 5px;
        height: 40px
    }

    .tabs-main a {
        position: relative;
        display: block;
        padding: 7px 10px 10px 13.6px;
        border-radius: 3px
    }

    .tabs-main .active a {
        background: var(--color-filter-left);
        color: black !important;
        font-weight: 700;
        text-decoration: none
    }

#tong, #nganhang {
    display: none
}

.ketchen {
    background: #32b7b3;
    color: #000
}

.title-ketchen {
    color: #fff;
    overflow: hidden;
    height: 50px;
    border-radius: 2px 2px 0 0;
    padding: 0 30px;
    background: #32b7b3
}

.w49-l {
    width: 50%;
    padding-right: 10px
}

.w49-r {
    width: 50%;
    padding-left: 10px
}

.title-ketchen span {
    font-size: 15px;
    font-weight: 700;
    display: inline-block;
    line-height: 50px;
    text-transform: uppercase
}

.title-ketchen ul li {
    margin-top: 7px
}

    .title-ketchen ul li a {
        font-weight: 700;
        color: #fff
    }

        .title-ketchen ul li a:hover {
            font-weight: 700;
            color: #0779a9
        }

.bg-bue {
    background: #58ac05
}

.control-bottom {
    position: absolute;
    left: 17px;
    bottom: 19px
}

    .control-bottom a {
        padding: 15px
    }

    .control-bottom i {
        color: #fff
    }

.close-k {
    position: absolute;
    right: 17px;
    bottom: 19px
}

    .close-k a {
        color: #fff;
        font-size: 13px
    }

.fitter {
    height: 100%;
    position: fixed;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 354px !important;
    z-index: 995;
    height: 100%;
    background: #fff;
    margin: 0;
    font-weight: 700
}

.title-fitter {
    padding: 0;
    background: #ddf7f5;
    overflow: hidden;
    position: relative;
    line-height: 36px;
    border-radius: 2px 2px 0 0;
    padding-left: 20px;
    color: #000;
    font-size: 13px
}

.treeview-filter ul li a, .tree-title-check-all label {
    padding-left: 15px;
    color: #000
}

.treeview-filter .ul-treeview {
    height: calc(100% - 230px)
}

.tree-title-check-all .seach-nhomhang {
    margin-bottom: 10px
}

.tree-title-delete a {
    color: #000
}

.btn-treeview {
    bottom: 15px !important;
    height: 50px;
    left: 65px !important
}

.tree-title-check-all {
    border-bottom: 1px solid #ccc;
    margin-bottom: 15px
}

.tree-title-delete {
    line-height: 27px
}

.content-fitter {
    padding: 10px 20px 10px 20px
}

    .content-fitter ul li ul {
        margin-left: 25px
    }

        .content-fitter ul li ul li {
            line-height: 30px
        }

.btn-fitter {
    z-index: 0;
    display: inline-block;
    background: #5dba00;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 11px 25px 8px 20px;
    white-space: nowrap;
    border: none;
    vertical-align: middle;
    border-radius: 2px;
    position: relative;
    cursor: pointer
}

.choose-fitter {
    bottom: 35px;
    left: 20px;
    position: absolute
}

.bill-show {
    display: none !important
}

.cashier {
    color: #333;
    overflow: hidden
}

.bill-show {
    display: none
}

.cashier .header {
    padding: 0;
    margin-bottom: 10px;
    height: 40px;
    background: #4bc6f2;
    color: #fff
}

.cashier .tab-content-70 {
    margin-right: 608px;
    position: relative
}

.cashier-bill .tab-content-70 {
    margin-right: 490px !important
}

.w302 {
    width: 483px !important
}

.cashier .header .nav-tabs > li > a {
    color: #fff;
    font-weight: 700
}

.cashier .tab-table .nav-tabs > li.active > a, .cashier .header .nav-tabs > li.active > a {
    background: #0779a9 !important;
    color: #fff;
    font-weight: 700
}

.cashier .header .nav > li > a {
    padding: 12px 15px;
    border: none;
    border-radius: 0
}

.cashier .header .nav-tabs > li > a i {
    padding-right: 10px
}

.cashier .header .nav-tabs {
    border-bottom: none
}

.cashier .header .seach {
    float: left;
    width: 44%;
    padding: 5px;
    margin-left: 40px
}

.cashier .header .seach1 {
    margin-top: 12px;
    float: left;
    width: 60%;
    padding: 2px;
    margin-left: 40px
}

.cashier .heder-right a {
    float: left;
    padding-right: 20px;
    color: #fff;
    padding-top: 10px;
    cursor: pointer
}

.cashier .heder-right i {
    font-size: 15px
}

.cashier .heder-right .dropdown {
    float: left;
    height: 41px;
    width: 40px;
    text-align: center;
    padding-top: 10px;
    cursor: pointer;
    padding-right: 10px
}

    .cashier .heder-right .dropdown .dropdown-menu {
        left: -165px !important;
        top: 39px;
        background: #1a9dcc
    }

        .cashier .heder-right .dropdown .dropdown-menu > li > a:hover {
            background: #1a9dcc
        }

.header-filter .dropdown-menu > li {
    border-bottom: 1px dotted #ccc
}

    .header-filter .dropdown-menu > li > a:hover {
        color: #f44e2a
    }

    .header-filter .dropdown-menu > li > a {
        color: #000
    }

.tab-table > li > a {
    background: #14a1d4;
    color: #fff;
    font-weight: 700;
    border: none;
    border-radius: 0;
    padding: 7px 15px !important
}

.list-table li {
    width: 20%;
    text-align: center;
    height: 82px;
    float: left;
    margin-bottom: 20px
}

.list-table {
    padding: 0 20px 0 20px
}

#order-list li {
    padding: 15px 10px 10px 10px;
    float: left;
    margin-top: 5px
}

.order-list li {
    padding: 5px 10px 5px 10px;
    float: left
}

.img-order {
    width: 100%;
    height: 75px;
    float: left;
    margin: auto;
    text-align: center
}

    .img-order img {
        width: 87px;
        height: 75px
    }

.item-order .name {
    float: left;
    width: 100%;
    text-align: center
}

.name-order {
    line-height: 18px;
    height: 50px;
    overflow: hidden;
    font-weight: 700
}

.title-order {
    padding: 8px 12px;
    font-weight: 700;
    color: #666
}

    .title-order .dropdown {
        position: relative
    }

        .title-order .dropdown i {
            padding-left: 10px;
            padding-right: 10px
        }

    .title-order .dropdown-menu {
        background: #fefced;
        color: #333;
        position: absolute;
        font-size: 1rem;
        top: 25px;
        right: 0;
        width: 460px;
        z-index: 9999;
        border: 1px solid #bebfc0;
        left: -321px
    }

        .title-order .dropdown-menu li {
            width: 50%;
            float: left;
            font-size: 1rem;
            overflow: hidden;
            text-align: left;
            margin: 0px !important
        }

            .title-order .dropdown-menu li img {
                width: 20px;
                margin-right: 12px
            }

.drop, #list-item-choose {
    float: left;
    cursor: pointer
}

.inner-w30 {
    background: #fff;
    height: 100%;
    position: relative
}

.tab-table1 {
    background: white !important;
    padding-top: 10px;
    border-bottom: 1px solid #14a1d4
}

    .tab-table1 li.active > a {
        background: #14a1d4 !important;
        color: #fff
    }

    .tab-table1 > li > a {
        padding: 5px 15px
    }

.notifi-order {
    width: 100%;
    text-align: center;
    line-height: 16px;
    padding: 11px 18px;
    float: left;
    color: #fff;
    font-weight: 700;
    height: 70px;
    background: var(--color-button-thanh-toan);
    border: none;
    outline: none;
    font-size: 15px
}

.img-table, .na_t span {
    cursor: pointer
}

.notyfi-none {
    display: none;
    color: red
}

.notyfi-none-nhom {
    display: none;
    color: red
}

.nt1 {
    background: linear-gradient(to bottom,#e37784 0%,#ce5b68 100%)
}

.nt2 {
    background: linear-gradient(to bottom,#46c2f5 0%,#1f95c5 100%)
}

.nt3 {
    border: none;
    background: linear-gradient(to bottom,#539b0b 0%,#6bca0b 100%)
}

.table-total {
    border: none;
    white-space: nowrap
}

    .table-total tr, .table-total tr td {
        border: none;
        padding: 5px;
        font-size: 1rem
    }

    .table-total .form-control {
        height: 26px
    }

.inner-product {
    margin: 7px
}

.main-conten-tab {
    padding: 10px 5px;
    float: left;
    width: 95%;
    height: 430px;
    overflow: scroll
}

.refresh {
    position: relative
}

    .refresh span {
        position: absolute;
        top: -11px;
        right: 4px;
        width: 16px;
        height: 16px;
        border: 1px solid #fff;
        border-radius: 16px;
        text-align: center;
        line-height: 13px;
        font-size: 11px;
        background: #0779a9
    }

.name-p {
    position: absolute
}

.pop-bottom {
    position: absolute;
    width: 200px;
    background: #fff;
    right: 35px;
    top: 47px;
    z-index: 999999;
    border: 1px solid #5dba00;
    padding: 10px;
    box-shadow: 0 0 3px rgba(0,0,0,.2);
    background: #fff;
    display: none
}

    .pop-bottom:before {
        border-bottom: 10px solid #fff;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        top: -9px !important;
        right: 20px;
        margin: 0;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

    .pop-bottom ul li {
        color: #000;
        font-weight: 700;
        float: left;
        width: 100%
    }

        .pop-bottom ul li span {
            float: left;
            width: 49%
        }

        .pop-bottom ul li input {
            float: right;
            width: 30%;
            height: 30px
        }

.content-kitchen .carousel-control.left, .content-kitchen .carousel-control.right {
    background-image: none
}

.content-kitchen .carousel-control .glyphicon {
    background: #ccc;
    border-radius: 30px;
    font-size: 16px;
    line-height: 30px
}

.content-kitchen .carousel-control .glyphicon-chevron-left {
    left: 30px !important
}

.content-kitchen .carousel-control .glyphicon-chevron-right {
    right: 30px !important
}

.content-kitchen .carousel-control {
    width: 30px !important
}

.text-hide {
    position: absolute;
    padding: 10px;
    line-height: 16px;
    background: #fff;
    font-size: 1rem;
    z-index: 99999999999;
    color: #000;
    width: 100%;
    height: 53px;
    border: 1px solid #32b7b3
}

.checkbox-table {
    position: relative
}

.text_area {
    position: absolute;
    top: 57px;
    width: 240px;
    background: #fff;
    font-size: 1rem;
    z-index: 99999999999;
    display: none;
    height: 8px;
    left: 12px
}

    .text_area:before {
        border-bottom: 6px solid #32b7b3;
        border-right: 7px solid transparent;
        border-left: 7px solid transparent;
        top: -3px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        left: 16px
    }

.bottom-used {
    position: absolute;
    bottom: 0;
    height: 110px;
    left: 0;
    right: 0;
    overflow: hidden;
    padding: 15px 0 25px;
    background: #f3f3f3;
    color: #333;
    z-index: 99
}

.content-kitchen {
    position: relative
}

.inner-used {
    width: 500px;
    margin: 0 auto
}

    .inner-used label, .user-left {
        float: left
    }

.view {
    float: left;
    margin-left: 20px;
    padding-top: 9px
}

.bx-default-pager {
    display: none
}

.proTabsClose {
    position: absolute;
    top: 7px;
    right: 5px;
    color: #000
}

.scoll-main-tab {
    overflow: scroll
}

.nav > li > a:hover {
    background: #e6e6e6;
    color: #000;
}

.bxslider1 li {
    width: 186px !important
}

.bx-wrapper {
    margin-bottom: 0px !important;
    border: 0px !important
}

.nav-tabs > li.thu > a {
    background: red
}

.plus_c {
    height: 33px;
    line-height: 33px;
    width: 36px;
    margin: 0;
    background: #14a1d4;
    text-align: center;
    font-size: 16px;
    padding: 0;
    border-radius: 2px 2px 0 0;
    color: #fff;
    position: absolute;
    z-index: 99;
    padding-top: 5px
}

.w701 .bx-next, .w30 .bx-next {
    right: -406px !important
}

#tab-table-right {
    float: left;
    position: absolute;
    width: 162px;
    height: 33px
}

.to {
    display: none
}

.bl {
    display: block !important
}

.navbar-default .open a {
    color: black !important
}

.change-color {
    z-index: 100;
    position: fixed;
    right: 0;
    top: 30%
}

#dropdown-listsoq {
    padding: 5px 15px
}

.dropdown-menu li > a {
    padding: 3px 7px;
    line-height: 24px;
    color: black;
}

.dropdown-menu {
    max-height: 400px;
    overflow: auto;
}

    .dropdown-menu li:hover {
        background: rgba(0,0,0,.15);
    }

.dropdown-list li:hover {
    background: var(--color-button-hover)
}

.menu-chicken {
    padding-left: 20px
}

.change-color a {
    height: 40px;
    width: 40px;
    background: #32b7b3;
    color: #fff;
    float: left;
    line-height: 49px;
    text-align: center
}

    .change-color a i {
        font-size: 20px
    }

.change-color li ul {
    position: absolute;
    width: 170px;
    top: 40px;
    right: 0;
    display: none;
    background: #32b7b3
}

    .change-color li ul li {
        padding: 10px;
        float: left;
        background: #32b7b3
    }

.change-color:hover li ul {
    display: block
}

.btnMenu .dropdown-menu {
    color: #000;
    background: #fff;
    border-radius: 0
}

.handling-kitchen .dropdown-menu li a:hover {
    background: var(--color-primary);
    color: #fff
}

.header-top ul li ul li:last-child {
    border-bottom: none
}

.header-top ul li ul li:hover {
    /*background: var(--color-primary)*/
    background: rgba(0,0,0,0.15)
}

.header-top ul li:hover ul {
}

.amdin {
    width: 152px !important
}

.title-establish {
    padding: 0 0 0 0;
    position: relative
}

    .title-establish h1 {
        font-size: 19px;
        margin: 0;
        padding: 0;
        float: left;
        line-height: 34px;
        color: #333;
        padding-bottom: 7px;
        min-width: 230px;
        margin-right: 0;
    }

    .title-establish .nav-tabs > li.active > a {
        color: #fff;
        border-radius: 2px 2px 0 0;
        background: #32b7b3
    }

    .title-establish .nav > li > a {
        position: relative;
        display: block;
        padding: 8px 15px
    }

.information-es {
    background: #FFF;
    border-radius: 5px
}

    .information-es ul {
        float: left;
        width: 100%;
    }

.establish .modal-body {
    padding: 0
}

.establish .form-wrap {
    width: 60%
}

.btn-file {
    position: relative;
    overflow: hidden;
    border: 1px solid #ccc;
    color: #000;
    line-height: 22px !important;
    font-size: 1rem !important
}

    .btn-file input[type=file] {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        text-align: right;
        opacity: 0;
        background: none repeat scroll 0 0 transparent;
        cursor: inherit;
        display: block;
    }

.wp-st-logo img {
    padding: 10px
}

.wp-st-logo p {
    padding-top: 10px;
    margin: 0
}

.form-group p {
    padding-top: 10px
}

.information-es ul li {
    width: 100%;
    float: left;
    position: relative;
    text-align: center;
    border: 1px solid;
    border-color: transparent;
    border: 1px solid #ccc;
    margin-bottom: 10px
}

    .information-es ul li .icon-es {
        height: 30px;
        text-align: center;
        font-size: 1rem;
        color: #ccc;
        float: left;
        padding-right: 7px;
        line-height: 32px;
        padding-left: 6px
    }

.checkbox-es {
    padding-top: 5px;
    position: relative
}

.item-es {
    float: left;
    width: 100%
}

.setup-right {
    float: left;
    line-height: 22px
}

.setup-left {
    width: 15px;
    margin-right: 10px;
    position: relative;
    float: right;
    padding-top: 3px
}

    .setup-left input {
        float: right
    }

.information-es .infor {
    top: 12px;
    position: absolute;
    right: 10px;
    font-size: 15px;
    display: none
}

.cl:before {
    color: var(--color-main) !important
}

.usedbank {
    float: left
}

    .usedbank h4 {
        background: #eff0f1;
        color: #006fa9;
        font-size: 16px;
        font-weight: 700;
        padding: 10px 15px;
        margin: 0;
        border: 1px solid #bebfc0;
        border-bottom: none;
        border-radius: 3px 3px 0 0
    }

    .usedbank ul {
        border: 1px solid #bebfc0;
        border-radius: 0 0 3px 3px;
        max-height: 376px;
        height: 376px
    }

        .usedbank ul li {
            padding: 10px 15px;
            position: relative;
            font-weight: 700;
            background: #d3f3ff
        }

.use-top strong {
    float: left;
    line-height: 40px;
    padding-right: 15px
}

.use-top .form-group {
    float: left;
    width: 35%
}

.use-top a {
    line-height: 34px;
    background: #f8f8f8;
    border: 1px solid #e2e2e2;
    color: #656565;
    box-shadow: none;
    padding: 5px 10px;
    font-size: 1rem;
    margin-left: 10px
}

.user-list h3 {
    font-size: 1rem;
    color: #006fa9;
    font-weight: 700
}

.user-list i {
    padding-right: 10px
}

.item-time .checkbox-item {
    float: left;
    width: 80px;
    line-height: 35px;
    position: relative;
    width: 100%;
    padding-bottom: 10px
}

.item-time .form-group label {
    float: left;
    line-height: 35px;
    width: 35px
}

.item-time .form-group {
    position: relative;
    float: left;
    width: 50%
}

    .item-time .form-group .form-wrap {
        width: 75%
    }

    .item-time .form-group .icon-time {
        position: absolute;
        right: 40px;
        top: 0;
        font-size: 20px
    }

.form-de {
    position: absolute;
    left: 81px;
    width: 500px;
    z-index: 9999;
    background: #fff;
    color: #000;
    height: 40px;
    top: 0
}

.control-next {
    position: absolute;
    top: 8px;
    color: #000
}

.control-prev {
    position: absolute;
    right: 44px;
    top: 8px;
    color: #fff
}

.out-slide {
    background: #0779a9;
    float: left;
    width: 100%
}

.slide-auto {
    float: left;
    width: 84%;
    overflow: hidden;
    height: 33px;
    position: relative
}

.btn-disable {
    cursor: not-allowed;
    pointer-events: none;
    color: silver;
    background: #fff
}

.span-sale {
    color: red
}

.seach {
    width: 20% !important
}

.table-red {
    margin-top: 9px
}

.table-green {
    margin-top: 9px
}

.per_ac1 li {
    padding: 0 7px;
    text-align: center;
    width: auto !important
}

.op-filter-container ul li {
    width: 100%;
    float: left;
    position: relative;
    display: flex;
}

.op-filter-container ul.li-more-level li {
    flex-direction: column;
    padding-left: 10px;
}

.op-filter-container .il li input {
    float: right;
    width: 86%
}

.parent-node i{
    font-size: 1.5rem;
}

.op-filter-container ul li .fa-calendar {
    position: absolute;
    right: 5px;
    top: 8px;
    font-size: 15px
}

.op-filter-container ul li .form-control {
    margin-bottom: 10px
}

.kv2Btn1 {
    background: #509d02;
    width: 80px;
    height: 34px;
    float: left;
    border-radius: 4px;
    line-height: 34px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    margin-bottom: 10px
}

.fillter {
    z-index: 99;
    display: none;
    position: absolute;
    top: 32px;
    width: 225px;
    right: 0;
    top: 47px;
    background: #1c9b94
}

    .fillter i {
        position: absolute;
        top: 7px !important;
        right: 7px !important;
        font-size: 15px;
        color: #6d6d6d !important
    }

.btn-kitchent {
    background: #FF9B00 !important;
    height: 48px;
    float: left;
    width: 83px
}

.iconn-design {
    margin: 0;
    width: 100%;
    padding-top: 3px;
    text-align: center
}

.btn-kitchent i {
    font-size: 16px;
    margin-right: 5px
}

.bnt-Cashier {
    background: var(--color-special);
    height: 30px;
    float: left;
    width: 30px;
}

.panel-primary > .panel-heading {
    background: var(--color-main);
    border-color: var(--color-main)
}

.bg-style a {
    width: 70px;
    height: 70px;
    text-decoration: none;
    float: left;
    border-radius: 7px
}

    .bg-style a i {
        display: none;
        font-size: 20px
    }

    .bg-style a:hover {
        text-decoration: none
    }

    .bg-style a focus {
        text-decoration: none
    }

.btn-prev {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    height: 33px;
    width: 24px;
    background: #14a1d4;
    text-align: center;
    padding-top: 7px;
    color: #fff;
    display: none;
    border-right: 2px solid #0779a9
}

.plus_c i {
    color: #fff
}

.list-ch {
    padding: 10px
}

.btn-next {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 16px;
    height: 33px;
    width: 24px;
    background: #14a1d4;
    text-align: center;
    padding-top: 7px;
    color: #fff;
    display: none;
    border-left: 2px solid #0779a9
}

.l {
    display: none
}

.SelectALLLoaiTuVan li, #tatcanhh {
    line-height: 27px;
    text-transform: uppercase;
    padding-left: 15px;
    cursor: pointer
}

#treeviewLoaiTuVan, #treeviewnhomhang li {
    line-height: 27px;
    padding-left: 7px;
    cursor: pointer;
    text-transform: capitalize
}

    #treeviewnhomhang li .fa-caret-right {
        /*font-size: 1rem;*/
        color: #337ab7
    }

.treeview li .prev-tr-hide .dropdown {
    display: inline-block;
    color: #0098d7
}

.ch1 .proDropdown button, .prev-tr-hide .proDropdown button {
    background: inherit;
    border: none;
    outline: none;
}

.prev-tr-hide .proDropdown .dropdown-menu {
    min-width: 120px;
    top: 21px;
    border-radius: 0
}

.p-c {
    right: 0px !important
}

.p-left {
    left: 175px;
    margin-left: 30px
}

.bnt-i {
    text-shadow: none;
    border-radius: 2px;
    color: #58595b;
    vertical-align: middle;
    height: 29px;
    width: 34px;
    border: 1px solid transparent;
    text-align: center;
    line-height: 28px;
    font-size: 16px;
    float: right;
    right: -9px;
    top: -10px;
    position: absolute
}

.right-content-infor .nav-tabs > li.active > a {
    color: #fff;
    border-radius: 0;
    background: #14a1d4
}

.right-content-infor .nav-tabs > li > a {
    padding: 7px 15px;
    color: #7e7e7e
}

    .right-content-infor .nav-tabs > li > a:hover {
        border-radius: 0;
        color: #fff
    }

.right-content-infor .nav-tabs {
    border-bottom: 1px solid #14a1d4
}

.form-left {
    width: 100%
}

    .form-left input {
        width: 88%;
        float: left
    }

.detail-infor-border-b {
    border-bottom: 1px solid #ccc
}

.right-content-infor .form-wrap {
    text-align: right
}

#add-form ul li {
    float: left;
    width: 100%
}

.bill-list button {
    border: none;
    background: #fff;
    border-bottom: 1px solid #ccc;
    line-height: 30px
}

.bill-list .munber {
    border: none;
    background: #fff;
    border-bottom: 1px solid #ccc;
    line-height: 21px;
    outline: none;
    float: left;
    box-shadow: none;
    border-radius: 0
}

.munber {
    width: 32px;
    float: left;
    margin-right: 5px;
    text-align: center
}

.angle-d {
    text-align: center;
    padding-top: 5px;
    width: 30px;
    height: 30px;
    border: 1px solid #dcdcdc;
    font-size: 16px;
    font-family: 'Font Awesome 5 Pro';
    color: #a1a1a1;
    outline: none;
    border-radius: 2px;
    float: left;
    cursor: pointer;
    margin-right: 5px
}

.bill-list .price-fist {
    width: 120px;
    margin-right: 41px
}

.bill-list .sum-f {
    margin-left: 30px
}

.munber {
    padding: 6px 7px !important;
    border-radius: 0
}

.sum-f {
    line-height: 33px;
    float: left;
    overflow: hidden
}

.spa .sum-f {
    width: 67px
}

.price-fist {
    outline: none;
    box-shadow: none;
    border: none;
    width: 100%;
    height: 30px;
    line-height: 30px;
    background: #fff
}

.cashier #order-list li {
    width: 33%;
    padding-top: 15px
}

.cashier-bill #order-list li {
    width: 20%;
    padding-top: 15px
}

.bx-wrapper .bx-controls-direction a.disabled {
    display: block !important
}

.parent-price {
    position: relative;
    outline: none;
    float: left
}

.slideBtn:hover {
    background: #4bc6f2
}

.arrow-left2 {
    left: -270px
}

.parent-price-1 {
    width: 100%;
    text-align: right;
    padding: 0;
    border-radius: 3px;
    padding-right: 3px;
    line-height: 24px
}

.op-object-detail.nav {
    padding-left: 18px
}

.title-warehouse h4 {
    font-size: 16px;
    font-weight: 700
}

.arrow-left {
    border: 1px solid #32b7b3;
    padding: 10px;
    background: #fff;
    background: #fff;
    box-shadow: 0 0 3px rgba(0,0,0,.2);
    zoom: 1;
    z-index: 99999999999;
    position: absolute;
    left: -121px;
    width: 281px;
    height: 95px;
    display: none;
    top: -4px;
    border-radius: 5px
}

.selec-person ul {
    max-height: 230px;
    overflow: auto
}

    .selec-person ul li ul {
        max-height: 100% !important;
        overflow: hidden !important
    }

.arrow-left1 {
    border: 1px solid #32b7b3;
    padding: 10px;
    background: #fff;
    box-shadow: 0 0 3px rgba(0,0,0,.2);
    zoom: 1;
    z-index: 9;
    position: absolute;
    left: -239px;
    width: 250px;
    height: 86px;
    display: none;
    top: 0;
    border-radius: 4px
}

.txt6 {
    padding-top: 15px
}

.arrow-left1 .price span, .arrow-left .price span {
    float: left;
    width: 65px;
    line-height: 24px;
    text-align: left;
    font-size: 1rem;
    white-space: nowrap;
}

.arrow-left1 .price input, .arrow-left .price input {
    float: right;
    width: 71%;
    margin-left: 1px
}

.arrow-left1:before, .arrow-left:before {
    border-left: 6px solid #32b7b3;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    right: -7px;
    top: 15%;
    margin-top: -3px;
    content: '';
    position: absolute;
    width: 0;
    height: 0
}

.total-right .arrow-left1:before, .total-right .arrow-left:before {
    border-right: 6px solid #5dba00;
    border-left: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    left: -7px
}

.arrow-left:before, .arrow-left2:before {
    top: 14% !important
}

.arrow-left3, .arrow-left2 {
    height: auto
}

    .arrow-left3 .price_2 input, .arrow-left2 .price_2 input {
        width: 106px
    }

.arrow-left1 .price_2 input, .arrow-left .price_2 input {
    float: left;
    width: 87px;
    padding: 1px 5px
}

.price_2 .plus {
    border: 1px solid #747474;
    color: #747474
}

.text-right .arrow-left {
    height: 54px !important;
    top: -4px !important;
    left: 87px !important
}

.menu-left {
    width: 183px;
    float: left;
    margin-top: 18px
}

.content-right {
    width: 828px;
    float: left;
    padding: 18px
}

.spa .total-right .text-right .arrow-left2 {
    left: 266px !important
}

.spa .arrow-left1 {
    left: -274px
}

.cashier-bill .text-right .arrow-left {
    left: -235px !important
}

table {
    margin-bottom: 0px !important
}

.bs-example-modal-mk .form-wrap i {
    top: 0px !important
}

.bs-example-modal-mk .op-filter-title {
    margin-left: 0px !important
}

.choose-order {
    background: #f8f8f8;
    border: 1px solid #e2e2e2;
    display: inline-block;
    width: 70px;
    text-align: center;
    line-height: 24px;
    font-weight: 700;
    font-size: 1rem;
    color: #38b8e6;
    border-radius: 2px
}

.page {
    display: flex;
    /* float: left; */
    width: 100%;
    background: var(--color-table);
    padding: 12px;
    align-items: center;
    justify-content: space-between;
}

.bs-example-modal-mk .modal-body {
    padding: 0px !important
}

.page a {
    border: none;
    border-radius: 2px;
    float: left;
    padding: 3px 9px !important;
    min-width: 18px;
    margin-top: 1px;
}

.page ul {
    float: left;
    padding-right: 10px;
    margin-bottom: 0;
}

    .page ul li {
        float: left
    }

        .page ul li a {
            border: none;
            border-radius: 2px;
            width: auto;
            padding: 3px 9px !important;
            min-width: 18px
        }

        .page ul li .click {
            color: #fff;
            background: var(--color-main);
            text-decoration: none
        }

.logoOpen24 img {
    height: 35px;
    width: 115px;
    margin-top: 2px
}

.icon-tien-khach-dua {
    color: var(--color-main);
    font-size: 24px;
    position: absolute;
    top: 4px;
    right: 0
}

.total-recos {
    float: unset;
    margin-top: 0;
    line-height: 24px;
    padding: 3px;
}

.page span {
    line-height: 21px
}

.bs-example-modal-mp .name-product {
    width: 177px;
    text-align: right
}

.bs-example-modal-mp label {
    float: left
}

.bs-example-modal-mp .form-group {
    border-bottom: none;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important
}

.seach-pay {
    float: left;
    width: 100%
}

.name-seach {
    color: #666;
    font-weight: 700;
    padding-top: 15px;
    float: left
}

#tab-table-right li {
    width: 200px
}

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

#add-form .col-md-1 .delete-group {
    font-size: 15px;
    padding-top: 9px;
    position: absolute
}

.proDropdown:after {
    content: '';
    float: left
}

.menuRadio .last label {
    float: left;
    padding-right: 20px;
    line-height: 28px
}

.menuRadio .last select {
    float: left;
    width: 45%
}

.menuRadio label {
    width: 100%;
    display: flex;
    align-items: center;
    line-height: 20px;
    padding: 3px;
}

.menuCheckbox label {
    line-height: 24px;
    padding: 3px;
    width: inherit;
}

.proDropdown .dropdown-menu > li > a:hover {
    background: #e8e8e8 !important
}

.proDropdown .dropdown-menu {
    padding: 0px !important
}

    .proDropdown .dropdown-menu a {
        padding: 5px 22px
    }

.notyfi-check {
    color: red
}

#treeviewnhomhang {
    max-height: 180px;
    overflow: auto
}

.panel .col-md-2 .form-control {
    padding: 0px !important
}

.status {
    line-height: 33px
}

.header-top {
    float: right;
    height: 45px
}

.check-group input {
    width: 14px;
    height: 14px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: 0;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    float: left;
    border: 1px solid var(--color-primary);
    border-radius: 3px
}

.remember input {
    width: 14px;
    height: 14px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: none;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    float: left;
    border: 1px solid #85b069;
    border-radius: 3px;
    margin-right: 8px
}

.input-search-filter .showfiltercolumn {
    float: right;
    margin-right: 5px
}
/*.choosenhom-right input[type=radio], .tab_chung input[type=radio], .modal-content input[type=radio], .op-filter-body input[type=radio] {
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: 0;
    font-family: 'FontAwesome';
    font-size: 1rem;
    line-height: unset;
    height: unset;
    width: 18px;
    height: 18px;
    display: inline-block;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0;
    padding: 0;
}*/
.radio-button-leff input[type=radio] {
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: 0;
    font-family: 'FontAwesome';
    font-size: 1rem;
    margin-right: 5px
}

.col-md-2 input[type=radio] {
    padding-top: 12px
}

.modal-content .col-md-2 input[type=radio] {
    padding-top: 0
}

.dropdown-list span {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 11px;
    outline: none;
    border: 2px solid #fff;
    background: var(--color-button);
    top: 7px
}

.dropdown-list input:checked + span:before, .dropdown-list input:checked ~ span:before, .dropdown-list input:checked + a:before, .dropdown-list input:checked ~ a:before {
    content: '\2713 ';
    outline: none;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    line-height: 12px;
    color: #fff;
    position: absolute
}

#checkbox-time:after {
    left: 5px
}

input[type=checkbox] {
    position: relative;
    margin: 5px;
    height: 13px;
    width: 13px;
}

input[type='checkbox']::before {
    position: relative;
    background: white;
    border-radius: 5px;
    border: none;
    color: var(--color-primary);
    z-index: 1;
    top: -2px;
    left: -2px;
    font-size: 18px;
    font-family: 'Font Awesome 5 Pro';
    height: 18px;
    width: 18px;
    display: inline-block;
    border-radius: 2px;
    line-height: 18px;
    padding: 0 1px;
    content: '\f0c8';
    font-weight: normal;
}

input[type=checkbox].squarevt:checked:before {
    content: '\f146';
}

input[type=checkbox]:checked:before {
    content: '\f14a';
}

input[type=checkbox].squarevt:after, input[type=checkbox]:checked.squarevt:after {
    content: '';
    height: 10px;
    width: 10px;
    background: var(--color-main);
    position: absolute;
    top: 2px;
    z-index: 99;
    left: 2px;
    border-radius: 2px;
}
/*.choosenhom-right input[type=radio]:after, .tab_chung input[type=radio]:after, .chec input[type=radio]:after, .modal-content input[type=radio]:after, .op-filter-body input[type=radio]:after, .radio-button-leff input[type=radio]:after {
    content: '\f10c';
    color: var(--color-main);
    display: block;
    content: '';
    border: 1px solid var(--color-primary);
    height: 14px;
    width: 14px;
    top: 1px;
    position: absolute;
    left: 2px;
    border-radius: 10px;
}*/
.radio-red input[type=radio]:after {
    content: '\f10c';
    color: red;
    display: block
}
/*.choosenhom-right input[type=radio]:checked:after, .tab_chung input[type=radio]:checked:after, .checkbox-es input[type=radio]:checked:after, .modal-content input[type=radio]:checked:after, .op-filter-body input[type=radio]:checked:after, .radio-button-leff input[type=radio]:checked:after {
    content: '\f111';
    color: var(--color-primary)
}*/
.checkbox_TR {
    content: '\2713 ';
    outline: none;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    line-height: 13px;
    color: #32b7b3
}

.col3 .ac input:after {
    content: '';
    font-size: 8px;
    background: #32b7b3
}

.overview-heading {
    background: white !important;
    font-weight: 700;
    font-size: 1rem;
    padding-bottom: 20px;
    padding-top: 15px;
    color: var(--color-main);
    position: relative
}

.title-ds {
    padding-right: 12px
}

.panel-default > .panel-heading .title-ds {
    font-weight: 700;
    color: #3f3f3f;
    text-transform: uppercase;
    padding-right: 10px
}

.total-value {
    color: #000;
    font-size: 13px !important;
    font-weight: 700;
    padding-left: 12px
}

.overview-heading .pull-right span {
    text-transform: none;
    font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-weight: 400
}

.panel-default > .panel-heading i {
    color: #B6B6B6
}

.highcharts-button {
    font-weight: normal !important;
    text-transform: capitalize !important
}

.month1, .month3, .month2, .month4, .month5, .month6 {
    padding-right: 20px;
    border-radius: 3px !important;
    padding: 4px;
    line-height: 22px;
    font-size: 1rem !important
}

    .month3 a {
        color: #35a8d9 !important
    }

.month-oll, .month-oll1, .month-oll2, .month-oll4, .month-oll5, .month-oll6, .month-oll7 {
    border-radius: 0;
    min-width: 180px;
    font-size: 1rem !important;
    box-shadow: none;
    border-radius: 4px;
    z-index: 1;
    border-color: var(--color-main)
}

    .month-oll li a:hover, .month-oll1 li a:hover, .month-oll2 li a:hover, .month-oll4 li a:hover, .month-oll5 li a:hover, .month-oll6 li a:hover {
        background: dodgerblue !important;
        color: white !important
    }

.panel-content {
    height: 370px;
    position: relative;
    background: #fff
}

.tab-width {
    width: 1300px
}

.month-oll a, .month-oll1 a, .month-oll2 a, .month-oll4 a, .month-oll5 a {
    padding: 8px 15px !important;
    color: black !important
}

.panel-content p {
    position: relative;
    font-size: 24px;
    top: 50%;
    color: #c2c2c2;
    text-align: center
}

    .panel-content p:before {
        content: '';
        background: url(.~/Content/Content/images/box.png) no-repeat center top;
        height: 35px;
        position: absolute;
        top: -50px;
        left: 0;
        right: 0
    }

.activity {
    border: 1px solid #ccc;
    border-radius: 5px
}

.ac-title {
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    padding-top: 15px
}

#toTop {
    position: fixed;
    bottom: 40px;
    right: 20px;
    display: none;
    width: 36px;
    height: 36px;
    line-height: 32px;
    border-radius: 100%;
    background: #4bc6f2;
    text-align: center;
    cursor: pointer;
    z-index: 99;
    background: var(--color-main)
}

    #toTop i {
        color: #fff;
        font-size: 24px;
        margin-top: 4px
    }

.activity ul {
    width: 263px;
    margin: auto
}

    .activity ul li {
        float: left;
        border-bottom: 1px solid #ccc;
        color: #000;
        line-height: 22px;
        padding-top: 15px
    }

        .activity ul li .img-ind {
            width: 46px;
            height: 28px;
            top: 5px;
            border-radius: 100%;
            text-align: center;
            line-height: 28px;
            float: left
        }

.highcharts-axis-labels {
    text-transform: none;
    font-weight: 400;
    font-size: 17px;
    width: 30px !important;
    color: black !important
}

.highcharts-grid {
    border-bottom: 1px solid #ccc !important
}

.inner-overview {
    margin-bottom: 13px;
    padding-bottom: 20px;
    padding-top: 20px
}

.activity ul li span i {
    color: #fff;
    font-size: 13px
}

.activity ul li p {
    color: #919192;
    font-size: 11px !important;
    margin-top: -2px
}

.activity ul li .share {
    background: #ef5f81
}

.diary {
    float: left;
    width: 210px;
    font-size: 1rem
}

    .diary .money {
        color: var(--color-main);
        font-weight: 700;
        margin: 0
    }

.support {
    position: fixed;
    width: 240px;
    z-index: 9999;
    right: 0;
    bottom: 0;
    height: 335px;
    background: #fff
}

.menu-main li {
    position: relative
}

    .menu-main li ul {
        position: absolute;
        background: var(--color-main);
        width: 235px;
        z-index: 99999;
        display: none
    }

.giaodichparent ul li:first-child, .giaodichparent ul li:nth-child(4), .giaodichparent ul li:nth-child(7) {
    border-bottom: 1px dotted #d8d6d6
}

.menu-main li ul li:last-child {
    border-bottom: none
}

.menu-main li ul li a {
    display: block;
    padding: 7px 15px
}

#dropdown-listsoq {
    width: 170px;
    background: #009ddc;
    color: #fff;
    position: absolute;
    left: -107px !important;
    z-index: 10
}

.dropdown-list {
    background: var(--color-button);
    color: #fff
}

.form-control {
    height: 30px !important;
    font-size: 1rem
}

.btn {
    padding: 3px 1ch !important;
    min-height: 24px;
    line-height: 24px;
    background-size: 200% 200%
}

.dropdown-list li label {
    line-height: 24px;
    width: 100%;
    padding: 3px 5px 3px 30px;
}

    .dropdown-list li label input {
        opacity: 0;
        margin: 0 !important;
    }

.col-md-2 input {
    padding-left: 7px
}

ul.ui-autocomplete {
    position: absolute;
    font-size: 13px !important;
    background: #fff;
    -moz-border-radius: 15px;
    border-radius: 5px;
    border-color: #ccc;
    border-color: rgba(0,0,0,.2);
    border-style: solid;
    border-width: 1px;
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden
}

.ui-state-hover, .ui-state-active {
    color: #fff;
    text-decoration: none;
    background: #08c;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    background-image: none
}

.ui-helper-hidden-accessible {
    display: none
}

.table > thead > tr > td {
    border-top: 1px solid #fff
}

#add-form {
    float: left;
    width: 100%
}

.header-bill {
    line-height: 55px;
    height: 55px !important
}

.cashier .header-bill .seach {
    padding-top: 14px
}

.seach-number {
    float: left;
    width: 80px;
    padding-top: 14px
}

.add-tab {
    float: left;
    width: 100%;
    position: relative;
    padding-top: 14px
}

    .add-tab .tab-table {
        background: #0779a9
    }

    .add-tab .out-slide {
        background: #4bc6f2;
        float: left;
        width: 100%
    }

.cashier #order-list li:hover {
    background: #eee
}

.list-item .order-list li:hover {
    background: rgba(255,255,255,.5);
    box-shadow: 0 1px 2px rgba(0,0,0,.2)
}

.list-item .order-list li {
    width: 16.5%
}

.list-item .order-list li {
    margin: 0
}

.list-item .bx-wrapper .bx-controls-direction a {
    top: -24px
}

.list-item .title-order {
    padding: 0;
    position: relative;
    border-top: 1px solid #ccc;
    text-align: center;
    height: 34px
}

    .list-item .title-order ul li {
        width: 47px
    }

        .list-item .title-order ul li a {
            padding: 5px;
            border: 1px solid #c2c2c2;
            border-radius: 2px;
            line-height: 0;
            float: left
        }

            .list-item .title-order ul li a i {
                font-size: 17px
            }

.bill-money li {
    border-bottom: 1px solid #ccc
}

#add-form .bill-money li {
    display: block
}

.title-bill {
    position: relative
}

#divStaff {
    background: var(--color-main);
    color: #fff;
    height: 43px
}

.user-bill {
    float: left;
    width: 50%;
    position: relative
}

.icon-user {
    float: left
}

#divStaff .name-bill1 {
    color: #fff
}

.name-bill2, .name-bill1 {
    float: left;
    position: relative;
    padding-left: 10px;
    font-size: 1rem;
    height: 32px;
    border-radius: 2px;
    margin-top: 8px;
    line-height: 32px
}

.select-user {
    position: absolute;
    left: 4px;
    padding: 10px;
    border: 1px solid var(--color-primary);
    background: #fff;
    display: none;
    box-shadow: 0 0 0 rgba(0,0,0,0);
    z-index: 10;
    top: 40px;
    border-radius: 5px
}

    .select-user li {
        line-height: 25px;
        position: relative
    }

        .select-user li .fa-check {
            position: absolute;
            right: 10px;
            top: 9px;
            display: none;
            color: #4bc6f2
        }

        .select-user li .fa-search {
            position: absolute;
            right: 10px;
            top: 10px;
            color: #666
        }

.name-bill1 .fa-angle-up, .name-bill1 .fa-caret-up, .name-bill2 .fa-angle-up {
    display: none
}

.user-choose, .seach-bill {
    padding: 10px 15px 0;
    position: relative
}

    .seach-bill input {
        font-style: italic;
        border: none;
        border-bottom: 1px solid #ccc;
        border-radius: 0;
        padding-left: 16px;
        outline: none;
        line-height: 19px;
        padding-bottom: 7px
    }

    .user-choose i, .seach-bill i {
        position: absolute;
        top: 11px;
        color: #999;
        font-size: 1rem;
        left: 15px
    }

    .user-choose a {
        float: left;
        padding-left: 25px;
        border-bottom: 1px solid #d7d7d7;
        height: 24px;
        text-align: right;
        width: 100%;
        text-align: left;
        padding-left: 28px;
        padding-right: 26px;
        line-height: 20px;
        height: 21px;
        text-decoration: none;
        outline: none;
        font-weight: 700
    }

.close-user {
    float: right;
    position: absolute;
    right: 13px;
    height: 30px;
    width: 30px;
    top: 0
}

.seach-bill .mol {
    position: absolute;
    right: 45px;
    color: #4bc6f2;
    top: 0
}

.bill-total {
    padding: 0 10px
}

.title-bill-total {
    margin-bottom: 35px;
    border-bottom: 1px solid var(--color-primary);
    height: 36px
}

    .title-bill-total span {
        margin-bottom: -1px;
        color: #fff;
        text-align: center;
        line-height: 35px;
        font-size: 1rem;
        width: 140px;
        float: left
    }

.bill-pen input, .bill-total table tr .text-right input, .bill-total table tr .text-right button {
    border: none;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    outline: none
}

.bill-pay .notifi-order {
    width: 95%;
    text-align: center;
    border-radius: 4px
}

.bill-pen {
    position: relative;
    padding: 0 15px
}

.grocery .bill-pen img {
    position: absolute;
    top: -4px;
    left: 15px
}

.grocery .bill-pen .fa-pencil {
    left: 0
}

.grocery .note-out {
    padding-top: 4px;
    display: none
}

.bill-pen .fa-pencil {
    position: absolute;
    top: -3px;
    left: 15px;
    font-size: 15px;
    color: #ccc5c5
}

.bill-pen input {
    padding-left: 16px;
    outline: none;
    font-size: 11px
}

.grocery .bill-pen input {
    padding-left: 0
}

.content-fitter ul li {
    line-height: 30px;
    position: relative
}

.content-kitchenone .order-list .bx-controls-direction {
    right: 5px;
    top: 0;
    width: 91px
}

.hide-item a {
    position: absolute;
    top: -24px;
    left: 50%;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 2px;
    border-top-left-radius: 2px;
    background: #0090DA;
    width: 33px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    float: left;
    color: #fff;
    padding: 5px 10px
}

.hide-item .fa-chevron-up {
    display: none
}

.content-kitchenone {
    transition: height 200ms ease-out;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: all ease 0.3s;
    z-index: 999;
    background: #eee;
    height: 474px;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc
}

.list-item {
    height: 276px;
    transition: height 200ms ease-out;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0 7px 0 12px
}

.bottom-hide {
    bottom: -408px;
    transition: all ease 0.3s
}

.content-kitchenone #order-list li ul li {
    padding-top: 30px;
    padding-left: 15px
}

    .content-kitchenone #order-list li ul li .img-order {
        width: 90px;
        height: 90px
    }

.input-note {
    width: 280px !important;
    display: none;
    margin-top: 1px;
}

.pen_hide {
    display: block
}

.content-kitchenone #add-form ul li {
    height: 63px
}

.pen-cilck {
    display: block
}

#add-form ul li:hover .pen-cilck {
    display: block
}

.content-kitchenone .bx-wrapper .bx-prev {
    right: 54px !important;
    left: auto
}

.title-order .page-right {
    width: 135px;
    line-height: 50px;
    font-size: 15px
}

.cashier-bill {
    background: #eee
}

.icon-user i {
    padding-top: 5px
}

.cashier-bill .heder-right {
    padding-top: 9px
}

.op-filter-title a {
    position: absolute;
    top: 0;
    height: 30px;
    width: 30px;
    text-align: center;
    right: 0;
    line-height: 30px;
    outline: none !important;
    color: #fff
}

#tiemmat {
    background: #fff;
    z-index: 1
}

.close-kitchent button {
    background: #2aa2cd !important;
    border: none;
    height: 40px;
    color: #fff
}

.content-fitter input[type=radio]:after {
    content: '\f10c';
    color: #FF9B00;
    display: block
}

.content-fitter input[type=radio]:checked:after {
    content: '\f111';
    color: #FF9B00
}

.btn-bue a {
    color: #fff
}

.toogle {
    float: right;
    width: 44px;
    height: 26px;
    background: #cacaca;
    border-radius: 15px;
    position: relative
}

    .toogle:before {
        content: '';
        width: 22px;
        height: 22px;
        background: #fff;
        border-radius: 15px;
        top: 1px;
        position: absolute;
        margin-top: 1px;
        left: 2px
    }

.active-t {
    background: #14a1d4
}

    .active-t:before {
        left: 20px
    }

.slideBtn {
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    background: #ccc;
    border-radius: 100%;
    color: #fff;
    position: absolute;
    top: 40%;
    z-index: 999;
    padding-top: 12px
}

.bg-op {
    display: none
}

.slideBtnPrev {
    left: 16px !important
}

.slideBtnNext {
    right: 21px
}

.ui-datepicker-div {
    z-index: 7
}

.selec-person ul li {
    cursor: pointer;
    width: 100%;
    text-align: left;
    padding-left: 10px;
    position: relative;
    line-height: 32px;
    font-size: 1rem;
    border-bottom: 1px dotted #d5d5d5
}

    .selec-person ul li:last-child {
        border-bottom: none
    }

#modalPopuplg_NV .promotion-drop .choose-person li {
    float: left;
    padding: 0 4px
}

#modalPopuplg_NV .choose-person input {
    width: 18px
}

.cashier .tab-content textarea {
    padding: 8px
}

.choose-person {
    width: 100%;
    float: left;
    max-height: 62px;
    border-radius: 4px;
    border: 1px solid #ccc;
    overflow: auto
}

    .choose-person .form-control, .choose-person input {
        border: none;
        height: 30px;
        outline: none;
        padding-left: 10px;
        width: 100%
    }

.per_ac {
    float: left;
    width: 25px;
    height: 28px
}

.per_ac1 {
    width: 160px
}

.promotion-drop .per_ac1 {
    width: auto
}

.selec-person {
    width: 177px;
    margin: 0;
    border-top: 0;
    border-radius: 0;
    z-index: 99999
}

.proDropdown .dropdown-menu li a {
    color: #000
}

.input-group .form-control:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

#modalPopup_NhomHHDV {
    z-index: 99999
}

.per_ac1 li {
    background: #dfdfdf;
    color: #333;
    line-height: 30px;
    text-align: left
}

.list-ch li a {
    color: #000
}

.selec-person .fa-times {
    display: none
}

.selec-person .fa-check {
    padding-right: 10px;
    color: #32b7b3;
    position: absolute;
    right: 0;
    line-height: 30px;
    display: none;
    top: 0;
    left: unset;
    width: 30px;
    padding: 3px;
    height: 30px;
    line-height: 24px;
    text-align: center;
}

.choose-person .fa-check {
    display: none;
    float: right;
    padding-right: 20px;
    line-height: 21px;
    color: #009ddc
}

.promotion-drop .selec-person.dropdown-menu {
    width: 100%
}

.per_ac1 .fa-times {
    padding-left: 10px
}

.choose-date .dropdown-menu {
    left: 169px;
    top: -68px;
    width: 500px;
    padding-bottom: 13px;
    border-radius: 4px;
    background: var(--color-main);
    padding: 5px 10px 10px 10px;
    box-shadow: 0
}

    .choose-date .dropdown-menu h3 {
        font-size: 1rem;
        padding: 0;
        font-weight: 700;
        margin-top: 15px;
        color: #fff;
        float: left;
    }

    .choose-date .dropdown-menu li a {
        color: white !important;
        font-size: 1rem
    }

    .choose-date .dropdown-menu:after {
        content: '';
        position: absolute;
        top: 70px;
        left: -8px;
        border-bottom: 8px solid transparent;
        border-top: 8px solid transparent;
        border-right: 8px solid var(--color-primary)
    }

.plus_not {
    position: absolute;
    right: 25px;
    top: 7px;
    color: var(--color-main);
    font-size: 1rem
}

#wait {
    display: block;
    width: 130px;
    height: 89px;
    position: absolute;
    top: 42%;
    left: 40%;
    text-align: center;
    padding: 2px;
    z-index: 999
}

    #wait img {
        height: 48px;
        width: 48px
    }

.red {
    font-size: 1rem;
    padding-left: 5px
}

.bnt-bought {
    background: #06941a
}

textarea {
    border-radius: 4px;
    width: 100%;
    border: 1px solid #ccc
}

.table-reponsive-price {
    height: auto;
    overflow: inherit
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

::-webkit-scrollbar-thumb {
    background: #e9eaf2;
    border-radius: 0;
    -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3)
}

.tab-table1 > li > a {
    border-radius: 0
}

.spa .total-order {
    height: 259px
}

.total-order {
    position: absolute;
    bottom: 0;
    height: 280px;
    background: #fff;
    padding-right: 26px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    padding: 0 0 25px;
    color: #333;
    z-index: 99
}

.cashier-bill #order-list li:hover {
    background: rgba(255,255,255,.5)
}

.delete-attribute, .icon-del {
    height: 30px;
    color: #e47885;
    font-size: 1rem;
    padding-right: 10px
}

.fa-info-circle {
    padding-top: 6px;
    font-size: 15px;
    right: -4px;
    top: 0
}

    .fa-info-circle:hover {
        color: var(--color-primary)
    }

.form-group .col-sm-8 .fa-info-circle {
    position: absolute;
    top: 0;
    right: -8px
}

.img-commodity {
    float: left
}

    .img-commodity img {
        width: 100%;
        height: 100%
    }

.img-list-c {
    float: left;
    height: auto;
    max-height: 210px;
    overflow: auto;
    display: flex;
    flex-wrap: wrap;
}

#errorAnh {
    float: left;
    line-height: 30px;
    padding: 0 7px;
    margin-left: 7px;
    border-radius: 4px;
    background: #ffe0d9
}

.img-commodity p {
    margin-top: 5px;
    position: relative;
    margin-bottom: 0
}

    .img-commodity p label {
        line-height: 15px !important
    }

.bg-gray {
    background: #e6e6e6;
    font-weight: 700;
    border-top: 1px solid var(--color-primary) !important
}

.op-object-detail.nav-tabs a {
    color: #000
}

.op-object-detail.tab-content {
    padding: 0 20px 20px 20px;
    float: left;
    width: 100%
}

.table_re {
    overflow: auto
}

.border-right {
    border-right: 1px solid #FF9B00
}

#panelDonViTinh .in {
    display: none
}

.panel-heading .fa-chevron-up {
    display: none
}

.pay-fix {
    bottom: 0;
    background: #fff;
    width: 97%;
    right: 0;
    position: absolute
}

.na_t {
    font-weight: 700;
    line-height: 22px;
    position: relative
}

.txtGreen {
    color: var(--color-main);
    padding-right: 5px;
    font-size: 15px
}

.txtRed {
    color: #ed5c6a;
    padding-right: 5px;
    font-size: 1rem;
    cursor: pointer
}

.title-report {
    font-size: 1rem;
    font-weight: 700
}

.toogle-report {
    width: 62px
}

.active-re:before {
    left: 50px
}

.poison {
    position: absolute;
    left: 15px;
    line-height: 27px;
    color: #747474;
    font-size: 11px
}

.transverse {
    position: absolute;
    right: 9px;
    font-weight: 700;
    color: #747474
}

.highcharts-legend-item, .highcharts-axis text, .highcharts-credits, .highcharts-menu-item {
    text-transform: capitalize !important
}

.highcharts-menu-item {
    text-transform: capitalize !important;
    font-weight: normal !important
}

.highcharts-axis-title {
    display: none
}

.repost {
    width: 100%;
    margin: auto;
    text-align: center
}

.repost-bg {
    background: #fff
}

.title-report-center {
    font-size: 19px;
    font-weight: 700;
    padding-bottom: 10px
}

.width_n {
    width: 800px !important
}

.op-filter-container .nav-tabs, .op-filter-container .nav-tabs a, .op-filter-container .nav-tabs li.active > a {
    border: none
}

.box-tab {
    position: relative;
}
/*.box-tab:after {
    content: '';
    color: var(--color-main);
    width: 10px;
    height: 10px;
    background: var(--color-main);
    position: absolute;
    border-radius: 5px;
    left: 4px;
    top: 3px;
}*/
.dash {
    padding-bottom: 15px;
    border-bottom: 1px solid #e6e6e6
}

#chart {
    font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif
}

.order-list .bx-wrapper {
    background: #f5f5f5
}

.highcharts-series rect {
    text-align: center !important
}

.highcharts-series {
    width: 30px !important;
    fill: #32b7b3 !important;
    text-align: center !important
}

.fadeInRight, .alert-success {
    z-index: 999999999 !important
}

.main-notifi {
    padding: 13px 15px 30px 15px
}

.total-right .text-right .arrow-left2 {
    left: 165px !important
}

.text-right .arrow-left2 {
    left: -215px !important
}

.connect {
    float: left;
    line-height: 34px
}

.price-sa {
    outline: none;
    height: 30px
}

.content-print {
    background: #fff;
    outline: none;
    border: 5px solid #f2f0f0
}

    .content-print table tr td {
        padding: 5px;
        border: 1px dotted #ccc
    }

.line-border {
    margin: 20px 0;
    border-bottom: 1px dashed #000
}

.print-left .cke_top, #cke_txtHoaDonBanLe, #cke_txtTrahang, #cke_txtDoiTraHang, #cke_txtNhapHang, #cke_txtTraHangNhap, #cke_txtChuyenHang, #cke_txtPhieuThu, #cke_txtPhieuChi, #cke_txtXuatHuy {
    border: none !important
}

.result-print {
    padding: 3px 35px
}

    .result-print table tr td {
        padding: 3px
    }

.notificode {
    color: red;
    display: none
}

.bold-print {
    font-weight: 700;
    margin-bottom: 3px;
    font-size: small
}

.title-print-report {
    text-align: center
}

    .title-print-report p {
        margin-bottom: 0
    }

.infor-customer {
    margin-top: 20px;
    margin-bottom: 10px
}

    .infor-customer p {
        margin-bottom: 3px
    }

.print-left button {
    margin: 20px
}

.title-establish .print-view {
    float: left
}

.print-v {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    z-index: 999999;
    background: #909090
}

.print-view-print {
    width: 800px;
    margin: auto;
    height: 100%
}

.main-print {
    display: none
}

.box-detail-print {
    width: 450px;
    border: 1px solid #32b7b3;
    padding: 15px;
    background: #fff;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    position: absolute;
    z-index: 999;
    top: 0;
    display: none;
    left: 167px
}

    .box-detail-print span {
        float: left;
        width: 50%;
        padding: 0
    }

    .box-detail-print ul {
        float: left;
        width: 100%;
        padding: 0
    }

    .box-detail-print span:nth-child(1) {
        font-weight: 700
    }

    .box-detail-print ul li {
        line-height: 22px
    }

    .box-detail-print:before {
        border-right: 9px solid #4bac4d;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        top: 11px !important;
        left: -10px;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

    .box-detail-print:after {
        border-right: 9px solid #fff;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        top: 11px !important;
        left: -9px;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

.right0 {
    right: 0px !important
}

.bg-green {
    background: #747474
}

.form-group .plus {
    background: #747474;
    color: #fff
}

.title-delete {
    color: #ed5c6a;
    font-size: 16px;
    line-height: 16px;
    font-weight: 700;
    padding-bottom: 25px
}

#modalContainer_delete {
    margin: 270px auto
}

.alert-danger {
    background: #f59d9d !important;
    color: #fff;
    box-shadow: 0 0 10px #000;
    font-size: 1rem;
    opacity: 1;
    z-index: 9999999;
    border: 1px solid rgba(0,0,0,.2) !important;
    width: 370px !important
}

    .alert-success i, .alert-danger i {
        padding-right: 10px;
        font-size: 16px
    }

.alert-success {
    background: #51a351 !important;
    color: #fff;
    box-shadow: 0 0 12px #000;
    font-size: 1rem;
    opacity: .5;
    border: 1px solid rgba(0,0,0,.2) !important;
    width: 370px !important
}

    .alert-success:hover, .alert-info:hover {
        opacity: 1
    }

.modal-body .label-b1 {
    width: 160px;
    line-height: 16px
}

.table-border {
    border: 1px solid #ccc
}

    .table-border td {
        border-bottom: 1px solid #ccc
    }

.munber-hh {
    width: 80px
}

.panel-primary {
    border: 1px solid var(--color-primary)
}

.panel-heading {
    background: var(--color-main);
    border: none
}

.attribute {
    width: 530px
}

.attribute-select {
    position: relative
}

.select-commodity {
    border: 1px solid #ccc;
    border-top: none
}

.select-commodity {
    border: 1px solid #ccc;
    border-top: none;
    padding: 7px;
    background: #fff;
    display: none;
    position: absolute;
    width: 169px;
    z-index: 99;
    border-radius: 0 0 3px 3px
}

    .select-commodity ul li {
        line-height: 25px;
        cursor: pointer
    }

        .select-commodity ul li .fa-check {
            float: right;
            display: none;
            line-height: 25px
        }

.attribute-select .drop-abt .fa-caret-up {
    display: none
}

.attribute-select .drop-abt i {
    position: absolute;
    right: 18px;
    top: 13px;
    font-size: 16px;
    color: #999
}

.attribute td {
    padding: 5px
}

.form-horizontal .control-label {
    padding: 0
}

.no-padding-right {
    padding-left: 15px !important
}

.nopading-right {
    padding-right: 0px !important
}

.nopading-left {
    padding-left: 0px !important
}

.border-dotted {
    border-bottom: 1px dotted #ccc
}

.border-bottom-group .form-group {
    border-bottom: 1px dotted #ccc;
    padding-bottom: 5px
}

.tab-col-12 {
    padding: 0px 0 0 0
}

.line-none {
    line-height: 0px !important
}

.form-group-check {
    width: 100%
}

    .form-group-check .form-checkradio {
        position: absolute;
        left: 0;
        top: 8px
    }

    .form-group-check .form-news-checkradio {
        margin-left: 20px;
        width: calc(100% - 15px) !important
    }

    .form-group-check .form-checkbox {
        position: absolute;
        left: 0;
        top: 4px
    }

    .form-group-check .form-news-checkbox {
        padding-left: 20px
    }

.delete {
    z-index: 999999999999
}

    .delete .modal-content {
        margin: -176px auto
    }

.btn-group {
    float: unset
}

.modal-backdrop:first-child {
    z-index: 1
}

.modal-backdrop:nth-child(2) {
    z-index: 40
}

.modal-backdrop:nth-child(3) {
    z-index: 99999
}

#myModalprint .modal-content {
    padding: 0px !important
}

.export {
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 0 20px;
    border-radius: 4px;
    text-align: center;
    width: 180px;
    height: 33px;
    line-height: 35px;
    background: #32b7b3;
    float: left
}

.attention {
    color: #999;
    border-bottom: 1px solid #e0e0e0;
    margin-top: 20px;
    padding-bottom: 20px
}

.attention-b {
    margin-top: 20px;
    padding-bottom: 20px
}

.btn-print {
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 0 20px;
    border-radius: 4px;
    text-align: center;
    width: 130px;
    height: 33px;
    line-height: 35px;
    background: var(--color-primary);
    float: left;
    margin-top: 17px;
    margin-left: 20%
}

.w50 {
    width: 50%;
    float: left
}

.print-img {
    width: 130px;
    height: 104px;
    border: 1px solid #999;
    padding: 8px;
    border-radius: 4px;
    margin: auto
}

    .print-img img {
        width: 100%;
        height: 100%
    }

.page-print li {
    float: left;
    width: 25%;
    padding-bottom: 12px
}

.page-print {
    margin-bottom: 30px
}

.modal-ontop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    opacity: .5;
    z-index: 888;
    display: none
}

.printpage {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    display: none;
    z-index: 9999999999
}

.inner-print {
    width: 413px;
    background: #fff;
    height: 340px;
    position: relative;
    margin: 200px auto;
    z-index: 9999999999
}

.title-print {
    line-height: 42px;
    height: 42px;
    text-align: left;
    float: left;
    padding-left: 15px
}

.close-print {
    position: absolute;
    top: 1px;
    right: 20px;
    background: #fff;
    border: none;
    height: 20px;
    font-size: 23px;
    outline: none
}

.content-print-page {
    height: 298px;
    background: #fff;
    overflow: auto;
    float: left;
    width: 100%
}

.p-fi {
    line-height: 14px;
    font-size: 8pt;
    padding-left: 16px !important
}

.barcode-pname {
    line-height: 14px;
    font-size: 8pt;
    padding-left: 30px !important
}

#mahanghoa {
    height: 10px;
    font-size: 8pt
}

.p-fi span {
    line-height: 14px !important
}

.img-print, #img-print, #img-print1 {
    background: #fff;
    margin: 0 auto
}

    .img-print p {
        margin: 0
    }

#printablediv p {
    padding: 0;
    margin: 0
}

.control-print {
    background: #909090;
    color: white !important;
    font-size: 1rem;
    padding: 8px;
    line-height: 30px
}

    .control-print a {
        color: white !important
    }

.printablediv-page {
    float: left;
    height: 82px;
    font-size: 1rem;
    width: 133px
}

.price-public {
    display: none
}

.select-commodity-p {
    width: 100%
}

.modal-body-print {
    padding: 15px
}

.seach-HH, .sum-HH {
}

.op-js-modal {
    display: none;
}

.op-js-modallnhomhh {
    display: none;
}

.modal-dialoghh {
    width: 500px;
    margin: 30px auto
}

#modalPopup_LoaiThu .form-wrap, #modal_DieuChinhDiem .form-wrap, #modalPopup_LoaiChi .form-wrap, #myModal .form-wrap, #modalPopuplg_EditND .form-wrap, #modalPopuplg_NguoiDungcapnhap .form-wrap, #modalPopuplg_NguoiDung .form-wrap, #myModalnhacungcap .form-wrap, #modalAddGroup .form-wrap, .chinhanh-modal .form-wrap, #modalContainerlg_SQ .form-wrap, #modalPopuplg_SoQuyChi .form-wrap {
    width: 73% !important
}

.search-fillter {
    display: none
}

.title-inport {
    padding-bottom: 7px
}

.link-text {
    text-decoration: underline
}

.blue {
    color: #006fa9 !important;
    cursor: pointer
}

.printinport a {
    float: left;
    line-height: 30px
}

.printinport label {
    float: left;
    width: 80%;
    height: 32px
}

.warning-content {
    color: #7b5e2a;
    background: #f9f9e0;
    border-color: #faebcc;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 3px;
    font-style: italic;
    margin-bottom: 10px;
    margin-top: 15px
}

.form-group-money {
    width: 50%
}

.selec-person i {
    right: 7px
}

.connect i {
    padding: 0 0 3px 15px;
    padding: 0 0 3px 15px;
    position: absolute;
    right: 100px;
    top: 10px
}

.close-fillter {
    position: fixed;
    z-index: 9999;
    height: 50px;
    width: 100%;
    left: 0;
    bottom: 0;
    right: 0;
    background: #fff;
    padding: 10px 15px;
    box-shadow: 0 0 5px rgba(0,0,0,.3);
    display: none;
    text-align: center
}

.kv2Btn1 {
    background: #4bac4d;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 0 20px;
    white-space: nowrap;
    border: none;
    border-radius: 2px;
    position: relative;
    cursor: pointer;
    text-align: center;
    min-width: 54px;
    height: 35px;
    line-height: 37px;
    width: 97%
}

#order-list {
    padding: 0 50px 0 0;
    float: left;
    width: 100%
}

.price-order {
    line-height: 15px;
    padding-top: 10px
}

seach li {
    padding-left: 10px;
    font-size: 13px
}

.ui-id-7 {
    position: relative
}

.ui-menu .ui-menu-item a {
    display: flex;
    text-decoration: none;
    cursor: pointer;
    font-size: 1rem;
    color: #111;
    padding: 13px 0 10px 10px
}

    .ui-menu .ui-menu-item a:hover, .ui-menu .ui-menu-item a.ui-state-active {
        display: flex;
        text-decoration: none;
        cursor: pointer;
        border: 1px dotted #ccc;
        background: rgba(0,0,0,0.05);
    }

.tit-seach {
    font-weight: 700
}

seach-hh {
    padding-right: 5px
}

.tit-none {
    padding-left: 4px
}

.divi-infor {
    left: 420px;
    top: 47px;
    line-height: 27px;
    width: 10px
}

.left-tooltip {
    left: 0;
    width: 10px
}

.label-come {
    font-weight: bold !important;
    line-height: 20px !important
}

.search-fillter-sq {
    line-height: 32px !important
}

.span-sale {
    color: red
}

.title-establish i {
    left: 205px;
    top: 21px
}

.table-res {
    width: 100%;
    overflow: auto
}

.seach-price {
    float: right;
    width: 330px;
    margin-top: 2px;
    display: none
}

.border-dou {
    float: left;
    width: 95%;
    margin: 0 3%;
    border-radius: 6px;
    padding: 15px
}

.spa-inner-product {
    padding: 10px
}

.spa-detail label {
    width: 155px !important
}

.spa-material {
    line-height: 24px
}

.pay-spa {
    padding: 96px 0 0 13px
}

    .pay-spa .notifi-order {
        width: 90%;
        text-align: center
    }

.serve label {
    float: left;
    line-height: 30px;
    margin-right: 10px;
    height: 24px
}

.serve .form-wrap {
    float: left;
    width: 130px;
    margin-right: 10px
}

    .serve .form-wrap .form-control {
        height: 26px !important
    }

.row-15 {
    margin-left: -15px
}

.inner-setup label {
    float: left;
    margin-bottom: 0
}

.inner-setup p {
    padding: 0;
    padding-left: 30px;
    margin: 0;
    line-height: 22px
}

.cart-money {
    margin-bottom: 15px;
    float: right
}

.icon-chiet-khau {
    color: var(--color-main);
    font-size: 1rem;
    margin-left: 4px
}

.cart-money input {
    text-align: right;
    border: none;
    border-bottom: 2px solid #4bac4d;
    border-radius: 0;
    font-size: 17px;
    outline: none
}

.tab-contencart {
    padding-top: 15px;
    float: left;
    width: 100%
}

    .tab-contencart td {
        border-bottom: 1px solid #ccc
    }

.pay-cart li a {
    background: #4bac4d;
    padding: 14px 11px;
    width: 119px;
    margin-right: 13px;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    padding: 10px 11px
}

.pay-cart {
    border-bottom: none
}

    .nav-tabs > .pay-cart li.active > a, .pay-cart > li.active > a:hover, .pay-cart > li.active > a:focus {
        background: #38b8e6;
        color: #fff
    }

.uses-plus .fa-minus {
    display: none
}

.uses-plus {
    line-height: 23px
}

    .uses-plus i {
        height: 30px;
        width: 30px;
        text-align: center;
        line-height: 30px
    }

.uses-plus-hide {
    display: none
}

.iptBtn-spa {
    background: #ebebeb;
    border: 1px solid #ccc;
    width: 32px;
    text-align: center;
    color: #989898;
    float: left;
    height: 28px;
    padding-top: 8px;
    margin-left: 7px
}

.modal-body-1 {
    position: relative;
    padding: 25px 10px 0 10px;
    background: #fff;
    float: left;
    padding-bottom: 0;
    width: 100%
}

.list-staff, .seach-staff {
    margin-top: 10px
}

.table-discount {
    max-height: 420px;
    overflow-x: hidden
}

.list-staff {
    max-height: 363px;
    overflow: scroll
}

.discount input {
    width: 130px;
    float: left
}

.list-staff span {
    float: right;
    padding-right: 18px;
    display: none
}

.block {
    display: block
}

.blo {
    display: block !important
}

.tab-content-701 {
    margin-right: 778px;
    position: relative
}

.modal-body-1 td {
    padding: 5px
}

.inner-setup td {
    padding: 0;
    padding-bottom: 7px
}

.list-staff li {
    line-height: 22px
}

.chec {
    position: relative;
    float: left;
    padding-top: 7px;
    margin-right: 40px
}

.name-per, .code-per {
    float: left;
    line-height: 30px;
    margin-right: 40px
}

.staff-perform {
    margin-top: 7px
}

.discount {
    float: left
}

.table-discount td {
    border: 1px solid #ccc;
    text-align: center;
    position: relative
}

.table-discount input::after {
    left: 48px !important
}

.delete-discount {
    height: 28px;
    width: 28px;
    float: left;
    padding-top: 5px;
    margin-left: 5px;
    font-size: 15px;
    background: #cc4f5b;
    border-radius: 3px;
    color: #fff
}

.material {
    position: absolute;
    background: #fff;
    height: 80px;
    width: 200px;
    border: 1px solid #5dba00;
    z-index: 999;
    padding: 10px;
    font-weight: 400;
    border-radius: 5px;
    display: none
}

.na_t .name:hover .material {
    display: block
}

.material:before {
    border-bottom: 6px solid #5dba00;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    top: -7px;
    content: '';
    position: absolute;
    width: 0;
    height: 0
}

.synchronous label {
    float: left;
    width: 80px
}

.synchronous .for {
    float: left;
    width: 104px
}

.synchronous .col-lg-5 label {
    float: left;
    width: 124px
}

.modal-body-1 .name-product {
    width: 160px !important
}

.modal-body-1 label {
    width: 145px
}

.modal-body-1 .form-group {
    margin-bottom: 10px !important
}

.modal-body-1 table td {
    border: 1px solid #ccc
}

.view-end {
    float: left;
    margin-left: 20px;
    padding-top: 1px
}

.list-ch {
    border-radius: 0;
    width: 350px !important;
    left: -208px !important
}

#list-item-choose span a {
    line-height: 19px;
    color: #666 !important
}

.list-ch a {
    color: #666 !important
}

.content-kitchen-p {
    margin-left: 15px
}
/*.op-filter-container .menuCheckbox input[type=radio] {
    padding-top: 9px
}*/
textarea {
    padding: 6px
}

.wait-room p {
    padding-left: 0
}

#wait-kitchent table {
    border-radius: 5px;
    background: #f1f2f2;
    margin-bottom: 10px
}

#wait-kitchent tr td {
    background: #f4f4f4;
    border: 1px solid #bfc1c3
}

#wait-kitchent {
    padding: 10px 30px;
    overflow: scroll;
    height: 90%;
    overflow-x: hidden
}

    #wait-kitchent tr h3 {
        font-size: 1rem;
        font-weight: 700;
        margin: 0;
        padding-bottom: 7px
    }

    #wait-kitchent tr td {
        white-space: inherit !important;
        border: 1px solid #dfdfdf;
        border-right: 1px solid #f4f4f4
    }

    #wait-kitchent tr .tr-name-wait {
        border-radius: 5px 0 0 5px !important
    }

.wait-number {
    float: left;
    background: #fff;
    border: 1px solid #dfdfdf;
    line-height: 44px;
    width: 45px;
    height: 45px;
    text-align: center;
    margin-right: 24px
}

.wait-room {
    float: left;
    padding-top: 10px;
    width: 150px
}

.wait-next {
    background: #ff8fac !important;
    text-align: center;
    right: 0;
    bottom: 0;
    width: 40px !important;
    cursor: pointer;
    padding: 0
}

.bor-none {
    border: none !important
}

.wait-next a i {
    color: #fff;
    font-size: 19px
}

.wait-kitchent-right a {
    border-radius: 100%;
    text-align: center;
    float: left;
    color: #fff
}

.wait-kitchent-right .wait-next a i {
    padding-top: 15px;
    color: #fff;
    font-size: 19px
}

#wait-kitchent p {
    color: #808285;
    font-size: 1rem;
    margin: 0
}

#wait-kitchent .inner-setup {
    border: 1px solid #dfdfdf;
    border-radius: 5px
}

.wait-next-oll {
    background: #f7496e !important;
    border-radius: 0 5px 5px 0;
    position: relative
}

    .wait-next-oll a {
        border-radius: 0 5px 5px 0;
        background: #f7496e;
        text-align: center;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        line-height: 63px
    }

        .wait-next-oll a i {
            font-size: 25px !important
        }

.finished-end {
    border-right: 1px solid #ccc !important
}

.finished {
    width: 50px
}

.supplier label {
    line-height: 30px;
    margin-bottom: 0
}

.detail-warehouse .form-control[readonly] {
    background: #fff
}

.importgoods {
    right: 100px;
    top: 0
}

    .importgoods:before {
        top: 13px !important;
        right: -17px;
        border-left: 10px solid #32b7b3;
        border-bottom: 7px solid transparent
    }

    .importgoods::after {
        top: 13px !important;
        right: -12px;
        border-left: 10px solid #fff;
        border-bottom: 7px solid transparent
    }

.callprice-left {
    height: 30px;
    line-height: 35px
}

.importgoods {
    width: 300px
}

.form-group-customer {
    width: 73%;
    float: left
}

.menu-main li ul li ul {
    left: 0;
    top: 30px;
    display: none
}

    .menu-main li ul li ul li {
        padding-left: 0
    }

.menu-main li:hover ul li ul {
    display: none
}

#lblThe {
    top: -10px;
    color: #888;
    font-size: 11px;
    font-style: italic
}

.expand {
    font-size: 13px
}

.pencel-edit {
    display: none;
    width: 37px
}

.pencel-add {
    width: 37px
}

.checkbox-time {
    float: left;
    width: 30px;
    position: relative
}

.form-wrap-time {
    width: 69% !important;
    float: left
}

.Submission .footer-right, .Submission .form-wrap {
    width: 75%
}

.Submission .modal-footer {
    border: none;
    padding: 8px 0 15px 0px !important
}

.Remind .form-wrap #checkbox-time {
    float: left;
    width: 12%;
    margin-top: 7px;
    position: relative
}

.Remind .form-wrap .form-control {
    width: 86%;
    float: left
}

.btnxoa {
    display: none;
    float: right
}

.content-fitter ul {
    width: 100%;
    overflow: auto;
    overflow-x: hidden
}

.active-admin {
    background: #85b069 !important
}

    .active-admin:before {
        left: 29px !important
    }

.radio-admin {
    margin-right: 40px;
    float: left;
    line-height: 34px
}

.unselectable {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.operation {
    display: none
}

.op-header {
    float: left;
    width: 100%;
    padding-bottom: 5px
}

    .op-header .btnMenu {
        margin-bottom: 0
    }

.choose-commodity {
    color: #888;
    margin-bottom: 10px;
    font-size: 11px;
    float: left;
    height: 16px
}

.img-filter-nang-cao img {
    height: 15px;
    margin: 5px;
    opacity: .6
}

.btn-header-filter .btn-group button font {
    font-size: 1rem
}

.btn-header-filter .btn-group img {
    margin-bottom: 2px;
    height: 14px
}
/*.table-reponsive tr:hover .pen-destroys, .table-reponsive tr:hover .destroys-number {
    background: #eaf8f7
}*/
.list-commodity-show {
    width: 100%;
    margin-bottom: 36px;
    float: left;
    max-height: 393px;
    overflow: auto
}

    .list-commodity-show table th, .list-commodity-show table td {
        border: 1px solid #ccc
    }

    .list-commodity-show .page {
        border: 1px solid #ccc;
        border-top: none
    }

    .list-commodity-show .page {
        border: 1px solid #ccc;
        border-top: none
    }

.txtpink {
    color: #e47885
}

.btnMenu .dropdown-menu li a {
    font-size: 1rem
}

.list-commodity-show input {
    width: 90px;
    float: right
}

#myModalprint {
    z-index: 1049
}

#mymodaltableprint {
    z-index: 1045
}

.modal-ontop1 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    opacity: .5;
    z-index: 1046;
    display: none
}

.op-js-modal1 {
    display: none;
}

#mymodaltableprint .modal-footer {
    padding: 20px 0 35px 0px !important
}

#mymodaltableprint .list-commodity-show {
    margin-bottom: 25px
}

.menu-shipping label {
    margin-bottom: 10px
}

.tab-shipping .select-user {
    position: absolute;
    left: 120px
}

.tab-shipping-form {
    border: 1px solid #ccc !important;
    border-radius: 5px !important
}

.tab-shipping .title-bill {
    padding: 0 0 15px
}

.tab-shipping .bill-pen i {
    left: 5px
}

.tab-shipping .bill-pen {
    margin-bottom: 200px;
    margin-top: 10px
}

.right-content-infor .form-wrap {
    text-align: left
}

.pading0 {
    padding-left: 0px !important;
    font-size: 1rem
}

.table-shiping table > tbody > tr > td {
    vertical-align: middle;
    text-align: left
}

.table-shiping .icon-del {
    height: auto
}

.table-shiping .angle-d {
    padding-top: 3px
}

.number-shop {
    width: 108px
}

.seach-left {
    position: absolute;
    top: 4px;
    left: 6px;
    font-size: 1rem;
    color: #666
}

.seach-warehouse .shop {
    padding-left: 24px
}

.name-shop .text_area {
    top: 44px;
    left: 0
}

    .name-shop .text_area:before {
        border-bottom: 6px solid #5dba00;
        border-right: 7px solid transparent;
        border-left: 7px solid transparent;
        top: -3px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        left: 5px
    }

.switch-tables {
    width: 100%;
    left: 0;
    top: 30px;
    max-height: 350px;
    overflow: auto;
    border-radius: 3px;
    border-top: none
}

.menu-import {
    float: left;
    margin-top: 10px
}

.tab-shipping .title-bill {
    color: #666;
    font-size: 11px
}

.detail-infor label {
    font-weight: 600
}

.date-item {
    width: 100%;
    float: left;
    background: #fff;
    padding: 0 0
}

.date-grid ul li {
    width: 14.2%;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    float: left
}

.appointment-data {
    background: #c7eaf7;
    line-height: 35px;
    padding-left: 10px;
    font-weight: 700;
    border-bottom: 1px solid #ccc;
    margin-bottom: 5px;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc
}

.appointment-title {
    line-height: 26px;
    padding-left: 10px;
    height: 100px
}

.appointment-footer {
    height: 45px;
    padding-left: 20px
}

.date-grid ul li:nth-child(3n) {
    margin-right: 0
}

.choose-commodity {
    display: none
}

.btn-blue {
    background: #01b0f2;
    color: #fff;
    font-family: Roboto-Regular;
    font-size: 1rem;
    text-align: center;
    float: right;
    margin: 2px 14px 0;
    line-height: 30px;
    padding: 0 10px;
    border-radius: 4px;
    float: left
}

#myModaldetall .detail-content label {
    padding: 0
}

.appointment-scroll {
    overflow: scroll;
    width: 100%;
    height: 85px
}

.name-month {
    float: left;
    font-size: 23px;
    line-height: 22px;
    color: #65A0CE
}

.main-girl {
    margin-bottom: 15px
}

.main-time ul li {
    width: 24%;
    float: right
}

.main-time ul {
    width: 100%
}

    .main-time ul li .img {
        float: left
    }

    .main-time ul li .name {
        float: left;
        font-size: 15px;
        line-height: 30px;
        color: #65A0CE;
        padding-left: 6px
    }

.appointment-title .floatleft {
    line-height: 15px
}

.appointment a {
    outline: none
}

.date-grid ul li:nth-child(8n) {
    border-left: 1px solid #ccc
}

.date-grid ul li:nth-child(1) {
    border-left: 1px solid #ccc
}

.amdin li a {
    padding: 0px !important
}

.list-name-staff {
    max-height: 320px;
    overflow: auto
}

.cal-context {
    width: 100%;
    float: left;
    margin-top: 20px;
    height: 40px;
    z-index: 99999
}

.cal-row-head {
    background: #c7eaf7 !important
}

.cal-month-box {
    float: left;
    width: 100%
}

.cal-month-box, .cal-year-box {
    background: #fff
}

.fillter {
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    padding-bottom: 5px;
    background: var(--color-main)
}

    .fillter:hover a {
        color: white !important
    }

    .fillter a {
        float: left;
        width: 100%;
        padding: 4px 10px !important;
        color: white !important;
        font-weight: 400 !important;
        text-align: left !important
    }

.branch-li:hover .fillter {
}

.chinhanh .branch-li {
    float: left;
    text-align: right
}

.branch-li .branch label {
    width: 70px;
    overflow: hidden;
    white-space: nowrap !important;
    right: 7px
}

ul.ui-autocomplete {
    z-index: 999999999999
}

.menu-main li a {
    padding: 14px;
    font-size: 13px
}

.btn-menu {
    float: left;
    width: 83px;
    height: 46px;
    text-align: center
}

.menu-main li .fa-angle-down {
    padding-top: 10px;
    position: absolute;
    top: 8px;
    right: 2px
}

.orangce {
    color: #eb4a24 !important
}

.dropdown-menu-right li a {
    text-transform: none;
    color: #4d4d4d
}

.activity ul li:last-child {
    border-bottom: none
}

.padingtop {
    padding-top: 20px
}

.menu-main li ul li img {
    padding-right: 10px
}

.menu-main li ul li .fa-angle-down {
    padding-top: 10px;
    position: absolute;
    top: -1px;
    right: 8px
}

.diary a {
    color: #000
}

.activity ul li :hover font {
    color: #000
}

.logo {
    display: none
}

.op-filter {
    width: 230px;
    float: left;
    padding-bottom: 36px
}

.content-table {
    float: right;
    width: calc(100% - 240px);
    color: #000;
    padding-left: 5px;
    min-height: 600px;
    margin-bottom: 50px
}

.last .form-control {
    border: 1px solid #32b7b3
}

.direct {
    padding-bottom: 10px
}

.btn-green {
    background: var(--color-main);
    color: #fff
}

.btn-redTr {
    background: #ed5c6a
}

.btn-closeTr {
    background: #898b8e
}

.btn-blue-b {
    background: var(--color-primary)
}

.btn-pink {
    background: #ff6464
}

#modalContainerlg_giaban .btn-pink {
    float: left
}

.menuCheckbox .radio-menu {
    float: left;
    width: 14%
}

.menuCheckbox .conten-choose {
    float: left;
    width: 86%;
    line-height: 23px
}

#clicksua {
    float: right
}

#clickluu {
    display: none;
    float: right
}

#cal-day-box .cal-day-hour-part {
    line-height: 30px
}

.modal-body li.active {
    border-bottom: none;
}

.tab-news-modal .nav-tabs {
    border-bottom: 1px solid var(--color-primary) !important;
}

    .tab-news-modal .nav-tabs li {
    }

        .tab-news-modal .nav-tabs li a {
            margin: 0px !important;
            font-weight: 700;
            padding: 15px 15px;
            border-top: 1px solid white !important;
            border-left: 1px solid white !important;
            border-right: 1px solid white !important
        }

        .tab-news-modal .nav-tabs li.active a {
            border-top: 1px solid var(--color-primary) !important;
            border-left: 1px solid var(--color-primary) !important;
            border-right: 1px solid var(--color-primary) !important
        }

        .tab-news-modal .nav-tabs li.active:hover a {
            border-top: 1px solid var(--color-primary) !important;
            border-left: 1px solid var(--color-primary) !important;
            border-right: 1px solid var(--color-primary) !important;
            border-bottom: none;
        }
/*.modal-body .nav-tabs > li.active > a {
    border: 1px solid #fff
}*/
/*.modal-body .nav-tabs {
    border: 1px solid #fff
}*/
.modal-header {
    background: #fff;
    font-weight: 700;
    height: 40px;
    line-height: 20px;
    border: none;
    background: var(--color-main);
    color: #fff;
    padding: 10px 15px;
    cursor: move;
}

.modal-headerTr {
    background: #fff;
    font-weight: 700;
    height: 40px;
    padding-top: 10px;
    padding-left: 30px;
    border: none;
    background: #32b7b3;
    color: #ed5c6a
}

.magin-top {
    font-size: 1rem;
    margin-bottom: 8px !important
}

#modalPopuplg_DichVu .modal-body .tab-content, #modalPopuplg_HH .modal-body .tab-content {
    padding: 20px 30px 5px 30px
}

#modalPopuplg_DichVu .modal-body, #modalPopuplg_HH .modal-body {
    padding: 0
}

.soquy_modal .nav > li > a {
    padding: 10px 24px
}

.soquy_modal .tab-content {
    padding: 1px
}

.soquy_modal .nav-tabs {
    border-bottom: 1px solid #ddd
}

.soquy_modal li.active {
    border: none
}

.soquy_modal .nav-tabs .title-tab {
    font-weight: 700
}

.modal-search-tab .fa-search {
    position: absolute;
    right: 306px
}

.modal-search-tab button {
    top: 0;
    height: 30px
}

.soquy_modal .tab-content > .active {
    border: 1px solid #ddd;
    border-top: none;
    padding: 10px;
    margin-top: -1px;
    display: inline-block;
    width: 100%
}

.soquy_modal li {
    margin-bottom: -1px
}

.modal-content {
    border-radius: 0
}

.modal-header h4 {
    font-size: 17px;
    font-weight: 700
}

.modal-header .close {
    position: absolute;
    width: 45px;
    height: 40px;
    right: 0;
    top: 2px;
    font-size: 25px;
    color: white;
    outline: none;
    opacity: 1
}

    .modal-header .close:hover {
        background: rgba(0,0,0,0.15)
    }

.commodity-note:hover .materiall {
    display: block
}

.commodity-note {
    position: absolute;
    right: 15px;
    top: 1px;
}

    .commodity-note .materiall {
        position: absolute;
        background: #fff;
        height: auto;
        width: 250px;
        border: 1px solid var(--color-primary);
        box-shadow: 1px 1px 10px rgba(0,0,0,0.15);
        z-index: 999;
        padding: 10px;
        font-weight: 400;
        border-radius: 5px;
        right: -15px;
        top: 25px;
        display: none;
    }


    .commodity-notev2:hover .materiall {
        display: block
    }

.commodity-notev2 {
    position: absolute;
    right: 50px;
    top: 1px;
}

    .commodity-notev2 .materiall {
        position: absolute;
        background: #fff;
        height: auto;
        width: 250px;
        border: 1px solid var(--color-primary);
        box-shadow: 1px 1px 10px rgba(0,0,0,0.15);
        z-index: 999;
        padding: 10px;
        font-weight: 400;
        border-radius: 5px;
        right: -15px;
        top: 25px;
        display: none;
    }

.materiall:before {
    border-bottom: 6px solid var(--color-primary);
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    top: -6px;
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    right: 13px;
}

.check-group {
    padding-left: 7px;
    width: 35px !important;
    min-width: 35px !important;
    position: relative
}

#thanhphanhide {
    display: none;
    padding-bottom: 10px;
    width: 100%;
    text-align: right
}

.ifram-print {
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    background: #fff
}

.print-customer {
    height: 720px;
    margin-top: 0
}

.bg-load {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    opacity: .3;
    z-index: 10001
}

.drop-column {
    right: 0
}

.happy-wait {
    z-index: 10002;
    color: #14a1d4;
    font-weight: 700;
    font-size: 16px;
    margin-top: 10px
}

.wrap-radio {
    padding-top: 7px
}

.bxslider li img {
    width: 100%;
    height: 100%
}

.img-item {
    width: 99%;
    height: 95px;
    float: left
}

.choose-img {
    padding-top: 15px;
    text-align: center;
}

.form-wrap-cs {
    width: 67%
}

.deatal-custummer {
    padding-top: 5px
}

.cheack-conpany {
    float: left;
    border: 1px solid #ccc;
    height: 30px;
    border-radius: 4px;
    margin-right: 5px;
    padding: 3px !important;
    line-height: 32px;
    display: flex;
    padding-left: 0;
    font-size: 1rem;
    display: flex;
    line-height: 24px !important;
    justify-content: space-evenly;
}

.tgg {
    width: 100%
}

.cheack-conpany input {
    position: relative
}

.check-personal input {
    position: relative
}

.check-company > span, .check-personal > input {
    width: 50%
}

.check-personal {
    float: left;
    border: 1px solid #ccc;
    height: 30px;
    border-radius: 4px;
    line-height: 24px;
    padding-left: 3px;
    display: flex;
    font-size: 1rem;
    padding: 3px;
}

.detail-produc-customer {
    width: 1163px
}

.classification {
    position: relative;
    float: left
}

    .classification .input-group-btn {
        right: 32px;
        position: absolute;
        top: 0;
        z-index: 9999
    }

#modalContainerlg_TuVan .form-wrapp {
    width: 83.5% !important
}

#modalContainerlg_VT .form-wrapp {
    width: 83.5% !important
}

    #modalContainerlg_VT .form-wrapp textarea {
        width: 100%
    }

.consultant {
    width: 130px !important
}

.rewards {
    position: relative;
    float: left
}

.form-wrap span {
    padding-right: 15px;
    line-height: 32px;
    position: relative
}

.tab-sections {
    padding: 15px 0 15px 0
}

.date-rewards {
    position: absolute;
    right: -6px;
    top: 0;
    height: 30px;
    border-left: 1px solid #ccc;
    width: 34px;
    text-align: center;
    line-height: 27px
}

.rewards .date-rewards {
    right: 0
}

.consultantt {
    width: 111px !important
}

.close-goods {
    float: left;
    width: 100%;
    padding-top: 7px;
    text-align: right;
    padding-right: 15px
}

    .close-goods i {
        font-size: 11px
    }

.c-goods {
    display: none
}

.scoll-r {
    overflow: inherit !important;
    max-height: 100% !important
}

.ss-li ul {
    display: none
}

.close-ul {
    position: absolute;
    left: 14px;
    top: 2px
}

.ghi-chu-note:before {
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    bottom: 0;
    font-size: 15px;
    content: '\f040';
    color: var(--color-main)
}

.fa-money {
    color: var(--color-main)
}

.open li .fa-pencil-square-o {
    right: 30px
}

.treeview .open {
    display: block !important;
    position: relative
}

.ss-li .square {
    position: absolute;
    right: 10px;
    top: 1px
}

.white {
    background: #fff
}

.yellow {
    background: #e6f5d6
}

.btn-gr {
    background: var(--color-main)
}

.status-lable {
    width: 69%
}

.close {
    font-size: 20px;
    text-shadow: none
}

option {
    padding: 5px !important
}

.btn-blue-b:hover {
    color: #a0d6c6
}

#btnThemMoiNhom {
    color: #666;
    top: 0
}

.font400 {
    font-weight: 400
}

.bill-left {
    width: 60%;
    float: left;
    padding-right: 10px
}

.bill-right {
    width: 40%;
    float: left;
    padding-left: 10px;
    position: relative
}

.bill-content .bill-right {
    border-left: 2px solid #d4d5d6
}

.bill-header {
    height: 40px;
    background: #ebebeb
}

.bill-seach {
    padding-top: 5px;
    position: relative;
    float: left;
    width: 49%
}

.bill-home {
    float: left;
    width: 30px;
    height: 45px;
    padding-top: 9px
}

.bill-bxslide {
    width: 405px !important;
    float: left;
    height: 30px;
    line-height: 30px;
    padding-top: 5px;
    padding-left: 10px
}

    .bill-bxslide ul li {
        background: #fff;
        border-radius: 4px;
        text-align: center;
        width: 80px;
        float: left;
        margin-right: 3px
    }

.bill-bxslide {
    position: relative
}

    .bill-bxslide ul {
        height: 32px
    }

    .bill-bxslide .bx-wrapper .bx-prev {
        width: 13px;
        height: 30px;
        padding-top: 5px;
        background: #fff;
        text-align: center;
        border-radius: 2px;
        margin-top: -15px;
        color: #000;
        font-size: 18px;
        top: 16px
    }

    .bill-bxslide .bx-wrapper .bx-next {
        right: -17px;
        width: 13px;
        height: 30px;
        padding-top: 5px;
        font-size: 18px;
        background: #fff;
        text-align: center;
        border-radius: 2px;
        margin-top: -15px;
        color: #000;
        top: 16px
    }

.qua-tang-km {
    color: var(--color-main);
    font-size: 18px
}

.pull-control-chinhanh {
    width: calc(100% - 185px)
}

.bill-control-right {
    width: 185px;
    float: right;
    padding-right: 15px
}

    .bill-control-right li {
        float: left;
        line-height: 46px;
        height: 40px;
        padding-left: 13px
    }

.bill-print a {
    font-size: 15px
}

.bill-content .nav-tabs > span > a {
    background: #3db7dc;
    color: #f5f5f5;
    text-decoration: none
}

    .bill-content .nav-tabs > span > a:hover {
        text-decoration: none
    }

.bill-content .nav-tabs > span.active > a {
    background: #fff;
    color: #000;
    border: none;
    text-decoration: none;
    border-top: 2px solid #d8daef
}

.bill-content .nav > span > a {
    padding: 8px 15px;
    border-radius: 2px
}

.name-menu {
    position: absolute;
    opacity: .9;
    bottom: 0;
    width: 100%;
    height: 45px;
    padding: 3px
}

.bg1 {
    background: #1f837d
}

.bill-listmenu {
    padding: 25px 50px 0 55px;
    position: relative
}

.slide-goods1 .bill-listmenu li {
    height: 143px;
    border: 1px solid #ccc;
    border-radius: 4px
}

.bill-listmenu li {
    width: 12%;
    position: relative;
    float: left;
    text-align: center;
    transition: all 0.3s ease-in-out 0.1s;
    margin: 0 13px 15px 13px;
    overflow: hidden
}

    .bill-listmenu li:hover img {
        overflow: hidden;
        transition: all 0.3s ease-in-out 0.1s
    }

.bg2 {
    background: #e77b54
}

.bg3 {
    background: #5f3477
}

.bg4 {
    background: #ac5586
}

.bg5 {
    background: #523516
}

.divLstHoaDon span .munber-goods {
    font-size: 1rem;
    font-weight: 700;
    color: #000
}

.donate span {
    font-weight: 700
}

.divLstHoaDon .active span {
    color: #000
}

.divLstHoaDon .active .munber-goods {
    color: #e56564
}

.bill-content .bill-right .nav > li > a {
    padding: 0;
    border-radius: 2px;
    height: 32px;
    line-height: 29px;
    width: 80px;
    text-align: center
}

.bill-infor .nav-tabs > li > a {
    border-bottom: 2px solid #ecebeb;
    font-weight: 700;
    color: #000;
    border: none;
    font-weight: 400;
    padding: 3px 15px
}

.bill-infor .nav-tabs > li:hover > a {
    background: #fff
}

.bill-infor .nav-tabs > li.active > a {
    border: none;
    border: 1px solid var(--color-primary);
    color: #000;
    font-weight: 700;
    border-bottom: none;
    padding: 3px 15px;
    background: #fff;
    height: 25px
}

.bill-print-flast {
    float: right !important;
    height: 30px;
    width: 30px;
    text-align: center;
    cursor: pointer;
    margin-left: 3px
}

.bill-barcode label {
    width: 94px;
    float: left;
    line-height: 30px
}

.bill-barcode input {
    float: left;
    width: 145px
}

.bill-barcode {
    margin-top: 15px
}

.replus {
    position: relative;
    float: left
}

.plus-bill {
    position: absolute;
    height: 30px;
    width: 30px;
    right: 5px;
    text-align: center;
    line-height: 30px;
    padding-top: 9px;
    border-left: 1px solid #ccc;
    color: #999
}

.munber-bill {
    max-width: 45px;
    float: left;
    text-align: center;
    overflow: hidden;
    height: 29px;
    padding: 1px 4px;
    border: none;
    outline: none
}

.grocery .munber-bill {
    max-width: 50px;
    text-align: right;
    border: none;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    border-bottom: 1px solid #ccc
}

.grocery .bill-pluss:hover {
    color: #939598
}

.bill-plus {
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    margin: 0;
    min-width: 30px;
    height: 30px;
    color: #2b2b2c;
    font-size: 24px;
    line-height: 18px;
}

.bill-pluss {
    height: 27px;
    background: #d8dbef;
    text-align: center;
    padding-top: 7px;
    color: #58595b;
    margin-right: 4px;
    border-radius: 3px;
    font-size: 15px;
    width: 28px;
    float: left
}

.w701 .bill-bxslide ul li span:hover {
    color: #ff8375
}

.inner-listchoose {
    position: relative
}

.total-bill-last {
    width: 67px;
    line-height: 30px;
    text-align: right
}

.inner-listchoose div {
    float: left
}

.total-bill-last span {
    text-align: right;
    line-height: 30px
}

.inner-listchoose span {
    font-weight: 700
}

.bill-de {
    margin-top: 4px;
    float: left;
    width: 20px
}

.grocery .bill-de {
    margin-top: 13px
}

.bill-note {
    float: left;
    background: #1c9b94;
    width: 45px;
    height: 20px;
    border-radius: 2px;
    color: #fff;
    padding-left: 2px;
    line-height: 20px;
    font-size: 11px
}

.p0 {
    padding: 0px !important
}

.p01 {
    padding: 0px !important;
    line-height: 36px !important
}

.grocery .p01 {
    padding: 0 0 0 8px !important
}

.p01 img {
    padding-left: 7px;
    cursor: pointer
}

.bg6 {
    background: #e3e8e8
}

.btn-control {
    width: 100%;
    border-radius: 6px;
    font-size: 15px;
    height: 53px;
    text-align: center;
    margin: auto;
    margin-bottom: 4px
}

    .detail-infor button, .btn-control button {
        color: #fff;
        width: 125px;
        height: 53px
    }

.bg7 button, .bg7 {
    background: #f15a29;
    border: none;
    outline: none
}

.bg8 button, .bg8 {
    background: var(--color-primary);
    border: none;
    outline: none;
}

.bg9 button, .bg9 {
    background: var(--color-button-thanh-toan);
    border: none;
    outline: none;
}

.btn-import {
    background: var(--color-main) !important
}

.btn-nha-bep {
    float: right !important;
    width: calc(100% - 360px) !important;
    margin: 0;
    margin-right: 10px !important
}

.footer-bill {
    height: 245px;
    bottom: 0;
    right: 0px !important;
    color: #333;
    width: 100%;
    z-index: 10;
    padding-left: 30px;
    padding-top: 4px;
    background: #ddf7f5;
    position: fixed;
    bottom: 0;
    width: 580px;
    left: auto;
    border-left: 10px solid #ebebeb
}

    .footer-bill table td:hover, .footer-bill table td {
        background: #ddf7f5 !important
    }

.bill-listchoose {
    height: calc(100% - 370px);
    overflow-x: auto;
    padding-bottom: 20px
}

.btn-nha-bep div {
    padding: 15px;
    font-size: 1rem;
    margin-bottom: 10px;
    margin-top: 5px;
    border-radius: 4px;
    color: #fff;
    float: left;
    width: 100%;
    text-align: center
}

    .btn-nha-bep div a {
        width: 100%
    }

.nha-bep-thong-bao {
    background: #58595b
}

.nha-bep-ghep {
    background: var(--color-primary)
}

.nha-bep-thanh-toan {
    background: var(--color-button-thanh-toan)
}

.add-top {
    right: 6px;
    position: absolute !important;
    margin-right: -4px !important;
    top: 0
}

    .add-top a {
        padding: 8px 11px !important
    }

.bill-time {
    background: #69cbc5;
    padding: 2px 12px;
    position: absolute;
    left: 45px;
    border-radius: 10px
}

.table-list li {
    height: 135px;
    width: 143px;
    float: left;
    text-align: center;
    color: #fff;
    position: relative
}

    .table-list li img {
        margin-top: 20px
    }

    .table-list li h2 {
        color: #000;
        font-size: 25px
    }

.table-list {
    margin-top: 25px
}

.scoll-table li {
    float: left;
    height: 30px
}

.scoll-table {
    white-space: nowrap !important;
    height: 47px;
    overflow-x: scroll;
    overflow-y: hidden;
    position: relative
}

.scoll-creat {
    height: 10px;
    width: 100%;
    position: absolute;
    background: #fff;
    border: 1px solid #ccc
}

.scoll-table::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff
}

.scoll-table span {
    line-height: 32px;
    padding-right: 3px
}

.w70 {
    margin-right: 580px;
    position: relative
}

.w30 {
    float: right;
    width: 580px;
    position: relative;
    height: calc(100% - 45px)
}

.w300 {
    float: right;
    width: 400px;
    position: relative;
    background: #fff;
    border-left: 2px solid #d4d5d6;
    height: 100%
}

.serve-bill {
    float: left;
    line-height: 36px;
    padding-right: 10px;
    font-weight: 400
}

.replus div, .replus input {
    font-size: 1rem;
    float: left;
    width: 68.5%;
    line-height: 30px
}

.border-left {
    border-left: 10px solid #ebebeb
}

.footer-bill table td {
    color: #000
}

.bill-imgtable h4 {
    color: #000
}

.bill-imgtable img {
    width: 74px;
    height: 45px
}

.li-replus {
    float: right !important;
    padding-right: 10px
}

.name-restaurant {
    font-size: 20px;
    text-transform: uppercase;
    width: 80%;
    margin: auto;
    margin-top: 5px
}

.adress-res {
    margin-top: 8px
}

.code-res {
    margin-top: 10px;
    font-size: 17px
}

#printflast, #printflast table {
    color: #000;
    font-size: 1rem;
    z-index: 999999;
    overflow: scroll
}

.detai-res {
    margin-top: 10px;
    margin-bottom: 10px
}

.drop-bill {
    width: 30px !important;
    white-space: normal;
    white-space: pre-wrap
}

.bold {
    font-weight: 700
}

.thanks-res {
    width: 240px;
    height: 30px;
    background: #000;
    color: #fff;
    text-align: center;
    line-height: 30px;
    margin: auto;
    border-radius: 4px;
    font-size: 15px;
    margin-top: 10px
}

.footer-res {
    border-top: 1px solid #949599;
    padding-top: 20px;
    margin-bottom: 20px;
    text-align: right;
    padding-right: 24px
}

.inner-modal {
    padding: 10px 20px 0 20px
}

.modal-bill {
    padding: 10px
}

.bill-totaltable {
    padding: 0 20px 0 20px
}

.modal-bill {
    font-size: 1rem;
    color: #000
}

.total-left {
    float: left;
    width: 60%;
    line-height: 30px;
    position: relative
}

.total-right {
    float: right;
    width: 240px;
    line-height: 30px;
    position: relative;
    padding-right: 3px;
    border: none;
    border-bottom: 1px solid #bcbdbf;
    outline: none;
    height: 30px;
    margin-right: 20px
}

    .total-right a {
        position: absolute;
        right: 0;
        top: 0;
        height: 30px;
        width: 30px;
        font-size: 17px;
        border: 1px solid #ccc;
        text-align: center;
        padding-top: 5px;
        background: #fff;
        border-radius: 0 3px 3px 0
    }

.left24 {
    width: 100%;
    float: left;
    padding-top: 5px
}

.table_choose {
    position: relative
}

.synchronous {
    position: relative
}

.synchronousspan {
    height: 18px;
    width: 18px;
    background: #fff;
    position: absolute;
    top: 5px;
    border-radius: 20px;
    right: 72px;
    line-height: 19px;
    text-align: center;
    border: 1px solid #ccc
}

.grocery .synchronousspan {
    right: 86px
}

.name-goods {
    height: 40px;
    overflow: inherit
}

.bx-controls {
    display: none
}

.bxslider {
    float: left
}

.bx-viewport {
    height: 142px !important
}

.logoOpen24 {
    float: left;
    width: 185px;
    padding-left: 5px;
    text-align: center
}

.tab-inner2 {
    float: left;
    padding-top: 5px
}

    .tab-inner2 ul li a {
        float: left;
        width: 117px;
        height: 32px;
        background: #fff;
        border-radius: 4px;
        padding: 0;
        margin-right: 3px;
        line-height: 30px;
        color: #000;
        font-weight: 700;
        text-align: center;
        font-size: 1rem;
        border: 1px solid #7c7878
    }

    .tab-inner2 .nav-tabs {
        border-bottom: none
    }

    .tab-inner2 .nav > li > a:hover {
        background: #fff;
        color: #000
    }

.note-out {
    position: relative
}

.tab-inner2 ul .active a {
    height: 35px;
    color: white !important;
    border: none !important;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: var(--color-main) !important
}

.tab-inner2 ul a {
    color: #939598 !important
}

.bill-seach .form-control {
    height: 30px !important;
    padding-left: 30px
}

    .bill-seach .form-control:focus {
        outline: none
    }

.setup-left input[type='checkbox'] {
    display: none
}

.setup-cheack {
    width: 16px;
    height: 16px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: 0;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    float: right;
    border: 1px solid var(--color-primary);
    border-radius: 3px;
}

    .setup-cheack.ac:after {
        content: '\2713 ';
        outline: none;
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        color: #32b7b3 !important;
        position: absolute;
        top: -1px;
        left: 0;
        width: 13px;
        height: 13px
    }

.bill-bxslide ul li {
    float: left;
    list-style: none;
    position: relative;
    width: 90px;
    line-height: 30px;
    font-weight: 700;
    height: 30px;
    color: #939598;
    border: 1px solid #7c7878
}

.controls-next {
    position: absolute;
    top: 7px
}

    .controls-next a {
        width: 13px;
        height: 30px;
        padding-top: 5px;
        text-align: center;
        border-radius: 2px;
        margin-top: -19px;
        position: absolute;
        color: #000;
        font-size: 26px;
        top: 14px
    }

    .controls-next .bx-prev {
        left: -21px
    }

.table-wh .red {
    padding-right: 5px
}

.table-wh {
    float: left
}

.tenhang .dropdown {
    display: inline-block;
    padding: 0 7px
}

.close-goods {
    display: none
}

.green {
    color: #32b7b3;
    padding-left: 5px;
    font-size: 1rem
}

.ketchen .tab-content {
    background: #fff;
    height: 100%
}

.ketchen .nav-tabs > li > a {
    border-radius: 0;
    background: #fff;
    margin-right: 3px
}

.ketchen .nav-tabs {
    border-bottom: none
}

    .ketchen .nav-tabs .active a, .ketchen .nav-tabs a {
        color: #000
    }

    .ketchen .nav-tabs .active a {
        position: relative;
        display: block;
        padding: 13px 15px
    }

#wait-kitchent table {
    margin-bottom: 10px !important
}

.name-wait span {
    font-size: 1rem
}

.w49-l .controls td img {
    height: 62px
}

.footer-bill .table {
    width: 325px;
    float: left;
    margin-bottom: 0
}

.footer-bill .table-reponsive td {
    padding: 8px 0
}

.prev-ketchen {
    padding: 0
}

.date-one {
    padding-top: 10px;
    padding-left: 5px;
    width: 74%;
    float: left;
    overflow: hidden;
    height: 80%
}

    .date-one div {
        width: 100%;
        height: 18px;
        overflow: hidden;
        padding-bottom: 2px
    }

        .date-one div a {
            color: #808285
        }

.p01 .price-pay {
    width: 140px;
    float: right;
    margin-top: 3px
}

.text-blu {
    color: var(--color-primary);
    font-size: 13px
}

.amt {
    line-height: 10px;
    font-size: 1rem;
    color: #818286;
    position: relative
}

.bg-7 {
    background: #f2f2f2
}

.activeBlue {
    color: #0681ad !important
}

.handling-kitchen .dropdown-menu {
    background: var(--color-main);
    width: 250px;
    top: 38px;
    border-radius: 0;
    right: 0;
    left: auto
}

    .handling-kitchen .dropdown-menu li {
        width: 100%;
        padding-left: 0
    }

.event-date {
    position: absolute;
    bottom: 0;
    padding-left: 43%;
    cursor: pointer;
    color: #337ab7
}

#cal-slide-content {
    background: #f3efef !important
}

.today {
    outline: none
}

.w701 {
    margin-right: 400px;
    position: relative
}

.w301 {
    float: right;
    width: 400px;
    position: relative;
    border-left: 10px solid rgb(235,235,235)
}

.bill-header .w301 {
    box-shadow: 5px 0 5px 1px #ccc
}

.grocery .pen-note {
    float: left
}

.grocery .bill-seach {
    width: 280px
}

.box-barcode {
    float: left;
    padding-left: 12px;
    padding-right: 15px;
    font-size: 39px;
    padding-top: 9px
}

.grocery .bill-bxslide {
    width: 550px !important;
    position: absolute;
    right: 0
}

.w701 .bx-next {
    right: -515px !important
}

.w701 .bill-bxslide ul li span {
    color: #939598;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 16px;
    padding: 6px
}

.w701 .bill-bxslide ul .using span {
    color: #fff
}

.name-bill1 span, .name-bill2 span {
    padding-left: 5px;
    padding-right: 42px
}

.bill-header input {
    border: 1px solid #7c7878 !important
}

.height-fix {
    height: calc(100% - 40px);
    background: #fff;
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden
}

.paddingtop5 .height-fix {
    height: calc(100% - 40px)
}

.grocery .bill-seach span {
    top: 15px
}

.grocery .logoOpen24 {
    margin-left: 0
}

.grocery .bill-listchoose li {
    width: 100%;
    float: left;
    padding: 0 5px 0 5px;
    border-bottom: 1px solid #ccc;
    font-size: 1rem
}

.grocery .inner-listchoose {
    margin-top: 6px;
    width: calc(100% - 210px);
    float: left
}

.label-title {
    font-weight: 700;
    font-size: 13px
}

.grocery .bill-listchoose ul li:nth-child(odd) .munber-bill, .grocery .bill-listchoose ul li:nth-child(odd), .grocery .bill-listchoose ul li:nth-child(odd) .note-out input, .grocery .bill-listchoose ul li:nth-child(odd) .price-fist.newprice {
    background: #fff
}
/*.grocery li:hover .list-price input, .grocery li:hover .list-totle-price input, .grocery li:hover .munber-bill, .grocery li:hover .note-out input, .grocery .bill-listchoose li:hover, .grocery .bill-listchoose li:hover .price-fist, .grocery .bill-listchoose ul li:nth-child(odd):hover, .grocery .bill-listchoose li:hover .price-fist, .grocery .bill-listchoose ul li:nth-child(odd):hover .note-out input {
        background: #c6eaec !important
    }*/
.detail-user {
    padding-top: 15px;
    padding-bottom: 15px
}

.bill-number {
    float: left
}

.bill-number {
    text-align: center;
    float: left;
    margin-top: 18px;
    padding-right: 10px;
    width: 28px
}

.select-user2 {
    top: 45px
}

.slide-goods {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 340px;
    background: #ebebeb
}

.main-slide {
    height: 25px;
    line-height: 25px
}

    .main-slide a {
        padding-top: 8px;
        float: left;
        padding-right: 10px;
        outline: none;
        color: var(--color-button-hover)
    }

.main-slideleft {
    float: left;
    padding-left: 30px
}

.main-slideright {
    float: right;
    font-size: 1rem;
    padding-right: 30px
}

    .main-slideright span {
        float: left;
        padding-right: 10px;
        color: #000;
        line-height: 28px
    }

    .main-slideright div {
        color: #fff;
        float: left
    }

.up-slide {
    position: absolute;
    left: 50%;
    top: -12px;
    font-size: 36px;
    color: black !important
}

    .up-slide i {
        color: black !important
    }

.grocery .bill-listmenu li {
    width: 13.5%;
    margin: 0 4px 10px 4px;
    background: #fff
}

.grocery .bill-listmenu {
    padding: 10px 28px 0 30px;
    height: 370px;
    overflow: hidden
}

.up1-sli {
    display: none
}

.sli-gos {
    bottom: -315px
}

    .sli-gos .up-slide {
        top: -8px
    }

.ptop2 {
    padding-top: 8px
}

.divLstHoaDon span {
    margin-right: 2px;
    position: relative
}

    .divLstHoaDon span .fa-times {
        position: absolute;
        top: 3px;
        right: 4px
    }

.divLstHoaDon .table-time a {
    height: 32px;
    float: left;
    width: 100px;
    margin-right: 2px;
    padding: 0px !important;
    padding-left: 9px !important;
    position: relative
}

.munber-goods {
    height: 17px;
    float: left;
    width: 100%;
    font-size: 13px
}

.bill-content .nav-tabs > span.active > a {
    color: #000;
    border: none;
    text-decoration: none;
    height: 35px;
    background: #FFF;
    border-bottom: none;
    font-weight: 700;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 4px solid #ff8b00
}

#infor .bx-next, .divLstHoaDon .bx-next {
    width: 13px;
    height: 30px;
    padding-top: 5px;
    text-align: center;
    border-radius: 2px;
    position: absolute;
    color: #fff;
    font-size: 21px;
    top: 3px;
    right: 40px !important
}

#infor .bx-next {
    right: 2px !important;
    top: 4px
}

#infor .nhomHH {
    float: left;
    background: var(--color-main) !important;
    height: 39px;
    width: 100%;
    overflow: hidden;
    padding-top: 3px;
    padding-left: 139px
}

#infor .bx-prev, .divLstHoaDon .bx-prev {
    width: 13px;
    height: 30px;
    padding-top: 5px;
    text-align: center;
    position: absolute;
    font-size: 21px;
    top: 4px;
    left: 120px;
    border-radius: 2px;
    color: #fff
}

.divLstHoaDon .bx-prev {
    left: 0
}

.divLstHoaDon a:hover {
    color: white !important
}

.divLstHoaDon .active a:hover .fa-times {
    color: black !important
}

.donate span a {
    height: 32px;
    float: left;
    margin-right: 2px;
    line-height: 32px;
    padding: 0px !important;
    padding-left: 14px !important;
    position: relative;
    padding-right: 15px !important
}

.bg10, .bg10 button {
    background: #d46acc;
    border: none
}

.divLstHoaDon {
    margin-right: 0;
    position: relative;
    overflow: hidden;
    height: 39px;
    background: var(--color-main);
    padding-top: 4px
}

.bill-infor {
    margin-right: 20px;
    position: relative;
    padding: 10px 0 0 10px
}

.bill-note-detal {
    float: left;
    padding-left: 7px;
    line-height: 20px;
    width: 400px;
    overflow: hidden
}

.border-left .modal-body .form-wrap {
    width: 68.5% !important
}

.pen-note {
    float: left
}

.bill-content .modal-body label {
    width: 135px !important
}

.arr1 {
    left: -250px
}

.r9 {
    right: -23px !important
}

.page2 {
    background: #fff
}

.bg-11, .bg-11 button {
    background: #58595b;
    border: none;
    outline: none;
}

.grocery .add-top {
    right: 5px;
    top: 11px
}

.grocery .bill-pluss {
    background: #fff;
    margin-right: 0;
    color: #666
}

.grocery .price-pay-end {
    background: white !important;
    outline: none;
    width: 88px;
    height: 36px;
    border-bottom: 1px solid white !important;
    margin-right: 4px
}

.add-top1 {
    width: 30px !important;
    text-align: center !important;
    padding-left: 0px !important
}

.grocery .bill-bxslide ul li {
    width: 100px;
    text-align: left;
    padding-left: 7px;
    color: #939598;
    border: 1px solid #7c7878
}

.border-top-none td {
    border-top: none !important
}

.sale-h {
    position: absolute;
    top: 20px;
    left: -16px;
    width: 80px;
    text-align: right
}

    .sale-h span {
        font-size: 11px
    }

.pos-r {
    position: relative
}

.pos-a {
    position: absolute;
    top: 19px;
    left: 26px;
    width: 90px;
    text-align: right
}

    .pos-a span {
        font-size: 1rem;
        line-height: 0
    }

.height99 {
    height: 93%
}

.op-filter-containermodal {
    margin-top: 10px;
    float: left;
    width: 100%
}

#modalPopuplgtrahangHD .op-filter-title {
    padding-left: 10px
}

.nhomHH span a {
    height: 32px;
    float: left;
    margin-right: 2px;
    line-height: 32px;
    padding: 0px !important;
    padding-left: 10px !important;
    position: relative;
    padding-right: 10px !important
}

.nhomHH .active a {
    color: #000;
    border: none;
    text-decoration: none;
    height: 50px;
    background: #d8daef;
    border-bottom: none
}

.pay-return {
    font-size: 15px
}

.pen-destroys {
    border: none;
    text-align: left !important;
    padding-left: 15px;
    border-radius: 0;
    outline: none
}

.note-destroys i {
    position: absolute;
    top: 0;
    left: 0;
    display: none
}

.note-destroys {
    position: relative
}

.table-reponsive tr:hover .note-destroys i {
    display: block
}

.destroys-number {
    width: 60px;
    height: 28px;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #ccc;
    outline: none;
    padding: 0 4px;
}

.destroys-numberTR {
    width: 160px;
    height: 28px;
    border-radius: 4px;
    border: 1px solid #ccc;
    outline: none;
    padding: 0 4px
}

.num-plus:hover {
    background: #d6d6d6;
    border-radius: 15px;
}

.num-plus {
    background: none;
    text-align: center;
    color: #58595b;
    border-radius: 3px;
    padding: 6px 9px;
    text-align: center;
    line-height: 24px;
    height: 30px;
    padding: 3px 7px;
    width: 30px;
    transition: all 0.4s ease;
}

.table-destroys td {
    vertical-align: top !important
}

.tab-shipping .select-user {
    position: absolute;
    left: 0;
    top: 30px
}

.destroys-right .detail-infor label {
    width: 40%
}

.destroys-right .name-bill1 {
    margin-top: 0
}

.title-near {
    background: var(--color-table);
    margin: 0;
    margin-bottom: 0px;
    padding: 5px 10px;
    font-size: 15px;
    color: #333;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 5px;
}

.bill-pen ul {
    overflow: scroll;
    border: 1px solid #d7d7d7;
    border-top: none;
    padding: 5px;
    font-size: 1rem;
    max-height: 200px
}

.border-warehouse {
    margin-top: 0;
    margin-bottom: 20px;
    padding-bottom: 20px;
    padding-top: 10px;
    border: 1px solid #ccc;
    border-top: none
}

    .border-warehouse th {
        text-align: right
    }

.tab-deviation {
    display: none
}

.importgoods .number-price {
    width: 85px !important
}

.donate {
    border-bottom: none;
    overflow: hidden;
    background: var(--color-main);
    height: 39px;
    padding-top: 4px;
    padding-left: 139px
}

.border-left .nav-tabs {
    border-bottom: none
}

.tr-name-wait {
    width: 40%
}

.number-fast {
    float: left;
    padding-top: 0;
    width: auto;
    position: relative;
    display: none;
}

    .number-fast input {
        width: 100px;
        float: left
    }

.number-fast-banle {
    float: left;
    padding-top: 5px;
    position: relative;
    display: none
}

    .number-fast-banle input {
        width: 75px;
        font-style: italic;
        float: left;
        margin-left: 5px
    }

.text-fast {
    float: left;
    margin-left: 20px;
    width: 100px;
    height: 30px;
    border: 1px solid #ccc;
    border-radius: 4px;
    position: relative;
    line-height: 30px;
    padding-left: 10px
}

.fast-icon {
    position: absolute;
    right: 0;
    width: 20px;
    height: 30px;
    top: 5px
}

.import-fast {
    float: right;
    min-width: 30px;
    position: relative;
    margin: 3px;
    padding: 3px;
    width: auto;
    text-align: center;
    height: 30px;
    width: 30px;
    padding: 3px;
    margin: 0 5px;
}

.cke {
    width: 465px !important
}

.detail-warehouse th {
    background: #d6f1f0
}

.import-fast i {
    font-size: 21px;
    color: #6e6c6c;
    cursor: pointer
}

.destroys-right .name-bill1 {
    background: #32b7b3;
    color: #fff
}

.destroys-right .select-user2 {
    top: 32px;
    left: 0
}

.destroys-right .seach-bill {
    padding: 10px 0 0;
    position: relative
}

    .destroys-right .seach-bill i {
        position: absolute;
        top: 10px;
        color: #ccc;
        font-size: 15px;
        left: 2px
    }

.destroys-right .bill-total {
    padding: 0
}

.destroys-right .bill-pay {
    padding: 0
}

.destroys-right .bill-pen img {
    position: absolute;
    top: 0;
    left: 11px;
    font-size: 15px
}

.bg-bl1 {
    background: #27aae1
}

.munber-note {
    text-align: left;
    color: #a7a9ac
}

.bottom8 {
    margin-top: 8px
}

    .bottom8 label {
        margin: 0
    }

.padding15 {
    padding: 15px 20px
}

.magrin12 {
    margin-bottom: 17px !important;
    border-left: none
}

.ve-center td {
    vertical-align: middle !important
}

.padding20 {
    padding: 20px 0
}

.bill-infor .nav-tabs {
    height: 25px;
    border-bottom: 1px solid var(--color-primary)
}

.install-mobile {
    display: none
}

.main-install {
    float: right;
    width: 40px;
    text-align: center;
    line-height: 44px;
    font-size: 19px;
    display: none;
    color: #fff
}

.main-menu-chi-nhanh {
    width: 155px;
    float: left
}

.main-menu-mobile {
    width: 200px;
    float: right
}

.main-menu-chi-nhanh .selec-person {
    width: 200px !important;
    top: 48px
}

    .main-menu-chi-nhanh .selec-person ul {
        background: var(--color-main)
    }

        .main-menu-chi-nhanh .selec-person ul li a {
            color: white !important
        }

.mn-drop-chi-nhanh i {
    position: absolute;
    top: 18px;
    color: #fff;
    right: 0
}

.mn-drop-chi-nhanh {
    position: relative
}

    .mn-drop-chi-nhanh div {
        line-height: 50px;
        font-size: 1rem;
        float: right;
        padding-right: 15px;
        color: #fff
    }

.main-menu-chi-nhanh .selec-person ul.group-parent li {
    line-height: 20px;
    padding-top: 6px;
    padding-bottom: 6px;
    color: #fff
}

.border-none {
    border: none !important;
    outline: none
}

.ckeditor-header-table {
    font-weight: 700
}

.line-border-table {
    border-bottom: 1px dashed #000
}

.slide-bill.bill-listchoose ul li {
    float: left;
    width: 100%;
    margin: 0
}

.slide-bill.bill-listchoose {
    float: left;
    width: 100%;
    overflow: auto;
    height: auto
}

    .slide-bill.bill-listchoose ul li .bill-plus {
        color: #58595b
    }

    .slide-bill.bill-listchoose .bill-listmenu {
        padding: 0
    }

.seach-product .seachnumber {
    float: left;
    width: 70px;
    border: 1px solid #32b7b3;
    border-bottom: none;
    height: 35px;
    outline: none;
    padding-left: 10px;
    display: none
}

.seach-productinput input {
    float: left;
    width: 470px;
    margin-right: 15px;
    padding-left: 25px;
    border: 1px solid var(--color-primary);
    border-bottom: none;
    height: 35px;
    outline: none
}

.seach-productinput {
    position: relative
}

    .seach-productinput > i {
        position: absolute;
        left: 6px;
        top: 9px;
        font-size: 16px;
        color: #999
    }

.seach-product {
    padding: 0 25px;
    border-bottom: 1px solid #32b7b3
}

    .seach-product a .fa-barcode {
        padding-left: 10px;
        font-size: 22px
    }

.slide-bill.bill-listchoose .bill-listmenu li:hover img {
    transform: scale(1)
}

.w700 {
    width: 400px !important
}

.bill-total-th {
    margin-bottom: 1px
}

    .bill-total-th span {
        margin-bottom: -1px;
        color: #000;
        text-align: center;
        width: auto;
        font-size: 1rem;
        line-height: 28px;
        float: left;
        text-align: left;
        font-weight: 700
    }

.name-custumer span {
    padding-left: 20px
}

.name-custumer i {
    color: #000
}

.date-chang, .delivery {
    float: right;
    padding-right: 30px;
    line-height: 51px;
    position: relative
}

.money-face {
    font-size: 11px;
    font-weight: 400;
    line-height: 6px;
    bottom: -6px;
    position: absolute
}

.handling-kitchen ul li {
    padding-left: 0;
    width: 100%
}

.grocery .parent-price-1 {
    padding-right: 8px
}

.col-xs-2 .row span {
    line-height: 31px
}

.permission-left {
    border: 1px solid #bebfc0;
    border-radius: 3px;
    height: 470px
}

.chinhanh-vaitro {
    overflow: scroll;
    overflow-x: hidden;
    max-height: 385px;
    padding-left: 8px
}

.permission-title {
    background: #cdcdcd;
    color: #000;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 15px;
    border-bottom: 1px solid #bebfc0
}

.permission-left ul li.act {
    font-weight: 700;
    background: #d3f3ff;
    background: #d3f3ff
}

.permission-left ul li {
    padding: 10px 15px;
    position: relative
}

.permission-right {
    padding-left: 30px
}

.permission-main span {
    float: left
}
/*.list-permission {
    float: left
}*/
.list-permission ul li ul {
    padding-left: 50px
}

.col3 {
    float: left;
    width: 33.33%;
    padding-top: 10px;
    padding-right: 10px
}

#modalContainerlg_EditVaiTro .col3, #modalContainerlg_VaiTro .col3 {
    width: 70% !important;
    padding-right: 0
}

.col3 h3 {
    font-size: 1rem;
    color: #000;
    margin: 0;
    background: #D6F1F0;
    line-height: 32px;
    padding-left: 10px;
    border-radius: 4px
}

.col3 ul li ul {
    padding-left: 15px;
    display: none
}

.col3 ul li {
    position: relative;
    margin-left: 9px;
    float: left;
    width: 100%
}

.permission-main .name-bill1 {
    height: 24px;
    margin-top: 0;
    line-height: 17px
}

    .permission-main .name-bill1 i {
        top: -1px
    }

.permission-right .select-user {
    left: 86px;
    top: 23px
}

.select-user {
    left: 3px;
    padding: 0;
    top: 43px;
    width: 178px
}

    .select-user li {
        line-height: 29px;
        padding-left: 11px;
        border-bottom: 1px dotted #ccc
    }

        .select-user li:last-child {
            border-bottom: none
        }

.permission-main a {
    font-size: 16px;
    color: #656565;
    margin-left: 15px;
    outline: none;
    text-decoration: none
}

.add-permission span {
    float: left;
    line-height: 30px;
    padding-right: 13px
}

.add-permission input {
    float: left;
    width: 367px
}

.permission2 .form-wrap {
    width: 73.1%
}

.pd-boto20p {
    padding-top: 20px
}

.more-permission .fa-caret-down {
    display: none;
    left: -4px;
    position: absolute;
    top: 5px
}

.trade-tabb {
    width: 18%;
    padding-top: 15px;
    float: left
}

    .trade-tabb li {
        position: relative;
        border: none
    }

    .trade-tabb li {
        height: 40px;
        margin-bottom: 10px
    }

        .trade-tabb li a {
            width: 100%;
            float: left;
            border-right: none;
            border-bottom: none;
            line-height: 40px;
            padding-left: 15px;
            position: relative;
            background: #e6e7e8;
            margin-bottom: 10px
        }

        .trade-tabb li a {
            color: #000;
            font-weight: 700;
            text-decoration: none
        }

.promotionkm .tab-content {
    float: left;
    width: 82% !important;
    padding: 10px 15px 5px 15px;
    margin-bottom: 18px;
    height: 370px
}

.trade-tabb li.active, .trade-tabb li.active a {
    border-right: none;
    border-bottom: none;
    background: #fff
}

    .trade-tabb li.active a {
        color: #32b7b3 !important
    }

.trade-tabb > li > a:hover {
    border: none;
    text-decoration: none
}

.trade-tabb li span {
    height: 40px;
    width: 10px;
    float: left;
    position: absolute;
    right: -10px;
    background: #fff;
    font-size: 17px;
    display: none;
    top: 9px
}

.trade-tabb li.active span {
    display: block
}

.datepicker table tr td.new, .datepicker table tr td.active {
    height: 25px;
    width: 25px
}

.bootstrap-datetimepicker-widget table td.today:before {
    display: none !important
}

.bootstrap-datetimepicker-widget table th {
    background: #fff
}

.bootstrap-datetimepicker-widget a[data-action] {
    color: #337ab7 !important
}

.bootstrap-datetimepicker-widget table td.day {
    height: 30px !important;
    line-height: 20px !important;
    width: 33px !important
}

.leftauto {
    float: left;
    position: relative
}

    .leftauto label {
        line-height: 42px !important;
        width: auto
    }

    .leftauto .list-name-staff {
        margin-top: 0
    }

    .leftauto .select-user li {
        line-height: 36px
    }

    .leftauto .name-bill1 i {
        color: #949292;
        font-size: 16px;
        top: 8px;
        padding-right: 8px
    }

    .leftauto .name-bill1 {
        border: 1px solid #ccc;
        margin: 5px;
        border-radius: 3px
    }

    .leftauto .select-user {
        left: -1px;
        top: 30px
    }

.totalmoney span {
    float: left;
    line-height: 33px;
    width: 27px
}

.totalmoney input {
    float: left;
    width: 96px
}

.totalmoney {
    width: 148px
}

    .totalmoney .toogle {
        float: left;
        width: 70px;
        margin-left: 10px;
        height: 29px
    }

        .totalmoney .toogle:before {
            width: 29px;
            height: 29px;
            background: #32b7b3;
            border-radius: 15px;
            top: -1px;
            left: -1px
        }

    .totalmoney .poison {
        left: 2px;
        line-height: 30px;
        font-size: 11px;
        color: #fff
    }

    .totalmoney .transverse {
        color: #fff;
        right: -10px;
        line-height: 29px
    }

    .totalmoney .active-re:before {
        left: 42px
    }

.totalmoney1 {
    width: 210px
}

.promotionkm .form-wrap label {
    width: 98px;
    font-weight: 400
}

.table-reducedhh span {
    width: auto;
    float: left;
    margin-right: 3px;
    position: relative;
    line-height: 30px
}

    .table-reducedhh span input {
        width: 50px
    }

.tanghang span input {
    width: 100px
}

.table-reducedhh .number-reduced {
    /*width: 150px*/
}

.munber-bought .floatleft {
    padding-bottom: 10px
}

.modal-lgg {
    width: 960px;
    margin: 30px auto
}

.table-reducedhh span img {
    position: absolute;
    right: 7px;
    top: 7px;
    background: #fff;
    padding-left: 6px
}

.vnd2 .transverse {
    right: -12px;
    width: 26px;
    text-align: center
}

.seach-hhchoose input {
    border: none;
    border-bottom: 1px solid #3eb7b3;
    width: 100%;
    outline: none;
    padding-left: 20px
}

.container input:checked ~ .checkmark {
    background: #2196F3
}

.seach-hhchoose {
    position: relative
}

    .seach-hhchoose i {
        position: absolute;
        top: -2px;
        font-size: 15px;
        color: #666
    }

.list-choose ul li {
    position: relative;
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc
}

.ma20 {
    margin: 20px 0 20px 0
}

.list-choose ul li ul {
    padding-left: 20px;
    display: none
}

    .list-choose ul li ul li:last-child {
        border-bottom: none
    }

.tongg-pm {
    position: absolute;
    right: 0;
    line-height: 30px;
    width: 24px;
    text-align: center
}

    .tongg-pm .fa-minus {
        display: none
    }

.vnd2 .toogle {
    width: 64px;
    height: 28px;
    position: relative
}

    .vnd2 .toogle:before {
        width: 28px;
        height: 28px;
        background: #32b7b3;
        top: -1px;
        left: -1px
    }

.vnd2 .poison {
    left: 1px;
    line-height: 28px;
    color: #fff
}

.transverse {
    right: -46px;
    line-height: 28px;
    color: #fff
}

.vnd2 .active-re:before {
    left: 36px
}

.goods-click i, .bill-click i {
    display: none !important
}

.checkicon i {
    display: block !important
}

.text-unit {
    font-size: 1rem;
    font-weight: 400;
    text-transform: capitalize;
    position: absolute;
    bottom: 30px;
    right: 0
}

.highcharts-label {
    text-align: center
}

.w100 {
    width: 100px !important;
    min-width: 100px !important
}

.ver-top {
    vertical-align: top;
    padding: 10px !important
}

.munber-bought {
    padding: 7px 0;
    border-bottom: 1px dotted #ccc
}

.fl {
    float: left
}

    .fl input {
        width: 100px;
        float: left
    }

.w150 {
    width: 150px !important
}

.fl1 label {
    padding-left: 15px
}

.fs14 {
    line-height: 30px
}

.promotion-drop .choose-person li {
    float: left;
    padding: 0 10px
}

.table_price {
    max-height: 520px;
    text-transform: capitalize;
    overflow-y: visible
}

.w301 .select-user ul {
    margin: 12px 12px 0 0
}

.permission-main span {
    line-height: 30px;
    padding-left: 20px
}

.permission-main {
    padding-bottom: 30px
}

.highcharts-stack-labels text {
    width: 30px !important;
    text-align: left !important
}

.grocery .bill-listchoose .bill-pen input {
    border: none
}

.paylip label {
    width: 120px
}

.establish-left {
    float: left;
    width: 190px;
    border-bottom: none;
    margin-top: 10px
}

.establish-right {
    float: left;
    width: calc(100% - 190px);
    border-bottom: none
}

.establish-left li {
    border: 1px solid #ccc;
    width: 100%;
    margin-bottom: 10px;
    border-radius: 3px;
    position: relative
}

    .establish-left > li > a, .establish-left li > a:hover {
        border: none !important;
        margin-right: 0;
        border-radius: 0;
        color: #000
    }

.establish-left .nav-tabs > li.active > a, .establish-left .nav-tabs > li.active > a:hover, .establish-left > li.active > a {
    width: 100%;
    background: #999 !important;
    margin-right: 0;
    color: white !important
}

.establish-right label {
    color: #000
}

.wp-st-logo img {
    width: 170px;
    height: 190px
}

.symptoms {
    border-top: 1px solid #ccc
}

    .symptoms #hinhthuc thead {
        line-height: 30px
    }

        .symptoms #hinhthuc thead th {
            padding: 6px
        }

    .symptoms #hinhthuc tbody {
        border-bottom: none
    }

.bg-white {
    background: #1b9b94;
    border: 1px solid #ccc;
    border-radius: 4px;
    line-height: 30px;
    padding: 0 11px
}

#hinhthuc tr td {
    padding: 6px
}

.bg-white:hover {
    background: #32b7b3
}

.fl1 a {
    line-height: 29px
}

.promotion-drop .selec-person {
    max-height: 230px;
    overflow: scroll;
    overflow-x: hidden
}

.op-filter .selec-person {
    max-height: 231px;
    width: 100%;
    overflow-x: hidden
}

.form-wrap .fa-times {
    position: relative
}

.promotion-drop #selec-person {
    background: #fff;
    position: absolute
}

    .promotion-drop #selec-person li {
        line-height: 33px;
        border-bottom: 1px solid #e0dede;
        position: relative
    }

        .promotion-drop #selec-person li .fa-check {
            top: 8px;
            display: none
        }

#phamviapdung label {
    font-weight: 400
}

.promotion-drop #selec-person li:last-child {
    border-bottom: none
}

.icon-es span:before {
    color: #6d6e71
}

#hinhthuc .add-condition tbody {
    border-top: none !important
}

.table-option td, .add-condition tbody td {
    border: none
}

.checkdram ul a {
    color: black !important
}

.checkdram ul {
    left: 60px
}

    .checkdram ul i {
        float: right;
        color: #009ddc;
        display: none
    }

.grocery .p01 input {
    border-bottom: none !important;
    padding-right: 9px
}

.slide-goods2 li {
    overflow: auto
}

.inner-w30 .bill-pay input {
    padding-left: 27px
}

.list-totle-price {
    float: left;
    width: 120px;
    height: 30px;
    line-height: 33px;
    text-align: right;
}

.list-munber-edit {
    float: left;
    width: 155px
}

.list-nameproduct {
    width: calc(100% - 570px);
    float: left;
    margin-top: 12px
}

.list-sale {
    width: 101px;
    line-height: 33px;
    text-align: right
}

.bill-name-list2 {
    width: calc(100% - 308px)
}

.w121 {
    width: 121px
}

.w80 {
    width: 65px;
    position: relative
}

.bold span {
    line-height: 25px
}

#khuyenmaip .modal-body .topt label {
    width: 167px !important
}

#khuyenmaip .modal-body .topt span label {
    width: auto !important
}

#khuyenmaip .form-wrap span {
    float: left
}

#khuyenmaip .modal-body .topt .form-group input[type=text] {
    border: none;
    border-bottom: 1px solid #ccc;
    height: 23px;
    width: 100%;
    outline: none
}

.topt textarea {
    border: none;
    border-bottom: 1px solid #ccc;
    outline: none;
    border-radius: 0
}

.topt .form-wrap {
    width: 65% !important
}

.border {
    overflow: scroll;
    border: 1px solid #ccc;
    max-height: 198px
}

.border-noscroll {
    max-height: 198px
}

.slide-goods2 .list-nameproduct {
    text-align: left
}

#login {
    margin: 0
}

.destroys-right .bill-pen input {
    padding-left: 33px
}

.pading25 {
    padding-right: 25px
}

.SelectID_NhomHang input::after {
    color: #32b7b3;
    height: 10px;
    width: 10px;
    background: #32b7b3;
    border-radius: 10px;
    line-height: 11px;
    margin-right: 2px
}

.save-print {
    margin-top: 50px
}

.out-print {
    border: 1px solid #ccc;
    margin-left: 15px
}

    .out-print .btn-green {
        margin: 30px 0 20px 5px;
        float: right
    }

.establish-left li a span:before {
    color: #000;
    padding-right: 5px
}

.establish-left .active a span:before {
    color: #fff
}

.print-view .icon-IconMauinn-03 {
    font-size: 9px
}

.acv {
    display: none !important
}

.bill-returns {
    text-align: right;
    line-height: 30px
}

.icon-user-blue {
    font-size: 18px;
    line-height: 47px;
    color: #00a69c
}

.form-group .toogle-report, .callprice .toogle-report, .arrow-left1 .toogle-report {
    margin-left: 5px;
    height: 30px
}

.form-group .toogle:before, .callprice .toogle:before, .arrow-left1 .toogle:before {
    width: 30px;
    height: 30px;
    top: 0;
    transition: left 0.2s ease;
    margin-top: 0;
    background: var(--color-main);
    left: -1px
}

.form-group .poison, .callprice .poison, .arrow-left1 .poison {
    left: 3px;
    font-size: 10px !important;
    font-weight: 400;
    color: #fff;
    line-height: 32px !important
}

.form-group .active-re:before, .callprice .active-re:before, .arrow-left1 .active-re:before {
    left: 31px
}

.form-group .transverse, .callprice .transverse, .arrow-left1 .transverse {
    right: -46px;
    line-height: 28px;
    color: #fff;
    line-height: 33px !important;
    font-size: 11px !important
}

.form-group .transverse, .callprice .transverse {
    right: 9px
}

.w90 {
    width: 90px !important
}

.w700 {
    width: 70px !important
}

.choose-date {
    position: relative
}

.poison .fa-plus {
    padding-left: 7px
}

.name-menu a {
    color: white !important
}

.bg12 {
    background: #e3e4e8
}

.img-expire {
    width: 739px;
    margin: auto;
    position: relative;
    padding-top: 90px
}

.pa10 {
    padding-right: 11px
}

.list-file li {
    padding-left: 10px;
    background: rgba(0,0,0,0.05);
    border: 1px solid var(--color-primary) !important;
    line-height: 24px;
    border-radius: 3px;
    padding: 3px 7px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
}

.delete-file {
    float: right;
    line-height: 32px;
    padding-right: 10px
}

.table_error {
    max-height: 230px;
    overflow: scroll
}

.excel-file .btn-file, #myModalinport .btn-file {
    color: #fff;
    padding: 15px 15px;
    border-radius: 2px
}

.file-all input {
    color: #fff;
    border-radius: 2px
}

.continue-hh {
    margin: 0
}

.main-warning i {
    line-height: 30px
}

.content-warning {
    min-width: 200px;
    border: 1px solid #32b7b3;
    z-index: 10004;
    padding: 6px 14px;
    background: #fff;
    top: 4px;
    margin-top: -4px;
    margin-left: 27px;
    display: none;
    position: absolute;
    right: 31px
}

    .content-warning:before {
        border-left: 6px solid #32b7b3;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        margin-top: 0;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        right: -6px
    }

.warning {
    position: relative;
    cursor: pointer;
    width: 20px;
    height: 30px;
    display: none;
}

.middle {
    vertical-align: middle !important;
    text-align: center
}

.title-print-invoice {
    text-align: center;
    font-size: 17px
}

.td-header-print {
    text-align: center;
    vertical-align: central
}

.op-filter .seach-nhomhang {
    position: relative;
    margin-bottom: 3px
}

.seach-nhomhang {
    position: relative
}

    .seach-nhomhang input {
        border: none;
        border-bottom: 1px solid #ccc;
        width: 100%;
        outline: none;
        height: 30px;
        padding-left: 15px
    }

#lblHoaDon li {
    float: left;
    padding: 7px 27px;
    color: #fff;
    font-size: 1rem;
    margin-right: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

    #lblHoaDon li.active {
        border-bottom: 2px solid var(--color-primary);
        padding: 7.5px 27px;
        background: #fff
    }

        #lblHoaDon li.active a {
            color: var(--color-primary) !important
        }

.ma10 {
    margin-right: -5px
}

.img-customer img {
    width: 100%;
    height: 100%
}

.img-item {
    width: 100%;
    min-height: 95px;
    float: left;
}

.img-list-c li .fa-close, .img-customer .fa-close {
    position: absolute;
    right: 0;
    top: 4px;
    width: 22px;
    text-align: center;
    display: none
}

ul.bxslider {
    height: 142px !important;
    float: left
}

.img-customer {
    position: relative;
    border: 1px dotted #ccc;
    height: 150px;
}

    .img-list-c li:hover i, .img-customer:hover i {
        display: block
    }

.img-list-c li {
    position: relative;
    width: 50%;
    margin-right: 0;
    padding: 5px;
}

.bg17 {
    background: #b6e2fd !important
}

.bg18 {
    background: #ecc486 !important
}

.bg20 {
    background: #b5efab !important
}

.bg21 {
    background: #bfbfbf !important
}

.groupi .fa-chevron-circle-up {
    display: block
}

.groupi .fa-chevron-circle-down {
    display: none
}

.form-select-button select {
    width: calc(100% - 40px);
    border-radius: 0;
    float: left
}

.form-select-button button {
    float: left;
    width: 40px;
    border-radius: 0
}

.tab-detail-table-sms {
    border-top: 1px solid #cccc;
    margin: 15px
}

.sms-right {
    border-left: 1px solid #cccc
}

    .sms-right .fl {
        padding: 0 0 15px 0
    }

table tr table tr {
    border-bottom: 1px solid #d1d2d9
}

.table-reponsive tbody tr:hover td table tr td {
    background: none
}

.table-reponsive tbody tr:hover .bg-gray {
    background: #e6e6e6
}

.warning span {
    line-height: 32px
}

@-moz-document url-prefix() {
    .footer-bill {
        height: 203px;
        bottom: 0;
        right: 0px !important;
        color: #333;
        width: 100%;
        z-index: 10;
        padding-left: 30px;
        padding-top: 4px;
        background: #ebeef7;
        position: fixed;
        bottom: 0;
        width: 550px;
        left: auto
    }

    .border-left {
        border-left: 2px solid #fff
    }

    .height-fix {
        height: 94%
    }
}

.tr-hide {
    display: none
}

.blocktr {
    display: table-row !important
}

.w30px {
    width: 30px !important
}

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

.img-item img {
    width: 100%;
    height: 100%
}

.plus-tr .fa-minus {
    display: none
}

.img-list-product li {
    width: 60px;
    height: 45px;
    padding-right: 10px !important
}

    .img-list-product li img {
        width: 100%;
        height: 100%
    }

.img-list-product {
    float: left;
    width: 90%;
    position: relative
}

.notify-banhang div {
    float: left;
    margin-right: 20px
}

.nextlistimg {
    position: absolute;
    right: 0;
    top: 8px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center
}

.prevlistimg {
    position: absolute;
    left: -22px;
    top: 8px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center
}

.model-images {
    z-index: 999999999999;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
    width: 480px;
    height: 360px;
    margin: 50px auto;
    overflow-y: hidden;
    background: #fff;
    display: none;
    border: 2px solid #fff;
    border-radius: 4px
}

    .model-images a {
        position: absolute;
        bottom: 0px !important;
        height: 30px;
        width: 30px;
        line-height: 30px;
        text-align: center;
        background: rgba(0,0,0,.5);
        color: #fff
    }

    .model-images .nextlistimg1 {
        right: 0;
        bottom: 0px !important
    }

    .model-images .prevlistimg1 {
        left: 0;
        bottom: 0px !important
    }

.deletelistimg {
    top: 0;
    right: 0
}

.model-imagesinner, .model-imagesinner img {
    width: 100%;
    height: 100%
}

.innerplus-tr {
    padding-right: 15px;
    float: left
}

.group-sum-total {
    padding: 0 15px
}

.frames-content .table-reponsive {
    width: 250px;
    float: left
}

.height-30 {
    height: 30px;
    line-height: 30px
}

.liheight-30 {
    line-height: 30px !important
}

.right-content-infor label {
    float: left;
    min-width: 31.5%;
    line-height: 30px
}

.right-content-infor select, .right-content-infor textarea {
    font-size: 1rem;
    float: left;
    min-width: 68.5%
}

.right-content-infor .btn-control button, .right-content-infor .btn-control {
    height: 72px
}

.frames-content {
    position: fixed;
    bottom: 0;
    width: 430px;
    padding-bottom: 34px;
    background: #fff
}

.seach-company {
    position: absolute;
    top: 30px;
    left: 0;
    width: 100%;
    background: #fff;
    max-height: 150px;
    z-index: 9;
    border: 1px solid #ccc;
    border-top: none;
    display: none
}

    .seach-company li {
        line-height: 30px;
        cursor: pointer;
        padding: 0 10px
    }

    .seach-company input {
        height: 30px;
        outline: none;
        border-radius: 3px;
        border: 1px solid #ccc;
        border-top: none;
        border-left: none;
        border-right: none;
        padding-left: 26px
    }

    .seach-company ul {
        max-height: 89px;
        min-height: 45px;
        float: left;
        width: 100%;
        overflow: scroll;
        background: #fff
    }

        .seach-company ul li i {
            color: #009ddc
        }

        .seach-company ul li a {
            color: #000;
            text-decoration: none
        }

        .seach-company ul li:hover {
            background: #e6f5d6
        }

.w560 {
    width: calc(100% - 400px);
    float: left;
    padding-left: 20px;
    padding-right: 15px
}

.cargo {
    height: calc(100% - 48px);
    float: left
}

.frames-content table tr td {
    padding: 4px
}

.matop20 {
    margin: 20px 0 10px 0
}

.op2 a {
    width: 100%;
    height: 61px;
    line-height: 49px;
    text-align: center;
    float: left
}

.height60 {
    height: calc(100vh - 100px);
    display: flex;
    flex-direction: row;
}

.pinbut0 {
    padding-bottom: 0
}

.pa2020 {
    padding: 20px 0 0 0
}

.padding33 {
    padding-left: 45px !important;
    color: #06339c
}

.color_text {
    color: #06339c
}

.datail-TH {
    position: absolute;
    right: 34px;
    top: 8px;
    display: none
}

.w60px {
    width: 60px;
    margin-right: 10px;
    float: left
}

.r0 .fa-info-circle {
    right: -18px
}

.top15 {
    top: -15px
}

.r0 .materiall {
    left: 24px
}

.top15 .materiall {
    top: 1px;
    left: 38px
}

.accumulating label {
    width: 230px
}

.accumulating .form-wrap {
    width: calc(100% - 230px)
}

.w140 {
    width: 140px;
    float: left;
    position: relative
}

.w40 {
    width: 30px;
    float: left;
    text-align: center
}

.w180 {
    width: 280px;
    float: left
}

.p10 {
    padding-left: 10px
}

.li-input-span {
    background: var(--table-footer);
    color: #333;
    line-height: 30px;
    text-align: left;
    width: auto !important;
    padding: 0 10px;
    margin: 1px 0 1px 1px
}

.ctyvnd {
    position: absolute !important;
    right: 0;
    top: 0;
    display: inline-block;
    color: #fff;
    font-size: 11px;
    text-align: center;
    line-height: 30px !important;
    background: #2e94da;
    height: 30px;
    padding: 0 6px;
    border-radius: 0 3px 3px 0;
    padding-right: 6px !important
}

.bg19 {
    background: #e68638 !important
}

.table_BanHang .tr-hide .eight {
    padding: 0px !important;
    border: none
}

    .table_BanHang .tr-hide .eight table {
        border: none !important
    }

.w20p {
    width: 20% !important
}

.w10p {
    width: 10% !important
}

.w180 .selec-person li .fa-check {
    top: 0
}

.table-HH table tr th, .table-HH td, .table-HH table tbody td {
    padding: 7px
}

.attribute tr td {
    border-top: none
}

.attribute-select .selec-person {
    width: 100%
}

.seach-xh input {
    padding-left: 19px
}

.seach-xh .fa-search {
    position: absolute;
    left: 5px;
    top: 10px
}

.excel-file {
    text-align: center;
    padding-top: 40px;
    position: relative;
    padding: 15px calc(50% - 200px);
}

.choose-file {
    margin: auto;
    padding-top: 10px;
    position: relative
}

.btn-file {
    width: 100%;
    max-width: 200px;
    position: relative;
    margin: 10px auto;
}

.padingbottom25 {
    padding-top: 40px;
    padding-bottom: 20px
}

.padingbottom {
    padding-bottom: 15px
}

.list-errorfile {
    text-align: left;
    max-height: 300px;
    overflow: auto;
    color: red;
    padding-bottom: 15px
}

.error-import ul li {
    padding-bottom: 15px
}

.delete-file .fa-refresh {
    display: none
}

.date-chang input {
    position: absolute;
    right: 0;
    top: 5px
}

#modalpopup_deleteThuocTinh, #modalThemThuocTinh {
    padding-top: 18%
}

#modalContainer_delete .modal-content {
    z-index: 99999999 !important
}

label {
    position: relative
}

.td-date {
    border: 1px solid #ccc
}

.apdung {
    border: 1px solid #4bac4d;
    padding: 15px 15px 15px 0;
    background: #fff;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    z-index: 99999999999;
    position: absolute;
    width: 100%;
    top: 36px;
    display: none
}

    .apdung:before {
        border-bottom: 6px solid #4bac4d;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        top: -6px;
        content: '';
        position: absolute
    }

#modalPopupLapPhieuThu .detail-content .form-group {
    border-bottom: none
}

.seach-name {
    height: 30px;
    border-bottom: 1px solid #ccc;
    line-height: 35px;
    margin-bottom: 15px
}

    .seach-name .pull-right {
        padding-top: 7px
    }

    .seach-name i {
        color: #999;
        padding-right: 10px
    }

.computer label {
    width: 120px;
    float: left;
    height: 30px;
    line-height: 38px
}

.computer #computer-gg, .computer #computer_newPrice {
    width: 50%;
    float: left;
    height: 30px;
    line-height: 38px;
    text-align: right !important
}

.computer .price-reduce {
    margin-left: 120px;
    height: 30px;
    line-height: 30px;
    text-align: right
}

.computer input.price-reduce {
    width: 50% !important
}

.main-munber {
    background: #ededed;
    height: 306px;
    float: left;
    width: 100%
}

.main-munbertop {
    padding-left: 5px;
    height: 60px
}

.munber-night {
    padding: 5px 5px 0 0;
    float: left;
    width: 33.33333333%
}

    .munber-night button {
        border: none;
        background: #fcfcfc;
        width: 100%;
        min-height: 55px;
        font-size: 24px;
        outline: none
    }

.computer .modal-content, .computer .modal-body {
    border-radius: 5px
}

.name-product1 {
    line-height: 20px;
    padding-left: 87px;
    text-align: right
}

    .name-product1 .form-control {
        margin-top: 4px
    }

.form-icon-input img {
    top: 0;
    left: 0;
    right: 0
}

.op-js-tr-hide1 .op-object-detail {
    border: none;
    margin: -8px
}

.same-product {
    padding: 0 0 15px 15px
}

.PrintBarcode1 .printablediv-page {
    width: 120px
}

.PrintBarcode2 {
    width: 328px
}

    .PrintBarcode2 #printablediv {
        width: 50%
    }

.PrintBarcode4 {
    min-height: 1800px !important;
    width: 665px
}

.bggray {
    background: #f9f9f9
}

.selec-person.dropdown-menu li a {
    color: black !important
}

.selec-personTR.dropdown-menu li a {
    color: black !important
}

.height60 .selec-person {
    max-height: 300px;
    overflow-x: hidden;
    overflow: scroll
}

.code-sp {
    float: left;
    width: 120px
}

.name-promotiont {
    width: calc(100% - 326px);
    float: left
}

.list-promotiont {
    margin-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dotted #ccc
}

    .list-promotiont .bill-de {
        margin-top: 8px
    }

.bg-pink {
    color: #fd6367
}

.bor-top {
    border-top: 1px dotted #ccc;
    padding: 7px 0
}

.list-munber-edit.text-right {
    line-height: 30px
}

.indebt {
    line-height: 34px;
    padding-left: 20px
}

.w200 {
    float: left;
    width: 235px;
    padding-right: 8px
}

.w95 {
    float: left;
    width: 100px;
    padding-right: 8px
}

.w170 {
    float: left;
    width: 240px
}

#listgroupkm .list-choose {
    max-height: 350px;
    overflow: scroll
}

#ui-id-1 {
    width: 300px
}

.close-fillter .kv2Btn {
    padding: 0 20px;
    line-height: 32px;
    height: 32px;
    background: #32b7b3;
    border-radius: 2px;
    border: none;
    color: #fff;
    font-size: 1rem;
    font-weight: 700
}

.footer-res1 .btn-green img {
    height: 17px
}

.print-top {
    padding: 10px;
    text-align: center
}

.name-bill-hh {
    top: 0;
    right: 0;
    background: #ebebeb;
    position: absolute;
    padding: 2px 5px;
    border-radius: 3px
}

.code-hh {
    width: 120px;
    float: left;
    margin-top: 18px;
    font-weight: 700
}

.bordertop {
    border-top: 1px solid #ccc;
    margin: 0 5%;
    width: 90%;
    float: left;
    padding: 30px 0 14px 0;
    margin-top: 15px
}

.datademo {
    font-size: 15px
}

.paddibot15 {
    padding-bottom: 10px
}

.datademo .modal-title img {
    margin-top: -9px
}

#modalPopupLapPhieuThu .money-face {
    bottom: -11px
}

#ho .bill-listmenu li {
    height: 140px;
    border: 1px solid #ccc;
    border-radius: 4px
}

.activep-input {
    text-transform: uppercase;
    font-size: 30px;
    border: 1px solid #fff;
    border-radius: 5px;
    background: #015869;
    margin-left: 15px
}

.activep {
    max-width: 739px;
    margin: auto;
    position: relative;
    text-align: center;
    padding: 13% 0 0 0;
    color: #fff
}

.text-center {
    text-align: center
}

.activep-key {
    padding: 40px 0 25px 0;
    position: relative
}

.choosenhom-right {
    width: calc(100% - 65px);
    float: left
}

    .choosenhom-right label {
        float: left;
        line-height: 16px;
        font-weight: 400
    }

.w20 {
    width: 30px !important;
    border: none !important
}

.activep-img {
    width: 100px;
    height: 100px
}

.activep p {
    font-size: 1rem
}

.activep .error {
    position: absolute;
    padding: 11px;
    background: #fff;
    margin-left: 6px;
    border: 1px solid red;
    display: none
}

    .activep .error:before {
        border-right: 6px solid red;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        top: 12px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        left: -6px
    }

    .activep .error:after {
        border-right: 6px solid #fff;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        top: 12px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        left: -5px
    }

#txtDaTraKhach {
    height: 27px
}

.bill-name-list2 span {
    line-height: 25px
}

.team-img {
    height: 50px;
    width: 55px;
    float: left;
    margin-right: 15px;
    margin-left: 5px
}

.CssImg {
    height: 100%;
    width: 100%
}

.ui-menu-item {
    border-bottom: 1px dotted #ccc;
    line-height: 20px
}

#ui-id-10 .ui-menu-item {
    border-bottom: 1px dotted #ccc;
    padding-left: 10px;
    line-height: 30px
}

.cmth {
    width: 367px !important;
    min-width: 367px !important
}

.cmmh {
    width: 80px !important;
    min-width: 80px !important
}

.cmmh1 {
    width: 103px !important;
    min-width: 103px !important
}

#txtMaHang {
    width: 120px !important;
    min-width: 120px !important
}

#txttenhang {
    width: 290px !important;
    min-width: 290px !important
}

.cmcheck {
    min-width: 30px !important;
    width: 30px !important
}

#modalPopupLapPhieuThu .table {
    width: 99.9%;
    min-width: 99.9%
}

.title-kmhd {
    line-height: 24px;
    padding-left: 15px;
    font-weight: 700;
    font-size: 15px;
    border-bottom: none;
    border-top: none;
    background: #f2f2f2;
    padding: 3px 15px;
}

.giatriload {
    background: #fff
}

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

.img-bill {
    padding-top: 30px
}

.CssImg .img-bill {
    padding-top: 0
}

.choose-price li {
    float: left
}

#lblHoaDon li.active a {
    color: #fff
}

.border-blue {
    border-right: 1px solid #32b7b3 !important;
    border-left: 1px solid #32b7b3 !important
}

    tr:hover .border-blue td, .border-blue td {
        background: #e6e6e6 !important
    }

.border-blue-right {
    border-right: 1px solid #32b7b3 !important
}

.border-blue-bottom {
    border-bottom: 1px solid #ccc !important
}

.border-blue-top {
    border-top: 1px solid #32b7b3 !important
}

#datail-TH4 .content-right {
    width: 675px
}

.border-blue td {
    border-top: 1px solid #32b7b3 !important
}

.close-ul-km {
    position: absolute;
    top: 2px;
    right: 7px;
    color: #746d6d
}

#modalPopuplg_TMTK .close-ul-km {
    position: absolute;
    top: 7px;
    right: 7px;
    color: #746d6d
}

.close-ul-km .fa-minus {
    display: none
}

.w190 {
    width: 290px !important;
    min-width: 290px !important
}

#nhomhang, .cmnh {
    width: 293px;
    min-width: 293px
}

#cke_txtHoaDonBanLe, #cke_txtDatHang, #cke_txtTrahang, #cke_txtDoiTraHang, #cke_txtNhapHang, #cke_txtTraHangNhap, #cke_txtChuyenHang, #cke_txtPhieuThu, #cke_txtPhieuChi, #cke_txtXuatHuy {
    width: 100% !important;
    border: 1px dotted #ccc
}

#cke_5_bottom, #cke_1_bottom, #cke_2_bottom, #cke_3_bottom, #cke_4_bottom, #cke_6_bottom, #cke_7_bottom, #cke_8_bottom, #cke_9_bottom, #cke_10_bottom {
    display: none
}

.establish-right #cke_txtDatHang {
    border: none
}

.mabo {
    margin-bottom: 15px
}

.cke_top {
    border: none
}

.banghh tbody td {
    padding: 10px
}

.bangsq tbody td {
    padding: 7px;
    font-size: 1rem
}

.printpageThaoTac {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    display: none;
    z-index: 9999999999
}

.StartImport {
    margin-right: 5px;
    z-index: 0;
    display: inline-block;
    background: gray;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 7px 15px;
    white-space: nowrap;
    border: none;
    vertical-align: middle;
    border-radius: 2px;
    cursor: pointer
}

.imgprint {
    padding-top: 1px;
    padding-left: 20px !important
}

#mahanghoa {
    padding-left: 30px !important
}

.printablediv-page .bold {
    padding-left: 30px !important
}

.fixheight {
    padding-top: 13px !important
}

.seachnumber1 {
    float: left;
    width: 100px;
    margin-left: 12px;
    border: 1px solid #fff;
    border-radius: 3px;
    height: 30px;
    margin-top: 6px;
    outline: none;
    display: none
}

#xoadulieu .commodity-note {
    position: absolute;
    right: -27px;
    top: -5px
}

.date-chang1 #datetime {
    border: none;
    outline: none;
    border: none
}

.establish-left .fa-exclamation-circle {
    right: 9px;
    top: 12px;
    color: #c8c8c8;
    position: absolute;
    font-size: 15px;
    display: none !important
}

.box-detail-print p {
    height: 15px;
    float: left;
    width: 100%
}

.divSearchVue {
    position: absolute;
    top: 30px;
    max-height: 500px;
    background: #fff;
    left: 0;
    overflow: scroll;
    border: 1px solid #ccc;
    width: 350px;
    z-index: 1000
}

    .divSearchVue li {
        border-bottom: 1px dotted #ccc;
        padding: 6px
    }

        .divSearchVue li:hover {
            background: #f2f2f2
        }

#showseach_TH {
    position: absolute;
    top: 30px;
    max-height: 280px;
    background: #fff;
    overflow: scroll;
    border: 1px solid #ccc;
    width: 470px;
    z-index: 1000
}

    /*#showseach_TH ul {
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 100%;
        width: 100%
    }*/

    #showseach_TH li {
        border-bottom: 1px dotted #ccc;
        padding: 6px
    }

        #showseach_TH li a {
            font-size: 1rem
        }

        #showseach_TH li:hover {
            background: #dff6c9
        }

.fix-content {
    position: fixed;
    margin-left: 230px;
    top: 0;
    width: 1171px
}

#showseach {
    position: absolute;
    top: 30px;
    max-height: 450px;
    background: #fff;
    left: 0;
    overflow: auto;
    border: 1px solid #ccc;
    width: 450px;
    z-index: 1000
}

    #showseach li {
        padding: 6px
    }

.icon-seachpp {
    position: absolute;
    top: 14px;
    left: 10px
}

.khuyenmaihh {
    border: 1px dotted #ccc;
    padding: 10px;
    line-height: 20px
}

.text-right .arrow-left.fix-heightpp {
    height: auto !important
}

.arrow-left2 .price_2 .w160 {
    width: 156px !important;
    line-height: 20px
}

#promotiont .bill-seach span img {
    position: absolute;
    top: 14px;
    left: 6px
}

.seac-trahh {
    position: relative
}

    .seac-trahh input {
        padding-left: 27px
    }

    .seac-trahh img {
        position: absolute;
        top: 6px;
        left: 7px
    }

.titile-trahh {
    background: var(--color-table);
    color: #fff;
    margin-top: 20px
}

.table-trahh th {
    border: 1px solid #ccc;
    background: #fff
}

.table-trahh td {
    border: 1px solid #ccc
}

.table-trahh {
    border: 1px solid #ccc
}

.load-full {
    position: fixed;
    top: 47px;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1
}

    .load-full #wait {
        top: 28%;
        left: 40%;
        z-index: 30001
    }

.ov6 {
    overflow: scroll;
    max-height: 636px
}

.add-icon-search-left:before {
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    bottom: 0;
    left: 5px;
    font-size: 18px;
    top: 3px;
    content: '\f002';
    color: var(--color-primary)
}

.add-icon-search-left input {
    padding-left: 30px
}

.tab_chung .nav-tabs {
    float: left;
    border: none
}

#table_ChuyenHangChiTiet {
    display: none
}

.detail-reporthh {
    width: 175px
}

    .detail-reporthh li {
        float: left;
        padding-right: 20px;
        line-height: 34px
    }

#computersquer .modal-footer {
    border: none;
    padding: 20px 20px 15px 0px !important
}

.line-right {
    content: '';
    position: absolute;
    right: 0;
    width: 1px;
    background: var(--color-main);
    z-index: 99
}

.choose-commoditykh {
    height: 18px
}

#showseach_NhomDT {
    border: 1px solid #ccc;
    border-top: none;
    max-height: 153px;
    overflow: scroll
}

    #showseach_NhomDT a {
        font-weight: 400;
        color: #555;
        cursor: pointer
    }

.content-warning1 {
    min-width: 222px;
    border: 1px solid #ccc;
    z-index: 10004;
    padding: 8px 14px;
    background: #fff;
    top: 27px;
    margin-top: 0;
    margin-left: 23px;
    display: none;
    position: absolute;
    right: 45px;
    border-radius: 3px
}

#inforPoint {
    padding-top: 0;
    right: 58px;
    top: -3px
}

.content-warning1:before {
    border-bottom: 6px solid #32b7b3;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    margin-top: 0;
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    right: 145px;
    top: -7px
}

.main-warning1 {
    padding-top: 6px;
    font-size: 15px;
    position: absolute;
    right: -2px;
    top: 2px
}

.check-condition label {
    font-weight: 400
}

.check-condition {
    background: #dadadacc;
    border-radius: 4px;
    padding: 12px;
    margin-top: 15px
}

.w111 label {
    width: 70px
}

.w170 .form-wrap.floatleft {
    width: 100% !important
}

.height470 {
    max-height: 470px
}

.inner-setup .txtRed {
    line-height: 33px
}

#thongtin .toogle {
    margin-right: 27px
}

.testnear {
    padding: 5px;
    max-height: 165px;
    overflow: auto;
    margin-top: 10px
}

#showseach_NhomDT ul {
    width: 100%;
    padding-left: 5px
}

#showseach_NhomDT li {
    line-height: 30px;
    padding-left: 11px;
    border-bottom: 1px dotted #ccc
}

    #showseach_NhomDT li:last-child {
        border-bottom: none
    }

#modalPopuplg_NV .form-wrap label {
    width: 88px !important
}

.radio-button-leff label {
    width: 88px !important;
    line-height: 22px !important
}

.name-store label {
    margin-right: 6px;
    max-width: 125px;
    overflow: hidden;
    white-space: nowrap !important
}

.name-store .fa-angle-down {
    position: absolute;
    right: 4px;
    top: 18px
}

.renewal {
    display: none;
    position: fixed;
    bottom: 0;
    text-align: left;
    width: 100%;
    background: linear-gradient(to right,var(--color-primary),rgb(243 243 243));
    z-index: 9;
    height: 40px;
    line-height: 40px;
    color: #fff;
    font-weight: 700;
    padding-left: 30px;
    overflow: hidden;
    transition: padding-left 0.25s linear;
}

    .renewal .fa-angle-right {
        font-size: 85px;
        position: relative;
        padding-left: 10px;
        top: -24px;
        color: #ccc
    }

    .renewal font {
        color: #df0000;
        font-size: 13px
    }

    .renewal img {
        width: 100%;
        position: absolute;
        left: 0;
        top: 0
    }

#slideset2 {
    height: 40px;
    position: relative;
    overflow: hidden;
    width: 100%;
}

    #slideset2 > * {
        position: absolute;
        top: 100%;
        left: 35px;
        animation: 15s autoplay2 infinite ease-in-out
    }

@keyframes autoplay2 {
    0% {
        top: 100%
    }

    4% {
        top: 0%
    }

    33.33% {
        top: 0%
    }

    37.33% {
        top: -100%
    }

    100% {
        top: -100%
    }
}

#slideset2 > *:nth-child(1) {
    animation-delay: 0s
}

#slideset2 > *:nth-child(2) {
    animation-delay: 5s
}

#slideset2 > *:nth-child(3) {
    animation-delay: 10s
}

.renewal #slideset2:hover > * {
    animation-play-state: paused;
}

#datail-TH6 input {
    margin-right: 8px
}

#modalPopup_EditPhieuThuHD .name-product_date {
    width: 67%
}

.add-customer .choose-person li {
    float: left
}

.add-customer .btn {
    position: absolute;
    right: 0;
    height: 100%;
    outline: none;
    background: #fff;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    z-index: 9999
}

.add-customer .choose-person {
    width: 245px
}

.op-thong-bao ul li:hover {
    background: var(--table-footer) !important
}

.btn-bue:hover {
    background: var(--color-button-hover)
}

.btn-green:hover {
    background: var(--color-primary);
    color: #fff
}

.btn-blue-b:hover {
    background: var(--color-primary)
}

.btn-updata:hover {
    color: #fff
}

.tab-form-old li.active {
    border-top: 1px solid var(--color-primary);
    border-left: 1px solid var(--color-primary);
    border-right: 1px solid var(--color-primary);
    border-bottom: none !important
}

.tab-form-old li a {
    margin: 0px !important;
    font-weight: 700
}

.tab-form-old .nav-tabs {
    border-bottom: 1px solid var(--color-primary)
}

.btn-pink:hover {
    background: #f34545
}

.fillter a:hover {
    background: var(--color-primary)
}

.text-deal textarea {
    border: none;
    border-left: 1px solid #edecec;
    outline: none;
    height: 80px
}

.scoll-300 {
    max-height: 300px;
    overflow: scroll
}

.scoll-tt {
    max-height: 94px;
    overflow-y: scroll
}

@media print {
    .img-print {
        margin: 0;
        border: initial;
        border-radius: initial;
        width: initial;
        min-height: initial;
        box-shadow: initial;
        background: initial;
        page-break-after: always
    }
}

.sample-template {
    float: left;
    width: 200px;
    padding-left: 15px
}

    .sample-template .form-control {
        height: 32px !important
    }

.choose-paper span {
    float: left;
    line-height: 30px;
    padding-right: 6px
}

.choose-paper input {
    float: left;
    width: 170px
}

.choose-paper select {
    float: left;
    width: 100px
}

.choose-paper {
    padding-bottom: 20px
}

.bg-15 {
    background: var(--color-main)
}

.establish-left li.active .fa-exclamation-circle {
    color: #fff
}

.print-m {
    background: var(--color-main);
    z-index: 0;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 8px 0;
    white-space: nowrap;
    border: none;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    border-radius: 2px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 1px dotted #ccc;
    z-index: 99999
}

.bor-r {
    border-top-right-radius: 0;
    padding: 8px 9px;
    border-bottom-right-radius: 0
}

.print-m .dropdown-menu {
    z-index: 99999999999999999;
    border-radius: 0;
    background: var(--color-main);
    border: none
}

    .print-m .dropdown-menu li {
        line-height: 30px;
        padding-left: 10px;
        border-bottom: 1px dotted #ccc;
        color: #fff;
        width: 100%;
        font-weight: 400
    }

.print-customer.establish-right .bordermauin {
    border: 1px solid #ccc;
    padding: 10px;
}

.print-customer.establish-right .choose-paper .col-md-5 {
    border: none;
    padding: 0
}

.print-view .outselect .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.editmau {
}

.outselect.add-customer {
    position: relative;
}

.choose-date-yaer .add-customer img {
    right: 38px !important;
    position: absolute;
    top: 7px;
}

.choose-date-yaer #btnTypeNgaySinh {
    top: 0
}

.choose-date-yaer .dropdown-menu {
    padding: 10px
}

    .choose-date-yaer .dropdown-menu li {
        position: relative
    }

.print-m #dLabel {
    padding: 9px 8px
}

.check-update label {
    font-weight: 400
}

.check-update {
    padding-top: 10px
}

.font400 {
    font-weight: 400
}

.w166 {
    width: 166px !important
}

.w67 {
    width: 67% !important
}

.total-payment {
    float: left;
    width: 180px;
    line-height: 30px
}

.name-payment {
    float: left;
    width: calc(100% - 420px);
    padding-left: 50px;
    position: relative
}

.money-payment {
    float: right;
    width: 240px
}

.information-payment {
    background: var(--color-filter-left);
    padding: 20px 20px;
    margin: 10px 0;
    border-radius: 3px
}

.item-payment {
    display: flex;
    align-items: center;
    padding: 3px 0
}

.w115px-l {
    width: 115px;
    float: left
}

.w115px-r {
    width: 115px;
    float: right
}

.name-payment font {
    line-height: 30px;
    color: #6d6d6d
}

.name-payment .fa-info-circle {
    position: relative !important;
    color: #7e7b7b
}

.check-after-li {
    float: right;
    padding-right: 20px;
    line-height: 21px;
    color: #009ddc;
    display: inline
}

.li-input-span {
    color: #333;
    line-height: 30px;
    text-align: left;
    width: auto !important;
    padding: 0 7px;
    margin: 1px 0 1px 1px
}

.permission-choose .col3 ul {
    padding-left: 20px
}

#modalContainerlg_EditVaiTro .permission-choose .col3 ul, #modalContainerlg_VaiTro .permission-choose .col3 ul {
    display: block
}

.col3 .showhideicon {
    float: right;
    padding-right: 14px;
    color: var(--color-primary)
}

.permission-main select {
    background: #e6e6e6
}

.bottom14 {
    bottom: -12px
}

.main-show .turnon {
    position: absolute;
    left: 2px;
    width: 27px;
    height: 27px;
    text-align: center;
    margin-left: 0
}

.main-show .turnoff {
    position: absolute;
    right: 2px;
    width: 27px;
    height: 27px;
    text-align: center
}

.main-show {
    width: 56px;
    height: 27px;
    background: #f33;
    border-radius: 18px;
    position: relative;
    color: #fff;
    cursor: pointer;
    transition: all 0.4s ease;
}

    .main-show.main-hide {
        background: #32b7b3
    }

    .main-show::before {
        content: '';
        width: 25px;
        height: 25px;
        background: #fff;
        border-radius: 15px;
        top: 1px;
        position: absolute;
        left: 1px;
        transition: all 0.4s ease;
    }

.main-hide::before {
    left: 30px !important
}

.show-table span {
    float: left;
    margin-left: 15px
}

.show-table {
    float: right;
    line-height: 30px
}

.list_HHTraNhapHangTab2, .list_HHTraNhapHangCT2, .list_HHTraNhapHangCT1, .list_NVBanHangNV, .list_NV, .list_HHTonKhoXuatpCT, .list_HHTonKhhoNhapCT, .list_HHTonKhoXuatKhoTQ, .list_HHTonKhoNhapKhoTQ, .list_HHTonKho, .list_HHCHXuatCT, .list_HHTraNhapHang, .list_HHCHNhapTQ, .list_HHCHXuatTQ, .list_HHXuatHuy, .list_HHXuatNhapTonChiTiet, .list_KHHangHoa, .list_KHCongNo, .list_KHLoiNhuan, .list_HHNCC, .list_HHNhanVien, .list_HHKhachTheoHang, .list_HHXuatNhapTon, .list_HHLoiNhuan, .list_NHCN, .list_DHGiaoDich, .list_HangHoa, .list_ThuChi {
    display: none
}

#choose_TenNganHang {
    height: auto !important
}

.content-print-page #wait {
    display: block;
    width: 130px;
    height: 89px;
    position: absolute;
    top: 57% !important;
    left: 34% !important;
    text-align: center;
    padding: 2px;
    z-index: 999
}

.giamoi {
    min-width: 150px;
    width: 150px
}

.gianhapcuoi {
    min-width: 150px;
    width: 150px
}

.giavon {
    min-width: 80px;
    width: 80px
}

.notifi-general ul {
    display: block !important;
    background: white !important;
    position: relative !important;
    top: 0px !important;
    border-right: 1px solid var(--color-primary);
    overflow: scroll;
    overflow-x: hidden;
    max-height: 400px;
    width: 390px !important
}

    .notifi-general ul li {
        border-bottom: 1px solid #ccc
    }

.notifi-general {
    position: absolute;
    background: #fff;
    width: 391px;
    right: -1px;
    top: 47px;
    border: 1px solid var(--color-primary);
    border-top: none;
    display: none;
    z-index: 99999
}

.bg-whitee {
    background: var(--color-main) !important
}

.li-notifi {
    display: none;
    padding: 0px !important
}

    .li-notifi .fa-bell {
        font-size: 19px
    }

.sum-notifi {
    position: absolute;
    top: -4px;
    right: -3px;
    border: 1px solid #fff;
    border-radius: 30px;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    font-size: 11px;
    background: #eb4a24;
    color: #fff
}

.notifi-general .tong-notifi {
    line-height: 40px;
    text-align: center;
    padding: 0 10px;
    cursor: pointer
}

.borderb {
    border-bottom: 1px solid #ccc;
    position: relative
}

.notifi-general ul li:hover {
    color: #000;
    cursor: pointer
}

.notifi-general i {
    color: #eb4a24 !important;
    font-size: 15px !important;
    margin-right: 6px !important;
    padding-left: 0px !important;
    width: auto !important
}

.notifi-general ul li:hover i, .notifi-general ul li:hover .date-notifi {
    color: white !important
}

.view-all {
    line-height: 40px;
    padding: 0 15px;
    border-top: 1px solid #ccc
}

    .view-all a {
        color: black !important
    }

        .view-all a:hover {
            color: #32b7b3 !important
        }

.notifi-general ul::-webkit-scrollbar {
    width: 5px;
    height: 14px
}

.notifi-general ul::-webkit-scrollbar-thumb {
    background: #ccc
}

.date-notifi {
    font-size: 11px;
    color: #727070;
    font-style: italic
}

.notifi-general ul li:hover .date-notifi {
    color: #ff3333 !important
}

.choose-file .btn-file {
    border: none
}

.thietlapmauin .form-group {
    margin-bottom: 5px
}

    .thietlapmauin .form-group .form-label {
        width: 190px !important;
        font-weight: 400
    }

.w67px {
    width: 97px !important
}

.choose-mauin {
}

.bnt-caretl {
    float: left;
    width: 22px;
    border: 1px solid #ccc;
    line-height: 32px;
    height: 27px;
    border-radius: 3px;
    text-align: center;
    padding-top: 4px;
    margin: 0 3px
}

.bg-style li {
    float: left !important;
    padding-left: 22px;
    padding-bottom: 22px
}

.header-top ul li:hover ul .bg-style {
    display: none
}

.bg-style .fa-check {
    line-height: 34px !important
}

.menu-horizontal-inner ul li ul li ul li:hover {
    background: var(--color-primary) !important
}

.notifi-general li a {
    color: black !important
}

.change-bg {
    width: 405px;
    z-index: 999999999999;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    outline: 0;
    max-width: 500px;
    margin: 10% auto;
    background: #fff;
    box-shadow: 0 0 6px 3px #ccc;
    height: 345px;
    display: none
}

.bg-style {
    padding-top: 25px;
    padding-left: 5px
}

.change-bg .modal-header {
    font-size: 16px
}

.notifi-left {
    width: 53px;
    float: left;
    height: 100%;
    height: 53px;
    border: 1px solid #ccc;
    border-radius: 56px;
    text-align: center;
    line-height: 50px
}

.notifi-right {
    width: calc(100% - 56px);
    float: right;
    padding-left: 18px
}

.notifi-left img {
    padding: 0px !important
}

.notifi-right p {
    margin: 0
}

.install-notifi {
    position: absolute;
    top: 35px;
    right: -9px;
    background: #fff;
    border: 1px solid var(--color-primary);
    height: 158px;
    z-index: 99;
    width: 407px;
    border-radius: 7px;
    padding: 15px 30px;
    display: none
}

    .install-notifi::before {
        border-bottom: 9px solid #32b7b3;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        right: 45px;
        top: -6px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        z-index: 99
    }

    .install-notifi::after {
        border-bottom: 9px solid #fff;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        right: 45px;
        top: -5px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        z-index: 99
    }

    .install-notifi .form-group {
        margin-bottom: 5px
    }

        .install-notifi .form-group .form-label {
            font-weight: 400 !important;
            line-height: 29px;
            margin: 0
        }

#thietlapmauin {
    height: auto !important
}

.bill-control-right .install-notifi {
    right: 46px;
    height: 190px
}

.accordion-content .bx-wrapper .bx-viewport {
    height: 60px !important
}

.sumgiamgia {
    float: right;
    line-height: 21px;
    width: 150px
}

.bill-de .fa-times {
    color: #ed5b5b;
    font-size: 18px
}

.bill-plus:hover {
    color: #32b7b3
}

.install-notifi.xuathuy {
    top: 35px;
    height: auto !important;
    left: unset;
    right: 0
}

.name-title-table {
    padding: 0 20px 0 5px;
    background: var(--color-main);
    color: #fff;
    line-height: 32px;
    font-size: 1rem;
    height: 43px
}

.nhap-hang-thanh-toan {
    width: calc(100% - 270px);
    padding-left: 15px
}

.name-title-table .code-hh {
    font-weight: 400
}

#lblHoaDon li a {
    color: #000
}

.bill-control-right a {
    color: #666
}

    .bill-control-right a i {
        font-size: 18px
    }

    .bill-control-right a:hover {
        color: var(--color-primary)
    }

.main-slideleft i {
    font-size: 17px
}

.supper-hotline {
    line-height: 45px;
    font-size: 13px
}

    .supper-hotline span {
        color: var(--color-primary)
    }

doi-tra-hang-new container-fluid nopadding
.print-drafts {
    margin: 0;
    float: left;
    height: 70px;
    background: var(--color-button-thanh-toan);
    border: none;
    color: #fff;
    font-weight: 700;
    border-radius: 4px;
    padding: 12px;
}

.function-keys {
    position: absolute;
    top: 35px;
    right: 6px;
    background: #fff;
    border: 1px solid var(--color-primary);
    height: auto;
    max-height: 500px;
    z-index: 999999;
    width: 399px;
    border-radius: 7px;
    padding: 15px 20px;
    display: none
}

    .function-keys::before {
        border-bottom: 9px solid #32b7b3;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        right: 143px;
        top: -6px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        z-index: 99
    }

    .function-keys::after {
        border-bottom: 9px solid #fff;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        right: 143px;
        top: -5px;
        margin-top: -3px;
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        z-index: 99
    }

.title-keys {
    font-weight: 700;
    font-size: 17px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px
}

.function-keys label {
    float: left;
    width: 65px;
    margin: 0;
    color: var(--color-primary);
    line-height: 24px;
}

.function-keys .content-key {
    float: left
}

.main-slide a:hover, .dow-sli:hover i, .bx-next:hover i, .bx-prev:hover i, .select-user li:hover a {
    color: var(--color-primary) !important
}

.select-user li a {
    color: black !important
}
/*.bill-listchoose li:hover .bill-plus i, .grocery .bill-listchoose li:hover .note-out {
    display: block
}*/
.bill-pay button:hover {
    background: var(--button-thanh-toan-hover)
}

.bill-control-right ul li i {
    font-size: 15px
}

.main-key {
    margin-left: 0
}

    .main-key a {
        height: 22px;
        width: 22px;
        border: 2px solid #6e6c6c;
        float: left;
        text-align: center;
        line-height: 22px;
        border-radius: 30px
    }

.frames-content .group-sum-total .col-xs-4 {
    padding-right: 0
}

.main-key a i {
    font-size: 1rem
}

.xuathuy .bnt-caretl {
    width: 22px;
    line-height: 18px;
    font-size: 17px;
    color: #666;
    height: 27px
}

.export-keys {
    top: 35px;
    left: unset;
    right: 0;
}

    .export-keys::after {
        left: unset;
        right: 10px;
    }

    .export-keys::before {
        left: unset;
        right: 10px;
    }

.flaggOfPrint i, .import-fast:hover i, .import-fast a:hover {
    border-color: #32b7b3 !important;
    color: #32b7b3 !important
}

.import-fast .fa-barcode {
    font-size: 23px
}

.bill-plus .fa-minus, .bill-plus .fa-plus {
    font-size: 18px;
    padding-top: 7px
}

.notifi-general .install-notifi {
    z-index: 999999 !important
}

.thaotac .form-group {
    margin-bottom: 0px !important
}

.bill-total .table {
    font-size: 13px
}

.slide-goods2 .number-fast-banle {
    padding-top: 3px
}

.slide-goods2 .box-barcode {
    padding-top: 6px
}

th a {
    pointer-events: none
}

.in-debt .form-group {
    margin-bottom: 0
}

.bgwhite {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    opacity: 0;
    z-index: 1046;
    display: none
}

.grocery table td {
    white-space: inherit !important
}

.collapse-nd {
    position: relative;
    width: 68px;
    cursor: pointer;
    position: relative;
    padding-top: 7px
}

.permission-choose {
    max-height: 400px;
    overflow: scroll
}

.showhide {
    display: none !important
}

.collapse-nd span {
    width: 15px;
    height: 15px;
    border: 1px solid var(--color-primary);
    float: left;
    margin-right: 5px;
    border-radius: 3px;
    line-height: 16px;
    padding-left: 0
}

.check span:after {
    content: '\2713 ';
    outline: none;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    color: #32b7b3 !important;
    position: absolute;
    top: 8px;
    left: 3px
}

#datail-TH9 .form-group, #datail-TH8 .form-group, #datail-TH6 .form-group {
    margin-bottom: 0
}

.hoadon-nh .bill-plus {
    width: 30px
}

    .hoadon-nh .bill-plus i {
        font-size: 22px !important;
        padding-top: 3px !important;
        display: block !important
    }

.hoadon-nh .logoOpen24 {
    padding-left: 0
}

.hoadon-nh .bill-pluss {
    width: 32px;
    font-size: 1rem;
    margin-top: 6px;
    color: white !important;
    background: var(--color-main) !important
}

    .hoadon-nh .bill-pluss:hover {
        background: var(--color-primary) !important
    }

.hoadon-nh .bill-control-right li {
    line-height: 42px
}

.hoadon-nh #th .nav-tabs {
    margin-bottom: 5px
}

.op-js-tr-hide a {
    cursor: pointer
}

.w76 {
    width: 76px !important
}

.w93 {
    width: 93px !important
}

.name-bill-cn {
    margin-top: 6px;
    color: #666;
    padding-left: 0
}

    .name-bill-cn img {
        margin-top: -6px
    }

    .name-bill-cn span {
        padding-left: 0
    }

.select-usercn {
    left: -1px !important;
    top: 39px !important
}

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

.changetime span {
    width: 76px;
    line-height: 30px;
    float: left;
    text-align: center;
    color: #36c;
    margin-left: 15px
}

.table-changetime {
    border: 1px solid #ccc;
    margin: 15px 0 30px 0px !important;
    text-align: center;
    max-height: 400px;
    overflow: scroll
}

    .table-changetime tr {
        border-bottom: 1px solid #ccc
    }

    .table-changetime th {
        font-weight: 400;
        padding: 9px;
        background: #D6F1F0;
        line-height: 17px;
        text-align: center
    }

    .table-changetime td {
        text-align: center
    }

.viewmore-time {
    color: #36c;
    padding: 10px 0;
    float: left
}

.table-changetime .fa-times {
    color: red;
    cursor: pointer
}

.colb {
    color: #36c
}

.permission-main .collapse-nd {
    margin-right: 20px
}

.bill-bxslide ul li.using {
    border-bottom: none !important;
    text-decoration: none;
    height: 35px;
    font-weight: 700;
    color: white !important;
    background: var(--color-main);
    z-index: 999;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.hoadon-nh .bill-de {
    margin-top: 7px;
    width: 25px;
    text-align: center
}

    .hoadon-nh .bill-de .fa-times {
        font-size: 15px
    }

.hoadon-nh .supper-hotline {
    padding-right: 57px
}

#lstNhomHHChosed {
    float: left;
    height: 30px;
    line-height: 30px;
    padding-top: 3px;
    padding-left: 10px
}

    #lstNhomHHChosed ul li {
        margin-right: 3px;
        border: none;
        display: inline;
        font-size: 13px
    }

.grocery #lstNhomHHChosed {
    width: 495px !important;
    right: 0
}

.highcharts-axis-labels text {
    font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif
}

.bagr1 {
    background: #8282e4
}

.item-chart {
    width: 220px;
    height: 100px;
    margin-bottom: 30px;
    font-size: 11px
}

.img-chart {
    width: 82px;
    float: left;
    padding-top: 24px;
    text-align: center
}

.content-chart {
    float: left;
    margin-bottom: 5px;
    padding-bottom: 5px
}

.title-chart {
    font-size: 1rem
}

.content-chart .bold {
    font-size: 16px
}

.bagr2 {
    margin: auto;
    background: #f86f1d
}

.bagr3 {
    float: right;
    background: #00a69c
}

.hello-admin {
    font-size: 1rem;
    padding-left: 30px;
    position: relative;
    width: calc(100% - 445px);
    float: left;
    line-height: 30px
}

    .hello-admin img {
        position: absolute;
        left: 0
    }

.paddingtop40 {
    padding-top: 25px;
    float: left;
    padding: 5px 40px;
    margin-bottom: 20px;
    border-radius: 5px
}

.left-collection {
    float: left;
    width: 180px;
    text-align: center;
    margin-bottom: 10px;
    position: relative
}

.item-collection {
    height: 218px;
    padding-top: 10px
}

.name-collection {
    font-size: 1rem;
    padding-top: 29px;
    padding-bottom: 15px
}

.right-collection {
    float: right;
    width: calc(100% - 180px)
}

    .right-collection .title-chart {
        font-size: 1rem;
        color: #000;
        font-weight: 700
    }

.left-collection .name-collection {
    color: #000
}

.right-collection li {
    line-height: 25px;
    width: 100%
}

.item-collectionr {
    margin-left: 15px
}

.right-collection .month6 a {
    text-decoration: none;
    color: #4d4d4d !important
}

.right-collection .bold span {
    color: var(--color-primary)
}

.patop20 {
    padding-top: 20px
}

    .patop20 span {
        color: #8282e4 !important
    }

.chinhanh-vaitro select {
    width: 150px;
    float: left
}

.col3 ul li {
    padding: 0
}

    .col3 ul li .list-permission {
        line-height: 23px
    }

.not-partition {
    text-align: center;
    padding-top: 50px;
    font-size: 13px
}

#renderbody {
    height: 100%
}

.group-parent li.item-collectionl .right-collection .bold {
    color: #f86f1d
}

.name-lot {
    display: flex;
    height: max-content;
    margin-right: 5px;
}

    .name-lot span {
        float: left;
        width: 61px;
        line-height: 25px
    }

.date-lot {
    border-radius: 4px;
    color: #fff;
    padding: 4px 1ch;
    margin-top: 0;
    height: 24px;
    line-height: 18px;
    font-size: 12px;
    width: 80px;
}

.bglot1 {
    background: #00a69c;
}

.bglot2 {
    background: #fe2727;
}

.bglot3 {
    background: #f9f9f9
}

.delete-lot {
    color: #6d6e71;
    float: left
}
/*.name-lot input {
    width: 110px;
    float: left;
    height: 28px !important
}*/
.item-lotinport span {
    padding-right: 10px;
    line-height: 25px
}

.group-parent li {
    padding-left: 0px !important;
    border: none !important
}

    .group-parent li ul {
        overflow: inherit !important;
        height: auto !important
    }

.group-p1 {
    padding-left: 10px;
    border-bottom: 1px dotted #ccc;
    position: relative;
    float: left;
    width: 100%
}

.group-p2 {
    padding-left: 23px;
    border-bottom: 1px dotted #ccc;
    position: relative;
    float: left;
    width: 100%
}

.group-p3 {
    padding-left: 33px;
    float: left;
    width: 100%;
    border-bottom: 1px dotted #ccc;
    position: relative
}

.group-parent .p-left10 {
    padding-left: 10px !important;
    border-bottom: 1px dotted #ccc !important
}

.seach-lot {
    float: left;
    width: 231px;
    position: relative;
    margin-bottom: 15px
}

.select-lot {
    float: left;
    margin-left: 10px
}

.seach-lot i {
    position: absolute;
    top: 7px;
    font-size: 1rem;
    left: 7px;
    color: #928f8f;
}

.seach-lot input {
    padding-left: 23px
}
/*.numberlot {
    line-height: 25px;
    margin-right:5px
}*/
/*.name-lot1 {
    margin-left: 28px;
    float: left;
    width: 160px;
    padding-right: 16px
}*/
/*  .name-lot1 .numberlot {
        float: left;
        width: 61px
    }*/
.group-btn-left .group-btn {
    padding: 15px 0 10px 0
}

.item-lohang {
    padding-left: 60px
}

.number-lot {
    background: #f9f9f9
}

.close-phieu-nhap {
    width: 30px
}

.table-lot tr td {
    border: none !important
}

.w60 {
    width: 60px;
    min-width: 60px
}

.w130 {
    border: none;
    border-bottom: 1px solid #ccc;
    line-height: 24px;
    outline: none;
    background: none;
    padding: 3px 7px;
}

.item-lot .selec-person {
    border-radius: 4px;
    top: 27px;
    min-width: 100px;
    overflow-x: hidden
}

.item-lot .selec-personTR {
    width: 100px;
    border-radius: 4px;
    top: 27px;
    overflow-x: hidden
}

.selec-person li:hover {
    background: #d6f1f0 !important;
    color: black !important
}

.selec-personTR li:hover {
    background: #d6f1f0 !important;
    color: white !important
}

.selec-personTR {
    width: 100px;
    border-radius: 4px;
    top: 27px;
    overflow-x: hidden
}

.list-price input {
    box-shadow: none;
    border-radius: 0
}

.grocery .callprice-right input {
    width: 85px
}

.del-lot {
    width: 30px;
    float: left;
    line-height: 25px
}

.btn-add-new {
    background: #eb4a24;
    margin-left: 0
}

.add-lot {
    width: 45px;
    float: left;
    text-align: center;
    padding-top: 8px;
    font-size: 16px
}

.ul-import li {
    border-bottom: 1px dotted #ccc
}

    .ul-import li:hover a {
        color: white !important;
        background: var(--color-button)
    }

#modalPopuplg_TMTK .group-parent {
    overflow: scroll;
    overflow-x: hidden;
    height: 380px
}

    #modalPopuplg_TMTK .group-parent li {
        padding-left: 0px !important;
        border: none !important;
        position: relative;
        width: 100%;
        float: left
    }

        #modalPopuplg_TMTK .group-parent li ul {
            float: left;
            width: 100%
        }

.group-p1:hover, .group-p2:hover, .group-p3:hover {
    background: #ddd !important
}

.k-checkboxTR .k-all {
    float: left;
    width: 100%;
    border-bottom: 1px dotted #ccc
}

#modalPopuplg_TMTK .seach-hhchoose input {
    line-height: 17px
}

.banner-introducing {
    background: url(images/anhhh/banner.jpg) no-repeat center;
    height: 130px;
    background-size: 100% 100%;
    color: #000;
    padding-left: 20px;
    padding-top: 37px
}

    .banner-introducing:hover {
        color: #000
    }

.delete-introducing {
    position: absolute;
    right: 0;
    z-index: 100;
    color: #fff;
    font-size: 20px;
    background: rgba(0,0,0,.2);
    width: 30px;
    height: 30px;
    padding-top: 0;
    text-align: center
}

    .delete-introducing:hover {
        color: #ed5b5b
    }

.seach-permission {
    padding: 9px;
    position: relative
}

    .seach-permission input {
        padding-left: 23px
    }

    .seach-permission i {
        position: absolute;
        top: 16px;
        font-size: 15px;
        left: 16px;
        color: #8a8787
    }

.bg-white1 {
    background: #fff
}

#printTemKe .a4 input {
    padding-top: 8px
}

#printTemKe .modal-body label {
    width: 150px
}

.table-tem {
    border: 1px solid #ccc;
    margin-bottom: 20px !important
}

    .table-tem td {
        border-right: 1px solid #ccc
    }

#printTemKe .form-group {
    margin-bottom: 0
}

.bdbor-right {
    border-right: 1px solid #ccc;
    height: 170px;
    padding-right: 30px
}

.right-collection .bold {
    color: var(--color-primary);
    padding-top: 3px;
    float: left
}

    .right-collection .bold img {
        float: left
    }

    .right-collection .bold span {
        float: left;
        line-height: 21px
    }

.banner-sale {
    margin-left: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 20px;
    height: 175px
}

    .banner-sale img {
        width: 100%;
        height: 100%;
        border-radius: 5px
    }

.datachoose {
    margin-bottom: 15px;
    border-radius: 5px;
    overflow-y: auto;
    max-height: 300px;
    padding-bottom: 13px
}

.no-padding-left {
    padding-left: 0px !important
}

.datachoose .datepicker th {
    color: #03a4a1 !important;
    text-align: left !important;
    padding-left: 8px;
    font-weight: 400
}

.datachoose .datepicker td a {
    color: #636363;
    width: 30px;
    height: 30px;
    float: left;
    line-height: 30px;
    text-align: center
}

.form-radio-padding span {
    padding-right: 5px
}

.datachoose .ui-state-active, .datepicker td a:hover {
    background: #03a4a1;
    text-align: center;
    color: white !important;
    border-radius: 30px
}

.datachoose .datepicker td {
    padding: 2px
}

.datachoose .ui-datepicker-calendar {
    margin-top: 20px !important;
    margin-left: 10px !important
}

.inner-overview .title-ds span {
    text-transform: lowercase
}

.printpage-a4 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    display: none;
    z-index: 9999999999
}

.inner-print-a4 {
    width: 210mm;
    background: #fff;
    height: 600px;
    position: relative;
    margin: 100px auto;
    z-index: 9999999999
}

.content-print-page-a4 {
    height: 600px;
    background: #fff;
    overflow: auto;
    float: left;
    width: 100%
}

    .content-print-page-a4 .portrait {
        width: 192mm;
        height: 271mm
    }

    .content-print-page-a4 .landscape {
        height: 192mm;
        width: 271mm
    }

.a44tem table, .a48tem table {
    float: left
}

.a44tem .portrait table {
    width: 91mm;
    height: 122mm;
    margin: 2mm
}

.a44tem .landscape table {
    height: 90mm;
    width: 122mm;
    margin: 2mm
}

.a48tem .portrait table {
    width: 91mm;
    height: 57mm;
    margin: 2mm
}

.a48tem .landscape table {
    height: 90mm;
    width: 59mm;
    margin: 2mm
}

.a44tem table tr td, a48tem table tr td {
    white-space: normal !important
}

.a44tem table tr .tenthuoctinh, .thuoctinh .td {
    white-space: nowrap !important
}

.close-print-thuoctinh {
    position: absolute;
    top: 1px;
    right: 20px;
    background: #fff;
    border: none;
    height: 20px;
    font-size: 23px;
    outline: none
}

.height60 .frames-content .table-reponsive {
    margin-bottom: 48px
}

#modalPhieuXuatHuy .frames-content.pading0 {
    padding-bottom: 25px
}

.frames-content.op2 {
    padding-bottom: 25px
}

ul.ui-autocomplete {
    max-height: 450px
}

.paddingb30 {
    padding-bottom: 32px
}

.getDateDoanhSo span i {
    font-size: 1rem
}
/*.getDateDoanhSo li a:hover {
    background: #99cccc !important;
    color: black !important
}*/
.getDateDoanhSo li a {
    padding: 4px 15px !important
}

.getDateDoanhSo li {
    border-bottom: 1px dotted #ccc
}

    .getDateDoanhSo li a span {
        line-height: 20px
    }

.icon-filter {
    top: 3px;
    left: 6px
}

.table-filter tbody tr p {
    margin: 0
}

.right-inner-addon {
    width: 100%
}

    .right-inner-addon input {
        border-radius: 0
    }

    .right-inner-addon span {
        position: absolute;
        right: 0;
        padding: 8px 26px;
        pointer-events: none;
        color: #999
    }

.menu-main li ul li:hover {
    background: rgba(0,0,0,0.15) !important
}

.icon-filter2 {
    line-height: 29px;
    color: #32b7b3;
    left: -12px;
    display: none
}

.table-filter .col-md-1, .table-filter .col-md-9, .table-filter .col-md-2 {
    padding: 0
}

.table-filter .col-md-1, .table-filter .col-md-9 {
    padding-left: 2px
}

.table-filter thead tr .actioveFilter {
    line-height: 30px;
    padding: 1px 9px
}

.btn-save {
    color: #fff;
    background: #32b7b3;
    border-color: #32b7b3
}

.header-title-filter {
    padding-left: 0
}

.op-object-detail .col-md-9 {
    padding-right: 0
}

    .op-object-detail .col-md-9 .table-res table thead tr th {
        background: #e6e6e6;
        color: #000
    }

.op-table-summary {
    padding-top: 10px
}

.footer-total-detail {
    background: #e6e6e6;
    font-weight: 700
}

.table > thead > tr > th {
    border-bottom: 1px solid #e6e6e6
}

.w300 .title-nhap-xuat {
    padding: 0 15px;
    color: #000
}

    .w300 .title-nhap-xuat .namepage {
        border-bottom: 1px solid #bcbec0
    }

.nopadding {
    padding: 0 !important
}

.label-font-normal {
    font-weight: 400
}

.form-group .img-position {
    position: absolute;
    top: 7px;
    right: 7px
}

.w300 .title-nhap-xuat .title-center {
    text-align: center;
    background: var(--color-table);
    margin-top: 10px
}

    .w300 .title-nhap-xuat .title-center span {
        line-height: 30px;
        color: var(--color-primary);
        font-weight: 700
    }

.w300 .title-nhap-xuat .floatleft .title-warehouse {
    margin-top: 5px
}

.border-top {
    border-top: 1px solid #bcbec0
}

.frames-content .col-md-6 {
    padding: 0;
    width: 49%
}

    .frames-content .col-md-6 .total-sum {
        border: 1px solid #bcbec0;
        border-radius: 3px;
        padding: 10px 10px 0 10px
    }

.title-inport .glyphicon-chevron-down {
    color: #9da0a3
}

.frames-content .col-left {
    margin-right: 5px
}

.btn-padding {
    padding: 3px 0 3px 10px !important
}

frames-content .btn-padding button {
    border-radius: 5px
}

.w300 .frames-content .title-nhap-xuat .title-center {
    margin-bottom: 10px
}

#ulListNhomHH ul li ul li {
    line-height: 30px;
    overflow-y: scroll,
}

.report-view {
    padding-left: 15px;
    padding-right: 3px
}

. .boxLeft .showhideicon {
    right: 10px
}

.checked-thong-bao .form-label {
    width: 100% !important;
    padding-right: 20px
}

.checked-tree-leff {
    padding-left: 15px;
    margin-bottom: 5px
}

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

.title-tree .showhideicon i {
    color: var(--color-main)
}

.check-unit:before {
    content: '\f0c8';
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    font-size: 9px;
    margin-top: 3px;
    margin-left: 3px;
    color: var(--color-main)
}

.content-tree-children {
    margin-left: 20px
}

.btn-tree-check {
    padding: 4px 8px !important;
    border-radius: 4px !important
}

.btn-show-column-report {
    background: #d2f0ef
}

    .btn-show-column-report:hover {
        background: #9de9e6 !important
    }

.input-search-filter .search-report {
    background: #d1d2d9
}

    .input-search-filter .search-report i {
        color: #000
    }

.btn-print-report {
    background: #d7d0f4;
    color: #000
}

    .btn-print-report:hover {
        background: #baadf2 !important
    }

.btn-excel-report {
    background: #fbe1a9;
    color: #000
}

.header-report .btn-header-filter .btn-group img {
    margin-bottom: 2px;
    height: 19px
}

.op-filter-title {
    background: var(--color-filter-left);
    border-top: 1px solid var(--color-filter-left);
    border-bottom: 1px solid var(--color-filter-left);
    font-size: 1rem;
    font-weight: 700;
    padding: 7px 2px 8px 10px;
    margin: 0;
    color: #000
}

.ul-radius {
    padding-left: 15px !important
}

    .ul-radius li {
        margin-bottom: 5px
    }

.modal-opened {
    opacity: .7
}

.product-tab-left label {
    width: 110px
}

.product-tab-left .commodity-note {
    right: 5px
}

.product-tab-left .img-list-c li {
    width: 91px !important
}

.product-tab-left .img-item {
    width: 91px
}

.product-addnew-table tr td {
    border: none
}

.product-addnew-panel .panel-heading {
    background: #d1d2d3 !important;
    color: #000
}

.product-addnew-panel {
    border: 1px solid #d1d2d3
}

.product-tab-right label {
    width: 110px
}

.table-donvitinh thead tr th {
    background: #d2f0ef
}

.table-donvitinh {
    border: 1px solid #d1d2d3
}

.panel-tontoithieu label {
    width: 80px
}

.panel-tontoithieu .commodity-note {
    left: 203px
}

.product-addnew-panel .panel-title {
    font-size: 13px
}

.nav-product-addnew li a {
    font-weight: 700
}

.table-dinhluong tr td {
    border-bottom: 1px solid #ccc
}

.table-dinhluong thead tr th {
    background: #d1d2d3 !important
}

.btn-search-report {
    float: right;
    border: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    margin-right: 6px;
    color: #fff;
    position: absolute;
    width: 32px;
    height: 30px;
    right: 7px;
    background: #d1d2d3
}

    .btn-search-report i {
        color: #000
    }

.nav-product-addnew {
    margin-top: 10px;
    margin-left: 30px;
    margin-right: 30px;
    border-bottom: 1px solid #32b7b3 !important
}

    .nav-product-addnew li.active {
        border: 1px solid #32b7b3;
        border-bottom: none
    }

    .nav-product-addnew li a {
        margin: 0px !important
    }

.report-search-column {
    padding: 0 5px 0 12px
}

.icon-delete {
    color: red
}

.panel-donvicoban .materiall {
    left: 38px
}

.op-titile-notification span {
    position: absolute;
    font-size: 17px;
    color: #fff;
    top: 29px;
    left: 75px
}

.popup-Notification-Open24 {
    position: fixed;
    top: -5px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999
}

    .popup-Notification-Open24 .overlaypop {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 0;
        background: rgba(0,0,0,.3)
    }

    .popup-Notification-Open24 .pop-body {
        max-width: 650px;
        background: #fff;
        border-radius: 3px;
        margin: 120px auto 0;
        padding: 75px 42px 15px;
        position: relative
    }

    .popup-Notification-Open24 .closepop {
        position: absolute;
        right: 0;
        top: 0;
        width: 50px;
        height: 40px;
        line-height: 40px;
        text-align: center
    }

    .popup-Notification-Open24 .pop-wrap {
        overflow: auto;
        max-height: 550px;
        font-size: 1rem;
        color: #666;
        line-height: 20px
    }

        .popup-Notification-Open24 .pop-wrap .pop-header {
            text-align: center;
            font-size: 24px;
            font-weight: 700;
            margin-bottom: 20px;
            line-height: 30px;
            text-transform: uppercase;
            color: #08b5a6
        }

.op-img-notification {
    width: 240px;
    position: absolute;
    left: 0;
    top: 0
}

.popup-Notification-Open24 .pop-wrap .pop-content {
    position: relative
}

.popup-Notification-Open24 .pop-note {
    font-size: 1rem;
    margin-top: 30px;
    padding: 15px 0;
    border-top: 1px solid #ddd;
    text-align: center;
    color: #666
}

    .popup-Notification-Open24 .pop-note .check-group input {
        margin-top: 1px
    }

        .popup-Notification-Open24 .pop-note .check-group input:after {
            top: -10px;
            left: -12px
        }

.op-space {
    padding: 5px
}

.popup-Notification-Open24 .pop-note label, .popup-Notification-Open24 .pop-note strong {
    color: #08b5a6
}

.input-report {
    width: 100%;
    outline: none;
    height: 30px;
    padding-left: 15px
}

.table-thekho table thead tr th {
    border: 1px solid #fff;
    background: #d6f1f0
}

.table-thekho table tfoot tr th {
    background: #d6f1f0
}

.table-thekho table tfoot tr {
    border: none
}

.group-list-img-user li {
    float: left;
    text-align: center;
    height: 115px !important;
    width: 30% !important;
    border: 1px solid #ccc !important;
    border-radius: 2px !important;
    border-bottom: 1px solid #ccc !important;
    margin: 0 0 10px 8px
}

.search-img-user {
    padding-left: 10px;
    padding-right: 0
}

.search-combobox {
    line-height: 20px;
    font-size: 1rem;
    padding: 7px 0 7px 10px !important
}

.p-note {
    margin: 0px !important;
    font-size: 10.5px
}

.contact-customer {
    background: white !important
}

    .contact-customer > li.active > a, .contact-customer > li.active > a:hover, .contact-customer > li.active > a:focus {
        border-top: 1px solid #d1d2d9 !important;
        border-right: 1px solid #d1d2d9 !important;
        border-left: 1px solid #d1d2d9 !important
    }

.ui-menu .ui-menu-item .search-combobox:hover {
    background: #0088cc !important;
    color: white !important
}

.radio-button-leff input[type=radio] {
    line-height: 10px
}

.search-img-user i {
    position: absolute;
    left: 10px;
    top: 9px
}

.search-img-user input {
    padding-right: 40px
}

.search-img-user .col-md-12 {
    padding-bottom: 15px;
    padding-left: 0;
    padding-right: 0px !important
}

.btn-active-user {
    padding-bottom: 15px;
    padding-left: 10px
}

.btn-outline-info {
    color: #17a2b8;
    background: transparent;
    background-image: none;
    border-color: #17a2b8;
    font-weight: 700;
    height: 35px;
    margin: 0 18px 0 0
}

.tr-info, .tr-info button {
    background: #d2f0ef !important
}

.btn-oranges {
    background: var(--color-button)
}

    .btn-oranges:hover {
        background: var(--color-button-hover)
    }

.Content-hsnv {
    float: left;
    width: calc(100% - 200px)
}

.img-hsnv {
    width: 180px;
    height: 180px;
    float: left;
    padding-left: 15px
}

    .img-hsnv img {
        width: 100%;
        height: 100%
    }

.print-hsnv .tab-col-12 h4 {
    padding: 15px;
    background: var(--color-filter-left) !important
}

.hsnv-table tr td {
    border: 1px solid #ccc !important
}

.hsnv-table thead tr {
    background: var(--table-footer) !important
}

.print-hsnv h3, .print-hsnv h4 {
    font-weight: 700
}

.hsnv-detail tr td {
    font-size: 13px
}

.tr-title {
    width: 8%
}

.tr-value {
    width: 25.33%
}

.Content-hsnv h4 {
    font-weight: 400
}

.print-hsnv .tab-col-12 {
    padding: 20px 0 0 0px !important
}

.table-not-border tbody tr td {
    border: none !important
}

.table-not-border tbody tr:hover td, .table-not-border tbody tr:hover td button {
    background: none !important
}

.btn-user-active {
    background: #32b7b3 !important;
    color: white !important;
    border-color: #32b7b3
}

.btn-outline-info:hover {
    background: #17a2b8 !important;
    color: white !important
}

.table-img-user .fa-times {
    color: red
}

.group-list-img-user li .img-bill {
    height: 70px;
    padding-top: 0px !important
}

.group-list-img-user li .name-menu {
    position: initial !important
}

.possible-table-tab {
    position: sticky;
    top: 50px
}

.content-left-sections {
    width: 100%;
    border: 1px solid #ccc;
    float: left;
    margin-bottom: 25px
}

.tab-dashboard {
    width: 100%;
    float: left
}

.content-left-sections h2 {
    padding-left: 40px;
    font-weight: 700;
    font-size: 16px
}

.dashBoard-tab2-statistic, .dashBoard-tab4-statistic {
    width: 50%;
    margin-top: 15px;
    margin-bottom: 15px;
    float: left
}

.dashBoard-room {
    font-size: 22px;
    font-weight: 700;
    height: 90px;
    color: #fff;
    background: #32b7b3;
    border-radius: 4px
}

.dashBoard-room-detal p {
    padding: 0;
    margin: 0;
    line-height: 30px
}

.dashBoard-room-content {
    font-size: 16px;
    padding: 10px 15px 0 30px
}

    .dashBoard-room-content p span {
        font-weight: 700;
        font-size: 24px;
        padding: 0px !important
    }

.dashBoard-room-detal {
    margin-left: 70px;
    padding-top: 13px;
    padding-bottom: 17px
}

.dashBoard-room .dashBoard-room-detal:before {
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    bottom: 0;
    left: 15px;
    font-size: 55px;
    top: 5px;
    content: '\f015';
    color: #fff
}

.title-img {
    width: 80px;
    height: 80px;
    position: absolute
}

.dashBoard-detail {
    padding-left: 160px;
    font-size: 16px
}

    .dashBoard-detail .form-group label {
        float: left;
        line-height: 30px;
        width: 100px;
        font-weight: 500
    }

.dashBoard-room-content .form-group label {
    font-weight: 500;
    float: left;
    line-height: 30px;
    width: 100px
}

.dashBoard-room-content .form-dashboard p {
    text-align: right;
    font-weight: 700;
    font-size: 30px;
    padding: 0px !important
}

.dashBoard-room-center {
    font-size: 16px;
    padding: 10px 15px 0 0;
    border-right: 1px solid #ccc
}

.dashBoard-room-content .form-group {
    margin-bottom: 4px
}

.form-dashboard img {
    position: relative !important;
    top: 0;
    margin-left: 10px
}

.form-dashboard {
    width: calc(100% - 100px);
    font-weight: 400;
    float: left;
    line-height: 30px
}

.dashBoard-tab2-statistic h3 {
    font-weight: 700;
    padding-bottom: 15px;
    font-size: 16px
}

.dashBoard-detail .form-dashboard p {
    text-align: right;
    font-weight: 700;
    font-size: 30px;
    padding: 0px !important
}

.dashBoard-right .dashBoard-detail .form-dashboard p span {
    color: #f9b632
}

.dashBoard-left .dashBoard-detail .form-dashboard p span {
    color: #0081d2
}

.dashBoard-right {
    padding-left: 40px
}

.dashBoard-left {
    border-right: 1px solid #ccc;
    padding-left: 40px
}

.print-hsnv .hsnv-table td {
    white-space: inherit !important
}

.margin-page {
    padding-left: 0;
    padding-right: 6px
}

.content-table .col-md-12.margin-page {
    padding: 0;
}

.tab-content-stacked {
    width: calc(100% - 200px) !important;
    float: left !important
}

.nav-stacked > li {
    border: 1px solid #ccc
}

.a-edit {
    padding: 6px 12px !important
}

.tree-checked-ul li {
    padding-bottom: 5px
}

    .tree-checked-ul li label {
        float: left;
        padding-left: 5px;
        width: calc(100% - 15px);
        line-height: 18px
    }

.checked-content label {
    float: left;
    padding-left: 15px;
    width: calc(100% - 15px)
}

.nav-pills > li > a {
    border-radius: 0px !important;
    color: #000;
    padding: 3px 7px;
    line-height: 24px;
}

.nav-pills > li:hover a, .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #000;
    background: var(--color-table) !important
}

.tab-nav-pills {
    padding-top: 15px
}

.don-vi-tinh button {
    background: no-repeat
}

.don-vi-tinh ul {
    min-width: 120px
}

    .don-vi-tinh ul li {
        padding: 0px !important
    }

.quy-cach-edit-left {
    float: left;
    margin-top: 10px;
    font-size: 16px
}

.quy-cach-edit-right {
    float: right;
    color: #cdcd22;
    font-size: 16px;
    margin-top: 10px
}

.combobox-tree-filter {
    max-height: 250px;
    overflow-y: auto
}

.call-quy-cach {
    display: none;
    position: absolute;
    top: 46px;
    padding: 10px;
    border: 1px solid var(--color-primary) !important;
    background: #fff;
    z-index: 2;
    width: 266px;
    left: 245px;
    top: 32px
}

    .call-quy-cach .callprice-right input {
        width: 100% !important;
        border: none;
        border-bottom: 1px solid #ccc !important;
        line-height: 29px;
        width: 100%;
        outline: none
    }

    .call-quy-cach:before {
        border-bottom: 10px solid var(--color-primary);
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        top: -17px !important;
        right: 20px;
        margin: 0;
        border-top: 7px solid transparent;
        content: '';
        position: absolute;
        width: 0;
        height: 0
    }

.edit-td {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-radius: 0;
    text-align: right
}

.center-rowspan {
    vertical-align: middle !important;
    text-align: center
}

.magin-top-15 {
    margin-top: 15px
}

.magin-15 {
    margin-top: 15px;
    margin-bottom: 15px
}

.img-active-sms {
    width: 330px;
    height: 310px;
    border-radius: 10px;
    margin: auto;
    border: 2px solid var(--color-primary);
    box-shadow: 0 0 20px 3px #74a3b1
}

.img-active-zalo {
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-direction: column;
    width: 330px;
    height: 310px;
    border-radius: 10px;
    margin: auto;
    border: 2px solid var(--color-primary);
    box-shadow: 0 0 20px 3px #74a3b1
}

    .img-active-zalo img {
        width: 65%;
    }

    .img-active-zalo p a {
        padding: 10px;
        background: var(--color-main);
        color: #fff;
        font-weight: 700;
        font-size: 1rem;
        line-height: 0;
    }

.note-discount-money {
    margin-top: -60px
}

.ul-tree-location {
    width: 100%;
    max-height: 350px;
    overflow: scroll
}

    .ul-tree-location li {
        width: 165px;
        float: left;
        height: 150px;
        margin: 10px
    }

        .ul-tree-location li .time-zone {
            text-align: center
        }

            .ul-tree-location li .time-zone span {
                padding: 5px 15px 5px 15px;
                text-align: center;
                border-radius: 20px;
                border-radius: 20px;
                font-weight: 700
            }

        .ul-tree-location li .location-img {
            width: 80px;
            margin: auto
        }

        .ul-tree-location li .location-user {
            text-align: center
        }

            .ul-tree-location li .location-user i {
                margin-right: 5px;
                color: #b1dfec;
                font-size: 15px
            }

        .ul-tree-location li .location-work {
            font-weight: 700;
            font-size: 1rem;
            text-align: center
        }

.huy-kich-hoat {
    font-size: 1rem;
    padding: 10px;
    color: #fff;
    background: #b80a0a;
    font-weight: 700;
    float: right !important;
    top: 0;
    height: 34px;
    padding: 9px;
    line-height: 18px;
}

.nopadding-right {
    padding-right: 0px !important
}

.nopadding-left {
    padding-left: 0px !important
}

.huy-kich-hoat i {
    margin-right: 5px
}

.huy-kich-hoat:hover {
    color: #fff
}

.element {
    animation-name: stretch;
    animation-duration: 1s;
    animation-timing-function: ease-out;
    animation-delay: 1s;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-play-state: running
}

@keyframes stretch {
    0% {
        transform: scale(.9)
    }

    100% {
        transform: scale(1.07)
    }
}

.img-active-sms img {
    width: 100%;
    height: 90%
}

.img-active-sms p {
    text-align: center
}

    .img-active-sms p a {
        padding: 15px;
        background: var(--color-main);
        color: #fff;
        font-weight: 700;
        font-size: 1rem;
        line-height: 0;
        z-index: 999
    }

.loader-padding {
    position: absolute;
    top: 0;
    border: 5px solid var(--hover-loadding);
    border-radius: 50%;
    border-top: 5px solid var(--color-primary);
    width: 60px;
    height: 60px;
    z-index: 9999;
    -webkit-animation: spin 0.5s linear infinite;
    animation: spin 0.5s linear infinite
}

.ac td {
    background: white !important
}

.table-hover-news thead tr th {
    border-bottom: 0px !important
}

.table-hover-news tr td {
    border-top: 1px solid #e6e6e6
}

.arrow-left-news {
    width: auto;
    left: -96px
}

    .arrow-left-news .price_2 input {
        width: 70px
    }

.btn-group-toolbar {
    WIDTH: auto !important;
    float: left;
    height: auto !important;
    padding: 15px 30px;
    margin-bottom: 5px;
    border-radius: 4px
}

.product-immage {
    width: 200px;
    float: left
}

.product-view-detail {
    width: calc(100% - 200px);
    float: left
}

.tab-news-modal .nav-tabs li:hover a {
    background: #fff
}

div.hsnv-word {
    page: printword
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.grocery .bill-bxslide-news ul li {
    width: 100px;
    text-align: left;
    padding-left: 7px;
    color: #fff;
    background: #d6d6d6;
    height: 35px;
    border: 1px solid #d6d6d6
}

.bill-bxslide-news ul li.using {
    border-bottom: none !important;
    text-decoration: none;
    height: 35px;
    font-weight: 700;
    color: white !important;
    background: var(--color-main);
    z-index: 999;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.w701 .bill-bxslide-news ul li span {
    color: #fff
}

.add-tab-ban-le {
    border: 0px !important;
    background: #ebebeb !important
}

    .add-tab-ban-le a {
        height: 30px;
        background: #ebebeb !important
    }

        .add-tab-ban-le a:hover {
            border: 1px solid var(--color-primary) !important
        }

            .add-tab-ban-le a:hover i {
                color: var(--color-main) !important
            }

.tien-goi-y {
    width: 100%;
    border: 1px solid #fff;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 15px;
    float: left;
    position: relative
}

    .tien-goi-y ul {
        width: 100%
    }

        .tien-goi-y ul li a {
            color: #000
        }

        .tien-goi-y ul li {
            background: #fff;
            border-radius: 4px;
            padding: 10px;
            width: 110px;
            margin-right: 10px;
            float: left;
            text-align: center
        }

    .tien-goi-y:before {
        content: '\f0d7';
        font-family: 'Font Awesome 5 Pro';
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        color: #fff;
        font-size: 40px;
        position: absolute;
        top: 46px;
        right: 38px
    }

.list-unstyled {
    padding-left: 0;
    list-style: none
}

ul.timeline li {
    position: relative;
    border-bottom: 1px solid #e8e8e8;
    clear: both
}

.timeline .block {
    margin: 0 0 0 105px;
    border-left: 3px solid #e8e8e8;
    overflow: visible;
    padding: 10px 15px
}

.timeline .tags {
    position: absolute;
    top: 15px;
    left: 0;
    width: 84px;
    background: #1abb9c
}

.timeline a span {
    color: #fff
}

.timeline .tag {
    display: block;
    height: 30px;
    font-size: 1rem;
    padding: 8px
}

    .timeline .tag span {
        display: block;
        overflow: hidden;
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis
    }

.tag:after {
    content: ' ';
    height: 30px;
    width: 0;
    position: absolute;
    left: 100%;
    top: 0;
    margin: 0;
    pointer-events: none;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 11px solid #1ABB9C
}

.timeline h2.title {
    position: relative;
    font-size: 1rem;
    margin: 0
}

    .timeline h2.title .fa-arrow-down {
        color: #1abb9c
    }

    .timeline h2.title .fa-arrow-up {
        color: #de750d
    }

    .timeline h2.title:before {
        content: '';
        position: absolute;
        left: -23px;
        top: 3px;
        display: block;
        width: 14px;
        height: 14px;
        border: 3px solid #d2d3d2;
        border-radius: 14px;
        background: #f9f9f9
    }

.timeline .byline {
    padding: .25em 0
}

.byline {
    font-size: 1rem;
    line-height: 1.3
}

.profile-title {
    margin-left: 30px;
    padding-bottom: 15px;
    margin-right: 30px;
    background: var(--color-title-edit);
    font-size: 16px;
    color: #000;
    font-weight: 700;
    padding: 15px
}

.profile-tabs-header li {
    width: auto;
    float: left;
    margin-right: 30px
}

    .profile-tabs-header li:last-child {
        margin: 0
    }

.profile-tabs .profile-tabs-header {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--color-primary)
}

    .profile-tabs .profile-tabs-header li a {
        border: 1px solid var(--color-primary)
    }

        .profile-tabs-header > li.active > a, .profile-tabs-header > li.active > a:hover, .profile-tabs-header > li.active > a:focus, .profile-tabs .profile-tabs-header li a:hover {
            background: var(--color-main);
            color: #fff
        }

.profile-tabs-header > li.active {
    border: none
}

.profile-content-tab {
    padding-top: 15px;
    padding-bottom: 15px
}

.profile-left {
    width: 310px;
    float: left
}

.profile-right {
    width: calc(100% - 310px);
    float: left
}

.profile-left .profile-left-img {
    width: 280px;
    height: 250px;
    margin: auto;
    border-radius: 5px
}

    .profile-left .profile-left-img img {
        width: 100%;
        height: 100%;
        border-radius: 4px
    }

.profile-left p {
    font-size: 13px
}

.profile-left h4 {
    color: #000;
    font-weight: 700;
    font-size: 16px
}

.profile-left p i {
    margin-right: 5px
}

.p-label {
    background: var(--color-main);
    padding: 5px;
    color: #fff;
    padding-left: 20px
}

    .p-label:after {
        content: ' ';
        width: 0;
        position: absolute;
        left: 100%;
        top: 0;
        margin: 0;
        pointer-events: none;
        border-top: 13px solid transparent;
        border-bottom: 15px solid transparent;
        border-left: 13px solid var(--color-primary)
    }

    .p-label:before {
        content: ' ';
        width: 0;
        position: absolute;
        left: 0;
        top: 0;
        margin: 0;
        pointer-events: none;
        border-top: 13px solid transparent;
        border-bottom: 15px solid transparent;
        border-left: 12px solid #fff
    }

.btn-gray {
    color: var(--color-button-hover)
}

    .btn-gray:hover {
        color: #0097c4
    }

.grocery-newss li:hover .list-price input, .grocery-newss li:hover .list-totle-price input, .grocery-newss li:hover .munber-bill, .grocery-newss li:hover .note-out input, .grocery-newss .bill-listchoose li:hover, .grocery-newss .bill-listchoose li:hover .price-fist, .grocery-newss .bill-listchoose ul li:nth-child(odd):hover, .grocery-newss .bill-listchoose li:hover .price-fist, .grocery-newss .bill-listchoose ul li:nth-child(odd):hover .note-out input {
    background: none !important
}

.margin-bot-15 {
    margin-bottom: 15px
}

.table-reponsive table tr td {
    font-size: 1rem
}

.table-split-td tr td {
    max-width: 280px;
    text-overflow: ellipsis;
    overflow: hidden
}

.input-span span {
    position: absolute;
    top: 0;
    right: 0;
    color: #000;
    width: 40px;
    height: 30px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    line-height: 30px;
    background: #ccc;
    text-align: center;
    font-size: 1rem
}

.input-span input {
    padding-right: 40px
}

.print-page-custom ul li {
    width: 100%;
    padding-bottom: 15px
}

.print-page-custom .print-img {
    float: left;
    width: 65px;
    height: 52px;
    border: 1px solid var(--color-primary);
    padding: 0
}

.print-page-custom .print-title {
    padding-left: 90px
}

.print-page-custom .print-link {
    padding-left: 90px
}

    .print-page-custom .print-link a {
        margin-left: 0;
        margin-top: 5px;
        height: 30px;
        line-height: 30px
    }

        .print-page-custom .print-link a:hover {
            color: #fff
        }

.select-kieu-in, .select-mau-in {
    width: 130px;
    margin-right: 15px;
    float: left
}

.list-select-print {
    width: 100%;
    float: left
}

.select-an-hien-mau-in {
    width: 150px;
    float: right
}

.select-ban-gia-in {
    width: calc(100% - 150px);
    float: left;
    padding-right: 30px
}

    .select-ban-gia-in .attention-b {
        margin-top: 0;
        padding-bottom: 30px
    }

.txtI {
    font-style: italic;
    font-size: 1rem
}

.table-thuoc-tinh-hh tr td {
    position: relative
}

.input-100 {
    width: 100%;
    float: left
}

.table-thuoc-tinh-hh table {
    width: 100% !important
}

.table-thuoc-tinh-hh {
    overflow: unset
}

.form-check-left label {
    margin-left: 0;
    white-space: initial;
    float: unset;
}

.table-not-hover tbody tr, .table-not-hover tbody tr td {
    background: #fff
}

    .table-not-hover tbody tr td:hover, .table-not-hover tbody tr:hover td {
        background: inherit
    }

.color-main {
    color: var(--color-main)
}

.td-check {
    color: var(--color-main)
}

.td-check-disabled {
    color: #ccc
}

.border-radius {
    border-radius: 4px !important
}

.btn-absolute {
    position: absolute;
    top: 0;
    height: 32px;
    right: 0
}

.btn-absolute-edit {
    position: absolute;
    top: 0;
    height: 32px;
    right: 40px
}

.choose-person-tt-hh ul li {
    height: 28px
}

.w30-bill-kitchen .bill-bxslide {
    padding-left: 9px
}

    .w30-bill-kitchen .bill-bxslide ul li {
        background: #d6d6d6;
        border: 1px solid #d6d6d6;
        color: #fff;
        height: 35px
    }

        .w30-bill-kitchen .bill-bxslide ul li.using {
            background: var(--color-main)
        }

.w70-bill-kitchen .tab-inner2 ul li a {
    background: #d6d6d6;
    border: 1px solid #d6d6d6;
    color: white !important;
    height: 35px
}

.w70-bill-kitchen .tab-inner2 ul li:hover a {
    background: #d6d6d6;
    border: 1px solid #d6d6d6;
    color: white !important
}

.w30-bill-kitchen .angle-left, .w30-bill-kitchen .angle-right {
    height: 35px;
    width: 15px;
    float: left
}

    .w30-bill-kitchen .angle-left i, .w30-bill-kitchen .angle-right i {
        color: var(--color-main);
        font-size: 20px;
        line-height: 30px
    }

.btn-hover-edit {
    position: sticky !important;
    right: 5px;
    display: none
}

    .btn-hover-edit a i {
        font-size: 19px;
        margin-right: 2px
    }

.form-work label {
    width: 75px;
    float: left
}

.form-work .label-small {
    width: 40px
}

.form-work .form-news {
    width: calc(100% - 75px);
    float: left
}

.form-work .form-news-small {
    width: calc(100% - 40px);
    float: left
}

.table-hover-news .btn-hover-edit a:hover i {
    background: #d1d2d9;
    text-align: center;
    border-radius: 20px;
    color: #000
}

.table-hover-news tr:hover td {
    background: #fff
}

.table-hover-news .btn-hover-edit a i {
    line-height: 33px;
    height: 32px;
    width: 35px;
    text-align: center
}

.btn-hover-edit {
    padding: 0px !important
}

.list-button-quy-cach {
    position: relative
}

    .list-button-quy-cach .call-quy-cach {
        left: -230px !important
    }

.dropdown-menu-news li {
    border-bottom: 1px dotted #fff;
    width: 100%;
    background: var(--color-main)
}

    .dropdown-menu-news li:last-child {
        border-bottom: none
    }

.dropdown-menu-news {
    border: 1px solid #fff;
    background: var(--color-main)
}

    .dropdown-menu-news li a {
        color: #fff
    }

    .dropdown-menu-news li:hover a {
        color: white !important;
        background: var(--color-main)
    }

.not-border {
    border: 0px !important
}

.btn-group-button {
    padding-top: 20px;
    margin-bottom: 20px;
    text-align: right;
    width: 100%;
    float: left
}

.form-check-left {
    position: relative
}

.vertical-center {
    vertical-align: middle !important;
    background: white !important
}

.thead-boder tr th {
    border: 1px solid white !important;
    border-top: none !important;
    padding: 10px;
    text-align: center
}

.bg-tfoot {
    background: #e9eaf2
}

.wd-colspan {
    width: 20px
}

.td-bold {
    font-weight: 700
}

.form-news-input-add .outselect {
    padding-right: 38px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.form-news-input-add .input-group-btn {
    width: 40px;
    float: left;
    position: absolute;
    right: 0
}

    .form-news-input-add .input-group-btn i {
        font-size: 16px !important
    }

.sp-sl {
    padding: 5px 25px 5px 5px;
    background: #b2dfed;
    position: relative;
    margin: 1px;
    float: left
}

    .sp-sl a {
        position: absolute;
        top: 0;
        right: 5px;
        color: red
    }

.number-price-new {
    border: none;
    border-bottom: 1px solid #ccc;
    transition: none;
    box-shadow: none;
    border-radius: 0
}

    .number-price-new:focus, .number-price-new:active {
        outline: none !important;
        box-shadow: none
    }

.form-check-new .form-check-input {
    position: relative
}

    .form-check-new .form-check-input:after {
        content: '\f10c';
        font-family: 'Font Awesome 5 Pro';
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        color: #999;
        font-size: 17px;
        position: absolute;
        top: -7px;
        left: -1px;
        background: #fff
    }

    .form-check-new .form-check-input:checked:after {
        content: '\f192';
        font-family: 'Font Awesome 5 Pro';
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        color: var(--color-main);
        font-size: 17px;
        position: absolute;
        top: -7px;
        left: -1px;
        background: #fff
    }

.popup-chiet-khau .callprice-discount {
    width: 360px;
    border-radius: 4px;
    left: -130px;
    font-size: 1rem
}

.popup-chiet-khau .callprice::after {
    right: 97px
}

.popup-chiet-khau .callprice::before {
    right: 95px
}

.popup-chiet-khau .remove-popup {
    height: 30px;
    font-size: 18px;
    color: #ccc !important
}

.popup-chiet-khau ._form-chiet-khau span {
    width: 80px;
    float: left;
    line-height: 38px
}

.popup-chiet-khau ._form-chiet-khau input {
    width: calc(100% - 80px);
    border-bottom: 1px solid var(--color-primary)
}

.popup-chiet-khau .form-check label {
    font-weight: 400
}

.input-search-filter-full input {
    width: calc(100% - 36px);
    float: left
}

.input-search-filter-full .btn-search-icon {
    margin-right: 0
}

    .input-search-filter-full .btn-search-icon i {
        right: 10px
    }

.profile-r-name {
    width: 33%;
    float: left
}

.profile-r-tab {
    width: 67%;
    float: right
}

.p-l-not-active {
    background: var(--color-table) !important;
    color: black !important
}

    .p-l-not-active:after {
        border-top: 13px solid transparent;
        border-bottom: 15px solid transparent;
        border-left: 13px solid var(--color-table)
    }

.ac-remove-border {
    border: none
}

.ac-border {
    border-top: 1px solid var(--color-primary) !important;
    border-left: 1px solid var(--color-primary) !important;
    border-bottom: 1px solid var(--color-primary) !important
}

.ac-view-border td {
    border-top: 1px solid var(--color-primary) !important
}

.ac-view-border {
    border-left: 1px solid var(--color-primary) !important
}

.tree-phong-ban ul li p {
    width: 100%;
    padding-left: 15px
}

    .tree-phong-ban ul li p a {
        position: absolute;
        top: 5px;
        right: 5px;
        display: none
    }

        .tree-phong-ban ul li p a .fa-pencil-square-o {
            font-size: 16px
        }

.tree-phong-ban ul {
    margin-left: 5px
}

._ghi-chu-nhap-hang {
    width: 100%;
    float: left;
    margin-top: 5px
}

.is-show {
    display: block !important;
    max-width: 570px
}

.is-hide {
    display: none !important
}

.header-filter-layout {
    max-height: 260px;
    overflow: auto
}

.tablescroll {
    max-height: 450px;
    overflow: auto
}

.profile-total {
    width: 500px;
    padding-top: 15px;
    overflow: auto
}

    .profile-total .p-p-total label {
        font-weight: 700;
        width: 160px;
        font-size: 1rem;
        float: left
    }

    .profile-total .p-p-total div {
        width: calc(100% - 160px);
        font-size: 1rem;
        text-align: right
    }

    .profile-total .p-p-total {
        margin-bottom: 15px
    }

.d-chiet-khau-khoang {
    width: 100%;
    float: left
}

    .d-chiet-khau-khoang .ip-ck-tu {
        width: 70px;
        padding: 4px !important;
        float: left
    }

    .d-chiet-khau-khoang .ip-ck-den {
        width: 70px;
        padding: 4px !important;
        float: left
    }

    .d-chiet-khau-khoang span {
        width: 14px;
        float: left;
        padding-left: 5px;
        line-height: 30px
    }

.phan-tram-ck {
    width: 35px;
    height: 30px;
    float: right
}

    .phan-tram-ck .toogle {
        width: 35px;
        height: 23px;
        float: right;
        margin-top: 4px
    }

        .phan-tram-ck .toogle:before {
            transition: all 0.3s ease;
            width: 26px;
            height: 23px;
            top: 0;
            margin-top: 0;
            background: var(--color-main);
            left: -2px
        }

    .phan-tram-ck .poison {
        left: 0;
        font-size: 1rem !important;
        font-weight: 400;
        color: #fff;
        line-height: 25px !important
    }

    .phan-tram-ck .transverse {
        right: 9px;
        color: #fff;
        line-height: 26px !important;
        font-size: 9px !important;
        display: none
    }

    .phan-tram-ck .toogle.active-ck:before {
        left: 13px
    }

.active-ck .poison {
    display: none
}

.active-ck .transverse {
    display: block !important
}

.d-tk-khoang {
    width: 100%;
    float: left
}

    .d-tk-khoang .ip-ck-tu {
        width: 90px;
        float: left
    }

    .d-tk-khoang .ip-ck-den {
        width: 90px;
        float: left
    }

    .d-tk-khoang span {
        width: 20px;
        float: left;
        padding-left: 8px;
        line-height: 30px
    }

.div-col .form-group {
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px
}

.form-price .form-news {
    text-align: right
}

.sp-ck {
    color: #999;
    width: 50px;
    float: left
}

.form-sp-ck .div-form-text-ck {
    width: calc(100% - 50px);
    float: left
}

.header-filter .left-filter {
    width: 70%;
    float: left
}

.header-filter .right-filter {
    width: 30%;
    float: left
}

    .header-filter .right-filter input {
        width: 85%
    }

.tab-mr-header-l {
    width: 140px;
    float: left
}

.tab-mr-header-r {
    width: calc(100% - 140px);
    float: left
}

.tab-mr-header-l ul {
    padding: 0px !important;
    margin: 0;
    width: 100%;
    border-right: 1px solid var(--color-primary) !important
}

    .tab-mr-header-l ul li {
        width: 100%;
        float: left;
        padding: 0;
        padding-bottom: 10px;
        margin-left: 0
    }

        .tab-mr-header-l ul li a {
            text-align: center;
            border: none;
            background: #e6e7e8;
            padding: 15px
        }

        .tab-mr-header-l ul li.active a, .tab-mr-header-l ul li.active a:focus {
            background: white !important;
            color: var(--color-main) !important;
            border: 1px solid var(--color-primary);
            border-right: 5px solid var(--color-primary)
        }

.list-button {
    width: 550px;
    float: left
}

    .list-button button {
        width: 130px;
        float: left;
        margin: 5px;
        text-align: center;
        height: 35px !important;
        margin-top: 2px;
        margin-bottom: 18px;
        padding: 0px !important;
        background: #e6e7e8;
        border: none;
        box-shadow: none
    }

        .list-button button.btn-add-new {
            width: 120px;
            background: #eb4a24;
            border-radius: 4px
        }

        .list-button button:first-child {
            margin-left: 0
        }

        .list-button button.active {
            border: 1px solid var(--color-primary);
            color: var(--color-main) !important;
            background: #fff
        }

.input-date-hide {
    width: 140px !important;
    z-index: 0;
    height: 35px !important;
    float: left;
    border: 1px solid #e6e7e8;
    background: #e6e7e8;
    padding: 3px;
    box-shadow: none;
    margin: 2px
}

.list-button .input-date-hide.active {
    border: 1px solid var(--color-primary);
    color: var(--color-main) !important;
    background: #fff
}

.tab-mr-content .list-title {
    width: calc(100% - 550px);
    float: left
}

    .tab-mr-content .list-title ._title-so-du-r {
        width: 550px;
        float: right;
        border-radius: 4px;
        border: 1px solid var(--color-primary);
        height: 40px
    }

._title-so-du-r .lb-title1, ._title-so-du-r .lb-title2 {
    width: 210px;
    float: left;
    padding-top: 11px;
    padding-left: 15px
}

.lb-title1 {
    margin-right: 15px
}

    .lb-title1 label {
        width: 100px;
        float: left;
        font-weight: 300
    }

.lb-title2 label {
    width: 75px;
    float: left;
    font-weight: 300
}

.lb-title2 div, .lb-title1 div {
    font-weight: 700
}

._title-so-du-r button {
    border-radius: 4px;
    margin-top: 4px
}

.form-width-btn-add button {
    position: absolute;
    top: 0
}

.form-width-btn-add input {
    padding-right: 40px
}

.form-check-modal input {
    float: left;
    width: 0;
    margin-right: 5px
}

.form-check-modal label {
    line-height: 25px !important
}

.tr-title td h5 {
    color: var(--color-main);
    font-weight: 700;
    margin-bottom: 0
}

.tfoot-tong tr td {
    background: var(--color-table) !important;
    color: #000;
    font-weight: 700
}

.checkbox-modal:after {
    content: none !important
}

.checkbox-modal:checked:after {
    content: none !important
}

.checkbox-modal:before {
    content: '\f096';
    font-family: 'Font Awesome 5 Pro';
    background: #fff;
    font-size: 18px;
    color: #777
}

.checkbox-modal:checked:before {
    content: '\f046';
    font-family: 'Font Awesome 5 Pro';
    background: #fff;
    font-size: 18px;
    color: var(--color-main)
}

.type-chiet-khau {
    position: relative;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px
}

.chi-tiet-hoa-hong {
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px
}

.type-chiet-khau:after, .type-chiet-khau:before {
    content: '\f0de';
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    font-weight: 400;
    text-decoration: inherit;
    color: #fff;
    font-size: 24px;
    position: absolute;
    top: -14px;
    left: 21px;
    height: 5px
}

.type-chiet-khau:before {
    color: #ccc;
    top: -15px;
}

.nav-news > li.active > a, .nav-news > li.active > a:hover, .nav-news > li.active > a:focus {
    font-weight: 700;
    color: var(--color-main);
    background: #fff;
    border: 1px solid var(--color-primary);
    border-bottom: none !important;
    border-radius: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin-bottom: 1px
}

.nav-news > li > a {
    color: #000;
    font-weight: 700;
    border-radius: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border: 1px solid #e6e6e6;
    background: #f5f5f5
}

.nav-news > li:hover a {
    color: #000;
    background: #fff
}

.title-table-ck {
    padding: 8px;
    background: var(--color-table);
    font-weight: 700;
    margin-bottom: 0
}

    .title-table-ck .checkbox-modal:checked:before, .title-table-ck .checkbox-modal:before {
        background: var(--color-table);
        color: var(--color-main)
    }

.btn-chon-nhan-vien div {
    width: 100%;
    padding: 8px;
    color: #fff;
    background: var(--color-main);
    margin-bottom: 15px;
    text-align: center;
    font-weight: 700
}

    .btn-chon-nhan-vien div i {
        margin-right: 5px;
        margin-left: 5px
    }

.ul-cai-dat-hoa-hong-r li:hover a, .ul-nhan-vien-ap-dung li:hover a {
    color: var(--color-main)
}

.ul-nhan-vien-ap-dung li a {
    position: absolute;
    top: 8px;
    font-size: 20px;
    left: 4px;
    color: #ccc
}

.modal-1024 {
    width: 1024px
}

.dasb-head-filter {
    width: 300px;
    float: left;
    position: relative;
    display: none
}

    .dasb-head-filter i {
        position: absolute;
        top: 8px;
        right: 10px;
        color: #ccc;
        font-size: 13px
    }

    .dasb-head-filter input {
        padding-right: 30px
    }

.dasb-head-add-fast {
    width: 130px;
    float: right;
    position: relative;
    margin-left: 15px
}

    .dasb-head-add-fast i {
        position: absolute;
        right: 10px;
        top: 8px;
        font-size: 16px;
        color: #999
    }

.dasb-header {
    padding-top: 15px;
    padding-bottom: 10px
}

.dasb-head-add-fast .selec-person ul {
    max-height: 100%
}

    .dasb-head-add-fast .selec-person ul li {
        background: #fff
    }

        .dasb-head-add-fast .selec-person ul li:hover a {
            color: #ff4d71 !important
        }

        .dasb-head-add-fast .selec-person ul li:hover {
            background: white !important
        }

.dasb-birtday-now {
    margin-bottom: 15px;
    padding-bottom: 15px;
    background: #fff
}

.dasb-list-work ul li i {
    width: 30px;
    font-size: 17px;
    float: left
}

.dasb-list-work ul li div.dasb-li-text {
    font-size: 1rem;
    width: calc(100% - 30px);
    float: left
}

.dasb-list-work ul li div {
    font-size: 1rem
}

.dasb-list-work ul li {
    position: relative;
    border: none;
    width: 100%
}

    .dasb-list-work ul li div.dasb-li-text a {
        width: 30px;
        font-size: 1rem;
        text-decoration: underline;
        float: right
    }

    .dasb-list-work ul li i.fa-birthday-cake {
        color: #ff4d71
    }

    .dasb-list-work ul li i.fa-cubes {
        color: #1bb0a6
    }

    .dasb-list-work ul li i.fa-calendar-check-o {
        color: #ef6c00
    }

.dasb-list-work ul {
    width: 100%;
    float: left;
    padding-left: 30px;
    padding-right: 30px
}

.dash-btn-group-head i {
    position: relative;
    top: 1px;
    color: #fff;
    left: -2px;
    font-size: 13px
}

.dash-btn-group-head .dropdown-menu {
    z-index: 99;
    margin-left: -30px !important
}

    .dash-btn-group-head .dropdown-menu li a {
        color: #333
    }

    .dash-btn-group-head .dropdown-menu li {
        background: white !important;
        border-bottom: 1px dotted #ccc
    }

        .dash-btn-group-head .dropdown-menu li:last-child {
            border-bottom: none
        }

        .dash-btn-group-head .dropdown-menu li:hover a {
            color: #ff4d71
        }

.dash-btn-group-head button {
    margin-left: 0;
    background: #ff4d71
}

    .dash-btn-group-head button:hover {
        background: #e8264d !important
    }

.form-modal-send-sms .form-group label {
    width: 180px
}

.form-modal-send-sms .form-group .form-news {
    width: calc(100% - 180px)
}

.form-modal-send-sms {
    margin-bottom: 30px
}

.outselectmodalsms ul li.li-input-span {
    float: left;
    margin: 2px
}

.outselectmodalsms .choose-person {
    max-height: 250px
}

.outselectmodalsms ul li.li-input-span .fa-times {
    color: red
}

._date-birday .calendar.left .daterangepicker_input, ._date-birday .calendar.right .daterangepicker_input, ._date-birday .calendar.left .calendar-table table thead tr th select.yearselect, ._date-birday .calendar.right .calendar-table table thead tr th select.yearselect, ._date-birday .calendar.right .calendar-table table thead tr th.next i, ._date-birday .calendar.right .calendar-table table thead tr th.prevRight i, ._date-birday .calendar.left .calendar-table table thead tr th.nextleft i, ._date-birday .calendar.left .calendar-table table thead tr th.prev i {
    display: none !important
}

._date-birday .calendar.left .calendar-table table thead tr th select.monthselect, ._date-birday .calendar.right .calendar-table table thead tr th select.monthselect {
    width: 100%
}

.btn-send-sms {
    background: #0097c4
}

    .btn-send-sms:hover {
        background: #0182a9
    }

.form-chi-tiet-cv .uu-tien-tat-ca {
    width: 45px;
    border-radius: 4px;
    background: #0097c4;
    height: 20px
}

.overview-heading-mobile {
    display: none
}

.main-menu-mobile {
    display: none
}

.drop-filter-chart {
    width: 180px;
    margin-right: 10px;
    z-index: 99
}

    .drop-filter-chart .drop-text i {
        position: absolute;
        top: 3px;
        right: 0
    }

    .drop-filter-chart .selec-person {
        border-top: 1px solid #ccc
    }

    .drop-filter-chart .drop-text div {
        text-align: right;
        padding-right: 15px
    }

    .drop-filter-chart .selec-person ul li a {
        font-weight: 400
    }

.dasb-select-ul li a {
    padding-left: 5px
}

.list-radio-work li {
    width: auto;
    float: left;
    padding-right: 15px
}

    .list-radio-work li label {
        width: auto !important;
        padding-right: 10px;
        font-weight: 100 !important
    }

    .list-radio-work li input[type=radio]:after {
        content: none !important
    }

    .list-radio-work li input[type=radio]:before {
        content: '\f111';
        font-family: 'Font Awesome 5 Pro';
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        font-size: 18px;
        padding-right: 5px
    }

    .list-radio-work li input[type=radio]:checked:before {
        content: '\f058';
        font-family: 'Font Awesome 5 Pro';
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        font-size: 18px;
        padding-right: 5px
    }

.li-ut-cao label {
    color: #ff6b77
}

.li-ut-tb label {
    color: #28a745
}

.li-ut-thap label {
    color: #ecb202
}

.work-ttt {
    background: #f0f1f1;
    padding-top: 10px;
    padding-bottom: 3px;
    margin-top: -19px;
    border: 1px solid #ccc;
    border-radius: 4px;
    border-top: 0
}

.modal-lg-work {
    width: 75%
}

.work-ttt .form-group label {
    width: 110px !important
}

.work-ttt .form-group .form-news {
    width: calc(100% - 110px) !important
}

.work-ttt-group-btn a {
    padding: 5px;
    margin-left: 10px;
    padding-right: 25px;
    color: #777;
    border-right: 1px solid #ccc
}

    .work-ttt-group-btn a:last-child {
        border-right: none
    }

    .work-ttt-group-btn a i {
        font-size: 1rem
    }

    .work-ttt-group-btn a span {
        padding-left: 10px
    }

.work-ttt-group-btn {
    border-top: 1px solid #ccc;
    padding-top: 5px
}

    .work-ttt-group-btn a:hover {
        color: #333
    }

.form-more-work {
    cursor: pointer;
    border: none !important;
    border-bottom: 1px solid #ccc !important;
    border-radius: 0px !important;
    background: #f0f1f1;
    box-shadow: none !important
}

    .form-more-work:focus, .form-more-work:active {
        outline: none !important;
        box-shadow: none
    }

.work-change-kh-ncc {
    position: absolute;
    right: 5px;
    top: 0;
    font-size: 18px;
    color: #777
}

.tt-huy {
    color: #dc3545
}

.tt-thanh-cong {
    color: #28a745
}

.tt-dang-thuc-hien {
    color: #17a2b8
}

.group-parent-work li div a {
    padding-left: 10px
}

.group-parent-work li div i {
    font-size: 13px
}

.form-date-singer {
    width: 25% !important;
    position: relative;
    float: left;
    margin-right: 4%
}

.form-time-singer {
    width: 15% !important;
    position: relative;
    float: left
}

.form-text-singer {
    font-weight: 700;
    float: left;
    width: 12%;
    text-align: center
}

.add-icon-drop:after {
    content: '\f0d7';
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    bottom: 0;
    right: 10px;
    color: #999;
    font-size: 13px
}

.work-add-drop-customer-p {
    margin: 0px !important;
    padding: 0px !important
}

.dash-gr-tt-ct {
    width: 140px;
    font-size: 1rem;
    float: left;
    color: #000;
    margin-right: 15px;
    margin-top: 0;
    line-height: 30px;
    position: relative
}

    .dash-gr-tt-ct div {
        width: 100%;
        float: left;
        margin: 0;
        line-height: 20px
    }

    .dash-gr-tt-ct span {
        font-weight: 700
    }

.dash-gr-text-ct img {
    width: 45px;
    float: left;
    margin-top: 3px
}

.dash-gr-text-ct div.gr-text-right {
    width: calc(100% - 50px);
    padding-top: 4px;
    padding-left: 15px;
    font-size: 15px;
    float: left
}

    .dash-gr-text-ct div.gr-text-right p {
        margin: 0;
        position: relative
    }

    .dash-gr-text-ct div.gr-text-right a.drop-thu-chi {
        color: #8c98b5;
        font-size: 1rem;
        padding-left: 5px
    }

.dash-gr-tang-giam {
    width: 300px;
    float: left;
    font-size: 1rem;
    color: #000;
    margin-top: 10px;
    line-height: 30px;
    text-align: right
}

    .dash-gr-tang-giam span {
        font-weight: 700;
        padding-left: 10px
    }

.dash-gr-text-ct {
    width: calc(100% - 705px);
    float: left
}

.dash-gr-sum {
    padding-top: 1px;
    width: 100%;
    float: left;
    padding-bottom: 15px;
    background: #fff;
    border-bottom: 1px solid #ececec;
    margin-bottom: 15px;
    padding-left: 0;
    padding-right: 0;
    border-radius: 0
}

.dash-sum h4 {
    margin-bottom: 7px;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-main)
}

.dash-gr-text-ct div.gr-text-right span {
    font-size: 20px
}

.dash-color-blue {
    color: #0097c4
}

.dash-color-red {
    color: #ff5d7e
}

.dash-color-yelow {
    color: #60f
}

.dash-sum {
    background: #fff;
    float: left;
    margin-bottom: 15px;
    border-radius: 5px;
    padding-left: 40px;
    padding-right: 40px
}

.dash-gr-sum-last {
    border: none;
    margin-bottom: 10px
}

.dash-gr-text-ct div.gr-text-right ul li a {
    color: #777
}

.dash-gr-text-ct div.gr-text-right div {
    width: 100%;
    float: left;
    font-weight: 700;
    position: relative;
    color: #000
}

.col-work-page3 {
    width: 28%;
    padding-left: 15px;
    padding-right: 15px;
    float: left
}

.col-work-page2 {
    width: 36%;
    padding-left: 15px;
    float: left;
    padding-right: 15px
}

.col-work-page5 {
    width: 64%;
    padding-left: 15px;
    float: left;
    padding-right: 15px
}

.border-none {
    border: none
}

.nhat-ky-hoat-dong ul {
    width: 100%;
    float: left;
    padding-left: 30px;
    padding-right: 30px
}

    .nhat-ky-hoat-dong ul li {
        float: left;
        border-bottom: 1px solid #ccc;
        color: #000;
        line-height: 22px;
        width: 100%;
        padding-top: 15px
    }

        .nhat-ky-hoat-dong ul li .img-ind {
            width: 30px;
            height: 28px;
            top: 5px;
            border-radius: 100%;
            text-align: left;
            line-height: 28px;
            float: left
        }

        .nhat-ky-hoat-dong ul li .diary {
            width: calc(100% - 30px);
            float: left
        }

.line-border {
    float: right;
    position: absolute;
    right: 0;
    top: -11px;
    height: 30px;
    width: 1px;
    background: #ccc;
    border: none
}

.dash-color-dark {
    color: #8c98a2
}

.dash-gr-tang-giam p .p-span-text {
    float: left;
    font-weight: 400
}

.menu-drop-3 {
    width: 700px;
    background: var(--color-main);
    position: absolute;
    height: auto;
    right: -6px;
    top: 47px;
    border-top: 1px solid #fff;
    display: none
}

    .menu-drop-3 ul.menu-ul-drop {
        display: block !important;
        top: 0px !important;
        padding: 0px !important;
        width: 100% !important;
        float: left;
        position: relative !important
    }

.menu-drop1 ul.menu-ul-drop li {
    padding: 0
}

    .menu-drop1 ul.menu-ul-drop li a div {
        padding: 12px 10px
    }

.menu-drop3 ul.menu-ul-drop li a {
    text-decoration: none;
}

    .menu-drop3 ul.menu-ul-drop li a div {
        padding: 10px 11px;
        display: flex;
        align-items: center;
    }

        .menu-drop3 ul.menu-ul-drop li a div .material-icons {
            width: 30px;
            text-align: center;
            margin-right: 10px;
        }

.menu-drop3 ul.menu-ul-drop li {
    padding: 0
}

.menu-drop-3 .menu-drop1 {
    width: 30%;
    float: left;
    position: relative
}

.menu-drop-3 .menu-drop3 {
    width: 40%;
    float: left
}

    .menu-drop-3 .menu-drop3 ul.menu-ul-drop {
        border-right: none
    }

    .menu-drop-3 .menu-drop3 .menu-drop-ul-style-color {
        display: block !important;
        top: 0px !important;
        padding: 5px 5px 12px 15px !important;
        width: 100% !important;
        float: left;
        position: relative !important
    }

        .menu-drop-3 .menu-drop3 .menu-drop-ul-style-color li {
            width: auto;
            float: left;
            padding: 5px !important
        }

            .menu-drop-3 .menu-drop3 .menu-drop-ul-style-color li a {
                width: 50px;
                height: 50px;
                float: left;
                border-radius: 4px;
                border: 1px solid #fff
            }

.menu-border-right-line {
    position: absolute;
    top: 12px;
    right: 0;
    width: 1px;
    height: 245px;
    background: #fff;
    background: #fff;
    z-index: 99999
}

.header-top ul li:hover div.menu-drop-3 {
    display: block
}

#lblNoHienTai {
    float: right;
    padding-right: 3px
}

.form-check-thu-chi label {
    width: 100% !important
}

.form-check-thu-chi {
    margin-bottom: 0
}

.price-border-bot {
    border: none;
    border-bottom: 1px solid #ccc
}

.han-su-dung-lo span {
    font-weight: 700;
    font-size: 1rem
}

.han-su-dung-lo .number-price {
    float: inherit;
    margin-left: 10px;
    margin-right: 10px
}

.tab-so-do li a {
    padding: 10px;
    background: #d6d6d6;
    color: white !important
}

.tab-so-do li.active a, .tab-so-do li.active > a:focus {
    background: var(--color-main)
}

.tab-so-do li a:hover, .tab-so-do li:hover a {
    color: white !important;
    background: var(--color-main) !important;
    border-bottom: 1px solid var(--color-primary)
}

.tab-so-do li:hover {
    border-bottom: 1px solid var(--color-primary)
}

.tab-so-do li.active, .tab-so-do li.active > a:focus {
    border-bottom: 1px solid var(--color-primary)
}

.tab-so-do li {
    border-bottom: 1px solid #d6d6d6
}

.tab-location {
    background: var(--color-main);
    border: none !important
}

    .tab-location li {
        background: var(--color-main);
        border: none !important
    }

        .tab-location li a {
            color: white !important;
            border-radius: 0px !important;
            border-bottom: none
        }

.tab-news-modal .tab-location > li.active > a, .tab-news-modal.tab-location > li.active > a:hover, .tab-news-modal .tab-location > li.active > a:focus {
    background: #b1dfec !important;
    color: black !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important
}

.tab-news-modal .tab-location > li.active:hover > a {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 2px solid #ff8a00 !important
}

.tab-location > li:hover a {
    background: var(--color-primary) !important
}

.tab-news-modal .tab-location li a {
    border-top: 1px solid var(--color-primary) !important;
    border-left: 1px solid var(--color-primary) !important
}

.menu-room .tab-location li {
    padding-top: 4px;
    padding-left: 2px
}

.menu-room .tab-location {
    padding-left: 5px
}

    .menu-room .tab-location li a {
        background: var(--color-primary);
        border-top-left-radius: 4px !important;
        border-top-right-radius: 4px !important;
        padding: 9px 15px
    }

    .menu-room .tab-location > li.active > a, .menu-room .tab-location > li.active > a:hover, .menu-room .tab-location > li.active > a:focus {
        border-bottom: 4px solid #ff8a00 !important;
        background: white !important
    }

.list-room {
    width: 100%;
    float: left
}

    .list-room li {
        width: 165px;
        float: left;
        height: 130px;
        margin-left: 15px;
        border-radius: 4px;
        border: 1px solid #ccc;
        margin-top: 15px
    }

        .list-room li .room-head {
            text-align: center;
            margin: 0 10px;
            color: #333;
            border-bottom: 1px solid #ccc
        }

            .list-room li .room-head h5 {
                color: #ff8a00;
                font-weight: 700
            }

                .list-room li .room-head h5 span {
                    color: #333;
                    font-weight: 400;
                    font-size: 1rem
                }

        .list-room li .room-body {
            border-bottom: none;
            color: #333;
            padding: 0 10px;
            margin-top: 15px;
            font-size: 1rem
        }

            .list-room li .room-body p label {
                width: 60px;
                float: left;
                font-weight: 400
            }

            .list-room li .room-body p {
                width: 100%;
                float: left;
                margin-bottom: 2px
            }

        .list-room li a {
            width: 100%;
            float: left;
            height: 128px
        }

            .list-room li a:hover, .list-room li:hover a {
                background: #f0f1f1
            }

.sp-room-time {
    padding: 6px 8px;
    border-radius: 15px;
    background: #b2dfed
}

.room-emty {
    color: #0097c4 !important
}

.ft-room-time {
    color: #0097c4 !important;
    padding-left: 10px
}

.box-note-print {
    width: 97%;
    float: left;
    position: absolute;
    background: #fff;
    z-index: 99;
    top: 105px;
    box-shadow: 1px 0 8px 2px #ccc;
    padding: 20px 30px
}

    .box-note-print h4 {
        font-weight: 700;
        margin-top: 0;
        font-size: 20px
    }

    .box-note-print .note-print-page li label {
        font-weight: 700;
        width: 200px;
        float: left
    }

.note-print-page {
    width: 100%;
    float: left;
}

.div-print-page {
    padding-right: 15px
}

.div-print-page, .div-print-page2 {
    width: 33.333%;
    float: left
}

.list-note-print .note-print-page:last-child {
    padding-right: 0
}

.box-note-print .note-print-page li {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    font-size: 1rem
}

.list-note-print {
    max-height: 550px;
    overflow: auto
}

    .list-note-print h5 {
        color: var(--color-main);
        font-weight: 700;
        margin-top: 5px;
        font-size: 16px;
        text-decoration: underline
    }

.form- {
    width: 130px
}

.image-transport {
    width: 100%;
    display: table;
    text-align: center
}

.filter-so-do {
    float: left
}

.input-so-do input {
    width: 280px;
    border: 1px solid #7c7878 !important;
    margin-top: 5px;
    padding-left: 30px
}

.input-so-do i {
    font-size: 1rem;
    line-height: 10px;
    position: absolute;
    top: 15px;
    left: 10px
}

.input-so-do {
    position: relative;
    float: left
}

.total-so-do {
    float: left;
    padding-left: 15px;
    line-height: 45px;
    font-size: 1rem;
    color: #666
}

.input-so-do input:focus, .input-so-do input:hover {
    box-shadow: none !important
}

.footer-total {
    width: 100%;
    float: left
}

.sp-room-edit-time {
    padding: 3px 5px;
    background: #808285;
    border-radius: 22px;
    color: #fff;
    margin-left: 5px
}

.sp-room-play {
    padding: 5px 30px;
    background: #b2dfed;
    border-radius: 22px;
    color: #333;
    margin-left: 5px
}

.change-vi-tri {
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    padding: 0 5px;
    float: left;
    width: 65px;
    text-align: center;
    font-size: 11px
}

.room-text-hang-hoa {
    width: 120px;
    float: left
}

.room-text-hang-hoa {
    width: 120px;
    float: left
}

.change-vi-tri.active {
    color: #ccc;
    border: 1px solid #ccc
}

.room-view-vi-tri {
    width: 100%;
    float: left;
    padding-left: 25px;
    margin-bottom: 5px
}

.room-position {
    min-width: 160px;
    float: left
}

    .room-position label {
        margin-right: 10px;
        font-weight: 400;
        font-size: 1rem;
        color: #777;
        float: left;
        line-height: 25px
    }

    .room-position div {
        padding: 2px 8px;
        background: #b2dfed;
        border-radius: 15px;
        float: left;
        min-width: 70px;
        text-align: center
    }

    .room-position.overtime div {
        color: #fff;
        background: red
    }

    .room-position.overtime label {
        color: red
    }

.room-view-vi-tri .room-position:nth-child(1), .room-view-vi-tri .room-position:nth-child(4) {
    min-width: 130px
}

.list-pop-room li {
    width: auto;
    float: left;
    padding: 10px 13px;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
    margin-left: 5px;
    margin-right: 5px
}

    .list-pop-room li a {
        width: 100%;
        color: #333
    }

.list-pop-room {
    margin: 15px 0;
    width: 100%;
    float: left;
    overflow: auto;
    max-height: 300px
}

    .list-pop-room li a strong {
        font-size: 16px;
        color: #ff8a00
    }

.time-room {
    width: 55px;
    border: none;
    background: #b2dfed;
    text-align: center
}

    .time-room:focus {
        outline: none
    }

.room-position div i {
    font-size: 17px
}

.parent-detail {
    padding-left: 15px;
    display: none
}
/*.chose_kieubang-hoa-hong li:nth-child(3), .chose_kieubang-hoa-hong li:nth-child(4), .chose_kieubang-hoa-hong li:nth-child(5) {
    width: calc(100% - 15px);
    float: right;
    display: none
}*/
.form-popup-chiet-khau {
    margin-bottom: 10px;
    width: 100%;
    float: left
}

    .form-popup-chiet-khau label {
        font-weight: 400;
        width: 370px;
        float: left;
        line-height: 30px
    }

    .form-popup-chiet-khau .pop-input-chiet-khau {
        width: calc(100% - 370px);
        float: left
    }

.w590 {
    width: 590px
}

.font-w-400 {
    font-weight: 400
}

.lb-check-note-ck span {
    font-weight: 700
}

.lb-check-note-ck {
    line-height: 15px;
    font-size: 1rem;
    line-height: 18px;
    margin-top: 0
}

.ft-italic {
    font-style: italic
}

.w65 {
    width: 65px
}

.w415 {
    width: 415px
}

    .w415 .form-popup-chiet-khau label {
        width: 190px
    }

    .w415 .form-popup-chiet-khau .pop-input-chiet-khau {
        width: calc(100% - 190px)
    }

.checkycck {
    margin-left: 10px;
    margin-top: 10px
}

.sp-note {
    font-size: 1rem;
    color: #999
}

.bill-listmenu-hoadon {
    padding: 20px 20px 0 22px
}

    .bill-listmenu-hoadon li {
        margin: 5px 6px 10px 6px;
        width: 150px !important
    }

.list-room-hoa-don li .room-body {
    padding: 0 5px
}

.list-room-hoa-don li {
    width: 164px;
    margin-left: 5px;
    margin-top: 5px
}

    .list-room-hoa-don li .room-head {
        margin: 0 5px
    }

.list-room-hoa-don li {
    width: 164px;
    margin-left: 5px;
    margin-top: 5px
}

    .list-room-hoa-don li .sp-room-time {
        padding: 4px
    }

    .list-room-hoa-don li .list-room {
        padding-top: 5px
    }

.add-Save-draft {
}

.btn-Save-draft {
    background: var(--color-main) !important
}

.list-room li .room-head h5, .list-room-hoa-don li .room-head span {
    white-space: nowrap;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis
}

.filter-vi-tri nav, .search-hh-hd nav {
    width: calc(100% - 190px);
    float: left
}

.filter-vi-tri .total-so-do {
    line-height: 35px
}

.fl-left {
    float: left
}

.op-modal-conttent {
    margin-bottom: 40px
}

.btn-group-list-phieu button {
    padding: 15px 40px
}

.table-scroll-new {
    overflow: auto
}

.tr-cham-cong td {
    border-right: 1px solid #ccc
}

    .tr-cham-cong td:last-child {
        border-right: none
    }

.modal-nhan-su .form-news input[type='number'], .modal-nhan-su .form-news input[type='text'] {
    width: 100%;
    float: left
}

.modal-nhan-su .form-group {
    width: 100%;
    float: left
}

.modal-nhan-su input[type='checkbox'] {
    width: auto
}

#ui-timepicker-div .ui-widget-header {
    border: 1px solid var(--color-primary) !important;
    background: var(--color-main) !important;
    color: white !important
}

    #ui-timepicker-div .ui-state-default, #ui-timepicker-div .ui-widget-content .ui-state-default, #ui-timepicker-div .ui-widget-header .ui-state-default {
        border: 1px solid #ffffff !important;
        background: #ffffff !important;
        font-weight: normal !important;
        color: #454545 !important;
        text-align: center !important
    }

#ui-timepicker-div .ui-timepicker-table td {
    background: white !important
}

#ui-timepicker-div .ui-state-active, #ui-timepicker-div .ui-widget-content .ui-state-active, #ui-timepicker-div .ui-widget-header .ui-state-active, #ui-timepicker-div a.ui-button:active, #ui-timepicker-div .ui-button:active, #ui-timepicker-div .ui-button.ui-state-active:hover {
    color: white !important;
    background: var(--color-main) !important
}

.hoadon-text {
    width: 550px;
    float: left
}

.hoadon-number {
    width: calc(100% - 622px) !important;
    float: left
}

.hoadon-text .bill-number {
    width: 28px;
    float: left
}

.hoadon-text .list-nameproduct {
    width: calc(100% - 148px) !important;
    float: left;
    margin-top: 18px
}

.i-con-ban-hang {
    float: right
}

.hoadon-number .munber-bill {
    padding: 0
}

.hdhh-name {
    font-weight: 700
}

.display-hd-stt {
    width: 50px
}

.display-hd-sp {
    width: calc(100% - 250px)
}

.display-hd-sl {
    width: 80px
}

.display-hd-price {
    width: 120px
}

.table-display-view thead tr th {
    background: var(--color-main) !important;
    color: #fff;
    height: 40px;
    border: none;
    font-size: 16px;
    font-weight: 400
}

.table-display-view thead tr {
    border: 1px solid var(--color-primary)
}

.sp-view-tenhh {
    font-weight: 700;
    color: #555;
    font-size: 16px
}

.sp-view-dinhluong {
    color: #006fb1
}

.td-view-sp p {
    margin-bottom: 5px
}

.view-vitri p span {
    float: left
}

.view-title-ghichu {
    width: 80px;
    float: left
}

.view-ghichu p {
    float: left;
    width: 100%
}

.view-lo-sxngay {
    width: 50%;
    float: left
}

.sp-view-ngaysx {
    color: #00a69c;
    font-weight: 700
}

.sp-view-hansd {
    color: red;
    font-weight: 700
}

.view-lo-sp {
    padding-bottom: 5px
}

.td-view-sp .view-lo-sp {
    margin-top: 5px
}

.td-view-lo p {
    margin-bottom: 5px
}

.sp-view-km {
    color: red
}

.tr-row {
    border-left: 1px solid var(--color-primary)
}

.table-display-view tbody {
    border: 1px solid var(--color-primary);
    border-left: none
}

    .table-display-view tbody tr td, .table-display-view tbody tr:last-child {
        border: none;
        font-size: 1rem;
        white-space: inherit !important
    }

    .table-display-view tbody tr {
        border-bottom: 1px dotted #ccc
    }

.view-image {
    width: 66.66666%;
    float: left;
    position: fixed
}

.view-toltal-sp {
    width: 33.3333%;
    float: right;
    margin-bottom: 165px
}

.view-ghichu, .view-vitri {
    color: #666
}

    .view-vitri .vitri {
        padding: 2px 8px;
        background: #b2dfed;
        border-radius: 15px;
        font-size: 1rem;
        color: #333;
        float: left;
        min-width: 50px;
        text-align: center
    }

.view-footer {
    height: 165px;
    background: var(--color-main) !important;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    position: fixed;
    padding: 5px;
    bottom: 0;
    width: 33.3333%
}

.table-scroll-view {
    overflow: auto;
    padding-top: 40px
}

.table-scroll-fix {
    position: fixed;
    width: 33.3333%;
    z-index: 999999
}

.view-total-sum {
    width: 65%;
    float: right
}

    .view-total-sum .form-group {
        margin: 0;
        border-bottom: 1px dotted
    }

        .view-total-sum .form-group .form-news {
            text-align: right
        }

.i-hdbl-sodo {
    display: none
}

.list-kv ul li {
    padding: 6px;
    font: 400 14px menu
}

.number-search {
    text-align: right;
    border-radius: 0
}

.hl-filter-column {
    width: 20px;
    float: left
}

.hr-filter-column {
    width: calc(100% - 20px);
    float: left
}

.hl-filter-column .inport-kv {
    border-width: 1px;
    background: #fff;
    border-color: #e1e1e1;
    width: 20px;
    height: 30px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    margin-left: 0
}

    .hl-filter-column .inport-kv span {
        margin: 0 0 0 7px;
        line-height: 30px
    }

.hl-filter-column .list-kv {
    position: absolute;
    top: 30px;
    left: 10px;
    width: 160px;
    max-width: 160px;
    border: 1px solid #ccc;
    padding: 10px;
    border-top: none;
    max-height: 180px;
    overflow: scroll;
    overflow-x: hidden;
    display: none;
    background: #fff;
    z-index: 999999
}

.h-filter-column {
    min-width: 120px
}

.tr-filter-head {
    display: none
}

    .tr-filter-head td i.fa-search {
        font-size: 16px;
        padding-left: 3px
    }

th {
    font-size: 1rem !important
}

.list-img-user .img-user {
    width: 55px;
    min-width: 55px;
    height: 50px;
    position: unset;
    border-radius: 5px;
    background: none;
    object-fit: cover;
    border: 1px dashed #ccc;
    margin: 0 10px;
}

    .list-img-user .img-user img {
        width: 80%;
        height: 80%;
        margin: 10%;
    }

.list-img-user .detail-user-discount {
    padding-left: 0;
    min-height: 0;
}

.list-img-user:hover {
    background: rgba(0,0,0,.05);
    border-radius: 5px;
}

.list-img-user > label {
    border-bottom: 1px solid #e6e6e6;
}

    .list-img-user > label span {
        line-height: 18px;
    }

.list-img-user {
    transition: all 0.4s ease;
    display: inline-block;
    width: 100%;
}

.detail-user-discount p {
    margin: 0px !important;
    padding-top: 3px !important
}

.title-user {
    font-weight: bold;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 150px);
    overflow: hidden;
    display: inline-block;
}

.line-space {
    padding-left: 3px;
    padding-right: 3px;
}

.search-img-user button {
    position: absolute;
    top: 0px;
    left: 282px;
    width: 36px;
    float: right;
    height: 30px;
    background: var(--color-button);
    border: none;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    margin-right: 6px;
    color: white;
}

.tab-discount-user li.active {
    border-top: 1px solid #32b7b3;
    border-left: 1px solid #32b7b3;
    border-right: 1px solid #32b7b3;
    border-bottom: none !important;
}

.tab-discount-user li a {
    margin: 0px !important;
    font-weight: bold;
}

.tab-discount-user {
    padding-bottom: 13px !important;
}

    .tab-discount-user .nav-tabs {
        border-bottom: 1px solid #32b7b3;
    }

.note-discount-money p span {
    color: #f81600;
}

.note-discount-money p img {
    margin-right: 10px;
}

.op-input-ghichu {
    position: absolute;
    width: 100%;
    height: 14px;
    background: inherit
}

    .op-input-ghichu i {
        position: absolute;
        width: 10px;
        height: 10px;
        font-size: 10px;
        color: #ccc;
        left: 3px;
        bottom: 5px;
    }

    .op-input-ghichu input {
        line-height: 14px;
        height: 12px;
        width: inherit;
        font-size: 10px;
        border: none;
        float: left;
        padding: 0 15px;
        text-align: left;
        border-bottom: 1px solid #ccc;
        background: inherit
    }

.btn {
    font-size: 1rem
}

.drop-box-arrow-up:before {
    content: '';
    position: absolute;
    top: -5px;
    right: 35px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid var(--color-primary);
}

.drop-box-arrow-up::after {
    content: '';
    position: absolute;
    top: -4px;
    right: 35px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid white;
}

.op-dropbox.expand > .op-dropbox-container {
    display: block
}

.op-dropbox {
    position: relative
}

.op-dropbox-container {
    display: none;
    position: absolute;
    background: white;
    border: 1px solid var(--color-primary);
    align-items: center;
    padding: 5px 10px;
    right: 0;
    top: 30px;
    z-index: 99;
}

.op-toggle {
    background: #ccc;
    padding: 3px 5px;
    border-radius: 15px;
    position: relative;
    height: 24px;
    margin: 3px 0;
}

    .op-toggle > a {
        width: 24px;
        display: inline-block;
        text-align: center;
        font-size: 11px;
        z-index: 2;
        color: white;
        position: relative;
    }

    .op-toggle.vnd:before {
        left: 30px;
        width: 30px;
    }

    .op-toggle:before {
        content: '';
        display: block;
        height: 18px;
        width: 24px;
        position: absolute;
        background: var(--color-main);
        top: 3px;
        left: 4px;
        z-index: 1;
        border-radius: 15px;
        transition: all 0.4s ease;
    }

.op-dropbox-container > div > div {
    display: flex;
    flex-direction: row;
}

    .op-dropbox-container > div > div > input {
        width: 75px;
    }

.op-object-detail .form-group {
    border-bottom: 1px solid #ccc;
    padding: 3px 0px;
    margin-bottom: 5px;
}

.op-tag-picker {
    max-height: unset;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 1px;
    min-height: 28px;
    line-height: 24px;
}

    .op-tag-picker > div:not(.dropdown-backdrop) {
        position: relative;
        min-height: 24px;
    }

    .op-tag-picker .dropdown-menu {
        max-height: 250px;
        overflow: auto;
        overflow: overlay;
    }

    .op-tag-picker input {
        top: 0;
        position: absolute;
        left: 0;
        height: 100% !important;
        width: 100% !important;
        z-index: 1;
        border: none;
        padding: 3px 7px;
        line-height: 18px;
    }

    .op-tag-picker > div > ul {
        position: relative;
        z-index: 2;
        width: auto;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        padding-right: 50px;
    }

        .op-tag-picker > div > ul > li {
            cursor: pointer;
            color: #333;
            max-width: 98%;
            line-height: 18px;
            width: auto;
            padding: 3px 7px;
            background: var(--color-primary);
            margin: 1px 0 1px 1px;
            color: white;
            border-radius: 3px;
        }

            .op-tag-picker > div > ul > li i.fa-times {
                color: white !important;
                margin-left: 5px;
            }

.width-80 {
    width: 80px;
}

.flex {
    display: flex;
}

.op-menu-list > li > a[href='/#/DashBoard'] > i:first-child {
    display: inline-block;
}

.flex.flex-row.filterFileSelect > * {
    line-height: 24px;
    padding: 0 5px;
}

.filterFileSelect, .filterFileSelect + button {
    border: 1px solid var(--color-primary);
    padding: 3px;
    line-height: 24px;
    display: flex;
    align-items: center;
    padding: 3px 7px;
    justify-content: space-between;
    border-radius: 3px;
}

#MainLayout.expanded ~ .renewal {
    padding-left: 279px;
}