.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: var(--swiper-navigation-top-offset,50%);
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color,var(--swiper-theme-color));
}

.bac {
    width: 50px;
    height: 50px;
}

.mainDiv {
    position: relative;
    height: 100%;
    padding: 0px;
}

.swiper-wrapper {
        display: flex;
        align-items: center;
}

.swiper-button-next::after,
.swiper-button-prev::after {
    content: "";
}

.swiper-button-next,
.swiper-button-prev {
    height: 24px;
    width: 24px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.06), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.swiper-slide:nth-child(n) {
    width: 70%;
}

.swiper-slide:nth-child(2n) {
    width: 70%;
}

.swiper {
    width: 100%;
    height: 100%;
    margin-left: unset;
    margin-right: unset;
}

@media (min-width: 768px) {
    .mainDiv {
        position: relative;
        height: 100%;
        padding: 20px;
        width: 100%;
    }

    .swiper-button-next,
    .swiper-button-prev {
        height: 32px;
        width: 32px;
        box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.06), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
    }

    .swiper-slide:nth-child(n) {
        width: 40%;
    }

    .swiper-slide:nth-child(2n) {
        width: 40%;
    }

    .swiper-slide:nth-child(3n) {
        width: 40%;
    }
}

@media (min-width: 1536px) {
    .mainDiv {
        position: relative;
        height: 100%;
        padding: 40px;
        width: 100%;
    }

    .swiper-button-next,
    .swiper-button-prev {
        height: 32px;
        width: 32px;
        box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.06), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
    }
}

.swiper-slide {
    text-align: left;
    font-size: 18px;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide img {
    object-fit: cover;
}