/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
 


.header-main__container {
    position: relative;
    background: #0034D9;
    padding: 5px;
    /* padding: 1.5rem 0; */ 
}



@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
 /*Aqui van estilos de banner */
  .banner__inner {
    width: 100%;
    max-width: none!important;
    top: 2rem;
  }
.pad {height:auto !important;
min-height: 340px !important;

}
@media (max-width: 767px)
  {
h1 {
    font-size: 40px !important;
    line-height: 40px !important;
    }}

.container-IconText-perfil{ box-shadow: 0 5px 10px #eee !important;display: flex;
  justify-content: center; /* Centrar horizontalmente */
  align-items: center; /* Centrar verticalmente */
}
.container-IconText-perfil:hover{ box-shadow: 0 5px 10px #eee !important;}
.container-icon-img:hover{    box-shadow: 0 5px 10px #eee !important;
  }
  

 .container-icon-img{
    box-shadow: 0 5px 10px #eee;
    
  }
.text-italic {
    font-style: normal;
    line-height: 1.7;
    font-size: 15px;
  padding-top:30px;
}

.container-testimonios .glide__slide {
    background: #F2F2F2 !important;
    font-family: 'Roboto', sans-serif;
    color: #000000;
}

/*revisar*/
.container-iconText p {
    color: #7f7f7f!important;
    font-size: 15px!important;
    text-align: justify!important;
}
/* */

.header-main__menu-nav-container {

    margin-right: 100px;
}


.description h6 {
    font-family: 'Roboto', sans-serif;
    text-transform: capitalize;
    font-weight: bold;
    color: #333333;
    font-size: 16px;
}

.direc{
text-align:center !important;
}
.contenido {
   text-align:left!important; 
}

.container-testimonios{
text-align:left!important;
}

.container-iconText img {
    width: 80px;
    height: 57px !important;
    margin: 0 0 20px 0;
}
.text-italic {
  font-style: normal;
  line-height: 1.7;
}
.container-fluid {
    width: 100%;
    padding-right: 0px !important; 
    padding-left: 0px !important; 
    margin-right: auto;
    margin-left: auto;
}

  
  .contain_description-img {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
.contain_description-img img {
  max-width: 250px!important;
}
  @media screen and (max-width: 1024px) {
    .hero-banner .content-position {
      top: 4rem;
    }
  }
@media screen and (max-width: 768px) {
    .container-testimonios-inicio p.text-italic {
    width: 300px !important;
    text-align: center;
}
  }

  @media screen and (max-width: 500px){
    .container-iconText-postulacion{
    margin: 0 auto !important;
          margin-top: 10px !important;
    margin-bottom: 10px !important;
      min-height: 300px !important;
    }
    
    .tarjeta-larga{min-height:300px;!important}
    
    .contain_description-img img {
      max-width: 120px!important; }
    
    .hero-banner .content-position {
      top: 2rem;
    }
    .contain_description-img {
      align-items: flex-start;
      flex-direction: column;
      margin-bottom: 30px;
    }
  }
/*estilos para titulo banner con linea roja*/
.title-banner{
   position: relative; 
     padding-left: 20px;
      color: #fff; 
      font-size: 48px; 
  text-align:left;
}
.title-banner::before {
      content: ""; 
      position: absolute; 
      top: 0;
      left: 0;
      width: 4px; 
      height: 100%; 
      background-color: red; 
}
/* Aqui finaliza estilos del banner */
/
/*estilos de seccion beneficios */
.container-beneficios{
    width: 280px!important;
    font-family: 'Roboto', sans-serif;
    height: 380px!important;
    text-align: center;
     min-height: 470px;
    padding: 35px 15px 0!important;
}
.container-beneficios h2{
font-size:50px!important;
  color:#009ed9;
  
}
.container-beneficios h3{
font-size:24px!important;
  color:#003087!important;
}
.container-beneficios p{
font-size:15px!important;
  color:#000000!important;
}
/*---------------------------------------*/
/*cards seccion elegir programa*/
.container-iconText h4{
  color:#333333;
  font-size:18px;
}


/*seccion acreditaciones y rankings*/
..tarjeta-larga{
  min-height:400px!important;
}
.tarjeta-larga p{
color:#000000!important;
  font-size:15px!important;
  text-align:left!important;
}
/*---------------------------------------*/
.glide__slide, .glide__slide--active {
    background: #ffffff !important;
    font-family: 'Roboto', sans-serif;
    color: #000000!important;
}
/*--------*/
/*--------------------------------*/
/*font family cards inicio*/
.pad{
  box-shadow: 0 5px 10px #eee!important;
}
.pad p span{
font-family: 'PT Sans', sans-serif!important;
}
 /*------------------------------------*/
/*contenedor de cards finanzas*/
.redondo img{
 
}
.redondo img:hover{
  /*falta css para el color de la imagen sea rojo*/  
}
.redondo h4{
  font-size:15px!important;
  color:#333333!important;
}
/*titulos*/
.container-title h2::before,
.container-title h2::after {
  content: "";
  width: 20px;
  height: 4px;
  background-color: #02ACEE;
  display: inline-block;
  position: relative;
  top: -6px;
  margin:0 15px;
}
.container-title h2::before {
  margin: 0 15px 0 0;
}
.container-title h2::after {
  margin: 0 0 0 15px;
}
/* seccion de desarrollo de carrera*/
.container-iconText-section-carrera p{
  font-size:15px!important;
  color:#000000!important;
}
@media screen and (max-width: 500px) {
  .container-title h2 {
    font-size: 24px;
  }
  h1 {
    font-size: 36px!important;
  }
}

/* ===== Fix de tipografia (Roboto) =====
   El theme bundle (template_main.css) declara body, p, form y .submitted-message
   con font-weight: 100 (Roboto Thin), lo que hace que los parrafos se vean
   finisimos cuando el browser carga efectivamente la variante Thin de Roboto.
   Forzamos peso 400 (Regular) en esos selectores.
   El override de header a evita el underline que mete Bootstrap. */
body,
p,
form,
.submitted-message {
  font-weight: 400;
}
header a {
  text-decoration: none !important;
}