/**
ESTILOS GENERALES

AZUL HEX: #0A057B 
AZUL RGB: 10-5-123

celeste HEX: #47b2e4 
celeste RGB: 71-178-228

gris claro: #DDDDDD;

*/

/* submenu ini */

.submenu-col{
    margin-bottom: 20px;
    border-right: 1px solid var(--gris-10);
}
#submenu .nav-link{
    border-bottom:2px solid var(--gris-10);
    white-space:normal;
    color: var(--azul);;
}
#submenu .active{
    color: black;
}
/* submenu-select y group ini */
#submenu-select{
    display: none;
    margin-right: 10px;
}
#submenu-group, #submenu-group .btn-group{
    display: none;
}
.ocultar-movil{
    display: inline;
}
@media (max-width: 576px) {
    #submenu{
        display:none;
    }
    #submenu-select{
        display:inline;
    }
    #submenu-group, #submenu-group .btn-group{
        display: inline;
    }
    .ocultar-movil{
        display: none;
    }
}

/* submenu / select fin */
/* noticia ini */
.noticia-ind .texto{
    margin-top: 20px;
    font-size: 1rem;

}
/* noticia end */

/* historia */

.historia h1{
    color: var(--azul);
    text-align: center;
}
.historia img.logo{
    max-width: 35%;
    margin:20px;
}
@media (max-width: 768px) {

    .historia img.logo{
        max-width: 80%;
        margin:20px;
    }
}

/* historia end */

/* comisiones*/
.comisiones img.logo{
    max-width: 45%;
    margin:20px;
}

    #facpce th{
        font-size: 0.8rem;
        min-width: 220px;
    }
    #facpce td{
        font-size: 0.8rem;
        white-space: nowrap;
    }
@media (max-width: 768px) {

    .comisiones img.logo{
        max-width: 90%;
        margin:20px;
    }
}
/* comisiones fin*/

/* resoluciones y normativas */
    #tabla-descargas th,
    #tabla-descargas td {
        padding: 10px;
        text-align: left;
    }

    #tabla-descargas .vertical {
        text-align:left;
        white-space: nowrap;
        vertical-align: middle;
        width:1%;
        font-weight: bold;
    }
    #tabla-descargas th.detalle {
        padding-left: 20px;
    }
   
    .btn-primary{
        background-color: var(--azul);
    }
/* resoluciones y normativas fin */

/* secretaria tecnica*/
.secretaria-tecnica .accordion-button{
    background-color: var(--gris-10);
    color: var(--azul);
    font-weight: 500;
}
.secretaria-tecnica .accordion-button:hover {
    color: #000;
}
.secretaria-tecnica .accordion-button span {
    color: var(--celeste);
    font-weight: 600;
    padding-right: 10px;
  }

/* secretaria tecnica - preguntas frecuentes*/

.preguntas-frecuentes .accordion-button{
    background-color: var(--gris-10);
    color: var(--azul);
    font-weight: 500;
}
.preguntas-frecuentes .accordion-button:hover {
    color: #000;
}
.preguntas-frecuentes .accordion-button span {
    color: var(--celeste);
    font-weight: 600;
    padding-right: 10px;
  }

/* */

#sipres-head {
    padding: 10px 20px 10px 20px;
    background-color: var(--celeste);;
    margin-bottom: 20px;
    border-radius: 10px;
    
}
#sipres-head .sipres-logo {
    max-width: 200px;
}
#sipres-head .sipres-logo img {
     width: 100%;
    height: 100%;
    padding: 10px 0 10px 0;
}
#sipres-head .sipres-titulo{
    color:white;
    font-size: 1.4rem;
    line-height: 1.2rem;
    
}

/* noticias archivo */
.noticias .noticias-archivo-box{
    margin-bottom: 10px;

}
.noticias .noticias-archivo-box .card{
  height: 100%;
}
.noticias .noticias-archivo-box .card:hover {
  border: 1px solid var(--azul);
  transition: ease-in-out 0.3s;
}
.noticias-archivo-box img{
  width: 100%;
  height: 14rem;
  object-fit: cover;
}
.noticias-archivo-box .card-title{
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--azul);
  margin:0;
}
.noticias-archivo-box .card-body,
.noticias-archivo-box .card-footer{
  padding: 10px;
  color:var(--gris-50);
}
.noticias-archivo-box .card-footer{
  padding: 5px 10px 5px 10px;
  font-size: 0.75rem;
}
/* noticias archivo fin */

