
/* ------------------------------ BULLETS ------------------------------ */

.path-frontpage .main-container .swiper .swiper-pagination {
    bottom: .75rem;
}
.path-frontpage .main-container .swiper .swiper-pagination-bullet { 
    background-color: #fff; 
    opacity: .25; 
    width: 10px;
    height: 10px;
    margin: 0 .25rem;
}
.path-frontpage .main-container .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active { 
    background-color: #fff; 
    opacity: .75; 
    width: 10px; 
    height: 10px;
}
.path-frontpage .main-container .swiper .swiper-pagination-bullet:not(.swiper-pagination-bullet-active):hover { opacity: 1; }


/* ------------------------------ ARROWS ------------------------------ */

.path-frontpage .main-container .swiper .swiper-button-next,
.path-frontpage .main-container .swiper .swiper-button-prev {
    width: 2.5rem;
    height: 2.5rem;
    bottom: 0.3rem;
    top: unset;
    transform: none;
}
.path-frontpage .main-container .swiper .swiper-button-next { right: 1rem; }
.path-frontpage .main-container .swiper .swiper-button-prev { left: 1rem; }

.path-frontpage .main-container .swiper .swiper-button-next::after,
.path-frontpage .main-container .swiper .swiper-button-prev::after {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    border: 1px solid var(--blue);
    position: absolute;
    top: 0;
    left: 0;
    opacity: .75;
}
.path-frontpage .main-container .swiper .swiper-button-next:hover::after,
.path-frontpage .main-container .swiper .swiper-button-prev:hover::after { 
    opacity: 1; 
    background-color:rgb(46, 159, 251, .2)
}

.path-frontpage .main-container .swiper .swiper-button-next::before,
.path-frontpage .main-container .swiper .swiper-button-prev::before {
    content: '';
    background-color: #fff;
    padding: 1rem;
    display: block;
    clip-path: polygon(35% 50%, 60% 66.66%, 60% 33.33%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
}

.path-frontpage .main-container .swiper .swiper-button-next::before {
    transform: scaleX(-1);
}
