/* mobile style*/
@media only screen and (max-width: 768px) {
    .cat-banner, .cat-page {
        height: 300px;
    }

    .bk-slider-hover img {
        width: 100%;
        height: 250px !important;
    }

    .cat-banner .banner-content, .cat-page .banner-content {
        max-width: 100%;
    }

    .cat-banner .banner-header h1.s1_t, .cat-page h1.s1_t {
        font-size: 30px;
    }

    .mt-footer {
        margin-bottom: 20px !important;
    }

    .about-item {
        margin-bottom: 20px;
    }

    .s18 {
        padding: 0px !important;
    }

    .s19_w li {
        width: 100%;
    }

    .s19_w li:not(:last-child) {
        display: none !important;
    }

    .s1_m h1.s1_t {
        font-size: 35px;
    }

    .s1_m p.s1_o {
        color: #fff;
        font-size: 18px;
    }

    .banner-select {
        width: 100%;
    }

    .home-title > h2 {
        font-size: 20px;
    }

    .cat-voucher-item.cat-big .cat-voucher-thumbnail {
        height: 220px;
    }

    #desktop {
        display: none !important;
    }

    #mobile {
        display: block !important;
    }

    button#button-vouher {
        width: 50px !important;
    }

    #button-vouher span {
        display: none !important;
    }

    .filterVoucher .filter-item {
        margin-right: 10px;
    }

    #button-vouher:before {
        content: '\f002';
        font-family: "Font Awesome 6 Pro";
    }

    .filterVoucher {
        display: inline-block;
        width: 100%;
        margin-bottom: 30px;
    }

    .filter-item:last-child {
        margin: 0px !important;
    }

    .filter-item {
        width: 31%;
        float: left;
    }

    .filterVoucher .filter-item > .filter {
        display: inline-block;
        font-size: 13px;
    }

    .filterVoucher .filter-label {
        margin-bottom: 15px;
    }
}

/* iPad landscape style here */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

}

/* iPad portrait style here */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {


}

/**desktop**/
@media only screen and (min-width: 768px) {
    .container-width, .full-width .ubermenu-nav, .container, .row {
        max-width: 1170px !important;
    }
}