/*--- CSS WEB IGL UNAM ---*/

/*---GENERALES---*/
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;800&family=Frank+Ruhl+Libre:wght@300..900&display=swap');

body {
    font-family: "Fira Sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin: 0 !important;

}

.text-artic {
    font-family: "Frank Ruhl Libre", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

/* Animación general */

.reveal {

    opacity: 0;

    transform: translateY(20px);

    transition:
        opacity .7s ease,
        transform .7s ease;
}


.reveal.active {

    opacity: 1;

    transform: translateY(0);
}

.reveal-up,
.reveal-left,
.reveal-right {

    opacity: 0;

    transition:
        opacity .8s ease-out,
        transform .8s ease-out;
}


/* Estado inicial */

.reveal-up {

    transform: translateY(30px);
}

.reveal-left {

    transform: translateX(-40px);
}

.reveal-right {

    transform: translateX(40px);
}


/* Estado final */

.reveal-up.active,
.reveal-left.active,
.reveal-right.active {

    opacity: 1;

    transform: translate(0);
}


/*--- HEADER ---*/
/* =======================
TOPBAR
======================= */

.breadcrumb-item a {
    text-decoration: none;
    color: #7c6f6f;
}

.breadcrumb-item.active {
    text-decoration: underline solid 1px;
    color: #7c6f6f;
    font-weight: 700;
}

.topbar-desktop {

    background: #b56b0b;

    padding: 6px 0;
}

.top-links {

    display: flex;

    justify-content: flex-end;

    gap: 25px;

    list-style: none;

    margin: 0;

    padding: 0;
}

.top-links a {

    color: #fff;

    text-decoration: none;

    font-size: .8rem;
}

.top-links a:hover {

    color: #4A2502;

    transition: ease 0.3s;
}

.topnav-redes {

    text-align: left;
}

.topnav-redes a {

    color: #fff;

    text-decoration: none;

    padding: 0 6px;
}

.topnav-redes a:hover {

    color: #4A2502;

    transition: ease 0.3s;
}



/* =======================
NAVBAR
======================= */

.navbar {

    padding: 0;
    font-size: 15px;
}

.navbar-nav {

    width: auto;
}

.navbar .container-fluid {

    display: flex;

    align-items: center;

    justify-content: space-between;
}



/* =======================
LOGOS
======================= */

.logosweb {

    display: flex;

    align-items: center;

    gap: 12px;

    flex-shrink: 0;

    margin-left: 5%;
}

.logo-unam {

    width: 85px;
}

.logo-igl {

    width: 65px;
}

.logosweb h1 {

    color: #fff;

    margin: 0;

    font-size: 20px;

    line-height: 1.1;
}

.logosweb h1 span {

    font-weight: 600;

    letter-spacing: 4px;
}



/* =======================
MENÚ ESCRITORIO
======================= */

.menu-desktop {

    flex: 1;

    display: flex;

    justify-content: flex-end;
}

.menu-principal {

    display: flex;

    flex-direction: row;

    gap: 1.5rem;

    margin-right: 5%;
}

.nav-link {

    color: #fff;

    white-space: nowrap;
}

.nav-link:hover {

    color: #d69a2f;
}


/* ========================= */
/* DROPDOWN ESCRITORIO */
/* ========================= */
.dropdown {

    position: relative;
}

.dropdown-menu {

    background: rgb(26, 26, 26);

    border: none;

    border-radius: 12px;

    padding: 12px 0;

    margin-top: 12px;

    min-width: 220px;

}

.dropdown-item {

    color: #fff;

    padding: 10px 22px;

    font-size: .95rem;

    transition: .25s;
}

.dropdown-item:hover {

    background: transparent;

    color: #d69a2f;
}

.dropdown-toggle::after {

    margin-left: 8px;

    vertical-align: middle;

    display: none;
}


/* Contenedor padre */

.navbar .dropdown {

    position: relative;
}


/* Submenú */

.navbar .dropdown-menu {

    left: 0;

    top: 100%;

    margin-top: 10px;

    transform: none;
}


/* =======================
BOTÓN HAMBURGUESA
======================= */

.navbar-toggler {

    border: none;

    box-shadow: none !important;
}

.navbar-toggler .bi {

    color: #fff;

    font-size: 2rem;
}

.navbar-toggler:hover .bi {

    color: #d69a2f;
}



/* =======================
OFFCANVAS
======================= */

.offcanvas-top {

    --bs-offcanvas-height: 100vh;

    background: #7a4a0b;

    color: #fff;
}

.offcanvas-header {

    justify-content: flex-end;

    padding: 30px;
}

.offcanvas-body {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: flex-start;

    padding: 40px 30px 80px;

    overflow-y: auto;

    gap: 35px;
}

.offcanvas .navbar-nav {

    width: 100%;

    text-align: center;
}

.offcanvas .nav-item {

    padding: 12px 0;
}

.offcanvas .nav-link {

    white-space: normal;

    font-size: 1.1rem;
}

.offcanvas hr {

    width: 80%;

    border: 1px solid rgb(255 255 255 / 44%);

    margin: 0;
}

.offcanvas .top-links {

    flex-direction: column;

    align-items: center;

    gap: 12px;
}

.offcanvas .topnav-redes {

    display: flex;

    gap: 20px;

    justify-content: center;
}

.offcanvas .topnav-redes a {

    font-size: 1.4rem;
}

/* ========================= */
/* SUBMENÚ OFFCANVAS */
/* ========================= */

.dropdown-mobile {

    width: 100%;

    color: #fff;

    font-weight: 600;

    text-align: center;

    border: none;

    box-shadow: none;
}

.dropdown-mobile:hover {

    color: #d69a2f;
}

.submenu-mobile {

    list-style: none;

    padding: 0;

    margin: 10px 0 0;
}

.submenu-mobile li {

    margin: 10px 0;
}

.submenu-mobile a {

    text-decoration: none;

    color: #d8d8d8;

    font-size: .95rem;
}

.submenu-mobile a:hover {

    color: #d69a2f;
}


/*-- HERO --*/

.hero {
    height: 650px;
    background: url('../imagenes/fondo-web2.jpg') center center;
    background-size: cover;
    margin-top: -81px;
}

/* Texto principal */

.hero-title {

    width: 100%;

    color: #fff;

    font-size: 50px;

    font-weight: 600;

    line-height: 1.3;

    text-align: center;

}


/* Líneas */

.hero-title .line {

    display: block;

    opacity: 0;

    transform: translateY(35px);
}


/* Animaciones */

.line1 {
    animation: fadeUp .9s ease .3s forwards;
}

.line2 {
    animation: fadeUp .9s ease 1.1s forwards;
}

.line3 {
    animation: fadeUp .9s ease 1.9s forwards;
}


/* Texto destacado */

.destacado {
    color: #d69a2f;
}


/* Keyframes */

@keyframes fadeUp {

    from {

        opacity: 0;

        transform: translateY(35px);
    }

    to {

        opacity: 1;

        transform: translateY(0);
    }

}

/*-- Cintillo páginas --*/

.cintillo-web {
    height: 90px;
    background: url('../imagenes/cintillo-igl.jpg') center center;
    background-size: cover;
    position: inherit;
    margin-top: -81px;
}


/*-- CARRUSEL DE ACTIVIDADES --*/
.actividades {

    position: relative;

    z-index: 20;

    transform: translateY(-90px);

    margin-bottom: -50px;
}

.owl-carousel div {

    position: relative;
}

.owl-carousel p {

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    padding: 15px;

    margin: 0;

    color: #fff;
}

.actividades .active {
    background-color: initial;
    color: initial;
}

.owl-dots {
    transform: translateY(20px);

    text-align: center;
}

.owl-carousel p {
    text-align: left;
    color: white;
    padding: 15px;
    font-size: 12px;
    font-weight: 100;
}

.owl-carousel span {
    font-weight: 600;
    color: #d69a2f;
}

.owl-carousel img {
    border-radius: 15px;
    transition: transform .5s ease;
}

/*-- hover card --*/
.owl-carousel img:hover {
    transform: scale(1.05);
}


/*-- CARRUSEL DE ARTICULOS --*/
.articulos {
    background-color: #F6F6F6;
    margin-top: 60px;
    padding: 70px 0;
}

.articulos h2 {
    font-weight: 600;
    font-size: 24px;
    padding-bottom: 25px;
    color: #4A2502;
}

.articulo-card {
    padding: 20px;
}

/* Fotos autores */

.autores-fotos {
    display: flex;
    margin-bottom: 20px;
}

.autores-fotos img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

.autores-fotos img+img {
    margin-left: -10px;
}

/* Título articulo */

.articulo-card h3 {
    font-family: 'Fira Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 25px;
    color: #894506;

}

.articulo-card a {
    text-decoration: none;
    color: #894506;
}


.articulo-card h3:hover {
    color: #d69a2f;
    transition: .3s ease;
}

.articulo-card h3 span {
    font-size: 18px;
    font-weight: 300;
}

/* Nombres Autores */

.autores {
    font-family: 'Frank Ruhl Libre', serif;
    font-size: 16px;
    line-height: 1.45;
    color: black;
    margin-bottom: 25px;
}

/* Nombre Revista */

.revista {
    font-family: 'Fira Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #7c6f6f;
}


/*-- FOOTER --*/

footer {
    background: #5d2a00;
    color: white;
    padding: 150px 10%;
}

.logos-footer {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 25px;
}

.l1-footer {

    width: 60px;

    height: auto;
}

.l2-footer {

    width: 60px;

    height: auto;
}

.l3-footer {

    width: 200px;

    height: auto;
}

.text-footer {
    padding-top: 50px;
    font-size: 13px;
}

.boton {
    background-color: #B36200;
    padding: 15px 25px;
    display: ruby-text;
    margin: 30px 0;
    border-radius: 30px;
    text-decoration: none;
    color: white;
    font-size: 13px;
    font-weight: 500;
}

.boton:first-child {
    margin-right: 20px;
}

.boton:hover {
    background-color: #894506;
    transition: .5s ease;
}

footer h4 {
    margin-bottom: 30px;
    font-size: 1rem;
    font-weight: 700;
    color: #d69a2f;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links a:hover {
    color: #d69a2f;
    transition: .3s ease;
}

.footer-links li {
    margin-bottom: 15px;
}

.footer-links a {
    color: white;
    text-decoration: none;
}

.social {
    margin-bottom: 25px;
}

.social a {
    color: white;
    font-size: 1.4rem;
    margin-right: 15px;

}

.social a:hover {
    color: #d69a2f;
    transition: .3s ease;
}


/*-- formulario --*/
.form-control {
    margin-bottom: 15px;
    border: none;
    border-radius: 6px;
}

textarea.form-control {

    min-height: 120px;

    resize: vertical;
}

.btn-enviar {

    background: #B36200;

    color: #fff;

    font-size: 13px;

    border: none;

    border-radius: 30px;

    padding: 12px 28px;

    transition: .3s;

}


.btn-enviar:hover {

    background: #894506;

}


#resultadoFormulario {

    margin-top: 15px;

    font-size: .9rem;

    color: #fff;

    min-height: 24px;

}




