.didascalia {
    text-align: left;
    border-bottom: 1px solid black;
    font-size: 90%;
    padding: 5px 0 2px 0px;
}


/* *** MEDIA QUERY *** */
@media (min-width: 1200px) {
    .mt-marco-s04 { margin-top: 75px; }
    .mt-marco-s06 { margin-top: 140px; }
    .mt-marco-s09 { margin-top: 275px; }  
    .mt-marco-s10 { margin-top: 465px; }
    .mt-marco-s18 { margin-top: 145px; }
    .mt-marco-s23 { Margin-top: 300px; }
}


/* *** FINE MEDIA QUERY *** */


/*
* ==========================================
* STILI PER LA TIMELINE
* ==========================================
*/


/* Timeline holder */
ul.timeline {
    list-style-type: none;
    position: relative;
    padding-left: 1.5rem;
}

    /* Timeline vertical line */
    ul.timeline:before {
        content: ' ';
        background: rgb(105,27,37); /*#fff*/
        display: inline-block;
        position: absolute;
        left: 16px;
        width: 4px;
        height: 100%;
        z-index: 0; /*400*/
        border-radius: 1rem;
    }

li.timeline-item {
    margin: 20px 0;
    text-align: justify;
    font-size:85%;
}

/* Timeline item arrow */
/* per arrivare questa freccia accanto al pallino scrivere: <div class="timeline-arrow"></div>, sotto a: timeline-item */
/*.timeline-arrow {
    border-top: 0.5rem solid transparent;
    border-right: 0.5rem solid #fff;
    border-bottom: 0.5rem solid transparent;
    display: block;
    position: absolute;
    left: 2rem;
}*/

/* Timeline item circle marker */
    li.timeline-item::before {
        content: ' ';
        background: rgb(105,27,37);
        display: inline-block;
        position: absolute;
        border-radius: 50%;
        border: 3px solid #fff;
        left: 11px;
        width: 14px;
        height: 14px;
        z-index: 0; /*400*/
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        margin-top: 5px;
    }