@font-face {
    font-family: "Helvetica Neue";
    src: url("/fonts/HelveticaNeue-Roman.otf") format("opentype");
}

*{
    margin: 0;
    padding: 0;
    font-family: "Helvetica Neue";
}
html, body{
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}
body{
    padding-top: 66px;
}
.small-content{
    min-height: calc(100% - 80px);
}
nav{
    padding-top: 20px;
    padding-bottom: 60px;
}
.navbar{
    background-color: #00479a !important;
    position: fixed;
    width: 100%;
}

.navbar .navbar-brand img{
    height: 40px;
    vertical-align: middle;
}
.navbar-toggler{
    margin: 5px 15px;
}
.text-option{
    text-align: center;
}
.banner-container{
    background: url('/images/banner_home.webp') no-repeat;
    width: 100%;
    height: 400px;
    background-size: cover;
    display: flex;
    /*align-items: center;*/
}
.banner-novedades {
    background: url('/images/banner_novedades.webp') no-repeat;
    background-size: auto;
    width: 100%;
    height: 300px;
    background-size: cover;
    display: flex;
    align-items: end;
    justify-content: start;
    margin-top: 50px;
}
.banner-novedades .text-banner{
    font-size: 2.3rem;
    color: #004996;
    margin-left: 30%;
}

