.messaggi-sistema {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
}
.messaggi-sistema .messaggio {
    min-width: 290px;
    max-width: calc(100vw / 3);
    width: 100vw;
    position: absolute;
    top: 0;
    right: -314px;
    margin: 10px 0;
    color: #fff;
    padding: 5px 5px 20px 10px;
    border: 1px solid #fff;
    cursor: pointer;
}
.messaggi-sistema .messaggio.ok {
    background-color: #49aa19;
}
.messaggi-sistema .messaggio.error {
    background-color: #a61d24;
}
.messaggi-sistema .messaggio.warning {
    background-color: #d89614;
}
.messaggi-sistema .messaggio.info {
    background-color: #177ddc;
}
.messaggi-sistema .messaggio .chiudi {
    text-align: right;
}
.messaggi-sistema .messaggio .dettagli {
    display: grid;
    grid-template-columns: 30px calc(100% - 30px);
    align-items: center;
}
.messaggi-sistema .messaggio .dettagli .tipo {
    font-size: 25px;
}
.messaggi-sistema .messaggio .dettagli .testo {
    margin-left: 10px;
}
.messaggi-sistema .messaggio a {
    color: #fff;
    font-weight: 500;
}