.swiper-wrapper  { padding-top: 85px;
    height: 500px; }



/* Contenitore per centrare le frecce sotto lo slider */
.swiper-navigation-container {
  display: flex;
  justify-content: center;
  gap: 20px; /* Spazio tra le due frecce */
  margin-top: 30px; /* Distanza dallo slider */
  position: relative;
  width: 100%;
}

/* Stile base per entrambe le frecce */
.swiper-navigation-container .swiper-button-prev,
.swiper-navigation-container .swiper-button-next {
  position: relative; /* Sovrascrive l'absolute di default di Swiper */
  width: 50px;
  height: 50px;
  border: 1px solid #b32025; /* Colore rosso IWS */
  border-radius: 50%;
  background-color: white;
  margin: 0;
  top: auto;
  left: auto;
  right: auto;
}

/* Stile delle icone (frecce) all'interno dei cerchi */
.swiper-navigation-container .swiper-button-prev::after,
.swiper-navigation-container .swiper-button-next::after {
  font-size: 18px !important; /* Dimensione della freccia */
  color: #b32025 !important; /* Colore della freccia */
  font-weight: bold;
}

/* Effetto hover (opzionale, per interattivitą) */
.swiper-navigation-container .swiper-button-prev:hover,
.swiper-navigation-container .swiper-button-next:hover {
  background-color: #f9f9f9;
}



/* Stile base per la slide (assicurati che abbia una transizione fluida) */
.swiper-slide.ombra {
    transition: background-color 0.3s ease, color 0.3s ease;
    background-color: #ffffff; /* Sfondo iniziale bianco */
    cursor: pointer;
}

/* Effetto Hover sulla slide */
.swiper-slide.ombra:hover {
    background-color: #c32130 !important;
}

/* Cambio colore del testo al passaggio del mouse */
.swiper-slide.ombra:hover .sottotitolo,
.swiper-slide.ombra:hover .nero,
.swiper-slide.ombra:hover div {
    color: #ffffff !important;
}

/* Rendere l'icona PNG bianca al passaggio del mouse usando i filtri CSS */
.swiper-slide.ombra:hover img {
    filter: brightness(0) invert(1) !important;
}

/* Opzionale: Transizione fluida per l'icona */
.swiper-slide.ombra img {
    transition: filter 0.3s ease;
}



@media (max-width:767px) {

.mySwiper  { width: 100%; height: auto; }
.swiper-slide { text-align: center; font-size: 18px; background: #f5f5f5; display: flex; justify-content: center; align-items: center; height:685px; margin-top:-90px; }
.mySwiper .swiper-slide img { display: block; width: 100%; height: auto; object-fit: cover; }

.swiper3 .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; height:440px; }



.padding {padding:0 10px 0 10px;}
    
.swiper-button-next::after,
.swiper-button-prev::after {
    color: #0a0a0a !important;
    font-size: 30px !important;
    font-weight: bold;
}

}


@media(min-width:768px) and (max-width:991px) {



}


@media(min-width:992px) {

.mySwiper  { width: 100%; height: auto; }
.swiper-slide { text-align: center; font-size: 18px; background: #f5f5f5; display: flex; justify-content: center; align-items: center; height:670px; }
.mySwiper .swiper-slide img { display: block; width: 100%; height: auto; object-fit: cover; }

.swiper3 .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; height:440px; }



.padding {padding:0 10px 0 10px;}
    
.swiper-button-next::after,
.swiper-button-prev::after {
    color: #0a0a0a !important;
    font-size: 30px !important;
    font-weight: bold;
}

}


@media(min-width:1200px) {

.mySwiper  { width: 100%; height: auto; }
.swiper-slide { text-align: center; font-size: 18px; background: #f5f5f5; display: flex; justify-content: center; align-items: center; height:840px; }
.mySwiper .swiper-slide img { display: block; width: 100%; height: auto; object-fit: cover; }

.swiper3 .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; height:440px; }



.padding {padding:0 10px 0 10px;}
    
.swiper-button-next::after,
.swiper-button-prev::after {
    color: #0a0a0a !important;
    font-size: 30px !important;
    font-weight: bold;
}


}



    

    