.reverse-sliders-container {
display: flex;
flex-direction: row;
margin: 0 auto;
overflow: hidden;
gap: 20px;
pointer-events: none;
}
.reverse-sliders-container .reverse-slider-top,
.reverse-sliders-container .reverse-slider-bottom {
width: calc(50% - 10px);
max-height: 762px;
overflow: hidden;
position: relative;
pointer-events: none;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}
.reverse-sliders-container .reverse-slider-top .swiper-wrapper,
.reverse-sliders-container .reverse-slider-bottom .swiper-wrapper {
height: 100%;
transition-timing-function: linear !important;
will-change: transform;
pointer-events: none;
}
.reverse-sliders-container .swiper-slide {
width: 285px;
height: 330px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border-radius: 5px;
transition: transform 0.2s;
pointer-events: none;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
cursor: default;
} .reverse-sliders-container .swiper-container {
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
} @media (max-width: 1279px) {
.reverse-sliders-container .reverse-slider-top,
.reverse-sliders-container .reverse-slider-bottom {
width: 100%;
}
.about-double-slider__text {
max-width: 49% !important;
}
.reverse-sliders-container .swiper-slide {
width: 100%;
height: 300px;
}
}
@media (max-width: 1023px) {
.reverse-sliders-container {
gap: 12px;
}
.reverse-sliders-container .swiper-slide {
width: 100%;
height: 250px;
}
}
@media (max-width: 767px) {
.about-double-slider__text,
.double-slider__left-info {
max-width: 100% !important;
}
.reverse-sliders-container .reverse-slider-top,
.reverse-sliders-container .reverse-slider-bottom {
max-height: 508px !important;
}
.reverse-sliders-container .swiper-slide {
width: 100%;
height: 350px;
}
.double-slider__container {
position: relative;
}
.double-slider__container::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
box-shadow: inset 0px 30px 25px 0px #262626,
inset 0px -30px 25px 0px #262626;
z-index: 9980;
}
}
@media (max-width: 550px) {
.reverse-sliders-container .swiper-slide {
width: 100%;
height: 250px;
}
}
@media (max-width: 374px) {
.reverse-sliders-container .swiper-slide {
height: 185px;
}
.reverse-sliders-container {
gap: 5px;
}
}