.post-carousel-10 {
position: relative;
}
.post-carousel-10 .slider-content .thumbnail-container img {
width: 100%;
height: 100%;
object-fit: cover;
} .post-carousel-10 .swiper-nav {
z-index: 9;
position: relative;
}
.post-carousel-10 .swiper-nav .swiper-nav-button { cursor: pointer;
}
.post-carousel-10 .carousel-items .swiper-pagination {
position: relative;
}
.post-carousel-10 .swiper-progress-bar {
z-index: 999;
position: absolute;
}
.post-carousel-10 .swiper-progress-bar .slide_progress-bar {
position: absolute;
width: auto;
clear: both;
opacity: 0;
left: 0;
right: 0;
margin-right: 10px;
width: 90%;
}
.post-carousel-10 .swiper-progress-bar .slide_progress-bar span {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 0;
content: "";
transition: 0.1s width linear;
}
.post-carousel-10 .swiper-progress-bar.active .slide_progress-bar {
opacity: 1;
}
.post-carousel-10 .swiper-progress-bar.animate .slide_progress-bar span {
transition: width linear;
transition-delay: unset;
width: 100%;
}
.post-carousel-10.is-ltr .swiper-nav-button {
transform: rotateY(180deg);
}
@media (max-width: 767px) {
.post-carousel-10 .carousel-items .swiper-container div.swiper-nav {
margin: 0;
}
.post-carousel-10 .slider-meta > div {
width: 100%;
}
.post-carousel-10 .slider-content {
flex-direction: column !important;
}
.post-carousel-10 .swiper-nav {
width: 100% !important;
height: initial;
margin-top: 15px;
}
.post-carousel-10 .slider-content .thumbnail-container {
margin-left: 0;
width: 100% !important;
height: 245px;
}
.post-carousel-10 .slider-content .content-container {
width: 100% !important;
max-height: initial;
margin-top: 15px;
}
.post-carousel-10 .swiper-controller-wrapper {
width: initial !important;
height: 0;
margin-left: 0;
}
.post-carousel-10 .post-footer-container {
width: 100% !important;
flex-wrap: wrap;
justify-content: center;
}
.post-carousel-10 .post-footer-container span {
display: block;
width: 100%;
text-align: center;
margin-top: 3px;
}
.post-carousel-10 .swiper-progress-bar {
width: 100% !important;
top: 40%;
bottom: initial;
margin-right: 10px;
}
}
@media (max-width: 575px) {
.post-carousel-10 .swiper-progress-bar {
top: 35%;
margin-right: 5px;
}
}