/*******************
    Messages
*******************/
.fixed-messages {
    position: fixed;
    bottom: 5vh;
    right: 0;
    z-index: 999;
}
.fixed-messages .fixed-message {
    display: none;
    width: max-content;
}
.fixed-message.active {
    display: block;
    animation: fade_in_show 2s;
    @keyframes fade_in_show {
        0% {
            opacity: 0;
            transform: scale(0.8)
        }

        100% {
            opacity: 1;
            transform: scale(1)
        }
    }
}



.close-message {
    border: none;
    background: var(--tertiary);
    height: 1.5em;
    border-radius: 25px;
}

/***************************** Messages *****************************/
.form-message {
    margin-top: 0.5em;
    padding: 0.5em 1em;
}
.form-message i {
    margin-right: 0.5em;
    font-size: 0.8em;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.6em;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
}
.form-message.error {
    color: #b30000 !important;
    background: rgba(179, 0, 0, 0.3);
}
.form-message.error.solid {
    background: #ff9b9b;
}
.form-message.error::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 0.5em;
    color: #b30000;
    content: "\f057";
}
.form-message.success, .form-message.info {
    color: #797979;
    background: rgba(52, 163, 0, 0.3);
}
.form-message.success.solid, .form-message.info.solid {
    background: #98dd77;
}
.form-message.success::before, .form-message.info::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 0.5em;
    color: #34a300;
    content: "\f00c";
}
.form-error {
    color: #b30000;
}