@media screen and (max-width:1200px) {
    .hero h2 {
        font-size: 4rem;
        padding: 5vw;
    }

    .hero-img img {
        width: 90%;
        height: unset;
    }

    .keyfeature>h3,
    .keyfeature>p {
        display: none;
    }

    .InnerGIGABYTEContent .scrolldown {
        display: none;
    }

    .features {
        margin: 0;
        gap: 5vw;
    }

    .features h3,
    .features p {
        line-height: normal;
        letter-spacing: unset;
    }

    .features .p1 {
        font-size: 1.5rem;
    }

    .panel .cols div {
        width: 100%;
        padding: 5vw;
        position: relative;
        overflow: hidden;
        backdrop-filter: unset;
    }

    .panel .cols div aside {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        filter: blur(3rem);
        background-image: radial-gradient(#7e7db5, #0c0c0c99);
    }

    .panel h3 {
        line-height: 1.3;
    }

    .panel h3,
    .panel p,
    .panel img {
        position: relative;
    }

    .audio .content .col {
        padding: 0 5vw;
    }

    .audio .content .col img {
        width: unset;
        height: 100%;
    }

    .audio .modes {
        margin: 5vw 0 0 0;
        gap: 0;
    }

    .audio .modes span {
        border-radius: 0px;
        border-top: none;
        border-bottom: none;
        padding: 0 3vw;
    }

    .audio .modes .vs {
        border-left: none;
    }

    .audio .modes .live {
        border-right: none;
    }

    .osd {
        padding: 15vw 0;
    }

    .osdBG {
        overflow: unset;
    }

    .osd .content {
        max-width: 1600px;
        width: 100%;
        display: grid;
        padding: 0 5vw;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        gap: 3vw;
        grid-template-areas:
            "osdkick"
            "dash"
            "aim"
            "be"
            "assist"
            "axis"
            "autoupdate"
            "kvm";
    }

    .assistbtns {
        display: none;
    }

    .osd .content>div {
        padding: 5vw;
        position: relative;
        overflow: hidden;
        backdrop-filter: unset;
        opacity: 1;
        transform: translateY(0);
    }

    .osd .content>div aside {

        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        filter: blur(3rem);
        background-image: radial-gradient(#97b9d4, #000000b3);
    }

    .osd .content>div>div,
    .osd .content>div>img {
        position: relative;
    }

    .osd .content p {
        margin: 2vw 0;
    }

    .osd .content div.heightfit {
        min-height: 235px;
    }

    a.link {
        padding: 2vw 4vw;
        margin: 1vw 0 2vw 0;
    }

    .dscc-text {
        padding: 5vw 5vw 0 5vw;
    }

    .dscc-text>div {
        width: 100%;
    }

    .techs .spacer {
        flex-direction: column;
        height: unset;
    }

    .back-img {
        overflow: hidden;
    }

    .back-img img {
        width: 100%;
        height: unset;
        transform: translate(-45%, -30%) scale(1.8);
    }

    .techs-text {
        padding: 0 5vw;
        gap: 5vw;
    }

    .techs-text>div {
        grid-template-columns: 15% 1fr;
        gap: 3vw;
    }

    .techs-text h4 {
        font-size: 1.1rem;
        line-height: normal;
    }

    .techs-text p {
        font-size: 1rem;
        line-height: normal;
    }

    .techs-text img {
        width: 100%;
    }

    .wallmounts {
        margin: 5vw 0 0 0;
    }

    .wallmounts>div {
        max-width: unset;
    }

    .wall-img {
        display: none;
    }

    .io {
        width: 100%;
        height: 100vh;
        position: relative;
    }

    .io img {
        width: unset;
        height: 100%;
        top: 50%;
        transform: translate(20%, -60%) scale(2);
        opacity: 1;
        clip-path: unset;
    }

    img.io-bg {
        position: absolute;
    }

    .io>div {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: linear-gradient(0deg, black, transparent 10%, transparent 90%, black);
    }

    .dots {
        display: none;
    }
}

@media screen and (max-width: 960px) {
    .model-content {
        margin-top: 120px;
        display: none;
    }

    .Rwd #PageMainContent.NotCoverHeader {
        padding-top: 0;
    }

    .topBg #header-bar.new-header-bar,
    .topBg #header-bar.scrolling {
        position: relative;
    }
}


@media screen and (max-width:768px) {
    .audio .content .col img {
        width: unset;
        height: 130%;
    }
}