/* beneficios */
.beneficios .beneficios-box{
    margin-bottom: 10px;

}
.beneficios .beneficios-box .card{
  height: 100%;
}
.beneficios .beneficios-box .card:hover {
  border: 1px solid var(--azul);
  transition: ease-in-out 0.3s;
}
.beneficios-box img{
  width: 100%;
  filter: grayscale(1);
}
.beneficios-box img:hover{
    width: 100%;
    filter: grayscale(0);
  }
@media (max-width: 768px) {

    .beneficios-box img{
        filter: grayscale(0);
      }
}
.beneficios .beneficios-box .card-title{
  font-size: 0.8em;
  font-weight: 500;
  color: var(--azul);
  margin:0;
  text-align: center;
}
.beneficios .beneficios-box .card-body {
  padding: 10px;
  color:var(--gris-50);
}
.beneficios .beneficios-box .card-footer{
  padding: 5px 10px 5px 10px;
  font-size: 0.75rem;
}
/* beneficios fin */

/* beneficio detalle */
#beneficio-detalle .seccion {
    font-size: 0.8rem;
    color:var(--azul);
    
}
#beneficio-detalle .titulo {
    font-size: 1.2rem;
    font-weight: 500;
    color:var(--azul);
    
}
#beneficio-detalle .cuerpo {
    font-size: 1rem;
    margin: 10px 0 10px 0;
    padding: 10px 0 10px 0;
    border-top: 1px solid var(--gris-10);
    border-bottom: 1px solid var(--gris-10);
}
#beneficio-detalle .fecha {
    font-size: 0.8rem;
}
#beneficio-detalle .categoria {
    font-size: 0.8rem;
}
/* fin beneficio detalle */

/* bolsa de trabajo */
.bolsa .bolsa-box{
    margin-bottom: 10px;

}
.bolsa .bolsa-box .card{
  height: 100%;
}
.bolsa .bolsa-box .card:hover {
  border: 1px solid var(--azul);
  transition: ease-in-out 0.3s;
}
.bolsa .bolsa-box .card-header{
    padding: 5px 10px 5px 10px;
    font-size: 0.8rem;
}
.bolsa .bolsa-box .card-body {
  padding: 10px 10px 0 10px;
  margin-bottom: 0;
  color:var(--gris-50);
}
.bolsa .bolsa-box .card-title{
    font-size: 1.2em;
    font-weight: 500;
    color: var(--azul);
    margin:0;
  }
  .bolsa .bolsa-box p{
      font-size: 0.9em;
      margin-bottom: 5px;
  }
.bolsa .bolsa-box .card-footer{
  padding: 5px 10px 5px 10px;
  font-size: 0.75rem;
}
/* bolsa de trabajo fin */

/* bolsa detalle */
.bolsa-detalle .logo{
    text-align: left;
}
.bolsa-detalle .empresa{
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--gris-10);
}
.bolsa-detalle .logo img{
    max-width: 180px;
    max-height: 100px;
    margin: 20px;
}
.bolsa-detalle .img-busqueda img {
    max-width: 30%;
    min-width: 300px;
    border: 5px solid var(--gris-10);
}
.bolsa-detalle .img-zoom{
    font-size: 0.8em;
    color: var(--gris-50);
}

/* agenda de capacitaciones */

.agenda .agenda-box{
    margin-bottom: 10px;
}
.agenda .agenda-box .card{
  height: 100%;
}
.agenda .agenda-box .card:hover {
  border: 1px solid var(--azul);
  transition: ease-in-out 0.3s;
}
.agenda .agenda-box .card-header{
    padding: 5px 10px 5px 10px;
    font-size: 0.8rem;
}
.agenda .agenda-box .card-body {
  padding: 10px 10px 0 10px;
  margin-bottom: 0;
  color:var(--gris-50);
}
.agenda .agenda-box .card-title{
    font-size: 1.2em;
    font-weight: 500;
    color: var(--azul);
    margin:0;
  }
  .agenda .agenda-box p{
      font-size: 0.9em;
      margin-bottom: 5px;
  }