/*==========================
SECCIÓN SEDES
==========================*/

.sedes {

    background: #f3f3f3;
    padding-bottom: 50px;


}


/* TÍTULO */

.sedes h2 {

    font-size: 40px;

    font-weight: 800;

    color: #5d2a00;

    margin: 20px 0 40px;

}


/*==========================
TABS
==========================*/

.sedes-nav {

    gap: 15px;

}

.sedes-nav .nav-link {

    background: #d8d8d8;

    color: #5d2a00;

    border: none;

    border-radius: 25px;

    padding: 18px 45px;

    font-weight: 400;

}

.nav-link:hover {
    font-weight: 700;
}


.sedes-nav .nav-link.active {

    background: white;

    border-radius: 25px 25px 0 0;

    color: #5d2a00;

    text-decoration: underline;

    padding: 25px 45px;

    font-weight: 700;

}


/*==========================
CARD
==========================*/

.sede-card {

    background: #e9e9e9;

    border-radius: 0 25px 25px 25px;

    overflow: hidden;

}


/* IMAGEN */

.sede-card img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}


/* INFORMACIÓN */

.sede-info {

    padding: 70px;

}


.sede-info h3 {

    color: #8b4c00;

    font-weight: 700;

}


.sede-info h4 {

    color: #8b4c00;

    margin-bottom: 30px;

}


