/* Container per la lista */
.medici-list-container {
    width: 100%;
    margin-bottom: 20px;
}

/* Stile per ogni singola riga (medico) */
.medici-row {
    display: flex;
    align-items: flex-start; /* Allinea gli elementi in alto */
    padding: 60px;
    margin-bottom: 10px;
    border-radius: 5px;
    padding-left:10%;
    padding-right: 10%;
}

/* Colori di sfondo alternati */
.medici-row.odd {
    background-color: #f0f0f0;
}

.medici-row.even {
    background-color: #fff;
}

/* La colonna dell'immagine (un quarto della larghezza) */
.medici-image-wrapper {
    flex: 0 0 25%; /* Non cresce, non si restringe, ha una base di 25% */
    max-width: 25%;
    padding-right: 20px;
}

.medici-image-wrapper img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* La colonna del contenuto (tre quarti della larghezza) */
.medici-content-wrapper {
    flex: 1; /* Occupa lo spazio rimanente */
    padding-left: 20px; /* Aggiungi spazio tra le due colonne */
}

/* Stile per i titoli e il testo */
.medici-content-wrapper h3 {
    margin: 0 0 5px 0;
    font-size: 1.5em;
}

.medici-specializzazione {
    font-style: italic;
    color: #777;
    margin-bottom: 10px;
}

.medici-bio p {
    margin: 0;
}

/* Per schermi più piccoli, impila le colonne */
@media (max-width: 768px) {
    .medici-row {
        flex-direction: column;
    }

    .medici-image-wrapper {
        flex: auto;
        max-width: 100%;
        padding-right: 0;
        margin-bottom: 15px;
    }
    
    .medici-content-wrapper {
        padding-left: 0;
    }
}