@media only screen and (min-width: 1000px) {
    .vib-v2-section-banner-home .swiper-slide {
        height:450px!important
    }

    .vib-v2-text-banner {
        width: 55%
    }

    .vib-v2-text-banner-top {
        width: 55%
    }
}

@media only screen and (max-width: 767px) {
    body .vib-v2-text-banner .vib-v2-fz-title-product {
        line-height:26px
    }

    .left-background-color {
        background: #fff!important
    }

    .vib-v2-section-banner-home .swiper-slide .swiper-bg {
        display: block!important
    }

    body#content .vib-v2-section-banner-home .swiper-slide .vib-v2-text-banner::after {
        content: ""
    }

    .vib-v2-btn-banner a.vib-v2-btn-dk01 {
        width: auto;
        display: inline-block
    }

    .vib-v2-text-banner {
        position: relative
    }
}

@media only screen and (min-width: 768px) {
    .left-background-color {
        display:none
    }

    .vib-v2-text-banner.white .vib-v2-more-detail-banner {
        color: #fff;
    }

    body#content .vib-v2-section-banner-home .vib-v2-wrapper_new a.vib-v2-more-detail-banner.white {
        color: #fff
    }

    body#content .vib-v2-section-banner-home .vib-v2-wrapper_new a.vib-v2-more-detail-banner.white:after {
        filter: invert(1)
    }

    body .vib-v2-text-banner.white a.vib-v2-more-detail-banner:after {
        filter: invert(1)
    }
}

@media (min-width: 768px) and (max-width:1140px) {
    body .vib-v2-section-banner-home {
        height:380px
    }

    body .vib-v2-section-banner-home .vib-v2-wrapper_new .vib-v2-text-banner {
        text-align: left
    }

    body .vib-v2-text-banner .vib-v2-fz-title-banner p {
        font-family: "Inter",sans-serif;
        font-style: normal;
        font-weight: 600!important;
        font-size: 30px!important;
        line-height: 40px!important
    }

    body .vib-v2-text-banner .vib-v2-fz-title-product p {
        font-family: "Inter",sans-serif;
        font-style: normal;
        font-weight: 500!important;
        font-size: 20px!important;
        line-height: 26px!important
    }

    body .vib-v2-text-banner.white a.vib-v2-more-detail-banner:hover:after {
        filter: invert(1)!important
    }

    .vib-v2-all-card-home .vib-v2-box-card-home {
        height: 123px!important
    }

    body#content .vib-v2-section-banner-home .swiper-slide {
        background-size: cover!important;
        height: 380px!important
    }

    .vib-v2-box-card-home a span:before {
        bottom: -29px!important
    }

    .vib-v2-text-banner.white .vib-v2-more-detail-banner:hover {
        color: #fff
    }
}

@media (min-width: 1024px) {
    .vib-v2-section-banner-home .bx-pager {
        display:block;
        position: absolute;
        right: 0;
        text-align: center;
        padding: 0 0 20px 0;
        height: 28px
    }

    .vib-v2-section-banner-home .vib-v2-wrapper_new {
        height: 100%
    }

    .vib-v2-section-banner-home .vib-v2-wrapper_new .vib-v2-text-banner {
        top: 50%!important;
        left: 0;
        transform: translateY(-50%)
    }

    body .vib-v2-text-banner.white a.vib-v2-more-detail-banner:hover:after {
        background: var(--icon-Angle_right_orange) center center no-repeat;
        background-size: 20px
    }

    body .vib-v2-text-banner.white .vib-v2-btn-dk01:hover {
        color: #000
    }

    body .vib-v2-text-banner.white .vib-v2-btn-dk01:hover:before {
        opacity: 1
    }

    body .vib-v2-text-banner.white .vib-v2-btn-dk01:before {
        background: #fff;
        opacity: 0;
        transition: all 0.5s ease;
        z-index: -1
    }

    body#content .vib-v2-section-banner-home .vib-v2-wrapper_new a.vib-v2-more-detail-banner.white:hover {
        color: var(--color-dard-orange)
    }

    body#content .vib-v2-section-banner-home .vib-v2-wrapper_new a.vib-v2-more-detail-banner.white:hover:after {
        background: var(--icon-Angle_right_orange) center center no-repeat;
        background-size: 20px
    }

    .vib-v2-text-banner.white .vib-v2-more-detail-banner:hover {
        color: var(--color-dard-orange)
    }

    .vib-v2-btn-dk01.bkg-color-orange:hover {
        background: #000;
        color: #fff
    }

    .swiper-slide a.vib-v2-btn-dk01:hover::before {
        border: 0
    }

    .vib-v2-more-detail-banner:hover {
        color: #000
    }
}

