html, body{
  overflow-x: hidden;
}
html{
  overflow-x: hidden;
  min-height: 100%;
  position: relative;
}

@font-face { /*llamado a la fuente InterstateBold*/
  font-family: "InterstateBold";
  src: url(font/InterstateBold.ttf);

}
@font-face { /*llamado a la fuente InterstateLight*/
  font-family: "InterstateLight";
  src: url(font/InterstateLight.ttf);
}
@font-face { /*llamado a la fuente Interstate-Regular*/
  font-family: "Interstate-Regular";
  src: url(font/Interstate-Regular.ttf);
}
/*estilo de la pagina de inicio (Index)*/
#imagenJum{ /*posicion de la imagen del background del jumbotron*/
  position: absolute;
  top: 0px;
  left: 0px;
}
.imagen-grande{
  visibility: hidden;
}
.jumbotron{ /*asiganacion de la fuente al contenido del jumbotron, tamaño de funte y color de background*/
  font-family: "Interstate-Regular";
  font-size: 1.5vw;
  background-color: white;
  padding-top: 0px;
  /*background: url(../img/websiteGrupo-Alterra.jpg);
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 border-radius: 0px;
 padding-top: 40px;*/
}
#btnBuscar{ /*borde del boton bucar, color de fondo y color de letra*/
  border-radius: 5px;
  background-color: #02A8E1;
  color: white;
  height: 30px;
}

#inpBuscar{ /*color de fondo del input buscar y color de letra*/
  background-color: #02A8E1;
  color: white;
  height: 30px;
}
#inpBuscar::placeholder{ /*asiganandole color blanco al texto de referencia del buscador*/
  color: white;

}
#divLiNav{ /*padding de 5 pixeles hacia abajo al contenedor de la lista de link de nav*/

}
li{ /*margen de 20 pixeles hacia la derecha al la lista de link del nav*/
  margin-right: 11px;
}
.dropdown-menu{ /*agregandole color al fondo del menu desplegable*/
  background-color: #02A8E1;
}
.dropdown-item{ /*asignandole color blanco a las laetras del menu desplegable*/
  color: white;
}
.dropdown-item:hover{ /*aplicando un efecto de sombreado a los link de la lista desplegable*/
  color: #6D2A91;
  background-color: #02A8E1;
}
.container-tarjeta{ /*aplicando un padding de 90 pixeles al contenedor de las imagenes de ferremix e impacto ferretero*/
  padding-top: 80px;
}
.sobreGrupoAlterra{ /*agregandole tipo de letra, color y un margen desde bajo al titulo*/
  font-family: "InterstateLight";
  color: #02A8E1;
  margin-bottom: 1px;
}
hr{ /*agregandole un color de fondo, un margen hacia arriba y un margen hacia bajo a la linea de division hr*/
  background-color: #6D2A91;
  margin-top: 0px;
  margin-bottom: 1px;
}
p{ /*asignandole tipo de letra, color de letra, tamaño de letra y margen hacia bajo de 1 pixel*/
  font-family: "InterstateBold";
  color: #717070;
  font-size: 15px;
  margin-bottom: 1px;
}
.pContinua{ /*asiganacion de tipo de letra, color de letra, color de fondo del link, altura y anchura, al link de continua conociendo*/
  font-family: "InterstateBold";
  color: white !important;
  background-color: #6D2A91;
  width: 220px;
  height: 30px;
}
#linkPills{ /*asignando color de fondo y color de letras a los botones de cambio de contenido*/
  background-color: #02A8E1;
  color: #02A8E1;
}
#rowNovedades{  /*asignando tipos de letra, margen hacia arriba, color de fondo, color de letra y un padding hacia bajo a la fila de novedades*/
  font-family: "InterstateBold";
  margin-top: 100px;
  background-color: #02A8E1;
  color: white;
  padding-bottom: 10px;
  margin-right: 0px;
  padding-top: 10px;
}
p.p-contenido{ /*asignando tipo de letra y tamaño de letra a los texto de contenido*/
  font-family: "InterstateLight";
  font-size: 13px;
}
#copy{ /*asignando tipo de letra y tamaño de letra a el COPYRIGHT*/
  font-family: "InterstateLight";
  font-size: 2vh;
}
.footer{
  bottom: 0;
  height: 100px; /* valor que necesites */
  position: absolute;
  width: 99%
}
/*estilo de la pagina de quienes somos*/
#containerQuienesSomos{
  margin-top: 150px;
}

.contenidoSomos{
  font-family: "InterstateLight";
  font-size: 3vh, 3vw;
}
.row-historia{
  background-color: #02A8E1;
  padding-left: 5px;
  padding-right: 5px;
}
.h5-quienesSomos{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.contenidoSomos{
  font-family: "InterstateLight";
}
.h6-historia{
  font-family: "InterstateBold";
}
.p-historia{
  font-family: "InterstateLight";
}
.container-historia{
  padding-top: 10px;
  padding-bottom: 10px;
}
.col-historia{
  border-right: solid  white 1px;
}
.container-filosofia{
  padding-top: 20px;
}
.h6-historia2{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.h6-mision, .h6-valores{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.p-mision, .p-vision, .li-valores{
  font-family: "InterstateLight";
}
#col-mision{
  border-top: solid #6D2A91 1px;
}
#col-vision{
  border-top: solid #6D2A91 1px;
  background-color: #6D2A91;
}
#col-valores{
  border-top: solid #6D2A91 1px;
}

/*estilos de la pagina de nuestras empresas*/
.container-nuestasEmpresas{
  padding-top: 80px;
}
.row-titulo{
  padding-left: 10px;
  padding-top: 5PX;
  font-family: "Interstate-Regular";
  font-size: 2vh;
  color: #02A8E1;
}
.row-contenidoNE{
  padding-top: 15px;
  padding-left: 5PX;
}
.p-contenidoNE{
  font-family: "InterstateLight";
}
.b-grupoAlterra{
  color: #02A8E1;
}
.row-tarjetasEmp{
  padding-top: 20px;
}
.row-contenidoFerremix, .row-contenidoImpacto{
  padding-top: 10px;
}
.contenidoFerremix, .contenidoImpacto{
  font-family: "InterstateLight";
}
.footer-nuestrasEmpresas{
  background-color: #6D2A91;
  bottom: 0;
  height: 40px; /* valor que necesites */
  position: absolute;
  width: 100%
}
.p-COPYRIGHT{
  font-family: "InterstateLight";
  font-size: 2vh, 2vw;
}
#headingOne, #headingTwo{
  background-color: #02A8E1;
  font-family: "InterstateBold";
  border-radius: 5px;
}
.h5-direccion{
  font-family: "InterstateBold";
}
/*estilos de la pagina de empleos*/
.container-empleos{
  padding-top: 80px;
}
.h5-empleo, .h5-unete, .p-familia{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.linkDescargaSolicitud{
  font-family: "InterstateLight";
  margin-top: 15px;
  color: white;
}
.col-descargaSolicitud{
  margin-top: 100px;
  background-color: #6D2A91;
  padding-top: 5px;
}
.p-familia{
  font-family: "InterstateBold";
}
.row-contenidoEmpleo{
  padding-top: 15px;
}
.p-contenidoEmpleo{
  font-family: "InterstateLight";
}
.row-vacante{
  padding-top: 100px;
  background-color: #02A8E1;
  padding-bottom: 100px;
}
.h5-tituloVacante{
  font-family: "InterstateLight";
  color: white;
}
.link-a{
  background-color: #6D2A91;
  padding-top: 5px;
  height: 40px;
  width: 250px;
}
.link-a2{
  background-color: #6D2A91;
  padding-top: 5px;
  width: 250px;
}
.mb-0{/*asignandole tipo de letra al titulo directorio de tiendas de la pagina directorio*/
  font-family: "InterstateBold";
}
.h5-bancos{
  font-family: "InterstateBold";
}
.row-titulo-bancos{
  background-color: #02A8E1;
  border-radius: 3px;
}
.row-bancos{
  background-color: #6D2A91;
  border-radius: 5px;
}
.p-local{
  font-family: "InterstateLight";
}
/* estilos de la pagina de contactos */
.row-contactos{
  padding-top: 20px;
  font-family: "InterstateBold";
}
.row-titulo-contactos{
  background-color: #02A8E1;
  padding-left: 2px;
  padding-top: 2px;
  margin-left: 1px;
  border-radius: 5px;
  margin-right: 1px;
}
.h5-contactenos{
  margin-left: 3px;
  color: white;
}
.btn-contactos{
  background-color: #6D2A91;
  color: white;
}
.row-datos-contactos{
  background-color: #6D2A91;
  padding-left: 2px;
  padding-top: 2px;
  margin-left: 1px;
  border-radius: 5px;
  margin-right: 1px;
}
/* estilo de la pagina de blog */
.col-lista{
  background-color: #EEEEEE;
  padding-top: 5px;
  padding-bottom: 5px;
  border-radius: 5px;
  overflow: auto;
  margin-bottom: 5px;
}
.h5-blog{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.b-numero{
  font-family: "InterstateBold";
  color: gray;
}
.col-contenido{
  background-color: #EEEEEE;
  border-radius: 5px;
  padding-top: 15px;
}
.h5-tapitas{
  font-family: "InterstateBold";
  color: #02A8E1;
}
.carousel-item{
  background: rgb(131,68,153);
  background: linear-gradient(0deg, rgba(131,68,153,1) 22%, rgba(214,191,220,1) 51%, rgba(255,255,255,1) 75%);
  max-height: 360px;
  border-radius: 5px;
}
.p-fecha{
  font-family: "InterstateBold";
}
.b-fecha{
  color: #02A8E1;
}
.p-contenidoTapitas{
  font-family: "InterstateLight";
}
.col-blog{
  border-bottom: 2px #02A8E1 solid;
  padding-left: 1px;
}
.blog-link{
  font-family: "InterstateLight";
}
.col-nombreVacante{
  background-color: #EEEEEE;
  padding-top: 5px;
  padding-bottom: 5px;
  border-radius: 5px;
  margin-bottom: 5px;
}
.formacion-otros{
  display: none;
}
.referente{
  display: none;
}
.posicion{

}
#btnEnviar{
  font-family: "InterstateBold";
  background-color: #02A8E1;
  color: white;
}
.linkotros{
  text-decoration: none !important;
  color: black;
  background-color: white;
  padding: 10px;
  border: dashed black 2px;
}
.linkotros:hover{
  text-decoration: none !important;
  color: black;
  background-color: #02A8E1;
  padding: 10px;
  border: dashed black 2px;
}
.sinvacante{
  background-color: #EEEEEE;
  border-radius: 5px;
  min-height: 150px;
  border: dashed black 2px;
}
.colsinvacante{
  margin-top: 25px;
  padding-left: 20px;
}
input[type="file"]#currilum-env{
   width: 0.1px;
   height: 0.1px;
   opacity: 0;
   overflow: hidden;
   position: absolute;
   z-index: -1;
}
 label[for="currilum-env"]{
 font-size: 14px;
 font-weight: 600;
 color: #fff;
 background-color: #106BA0;
 display: inline-block;
 transition: all .5s;
 cursor: pointer;
 padding: 15px 40px !important;
 text-transform: uppercase;
 width: fit-content;
 text-align: center;
 }
 input[type="file"]#currilum-env2{
   width: 0.1px;
   height: 0.1px;
   opacity: 0;
   overflow: hidden;
   position: absolute;
   z-index: -1;
}
 label[for="currilum-env2"]{
 font-size: 14px;
 font-weight: 600;
 color: #fff;
 background-color: #106BA0;
 display: inline-block;
 transition: all .5s;
 cursor: pointer;
 padding: 15px 40px !important;
 text-transform: uppercase;
 width: fit-content;
 text-align: center;
 }