.sede-info p {

    line-height: 1.8;

}


/* DATOS */

.datos-sede {

    list-style: none;

    padding: 0;

    margin-top: 35px;

}


.datos-sede li {

    display: flex;

    gap: 18px;

    margin-bottom: 20px;

}


.datos-sede i {

    color: #8b4c00;

}


/* FOOTER */

.sede-footer {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-top: 35px;

}


/* BOTÓN */

.btn-maps {

    text-decoration: none;

    color: #8b4c00;

    border: 1px solid #8b4c00;

    border-radius: 30px;

    padding: 12px 25px;

}


.btn-maps:hover {

    background: #8b4c00;

    color: #fff;

}


/* REDES */

.redes-sede {

    display: flex;

    gap: 20px;

}


.redes-sede a {

    color: #5d2a00;

    font-size: 1.3rem;

}

/*======================
NOSOTROS
======================*/

.nosotros-page {

    background: #f3f3f3;

    padding: 60px 8% 100px;
}


/* BREADCRUMB */

.breadcrumb {
    padding: 50px 0 30px;
}

.breadcrumb a {

    color: #8f8f8f;

    text-decoration: none;
}

.breadcrumb-item.active {

    color: #8f8f8f;
}

.info-nosotros {
    padding-left: 5%;
}


/* CONTENEDOR */