.text-banner{
    font-size: 2.5rem;
    color: white;
    margin-left: 10%;
    line-height: 3rem;
    margin-right: 10%;
}
#nuestra_institucion,
#nuestra_actividad,
#nuestro_equipo{
    /*width: 329px;*/
    height: auto;
    display: flex;
    align-items: end;
    transition: width .2s;
}
#nuestra_institucion:hover img,
#nuestra_actividad:hover img,
#nuestro_equipo:hover img{
    width: 100%;
    height: auto;
    box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.75);
}
#nuestra_institucion{
    /*background: url('/images/nuestra_institucion.webp') no-repeat;*/
    transform: translateY(-170px);
    background-size: cover;
    background-position: center;
}
#nuestra_actividad{
    /*background: url('/images/nuestra_actividad.webp') no-repeat;*/
    transform: translateY(-250px);
    background-size: cover;
    background-position: center;
}
#nuestro_equipo{
    /*background: url('/images/nuestro_equipo.webp') no-repeat;*/
    transform: translateY(-105px);
    background-size: cover;
    background-position: center;
}
.home_cards{
    display: flex;
    justify-content: center;
}
#nuestra_institucion img, #nuestra_actividad img, #nuestro_equipo img{
    max-width: 100%;
}
.home_cards_text{
    /*background-color: rgba(0, 71, 150, 0.8);*/
    color: white;
    font-size: 2.5rem;
    padding: 10px 10px;
    width: 100%;
    line-height: 2.5rem;
    position: absolute;
}
.home_cards a{
    text-decoration: none;
}
.navbar-toggler{
    border: none;
}
.navbar-toggler-icon{
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
.navbar-toggler:focus{
    box-shadow: none;
    outline: solid 1px white !important;
}

.dropdown-toggle::after{
    content: initial;
    margin: auto 10px;
}
.name-user{
    margin-right: 30px;
}
.icon-dot-menu{
    cursor: pointer;
}

.content-menu-l{
    width: 356px; 
    background-color: rgba(255, 255, 255, 1); 
    border-color: rgba(0,0,0,0.12); 
    flex-direction: column; 
    box-sizing: border-box; 
    height: 100%; 
    border-right-width: 1px; 
    border-right-style: solid; 
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    z-index: 1050;
    left: -356px;
    transition: all .2s ease;
}

.header-menu-l{
    min-height: 64px; 
    padding: 0 16px 4px;
}

.item-menu-l{
    min-height: 40px; 
    margin: 5px; 
    display: flex; 
    position: relative; 
    text-decoration: none; 
    padding: 0 10px; 
    color:#000;
    font-size: 18px;
    margin-bottom: 5px;
}
.ic-menu-l{
    margin-right: 15px; 
    align-items: center; 
    justify-content: center;
}
.hr-menu-l{
    border: none; 
    border-bottom: 1px; 
    border-bottom-style: solid; 
    border-bottom-color: rgba(0,0,0,.12);
}
.label-menu-l{
    font-size: .875rem; 
    padding: 0 16px; 
    color: rgba(0,0,0,.6);
}
a.item-menu-l:not(.no-option):hover {
    background-color: rgba(0,0,0,.1);
    color: #007AFF;
}
.no-option{
    cursor: default !important;
}
#overlay-menu{
    width: 100%;
    height: 100%;
    /*background-color: rgba(0,0,0,0.5);*/
    background-color: transparent;
    position: fixed;
    z-index: 103;
    display: none;
}
.content-menu-l a:last-child{
    margin-bottom: 60px;
}
.menu-group{
    /*width: 100%;*/
    display: flex;
}
.title_section{
    font-size: 2.3rem;
    color: #004996;
}
.subtitle_section{
    color: #004996; 
}
.title_section a{
    text-decoration: none;
    color: #004996;
}
.title_section a:hover{
    color: #004996;
}
.main-text-color{
    color: #636363;
}
.home_descriptions{
    font-size: 1.2rem;
    line-height: 1.7rem;
}
footer{
    margin: 20px auto 10px;
}
.sections_content{
    position: relative;
}
#img_quienes{
    width: 520px; 
    transform: translate(100px, -50px); 
    position: absolute;
}
#tag_quienes{
    width: 50px; 
    height: 140px; 
    background-color: rgba(0,138,207, 0.8); 
    display: block;
    position: absolute;
    transform: translate(620px, 103px);
}
#quienes_container{
    background-color: #e9f1f7;
    width: 70%;
    margin-left: 30%;
    padding: 30px 30px 30px 25%;
}
#tag_ofrecemos{
    width: 100px; 
    height: 140px; 
    background-color: rgba(0,138,207, 0.8); 
    display: block;
    position: absolute;
    transform: translate(-50px, 160px);
    z-index: 2;
}
#img_ofrecemos{
    width: 520px; 
    position: absolute; 
    left: 36.5%;
}
.space{
    width: 100%; 
    height: 230px;
}
#ofrecemos_container{
    background-color: #e9f1f7;
    width: 70%;
    padding: 30px 60px;
    min-height: 300px;
}
#compromiso_container{
    background-color: #e9f1f7;
    width: 100%;
    padding: 30px 60px;
    min-height: 300px;
    margin: auto;
}
#ofrecemos_description{
    margin-right: 35%;
}
#img_contactanos{
    width: 520px; 
    position: absolute; 
    right: 0; 
    margin-right: calc(var(--bs-gutter-x) * .5); 
    margin-left: calc(var(--bs-gutter-x) * .5); 
    transform: translateY(-160px);
}
#tag_contactanos{
    width: 100px; 
    height: 140px; 
    background-color: rgba(0,138,207, 0.8); 
    position: absolute;
    transform: translate(-582px, -1px);
    z-index: 2;
}
#contactanos_container{
    background-color: #e9f1f7;
    text-align: center;
    padding: 40px 0;
    margin-top: 20px;
}
.img_separador{
    display: block; 
    margin: auto;
    padding-top: 30px;
}
#ofrecemos_container p{
    max-width: 75%;
}
#img_ofrecemos_group{
    position: absolute;
    margin-left: 51%;
}
#img_contactanos_group{
    position: absolute; 
    right: 0;
}
.nav_section, .nav_section_2{
    display: flex;
    /*height: 120px;*/
    justify-content: center;
    margin: 40px 0;
    flex-wrap: wrap;
}
.nav_section_option, .nav_section_option_podcast{
    display: grid;
    text-align: center;
    position: relative;
    /*padding: 0 60px;*/

}
.nav_section_option a, .nav_section_option_podcast a{
    display: grid;
    text-decoration: none;
    padding: 20px 0px;
    /*max-width: 230px;*/
    text-align: center;
}
.nav_section_option:hover, .nav_section_option_podcast:hover {
    background-color: #C7D4F6;
}
.nav_section .nav_section_option, .nav_section .nav_section_option_podcast{
    padding: 0 60px;
}

.border_right{
    border-left: 1px solid #008ACF;
    position: absolute;
    top: 15%;
    bottom: 15%;
    right: 0;
}
.icon_option::before{
    line-height: 1.5;
}

.icon_option{
    font-size: 3rem;
    height: 3.3rem;
    color: #29225c;
    margin: auto;
}
.nav_section_option .text_option, .nav_section_option_podcast a .text-option{
    font-size: 1.1rem;
    color: #004996 !important;
}
.img-footer{
    height: 50px;
    width: auto;
    /*max-width: 100%;*/
}
.main-option{
    margin-bottom: 0;
}
.sub-nivel{
    padding-left: 62px;
    color: #0190d1;
    font-size: 1rem;
    margin-top: 0;
}
.sub-nivel .fa-angle-right::before{
    font-size: 1.5rem;
}
.sub-nivel .ic-menu-l {
    margin-right: 10px;
}
.sub-nivel i{
    /*display: none;*/
}
#dropdownMenuLink {
    text-decoration: none;
}

