/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {}

/* Medium Devices, Desktops */
@media only screen and (min-width : 850px) {

    header {
        position: fixed !important;
    }

    header .stuck .header-main,
    header .stuck .header-bottom {
        background-color: rgba(0, 0, 0, 1) !important;
    }

    .j-banner {
        padding-top: 120px !important;
    }

    /* .nav-right {
        flex-direction: column;
        gap: 5px;
    }

    .nav-right li {
        margin: unset;
    } 
    .nav-right .button{
        min-width: 120px;
    } */

    /* .nav-left {
        justify-content: center;
    } */

}

/* Small Devices, Tablets */
@media only screen and (max-width : 850px) {
    .j-tin-tuc .row{
        grid-template-columns: repeat(2, 1fr);
    }

    header .header-main,
    header .header-bottom {
        background-color: rgba(0, 0, 0, 1) !important;
    }

    .j-banner p {
        font-size: 18px;
    }

    .j-banner p:nth-child(3) {
        font-size: 13px;
    }

    .j-banner-2 p {
        font-size: 34px;
    }

    .j-banner-2 p:nth-child(2) {
        font-size: 18px;
    }

    .j-order {
        order: -1
    }

    .j-chuyen-muc .row {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 550px) {
    .j-tin-tuc .row{
        grid-template-columns: repeat(1, 1fr);
    }
    .j-tin-tuc .post-item {
        grid-column: 1/-1;
    }
    .j-tin-tuc .row .post-item:nth-child(-n + 4) .image-cover{
        padding-top: 50% !important;
    }
    .j-tin-tuc .image-cover{
        padding-top: 50% !important;
    }
    .j-chuyen-muc .row {
        grid-template-columns: repeat(2, 1fr);
    }

    .j-banner p {
        font-size: 16px;
    }

    .j-banner .button span,
    .j-banner-2 .button span {
        white-space: nowrap;
        font-size: 9px;
        padding: 3px;
    }

    .j-banner .button,
    .j-banner-2 .button {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        min-height: unset;
        margin-bottom: unset;
        margin-top: unset;
    }

    .j-banner p:nth-child(3) {
        font-size: 12px;
        line-height: 1;
    }

    .j-banner-2 p {
        font-size: 14px;
    }

    .j-banner-2 p:nth-child(2) {
        font-size: 9px;
    }

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {}