.banners-blocks .banners-blocks-wrapper .banner-block {
    height: 300px;
}
.banners-blocks .banners-blocks-wrapper .banner-block img {
    width: calc(100% - 20px);
    height: 300px;
    background-repeat: no-repeat;
    z-index: -1;
    object-fit: cover;
    object-position: center;
}
.banners-blocks .banners-blocks-wrapper .banner-block .banner-inner {
    height: 100%;
    background: #0000002b;
}

.d-abs {
    position: absolute;
}
.d-relative {
    position: relative;
}

#index .banners-blocks .banner-block .banner-inner .upper-title {
    font-family: var(--font-libre);
    font-weight: 600;
    font-size: 24px;
    line-height: 142%;
    letter-spacing: 0.04em;
    color: #fbfbfb;
    text-transform: capitalize;
}
#index .banners-blocks .banner-block .banner-inner .mid-title {
    font-family: var(--second-family);
    font-weight: 600;
    font-size: 24px;
    line-height: 108%;
    letter-spacing: 0.02em;
    text-transform: capitalize;
    color: #fff;
    background: unset;
    padding: unset;
    margin: unset;
}
#index .banners-blocks .banner-block .banner-inner a.btn-banner {
    font-family: var(--font-libre);
    font-weight: 600;
    font-size: 16px;
    line-height: 162%;
    letter-spacing: 0.03em;
    text-transform: capitalize;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: #fff;
    padding: unset;
}

#index .banners-blocks .banner-block:nth-child(1) .banner-inner .upper-title,
#index .banners-blocks .banner-block:nth-child(4) .banner-inner .upper-title {
    position: absolute;
    top: 118px;
    right: 75px;
    text-align: right;
}

#index .banners-blocks .banner-block:nth-child(1) .banner-inner a.btn-banner,
#index .banners-blocks .banner-block:nth-child(4) .banner-inner a.btn-banner  {
    position: absolute;
    bottom: 90px;
    right: 70px;
}

#index .banners-blocks .banner-block:nth-child(1) .banner-inner .mid-title,
#index .banners-blocks .banner-block:nth-child(4) .banner-inner .mid-title {
    position: absolute;
    top: 75px;
    right: 75px;
}

#index .banners-blocks .banner-block:nth-child(2) .banner-inner .upper-title,
#index .banners-blocks .banner-block:nth-child(5) .banner-inner .upper-title {
    position: absolute;
    top: 124px;
    text-align: center;
    width: fit-content;
}

#index .banners-blocks .banner-block:nth-child(2) .banner-inner a.btn-banner,
#index .banners-blocks .banner-block:nth-child(5) .banner-inner a.btn-banner{
    position: absolute;
    bottom: 72px;
    text-align: center;
    width: fit-content;
}

#index .banners-blocks .banner-block:nth-child(2) .banner-inner .mid-title,
#index .banners-blocks .banner-block:nth-child(5) .banner-inner .mid-title {
    position: absolute;
    top: 85px;
    text-align: center;
    width: fit-content;
}

#index .banners-blocks .banner-block:nth-child(3) .banner-inner .upper-title,
#index .banners-blocks .banner-block:nth-child(6) .banner-inner .upper-title {
    position: absolute;
    top: 175px;
    left: 65px;
    text-align: left;
    width: fit-content;
}

#index .banners-blocks .banner-block:nth-child(3) .banner-inner a.btn-banner,
#index .banners-blocks .banner-block:nth-child(6) .banner-inner a.btn-banner{
    position: absolute;
    top: 111px;
    left: 118px;
    text-align: left;
    width: fit-content;
}

#index .banners-blocks .banner-block:nth-child(3) .banner-inner .mid-title,
#index .banners-blocks .banner-block:nth-child(6) .banner-inner .mid-title,
#index .promo-products .product_items:nth-child(3) .product-description .discount-percentage,
#index .promo-products .product_items:nth-child(6) .product-description .discount-percentage {
    position: absolute;
    top: 228px;
    left: 106px;
    text-align: left;
    width: fit-content;
}

@media (min-width: 320px) and (max-width: 590px) {
    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner .upper-title,
    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner .upper-title {
        position: absolute;
        top: 118px;
        right: 75px;
        left: unset;
        text-align: right;
    }

    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner a.btn-banner,
    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner a.btn-banner  {
        position: absolute;
        bottom: 90px;
        right: 70px;
        top: unset;
        left: unset;
        text-align: right;

    }
    
    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner .mid-title,
    #index .banners-blocks .banners-blocks-wrapper .banner-block .banner-inner .mid-title {
        position: absolute;
        top: 75px;
        right: 75px;
        left: unset;
        text-align: right;
    }
}