/* Definir la fuente Air Americana DEMO - Bold */
@font-face {
    font-family: 'Air';
    src: url('assets/fonts/AirAmericanaDEMO-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

/* Definir la fuente Helvetica Neue Regular */
@font-face {
    font-family: 'Helv';
    src: url('assets/fonts/HelveticaNeueRegular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}




/* Reset de márgenes y padding */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Estilos generales */
body {
    font-family: 'Muli', sans-serif;
    background-color: #f4f4f4;
    color: #333;
    line-height: 1.6;
}

header {
    background-color: #fff;
    color: white;
    /*padding: 10px 0;*/
}

/* Estilo general del menú */
.navbar {
    background-color: #fff;
    /* Fondo blanco para la navbar */
}

/* Logo a la izquierda */
.navbar-brand img {
    height: 40px;
    /* Ajustar tamaño del logo */
}

/* Estilo de los elementos del menú */
.nav-item {
    position: relative;
    overflow: hidden;
    height: 70px;
    /* Altura de los elementos del menú */
}

/* Estilo de los enlaces del menú */
.nav-link {
    color: black;
    /* Texto en negro en estado normal */
    /*font-weight: bold;*/
    padding: 0 20px;
    /* Ajustar relleno horizontal para espacio */
    display: flex;
    /* Usar flexbox para centrar el contenido */
    align-items: center;
    /* Centrar verticalmente el contenido */
    justify-content: center;
    /* Asegura que el texto también esté centrado horizontalmente */
    height: 100%;
    /* Asegurar que el enlace ocupe toda la altura del item */
    text-decoration: none;
    /* Eliminar subrayado */
    border: none;
    /* Eliminar borde por defecto */
    transition: color 0.3s ease;
    /* Transición suave en el color del texto */
    position: relative;
    /* Necesario para z-index */
    z-index: 1;
    /* El texto siempre estará por encima del fondo */
}

/* Efecto de cortina de abajo hacia arriba (cubre toda la altura del item) */
.nav-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Celeste */
    /*background-color: #00bcd4;*/
    background-color: #009cde;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    z-index: 0;
    /* El fondo estará debajo del texto */
}

/* Efecto de hover: despliega la cortina */
.nav-item:hover::after {
    transform: translateY(0);
}

/* Cambio de color del texto a blanco al pasar el mouse */
.nav-item:hover .nav-link {
    color: white;
    /* Cambiar color del texto a blanco */
}

/* Alineación de los elementos de navegación a la derecha */
.navbar-nav {
    margin-left: auto;
    /* Alinea los elementos a la derecha */
}

.navbar-brand .img-logo {
    max-width: 80px;
}

.content {
    padding: 20px;
    max-width: 1000px;
    margin: 20px auto;
    background-color: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

footer {
    text-align: center;
    padding: 20px;
    background-color: #333;
    color: white;
    position: relative;
    bottom: 0;
    width: 100%;
    margin-top: 20px;
}

/* Estilos para pantallas pequeñas (celulares) */
@media (max-width: 768px) {

    /************* Menu responsivo *****************/
    .navbar-nav {
        text-align: right;
    }

    .navbar-toggler {
        border: none;
    }

    /* /////////////////////////////////////////// */

    
}