#flores-container {
    position: relative; /* Cambia a relative para que no se superponga con el contenido */
    width: 100%;
    height: 200px; /* Altura fija para mostrar la animación y el mensaje */
    overflow: hidden; /* Oculta el desbordamiento */
    pointer-events: none;
}

/* Estilo para las flores */

.flor {
position: absolute;
width: 20px; /* Tamaño de las flores */
height: 20px;
background-color: rgb(240, 198, 12); /* Cambia el color a rojo (#ff0000) */
border-radius: 50%; /* Forma de flores redondas */
}


@keyframes caida {
    to {
        transform: translateY(100vh); /* 100vh es la altura de la ventana */
    }
}

/* Estilo para el mensaje de festividad */
#festividad-msg {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgba(83, 10, 218, 0.8);
    padding: 5px;
    border-radius: 5px;
    font-weight: bold;
    display: none;
}