:root {
--logo-slider-speed: 3000ms;
--logo-slider-items: 5;
--logo-slider-color: #333;
--logo-slider-bg: #fff;
--logo-slider-border-color: #ddd;
--logo-slider-border-radius: 16px;
--logo-slider-padding: 20px 40px;
--logo-slider-item-width: 200px;
}
.logo-slider-container {
padding: var(--logo-slider-padding);
position: relative;
}
.logo-slider .swiper-slide {
display: flex;
justify-content: center;
align-items: center;
padding: 10px;
}
.logo-item {
background-color: var(--logo-slider-bg);
border: 1px solid var(--logo-slider-border-color);
border-radius: var(--logo-slider-border-radius);
padding: 10px;
width: var(--logo-slider-item-width);
height: var(--logo-slider-item-width);
display: flex;
justify-content: center;
align-items: center;
}
.logo-item img {
width: 70%;
height: auto;
transition: transform 0.3s ease;
}
.logo-item:hover img {
transform: scale(1.05);
}
.logo-slider .swiper-button-next,
.logo-slider .swiper-button-prev {
color: var(--logo-slider-color);
background-color: #e9e9e9;
padding: 20px;
}
.swiper-button-next:after, .swiper-button-prev:after {
font-size: 20px !important;
} @media (max-width: 768px) {
.logo-slider-container {
padding: 10px 30px;
}
}