#carrera{
  display: none;
}
.coladmin{
  background-color: #282C34;
  margin-top: 40px;
  border-top-right-radius: 3px;
  color: white;
}
.linkadmin{
  text-decoration: none;
}
.linkadmin:hover{
  text-decoration: none;
}
.tituloTabla{
  font-size: 15px;
  padding: 0px;
  margin: 0px;
}
.contenidoTabla{
  font-size: 15px;
  padding: 0px;
  margin: 0px;
}
#comentario{
  display: none;
}
.noticiasTitulo{
  color: #6D2A91;
}
@media (min-width: 1952px) {
  .imagen-grande{
    visibility: visible;
  }
  .imagen-normal{
    visibility: hidden;
  }
  .container-tarjeta{ /*aplicando un padding de 90 pixeles al contenedor de las imagenes de ferremix e impacto ferretero*/
    padding-top: 220px;
  }
}
@media (min-width: 1700px) and (max-width: 1952px){
  .container-tarjeta{ /*aplicando un padding de 90 pixeles al contenedor de las imagenes de ferremix e impacto ferretero*/
    padding-top: 130px;
  }
}
@media (min-width: 1500px) {
  .container-blog{
    padding-top: 100px;
  }
}
@media (min-width: 2400px) {
  .container-blog{
    padding-top: 150px;
  }
}
@media (min-width: 1200px) {
  .row-contactos{
    padding-top: 150px;
  }
}
@media (min-width: 2200px) {
  .row-contactos{
    padding-top: 200px;
  }
}
@media (min-width: 2200px) {
  .row-contactos{
    padding-top: 260px;
  }
}
@media (min-width: 1300px) {
  .container-nuestasEmpresas{
    padding-top: 150px;
  }
}
@media (min-width: 2100px) {
  .container-nuestasEmpresas{
    padding-top: 200px;
  }
}
@media (min-width: 2400px) {
  .container-nuestasEmpresas{
    padding-top: 250px;
  }
}
@media  (min-width: 2000px) {
  .container-empleos{
    padding-top: 200px;
  }
}
@media (min-width: 1600px) {
  .container-filosofia{
    padding-top: 200px;
  }
}
@media (min-width: 1300px) {
  #historia{
    margin-top: 250px;
  }
}
@media (min-width: 1600px) {
  .container-otrosServicios{
    padding-top: 200px;
  }
}
@media (min-width: 1750px) {
  #containerQuienesSomos{
    margin-top: 260px;
  }

}