@media (min-width: 1200px) {
    .modal-full {
        max-width: 1300px;
    }
}

.toast {
    width: auto;
}

.toast-body {
    white-space: pre-line;
}

.jq-toast-wrap,
.jq-toast-wrap * {
    margin: 0;
    padding: 0
}

.jq-toast-wrap {
    display: block;
    position: fixed;
    width: 250px;
    pointer-events: none !important;
    letter-spacing: normal;
    z-index: 9000 !important
}

.jq-toast-wrap.bottom-left {
    bottom: 20px;
    left: 20px
}

.jq-toast-wrap.bottom-right {
    bottom: 20px;
    right: 40px
}

.jq-toast-wrap.top-left {
    top: 20px;
    left: 20px
}

.jq-toast-wrap.top-right {
    top: 20px;
    right: 40px
}

.jq-toast-single {
    display: block;
    width: 100%;
    padding: 10px;
    margin: 0 0 5px;
    border-radius: 4px;
    font-size: 12px;
    font-family: arial, sans-serif;
    line-height: 17px;
    position: relative;
    pointer-events: all !important;
    background-color: #444;
    color: #fff
}

.jq-toast-single h2 {
    font-family: arial, sans-serif;
    font-size: 14px;
    margin: 0 0 7px;
    background: 0 0;
    color: inherit;
    line-height: inherit;
    letter-spacing: normal
}

.jq-toast-single a {
    color: #eee;
    text-decoration: none;
    font-weight: 700;
    border-bottom: 1px solid #fff;
    padding-bottom: 3px;
    font-size: 12px
}

.jq-toast-single ul {
    margin: 0 0 0 15px;
    background: 0 0;
    padding: 0
}

.jq-toast-single ul li {
    list-style-type: disc !important;
    line-height: 17px;
    background: 0 0;
    margin: 0;
    padding: 0;
    letter-spacing: normal
}

.close-jq-toast-single {
    top: 3px;
    right: 7px
}

.jq-toast-loader {
    display: block;
    position: absolute;
    top: -2px;
    height: 5px;
    width: 0;
    left: 0;
    border-radius: 5px;
    background: red
}

.jq-toast-loaded {
    width: 100%
}

.jq-has-icon {
    padding: 10px 10px 10px 50px;
    background-repeat: no-repeat;
    background-position: 10px
}

.jq-icon-info {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);
    background-color: #31708f;
    color: #d9edf7;
    border-color: #bce8f1
}

.jq-icon-warning {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=);
    background-color: #8a6d3b;
    color: #fcf8e3;
    border-color: #faebcc
}

.jq-icon-error {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=);
    background-color: #a94442;
    color: #f2dede;
    border-color: #ebccd1
}

.jq-icon-success {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==);
    color: #dff0d8;
    background-color: #3c763d;
    border-color: #d6e9c6
}

.jq-icon-error {
    background-color: #f1556c;
    border-color: #f1556c;
    color: #fff
}

.jq-toast-wrap {
    width: 369px
}

.jq-has-icon {
    padding: 15px 10px 15px 69px
}

.jq-toast-single,
.jq-toast-single h2 {
    font-family: Nunito, sans-serif
}

.jq-toast-single {
    background-color: #f1556c;
    font-size: 14px;
    line-height: 22px;
    padding: 12px 12px 12px 45px
}

.close-jq-toast-single {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 14px;
    cursor: pointer;
    width: 24px;
    height: 24px;
    text-align: center;
    background: #870000
}

.flex-1 {
    flex: 1
}

.navbar-menu .navbar-nav .nav-link i {
    color: #28a04d
}

.navbar-menu .navbar-nav .nav-link.active {
    color: #fff;
    background: #2d9e4f;
    /* background: #0276c4; */
    margin: .25rem 1rem;
    border-radius: 30px;
    padding: .175rem .5rem
}

.navbar-menu .navbar-nav .nav-link.active i {
    color: #fff !important
}

.menu-title span {
    padding: 12px 20px 9px;
    display: inline-block;
    font-size: 12px
}

[data-layout=vertical] .horizontal-logo {
    width: 250px;
    text-align: left
}

.bg-mbox-red {
    color: #fff
}

.dashboard-main-number {
    font-size: 2rem
}

.avatar-rounded-sm svg,
.rounded svg {
    border-radius: 5px
}

.bl-0 {
    border-left: 0 !important
}

.br-0 {
    border-right: 0 !important
}

.card {
    box-shadow: 0 3px 20px rgba(0, 0, 0, .0431372549)
}

.card-border {
    box-shadow: 0 1px 2px rgba(56, 65, 74, .15) !important
}

.text-hover-underline:hover {
    text-decoration: underline !important
}

@media (min-width: 1024.1px) {
    [data-layout=vertical][data-layout-style=detached] .topnav-hamburger {
        visibility: visible
    }
}

.w-435px {
    width: 435px
}

.w-300 {
    width: 300px
}

.w-350 {
    width: 350px
}

th.col-sticky {
    z-index: 1000
}

.col-sticky {
    background-color: inherit !important;
    left: -1px;
    position: -webkit-sticky !important;
    position: sticky !important
}

td.col-sticky {
    background-color: #fff !important;
    z-index: 1
}

.table-inline thead tr,
.table-inline thead tr:hover {
    --tw-bg-opacity: 1 !important;
    background-color: #f3f6f9 !important
}

.table-inline tr:nth-child(2n) {
    background-color: #fff
}

.table-inline tr td:first-child,
.table-inline tr th:first-child {
    border-left: none
}

.table-inline tr td:last-child,
.table-inline tr th:last-child {
    border-right: none
}

