@import '../font.css';

:root {
    --default-color-1: #1F8144;
    --default-color-2: #EA0023;
    --default-color-3: #EC1F25;
    --default-color-4: linear-gradient(360deg,rgba(31, 129, 68, 1) 0%, rgba(234, 0, 35, 1) 100%);
    --default-gra-1: linear-gradient(270deg, #00AA6C 0%, #195452 100%);
    --default-gra-2: linear-gradient(0deg, #EE4F2C 0%, #FFCE85 100%);
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    clear: both;
    display: block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

tbody tr p:last-child {
    border-bottom: 0
}

tbody tr p {
    margin: 0;
    padding: 7px 0;
    font-size: 15px;
    display: block;
    width: 100%;
    border-bottom: 1px solid #33333329;
}

* {
    box-sizing: inherit;
}

tbody tr td:nth-child(3), tbody tr td:nth-child(4) {
    color: var(--default-color-2);
}

tbody tr td {
    color: var(--default-color-1);
}
tbody tr td:first-child{
    width: 31%;
}
tbody tr td:nth-child(2){
    width: 20%;
}
tbody tr td:nth-child(3){
    width: 25%;
}
    tbody tr td:first-child:before {
        position: unset;
    }

.tan {
    width: 100%;

    margin-top: 21px;
}
.simplebar-scrollbar::before {
  background: var(--default-color-1) !important; /* m?u xanh */
  opacity: 1 !important;          /* lu?n hi?n */
}

/* d?i m?u n?n r?nh scrollbar (scroll track) */
.simplebar-track.simplebar-vertical {
  background: #f1f1f1; /* n?n nh?t */
  border-radius: 4px;
}
    .tan table {
        width: 100%;
        border-collapse: collapse;
        margin: 0;
    }

    .tan thead {
        /* background: #f1f1f1; */
        position: sticky;
        top: 0;
        z-index: 5;
    }
.asdklasd table{
    border-radius: 0;
    border: unset;
}
.sadcx{
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

  
    .tan::-webkit-scrollbar {
        width: 1px; /* d? m?ng c?a thanh cu?n d?c */
        height: 1px; /* d? m?ng c?a thanh cu?n ngang */
    }
.sadcx tr th:nth-child(2){
    width: 19%;
}
.sadcx tr th:nth-child(3){
    width: 25%;
}
.sadcx tr th:nth-child(4){
    width: 25%;
}
    
    
    .tan th{
    position: relative;
    }
.tan th:before{
    content:"";
    position: absolute;
    width: 1px;
    right: 0px;
    background: #c7c7c78a;
    height: 57%;
}
.asdklasd{
    display: block;
    max-height: 570px !important;
    overflow-y: auto;
    border: 1px solid #FFF;
    -webkit-overflow-scrolling: touch;
    }


        .tan thead,
        .tan tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed; /* gi? c?t th?ng h?ng */
}

tbody tr td:before {
    content: '';
    position: absolute;
    width: 1px;
    height: 83%;
    left: 0px;
    background-color: var(--default-color-1);
    opacity: .4;
}

tbody {
    max-height: 300px; /* chi?u cao d? v?a 3 h?ng tr */
    overflow-y: auto;
}

    tbody tr {
        font-family: 'Montserrat-Medium';
    }

.giuseart-nav {
    display: none;
}

section h3 {
    color: var(--default-color-1);
    font-weight: 100;
    font-family: 'Montserrat-SemiBold';
}

table {
    width: 100% !important;
    border-collapse: collapse;
    margin: 20px 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    border-radius: 15px;
}

thead {
    background: var(--default-color-1);
    color: #fff;
}

th, td {
    padding: 14px 20px;
    text-align: center;
    border: unset;
}

tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

tbody tr:hover::first-child {
    background-color: unset
}

tbody tr:hover {
    cursor: pointer;
}

tbody tr:last-child
th {
    font-size: 17px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

td {
    color: #333;
    position: relative;
}

section {
    line-height: 164%;
}

    section img {
        max-width: 100%;
        height: auto !important;
        !i;
        !;
    }

    section h3::before {
    }

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

html {
    line-height: normal;
    font-family: 'Montserrat-Regular';
    box-sizing: border-box;
    overflow-x: hidden !important;
    overflow-y: auto;
    scroll-behavior: smooth;
}

    html.rs {
        overflow-y: hidden !important;
    }

    html.active header .banner {
        display: none;
    }

    html.active .zalo.bookings {
        display: none;
    }

    html.active header {
        position: absolute;
        z-index: 99;
    }

    html.no-icon .hotline-phone-ring-wrap {
        display: none;
    }

    html.no-icon .zalo.bookings {
        display: none !important;
    }

    html.no-icon .gm {
        display: none !important;
    }

    html.no-icon .message {
        display: none !important;
    }

    html.no-icon .zalo {
        display: none !important;
    }

    html.no-icon .btn-langs {
        display: none;
    }

    html.no-icon .back-to-top {
        display: none;
    }

body {
    padding: 0;
    border: 0;
    overflow: hidden;
    margin: 0;
    background-color: #fff;
}

.seo {
    display: none;
}

.rs {
    margin: 0;
    padding: 0;
    list-style: none;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

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

.up-case {
    text-transform: uppercase;
}

ul {
    margin: 0;
}

a {
    text-decoration: none;
    cursor: pointer;
    color: inherit;
}

.none {
    display: none !important;
}

img {
    object-fit: cover;
}

.help-space-1 {
    height: 60px;
    background-color: #fff;
}

@media (max-width:739px) {
    tr {
        font-size: 12px;
    }

    .tan th {
        padding: 12px 8px;
        font-size: 10px;
    }

    .tan td {
        padding: 8px;
    }

    tbody tr p {
        font-size: 11px;
    }

    tbody tr td:before {
        top: 8%;
    }
}