.alert{
    position: sticky;
    max-width: 100%;
    border-radius:20px;
    overflow:hidden;
    font-family:Arial, sans-serif;
    box-shadow:0 0 15px rgba(0,0,0,.3);
    margin: 20px;
    animation: animacion 3s ease-in-out;
}

.alert-top{
    background:#4ade80;
    color:white;
    padding:10px 22px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:20px;
    font-weight:bold;
}

.close{
    width:28px;
    height:28px;
    border-radius:50%;
    background:rgba(0,0,0,.25);
    display:flex;
    justify-content:center;
    align-items:center;
    color:white;
    cursor:pointer;
    font-size:20px;
    user-select: none;
}

.alert-body{
    background:#064e3b;
    color:#d1fae5;
    padding:10px 22px;
    line-height:1.7;
    font-size:20px;
}


.ocultar{
    opacity: 0;
    display: none;
}

@keyframes animacion{
    from {
        transform: translateX(-150%);
        filter: blur(4px);
    }

    to {
        transform: translateX(0);
    }
}