.nosotros-box {
    border-radius: 20px;

    padding: 0;
}


/* VIDEO */

.video-box {

    overflow: hidden;

    border-radius: 20px;
}

.video-box iframe {

    width: 100%;

    height: 700px;

    border: 0;

    aspect-ratio: 16/9;

    border: 0;

    border-radius: 20px;
}


/* TABS */

.nosotros-tabs {

    gap: 20px;
}

.nosotros-tabs .nav-link {

    border: none;

    border-radius: 40px;

    background: #dadada;

    color: #5d2a00;

    font-weight: 700;

    padding: 12px 30px;
}

.nosotros-tabs .nav-link.active {

    background: #dadada;

    text-decoration: underline;

    color: #5d2a00;
}

.nav-item :hover {
    color: #d69a2f;
    transition: .3s ease;
}


/* TITULO */

.tab-content h2 {

    color: #5d2a00;

    font-weight: 800;

    margin-bottom: 45px;
}


/* TEXTO */

.tab-content p {

    line-height: 2;

    color: #333;

    margin-bottom: 28px;
}


/*======================
ORGANIZACIÓN
======================*/

.organizacion {

    background: #f3f3f3;
    padding: 0 0 100px;
}

/* TITULO */

.organizacion h2 {

    color: #5d2a00;
    font-weight: 800;
    margin-bottom: 40px;
}

/* TABS */

.organizacion-tabs {

    gap: 10px;
    margin-bottom: 0;
}

