body, html {
    margin: 0;
    padding: 0;
    font-family: 'Avenir LT Std', Arial, sans-serif; /* Avenir como principal, Arial como fallback */
}

.menu-bar {
    position: fixed;
    top: -75px; /* Oculta inicialmente */
    width: 100%;
    height: 75px;
    background-color: #771701;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: top 0.5s ease-out; /* Velocidad de la animación actualizada */
    z-index: 1000; /* Asegura que esté sobre otros elementos */
}

.text-content {
    width: 80%;
    margin: 0 auto; /* Centrado horizontal */
    text-align: justify;
    font-size: 1.2rem;
    padding: 20px;
    margin-top: 100px; /* Para evitar que el contenido quede debajo de la barra */
}

.accordion {
    width: 80%;
    margin: 20px auto;
}

.accordion-item {
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
}

.accordion-header {
    background-color: #771701;
    color: #333;
    cursor: pointer;
    padding: 15px;
    text-align: left;
    font-size: 1.2rem;
    border: none;
    outline: none;
    transition: background-color 0.3s ease;
    width: 100%;
}

.accordion-header.active {
    background-color: #b0e0e6; /* Ligeramente más claro cuando está activo */
}

.accordion-content {
    display: none;
    padding: 15px;
    background-color: #f9f9f9;
    animation: slide-down 0.5s ease-out;
}

@keyframes slide-down {
    from { max-height: 0; opacity: 0; }
    to { max-height: 1000px; opacity: 1; }
}

.important-dates-table {
    width: 100%; /* Extender la tabla a lo ancho de la pantalla */
    border-collapse: collapse; /* Colapsar los bordes de la tabla */
    background-color: #771701; /* Mismo color que el menú */
    color: #000; /* Color del texto */
    margin-top: 30px; /* Espacio superior */
    margin-bottom: 30px; /* Espacio inferior */
}

.important-dates-table th, .important-dates-table td {
    border: 1px solid lightgray; /* Borde de 1px en lightgray */
    padding: 10px; /* Espaciado interno */
    text-align: center; /* Centrar el texto en las celdas */
}

.important-dates-table th {
    background-color: #771701; /* Mismo color que el menú */
    font-weight: bold; /* Negrita para el encabezado */
	Color:white;
}

.important-dates-table td {
    background-color: #fff; /* Fondo blanco para las celdas */
}

.italic-text {
    font-style: italic; /* Texto en cursiva */
    width: 80%; /* Ancho del 80% del área de contenido */
    margin: 30px auto; /* Centramos el texto horizontalmente con 'auto' */
    text-align: justify; /* Justificado como el resto del texto */
    color: #333; /* Color del texto */
}

.banner-space {
    width: 80%; /* Ocupar el ancho total del contenedor */
    overflow: hidden; /* Ocultar el desbordamiento si la imagen es más grande */

	
}

.banner-space img {
    width: 100%; /* Asegura que la imagen ocupe todo el ancho */
    height: 100%; /* Ajusta la imagen a la altura del contenedor */
    object-fit: cover; /* Recorta la imagen si es necesario, manteniendo la proporción */
}

