@charset "UTF-8";


/* Slideshow Styles */

/* Stile per il container principale della slideshow */
.swiper-container.mia-slideshow {
    height: 100vh !important;  /* Questa è solo un'esempio di altezza. Puoi modificare in base alle tue esigenze. */
    width: 100% !important; /* Assicura che la slideshow copra l'intera larghezza del suo contenitore */
}

/* Stile per ciascuna slide */
.swiper-slide {
    display: flex !important; /* Usa flexbox per il posizionamento dei contenuti */
    align-items: center !important;     /* Allinea i contenuti al centro verticalmente */
    justify-content: center !important; /* Allinea i contenuti al centro orizzontalmente */
    height: 100%; /* Si estende sull'intera altezza del contenitore */
    background-size: cover !important;  /* Garantisce che l'immagine copra la slide */
    background-position: center !important; /* Centra l'immagine di sfondo */
}

/* Stile per il contenuto all'interno di ciascuna slide */
.slide-content {
    text-align: left !important; /* Centra il testo orizzontalmente */
    max-width: 80% !important; /* Limita la larghezza del contenuto, puoi modificarlo a tuo piacimento */
    padding: 20px !important; /* Spazio intorno al contenuto del testo */
/*    background-color: rgba(0, 0, 0, 0.5) !important;  Fornisce un leggero sfondo scuro per migliorare la leggibilità del testo */
    border-radius: 10px !important; /* Arrotonda gli angoli del contenitore del testo, opzionale */
}

/* Stile per il titolo */
.slide-content h2 {
    margin: 0 0 20px !important; /* Distanza tra il titolo e il paragrafo */
    color: #ffffff !important; /* Colore del testo */
	font-family: "Nouvelle Vague", Sans-serif;
    font-size: 65px;
    font-weight: 400;
}

/* Stile per il paragrafo */
.slide-content p {
    margin: 0 !important; /* Rimuove margini aggiuntivi */
    color: #ffffff !important; /* Colore del testo */
	font-family: "Roboto", Sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 2em;
}


/* Se vuoi personalizzare ulteriormente gli stili di navigazione (prev/next e pagination) di Swiper, puoi farlo qui. */

/* Stile per il pulsante all'interno della slide */
.slide-content .mia-slide-button {
    display: inline-block;
    padding: 10px 20px;
    margin-top: 20px;
    background-color: #f00; /* Cambia colore di sfondo a piacere */
    color: #fff; /* Colore del testo */
    text-decoration: none; /* Rimuove sottolineatura */
    border-radius: 5px; /* Arrotonda gli angoli */
    transition: background-color 0.3s; /* Effetto di transizione al passaggio del mouse */
}

.slide-content .mia-slide-button:hover {
    background-color: #d00; /* Colore di sfondo al passaggio del mouse */
}

.slide-content {
    opacity: 0; /* Imposta l'opacità iniziale a 0, così GSAP può animarlo */
    /* ... il resto del tuo codice CSS ... */
}