.organizacion-tabs .nav-link {

    border: none;
    border-radius: 30px;

    background: #dadada;

    color: #5d2a00;

    font-weight: 700;

    padding: 12px 28px;

    min-height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* TAB ACTIVO */

.organizacion-tabs .nav-link.active {

    background: #ececec;

    border-radius: 30px 30px 0 0;

    padding: 30px 45px;

    color: #5d2a00;

    text-decoration: underline;

    position: relative;
}

.organizacion-tabs .nav-link.active::after {
    content: "";

    position: absolute;

    bottom: -15px;

    left: 0;

    width: 100%;

    height: 20px;

    background: #ececec;
}

.nav-item:hover {
    color: #d69a2f;
    transition: .3s ease;
}

/* CONTENEDOR */

.organizacion-box {

    background: #ececec;

    border-radius: 0 20px 20px 20px;

    padding: 60px;
}

/* FOTO */

.director-img {

    width: 100%;
    border-radius: 20px;
}

/* CONTACTO */

.contacto-direccion {

    margin-top: 35px;
    list-style: none;
    padding: 40px 0;
    margin: 0;
}

.contacto-direccion li {

    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 15px;
}

.contacto-direccion p {

    display: flex;
    gap: 12px;

    margin-bottom: 18px;
}

.contacto-direccion i {

    color: #9b5a12;
    margin-right: 10px;
    font-size: 1rem;
    flex-shrink: 0;
}

/* INFO */

.colder-info {
    padding-left: 5%;
}

.organizacion h3 {

    color: #9b5a12;

    font-size: 19px;

    font-weight: 800;
}

.organizacion h4 {

    color: #9b5a12;

    font-size: 1.1rem;

    font-weight: 700;

    margin-bottom: 7px;
}

.organizacion p {

    line-height: 2;
}

/* PLAN */

.plan-desarrollo {

    margin-top: 40px;
}

.plan-desarrollo h5 {

    color: #9b5a12;

    margin-bottom: 15px;
}

.btn-doc {

    border: 1px solid #9b5a12;

    border-radius: 50px;

    padding: 10px 30px;

    text-decoration: none;

    color: #9b5a12;
}

.btn-doc:hover {

    background: #9b5a12;

    color: white;

    transition: .3s ease;
}



.btn-informes {

    margin-top: 30px;

    width: 250px;

    justify-content: space-between;
}

.informes-menu {

    width: 100%;

    border-radius: 18px;

    border: 1px solid #b46c2c;

    overflow: visible;

    padding: 0;

    margin-top: 8px;

    background-color: #dadada;


}

.informes-menu .dropdown-item {
    width: 100%;
    white-space: normal;
    padding: 12px 18px;
    color: #5d2a00;
}

.informes-menu .dropdown-item:hover {

    background: #b46c2c;

    color: #fff;
}

/* ASISTENTE */

.asistente {

    margin-top: 50px;

    padding-top: 60px;

    border-top: 1px solid #c98a3f;
}

.asistente-img {
    width: 140px;
    height: 140px;
    margin-right: 3%;
    object-fit: cover;
}

.asistente p {
    margin-bottom: 5px;
}

.asistente span {

    display: block;

    color: #9b5a12;

    font-weight: 700;

    margin-bottom: 15px;
}

/*--SEC ACADEMICA--*/
.funciones li {
    line-height: 2;
}

/*======================
VINCULACIÓN
======================*/

.vinculacion {

    background: #f3f3f3;
    padding: 0 0 100px;

}

.vinculacion h2 {

    font-weight: 600;
    padding-bottom: 25px;
    color: #4A2502;

}

.vinculacion-box {

    background: #efefef;

    border-radius: 20px;

    padding: 50px;

}

.info-vinculacion {

    padding-left: 5%;

}

.coordinador-img {

    width: 100%;
    border-radius: 20px;

}

.coordinador h3 {

    color: rgb(155, 90, 18);
    font-size: 19px;
    font-weight: 800;

    margin-top: 25px;

}


.coordinador h4 {

    color: #9b5a12;
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 7px;

}

.contacto-direccion {

    list-style: none;

    padding: 0;

    margin: 35px 0;

}

.contacto-direccion li {

    display: flex;

    gap: 12px;

    margin-bottom: 18px;

    line-height: 1.6;

}

.contacto-direccion i {

    color: #9b5a12;

}

.vinculacion-tabs {

    gap: 10px;

    margin-bottom: 40px;

}

.vinculacion-tabs .nav-link {

    border: none;

    background: #dcdcdc;

    color: #5d2a00;

    border-radius: 30px;

    font-weight: 700;

    padding: 12px 28px;

}

.vinculacion-tabs .nav-link:hover {
    transition: .3s ease;
    color: #d69a2f;
    ;
}

.vinculacion-tabs .nav-link.active {

    background: #dcdcdc;

    color: #5d2a00;

    text-decoration: underline;

}

.tab-content h4 {
    color: #9b5a12;
    font-size: 1.1rem;
    font-weight: 700;
}

.list-serv li::marker {

    color: #9b5a12;

}

.list-serv li {
    padding-bottom: 15px;
    line-height: 2;
}

.list-serv span {
    color: #9b5a12;
    font-size: 1.1rem;
    font-weight: 700;
}

.norm-enlaces li a {
    text-decoration: none;
    color: #333;
    font-weight: 600;
    line-height: 2;
}

.norm-enlaces a:hover {
    transition: .3s ease;
    color: #b56b0b;
}

.personal-box {

    border-top: 1px solid #c98a3f;

    margin-top: 70px;

    padding-top: 60px;


}

.personal-img {

    width: 140px;

    margin-right: 3%;

    height: 140px;

    object-fit: cover;

    border-radius: 50%;

    margin-bottom: 40px;

}

.personal-box h3 {

    color: #9b5a12;

    font-size: 19px;

    font-weight: 800;

}

.personal-box span {

    display: block;

    color: #9b5a12;

    font-weight: 700;

    margin-bottom: 18px;

}


/*=========================
CIENCIAS AMBIENTALES
=========================*/

.ciencias-ambientales {

    padding: 60px 0 100px;

    background: #fff;

}


/*------------------
BREADCRUMB
-------------------*/

.ciencias-ambientales .breadcrumb {

    padding: 0 0 40px;

}

.ciencias-ambientales .breadcrumb a {

    color: #999;

    text-decoration: none;

}

.ciencias-ambientales .breadcrumb-item.active {

    color: #999;

}


/*------------------
TITULO
-------------------*/

.titulo-departamento {

    margin-bottom: 70px;

}

.titulo-departamento span {

    display: block;

    color: #5d2a00;

    font-size: 2rem;

    font-weight: 700;

    margin-bottom: 8px;

}

.titulo-departamento h1 {

    color: #5d2a00;

    font-weight: 800;

    font-size: 50px;

    line-height: 1.1;

}


/*------------------
MISION
-------------------*/

.mision-box {

    margin-bottom: 80px;

}

.mision-box h2 {

    color: #8c4c0d;

    font-weight: 800;

    margin-bottom: 45px;

}

.mision-box p {

    line-height: 2;

    color: #333;

    text-align: left;

}


/*------------------
FOTO
-------------------*/

.gclose {

    display: block !important;

    opacity: 1 !important;

}

.gclose svg {

    width: 35px;

    height: 35px;

}

.foto-departamento {

    max-width: 760px;

    margin: 0 auto;

}

.departamento-carousel img {

    width: 100%;

    height: 530px;

    object-fit: cover;

    border-radius: 20px;

}



/*------------------
JEFA
-------------------*/


.jefa {

    padding-left: 8%;

}

.jefa-img {

    width: 260px;

    height: 260px;

    object-fit: cover;

    border-radius: 20px;

    margin-bottom: 30px;

}

.jefa h3 {

    color: #9b5a12;

    font-size: 1.5rem;

    font-weight: 800;

    margin-bottom: 5px;

}

.jefa span {

    display: block;

    color: #5d2a00;

    font-weight: 700;

    margin-bottom: 35px;

}


/*------------------
CONTACTO
-------------------*/

.contacto-direccion {

    list-style: none;

    padding: 0;

    margin: 0;

}

.contacto-direccion li {

    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-bottom: 18px;

    color: #444;

    line-height: 1.7;

}

.contacto-direccion i {

    color: #9b5a12;

    margin-top: 4px;

}

/*=========================
MIEMBROS
=========================*/

.miembros-departamento {

    background: #f3f3f3;

    padding: 90px 0;

}

.titulo-seccion {

    text-align: center;

    color: #5d2a00;

    font-weight: 800;

    margin-bottom: 60px;

}

.miembros-carousel .owl-carousel .owl-item img {
    display: block;
    width: 70%;
}

.miembro a {
    text-decoration: none;
}

.owl-carousel .miembro p {
    position: relative;
    padding: 0px;
}

.miembros-carousel {

    padding: 0 6%;

}

.miembro {

    text-align: center;

    padding: 15px;

}

.miembro img {

    border-radius: 600px;

    object-fit: cover;

    margin: 0 auto 25px;

}

.miembro h3 {

    color: #9b5a12;

    font-size: 1rem;

    font-weight: 800;

    line-height: 1.4;

    margin-bottom: 8px;

    text-transform: uppercase;

}

.miembro p {

    color: #222;

    font-weight: 600;

    font-size: .9rem;


    text-align: center;

}


/*=========================
LABORATORIOS
=========================*/

.laboratorios-departamento {

    background: #fff;

    padding: 90px 0 110px;

}

.owl-carousel .laboratorio-card div {
    position: absolute;
}


.laboratorios-carousel {

    padding: 0 2%;

}

.laboratorio-card {

    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 18px;

    text-decoration: none;

}

.laboratorio-card img {

    width: 100%;

    height: 290px;

    object-fit: cover;

    transition: .45s;

}

.laboratorio-card:hover img {

    transform: scale(1.05);

}

.laboratorio-overlay {

    position: absolute;

    inset: 0;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    padding: 22px;

    background: linear-gradient(to top,
            rgba(0, 0, 0, .88),
            rgba(0, 0, 0, .15) 55%,
            transparent);

}


.laboratorio-overlay h3 {

    color: #fff;

    font-size: 1.2rem;

    font-weight: 800;

    line-height: 1.35;

    margin-bottom: 8px;

    text-transform: uppercase;

}

.laboratorio-overlay span {

    color: #fff;

    font-size: .95rem;

    font-weight: 500;

}







/*--MEDIA QUERY--*/
@media (min-width:1200px) {

    .offcanvas {
        display: none !important;
    }

    .navbar .nav-link:focus {
        color: #d69a2f;
        border-bottom: solid 0.5px #d69a2f;
    }


    /* DROPDOWN ESCRITORIO */
    .navbar .dropdown {

        position: relative;
    }



    .navbar .dropdown-menu {

        display: block;

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transform: translateY(10px);

        transition: all .25s ease;

        margin-top: 0;
    }

    .navbar .dropdown:hover>.dropdown-menu {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        transform: translateY(0);
    }


}

@media (max-width:1399px) {
    footer {
        padding: 130px 10% !important;
    }
}

@media (max-width:1199px) {

    .navbar .nav-link:focus {
        color: #d69a2f;
    }

    .topbar-desktop {

        display: none;
    }

    .logosweb {

        margin-left: 0;
    }

    .logo-unam {

        width: 70px;
    }

    .logo-igl {

        width: 50px;
    }

    .logosweb h1 {

        font-size: 16px;
    }

    .logosweb h1 span {

        letter-spacing: 2px;
    }

    .sect-3 {
        padding-top: 50px;
        border-top: solid 1px rgba(255, 255, 255, 0.409);
    }


}

@media (max-width:991.99px) {
    .hero-title {

        font-size: 40px;
    }

    footer {
        text-align: center;
        padding: 130px 10% !important;
    }

    .logos-footer {
        display: inline-flex;
    }

    .footer-links:last-child {
        padding-bottom: 20px;
    }


    .sect-2 {
        padding-top: 50px;
        border-top: solid 1px rgba(255, 255, 255, 0.409);
    }


    /*-- SEDES --*/

    .sedes h2 {

        font-size: 40px;

    }


    .sedes-nav {

        flex-direction: column;

    }


    .sedes-nav .nav-link {

        width: 100%;

        border-radius: 20px;

    }


    .sede-card {

        border-radius: 25px;
    }


    .sede-info {

        padding: 40px;

    }


    .sede-footer {

        flex-direction: column;

        align-items: flex-start;

        gap: 25px;

    }


    /*-- Nosotros --*/
    .nosotros-page {

        padding: 40px 5% 80px;
    }

    .video-box iframe {

        height: 450px;
    }

    .tab-content:active {

        padding-bottom: 50px;
    }

    .tab-content h2 {

        font-size: 3rem;
    }

    .nosotros-tabs {

        justify-content: center;

        gap: 12px;
    }

    .nosotros-tabs .nav-link {

        padding: 10px 20px;

        font-size: .9rem;
    }

    /*-- Departamentos investigación--*/
    .ciencias-ambientales {

        padding: 40px 0 80px;

    }

    .titulo-departamento {

        margin-bottom: 50px;

    }

    .titulo-departamento span {

        font-size: 1.5rem;

    }

    .titulo-departamento h1 {

        font-size: 2.8rem;

    }

    .mision-box {

        margin-bottom: 60px;

    }

    .foto-departamento img {

        height: 420px;

    }

    .jefa {


        padding: 5%;

        text-align: center;

    }

    .contacto-direccion {

        display: inline-block;

        text-align: left;

    }



}

@media (max-width: 768px) {
    .hero {
        height: 500px;
    }

    .hero-title {

        font-size: 25px;

        padding: 5% 0;
    }

    .asistente-img {
        margin-bottom: 40px;
    }

    .organizacion-tabs {
        justify-content: center;
    }
}

@media (max-width: 576px) {

    .logos-footer {

        display: flex;

        justify-content: center;

        align-items: center;

        flex-wrap: wrap;

        gap: 15px;

    }


    .titulo-departamento h1 {

        font-size: 2.2rem;

    }

    .titulo-departamento span {

        font-size: 1.3rem;

    }

    .foto-departamento img {

        height: 320px;

    }

    .jefa-img {

        width: 220px;

        height: 220px;

    }

}