.Flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    border: solid 0px green;
}

.Flex-item {
    display: inline-block;
    width: 22%;
    padding: 0.3vw;
    margin: 1vw 1.2% 1.5vw 1.1%;
    border-radius: 5px;
    background-color: transparent;
    border: solid 0px red;
}

.Box-titolo {
    text-align: left;
    font-weight: bold;
    font-size: 1.0vw;
    margin-top: 0.3vw;
    margin-bottom: 0px;
}

.Box-data {
    text-align: left;
    font-weight: normal;
    font-size: 1vw;
    font-style: italic;
    margin-top: 0.3vw;
    margin-bottom: 0px;
}

.Box-testo  {
    text-align: left;
    font-weight: normal;
    font-size: 0.8vw;
    font-style: normal;
    text-align: justify;
    margin-top: 0.3vw;
    margin-bottom: 0px;
}
.Box-autore {
    text-align: left;
    font-weight: normal;
    font-size: 0.8vw;
    font-style: normal;
    margin-top: 0.3vw;
    margin-bottom: 0px;
}

.Logo {
    width: 70%;
}


@media only screen and (orientation: portrait) {

    /* For mobile phones: */
    .Flex-container {
        width: 95%;
        margin: auto;
    }

    .Flex-item {
        display: inline-block;
        flex: 100%;
        margin: 10vw 0vw 0vw 0vw;
    }

    .Box-titolo {
        font-size: 4vw;
        line-height: 5vw;
    }

    .Box-data {
        font-size: 4vw;
        margin-top: 2vw;
    }

    .Box-testo {
        font-size: 3vw;
        line-height: 4vw;
        margin-top: 2vw;
    }
    .Box-testo-big {
        font-size: 4vw;
        line-height: 5vw;
        margin-top: 2vw;
    }

    .Box-autore {
        font-size: 2.5vw;
        margin-top: 2vw;
    }

    .Logo {
        width: 40%;
    }

}