ul.mod-dialogue {
padding: 0.5em;
}

ul.mod-dialogue li {
animation-name: fadeinout;
animation-fill-mode: both;
list-style-type: none;
padding-bottom: 1.3em;
}

ul.mod-dialogue li:last-of-type {
animation-name: fadein;
}

.persona {
color: #99c383;
color: var(--picnic-green);
font-family: var(--font-family-sans-serif);
font-size: 1.1em;
}

header.persona:after{
content: ":";
}

p.speech {
color: whitesmoke;
font-family: var(--font-family-serif);
font-size: 1.3em;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    12% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeinout {
    0% {
        opacity: 0;
    }
    12% {
        opacity: 1;
    }
    82% {
        opacity: 1;
    }
    100% {
        opacity: 0.6;
    }
}