h1 {
    margin-bottom: 0;
}

div.foto-con-testo {
    padding: 20px 0;
}

span.distanza {
    font-family: "Montserrat";
    font-size: 0.5em;
    color: rgb(88, 88, 88);
}


.foto-con-testo .griglia {
    width: var(--wrap);
    display: flex;
    overflow-x: scroll;
    /* justify-content: space-between; */
    align-items: center;
    gap: 10px;
    /* padding: 10px 5% 10px; */
    scroll-snap-type: x mandatory;
    margin-left: auto;
    margin-right: auto;
}

.foto-con-testo .griglia img {
    /* flex: 0 0 auto; */
    width: 100%;
    height: auto;
    /* border-radius: 8px; */
    scroll-snap-align: start;
}






/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */


@media (min-width: 481px) and (max-width: 820px) {
    /*   TABLET - TABLET - TABLET - TABLET - TABLET   */

    .foto-con-testo .griglia {
        width: var(--wrap);
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 20px 2%;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin-left: auto;
        margin-right: auto;

    }

    .foto-con-testo .griglia img {
        width: 49%;
        height: auto;
        /* margin: 20px auto 0 auto; */

    }


    /*   TABLET */

}


/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */
/* ############################################################ */


@media (min-width: 821px)
/* and (max-width: 1280px) */
    {
    /* ! DESKTOP PICCOLO - DESKTOP PICCOLO - DESKTOP PICCOLO */

    .foto-con-testo .griglia {
        width: var(--wrap);
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 20px 2%;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin-left: auto;
        margin-right: auto;

    }

    .foto-con-testo .griglia img {
        width: 32%;
        height: auto;
        /* margin: 20px auto 0 auto; */

    }


}