@media (max-width: 767px) {
    body .vib-v2-section-banner-home .vib-v2-wrapper_new .vib-v2-text-banner {
        padding-right:0!important
    }

    body .vib-v2-section-banner-home .swiper-slide {
        height: auto!important
    }

    body .vib-v2-section-banner-home .swiper-slide .vib-v2-wrapper_new .vib-v2-text-banner {
        width: 100%;
        max-width: 100%;
        text-align: center;
        top: initial!important;
        transform: initial!important;
        margin-top: 40px;
        padding-bottom: 43px!important
    }

    body .vib-v2-text-banner .vib-v2-fz-title-banner p {
        font-style: normal;
        font-weight: 600!important;
        font-size: 30px!important;
        line-height: 40px!important;
        text-align: center
    }

    body .vib-v2-text-banner .vib-v2-fz-title-product p {
        font-style: normal;
        font-weight: 500!important;
        font-size: 18px!important;
        line-height: 28px;
        text-align: center;
        margin-top: 10px
    }

    .bx-wrapper .bx-pager.bx-default-pager a {
        background: #fff
    }

    .left-background-color {
        position: relative!important;
        width: 100%!important;
        height: auto;
        padding: 40px 20px 0 20px
    }

    .vib-v2-section-banner-home .bx-controls {
        bottom: 264px!important
    }

    .vib-v2-section-banner-home .swiper-slide .vib-v2-text-banner:after {
        background-image: url(../img/arrow-down-white.svg)!important
    }
}

@media (min-width: 1600px) and (max-width:1800px) {
    body .vib-v2-section-banner-home .vib-v2-wrapper_new .vib-v2-text-banner {
        width:45%;
        max-width: 100%
    }

    .left-background-color {
        width: 46%;
        display: none
    }

    .right-background-image {
        width: 100%
    }
}

@media (min-width: 1800px) and (max-width:1999px) {
    .left-background-color {
        width:58%;
        display: none
    }

    .right-background-image {
        width: 100%
    }
}

@media (min-width: 2000px) {
    .left-background-color {
        width:62%;
        display: none
    }

    .right-background-image {
        width: 100%
    }
}

@media (min-width: 1000px) and (max-width:1146px) {
    .vib-v2-section-banner-home .bx-controls {
        bottom:0!important;
        width: 980px
    }

    .vib-v2-section-banner-home .bx-controls-direction {
        display: block!important
    }
}

@media (max-width: 580px) {
    body .vib-v2-section-banner-home .swiper-slide .vib-v2-wrapper_new .vib-v2-text-banner {
        margin-top:0
    }

    body .vib-v2-text-banner .vib-v2-fz-title-banner p {
        margin-bottom: 10px;
        font-size: 28px;
        margin: 0
    }
}

@media (min-width: 320px) and (max-width:480px) {
    .left-background-color {
        padding-top:30px
    }
}

@media only screen and (min-width: 1024px) {
    .vib-v2-text-banner {
        width:100%
    }

    .vib-v2-text-banner-top {
        width: 100%
    }

    .vib-v2-section-banner-home .bx-controls {
        position: relative;
        width: 1110px;
        z-index: 5;
        margin: 0 auto
    }
}

@media (max-width: 850px) and (min-width:768px) {
    .vib-v2-section-banner-home .bxslider .swiper-slide {
        background-position:-450px!important;
        background-position: -450px!important
    }

    .vib-v2-banner-debit {
        background-position: -450px!important;
        background-position: -450px!important
    }

    .vib-v2-banner-debit-mobile {
        background-position: -450px!important;
        background-position: -450px!important
    }

    .vib-v2-section-banner-about {
        background-position: -450px!important;
        background-position: -450px!important
    }
}

@media (min-width: 768px) and (max-width:1024px) {
    .vib-v2-section-banner-home .bx-pager {
        display:block;
        position: absolute;
        width: 100%;
        right: 0;
        text-align: left;
        padding: 0 0 15px 0;
        text-align: center;
        height: 30px
    }

    .right-background-image {
        background-position: 60% center
    }

    body .vib-v2-section-banner-home .vib-v2-wrapper_new .vib-v2-text-banner {
        top: 47%!important
    }
}

@media (min-width: 1024px) and (max-width:1280px) {
    body .vib-v2-section-banner-home {
        height:auto
    }

    body .vib-v2-section-banner-home .swiper-slide {
        height: 400px!important;
        background-position-x: 0
    }

    body .vib-v2-text-banner .vib-v2-fz-title-banner p {
        font-size: 30px!important
    }

    .vib-v2-section-banner-home .bx-controls-direction {
        bottom: 75px
    }
}

@media only screen and (max-width: 767px) {
    .vib-v2-section-banner-home {
        opacity:0
    }
}

.slide-1 .right-background-image {
    background-image: url('./image/home-desktop-vn.webp');
}
.slide-2 .right-background-image {
    background-image: url('./image/desktop-b-c.webp');
}
.slide-3 .right-background-image {
    background-image: url('./image/Landing-mort-apr.webp');
}
.slide-4 .right-background-image {
    background-image: url('./image/dien-nuoc-wifi.webp');
}
.slide-5 .right-background-image {
    background-image: url('./image/d.webp');
}

@media (max-width: 767px) {
    .slide-1 .right-background-image {
      background-image: url('./image/all-mobile-vn.webp');
    }
    .slide-2 .right-background-image {
      background-image: url('./image/mobile-b-c.webp');
    }
    .slide-3 .right-background-image {
        background-image: url('./image/landing-mort-mobile+1.webp');
    }
    .slide-4 .right-background-image {
        background-image: url('./image/dien-nuoc-wifi+mobile.webp');
    }
    .slide-5 .right-background-image {
        background-image: url('./image/m.webp');
    }
}