.table-hover>tbody>tr.focused:hover>*,
table.table-hover tr.focused>*,
table.table tr.focused {
    background-color: #fff9c4 !important;
    background-color: #b2dfdb !important;
    background-color: #fff3e0 !important;
    background-color: #fff7b8 !important;
    --mbox-table-hover-bg: #fff7b8 !important
}

@media only screen and (max-width: 600px) {
    .col-sticky {
        left: inherit;
        position: static !important
    }
}

.modal-content,
.no-border {
    border: none !important
}

.bg-none {
    background: none !important
}

.img-duyet-cong {
    height: 412px;
    margin-left: 15px;
    background: #fff;
    -o-object-fit: contain;
    object-fit: contain
}

.badge {
    line-height: 13px
}

.fl-scrolls {
    z-index: 2
}

[data-layout=vertical][data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link {
    z-index: 101
}

#progressbar {
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: flex;
    color: #d3d3d3
}

#progressbar .active {
    color: #000
}

#progressbar li {
    list-style-type: none;
    flex: 1;
    position: relative;
    text-align: center
}

#progressbar #step1:before {
    content: "1"
}

#progressbar #step2:before {
    content: "2"
}

#progressbar #step3:before {
    font-family: FontAwesome;
    content: "3"
}

#progressbar #step4:before {
    content: "4"
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 18px;
    color: #fff;
    background: #d3d3d3;
    border-radius: 50%;
    margin: 0 auto 10px;
    padding: 2px
}

#progressbar li:after {
    content: "";
    width: 100%;
    height: 2px;
    background: #d3d3d3;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1
}

#progressbar li.active:before {
    background: #3d78e3
}

.dragBox {
    background: #fff
}

.dragFile {
    border: 2px dashed #244281;
    font-weight: 700;
    padding: 15px;
    transition: all .369s;
    cursor: pointer
}

.dragFile:hover {
    border: 2px dashed #6f89c4;
    border-radius: 6px;
    color: #6f89c4
}

@media (min-width: 1024.1px) {

    [data-layout=vertical][data-layout-style=detached] #layout-wrapper,
    [data-layout=vertical][data-layout-style=detached] .layout-width {
        max-width: inherit
    }
}

b,
strong {
    font-weight: 700
}

.preview-value {
    color: #2c2c2c
}

.with-summary th {
    padding-top: 5px;
    padding-bottom: 5px;
    vertical-align: middle
}

.nav-tabs-custom .nav-item .nav-link.active,
.nav-tabs-custom .nav-item .nav-link:hover {
    border-bottom: 3px solid transparent;
    -o-border-image: linear-gradient(90deg, #0276c4 25%, #02a04d 0, #02a04d 50%, #fcb503 0, #fcb503 75%, #e61226 0) 5;
    border-image: linear-gradient(90deg, #0276c4 25%, #02a04d 0, #02a04d 50%, #fcb503 0, #fcb503 75%, #e61226 0) 5
}

.nav-tabs-custom .nav-item .nav-link:after {
    height: 0
}

.choices__item--selectable {
    cursor: pointer
}

#tooltipSingle,
.choices__item--selectable {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#tooltipSingle {
    position: absolute;
    display: none;
    border: 1px solid #fdce3f;
    background-color: #fdf8ce;
    padding: 3px 5px;
    z-index: 50;
    border-radius: 5px;
    font-size: 14px;
    max-width: 480px
}

.fieldHasTip {
    position: relative
}

.fieldHasTip .hint {
    display: none;
    position: absolute;
    background: #fff9c7;
    padding: 0 .5em;
    border: 1px solid #ffe1b5;
    top: -25px;
    border-radius: 5px;
    white-space: nowrap;
    max-width: 480px;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 100001
}

.scroll-custom-one {
    position: -webkit-sticky;
    position: sticky;
    top: 69px;
    z-index: 1
}

.td-5-15 {
    padding: 5px 15px !important
}

[data-layout=vertical][data-sidebar-size=sm] .navbar-menu .logo-sm {
    position: relative;
    left: 20px
}

.flatpickr-calendar.open {
    z-index: 10003
}

*>.-intro-x {
    transform: translateX(-50px)
}

*>.intro-y {
    transform: translateY(50px)
}

*>.-intro-y,
*>.intro-y {
    -webkit-animation: intro-y-animation .3s ease-in-out .33333s;
    animation: intro-y-animation .3s ease-in-out .33333s;
    -webkit-animation-delay: .1s;
    animation-delay: .1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    opacity: 0;
    position: relative;
    z-index: 49
}

*>.-intro-y {
    transform: translateY(-50px)
}

*>.-intro-x,
*>.intro-x {
    -webkit-animation: intro-x-animation .4s ease-in-out .33333s;
    animation: intro-x-animation .4s ease-in-out .33333s;
    -webkit-animation-delay: .1s;
    animation-delay: .1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    opacity: 0;
    position: relative;
    z-index: 49
}

*>.intro-x {
    transform: translateX(50px)
}

@-webkit-keyframes intro-x-animation {
    to {
        opacity: 1
    }

    to {
        transform: translateX(0)
    }
}

@keyframes intro-x-animation {
    to {
        opacity: 1
    }

    to {
        transform: translateX(0)
    }
}

@-webkit-keyframes intro-y-animation {
    to {
        opacity: 1
    }

    to {
        transform: translateY(0)
    }
}

@keyframes intro-y-animation {
    to {
        opacity: 1
    }

    to {
        transform: translateY(0)
    }
}

.table-smx>:not(caption)>*>* {
    padding: 0.5rem 0.36rem;
}

.dropdown-menu {
    z-index: 1005;
}

.table-head {}

.table-head tr th {
    padding: .69rem !important;
}

.head-top tr th {
    vertical-align: top;
}

.with-summary tr th {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    vertical-align: middle !important;
}