.agenda .agenda-box .card-footer{
  padding: 5px 10px 5px 10px;
  font-size: 0.75rem;
}

.agenda .agenda-box .agenda-body {
    display: flex;
  }
  
  .agenda .agenda-box .columna-thumbnail {
    flex: 0 0 auto;
  }
  
  .agenda .agenda-box .columna-thumbnail img {
    max-width: 100px;
    height: auto;
    padding: 0 10px 10px 10px;
  }
  
  .agenda .agenda-box .columna-texto {
    flex: 1 1 auto;
    padding-left: 10px;
  }
  
  /* agenda detalle */
.agenda-detalle .agenda-datos{
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--gris-10);
}
.agenda-detalle .img-agenda img {
    max-width: 30%;
    min-width: 300px;
    border: 5px solid var(--gris-10);
}
.agenda-detalle .img-zoom{
    font-size: 0.8em;
    color: var(--gris-50);
}

/* agenda form inscripcion */
.agenda .inscrip-form {
    width: 100%;
    border-top: 3px solid var(--celeste);
    border-bottom: 3px solid var(--celeste);
    background: #fff;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
  }
  .agenda .inscrip-form .row-alert{
    padding: 10px;
  }
  
  .agenda .inscrip-form .validate {
    display: none;
    color: red;
    margin: 0 0 15px 0;
    font-weight: 400;
    font-size: 13px;
  }
  
  .agenda .inscrip-form .error-message {
    display: none;
    color: #fff;
    background: #ed3c0d;
    text-align: left;
    padding: 15px;
    font-weight: 600;
  }
  
  .agenda .inscrip-form .error-message br+br {
    margin-top: 25px;
  }
  
  .agenda .inscrip-form .sent-message {
    display: none;
    color: #fff;
    background: #18d26e;
    text-align: center;
    padding: 15px;
    font-weight: 600;
  }
  .agenda .inscrip-form label {
    padding-bottom: 8px;
  }
  
  .agenda .inscrip-form .loading {
    display: none;
    background: #fff;
    text-align: center;
    padding: 15px;
  }
  
  .agenda .inscrip-form .loading:before {
    content: "";
    display: inline-block;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    margin: 0 10px -6px 0;
    border: 3px solid #18d26e;
    border-top-color: #eee;
    animation: animate-loading 1s linear infinite;
  }
  
  .agenda .inscrip-form .form-group {
    margin-bottom: 20px;
  }
  
  .agenda .inscrip-form label {
    padding-bottom: 8px;
  }
  
  .agenda .inscrip-form input,
  .agenda .inscrip-form select,
  .agenda .inscrip-form textarea {
    border-radius: 0;
    box-shadow: none;
    font-size: 14px;
    border-radius: 4px;
  }
  
  .agenda .inscrip-form input:focus,
  .agenda .inscrip-form select:focus,
  .agenda .inscrip-form textarea:focus {
    border-color: var(--celeste);
  }
  
  .agenda .inscrip-form input,
  .agenda .inscrip-form select {
    height: 44px;
  }
  
  .agenda .inscrip-form textarea {
    padding: 10px 12px;
  }
  
  .agenda .inscrip-form button[type=submit] {
    background: var(--celeste);
    border: 0;
    padding: 12px 34px;
    color: #fff;
    transition: 0.4s;
    border-radius: 50px;
  }
  
  .agenda .inscrip-form button[type=submit]:hover {
    background: var(--celeste);
  }

  .agenda .inscrip-form .btn-secondary {
    background: var(--gris-50);
    border: 0;
    padding: 12px 34px;
    color: #fff;
    transition: 0.4s;
    border-radius: 50px;
  }

  .agenda cite {
    color: var(--gris-50);
    font-size: 0.8rem;
  }