.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}
.bg-gray{
    background-color: rgba(243, 244, 246, 0.9);
}
.font-semibold {
    font-weight: 600;
}
.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
}
.nav_section_home{
    padding: 0 10px;
    height: 160px;
    width: 310px;
    overflow: hidden;
}
.icon_audio{
    height: 2.2rem;
    margin-bottom: 20px;
}
.icon_pdf{
    height: 3rem;
    margin-bottom: 20px;
}
.notificacion{
    margin-bottom: 0;
}
.contenedor-notificacion{
    border: none;
}

.btn-primary {
    background-color: #004996;
    color: #FFF;
}
.name-user-mobile h6{
    margin-bottom: 0;
    font-weight: bolder;

}
.name-user-mobile{
    display: none;
    color: #004996;
    font-weight: bolder;
    padding: 20px 0 15px;
    font-size: 18px;
}

.logo_inttelmex{
    height: 45px;
}

.player_home {
    width: 60%;
    position: relative;
    margin: auto;
}
.audio_background_home {
    background-image: url('/images/portada_audio.webp');
    max-width: 85%;
    width: 85%;
    height: 370px;
    background-size: cover;
    left: 60px;
    top: 80px;
    border-radius: 30px;
    z-index: 2;
    margin: 0 50px;
    background-position: center;
}
.audio_home {
    width: 85%;
    position: absolute;
    bottom: 0;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    left: 50px;
}
#slogan{
    padding-top: 100px; 
    display: block;
}

@media (max-width: 1399px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
	max-width: 1399px;
    }

}
@media (max-width: 1260px){
    .text-banner{
	font-size: 2.8rem;
    }
    #nuestra_institucion img, #nuestra_actividad img, #nuestro_equipo img{
	width: 259px; 
	height: auto;
    }
    .home_cards_text{
	font-size: 2.2rem;
    }
    #quienes_container{
	position: relative;
	padding: 30px;
	width: 62%;
	margin-left: 38%;
    }
    .title_section{
	font-size: 2rem;
    }
    .home_descriptions{
	font-size: 1rem;
    }
    #img_quienes{
	max-width: 38%;
	transform: translate(0px, -10px);

    }
    #img_ofrecemos, #img_contactanos{
	width: auto;
	max-width: 375px;
    }
    #tag_ofrecemos{
	width: 80px;
	transform: translate(-40px, 76px);
    }
    .space{
	height: 167px;
    }

    #ofrecemos_container{
	padding: 30px;
    }
    #ofrecemos_container p{
	max-width: 75%;
    }
    #tag_contactanos{
	width: 80px;
	transform: translate(-427px, -175px) !important;
    }
    #nuestra_institucion:hover img,
    #nuestra_actividad:hover img,
    #nuestro_equipo:hover img{
	width: 259px;
	height: auto;
	box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.75);
    }
    .banner-novedades .text-banner{
	margin-left: 45%;
    }
    #img_ofrecemos_group {
	right: 386px;
    }
}
@media screen and (max-width:1024px){
    .audio_background_home{
	margin: 0 34px;
    }
    .audio_home{
	left:34px;
    }

}
@media screen and (max-width:1002px){
    .menu-header{
	margin-left: 100px;
    }

    #img_ofrecemos{
	left: 0;
    }
    .banner-home{
	background-position: -255px 0;
    }
    .player_home{
	width: 80%;
    }
    .audio_background_home{
	width: 100%;
    }
    .audio_background_home{
	width: 100%;
    }
    /*.nav_section_home{
	width: 240px;
    }*/
    .nav_section_option a{
	padding: 0;
    }

}
@media screen and (max-width:953px){
    .nav_section_2 .border_right{
	display: none;
    }
}
@media screen and (max-width:900px){
    #nuestra_institucion img, #nuestra_actividad img, #nuestro_equipo img{
	max-width: none;
    }
    #tag_contactanos, #tag_mision, #tag_modelo, #tag_ofrecemos{
	display: none;
    }
    .container-banner{
	padding: 0;
    }
    #ofrecemos_container p{
	max-width: 100%;
    }
    .navbar-toggler{
	display: block;
    }
    .menu-group{
	width: 100%;
    }
    .menu-options{
	display: none;
    }
    .navbar-brand{
	margin: auto;
    }
    #nuestra_institucion img, #nuestra_actividad img, #nuestro_equipo img{
	width: 100%;
	height: auto;
    }

    #nuestra_institucion:hover img,
    #nuestra_actividad:hover img,
    #nuestro_equipo:hover img{
	width: 100%;
	height: auto;
	box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.75);
    }

    .home_cards a{
	width: 30%;
    }
    #contactanos_container{
	margin-left: 0;
	padding: 20px 30px;
	background-color: #e9f1f7;
    }
    .text-banner{
	font-size: 2.3rem;
	line-height: 3rem;
    }
    #tag_contactanos, #tag_ofrecemos, #tag_quienes{
	display: none;
    }
    #quienes_container{
	width: 100%;
	margin-left: 0;
    }
    #img_quienes, #img_ofrecemos, #img_ofrecemos_group, #img_contactanos, #img_contactanos_group{
	transform: none;
	position: relative;
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	left: 0;
    }
    #ofrecemos_container, #compromiso_container{
	width: 100%;
    }
    .space{
	height: 0;
    }
    .home_descriptions{
	line-height: 1.4rem;
    }
    .title_section{
	font-size: 1.8rem;
    }

    .home_descriptions{
	margin-top: 7px;
    }
    .banner-home{
	background-position: -300px 0;
    }
    .navbar .navbar-brand img{
	transform: translateX(-40px);
    }
    #contactanos_container{
	margin-top: 0;
    }
    .name-user{
	display: none;
    }
    .name-user-mobile{
	display: block;
    }
    .nav_section_option a, .nav_section_option_podcast a{
	padding: 10px 20px;
    }

    .nav_section .nav_section_option, .nav_section .nav_section_option_podcast{
	padding: 0 20px;
    }
    #img_ofrecemos_group {
	right: 0;
    }
    #compromiso_container{
	padding: 30px;
    }
}

