body {
    background-image: url('https://marketing.udla.edu.ec/app/landings/wp-content/uploads/2023/05/Mesa-de-trabajo-1-copy-4.png');
    color: #2B2B2B;
    display: flex;
    justify-content: center;
    align-items: center;
}

.card {
    max-width: 100%;
    width: 100%; /* Cambiar el ancho del card según tus preferencias */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Agregar sombra al card */
    background-color: rgba(255, 255, 255, 0.8); /* Fondo semi-transparente */
}

.hidden {
    display: none;
}

.form-label {
    color: #000000; /* Color del texto de los labels */
}

.form-control {
    background-color: #ffffff; /* Fondo blanco */
    color: #000000; /* Texto negro */
    border: 1px solid #ced4da; /* Borde */
    border-radius: 4px; /* Bordes redondeados */
    padding: 10px; /* Espaciado interno */
    box-shadow: none; /* Sin sombra */
    transition: border-color 0.3s, box-shadow 0.3s; /* Transición para efectos */
}

.form-control:focus {
    border-color: #80bdff; /* Color de borde en foco */
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); /* Sombra en foco */
}

/* Opcional: Estilo para el botón */
.btn-primary {
    background-color: #007bff; /* Fondo azul */
    border: none; /* Sin borde */
    padding: 10px 20px; /* Espaciado interno */
    border-radius: 4px; /* Bordes redondeados */
    transition: background-color 0.3s, box-shadow 0.3s; /* Transición para efectos */
}

.btn-primary:hover {
    background-color: #0056b3; /* Fondo azul oscuro en hover */
    box-shadow: 0 0 10px rgba(0, 123, 255, 0.25); /* Sombra en hover */
}