body {
    font-family: "Open Sans", "Arial" !important;
    color: #333;
    width: 100%;
}

.ui-widget {
    font-family: "Open Sans", "Arial" !important;
}

a:hover,
a:active,
a:visited {
    text-decoration: none;
}

img {
    max-width: 100%;
}

.btn:active,
.btn:focus,
a:active,
a:focus {
    outline: 0;
}

b,
strong {
    font-weight: 600;
}

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

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

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

.nowrap {
    white-space: nowrap;
}

.hero-spacer {
    margin-top: 50px;
}

.hero-feature {
    margin-bottom: 30px;
}

select {
    border: 1px solid #ddd;
    padding: 3px;
}

.container,
.container-fluid {
    padding: 0px 6px;
}

.container .row,
.container-fluid .row {
    margin: 0px -6px;
}

.container .row>div,
.container-fluid .row>div {
    padding: 0px 6px;
}

@media(max-width: 767px) {
    .container,
    .container-fluid {
        padding: 0px 6px !important;
    }
    .container .row,
    .container-fluid .row {
        margin: 0px -6px !important;
    }
    .container .row>div,
    .container-fluid .row>div {
        padding: 0px 6px !important;
    }
}

.relative {
    position: relative;
}

.icon-select-list span {
    margin-top: 10px;
    font-size: 30px;
    margin-right: 10px;
    cursor: pointer;
}

.icon-select-list span:hover {
    color: #c30111;
}

.icon-select-list span.active {
    color: #c30111 !important;
}

.icon-select-list span.icon-cate {
    color: VAR(--MAIN-COLOR-HOVER);
}

#review_root_icon,
#review_cat_icon {
    height: 32px;
    width: 32px;
    border: 1px solid #ccc;
    padding-left: 5px;
    padding-top: 5px;
    box-shadow: 1px 1px 0px #000;
}

.icon_empty {
    background: url("../images/icon_empty.png") no-repeat scroll -5px -3px / 38px 38px padding-box var(--main-color);
    display: inline-block;
    height: 31px;
    left: -5px;
    position: relative;
    top: -5px;
    width: 31px;
}

#review_root_icon span,
#review_cat_icon span {
    color: #c30111;
    font-size: 20px;
}

#ten_danh_muc>p {
    float: right;
    margin-bottom: 3px;
    margin-top: 3px;
    padding: 0 !important;
    text-align: left;
    width: 330px;
}

.main-container {
    margin: 0 auto;
    min-height: 655px;
    background: #158ec3;
}

#main-container>.row {
    margin: 0px;
}

.btn_w {
    min-width: 105px;
}

.main-retail {
    margin: 0 auto;
    min-height: 600px;
    /* background:#fff; */
    /*color:#898989;*/
    padding: 0px 5px;
}

.administrator {
    /* background: #efefef; */
}

.content-footer {
    margin: 10px auto 0px;
    color: #6b6b6b;
    padding: 5px 7px;
    background: #f1f1f1;
}

.content-footer a {
    color: var(--main-color);
}

.container-100-percent {
    width: 99.6%;
    padding-left: 1%;
    padding-right: 1%;
    background-color: #efefef;
    margin-top: 10px !important;
}

.height-33-percent {
    height: 150px;
    overflow: auto;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
}

.height-block-chief {
    height: 165px;
    overflow: auto;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
}

.height-proccess-chief {
    height: 950px;
    overflow: auto;
    border-left: 5px solid #d7d7d7;
    border-right: 1px solid #aaa;
    border-top: 1px solid #000;
    margin-top: 15px;
    border-bottom: 1px solid #000;
}

.header-button button {
    height: 44px;
}

#bar_template {
    min-height: 600px;
}

#bar_template_status {}

.btn-100 {
    width: 100%;
    padding: auto;
}

#md_bt_input {
    font-size: 18px;
    color: green;
    background: black;
    text-align: center;
    font-weight: bold;
}

.bg-blue {
    background: #3a6ea5;
}

.paging {
    overflow: hidden;
}

.paging ul li {
    background: none repeat scroll 0 0 #36a9e1;
    border-radius: 3px;
    color: #fff;
    display: block;
    float: left;
    font-size: 14px;
    font-weight: bold;
}

.paging ul li>i {
    background-color: #fff;
    border: 1px solid #ddd;
    color: #555;
    float: left;
    line-height: 20px;
    margin-left: -1px;
    padding: 6px 12px;
    position: relative;
    text-decoration: none;
}

.padding-10 {
    padding: 10px;
}

.padding-left-10 {
    padding-left: 10px;
}

.tranghientai li {
    background-color: #f4e6ac !important;
    color: #36a9e1 !important;
}

.bg-lblue {
    background: #00b0f0;
}

.bg-92blue {
    background: #92dccd;
}

.row-92blue {
    background: VAR(--MAIN-COLOR-HOVER);
    color: white;
}

.row-FFred {
    background: #f3656c;
    color: white;
}

.bg-white {
    background: white;
}

.bg-ccc {
    background: #ccc !important;
}

.bg-eee {
    background: #eeeeee !important;
}

.bg-d1d1d1 {
    background: #d1d1d1;
}

.bg-white2 {
    background: white;
    color: black;
}

.bg-92green {
    background: #92d050;
}

.rows-green {
    background: #92d050;
    color: white;
}

.rows-dark-green {
    background: #00b050;
    color: white;
}

.bg-eorgane {
    background: #e36c0a;
}

.bg-dark-green {
    background: #009b42;
}

.bg-gray {
    background: #6c6c6c;
    padding: 4px 0px;
    background: var(--main-color);
}

.btn-small button {
    padding: 4px 8px;
}

.btn-small1 {
    padding: 2px 8px !important;
    font-size: 13px;
}

tr.strikeout-text.bg-r-delete td {
    background: #e9e9e9;
    opacity: 0.46;
    text-decoration: line-through;
    color: #333;
}

.bg-lightgray {
    background: VAR(--MAIN-COLOR-HOVER);
    color: #fff;
    box-shadow: 0px 6px 8px #9c9c9c;
    margin-bottom: 20px;
    position: relative;
}

.bg-lightgray.height-60 {
    height: auto;
    min-height: 60px;
}

.product_index_t1 .table tbody>tr>td {
    vertical-align: middle;
}

.product_index_t1 .table tbody>tr>td .img {
    height: 74px;
    border: 1px solid #ddd;
    width: 62px;
    margin: 4px auto 4px;
    position: relative;
}

.product_index_t1 .table tbody>tr>td .img img,
.img11111 img {
    width: 60px;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    max-height: 100%;
    height: auto;
}

.product_index_t1 .table tbody>tr>td p {
    font-weight: 600;
    margin-bottom: 2px;
    line-height: 1.2;
}

.ds-mobile {
    display: none;
}

@media (max-width: 767px) {
    .input-group-all {
        margin-top: 6px;
    }
    .ds-pc {
        display: none;
    }
    .ds-mobile {
        display: inline-block;
        margin-top: 3px;
    }
    .bg-lightgray.height-60 {
        padding-bottom: 10px;
    }
    .bg-lightgray.height-60 .col-lg-9 {
        padding-left: 45px;
        margin-top: -4px;
    }
    .bg-lightgray.height-60 .col-sm-6 {
        padding-left: 45px;
        margin-top: -4px;
    }
    .product_index_t {}
    .text-right {
        text-align: left;
    }
}

.bg-selling {
    background: #efefef;
    color: #fff;
}

.bg-darkgray {
    background: #b0b2b4;
}

.bg-T,
.color-green-bg {
    color: #fff;
    white-space: nowrap;
    display: inline-block;
    padding: 1px 8px;
    border-radius: 3px;
    background: #53ac53;
    font-weight: 400;
}

.bg-T:before {
    content: "+";
    display: inline-block;
    margin-right: 2px;
}

.bg-C,
.color-red-bg {
    white-space: nowrap;
    color: #fff;
    display: inline-block;
    padding: 1px 8px;
    border-radius: 3px;
    background: #ff5f67;
    font-weight: 400;
}

.bg-C:before {
    content: "-";
    display: inline-block;
    margin-right: 2px;
}

.color-orange-bg {
    white-space: nowrap;
    color: #fff;
    border: 1px solid;
    display: inline-block;
    padding: 1px 8px;
    border-radius: 3px;
    background: #ffa500;
    font-weight: 400;
}

table.table-bg-no tr td.td-text-right,
table.table-bg-no tr th.td-text-right {
    text-align: right;
}

table.table-bg-no tr td.text-center,
table.table-bg-no tr th.text-center,
table.table-bg tr td.text-center,
table.table-bg tr th.text-center {
    text-align: center;
}

div.header-main div {
    padding-top: 0px;
    padding-bottom: 0px;
}

div.header-main {
    padding-top: 6px;
    padding-bottom: 0px;
    background: #efefef;
    color: #fff;
}

div.footer-main {
    background: #efefef;
    padding: 10px 0;
}

#btn_add_member.icon-plus,
#btn_add_product.icon-plus {
    width: 40px;
}

.bg-dark-blue {
    background: #064884;
}

.bg-dark-violet {
    background: #aa2aff;
}

.bg-dark-red {
    background: #ff2a2a;
}

.tab-setting {
    border: 1px solid #ebebeb;
    border-radius: 4px;
    background: #fff;
    padding: 0;
}

.border {
    border: 1px solid #ebebeb;
    border-radius: 4px;
}

.border-l {
    border-left: 1px solid #ebebeb;
}

.border-t-bill {
    border-top: 1px dashed #000;
    margin-top: 2px;
}

.border-t {
    border-top: 1px solid #ebebeb;
}

.border-t-dt {
    border-top: 2px dashed #ebebeb;
}

.border-tb {
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
}

.border-t-w {
    border-top: 1px solid #ebebeb;
}

.border-b {
    border-bottom: 1px solid #ebebeb;
}

.border-r {
    border-right: 1px solid #ebebeb;
}

.border-r-w {
    border-right: 1px solid #ebebeb;
}

.border-l-w {
    border-left: 1px solid #ebebeb;
}

.border-lr-w {
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
}

.border-red {
    border: 1px solid #f53e3e;
    padding: 3px;
    border-radius: 5%;
    overflow: auto;
    display: inline-block;
}

.border-green {
    border: 1px solid #5ab94e;
    padding: 3px;
    border-radius: 5%;
    overflow: auto;
    display: inline-block;
}

.border-rb,
.border-rb2 {
    border-bottom: 1px solid #000;
}

.border-rbt,
.border-rbt2 {
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
}

.slider {
    margin: 0;
    padding: 0;
    width: 100%;
    margin-bottom: 20px;
}

ul.bxslider {
    list-style: none;
}

.bx-wrapper .bx-viewport {
    top: 0;
    left: 0;
}

.bx-wrapper img {
    width: 100%;
}

.bx-viewport {
    max-height: 500px !important;
}

.input-search {
    position: relative;
    z-index: 1;
}

.btn-group-cart,
.btn-group-cart .btn {
    width: 100%;
}

.btn-group-cart .btn {
    text-align: center;
}

.btn-group-cart .dropdown-menu {
    z-index: 1001;
    left: inherit;
    right: 0;
}

.dropdown-menu {
    background: var(--main-color);
    font-size: 14px;
}

.btn-group-cart .icon-cart {
    margin-right: 5px;
}

ul.cart-content {
    min-width: 250px;
}

ul.cart-content b {
    font-weight: normal;
    display: block;
    color: VAR(--MAIN-COLOR-HOVER);
}

.link-p {
    display: block;
    min-height: 250px;
    height: auto;
    width: 100%;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
}

.first-p {
    min-height: 169px;
}

#loading_bar span {
    background: none repeat scroll 0 0 padding-box rgba(0, 0, 0, 0.65);
    border-radius: 4px;
    color: #ffffff;
    font-family: Tahoma;
    font-size: 12px;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10%;
    padding: 5px 10px;
    position: fixed;
    text-align: center;
    top: 40px;
    right: 0;
    width: 150px;
    z-index: 9999;
}

.loading_bar_overlay {
    position: fixed;
    z-index: 9998;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
}

.def-img {
    position: inherit !important;
    width: auto !important;
    height: inherit !important;
    max-width: inherit !important;
    max-height: inherit !important;
    left: inherit !important;
    top: inherit !important;
}

.prod-caption {
    background: #fbfbfb;
    border-top: 1px solid #ddd;
}

.prod-caption h4 {
    font-size: 16px;
    height: 40px;
    overflow: hidden;
}

span.title {
    display: block;
    font-size: 20px;
    border-bottom: 1px solid #fff;
    padding-bottom: 8px;
    margin-bottom: 20px;
    font-size: 22px;
    color: #fff;
    text-transform: uppercase;
}

span.show-more {
    display: block;
    font-size: 20px;
    padding-bottom: 8px;
    margin-bottom: 20px;
    font-size: 18px;
    color: #000;
    text-align: center;
}

span.show-more:hover {
    color: var(--main-color-hover);
}

footer {
    color: #eee;
    /* position: fixed; */
    bottom: 0px;
    width: 100%;
}

footer h4 {
    border-bottom: 1px solid #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
}

footer .column ul {
    font-size: 13px;
    list-style: none;
    padding: 0;
    line-height: 22px;
}

footer .column ul a {
    color: #a09f9f;
}

footer .copyright {
    padding: 10px;
    color: #ccc;
}

.navbar {
    background: #9f224e;
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .lb-text-right {
        text-align: left;
    }
    .navbar-nav>li>a {
        padding-top: 17px;
        padding-bottom: 17px;
    }
}

.navbar li a {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    text-transform: uppercase;
    color: #fff !important;
    -ms-transition: all 100ms ease-in-out 0s;
    -moz-transition: all 100ms ease-in-out 0s;
    -webkit-transition: all 100ms ease-in-out 0s;
    -o-transition: all 100ms ease-in-out 0s;
    transition: all 100ms ease-in-out 0s;
}

.transform-uppercase,
.uppercase {
    text-transform: uppercase;
}

.input-group-addon.bootstrap-touchspin-prefix,
.input-group-addon.bootstrap-touchspin-postfix {
    display: none;
}

.navbar li a:hover,
.navbar li a.active {
    background-color: var(--main-color-hover) !important;
}

.navbar li.nav-dropdown .caret {
    border-top-color: #fff;
    border-bottom-color: #fff;
}

@media (min-width: 768px) {
    .lb-text-right {
        text-align: right;
    }
    .navbar li.nav-dropdown ul li a {
        font-family: Arial;
        font-size: 15px;
        color: #333 !important;
        text-transform: inherit;
    }
    .navbar li.nav-dropdown ul li a:hover {
        background-color: #f1f1f1 !important;
    }
}

.list-categ a {
    background: #fbfbfb;
    -ms-transition: all 100ms ease-in-out 0s;
    -moz-transition: all 100ms ease-in-out 0s;
    -webkit-transition: all 100ms ease-in-out 0s;
    -o-transition: all 100ms ease-in-out 0s;
    transition: all 100ms ease-in-out 0s;
}

.list-categ a:hover {
    background: #9f224e;
    color: #fff;
}

.thumbnail:hover {
    box-shadow: 0 0 10px 1px #f1f1f1;
}

.catalogue-pagination {
    margin: 0;
    margin-bottom: 40px;
}

.catalogue-pagination li.disabled:hover a {
    cursor: default;
}

.catalogue-pagination li a {
    -ms-transition: all 100ms ease-in-out 0s;
    -moz-transition: all 100ms ease-in-out 0s;
    -webkit-transition: all 100ms ease-in-out 0s;
    -o-transition: all 100ms ease-in-out 0s;
    transition: all 100ms ease-in-out 0s;
    padding: 3px 12px;
}

.back-top {
    bottom: 5px;
    display: none;
    opacity: 0.8;
    position: fixed;
    right: 0px;
    z-index: 1049;
}

.back-top img {
    width: 35px;
}

.input-number-touch {
    text-align: center;
    font-weight: bold;
}

.input-number-touch-lesson {
    text-align: center;
}

.tbl-cart thead {
    background: #f8f8f8;
}

.tbl-cart .td-qty {
    white-space: normal !important;
    width: 130px;
}

.btns-cart .btn {
    margin-right: 3px;
}

.tbl-checkout tbody tr td:nth-child(odd) {
    background: #f8f8f8;
}

.input-qty-detail .bootstrap-touchspin {
    float: left;
    margin-right: 5px;
    width: 130px;
}

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

.top0 {
    margin-top: 0px !important;
}

.top1 {
    margin-top: 1px;
}

.top2 {
    margin-top: 2px;
}

.top3 {
    margin-top: 3px;
}

.top5 {
    margin-top: 5px;
}

.top6 {
    margin-top: 6px;
}

.top7 {
    margin-top: 7px;
}

.top8 {
    margin-top: 8px;
}

.top15 {
    margin-top: 15px;
}

.top20 {
    margin-top: 20px;
}

.top25 {
    margin-top: 25px;
}

.top30 {
    margin-top: 30px;
}

.bottom30 {
    margin-bottom: 30px;
}

.bottom5 {
    margin-bottom: 5px;
}

.top35 {
    margin-top: 35px;
}

.top40 {
    margin-top: 40px;
}

.top50 {
    margin-top: 50px;
}

.bottom40 {
    margin-bottom: 40px;
}

.bottom50 {
    margin-bottom: 50px;
}

.bottom60 {
    margin-bottom: 60px;
}

.bottom70 {
    margin-bottom: 70px;
}

.top130 {
    margin-top: 130px;
}

.top55 {
    margin-top: 55px;
}

.top-10,
.top10,
.margin-top {
    margin-top: 10px;
}

.top13,
.margin-top-13 {
    margin-top: 13px;
}

.top-5,
.top5,
.margin-top-5 {
    margin-top: 5px;
}

.top-15,
.top15,
.margin-top-15 {
    margin-top: 15px;
}

.top-20 {
    margin-top: 20px;
}

.top-30 {
    margin-top: 30px;
}

.top-35 {
    margin-top: 30px;
}

.top-40 {
    margin-top: 40px;
}

.top-45 {
    margin-top: 45px;
}

.top-50 {
    margin-top: 50px;
}

.top-55 {
    margin-top: 55px;
}

.top-63 {
    margin-top: 63px;
}

.ptop3 {
    position: relative;
    top: 3px;
}

.padding2 {
    padding: 0px 2px;
}

@media(max-width: 767px) {
    .m_top0 {
        margin-top: 0 !important;
    }
    .m_top5 {
        margin-top: 5px !important;
    }
}

.title-main {
    font-size: 30px;
    color: white;
    padding-top: 10px;
}

.title-table-large {
    font-size: 27px;
    text-align: center;
    margin-top: 10px;
    padding-top: 10px;
    text-transform: uppercase;
}

#table_tong_tien {
    position: relative;
    top: -5px;
}

#notification_alert {
    position: relative;
    top: 0px;
    margin-right: 20px;
    height: 20px;
    float: right;
    border-radius: 50% !important;
    font-size: 25px;
    color: #fcd20a;
    cursor: pointer;
    width: 50px;
}

#notification_alert:hover {
    color: #ff7f00;
}

.popup-list {
    max-height: 500px;
    min-height: 100px;
    overflow: auto;
}

.popup-list .block-noti {
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    cursor: pointer;
}

.popup-list .block-noti:hover {
    background: #feed8e;
}

#notification_alert:active {
    color: #24365a;
}

.background-black {
    /*background:#000;*/
    height: 60px;
}

.background-thoat {
    background: #ff8000;
    height: 60px;
}

.padding-left-12 {
    padding-left: 12px;
}

.h5_att_sku {
    padding-left: 12px;
    margin-bottom: 3px;
}

.header-sku {
    padding-left: 12px;
    padding-right: 15px;
    margin-bottom: 3px;
}

.header-sku .btn_brand_sm {
    background: none repeat scroll 0 0 #3c8dd5;
    border: 0 none;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-stretch: condensed;
    padding: 2px 5px;
    margin-top: -15px;
}

.background-green {
    background: green;
}

.background-blue {
    background: #000040;
}

.background-red {
    background: #800000;
}

.background-organe {
    background: #c04000;
}

.background-tang2 {
    background: #808000;
    height: 60px;
}

.background-logoff {
    background: #000040;
    height: 60px;
}

.bg-active {
    background: #6296b8 !important;
    color: red !important;
}

.background-huyban {
    background: #800000;
    height: 60px;
}

.background-chuyengop {
    background: #c04000;
    height: 60px;
}

.background-chiaban {
    background: #804000;
    height: 60px;
}

.background-trahang,
.bg-disabled {
    background: #d4d0c8;
    height: 60px;
    color: black;
}

.background-mobanso {
    background: #000;
    height: 60px;
}

.background-moban {
    background: #008000;
    height: 60px;
}

.background-darkblue {
    background: #0a246a;
}

.background-splightblue {
    background: #deeefd;
}

.background-huy {
    background: #c00000;
}

.background-tralai {
    background: #004040;
}

.background-giamo {
    background: #800080;
}

.btn-discount-de {
    height: 45px;
    padding: 15px 0px 0px 0px !important;
}

.btn-discount-in {
    height: 44px;
    padding: 15px 0px 0px 0px !important;
}

.background-tang2-menu {
    background: #8080ff;
    height: 45px;
    padding: 15px 0px 0px 0px !important;
    color: black;
}

.background-logoff-menu {
    background: #ffc080;
    padding: 15px 0px 0px 0px !important;
    color: black;
}

.background-tongcong {
    background: #c00000;
}

.background-header-red {
    background: #e80000;
}

.color-white {
    color: white;
}

a.color-white:hover {
    color: white;
    text-decoration: underline;
}

a.color-main:hover,
a.color-main:focus {
    color: #898989;
}

.color-main,
.color-micon {
    color: var(--main-color);
}

.color-i i {
    color: #898989;
}

.color-gray {
    color: gray;
}

.color-black {
    color: black;
}

.color-red {
    color: #ed1d25 !important;
}

.color-blue {
    color: #037dd1 !important;
}

.color-yellow {
    color: yellow !important;
}

.color-orange {
    color: orange !important;
}

.color-green {
    color: #56ba47 !important;
}

.title-chuyenban {
    background: black;
    text-align: center;
    color: #eaea75;
    font-weight: bold;
    font-size: 20px;
}

.bg-block-maincat {
    padding-top: 12px;
    padding-bottom: 15px;
    font-weight: bold;
}

.bg-block-area {
    font-weight: bold;
    border: 1px solid #fff;
}

.bg-block-area:hover,
.bg-block-area:focus,
.bg-block-area:active {
    border: 1px solid #fff;
}

.bg-main-category {
    background: #fde97a !important;
    color: white;
    padding-top: 10px;
    padding-bottom: 10px;
    font-weight: bold;
}

.block-ban {
    width: 96%;
    height: 60px;
    /*background:#56BA47;*/
    cursor: pointer;
    /*box-shadow:1px -1px 1px #ddd;*/
    /*border: 1px solid #ddd;*/
    /*color:black;*/
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    vertical-align: middle;
    text-align: center;
    /*border-radius:5px;*/
    padding-top: 10px;
    margin: 5px;
    overflow: hidden;
}

.selected_table {
    min-height: 420px;
}

.block-ban:hover,
.block-ban:focus {
    box-shadow: 3px -3px 3px #d4d4d4;
    border: 1px solid #449d44;
    font-size: 17px;
}

.block-ban:active {
    box-shadow: 3px -3px 3px #d4d4d4;
    border: 1px solid #449d44;
    font-size: 18px;
}

.block-control {
    width: 100%;
    height: 90px;
    margin: 4px;
    cursor: pointer;
    box-shadow: 1px -1px 1px #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    color: white;
    font-size: 14px;
    padding-top: 25px;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
}

.block-half-control {
    width: 100%;
    height: 45px;
    margin: 0px 4px 0px 4px;
    cursor: pointer;
    box-shadow: 1px -1px 1px #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    color: white;
    font-size: 14px;
    padding-top: 15px;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
}


/*
.block-control:hover,.block-control:focus{
	box-shadow:2px -2px 2px #fff;
	background:#9b3200;
	color:white;
}*/

.block-control:active {
    box-shadow: 2px -2px 2px #000;
    background: #503875;
    color: white;
}

.color-add-menu {
    background: #d9534f;
    padding-top: 10px;
}

.none-padding-tb {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.so_hd {
    font-weight: bold;
    text-align: center;
    color: #008000;
}

.so_nguoi {
    width: 30px;
    font-weight: bold;
    text-align: center;
    color: #008000;
}

.so_ban {
    width: 100px;
    font-weight: bold;
    text-align: center;
    color: #008000;
}

.thu_ngan {
    width: 100px;
    font-weight: bold;
    color: #008000;
}

.khach_hang {
    width: 100px;
    font-weight: bold;
    color: #008000;
}

.height-300 {
    height: 300px;
}

.height-40 {
    height: 40px;
}

.height-45 {
    height: 45px;
}

.height-35 {
    height: 35px;
}

.height-150 {
    height: 150px;
    overflow: auto;
}

.height-200 {
    height: 200px;
    border-bottom: 1px solid #000;
    overflow: auto;
}

.height-20 {
    height: 20px;
}

.height-250 {
    height: 250px;
    border-bottom: 1px solid #000;
    overflow: auto;
}

.height250 {
    height: 250px;
}

.height-290 {
    height: 290px;
    border-bottom: 1px solid #000;
    overflow: auto;
}

.height-315 {
    height: 315px;
    border-bottom: 1px solid #000;
    overflow: auto;
}

.height-300 {
    height: 300px;
    overflow: auto;
}

.height-250px {
    height: 250px;
    overflow: auto;
    border-right: 1px solid #ccc;
}

.height-530 {
    height: 530px;
}

.btn-md-description {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 30px;
    background: #9d2b2a;
    color: white;
    text-align: center;
}

#input_keyboard {
    font-size: 25px;
    background: black;
    color: #22b14c;
    font-weight: bold;
}

#md_ds_bt_content,
#md_ds_bt_keyboard {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
}

#md_ds_bt_refresh,
#md_ds_bt_oke {
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
    font-size: 30px;
}

.min-height-100 {
    min-height: 100px;
}

.min-height-120 {
    min-height: 120px;
}

.min-height-160 {
    min-height: 160px;
}

.height-160 {
    height: 160px;
}

.height-400 {
    height: 400px;
    border-bottom: 1px solid #000;
    overflow: auto;
}

.height-465 {
    height: 465px;
    border: 1px solid #ebebeb;
    overflow: auto;
    border-radius: 4px;
}

.category-online {
    height: 524px;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    overflow: auto;
    border-radius: 0px 4px 4px 4px;
}

.hd-map-deli {
    height: 524px;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    overflow: hidden;
    border-radius: 0px 4px 4px 4px;
    padding-bottom: 10px;
}

.table-modify>tbody>tr:hover {
    background: #ccc !important;
    cursor: pointer;
}

.table-modify>tbody>tr:active {
    background: #000 !important;
    color: white;
}

.table-modify>tbody>tr>td {
    padding: 2px 0px;
}

.nopadding {
    padding: 0 !important;
}

.nomargin {
    margin: 0px !important;
}

.nopadding-l {
    padding-left: 0 !important;
}

.nopadding-r {
    padding-right: 0 !important;
}

.padding_right_no {
    padding: 0px 0px 0px 3px !important;
}

.padding-top-10 {
    padding: 10px 0px 0px 0px !important;
}

.padding-bt-5 {
    padding: 5px 0px 5px 0px !important;
}

.noborder {
    border: 0px solid #ccc !important;
}

.margintop-10 {
    margin-top: -10px;
}

.margintop-3 {
    margin-top: -5px;
}

.table-menu {
    width: 100%;
}

.bg-black-h2 {
    background: #7f7f7f;
    padding: 5px;
    text-align: center;
    color: #f7fc4c;
    padding: 5px;
    width: 98.5%;
    margin-left: 5px;
}

#md_ds_detail_order_name {}

.table_detail_order>tbody>tr:hover {
    background: #ccc !important;
    cursor: pointer;
}

.table_detail_order>tbody>tr:active {
    background: #000 !important;
    color: white;
}

.marginbottom-10 {
    margin-bottom: 10px !important;
}

.marginbottom-15 {
    margin-bottom: 15px !important;
}

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

.margin-10x {
    margin-left: 10px;
    margin-right: 10px;
}

.margin-top10 {
    margin-top: 10px !important;
}

.width-5per {
    width: 5%;
}

.widthauto {
    width: auto !important;
}

.header-table1 {
    background: #c00000;
    border-bottom: 1px solid #000;
    box-shadow: 1px 1px 1px #ccc;
    color: white;
}

.sum-bill {
    overflow: hidden;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.color-green {
    color: green;
}

.border-none {
    border: medium none !important;
}

.direction button {
    width: 100%;
    height: 35px;
}

.direction {
    overflow: hidden;
}

.calculator button {
    width: 100%;
    height: 35px;
    background: var(--main-color-hover);
    color: white;
    font-weight: bold;
}

.block-left1 {
    border-right: 1px solid #000;
    padding-right: 0px !important;
    padding-left: 0px !important;
}

#btn-cal-ce,
#btn-cal-x {
    height: 70px;
}

#btn-cal-ce {
    background: #d9534f;
}

.grid-category {
    overflow: auto;
}

.grid-category button {
    width: 9.75%;
    height: 60px;
    font-weight: bold;
    float: left;
}

.block_cat_menu {
    margin: 1px;
    white-space: normal;
    padding: 0px !important;
}

.main-category button {
    width: 73.5px;
    height: 40px;
    background: #76b941;
    color: white;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-bottom: 8px;
}

.main-category-new button {
    width: 73.5px;
    height: 40px;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-bottom: 8px;
}

.main-shop button {
    width: 73.5px;
    height: 40px;
    background: #e4e4e4;
    color: black;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-bottom: 8px;
}

.detail-category {
    margin-top: 5px;
    height: 345px;
    width: 100%;
    background: #d0eefd;
    overflow: auto;
}

.detail-category button {
    float: left;
    font-weight: bold;
    height: 80px;
    width: 12%;
    margin: 1px 1px 0px 1px;
    padding: 0px !important;
    font-size: 15px;
    white-space: normal !important;
}

.detail-category .block-menu {
    overflow: hidden;
}

.block-button-call {
    overflow: hidden;
    margin-top: 5px;
}

.with-10per {
    width: 10%;
}

.style-button-call {
    width: 100%;
    height: 90px;
    cursor: pointer;
    box-shadow: 1px -1px 1px #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    color: white;
    font-size: 14px;
    padding-top: 25px;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
}

#cal_input,
#md_tt_cal_input {
    background: #31b0d5;
    color: white;
    font-weight: bold;
    font-size: 20px;
    padding-bottom: 0px !important;
}

.title-ten-mon {
    padding: 10px;
    box-shadow: 2px 2px 2px #ccc;
    background: #c00000;
    color: white;
    margin-bottom: 5px;
    font-size: 23px;
}

.input-no-tralai {
    background: black;
    color: #00ff00;
    text-align: center;
    font-size: 23px;
}

.button-tralai {
    width: 100%;
    font-size: 23px;
    background: green;
    text-align: center;
    padding: 10px;
    color: white;
}

.margin-b-0 {
    margin-bottom: 0px;
}

.button-phim-so {
    width: 100%;
    font-size: 23px;
    background: black;
    padding: 6px;
    text-align: center;
    color: white;
}

.color-white {
    color: white;
}

.title-over-table {
    width: 100%;
    padding: 5px;
    text-align: center;
    box-shadow: 2px -1px 2px #ccc;
    border: 1px solid #ccc;
}

.title-of-table {
    box-shadow: 2px -1px 2px #ccc;
    color: white;
}

.list-menu-left {
    height: 400px;
    overflow: auto;
    background: #c0ffc0;
    width: 100%;
    color: black;
}

.list-menu-right {
    height: 400px;
    overflow: auto;
    background: #8080ff;
    width: 100%;
    color: black;
}

.button-large button {
    padding: 10px;
    font-size: 23px;
    text-align: center;
    color: white;
    width: 100%;
}

.button-medium button {
    padding: 10px 0px;
    font-size: 18px;
    text-align: center;
    color: white;
    width: 100%;
}

.button-small button {
    margin-top: 5px;
    padding: 5px 0px;
    font-size: 13px;
    text-align: center;
    color: white;
    width: 100%;
}

.btn-bg-bgreen button {
    background: #56ba47;
    color: white;
}

.btn-bg-yorgane button {
    background: #ff8000;
    color: white;
    text-transform: uppercase;
}

.btn-calculator button {
    padding-left: 28px;
    padding-right: 28px;
    font-size: 28px;
    width: 100%;
    height: 100%;
}

.popup-calculator button {
    width: 100%;
    height: 100%;
    font-size: 28px;
}

.with-358px {
    width: 358px !important;
}

.with-333px {
    width: 333px !important;
}

.btn-bg-none {
    background: white;
    color: #ccc;
}

.color-yorgane {
    color: #ff8000;
}

.padding-bottom-10 {
    padding-bottom: 10px !important;
}

.padding-bottom-12 {
    padding-bottom: 12px !important;
}

.color-bgreen {
    color: #004040;
}

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

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

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

.font-size-15 {
    font-size: 15px !important;
}

.font-size-10 {
    font-size: 10px !important;
}

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

.font-size-13 {
    font-size: 13px !important;
}

.font-size-14 {
    font-size: 14px !important;
}

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

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

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

.font-size-25 {
    font-size: 25px !important;
}

.font-size-28 {
    font-size: 28px !important;
}

.font-size-30 {
    font-size: 30px !important;
}

.font-size-32 {
    font-size: 32px !important;
}

.font-size-40 {
    font-size: 40px !important;
}

.font-size-60 {
    font-size: 60px !important;
}

.font-size-55 {
    font-size: 55px !important;
}

.content-warehistory {
    overflow: hidden;
    background: #fff;
}

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

.bg-f0f0f0>li {
    background: #f0f0f0 !important;
}

.bg-f0f0f0>li:hover,
.list-item:hover {
    background: #3a6ea5 !important;
    color: white !important;
    cursor: pointer;
}

.list-order:hover {
    background: #efe4b0 !important;
    color: white !important;
    cursor: pointer;
}

.bg-f0f0f0>li:active,
.list-item:active,
.list-order:active {
    background: #000 !important;
    color: white !important;
}

.overflow-hidden {
    overflow: hidden;
}

.active {
    /*background:#c04000;*/
}

.bg-green {
    background: green;
}

.hd {
    padding: 3px;
    border-radius: 5%;
    color: white;
}

.bg-greenbtn {
    background: #56ba47;
}

.bg-cred {
    background: #c00000;
}

.bg-hidden {
    background: #d9d2ee !important;
}

.bg-40green {
    background: #004000;
}

.bg-80purple {
    background: #800080;
}

.bg-c0c0ff {
    background: #c0c0ff;
}

.bg-navy {
    background: navy;
}

.bg-black {
    background: black;
}

.bg-teal {
    background: teal;
}

.bg-ff80organe {
    background: #ff8000;
}

.bg-olive {
    background: olive;
}

.bg-yellow {
    background: #ff8000;
}

.bg-yl {
    background: yellow;
    color: black;
}

.bg-red {
    background: red;
}

.active-blue {
    background: #00a2e8 !important;
    color: #b60e16;
}

.hightlight {
    background: #ffff9f;
}

.active2 {
    background: #da8512 !important;
}

.active3 {
    box-shadow: 3px -3px 3px #818181;
    background: var(--main-color);
}

.active4 {
    background: #4285f4 !important;
    color: white !important;
}

.active5 {
    background: #cce4df !important;
}

.active6 {
    background: #e2f7df !important;
}

.active7 {
    background: #eed5d3 !important;
}

#md_cb_can_id,
#md_cb_den_id {
    text-transform: uppercase;
}

#md_tinh_tien_notice {
    height: 270px;
    padding: 10px;
}

.opt_calender {
    border: 1px solid #ddd;
    padding: 5px 5px;
    width: 100%;
    height: 32px;
    border-radius: 3px;
}

.color-navy {
    color: navy;
}

.b-row {
    padding-top: 5px;
    width: 100%;
    height: auto;
}

.btn-100 button {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    min-height: 60px;
}

.btn-40 button {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    min-height: 40px;
}

.btn-80 button,
.btn-80 span {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    height: 105px;
    text-align: center;
    font-size: 12px;
    overflow: hidden;
    border: 1px solid #ccc;
    padding-right: 0;
    padding-left: 0;
    box-shadow: 2px 3px 10px #b1b1b1;
}

.btn-60 button,
.btn-60 span {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    min-height: 60px;
    text-align: center;
    font-size: 12px;
}

.btn-40 button {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    height: 40px;
    text-align: center;
    font-size: 12px;
}

.btn-45 button {
    width: 100%;
    height: 100%;
    text-transform: uppercase;
    height: 45px;
    text-align: center;
    font-size: 12px;
}

.btn_multi_att {
    min-height: 150px;
}

.btn_multi_att button {
    min-height: 34px;
    text-align: center;
    font-size: 12px;
    width: 15.23%;
    margin-top: 5px;
    margin-right: 5px;
}

.btn_multi_att button.active,
.btn_multi_att button:hover {
    border: 1px solid red;
}

.cursor-pointer {
    cursor: pointer;
}

#md_menu_name {
    font-size: 30px;
    text-align: center;
}

.float-right {
    float: right;
}

.list-item-menu {
    overflow: hidden;
    background: #efe4b0;
}

.list-item {
    border-bottom: 1px solid #fff;
    overflow: hidden;
    padding: 10px;
}

.list-order-item {
    overflow: hidden;
    background: #fff;
}

.list-order {
    border-bottom: 1px solid #ccc;
    overflow: hidden;
    padding: 10px;
}


/*INVOICE*/

#vat {
    width: 682px;
    height: 950px;
    border: 1px solid #ccc;
    overflow: hidden;
    background: url("../images/vat1.jpg");
    margin: 0 auto;
}

#invoice {
    width: calc(100% - 20px);
    margin: 0 auto;
    border: 1px solid #ddd;
    height: auto;
    overflow: hidden;
    background: white;
    margin-bottom: 16px;
    padding: 6px;
}

.invoice {
    width: 260px;
    margin: 0 auto;
    border: 1px solid #ccc;
    height: auto;
    overflow: hidden;
    background: white;
}

.invoice_bills {
    margin-left: 5px;
    border: 1px solid #ccc;
    height: auto;
    overflow: hidden;
    background: white;
}

.block_shifts_history {
    width: 19%;
    float: left;
    border: 1px solid #ccc;
    height: 250px;
    overflow: hidden;
    margin-top: 10px;
    margin-left: 10px;
    background: #fff;
}

.table-invoice {
    width: 100%;
}

.border-bottom {
    border-bottom: 2px dashed #000;
}

.display-none {
    display: none !important;
}

.displaynone {
    display: none;
}

.display-block {
    display: block !important;
}

.btn_tinh_tien {
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 20px;
    width: 100%;
}

#md_tt_so_nguoi {
    width: 30px;
}

#md_tt_table_name,
#md_tt_username,
#md_tt_khach_hang,
#md_tt_waiter {
    width: 100px;
}

.btn-type-menu {
    height: 50px;
    font-size: 18px;
}

.note_manage_user {
    height: 34px !important;
}

#list_user {
    height: 195px;
    font-size: 18px;
}

p.total_recent_shift {
    margin-top: -15px;
    text-align: center;
    font-size: 16px;
}

div.pop-thu-ngan {
    font-size: 16px;
}

.font-weight-bold {
    font-weight: bold;
}

.bg-ddd {
    background: #ddd;
}

.height-50 {
    height: 50px;
}

.height-35 {
    height: 35px;
}

.height-60 {
    height: 60px;
}

.height-80 {
    height: 80px;
}

.height-90 {
    height: 90px;
}

.height-520 {
    height: 520px;
}

.margin-right-50 {
    margin-right: 50px;
}

.width-4per {
    width: 4%;
}

.width-10per {
    width: 12%;
}

.height-34 {
    height: 34px;
}

.col-w-12per {
    width: 12%;
}

.vat_hoten {
    margin-top: 138px;
    font-size: 18px;
    font-weight: bold;
    margin-left: 250px;
    text-transform: uppercase;
}

.vat_donvi {
    font-size: 18px;
    font-weight: bold;
    margin-left: 150px;
}

.vat_numbervat {
    margin-top: 2px;
    font-size: 18px;
    font-weight: bold;
}

.font-bold {
    font-weight: bold;
}

.vat_address {
    margin-top: -3px;
    margin-left: 120px;
    font-size: 17px;
}

.vat_hinhthuctt {
    font-size: 17px;
}

.vat_chitiet {
    margin-top: 55px;
    font-size: 17px;
}

.vat_gtgt {
    margin-top: 3px;
    font-size: 15px;
    font-weight: bold;
}

.vat_tienhang {
    margin-top: 200px;
    text-align: right;
    padding-right: 30px;
    font-size: 18px;
    font-weight: bold;
}

.vat_date {
    margin-top: 85px;
}

.vat_date_print {
    margin-top: 85px;
}

.vat_tongcong {
    margin-top: 5px;
    text-align: right;
    padding-right: 30px;
    font-size: 18px;
    font-weight: bold;
}

.vat_tongcongchu {
    margin-left: 180px;
    text-align: left;
    font-size: 18px;
    width: 500px;
}

.hold_recipe {
    height: 495px;
    overflow: auto;
    background: #fff;
}

.height-397 {
    height: 397px !important;
}

.height-393 {
    height: 393px !important;
}

.padding-l-30 {
    padding-left: 30px;
}

.width-100 {
    width: 100px !important;
}

.width-100per {
    width: 100%;
}

.width-115 {
    width: 115px !important;
}

.width-400 {
    width: 400px !important;
}

.width-40 {
    width: 40px;
}

.width-60 {
    width: 60px;
}

.padding-l-60 {
    padding-left: 60px;
}

.padding-l-70 {
    padding-left: 70px;
}

.color-blue {
    color: #6aa2df !important;
}

.normal-checkbox input[type="checkbox"] {
    transform: scale(1.2);
}

.hold_detail_table_wh {
    background: #fff;
    overflow: auto;
    height: 268px;
}

.scroll_detail_order {
    overflow: auto;
    height: 245px;
}

.btn-provider {
    float: right;
    width: 94%;
}

.height-65 {
    height: 65px;
}

#list_vat {
    height: 345px;
}

.height-265 {
    height: 265px !important;
}

#uploader_div {
    height: 230px;
    cursor: pointer;
}

#uploader_div img {
    height: 100%;
    width: 99%;
}

#uploader_div_storing {
    padding: 0 15px;
}

#uploader_div_storing img {
    max-width: 176px;
    max-height: 105px;
}

#uploader_divprocess {
    height: 215px;
}

.edit_url_update {
    font-size: 30px;
    color: white;
    float: right;
    margin-top: -40px;
    opacity: 0.6;
}

.edit_url_update:hover {
    opacity: 0.9;
    color: #b90000;
}

.padding-6 {
    padding: 6px;
}

.padding-5 {
    padding: 5px;
}

#list_provider {
    height: 310px;
}

.user_note_padding {
    padding-left: 7px;
    padding-right: 9px;
}

.margin-left-5 {
    margin-left: 5px;
}

.row_test_green {
    color: white;
    background: #56ba47;
}

.row_test_yellow {
    color: white;
    background: #eea236;
}

.row_test_red {
    color: white;
    background: #c9302c;
}

.padding-l-5 {
    padding-left: 10px;
}

.padding-l-10 {
    padding-left: 10px;
}

.padding-l-15 {
    padding-left: 15px;
}

.underline {
    text-decoration: underline;
}

.payment_paypal {
    background-image: url("images/paypal-icon.png");
    background-repeat: no-repeat;
    background-position: center;
    color: white;
    font-size: 30px;
    height: 220px;
    padding-top: 125px;
}

.hidden {
    display: none;
}

.permission input {
    margin-right: 10px;
}

.permission {
    /*color: white;*/
}

.margin-b-40 {
    margin-bottom: 40px;
}

.padding-l-22 {
    padding-left: 22px;
}

.padding-l-23 {
    padding-left: 23px;
}

.padding-l-25 {
    padding-left: 25px;
}

.none-bold {
    font-weight: normal !important;
}

.padding-lr-2 {
    padding-left: 2px;
    padding-right: 2px;
}

.delete-item {
    font-size: 20px;
}

.delete-item:hover {
    color: #e51c27;
    font-size: 20px;
    cursor: pointer;
}

.width-96p {
    width: 96%;
    float: left;
}

.btn-subcat {
    max-height: 135px;
    overflow: auto;
    border-bottom: 1px solid #eee;
    background: #5bb769;
}

.btn-subcat button {
    width: 24.99%;
    float: left;
    border-radius: 0px;
    border-right: 1px solid #fff !important;
    height: 45px;
    white-space: normal;
    background-color: #5bb769;
    color: #fff;
    border: none;
}

#list_mainCat.sub-cat {
    width: 95.9%;
    float: left;
}

.btn-subcat button:hover {
    background: #fff;
    color: #5bb769;
    border: 1px solid #5bb769;
}

.active_subCat {
    background: #fff !important;
    border: 1px solid #5bb769 !important;
    color: #5bb769 !important;
}

.width-4p {
    width: 4%;
    float: left;
    cursor: pointer;
    border-bottom: 1px solid #ebebeb;
    padding-top: 5px;
}

.width-4p-arrow {
    width: 4%;
    float: left;
    cursor: pointer;
    padding-top: 5px;
    background-color: #5bb769;
    margin-top: 1px;
}

.width-2p:hover {
    background: #c13a35;
    color: white;
}

.btn-cat {
    padding: 0 !important;
    max-height: 160px;
    overflow: auto;
}

.btn-cat button.root_item,
.btn-subcat button.cat_item {
    font-size: 14px;
    text-transform: capitalize;
    overflow: hidden;
    padding: 2px;
}

.btn-cat button {
    border-radius: 0px;
    border-right: 1px solid #ebebeb;
    border-left: 0px;
    border-top: 0px;
    border-bottom: 1px solid #ebebeb;
    height: 47px;
    float: left;
    background-image: url("../images/btn_cat.png");
    background-position: -3px -3px;
    white-space: normal;
}

.opt_right_main {
    height: 47px;
}

.btn-width80 button {
    width: 25%;
}

.btn.btn-width,
.btn.btn_width,
.btn-width,
.btn_width {
    min-width: 76px;
}

#subCategory.btn-menu.pos {
    max-height: 405px;
}

.btn-menu {
    max-height: 420px;
    overflow: auto;
}

.btn-menu button {
    width: 23.56%;
    margin-left: 5px;
    height: 50px;
    margin-top: 5px;
    background-image: url("../images/btn_cat.png");
    background-position: -3px -3px;
    white-space: normal;
    overflow: hidden;
}

.btn-menu button:hover {
    color: black;
}

.root_active {
    background-image: url("../images/btn_cat.png") !important;
    background-position: -3px -3px !important;
    color: red;
}

.cat_active {
    background-image: url("../images/btn_cat.png") !important;
    background-position: -3px -3px !important;
    color: red;
}

.bg-button {
    background-image: url("../images/btn_cat.png") !important;
    background-position: -3px -2px !important;
    color: #898989;
    font-size: 16px;
}

.bg-button i {
    font-size: 30px;
}

.bg-button:hover {
    color: black;
}

.img-barcode {
    width: 70px;
    height: 33px;
}

.img-navibar {
    height: 40px;
    width: 70px;
}

.btn-itemicon:active,
.btn-itemicon:focus {
    border: 1px solid var(--main-color-hover);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    color: var(--main-color-hover);
}

.btn-itemicon:hover {
    border: 1px solid var(--main-color-hover);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    color: var(--main-color-hover);
}

.btn-itemicon {
    color: var(--main-color);
    border-color: #ccc;
}

.bg-gray #order_id {
    width: 100px;
}

.triangle-popup i {
    color: #525252;
}

.triangle-popup {
    width: 10px;
    height: 10px;
    color: black;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    display: none;
}

#self-popup-ship.self-popup {
    width: 380px;
}

.self-popup {
    width: 220px;
    min-height: 50px;
    background-color: #525252;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    display: none;
    box-shadow: 1px 2px 1px #888888;
}

#self-popup {
    width: 175px;
}

.popup {
    border-radius: 4px;
    padding: 10px 16px;
    color: white;
}

.popup_close:hover {
    color: white;
}

.popup_close {
    float: right;
    margin-top: -20px;
    margin-right: -15px;
    cursor: pointer;
    color: #efefef;
}

#popup-quantity-holder {
    width: 360px;
    height: auto;
}


/*.quantity_dt:hover{
	background: #ccc;
	color: white;
}
.quantity_dt{
	background: url("../images/btn_cat.png") -10px -10px;
	border: 1px solid #ccc;
	box-shadow: 1px 1px 1px #ccc;
	height: 25px;
	width: 100%;
	color: #898989;
	padding-top: 5px;
	display: inline-block;
	cursor: pointer;
	margin-top: 1px;
}
.price_dt:hover{
	background: #ccc;
	color: white;
}
.price_dt{
	background: url("../images/btn_cat.png") -10px -10px;
	border: 1px solid #ccc;
	box-shadow: 1px 1px 1px #ccc;
	height: 25px;
	width: 100%;
	color: #898989;
	padding-top: 5px;
	display: inline-block;
	cursor: pointer;
	margin-top: 1px;
}*/

span.shop-cart {
    background: url(../images/icon_store.png) -15px -130px / 569px 445px;
    width: 50px;
    height: 42px;
    display: inline-block;
    margin-top: -5px;
}

span.icon-advance {
    background: url(../images/icon_store.png) -457px -215px;
    width: 50px;
    height: 42px;
    display: inline-block;
    background-size: 650px 450px;
    margin-top: -5px;
}

span.icon-void {
    background: url(../images/icon_store.png) -45px -170px;
    width: 50px;
    height: 42px;
    display: inline-block;
    background-size: 550px 350px;
    margin-top: -5px;
}

span.icon-discount {
    background: url(../images/icon_store.png) -351px -195px;
    width: 35px;
    height: 42px;
    display: inline-block;
    background-size: 595px 400px;
    margin-top: -5px;
}

span.icon-barcode {
    background: url(../images/icon_store.png) -79px -33px / 504px 320px;
    width: 70px;
    height: 35px;
    display: inline-block;
}

span.icon-barcode2 {
    background: url(../images/icon_store.png) -101px -33px / 659px 320px;
    width: 90px;
    height: 35px;
    display: inline-block;
}

span.icon-option {
    background: url(../images/icon_store.png) -506px -147px / 600px 329px;
    width: 15px;
    height: 35px;
    display: inline-block;
}

span.icon-arrow {
    background: url(../images/icon_store.png) -242px -100px / 424px 330px;
    width: 20px;
    height: 30px;
    display: inline-block;
}

span.icon-arrow:hover {
    -ms-transform: rotate(180deg);
    /* IE 9 */
    -webkit-transform: rotate(180deg);
    /* Chrome, Safari, Opera */
    transform: rotate(180deg);
    background: url(../images/icon_store.png) -242px -107px / 424px 330px;
}

label.btn-texttop {
    position: relative;
    top: -12px;
}

label.btn-textscale {
    position: relative;
    top: -5px;
}

.detail_order_height {
    height: 341px;
    overflow: auto;
    padding: 0;
    background: #fdfdfd;
}

.detail_order_height_online {
    height: 270px;
    overflow: auto;
    padding: 0;
    background: #fdfdfd;
}

.padding-l-5 {
    padding-left: 5px;
}

div.detail_order_block {
    border-bottom: 1px solid #efefef;
    height: 46px;
    padding: 3px 0px;
}

.pay_cart {
    background-color: var(--main-color-hover);
    color: white;
    font-size: 16px;
}

.hover-red:hover {
    color: #e31a2d;
}

.main_screen_height {
    width: 100%;
    overflow: hidden;
    background: white;
}

.main_screen_height_online {
    width: 100%;
    overflow: hidden;
}

.lretrieve_holder {
    overflow: auto;
}

.val-show {
    text-align: right;
    padding-right: 5px !important;
}

.hidden {
    display: none;
}

.label_option span {
    font-size: 15px;
    cursor: pointer;
    margin-left: 10px;
}

.label_option span:hover {
    color: #e31a2d;
}


/*# sourceMappingURL=bootstrap.css.map */

.cate_menu .root_items>span,
.cate_menu .cat_items>span {
    position: absolute;
    top: 30%;
}

h4.title {
    clear: both;
    color: var(--main-color);
    font-size: 22px;
    font-weight: 300;
    margin: 15px 0 10px;
    padding-left: 7px;
    font-family: Roboto, sans-serif;
}

h4.title_att {
    padding: 5px 0px 0px 15px;
    margin: 0px !important;
}

ul.cate_menu {
    font-size: 14px;
    list-style: outside none none;
    margin: 10px -5px;
    overflow: hidden;
    padding: 0;
}

ul.cate_menu li {
    list-style-type: none;
    position: relative;
    width: 16.66666%;
    float: left;
    padding: 5px;
}

@media (max-width: 991px) {
    ul.cate_menu li {
        width: 25%;
    }
}

@media (max-width: 767px) {
    ul.cate_menu li {
        width: 50%;
    }
}

ul.cate_menu li a {
    box-sizing: border-box;
    padding: 7px 30px;
    border: 1px solid #e5eef7;
    border-radius: 50px;
    font-size: 14px;
    background: #e5eef7;
    position: relative;
    color: #333;
    font-weight: 400;
    text-align: center;
    height: 60px;
    display: block;
    text-decoration: none !important;
}

ul.cate_menu li a.btn_catactive,
ul.cate_menu li:hover a {
    border: 1px solid var(--main-color);
    background: var(--main-color);
    color: #fff !important;
}

ul.cate_menu li:hover a.btn_catactive i,
ul.cate_menu li a.btn_catactive i,
ul.cate_menu li:hover a i {
    color: #fff !important;
}

ul.cate_menu a.btn_delete {
    background: url("../images/icon.png") no-repeat scroll -122px -494px padding-box #ccc;
    border-radius: 3px 0px 0px 0px;
    display: inline-block;
    height: 23px;
    padding: 2px;
    position: absolute;
    right: 1px;
    bottom: 1px;
    width: 20px;
}

table.list_table a.btn_edit {
    background: url("../images/icon.png") no-repeat scroll -86px -492px padding-box var(--main-color);
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    height: 23px;
    margin: 3px;
    padding: 5px 7px;
    width: 27px;
}

ul.cate_menu a.btn_edit {
    background: url("../images/icon.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 0 0px 0 3px;
    display: inline-block;
    height: 23px;
    right: 1px;
    padding: 2px;
    position: absolute;
    top: 1px;
    width: 20px;
}

table.list_table a.btn_edit:hover {
    padding: 5px 7px;
}

ul.cate_menu a.btn_edit:hover {
    background: url("../images/icon.png") no-repeat scroll -91px -494px var(--main-color);
    border: 1px solid var(--main-color);
}

ul.cate_menu a.btn_delete:hover {
    background: url("../images/icon.png") no-repeat scroll -122px -494px #e41e25;
}

ul.cate_menu a.btn_brand_sm {
    font-size: 15px;
    padding: 7px 20px !important;
}

input.btn_brand_sm:hover,
button.btn_brand_sm:hover,
a.btn_brand_sm:hover {
    background: none repeat scroll 0 0 #357ebd;
    text-decoration: none !important;
}

ul.cate_menu a.btn_brand_sm:hover {
    border: 1px solid var(--main-color);
}

span.add {
    background: url("../images/icon.png") no-repeat scroll -236px -436px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 34px;
    margin-right: 3px;
    vertical-align: -12px;
    width: 34px;
}

div.title_tab {
    position: relative;
}

div.title_tab_R {
    position: absolute;
    right: 0;
    top: 0;
    padding-right: 10px;
    margin-top: 10px;
}

@media (max-width: 767px) {
    div.title_tab_t>h4 {
        padding: 0px 5px;
    }
    div.title_tab_t>h4 .pull-right {
        float: none !important;
        text-align: left;
    }
    div.title_tab_t>h4>a {
        width: 100%;
        margin: 6px 0px;
        float: none !important;
    }
    div.title_tab_t>h4 .pull-right>a,
    div.title_tab_t>h4 .pull-right .search_cus {
        width: 100%;
        float: none;
        margin: 0px 0px 6px;
    }
    .list_table_t11 .text-center.nopadding .btn-group {
        white-space: nowrap;
        padding: 0px 8px;
    }
    .list_table_t11 .text-center.nopadding .btn-group a {
        float: none;
    }
    .list_table_t11 .force-left {
        white-space: nowrap;
    }
    .btn-group {
        white-space: nowrap;
        padding: 0px 8px;
    }
    .btn-group>.btn {
        float: none;
        margin: 0px -3px;
    }
    .dsnd1 .title {
        padding-top: 0px;
        margin-top: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-bottom: 10px;
        margin-bottom: 0px;
    }
    .dnsd2 {
        text-align: left !important;
    }
    .dnsd2>button {
        width: calc(50% - 2px);
    }
    .dnsd2>a {
        width: calc(100% - 0px);
    }
    .dnsd2>a button {
        width: 100%;
    }
    .col-sm-t121 .row>div {
        margin: 4px 0px;
    }
}

input.btn_brand_sm,
button.btn_brand_sm,
a.btn_brand_sm {
    background: none repeat scroll 0 0 #357ebd;
    border: 0 none;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    font-stretch: condensed;
    padding: 4px 10px;
    -webkit-text-fill-color: initial;
}

.R {
    float: right;
}

span.ic_search {
    background: url("../images/icon.png") no-repeat scroll -195px -446px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 19px;
    margin-left: 10px;
    margin-right: 3px;
    margin-top: 8px;
    vertical-align: -4px;
    width: 19px;
}

div.search {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #e3e4e8;
    border-radius: 3px;
    font-size: 16px;
    height: 33px;
    margin-right: 10px;
}

div.search button {
    background: url("../images/icon.png") no-repeat scroll -379px -439px rgba(0, 0, 0, 0);
    border: 0 none;
    cursor: pointer;
    float: left;
    height: 25px;
    margin-top: 3px;
    width: 26px;
}

table.list_table {
    border: 1px solid #e3e4e8;
    border-collapse: collapse;
    padding: 10px 0;
}

table.list_table {
    border-collapse: collapse;
}

table.list_table th {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #eee;
    border-color: #e3e4e8 #e3e4e8 -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid solid;
    border-width: 1px 1px 1px 1px;
    font-size: 14px;
    padding: 10px;
}

.pagination>li>a,
.pagination>li>span {
    background-color: #fff;
    border: 1px solid #ddd;
    color: #555;
    float: left;
    line-height: 20px;
    margin-left: -1px;
    /*padding: 10px 20px;*/
    position: relative;
    text-decoration: none;
}

.pagination {
    border-radius: 3px;
    display: inline-block;
    margin: 10px 0;
    padding-left: 0;
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
    background-color: var(--main-color);
    border-color: var(--main-color);
}

.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
    color: var(--main-color);
}

div.info_table {
    float: right;
    margin-left: 10px;
    margin-top: 12px;
}

div.search input[type="text"] {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 0 none;
    box-sizing: border-box;
    float: left;
    padding: 8px 5px 2px;
    width: 215px;
}

.choose_record {
    padding: 10px;
}

span.ic_active {
    background: url("../images/icon.png") no-repeat scroll -343px -447px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 14px;
    margin-right: 3px;
    vertical-align: 0;
    width: 15px;
}

table.list_table a.btn_edit:hover {
    padding: 5px 7px;
}

table.list_table a.btn_delete {
    background: url("../images/icon.png") no-repeat scroll -117px -491px padding-box #e41e25;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    height: 23px;
    margin: 3px;
    padding: 5px 7px;
    width: 27px;
}

table.list_table a.btn_delete:hover {
    background: url("../images/icon.png") no-repeat scroll -117px -491px #b9161c;
    padding: 5px 7px;
}

div.title_tab {
    position: relative;
}

h4.title {
    clear: both;
    color: var(--main-color);
    font-size: 18px;
    font-weight: 300;
    padding-left: 7px;
}

div.title_tab_R {
    position: absolute;
    right: 0;
    top: 10px;
}

.in_btn_text {
    position: relative;
    top: -4px;
}

#popup_add_product {
    position: fixed;
    top: -80px;
    left: 197.5px;
    z-index: 9999;
    display: none;
}

div.pop_up input {
    transform: scale(1) !important;
}

div.pop_up {
    background: none repeat scroll 0 0 #fff;
    border-radius: 4px;
    display: none;
    margin-top: 100px;
    position: relative;
    width: 870px;
}

div.pop_up_co {
    padding: 10px 10px 10px 15px;
    background: #fff;
    overflow: hidden;
    box-shadow: 2px 1px 3px #000;
}

div.creat_product {
    width: 100%;
}

div.creat_product_L {}

.fr_col {
    margin-left: 0 !important;
}

div.creat_product_L div.img {
    margin: 10px 0;
}

div.creat_product_L div.img img {
    border: 1px solid #e3e4e8;
    max-height: 250px;
    max-width: 302px;
    width: 100%;
}

.fr_end {
    margin-right: 0 !important;
}

div.creat_product_R {}

div.form {
    color: #555;
    font-size: 14px;
    margin: 0 auto;
    overflow: hidden;
}

div.product .field {
    padding: 1px 0;
}

div.form .field {
    clear: both;
    display: block;
    overflow: hidden;
    width: 100%;
}

div.product label.field_L {
    margin-left: 0;
    text-align: left;
    width: 105px;
}

div.form label.field_L {
    color: #555;
    display: block;
    float: left;
    font-size: 14px;
    padding: 8px 0 0;
}

.other_color {
    color: #ef532a;
}

div.product input[type="text"],
div.product input[type="password"] {
    /*width: 447px;*/
}

div.product input[type="text"],
div.product input[type="password"] {
    /*width: 447px;*/
}

div.product label.field_L1 {
    margin-left: 0;
    text-align: right;
    width: 80px;
}

div.form label.field_L1 {
    color: #555;
    display: block;
    float: left;
    font-size: 14px;
    padding: 8px 5px 0px 0;
}

div.form select {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    box-sizing: border-box;
    color: #555;
    height: 36px;
    padding: 10px;
}

div.product label.field_L {
    margin-left: 0;
    text-align: left;
    width: 105px;
}

ul.color_size {
    list-style: outside none none;
    margin-bottom: 0;
    padding: 0;
}

ul.color_size li {
    background: none repeat scroll 0 0 #efefef;
    border: 1px solid #e3e4e8;
    border-radius: 2px;
    color: #555;
    float: left;
    margin-left: 5px;
}

span.add_sm {
    background: url("../images/icon.png") no-repeat scroll -244px -494px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 21px;
    margin-right: 3px;
    vertical-align: -4px;
    width: 21px;
}

div.product span.place {
    display: inline-block;
    margin-left: 20px;
    margin-right: 5px;
}

div.product .text_sm1 {
    margin-right: 10px !important;
    text-align: left;
}

div.form select {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    box-sizing: border-box;
    color: #555;
    height: 36px;
    padding: 10px;
}

div.list_img_sm a img {
    border: 1px solid #e3e4e8;
    height: auto;
    width: 80px;
    /*margin-top: 5px;*/
}

div.list_img_sm a {
    float: left;
    /*margin-right: 10px;
    margin-top: 5px;*/
    /*margin-top: 5px!important;*/
    display: inline-flex;
}

.list_img_sm .hold_img {
    width: 80px;
    height: 80px;
    margin-top: 5px;
}

.introduct .hold_img,
div.introduct a img {
    width: 96px !important;
    height: 80px !important;
    margin-top: 5px;
}

div.creat_product_L div.img .large-img {
    width: 99% !important;
}

.form_block_hot_product {
    padding: 50px 50px;
}

.form_block_hot_product.active {
    background: #fbfbfb;
}

.table_hot_product {
    height: 400px;
    overflow: auto;
    border: 1px solid #efefef;
    background: white;
}

div.form_edit {
    clear: both;
    overflow: hidden;
}

ul.edit_menu {
    border-bottom: 1px solid #e3e4e8;
    list-style: outside none none;
    overflow: hidden;
    padding-left: 0;
    margin-bottom: 0px;
}

ul.edit_menu li {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #e3e4e8 #e3e4e8 -moz-use-text-color;
    border-image: none;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    float: left;
    margin-top: 2px;
}

ul.edit_menu li a.active {
    border-top: 3px solid var(--main-color);
    padding: 5px 25px 10px;
}

ul.edit_menu li a {
    display: block;
    font-size: 16px;
    padding: 8px 25px 10px;
}

div.form_edit_co {
    border: 1px solid #e3e4e8;
}

div.product div.field_btn {
    text-align: right;
}

div.product .field_btn {
    padding: 10px 0 10px 25.5%;
}

div.product button {
    margin: 5px;
}

ul.color_size li a {
    display: block;
    padding: 3px 4px;
    text-align: center;
}

input.btn_white,
button.btn_white,
a.btn_white {
    background: -moz-linear-gradient(center bottom, #eee 0px, #fff 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 1px solid #d1d1d1;
    border-radius: 3px;
    color: #555;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    padding: 8px 25px;
}

.btn_pop_close,
.modal .modal-header a.close {
    background: url(../images/icon.png) no-repeat scroll -149px -494px rgba(0, 0, 0, 0);
    cursor: pointer;
    display: block;
    height: 16px;
    position: absolute;
    right: 15px;
    top: 19px !important;
    width: 16px;
    opacity: 1;
    text-indent: -99999px;
}

.pupop_xuatkho {
    padding: 14px;
}

.pupop_xuatkho textarea {
    width: 100% !important;
    border: 1px solid #ddd;
    border-radius: 5px;
    min-height: 100px;
    margin: -10px 0px -10px;
    padding: 10px;
}

.pupop_xuatkho p {
    color: #666;
    font-size: 16px;
}

.pupop_xuatkho .btn-success1 {
    margin: 30px 0px 10px;
}

.pupop_xuatkho .btn-success1 a {
    line-height: normal;
}

ul.edit_menu li a:hover {
    border-top: 3px solid var(--main-color);
    padding: 5px 25px 10px;
}

span.add_sm {
    background: url("../images/icon.png") no-repeat scroll -244px -494px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 21px;
    margin-right: 3px;
    vertical-align: -4px;
    width: 21px;
}

input.btn_add,
button.btn_add,
a.btn_add {
    background: none repeat scroll 0 0 var(--main-color);
    border: 0 none;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-stretch: condensed;
    margin-left: 10px;
    margin-top: -5px;
    padding: 2px 10px;
}

div.product button {
    margin: 5px;
}

input.btn_brand,
button.btn_brand,
a.btn_brand {
    background: none repeat scroll 0 0 var(--main-color);
    border: 0 none;
    border-radius: 3px;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    padding: 8px 0px;
}

input.btn_brand:hover,
button.btn_brand:hover,
a.btn_brand:hover {
    background: none repeat scroll 0 0 #357ebd;
    text-decoration: none !important;
}

.bottom-5 {
    margin-bottom: 5px;
}

span.fas1 {
    background: url("../images/icon.png") no-repeat scroll -295px -444px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 18px;
    vertical-align: -3px;
    width: 17px;
}

a.btn_home {
    background: url("../images/icon.png") no-repeat scroll -78px -433px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 42px;
    left: 0;
    position: absolute;
    top: 0;
    width: 42px;
}

div.header a.btn_brand_sm {
    position: absolute;
    right: 0;
}

input.btn_brand_sm:hover,
button.btn_brand_sm:hover,
a.btn_brand_sm:hover {
    background: none repeat scroll 0 0 #357ebd;
    text-decoration: none !important;
}


/*End popup add more product*/

img.icon_business,
img.cat_icon_business {
    width: 100%;
    height: 50px;
}

#review_root_icon span,
#review_cat_icon span {
    max-width: 32px;
    max-height: 32px;
    cursor: pointer;
}

.btn_icon {
    width: 20px;
    height: 20px;
}

#pop_btn_add {
    display: inline-block;
    margin-top: 0;
}

#pop_multi {
    margin-right: 5px;
}

#ckb_gia_thoa_thuan {
    margin-right: 5px;
}

#apply_online_store {
    margin-right: 5px;
}

.height-holder-texteditor {
    height: 240px;
    margin-bottom: 36px;
}

#editor_description {
    overflow: scroll;
    max-height: 300px;
}

.root_icon_main,
.cat_icon_main {
    width: 13.8%;
    height: 50px;
    white-space: normal;
    margin: 2px 0px;
}

.root_icon_main span {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: relative;
    top: 50%;
    width: 100%;
    margin: 0px;
    max-height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-transform: capitalize;
}

#modal_root_icon_sub img,
#modal_cat_icon_sub img {
    width: 50px;
    height: 50px;
}

#back__to_pos {
    position: absolute;
    left: 5px;
    top: 0px;
    font-size: 18px;
}

#products_multi_uncheck {
    display: inline-block;
    padding-top: 3px;
}

#pop_sales {
    /*margin-left: 5px;
 	margin-top: 5px;
*/
}

#label_sales {
    float: left;
    margin-top: 5px;
    margin-left: 5px;
}

#hold_location_online {
    position: absolute;
    top: 238px;
    right: 4px;
}

ul.multi_product {
    font-size: 14px;
    list-style: outside none none;
    overflow: hidden;
    padding: 0;
}

ul.multi_product li {
    background: -moz-linear-gradient(center bottom, #eee 0px, #fff 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    background: -webkit-linear-gradient(#fff, #eee);
    box-sizing: border-box;
    color: var(--main-color);
    float: left;
    font-size: 14px;
    margin-bottom: 10px;
    margin-left: 0.7%;
    margin-right: 0.7%;
    position: relative;
    text-align: center;
    width: 18.5%;
}

ul.multi_product a.active {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product li>a {
    border: 1px solid #ccc;
    color: #555;
    display: block;
    padding: 14px 10px;
}

ul.multi_product li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product li>a {
    border: 1px solid #ccc;
    color: #555;
    display: block;
    padding: 14px 10px;
}

a {
    outline: 0 none;
    text-decoration: none;
}

ul.multi_product li {
    color: var(--main-color);
    font-size: 14px;
    text-align: center;
}

ul.multi_product {
    font-size: 14px;
    list-style: outside none none;
}

ul.multi_product a.btn_delete {
    background: url("../images/icon.png") no-repeat scroll -122px -494px padding-box #ccc;
    border-radius: 3px 0px 0px 0px;
    display: inline-block;
    height: 23px;
    padding: 2px;
    position: absolute;
    right: 1px;
    bottom: 1px;
    width: 18px;
}

ul.multi_product a.btn_edit {
    background: url("../images/icon.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 0 0px 0 3px;
    display: inline-block;
    height: 23px;
    right: 1px;
    padding: 2px;
    position: absolute;
    top: 1px;
    width: 18px;
}

ul.multi_product li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product a.btn_edit:hover {
    background: url("../images/icon.png") no-repeat scroll -91px -494px var(--main-color);
    border: 1px solid var(--main-color);
}

ul.multi_product li>a {
    border: 1px solid #ccc;
    color: #555;
    display: block;
    padding: 14px 10px;
}

ul.multi_product a.btn_delete:hover {
    background: url("../images/icon.png") no-repeat scroll -122px -494px #e41e25;
}

ul.multi_product li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product a.btn_brand_sm {
    font-size: 15px;
    padding: 7px 20px !important;
}

ul.multi_product a.btn_brand_sm:hover {
    border: 1px solid var(--main-color);
}

ul.multi_product li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product_val {
    font-size: 14px;
    list-style: outside none none;
    overflow: hidden;
    padding: 0;
}

ul.multi_product_val li {
    background: -moz-linear-gradient(center bottom, #eee 0px, #fff 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    background: -webkit-linear-gradient(#fff, #eee);
    box-sizing: border-box;
    color: var(--main-color);
    float: left;
    font-size: 14px;
    margin-bottom: 6px;
    margin-left: 0.7%;
    margin-right: 0.7%;
    position: relative;
    text-align: center;
    width: 23%;
}

ul.multi_product_val a.active {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product_val li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product_val {
    font-size: 14px;
    list-style: outside none none;
}

ul.multi_product_val a.btn_delete {
    background: url("../images/icon.png") no-repeat scroll -122px -494px padding-box #ccc;
    border-radius: 3px 0px 0px 0px;
    display: inline-block;
    padding: 2px;
    position: absolute;
    right: 1px;
    bottom: 1px;
}

ul.multi_product_val a.btn_edit {
    background: url("../images/icon.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 0 0px 0 3px;
    display: inline-block;
    right: 1px;
    padding: 2px;
    position: absolute;
    top: 1px;
}

ul.multi_product_val li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product_val a.btn_edit:hover {
    background: url("../images/icon.png") no-repeat scroll -91px -494px var(--main-color);
    border: 1px solid var(--main-color);
}

ul.multi_product_val li>a {
    border: 1px solid #ccc;
    color: #555;
    display: block;
    padding: 9px 10px !important;
}

ul.multi_product_val a.btn_delete:hover {
    background: url("../images/icon.png") no-repeat scroll -122px -494px #e41e25;
}

ul.multi_product_val li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul.multi_product_val a.btn_brand_sm {
    font-size: 15px;
    padding: 9px 10px !important;
}

ul.multi_product_val a.btn_brand_sm:hover {
    border: 1px solid var(--main-color);
}

ul.multi_product_val li>a:hover {
    border: 1px solid #e41e25;
    color: #e41e25;
}

ul .add_more_icon {
    width: 60px !important;
}

div.sku_modify {
    height: 320px;
    overflow: auto;
    padding-bottom: 200px;
}

#modal_multi_attribute {
    margin-left: -10px;
}

.tree_listing {
    cursor: pointer;
}

tr.bg_lightgray {
    background-color: #f8f8f8;
}

.pointer {
    cursor: pointer;
}

.color-success {
    color: #53ac53 !important;
}

.color-primary {
    color: #3b81bd;
}

.btn_option {
    height: 23px;
    margin-top: -23px;
    padding: 2px;
    width: 26px;
    margin-left: 5px;
}

.btn_add_category span.add {
    margin-top: -3px;
}

.btn_add_category {
    margin-top: -5px;
}

.font-size-i-icon {
    font-size: 18px;
}


/**
Font chi thanh
**/

@font-face {
    font-family: "icon_form";
    src: url("../fonts/icon_form.eot");
    src: url("../fonts/icon_form.eot?#iefix") format("embedded-opentype"), url("../fonts/icon_form.woff") format("woff"), url("../fonts/icon_form.ttf") format("truetype"), url("../fonts/icon_form.svg#icon_form") format("svg");
    font-weight: normal;
    font-style: normal;
}

.icon_form {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: "icon_form";
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-edit:before {
    content: "b";
}

.icon-search:before {
    content: "a";
}

.icon-close:before {
    content: "c";
}

.icon-list:before {
    content: "d";
}

.icon-arrow-up:before {
    content: "e";
}

.icon-print:before {
    content: "f";
}

.icon-return:before {
    content: "g";
}

.icon-note:before {
    content: "h";
}

.icon-close1:before {
    content: "i";
}

.icon-table:before {
    content: "j";
}

.icon-check:before {
    content: "k";
}

.icon-food-other:before {
    content: "l";
}

.icon-food:before {
    content: "m";
}

.icon-home:before {
    content: "n";
}

.icon-cart:before {
    content: "o";
}

.icon-drink-1:before {
    content: "p";
}

.icon-print1:before {
    content: "q";
}

.icon-percent:before {
    content: "r";
}

.icon-shutdown:before {
    content: "s";
}

.icon-close2:before {
    content: "t";
}

.icon-edit2:before {
    content: "u";
}

.icon-add:before {
    content: "v";
}

.icon-cart-shop {
    background-image: url("images/navibar.png");
    background-repeat: no-repeat;
    background-size: 75px 40px;
    height: 45px;
}

.icon-cart-shop i {
    font-size: 32px;
    color: #6aa2df;
    margin-left: 8px;
    margin-top: 3px;
}


/**
Font chi thanh ©
**/

.color_blue {
    color: blue;
}

.color_blue:hover {
    color: blue;
    text-decoration: underline;
}

#popup_quantity:focus,
#popup_price_percent:focus,
#popup_price_unit:focus,
#order_discount_val:focus {
    box-shadow: none;
    outline: 0 none;
    border-color: #ccc !important;
}

.text-center td,
.text-center th {
    text-align: center;
}

td.text-left,
th.text-left {
    text-align: left;
}

.width_modal {
    width: 872px;
}

.hover-i i {
    cursor: pointer;
}

#pop_tab_discount>a,
#pop_tab_price>a {
    font-size: 16px;
    padding: 7px 0px;
}

.padding-top-12p {
    padding-top: 12px;
}

.title_order_online {
    margin-left: 20px;
}

.table_order_online>tr:hover {
    background: #dff0d8 !important;
    cursor: pointer;
}

.table_order_online .active td {
    background: #dff0d8 !important;
}

.table_order_online .selected {
    background: #dff0d8;
}

.holder-online-order {
    height: 525px;
    /*border: 1px solid #EBEBEB;*/
    border-radius: 4px;
}

.holder-list-onl-order {
    height: 480px;
    border: 0;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-radius: 0px 0px 4px 4px;
}

.holder-category-pos {
    /*height: 440px;
	border: 0;
	border-left:1px solid #ddd;
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd;
	/*border-radius: 0px 0px 4px 4px;*/
}

.no-margin {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-top: 0;
}

div.paging-onl-order {
    margin-top: 5px;
    padding-left: 0px;
}

.paging-onl-order>ul {
    margin: 0px;
    margin-top: 5px;
}

.left_func.hover-red.main_row_check_box {
    margin-right: 3px;
}

.left_func {
    color: #000;
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    opacity: 0.8;
    text-shadow: 0 1px 0 #fff;
}

.hight_light {
    background-color: #fff7d6;
}

.note_return {
    width: 100%;
    height: 20px;
    font-size: 12px;
    position: relative;
    top: -5px;
}

.header-collection {
    padding-top: 5px;
    padding-bottom: 3px;
}

.modal-collection {
    width: 40%;
}

.from_label {
    width: 65px;
}

.to_label {
    width: 30px;
}

.from_txt,
.to_txt {
    width: 80px;
}

.select_filter {
    width: 150px;
}

.padding-6 {
    padding: 6px;
}

#totals_pay1 {
    padding-right: 8px;
}

.item_att_sku {
    height: 43px;
}

#multi_attribute_val li {
    width: 158px;
}

.btn_edit_icon {
    background: url("../images/icon.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    width: 18px;
}

.btn_delete_icon {
    background: url("../images/icon.png") no-repeat scroll -122px -494px padding-box #ccc;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    width: 18px;
}

.btn_up_icon {
    background: url("../images/up.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    width: 18px;
    margin: 0px;
    background-position: center;
    background-size: 14px;
}

.btn_link_icon {
    background: url("../images/link.png") no-repeat scroll -91px -494px padding-box #ccc;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    width: 18px;
    margin: 0px;
    background-position: center;
    background-size: 14px;
}

.img_func.btn_edit_icon {
    margin-left: -18px;
    margin-top: 5px;
    position: absolute;
}

.img_func.btn_delete_icon {
    margin-left: -18px;
    margin-top: 45px;
    position: absolute;
}

.img_func.btn_up_icon {
    margin-left: -18px;
    margin-top: 25px;
    position: absolute;
}

.img_func.btn_link_icon {
    margin-left: -18px;
    margin-top: 5px;
    position: absolute;
}

.list_img_sm .hold_img .img_func.btn_delete_icon {
    margin-left: 0px;
    margin-top: 20px;
    position: absolute;
}

.list_img_sm .hold_img .img_func.btn_edit_icon {
    margin-left: 0;
    margin-top: 0;
    position: absolute;
}

.list_img_sm .hold_img .img_func.btn_up_icon {
    margin-left: 0;
    margin-top: 0;
    position: absolute;
}

.list_img_sm .hold_img .img_func.btn_link_icon {
    margin-left: 0;
    margin-top: 0;
    position: absolute;
}

.list_img_sm .hold_web>.img_func.btn_delete_icon {
    margin-left: -18px;
    margin-top: 25px;
    position: absolute;
}

.list_img_sm .hold_web>.img_func.btn_edit_icon {
    margin-left: -18px;
    margin-top: 5px;
    position: absolute;
}

.list_img_sm .hold_web>.img_func.btn_up_icon {
    margin-left: -18px;
    margin-top: 5px;
    position: absolute;
}

.list_img_sm .hold_web>.img_func.btn_link_icon {
    margin-left: -18px;
    margin-top: 5px;
    position: absolute;
}

.custome-order-info {
    background-color: var(--main-color-hover);
    color: white;
    border: 1px solid #357ebd;
    border-radius: 4px 4px 0px 0px;
    font-size: 13px;
    padding: 0;
}

.news_list_table {
    height: 368px;
    overflow: auto;
    border: 1px solid #ccc;
}

.news_list_table .btn {
    font-size: 12px;
    height: 25px;
    padding: 4px;
    width: 30px;
}

.progress {
    width: 100%;
    height: 100%;
}

.tab-content {
    z-index: -34;
}

.custome-tab-content {
    border-left: 1px solid #ddd !important;
    border-right: 1px solid #ddd !important;
    border-bottom: 1px solid #ddd !important;
    overflow: hidden;
    padding-bottom: 10px !important;
    /* margin-top: -1px !important; */
    background: #fff;
    border-radius: 0px 0px 4px 4px;
}

.img.holder {
    height: 300px;
}

.img.holder_product {
    height: 300px;
}

#load_sku_1>img,
#load_sku_2>img {
    width: 50px;
}

.brumbar_menu {
    height: 30px;
    background: #ccc;
    padding-top: 5px;
}

.block-noti a {
    color: black !important;
}

.cursor-pointer {
    cursor: pointer;
}

img.img_in_list_pro {
    min-width: 20px;
    max-width: 50px;
    max-height: 50px;
}

.bootstrap-dialog-body .bootstrap-dialog-message .col-lg-12.col-md-12.col-xs-12>a {
    color: black;
}

div.top_header {
    background: none repeat scroll 0 0 #6d6c6c;
    color: #fff;
    overflow: hidden;
    height: 30px;
    padding-top: 3px;
}

.container-fluid-header {
    margin-left: auto;
    margin-right: auto;
}

div.top_header ul.top_menu_header {
    list-style: outside none none;
    margin-top: -5px;
}

div.top_header ul.top_menu_header li:first-child {
    border: 0 none;
}

div.top_header ul.top_menu_header li {
    border-right: 1px solid #fff;
    float: right;
    line-height: 15px;
    padding: 0 10px;
}

@media (max-width: 767px) {
    div.top_header ul.top_menu_header li {
        padding: 0px 5px;
    }
}

div.top_header ul.top_menu_header li a {
    color: #fff;
}

.bg-lightgray span.font-size-20 {
    font-size: 22px !important;
}

a.btn_list {
    background: none repeat scroll 0 0 #1c517e;
    border-radius: 50%;
    font-size: 20px;
    left: 10px;
    padding: 10px 12px;
    position: absolute;
    z-index: 1;
    top: -4px;
}

a.menu-home {
    background: none repeat scroll 0 0 var(--main-color);
    border-radius: 50%;
    padding: 4px 6px;
    font-size: 24px;
}

a.menu-home+a {
    color: var(--main-color) !important;
    font-size: 23px;
    cursor: pointer;
    padding: 0px 7px 0px 7px;
    position: relative;
    top: 1px;
}

a.btn_list_back {
    background: none;
    font-size: 16px;
    position: relative;
    z-index: 99;
}

a.btn_list_back span.icon-cate.icon-other-back {
    padding-top: 3px;
}

.badge_storing {
    background: none repeat scroll 0 0 #fff;
    border-radius: 5px;
    color: #333;
    margin-top: -5px;
}


/*font  ace */

input[type="checkbox"].ace,
input[type="radio"].ace {
    opacity: 0;
    position: absolute;
    z-index: 1;
    /*width: 18px;*/
    /*height: 18px;*/
    cursor: pointer;
}

label input[type="checkbox"].ace,
label input[type="radio"].ace {
    z-index: -100 !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute;
}

input[type="checkbox"].ace:checked,
input[type="radio"].ace:checked,
input[type="checkbox"].ace:focus,
input[type="radio"].ace:focus {
    outline: none !important;
}

input[type="checkbox"].ace+.lbl {
    position: relative;
    display: inline-block;
    margin: 0;
    line-height: 20px;
    min-height: 18px;
    min-width: 18px;
    font-weight: normal;
    cursor: pointer;
}

input[type="checkbox"].ace+.lbl::before {
    cursor: pointer;
    font-family: fontAwesome;
    font-weight: normal;
    content: "\a0";
    background-color: #54ba47;
    background: url(../images/no-check.png);
    border-radius: 0;
    display: inline-block;
    text-align: center;
    height: 20px;
    line-height: 20px;
    min-width: 20px;
    margin-right: 5px;
    position: relative;
    top: -1px;
    border: none;
    background-size: cover !important;
}

input[type="checkbox"].ace:checked+.lbl::before {
    background: url(../images/check.png);
}

input[type="checkbox"].ace:hover+.lbl::before,
input[type="radio"].ace:hover+.lbl::before,
input[type="checkbox"].ace+.lbl:hover::before,
input[type="radio"].ace+.lbl:hover::before {
    border-color: #ff893c;
}

input[type="checkbox"].ace:active+.lbl::before,
input[type="radio"].ace:active+.lbl::before,
input[type="checkbox"].ace:checked:active+.lbl::before,
input[type="radio"].ace:checked:active+.lbl::before {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}

input[type="checkbox"].ace.ace-checkbox-2+.lbl::before,
input[type="radio"].ace.ace-checkbox-2+.lbl::before {
    box-shadow: none;
}

input[type="checkbox"].ace.ace-checkbox-2:checked+.lbl::before,
input[type="radio"].ace.ace-checkbox-2:checked+.lbl::before {
    background-color: #f9a021;
    border-color: #f9a021;
    color: #fff;
}

input[type="checkbox"].ace.checkbox-3+.lbl::before,
input[type="radio"].ace.checkbox-3+.lbl::before {
    box-shadow: none;
}

input[type="checkbox"].ace.checkbox-3:checked+.lbl::before,
input[type="radio"].ace.checkbox-3:checked+.lbl::before {
    background-color: #fff;
    border-color: #c8c8c8;
    color: #5db75d;
}

input[type="checkbox"].ace:disabled+.lbl::before,
input[type="radio"].ace:disabled+.lbl::before,
input[type="checkbox"].ace[disabled]+.lbl::before,
input[type="radio"].ace[disabled]+.lbl::before,
input[type="checkbox"].ace.disabled+.lbl::before,
input[type="radio"].ace.disabled+.lbl::before {
    background-color: #ddd !important;
    border-color: #ccc !important;
    box-shadow: none !important;
    color: #bbb;
}

.checkbox label input[type="checkbox"].ace+.lbl,
.radio label input[type="radio"].ace+.lbl {
    margin-left: -10px;
}

input.ace+.lbl.padding-16::before {
    margin-right: 16px;
}

input.ace+.lbl.padding-14::before {
    margin-right: 14px;
}

input.ace+.lbl.padding-12::before {
    margin-right: 12px;
}

input.ace+.lbl.padding-10::before {
    margin-right: 10px;
}

input.ace+.lbl.padding-8::before {
    margin-right: 8px;
}

input.ace+.lbl.padding-6::before {
    margin-right: 6px;
}

input.ace+.lbl.padding-4::before {
    margin-right: 4px;
}

input.ace+.lbl.padding-2::before {
    margin-right: 2px;
}

input.ace+.lbl.padding-0::before {
    margin-right: 0px;
}


/**
input[type=radio].ace @{lbl}::before {
	border-radius:100%;
	font-size: 34px;
	font-family: Helvetica, Arial, "Sans-Serif";//looks better but incosistent
	line-height: 13px;
}
*/

input[type="radio"].ace+.lbl::before {
    border-radius: 100%;
    font-size: 10px;
    font-family: FontAwesome;
    text-shadow: 0 0 1px #32a3ce;
    line-height: 15px;
    height: 17px;
    min-width: 17px;
}

input[type="radio"].ace:checked+.lbl::before {
    content: "\f111";
}


/* CSS3 on/off switches */

input[type="checkbox"].ace.ace-switch {
    width: 55px;
    height: 25px;
}

input[type="checkbox"].ace.ace-switch+.lbl {
    margin: 0 4px;
    min-height: 24px;
}

input[type="checkbox"].ace.ace-switch+.lbl::before {
    font-family: "Open Sans";
    content: "ON\a0\a0\a0\a0\a0\a0\a0\a0\a0OFF";
    color: #999;
    text-shadow: 0 0 0 #999;
    font-weight: normal;
    font-size: 11px;
    line-height: 17px;
    height: 20px;
    overflow: hidden;
    border-radius: 12px;
    background-color: #f5f5f5;
    -moz-box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.15);
    border: 1px solid #ccc;
    text-align: left;
    float: left;
    padding: 0;
    width: 52px;
    text-indent: -21px;
    margin-right: 0;
    -webkit-transition: all text-indent 0.3s ease ease-out;
    -moz-transition: all text-indent 0.3s ease ease-out;
    -o-transition: all text-indent 0.3s ease ease-out;
    transition: all text-indent 0.3s ease ease-out;
    -webkit-transition: text-indent 0.3s ease;
    -o-transition: text-indent 0.3s ease;
    transition: text-indent 0.3s ease;
    top: auto;
    background: none;
}

input[type="checkbox"].ace.ace-switch+.lbl::after {
    font-family: "Open Sans";
    content: "III";
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0;
    color: #aaa;
    text-shadow: none;
    background-color: #fff;
    border-radius: 100%;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    position: absolute;
    top: -2px;
    left: -3px;
    -moz-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.3);
    -webkit-transition: all left 0.3s ease ease-out;
    -moz-transition: all left 0.3s ease ease-out;
    -o-transition: all left 0.3s ease ease-out;
    transition: all left 0.3s ease ease-out;
    -webkit-transition: left 0.3s ease;
    -o-transition: left 0.3s ease;
    transition: left 0.3s ease;
}

input[type="checkbox"].ace.ace-switch:checked+.lbl::before {
    text-indent: 8px;
    color: #fff;
    text-shadow: 0 0 0 #fff;
    background-color: #8ab2c9;
    border-color: #6a8ca8;
}

input[type="checkbox"].ace.ace-switch:checked+.lbl::after {
    left: 34px;
    background-color: #fff;
    color: #98a0a5;
}

input[type="checkbox"].ace.ace-switch.ace-switch-2+.lbl::before {
    content: "YES\a0\a0\a0\a0\a0\a0\a0\a0\a0NO";
}

input[type="checkbox"].ace.ace-switch.ace-switch-3+.lbl::after {
    font-family: FontAwesome;
    font-size: 13px;
    line-height: 22px;
    content: "\f00d";
    top: -1px;
    text-shadow: none;
    padding: 0;
    text-align: center;
    color: #bbb;
    letter-spacing: 0;
}

input[type="checkbox"].ace.ace-switch.ace-switch-3:checked+.lbl::after {
    content: "\f00c";
    color: #8ab2c9;
    text-shadow: none;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4,
input[type="checkbox"].ace.ace-switch.ace-switch-5 {
    width: 60px;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4+.lbl::before,
input[type="checkbox"].ace.ace-switch.ace-switch-5+.lbl::before {
    content: "ON\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0OFF";
    font-size: 12px;
    line-height: 23px;
    height: 24px;
    overflow: hidden;
    border-radius: 12px;
    background-color: #8b9aa3;
    border: 1px solid #8b9aa3;
    color: #fff;
    width: 56px;
    text-indent: -25px;
    text-shadow: 0 0 0 #fff;
    display: inline-block;
    position: relative;
    box-shadow: none;
    -webkit-transition: all all 0.3s ease ease-out;
    -moz-transition: all all 0.3s ease ease-out;
    -o-transition: all all 0.3s ease ease-out;
    transition: all all 0.3s ease ease-out;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4+.lbl::after,
input[type="checkbox"].ace.ace-switch.ace-switch-5+.lbl::after {
    content: "III";
    font-size: 11px;
    position: absolute;
    top: 2px;
    left: 2px;
    letter-spacing: 0;
    width: 20px;
    height: 20px;
    line-height: 19px;
    text-shadow: none !important;
    color: #939393;
    background-color: #fff;
    -webkit-transition: all all 0.3s ease ease-out;
    -moz-transition: all all 0.3s ease ease-out;
    -o-transition: all all 0.3s ease ease-out;
    transition: all all 0.3s ease ease-out;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4:checked+.lbl::before,
input[type="checkbox"].ace.ace-switch.ace-switch-5:checked+.lbl::before {
    text-indent: 9px;
    background-color: #468fcc;
    border-color: #468fcc;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4:checked+.lbl::after,
input[type="checkbox"].ace.ace-switch.ace-switch-5:checked+.lbl::after {
    left: 34px;
    background-color: #fff;
    color: #848484;
}

input[type="checkbox"].ace.ace-switch.ace-switch-5+.lbl::before {
    content: "YES\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0NO";
}

input[type="checkbox"].ace.ace-switch.ace-switch-5:checked+.lbl::before {
    text-indent: 8px;
}

input[type="checkbox"].ace.ace-switch.ace-switch-6+.lbl {
    position: relative;
}

input[type="checkbox"].ace.ace-switch.ace-switch-6+.lbl::before {
    font-family: FontAwesome;
    content: "\f00d";
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    box-shadow: none;
    border-width: 0;
    font-weight: lighter;
    font-size: 16px;
    border-radius: 12px;
    display: inline-block;
    background-color: #888;
    color: #f2f2f2;
    width: 52px;
    height: 22px;
    line-height: 21px;
    text-indent: 32px;
    -webkit-transition: all background 0.1s ease ease-out;
    -moz-transition: all background 0.1s ease ease-out;
    -o-transition: all background 0.1s ease ease-out;
    transition: all background 0.1s ease ease-out;
    -webkit-transition: background 0.1s ease;
    -o-transition: background 0.1s ease;
    transition: background 0.1s ease;
}

input[type="checkbox"].ace.ace-switch.ace-switch-6+.lbl::after {
    content: "";
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    top: 2px;
    left: 3px;
    border-radius: 12px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    width: 18px;
    height: 18px;
    text-align: center;
    background-color: #f2f2f2;
    border: 4px solid #f2f2f2;
    -webkit-transition: all left 0.2s ease ease-out;
    -moz-transition: all left 0.2s ease ease-out;
    -o-transition: all left 0.2s ease ease-out;
    transition: all left 0.2s ease ease-out;
    -webkit-transition: left 0.2s ease;
    -o-transition: left 0.2s ease;
    transition: left 0.2s ease;
}

input[type="checkbox"].ace.ace-switch.ace-switch-6:checked+.lbl::before {
    content: "\f00c";
    text-indent: 6px;
    color: #fff;
    border-color: #b7d3e5;
    background-color: #ff893c;
}

input[type="checkbox"].ace.ace-switch.ace-switch-6:checked+.lbl::after {
    left: 32px;
    background-color: #fff;
    border: 4px solid #fff;
    text-shadow: 0 -1px 0 rgba(0, 200, 0, 0.25);
}

input[type="checkbox"].ace.ace-switch.ace-switch-7 {
    width: 75px;
}

input[type="checkbox"].ace.ace-switch.ace-switch-7+.lbl {
    position: relative;
}

input[type="checkbox"].ace.ace-switch.ace-switch-7+.lbl::before {
    content: "OFF\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0ON";
    font-weight: bolder;
    font-size: 13px;
    line-height: 20px;
    background-color: #fff;
    border: 2px solid #aaa;
    border-radius: 0;
    box-shadow: none;
    color: #aaa;
    width: 74px;
    height: 26px;
    line-height: 22px;
    overflow: hidden;
    text-indent: 5px;
    display: inline-block;
    position: relative;
    -webkit-transition: all all 0.2s ease ease-out;
    -moz-transition: all all 0.2s ease ease-out;
    -o-transition: all all 0.2s ease ease-out;
    transition: all all 0.2s ease ease-out;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

input[type="checkbox"].ace.ace-switch.ace-switch-7+.lbl::after {
    content: "\f00d";
    font-family: FontAwesome;
    font-size: 16px;
    position: absolute;
    top: 3px;
    left: 39px;
    width: 32px;
    height: 20px;
    line-height: 18px;
    text-align: center;
    padding: 0;
    text-indent: 0;
    background-color: #aaa;
    color: #fff;
    border-radius: 0;
    box-shadow: none;
    -webkit-transition: all all 0.2s ease-in-out ease-out;
    -moz-transition: all all 0.2s ease-in-out ease-out;
    -o-transition: all all 0.2s ease-in-out ease-out;
    transition: all all 0.2s ease-in-out ease-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

input[type="checkbox"].ace.ace-switch.ace-switch-7:checked+.lbl::before {
    color: #468fcc;
    background-color: #fff;
    text-indent: -28px;
    border-color: #6fb3e0;
}

input[type="checkbox"].ace.ace-switch.ace-switch-7:checked+.lbl::after {
    left: 3px;
    content: "\f00c";
    background-color: #468fcc;
    color: #fff;
}

input[type="checkbox"].ace.ace-switch+.lbl[data-lbl]::before {
    content: attr(data-lbl);
}

input[type="checkbox"].ace.ace-switch.btn-empty+.lbl::after {
    content: "";
}

input[type="checkbox"].ace.ace-switch.btn-rotate+.lbl::after {
    content: "\2261";
    line-height: 20px;
    font-size: 17px;
}

input[type="checkbox"].ace.ace-switch-4.btn-rotate+.lbl::after,
input[type="checkbox"].ace.ace-switch-5.btn-rotate+.lbl::after {
    line-height: 17px;
}

input[type="checkbox"].ace.ace-switch.btn-flat+.lbl::before,
input[type="checkbox"].ace.ace-switch.btn-flat+.lbl::after {
    border-radius: 0 !important;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4+.lbl::before,
input[type="checkbox"].ace.ace-switch.ace-switch-5+.lbl::before {
    text-indent: -24px;
}

input[type="checkbox"].ace.ace-switch.ace-switch-4:checked+.lbl::before,
input[type="checkbox"].ace.ace-switch.ace-switch-5:checked+.lbl::before {
    text-indent: 7px;
}


/**/

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

.switch input {
    position: absolute;
    opacity: 0;
    filter: alpha(opacity=0);
    display: none;
}

.switch span {
    position: relative;
    width: 46px;
    height: 22px;
    border-radius: 22px;
    background-color: #fff;
    border: 1px solid #eee;
    border-color: rgba(0, 0, 0, 0.1);
    display: inline-block;
    -webkit-transition: background-color 0.2s;
    transition: background-color 0.2s;
}

.switch+span {
    margin-left: 5px;
}

.switch span:after {
    content: "";
    position: absolute;
    background-color: #fff;
    width: 18px;
    left: 1px;
    top: 1px;
    bottom: 1px;
    border-radius: 50%;
    -webkit-box-shadow: 1px 1px 3px rgb(0 0 0 / 25%);
    box-shadow: 1px 1px 3px rgb(0 0 0 / 25%);
    -webkit-transition: left 0.2s;
    transition: left 0.2s;
}

.switch input:checked+span:after {
    left: 25px;
}

.switch input:checked+span {
    background-color: var(--main-color);
}


/**/

.ace-file-input {
    display: block;
    font-size: inherit;
    position: relative;
    height: 30px;
}

.ace-file-input input[type="file"] {
    position: fixed;
    z-index: -2;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    -ms-filter: progid: DXImageTransform.Microsoft.Alpha(opacity=0);
    opacity: 0;
    filter: alpha(opacity=0);
}

.ace-file-input input[type="file"]:focus {
    outline: none;
}

.ace-file-input .ace-file-container {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 30px;
    background-color: #ffffff;
    border: 1px solid #d5d5d5;
    cursor: pointer;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: all all 0.15s ease-out;
    -moz-transition: all all 0.15s ease-out;
    -o-transition: all all 0.15s ease-out;
    transition: all all 0.15s ease-out;
    -webkit-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}

.ace-file-input .ace-file-container:hover {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #f59942;
}

.ace-file-input .ace-file-container:before {
    display: inline-block;
    content: attr(data-title);
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    line-height: 24px;
    text-align: center;
    padding: 0 8px;
    background-color: #6fb3e0;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    border: 2px solid #fff;
    border-left-width: 4px;
    -webkit-transition: all all 0.3s ease-out;
    -moz-transition: all all 0.3s ease-out;
    -o-transition: all all 0.3s ease-out;
    transition: all all 0.3s ease-out;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.ace-file-input .ace-file-container .ace-file-name {
    display: inline-block;
    height: 28px;
    max-width: 80%;
    white-space: nowrap;
    overflow: hidden;
    line-height: 28px;
    color: #888888;
    font-size: 13px;
    vertical-align: top;
    position: static;
    padding-left: 30px;
}

.ace-file-input .ace-file-container .ace-file-name:after {
    display: inline-block;
    content: attr(data-title);
}

.ace-file-input .ace-file-container.selected {
    right: 16px;
}

.ace-file-input .ace-file-container.selected .ace-file-name {
    color: #666666;
}

.ace-file-input .ace-file-container .ace-icon {
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    line-height: 24px;
    width: 26px;
    text-align: center;
    font-family: FontAwesome;
    font-size: 13px;
    border: 2px solid #fff;
    color: #fff;
    -webkit-transition: all all 0.1s ease-out;
    -moz-transition: all all 0.1s ease-out;
    -o-transition: all all 0.1s ease-out;
    transition: all all 0.1s ease-out;
    -webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
    background-color: #d1d1d1;
}

.ace-file-input .ace-file-container.selected .ace-file-name .ace-icon {
    background-color: #efad62;
}

.ace-file-input .ace-file-container.selected .ace-file-name .file-image {
    background-color: #bd7a9d;
}

.ace-file-input .ace-file-container.selected .ace-file-name .file-video {
    background-color: #87b87f;
}

.ace-file-input .ace-file-container.selected .ace-file-name .file-audio {
    background-color: #8b7ac9;
}

.ace-file-input .ace-file-container.selected .ace-file-name .file-archive {
    background-color: #efad62;
}

.ace-file-input .ace-file-container.hide-placeholder:before {
    display: none;
}

.ace-file-input a:hover {
    text-decoration: none;
}

.ace-file-input .remove {
    position: absolute;
    right: -8px;
    top: 6px;
    display: none;
    width: 17px;
    text-align: center;
    height: 17px;
    line-height: 15px;
    font-size: 11px;
    font-weight: normal;
    background-color: #fb7142;
    -webkit-border-top-right-radius: 100%;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 100%;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    border-top-right-radius: 100%;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border-radius: 100%;
    color: #fff;
    text-decoration: none;
}

.ace-file-input .ace-file-container.selected+.remove {
    display: inline-block;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .ace-file-input input[type="file"] {
        position: absolute;
        width: 0;
        height: 0;
    }
}

.ace-file-input input[type="file"].disabled+.ace-file-container,
.ace-file-input input[type="file"][disabled]+.ace-file-container,
.ace-file-input input[type="file"][readonly]+.ace-file-container {
    cursor: not-allowed;
    background-color: #eee;
}

.ace-file-input input[type="file"].disabled+.ace-file-container:hover,
.ace-file-input input[type="file"][disabled]+.ace-file-container:hover,
.ace-file-input input[type="file"][readonly]+.ace-file-container:hover {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #e3e3e3;
}

.ace-file-input input[type="file"].disabled+.ace-file-container:before,
.ace-file-input input[type="file"][disabled]+.ace-file-container:before,
.ace-file-input input[type="file"][readonly]+.ace-file-container:before {
    border-color: #eee;
    background-color: #a1aaaf;
}

.ace-file-input input[type="file"][readonly]+.ace-file-container {
    cursor: default;
}

.ace-file-input .ace-file-overlay {
    position: absolute;
    top: -2px;
    bottom: -2px;
    left: -2px;
    right: -10px;
    z-index: 99;
    background-color: rgba(0, 0, 0, 0.5);
}

.ace-file-input .ace-file-overlay>.overlay-content {
    display: inline-block;
    position: relative;
    top: 10%;
    left: 0;
    right: 0;
    text-align: center;
}

.ace-file-multiple {
    height: auto;
}

.ace-file-multiple .ace-file-container {
    position: relative;
    height: auto;
    border: 1px dashed #aaaaaa;
    border-radius: 4px;
    text-align: center;
}

.ace-file-multiple .ace-file-container:before {
    display: inline-block;
    content: attr(data-title);
    position: relative;
    right: 0;
    left: 0;
    margin: 12px;
    line-height: 22px;
    background-color: #fff;
    color: #ccc;
    font-size: 18px;
    font-weight: bold;
    border-width: 0;
}

.ace-file-multiple .ace-file-container.selected .ace-file-name .ace-icon {
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    line-height: 24px;
    width: 26px;
    text-align: center;
    font-family: FontAwesome;
    font-size: 13px;
    border: 2px solid #fff;
    color: #fff;
    -webkit-transition: all all 0.1s ease-out;
    -moz-transition: all all 0.1s ease-out;
    -o-transition: all all 0.1s ease-out;
    transition: all all 0.1s ease-out;
    -webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}

.ace-file-multiple .ace-file-container .ace-file-name {
    position: relative;
    display: block;
    padding: 0;
    height: auto;
    width: auto;
    max-width: 100%;
    margin: 0 4px;
    border-bottom: 1px solid #ddd;
    text-align: left;
}

.ace-file-multiple .ace-file-container .ace-file-name:first-child {
    margin-top: 1px;
}

.ace-file-multiple .ace-file-container .ace-file-name:last-child {
    border-bottom-width: 0;
    margin-bottom: 1px;
}

.ace-file-multiple .ace-file-container .ace-file-name img {
    padding: 2px;
    border: 1px solid #d7d7d7;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    margin: 4px 8px 4px 1px;
}

.ace-file-multiple .ace-file-container .ace-file-name:after {
    display: none;
}

.ace-file-multiple .ace-file-container.selected .ace-file-name:after {
    display: inline-block;
    white-space: pre;
}

.ace-file-multiple .ace-file-container .ace-file-name img+.ace-icon,
.ace-file-multiple .ace-file-container.selected .ace-file-name img+.ace-icon {
    display: none;
}

.ace-file-multiple .remove {
    right: -11px;
    top: -11px;
    border: 3px solid #bbb;
    border-radius: 32px;
    background-color: #fff;
    color: red;
    width: 23px;
    height: 23px;
    line-height: 15px;
}

.ace-file-multiple .ace-file-container.selected+.remove:hover {
    border-color: #f4c0b1;
}

.ace-file-multiple .ace-file-overlay {
    position: absolute;
    top: -12px;
    bottom: -6px;
    left: -12px;
    right: -12px;
}

.ace-file-multiple .ace-file-overlay>.overlay-content {
    top: 20%;
}

.ace-file-multiple .ace-file-container .ace-file-name .ace-icon {
    position: relative;
    display: block;
    text-align: center;
    height: auto;
    line-height: 64px;
    width: auto;
    font-size: 64px;
    color: #d5d5d5;
    margin: 4px 0;
    background-color: transparent;
}

.ace-file-multiple .ace-file-container.selected:after {
    display: none;
}

.ace-file-multiple .ace-file-container.selected .ace-file-name .ace-icon {
    position: relative;
    margin-right: 4px;
    margin-left: 2px;
    line-height: 24px;
}

.ace-file-multiple .ace-file-container .ace-file-name.large {
    text-align: center;
    border-bottom: 1px solid #222;
    margin: 0 1px 3px;
}

.ace-file-multiple .ace-file-container .ace-file-name.large:last-child {
    margin: 0 1px;
}

.ace-file-multiple .ace-file-container .ace-file-name.large:after {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 4px;
    background-color: #555;
    color: #fff;
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    -webkit-opacity: 0.8;
    -ms-filter: progid: DXImageTransform.Microsoft.Alpha(opacity=80);
    opacity: 0.8;
    filter: alpha(opacity=80);
}

.ace-file-multiple .ace-file-container .ace-file-name.large img {
    border-width: 0;
    margin: 0 !important;
    padding: 0;
}

.ace-file-multiple input[type="file"].disabled+.ace-file-container:hover,
.ace-file-multiple input[type="file"][disabled]+.ace-file-container:hover,
.ace-file-multiple input[type="file"][readonly]+.ace-file-container:hover {
    border-color: #aaa;
}

.ace-file-multiple input[type="file"].disabled+.ace-file-container:before,
.ace-file-multiple input[type="file"][disabled]+.ace-file-container:before,
.ace-file-multiple input[type="file"][readonly]+.ace-file-container:before {
    background-color: transparent;
}

.ace-file-multiple input[type="file"].disabled+.ace-file-container .ace-icon,
.ace-file-multiple input[type="file"][disabled]+.ace-file-container .ace-icon,
.ace-file-multiple input[type="file"][readonly]+.ace-file-container .ace-icon {
    border-color: #eee;
}


/*font  ace */

.bg_header_order {
    background: #478ac7;
    color: #fff;
}

.opt_permission label.none-bold .lbl {
    padding-left: 5px;
}

.opt_permission label.none-bold {
    padding-top: 5px;
    padding-bottom: 5px;
}

span.circle_price {
    background: none repeat scroll 0 0 #458cc7;
    border-radius: 50%;
    color: #fff;
    font-family: "Times New Roman", Times, serif;
    font-size: 20px;
    font-weight: 300;
    margin-left: 5px;
    margin-right: 5px;
    padding: 4px 11px;
}

ul.cate_menu a.btn_bottom {
    background: none repeat scroll 0 0 #cccccc;
    border-radius: 4px;
    clear: both;
    bottom: 3px;
    color: #fff;
    display: block;
    font-size: 18px;
    height: 26px;
    padding: 3px;
    position: absolute;
    right: 3px;
    text-align: center;
    top: auto;
    vertical-align: middle;
    cursor: pointer;
}

h4.title_item_B {
    border-bottom: 1px solid #e3e4e8;
    color: #458cc7;
    font-size: 23px;
    font-weight: 300;
    padding: 10px 5px;
    position: relative;
    text-align: left;
}

.hold-gid-add {
    padding: 5px;
    position: absolute;
    right: 5px;
    background: #fff;
    overflow: hidden;
    z-index: 200;
    top: 1px;
    width: 250px;
}

.tab-gid,
.tab-list {
    margin-right: 5px;
    margin-top: 10px;
    border-bottom: 2px solid #e3e3e3;
    cursor: pointer;
}

.tab-list-gid {
    border-bottom: none;
}

.wrap-info-in span.btn_bottom,
.wrap-info-in span.btn_top {
    background: none repeat scroll 0 0 #cccccc;
    border-radius: 4px;
    clear: both;
    color: #fff;
    display: block;
    font-size: 18px;
    height: 25px;
    padding: 3px;
    position: absolute;
    right: 3px;
    text-align: center;
    top: 3px;
    vertical-align: middle;
    height: auto;
    cursor: pointer;
}

.wrap-info-in span.btn_top {
    top: 0px;
    background: none;
    color: #ccc;
    font-size: 13px;
}

.wrap-tab-content-price .tab-pane-percent input {
    height: auto !important;
    padding: 10px 12px;
}

.wrap-info-in span.btn_bottom {
    top: 20px;
    background: none;
    color: #ccc;
    font-size: 13px;
}

.wrap-info-in span.btn_bottom:hover,
.wrap-info-in span.btn_top:hover {
    border: 1px solid;
    color: #b92c28;
}

h4.title_item_B div.btn_title .img-circle {
    background: none repeat scroll 0 0 #fff;
    color: #1c517e;
    font-size: 18px;
    font-weight: bolder;
    margin-right: 5px;
    padding: 2px 3px;
    vertical-align: -3px;
}

h4.title_item_B div.btn_title {
    margin-right: 35px;
}

h4.title_item_B div.btn_title.pull-r {
    margin-right: 28px;
}

.btn_title {
    float: right;
}

ul.cate_menu a.item {
    border: 1px solid #cccccc;
    color: #414141;
    display: block;
    text-align: center;
    height: 60px;
    padding: 10px 20px 10px 5px;
    vertical-align: middle;
}


/*earse system*/

div.delete_page p {
    line-height: 25px;
    text-align: center;
}

div.delete_page p.note_icon .icon-cate {
    color: #e41e25;
    font-size: 130px;
}

div.delete_page p.note_big {
    font-size: 14px;
}

div.delete_page p {
    line-height: 25px;
    text-align: center;
}

div.delete_page p.note_title {
    font-weight: bolder;
    margin-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    text-align: left;
}

div.delete_page p {
    line-height: 25px;
    text-align: center;
}

div.delete_page p.note_title {
    font-weight: bolder;
    margin-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    text-align: left;
}

div.delete_page p {
    line-height: 25px;
    text-align: center;
}

.list-group {
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}

.list-group {
    margin-bottom: 20px;
    padding-left: 0;
}

.list-group-item:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

ul.list_delete li {
    cursor: pointer;
    position: relative;
}

.list-group-item {
    background-color: #fff;
    border: 1px solid #ddd;
    display: block;
    margin-bottom: -1px;
    padding: 10px 15px;
    position: relative;
}

div.delete_page p.note_bold {
    font-weight: bolder;
    padding-left: 10px;
    text-align: left;
}

ul.list_delete span.fa-check {
    background: none repeat scroll 0 0 #e41e25;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    padding: 1px;
    position: absolute;
    right: 10px;
    top: 12px;
}

ul.list_delete label {
    position: absolute;
    right: 10px;
}

ul.list_delete a.check .fa-check {
    display: block;
}

div.delete_page p.note_big span {
    font-size: 20px;
    font-weight: bolder;
}


/*earse system*/

tr.root_row {
    background: none repeat scroll 0 0 #a2def6;
    border-top: 2px solid #163c94;
    font-weight: bold;
    text-align: center;
}

table.table tr.sum_row {
    background: none repeat scroll 0 0 #fcdbe0;
    border-top: 2px solid #e41e25;
    color: #e41e25;
}

table.table tr.sum_row {
    background: none repeat scroll 0 0 #fcdbe0;
    border-top: 2px solid #e41e25;
    color: #e41e25;
}

.opacity-2 {
    opacity: 0.2;
}

.opacity-4 {
    opacity: 0.4;
}

.opacity-5 {
    opacity: 0.5;
}

.field #pop_name {}

.field #code {}

div.inp_product_name input,
div.inp_product_code input {
    width: 100% !important;
    background-color: rgba(0, 0, 0, 0);
    background-position: center bottom, center calc(99%);
    background-repeat: no-repeat;
    background-size: 0 2px, 100% 1px;
    padding: 0;
    transition: background 0s ease-out 0s;
    color: #565656;
    height: auto;
    background-image: linear-gradient(#707cd2, #707cd2), linear-gradient(rgba(120, 130, 140, 0.3), rgba(120, 130, 140, 0.3));
    border: none;
    font-weight: 300;
    box-shadow: none !important;
    border-radius: 0px;
    margin-top: 3px;
    padding-bottom: 3px;
}

div.inp_product_name input:focus,
div.inp_product_code input:focus {
    background-size: 100% 2px, 100% 1px;
    outline: 0;
    transition-duration: 0.3s;
}

div.lb_product_name {
    font-weight: 300;
    color: #777;
    font-size: 15px;
}

div.inp_product_name {}

div.inp_product_code {}


/*for training mode*/

div.training_line {
    height: 18px;
    background: -webkit-linear-gradient(#e10000, #870000);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#e10000, #870000);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#e10000, #870000);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(#e10000, #870000);
    /* Standard syntax */
    text-align: center;
    color: white;
    position: fixed;
    top: 0;
    z-index: 100;
    bottom: 20px;
}

p#training_bottom {
    margin-bottom: 18px;
}

div.loading_page {
    width: 100%;
    height: 100%;
    z-index: 10;
    background: #ccc;
    opacity: 0.4;
    position: fixed;
    top: 0;
}

div.message {
    width: 40%;
    height: auto;
    top: 30%;
    left: 30%;
    color: #0d0d0d;
    position: fixed;
    z-index: 11;
    font-size: 18px;
    text-align: center;
}

p.menu_name {
    color: #414141;
    text-align: center;
    font-size: 14px;
    margin-bottom: 5px;
    text-transform: uppercase;
}

a.training:hover {
    opacity: 1;
}

a.training {
    font-size: 14px;
    color: white !important;
    float: right;
    opacity: 0.8;
}

.laser-rightTop {
    border-right: 5px solid red;
    border-top: 5px solid red;
    right: 0;
    top: 0;
}

.laser-rightBottom {
    border-bottom: 5px solid red;
    border-right: 5px solid red;
    bottom: 0;
    right: 0;
}

.scanner-laser {
    height: 30px;
    margin: 40px;
    position: absolute;
    width: 30px;
}

.laser-leftBottom {
    border-bottom: 5px solid red;
    border-left: 5px solid red;
    bottom: 0;
    left: 0;
}

.laser-leftTop {
    border-left: 5px solid red;
    border-top: 5px solid red;
    left: 0;
    top: 0;
}

.well {
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
    margin-bottom: 20px;
    min-height: 20px;
    padding: 50px 120px 50px 120px;
}

.search_items {
    /*width: 268px;*/
    position: absolute;
    top: 0;
    right: 0;
}

#reading_code.input-code {
    height: 34px;
    z-index: 1;
}


/*for clone category*/

.modal-full {
    width: 98%;
}

#modal_clone_category.modal {
    z-index: 501;
}

div.panel-body.clone-cat {
    padding: 0;
    height: 400px;
}

div.header-menu {
    padding: 3px;
}

div.hold_items_clone {
    overflow: auto;
    height: 306px;
}

div.modal-footer.clone {
    padding: 8px 8px 0px 0;
}

span.edit_func.icon-cate.active:hover {
    background: none repeat scroll 0 0 #e41e25;
    color: #fff;
}

span.edit_func.icon-cate.active {
    background: none repeat scroll 0 0 #56ba47;
    color: #fff;
}

span.edit_func.icon-cate {
    background: none repeat scroll 0 0 #cccccc;
    border-radius: 4px;
    clear: both;
    color: #fff;
    display: block;
    font-size: 21px;
    padding: 3px;
    text-align: center;
    vertical-align: middle;
    height: 28px;
    width: 28px;
    z-index: 20;
    cursor: pointer;
}

.category_holder {
    padding: 0px 0px;
}

@media (max-width: 767px) {
    .category_holder {
        padding: 0px 2px;
    }
}

table.members input[type="checkbox"] {
    transform: scale(1);
}

a.sortBy,
a.field {
    color: gray;
    cursor: pointer;
    font-size: 16px !important;
    margin-left: 2px;
}

a.sortBy.active,
a.field.active {
    color: VAR(--MAIN-COLOR-HOVER);
}

a.sp_sortBy {
    color: gray;
    cursor: pointer;
}

a.sp_sortBy.active {
    color: VAR(--MAIN-COLOR-HOVER);
}

div.loyalty_holder {
    padding: 8px;
    background: #eeeeee;
    margin-bottom: 10px;
}

#btn-loyalty.f-right {
    float: right;
}

.member-trans {
    background: white none repeat scroll 0 0;
    border: 1px solid #ccc;
    height: 252px;
    overflow: auto;
}

.nt-list-members {
    overflow: auto;
    padding: 0;
    height: 500px;
    border: 1px solid #ccc;
}

div.main_menu {
    background: #fff;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    padding: 10px 0px;
    border-radius: 6px;
}

div.main_menu a {
    display: block;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
}

div.main_menu a span.glyphicon,
div.main_menu a span.icon-cate {
    color: var(--main-color-hover);
    font-size: 52px;
}

div.main_menu a p.menu_name {
    text-align: center;
    color: #414141;
    padding-top: 5px;
    text-transform: uppercase;
    font-size: 14px;
}

#list_tpl_value .list_value {
    margin-top: 10px;
}

.icon-circle {
    background: #3f7eb7;
    padding: 5px;
    color: #fff;
    margin-right: 5px;
    vertical-align: -3px;
    font-weight: bolder;
    border-radius: 50%;
}

.btn-sq {
    padding: 7px 7px;
    margin: 3px 2px;
}

h4.title {
    padding: 10px;
    text-align: center;
    color: #000;
    font-weight: normal;
}

@media (max-width: 767px) {
    h4.title {
        text-align: left;
    }
    h4.title a.btn_brand_sm {
        float: none;
        margin-left: 6px;
    }
}

div.voucher_table_list {
    padding: 0;
    margin-top: 10px;
    height: 500px;
    border: 1px solid #ccc;
}

i.icon-size,
span.icon-size {
    font-size: 40px;
    margin-bottom: 10px;
    margin-top: 10px;
}

div.admin_middle {
    padding: 10px 0 0 !important;
}

ul.store_menu span.fa-check.disabled {
    background: #ccc !important;
}

.introduct .hold_img,
div.introduct a img {
    height: 80px !important;
    margin-top: 5px;
    width: 96px !important;
}

.list_img_sm .hold_img {
    height: 80px;
    margin-top: 5px;
    width: 80px;
}

.introduct .hold_img,
div.introduct a img {
    height: 80px !important;
    margin-top: 5px;
    width: 96px !important;
}

div.list_img_sm a {
    display: inline-flex;
    float: left;
}

div.creat_coupon_L div.img img {
    border: 1px solid #e3e4e8;
    height: auto;
    width: 100%;
    margin: 10px 0;
    max-height: 285px;
}

.modal-header {
    background: var(--main-color);
}

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

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

span.img_func.icon-cate {
    background: #cccccc none repeat scroll 0 0;
    border-radius: 4px;
    clear: both;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 21px;
    height: 28px;
    padding: 3px;
    text-align: center;
    vertical-align: middle;
    z-index: 20;
}

.check-all-shop-applied {
    position: absolute;
    bottom: 66px;
    left: 20px;
}

.height250 {
    height: 250px;
}

ul.store_menu {
    font-size: 14px;
    list-style: outside none none;
    margin: 10px 0;
    padding: 0;
    position: relative;
}

ul.store_menu li {
    width: 31.8%;
    margin-left: 0.7%;
    margin-right: 0.7%;
    float: left;
    font-size: 15px;
    text-align: center;
    color: #458cc7;
    box-sizing: border-box;
    background: #f5f5f5;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(1, #ffffff));
    background: -ms-linear-gradient(bottom, #eeeeee, #ffffff);
    background: -moz-linear-gradient(center bottom, #eeeeee 0%, #ffffff 100%);
    background: -o-linear-gradient(#ffffff, #eeeeee);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
    margin-bottom: 10px;
    position: relative;
}

ul.store_menu a.item {
    border: 1px solid #cccccc;
    color: #414141;
    height: 60px;
    padding: 0px 45px 0px 10px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

ul.store_menu a.check span.fa-check {
    display: block;
}

ul.store_menu span.icon-cate {
    font-size: 25px;
    margin-right: 5px;
    vertical-align: -5px;
}

ul.store_menu span.fa-check {
    background: green none repeat scroll 0 0;
    border-radius: 50%;
    bottom: 5px;
    color: #fff;
    display: none;
    font-size: 25px;
    height: 30px;
    padding: 3px;
    position: absolute;
    right: 0;
    top: auto;
    width: 30px;
}

ul.store_menu span.fa-check.disabled {
    background: #ccc none repeat scroll 0 0 !important;
}

.nt-list-members {
    overflow: auto;
    padding: 0;
    height: 500px;
    border: 1px solid #ccc;
}

.nt-content {
    padding: 0;
}

.nt-blage {
    font-size: 14px;
    width: 20px;
    display: inline-block;
    text-align: center;
}

div.creat_coupon_L .img.holder_product {
    height: 300px;
}

ul.edit_menu {
    border-bottom: 1px solid #e3e4e8;
    list-style: outside none none;
    margin-bottom: 0;
    overflow: hidden;
    padding-left: 0;
}

#modal_add_coupon #percent {
    color: red;
}

#btn-loyalty.f-right {
    float: right;
}

div.modal-add-coupon {
    padding: 0px 0px 10px 0px;
}

.btn.btn-primary.edit {
    padding: 6px;
}

.btn,
.btn label.btn-texttop {
    cursor: pointer;
    -webkit-text-fill-color: initial;
}

.glyphicon {
    -webkit-text-fill-color: initial;
}

.modal-xsmall {
    width: 40%;
}

.price-bill div {
    padding: 0px;
}

div.badge-note {
    height: 42px;
    padding-left: 5px;
    overflow: auto;
}

div.badge-price-list {
    border-bottom: 1px solid #dedede;
    padding: 0;
    text-align: center;
}

div.hd-invoice-info {
    height: auto;
    width: auto;
    padding-left: 3px;
}

div.button-bill button.btn i {
    font-size: 18px;
}

div.button-bill button.btn {
    font-size: 14px;
    padding-bottom: 8px;
}

div.button-bill {
    width: 55%;
    float: left;
}

div.price-bill #topay {
    color: #ec0825;
}

div.price-bill {
    width: 45%;
    float: left;
    border-left: 1px solid #dedede;
    font-size: 14px;
    line-height: 25px;
}

#subCategory button {
    font-size: 12px;
    overflow: hidden;
    padding: 2px;
    text-shadow: 0 0 0 #000 !important;
}

#modal_pay .modal-body {
    background: #f3f2e1;
}

.close_icon_delete_item {
    color: #e6e6e6;
    top: 10px;
    font-size: 19px;
    right: 2px;
}

#icon-txt-search i.i-status {
    font-size: 11px;
}

i.i-status.active {
    background: -webkit-linear-gradient(bottom right, #84e127, #56931a);
    background: -moz-linear-gradient(bottom right, #84e127, #56931a);
    background: linear-gradient(bottom right, #84e127, #56931a);
}

i.i-status {
    border-radius: 50%;
    -webkit-padding: 0.2px 4.8px;
    -moz-padding: 0.2px 6px;
    padding: 0.2px 4.8px;
    opacity: 0.9;
    position: relative;
    bottom: 0;
    right: 0;
    background: -moz-linear-gradient(bottom right, #ff0000, #ab0301);
    background: -webkit-linear-gradient(bottom right, #ff0000, #ab0301);
    background: linear-gradient(to bottom right, #ff0000, #ab0301);
    top: -6.9px;
}

input#cus_search_text {
    padding-right: 35px;
    border-left: 0;
    border-right: 0;
}

input#recent_code {
    border-left: 0;
    border-right: 0;
    background: #fff;
}

input#reading_code {
    border-left: 0;
    border-right: 0;
    background: #fff;
}

input#reading_code {
    border-left: 0;
    border-right: 0;
}

span.quantity_dt,
span.price_dt {
    background: #efefef none repeat scroll 0 0;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: inline-block;
    font-size: 14px;
    padding: 5px 0;
    width: 100%;
    text-align: center;
    cursor: pointer;
    margin-top: 4px;
    color: #000;
}

#cus_search_text[disabled] {
    background: #fff;
}

#detail_order .detail_order_block:nth-child(2n+1),
#tpl_detail_cart .detail_order_block:nth-child(2n+1) {
    background-color: #f9f9f9;
}

#detail_order .detail_order_block:nth-child(2n),
#tpl_detail_cart .detail_order_block:nth-child(2n) {
    background-color: #fff;
}

.badge-sum-items {
    text-align: right;
    padding-top: 10px;
    padding-right: 28px;
    font-weight: bold;
}

.main-retail-right {
    border: 1px solid #ebebeb;
    border-radius: 4px;
    height: 510px;
    overflow: auto;
}

#subCategory h4.text-center {
    font-size: 14px;
}

.btn-group button.root_item {
    overflow: hidden;
}

span.input-group-addon.bg-white {
    cursor: pointer;
}

.icon-add-voucher {
    position: relative;
    right: 2px;
    float: right;
    font-size: 28px;
    color: white;
    border: 1px solid #fff;
    cursor: pointer;
    padding-top: 2px;
    padding-right: 1px;
    padding-left: 1px;
}

.icon-add-voucher:hover {
    border: 1px solid #ccc;
    box-shadow: 1px 1px 1px #ccc;
}

div.search {
    background: #fff;
    border-radius: 6px;
    position: relative;
    border: 1px solid #ccc;
    font-size: 14px;
}

.search_cus a.square_x {
    font-size: 12px;
    position: absolute;
    right: 6px;
    top: 4px;
    padding-top: 0px;
}

div.search span.icon-cate {
    color: #a6a6a6;
    font-size: 20px;
    left: 6px;
    position: absolute;
    top: 6px;
}

div.search input.search_text,
div.search input.reading_code {
    border: 0 none;
    box-sizing: border-box;
    color: #414141;
    width: 99.2%;
    padding: 2px 26px 2px 35px;
    height: 93%;
    margin-top: 1px;
    margin-left: 1px;
}

div.search input#search_order_code {
    padding: 2px 36px 2px 10px;
}

a.icon-other-x {
    background: #cccccc;
    color: #fff;
    border-radius: 15px;
    font-size: 14px;
    text-align: center;
    padding-left: 5px;
    padding-right: 6px;
    padding-top: 6px;
}

.search.search_cus #icon-search-recent-order {
    left: 88%;
    cursor: pointer;
}

.search.search_cus #icon-search-recent-order:hover {
    color: VAR(--MAIN-COLOR-HOVER);
}

td.normal-checkbox .btn.square_x {
    padding: 3px;
    padding-left: 4px;
}

.square_x {
    background: none repeat scroll 0 0 #cccccc;
    border-radius: 15px;
    color: #fff;
    cursor: pointer;
    font-size: 10px;
    text-align: center;
    width: 22px;
    height: 22px;
    border: none;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding-left: 1px;
}

.square_x:hover {
    background: none repeat scroll 0 0 #d9534f;
    color: #fff;
    text-decoration: none;
}

.badge-sum-items .square_x {
    margin-top: 6px;
    position: absolute;
    right: 2px;
    right: 2px;
}

#recent_code[readonly] {
    background: #e3e3e3;
}

.header-online-retail {
    background: #efefef;
    color: #fff;
    padding: 6px 0 4px 0;
}

input#reading_code_online {
    font-size: 12px;
}

div#main_screen_pos {
    margin-bottom: 20px;
}

td.force-left {
    text-align: left;
}

.hd-lable-status,
.hd-status,
.hd-lable-visibled,
.hd-visibled,
.hd-lable-return,
.hd-return {
    min-width: 1px;
    padding: 0;
    float: left;
}

.hd-lable-status {
    width: 18.3%;
}

.hd-status>select#pop_status {
    padding-left: 0;
    padding-right: 0;
}

.hd-status {
    width: 18%;
}

.hd-lable-visibled {
    width: 11%;
    text-align: right;
}

.hd-lable-return {
    width: 14%;
    text-align: right;
}

.hd-visibled {
    width: 18%;
}

.hd-return>select#pop_return {
    padding: 0px;
}

.hd-return {
    width: 18.4%;
    text-align: right;
}

.hd-lb-price,
.hd-price,
.group-sales,
.group-allow-deal {
    float: left;
    width: 18.3%;
}

.group-sales input#pop_sales,
.hd-price input#pop_price {
    width: 100%;
}

.group-sales,
.hd-price {
    width: 23%;
    padding-right: 5px;
}

.group-allow-deal {
    width: 32%;
    padding-top: 5px;
}

.hd-apply-online-store {
    width: 42%;
    float: left;
    min-height: 1px;
}

.hd-online-name {
    width: 58%;
    float: left;
    min-height: 1px;
    padding-right: 5px;
}

.btn-shop-height button {
    height: 80px;
    width: 100%;
    border: 1px solid #ccc;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 12px;
}

.btn-list-shop-close {
    width: 100%;
    height: 40px;
    border-radius: 0px;
    color: #000 !important;
}

.btn-group button.btn {
    border: none;
}

button.root_item {
    border-right: 1px solid #ccc !important;
}

.btn-report-close {
    border-radius: 0px;
}

span.decrement-item {
    color: red;
    float: right;
    display: inline-block;
    position: absolute;
    top: 9px;
    right: 1px;
}

.scan_qrcode_holder {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}

.scan_qrcode_holder img {
    width: 100%;
    max-width: 300px;
    max-height: 300px;
}

#detail_order .detail_order_block.active {
    background: #fef6d4 !important;
}

#btn_add_product {
    padding-left: 0px;
    padding-right: 0px;
}

.header-collection.bg-header-pay {
    background: #6b6b6b;
    height: 40px;
}

.header-collection.bg-header-pay h4 {
    font-size: 16px;
    text-transform: capitalize;
}

div.search.search_cus.online {
    margin-right: 0px !important;
    margin-left: 14px;
}

div.hd-func-onl>.price-bill-onl {
    padding-top: 16px !important;
    border-left: 1px solid #ebebeb;
}

div.hd-func-onl>.col-sm-6 {
    padding: 0px;
}

div.hd-func-onl {
    padding: 0;
    border-top: 1px solid #ebebeb;
}

div.hd-func-onl>div.hd-btn-onl>div.col-sm-12 {
    padding: 0px;
}

div.hd-func-onl>div.hd-btn-onl>div.col-sm-12>div.col-sm-6 {
    padding-left: 2px;
    padding-right: 2px;
}

div.hd-note-onl {
    height: 34px;
    border-top: 1px solid #ebebeb;
    overflow: auto;
}

div.footer-main .col-btn-func {
    float: left;
    width: 19.99%;
    padding-left: 3px;
    padding-right: 3px;
}

div.footer-main .col-btn-func.first {
    padding-left: 0px;
}

.item_sku_edit span.btn_edit_icon {
    top: 0;
    right: 16px;
}

.item_sku_edit span.btn_delete_icon {
    top: 3px;
    right: 16px;
}

div#shifts_holder {
    min-height: 420px;
}

div.expire_date {
    height: 105px;
    border: 3px solid VAR(--MAIN-COLOR-HOVER);
}

div.expire_date p.date {
    margin: 0;
    font-size: 16px;
    text-align: center;
}

div.expire_date p.day_left {
    font-size: 14px;
    text-align: center;
}

div.expire_date p.title {
    font-size: 18px;
    text-align: center;
    color: VAR(--MAIN-COLOR-HOVER);
}

fieldset.option-print {
    margin-top: 10px;
    padding-left: 26px;
}

fieldset.option-print legend {
    padding: 5px;
    margin-bottom: 0px;
}

div.left-printing {
    background: #fff;
    padding: 0;
    padding-bottom: 16px;
    margin-top: 5px;
    margin-bottom: 5px;
}

div.hd-list-printing {
    background: #fff;
    padding: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 5px 5px 0 0;
    height: 536px;
    overflow: auto;
}

div.hd-print {
    background: #e3e7ea;
}

h4.title-left-print {
    margin-top: 0;
    background: var(--main-color) !important;
    padding: 5px 6px;
    color: #fff;
    font-size: 19px;
    border-radius: 3px 3px 0 0;
}

.L {
    float: left;
}

.R {
    float: right;
}

.hd-search-bl {
    padding-top: 5px;
    padding-bottom: 5px;
}

.ui-autocomplete.ui-front.ui-menu.ui-widget.ui-widget-content.ui-corner-all {
    z-index: 1300;
}

.ui-autocomplete-5 {
    max-height: 144px;
    overflow: auto;
}

#chung_tu_holder {
    text-align: center;
}

#chung_tu_holder img {
    border: 1px solid #efefef;
    margin-left: 10px;
    margin-top: 5px;
    max-height: 220px;
    max-width: 200px;
}

#modal_liabilities .hd-sum span.pay {
    font-weight: bold;
    color: #e70944;
    font-size: 18px;
}

#modal_liabilities .hd-sum span.total {
    font-weight: bold;
    font-size: 18px;
}

#modal_liabilities .hd-table {
    height: 360px;
    overflow: auto;
}

#modal_liabilities {
    text-align: center;
}

.pay-modal {
    width: 600px;
}

div.bl-btn-cash button {
    width: 100%;
}

div.liabilities-history {
    height: 220px;
    overflow: auto;
    padding: 0px;
    margin-top: 5px;
    border: 1px solid #dedede;
}

.liablities-list {
    background: white none repeat scroll 0 0;
    border: 1px solid #ccc;
    height: 292px;
    overflow: auto;
}

tr.disabled.liabilities {
    color: #e9e9e9;
}

tr.active.liabilities td {
    background: #44a6fd !important;
    color: white;
}

#chung_tu_holder span.img_func.icon-cate {
    width: 28px;
    top: 0;
    right: 0;
    position: absolute;
}

#chung_tu_holder span.img_func.icon-cate.icon-other-x {
    top: 30px;
}

ul.history {
    list-style: outside none none;
    margin: 10px;
}

.border-gray {
    border: 1px solid gray;
}

ul.history>li {
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    float: left;
    margin-bottom: 15px;
    margin-left: 0.5%;
    margin-right: 0.5%;
    width: 19%;
}

ul.history a {
    color: #414141;
    display: block;
    position: relative;
    text-decoration: none;
}

ul.history a.check span.fa-check {
    background: #e41e25 none repeat scroll 0 0;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 25px;
    height: 30px;
    padding: 3px;
    position: absolute;
    right: 10px;
    top: 20px;
    width: 30px;
}

ul.history>li div.history_T {
    background: #f4f2f2 none repeat scroll 0 0 padding-box;
    border-radius: 6px 6px 0 0;
    padding: 5px 10px;
}

.border-gray div.history_T,
.border-gray div.history_B {
    background: gray none repeat scroll 0 0 !important;
    color: white !important;
}

ul.history a {
    color: #414141;
}

.border-gray div.history_T,
.border-gray div.history_B {
    background: gray none repeat scroll 0 0 !important;
    color: white !important;
}

ul.history>li div.history_B {
    background: #f4f2f2 none repeat scroll 0 0;
    padding: 0 10px;
}

ul.history>li div.line {
    border-bottom: 1px solid #e3e4e8;
    overflow: hidden;
}

ul.history>li div.line div.line_L ul {
    list-style: outside none square;
    margin-left: -26px;
}

.border-yellow {
    border: 1px solid #d4d443;
}

ul.history .history_co {
    background: #fff none repeat scroll 0 0;
    line-height: 2;
}

ul.history>li div.line div.line_L {
    border-right: 1px solid #e3e4e8;
}

ul.history>li div.line p {
    margin-bottom: 0;
}

p.total_recent_shift>b.green {
    color: #50aa50;
}

p.total_recent_shift>b.blue {
    color: #3172aa;
}

div.modal-header .bootstrap-dialog-title {
    background: none repeat scroll 0 0 padding-box var(--main-color);
    border-radius: 3px 3px 0 0;
    color: #fff;
    font-weight: 300;
    padding: 14px 0px 14px 14px;
    text-align: center;
    text-transform: uppercase;
    font-size: 20px !important;
    margin: 0px;
    padding: 0;
}

.lb-liabilities {
    color: #2e6da3;
    margin-top: 5px;
    text-align: center;
    font-weight: bold;
}

.lb-left {
    color: red;
    margin-top: 5px;
    font-weight: bold;
    text-align: center;
}

.header-table-inventory {
    font-size: 11px;
}

div.lb-create-invoid {
    font-size: 16px;
    text-align: center;
    padding: 0;
}

.mp-head {
    width: auto;
    float: right;
    padding: 0px 8px;
    border-left: 1px solid;
    margin: 1px 0px;
}

.mp-head.Foo {
    border-left: none !important;
}

.hd-info-head {
    padding: 0;
    line-height: 1.2;
    font-size: 14px;
}

.hd-info-head span#holder_noti {
    margin-top: 0px !important;
    display: inline-table;
}

.hd-l-icon-lb {
    margin-top: 5px;
    text-align: center;
}

.hd-l-icon-lb button {
    height: 32px;
    width: 34px;
    margin-top: -4px;
}

#max_debts {
    font-weight: normal;
}

tbody#list_liabilities .active td {
    background: #dbc668;
    color: #fff;
}

.lb-liabilities #max_debts {
    padding-left: 3px;
    padding-right: 3px;
}

div.l-hd-lia {
    padding: 0;
}

div.l-hd-lia div {
    float: left;
}

div.l-hd-lia .hd-update-lia {
    width: 20%;
    min-height: 1px;
}

div.l-hd-lia .hd-lable-lia {
    width: 22%;
    min-height: 1px;
    text-align: right;
    margin-top: 5px;
    padding-right: 3px;
}

div.hd-bt-detail-lia-list {
    width: 40%;
    float: left;
    min-height: 1px;
    padding-left: 50px;
}

div.l-hd-lia .hd-date-lia {
    width: 11.3%;
    min-height: 1px;
}

tr.sub-liabilities-sp {
    height: 40px;
}

tr.sub-liabilities-sp td {
    background: #f4f4f4;
}

td.sub-hd-liabilities {
    padding-left: 26px !important;
    text-align: left;
}

tr.crt-lia-sp td:first-child {
    text-align: left;
}

tr.crt-lia-sp {}

tr.lia-spl td:nth-child(2),
tr.lia-spl td:nth-child(3) {
    padding-top: 12px;
}

tr.lia-spl td:first-child {
    font-weight: bold;
    padding-top: 12px;
}

tr.lia-spl td {
    background: #f3f3f3;
}

span#sum-suggest {
    font-weight: bold;
    color: red;
}

.lia-spl input {
    text-align: center;
}

div.modal-suggest-liabilities {
    min-height: 420px;
}

.glyphicon.glyphicon-remove-circle.x-icon {
    font-size: 18px;
    color: #ddd;
    cursor: pointer;
}

.glyphicon.glyphicon-remove-circle.x-icon:hover {
    color: #e40000;
    opacity: 0.88;
}

tr.view_suggested td:active {
    background: #fef9de;
}

textarea.txt-email-teamplate {
    height: 166px;
}

h4.title.suggested {
    font-size: 23px;
    background: #ccc;
}

span.top-5 {
    display: inline-block;
}

div.head-table-val-inven {
    font-weight: bold;
}

div.hd-sxk-qt {
    text-align: left;
    padding-left: 30px;
}

input#quick_change_quantity.warning {
    color: red;
    font-weight: bold;
}

input#quick_change_quantity {
    text-align: center;
    font-size: 14px;
}

div.quick-change-quantity .modal-dialog.modal-small {
    max-width: 300px;
}

div.multi-left {
    float: left;
    min-height: 1px;
    width: 16%;
}

div.multi-middle {
    float: left;
    min-height: 1px;
    width: 64%;
}

div.multi-right {
    float: left;
    min-height: 1px;
    width: 20%;
    padding-top: 9px;
}

div#popup-discount-holder .tab-pane.fade.in.active {
    display: block;
}

.tab-pane.active {
    display: block;
}

.tab-pane {
    display: none;
}

div#popup-discount-holder .tab-pane.fade,
div#self-popup-discount {
    min-height: 148px;
}

div.nav.nav-pills.nav-justified li:active {
    height: 100%;
}

div.nav.nav-pills.nav-justified li {
    height: 99%;
}

div.btn-lia-pay {}

div.inventory-input label {
    margin: 0 20px;
}

div.inventory-input {
    text-align: center;
    font-size: 16px;
}

li.hd-coffers {
    border-bottom: 1px solid #fff;
    padding: 5px 3px 6px 6px;
    background: #fff;
    color: #e41e25;
    text-align: center;
    margin-bottom: 5px;
}

li.hd-coffers button {
    margin-top: -3px;
    padding: 3px 8px;
}

.hd-coffers>span {
    display: inline-block;
    margin-right: 0px;
    width: 100px;
    text-align: center;
    margin-left: -4px;
    position: relative;
    top: 3px;
    color: var(--main-color);
}

.main_menu_index {
    min-width: 170px;
}

.main_menu_index>li>a {
    padding: 3px 10px;
}

ul.cate_menu a.item.shop {
    padding-right: 25px;
}

.btn-shop-height button {
    white-space: normal;
}

.holder-member-history {
    min-height: 360px;
}

ul.cate_menu.blk-warehouse a.item {
    height: 79px;
    padding-left: 0px;
    padding-right: 24px;
    padding-top: 12px;
}

div.info-receive-onl {
    padding: 0;
    margin-top: 5px;
    border-top: 1px solid #ddd;
    margin-bottom: 5px;
}

.shipping-info {
    height: 26px;
}

.font-size-15 {
    font-size: 15px;
}

#inp_cart_note {
    width: 100%;
}

.inp-info {
    height: 18px;
}

.lb-rec-name,
.lb-rec-mobile,
.lb-rec-address,
.lb-cart-note,
.inp-rec-name,
.inp-rec-mobile,
.inp-rec-address,
.inp-cart-note {
    float: left;
    display: inline-block;
    min-height: 1px;
}

.inp-rec-name input,
.inp-rec-mobile input,
.inp-rec-address input {
    color: black;
}

.lb-rec-name {
    width: 65px;
}

.inp-rec-name {
    width: 200px;
}

.lb-rec-mobile {
    width: 53px;
    text-align: right;
    padding-right: 2px;
}

.inp-rec-mobile {
    width: 98px;
}

.inp-rec-mobile #inp_receive_mobile,
.inp-rec-address input {
    width: 100%;
}

.lb-rec-address {
    width: 65px;
}

.inp-rec-address {
    width: 350px;
}

.lb-cart-note {
    width: 66px;
}

.inp-cart-note {
    width: 336px;
}

.inp-cart-note textarea {
    width: 100%;
    height: 36px;
    border: none;
    border-left: 1px solid #ccc;
}

li.tab-panel span {
    color: red;
}

li.tab-panel a {
    padding: 10px 12px;
}

.lb-client-name,
.lb-client-mobile,
.lb-client-address,
.lb-client-date,
.lb-client-email,
.inp-client-name,
.inp-client-mobile,
.inp-client-address,
.inp-client-date,
.inp-client-email {
    float: left;
    display: inline-block;
    min-height: 1px;
}

.inp-client-name input,
.inp-client-mobile input,
.inp-client-address input,
.inp-client-date input,
.inp-client-email input {
    width: 100%;
    color: black;
}

.lb-client-name {
    width: 62px;
}

.inp-client-name {
    width: 198px;
}

.lb-client-date {
    width: 82px;
    text-align: right;
    padding-right: 2px;
}

.inp-client-date {
    width: 72px;
}

.lb-client-email {
    width: 62px;
}

.inp-client-email {
    width: 200px;
}

.lb-client-mobile {
    width: 56px;
    text-align: right;
    padding-right: 2px;
}

.inp-client-mobile {
    width: 96px;
}

.lb-client-address {
    width: 63px;
}

.inp-client-address {
    width: 353px;
}

.onl-update-by {
    height: 26px;
    font-size: 13px;
    padding-right: 0;
}

.inp-info-client {
    height: 18px;
}

input#inp_receive_name {
    width: 169px;
}

input.inp-info-client:disabled {
    background: #ddd;
}

input.inp-info-client,
input.inp-info {
    padding: 0px 2px;
}


/*For delivery*/

div#map {
    width: 100%;
    height: 91%;
}

select.delivery-select {
    height: 30px;
    padding: 2px 3px;
}

span#ddcl-sl_map_shipper span.ui-dropdownchecklist-text {
    font-weight: normal !important;
    color: black !important;
    font-size: 15px;
    padding-top: 2px;
}

div#ddcl-sl_map_shipper-ddw {
    height: 100% !important;
    width: 390px !important;
    z-index: 10000 !important;
}

div#ddcl-sl_map_shipper-ddw .ui-dropdownchecklist-dropcontainer.ui-widget-content {
    height: 100%;
}

div#ddcl-sl_map_shipper-ddw .ui-dropdownchecklist-dropcontainer.ui-widget-content label {
    font-weight: normal !important;
    color: black !important;
    font-size: 12px;
}

div#ddcl-sl_map_shipper-ddw .ui-dropdownchecklist-dropcontainer.ui-widget-content input {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
    margin-left: 5px;
    margin-right: 5px;
}

span.hd-icon-job {
    display: inline-block;
    padding: 5px 6px 3px 6px;
    border: 1px solid #ccc;
    border-radius: 15px;
    font-size: 12px;
}

span.hd-icon-job i.glyphicon-ok {
    color: green;
}

span.hd-icon-job.canceled {
    background: black;
    color: white;
    opacity: 0.66;
}

span.hd-icon-job.done {
    background: green;
    color: white;
}

span.hd-icon-job.done i.glyphicon-ok {
    color: white;
}

span.hd-icon-job i.pending {
    color: #ccc;
    padding: 0 1px;
    line-height: 1.1;
}

.R {
    float: right;
}

.L {
    float: left;
}

.menu-shipping-list {
    margin-top: 36px;
}

.col-centered {
    float: none;
    text-align: left;
    margin: 0px auto !important;
}

div.lb-hd-dt {
    width: 21%;
    text-align: right;
    padding-right: 3px;
    margin-top: 5px;
}

div.inp-hd-dt,
div.lb-hd-dt {
    display: block;
    float: left;
}

div.inp-hd-dt {
    width: 79%;
}

b#txt_deli_id {
    color: #1a7dbc;
}

b#txt_deli_id {
    color: #1a7dbc;
}

input.info-deli:disabled,
textarea.info-deli:disabled {
    color: black;
}

.sp-job-type-1,
.sp-job-type-2,
.sp-job-type--1 {
    display: inline-block;
    padding: 2px 5px;
    min-width: 80px;
    border-radius: 3px;
    font-size: 12px;
}

.sp-job-type-1 {
    background: #4589ca;
    color: white;
}

.sp-job-type-2 {
    background: green;
    color: white;
}

.sp-job-type--1 {
    background: black;
    color: white;
}

.min-height {
    min-height: 520px;
}

#pop_sales {
    padding: 3px;
}

.font13 {
    font-size: 13px;
}

.push-left {
    float: right;
    margin-right: 30px;
}

div.btn-group.push-left {
    margin-right: 25px;
}

@media (max-width: 767px) {
    div.btn-group.push-left {
        margin-right: 0px;
        margin-top: 10px;
    }
    div.btn-group.push-left button {
        width: 50%;
        border-radius: 0px !important;
        margin: 0px !important;
    }
}

.bootstrap-dialog-button-icon.glyphicon-trash {
    margin-right: 5px;
}

.color-36h {
    color: #f7bf48;
}

table.text-center>tr>td {
    text-align: center;
}

div.header_Ce div.bootstrap-select button.btn.dropdown-toggle.btn-default {
    padding-left: 10px;
    padding-right: 10px;
}

div.modal-dialog.modal-treasurer {
    width: 68%;
}

div.treasurer-shop-sl {
    margin-top: -10px;
}

@media (max-width: 767px) {
    div.treasurer-shop-sl {
        margin-top: 0px;
        display: block;
        padding: 0px;
    }
}

tr.strikeout td:before {
    content: " ";
    position: absolute;
    top: 50%;
    left: 0;
    border-bottom: 1px solid #ccc;
    width: 100%;
}

tr.strikeout td:after {
    content: "\00B7";
    font-size: 1px;
}

tr.strikeout td {
    position: relative;
    background: #fff;
    color: black;
}

#list_transactions button.square_x {
    font-size: 9px;
}

label#hd_internal {
    margin-left: 10px;
}

button.btn-popup-ok {
    width: 34px;
    padding: 5px;
    position: absolute;
    right: 18px;
    top: 10px;
}

.border-separate {
    border-top: 1px solid #fff;
    box-shadow: 0 -1px 0 #dedede;
}

.bg-hold-main-content {
    background: #fff;
    border-radius: 5px;
    padding: 8px 0;
}


/* ##### CSS ##### */

ul.cate_menu li a.btn_top {
    position: absolute;
    background: #037dd1;
    border: 1px solid #037dd1;
    color: #fff;
    width: 22px;
    height: 22px;
    font-size: 13px;
    padding: 3px;
    padding-top: 4px;
    right: 10px;
    top: 0px;
    bottom: 0px;
    border-radius: 50px;
    cursor: pointer;
    display: none;
    margin: auto;
}

ul.cate_menu li a.btn_bottom {
    position: absolute;
    background: #f00;
    color: #fff;
    border: 1px solid #f00;
    width: 22px;
    height: 22px;
    font-size: 10px;
    padding: 5px;
    padding-top: 6px;
    left: 10px;
    top: 0px;
    bottom: 0px;
    right: auto;
    border-radius: 50px;
    cursor: pointer;
    display: none;
    margin: auto;
}

ul.cate_menu li:hover a.btn_top {
    display: block;
}

ul.cate_menu li:hover a.btn_bottom {
    display: block;
}

.in_btn_text {
    position: relative;
    top: 0px;
    display: inline-block;
    font-weight: 300;
    margin: 4px 0px 4px 4px;
}

a.btn_brand_sm i {
    position: relative;
    top: 3px;
}

h4.title {
    padding: 20px 5px;
}

.modal-dialog {
    margin: 20px auto 0px;
}

.modal-lg {
    width: 80%;
    margin: 20px auto 0px;
}

textarea.form-control {
    width: 100% !important;
    min-height: 105px;
    padding: 8px;
}

#modal_add_storing .modal-lg {
    width: 90%;
}

.form-control,
textarea,
.input-group-addon,
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: 1px solid #ebebeb !important;
}

.form-control,
textarea {
    min-width: 90px;
}

textarea {
    padding: 6px 10px;
    border-radius: 4px;
}

.form-control {
    padding: 2px 12px;
    font-size: 13px;
}

select.form-control {
    padding: 2px 6px;
}

@media (max-width: 767px) {
    .modal-lg {
        width: calc(100% - 20px) !important;
    }
    .primary-order1 .row.text-center .text-center {
        text-align: left;
    }
}

@media (min-width: 768px) {
    .modal-sm {
        width: 480px;
    }
}

#modal_add_product .modal-body,
#modal_no_category .modal-body {
    padding: 0px 15px;
}

@media (max-width: 767px) {
    #modal_add_product .modal-body,
    #modal_no_category .modal-body {
        padding: 0px 5px;
    }
}

.table-product {
    box-shadow: 0px 0px 2px #999;
    padding: 12px 12px 17px 12px;
    margin: 15px 0px;
    background: #fff;
}

.table-product h2.title {
    font-size: 20px;
    font-weight: 300;
    color: #555;
    margin: 14px 0px 0px 5px;
    padding-bottom: 9px;
    cursor: pointer;
}

.table-product h2.title a {
    color: #555;
    display: block;
}

div.pop_up_T,
div.pop_up_t,
.bootstrap-dialog-header,
.modal-header.noborder>h4,
h4#title_menu {
    background: none repeat scroll 0 0 padding-box var(--main-color);
    border-radius: 3px 3px 0 0;
    color: #fff;
    font-weight: 300;
    padding: 14px 0px 14px 14px;
    text-align: center;
    text-transform: uppercase;
    font-size: 20px;
    margin: 0px;
}

.modal-header .bootstrap-dialog-header .close {
    text-shadow: none;
    color: #fff;
    background: url(../images/icon.png) no-repeat scroll -149px -494px rgba(0, 0, 0, 0);
    cursor: pointer;
    display: block;
    height: 16px;
    position: absolute;
    right: 15px;
    top: 21px !important;
    width: 16px;
    opacity: 1;
    text-indent: -99999px;
}

.label_name {
    font-weight: 300;
    color: #222;
    font-size: 15px;
    display: block;
    margin-top: 10px;
    margin-bottom: 6px;
}

#name_page_checkbox .label_name {
    margin-top: 5px;
    color: #666;
    font-size: 14px;
}

#modal_add_banner .ncc_radio label {
    margin-top: 0px;
    color: #666;
    font-size: 14px;
    padding: 1px 0;
}

.label_name+.field_L1 {
    margin-top: 9px;
    margin-bottom: 5px;
}

.label_name1 {
    margin-top: 7px;
    margin-bottom: 5px;
    display: block;
    font-size: 14px;
    color: #333;
}

.input_name {
    position: relative;
}

.wrap_name {
    padding: 0px 4px;
}

.input-check {
    color: #888;
    margin-top: -2px;
}

.avatar_thumbs .item {
    max-width: 200px;
}

.avatar_thumbs .item.item_album_add .item {
    max-width: inherit;
}

.avatar_thumbs .item.item_album_add .item:nth-child(2) {
    padding-left: 0;
}

@media(min-width: 992px) {
    .avatar_thumbs .item.item_album_add .item {
        width: 20%;
    }
}

#multiple_image .avatar_thumbs .item {
    max-width: inherit;
    margin-bottom: 8px;
    border: 1px dashed #E3E3E3;
    padding-bottom: 4px;
}

#multiple_image .avatar_thumbs .item .wrap_name {
    padding: 2px 0px;
}

#multiple_image .avatar_thumbs .item .wrap_name .input_name {}

#multiple_image .remove_image {
    position: absolute;
    right: 0;
    top: -8px;
    z-index: 2;
    color: #fff;
    background: red;
    width: 20px;
    height: 20px;
    text-align: center;
    border-radius: 50px;
    font-size: 13px;
    cursor: pointer;
}

.avatar_thumbs .item.item100 {
    max-width: 100%;
}

.avatar_thumbs .item>a {
    display: block;
    height: 0px;
    position: relative;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    padding-bottom: 100%;
    background: #f1f1f1;
    margin: 4px 0px;
}

.avatar_thumbs .item>a .fa-camera {
    font-size: 50px;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    width: 54px;
    height: 50px;
}

@media (max-width: 767px) {
    .avatar_thumbs .item>a {}
    .mce-panel {
        max-width: 100% !important;
    }
}

.avatar_thumbs .item>a span {
    color: #54ba47;
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    display: none;
}

.avatar_thumbs .item>a:hover {
    background: #ddd;
}

.avatar_thumbs .item>a:hover span {
    display: block;
}

.avatar_thumbs .item>a img,
.avatar_thumbs-s>span img {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.avatar_thumbs .item>a:hover img {
    transform: scale(0.9);
}

.avatar_thumbs_album>.item {
    max-width: none;
}

.avatar_thumbs_album>.item>a {
    width: 80px;
    height: 80px;
    padding: 0;
    border: none;
}

.avatar_thumbs_album>.item>.item {
    max-width: 186px;
}

.mce-panel.mce-tinymce.mce-container {
    width: 100%;
}

.mce-window {}

.table-product .panel-default {
    border: none;
    box-shadow: none;
    margin: 0px;
}

.table-product .panel-body {
    padding: 0px;
    margin-top: 12px;
}

.table-product .panel-heading {
    padding: 0px;
    background: none;
    border: none;
}

.table-product .panel-body ul {
    padding: 0px;
}

.table-product .panel-body ul li:first-child {
    border-top: 1px solid #ddd;
}

.table-product .panel-body ul li {
    list-style-type: none;
    border-bottom: 1px solid #ddd;
    padding: 18px 10px;
}

.table-product .panel-body ul li .name {
    border: 1px solid #ddd;
    display: block;
    text-align: center;
    padding: 11px 0px 10px;
    color: #666;
    font-weight: 300;
    font-size: 15px;
    height: 44px;
    border-radius: 2px;
    outline: none;
    width: 100%;
}

.table-product .panel-body ul li .info,
.tags.info {
    border: 1px solid #ddd;
    display: block;
    text-align: left;
    color: #666;
    font-weight: 300;
    font-size: 15px;
    min-height: 44px;
    border-radius: 2px;
    padding: 0px 3px;
}

.table-product .panel-body ul li .info span,
.tags.info span {
    background: #55ba47;
    color: #fff;
    margin-right: 4px;
    display: inline-block;
    height: 35px;
    line-height: 35px;
    padding: 0px 20px;
    font-style: italic;
    position: relative;
    border-radius: 2px;
}

.table-product .panel-body ul li .info span i,
.tags.info span i {
    position: absolute;
    top: 3px;
    right: 4px;
    font-style: initial;
    font-weight: 300;
    line-height: normal;
    font-size: 10px;
    text-transform: uppercase;
    cursor: pointer;
}

.table-product .panel-body ul li .info input,
.tags.info input {
    height: 42px;
    padding-left: 5px;
    border: none;
    padding: 0px 5px;
}

.table-product .panel-body ul li .info input:focus,
.tags.info input:focus {
    border: none;
    outline: none;
}

.tags .ui-helper-hidden-accessible {
    display: none !important;
}

.table-product .panel-body .view_more {
    background-image: -webkit-linear-gradient(top, #56ba47 0%, #419641 100%);
    background-image: -o-linear-gradient(top, #56ba47 0%, #419641 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#56ba47), to(#419641));
    background-image: linear-gradient(to bottom, #56ba47 0%, #419641 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ff56BA47', endColorstr='#ff419641', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
    background-repeat: repeat-x;
    border-color: #3e8f3e;
    display: inline-block;
    text-align: center;
    padding: 10px 30px;
    border-radius: 8px;
    color: #fff;
    font-style: italic;
    font-size: 16px;
    margin-top: 8px;
    cursor: pointer;
}

.table_version thead tr th {
    font-weight: bold;
    color: #555;
    border-bottom: none;
    font-size: 16px;
}

.table_version tbody {}

.table_version tbody tr td {
    vertical-align: middle;
    padding: 16px 8px;
    border-bottom: 1px solid #ddd;
}

.table_version tbody tr td input {
    border: 1px solid #e8e8e8;
    height: 44px;
    width: 100%;
    padding: 8px;
}

.table_version tbody tr td input:focus {
    outline: none;
}

.table_version tbody tr td .avatar {
    display: block;
    border: 1px solid #e8e8e8;
    text-align: center;
    position: relative;
    height: 46px;
    overflow: hidden;
}

.table_version tbody tr td .avatar img {
    height: 44px;
    display: inline-block;
}

.table_version tbody tr td .avatar span {
    display: none;
    position: absolute;
    top: 0px;
    right: 5px;
    color: #54ba47;
}

.table_version tbody tr:hover td .avatar span {
    display: block;
}

.btn-success {
    box-shadow: none;
}

.btn-success1 {
    margin: 30px 0px;
    cursor: pointer;
    text-align: right;
}

.btn-success1 a {
    background: #56ba47;
    border: 1px solid #56ba47 !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff;
    padding: 6px 12px;
    position: relative;
}

.btn-success1 a.close {
    background: #d9534f !important;
    border: 1px solid #d9534f !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff;
    padding: 6px 12px;
    opacity: 1;
    font-weight: 400;
    text-shadow: none;
    font-size: 14px;
    float: none;
    right: 0px;
    top: 0px;
    line-height: 1.42857143;
    text-align: center;
}

.btn img {
    height: 14px;
    width: auto;
    margin-right: 6px;
    position: relative;
    top: -2px;
}

.btn i {
    margin-right: 0px;
}

.btn-main {
    background: var(--main-color);
    border: 1px solid var(--main-color) !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

.btn-main:hover {
    background: var(--main-color-hover);
    border: 1px solid var(--main-color-hover) !important;
}

body .btn-success,
#btn_add_order {
    background: #56ba47 !important;
    border: 1px solid #56ba47 !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

body .btn-success:hover,
#btn_add_order:hover {
    background: #4ea940 !important;
    border: 1px solid #4ea940 !important;
}

body .btn-default {
    background: #eee;
    border: 1px solid #eee !important;
    border-radius: 3px;
    box-shadow: none;
    color: #000 !important;
    padding: 6px 12px;
    text-shadow: none;
}

body .btn-default:hover {
    background: #ddd;
    border: 1px solid #ddd !important;
}

body .btn-info {
    background: #2aabd2 !important;
    border: 1px solid #2aabd2 !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

body .btn-info:hover {
    background: #259dc1 !important;
    border: 1px solid #259dc1 !important;
}

body .btn-primary {
    background: #037dd1 !important;
    border: 1px solid #037dd1 !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

body .btn-primary:hover {
    background: #0473bf !important;
    border: 1px solid #0473bf !important;
}

body .btn-warning {
    background: #eb9316 !important;
    border: 1px solid #eb9316 !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

body .btn-warning:hover {
    background: #da8814 !important;
    border: 1px solid #da8814 !important;
}

body .btn-danger {
    background: #d9534f !important;
    border: 1px solid #d9534f !important;
    border-radius: 3px;
    box-shadow: none;
    color: #fff !important;
    padding: 6px 12px;
}

body .btn-danger:hover {
    background: #c9302c !important;
    border: 1px solid #c9302c !important;
}


/**/

.table_no_category tbody tr td .avatar {
    display: block;
    border: 1px solid #e8e8e8;
    background: #fff;
    text-align: center;
    position: relative;
    width: 140px;
    height: 154px;
}

.table_no_category tbody tr td .avatar img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
}

.table_no_category thead tr th {
    font-weight: bold;
    color: #555;
    border-bottom: none;
    font-size: 16px;
}

.table_no_category tbody tr:hover {
    background: #f1f1f1;
}

.table_no_category tbody tr td {
    vertical-align: top;
    padding: 16px 8px;
    border-bottom: 1px solid #ddd;
}

.table_no_category .label_name {
    margin-top: 0px;
}

.table_no_category .input_name {
    margin-bottom: 25px;
}

.modal .table_no_category .btn {
    margin-top: 0px;
    margin-bottom: 10px;
}

.modal .table_no_category .btn-success a {
    font-weight: 300;
    font-size: 15px;
    padding: 9px 25px 8px;
    border-radius: 5px;
}

#invoice.history .hd-print-barcode,
#invoice.history .holder-barcode td {
    text-align: center;
}

div#invoice.history .body-bill {
    height: 300px;
    overflow-y: auto;
}

div#invoice.history {
    width: 100%;
    min-height: 920px;
    padding: 5px;
}

#hd_table_import_excel_menu,
.hd_table_import_excel_menu {
    overflow: auto;
    height: 420px;
    border: 1px solid #ccc;
    padding: 3px;
    background: #f1f1f1;
}

#table_import_excel_menu,
.table_import_excel_menu {
    width: 1600px;
}


/* ###### CSS 12/9/2018 Mr Tan ###### */

#tpl_order_booking tr td table {
    margin: 0px 10px;
    width: calc(100% - 20px);
}

#tpl_order_booking tr td table tr {
    box-shadow: none !important;
}

#tpl_order_booking tr td table tr.show-item+tr td {
    padding: 12px 10px !important;
}

.form-search {
    position: relative;
    margin: 20px 0px 10px 0px;
}

.form-search:after {
    content: "";
    clear: both;
    display: block;
}

.form-search input {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 2px 12px;
    height: 34px;
}

.form-search input:focus {
    outline: none;
}

.form-search button {
    position: absolute;
    right: 0px;
    top: 0px;
    background: none;
    border: none;
    font-size: 18px;
    color: #555;
    height: 36px;
    width: 44px;
}

.f-search {
    position: relative;
}

.f-search.contract span.icon-x {
    top: 24px;
}

.f-search span.icon-x {
    position: absolute;
    right: 1px;
    top: 3px;
    background: none;
    border: none;
    font-size: 16px;
    color: #c1c1c1;
    width: 40px;
    cursor: pointer;
    text-align: center;
    padding-top: 4px;
}

.f-search span.icon-x:hover {
    color: #ec5746;
}

.add_product {
    cursor: pointer;
    display: block;
    margin: 3px 0px 0px 0px;
    text-align: center;
}

.primary-provider,
.primary-order {
    padding: 0px 15px;
    background: #fff;
}

.primary-provider .row,
.primary-order .row {
    margin: 0px -5px;
}

.nav-check {
    padding: 6px 0px;
    border: none;
    margin: 0px;
}

.nav-check li {
    width: 33.33333%;
    list-style-type: none;
    position: relative;
}

.nav-check li a {
    background: none !important;
    border: none !important;
    color: #888;
    font-weight: 300;
    font-size: 16px;
    padding: 10px 0px 8px 30px;
    display: block;
    cursor: pointer;
}

.nav-check li a:before {
    content: "";
    height: 22px;
    width: 22px;
    border: 1px solid #54ba47;
    display: block;
    border-radius: 50%;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.nav-check li a:after {
    content: "";
    height: 12px;
    width: 12px;
    background: #54ba47;
    border-radius: 50%;
    position: absolute;
    left: 5px;
    top: 0px;
    bottom: 0px;
    margin: auto;
    display: none;
}

.nav-check li.active a:before {
    border-color: #54ba47;
}

.nav-check li.active a:after {
    display: block;
}

.nav-check li.active a {}

.content-provider .item .infomation {
    display: none;
    background: #fbfbfb;
    padding: 10px 0px;
}

.content-provider .item h4 {
    text-align: left;
    padding: 0px;
    margin: 10px 0px 5px;
    font-size: 16px;
    color: #555;
    font-weight: 300;
    cursor: pointer;
}

.content-provider .item h4 img {
    position: absolute;
    right: 12px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.content-provider .item h4 span {
    display: inline-block;
    margin: 0px 10px;
    font-weight: 400;
}

.content-provider .item .table-product {
    margin-bottom: 0px;
    position: relative;
}

.content-provider .item ul {
    margin-bottom: 0px;
    padding: 0px 10px;
}

.content-provider .item ul li {
    list-style-type: none;
    font-weight: 300;
    font-size: 15px;
}

.content-provider .item ul li .name {
    color: #999;
    padding: 20px 0px 5px;
}

.content-provider .item ul li .info {
    border-bottom: 1px solid #ddd;
    padding: 20px 0px 5px;
}

input[type="text"]:disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

.content-provider .item ul li .info input:disabled {
    opacity: 0.8;
    cursor: not-allowed;
    color: gray;
}

.content-provider .item ul li .info input {
    border: none;
    outline: none;
    width: 100%;
    padding: 0px;
    background: none;
}

.ncc_radio {
    text-align: left !important;
}

.ncc_radio label,
label.ace {
    color: #888;
    font-weight: 300;
    font-size: 15px;
    padding: 2px 0px;
    cursor: pointer;
}

.ncc_radio label input[type="radio"].ace+.lbl,
label.ace input[type="radio"].ace+.lbl {
    position: relative;
    margin-right: 5px;
    top: 6px;
}

.dropdown-menu input[type="radio"].ace+.lbl::before {
    min-width: 13px !important;
    width: 13px !important;
    height: 13px !important;
    margin: -5px -5px 4px 0px !important;
}

.ncc_radio label input[type="radio"].ace+.lbl::before,
label.ace input[type="radio"].ace+.lbl::before {
    cursor: pointer;
    font-family: fontAwesome;
    font-weight: normal;
    font-size: 12px;
    color: #32a3ce;
    content: "\a0";
    background-color: #54ba47;
    border: 1px solid #c8c8c8;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: inline-block;
    text-align: center;
    height: 20px;
    line-height: 20px;
    min-width: 20px;
    margin-right: 1px;
    position: relative;
    top: -1px;
    border-radius: 20px;
    border: none;
    height: 22px;
    width: 22px;
    background: url(../images/no_choosen.png) no-repeat;
    background-size: 100%;
    content: "";
}

.ncc_radio label input[type="radio"].ace:checked+.lbl::before,
label.ace input[type="radio"].ace:checked+.lbl::before {
    background-image: url(../images/choosen.png);
    background-size: 100% !important;
}

.search-order label.name {
    color: #666;
    display: block;
    margin: 12px 0px 0px 0px;
    text-align: right;
    padding-right: 15px;
    white-space: nowrap;
}

.search-order select {
    color: #666;
    height: 34px;
    border: 1px solid #ddd;
    margin: 0px 0px;
    border-radius: 4px;
}

.search-order .lg select {
    height: 34px;
}

.search-order input {
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 2px 12px;
    width: 100%;
    color: #888;
    outline: none !important;
    margin: 0px 0px;
    height: 34px;
}

.search-order img.icon-date {
    position: absolute;
    top: 7px;
    right: 15px;
    width: 20px;
}

.icon1 {
    display: inline-block;
    margin: 10px 5px 8px;
    cursor: pointer;
}

.icon2 {
    display: inline-block;
    margin: 0px 1px;
    cursor: pointer;
}

.primary-order {}

table.table-bg {}

table.table-bg tr {
    text-align: center;
}

table.table-bg tr th,
table.table-bg-s tr th {
    background: #428bca;
    color: #fff;
    text-align: center;
    padding: 16px 8px;
    font-size: 15px;
    border-bottom: none;
    white-space: nowrap;
    vertical-align: middle;
}

table.table-bg-s tr th {
    padding: 8px 4px;
}

table.table-bg tr td {
    padding: 10px 8px;
    vertical-align: middle;
}

table.table-bg tr td select {
    color: #666;
    height: 34px;
    border: 1px solid #ddd;
}

table.table-bg tr td input {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 6px 12px;
    width: 100%;
    color: #888;
    outline: none !important;
    margin-top: 0px;
}

.row {
    margin-left: -5px;
    margin-right: -5px;
}

.row {
    /* margin-left: 0px;
    margin-right: 0px; */
}

.wrap-name {
    width: 125px;
}

.wrap-info {
    width: calc(100% - 130px);
}


/* ###### CSS 19/9/2018 Mr Tan ###### */

.nav-storing {
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .nav-storing {
        margin-bottom: 10px;
    }
}

.nav-storing li {}

.nav-storing li a {
    background: none !important;
    font-size: 15px;
    margin: 0px 0px -1px;
    border-radius: 0px;
    padding: 10px 25px;
    border: none !important;
    border-bottom: 3px solid rgba(255, 255, 255, 0) !important;
}

.nav-storing.nav-tabs>li.active>a,
.nav-storing.nav-tabs>li.active>a:hover,
.nav-storing.nav-tabs>li.active>a:focus {
    background: none;
    color: VAR(--MAIN-COLOR-HOVER);
    border-bottom: 3px solid VAR(--MAIN-COLOR-HOVER) !important;
    overflow: hidden;
}

table.table-bg {}

table.table-bg tr,
table.table tr,
table.table-bg-no tr {
    text-align: center;
    border: 1px solid #e4f3e4;
}

table.table-bg,
table.table {
    text-align: center;
    margin-bottom: 15px;
}

#tpl_list_2 table {
    margin-bottom: 5px;
}

table.warehouse-storing {
    margin-bottom: 5px;
}

table.table-bg tr th,
table.table tr th {
    color: #000;
    padding: 10px;
    font-size: 14px;
    border-bottom: none;
    background: #f0fff0;
    text-align: left;
    line-height: normal;
    border: 1px solid #d5f1d5;
    white-space: nowrap;
    vertical-align: middle;
}

table.table-bg tr td,
table.table tr td {
    padding: 8px;
    vertical-align: middle;
    font-size: 14px;
    border: 1px solid #e8e8e8;
    text-align: left;
    background: #fff;
}

table.table-border tr td {
    border: 1px solid #eaeef1;
}

table.table-bg tr:hover td,
table.table tr:hover td {
    background: #dff0d8 !important;
}

table.table tr.tr-sub:hover td {
    background: none !important;
}

table.table-bg tr.detail_order_info td,
table.table tr.detail_order_info td {
    background: #fff !important;
}

table.table tr.detail_order_info td.text-left,
table.table tr td.text-left {
    text-align: left !important;
}

table.table tr th.text-right,
table.table tr td.text-right {
    text-align: right !important;
}

table.table-bg tr:nth-child(2n) td,
table.table tr:nth-child(2n) td {
    background: #f9f9f9;
}

table.table-bg tr th:first-child,
table.table-bg tr td:first-child,
table.table tr th:first-child,
table.table tr td:first-child {
    text-align: center;
}

table.table-bg-no tr th:last-child,
table.table-bg tr td:last-child,
table.table-bg tr th:last-child,
table.table-bg tr td:last-child,
table.table tr th:last-child,
table.table tr td:last-child {
    text-align: right;
}

table.table-bg-no tr td select {
    color: #666;
    height: 34px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

table.table-bg-no tr td select:focus {
    outline: none;
}

table.table-bg-no tr td input,
table.table-bg-no tr td textarea {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 8px 12px;
    width: 100%;
    color: #888;
    outline: none !important;
}

table.table-bg-no thead tr {
    /* border-bottom: 1px solid #ddd; */
}

table.table-bg-no tbody tr {
    cursor: pointer;
}

table.table-bg-no tbody tr td.scroll_td_left {
    position: sticky;
    left: -1px;
    white-space: normal !important;
    width: 120px;
}

table.table-bg-no thead tr th.scroll_th_top {
    position: sticky;
    top: -1px;
    z-index: 1;
}

.tableHeightWindows {
    display: block;
    overflow-y: auto;
    margin-bottom: 0px !important;
}

table.table-bg-no tbody tr.tr-sub {
    box-shadow: none;
    background: #f5f5f5;
    display: none;
}

table.table-bg-no tbody tr.tr-sub td {
    /* padding: 0px; */
    background: #fff;
}

table.table-bg-no-sub {
    background: none !important;
    margin-bottom: 0px;
}

table.table-bg-no-sub thead tr {
    box-shadow: none;
    background: #eaeaea;
}

table.table-bg-no-sub tbody tr {
    box-shadow: none;
}

table.table-bg-no-sub thead tr th {
    color: #555;
}

th {
    text-align: center;
}

table.table-bg-no-sub tbody tr td .search-order {
    margin: 0px;
}

table.table-bg-no-sub tbody tr td .search-order input {
    background: none;
}

table.table-bg-no-sub tbody tr td .search-order label.name {
    margin: 5px 0px 0px 0px;
}

.wrap-info-in input {
    width: 100%;
    padding: 0px 10px;
    background: none;
    border: 1px solid #ddd;
    height: 34px;
    border-radius: 4px;
}

.wrap-info-in input[type="checkbox"].ace+.lbl {
    margin-top: 13px;
}

span.ring_alert {
    color: #fff;
    background: #e41e25;
    position: relative;
    right: 3px;
    border-radius: 50%;
    top: -15px;
    display: inline-block;
    padding: 4px 8px;
    z-index: 10;
    font-size: 10px;
    box-shadow: 1px 2px 1px #dedede;
}

img.icon-date {
    cursor: pointer;
}

input[disabled] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

tr.strikeout td:before {
    content: " ";
    position: absolute;
    top: 50%;
    left: 0;
    border-bottom: 1px solid #ddd;
    width: 100%;
}

span#lable_shop,
span#lable_warehouse,
span#label_from_name {
    color: #666;
    padding: 15px 0px 2px 0;
    border-bottom: 1px solid #666;
    display: block;
    opacity: 0.8;
}

.head-search-main {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
}

.head-search-main-1 {
    padding-left: 106px;
}

@media(max-width: 767px) {
    .head-search-main {
        padding-left: 106px;
    }
}

.head-search-main .form-search {
    margin: 0px;
}

.head-search-main .form-search button {
    right: auto;
    left: 2px;
    top: 5px;
    height: 36px;
    width: 40px;
}

.head-search-main .form-search input {}

.search_code {
    position: absolute;
    top: 7px;
    right: 10px;
    width: 20px;
    cursor: pointer;
}

.input_name .search_code {
    width: 22px;
    top: -2px;
    right: 2px;
}

.head-search-main a.menu-home {
    font-size: 20px;
    padding: 6px 7px;
}

.head-search-main .icon-home1 {
    text-align: center;
    display: block;
    padding-top: 5px;
    position: relative;
    cursor: pointer;
    /* background: var(--main-color); */
}

.head-search-main .icon-home1:before {
    /* content: '+'; */
}

.head-search-main .icon-home1 img {}

.main-home {
    height: calc(100% - 74px);
    position: absolute;
    top: 74px;
    width: calc(100% - 100px);
    left: 100px;
    padding: 0px 5px 0px 0px;
}

.main-home>.row {
    height: 100%;
    position: absolute;
    top: 0px;
    width: 100%;
}

@media (max-width: 767px) {
    .main-home {
        position: relative;
        top: 0px;
        padding-bottom: 50px !important;
        padding-right: 0;
    }
    .main-home>.row {
        position: relative;
        margin: 0;
    }
}

.main-home .input_quantity,
.main-home .input_quantity_sale {
    position: relative;
}

.main-home .input_quantity .span_quantity,
.main-home .input_quantity_sale .span_quantity {
    display: inline-block;
    min-width: 30px;
    text-align: center;
}

.main-home .input_quantity .bar-code {
    display: inline-block;
    font-size: 18px;
    position: absolute;
    top: 2px;
    cursor: pointer;
    right: 0px;
}

.main-home .input_quantity .quantity-hold {
    min-width: 70px;
    display: block;
    padding-right: 10px;
    position: relative;
    cursor: pointer;
    margin-left: 4px;
}

.main-home .input_quantity .input-group input,
.main-home .input_quantity_sale .input-group input {
    color: #555;
    font-weight: 400;
}

.wrap-input-group {
    position: absolute;
    background: #fff;
    padding: 10px;
    box-shadow: 0px 0px 10px #999;
    width: 200px;
    top: 100%;
    right: 13px;
    margin-top: 3px;
    z-index: 2;
    margin-right: 25px;
    display: none;
}

.main-home .table-bg-no tbody tr:last-child .wrap-input-group {}

.wrap-input-group>i {
    position: absolute;
    top: -1px;
    right: 1px;
    height: 20px;
    width: 20px;
    line-height: 20px;
    font-style: normal;
    text-align: center;
    cursor: pointer;
}

.wrap-input-group p {
    text-align: left;
    margin: 0px 0px 5px 3px;
    color: #476c86;
}

.wrap-input-group .input-group-btn>.btn {
    background: #eaf7fd;
    color: #69b9de;
}

.wrap-input-group .input-group-btn:first-child>.btn,
.wrap-input-group .input-group-btn:first-child>.btn-group {
    margin-right: -2px;
}

.wrap-input-group .nav {
    float: right;
    width: 90px;
    text-align: center;
    border: none;
}

.wrap-input-group .nav li {
    border: none;
    margin: 0px;
    width: 50%;
    float: left;
}

.wrap-input-group .nav a {
    border-radius: 0px;
    border: 1px solid #ddd;
    margin: 0px -1px;
    background: #fff;
    display: block !important;
    line-height: 21px;
}

.wrap-input-group .nav>li.active>a,
.wrap-input-group .nav>li.active>a:hover,
.wrap-input-group .nav>li.active>a:focus {
    background: #dee;
}

.wrap-input-group .tab-content-price {
    float: left;
    width: calc(100% - 90px);
}

.wrap-input-group .tab-content-price input {
    border-radius: 0px;
    height: 35px;
    border-right: none;
}

.wrap-input-group .tab-content-price>div {
    display: none;
}

.wrap-input-group .tab-content-price>div.active {
    display: block;
}

.wrap-input-group .tab-content-tiktok input {
    border-radius: 0px;
    height: 35px;
}


/**/

.main-home-left {
    border-right: 1px solid #ddd;
    padding: 6px 5px 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
}

.main-home-right {
    padding: 0;
    position: relative;
    overflow: hidden;
    background: #f3f3f3;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
}

@media (max-width: 767px) {
    .main-home-left {
        position: relative;
        border-right: none;
    }
    .main-home-right {
        min-height: initial !important;
        position: relative;
    }
}

.main-home .search-order {
    margin: 0px;
    padding: 6px;
}

.main-home .form-search {
    margin: 0px;
}

.main-home .form-search button {
    right: 0px;
    left: auto;
    top: 6px;
    height: 36px;
    width: 40px;
    font-size: 16px;
}

.main-home .form-search input {
    padding-left: 12px;
    height: 36px;
}

.main-home .search_code {
    position: absolute;
    top: 9px;
    right: 10px;
    width: 22px;
    background: #fff;
    padding-left: 5px;
}

.main-home .btn-success1 {
    margin: 8px 0px 0px;
}

.main-home #btn_return.btn-success1 {
    margin: 0px 0px 0px;
}

#btn_print.btn-success1,
#btn_sale.btn-success1 {
    display: inline-block;
}

.main-home .btn-success1 .th {
    background: var(--main-color);
    color: #fff;
    font-weight: 400;
    cursor: pointer;
    padding: 7px 5px;
    text-align: center;
    width: 100%;
    margin-left: 0px;
    border: 1px solid var(--main-color) !important;
    display: inline-block;
    margin-right: 0px;
}

.wrap_order_return {
    display: none;
    margin-left: 10px;
}

.main-home table.table-bg-no tr td {
    padding: 2px 8px 0px 8px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    position: relative;
    text-align: left;
}

@media (max-width: 767px) {
    .main-home table.table-bg-no tr.item-order-detail td {
        white-space: normal;
    }
}

.main-home table.table-bg-no tr.item-order-detail:last-child td {
    border-bottom: none;
}

.main-home table.table-bg-no tr.no td {
    border: none;
    padding: 4px 8px;
}

.main-home .table-bg-no tbody tr {
    box-shadow: none;
}

.main-home .table-bg-no tbody tr.no:nth-child(3) {
    border: none;
}

.main-home table.table-bg-no tr.last td {
    padding: 0px;
}

.main-home table.table-bg-no tr.last .total_bill {
    background: var(--main-color);
    padding: 10px 0px 8px;
    color: #fff;
    font-size: 26px;
    position: relative;
    text-align: center;
}

.main-home table.table-bg-no tr.last .total_bill .menu-side-left {
    width: 24px;
    position: absolute;
    left: 15px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.main-home table.table-bg-no tr.last .total_bill .menu-check-ok {
    width: 24px;
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    -moz-filter: brightness(0) invert(1);
    -o-filter: brightness(0) invert(1);
    -ms-filter: brightness(0) invert(1);
    position: absolute;
    right: 15px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.menu-right {
    background: #eaf7fd;
    position: absolute;
    right: 0px;
    top: 0px;
    padding: 25px 0px 10px;
    margin: 0px;
    width: 210px;
    min-height: 100%;
}

.hide_menuRight {
    cursor: pointer;
    position: absolute;
    top: 9px;
    right: 142px;
    z-index: 9;
    background: #e7f7fe;
    font-size: 12px;
}

.show_menuRight {
    display: none;
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 3px;
    z-index: 999;
    font-size: 33px;
    margin: auto;
    height: 34px;
    line-height: 34px;
    width: 40px;
    text-align: center;
    color: #6d98ab;
    cursor: pointer;
}

.hideMenuRight .menu-right {
    right: -165px;
}

.hideMenuRight .menu-right>li {
    display: none;
}

.hideMenuRight .TAN_product_main {
    width: calc(100% - 40px);
}

.hideMenuRight .TAN_product_main .item {
    width: 25%;
}

@media (max-width: 991px) {
    .hide_menuRight {
        right: 85px;
    }
    .hideMenuRight .menu-right {
        right: -105px;
    }
    .hideMenuRight .TAN_product_main .item {
        width: 50%;
    }
    .hideMenuRight .TAN_product_main {
        width: calc(100% - 50px) !important;
    }
}

.menu-right>li {
    list-style-type: none;
}

.menu-right>li>a {
    cursor: pointer;
    color: #555;
    text-transform: uppercase;
    font-size: 15px;
    padding: 8px 24px 8px 14px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
}

@media (max-width: 991px) {
    .menu-right {
        width: 150px;
    }
    .menu-right>li>a {
        font-size: 14px;
        padding: 9px 11px 7px 11px;
    }
    .TAN_product_main {
        width: calc(100% - 150px) !important;
    }
}

@media (max-width: 767px) {
    .menu-right {
        position: relative;
        width: 100%;
        padding-top: 0px;
    }
    .hide_menuRight {
        display: none;
    }
    .menu-right>li {
        float: left;
        width: 100%;
    }
    .TAN_product_main {
        width: 100% !important;
        position: relative !important;
    }
}

.menu-right>li>a>i {
    margin-left: 5px;
    font-size: 22px;
    float: right;
    margin-top: -2px;
    display: none;
    position: absolute;
    top: 0px;
    right: 3px;
    height: 22px;
    bottom: 0px;
    margin: auto;
}

.menu-right>li>a>i.fa-angle-down {
    display: block;
}

.menu-right>li.active>a>i.fa-angle-down {
    display: none;
}

.menu-right>li.active>a>i.fa-angle-up {
    display: block;
}

.menu-right>li:hover>a {
    background: #fff;
}

.menu-right>li>.sub {
    padding: 0px;
    display: none;
}

.menu-right>li>.sub>li {
    list-style-type: none;
}

.menu-right>li>.sub>li>a {
    color: #555;
    font-size: 15px;
    display: block;
    padding: 7px 20px 5px 30px;
}

.TAN_product_main {
    width: calc(100% - 210px);
    position: absolute;
    left: 0px;
    height: 100%;
}

.TAN_product_main .item {
    float: left;
    width: 33.3333333%;
    position: relative;
    padding: 3px;
}

.btn-group,
.btn-group-vertical {
    z-index: 9;
}

@media (max-width: 1200px) {
    .TAN_product_main .item {
        width: 50%;
    }
}

@media (max-width: 991px) {
    .TAN_product_main .item {
        width: 50%;
    }
}

.TAN_product_main .item .iframe {
    border: 1px solid #ddd;
    position: relative;
    background: #fff;
}

.TAN_product_main .item .img {
    height: 0px;
    position: relative;
    padding-bottom: 100%;
}

.TAN_product_main .item .img img {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}

.TAN_product_main .item h3 {
    background: #eaf7fd;
    position: relative;
    bottom: 0px;
    margin: 0px;
    padding: 5px;
    font-size: 13px;
}

.TAN_product_main .item h3 a {
    color: #000;
    font-weight: 600;
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}

.TAN_product_main .item .price {
    text-align: right;
    margin: 1px 0px 0px 0px;
    font-size: 13px;
    position: relative;
    padding: 3px 4px;
    font-weight: 600;
    border-top: 1px solid #e2e2e2;
}

.TAN_product_main .item .quantity {
    position: absolute;
    left: 8px;
    top: 5px;
    margin: 0px;
    font-size: 12px;
    font-style: italic;
    font-weight: 600;
}

.scroll-item {
    max-height: 100%;
    overflow-y: auto;
}

.scroll-item-table {
    position: relative;
    background: #f9fdfe;
    /*
    height: 367px;
    height: calc(100% - 328px);*/
}

.scroll-item-table>.table {
    overflow: auto;
    outline: none;
    min-height: 315px;
    display: block;
    position: static;
    margin-bottom: 5px;
}

@media (max-width: 767px) {
    .scroll-item-table>.table,
    .scroll-item-table {
        height: 315px !important;
    }
    .form-search1111 {
        /* margin-left: 10px !important; */
    }
}

.scroll-item-table>.table thead {
    display: inline-table;
    width: 100%;
    position: absolute;
    background: #fff;
    z-index: 2;
    left: 0px;
    top: 0px;
}

.scroll-item-table>.table tbody {
    display: inline-table;
    width: 100%;
}


/**/

.TAN_add_customer {
    position: absolute;
    top: 100%;
    z-index: 2;
    background: #eaf7fd;
    box-shadow: 0px 0px 10px #999;
    padding: 10px;
    width: 350px;
    right: 0px;
    margin-top: 10px;
    display: none;
}

.TAN_add_customer .img {
    float: left;
    width: 50px;
    margin-right: 10px;
}

.TAN_add_customer .name {
    padding-top: 6px;
    color: #555;
    font-size: 13px;
}

.TAN_add_customer .name>span {
    display: block;
}

.TAN_add_customer .name p {
    margin: 4px 0px 0px 0px;
}

.TAN_add_customer .name p span {
    display: inline-block;
    margin: 0px 5px;
    cursor: pointer;
}

.ncc_radio_add_customer {
    margin-top: 10px;
}

.ncc_radio_add_customer p {
    margin: 0px 0px 0px 0px;
}

.ncc_radio_add_customer.ncc_radio label {
    padding: 3px 0px;
}

.ncc_radio_add_customer.ncc_radio textarea {
    width: 100% !important;
    border: 1px solid #ddd;
    border-radius: 5px;
    min-height: 100px;
    margin-top: 10px;
}

.clear {
    clear: both;
}

#modal_add_customer .modal-body>div {
    padding-right: 15px;
}

.modal-content>h3 {
    background: none repeat scroll 0 0 padding-box var(--main-color);
    border-radius: 3px 3px 0 0;
    color: #fff;
    padding: 14px 0px 12px 12px;
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
    min-height: 51px;
    line-height: 25px;
    margin: 0px;
}

.modal-content>.close {
    opacity: 1;
    color: #fff;
    text-shadow: none;
    top: 12px;
    right: 15px;
}

.modal-content>.btn_pop_close {
    top: 19px;
}


/* #modal_add_customer .modal-body > div:nth-child(2n){
	padding-left: 15px;
    padding-right: 4px;
} */

.discount-name {
    color: #f00;
    font-size: 11px;
    float: right;
    padding-top: 5px;
}

.discount-name.cart {
    float: none;
}

.discount-name img {
    width: 7px;
    margin-right: 3px;
    position: relative;
    top: -1px;
}

.menu-left {
    background: #eaf7fd;
    position: fixed;
    top: 0px;
    left: -200px;
    height: 100%;
    width: 200px;
    z-index: 99;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.overlay-menu-left {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    z-index: 98;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    display: none;
}

.menu-left ul {
    padding: 0px;
    position: absolute;
    margin: 0px;
    bottom: 0px;
    width: 100%;
    text-align: left;
}

.menu-left ul li {
    position: relative;
}

.menu-left ul li.tax .wrap-input-group {
    right: auto;
    left: 100%;
    top: 0px;
    margin-top: 0px;
}

.menu-left ul li a {
    display: block;
    padding: 10px 20px;
    color: #555;
    font-size: 15px;
    cursor: pointer;
}

.menu-left ul li a:hover {
    background-color: #fff;
}

.menu-left ul li a.back {
    border-top: 1px solid #ddd;
    padding: 15px 20px;
    text-transform: uppercase;
    font-size: 18px;
    text-align: center;
    margin-top: 10px;
}

.menu-left ul li a.back i {
    margin-left: 5px;
    font-size: 20px;
    float: right;
    margin-top: 2px;
}


/**/

.T-shipping {
    position: absolute;
    top: 0px;
    left: 100%;
    background: #fff;
    padding: 10px;
    box-shadow: 0px 0px 10px #fff;
    border-radius: 5px;
    width: 450px;
    text-align: left;
    top: -120px;
    display: none;
}

.T-shipping .text-right a {
    padding: 6px 12px !important;
    display: inline-block !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}

.T-shipping .text-right a:hover {}

.T-shipping .text-right a.close {
    position: relative;
    opacity: 1;
    text-shadow: none;
    font-weight: normal;
    float: none;
    display: inline-block;
    line-height: 1.3;
}

.T-shipping h4 {
    color: VAR(--MAIN-COLOR-HOVER);
    font-size: 18px;
    margin-bottom: 5px;
    margin-top: 10px;
    text-transform: uppercase;
    text-align: center;
}

.T-shipping .wrap-name {
    padding-top: 20px;
}

.T-shipping .wrap-info-in input {
    height: 30px;
    margin-top: 10px;
}

.T-shipping .wrap-info textarea {
    width: 100% !important;
    border: 1px solid #ddd;
    border-radius: 5px;
    min-height: 60px;
    margin: 14px 0px 0px;
    padding: 8px;
}

.T-shipping .btn-success1 {
    margin: 10px 0px 0px;
}

.T-shipping .btn-success1 a {
    display: inline-block;
    background: none;
    text-transform: uppercase;
    color: #05be2f;
    padding: 10px;
    margin: 0px;
    font-weight: 600;
}


/**/

.payment_name {}

.payment_name label {
    display: block;
    color: #999;
    font-size: 15px;
}

.payment_name span {
    font-size: 15px;
    display: block;
    margin-top: 8px;
    color: #555;
    font-weight: 600;
}

.payment_order {}

.payment_order .item {}

.payment_order .item .iframe {
    border-radius: 4px;
    padding: 12px 20px;
    margin: 4px 0px;
    float: left;
    width: calc(100% - 0px);
    cursor: pointer;
    background: #f1f1f1;
}

@media (max-width: 767px) {
    .payment_order .item .iframe {
        padding: 5px 10px;
        margin: 4px 0px;
        width: calc(100% - 0px);
    }
}

.payment_order .item .iframe.active {
    background: #d0e8c6;
}

.payment_order .item .iframe img {
    height: 34px;
    margin-right: 15px;
    float: left;
}

.payment_order .item .iframe span {
    display: block;
    width: calc(100% - 80px);
    text-align: center;
    float: left;
    color: #555;
    font-weight: 600;
    font-size: 15px;
    padding: 6px 0px;
}

@media (max-width: 767px) {
    .payment_order .item .iframe img {
        height: 32px;
        margin-top: 6px;
        margin-left: 2px;
    }
    .payment_order .item .iframe span {
        width: calc(100% - 60px);
        font-size: 14px;
    }
}


/**/

.chosse_price {}

.chosse_price .item {}

.chosse_price .item .iframe {
    border-radius: 4px;
    padding: 12px 20px;
    margin: 4px 0px;
    width: 100%;
    cursor: pointer;
}

@media (max-width: 767px) {
    .chosse_price .item .iframe {
        margin: 4px 0px;
        padding: 5px 10px;
    }
}

.chosse_price .item:nth-child(1) .iframe,
.chosse_price .item:nth-child(2) .iframe,
.chosse_price .item:nth-child(3) .iframe,
.chosse_price .item:nth-child(4) .iframe {
    background: #f6e0d2;
}

.chosse_price .item:nth-child(5) .iframe,
.chosse_price .item:nth-child(6) .iframe,
.chosse_price .item:nth-child(7) .iframe,
.chosse_price .item:nth-child(8) .iframe {
    background: #e6e5f3;
}

.chosse_price .item:nth-child(9) .iframe,
.chosse_price .item:nth-child(10) .iframe,
.chosse_price .item:nth-child(11) .iframe,
.chosse_price .item:nth-child(12) .iframe {
    background: #e7e8ea;
}

.chosse_price .item .iframe.active {
    background: #d0e8c6;
}

.chosse_price .item .iframe span {
    color: #555;
    font-weight: 600;
    font-size: 15px;
    padding: 6px 0px 4px;
    display: block;
    text-align: center;
}

#click_save_order .search-order input {
    margin-top: 6px;
}

#click_save_order .btn-success1 {
    margin: 10px 0px 0px;
}

.search-order.hold_date {
    height: 46px;
}

a#add_upload_attachment img {
    height: 30px;
    position: absolute;
    top: 2px;
}

li.item-searching .name {
    width: 90%;
    padding: 2px;
    float: left;
}

li.item-searching .name>.type {
    background-color: #b0bcd4;
    display: inline-block;
    color: #fff;
    font-size: 10px;
    padding: 1px 9px 2px;
    border-radius: 10px;
    font-weight: 600;
    margin-right: 5px;
    position: relative;
    top: -2.5px;
}

li.item-searching .img {
    width: 10%;
    padding: 2px;
    float: left;
}

li.item-searching .name p {
    margin: 0 0 5px;
    font-size: 12px;
}

.item-searching-store .img {
    width: 50px;
}

.item-searching-store .name {
    width: calc(100% - 55px);
}

li.item-searching a:hover,
li.item-searching a.ui-state-focus {
    background: #fff;
    color: #000;
}

i.glyphicon.glyphicon-tags {
    float: right;
    opacity: 0.5;
    right: 20px;
    top: 10px;
}

i.glyphicon.glyphicon-tags.SP {
    z-index: 1000;
    top: -5px;
    right: 5px;
}

.ui-menu .item-searching.ui-menu-item a {
    padding: 0;
}

li.item-searching,
div.item-sku-select {
    width: 100%;
    background: #eaf7fd;
    overflow: hidden;
    margin-bottom: 5px;
    /* box-shadow: 1px 1px 1px #000; */
    cursor: pointer;
    /* display: inline-block; */
    list-style-type: none !important;
    line-height: normal;
    border-bottom: 1px solid #fff;
    /* padding-bottom: 4px !important; */
    list-style-image: none !important;
}

span#lb_sum_order {
    display: inherit;
    margin: 0 20%;
}

span.lb_sum_order {
    background: url(../images/payment_card.png) no-repeat;
    background-size: 30px;
    background-position: 0px 1px;
    padding: 0px 0px 0px 40px;
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    -moz-filter: brightness(0) invert(1);
    -o-filter: brightness(0) invert(1);
    -ms-filter: brightness(0) invert(1);
}

.main-home .order-footer {
    margin: 10px 0px;
}

.main-home .order-footer .order_news {
    font-size: 14px;
    text-align: left;
    color: #555;
    margin: 3px 0px;
    float: left;
    width: 100%;
}

@media (max-width: 767px) {
    .main-home .order-footer .order_news_1 {
        margin-top: 0px !important;
    }
}

.main-home .order-footer .order_news_1 {}

.main-home .order-footer .order_news input {
    height: auto;
    border-radius: 3px;
    border: 1px solid #f1f1f1;
    padding: 1px 5px;
    width: 110px;
    position: relative;
    top: 0px;
    font-size: 14px;
    font-weight: bold;
    color: #555;
    text-align: right;
}

.main-home .total_bill {
    background: var(--main-color);
    padding: 10px 0px 8px;
    color: #fff;
    font-size: 26px;
    position: relative;
    text-align: center;
}

@media (max-width: 767px) {
    .main-home .total_bill {
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 98;
        width: 100%;
        font-size: 20px;
    }
}

.main-home .total_bill .menu-side-left {
    width: 24px;
    position: absolute;
    left: 15px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.main-home .total_bill .menu-check-ok {
    width: 24px;
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    -moz-filter: brightness(0) invert(1);
    -o-filter: brightness(0) invert(1);
    -ms-filter: brightness(0) invert(1);
    position: absolute;
    right: 15px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}


/* .main-home .nav-tabs{
    border: none;
    border-top: 1px solid #ddd;
    margin-bottom: 0px;
}
.main-home .nav-tabs li{

} */

.TAN_tab_news {
    margin-bottom: 10px;
}

.TAN_tab_news .btn-success1 a {
    margin-left: 0px;
    margin-right: 5px;
    padding: 6px 20px;
}

.TAN_tab_news .ncc_radio label,
.TAN_tab_news label.ace {
    padding: 3px 0px;
}

.TAN_icon_news {
    margin: 10px 0px 10px 0px;
    padding: 0px;
    text-align: left;
}

.TAN_icon_news li {
    display: inline-block;
    list-style-type: none;
}

.TAN_icon_news li a {
    background-image: -webkit-linear-gradient(top, #56ba47 0%, #419641 100%);
    background-image: -o-linear-gradient(top, #56ba47 0%, #419641 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#56ba47), to(#419641));
    background-image: linear-gradient(to bottom, #56ba47 0%, #419641 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ff56BA47', endColorstr='#419641', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
    background-repeat: repeat-x;
    border-color: #3e8f3e;
    color: #fff;
    padding: 6px 18px;
    border-radius: 6px;
    font-weight: normal;
    font-size: 15px;
    display: inline-block;
}

.TAN_icon_news li.L_propcess a {
    background-image: -webkit-linear-gradient(top, #3b8dd6 0%, #2d72af 100%);
    background-image: -o-linear-gradient(top, #3b8dd6 0%, #2d72af 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#3b8dd6), to(#2d72af));
    background-image: linear-gradient(to bottom, #3b8dd6 0%, #2d72af 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#3b8dd6', endColorstr='#2d72af', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
}

.TAN_icon_news li.L_delete a {
    background-image: -webkit-linear-gradient(top, #f3b1b2 0%, #d09495 100%);
    background-image: -o-linear-gradient(top, #f3b1b2 0%, #d09495 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f3b1b2), to(#d09495));
    background-image: linear-gradient(to bottom, #f3b1b2 0%, #d09495 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f3b1b2', endColorstr='#d09495', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
}

.TAN_icon_news li a img {
    position: relative;
    top: -2px;
    margin-right: 3px;
}

#mode_cancel_order a {
    background: none;
    color: #56ba47;
    text-transform: uppercase;
    font-size: 18px;
    padding: 0px 10px;
    margin-top: 10px;
}

#mode_cancel_order a.close {
    color: #555;
}


/* .main-home .nav-tabs li.active a{
    border: 1px solid #ddd;
    margin-bottom: 0px;
    margin-top: -1px;
    border-radius: 0px;
    border-top: 1px solid #fff;
    color: var(--main-color);
    font-weight: bold;
}
.main-home .nav-tabs li:first-child.active a{
    border-left: none;
}
.main-home .nav-tabs li a{
    background: none;
    border: 1px solid #fff;
    border-radius: 0px;
} */

@media (max-width: 767px) {
    /* .main-home .nav-tabs li{
        margin-bottom: -1px;
    }
    .main-home .nav-tabs li:first-child.active a{
        border-left: 1px solid #ddd;
    }
    .main-home .nav-tabs li a{
        border-top: 1px solid #ddd !important;
        margin-right: -1px;
        margin-top: -1px;
        border-bottom: 1px solid #ddd;
        border-left: 1px solid #ddd;
    }
    .main-home .nav-tabs li.active a{
        border-bottom: 1px solid #fff !important;
    } */
}

div.item-sku-select:hover {
    background: #fff;
    color: #000;
}

div.item-sku-select {
    margin-bottom: 1px;
    box-shadow: 1px 1px 1px #666;
}

.item-sku-select .sku-row-img {
    width: 10%;
    padding: 6px 0;
    float: left;
}

.item-sku-select .sku-row-name {
    width: 90%;
    padding: 12px 6px;
    float: left;
}

.item-sku-select .sku-row-name strong {
    margin-bottom: 10px;
    display: inline-block;
}

div#ui-datepicker-div {
    z-index: 10000 !important;
}


/* #tpl_order_history tr,
#tpl_return tr,
#tpl_cofbo tr {
    box-shadow: 0px 1px 1px #999;
} */

.blocked {
    display: block !important;
}

span.span_quantity.holder-quantity,
span.span_quantity.holder-quantity-bar {
    border: 1px solid #eee;
    border-radius: 6%;
    padding: 3px;
}

span.span_quantity.holder-price {
    border: 1px solid #eee;
    padding: 3px 5px;
    border-radius: 3px;
}

table.table tr:hover td span.span_quantity.holder-price,
table.table tr:hover td span.span_quantity.holder-quantity {
    border-color: #9fc191;
}

i.item-note.green {
    color: #59b84d;
}

i.item-note {
    display: inherit;
    width: 100%;
    color: red;
}

.nav-tabs>li>a {
    color: #757575;
}

.nav-tabs>li.active>a {
    color: var(--main-color) !important;
    font-weight: bold;
}

.iframe.payment-cash-received i {
    display: block;
    position: absolute;
    right: 26px;
    bottom: 10px;
    color: VAR(--MAIN-COLOR-HOVER);
    font-size: 16px;
}

ul.tab-order-type a[data-toggle="disabled"] {
    opacity: 0.33;
    background: rgb(236, 235, 235);
    border: 1px solid rgb(236, 235, 235);
    cursor: not-allowed;
}

span.max-allowed-order {
    font-size: 12px;
    color: red;
}

.main-home .search_code.delete {
    right: 34px;
    opacity: 0.88;
}

#list_members tr.rows-info td {
    padding: 10px 5px;
    cursor: pointer;
}

#list_members tr.rows-detail td {
    display: none;
}


/* ########## 47Kaido Nguyen Update Css 18/4/2019 ########## */

.select_store {
    right: 10px;
    top: 15px;
    background: none;
    height: 30px;
    min-width: 120px;
}

.primary-report .nav-storing li {
    width: 20%;
    text-align: center;
}

@media (max-width: 991px) {
    .primary-report .nav-storing li {}
}

@media (max-width: 767px) {
    .primary-report .nav-storing li {
        width: 50%;
        text-align: left;
        border-bottom: 1px solid #ddd;
        border-right: 1px solid #ddd;
        padding: 0px 8px;
        border-left: 1px solid #ddd;
        border-top: 1px solid #ddd;
        margin-right: -1px;
    }
    .primary-report .nav-storing li select {
        width: 100%;
    }
    .primary-report {
        margin-top: 42px;
    }
    .select_store {
        position: relative;
        top: 0px;
        right: 0px;
        width: calc(100% - 10px);
        margin-top: 20px;
        background: VAR(--MAIN-COLOR-HOVER);
        margin-left: 5px;
    }
    .title_report_1 .title1 {
        text-align: left;
    }
    .form_now {
        margin-bottom: 10px;
    }
    .table_baocao .table-responsive {
        border: none;
    }
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: none;
}

#list_department_sub.table-responsive>.table>thead>tr>th,
#list_department_sub.table-responsive>.table>tbody>tr>th,
#list_department_sub.table-responsive>.table>tfoot>tr>th,
#list_department_sub.table-responsive>.table>thead>tr>td,
#list_department_sub.table-responsive>.table>tbody>tr>td,
#list_department_sub.table-responsive>.table>tfoot>tr>td {
    white-space: nowrap;
    background: none !important;
    vertical-align: top;
}

#list_department_sub .holder-root-list tr td {
    background: none !important;
}

#list_department_sub.table-responsive>.table>thead>tr>th {
    min-width: 350px;
}

#list_department_sub.table-responsive>.table,
#list_department_sub.table-responsive>.table .table {
    margin-bottom: 0px;
}

#list_department_sub.table-responsive>.table span.group_func.icon-cate {
    display: block;
    height: 20px;
    width: 20px;
    font-size: 12px;
    padding: 4px 0px;
    margin: 2px 0px;
    float: right;
}

#list_department_sub.table-responsive>.table span.group_func.icon-cate.icon-other-x {
    background: #ce0606;
}

#list_department_sub.table-responsive>.table .department-show-child {
    vertical-align: middle;
}

#list_department_sub.table-responsive>.table .department-show-child12,
.table .show-middle {
    vertical-align: middle;
    padding: 0px 5px 1px;
}

.table .show-middle span.group_func.icon-cate {
    padding: 6px 0px 0px 0px;
}

#list_department_sub.table-responsive>.table .department-show-child11 {
    vertical-align: middle;
}

.primary-report .nav-storing li a {
    padding: 10px 0px;
    display: inline-block;
}

.primary-report .nav-storing li select {
    border: none;
    background: none;
}

.primary-report .nav-storing li select:focus {
    outline: none;
}

.primary-report .nav-storing.nav-tabs>li.active>a,
.primary-report .nav-storing.nav-tabs>li.active>a:hover,
.primary-report .nav-storing.nav-tabs>li.active>a:focus {
    background: none;
    color: #555;
    border-bottom: none !important;
}

.primary-report .nav-storing.nav-tabs>li.active,
.primary-report .nav-storing.nav-tabs>li.active:hover,
.primary-report .nav-storing.nav-tabs>li.active:focus {
    background: none;
    color: VAR(--MAIN-COLOR-HOVER);
    border-bottom: 3px solid VAR(--MAIN-COLOR-HOVER) !important;
}

.title_report_1 {}

.title_report_1 .title {
    color: VAR(--MAIN-COLOR-HOVER);
    display: block;
    text-align: center;
    font-size: 22px;
    margin: 10px 0px 0px 0px;
}

.title_report_1 .title_order {
    color: #55b948;
    display: block;
    text-align: center;
    font-size: 14px;
    margin-bottom: 20px;
}

.title_report_1 .title1 {}

.form_now {
    border: 1px solid #ddd;
    border-radius: 5px;
    line-height: 32px;
    padding: 1px 0px;
    text-align: left;
    cursor: pointer;
    position: relative;
}

.form_now .tab_form_now {
    display: none;
}

.form_now .tab_form_now.active {
    display: block;
}

.form_now p {
    margin: 0px;
    line-height: 29px;
    padding-right: 10px;
    color: #585858;
    padding-left: 10px;
}

.form_now p span {
    font-size: 18px;
    margin-top: 5px;
    margin-right: -1px;
}

.form_now .fa-angle-up {
    display: none;
}

.form_now.active p .fa-angle-down {
    display: none;
}

.form_now.active p .fa-angle-up {
    display: block;
    color: VAR(--MAIN-COLOR-HOVER);
}

.form_now.active {
    border-color: VAR(--MAIN-COLOR-HOVER);
}

.form_now.active p {
    color: VAR(--MAIN-COLOR-HOVER);
}

.form_now_date {
    width: 636px;
    position: absolute;
    right: 0px;
    top: 100%;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 10px #c1c1c1;
    padding: 20px;
    margin-top: 2px;
    z-index: 99;
    display: none;
}

.overlay_form_now_date {
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: 98;
    cursor: pointer;
    display: none;
    background: rgba(0, 0, 0, 0.75);
}

.form_now_date .nav {
    margin: -20px -20px 20px -20px;
    border: none;
}

.form_now_date .nav li {
    width: 16.666666666%;
}

@media (max-width: 767px) {
    .form_now {
        margin-top: 15px;
    }
    .form_now_date {
        width: calc(100% - 10px);
        position: fixed;
        top: 5px;
        left: 5px;
        margin-top: 0px;
    }
    .form_now_date .nav li {
        width: 50%;
        border-bottom: 1px solid #ffffff;
        margin: 0px;
    }
}

.form_now_date .nav li a {
    margin: 0px;
    border: 0px;
    border-radius: 0px;
    background: #e8e8e8;
    color: #555;
    border-right: 2px solid #fff;
    text-align: center;
}

.form_now_date .nav li:last-child a {
    border-right: none !important;
}

.form_now_date .nav-tabs>li.active>a,
.form_now_date .nav-tabs>li.active>a:hover,
.form_now_date .nav-tabs>li.active>a:focus {
    background: #eaf8fb;
    border-left: none;
    border-top: none;
    border-bottom: none;
    border-right: 2px solid #fff;
}

.form_now_date .input select,
.input-date-ex-rp select {
    background: none;
    width: 100%;
    color: #555;
    height: 34px;
}

.form_now_date .input input,
.input-date-ex-rp input {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px 12px;
    width: 100%;
    color: #888;
    outline: none !important;
    margin: 0px 0px;
    height: 34px;
}

.form_now_date .input img.icon-date,
.input-date-ex-rp img.icon-date {
    position: absolute;
    top: 6px;
    right: 14px;
    width: 20px;
}

.form_now_date .btn-success1 {
    margin: 20px 0px 0px;
}

.form_now_date .btn-success1 a {
    padding: 8px 30px 8px;
}

.primary-report table.table-bg-no tbody tr {
    box-shadow: none;
}

.primary-report table.table-bg-no tr td {
    border: 1px solid #e8e8e8;
    padding: 14px 8px;
}

.primary-report #tab_report_dhkd table.table-bg-no tr td {
    padding: 11px 10px;
    font-size: 14px;
}

.primary-report table.table-bg-no tr th {
    border: none;
    line-height: 18px;
}

.primary-report table.table-bg-no {
    border: none;
}

.pagination>li>a,
.pagination>li>span {
    min-height: 34px;
    display: flex;
    align-items: center;
}

.pagination>li>i {
    min-height: 34px;
    display: flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 0;
    color: #fff;
    position: relative;
    text-decoration: none;
    background: #36a9e1;
}

.primary-report .pagination>li>a,
.primary-report .pagination>li>span {
    border: none;
    padding: 0px 6px;
    border-right: 1px solid #ddd;
    border-radius: 0px !important;
    color: #555;
    margin-left: 0px;
}

.primary-report .pagination>.active>a,
.primary-report .pagination>.active>span,
.primary-report .pagination>.active>a:hover,
.pagination>.active>span:hover,
.primary-report .pagination>.active>a:focus,
.pagination>.active>span:focus {
    color: var(--main-color-hover);
    background: none;
    border-color: #ddd;
}

.primary-report .pagination>li:last-child>a,
.primary-report .pagination>li:last-child>span,
.primary-report .pagination>li:first-child>a,
.primary-report .pagination>li:first-child>span,
.primary-report .pagination>li:nth-last-child(2)>a,
.primary-report .pagination>li:nth-last-child(2)>span {
    /* border-right: none !important; */
}

.primary-report .pagination>li>a:hover,
.primary-report .pagination>li>span:hover,
.primary-report .pagination>li>a:focus,
.pagination>li>span:focus {
    background: none;
    color: var(--main-color-hover);
}

.table_baocao {
    display: none;
}

.title_report_1 .form-search button {
    right: auto;
    left: 2px;
    top: 5px;
    height: 36px;
    width: 40px;
}

.title_report_1 .form-search input {
    padding-left: 42px;
}

.primary-report table.table-bg-no tr.total_report_1 td {
    border: none;
    font-size: 16px;
}

.table_baocao.report_baocao_banhang_tonghop table.table-bg-no tbody tr {
    box-shadow: 0px 0px 15px #999;
    color: #55b948;
}

.table_baocao.report_baocao_banhang_tonghop table.table-bg-no tbody tr td {
    border: none;
    padding: 20px 8px 18px;
}

.table_baocao table.table-bg-no tbody tr td .fa {
    margin-left: 10px;
    margin-right: 2px;
}

.table_baocao .item-rows table.table-bg-no tbody tr.tr-sub {
    box-shadow: none;
    background: #e8e8e8;
    display: none;
    box-shadow: none;
}

.table_baocao .item-rows.active tr.tr-sub {
    display: table-row;
}

.table_baocao .item-rows .fa-angle-up {
    display: none;
}

.table_baocao .item-rows.active .fa-angle-down {
    display: none;
}

.table_baocao .item-rows.active .fa-angle-up {
    display: inline-block;
}

.table_baocao .item-rows table.table-bg-no tbody tr.tr-sub td {
    padding: 0px;
}

.table_baocao .item-rows table.table-bg-no tbody tr.tr-sub tr {
    box-shadow: none;
}

.table_baocao.report_baocao_banhang_tonghop .item-rows tr.tr-line {
    box-shadow: none;
}

.table_baocao.report_baocao_banhang_tonghop .item-rows tr.tr-line td {
    padding: 0px;
}

.table_baocao .item-rows tr.tr-sub>td {
    padding-left: 15px !important;
    background: #fff;
    padding-bottom: 0px !important;
    padding-right: 0px !important;
    padding-top: 0px !important;
}

.table_baocao .item-rows tr.tr-sub>td table tr {
    box-shadow: none;
    background: #efefef;
}

.table_baocao .item-rows tr.tr-sub>td table tr th {
    background: #d6edf5;
    padding: 12px 8px;
    font-weight: 600;
    font-size: 14px;
}

.table_baocao .item-rows tr.tr-sub>td table tr td {
    padding: 12px 8px !important;
    font-weight: normal;
    font-size: 14px;
    border-top: 1px solid #ddd;
    color: #555;
}

.table>tbody+tbody {
    border-top: none;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order {
    background: #f7f7f7;
    display: none;
}

.table_baocao .item-rows tr.tr-sub tbody.active tr.tr-detail-order {
    display: table-row;
}

.table_baocao .item-rows tr.tr-sub tbody.active {
    border: 1px solid #55b948;
}

.table_baocao .item-rows tr.tr-sub tbody.active .tr-detail-order-click td {
    border-top: 1px solid #55b948;
}

.table_baocao .item-rows tr.tr-sub tbody.active tr.tr-detail-order>td {
    border-bottom: 1px solid #55b948;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td {
    padding: 0px !important;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td>.row {
    margin: 0px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td>.row>div,
table.table-booking-sub .item-rows tr.tr-sub tr.tr-detail-order td>.row>div {
    border-right: 1px solid #ddd;
    padding: 15px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td .row>div p,
div.detail_order_booking>div p {
    margin-bottom: 2px;
    color: #999;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td .row>div select,
div.detail_order_booking div select {
    padding: 0px 10px;
    min-width: 130px;
    margin-left: 5px;
    height: 32px;
}


/**/

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table,
div.detail_order_booking table {
    margin-top: 15px;
    border-top: none;
    border-left: none;
    border-right: none;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table tr,
div.detail_order_booking table tr {
    background: none;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table tr th,
div.detail_order_booking table tr th {
    background: none;
    border: none;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table tr td,
div.detail_order_booking table tr td {
    padding: 12px 8px !important;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub,
div.detail_order_booking table .note_order_sub {
    text-align: left;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub p,
div.detail_order_booking table .note_order_sub p {
    margin: 20px 0px 0px 4px;
    color: #000;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub textarea,
div.detail_order_booking table .note_order_sub textarea {
    background: #fff;
    width: 100% !important;
    border: 1px solid #ddd;
    min-height: 110px;
    border-radius: 5px;
    margin-top: 10px;
    padding: 10px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub textarea:focus {
    outline: none;
    border: 1px solid #3e8f3e;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub .btn-success1 {
    margin: 10px 0px 0px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .note_order_sub .btn-success1 a img,
div.detail_order_booking table .note_order_sub .btn-success1 a img {
    margin-right: 6px;
    position: relative;
    top: -1px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .total_order_sub,
div.detail_order_booking .total_order_sub {
    text-align: left;
    padding: 0px 10px;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .total_order_sub p,
div.detail_order_booking .total_order_sub p {
    margin-top: 10px;
    color: #555;
}

.table_baocao .item-rows tr.tr-sub tr.tr-detail-order td table .total_order_sub p span,
div.detail_order_booking .total_order_sub p span {
    display: inline-block;
    min-width: 110px;
}


/**/

.primary-report #tab_report_kho table.table-bg-no tr:first-child td {
    background: #d6edf5;
    border: none;
}

.kho_baocao_giatri_tonkho table thead tr {
    background: #f1f1f1;
}

.kho_baocao_giatri_tonkho table thead tr th {
    vertical-align: middle;
    border: 1px solid #ddd !important;
    padding: 10px 8px;
}

.title_report_1 .ncc_radio label input[type="radio"].ace+.lbl,
.title_report_1 label.ace input[type="radio"].ace+.lbl {
    margin-right: 0px;
}

.title_report_1 .ncc_radio_add_customer.ncc_radio label {
    margin-left: 15px;
    color: #555;
    font-size: 15px;
}

.tr-sub1 .text-left {
    padding-left: 30px !important;
}

.info_detail>div {
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 5px;
}

.info_detail>div>div span {
    display: inline-block;
    padding-top: 8px;
    margin-left: 0px;
}

.info_detail>div>div input:disabled {
    border: none;
    background: none;
    font-weight: bold;
    color: #000;
}

.info_detail>div>div select:disabled {
    background: none;
}

table.table-bg-no.members tbody tr {
    box-shadow: none;
    background: none;
}

table.table-bg-no.members tbody:nth-child(2n) {
    background: #f9f9f9;
}

table.table-bg-no.members thead tr th a {
    font-size: 12px;
}

.info_detail>div>div .ncc_radio_add_customer {
    margin-top: 0px;
}

.info_detail>div>div .ncc_radio_add_customer span {
    padding-top: 0px;
    margin-top: -10px;
}

.member-trans table.table-bg-no {
    border-top: none;
}

.member-trans table.table-bg-no tbody tr {
    box-shadow: none;
}

.member-trans table.table-bg-no thead tr th {
    padding: 10px 8px;
}

.member-trans table.table-bg-no tbody tr td {
    border: 1px solid #ddd;
    padding: 8px 8px;
}


/**/

.member_list {}

.img_avatar_profile {
    width: 96px;
    height: 72px;
    border-radius: 3px;
    position: relative;
    border: 1px dashed #959595;
    display: block;
    margin: 10px auto;
}

.img_avatar_profile i {
    color: #777;
    font-size: 22px;
    height: 22px;
    width: 23px;
    position: absolute;
    top: 0px;
    left: 0px;
    margin: auto;
    bottom: 0px;
    right: 0px;
}

.profile_info {
    display: none;
}

table.table-bg-no.members tbody.active .profile_info {
    display: table-row;
}

table.table-bg-no tbody.active .profile_info {
    display: table-row;
}

.profile_info td {
    background: #fff !important;
}

.profile_info .form-group {
    text-align: left;
    float: left;
    width: 100%;
    border-bottom: 1px solid #eee;
    padding-bottom: 11px;
    margin-bottom: 11px;
    font-size: 14px;
    color: #111;
}

.profile_info .form-label {
    float: left;
    width: 150px;
    white-space: normal !important;
}

.profile_info .form-wrap {
    float: left;
    width: calc(100% - 150px);
}

.profile_info .nav {
    background: #ebebeb;
    position: relative;
    padding: 5px 0px 0px;
}

.profile_info .nav-storing li a {
    border-radius: 5px 5px 0px 0px;
    padding: 6px 25px;
    font-size: 14px;
}

.profile_info .nav-storing.nav-tabs>li.active>a,
.profile_info .nav-storing.nav-tabs>li.active>a:hover,
.profile_info .nav-storing.nav-tabs>li.active>a:focus {
    color: #000;
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-bottom: 1px solid #fff !important;
}

.profile_info .tab_pro {
    display: none;
}

.profile_info .tab_pro.active {
    display: block;
}

table.table-bg-no.members tbody.active {
    border: 1px solid #55b948;
}

table.table-bg-no.members tbody.active tr.profile_click {
    background: #ebebeb;
}

table.table-bg-no.members tbody.active tr.profile_click td {
    border-bottom: none;
    border-top: 1px solid #55b948;
}

table.table-bg-no.members tbody.active tr.profile_click td>lastChild {
    border-right: 1px solid #55b948;
}

table.table-bg-no.members tbody.active .profile_info td {
    /* border-bottom: 1px solid #55B948; */
    border-top: none;
    background: #fff !important;
}

.icon-add-member-group {
    margin: auto;
    font-size: 36px;
    color: #ccc;
    opacity: 0.55;
    cursor: pointer;
}

.icon-add-member-group:hover {
    color: #00a2e8;
    opacity: 0.88;
}

span.commission_group_func.icon-cate.active,
span.group_func.icon-cate.active,
span.group_func.glyphicon.active {
    background: none repeat scroll 0 0 #5cb85c;
    color: #fff;
}

span.commission_group_func.icon-cate,
span.group_func.icon-cate {
    background: none repeat scroll 0 0 #cccccc;
    border-radius: 4px;
    clear: both;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    padding: 7px 0px 0px 0px;
    text-align: center;
    vertical-align: middle;
    height: 28px;
    width: 28px;
    cursor: pointer;
}

.tab_infomation_history.active td,
.tab_infomation_order_booking.active td {
    border-bottom: 1px solid #f1f1f1 !important;
    border-top: none;
    padding: 12px !important;
}

.ui-dropdownchecklist.ui-widget,
.ui-dropdownchecklist.ui-widget .ui-state-default {
    min-height: 34px;
}

.ui-dropdownchecklist.ui-widget {
    width: 100% !important;
    display: block !important;
    z-index: 3 !important;
}

.ui-dropdownchecklist.ui-widget .ui-state-default {
    border-radius: 3px;
    background-color: #fff;
    width: 100% !important;
    display: block !important;
}

.ui-dropdownchecklist.ui-widget .ui-state-default {
    border-radius: 3px;
    background-color: #fff;
    width: 100% !important;
    display: block !important;
}

.ui-dropdownchecklist.ui-widget div.ui-dropdownchecklist-item.ui-state-default {
    margin: 4px 4px;
    width: calc(100% - 8px) !important;
    position: relative;
    cursor: pointer;
}

.ui-dropdownchecklist.ui-widget div.ui-dropdownchecklist-item.ui-state-default input {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    position: absolute;
    top: 9px;
    width: auto;
    height: auto;
    left: 9px;
    margin: 0px;
}

.ui-dropdownchecklist-text {
    font-weight: 400;
    color: #444;
    position: relative;
    top: 3px;
    left: 8px;
    font-size: 14px;
    padding: 3px 0px;
}

.ui-dropdownchecklist.ui-widget .ui-dropdownchecklist-text {
    width: calc(100% - 5px) !important;
    min-width: 220px;
    white-space: normal;
    cursor: pointer !important;
}

.ui-widget-header span {
    display: block;
    top: 0px;
    left: 0px;
    padding-left: 10px;
}

.ui-datepicker-title span {
    display: inline-block;
    padding-left: 0px;
}

@media (max-width: 767px) {
    .ui-dropdownchecklist.ui-widget .ui-dropdownchecklist-text {
        min-width: inherit;
        line-height: 1.3;
    }
}

.ui-dropdownchecklist-item .ui-dropdownchecklist-text {
    top: 0px;
    padding: 0px 0px !important;
}

div.ui-dropdownchecklist-item.ui-state-default label {
    font-size: 14px;
    padding-left: 10px !important;
    color: #333;
}

div.detail_order_booking {
    padding: 5px 10px;
}

div#popup-liabilities {
    top: 57px;
    left: 11px;
    width: 96%;
}

div#popup-liabilities i {
    float: right;
    cursor: pointer;
}

div#popup-liabilities .btn-success1 {
    margin: 10px 0px;
    float: right;
}

div#popup-liabilities .btn-success1 a {
    cursor: pointer;
}

.wrap-info-in input.gid-edit {
    height: 30px;
    color: #333;
}

.modal-modify-user .label-name {
    text-align: right;
    padding-top: 5px;
    color: #555;
}

@media (max-width: 991px) {
    .modal-modify-user .label-name {
        text-align: left;
        display: block;
        margin: 5px 0px;
    }
}

.alert_auto_remove {
    z-index: 10000;
    width: 50%;
    position: fixed;
    margin: 0 auto;
    margin-left: 25%;
    margin-top: 5px;
}

.alert-dismissable .close,
.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: 0.2;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.btn-success1 a {
    margin-right: 10px;
    display: inline-block;
}

.btn-success1 a img {
    height: 14px;
    width: auto;
    margin-right: 5px;
    position: relative;
    top: -1px;
}

.btn-success1 a:hover {
    text-decoration: underline;
}

div.tab_liabilities tbody td {
    border-bottom: 1px solid #f1f1f1 !important;
}

input#liabilities_total_paid {
    font-size: 16px;
    text-align: center;
    margin-bottom: 5px;
    color: green;
}

tbody.row-suppliers.active td.border-r {
    border-right: 1px solid #55b948 !important;
}

.tab_infomation_profile div.input_name input {
    border: none;
    padding: 12px 6px;
}

strong.label-show {
    color: #888888;
}

#hold_file_show+.item {
    width: 100%;
}

input.autosear+i.remove-item {
    display: none !important;
}

input.autosear:disabled+i.remove-item:hover {
    box-shadow: 3px 2px 2px #ccc;
}

input.autosear:disabled+i.remove-item {
    display: flex !important;
    position: absolute;
    right: 8px;
    top: 23%;
    background: #ec6c6f;
}

p.lia-total-paid {
    color: red;
    border-bottom: 1px solid #ff2a2a;
    margin-bottom: 2px;
}

p.lia-total-paid+p {
    margin-bottom: 2px;
}

.printing i.glyphicon.glyphicon-print {
    color: cornflowerblue;
    font-size: 22px;
    top: 6px;
    display: inline-block;
    position: relative;
}

input#txt_searching.product {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 6px 11px;
    height: 34px;
}

p.product-code {
    margin: 0;
    padding-top: 3px;
}

.modal-xuat-bao-cao {
    width: 96%;
    min-height: 600px;
}

div.content-ex-bao-cao {
    min-height: 520px;
}

.r-thu-ngan div {
    padding-top: 5px;
}

img.confirm-import {
    cursor: pointer;
}

select#rncc_providers_id {
    height: 41px;
}

.tab-pane-price.active input {
    height: 42px;
}

.btn-img {
    margin: 5px 15px;
    display: inline-block;
    margin-top: 24px;
}

@media (max-width: 991px) {
    .text-right-treasurer {
        text-align: left;
        margin-top: 10px;
    }
}

@media (max-width: 767px) {
    .btn-img {
        margin-top: 0px;
    }
}

#btn_sale div#popup-sale {
    top: 16px;
    right: -62px;
    position: absolute;
}

#btn_sale #txt_sale_percent,
#btn_sale #txt_sale_price,
#btn_sale ul li a {
    height: 42px !important;
}

#btn_sale #popup-sale {
    font-size: 15px;
    width: 250px;
    padding: 10px;
}

ul.store_menu li.disabled {
    background: #ccc !important;
}

ul.store_menu li {
    width: 31.8%;
    margin-left: 0.7%;
    margin-right: 0.7%;
    float: left;
    font-size: 15px;
    text-align: center;
    color: #458cc7;
    box-sizing: border-box;
    background: #f5f5f5;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(1, #ffffff));
    background: -ms-linear-gradient(bottom, #eeeeee, #ffffff);
    background: -moz-linear-gradient(center bottom, #eeeeee 0%, #ffffff 100%);
    background: -o-linear-gradient(#ffffff, #eeeeee);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
    margin-bottom: 10px;
    position: relative;
}

@media (max-width: 767px) {
    ul.store_menu li {
        width: 100%;
        margin-left: 0px;
        margin-right: 0px;
    }
}

ul.store_menu {
    list-style: none;
    margin: 10px 0px;
    padding: 0px;
    font-size: 14px;
    position: relative;
}

ul.store_menu:after {
    content: "";
    display: block;
    clear: both;
}

ul.store_menu a.check span.fa-check {
    display: block;
}

ul.store_menu span.icon-cate {
    margin-right: 5px;
    font-size: 25px;
    vertical-align: -5px;
}

ul.store_menu span.fa-check.disabled {
    background: #ccc !important;
}

ul.store_menu span.icon-cate {
    margin-right: 5px;
    font-size: 25px;
    vertical-align: -5px;
}

ul.store_menu span.fa-check {
    color: #fff;
    background: green;
    font-size: 16px;
    padding: 8px 8px 8px 7px;
    border-radius: 50%;
    position: absolute;
    right: 8px;
    bottom: 0px;
    display: none;
    height: 30px;
    width: 30px;
    top: 0px;
    margin: auto;
}

.img11111 {
    height: 74px;
    border: 1px solid #ddd;
    width: 62px;
    margin: 4px auto 4px;
    position: relative;
    overflow: hidden;
}

#tpl_shop a.shop_items p,
.cate_menu .root_items p,
.cate_menu .cat_items p {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: relative;
    top: 50%;
    display: block;
    margin-top: 0px !important;
    line-height: 1.3;
    font-size: 14px;
    max-height: 36px;
    overflow: hidden;
    margin-bottom: 0px;
}

#tpl_shop a.shop_items p {
    width: 100%;
    margin: 0px;
}

b.float-right.SP {
    z-index: 30;
    font-weight: 400;
    position: absolute;
    bottom: 50px;
    background: #fff;
    width: 100%;
    text-align: left;
    color: #222;
    padding: 0px 10px;
}

#tpl_lshop_holder li a p {
    width: 100%;
    margin: 12px 0px -16px;
    position: static;
    max-height: none;
}

.hide_mobile_11 {
    display: none;
}

@media (max-width: 767px) {
    #tpl_lshop_holder li {
        padding: 0px 6px 0px;
    }
    .height-6011 {
        margin-bottom: 50px;
    }
    .height-6011 .btn-group11 {
        position: absolute;
        top: 24px;
        left: 6px;
        width: calc(100% - 10px);
        background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
        background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
        background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
        background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
        filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
        background-repeat: repeat-x;
        border-color: #dbdbdb;
        border-color: #ccc;
        padding: 0px;
    }
    .padding-l-70111 {
        padding-left: 7px;
        padding-top: 4px;
    }
    .mobile_top5div .row>div {
        margin: 3px 0px;
    }
    .title_item_B_111 {
        margin-top: -20px;
    }
    .title_item_B_111>div {
        float: none;
        margin: 8px 0px 0px !important;
    }
}

div.hd_select_store_delete select {
    height: 40px;
    width: 100%;
}

div.hd_select_store_delete strong {
    margin-top: 8px;
    display: block;
}

div.hd_select_store_delete {
    height: 43px;
    text-align: right;
    margin-bottom: 20px;
}

select.payment_type_liabilities {
    height: 43px;
    width: 100%;
}

img.delete_liabilities_history {
    height: 30px;
    cursor: pointer;
}

.table-head thead td {
    background: #f1f1f1;
    font-weight: bold;
}

div#popup-general input {
    padding: 10px;
    margin-top: 6px;
}

div#popup-general {
    position: static;
    width: 100%;
    background: #fff;
    border-radius: 5px;
    padding: 20px;
}

div#popup-general i {
    margin: 0px;
    font-style: normal;
    font-size: 19px;
    position: absolute;
    right: 0px;
    top: -4px;
    border: 1px solid #f00;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 25px;
    border-radius: 40px;
    color: #f00;
}

div#btn_submit_general {
    float: right;
    margin-bottom: 0px;
    margin-top: 20px;
}

#popup-general.wrap-input-group p {
    text-align: left;
    margin: 0px 0px -10px 0px;
    color: #037dd1;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 600;
}

.calendar111 .hide_mobile {
    display: none;
}

.calendar111 .col-w-12per {
    width: 100%;
}

.calendar111 h4 {
    margin-top: 20px;
    margin-bottom: -10px;
}

.top20111 {
    margin-top: 0px;
    margin-bottom: 15px;
}

.calendar111 .hide_mobile_11 {
    display: block;
    float: left;
    width: 80px;
    text-align: left;
}

.calendar111 .hide_mobile_11 .top-63 {
    margin-top: 52px;
}

.calendar111 .hide_mobile_11 .top-20 {
    margin-top: 30px;
}

@media (max-width: 767px) {
    .calendar111 .hide_mobile_11 .top-20 {
        margin-top: 70px;
    }
}

.calendar111 .col-w-12per {
    display: block;
    float: left;
    width: calc(100% - 80px);
}

.checkbox-menu li label {
    display: block;
    padding: 3px 10px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    margin: 0;
    transition: background-color 0.4s ease;
    cursor: pointer;
}

.checkbox-menu li input {
    margin: 0px 5px;
    top: 2px;
    position: relative;
}

.checkbox-menu li.active label {
    background-color: #f4f4fb;
    font-weight: bold;
}

.dropdown-menu.checkbox-menu {
    background-color: #f1f1f1;
}

.checkbox-menu li label:hover,
.checkbox-menu li label:focus {
    background-color: #f5f5f5;
}

.checkbox-menu li.active label:hover,
.checkbox-menu li.active label:focus {
    background-color: #b8b8ff;
}

div span.badge {
    background-color: #ce0;
}

.search-order input+i {
    top: 14px;
    position: absolute;
    right: 18px;
    opacity: 0.6;
}

.search-order {
    padding: 15px;
    background: #fff;
    margin: 20px 0px;
    margin-bottom: 16px;
}

.bg-white {
    background: #fff;
}

.bank-holder .input_name input:focus {
    border-bottom: 2px solid #66afe9;
    transition-duration: 0.3s;
    background-size: 100% 2px, 100% 1px;
    outline: 0;
    color: #6b6b6b;
}

.bank-holder .input_name input {
    background: #fff;
    padding: 5px 8px;
    border-bottom: 2px solid #e7e7e7;
}

.bank-holder button.btn {
    margin-top: 10px;
}

.bank-holder {
    margin-top: 20px;
    background: #ececec;
    border-radius: 8px;
    padding: 20px;
    opacity: 0.9;
}

.close:hover {
    color: #000;
}

.modal-content.modal-sm {
    margin: 0 auto;
}

.ng-scope.ng-active {
    color: red;
}

.input-group.bootstrap-touchspin span.input-group-btn {
    background: #eaf7fd;
    color: #69b9de;
}

input.cart-quantity {
    font-weight: bold;
}

label.lb-bank {
    font-weight: bold;
    margin-top: 10px;
}


/*
- BEGIN NEW menu
*/

.head-new {
    padding: 5px 0px;
    position: relative;
}

.logo-news {
    float: left;
    padding: 2px 0px;
    text-align: center;
}

.logo-news img {
    height: 52px;
}

@media (max-width: 767px) {
    .logo-news {
        float: none;
    }
    .head-new {
        border-bottom: 1px solid #efefef;
    }
    .logo-news img {
        height: 38px;
    }
}

.toolbar-new {
    float: right;
}

.toolbar-new ul {
    margin: 0px;
    padding: 0px;
}

.toolbar-new ul li {
    display: inline-block;
    margin: 18px 15px;
}

.toolbar-new ul li:nth-child(1) {
    display: none;
}

.toolbar-new ul li a {
    color: #333;
}

.toolbar-new ul li i {
    margin-right: 8px;
}

@media (max-width: 767px) {
    .toolbar-new {
        float: none;
        white-space: nowrap;
        overflow-x: auto;
        position: absolute;
        top: 8px;
        right: 60px;
    }
    .toolbar-new ul li {
        margin: 6px 7px 4px;
        font-size: 18px;
    }
    .toolbar-new ul li span {
        display: none;
    }
    .toolbar-new ul li i {
        margin-right: 0px;
    }
}


/**/

.menu-new {
    background: var(--main-color);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

@media (max-width: 767px) {
    .menu-new {
        position: fixed;
        left: -400px;
        width: 250px;
        top: 0px;
        z-index: 11;
        height: 100%;
        background: #fff;
    }
    body .menu-new .container {
        padding: 0px !important;
    }
}

.menu-new.active {
    left: 0px;
}

.menu-new ul.menu1 {
    margin: 0px;
    padding: 0px;
}

.menu-new ul.menu1::after {
    content: '';
    display: block;
    clear: both;
}

.menu-new ul.menu1>li {
    display: inline-block;
    position: relative;
    list-style-type: none;
    float: left;
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li {
        display: block;
        border-bottom: 1px solid #f1f1f1;
        margin: 0px;
        float: none;
    }
}

.menu-new ul.menu1>li>a {
    color: #fff;
    display: block;
    padding: 12px 12px;
    /* border-right: 1px solid var(--main-color); */
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li>a {
        padding: 12px 15px;
        color: #444;
        font-weight: 600;
        border-right: none;
    }
}

.menu-new ul.menu1 li.active>a,
.menu-new ul.menu1 li:hover>a {
    background: var(--main-color-hover);
    text-decoration: none;
    color: #fff;
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li:hover>a {
        background: #fff;
        color: #444;
    }
    .menu-new ul.menu1>li.active>a {
        background: var(--main-color-hover);
        color: #fff;
    }
}

.menu-new ul.menu1>li>a>i {
    margin-right: 5px;
    font-size: 15px;
}

.menu-new ul.menu1>li>a>span,
.menu-new ul.menu1>li>a>i {
    margin-right: 5px;
    font-size: 16px;
    position: relative;
    top: 1px;
}

.menu-new ul.menu1>li>.sub {
    display: none;
    background: var(--main-color-hover);
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999999;
    min-width: 280px;
    -webkit-box-shadow: 0 5px 25px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 5px 25px rgba(0, 0, 0, 0.25);
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.25);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 0px 0px 5px 5px;
    padding: 10px 0px;
    margin: 0px;
}

.menu-new ul.menu1>li>.sub>li .sub {
    position: absolute;
    left: 100%;
    background: var(--main-color-hover);
    min-width: 280px;
    top: 0px;
    padding: 0px;
    margin: 0px;
    display: none;
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li>.sub>li .sub {
        position: relative;
        display: block !important;
        width: 100%;
        left: 0px !important;
        min-width: inherit;
        background: #fff;
        right: auto !important;
        padding-left: 15px;
        height: auto !important;
        opacity: 1 !important;
    }
}

.menu-new ul.menu1>li:nth-child(8)>.sub>li:hover .sub,
.menu-new ul.menu1>li:nth-child(9)>.sub>li:hover .sub,
.menu-new ul.menu1>li:nth-child(10)>.sub>li:hover .sub {
    left: auto;
    right: 100%;
}

.menu-new ul.menu1>li>.sub>li:hover>.sub {
    display: block;
}

.menu-new ul.menu1>li>.sub>li>.sub>li:hover>.sub {
    display: block;
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li>.sub {
        display: none;
        width: auto;
        box-shadow: none;
        position: relative;
        min-width: auto;
        border-radius: 0px;
        background: none;
        padding: 0px;
        padding-left: 0px;
    }
    .menu-new ul.menu1>li>.sub li {
        border-bottom: 1px solid #f1f1f1;
    }
}

.menu-new ul.menu1>li:last-child>.sub {
    left: auto;
    right: 0px;
}

.menu-new ul.menu1>li:hover>.sub {
    display: block;
}

.menu-new ul.menu1>li .sub>li {
    list-style-type: none;
    position: relative;
}

.menu-new ul.menu1>li .sub>li>a {
    color: #fff;
    display: block;
    padding: 11px 15px;
}

@media (max-width: 767px) {
    .menu-new ul.menu1>li .sub>li>a {
        color: #444;
        padding: 10px 10px;
        position: relative;
        z-index: 1;
    }
    .menu-new ul.menu1>li:hover>.sub {
        display: none;
    }
    .menu-new ul.menu1>li.active>.sub {
        display: block;
    }
}

.menu-new ul.menu1>li .sub>li:hover>a,
.menu-new ul.menu1>li .sub>li.active>a {
    background: var(--main-color-hover-sub);
    text-decoration: none;
    color: #fff;
}

.menu-new ul.menu1>li .sub>li>a i {
    margin-right: 10px;
    font-size: 18px;
    position: relative;
    top: 2px;
}

.menu-new ul.menu1>li .sub>li>a>span {
    margin-right: 10px;
    font-size: 18px;
    position: relative;
    top: 2px;
}

.menu-new ul.menu1>li .sub>li>a i.fa-angle-right {
    float: right;
    margin-right: 0px;
    position: absolute;
    right: 10px;
    top: 13px;
}

.icon-menu-pc {
    display: none;
    float: left;
    background: #fff;
    padding: 15px 20px;
    position: absolute;
    z-index: 2;
    cursor: pointer;
    left: 0px;
    top: 0px;
}

@media (max-width: 767px) {
    .icon-menu-pc {
        display: block;
    }
}

.icon-menu-pc .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    background: #333;
    margin: 4px 0px;
}

.overlay-menu-new {
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: 10;
    background: rgba(0, 0, 0, 0.6);
    display: none;
}

.overlay-menu-new.active {
    display: block;
}

.logo-mobile {
    display: none;
    text-align: center;
    padding: 6px 0px;
    border-bottom: 1px solid #ddd;
}

.logo-mobile img {
    display: inline-block;
    max-height: 42px;
}

@media (max-width: 767px) {
    .logo-mobile {
        display: block;
    }
}

.menu-minus {
    position: absolute;
    right: 0px;
    font-size: 30px;
    top: 0px;
    height: 44px;
    bottom: 0px;
    width: 40px;
    text-align: center;
    cursor: pointer;
    display: none;
}

.menu-new ul.menu1>li.active .menu-minus {
    color: #fff;
}

.menu-plus {
    position: absolute;
    right: 0px;
    font-size: 24px;
    top: 0px;
    height: 44px;
    line-height: 44px;
    width: 40px;
    text-align: center;
    cursor: pointer;
    display: none;
    z-index: 1;
}

.menu-plus.active {
    display: block;
}

.menu-new ul.menu1>li.active .menu-plus,
.menu-minus.active {
    color: #fff;
}

.back-menu {
    position: absolute;
    top: 0px;
    right: 0px;
    background: #fff;
    padding: 16px 15px 15px;
    font-size: 16px;
}

@media (min-width: 768px) {
    .menu-new ul.menu1 {
        height: auto !important;
    }
    .overlay-menu-new {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .menu-minus {}
    .menu-plus {
        display: block;
    }
    .menu-new ul.menu1>li.active .menu-plus {
        display: none;
    }
    .menu-new ul.menu1>li.active .menu-minus {
        display: block;
    }
    .menu-new ul.menu1 {
        overflow-y: auto;
    }
}

.nav-admin {
    float: right;
    line-height: 54px;
    padding: 0px 20px;
    color: #fff;
    font-size: 14px;
    margin: 0px;
    position: relative;
}

.nav-admin li {
    position: static;
    list-style-type: none;
}

.nav-admin a {
    color: #888;
}

.nav-admin a img {
    float: left;
    margin: 10px 4px 10px 0px;
}

@media (max-width: 991px) {
    .nav-admin {
        padding: 0px 10px;
        line-height: 54px;
    }
    .nav-admin a img {
        margin: 9px 0px;
    }
}

.nav-admin a span {
    display: inline-block;
    margin: 0px 10px 0px 5px;
}

@media (max-width: 767px) {
    .nav-admin {
        line-height: 34px;
        position: absolute;
        padding: 8px;
        top: 0px;
        right: 0px;
        text-align: center;
        float: none;
    }
    .nav-admin a {
        font-size: 13px;
    }
    .nav-admin a span {
        white-space: nowrap;
        float: left;
        max-width: 155px;
        padding: 0px 6px 0px 6px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        display: none;
    }
    .nav-admin a img {
        margin: 0px;
    }
    .nav-admin>li>a>i {
        position: absolute;
        right: 7px;
        top: 0px;
        height: 13px;
        bottom: 0px;
        margin: auto;
        display: none;
    }
}


/**/

.nav-admin>li .sub-menu {
    background: var(--main-color-hover);
    left: auto;
    right: 0px;
    padding: 2px 0px 0px;
    top: 100%;
    margin-top: 5px;
    min-width: 200px;
    box-shadow: 0px 1px 15px var(--main-color);
    border: 1px solid var(--main-color);
}

.nav-admin>li .sub-menu:after {
    bottom: 100%;
    right: 8px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: var(--main-color);
    border-width: 16px;
    margin-left: -16px;
    z-index: 1;
}

.nav-admin>li .sub-menu:before {
    bottom: 100%;
    right: 10px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: var(--main-color-hover);
    border-width: 14px;
    margin-left: -14px;
    z-index: 2;
}

@media (max-width: 767px) {
    .nav-admin>li .sub-menu {
        margin-right: 3px;
    }
}

.nav-admin>li .sub-menu li {
    display: block;
    padding: 0px 12px 12px;
}

.nav-admin>li .sub-menu li hr {
    margin: 0px auto;
    border-color: #232b3e;
    width: calc(100% + 24px);
    margin-left: -12px;
    box-shadow: 0px 0px 1px #fff;
}

.nav-admin>li .sub-menu li a {
    padding: 12px 0px 0px 0px;
    border-top: 1px solid var(--main-color);
    background: none;
    color: #fff;
    cursor: pointer;
}

.nav-admin>li .sub-menu li.border-none a {
    border: none;
    margin-top: -10px;
}

.nav-admin>li .sub-menu li:first-child a {
    border: none;
}

.nav-admin>li .sub-menu li a span {
    color: #3375d0;
    display: block;
    padding-left: 17px;
}

@media (max-width: 767px) {
    .nav-admin>li .sub-menu li a {
        padding: 12px 0px 0px 0px !important;
    }
}

.nav-admin>li .sub-menu li a>img {
    width: 20px;
    float: none;
    margin: -2px 6px 0px;
}

.nav-admin>li .sub-menu li:hover {
    background: var(--main-color-hover);
}

div.toolbar-new a:hover {
    cursor: pointer;
    color: var(--main-color);
}


/*
- END NEW menu
*/

h2.title-page {
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: 600;
    /* text-transform: uppercase; */
    color: var(--main-color);
    line-height: 1.3;
    margin: 12px 0;
}

h2.title-page1 {
    margin-top: 12px;
    font-size: 18px;
    margin-bottom: 2px;
}

.glyphicon.glyphicon-calendar {
    cursor: pointer;
}

@media (max-width: 767px) {
    h2.title-page {
        margin-top: 18px;
        margin-bottom: 16px;
        font-size: 20px;
        font-weight: 600;
        text-transform: uppercase;
        color: var(--main-color);
        text-align: center;
    }
}


/*
-BEGIN child in child member group
*/

ul.child-group,
.child-group>ul {
    list-style-type: none;
    padding: 0;
}

.child-group li {
    list-style-type: none;
}

ul.child-group li::before {
    content: "\25B6";
    color: green;
    display: block;
    margin-right: 0px;
    position: relative;
    top: 29px;
    margin-top: -12px;
    width: 20px;
    left: 10px;
}

#list_member_groups span.group_func.icon-cate.active,
#list_member_groups span.group_func.glyphicon.active {
    margin-bottom: -7px;
    display: inline-block;
}

#list_member_groups>li .table {
    margin-bottom: 0px;
}

#list_member_groups>li .table>tbody>tr>td:last-child {
    text-align: right;
}

#list_member_groups .group_func.icon-cate.icon-other-x,
#list_department .group_func.icon-cate.icon-other-x {
    background: #da231c;
}

.table>tbody.table_order_online>tr>td {
    vertical-align: middle;
}

.table>tbody.table_order_online>tr>td.treasurer_get_detail.bg-C {
    white-space: nowrap;
}


/*
-END child in child member group
*/

#by_user_cs+div.chosen-container.chosen-container-single,
#member_department_id+div.chosen-container.chosen-container-single,
.chosen-box+div.chosen-container.chosen-container-single,
.chosen-box div.chosen-container.chosen-container-single {
    width: 100% !important;
}

.department-show-child {
    cursor: e-resize;
}

tr.highlight {
    background: var(--main-color);
    color: white;
}

tr.highlight .department_child_inp,
tr.highlight .department_child_dub {
    color: #000;
    border-bottom: 1px solid #f1f1f1;
}

input.department-add {
    padding-left: 5px;
    padding-right: 5px;
    min-width: 120px;
}

select.department-add {
    min-width: 90px;
}

tr.highlight {
    background-image: url(../css/images/arrowright.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 40px 60px;
    background-position-x: right;
    background-position-y: 0;
}

.user-register {
    padding: 25px 25px 10px;
    background: #fff;
    margin: 0px 0px 0px 0px;
}

.user-register input {
    border: none;
    border-bottom: 1px solid #ebebeb;
    border-radius: 1px;
    height: 34px;
    font-size: 14px;
    background: none;
    box-shadow: none;
    padding: 0px;
    width: 100%;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.user-register label {
    color: #444;
    display: none;
}

.user-register .form-group {
    margin: 15px 0px;
    position: relative;
}

.user-register .btn {
    background: var(--main-color);
    color: #fff;
    border: none !important;
    height: 40px;
    width: 100%;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 32px;
    padding: 0px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-radius: 2px;
}

.user-register h2 {
    font-size: 28px;
    min-height: 48px;
    line-height: 1.2;
    color: var(--main-color);
    margin-bottom: 25px;
    padding: 0px 0px 15px 0px;
    font-family: "myriadbold";
    text-align: center;
    text-transform: uppercase;
    background: url(../images/line-title.png) no-repeat center bottom;
}

.user-register .form-group.active:before {
    width: 100%;
}

.user-register .form-group:before {
    content: "";
    height: 2px;
    width: 0%;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: var(--main-color);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s;
}

.user-register input:focus {
    box-shadow: none;
    border-color: var(--main-color);
    outline: none;
}

.user-register input.exportInput:focus~label {
    display: block;
}

p.referral-link {
    background: #fff;
    border-radius: 8px;
    color: #3b83bf;
    font-weight: 600;
}

div.ui-dropdownchecklist-item.ui-state-default {
    padding: 5px 12px 1px;
}

div.ui-dropdownchecklist-item.ui-state-default label {
    font-size: 14px;
    padding-left: 10px;
    color: #333;
    font-weight: normal;
}

tr.pro-com-invisible,
tr.highlight-hidden {
    background: #ccc;
}

#modal_add_storing .search-order {
    padding: 0;
    margin-bottom: 0px;
}

select.department_child_inp:focus,
input.department_child_inp:focus,
span.department_child_inp input:focus,
select.department_child_dub:focus,
input.department_child_dub:focus,
span.department_child_dub input:focus,
.department-add-new:focus {
    outline: none;
    border-bottom: 1px solid #1792d8;
}

select.department_child_inp,
input.department_child_inp,
span.department_child_inp input,
select.department_child_dub,
input.department_child_dub,
span.department_child_dub input,
.department-add-new {
    padding: 6px 6px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.department_child_show {
    white-space: normal;
}

.department_child_show.sub-rows {
    padding-top: 8px;
    font-size: 12px;
    font-style: italic;
}

.department.square_x {
    cursor: pointer;
    position: absolute;
    right: 5px;
    top: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    font-size: 12px;
    padding-left: 1px;
}

span.group_func.icon-cate.active.icon-other-x {
    background: #da231c;
}

div.hd-list-group {
    min-height: 80px;
}

div.DCG-hide input,
div.DCG-hide select {
    color: black;
    width: 100%;
}

div.DCG-hide {
    min-width: 250px;
    max-width: 350px;
}

div.DCG-hide label {
    color: #ccc;
    width: 100%;
    font-size: 12px;
}

span.group_inp label,
.member-g-label {
    width: 100%;
    text-align: left;
    color: #ccc;
}

#list_member_groups table.table tr {
    height: 42px;
}

.cycle-close:hover {
    font-weight: bold;
}

.cycle-close {
    cursor: pointer;
}


/* tungcode 0307 */

#notification_alert {
    position: relative;
    top: 0px;
}

#notification_alert:hover {
    color: #ff7f00;
}

.notification {
    color: #fff;
}

.notification .row {
    border-top: 1px solid #ececec;
    margin: 30px -20px 0px;
}

.notification .notification-left {
    padding: 0px 0px 0px 0px;
    border-right: 1px solid #ececec;
}

.notification .notification-right {
    padding: 0px 10px 0px 0px;
}

.notification ul.item {
    padding: 0px;
}

.notification ul.item li {
    padding: 0px 0px 0px 0px;
    position: relative;
    cursor: pointer;
    list-style-type: none;
}

.notification ul.item li:hover {
    background: #f3f3f3;
}

.notification ul.item li .iframe {
    padding: 30px 0px 12px;
    border-bottom: 1px solid #ececec;
}

.notification ul.item li .iframe>h2 {
    margin: 20px 0px 10px;
    font-size: 18px;
}

.notification ul.item li .iframe>h3 {
    margin: 0px 0px 0px;
    font-size: 15px;
    line-height: 1.6;
    padding: 0px 40px 0px 0px;
}

.notification ul.item li .iframe>.date {
    position: absolute;
    top: 6px;
    font-size: 12px;
    font-style: italic;
    right: 50px;
}

.notification ul.item li .iframe .img_delete_noti {
    position: absolute;
    top: 0px;
    bottom: 0px;
    margin: auto;
    right: 10px;
}

.wrap-editor {
    margin-top: 20px;
}

.wrap-editor .input_name {
    margin: 10px 0px;
    padding-bottom: 6px;
    /* overflow: auto; */
}

.progress_bar {
    box-sizing: content-box;
    height: 20px;
    background: #ddd;
    border-radius: 25px;
    padding: 0px;
    position: fixed;
    top: 0px;
    bottom: 0px;
    width: 500px;
    left: 0px;
    right: 0px;
    margin: auto;
    z-index: 9;
}

.progress_bar span {
    display: block;
    height: 100%;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background-color: rgb(43, 194, 83);
    background-image: linear-gradient(center bottom, rgb(43, 194, 83) 37%, rgb(84, 240, 84) 69%);
    box-shadow: inset 0 2px 9px rgb(255 255 255 / 30%), inset 0 -2px 6px rgb(0 0 0 / 40%);
    position: relative;
    overflow: hidden;
    color: #fff;
    text-align: center;
    font-size: 12px;
    padding-top: 1px;
}

.progress_bar span i {
    font-style: normal;
}

.progress_bar span:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
    z-index: 1;
    background-size: 50px 50px;
    animation: move 2s linear infinite;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    overflow: hidden;
}

@keyframes move {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

div.dr.input_name div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget {
    width: 100% !important;
}

div.dr.input_name div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget div.ui-dropdownchecklist-dropcontainer.ui-widget-content {
    min-width: inherit !important;
}

.wrap-editor .row>div .input_name {
    margin: 15px 0px 0px;
}

.wrap-editor .input_name .label_name {
    display: inline-block;
    margin: 0px 0px 6px 0px;
}

.wrap-editor .input_name>input {
    width: calc(100% - 80px) !important;
    display: inline-block;
    border: none;
    box-shadow: none !important;
    background: none;
    color: #777;
    font-size: 13px;
}

.wrap-editor .input_name_b>input {
    font-weight: 600;
    font-size: 15px;
    color: #666;
    width: 100% !important;
}

.wrap-editor .input_name>span {
    position: absolute;
    top: 0px;
    right: 0px;
    cursor: pointer;
    color: #888;
    font-weight: 600;
    font-size: 16px;
}

.wrap-editor .input_name>span.ui-dropdownchecklist.ui-widget {
    position: relative;
    font-size: 15px;
}

.wrap-editor .input_name .sub {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 780px;
    height: 500px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #ececec;
    z-index: 1003;
    overflow-x: auto;
    box-shadow: 0px 0px 3px #ddd;
    display: none;
}

.overlay_newnoti {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1002;
    display: none;
}

@media (max-width: 767px) {
    .wrap-editor .input_name .sub {
        width: 100%;
    }
}

.wrap-editor .input_name .sub .search-order {
    margin: 0px;
    position: relative;
    border-bottom: 1px solid #ececec;
    padding: 12px 15px 8px;
    margin-right: 66px;
}

.wrap-editor .input_name .sub .search-order .btn {
    top: 11px;
    right: 16px;
}

.wrap-editor .input_name .sub .search-order input {
    background: #f1f1f1;
    border-radius: 6px;
    padding: 10px;
}

.wrap-editor .input_name .sub .sub-left {
    float: left;
    width: 40%;
    height: calc(100% - 65px);
    border-right: 1px solid #f1f1f1;
}

.wrap-editor .input_name .sub .sub-left ul {
    border: none;
}

.wrap-editor .input_name .sub .sub-left ul li {
    float: none;
    margin: 0px 0px 1px;
}

.wrap-editor .input_name .sub .sub-left ul li a {
    border-radius: 0px;
    padding: 18px 15px;
    margin: 0px;
    border: none;
    color: #777;
}

.wrap-editor .input_name .sub .sub-left .nav-tabs>li.active>a,
.wrap-editor .input_name .sub .sub-left .nav-tabs>li.active>a:focus,
.wrap-editor .input_name .sub .sub-left .nav-tabs>li.active>a:hover {
    background: #f1f1f1;
    border: none;
}

.wrap-editor .input_name .sub .sub-right {
    float: left;
    width: 60%;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all {
    padding-top: 15px;
    list-style-type: none;
    padding: 0px;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li {
    padding: 5px 15px 5px 25px;
    position: relative;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li>span {
    position: absolute;
    right: 0px;
    top: 0px;
    font-size: 24px;
    color: #888;
    height: 30px;
    cursor: pointer;
    width: 32px;
    line-height: 30px;
    text-align: center;
    z-index: 9;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li>span.up {
    display: none;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li.active>span.up {
    display: block;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li.active>span.down {
    display: none;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all li label {
    font-weight: 400;
    color: #666;
    display: block;
    cursor: pointer;
}

.wrap-editor .input_name .sub .sub-right .wrap_sub_all>li>ul.sub_all {
    padding-top: 6px;
    display: none;
    padding: 0;
    list-style-type: none;
}

.close_sub_addContact {
    font-size: 15px;
    position: absolute;
    top: 12px;
    right: 5px;
    color: #fff;
    opacity: 1;
    width: 70px;
    height: 34px;
    text-align: center;
    line-height: 37px;
    cursor: pointer;
    z-index: 9;
    background: #f00;
    font-weight: 400;
    border-radius: 5px;
}

.addNotification {
    position: relative;
    display: none;
}

.close_noti {
    font-weight: 300;
    font-size: 20px;
    position: absolute;
    top: 4px;
    right: 4px;
    opacity: 1;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 27px;
    cursor: pointer;
    background: #f00;
    color: #fff;
    border-radius: 50%;
}

.icon_noti {
    color: #888;
    font-size: 16px;
    text-align: right;
    margin-top: 14px;
    cursor: pointer;
    display: inline-block;
    white-space: nowrap;
    padding-left: 15px;
}

.icon_noti img {
    margin-left: 6px;
    position: relative;
    top: -2px;
}

.icon_notis {
    color: #888;
    font-size: 16px;
    text-align: right;
    margin-top: 14px;
    cursor: pointer;
    display: block;
}

.icon_notis img {
    margin-left: 6px;
    position: relative;
    top: -2px;
}

select#investor_group_id+button {
    background: #fff;
    color: #888;
    font-size: 14px;
    padding: 0px 12px 0px 0px;
    border-radius: 0px;
    box-shadow: none;
    border: none;
    border-bottom: 1px solid #ddd;
    margin-top: 3px;
    margin-left: 0px;
    text-transform: inherit;
    font-weight: 300;
    position: relative;
}

div.investor_group_id div.mdb-select {
    width: 100% !important;
}

span.to-item {
    padding: 3px 8px 4px;
    display: inline-block;
    background: #7ec872;
    border-radius: 4px;
    color: #fff;
    margin-right: 5px;
    margin-top: 3px;
    min-width: 120px;
    position: relative;
    padding-right: 25px;
}

span.to-item b:hover {
    color: red;
    font-weight: bolder;
}

span.to-item b {
    display: inline-block;
    color: #888;
    font-size: 18px;
    margin-left: 10px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    top: 0px;
    right: 8px;
}

li.investor_group_id:hover,
li.investor_group_id.active {
    background: #3375d0;
    color: #fff;
}

li.investor_group_id {
    float: none;
    margin: 0px 0px 4px;
    padding: 5px;
    background: #eee;
    cursor: pointer;
}


/* end tungcode 0307 */

button.btn_hide_price {
    color: orange !important;
}

.input-number-touch-quantity {
    text-align: center;
}

div.barcode-list {
    border: 1px solid #d1d1d1;
    padding: 9px;
    background: #f0f0f0;
    min-height: 300px;
    max-height: 500px;
    overflow-y: scroll;
    border-radius: 3px;
}

.barcode-list span {
    padding: 6px 5px;
    background: #3283ba;
    border-radius: 3px;
    color: white;
    margin-right: 5px;
    display: inline-block;
    margin-bottom: 5px;
}

.barcode-list span b {
    color: gray;
    margin-left: 5px;
    font-size: 16px;
    cursor: pointer;
    opacity: 0.6;
    color: #d1d1d1;
}

.barcode-list span b:hover {
    opacity: 1;
}

div.info-bar-head .btn-save,
div.info-bar-head .barcode-no-bar {
    margin-top: 26px;
}

input.cart-quantity {
    padding-left: 3px;
    padding-right: 3px;
}

span.cart-note {
    text-align: left;
    margin-top: 16px;
    display: inline-block;
    width: 100%;
}

span.order-note {
    text-align: left;
    margin: 0;
    padding-left: 16px;
    display: inline-block;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 2px;
}

@media (max-width: 767px) {
    span.order-note {
        padding-left: 0px;
        margin-top: 4px;
        margin-bottom: 6px;
    }
}

span.order-note .wrap_name {
    padding: 0px !important;
}

span.order-note .wrap_name input {
    margin-top: 5px;
    margin-left: 22px;
    font-size: 12px;
    border-radius: 0px;
    padding: 3px 12px 3px 6px !important;
}

@media (max-width: 767px) {
    span.order-note .wrap_name input {
        margin-top: 0px;
    }
}

span.cart-note span,
span.order-note span {
    color: #037dd1;
    font-weight: 300;
    font-size: 12px;
}

span.cart-note i.btn-edit-item-cart,
span.order-note i.btn-edit-item-order {
    cursor: pointer;
}

input.edit-note-order {
    border: none !important;
    padding: 8px 12px 0px 3px !important;
    margin-left: 26px;
    margin-right: 16px;
}

i.edit-note-order {
    display: inline-block;
    position: absolute;
    top: 10px;
    cursor: pointer;
    color: #5ab94e;
}

label.address-book-icon {
    cursor: pointer;
}

label.address-book-icon i {
    color: VAR(--MAIN-COLOR-HOVER);
}

.modal-addbook {
    width: 94%;
}

tbody#addbook_list tr td {
    line-height: 3.55;
    vertical-align: middle;
}

.borderless tr,
.borderless td,
.borderless th {
    border: none !important;
}

.cart-note {
    cursor: pointer;
}

.location-allowed,
.l-allowed {
    padding: 3px 5px;
    margin-bottom: 3px;
    background: #1578fb;
    border-radius: 5px;
    width: fit-content;
    color: #fff;
    /* float: left; */
    margin-right: 5px;
    font-size: 13px;
}

.location-allowed a,
.l-allowed a {
    color: #fff;
}

.location-allowed.show i,
.l-allowed.show i {
    display: none;
}

.location-allowed i,
.l-allowed i {
    margin-left: 3px;
    color: #d1d1d1;
    font-weight: 600;
    opacity: 0.6;
    font-style: normal;
}

.location-allowed i:hover,
.l-allowed i:hover {
    opacity: 1;
    cursor: pointer;
}

span.error {
    color: red;
}

.vertical-middle td {
    vertical-align: middle;
}

.table-bordered>thead>tr>th,
.table-bordered>thead>tr>td {
    border-bottom-width: 1px;
}


/**/

.list-shop {
    padding: 0px;
}

.list-shop li {
    padding: 4px 8px 10px;
    position: relative;
    list-style-type: none;
}

.list-shop li:nth-child(4n+1) {
    clear: both;
}

.list-shop li .item {
    position: relative;
    border: 1px solid #ececec;
    padding: 15px;
    border-radius: 6px;
    margin: 4px 0px;
}

.list-shop li:after,
.list-shop li .item:after {
    content: "";
    display: block;
    clear: both;
}

.list-shop li .img {
    background-size: cover;
    background-position: center center;
    height: 175px;
    display: none;
}

.list-shop li .img img {
    height: 100%;
    width: 100%;
    opacity: 0;
}

.list-shop li .wrap-info {
    width: 100%;
}

.list-shop li .title {
    font-size: 14px;
    line-height: 1.3;
    color: #222;
    font-weight: 600;
    margin: 8px 0px 8px;
    position: relative;
    padding-left: 28px;
    padding-top: 3px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f1f1f1;
}

.list-shop li .info {
    font-size: 13px;
    color: #333;
    font-weight: 300;
    margin-bottom: 3px;
    position: relative;
    padding: 1px 0px 8px 28px;
    border-bottom: 1px solid #f1f1f1;
}

.list-shop li .phone {
    font-size: 13px;
    color: #333;
    position: relative;
    margin-bottom: 5px;
    padding: 4px 0px 8px 28px;
    border-bottom: 1px solid #f1f1f1;
}

.list-shop li .text-right {
    text-align: left;
    padding: 0px;
    margin-top: 10px;
}

.list-shop li .text-right .btn {
    padding: 3px 12px;
}

.list-shop li .payment {
    margin-top: 12px;
}

.list-shop li .payment:after {
    content: "";
    display: block;
    clear: both;
}

.list-shop li .payment .pull-left {
    margin-right: 6px;
    padding-top: 0px;
    font-weight: 600;
    font-size: 14px;
    float: left;
}

.list-shop li .payment .l-allowed {
    font-size: 12px;
    padding: 3px 7px 2px;
    border-radius: 3px;
}

.list-shop li .wrap-info>div>i {
    font-size: 20px;
    color: var(--main-color);
    margin-right: 8px;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.ui-icon.ui-icon-triangle-1-e,
.ui-icon.ui-icon-triangle-1-s {
    position: relative;
    top: 8px;
    left: 5px;
}

.ui-dropdownchecklist-text {
    font-weight: 400;
    color: #444;
    position: relative;
    top: 3px;
    left: 8px;
    font-size: 14px;
    padding: 3px 0px;
}

.ui-dropdownchecklist-item .ui-dropdownchecklist-text {
    top: 0px;
    padding: 6px 0px;
}

.ui-widget input {}

.ui-widget input[checked="checked"] {}

.input_quantity_sale1>div {
    display: inline-block;
}

.shop-bg-img {
    background-image: url(../assets/images/ecoposlogo.png);
    background-size: 100% !important;
    background-repeat: no-repeat;
}

.blog-huongdan {
    padding-right: 15px;
    padding-top: 15px;
    padding-left: 0px;
    padding-bottom: 0px;
    -webkit-box-shadow: -50px 0 50px 0 #fafafa inset;
    -moz-box-shadow: -50px 0 50px 0 #fafafa inset;
    box-shadow: -50px 0 50px 0 #fafafa inset;
    z-index: 1;
    background: #fff;
}

@media (min-width: 768px) {
    .blog-huongdan-1 {
        width: 231px;
    }
}

@media (min-width: 992px) {
    .blog-huongdan-1 {
        width: 244px;
    }
    .sidebar-right {
        padding-right: 0px;
    }
}

@media (min-width: 1200px) {
    .blog-huongdan-1 {
        width: 278px;
    }
    .sidebar-right {
        padding-right: 20px;
    }
}

@media (max-width: 767px) {
    .blog-huongdan {
        position: relative !important;
    }
}

.blog-huongdan h2.block-title {
    position: relative;
    background: none;
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    margin: 0px 0 0px;
    font-size: 20px;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .blog-huongdan h2.block-title {
        font-size: 18px;
        font-weight: normal;
        text-transform: none;
    }
}

.blog-huongdan h2.block-title:after,
.blog-huongdan h2.block-title:before {
    top: 100%;
    left: 50px;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.blog-huongdan h2.block-title:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #fff;
    border-top-width: 1px;
    border-width: 5px;
    margin-left: -5px;
}

.blog-huongdan h2.block-title:before {
    border-color: rgba(221, 221, 221, 0);
    border-top-color: #ddd;
    border-top-width: 1px;
    border-width: 6px;
    margin-left: -6px;
}

.blog-huongdan .content ul {
    padding: 0px;
}

.blog-huongdan .content ul li {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

.blog-huongdan .content ul li:last-child a {
    border-bottom: none;
}

.blog-huongdan .content ul li a {
    color: #222;
    text-transform: none;
    display: block;
    padding: 10px 0;
    width: 100%;
    font-size: 15px;
    font-weight: 600;
    border-bottom: 1px dashed #ccc;
}

.blog-huongdan .content ul li a p {
    top: 0px !important;
    position: static !important;
    -webkit-transform: translateY(0%) !important;
    transform: translateY(0%) !important;
    font-size: 15px !important;
}

@media (max-width: 991px) {
    .blog-huongdan .content ul li a {
        font-size: 14px;
    }
}

.blog-huongdan .content ul>li>a i {
    float: left;
    margin-top: 4px;
    margin-right: 12px;
}

.blog-huongdan .content ul>li>a i.fa-angle-right,
.blog-huongdan .content ul>li>a i.fa-angle-down {
    float: right;
    margin-top: 2px;
}

.blog-huongdan .content ul>li.down>a i.fa-angle-down {
    display: none;
}

.blog-huongdan .content ul>li.up>a i.fa-angle-right {
    display: none;
}

.blog-huongdan .content ul>li.up i.fa-angle-down {
    display: block;
}

.blog-huongdan .content ul>li.down i.fa-angle-right {
    display: block;
}

.blog-huongdan .content ul li>ul.sub-menu {
    display: none;
}

.blog-huongdan .content ul li>ul.sub-menu li {}

.blog-huongdan .content ul li>ul.sub-menu li:hover a {
    color: #2276d2;
}

.blog-huongdan .content ul li>ul.sub-menu li.active a {
    color: #2276d2;
    font-weight: bold;
}

.blog-huongdan .content ul>li.up>a,
.blog-huongdan .content ul>li:hover>a {
    color: #2276d2;
}

.blog-huongdan .content ul li>ul.sub-menu li a {
    color: #000;
    padding: 9px 0;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
}

.blog-huongdan .content ul li>ul.sub-menu li a span {
    background: #f00000;
    color: #fff;
    padding: 0px 6px 1px;
    border-radius: 3px;
    text-align: center;
    margin-left: 8px;
    position: relative;
    font-size: 10px;
}

.blog-huongdan .content ul li>ul.sub-menu li a i {
    float: left;
    margin-left: 10px;
    margin-right: 5px;
    margin-top: 2px;
    font-size: 16px;
}

.sidebar-right {
    margin-top: 20px;
}

span.suggest-parent {
    position: absolute;
}

select.group_inp_is_for {
    padding: 0px;
}

div.btn-group.treasurer {
    z-index: 0;
}

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

.input_quantity_sale1>div {
    display: inline-block;
    position: relative;
}

#btn_sale div#popup-sale {
    top: 36px;
    left: 0px;
    position: absolute;
}

#btn_tiktok div#popup-tiktok {
    top: 36px;
    left: 0px;
    position: absolute;
}

.wrap-input-group .nav a {
    border-radius: 0px;
    border: 1px solid #ddd;
    margin: 0px -1px !important;
    background: #fff;
    display: block !important;
    line-height: 40px;
    padding: 0px !important;
}

#btn_tiktok div#popup-tiktok {
    top: 36px;
    left: 0px;
    position: absolute;
}

i.icon-status-member {
    opacity: 0.4;
    float: right;
    position: inherit;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

i.icon-status-member.activated {
    color: green;
    opacity: 0.8;
}

i.icon-status-member:hover {
    opacity: 0.9;
}

a.collected-all {
    position: absolute;
    right: 0;
    cursor: pointer;
}

.treasurer {
    position: relative;
}

div.treasurer i.confirmed-done+span {
    display: none;
    position: absolute;
    right: 105%;
    top: -10px;
    width: 250px;
    background: #f1f1f1;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    text-align: left;
    color: #333;
}

div.treasurer i.confirmed-done:hover+span {
    display: block;
}

div.treasurer i.confirmed-deny+span {
    display: none;
    position: absolute;
    right: 105%;
    top: -10px;
    width: 250px;
    background: #d9534f;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    text-align: left;
    color: #333;
}

div.treasurer i.confirmed-deny:hover+span {
    display: block;
}

div.treasurer i.confirmed-waiting+span {
    display: none;
    position: absolute;
    right: 105%;
    top: -10px;
    width: 250px;
    background: #fcbd60;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    text-align: left;
    color: #333;
}

div.treasurer i.confirmed-waiting:hover+span {
    display: block;
}

div.dr div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget {
    height: auto !important;
    width: 200px !important;
}

div.dr.dr300 div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget {
    width: 400px !important;
}

div.dr div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget div.ui-dropdownchecklist-dropcontainer.ui-widget-content {
    height: auto !important;
}

div.dr div.ui-dropdownchecklist.ui-dropdownchecklist-dropcontainer-wrapper.ui-widget div.ui-dropdownchecklist-item.ui-state-default input {
    width: auto !important;
    height: auto !important;
}

div.chosen-container.chosen-container-single {
    height: 34px;
}

select#member_group_id+div {
    width: 250px !important;
    width: 100% !important;
}

.err-modify-tv,
span.suggest-parent,
span.error,
.err-tre-gr,
.err-tag-exe {
    color: red;
    display: block;
    font-size: 13px;
    margin-top: 5px;
}

.i-error {
    border-color: #ff000045 !important;
}

.hd-file i.delete,
.hd-file i.delete-x {
    position: absolute;
    top: -4px;
    right: 7px;
    cursor: pointer;
    color: gray;
}

.hd-file i.delete:hover,
.hd-file i.delete-x:hover {
    color: red;
    font-weight: bold;
}

a.view-link {
    position: absolute;
    top: 20%;
    right: 30%;
    cursor: pointer;
    color: gray;
    font-size: 56px;
    opacity: 0.6;
    height: 20px;
}

.avatar_thumbs-s:hover a {
    color: red;
}

.hd-file img {
    cursor: context-menu;
}

.processing_uploaded {
    max-height: 10px;
}

.avatar_thumbs.avatar_thumbs_lq.url_chung_tu {
    margin: 3px;
    float: left;
}

a.img.hd-file.url_chung_tu {
    padding: 0px;
    height: 60px;
    width: 60px;
    position: relative;
}

a.img.hd-file.url_chung_tu img {
    max-width: 60px;
}

span.view-extension {
    bottom: 0;
    color: #3b81bd !important;
    display: block !important;
    margin: 0;
    font-size: 80%;
}

a.img.hd-file.url_chung_tu.large {
    padding: 5px;
    height: 50px;
    width: 50px;
}

span.sum_stock.pos-item {
    position: absolute;
    top: -1px;
    font-size: 10px;
    right: 4px;
    color: #56ba47;
    width: 86px;
    text-align: left;
    font-style: italic;
}

@media (max-width: 767px) {
    span.sum_stock.pos-item {
        top: 2px;
    }
}

i.icon-up {
    color: #28a4c9;
    font-size: 31px;
    padding-left: 30px;
    cursor: pointer;
}

i.delete.icon,
i.up.icon,
i.down.icon {
    position: absolute;
    right: 5px;
    top: 8px;
    color: darkgray;
    cursor: pointer;
    opacity: 0.8;
    font-size: 20px;
    z-index: 9;
}

i.down.icon {
    right: 30px;
}

i.up.icon {
    right: 56px;
}

i.up.icon:hover,
i.down.icon:hover {
    color: green;
}

i.delete.icon:hover {
    color: red;
}

input.link-cat {
    z-index: 499;
    position: absolute;
    bottom: 0;
    height: 26px;
}

.fee_order {
    z-index: 1;
    border: 1px solid #eee;
    border-right: 0px;
    height: 40px;
    position: relative;
    top: 3px;
    margin-bottom: 20px;
}

.fee_order span {
    position: absolute;
    z-index: 2;
    top: -10px;
    left: 10px;
    background-color: #fff;
    font-size: medium;
    font-weight: 600;
}

.fee_order p {
    top: 10px;
    left: 50px;
    position: absolute;
    font-size: 18px;
    color: #009e35;
    font-weight: 600;
}


/* .fee_order_border p {
    top: 10px;
    left: 30px;
    position: absolute;
    font-size: 18px;
    color: #009e35;
    font-weight: 600;
} */

.fee_order_border {
    z-index: 1;
    border: 1px solid #eee;
    border-left: 0px;
    height: 40px;
    position: relative;
    top: 3px;
    margin-bottom: 20px;
}


/**/

.traning-lever {
    margin-bottom: 15px;
}

.traning-lever ul {
    padding: 0px;
    margin: 0px;
}

.traning-lever ul li {
    list-style-type: none;
    margin: -1px auto;
    color: #fff;
    text-align: center;
}

.traning-lever ul li .img {
    display: inline-block;
    position: relative;
}

.traning-lever ul li img {
    max-height: 64px;
    display: inline-block;
}

.traning-lever ul li.lever000 img {
    max-height: 90px;
}

@media (max-width: 767px) {
    .traning-lever ul li img {
        min-height: 50px;
    }
    .traning-lever ul li.lever000 img {
        max-height: 65px;
    }
}

.traning-lever ul li.lever1 img {
    max-height: 71px;
}

.traning-lever ul li.lever2 img {
    max-height: 71px;
}

.traning-lever ul li.lever3 img {
    max-height: 71px;
}

.traning-lever ul li.lever4 img {
    max-height: 76px;
}

.traning-lever ul li.lever5 img {
    max-height: 82px;
}

.traning-lever ul li.lever6 img {
    max-height: 115px;
}

.traning-lever ul li.lever7 img {
    max-height: 190px;
}

@media (max-width: 767px) {
    .traning-lever ul li.lever1 img {
        width: 91%;
        height: 50px;
    }
    .traning-lever ul li.lever2 img {
        width: 82%;
        height: 55px;
    }
    .traning-lever ul li.lever3 img {
        width: 73%;
        height: 60px;
    }
    .traning-lever ul li.lever4 img {
        width: 66%;
        height: 65px;
    }
    .traning-lever ul li.lever5 img {
        width: 67%;
        height: 69px;
    }
    .traning-lever ul li.lever6 img {
        width: 82%;
        height: 78px;
    }
    .traning-lever ul li.lever7 img {
        width: 82%;
        height: 134px;
    }
}

.traning-lever ul li p {
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%);
    position: absolute;
    top: 38%;
    display: block;
    color: #fff;
    margin: 0px;
    z-index: 1;
    width: 100%;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 900;
}

.traning-lever ul li.lever000 p {
    font-size: 25px;
    -webkit-transform: translateY(-36%);
    transform: translateY(-36%);
    top: 39%;
}

.traning-lever ul li span {
    width: 100%;
    text-align: center;
    left: 0px;
    -webkit-transform: translateY(-76%);
    transform: translateY(-76%);
    position: absolute;
    top: 76%;
    line-height: 1.3;
}

@media (max-width: 767px) {
    .traning-lever ul li.lever000 p {
        font-size: 20px;
    }
    .traning-lever ul li span {
        display: none;
    }
    .traning-lever ul li p {
        -webkit-transform: translateY(-50%) !important;
        transform: translateY(-50%) !important;
        top: 50% !important;
        font-size: 18px;
    }
    .traning-lever ul li.lever7 p {
        -webkit-transform: translateY(-70%) !important;
        transform: translateY(-70%) !important;
        top: 70% !important;
    }
    .traning-lever ul li.lever4 p {
        font-size: 17px;
    }
    .traning-lever ul li.lever5 p {
        font-size: 16px;
    }
}

.traning-lever ul li.lever1 p {
    -webkit-transform: translateY(-26%);
    transform: translateY(-26%);
    top: 34%;
}

.traning-lever ul li.lever1 span {
    -webkit-transform: translateY(-66%);
    transform: translateY(-66%);
    top: 66%;
    padding: 0px 40px;
}

.traning-lever ul li.lever2 p {
    -webkit-transform: translateY(-26%);
    transform: translateY(-26%);
    top: 33%;
}

.traning-lever ul li.lever2 span {
    -webkit-transform: translateY(-66%);
    transform: translateY(-66%);
    top: 66%;
    padding: 0px 40px;
}

.traning-lever ul li.lever3 p {
    -webkit-transform: translateY(-26%);
    transform: translateY(-26%);
    top: 34%;
}

.traning-lever ul li.lever3 span {
    -webkit-transform: translateY(-71%);
    transform: translateY(-71%);
    top: 71%;
}

.traning-lever ul li.lever4 p {
    -webkit-transform: translateY(-28%);
    transform: translateY(-28%);
    top: 38%;
}

.traning-lever ul li.lever4 span {
    -webkit-transform: translateY(-68%);
    transform: translateY(-68%);
    top: 68%;
}

.traning-lever ul li.lever5 p {
    -webkit-transform: translateY(-28%);
    transform: translateY(-28%);
    top: 38%;
}

.traning-lever ul li.lever5 span {
    -webkit-transform: translateY(-66%);
    transform: translateY(-66%);
    top: 66%;
}

.traning-lever ul li.lever6 p {
    -webkit-transform: translateY(-18%);
    transform: translateY(-18%);
    top: 40%;
}

.traning-lever ul li.lever6 span {
    -webkit-transform: translateY(-72%);
    transform: translateY(-72%);
    top: 77%;
    padding: 0px 35px;
    font-size: 13px;
}

.traning-lever ul li.lever7 p {
    -webkit-transform: translateY(-90%);
    transform: translateY(-90%);
    top: 84%;
    padding: 0px 14px;
    line-height: 1.3;
}

.traning-lever ul li.lever7 span {
    -webkit-transform: translateY(-85%);
    transform: translateY(-85%);
    top: 88%;
    padding: 0px 31px;
}

.traning-lever ul li p span {
    display: block;
    font-size: 12px;
}

.traning-lever ul li p span:first-child {
    margin-top: 1px;
}


/**/

.traning-lever1 {
    margin-top: 40px;
}

.traning-lever1 .item {}

.traning-lever1 .item .title {
    text-align: center;
    position: relative;
    margin: 30px 0px 0px;
}

.traning-lever1 .item .title>p {
    font-size: 20px;
    text-align: center;
    position: relative;
    color: #aa6e51;
    font-weight: 600;
    margin-top: 10px;
    margin: 10px auto 0px;
    max-width: 600px;
    line-height: 1.3;
    text-transform: uppercase;
}

.traning-lever1 .item.item2 .title>p {
    color: #aa6e51;
}

.traning-lever1 .item.item3 .title>p {
    color: #8fa3b5;
}

.traning-lever1 .item.item4 .title>p {
    color: #8fa3b5;
}

.traning-lever1 .item.item5 .title>p {
    color: #c29644;
}

.traning-lever1 .item.item6 .title>p {
    color: #beaf91;
}

.traning-lever1 .item.item7 .title>p {
    color: #8685b6;
}

.traning-lever1 .item .title img {
    width: 50px;
    display: inline-block;
    background: #fff;
    margin: auto;
}

.traning-lever1 .item .title span {
    position: absolute;
    top: 50px;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    width: 100%;
    text-align: center;
    left: -3px;
    z-index: 1;
}

.traning-lever1 .item ul {
    padding: 0px;
    margin: 0px 0px 20px;
    text-align: center;
}

.traning-lever1 .item ul::after {
    content: "";
    display: block;
    clear: both;
}

.traning-lever1 .item ul li {
    list-style-type: none;
    display: inline-block;
    width: 24%;
    margin: 14px 0px;
    padding: 0px 12px;
}

.traning-lever1 .item.item2 ul li {
    /*float: left;
    width: 25%;*/
}

@media (max-width: 767px) {
    .traning-lever1 .item ul li {
        width: 49%;
    }
    .traning-lever1 .item ul li:nth-child(2n+1) {
        clear: both;
    }
    .traning-lever1 .item .iframe .title1 {
        overflow: hidden;
    }
}

.traning-lever1 .item.item2 ul li:nth-child(4n+1) {
    clear: both;
}

.traning-lever1 .item.item2 .iframe:nth-child(2) ul li {}

.traning-lever1 .item ul li .img {
    background-image: linear-gradient(135deg, #7100b3, #57048c 26%, #6400a5 0, #6a00ac 39%, #7b1eb5 0, #6700a8 52%, #6e00b0 0, #4d0179 57%, #6a00aa 0, #4f0e77 78%, #6300a4 0, #440c67 90%, #5a019c 0, #7000b2);
    background-image: linear-gradient(135deg, #ffd900, #ffd900 26%, #ffc800 0, #ffc800 39%, #ffd900 0, #ffd900 52%, #ffc800 0, #ffc800 57%, #ffd900 0, #ffd900 78%, #ffc800 0, #ffc800 90%, #ffd900 0, #ffd900);
    background-image: linear-gradient(135deg, #0a8409, #099408 26%, #16a915 0, #1db318 39%, #0da70d 0, #0f970c 52%, #2da92b 0, #0c9e0c 57%, #0da50c 0, #0da70d 78%, #12920e 0, #0da00d 90%, #0da70d 0, #0da70d);
    background-image: linear-gradient(135deg, #af6e55, #b37554 26%, #a6684f 0, #b47556 39%, #b27156 0, #b27156 52%, #b06f54 0, #bf7b5b 57%, #ae6e53 0, #b27554 78%, #bb7b54 0, #b67857 90%, #b06f54 0, #b47357);
    width: 90px;
    height: 90px;
    border-radius: 50%;
    position: relative;
    border: 6px solid #fff;
    margin: 0px auto;
}

.traning-lever1 .item ul li .img:before {
    content: "";
    position: absolute;
    width: 102px;
    height: 102px;
    left: -12px;
    top: -12px;
    border: 6px solid #e5e5e5;
    border-radius: 50%;
}

.traning-lever1 .item ul li.active .img:before {
    border: 6px solid #7212af;
    border: 6px solid #ffc800;
    border: 6px solid #018304;
    border: 6px solid #b37057;
}

.traning-lever1 .item.item3 ul li .img,
.traning-lever1 .item.item4 ul li .img {
    background-image: linear-gradient(135deg, #768991, #8aa0ae 26%, #6f838d 0, #84979f 39%, #788d98 0, #7d939c 52%, #4d6d78 0, #7b909a 57%, #7d909e 0, #687983 78%, #688a9e 0, #545e61 90%, #8ca1af 0, #8ba1af);
}

.traning-lever1 .item.item3 ul li.active .img:before,
.traning-lever1 .item.item4 ul li.active .img:before {
    border: 6px solid #8fa3b5;
}


/*
.traning-lever1 .item.item4 ul li .img{
    background-image: linear-gradient(135deg,#0a8409,#099408 26%,#16a915 0,#1db318 39%,#0da70d 0,#0f970c 52%,#2da92b 0,#0c9e0c 57%,#0da50c 0,#0da70d 78%,#12920e 0,#0da00d 90%,#0da70d 0,#0da70d);
}
.traning-lever1 .item.item4 ul li.active .img:before{
    border: 6px solid #018304;
}*/

.traning-lever1 .item.item5 ul li .img {
    background-image: linear-gradient(135deg, #ffd695, #eca409 26%, #f9af10 0, #ffae01 39%, #ffb30e 0, #d29b24 52%, #feae07 0, #e4a110 57%, #eca406 0, #faaf0c 78%, #fdb009 0, #b97e02 90%, #feae07 0, #ffb016);
    background-image: linear-gradient(135deg, #d1b257, #b88c3f 26%, #c89f52 0, #c79a43 39%, #ae8240 0, #caa044 52%, #c9a047 0, #ac7e3f 57%, #c39946 0, #c39846 78%, #b08342 0, #c79c4a 90%, #eac87f 0, #c09547);
}

.traning-lever1 .item.item5 ul li.active .img:before {
    border: 6px solid #ffae01;
    border: 6px solid #c29644;
}

.traning-lever1 .item.item6 ul li .img {
    background-image: linear-gradient(135deg, #ded9b2, #ccc0a5 26%, #dfe0c2 0, #cdc590 39%, #d6d391 0, #e4dec3 52%, #dcca7e 0, #e1dcbb 57%, #f6f3e1 0, #bcae8c 78%, #d3c9ac 0, #b9a789 90%, #b9aa8a 0, #d9d4b2);
}

.traning-lever1 .item.item6 ul li.active .img:before {
    border: 6px solid #beaf91;
}

.traning-lever1 .item.item7 ul li .img {
    background-image: linear-gradient(135deg, #8585b5, #8788b8 26%, #9fa1cc 0, #9595c3 39%, #948abb 0, #9090be 52%, #8782b3 0, #8683b1 57%, #a399cd 0, #8a87b4 78%, #9898c6 0, #827eae 90%, #7872a5 0, #9a9ac7);
}

.traning-lever1 .item.item7 ul li.active .img:before {
    border: 6px solid #8685b6;
}

.traning-lever1 .item ul li .img:after {
    content: "";
    background-image: url(../assets/img/traning/stick.svg);
    position: absolute;
    bottom: 0px;
    right: -16px;
    width: 30px;
    display: block;
    height: 24px;
    background-size: cover;
}

.traning-lever1 .item ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti.png);
}

.traning-lever1 .item ul li .img img {
    position: absolute;
    top: 0px;
    bottom: 0px;
    margin: auto;
    left: 0px;
    right: 0px;
    width: 46px;
}

.traning-lever1 .item ul li h3 {
    margin: 20px 0px 0px;
    font-size: 17px;
    line-height: 1.25;
}

.traning-lever1 .item ul li h3 p {
    margin: 0px;
}

.traning-lever1 .item ul li h3 span {
    display: block;
}

.traning-lever1 .item .iframe {
    max-width: 960px;
    margin: 0px auto;
}

.traning-lever1 .item .iframe .title1 {
    color: #7300b3;
    color: #b37057;
    text-align: center;
    letter-spacing: 1px;
    margin: 0px 0px 16px;
    padding: 10px 0px 0px;
    line-height: 1.2;
    position: relative;
    font-size: 18px;
}

.traning-lever1 .item .iframe .title1 span {
    position: relative;
    background: #fff;
    padding: 0px 15px;
}

.traning-lever1 .item .iframe .title1 span:before {
    content: "";
    width: 80px;
    position: absolute;
    top: 50%;
    left: 100%;
    margin: auto;
    height: 1px;
    background: #ddd;
    background: #aa6e51;
    margin-top: -6px;
}

.traning-lever1 .item .iframe .title1 span::after {
    content: "";
    width: 80px;
    position: absolute;
    top: 50%;
    right: 100%;
    margin: auto;
    height: 1px;
    background: #ddd;
    background: #aa6e51;
    margin-top: -6px;
}

.traning-lever1 .item.item2 .iframe .title1 {
    color: #210057;
    color: #aa6e51;
}

.traning-lever1 .item.item3 .iframe .title1 {
    color: #0052d9;
    color: #8fa3b5;
}

.traning-lever1 .item.item4 .iframe .title1 {
    color: #018304;
    color: #8fa3b5;
}

.traning-lever1 .item.item5 .iframe .title1 {
    color: #ffae01;
    color: #c29644;
}

.traning-lever1 .item.item6 .iframe .title1 {
    color: #ff6c01;
    color: #beaf91;
}

.traning-lever1 .item.item7 .iframe .title1 {
    color: #d91e1f;
    color: #8685b6;
}

.traning-lever1 .item.item2 .title:before {
    border-top: 2px solid #210057;
}

.traning-lever1 .item.item3 .title:before {
    border-top: 2px solid #0052d9;
}

.traning-lever1 .item.item4 .title:before {
    border-top: 2px solid #018304;
}

.traning-lever1 .item.item5 .title:before {
    border-top: 2px solid #ffae01;
}

.traning-lever1 .item.item6 .title:before {
    border-top: 2px solid #ff6c01;
}

.traning-lever1 .item.item7 .title:before {
    border-top: 2px solid #d91e1f;
}

.traning-lever1 .item.item2 .iframe .title1 span:before {
    background: #210057;
    background: #aa6e51;
}

.traning-lever1 .item.item2 .iframe .title1 span::after {
    background: #210057;
    background: #aa6e51;
}

.traning-lever1 .item.item3 .iframe .title1 span:before {
    background: #0052d9;
    background: #8fa3b5;
}

.traning-lever1 .item.item3 .iframe .title1 span::after {
    background: #0052d9;
    background: #8fa3b5;
}

.traning-lever1 .item.item4 .iframe .title1 span:before {
    background: #018304;
    background: #8fa3b5;
}

.traning-lever1 .item.item4 .iframe .title1 span::after {
    background: #018304;
    background: #8fa3b5;
}

.traning-lever1 .item.item5 .iframe .title1 span:before {
    background: #ffae01;
    background: #c29644;
}

.traning-lever1 .item.item5 .iframe .title1 span::after {
    background: #ffae01;
    background: #c29644;
}

.traning-lever1 .item.item6 .iframe .title1 span:before {
    background: #ff6c01;
    background: #beaf91;
}

.traning-lever1 .item.item6 .iframe .title1 span::after {
    background: #ff6c01;
    background: #beaf91;
}

.traning-lever1 .item.item7 .iframe .title1 span:before {
    background: #d91e1f;
    background: #8685b6;
}

.traning-lever1 .item.item7 .iframe .title1 span::after {
    background: #d91e1f;
    background: #8685b6;
}


/**/


/**/

.traning-lever0 {
    margin-top: 20px;
    display: none;
}

.traning-lever0 .item {}

.traning-lever ul li.active .traning-lever0 {
    display: block;
}

.traning-lever0 .item .title {
    text-align: center;
    position: relative;
    margin: 30px 0px 0px;
}

.traning-lever0 .item .title>p {
    font-size: 20px;
    text-align: center;
    position: relative;
    color: #b92589;
    font-weight: 600;
    margin-top: 10px;
    margin: 10px auto 0px;
    max-width: 600px;
    line-height: 1.3;
    text-transform: uppercase;
    top: 0;
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
}

.traning-lever0 .item.item1 .title>p {
    color: #8f42a3;
}

.traning-lever0 .item.item2 .title>p {
    color: #454098;
}

.traning-lever0 .item.item3 .title>p {
    color: #006caa;
}

.traning-lever0 .item.item4 .title>p {
    color: #148d46;
}

.traning-lever0 .item.item5 .title>p {
    color: #ffae01;
}

.traning-lever0 .item.item6 .title>p {
    color: #ff6c01;
}

.traning-lever0 .item.item7 .title>p {
    color: #b82827;
}

.traning-lever0 .item .title img {
    width: 50px;
    display: inline-block;
    background: #fff;
    margin: auto;
    max-height: inherit;
}

.traning-lever0 .item .title span {
    position: absolute;
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    top: 50px;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    width: 100%;
    text-align: center;
    left: -3px;
    z-index: 1;
}

.traning-lever0 .item ul {
    padding: 0px;
    margin: 0px 0px 20px;
    text-align: center;
}

.traning-lever0 .item ul::after {
    content: "";
    display: block;
    clear: both;
}

.traning-lever0 .item ul li {
    list-style-type: none;
    display: inline-table;
    width: 24%;
    margin: 14px 0px;
    padding: 0px 12px;
}

.traning-lever0 .item.item2 ul li {
    /*float: left;
    width: 25%;*/
}

@media (max-width: 767px) {
    .traning-lever0 .item ul li {
        width: 50%;
        float: left;
    }
    .traning-lever0 .item ul li:nth-child(2n+1) {
        clear: both;
    }
    .traning-lever0 .item .iframe .title1 {
        overflow: hidden;
    }
}

.traning-lever0 .item.item2 ul li:nth-child(4n+1) {
    clear: both;
}

.traning-lever0 .item.item2 .iframe:nth-child(2) ul li {}

.traning-lever0 .item ul li .img {
    background-image: linear-gradient(135deg, #7100b3, #57048c 26%, #6400a5 0, #6a00ac 39%, #7b1eb5 0, #6700a8 52%, #6e00b0 0, #4d0179 57%, #6a00aa 0, #4f0e77 78%, #6300a4 0, #440c67 90%, #5a019c 0, #7000b2);
    width: 90px;
    height: 90px;
    border-radius: 50%;
    position: relative;
    border: 6px solid #fff;
    margin: 0px auto;
    background: none !important;
}

.traning-lever0 .item ul li .img:before {
    content: "";
    position: absolute;
    width: 102px;
    height: 102px;
    left: -12px;
    top: -12px;
    border: 6px solid #e5e5e5;
    border-radius: 50%;
}

.traning-lever0 .item ul li.active .img:before {
    border: 6px solid #b92589;
}

.traning-lever0 .item.item1 ul li.active .img:before {
    border: 6px solid #8f42a3;
}

.traning-lever0 .item.item2 ul li.active .img:before {
    border: 6px solid #454098;
}

.traning-lever0 .item.item3 ul li.active .img:before {
    border: 6px solid #006caa;
}

.traning-lever0 .item.item4 ul li.active .img:before {
    border: 6px solid #148d46;
}

.traning-lever0 .item.item5 ul li.active .img:before {
    border: 6px solid #f4a51e;
}

.traning-lever0 .item.item6 ul li.active .img:before {
    border: 6px solid #ea6923;
}

.traning-lever0 .item.item7 ul li.active .img:before {
    border: 6px solid #b82827;
}

.traning-lever0 .item ul li .img:after {
    content: "";
    background-image: url(../assets/img/traning/stick.svg?v=1.0.02);
    position: absolute;
    bottom: 0px;
    right: -12px;
    width: 26px;
    display: block;
    height: 20px;
    background-size: cover;
}

.traning-lever0 .item ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti.png?v=1.0.03);
}

.traning-lever0 .item.item0 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti0.png?v=1.0.03);
}

.traning-lever0 .item.item1 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti1.png?v=1.0.03);
}

.traning-lever0 .item.item2 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti2.png?v=1.0.03);
}

.traning-lever0 .item.item3 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti3.png?v=1.0.03);
}

.traning-lever0 .item.item4 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti4.png?v=1.0.03);
}

.traning-lever0 .item.item5 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti5.png?v=1.0.03);
}

.traning-lever0 .item.item6 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti6.png?v=1.0.03);
}

.traning-lever0 .item.item7 ul li.active .img:after {
    background-image: url(../assets/img/traning/stick-acti7.png?v=1.0.03);
}

.traning-lever0 .item ul li .img img {
    position: absolute;
    top: 0px;
    bottom: 0px;
    margin: auto;
    left: 0px;
    right: 0px;
    width: 78px;
    filter: grayscale(100%);
    max-height: inherit;
}

.traning-lever0 .item ul li.active .img img {
    filter: grayscale(0%);
}

.traning-lever0 .item ul li h3 {
    margin: 20px 0px 0px;
    font-size: 16px;
    line-height: 1.25;
    color: #333;
}

.traning-lever0 .item ul li h3 p {
    margin: 0px;
    position: static;
}

@media (max-width: 767px) {
    .traning-lever0 .item ul li h3 {
        margin: 15px 0px 0px;
    }
    .traning-lever0 .item ul li h3 p {
        display: none;
    }
}

.traning-lever0 .item ul li h3 span {
    display: block;
}

.traning-lever0 .item .iframe {
    max-width: 960px;
    margin: 0px auto;
}

.traning-lever0 .item .iframe .title1 {
    color: #b92589;
    text-align: center;
    letter-spacing: 1px;
    margin: 0px 0px 16px;
    padding: 10px 0px 0px;
    line-height: 1.2;
    position: relative;
    font-size: 18px;
}

.traning-lever0 .item .iframe .title1 span {
    position: relative;
    background: #fff;
    padding: 0px 15px;
}

.traning-lever0 .item .iframe .title1 span:before {
    content: "";
    width: 80px;
    position: absolute;
    top: 50%;
    left: 100%;
    margin: auto;
    height: 1px;
    background: #8f42a3;
    margin-top: 0px;
}

.traning-lever0 .item .iframe .title1 span::after {
    content: "";
    width: 80px;
    position: absolute;
    top: 50%;
    right: 100%;
    margin: auto;
    height: 1px;
    background: #8f42a3;
    margin-top: 0px;
}

.traning-lever0 .item.item1 .iframe .title1 {
    color: #8f42a3;
}

.traning-lever0 .item.item2 .iframe .title1 {
    color: #454098;
}

.traning-lever0 .item.item3 .iframe .title1 {
    color: #006caa;
}

.traning-lever0 .item.item4 .iframe .title1 {
    color: #148d46;
}

.traning-lever0 .item.item5 .iframe .title1 {
    color: #ffae01;
}

.traning-lever0 .item.item6 .iframe .title1 {
    color: #ff6c01;
}

.traning-lever0 .item.item7 .iframe .title1 {
    color: #b82827;
}

.traning-lever0 .item.item1 .title:before {
    border-top: 2px solid #210057;
}

.traning-lever0 .item.item2 .title:before {
    border-top: 2px solid #0052d9;
}

.traning-lever0 .item.item3 .title:before {
    border-top: 2px solid #018304;
}

.traning-lever0 .item.item4 .title:before {
    border-top: 2px solid #ffae01;
}

.traning-lever0 .item.item5 .title:before {
    border-top: 2px solid #ff6c01;
}

.traning-lever0 .item.item6 .title:before {
    border-top: 2px solid #d91e1f;
}

.traning-lever0 .item.item2 .iframe .title1 span:before {
    background: #8f42a3;
}

.traning-lever0 .item.item2 .iframe .title1 span::after {
    background: #8f42a3;
}

.traning-lever0 .item.item3 .iframe .title1 span:before {
    background: #454098;
}

.traning-lever0 .item.item3 .iframe .title1 span::after {
    background: #454098;
}

.traning-lever0 .item.item4 .iframe .title1 span:before {
    background: #006caa;
}

.traning-lever0 .item.item4 .iframe .title1 span::after {
    background: #006caa;
}

.traning-lever0 .item.item5 .iframe .title1 span:before {
    background: #148d46;
}

.traning-lever0 .item.item5 .iframe .title1 span::after {
    background: #148d46;
}

.traning-lever0 .item.item6 .iframe .title1 span:before {
    background: #ffae01;
}

.traning-lever0 .item.item6 .iframe .title1 span::after {
    background: #ffae01;
}

.traning-lever0 .item.item7 .iframe .title1 span:before {
    background: #ff6c01;
}

.traning-lever0 .item.item7 .iframe .title1 span::after {
    background: #ff6c01;
}

.traning-lever0 .item.item8 .iframe .title1 span:before {
    background: #b82827;
}

.traning-lever0 .item.item8 .iframe .title1 span::after {
    background: #b82827;
}


/**/

span.icon-wallet-paid {
    position: absolute;
    margin-left: 2px;
}

.departMRe_inp {
    position: relative;
}

.departMRe_inp a.department.square_x {
    position: absolute;
    top: -3px;
    right: 4px;
    font-size: 10px;
    padding-top: 7px;
    padding-left: 1px;
}

.ncc_radio.cashback span::before {
    transform: scale(0.8);
}

span.default-price {
    display: block;
    font-size: 10px;
    font-style: italic;
    text-align: right;
    padding-right: 5px;
    color: #007dd1;
}

.setting-pro-price-detail {
    background: #ededed;
    border-radius: 5px;
    padding: 9px 10px 14px 10px;
    font-size: 16px;
    text-align: center;
}

.setting-pro-price-detail .lbl {
    position: relative;
    top: 6px;
}

td.img-item img {
    padding: 6px;
    float: left;
    max-width: 90px;
}

td.img-item {
    width: 8%;
}

.img-cmnd label {
    margin-top: 10px;
    display: inline-block;
}

.img-cmnd img {
    max-width: 100%;
    max-height: 300px;
}

i.delete {
    position: absolute;
    cursor: pointer;
    right: 5px;
    top: -3px;
    font-style: inherit;
    color: #f00;
}

i.delete:hover {
    color: red;
}

i.btn-delete-item {
    display: inherit;
    top: 10px;
    position: absolute;
    right: 0px;
    font-size: 20px;
    opacity: 0.56;
}

i.btn-delete-item:hover {
    opacity: 0.88;
    color: red;
}

.modal-dialog.modal-full,
.modal-full {
    margin: 0px auto;
    width: 100%;
}

.modal-dialog.modal-full .modal-content {
    border-radius: 0px;
    box-shadow: none;
    border: none;
}

.modal-dialog.modal-full .modal-content .pop_up_T {
    border-radius: 0px;
}

.modal-dialog.modal-full .modal-body {
    min-height: 668px;
}

.search-order.extend select {
    width: 100%;
    padding: 5px;
}

.color-black * {
    color: black;
}

span.item-product-name,
span.item-span-name,
span.item-hdl {
    padding: 5px;
    border: 1px solid #ccc;
    margin: 3px;
    border-radius: 5px;
    background: rgba(0, 162, 255, 0.836);
    color: white;
    position: relative;
    margin: 3px;
    display: inline-block;
}

span.item-product-name i,
span.item-span-name i,
span.item-hdl i {
    cursor: pointer;
    margin-left: 5px;
    right: 5px;
    color: white;
    font-size: 18px;
    opacity: 0.6;
}

span.item-product-name i:hover,
span.item-span-name i:hover {
    color: red;
    opacity: 0.88;
}

input#scheduled_date {
    /* margin-top: 2px; */
    padding: 6px 10px;
}

.rows-items:hover {
    background: #f0fff0 !important;
}

.rows-items.activate {
    background: #f0fff0 !important;
}

.rows-items-info {
    display: none;
    background: #f0fff0;
}

.rows-items-info.activate {
    display: revert;
    background: #f0fff0 !important;
}

.list-retrieve td td {
    background: white;
    padding: 2px 10px !important;
}

.list-retrieve:hover td td {
    background: #f0fff0;
}

tr.sub-items-el:hover td {
    background: #fbfbfb !important;
}

tr.sub-items-el.header th {
    background: #eaeaea;
    color: #777474;
}

tr.sub-items-el td {
    background: #f5f5f5 !important;
}

tr.sub-items-el td.img-item img {
    height: 46px;
}

@media(max-width: 767px) {
    .slide-theme {
        width: 100% !important;
    }
}

.name-theme label,
.slide-theme label,
.category-theme label,
.product-theme label {
    font-size: 14px;
    color: #3d3d3d;
    padding: 3px 0px;
    margin-top: 0px;
    height: 40px;
}

.theme-review,
.item-review {
    width: calc(33.3333333% - 4px);
    /* float: left; */
    margin: 2px 2px;
    border: 1px solid #e6e6e6;
    padding: 4px;
    background: #fff;
    position: relative;
    text-align: center;
    display: inline-block;
    border-radius: 5px;
}

.theme-review .img,
.item-review .img {
    height: 120px;
    position: relative;
    object-fit: cover;
    /* border-bottom: 1px solid #ddd; */
    margin-bottom: 2px;
}

.theme-review .img img,
.item-review .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.item-review.product .img {
    height: 0;
    padding-bottom: 100%;
}

.item-review.product .img img {
    width: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
}

.theme-review .img img.no,
.item-review .img img.no {
    width: auto;
    height: auto;
}

.theme-review img,
.item-review img {
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}

.item-review label {
    font-size: 12px;
    line-height: 1.3;
    height: 36px;
    display: block;
    padding: 5px 0px;
    overflow: hidden;
    white-space: normal;
    margin-bottom: 4px;
}

.item-review .price {
    margin: 5px 0 3px 0;
    font-weight: 600;
    color: var(--main-color);
}

.item-review.category.big .img {
    border: none;
    margin: 0px;
}

.item-review.category.big label {
    /* display: none; */
}

.theme-review i,
.item-review i {
    position: absolute;
    display: inline-block;
    top: 3px;
    right: 2px;
    color: red;
    font-weight: bold;
    text-decoration: none;
    opacity: 0.52;
    cursor: pointer;
    width: 10px;
    height: 10px;
    background: red;
}

.theme-review i.x,
.item-review i.x {
    right: 2px;
}

.theme-review i.down,
.item-review i.down {
    right: 16px;
    background: gray;
}

.theme-review i.up,
.item-review i.up {
    right: 30px;
    background: green;
}

.theme-review i:hover,
.item-review i:hover {
    opacity: 0.96;
}

#list_theme h3 {
    color: #438bca;
}

.list-el-theme {
    width: 100%;
    overflow-x: auto;
    background: #e1e1e1;
    margin-bottom: 5px;
    /* height: 150px; */
    height: 200px;
    padding: 3px;
}

.scape-slide .list-el-theme {
    overflow: initial;
    padding: 0px;
    height: 236px;
    margin: 0;
}

.scape-slide .list-el-theme * {
    height: 236px;
}


/* .scape-slide .list-el-theme.small {
    height: 118px;
}

.scape-slide .list-el-theme.small * {
    height: 118px;
} */

.scape-slide .list-el-theme .item-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.item-slide {
    position: relative;
}

.item-slide img {
    max-width: 100%;
}

.item-slide label {
    height: auto !important;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), transparent);
    color: #fff;
    line-height: 1.2;
    padding: 5px;
}

.name-theme label.header,
.category-theme label.header,
.product-theme label.header,
.slide-theme label.header {
    color: #333 !important;
    height: auto;
    margin: 10px 0px 0px 0px !important;
}

div.a-block-of-theme {
    border: 1px solid #ccc;
    border-radius: 0 0 5px 5px;
    padding: 6px;
    box-shadow: 0 2px 2px #dedede;
}

div.a-block-of-theme.in-theme {
    border-radius: 5px;
    margin: 5px 0px;
    background: #ffff;
}

div.a-block-of-theme.in-theme:hover {
    background: #d0f6ff;
}

div.a-block-of-theme .title {
    display: block;
    padding: 8px 90px 6px 5px;
}

div.a-block-of-theme .title>span {
    background-color: #b0bcd4;
    display: inline-block;
    color: #fff;
    font-size: 12px;
    padding: 1px 9px 2px;
    border-radius: 10px;
    font-weight: 600;
    position: relative;
    top: -1px;
}

div.a-block-of-theme .header {
    color: var(--main-color);
    margin: 5px 0px;
}

div.a-block-of-theme .header-last {
    color: var(--main-color);
    display: block;
    margin-top: 10px;
}

.item-bordered {
    border: 1px solid #ccc;
    padding: 5px;
    border-radius: 5px;
    background: #f0f0f0;
    box-shadow: 0px 0px 0px #ccc;
    margin-top: 6px;
}

#f_list {
    padding: 0px;
}

#f_list>ul {
    border-bottom: 1px solid #f1f1f1;
}

#f_list>ul>li {
    position: relative;
}

#f_list>ul>li>ul {
    position: relative;
}

#f_list>ul>li>ul:before,
#f_list>ul>li>ul>li>ul:before {
    content: "";
    width: 1px;
    height: 100%;
    background: #f1f1f1;
    position: absolute;
    left: 15px;
    top: 0px;
}

#f_list>ul>li>ul>li>ul:after {
    content: "";
    width: 1px;
    height: 100%;
    background: #fff;
    position: absolute;
    left: 0px;
    top: 0px;
}

#f_list>ul>li>ul>li {
    position: relative;
}

#f_list>ul>li>ul>li::before,
#f_list>ul>li>ul>li>ul>li::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 1px;
    background: #f1f1f1;
    top: 20px;
    left: 15px;
}

#f_list>ul>li>ul>li table .cat-info td:first-child {
    padding-left: 15px;
}

#f_list>ul>li>ul>li table .cat-info td:first-child i {
    background: #fff;
    position: relative;
    z-index: 1;
}

.theme-cat-itemsx table {
    margin-bottom: 0px;
}

@media(max-width: 767px) {
    .product_index_t1 .theme-cat-itemsx .table tbody>tr>td {
        background: none !important;
    }
    .theme-cat-itemsx .table-responsive,
    .theme-cat-itemsx .table-responsive table,
    .theme-cat-itemsx .table-responsive table tbody {
        display: block;
    }
    .theme-cat-itemsx .table-responsive table tbody tr.cat-info {
        display: block;
        padding: 5px 0px;
    }
    .theme-cat-itemsx .table-responsive table tbody tr.cat-info td {
        display: block;
        width: 100% !important;
        text-align: left !important;
        border: none !important;
        padding: 3px 6px;
    }
    .theme-cat-itemsx .table-responsive table tbody tr.cat-info td:first-child {
        display: none !important;
    }
}

#f_list ul {
    padding: 0px;
    margin: 0px;
}

#f_list ul li>ul {
    position: relative;
}

#f_list ul li.theme-cat-items {
    list-style: none;
    border: 1px solid #f1f1f1;
    border-bottom: none;
}

#f_list ul li.theme-cat-items .table {
    margin: 0
}

#f_list ul li.theme-cat-items .table tr,
#f_list ul li.theme-cat-items .table tr td {
    border: none;
    text-align: left;
    background: #fff !important;
}

@media(max-width: 767px) {
    #f_list ul li.theme-cat-items {
        border-bottom: 7px solid #f1f1f1;
        float: left;
        width: 100%;
    }
    #f_list ul li.theme-cat-items .table,
    #f_list ul li.theme-cat-items .table tbody,
    #f_list ul li.theme-cat-items .table tr,
    #f_list ul li.theme-cat-items .table tr td {
        display: block;
        width: 100% !important;
        padding: 0px !important;
        text-align: left !important;
        float: left !important;
    }
    #f_list ul li.theme-cat-items .table tr {
        padding: 12px !important;
    }
    #f_list ul li.theme-cat-items .table tr.cat-expand-rows {
        padding-top: 0 !important;
    }
    #f_list ul li.theme-cat-items .table tr td {
        border-top: 1px solid #f1f1f1;
        padding-top: 5px !important;
        margin-top: 10px;
    }
    #f_list ul li.theme-cat-items .table tr td:first-child {
        padding-top: 0 !important;
        border-top: none !important;
        margin-top: 0;
    }
    #f_list ul li.theme-cat-items .table tr td:last-child {
        position: absolute;
        top: 46px;
        right: 10px;
        width: auto !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #f_list ul li.theme-cat-items .table tr td .ds-mobile {
        display: inline-block;
        margin-right: 5px;
        color: #555;
        font-weight: 500;
        min-width: 100px;
        font-size: 13px;
    }
    #f_list ul li.theme-cat-items .table tr td .ds-mobile.ds-mobile-icon {
        top: -3px;
        position: relative;
    }
    #f_list ul li.theme-cat-items .table tr td .ds-mobile.ds-mobile-icon+.wrap-banner-review {
        display: inline-block;
        margin-bottom: -8px;
    }
    #f_list ul li.theme-cat-items .table tr td .name11 {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-weight: 600;
    }
    #f_list ul li.theme-cat-items .table tr.cat-expand-rows td:last-child {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        width: 100% !important;
    }
    #f_list ul li.theme-cat-items .table tr.cat-expand-rows .top-35,
    #f_list ul li.theme-cat-items .table tr.cat-expand-rows .top-30,
    #f_list ul li.theme-cat-items .table tr.cat-expand-rows .top-40 {
        margin-top: 0;
    }
}

#f_list ul li.theme-cat-items>ul>li {
    border-left: none;
    border-right: none;
    position: relative;
    padding-left: 15px;
}

#f_list ul li.theme-cat-items>ul>li>ul>li {
    margin-left: 15px;
    padding-left: 0px;
}

#f_list ul li.theme-cat-items>ul>li>ul>li:first-child {
    margin-left: 0px;
    padding-left: 15px;
}

#f_list ul li.theme-cat-items>ul>li>ul>li::before {
    left: 0px;
}

#f_list ul li.theme-cat-items>ul>li>ul>li:first-child::before {
    left: 15px;
}

#f_list ul li.theme-cat-items>ul li.border-bottom-no:last-child tr {
    border-bottom: none;
}

#f_list ul li.theme-cat-items button {
    padding: 4px 12px;
}

.theme-cat-items table {
    width: 100%;
}

.theme-cat-items .cat-info.active {
    background: #d1f7ff;
}

.theme-cat-items .cat-info.active .alc {
    font-weight: bold;
}

.theme-cat-items .cat-info td {
    padding: 5px 10px;
}

.theme-cat-items:nth-child(2n) {
    /* background: #f9f9f9; */
}

.theme-cat-items .cat-detail-info {
    background: #f7f7f7;
    padding: 10px 0;
}

.theme-cat-items .theme-cat img {
    margin: 0 auto;
}

.theme-cat .link-cat {
    height: 30px;
    left: 4px;
    width: calc(100% - 8px);
    font-size: 13px;
    position: absolute;
    bottom: 38px;
}

.theme-cat.theme-cat-app .link-cat {
    bottom: 4px;
}

.theme-cat .value-cat {
    z-index: 499;
    position: absolute;
    bottom: 72px;
    height: 30px;
    left: 4px;
    width: calc(100% - 8px);
    padding: 0px 6px;
    font-size: 13px;
}

.theme-cat.theme-cat-app .value-cat {
    bottom: 38px;
}

.theme-cat.theme-cat-app span.icon-x.theme {
    bottom: 14px;
}

.theme-cat .target-cat {
    z-index: 499;
    position: absolute;
    bottom: 4px;
    height: 30px;
    left: 4px;
    width: calc(100% - 8px);
    padding: 0px 6px;
    font-size: 13px;
}

.theme-cat.theme-cat-app .target-cat {
    display: none;
}

.theme-cat-items i.icon-expand {
    cursor: pointer;
    color: #31a5c7;
    opacity: 0.46;
}

.theme-cat-items i.icon-expand.fa-plus {
    color: #fc5951;
}

.theme-cat-items i.icon-expand:hover {
    color: #fc5951;
}

.theme-cat-items select:disabled {
    opacity: 0.8;
}

.theme-cat-items td.alc:hover {
    color: var(--main-color-hover);
    cursor: pointer;
}

.wrap-banner-review {
    width: 32px;
    height: 32px;
    border: 1px solid #ececec;
    position: relative;
    border-radius: 3px;
    margin: 0px auto;
}

.wrap-banner-review-62 {
    width: 62px;
    height: 62px;
    border: 1px solid #ececec;
    position: relative;
    border-radius: 3px;
    margin: 0px auto;
    background: #f5f5f5;
}

img.banner-review {
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    padding: 2px;
}

.bg-holder {
    background: #d1f7ff;
    padding: 18px 10px;
    border-radius: 5px;
    color: #31a5c7;
    font-size: 15px;
}

input:not([value=""]):disabled.auto-input+span.icon-x,
input:disabled.auto-input-supplier+span.icon-x {
    display: block;
    position: absolute;
    top: 8px;
    right: 6px;
    opacity: 0.52;
    cursor: pointer;
}

input:not([value=""]):disabled.auto-input+span.icon-x:hover {
    opacity: 0.8;
    color: red;
}

input.auto-input+span.icon-x {
    display: none;
}

div.blocks-holder {
    min-height: 600px;
    background: #f0f0f0;
    border-radius: 5px;
    margin-top: 15px;
    padding-bottom: 5px;
    padding-top: 5px;
    box-shadow: 0px 1px 0px #ccc;
    padding-left: 10px;
    padding-right: 10px;
}

@media(max-width: 767px) {
    div.blocks-holder {
        margin-top: 5px;
    }
}

.category.item-review.big.portrait,
.product.item-review.portrait {
    float: left;
}

span.remove-block {
    position: absolute;
    right: 0;
    font-weight: bold;
    color: gray;
    opacity: 0.6;
    cursor: pointer;
    font-size: 16px;
}

span.remove-block:hover {
    color: red;
    opacity: 0.9;
}

.item-bordered.landscape {
    width: 100%;
    /* overflow-x: scroll; */
}

.item-bordered.landscape .landscape {
    /* width: 522px;
    white-space: nowrap; */
}

.landscape_scroll {
    white-space: nowrap;
    overflow-x: auto;
}

.landscape_scroll::-webkit-scrollbar {
    height: 6px;
}

.landscape_scroll::-webkit-scrollbar-track {
    background: #fff;
}

.landscape_scroll::-webkit-scrollbar-thumb {
    background-color: #999;
}

.item-bordered.scape-slide {
    overflow: hidden;
}

.item-review.category.small {
    width: 83.7px;
    background: none;
    border: none;
    box-shadow: none;
    background: #fff;
    margin-bottom: 2px;
}

.landscape_scroll .item-review.category.small {
    margin-bottom: 6px;
}

.item-review.category.small .img {
    height: 50px;
    margin: 0px auto;
    border-bottom: none;
}

.item-review.category.small .img img {
    padding: 0px;
    border-radius: 50%;
    height: 100%;
    width: 100%;
    position: relative;
    object-fit: cover;
}

.item-review.category.small .img img.no {
    height: 40px;
    width: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 0;
}

.item-review.category.small.item-review label {
    display: block;
    font-size: 12px;
    position: relative;
    text-align: center;
    margin-bottom: 5px;
    text-transform: none;
}

.item-review.category.big.landscape,
.item-review.product.landscape {
    width: 150px;
}

.up-icon img {
    max-width: 100%;
    max-height: 220px;
    padding: 36px;
    margin: 0 auto;
    overflow: hidden;
}

.up-icon img:hover {
    padding: 42px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.edit-cashback-dbl {
    cursor: pointer;
}

.inp-product-com.number-format-any {
    padding-left: 3px;
    padding-right: 3px;
    text-align: right;
}

tr.detail_order_info td {
    padding: 0px !important;
}

tr.detail_order_info td table {
    margin: 0 0 10px 0;
}

div.hold-tb {
    padding-bottom: 10px !important;
    background: #f0f0f0;
}

tr.detail_order_info table td,
tr.detail_order_info table th {
    background: #f1f1f1 !important;
}

div.hold-tb button.confirm {
    margin-right: 26px;
}

tbody.row-detail-order.active tr.detail_order_click td {
    background: #f1fff1;
}

tbody.row-detail-order.active div.hold-tb table tr:hover td {
    background: #fff !important;
}

.dr span.ui-dropdownchecklist-selector.ui-state-default {
    height: 34px;
    padding-top: 0px;
    border-radius: 3px;
}

.dr div.ui-dropdownchecklist-dropcontainer.ui-widget-content {
    min-width: 400px;
}

li.delivery_steps.delivery_steps_0 {
    color: #333;
}

li.delivery_steps.delivery_steps_1 {
    color: rgb(7, 182, 7);
}

li.delivery_steps.delivery_steps_1:last-child {
    color: orange !important;
}

li.delivery_steps h4 {
    font-size: 15px;
}

li.delivery_steps i.desc {
    font-size: 12px;
    margin-left: 2%;
    font-style: italic;
    color: #999;
    font-weight: normal;
    margin-top: -5px;
    display: inline-block;
}

li.delivery_steps.delivery_steps_1 i.desc {
    color: #292828a8;
}

li.delivery_steps {
    list-style: none;
    font-weight: bolder;
    font-size: 12px;
}

tbody.row-product.active .product_click {
    background: #f1fff1;
    /* border-left: green 2px solid; */
}

tbody.row-product.active .order_list_by_product {
    background: #f4f4f4;
    /* border-left: green 2px solid; */
}

.row-order.active .order_click {
    background: #f2fff2;
    /* border-left: 2px solid green; */
}

.row-order.active .product_list_by_order {
    background: #f1f1f1;
    /* border-left: 2px solid green; */
}

tr.row-item.active,
tr.row-item.active+tr.sub-row {
    /* border-left: 2px solid green; */
    background-color: #f1f1f1;
}

div.ncc_radio.cashback * {
    font-size: 13px;
    padding: 0px;
}

.wmd-view-topscroll {
    width: 100%;
    overflow-x: auto;
    position: fixed;
    bottom: 0;
    z-index: 9999;
}

.wmd-view-topscroll .scroll-div1 {
    width: 100%;
    height: 2px;
}

/* Works on Chrome, Edge, and Safari */

.wmd-view-topscroll::-webkit-scrollbar {
    height: 10px;
}

.wmd-view-topscroll::-webkit-scrollbar-track {
    background: #ddd;
}

.wmd-view-topscroll::-webkit-scrollbar-thumb {
    background-color: #037dd1;
    border-radius: 6px;
    cursor: pointer;
}

span.theme-color {
    height: 34px;
    padding: 5px;
    box-shadow: 1px 0px 1px #ddd;
    border-radius: 3px;
    width: 108px;
    display: inline-block;
    position: absolute;
}

#block_list ul {
    padding: 0px;
    margin: 0px;
}

#block_list .theme-cat-items {
    list-style-type: none;
    border-bottom: 1px solid #f1f1f1;
    padding: 5px 0px;
}

#block_list .theme-cat-items.theme-cat-items-hidden * {
    text-decoration: line-through !important;
    color: #999 !important;
}

#block_list .theme-cat-items:nth-child(2n) {
    background: #f9f9f9;
}

#block_list .theme-cat-items .cat-info {
    display: flex;
    align-items: center;
}

#block_list .theme-cat-items .cat-info>div {
    float: left;
    width: calc(100% - 84px);
    padding-left: 8px;
}

#block_list .theme-cat-items .cat-info>div.right {
    width: 84px;
    float: right;
    text-align: center;
}

#block_list .theme-cat-items .cat-info>div.right .btn {
    padding: 6px 4px;
}

#block_list .theme-cat-items .cat-info div.left {
    display: inline-block;
    position: relative;
    top: -1px;
    margin-right: 2px;
}

#block_list .theme-cat-items .cat-info div.left>span {
    background-color: #b0bcd4;
    display: inline-block;
    color: #fff;
    font-size: 12px;
    padding: 1px 9px 2px;
    border-radius: 10px;
    font-weight: 600;
}

div.block-pro {
    /* height: 158px;
    margin-bottom: 58px; */
    padding: 4px;
}

div.block-pro .item-slide {
    height: 0;
    padding-bottom: 100%;
    overflow: hidden;
}

div.block-pro .item-slide-news img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.btn-search-eye {
    position: absolute;
    right: 0px;
    top: 0px;
    border-radius: 0px 4px 4px 0px !important;
}


/**/

.box-wallet {
    background: #eee;
    padding: 4px !important;
}

.box-wallet::after {
    content: "";
    display: block;
    clear: both;
}

.box-wallet .box {
    padding: 4px;
}

.box-wallet .box .inner {
    background-color: #fff;
    margin: 1px;
}

@media (max-width: 767px) {
    .box-wallet .box {
        padding: 4px;
    }
    .box-wallet .box .inner {
        margin: 0px;
    }
}

.box-wallet .box .inner>h2 {
    border-bottom: 1px solid #eee;
    padding: 12px 15px 11px;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 0px;
    margin-top: 0px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 767px) {
    .box-wallet .box .inner>h2 {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

.box-wallet .box .inner .body {
    padding: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
}

.box-wallet .box .inner .body b,
.box-wallet .box .inner .body strong {
    min-height: 20px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    color: #007dd1;
}

span.icon-x.theme {
    position: absolute;
    bottom: 47px;
    right: 15px;
    z-index: 500;
    opacity: 1;
    cursor: pointer;
}

span.icon-x.theme:hover {
    color: red;
}

.high-light {
    font-weight: bold;
    font-size: 14px;
    padding: 16px;
    border-radius: 3px;
    background-color: #f3f3f3;
}

.icon-upload .fa {
    font-size: 60px;
    padding: 18px;
}

.icon-upload {
    text-align: center;
}

#add_total {
    display: block;
    margin-top: 10px;
    margin-bottom: -10px;
    margin-right: 15px;
}

.input-client {
    margin-bottom: 10px;
}

.input-client input {
    height: 40px;
}

.f-search .input-client span.icon-x {
    top: 6px;
    right: 5px;
}


/**/

.form-login-v1 {
    background-image: url(../images/bg-login.png);
    background-color: #f0f8ff;
    background-repeat: no-repeat;
    background-position: center 110px;
    background-size: 100%;
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
}

.form-login-v {
    box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
    color: #000000de;
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    background-color: #fff;
    max-width: 500px;
    padding: 32px;
    margin: 30px auto;
    border-radius: 3px;
    position: relative;
    z-index: 2;
}

@media (max-width: 767px) {
    .form-login-v {
        width: calc(100% - 20px);
        margin: 10px;
        max-width: inherit;
        padding: 22px;
    }
}

.form-login-v .logo-login {
    text-align: center;
    margin-bottom: 14px;
}

.form-login-v .logo-login img {
    max-height: 60px;
    margin: 10px 0px;
}

.form-login-v .title-l {
    font-size: 22px;
    font-weight: 600;
    line-height: 1.334;
    letter-spacing: 1px;
    color: #0c0c0cd9;
    margin: 0px 0px 10px;
    text-transform: uppercase;
}

.form-login-v .user-register {
    padding: 15px 10px 10px;
}

@media (max-width: 767px) {
    .form-login-v .user-register {
        padding: 0px;
    }
}


/**/


/**/

.home-new {
    padding: 8px;
    background-color: #eee;
}

.home-new:after {
    content: "";
    display: block;
    clear: both;
}

.home-new .item {
    padding: 8px !important;
}

@media (max-width: 991px) {
    .home-new {
        padding: 4px;
    }
    body .home-new .container .row .item {
        padding: 4px !important;
    }
    .home-new .item:nth-child(2n+1) {
        clear: both;
    }
}

.home-new .item .iframe a {
    padding: 20px;
    background-color: #fff;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    outline: none !important;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
    position: relative;
    overflow: hidden;
    text-align: center;
    display: block;
    cursor: pointer;
}

.home-new .item .iframe a:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -o-transform: scale(1.03);
    -ms-transform: scale(1.03);
    transform: scale(1.03);
}

.home-new .item .iframe a:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 0%;
    height: 100%;
    background: rgb(255 255 255 / 10%);
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.home-new .item .iframe a:hover:before {}

.home-new .item .iframe a:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    width: 0%;
    height: 100%;
    background: rgb(255 255 255 / 10%);
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.home-new .item .iframe a:hover:after {}

@media (max-width: 991px) {
    .home-new .item .iframe a {
        padding: 20px 8px;
    }
}

.home-new .item .iframe .img {
    margin: 10px 0px 15px;
    position: relative;
    z-index: 1;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.home-new .item .iframe .img>span {
    color: var(--main-color);
    font-size: 58px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.home-new .item .iframe a:hover .img {
    /* color: #fff; */
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -o-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}

.home-new .item .iframe .img span {
    color: var(--main-color);
    font-size: 48px;
}

.home-new .item .iframe .img img {
    height: 50px;
}

.home-new .item .iframe .img i {
    font-size: 34px;
}

.home-new .item .iframe .img.img_x img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%);
}

.home-new .item .iframe .title {
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    color: #444;
    margin-bottom: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 1;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.home-new .item .iframe a:hover .title {
    /* color: #fff; */
    /* -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -o-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9); */
}

.home-new.home-new-sub .item .iframe .title {
    white-space: normal;
    height: 38px;
    padding: 0px 25px;
    font-size: 14px;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

@media (min-width: 992px) {
    .home-new.home-new-sub .item {
        /* width: 20%; */
    }
}

@media (max-width: 767px) {
    .home-new .item .iframe .title {
        font-weight: 400;
    }
    .home-new.home-new-sub .item .iframe .title {
        padding: 0px 10px;
    }
}

.home-new .item .iframe .info {
    font-weight: normal;
    font-size: 12px;
    color: #888;
    padding-top: 3px;
    overflow: hidden;
    display: block;
    display: -webkit-box;
    max-height: 36px;
    font-size: 12px;
    line-height: 18px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 36px;
}

.home-new .item .iframe .users {
    margin-top: 5px;
}


/*dashboard*/

.dashboard {
    padding: 4px;
}

.block-header {
    margin-top: 4px;
    margin-bottom: 8px;
    padding: 14px;
    background: #fff;
    margin: 6px 0px;
}

@media (max-width: 767px) {
    .block-header {
        padding: 12px;
        margin: 0px -4px 4px;
    }
}

.block-header:after {
    content: "";
    display: block;
    clear: both;
}

.block-header h2 {
    margin: 0px 0px 5px;
    color: #30373e;
    font-weight: 600;
    font-size: 20px;
}

.block-header h3 {
    color: #89969e;
    margin: 0px;
    font-size: 13px;
}

.block-header .pull-right {
    margin-top: 5px;
}

.block-header .btn {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    border: none;
}

@media (max-width: 767px) {
    .block-header .pull-left,
    .block-header .pull-right {
        float: none !important;
    }
    .block-header .pull-right {
        margin-top: 10px;
    }
}

.db-grid {
    padding: 6px 0 0px 0px;
    margin: 0px -8px;
    overflow: hidden;
}

.db-grid .box {
    float: left;
    width: 33.3333%;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    padding: 8px;
}

.db-grid .box .inner {
    background-color: #fff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.03);
    -webkit-box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.03);
    box-shadow: 0 2px 5px 0px rgba(0, 0, 0, 0.03);
}

.db-grid .box .header {
    border-bottom: 1px solid #eee;
    padding: 12px 15px 11px;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
}

.db-grid .box .body {
    padding: 5% 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
}

.db-grid .box .bigcount {
    position: relative;
    padding-left: 80px;
}

.db-grid .box .bigcount .count {
    font-size: 32px;
    position: absolute;
    left: -2px;
    width: 62px;
    text-align: center;
    font-weight: 600;
    height: 45px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}

.db-grid .box .bigcount .txt {
    color: #aaa;
    font-size: 11px;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.db-grid .box .bigcount .info {
    padding-top: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dot-working {
    background: rgba(89, 105, 197, 0.2);
    color: #2f42b5;
    border: 1px solid rgba(89, 105, 197, 0.2);
}

.dot-success {
    background: #63b814;
    color: #2f42b5;
    border: 1px solid rgba(89, 105, 197, 0.2);
}

.db-grid .box .bigcount .info .dot {
    display: inline-block;
    font-size: 11px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin-right: 5px;
}

.db-grid .box .bigcount .info .square {
    display: inline-block;
    font-size: 11px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin-right: 3px;
    vertical-align: -1px;
}

.dashboard .report1 {}

.dashboard .report1 .db-grid {
    padding: 0px;
}

.dashboard .report1 .db-grid .box {
    width: 25%;
}

@media (max-width: 991px) {
    .dashboard .report1 .db-grid .box {
        width: 50%;
    }
}

@media (max-width: 991px) {
    .dashboard .report1 .db-grid {
        margin: 0px -8px;
    }
    .dashboard .report1 .db-grid .box {
        padding: 4px;
    }
    .dashboard .db-grid .box .body {
        padding: 4% 8px;
    }
    .dashboard .db-grid .box .bigcount .info {
        padding-top: 2px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .dashboard .db-grid .box .bigcount .count {
        font-size: 22px;
        width: 44px;
    }
    .dashboard .db-grid .box .bigcount {
        padding-left: 44px;
    }
}

.dashboard .db-grid .box .inner {
    box-shadow: none;
    border: none;
    border-radius: 0px;
}


/**/

.dashboard .report2 {}

.dashboard .report2 .card {
    background: #fff;
    padding: 10px;
}

.dashboard .report2 .card>h2 {
    margin: 12px 0px 15px 10px;
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
}

.dashboard .report2 .card>select {
    width: calc(33.333333% - 10px);
    margin: -10px 0px 25px 10px;
    border: none;
    border-bottom: 1px solid #ccc;
    border-radius: 0px;
    padding: 0px;
    box-shadow: none;
    float: left;
}

@media (max-width: 767px) {
    .dashboard .report2 .card>h2 {
        margin: 12px 0px 15px 4px;
    }
    .dashboard .report2 .card>select {
        width: calc(100% - 8px);
        margin: -10px 0px 25px 4px;
    }
}

.dashboard .report2 .row {
    margin: 0px -8px;
}

.dashboard .report2 .row>div {
    padding: 8px;
}

@media (max-width: 991px) {
    .dashboard .report2 .row>div {
        padding: 4px;
    }
}


/**/

.dashboard .report3 {
    background: #fff;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 6px;
}

@media (max-width: 991px) {
    .dashboard .report3 {
        margin-top: 4px;
        margin-left: -4px;
        margin-right: -4px;
        margin-bottom: 0px;
    }
    .dashboard .report3 .table-responsive {
        margin-bottom: 0px;
    }
}

.dashboard .report3>h2 {
    margin: 12px 0px 15px 10px;
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
}

.dashboard .report3 .table {
    margin-bottom: 0px;
}

.dashboard .report3 .table tr {
    border: none;
}

.dashboard .report3 .table tr th {
    background: none;
    border: none;
}

.dashboard .report3 .table tr td {
    border-top: 1px solid #e8e8e8;
    border-bottom: none;
}

.dashboard .report3 .table tr td>img.avatar-sm {
    width: 29px;
    border-radius: 50px;
    margin-right: 6px;
}

.dashboard .report3 .table tr td .badge {
    font-weight: 400;
}


/**/

.dashboard .report2 {}

.dashboard .report2 .card {
    background: #fff;
    padding: 10px;
}

.dashboard .report2 .card>h2 {
    margin: 12px 0px 15px 10px;
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
}

.dashboard .report2 .card>select {
    width: calc(33.333333% - 10px);
    margin: -10px 0px 25px 10px;
    box-shadow: none;
    float: left;
}

@media (max-width: 767px) {
    .dashboard .report2 .card>h2 {
        margin: 12px 0px 15px 4px;
    }
    .dashboard .report2 .card>select {
        width: calc(100% - 8px);
        margin: -10px 0px 25px 4px;
    }
}

.dashboard .report2 .row {
    margin: 0px -8px;
}

.dashboard .report2 .row>div {
    padding: 8px;
}

@media (max-width: 991px) {
    .dashboard .report2 .row>div {
        padding: 4px;
    }
}


/**/

.dashboard .report3 {
    background: #fff;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 6px;
}

@media (max-width: 991px) {
    .dashboard .report3 {
        margin-top: 4px;
        margin-left: -4px;
        margin-right: -4px;
        margin-bottom: 0px;
    }
    .dashboard .report3 .table-responsive {
        margin-bottom: 0px;
    }
}

.dashboard .report3>h2 {
    margin: 12px 0px 15px 10px;
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
}

.dashboard .report3 .table {
    margin-bottom: 0px;
}

.dashboard .report3 .table tr {
    border: none;
}

.dashboard .report3 .table tr th {
    background: none;
    border: none;
}

.dashboard .report3 .table tr td {
    border-top: 1px solid #e8e8e8;
    border-bottom: none;
}

.dashboard .report3 .table tr td>img.avatar-sm {
    width: 29px;
    border-radius: 50px;
    margin-right: 6px;
}

.dashboard .report3 .table tr td .badge {
    font-weight: 400;
}


/* .codong {
    background: -webkit-linear-gradient(45deg, #5d2c79, #2a2862, #1773af, #49a86a, #cda739, #de7632, #d7512f, #bf2e2c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
* h2,a,b,span, button, .title, a p, .fa, .glyphicon{
    background: -webkit-linear-gradient(45deg, #5d2c79, #2a2862, #1773af, #49a86a, #cda739, #de7632, #d7512f, #bf2e2c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
} */


/* 
.title{
    background: -webkit-linear-gradient(45deg, #5d2c79, #2a2862, #1773af, #49a86a, #cda739, #de7632, #d7512f, #bf2e2c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
} */

div.hold-item {
    padding: 10px 8px;
    background: #f1f1f1;
    border-radius: 5px;
    min-height: 36px;
}

div.hold-item-card {
    padding: 7px 7px 4px;
    background: #fff;
    border-radius: 5px;
    min-height: 36px;
    display: none;
}

tr.deparment-dub td.dub-head,
tr.deparment-dub:hover td.dub-head {
    background: var(--main-color) !important;
    color: white;
    font: bold;
}

a.img.hd-file.url_chung_tu.large {
    padding: 5px;
    height: 50px;
    width: 50px;
    display: inline-block;
    margin-left: 5px;
    border: 1px dotted #f1f1f1;
}

td div.review a.view-link.fa.fa-youtube-play {
    font-size: 22px;
    color: #fe5040;
}

td div.review {
    width: 46px;
    float: left;
}

div.review img.img-docs {
    width: 100% !important;
}

div.review img.img-video {
    width: 95% !important;
    position: relative !important;
}

.review.video {
    margin-top: 5px;
    margin-left: 13px;
    width: 60px;
}

div.review a.view-link.fa-youtube-play {
    font-size: 16px;
}

span.hold-gray {
    background: #f1f1f1;
    display: inline-block;
    padding: 15px 10px;
    border-radius: 5px;
    width: 100%;
    min-height: 66px;
}

.mw110 {
    display: block;
    min-width: 110px;
}

.ui-dropdownchecklist-dropcontainer.ui-widget-content {
    height: auto !important;
}


/*step-setting-theme*/

.step-setting-theme {
    text-align: center;
    margin: 10px 0px 30px;
}

.step-setting-theme ul {
    padding: 0px;
    margin: 0px;
}

@media (max-width: 767px) {
    .step-setting-theme {
        margin-bottom: 10px;
    }
    .step-setting-theme ul {
        white-space: nowrap;
        overflow-x: auto;
    }
}

.step-setting-theme ul li {
    list-style-type: none;
    display: inline-block;
}

.step-setting-theme ul li a {
    display: block;
    position: relative;
    padding: 0px 20px;
    color: #999;
}

.step-setting-theme ul li a::before {
    content: "";
    background: #ddd;
    position: absolute;
    width: 100%;
    height: 4px;
    top: 18px;
    left: 70px;
}

@media (max-width: 767px) {
    .step-setting-theme ul li a {
        padding: 0px 5px;
    }
    .step-setting-theme ul li a::before {
        left: 50px;
    }
}

.step-setting-theme ul li.active a span:nth-child(2) {
    color: var(--main-color);
    font-weight: 600;
}

.step-setting-theme ul li:last-child a::before {
    display: none;
}

.step-setting-theme ul li.active a::before {
    background: linear-gradient(90deg, var(--main-color), transparent);
}

.step-setting-theme ul li.active.active1 a::before {
    background: var(--main-color);
}

.step-setting-theme ul li a span:nth-child(1) {
    display: block;
    width: 40px;
    height: 40px;
    background: #ddd;
    color: #fff;
    border-radius: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    margin: 0px auto 5px;
    position: relative;
    z-index: 2;
}

.step-setting-theme ul li a span:nth-child(1) i {
    font-style: normal;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    background: #ddd;
    border-radius: 50px;
    z-index: 2;
    color: #fff;
}

.step-setting-theme ul li.active a span:nth-child(1),
.step-setting-theme ul li.active a span:nth-child(1) i {
    background: var(--main-color);
}

.step-setting-theme ul li a span:nth-child(1)::after {
    content: "";
    background: #ddd;
    position: absolute;
    top: 13px;
    width: 20px;
    height: 14px;
    left: 50%;
    margin-left: 3px;
    border-radius: 0px 10px 10px 0px;
}

.step-setting-theme ul li a span:nth-child(1)::before {
    content: "";
    background: #ddd;
    position: absolute;
    top: 13px;
    width: 20px;
    height: 14px;
    left: 0%;
    margin-left: -3px;
    border-radius: 10px 0px 0px 10px;
}

.step-setting-theme ul li:last-child span:nth-child(1)::after,
.step-setting-theme ul li:first-child span:nth-child(1)::before {
    display: none;
}

.step-setting-theme ul li.active span:nth-child(1)::after,
.step-setting-theme ul li.active span:nth-child(1)::before {
    background: var(--main-color);
}


/*setting-theme*/

.setting-theme {}

.setting-theme .slibar-left {
    /* float: left;
    width: 40%; */
}

@media (max-width: 767px) {
    .setting-theme .slibar-left {
        /* width: 30%; */
    }
}

.setting-theme .slibar-left ul {
    padding: 0px;
    margin: 0px;
    border: none;
}

.setting-theme .slibar-left ul li {
    list-style-type: none;
    text-align: center;
    cursor: pointer;
    margin: 20px 0px;
    float: none;
}

.setting-theme .slibar-left ul li a {
    background: none;
    border: none !important;
    margin-right: 0px;
}

.setting-theme .slibar-left ul li.active {
    color: var(--main-color);
}

.setting-theme .slibar-left ul li i {
    display: block;
    margin-bottom: 6px;
    font-size: 20px;
}

.setting-theme .slibar-right {
    /* float: left;
    width: 60%; */
    border-left: 1px solid #f1f1f1;
    padding-left: 15px;
}

@media (max-width: 767px) {
    .setting-theme .slibar-right {
        width: 70%;
    }
}

.setting-theme .slibar-right ul {
    padding: 0px;
    margin: 0px;
}

.setting-theme .slibar-right .title-setting-theme {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    position: relative;
}

.setting-theme .slibar-right .title-setting-theme.active {
    color: var(--main-color);
}

.setting-theme .slibar-right .title-setting-theme i {
    cursor: pointer;
    margin-top: 1px;
    font-size: 20px;
    position: absolute;
    right: 2px;
    top: 2px;
    width: 100%;
    text-align: right;
}

.wrap-setting-list {
    list-style-type: none;
    margin-bottom: 10px;
    position: relative;
}

.wrap-setting-list.small {
    font-size: 100%;
}

.wrap-setting-list .choose-size,
.custom-theme .choose-size {
    position: absolute;
    left: 100%;
    background: #fff;
    padding: 10px;
    box-shadow: 0px 0px 20px #ddd;
    top: 24px;
    margin-left: 10px;
    border-radius: 3px;
    display: none;
    z-index: 9;
    min-width: 240px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list .choose-size .item,
.custom-theme .choose-size .item {
    display: block !important;
    width: 100% !important;
    float: none !important;
}

.wrap-setting-list.active .choose-size,
.custom-theme.active .choose-size {
    display: block;
}

.wrap-setting-list .choose-size::before,
.custom-theme .choose-size::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 15px;
    left: -8px;
    top: 0px;
}

.wrap-setting-list .choose-size span,
.custom-theme .choose-size span {
    font-size: 14px;
    margin: 5px 0px 0px;
    display: block;
}

.wrap-setting-list .choose-size select,
.custom-theme .choose-size select {
    border: 1px solid #f1f1f1;
    border-radius: 3px;
    font-size: 13px;
    padding: 6px;
    outline: none !important;
}

.wrap-setting-list .choose-size .btn,
.theme-slide .theme-slide-infomation .infomation .btn,
.custom-theme .choose-size .btn {
    font-size: 13px;
    padding: 4px 10px;
    margin: 0px 0px 3px 0px;
}

.wrap-setting-list::after {
    content: "";
    display: block;
    clear: both;
}

.wrap-setting-list .row {
    margin: 0px;
    border: 1px solid #fff;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list .row>.item {
    padding: 0px !important;
    position: relative;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}


/* custom slide */

.wrap-setting-list.slide .item {
    display: none;
}

.wrap-setting-list.slide .item .content:last-child {
    display: none;
}

.wrap-setting-list.slide .item:nth-child(1) {
    display: block;
}

.wrap-setting-list.slide.big .item .content .iframe {
    padding: 60px 8px;
}

.wrap-setting-list.slide.portrait2 .item {
    float: left;
    width: calc(50% - 3px);
    margin: 0px;
    padding: 0px !important;
    display: block !important;
}

.wrap-setting-list.slide.portrait2 .item:nth-child(1),
.wrap-setting-list.slide.portrait2 .item:nth-child(2) {
    margin-bottom: 5px;
}

.wrap-setting-list.slide.portrait2 .item:nth-child(1),
.wrap-setting-list.slide.portrait2 .item:nth-child(3) {
    margin-right: 5px;
}

.wrap-setting-list.slide.portrait1 .item {
    width: 100%;
    margin: 0px;
    padding: 0px !important;
    display: none !important;
}

.wrap-setting-list.slide.portrait1 .item:nth-child(1) {
    margin-bottom: 5px;
}

.wrap-setting-list.slide.portrait1 .item:nth-child(1),
.wrap-setting-list.slide.portrait1 .item:nth-child(2) {
    display: block !important;
}

.wrap-setting-list.slide.landscap1 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.slide.landscap1 .item {
    display: inline-block;
    width: 70%;
}

.wrap-setting-list.slide.landscap2 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.slide.landscap2 .item {
    display: inline-block;
    width: 70%;
}

.wrap-setting-list.slide.landscap2 .item .content {
    display: block;
}

.wrap-setting-list.slide.landscap2 .item .content:first-child {
    margin-bottom: 5px;
}


/* end custom slide */

.wrap-setting-list .setting-list {
    position: relative;
}

.wrap-setting-list .setting-list .add {
    position: absolute;
    background: var(--main-color);
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    width: 50px;
    height: 26px;
    color: #fff;
    border-radius: 3px;
    z-index: 9;
    line-height: 26px;
    text-align: center;
    font-size: 11px;
    cursor: pointer;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.wrap-setting-list:hover .setting-list .add,
.wrap-setting-list.active .setting-list .add {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.wrap-setting-list .setting-list .add:hover {
    background: var(--main-color-hover);
}

.wrap-setting-list:hover .row,
.wrap-setting-list.active .row {
    border-color: var(--main-color);
}

.custom-theme {
    border: 1px solid rgba(0, 0, 0, 0);
    margin-bottom: 10px !important;
    position: relative;
}

.custom-theme .add {
    list-style-type: none;
    position: absolute;
    background: var(--main-color);
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    width: 50px;
    height: 26px;
    color: #fff;
    border-radius: 3px;
    z-index: 9;
    line-height: 26px;
    text-align: center;
    font-size: 11px;
    cursor: pointer;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.custom-theme .add a {
    color: #fff;
}

.custom-theme:hover .add,
.custom-theme.active .add {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.custom-theme .wrap-setting-list:hover .row,
.custom-theme .wrap-setting-list.active .row {
    border-color: rgba(0, 0, 0, 0);
}

.custom-theme:hover,
.custom-theme.active {
    border-color: var(--main-color);
}

.custom-theme.active .choose-size {
    display: block;
}

.custom-theme li:last-child {
    margin-bottom: 0px;
}

.wrap-setting-list .name-setting-theme {
    font-size: 12px;
    color: #666;
    margin-bottom: 6px;
    margin-top: 5px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list.active .name-setting-theme,
.wrap-setting-list:hover .name-setting-theme,
.custom-theme.active .wrap-setting-list .name-setting-theme,
.custom-theme:hover .wrap-setting-list .name-setting-theme {
    color: var(--main-color);
    padding-left: 5px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list .item .content {
    padding: 7px;
    color: #999;
    cursor: pointer;
    position: relative;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list .item .content::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #eee;
    left: 0;
    top: 0;
}

.wrap-setting-list:hover .row .item .content::before,
.wrap-setting-list.active .row .item .content::before,
.custom-theme:hover .wrap-setting-list .row .item .content::before,
.custom-theme.active .wrap-setting-list .row .item .content::before {
    background: var(--main-color);
    opacity: 0.1;
}

.wrap-setting-list .item .content .iframe {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #ddd;
    padding: 40px 8px;
    position: relative;
    z-index: 1;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list:hover .row .item .content .iframe,
.wrap-setting-list.active .row .item .content .iframe,
.custom-theme:hover .wrap-setting-list .row .item .content .iframe,
.custom-theme.active .wrap-setting-list .row .item .content .iframe {
    border-color: var(--main-color);
}

.wrap-setting-list .item .content .iframe i {
    font-size: 22px;
    display: block;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list:hover .row .item .content .iframe i,
.wrap-setting-list.active .row .item .content .iframe i,
.custom-theme:hover .wrap-setting-list .row .item .content .iframe i,
.custom-theme.active .wrap-setting-list .row .item .content .iframe i {
    color: var(--main-color);
}

.wrap-setting-list .item .content .iframe span {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 10px;
    margin: 0px 0px;
    background: #ddd;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list:hover .row .item .content .iframe span,
.wrap-setting-list.active .row .item .content .iframe span,
.custom-theme:hover .wrap-setting-list .row .item .content .iframe span,
.custom-theme.active .wrap-setting-list .row .item .content .iframe span {
    background: var(--main-color);
}

.wrap-setting-list.category .row>.item .wrap-content:last-child {
    display: none;
}


/*category-portrait*/

.wrap-setting-list.category-portrait .item .wrap-content .content .iframe {
    border: none;
}

.wrap-setting-list.category-portrait .item .wrap-content>span {
    width: 70%;
    display: block;
    height: 5px;
    margin: 5px 0px -1px;
    background: #eee;
    border-radius: 3px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.wrap-setting-list.category-portrait:hover .row .item .wrap-content>span,
.wrap-setting-list.category-portrait.active .row .item .wrap-content>span,
.custom-theme:hover .wrap-setting-list.category-portrait .row .item .wrap-content>span,
.custom-theme.active .wrap-setting-list.category-portrait .row .item .wrap-content>span {
    background: var(--main-color);
}

.wrap-setting-list.category-portrait .item .wrap-content>span:last-child {
    width: 40%;
}


/*portrait*/

.wrap-setting-list.product.portrait .row {}

.wrap-setting-list.product.portrait .row>.item {
    float: left;
    width: calc(50% - 3px);
    margin: 0px;
}

.wrap-setting-list.product.portrait .row>.item:nth-child(1),
.wrap-setting-list.product.portrait .row>.item:nth-child(2),
.wrap-setting-list.product.portrait .row>.item:nth-child(3),
.wrap-setting-list.product.portrait .row>.item:nth-child(4) {
    margin-bottom: 5px;
}

.wrap-setting-list.product.portrait .row>.item:nth-child(1),
.wrap-setting-list.product.portrait .row>.item:nth-child(3),
.wrap-setting-list.product.portrait .row>.item:nth-child(5) {
    margin-right: 5px;
}


/*end portrait*/

.wrap-setting-list.category .row .item .content .iframe>div>span {
    display: none;
}


/* portrait_big_2 */

.wrap-setting-list.category.portrait_big_2 .row>.item {
    float: left;
    width: calc(50% - 3px);
    margin: 0px;
}

.wrap-setting-list.category.portrait_big_2 .row>.item:nth-child(1),
.wrap-setting-list.category.portrait_big_2 .row>.item:nth-child(2) {
    margin-bottom: 5px;
}

.wrap-setting-list.category.portrait_big_2 .row>.item:nth-child(1),
.wrap-setting-list.category.portrait_big_2 .row>.item:nth-child(3) {
    margin-right: 5px;
}


/* end portrait_big_2 */


/* portrait_big_1 */

.wrap-setting-list.category.portrait_big_1 .row>.item {
    margin-bottom: 5px;
}

.wrap-setting-list.category.portrait_big_1 .row>.item .wrap-content .content .iframe {
    padding: 60px 8px;
}

.wrap-setting-list.category.portrait_big_1 .row>.item:last-child {
    margin-bottom: 0px;
}


/* end portrait_big_1 */


/* landscape_big_1 */

.wrap-setting-list.category.landscape_big_1 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.category.landscape_big_1 .row>.item {
    display: inline-block;
    width: 40%;
    margin: 0px;
}


/* end landscape_big_1 */


/* landscape_big_2 */

.wrap-setting-list.category.landscape_big_2 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.category.landscape_big_2 .row>.item {
    display: inline-block;
    width: 40%;
    margin: 0px;
}

.wrap-setting-list.category.landscape_big_2 .row>.item .wrap-content {
    display: block;
}

.wrap-setting-list.category.landscape_big_2 .row>.item .wrap-content:first-child {
    margin-bottom: 5px;
}


/* end landscape_big_2 */


/* landscape_small_1 */

.wrap-setting-list.category.landscape_small_1 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.category.landscape_small_1 .row>.item {
    display: inline-block;
    width: 38%;
    overflow: hidden;
    padding: 0px !important;
    margin-bottom: -5px;
}

.wrap-setting-list.category.landscape_small_1 .item .content {
    padding: 3px;
}

.wrap-setting-list.category.landscape_small_1 .item .content .iframe {
    display: block;
    padding: 5px 8px 5px 33px;
    border: none;
}

.wrap-setting-list.category.landscape_small_1 .item .content .iframe i {
    position: absolute;
    left: 3px;
    top: 3px;
    background: #f9f9f9;
    padding: 0px 0px 0px 1px;
    font-size: 13px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.wrap-setting-list.category.landscape_small_1 .item .content .iframe span {
    width: 100%;
    display: block !important;
    margin: 3px 0px;
}

.wrap-setting-list.category.landscape_small_1 .item .content .iframe span:last-child {
    width: 50%;
}

.wrap-setting-list.category.landscape_small_1 .item .wrap-content>span {
    display: none;
}


/* end landscape_small_1 */


/* landscape_small_2 */

.wrap-setting-list.category.landscape_small_2 .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.category.landscape_small_2 .row>.item {
    display: inline-block;
    width: 38%;
    overflow: hidden;
    padding: 0px !important;
    margin-bottom: -5px;
}

.wrap-setting-list.category.landscape_small_2 .item .content {
    padding: 3px;
}

.wrap-setting-list.category.landscape_small_2 .item .content .iframe {
    display: block;
    padding: 5px 8px 5px 33px;
    border: none;
}

.wrap-setting-list.category.landscape_small_2 .item .content .iframe i {
    position: absolute;
    left: 3px;
    top: 3px;
    background: #f9f9f9;
    padding: 0px 0px 0px 1px;
    font-size: 13px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.wrap-setting-list.category.landscape_small_2 .item .content .iframe span {
    width: 100%;
    display: block !important;
    margin: 3px 0px;
}

.wrap-setting-list.category.landscape_small_2 .item .content .iframe span:last-child {
    width: 50%;
}

.wrap-setting-list.category.landscape_small_2 .item .wrap-content>span {
    display: none;
}

.wrap-setting-list.category.landscape_small_2 .row>.item .wrap-content:last-child {
    display: block;
    margin-top: 5px;
}


/* end landscape_small_1 */


/*small*/

.wrap-setting-list.landscape .row.small,
.wrap-setting-list.portrait .row.small {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.landscape .row.small .item,
.wrap-setting-list.portrait .row.small .item {
    display: inline-block;
    width: 38%;
    overflow: hidden;
    padding: 0px !important;
    float: none;
}

.wrap-setting-list.portrait .row.small .item {
    float: left;
    width: calc(50% - 3px);
}

.wrap-setting-list.landscape .row.small .item .content,
.wrap-setting-list.portrait .row.small .item .content {
    padding: 3px;
}

.wrap-setting-list.landscape .row.small .item .content .iframe,
.wrap-setting-list.portrait .row.small .item .content .iframe {
    display: block;
    padding: 5px 8px 5px 33px;
    border: none;
}

.wrap-setting-list.landscape .row.small .item .content .iframe i,
.wrap-setting-list.portrait .row.small .item .content .iframe i {
    position: absolute;
    left: 3px;
    top: 3px;
    background: #f9f9f9;
    padding: 0px 0px 0px 1px;
    font-size: 13px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.wrap-setting-list.landscape .row.small .item .content .iframe span,
.wrap-setting-list.portrait .row.small .item .content .iframe span {
    width: 100%;
    display: block;
    margin: 3px 0px;
}

.wrap-setting-list.landscape .row.small .item .content .iframe span:last-child,
.wrap-setting-list.portrait .row.small .item .content .iframe span:last-child {
    width: 50%;
}


/*end small*/


/*landscape*/

.wrap-setting-list.landscape .row {
    white-space: nowrap;
    overflow: hidden;
}

.wrap-setting-list.landscape .row>.item {
    display: inline-block;
    width: 40%;
    margin: 0px;
}


/*end landscape*/


/*tpl_setting_theme*/

.theme-slide {
    position: relative;
    cursor: pointer;
    border: 2px solid rgba(0, 0, 0, 0);
}


/* .theme-slide::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: 2;
} */

.theme-slide::after {
    content: "";
    display: block;
    clear: both;
}

.theme-slide.active {
    border: 2px solid var(--main-color);
}

.tpl_setting_theme {
    background-color: #f6f6f6;
    -webkit-box-shadow: 0 0 8px 0 rgb(0 0 0 / 4%), 0 10px 14px 0 rgb(0 0 0 / 20%);
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 4%), 0 10px 14px 0 rgb(0 0 0 / 20%);
    -webkit-transform-origin: top center;
    min-height: 600px;
}

.theme-slide-2 {
    padding: 3px;
}

.item-theme-slide {
    position: relative;
    z-index: 3;
}

.item-theme-slide select {
    position: absolute;
    bottom: 39px;
    left: 2px;
    width: calc(100% - 4px);
    font-size: 13px;
    padding: 6px 4px;
    opacity: 0;
    visibility: hidden;
}

.item-theme-slide input {
    position: absolute;
    bottom: 2px;
    left: 2px;
    width: calc(100% - 4px);
    font-size: 13px;
    padding: 6px 8px;
    opacity: 0;
    visibility: hidden;
}

.item-theme-slide span {
    position: absolute;
    bottom: 12px;
    right: 10px;
    top: auto;
    opacity: 0;
    visibility: hidden;
}

.theme-slide.active select,
.theme-slide.active input,
.theme-slide.active span {
    opacity: 1;
    visibility: visible;
}

.theme-slide-2 .item-theme-slide {
    float: left;
    width: 50%;
    padding: 5px;
}

.theme-slide .theme-slide-infomation {}

.theme-slide .theme-slide-infomation .action {
    position: absolute;
    left: 100%;
    top: -2px;
    background: #fff;
    padding: 6px;
    box-shadow: 0px 0px 10px #ddd;
    display: none;
    margin-left: 10px;
    text-align: center;
    width: 40px;
    z-index: 9;
}

.theme-slide.active .theme-slide-infomation .action {
    display: block;
}

.theme-slide .theme-slide-infomation .infomation {
    position: absolute;
    left: 100%;
    top: -2px;
    background: #fff;
    padding: 16px;
    box-shadow: 0px 0px 10px #ddd;
    display: none;
    margin-left: 60px;
    width: 240px;
    z-index: 9;
}

.theme-slide .theme-slide-infomation .infomation .close {
    font-weight: 400;
    font-size: 18px;
    text-shadow: none;
    position: absolute;
    top: 1px;
    right: 2px;
    z-index: 9;
    padding: 12px;
    line-height: 0.6;
}

.theme-slide .theme-slide-infomation .infomation .close:hover {
    color: var(--main-color);
}

.theme-slide.active .theme-slide-infomation .infomation {
    display: block;
}

.theme-slide .theme-slide-infomation .infomation h3 {
    margin: 5px 0px 0px;
    font-size: 18px;
    color: var(--main-color);
    line-height: 1.3;
}

.theme-slide .theme-slide-infomation .infomation .header,
.wrap-setting-list .choose-size .header,
.custom-theme .choose-size .header {
    color: #333;
    height: auto;
    margin: 10px 0px 5px 0px;
}

.theme-slide .theme-slide-infomation .action i {
    position: relative;
    top: 0px;
    left: 0px;
    font-size: 16px;
    margin: 0px;
    color: #777;
    padding: 6px 8px;
}

.theme-slide .theme-slide-infomation .action i:hover {
    color: var(--main-color);
}

.theme-slide .theme-slide-infomation .action i.delete:hover {
    color: #f00;
}

.theme-slide .title {
    margin: 6px 0px 8px 5px;
    font-size: 16px;
    color: #333 !important;
}

.theme-slide .title span {
    font-size: 14px;
}

.theme-slide.landscape_small_2 {
    white-space: nowrap;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.theme-slide.landscape_small_2::-webkit-scrollbar {
    display: none;
}

.theme-slide.landscape_small_2 .wrap-item-theme-slide {
    padding: 0px 6px;
}

.theme-slide.landscape_small_2 .item-theme-slide {
    display: inline-block;
    white-space: normal;
}

.theme-slide.landscape_small_2 .item-theme-slide .iframe {
    background: #fff;
    border-radius: 3px;
    position: relative;
    padding: 8px 10px 8px 8px;
    margin: 4px 2px;
    display: flex;
    align-items: center;
}

.theme-slide.landscape_small_2 .item-theme-slide a {
    display: inline-block;
}

.theme-slide.landscape_small_2 .item-theme-slide a img {
    height: 24px;
}

.theme-slide.landscape_small_2 .item-theme-slide .name {
    height: auto;
    text-align: left;
    display: inline-block;
    margin: 0px 0px 0px 10px;
    font-weight: 600;
}

.theme-slide .name {
    text-align: center;
    font-size: 13px;
    line-height: 1.3;
    margin: 5px 0px 5px;
    height: 34px;
    overflow: hidden;
    white-space: normal;
}

.theme-slide .price {
    text-align: center;
    color: var(--main-color);
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 5px;
    white-space: normal;
}

.theme-slide-2.product .item-theme-slide {
    background: #fff;
    padding: 5px;
    margin: 4px 4px;
    width: calc(50% - 8px);
    border-radius: 3px;
}

.theme-slide-2.product.landscape {}

.theme-slide-2.product.landscape .item-theme-slide {
    display: inline-block;
    float: none;
}

.theme-slide-2.product.landscape .wrap-item-theme-slide {
    white-space: nowrap;
    overflow-x: auto;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
}

.theme-slide-2.product.landscape .wrap-item-theme-slide::-webkit-scrollbar {
    display: none;
}

.chosen-container-single .chosen-single {
    background: #fff !important;
    border: 1px solid #ebebeb !important;
    height: 34px !important;
    box-shadow: none !important;
}

.chosen-container-single .chosen-single span {
    margin-top: 4px !important;
}

.chosen-container .chosen-drop {
    border: 1px solid #ebebeb !important;
}

.chosen-container-single .chosen-drop {
    margin-top: -3px !important;
}

.chosen-container-single .chosen-search input[type="text"] {
    border: 1px solid #ebebeb !important;
    border-radius: 3px !important;
    margin: 5px 0 !important;
}


/*select mới*/

.form-post-real hr {
    margin: 20px 0px;
    border-color: #f1f1f1;
}

.title-form-first {
    color: var(--main-color);
    font-size: 17px;
    padding: 0;
    margin-top: 7px;
}

@media (max-width: 767px) {
    .form-post-real hr {
        margin: 10px 0px;
    }
    .title-form-first {
        margin-top: 0px;
        margin-bottom: 6px;
    }
    .box-text {
        padding: 0px;
    }
}

.title-form-first.sub {
    font-size: 13px;
    color: #777;
    white-space: nowrap;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: inherit !important;
}

.box-text-first input {
    height: 50px;
}

.form-post-real .label_name {
    margin-top: 0px;
    color: #666;
}

.form-post-real .box-text-check .label_name {
    font-size: 14px;
    margin-top: 8px;
    font-weight: 400;
    cursor: pointer;
}

.form-post-real .box-text-check .label_name.ace {
    margin-bottom: 0px;
    margin-top: 0px;
}

.box-text {
    position: relative;
}

.box-text .m {
    position: absolute;
    right: 14px;
    top: 6px;
    background: #fff;
}


/**/

.hidden-search {
    display: none !important;
}

li[data-parent].closed {
    display: none !important;
}

li[data-parent].open:not(.hidden-search) {
    display: block !important;
}

.vsb-menu {
    cursor: pointer;
    z-index: 1000;
    display: block;
    visibility: hidden;
    position: absolute;
    /*Don't change*/
    border: 1px solid #b2b2b2;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    border-radius: 4px;
    font-size: 11px;
    width: 100%;
}

.vsb-js-search-zone {
    /* position:absolute; */
    /*Don't change*/
    z-index: 1001;
    width: calc(100% - 14px);
    background-color: #fff;
    margin-bottom: 6px;
    margin-left: 6px;
}

.vsb-js-search-zone input {
    border: 1px solid #ddd;
    margin-left: 2px;
    width: 100%;
    border-radius: 3px;
    height: 28px !important;
    padding: 0px 10px;
    outline: none;
    font-size: 13px;
}

.vsb-main {
    position: relative;
    /*Don't change*/
    vertical-align: middle;
    text-align: left;
}

.vsb-menu li:hover {
    background: linear-gradient(#f5f5f5, #e8e8e8);
}

.vsb-menu ul {
    user-select: none;
    list-style: none;
    white-space: nowrap;
    margin: 0px;
    padding-left: 0px;
    color: #333;
    cursor: pointer;
    overflow-y: auto;
    padding-top: 8px;
    margin-bottom: 2px;
}

li.disabled {
    cursor: not-allowed;
    opacity: 0.3;
    background-color: #999;
}

li.overflow {
    cursor: not-allowed;
    opacity: 0.3;
    background-color: #999;
}

li.short {
    overflow: hidden;
    text-overflow: ellipsis;
}

.vsb-main button {
    min-width: 120px;
    border-radius: 0;
    width: 100%;
    text-align: left;
    z-index: 1;
    color: #333;
    background: #fff;
    border: 1px solid #ebebeb;
    line-height: 20px;
    font-size: 14px;
    padding: 6px 12px;
    border-radius: 3px;
    position: relative;
    min-height: 34px;
}

.button-w100 .vsb-main button {
    min-width: inherit !important;
}

.vsb-main button.disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

.vsb-main .title {
    user-select: none;
    color: #666;
    text-transform: none;
    font-size: 13px;
    margin: 0px;
    padding: 0px;
    border: none;
    display: block;
    height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 8px;
    position: relative;
    top: -1px;
}

.vsb-main li:hover {
    background: linear-gradient(#f5f5f5, #e8e8e8);
}

.vsb-main ul {
    white-space: nowrap;
    width: 100%;
    max-width: inherit !important;
}

.vsb-menu li {
    font-size: 13px;
    background-color: #fff;
    min-height: 1.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 4px 8px 4px 22px;
    border-top: 1px solid #f1f1f1;
}

.vsb-menu li.grouped-option b {
    display: inline-block;
    font-size: 13px;
    transform: translate(-18px);
    margin-left: 15px;
    position: relative;
    top: 1px;
    font-weight: 700;
}

.vsb-menu li.grouped-option.open span {
    display: inline-block;
    font-size: inherit;
    margin-top: -2px;
    height: 8px;
    width: 8px;
    transform: translate(-38px) rotate(45deg);
    border-bottom: 3px solid #333;
    border-right: 3px solid #333;
    border-radius: 2px;
    position: absolute;
    left: 48px;
    top: 10px;
}

.vsb-menu li.grouped-option.closed span {
    display: inline-block;
    font-size: inherit;
    height: 8px;
    width: 8px;
    transform: translate(-38px) rotate(-45deg);
    border-bottom: 3px solid #333;
    border-right: 3px solid #333;
    border-radius: 2px;
    position: absolute;
    left: 48px;
    top: 10px;
}

.vsb-menu li.grouped-option i {
    display: inline-block;
    font-size: inherit;
    margin-left: 18px;
    margin-right: 2px;
    height: 16px;
    width: 16px;
    border: 1px solid;
    border-radius: 3px;
    margin-top: 0px;
    color: #777;
    position: absolute;
    left: 8px;
    top: 7px;
}

.vsb-menu li.grouped-option.checked i {
    background: #56ba47;
    border-color: #56ba47;
}

.vsb-menu li.grouped-option.checked i::after {
    content: "";
    color: #333;
    margin-left: 0px;
    display: inline-block;
    transform: rotate(45deg);
    height: 8px;
    width: 5px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    position: absolute;
    top: 2px;
    left: 4px;
}

.vsb-menu :not(.multi) li.active {
    margin-left: 0px;
    color: #7ace4c;
    background: #f1f1f1;
}

.vsb-menu :not(.multi) li.active::before {
    content: "";
    display: inline-block;
    font-size: inherit;
    transform: rotate(45deg);
    height: 10px;
    width: 5px;
    border-bottom: 3px solid #7ace4c;
    border-right: 3px solid #7ace4c;
    border-radius: 2px;
    margin-right: 4px;
    margin-left: -12px;
}

.vsb-menu .multi li {
    font-size: 13px;
    background-color: #fff;
    min-height: 1.4em;
    padding: 6px 8px 6px 32px;
    color: #555;
    border-bottom: 1px solid #f1f1f1;
    white-space: normal;
    line-height: 1.3;
    position: relative;
}

.vsb-menu .multi li:nth-child(2n) {
    background: #fafafa;
}

.vsb-menu .multi li:last-child {
    border: none;
}

.vsb-menu .multi li.grouped-option {
    padding-left: 52px;
}

.vsb-menu .multi li.grouped-option:hover {
    text-decoration: underline;
}

.vsb-menu .multi li:not(.grouped-option)::before {
    content: "";
    display: block;
    font-size: inherit;
    font-weight: bold;
    border: 1px solid;
    border-radius: 3px;
    padding: 7px;
    color: #777;
    position: absolute;
    top: 6px;
    left: 9px;
}

.vsb-menu .multi li:not(.grouped-option).active::before {
    color: #56ba47;
    background: #56ba47;
}

.vsb-menu .multi li:not(.grouped-option).active::after {
    content: "";
    font-size: inherit;
    color: #fff;
    display: inline-block;
    transform: rotate(45deg);
    height: 8px;
    width: 5px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    position: absolute;
    top: 9px;
    left: 14px;
}

.vsb-menu-position .vsb-menu .vsb-js-search-zone {
    width: 90%;
    position: absolute;
}

.vsb-menu-position .vsb-menu ul.multi .vsb-js-search-zone+li:nth-child(2),
.vsb-menu-position .vsb-menu ul .vsb-js-search-zone+li:nth-child(2) {
    margin-top: 30px;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    top: 6px;
    color: #666;
}

li[data-parent] {
    /* padding-left: 50px !important; */
}


/**/

.members-holder {
    background: #f9f9f9;
    padding: 5px 0px;
}

.members-holder .row {}

.members-holder .row .item {}

.members-holder .row .item .iframe {
    border: 1px solid #f1f1f1;
    padding: 15px 20px;
    text-align: center;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0px 0px 10px #ddd;
    position: relative;
    margin: 6px 0px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.members-holder .row .item .iframe:hover {
    box-shadow: 0px 0px 30px #ddd;
    -webkit-transform: scale(1.02);
    -moz-transform: scale(1.02);
    -o-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
}

.members-holder .row .item .iframe::after {
    content: "";
    clear: both;
    display: block;
}

.members-holder .row .item .iframe .wrap-holder {
    position: absolute;
    left: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

.members-holder .row .item .iframe .holder {
    background-color: var(--main-color);
    font-size: 11px;
    color: #ffffff;
    text-align: center;
    line-height: 20px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    width: 100px;
    display: block;
    -webkit-box-shadow: 0 0 8px 0 rgb(0 0 0 / 6%), 0 1px 0 0 rgb(0 0 0 / 2%);
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 6%), 0 1px 0 0 rgb(0 0 0 / 2%);
    position: absolute;
    top: 19px;
    left: -21px;
    font-weight: 600;
}

.members-holder .row .item .iframe .holder:before {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    z-index: -1;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid var(--main-color-hover-sub);
    border-top: 3px solid var(--main-color-hover-sub);
}

.members-holder .row .item .iframe .holder:after {
    content: "";
    position: absolute;
    right: 0;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-right: 3px solid var(--main-color-hover-sub);
    border-top: 3px solid var(--main-color-hover-sub);
}

.members-holder .row .item:nth-child(5n+1) .iframe .holder {
    background: #ffb500;
}

.members-holder .row .item:nth-child(5n+1) .iframe .holder:before {
    border-left: 3px solid #e1a002;
    border-top: 3px solid #e1a002;
}

.members-holder .row .item:nth-child(5n+1) .iframe .holder:after {
    border-right: 3px solid #e1a002;
    border-top: 3px solid #e1a002;
}

.members-holder .row .item:nth-child(5n+2) .iframe .holder {
    background: #e66430;
}

.members-holder .row .item:nth-child(5n+2) .iframe .holder:before {
    border-left: 3px solid #b7542c;
    border-top: 3px solid #b7542c;
}

.members-holder .row .item:nth-child(5n+2) .iframe .holder:after {
    border-right: 3px solid #b7542c;
    border-top: 3px solid #b7542c;
}

.members-holder .row .item:nth-child(5n+3) .iframe .holder {
    background: #01b075;
}

.members-holder .row .item:nth-child(5n+3) .iframe .holder:before {
    border-left: 3px solid #059363;
    border-top: 3px solid #059363;
}

.members-holder .row .item:nth-child(5n+3) .iframe .holder:after {
    border-right: 3px solid #059363;
    border-top: 3px solid #059363;
}

.members-holder .row .item:nth-child(5n+4) .iframe .holder {
    background: #634fd2;
}

.members-holder .row .item:nth-child(5n+4) .iframe .holder:before {
    border-left: 3px solid #4f3fab;
    border-top: 3px solid #4f3fab;
}

.members-holder .row .item:nth-child(5n+4) .iframe .holder:after {
    border-right: 3px solid #4f3fab;
    border-top: 3px solid #4f3fab;
}

.members-holder .row .item:nth-child(5n+5) .iframe .holder {
    background: #e1306c;
}

.members-holder .row .item:nth-child(5n+5) .iframe .holder:before {
    border-left: 3px solid #c92a60;
    border-top: 3px solid #c92a60;
}

.members-holder .row .item:nth-child(5n+5) .iframe .holder:after {
    border-right: 3px solid #c92a60;
    border-top: 3px solid #c92a60;
}

.members-holder .row .item .iframe .img {
    width: 110px;
    border-radius: 50%;
    margin: 20px auto 20px;
    box-shadow: 0px 0px 10px #ddd;
    position: relative;
}

.members-holder .row .item .iframe .img span {
    width: 100%;
    display: block;
    height: 0px;
    padding-bottom: 100%;
    border-radius: 50%;
}

.members-holder .row .item .iframe .img img {
    border-radius: 50%;
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0px;
    top: 0px;
}

.members-holder .row .item .iframe .info>div {
    margin: 3px 0px;
    color: #7e8299;
    position: relative;
}

.members-holder .row .item .iframe .info .code {
    font-size: 12px;
    color: #999;
}

.members-holder .row .item .iframe .info .name {
    font-size: 15px;
    font-weight: 600;
    color: #555;
    text-transform: uppercase;
    margin: 8px 0px 3px;
}

.members-holder .row .item .iframe .info .phone {
    color: #4c95dd;
}

.members-holder .row .item .iframe .info .address {
    font-size: 13px;
    height: 38px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.members-holder .row .item .iframe .info .mail {}

.members-holder .row .item .iframe .info .point {
    margin-top: 10px;
    text-align: left;
}

.members-holder .row .item .iframe .info .point span {
    color: #fff;
    border-radius: 3px;
    padding: 1px 7px;
    font-size: 12px;
    margin: 1px;
    display: block;
}

.members-holder .row .item .iframe .info .point span b {}

.members-holder .row .item .iframe .info .point span:nth-child(6n+1) {
    color: #4c95dd;
}

.skillbar-box {
    position: relative;
}

.skillbar-box .custom-skillbar-title {
    font-size: 11px;
    text-align: left;
    margin-top: 10px;
    line-height: 1.2;
}

.skillbar-box .skill-bar-percent {
    position: absolute;
    right: 0px;
    bottom: -5px;
    font-size: 12px;
    color: #4c95dd;
}

.skillbar-box .skillbar-bg {
    position: relative;
    display: block;
    width: calc(100% - 30px);
    height: 6px;
    overflow: hidden;
    background: #eee;
    border-radius: 12px;
    margin-top: 5px;
}

.skillbar-box .custom-skillbar {
    background: #4c95dd;
    height: 6px;
    width: 0px;
}

.members-holder .row .item .iframe .info .point span:nth-child(6n+2),
.skillbar-box:nth-child(6n+2) .skill-bar-percent {
    color: #e66430;
}

.skillbar-box:nth-child(6n+2) .custom-skillbar {
    background: #e66430;
}

.members-holder .row .item .iframe .info .point span:nth-child(6n+3),
.skillbar-box:nth-child(6n+3) .skill-bar-percent {
    color: #01b075;
}

.skillbar-box:nth-child(6n+3) .custom-skillbar {
    background: #01b075;
}

.members-holder .row .item .iframe .info .point span:nth-child(6n+4),
.skillbar-box:nth-child(6n+4) .skill-bar-percent {
    color: #634fd2;
}

.skillbar-box:nth-child(6n+4) .custom-skillbar {
    background: #634fd2;
}

.members-holder .row .item .iframe .info .point span:nth-child(6n+5),
.skillbar-box:nth-child(6n+5) .skill-bar-percent {
    color: #e1306c;
}

.skillbar-box:nth-child(6n+5) .custom-skillbar {
    background: #e1306c;
}

.members-holder .row .item .iframe .info .point span:nth-child(6n+6),
.skillbar-box:nth-child(6n+6) .skill-bar-percent {
    color: #ffb500;
}

.skillbar-box:nth-child(6n+6) .custom-skillbar {
    background: #ffb500;
}

.edit-sale-price i.edit:hover {
    color: green;
}


/**/

.wrap-list-permission-menu:nth-child(2n+1) {
    clear: both;
}

.list-permission-menu {
    padding: 25px 0px 0px 0px;
    margin: 0px;
}

.list-permission-menu li {
    list-style-type: none;
}

.list-permission-menu li label {
    cursor: pointer;
}

.wrap-list-permission-menu>.list-permission-menu>li>label>b {
    color: var(--main-color);
}

.list-permission-menu li>.list-permission-menu {
    padding: 6px 10px 6px 28px;
}

.list-permission-menu li>.list-permission-menu:nth-child(2) {
    margin-top: 6px;
}

.chosen-container .chosen-drop {
    border: 1px solid #ebebeb !important;
}

.chosen-container-single .chosen-drop {
    margin-top: -3px !important;
}

.chosen-container-single .chosen-search input[type="text"] {
    border: 1px solid #ebebeb !important;
    border-radius: 3px !important;
    margin: 5px 0 !important;
}


/*select mới*/

.form-post-real hr {
    margin: 20px 0px;
    border-color: #f1f1f1;
}

.title-form-first {
    color: var(--main-color);
    font-size: 17px;
    padding: 0;
    margin-top: 7px;
}

@media (max-width: 767px) {
    .form-post-real hr {
        margin: 10px 0px;
    }
    .title-form-first {
        margin-top: 0px;
        margin-bottom: 6px;
    }
    .box-text {
        padding: 0px;
    }
}

.title-form-first.sub {
    font-size: 13px;
    color: #777;
    white-space: nowrap;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: inherit !important;
}

.box-text-first input {
    height: 50px;
}

.form-post-real .label_name {
    margin-top: 0px;
    color: #666;
}

.form-post-real .box-text-check .label_name {
    font-size: 14px;
    margin-top: 8px;
    font-weight: 400;
    cursor: pointer;
}

.form-post-real .box-text-check .label_name.ace {
    margin-bottom: 0px;
    margin-top: 0px;
}

.box-text {
    position: relative;
}

.box-text .m {
    position: absolute;
    right: 14px;
    top: 6px;
    background: #fff;
}


/**/

.hidden-search {
    display: none !important;
}

li[data-parent].closed {
    display: none !important;
}

li[data-parent].open:not(.hidden-search) {
    display: block !important;
}

.vsb-menu {
    cursor: pointer;
    z-index: 1000;
    display: block;
    visibility: hidden;
    position: absolute;
    /*Don't change*/
    border: 1px solid #b2b2b2;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    border-radius: 4px;
    font-size: 11px;
    width: 100%;
}

.vsb-js-search-zone {
    /* position:absolute; */
    /*Don't change*/
    z-index: 1001;
    width: calc(100% - 14px);
    background-color: #fff;
    margin-bottom: 6px;
    margin-left: 6px;
}

.vsb-js-search-zone input {
    border: 1px solid #ddd;
    margin-left: 2px;
    width: 100%;
    border-radius: 3px;
    height: 28px !important;
    padding: 0px 10px;
    outline: none;
    font-size: 13px;
}

.vsb-main {
    position: relative;
    /*Don't change*/
    vertical-align: middle;
    text-align: left;
}

.vsb-menu li:hover {
    background: linear-gradient(#f5f5f5, #e8e8e8);
}

.vsb-menu ul {
    user-select: none;
    list-style: none;
    white-space: nowrap;
    margin: 0px;
    padding-left: 0px;
    color: #333;
    cursor: pointer;
    overflow-y: auto;
    padding-top: 8px;
    margin-bottom: 2px;
}

li.disabled {
    cursor: not-allowed;
    opacity: 0.3;
    background-color: #999;
}

li.overflow {
    cursor: not-allowed;
    opacity: 0.3;
    background-color: #999;
}

li.short {
    overflow: hidden;
    text-overflow: ellipsis;
}

.edit-sale-price i.edit:hover {
    color: green;
}

.confirm.inline-block {
    margin: 5px;
}

a#supplier-logo {
    margin-left: 12%;
}

a#supplier-logo img {
    height: 250px;
}

.colorDisplay {
    width: 40px;
    height: 33px;
    display: inline-block;
    position: absolute;
    border-radius: 5%;
}

#chooseColor {
    color: white;
}

span.show-color {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 5%;
    position: absolute;
}

.noupdate_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}


/*theme_store*/

.theme_store {}

.theme_store .cate {
    padding: 6px 5px 8px;
}

.theme_store .cate>div {}

.theme_store .cate>div a {
    color: #444;
    display: inline-block;
    margin: 0px 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.theme_store .cate>div a:hover,
.theme_store .cate>div a.active {
    color: var(--main-color);
}

.theme_store .cate>div a.active {
    font-weight: 600;
}

.theme_store .cate>div a i {
    font-size: 7px;
    margin-right: 3px;
    position: relative;
    top: -2px;
}

.theme_store .title1 {
    font-size: 15px;
    margin: 18px 0px 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.theme_store .title1 span {
    color: var(--main-color);
}

.category_list {
    padding: 0px 5px 10px;
}

.category_list>div {}

.category_list>div a {
    color: #444;
    font-size: 14px;
    display: block;
    margin: 3px 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.category_list>div a:hover {
    color: var(--main-color);
}

.category_list>div a i {
    font-size: 9px;
    margin-right: 3px;
    position: relative;
    top: -2px;
}

.theme_store .content {}

.theme_store .content .row {}

@media(min-width: 992px) {
    .theme_store .content .item {
        /* width: 20%; */
    }
}

.theme_store .content .item .iframe {
    position: relative;
    -webkit-box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%);
    -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 10%);
    -o-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 10%);
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%);
    border-radius: 3px;
    margin: 11px 5px;
    -webkit-transition: all 250ms cubic-bezier(.02, .01, .47, 1);
    -moz-transition: all 250ms cubic-bezier(.02, .01, .47, 1);
    transition: all 250ms cubic-bezier(.02, .01, .47, 1);
}

.theme_store .content .item .iframe>span {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 9;
    background: #56BA47;
    padding: 1px 10px;
    color: #fff;
    font-size: 12px;
}

@media(max-width: 767px) {
    .theme_store .content .item .iframe {
        margin: 7px 2px;
    }
}

.theme_store .content .item .iframe:hover {
    transform: translate(0, -10px);
    -webkit-box-shadow: 0 0 8px 0 rgb(0 0 0 / 40%);
    -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 40%);
    -o-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 40%);
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 40%);
    box-shadow: 0px 0px 10px #56ba47;
}

.theme_store .content .item .iframe.active {
    box-shadow: 0px 0px 10px #56ba47;
}

.theme_store .content .item .iframe .img {}

.theme_store .content .item .iframe .img img {}

.theme_store .content .item .iframe h3 {
    text-align: center;
    margin: 0px;
    padding: 15px 0px;
    font-size: 16px;
    font-weight: 600;
}

.theme_store .content .item .iframe h3 a {
    color: #444;
}

.theme_store .content .item .iframe h3 a:hover {
    color: var(--main-color);
}

.theme_store .content .item .iframe .view {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background: rgb(2 2 2 / 80%);
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all all 0.2s ease ease-out;
    -moz-transition: all all 0.2s ease ease-out;
    -o-transition: all all 0.2s ease ease-out;
    transition: all all 0.2s ease ease-out;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

/* .theme_store .content .item .iframe:hover .view, */
.theme_store .content .item .iframe.active .view {
    opacity: 1;
    visibility: visible;
}

.theme_store .content .item .iframe .view a {
    display: block;
    width: calc(50% - 8px);
    margin: 0px 4px;
    cursor: pointer;
    white-space: nowrap;
    float: left;
    text-align: center;
}

.theme_store .content .item .iframe .restore_custom {
    color: #fff;
    margin-top: 8px;
    display: none;
    cursor: pointer;
}

.theme_store .content .item .iframe.active .restore_custom {
    display: block;
}

.theme_store .content .item .iframe .view a i {
    margin-right: 5px;
}

@media(max-width: 767px) {
    .theme_store .content .item .iframe .view a i {
        margin-right: 2px;
    }
}

.theme_store .content .item .iframe .view .color {
    margin-bottom: 10px;
    margin-left: -8px;
    margin-right: -8px;
    padding: 8px 8px;
}

.theme_store.theme_store_card .content .item .iframe .view .color {
    margin-bottom: 6px;
    padding: 6px;
}

.theme_store .content .item .iframe .view .color.i-error {
    box-shadow: 0px 0px 10px #f00;
    border: 1px solid #f00;
    margin-bottom: 20px;
}

.theme_store .content .item .iframe .view .color:after {
    content: '';
    display: block;
    clear: both;
}

.theme_store .content .item .iframe .view h4 {
    color: #fff;
    margin: 16px 0 12px 0px;
    text-transform: uppercase;
    font-weight: 600;
}

.theme_store .content .item .iframe .view .color>label {
    float: left;
    margin: 0px 3px 8px;
    width: calc(20% - 6px);
}

.theme_store .content .item .iframe .view .custom_color {
    margin-top: -10px;
    margin-bottom: 10px;
}

.theme_store .content .item .iframe .view .custom_color:after {
    content: '';
    display: block;
    clear: both;
}

.theme_store .content .item .iframe .view .custom_color p {
    color: #fff;
    display: block;
    margin: 0 0 8px 0;
    text-transform: uppercase;
    font-weight: 600;
}

.theme_store .content .item .iframe .view .custom_color>div {
    color: #fff;
    float: left;
    width: 50%;
}

.theme_store .content .item .iframe .view .custom_color>div>i {
    font-style: initial;
    display: block;
    margin: 0 0 4px 0;
}

.theme_store .content .item .iframe .view .custom_color>div>span {
    position: relative;
    width: 44px;
    display: block;
    margin: 0px auto;
}

.theme_store .content .item .iframe .view .custom_color>div>span>i {
    position: absolute;
    z-index: 9;
    background: #fff;
    color: #f00;
    width: 16px;
    height: 16px;
    border-radius: 50px;
    font-size: 9px;
    text-align: center;
    line-height: 15px;
    padding-left: 1px;
    top: -2px;
    right: 2px;
    cursor: pointer;
}

.theme_store .content .item .iframe .view .custom_color>div>span>span {
    display: block;
    width: 36px;
    height: 36px;
    background: #fff;
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    border: 3px solid #fff;
    margin: 0px auto;
}

.theme_store .content .item .iframe .view .custom_color>div>span input {
    -webkit-appearance: none;
    border: none;
    width: 38px;
    height: 38px;
    border-radius: 50px;
    position: absolute;
    left: -4px;
    top: -4px;
    cursor: pointer;
}

.theme_store .content .item .iframe .view .custom_color>div>span input[type="color"] {
    -webkit-appearance: none;
    border: none;
    width: 38px;
    height: 38px;
    border-radius: 50px;
    position: absolute;
    left: -4px;
    top: -4px;
    cursor: pointer;
}

.theme_store.theme_store_card .content .item .iframe .view .custom_color p {
    margin-bottom: 5px;
}

.theme_store.theme_store_card .content .item .iframe .view .custom_color>div>i {
    font-size: 13px;
}

.theme_store.theme_store_card .content .item .iframe .view .custom_color>div>span {
    width: 36px;
}

.theme_store.theme_store_card .content .item .iframe .view .custom_color>div>span>span {
    width: 32px;
    height: 32px;
    border: 2px solid #fff;
}

.theme_store.theme_store_card .content .item .iframe .view .custom_color>div>span input[type="color"] {
    width: 34px;
    height: 34px
}

.theme_store.theme_store_card .content .item .iframe .view a {
    padding: 3px 10px 4px;
    font-size: 13px;
}

.theme_store .content .item .iframe .view .custom_color>div>span input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
}

.theme_store .content .item .iframe .view .custom_color>div>span input[type="color"]::-webkit-color-swatch {
    border: none;
}

@media(max-width: 767px) {
    .theme_store .content .item .iframe .view {
        padding: 8px 6px;
    }
    .theme_store .content .item .iframe .view h4 {
        margin: 12px 0 10px 0px;
    }
    .theme_store .content .item .iframe .view .color>label {
        width: calc(25% - 4px);
        margin: 0px 2px 8px;
    }
}

.theme_store .content .item .iframe .view .color .lbl span {
    width: 35px;
    height: 35px;
    display: inline-block;
    border-radius: 50%;
    margin-bottom: -6px;
    cursor: pointer;
    border: 3px solid #fff;
    position: relative;
}

.theme_store.theme_store_card .content .item .iframe .view .color .lbl span {
    border: 2px solid #fff;
    width: 30px;
    height: 30px;
}

@media(max-width: 767px) {
    .theme_store.theme_store_card .content .item .iframe .view .color .lbl span {
        width: 20px;
        height: 20px;
    }
}

.theme_store .content .item .iframe .view .color input[type=radio].ace:checked+.lbl span:after {
    content: "\f00c";
    font-family: "FontAwesome";
    background: #56ba47;
    color: #fff;
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50px;
    font-size: 9px;
    line-height: 17px;
    top: -6px;
    right: -7px;
    padding-left: 1px;
}

.theme_store .content .item .iframe .view .color .lbl span:before {
    content: '';
    position: absolute;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border: 3px solid hsl(0deg 0% 100% / 0%);
    left: -5px;
    top: -5px;
    border-radius: 50px;
}

.theme_store.theme_store_card .content .item .iframe .view .color .lbl span:before {
    border: 2px solid hsl(0deg 0% 100% / 0%);
    width: calc(100% + 8px);
    height: calc(100% + 8px);
    left: -4px;
    top: -4px;
}

.theme_store .content .item .iframe .view .color input[type=radio].ace:checked+.lbl span:before {
    border-color: #56ba47;
}

.theme_store .content .item .iframe .view .color input[type=radio].ace+.lbl::before {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
    visibility: hidden;
}

.theme_store .content .item .iframe .action {
    /* position: absolute; */
    bottom: 0;
    width: 100%;
}

.theme_store .content .item .iframe .action:after {
    content: '';
    clear: both;
    display: block;
}

.theme_store .content .item .iframe .action .btn {
    float: left;
    width: 50%;
    padding: 3px 0px;
    border-radius: 0px;
    font-size: 12px;
}

.theme_store .content .item .iframe .action .btn i {
    margin-right: 4px;
}

.theme_store .content .item .iframe .action .btn:first-child i {
    position: relative;
    top: 0px;
}


/**/

.item-option {
    border: 1px dashed #ddd;
    border-radius: 4px;
    margin: 20px 4px;
    padding: 0px 10px 10px 10px;
    position: relative;
}

.item-option .remove_filed {
    position: absolute;
    top: -12px;
    right: -8px;
    background: #f00;
    color: #fff;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    text-align: center;
    line-height: 17px;
    cursor: pointer;
}

.item-option .span_i {
    background: #f1f1f1;
    line-height: 26px;
    text-transform: uppercase;
}

.hover-question {
    position: relative;
}

.hover-question img {
    display: none;
    position: absolute;
    background: #fff;
    z-index: 2;
    box-shadow: 0px 0px 10px #ddd;
    padding: 0px;
    height: 100px;
    max-width: inherit;
    left: 0;
    border-radius: 3px;
}

.hover-question:hover img {
    display: block;
}

.mess_change_theme {
    float: left;
    width: 100%;
}

.mess_change_theme span {
    color: #fff;
    margin-bottom: 0px;
    font-size: 14px;
    margin-top: 0px;
    display: block;
    width: 100%;
}


/**/

.page-setting-home {}

.page-setting-home .row {}

.page-setting-home .row>div {}

.page-setting-home .item {
    border: 1px solid #f1f1f1;
    padding: 8px 15px;
    border-radius: 3px;
    margin: 0px 0px;
    min-height: 445px;
    position: relative;
}

.page-setting-home .item>h2 {
    margin: -8px -15px 15px -15px;
    font-size: 15px;
    text-align: center;
    background: var(--main-color);
    color: #fff;
    padding: 12px 0px;
    border-radius: 4px 4px 0px 0px;
}

@media(max-width: 767px) {
    .page-setting-home .item {
        min-height: inherit;
        margin-bottom: 10px;
    }
}

.page-setting-home .item ul {
    padding: 0;
    margin: 0;
}

.page-setting-home .item ul li {
    list-style-type: none;
    padding: 10px 140px 10px 10px;
    border: 1px solid #f1f1f1;
    margin: 10px 0px;
    position: relative;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #54667a;
    font-size: 13px;
}

.page-setting-home .left .item ul li form>p {
    display: inline-block;
    padding: 0px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    top: 1px;
}

.page-setting-home .right .item ul li {
    padding: 10px 130px 10px 10px;
}

.page-setting-home .right .item ul li:last-child input[name=click_change_up_show_home] {
    right: 75px;
}

.page-setting-home .item ul li.noquantity {
    padding: 10px 80px 10px 10px;
}

.page-setting-home .right .item ul li .form>span {
    display: inline-block;
    background: #84929f;
    border-radius: 10px;
    padding: 1px 10px;
    font-size: 12px;
    color: #fff;
    font-weight: 600;
    margin-right: 5px;
}

.page-setting-home .right .item ul li .form>span.quantity {
    position: absolute;
    right: 73px;
    font-weight: 400;
    top: 0;
    bottom: 0;
    height: 20px;
    margin: auto;
    line-height: 19px;
    width: 54px;
}

.page-setting-home .right .item ul li .form span.load_sub_cate {
    padding: 0;
    background: none;
    cursor: pointer;
    margin: 0 8px 0 4px;
    font-size: 14px;
    color: #555;
}

.page-setting-home .right .item ul li .form>p {
    display: inline-block;
    max-width: calc(100% - 49px);
    padding: 0px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    top: 1px;
}

.page-setting-home .item ul li .form {
    padding: 0px;
    display: flex;
    align-items: start;
}

.page-setting-home .item ul li select[name="quantity"] {
    position: absolute;
    right: 92px;
    border: 1px solid #ddd;
    width: 45px;
    height: 28px;
    padding: 3px 4px;
    outline: none;
    border-radius: 3px;
    top: 6px;
    color: #555;
    font-size: 13px;
    background: #f1f1f1;
}

.page-setting-home .item ul li input,
.page-setting-home .item ul li .click {
    position: absolute;
    right: 73px;
    border: 1px solid #ddd;
    width: 93px;
    padding: 3px 8px;
    outline: none;
    border-radius: 3px;
    top: 6px;
    color: #555;
    font-size: 13px;
    z-index: 9;
    background: #f1f1f1;
}

.page-setting-home .right .item ul li:first-child .click.up {
    display: none;
}

.page-setting-home .right .item ul li:last-child .click.down {
    display: none;
}

.page-setting-home .right .item ul li:last-child .click.up {
    right: 73px;
}

.page-setting-home .item ul li .click {
    width: auto;
    display: none;
    width: 55px;
    padding: 4px 0px;
    font-size: 12px;
}

.page-setting-home .item ul li:hover .click {
    display: block;
}

.page-setting-home .item ul li .click.up {
    right: 133px;
}

.page-setting-home .item ul li select[name='quantity-change'] {
    display: none;
    right: 194px;
    width: 45px;
    position: absolute;
    border: 1px solid #ddd;
    height: 27px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius: 4px;
    padding: 0px 3px;
    background: #f1f1f1;
    outline: none;
    text-align: center;
    z-index: 9;
}

.page-setting-home .item ul li:first-child select[name='quantity-change'],
.page-setting-home .item ul li:last-child select[name='quantity-change'] {
    right: 133px;
}

.page-setting-home .item ul li:hover input[name='quantity-change'],
.page-setting-home .item ul li:hover select[name='quantity-change'] {
    display: block;
}

.page-setting-home .item ul li select[name='owl-type'] {
    display: none;
    right: 245px;
    width: auto;
    position: absolute;
    border: 1px solid #ddd;
    height: 27px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius: 4px;
    padding: 0px 3px;
    background: #f1f1f1;
    outline: none;
    text-align: center;
    z-index: 9;
}

.page-setting-home .item ul li:hover select[name='owl-type'] {
    display: block;
}

.page-setting-home .item ul li:first-child select[name='owl-type'],
.page-setting-home .item ul li:last-child select[name='owl-type'] {
    right: 183px;
}

.page-setting-home .item ul li .add_home {
    position: absolute;
    right: 8px;
    background: #7ace4c;
    color: #fff;
    padding: 0px 8px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 26px;
    border-radius: 2px;
    line-height: 24px;
    font-size: 13px;
    min-width: 60px;
    border: none;
}

.page-setting-home .right .item ul.setting-sub {
    margin-bottom: 20px;
}

.page-setting-home .right .item ul.setting-sub li {
    padding: 3px 10px;
    text-align: left;
}

.page-setting-home .right .item ul.setting-sub li label {
    display: block;
    cursor: pointer;
}


/**/

.holder-suggested {
    background: #f1f1f1;
    padding: 12px;
    margin: 6px 0px;
    border-radius: 4px;
}

.holder-suggested>div {
    margin: 4px 0px;
    border-bottom: 1px solid #e7e7e7;
    padding: 0px 0px 8px;
}

#tpl>div:nth-child(2n+1) {
    clear: both;
}

.holder-suggested>div:first-child img {
    float: right;
    cursor: pointer;
}

.holder-suggested>div .label_name {
    display: inline-block;
    margin: 0;
    min-width: 140px;
    font-weight: 500;
}

.holder-suggested>div .input_name {
    display: inline-block;
}

.btn.attendance {
    width: 130px;
}

.btn.status {
    width: 100px;
}

table.table.attendance-list {
    border-style: solid;
    border-color: #007dd1;
    border-width: 1.5px 2px;
    /* 1px top and bottom, 2px on the sides */
}

table.table.attendance-list>thead>tr>th {
    color: white;
    background-color: #007dd1;
}

.img_renderMedia {
    width: 60px !important;
}

.img_renderMedia .docs {
    display: none;
    width: 60px;
}

.img_renderMedia .docs:first-child {
    display: block;
}

.img_renderMedia .owl-item .count {
    display: none;
}

.img_renderMedia .owl-item:last-child .count {
    display: block;
}

.img_renderMedia a.img.hd-file.url_chung_tu.large {
    margin-left: 0;
    border: 1px dotted #ddd;
    width: 60px;
    height: 60px;
    padding: 0;
    background: #fff;
}

.img_renderMedia .down-extension {
    position: absolute;
    bottom: 0;
    background: #fff;
    font-size: 9px;
    width: 100%;
    text-align: center;
    left: 0;
}

.img_renderMedia .owl-controls .owl-buttons>div {
    position: absolute;
    top: 28px;
    left: -14px;
    width: 14px;
    height: 14px;
    text-align: center;
    line-height: 13px;
}

.img_renderMedia .owl-controls .owl-buttons>div.owl-next {
    left: auto;
    right: -14px;
}

.box-wallet-5 .box {
    width: 20%;
}

@media(max-width: 991px) {
    .box-wallet-5 .box {
        width: 33.33333%;
    }
}

@media(max-width: 767px) {
    .box-wallet-5 .box {
        width: 50%;
    }
}

.first_theme_id .vsb-menu ul li::first-letter {
    color: var(--main-color);
}

.div_album .avatar_thumbs>.item {
    max-width: initial;
    width: 100%;
}

.div_album .avatar_thumbs>.item>a {
    width: 150px;
    height: 150px;
    padding: 0;
}

.span_multi>span {
    color: #fff;
    display: inline-block;
    padding: 2px 14px 2px;
    background: #2aabd2;
    margin: 1px 1px;
    border-radius: 30px;
    font-size: 12px;
}


/**/

.input_name_color input {
    width: 100%;
    float: left;
    padding: 0 2px;
}

.input_name_color.ac input {
    width: calc(100% - 57px);
    margin-right: 6px;
}

.input_name_color .clear_color {
    display: none;
    float: left;
}

.input_name_color.ac .clear_color {
    display: block;
}

.ui-autocomplete-m-height {
    max-height: 300px;
    overflow-y: auto;
}


/**/

.page-card .blocks-holder-card .form-control {
    /* border-radius: 20px; */
}

.page-card .blocks-holder-card textarea.form-control {
    /* border-radius: 16px; */
}

.blocks-holder-card {
    min-height: 600px;
    background: #f0f0f0;
    border-radius: 5px;
    margin-top: 6px;
    padding-bottom: 10px;
    padding-top: 5px;
    box-shadow: 0px 1px 0px #ccc;
    padding-left: 15px;
    padding-right: 15px;
}

.block_info_card {}

.block_info_card .item:hover {
    background: #d0f6ff;
}

.block_info_card .item {
    position: relative;
    border-radius: 5px;
    margin: 8px 0px;
    background: #f4f8fb;
    border: 1px solid #ccc;
    padding: 6px;
    box-shadow: 0 2px 2px #dedede;
}

.block_info_card .item.error_item {
    box-shadow: 0px 0px 6px rgb(255 0 0 / 60%);
    border-color: rgb(255 0 0 / 30%);
    background: rgb(255 0 0 / 3%);
}

.block_info_card .avatar_thumbs .item {
    border: none;
    box-shadow: none;
    margin: 0;
    border-radius: 0;
    background: none;
}

.block_info_card .avatar_thumbs .item a {}

.block_info_card .avatar_thumbs .item .fa-trash {
    color: red;
    position: absolute;
    top: 9px;
    right: 5px;
    cursor: pointer;
    background: none;
    font-size: 14px;
}

.block_info_card .item .iframe {
    position: relative;
}

.block_info_card .title {
    display: block;
    padding: 10px 90px 6px 5px;
    font-weight: 400;
    color: #6883c6;
    font-size: 13px;
    color: var(--main-color);
}

.block_info_card .title>span {
    display: block;
    font-weight: 600;
    color: #000;
    text-transform: uppercase;
    margin-top: 4px;
}

.block_info_card i.fa {
    position: absolute;
    right: 0px;
    top: 6px;
    cursor: pointer;
    font-size: 20px;
    z-index: 9;
    background: #dee9f1;
    width: 26px;
    height: 26px;
    text-align: center;
    border-radius: 4px;
    color: #96a9d8;
}

.block_info_card .info .item i.fa.fa-trash {
    background: none;
    color: #f00;
    top: 14px;
    right: 8px;
    font-size: 15px;
}

.block_info_card i.up {
    right: 104px;
    line-height: 23px;
}

.block_info_card i.down {
    right: 70px;
    line-height: 25px;
}

.block_info_card i.delete {
    right: 36px;
    font-size: 16px;
    line-height: 25px;
}

.block_info_card i.open {
    font-size: 30px;
    cursor: pointer;
    background: none;
    color: #444;
    line-height: 27px;
}

.block_info_card i.open.fa-angle-down {
    transition: .3s ease-in-out;
}

.block_info_card .item .iframe.active i.open.fa-angle-down {
    transform: rotate(-90deg);
}

.block_info_card .info {
    display: none;
    padding-bottom: 6px;
    margin-top: -6px;
}

.block_info_card .item.active .info {
    display: block;
}

.block_info_card_add {
    border: 1px dashed var(--main-color);
    border-radius: 10px;
    background: #fff;
    text-align: center;
    color: var(--main-color);
    padding: 12px 10px 10px;
    margin-top: 10px;
}

.block_info_card_add::after {
    content: '';
    clear: both;
    display: block;
}

.block_info_card_add .item {
    display: inline-block;
    float: left;
    width: 20%;
    cursor: pointer;
    margin: 4px 0px;
}

.block_info_card_add .item .img {}

.block_info_card_add .item .img i {
    font-size: 24px;
    position: relative;
    left: 3px;
}

.block_info_card_add .item span {
    display: block;
    padding-top: 6px;
    font-size: 13px;
}

.theme_store_card .content .item {
    padding: 0px 5px;
}

@media(min-width: 992px) {
    .theme_store_card .content .item {
        width: 50%;
    }
}

.theme_store_card .content .item .iframe .view {
    padding: 15px;
}

@media(max-width: 767px) {
    .theme_store_card .content .item .iframe .view {
        padding: 8px;
    }
}

.theme_store_card .content .item .iframe .view .color>label {
    width: calc(20% - 6px);
}

@media(max-width: 767px) {
    .theme_store_card .content .item .iframe .view .color>label {
        width: calc(15% - 6px);
    }
}

.theme_store_card .content .item .iframe .view h4 {
    margin-top: 22px;
}

.theme_store_card .content .item .iframe {
    margin: 6px 0px;
}

.avatar_thumbs_card {}

.avatar_thumbs_card .item {}

.avatar_thumbs_card .item a {
    display: block;
    height: 0px;
    position: relative;
    border: 1px dashed #e8e8e8;
    padding-bottom: 100%;
    margin: 4px 0px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
}

.avatar_thumbs_card.avatar_thumbs_card_2 .item a {
    padding-bottom: 60%;
}

.avatar_thumbs_card .item a img {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    /* width: 76px; */
    margin: auto;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.avatar_thumbs_card .item>a:hover img {
    transform: scale(0.9);
}

.avatar_thumbs_card .item>a span {
    color: red;
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
}

.title-line {
    font-size: 13px;
    color: #858585;
    font-weight: 300;
    margin: -5px 0px 6px;
}


/**/

.card_infomation img {
    max-width: 100%;
}

.card_infomation {
    /* border: 1px solid #ddd; */
    /* border-radius: 5px; */
    padding: 20px;
    background: #f1f1f1;
    margin-top: 6px;
    /* max-width: 400px; */
    margin: 0px auto;
    position: relative;
}

.card_infomation .block_info {
    padding: 0px 50px;
    margin-bottom: 20px;
}

.card_infomation .block_info .avatar {
    text-align: center;
    margin: 30px auto 20px;
    position: relative;
    width: 180px;
    height: 180px;
    background: #fff;
    border-radius: 50%;
}

.card_infomation .block_info .avatar img {
    border-radius: 50%;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: contain;
}

.card_infomation .block_info>h3 {
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 24px;
    margin: 24px -20px 15px;
    line-height: 1.3;
}

.card_infomation .block_info>h4 {
    text-align: center;
    margin-bottom: 25px;
}

.card_infomation .block_info>h4>span {
    position: relative;
    font-weight: 600;
    text-transform: uppercase;
}

.card_infomation .block_info>h4>span:before {
    content: '';
    width: 50px;
    height: 1px;
    background: #222;
    position: absolute;
    right: 100%;
    top: 50%;
    margin-right: 10px;
}

.card_infomation .block_info>h4>span::after {
    content: '';
    width: 50px;
    height: 1px;
    background: #222;
    position: absolute;
    left: 100%;
    top: 50%;
    margin-left: 10px;
}

.card_infomation .block_info p {
    margin: 10px 0px;
}

.card_infomation .block_info p a {
    font-size: 16px;
    color: #333;
}

.card_infomation .block_info p img {
    height: 30px;
    margin-right: 6px;
}

.card_infomation .block_info ul {
    padding: 0;
    margin: 18px -40px 0 -40px;
    text-align: center;
}

.card_infomation .block_info ul:after {
    content: '';
    clear: both;
    display: block;
}

.card_infomation .block_info ul li {
    list-style-type: none;
    display: inline-block;
    float: left;
    width: calc(16% - 10px);
    margin: 6px;
}

.card_infomation .block_info ul li a {
    display: block;
    height: 0;
    padding-bottom: 100%;
    position: relative;
}

.card_infomation .block_info ul li img {
    height: 100%;
    border-radius: 50%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.save_contact {
    margin-top: 20px;
}

@media(max-width: 767px) {
    .save_contact {
        display: block;
    }
}

.save_contact a {
    background: #71c49c;
    display: inline-block;
    border-radius: 50px;
    color: #fff;
    padding: 8px 18px;
    box-shadow: 1px 1px 3px #999;
    cursor: pointer;
}

.save_contact a img {
    height: 18px;
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
    -moz-filter: brightness(0) invert(1);
    -o-filter: brightness(0) invert(1);
    -ms-filter: brightness(0) invert(1);
    margin-right: 5px;
}


/**/

.block_item {
    margin: 16px 0px;
}

.block_item .iframe {
    background: #fff;
    border-radius: 0 0 8px 8px;
    text-align: center;
    position: relative;
    padding-bottom: 12px;
}

.block_item .iframe .show_more {
    color: #2566f0;
    font-style: oblique;
    font-weight: 300;
    cursor: pointer;
    padding-bottom: 8px;
    display: none;
}

.block_item .iframe.active .show_more {
    display: none;
}

.block_item .iframe .img {}

.block_item .iframe .img img {}

.block_item.bank .iframe {
    border-radius: 50px;
    padding: 6px 0px;
}

.block_item.bank .iframe.active {
    border-radius: 20px;
}

.block_item.bank .iframe .img a i {
    font-size: 30px;
    position: absolute;
    right: 10px;
    top: 0;
    color: #444;
    width: 40px;
    height: 54px;
    line-height: 54px;
    cursor: pointer;
    transition: .3s ease-in-out;
}

.block_item.bank .iframe.active .img a i {
    transform: rotate(90deg);
}

.block_item.bank .iframe .img img {
    height: 42px;
    cursor: pointer;
}

.block_item .iframe .youtbe {
    height: 0;
    padding-bottom: 56%;
    position: relative;
}

.block_item .iframe .youtbe iframe {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
}

.block_item .iframe h3 {
    margin: 20px 0px 5px;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1.3;
}

.block_item .iframe h3 a {
    color: #333;
    text-decoration: none;
}

.block_item .iframe .info {
    display: block;
    padding: 1px 0px;
}

.block_item.bank .iframe .info {
    display: none;
}

.block_item .iframe.active .info {
    display: block;
    padding: 1px 0px;
}

.block_item .iframe .info .info1 {
    color: #222;
    font-weight: 300;
    font-size: 15px;
    margin: 5px 0 10px 0;
    padding: 0px 12px;
}

.block_item .iframe .info .info1 a {
    color: #222;
    text-decoration: none;
}

.block_item .iframe .info .link {
    padding: 12px 50px 12px 18px;
    background: #f4f9fc;
    position: relative;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    margin-bottom: -14px;
    display: none;
}

.block_item .iframe .info .link a {
    color: #a3adc2;
    font-weight: 300;
    font-size: 13px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block_item .iframe .info .link i {
    position: absolute;
    right: 0;
    width: 42px;
    height: 42px;
    top: 0;
    line-height: 42px;
    cursor: pointer;
}

.block_item.bank .iframe .info .link {
    border-radius: 8px;
    width: 80%;
    margin: 15px auto 0px;
    padding: 10px 42px 10px 10px;
    display: block;
}

.block_item.bank .iframe .info .link>span {
    position: absolute;
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
    bottom: calc(100% - -8px);
    font-size: 12px;
    padding: 1px 12px;
    border-radius: 2px;
    right: 0;
}

.block_item.bank .iframe .info .link>span::before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-top-color: #dff0d8;
    border-width: 7px;
    margin-left: -7px;
}

.block_item .flexslider {
    position: relative;
    overflow: hidden;
}

.block_item .flexslider::after {
    content: '';
    display: block;
    clear: both;
}

.block_item .flexslider .slides {
    padding: 0px;
    margin: 0px;
    float: left;
    width: 100%;
}

.block_item .flexslider .slides::after {
    content: '';
    display: block;
    clear: both;
}

.block_item .flexslider .slides li {
    list-style-type: none;
    float: left;
    width: 100%;
}

.block_item .flexslider .slides li a {
    display: block;
}

.block_item .flexslider .slides li img {
    width: 100%;
    position: relative;
    z-index: 1;
}

.block_item flexslider .flex-direction-nav {
    padding: 0px;
    margin: 0px;
}

.block_item .flexslider .flex-direction-nav>li {
    list-style-type: none;
    position: absolute;
    top: 50%;
    right: 10px;
    font-size: 30px;
    margin-top: -24px;
    width: 32px;
    text-align: center;
    z-index: 2;
}

.block_item .flexslider .flex-direction-nav>li a {
    color: #fff;
}

.block_item .flexslider .flex-direction-nav>li.flex-next {
    left: 10px;
    right: auto;
}

.block_footer {
    text-align: center;
    margin-top: 40px;
    margin-bottom: 10px;
}

.block_footer .iframe {}

.block_footer .iframe a {
    display: inline-block;
    background: #000;
    border-radius: 6px;
    margin: 0px 2px;
    width: 48%;
}

.block_footer .iframe a img {
    border-radius: 6px;
    height: 46px;
}

table.table tr.table-highline td {
    background: #8ab2c9;
    color: #0052d9;
    font-weight: bold;
}

.lang {
    position: absolute;
    top: 8px;
    right: 8px;
    height: 25px;
    z-index: 99;
}

.lang a {
    border: 1px solid #c4cee7;
    background: #f0f0f2;
    padding: 4px 16px;
    font-size: 13px;
    line-height: 18px;
    color: #c2cee9;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
}

.lang a.active {
    background: #fa8018;
    background: -moz-linear-gradient(top, #fa8018 0, #f95e0e 100%);
    background: -webkit-linear-gradient(top, #fa8018, #f95e0e);
    background: linear-gradient(180deg, #fa8018 0, #f95e0e);
    border-color: #f95e0e;
    color: #fff;
}

.theme_id_last>span:last-child {
    display: none;
}

.view_card_2 {}

.view_card_2 iframe {
    width: 100%;
    border: none;
    height: 200vh;
    position: relative;
    top: 0px;
}


/**
 * BEGIN vancode  css checklistdashboard
 */

.box-wallet-5-db .board-canvas .box .inner {
    padding: 10px;
    position: relative;
    transition: all linear 0.3s;
}

.box-wallet-5-db .board-canvas .box .inner .btn_dashboard {
    position: absolute;
    top: 10px;
    right: 10px;
    display: none;
    background: #fff;
    border-radius: 3px;
}

.box-wallet-5-db .board-canvas .box .inner:hover .btn_dashboard {
    display: block;
}

.box-wallet-5-db .board-canvas .box .inner .dashboard_bottom {
    display: flex;
    align-items: center;
}

.box-wallet-5-db .board-canvas .box .inner .dashboard_bottom>* {
    margin-left: 8px;
}

.box-wallet-5-db .board-canvas .box .inner .status_dasshboard {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-wallet-5-db {
    flex-grow: 1;
    position: relative;
}

.box-wallet-5-db .board-canvas {
    bottom: 0;
    left: 0;
    margin-bottom: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 8px;
    -webkit-user-select: none;
    user-select: none;
    white-space: nowrap;
}

.box-wallet-5-db .board-canvas .box {
    box-sizing: border-box;
    display: inline-block;
    height: 100%;
    margin: 0 4px;
    vertical-align: top;
    white-space: nowrap;
    width: 272px;
}

.box-wallet-5-db .board-canvas .box .inner>textarea {
    height: 35px;
    overflow: unset;
    display: block;
    margin-bottom: 10px;
}

.box-wallet-5-db .board-canvas .box .inner .name_db {
    background-color: transparent;
    font-size: initial;
    word-wrap: break-word;
    clear: both;
    display: block;
    margin: 0 0 4px;
    overflow: hidden;
    text-decoration: none;
    line-height: 1.4;
    white-space: break-spaces;
}


/**
 * END vancode  css checklistdashboard
 */

.sub_block_item {
    position: relative;
    background: #fff;
    padding: 8px;
    border-radius: 4px;
    margin: 10px 4px 0px;
}

.sub_block_item .btn_delete_sub_block {
    position: absolute;
    top: 10px;
    right: 13px;
    z-index: 1;
    border-radius: 3px;
    font-size: 16px;
    padding: 0px 11px 3px;
    line-height: 18px;
}

.change_show_video {
    position: absolute;
    top: 1px;
    right: 1px;
    background: #fff;
    height: 32px;
    padding: 6px 0 6px 6px;
    border-radius: 0px 3px 3px 0px;
}

.box-shadow-none {
    box-shadow: none;
}

background: none !important;
border: none !important;
margin: 0px !important;

}
.autocomplete-search-menu li>a.docs {
    margin-top: 8px;
    font-size: 12px;
    margin-bottom: 5px;
    display: inline-block;
}
.autocomplete-search-menu li .img {
    position: absolute;
    font-size: 38px;
    color: var(--MAIN-COLOR);
    left: 12px;
    top: 8px;
    padding: 0px;
    width: auto;
    float: none;
}
.autocomplete-search-menu li .name {
    color: #444;
    font-weight: 600;
    font-size: 14px;
    margin: 6px 0px 0px;
    float: none;
    width: 100%;
    white-space: normal;
    max-width: 360px;
    padding: 0px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.autocomplete-search-menu li .name strong {
    /* li.item-searching .img */
}
.autocomplete-search-menu li:hover .name {
    color: var(--main-color);
}
.autocomplete-search-menu li .info {
    color: #999;
    font-weight: 300;
    font-size: 13px;
    float: none;
    width: 100%;
    white-space: normal;
    max-width: 360px;
    margin-bottom: 4px;
}
.search-menu {
    /* margin-left: 18px; */
    /* width: 450px; */
    
    position: relative;
    /* margin-right: 20px; */
}
.search-menu-mobile {
    display: none;
}
.search-menu input {
    width: 350px;
    border: 1px solid #f1f1f1;
    padding: 6px 10px;
    border-radius: 3px;
    background: #f9f9f9;
    font-size: 13px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.search-menu input:focus {
    width: 450px;
    outline: none;
    border-color: var(--main-color);
}

/* .search-menu input:focus+.autocomplete-search-menu,
.search-menu:focus .autocomplete-search-menu {
    opacity: 1;
    visibility: visible;
} */
@media(max-width: 767px) {
    .search-menu {
        display: none;
        position: absolute;
        width: 100%;
        top: 100%;
        left: 0px;
        margin: 0px;
        z-index: 9;
        padding: 10px;
        background: #fff;
        border-top: 1px solid #f1f1f1;
    }
    
    .search-menu-mobile {
        position: absolute;
        top: 0px;
        left: 50px;
        margin: 0px;
        padding: 11px 16px;
        display: block;
    }
    
    .search-menu-mobile>span {
        display: block;
        font-size: 20px;
    }
    
    .search-menu input {
        width: 100% !important;
    }
    
    .head-new .container {
        display: block;
    }
}
.autocomplete-search-menu {
    font-family: 'Open Sans', 'Arial' !important;
    border: none !important;
    background: #fff !important;
    box-shadow: 0px 0px 10px #ddd;
    max-height: 500px;
    overflow-y: auto;
}

/* .autocomplete-search-menu {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    width: 100%;
    top: 100%;
    left: 0px;
    padding: 0px;
    margin: 0px;
    z-index: 99;
    box-shadow: 0px 0px 10px #ddd;
    margin-top: 0px;
    height: 500px;
    overflow-y: auto;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
} */

/* Works on Chrome, Edge, and Safari */
.autocomplete-search-menu::-webkit-scrollbar {
    width: 6px;
}
.autocomplete-search-menu::-webkit-scrollbar-track {
    background: #fff;
}
.autocomplete-search-menu::-webkit-scrollbar-thumb {
    background-color: #999;
}
.autocomplete-search-menu li {
    list-style-type: none;
    padding: 5px 15px 5px 60px !important;
    position: relative;
    background: #f9f9f9;
    list-style-image: none !important;
    box-shadow: none !important;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.autocomplete-search-menu li:nth-child(2n) {
    background: #fff;
}
.autocomplete-search-menu li:hover {
    background: #f1f1f1;
}
.autocomplete-search-menu li>a {
    display: block;
}
.wrap_no {
    white-space: inherit !important;
}

/* Menu Rerail mới */
.header-retail {
    padding: 0px 5px;
}
.header-retail>.bg-gray {
    position: relative;
    z-index: 99;
}
.wrap-menu-retail {
    /* padding-left: 50px; */
}
.menu-retail {}
.menu-left-home {
    background: #eaf7fd;
    position: fixed;
    top: 0px;
    left: 0px !important;
    height: 100%;
    width: 100px;
    z-index: 99;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
.menu-left-home ul {
    padding: 34px 0 0 0;
    margin: 0;
}
.menu-left-home ul li {
    position: relative;
    list-style: none;
    margin: 8px;
}
.menu-left-home ul li.tax .wrap-input-group {
    right: auto;
    left: 100%;
    top: 0px;
    margin-top: 0px;
}
.menu-left-home ul li a {
    padding: 8px 8px;
    color: #555;
    font-size: 15px;
    cursor: pointer;
    border-radius: 5px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #d8ecf5;
    outline: none !important;
    display: block;
}
.menu-left-home ul li a img {
    height: 24px;
}
.menu-left-home ul li a i {
    font-size: 28px;
    color: var(--main-color);
}
.menu-left-home ul li a span {
    display: none;
    position: absolute;
    /* white-space: nowrap; */
    
    left: 55px;
    top: 4px;
    margin: auto;
    /* background: var(--main-color); */
    
    color: #fff;
    font-size: 12px;
    padding: 3px 0px 0px;
    border-radius: 4px;
    display: block;
    position: relative;
    left: 0;
    top: 0;
    color: #222;
    line-height: 1.2;
    text-transform: capitalize;
}
.menu-left-home ul li a span:before {
    content: '';
    position: absolute;
    height: 100%;
    width: 22px;
    left: -18px;
    top: 0;
    display: none;
}
.menu-left-home ul li a span:after {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-right-color: var(--main-color);
    border-width: 7px;
    margin-top: -7px;
    display: none;
}
.menu-left-home ul li:hover a span {
    display: block;
}
.menu-left-home ul li a p {
    display: inline-block;
    padding: 0 2px;
    margin: 0;
    color: #fff !important;
    color: #fff !important;
    position: absolute;
    top: -3px;
    right: 0;
    background: var(--main-color);
    border-radius: 50px;
    font-size: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.menu-left-home ul li a:hover {
    background-color: var(--main-color);
    background-color: #fff;
}
.menu-left-home ul li a:hover i {
    /* color: #fff; */
}
.menu-left-home ul li a.back {
    border-top: 1px solid #ddd;
    padding: 15px 20px;
    text-transform: uppercase;
    font-size: 18px;
    text-align: center;
    margin-top: 10px;
}
.menu-left-home ul li a.back i {
    margin-left: 5px;
    font-size: 20px;
    float: right;
    margin-top: 2px;
}
.sub_request_type_qrcode {
    /* margin: 0; */
    
    margin-top: 5px;
}
.sub_request_type_qrcode li {
    list-style-type: none;
}
.sub_request_type_qrcode li>label {
    padding: 5px 15px 10px;
    text-align: center;
    cursor: pointer;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin: 0 0 14px;
    display: block;
    padding-bottom: 100%;
    height: 0;
    position: relative;
}
.sub_request_type_qrcode li>label .lbl {
    display: block;
    top: 0 !important;
    width: 100%;
    height: 100%;
    position: absolute !important;
    left: 0;
}
.sub_request_type_qrcode li>label input[type=radio].ace+.lbl::before {
    margin-top: 12px;
}
.sub_request_type_qrcode li>label .lbl>div {
    width: 100%;
    height: calc(100% - 48px);
    position: absolute !important;
    left: 0;
    bottom: 12px;
}
.sub_request_type_qrcode li.active label {
    border-color: var(--main-color);
}
.sub_request_type_qrcode li img {
    cursor: pointer;
    max-width: 150px;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    max-width: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}
.view_qrcode img {
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 10px;
    max-width: 340px;
    margin-top: 0px;
}
@media(max-width: 767px) {
    .view_qrcode img {
        max-width: 100%;
    }
}
input[type=checkbox].ace:checked,
input[type=radio].ace:checked,
input[type=checkbox].ace:focus,
input[type=radio].ace:focus {
    outline: none !important;
}
label input[type=checkbox].ace,
label input[type=radio].ace {
    z-index: -100 !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute;
}
input[type=checkbox].ace+.lbl {
    position: relative;
    display: inline-block;
    margin: 0;
    min-height: 18px;
    min-width: 18px;
    font-weight: normal;
    cursor: pointer;
    color: #555;
    font-size: 12px;
}
input[type=checkbox].ace+.lbl::before {
    cursor: pointer;
    content: "";
    background-image: url(../images/no-check.png?v=1.0.01);
    border-radius: 0;
    display: inline-block;
    text-align: center;
    height: 20px;
    line-height: 20px;
    min-width: 20px;
    margin-right: 4px;
    position: relative;
    top: 5px;
    border: none;
    background-size: cover !important;
}
input[type=checkbox].ace.top3+.lbl::before {
    top: 3px;
}
input[type=checkbox].ace:checked+.lbl::before {
    background-image: url(../images/input-checked.png?v=1.0.01);
}
input[type=radio].ace+.lbl {
    position: relative;
    top: 6px;
}
input[type=radio].ace+.lbl::before {
    cursor: pointer;
    border: 1px solid #c8c8c8;
    display: inline-block;
    text-align: center;
    height: 20px;
    line-height: 20px;
    min-width: 20px;
    margin-right: 4px;
    position: relative;
    top: -1px;
    border-radius: 20px;
    border: none;
    background: url(../images/no_choosen.png?v=1.0.01) no-repeat;
    background-size: 100%;
    content: '';
}
input[type=radio].ace:checked+.lbl::before {
    background-image: url(../images/choosen.png?v=1.0.01);
    background-size: 100% !important;
}
input[type=radio]:disabled.ace+.lbl::before {
    background-color: #d5d5d5;
    cursor: not-allowed;
}
input[type="checkbox"].ace:disabled+.lbl::before,
input[type="radio"].ace:disabled+.lbl::before,
input[type="checkbox"].ace[disabled]+.lbl::before,
input[type="radio"].ace[disabled]+.lbl::before,
input[type="checkbox"].ace.disabled+.lbl::before,
input[type="radio"].ace.disabled+.lbl::before {
    background-color: #ddd !important;
    border-color: #ccc !important;
    box-shadow: none !important;
    color: #bbb;
}
.wrap-editor .mce-tinymce,
.wrap-editor .tox.tox-tinymce {
    width: 100% !important;
}
.pay_Bank #multiple_image .inner1 {
    border: 1px solid var(--main-color);
    padding: 15px;
    border-radius: 5px 5px 5px 5px;
    margin: 8px 0;
}
.pay_Bank #multiple_image .box1:nth-child(2n+1) {
    clear: both;
}
.pay_Bank #multiple_image .box1 .remove_image {
    position: absolute;
    right: -1px;
    top: 1px;
    z-index: 2;
    color: #fff;
    background: red;
    width: 20px;
    height: 20px;
    text-align: center;
    border-radius: 50px;
    font-size: 13px;
    cursor: pointer;
}
input[type=checkbox].field_column.ace {
    opacity: 0;
    position: relative;
    left: 20px;
    z-index: 1;
}

/**/
.type_used {
    margin: 0px 0 12px 0px;
    background: #f8f8f8;
}
.type_used::after {
    content: '';
    display: block;
    clear: both;
}
.type_used a {
    display: inline-block;
    padding: 10px 20px;
    cursor: pointer;
    background: #f1f1f1;
    margin-right: 1px;
    white-space: nowrap;
    color: #333;
}
@media(max-width: 767px) {
    .type_used a {
        padding: 10px 0px;
        float: left;
        width: calc(50% - 1px);
        text-align: center;
        font-size: 12px;
    }
}
.type_used a:hover,
.type_used a.active {
    background: var(--main-color);
    color: #fff;
}
.box-title {
    margin: 5px 0 10px;
    text-transform: uppercase;
    font-size: 18px;
    white-space: nowrap;
}
.row-edit-qr table tr,
.row-edit-qr table tr td,
table tr.row-edit-qr:hover td,
.row-edit-qr table tr:hover td {
    background-color: #fff !important;
}
.title_span {
    padding: 2px;
    background-color: var(--main-color);
    color: #fff;
    border-radius: 4px;
    margin-right: 5px;
    margin-bottom: 5px;
    display: inline-block;
    white-space: nowrap;
}
.single_group .vsb-menu li.grouped-option {
    pointer-events: none;
}
.single_group .vsb-menu li.grouped-option i,
.single_group .vsb-menu li.grouped-option span {
    display: none !important;
}
table.kpi thead tr th,
table.kpi tbody tr td {
    border: solid 1px #e8e8e8;
}
.table-fixed {
    position: relative;
}
.table-fixed th.fixed-right,
.table-fixed td.fixed-right {
    position: sticky;
    right: 0;
    background: #f0fff0;
    z-index: 1;
}

/**
*   CSS: Form bài thu hoạch sự kiện
*/
.form-field {
    border: 1px solid #ddd;
    margin-top: 10px;
    padding-bottom: 10px;
    padding: 10px;
    background: #f9f9f9;
    border-radius: 3px;
}
.wrap-form-field .form-field:last-child {
    /* padding-bottom: 0; */
    /* border: none; */
}
.form-field.active {}
.form-field::after {
    content: '';
    display: block;
    clear: both;
}
.form-field .left {
    float: left;
    width: 48%;
}
.form-field .left>span.s_list {
    display: block;
    margin: 10px 0 0 0;
    border-bottom: 1px dashed #ddd;
    padding: 0 0 8px 0;
    color: #777;
}
.form-field .left>span>ul {
    margin: 0;
    padding: 0;
}
.form-field .left>span>ul>li {
    margin-top: 17px;
    list-style-type: none;
}
.form-field .left>span>ul .item_add {
    position: relative;
    padding-left: 26px;
    margin: 0 0 12px 0;
    padding-right: 35px;
}
.form-field .left>span>ul .item_add::before {
    content: '';
    border: 2px solid #999;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 0;
    top: 7px;
    margin: auto;
    border-radius: 50px;
}
.form-field .left>span>ul .item_add.checked::before {
    content: '';
    background-color: lime;
    border: 2px solid #999;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 0;
    top: 7px;
    margin: auto;
    border-radius: 50px;
}
.form-field .left>span>.select_action {
    padding-left: 16px;
}
.form-field .left>span>.select_action li {
    list-style-type: decimal;
    padding-left: 10px;
}
.form-field .left>span>ul.radio_action .item_add::before {
    border-radius: 50px;
}
.form-field .left>span>ul.checkbox_action .item_add::before {
    border-radius: 0px;
}
.form-field .left>span>ul.select_action .item_add::before {
    display: none;
}
.form-field .left>span>ul .item_add>span {
    position: absolute;
    right: 0;
    top: 1px;
    padding: 6px 10px;
    cursor: pointer;
    color: #f00;
}
.form-field .left>span>ul .item_add>span.error {
    position: relative;
    top: 0;
    margin: 5px 0 0 0;
    padding: 0;
}
.form-field .left>span>ul .item_add input {
    height: 34px;
    font-size: 13px;
    font-weight: 400;
    padding: 4px 8px;
}
.form-field .left>span>ul>.add {
    display: inline-block;
    cursor: pointer;
    margin-top: 0;
}
.form-field .left>span>span {
    padding-left: 28px;
}
.form-field .left input {
    height: 44px;
    font-weight: 600;
    padding: 4px 12px;
}
.form-field .right {
    float: left;
    width: calc(52% - 100px);
    padding-left: 12px;
    position: relative;
}
.form-field .right1 {
    width: 100px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    float: right;
    text-align: right;
}
.form-field .right1 span {
    display: inline-block;
    background: #eee;
    padding: 2px 8px;
    margin: 0 0px 0 8px;
    border-radius: 3px;
}
.form-field .right1 span.delete_root {
    background: #d43f3a;
    color: #fff;
}
.form-field .right1 span i {}
.form-field .right .list {
    padding: 0;
    margin: 0;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    height: 44px;
    position: absolute;
    z-index: 9;
    width: calc(100% - 15px);
    left: 12px;
}
.form-field .right .list.active {
    z-index: 999;
}
.form-field .right .list li {
    display: none;
    padding: 12px 10px 11px 44px;
    position: relative;
    cursor: pointer;
    width: 100%;
    top: 0;
    z-index: 9;
    border-radius: 0px;
    background: #fff;
    border-bottom: 1px solid #f1f1f1;
    border-left: 1px solid #f1f1f1;
    border-right: 1px solid #f1f1f1;
}
.form-field .right .list.active li {
    display: block;
}
.form-field .right .list li.close {
    position: relative;
    opacity: 1;
    padding: 0;
    float: none;
    border: none;
    width: 100%;
    text-shadow: none;
    font-size: 12px;
    font-weight: 400;
    text-align: center;
    background: none !important;
    margin-top: 10px;
}
.form-field .right .list li.close span {
    width: auto;
    font-size: 13px;
    padding: 2px 10px;
    height: auto;
    position: relative;
}
.form-field .right .list li.active,
.form-field .right .list li:hover {
    display: block;
    background: rgb(219 228 246);
    /* border: 1px solid; */
    /* border-color: #fff; */
}
.form-field .right .list li.active {}
.form-field .right .list li.list1 {}
.form-field .right .list li span {
    position: absolute;
    left: 9px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 30px;
    height: 30px;
    padding: 5px 5px;
}
.form-field .right .list li.list1 span {
    padding: 11px 6px;
}
.form-field .right .list li.list2 span {
    padding: 6px 6px;
}
.form-field .right .list li.list6 span {
    padding: 7px 5px;
}
.form-field .right .list li.list1 span i,
.form-field .right .list li.list2 span i {
    width: 18px;
    height: 2px;
    background: #999;
    display: block;
    margin: 2px 0;
    border-radius: 1px;
}
.form-field .right .list li.list1 span i:last-child,
.form-field .right .list li.list2 span i:last-child {
    width: 11px;
}
.form-field .right .list li.list3 span i {
    border: 2px solid #999;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 30px;
}
.form-field .right .list li.list3 span i::after {
    content: '';
    background: #999;
    width: 8px;
    height: 8px;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-radius: 10px;
    margin: auto;
}
.form-field .right .list li.list4 span i {
    border: 2px solid #999;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 0;
}
.form-field .right .list li.list4 span i::after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f00c";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-radius: 10px;
    margin: auto;
    color: #999;
    width: 11px;
    height: 12px;
    font-size: 11px;
}
.form-field .right .list li.list5 span i {
    border: 2px solid #999;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50px;
}
.form-field .right .list li.list5 span i::after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f107";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    color: #999;
    width: 10px;
    height: 15px;
    font-size: 16px;
}
.form-field .right .list li.list6 span i {
    display: block;
}
.form-field .right .list li.list6 span i::after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f0ee";
    display: block;
    color: #999;
    font-size: 18px;
    left: 1px;
    position: relative;
}
.form-field .right .list li.list7 span i {
    display: block;
}
.form-field .right .list li.list7 span i::after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f017";
    display: block;
    color: #999;
    font-size: 20px;
    left: 1px;
    position: relative;
}
.form-field .right .form-error {
    display: flex;
    justify-content: space-between;
}
.form-field .right .form-error>span {
    width: 115px;
}
.form-field .right .form-error>span>div {
    width: 115px;
}
.form-field .right .form-error>div {
    width: calc(100% - 120px);
}
.grid-container {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 1000px;
    gap: 10px;
    align-items: center;
    justify-items: center;
}
.table-wrapper {
    max-height: 600px;
    /* Chiều cao tối đa của bảng */
    
    overflow-y: auto;
    /* Cho phép cuộn theo trục y */
    
    border: 1px solid #ccc;
    /* Đường viền của bảng */
}
.table-fixed-header {
    width: 100% !important;
    border-collapse: collapse !important;
}
.table-fixed-header thead {
    position: sticky !important;
    top: 0 !important;
    z-index: 1 !important;
    /* Đảm bảo header nằm trên cùng */
}
.table-fixed-header thead:nth-of-type(2) {
    top: 40px !important;
    /* Điều chỉnh giá trị này để phù hợp với chiều cao của thead đầu tiên */
}

/* Đứng cột table khi scroll*/
.wrap_table_sticky_full_all {}
.wrap_table_sticky_full_all.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    overflow: auto;
    background: #fff;
    margin: 0;
    padding: 8px 8px 6px 8px;
}
.wrap_table_sticky_full {
    background: #037dd1;
    color: #fff;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-size: 18px;
    margin-bottom: 10px;
    cursor: pointer;
}
.wrap_table_sticky_full_all.fixed .wrap_table_sticky_full {
    margin-right: 8px;
}
.wrap_table_sticky_filter {
    display: none;
    background: #037dd1;
    color: #fff;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-size: 14px;
    margin-bottom: 10px;
    cursor: pointer;
    padding: 0 14px;
    margin-right: 8px;
}
.wrap_table_sticky_filter.active,
.wrap_table_sticky_full.active {
    background: #ed1d25;
}
.wrap_table_sticky_full_all.fixed .wrap_table_sticky_filter {
    display: flex;
}
.wrap_table_sticky {
    overflow: inherit;
}
.wrap_table_sticky_full_filter.fixed {
    position: fixed;
    z-index: 1000;
    background: #fff;
    padding: 10px 10px 14px 10px;
    box-shadow: 0 0 10px #a7a7a7;
    width: 100%;
    top: 54px;
    left: 0;
    margin: 0 !important;
    border: 1px solid #ddd;
}
.wrap_table_sticky {
    max-height: 600px;
    overflow-y: auto;
    border: 1px solid #ccc;
    display: block;
    margin: 0;
}
.top_table_sticky1 thead tr:nth-child(1),
.top_table_sticky2 thead tr:nth-child(2),
.top_table_sticky3 thead tr:nth-child(3),
.top_table_sticky4 thead tr:nth-child(4),
.top_table_sticky5 thead tr:nth-child(5),
.top_row_sticky {
    position: sticky;
    top: -1px;
    z-index: 2;
}
.top_table_sticky21 thead:nth-child(2) tr:nth-child(1){
    position: sticky;
    top: 38px;
    z-index: 2;
}
.top_table_sticky31 thead:nth-child(3) tr:nth-child(1){
    position: sticky;
    top: 77px;
    z-index: 2;
}
.left_table_sticky1 tbody tr td:nth-child(1),
.left_table_sticky2 tbody tr td:nth-child(2),
.left_table_sticky3 tbody tr td:nth-child(3),
.left_table_sticky4 tbody tr td:nth-child(4),
.left_table_sticky5 tbody tr td:nth-child(5),
.left_row_sticky {
    position: sticky;
    left: -1px;
    z-index: 1;
}
.top_table_sticky1.left_table_sticky1 thead tr:nth-child(1) th:nth-child(1),
.top_table_sticky1.left_table_sticky2 thead tr:nth-child(1) th:nth-child(2),
.top_table_sticky1.left_table_sticky3 thead tr:nth-child(1) th:nth-child(3),
.top_table_sticky1.left_table_sticky4 thead tr:nth-child(1) th:nth-child(4),
.top_table_sticky1.left_table_sticky5 thead tr:nth-child(1) th:nth-child(5) {
    position: sticky;
    left: -1px;
    top: -1px;
    z-index: 1;
}
.clear_text_input {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 80px;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-weight: 400;
    background: #b1b1b1;
    color: #fff;
    border-radius: 50px;
    font-size: 11px;
}

.detail-info ul {
    padding: 0;
    margin: 0;
}

.detail-info ul li {
    list-style-type: none;
    padding: 5px 0px;
    border-top: 1px dashed #f1f1f1;
    font-size: 13px;
    display: flex;
}

.detail-info ul li:first-child {
    border: none;
}

.detail-info ul li span:first-child {
    display: inline-block;
    min-width: 150px;
}

.detail-info ul li .btn-small {
    padding: 1px 5px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 2px;
    min-width: 40px;
}

.read-notification{
    opacity: 50%;
}