/* Estilos básicos para los botones */
.nuevoBotonCard {
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 150px;
    min-height: 150px;
    max-width: 250px;
    min-width: 250px;
    width: 100%; /* Ancho completo dentro del padre */
    margin: 10px; /* Espacio entre botones */
    padding: 10px;
    border: 1px solid #FFFFFF; /* Borde blanco */
    font-size: 18px; /* Tamaño de fuente ajustado */
    text-align: center;
    background-color: rgba(255, 255, 255, 0.5); /* Fondo semitransparente */
    border-radius: 10px; /* Bordes redondeados */
    transition: transform 0.3s, box-shadow 0.3s, background-color 0.3s;
    color: #8f57ac;
    border: #8f57ac 2px solid;
}

.nuevoBotonCardPadre a {
    text-decoration: none;
}

.nuevoBotonCard:hover, .nuevoBotonCard:active {
    transform: scale(1.05);
    box-shadow: 0px 0px 15px 3px rgba(255, 255, 255, 0.6);
    background-color: #8f57ac; /* Cambiar el fondo a morado al pasar el mouse y hacer clic */
    color: white;
}

.nuevoFondoBotones {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 20px;
    max-width: 1200px; /* Ancho máximo para el contenedor */
    margin: auto; /* Centrar el contenedor */
}

@media (max-width: 768px) {
    .nuevoBotonCard {
        height: 120px; /* Altura más pequeña para dispositivos móviles */
        font-size: 16px; /* Tamaño de fuente más pequeño para móviles */
    }
}