/* Customized error/warning/alerts */

.message {
    position: fixed;
    width: auto;
    min-width: 20%;
    margin-top: 0.9rem;
    top: 0.9rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.3rem 1rem;
    border: 1px solid;
    border-radius: 0.2rem;
    font-size: 1.1rem;
    z-index: 9999;
    transition: all 0.8s ease;
    opacity: 0;
}

@media (max-width:767px) {
    .message {
        width: 90%;
    }
}

@media (min-width:768px) {
    .message {
        width: 70%;
    }
}

@media (min-width:992px) {
    .message {
        width: auto;
        max-width: 80%;
    }
}

.message-error {
    color: rgb(132, 32, 41);
    background-color: rgb(248, 215, 218);
    border-color: rgb(245, 194, 199);
}

.message-warning {
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;
}

.message-info {
    color: #084298;
    background-color: #cfe2ff;
    border-color: #b6d4fe;
}

.message-success {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}

/* Customized error/warning/alerts */