@media screen and (max-width:1600px) {
    #smart>img {
        max-width: 1000px;
    }

    .techs>div {
        padding: 0 10vw;
        gap: 5vw;
    }

    .techs .spacer>img {
        width: 50%;
    }
}

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

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

    .hero-img video {
        height: 100%;
        position: absolute;
        inset: 0;
        margin: auto;
        width: 100%;
        object-fit: contain;
    }

    .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;
    }

    #slidecard .kf-spacers {
        display: none;
    }

    #slidecard .camera {
        gap: 5vw;
        height: unset;
        position: relative;
        padding: 10vw 0;
    }

    .kf-sliders {
        width: 90vw;
        flex-direction: column;
    }

    .kf-slider {
        padding: 10vw 5vw;
    }

    .kf-text {
        padding: 0;
        min-width: unset;
    }

    .kf-text span {
        display: none;
    }

    #hdmi>div.text {
        gap: 3vw;
    }

    #hdmi p {
        padding: 0 10vw;
    }

    #smart>div {
        width: 100%;
        gap: 3vw;
    }

    #smart>div p {
        padding: 0 10vw;
    }

    #smart .logos {
        flex-direction: column;
        gap: 5vw;
    }

    #smart .logos img {
        height: 30px;
    }

    .sound {
        display: flex;
        justify-content: center;
    }

    .sound>video {
        display: none;
    }

    .bars {
        transform: translate(0, -14vw);
    }

    .sound>img,
    .sound>img.wave {
        width: calc(100% * 1.6);
        margin: unset;
        inset: unset;
    }

    .sound>img:not(.wave) {
        opacity: 0;
    }

    .sound .text {
        transform: translateY(53vw);
        gap: 3vw;
    }

    .sound .text .imgs {
        padding-top: 5vw;
    }

    .sound .text h3,
    .sound .text h4,
    .sound .text p {
        padding: 0 5vw;
    }

    .sound .text .imgs,
    .sound .text .imgs img {
        width: 90%;
        text-align: center;
    }

    .osd {
        padding: 15vw 0;
    }

    .osdBG {
        overflow: unset;
    }

    .osdBG img {
        position: absolute;
        width: 125%;
        height: unset;
        object-fit: cover;
    }

    .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:
            'aim'
            'be'
            'axis'
            'timer'
            'cec '
            ' pic '
            'cast '
            'ok'
        ;
    }

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

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

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

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

    #pictures {
        height: 270px;
    }

    #designConcept {
        background: linear-gradient(110deg, rgba(20, 20, 20, 1) 0%, rgba(20, 20, 20, 1) 60%, rgba(33, 33, 33, 1) 60%, rgba(33, 33, 33, 1) 100%);
        flex-direction: column-reverse;
        justify-content: center;
        padding: 10%;
        gap: 3vw;
    }

    .designConceptDESC {
        gap: 3vw;
    }

    .back-img {
        display: none;
    }

    .techs {
        min-height: 75vh;
    }

    .techs-text {
        padding: 0 5vw;
        gap: 5vw;
        max-width: 600px;
    }

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

    .techs-text>div>div {
        gap: 2vw;
    }

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

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

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

    .techs .spacer {
        height: unset;
    }

    .techs .spacer>img {
        display: none;
    }

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

    .io img {
        width: unset;
        height: 100%;
        transform: translate(3%, 0%) scale(0.9);
        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;
    }

    #hdmi {
        background-position: 80%;
    }
}

@media screen and (max-width:760px) {

    .kf-slider {
        width: 100%;
        gap: 2.5vw;
    }

    .kf-text {
        gap: 5vw;
    }

    #smart {
        padding: 20vw 0 10vw 0;
    }

    .sound .text {
        justify-content: flex-end;
    }

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

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