@media screen and (max-width:720px){
    #nuestra_institucion, #nuestra_actividad, #nuestro_equipo{
	/*height: 32vh;*/
    }
    .home_cards_text{
	font-size: 1.2rem;
	line-height: 1.5rem;
    }
    #nuestra_institucion{
	transform: translateY(-50px);
    }
    #nuestra_actividad{
	transform: translateY(-80px);

    }
    #nuestro_equipo{
	transform: translateY(-25px);

    }
    .banner-container{
	height: 500px;
    }
    #nuestra_institucion:hover img,
    #nuestra_actividad:hover img,
    #nuestro_equipo:hover img{
	width: 100%;
	height: auto;
	box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.75);
    }
    .banner-home{
	background-position: -322px 0;
    }
    .banner-home .text-banner{
	padding-top: 100px;
    }
    .banner-novedades{
	background-position: center;
	justify-content: start;
    }
    .banner-novedades .text-banner {
	margin-left: 20%;
    }
    .nav_section_home{
	padding: 30px 40px;
	/*width: 158px;*/
	padding: 0px;
    }
    #slogan{
	padding-top: 0; 
    }
}
@media screen and (max-width:619px){
    .nav_section_home{
	width: 100%;
    }
    .nav_section .nav_section_option{
	padding: 0;
    }
}
@media screen and (max-width:550px){
    .home_cards_text{
	padding: 5px 10px;
    }
    .home_cards_text {
	font-size: .9rem;
	line-height: 1.1;
    }

    footer{
	margin: 10px auto 10px;
    }

    .logo_inttelmex{
	margin-bottom: 10px;
    }
}
@media screen and (max-width:500px){
    #nuestra_institucion, #nuestra_actividad, #nuestro_equipo{
	/*height: 25vh;*/
    }
    .banner-home{
	background-position: -522px 0;
    }

}
@media screen and (max-width:473px){
    .nav_section_home .border_right{
	display: none;
    }
    /*.nav_section_home:nth-child(2n+1) {
	border-right: 1px solid #008ACF;
    }
    .nav_section_home:nth-child(-n+2) {
	border-bottom: 1px solid #008ACF;
    }*/
    .img-footer {
	height: 35px;
    }
    .nav_section .nav_section_option a {
	padding: 10px 15px;
    }
    .text-banner {
	font-size: 1.8rem;
	line-height: 2rem;
    }
}
@media screen and (max-width:380px){
    .navbar .navbar-brand img {
	transform: translateX(-20px);
    }
    .audio_background_home{
	max-width: 100%;
	margin: 0;
    }
    .player_home{
	width: 100%;
    }
    .audio_home{
	width: 100%;
	left: 0;
    }
}
@media screen and (max-width:320px){
    .navbar .navbar-brand img {
	height: 35px;
    }
}