.swiper-container { display: flex; justify-content: center; flex-direction: column; text-align: center; } .swiper { border-radius: 15px; color: white; width: 100%; height: 315px; } .swiper-slide { text-align: center; font-size: 18px; width: 100%; display: flex; justify-content: center; align-items: center; } .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .swiper-button-next, .swiper-button-prev { color: #2ebead !important; } .swiper-lightbox { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.8); backdrop-filter: blur(4px); } .swiper-lightbox-content { margin: 5% auto; max-width: 90vw; max-height: 80vh; object-fit: contain; } .swiper-lightbox__close { position: absolute; top: 20px; right: 35px; color: white; font-size: 40px; font-weight: bold; cursor: pointer; z-index: 10000; } .swiper-lightbox__close:hover, .swiper-lightbox__close:focus { color: #bbb; text-decoration: none; cursor: pointer; } @keyframes zoom { from { transform: scale(0); } to { transform: scale(1); } } @media (max-width: 800px) { .swiper { width: 90vw; height: 45vw; } }