:root {
    --swiper-navigation-size: 40px !important;
    --swiper-theme-color: #444444 !important;
}

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

#zoomSwiper .swiper-button-next, #zoomSwiper .swiper-button-prev {
    display: none;
    width: 40px !important;
    border: 1px solid #444444;
}

#zoomSwiper .swiper-button-next:hover, #zoomSwiper .swiper-button-prev:hover {
    --swiper-theme-color: #ed8003;
    border: 1px solid #ed8003;
}

#zoomSwiper .swiper-button-next:after, #zoomSwiper .swiper-button-prev:after {
    font-size: 20px !important;
}

@media (min-width: 1024px) {
    #zoomSwiper .swiper-button-next, #zoomSwiper .swiper-button-prev {
        display: flex;
    }
}

.swiper-slide {
    height: auto;
}

#mainImageSwiper {
    height: 80%;
    width: 100%;
}

#mediaGallerySwiper {
    height: 20%;
    box-sizing: border-box;
    padding: 10px 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    row-gap: 0.5rem;
}

#mediaGallerySwiper .swiper-slide {
    width: 25%;
    opacity: 0.4;
}

#mediaGallerySwiper .swiper-slide-thumb-active {
    opacity: 1;
}

#mediaGallerySwiper .swiper-pagination {
    position: relative;
    bottom: initial;
}