/*css */

@import url('https://fonts.googleapis.com/css?family= Lato & display = swap');

@import url('https://fonts.googleapis.com/css?family= Roboto & display = swap');

@import url('https://fonts.googleapis.com/css?family=Roboto:900&display=swap');


@font-face {
  font-family: Gotham-Regular;
  src: url(Gotham-Regular.otf);
}
@font-face {
  font-family: Gotham-Bold;
  src: url(Gotham-Bold.otf);
}

.fuente-gotham{
    font-family: Gotham-Regular;

}
.fuente-gotham-bold{
    font-family: Gotham-Bold;
    /*color: #3f4043;*/
}
.color-oro{
	
	color:#c49216;
}
.color-gris{
	 color:#6a6d70;                
}
.lato{
	font-family: 'Lato';
	font-weight:300 ;
}
.roboto{
	font-family: 'Roboto';
   
}
.roboto-900{
  font-family: 'Roboto', sans-serif;
  font-size: 3.5em;
}
.mapa-fondo{
  background-color:#d6d6d6;

}
.footer-fondo{
  background-color:#3b3e41;

}
.footer-fondo-2{
  background-color:#2d3033;
  color:#757778;

}
.fuente-b{
   font-family: 'Roboto', sans-serif;
  font-size: 2.5em;
}

/*top  */
.top-fondo{
  background-color:#575f67;
  color:#FFF;
  font-size:13px;
}

/*fin top */
/*servicios*/
.servicio-fondo{
  background-color:#3f4245;
  color:#FFF;
}
 /*fin servicios*/


.seccion-nosotros {
   height: 100vh;
  min-height: 500px;
  background-image: url('../images/foto-nosotros.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.seccion-servicio {
   height: 100vh;
  min-height: 500px;
  background-image: url('../images/chatarra-header.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.seccion-contacto{
   height: 60vh;
  min-height: 500px;
  background-image: url('../images/inicio-contacto.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.centro-align{
  display: table-cell;
  vertical-align: middle;
  color:#FFF;
}

/*nav-bar*/


@media (min-width: 992px) {
        .navbar {
        height:50px;
        z-index:5;
    }
}
.navbar{
        background-color:#3f4043;       
        font-size: 16px;
        /*  background-color: rgba(208, 166, 62, 1);
        -webkit-box-shadow: 0px 16px 19px -6px rgba(0,0,0,0.6);
        -moz-box-shadow: 0px 16px 19px -6px rgba(0,0,0,0.6);
        box-shadow: 0px 16px 19px -6px rgba(0,0,0,0.6);*/
        /* background-image:url(../images/fondo-nav.png);
        font-family: 'Lato';*/
        font-family: Gotham-Regular;

}
.navbar-nav>li>a {
    color: rgba(255, 255, 255, 1);
   /* background-color: rgba(208, 166, 62, 1);*/

}

.color-blanco>a:hover,
.color-blanco>a:focus{
    text-decoration: underline  rgba(255, 255, 255, 1);
}

.color-reciclado>a:hover,
.color-reciclado>a:focus{
    color:#B68E2B;
    text-decoration: underline  #B68E2B;
}

.color-producto>a:hover,
.color-producto>a:focus{
    color:#0073B7;
    text-decoration: underline  #0073B7;
}


.nav-item{
	padding-left: 15px;
	padding-right:15px;
}


/* fin nav-bar  */

.seccion-pro1{
    width: 100%;
    display: table;
    height: 50vh;
    background: url(../images/reciclado-de-metales.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; 
}
.seccion-pro2{
    width: 100%;
    display: table;
    height: 50vh;
    background: url(../images/productos-siderurgico.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; 
}

.seccion-pro3{
    width: 100%;
    display: table;
    height: 50vh;
    background: url(../images/tejidos.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; 
}

.seccion-pro4{
    width: 100%;
    display: table;
    height: 50vh;
    background: url(../images/demoliciones.jpg) no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; 
}


  /* Make the image fully responsive */
  .carousel-inner img {
    width: 100%;
    height: 100%;
  }
  
/*hover efecto*/
.cont {
  position: relative;
  width: 100%;
}




.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #0073B7;
}

.cont:hover .overlay {
  opacity: 0.7;
}

.text {
  color: white;
  font-size: 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}



/*video - header*/
header {
  position: relative;
  background-color: black;
  height: 80vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

header video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

header .container {
  position: relative;
  z-index: 2;
}

header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}

@media (pointer: coarse) and (hover: none) {
  header {
  /*  background: url('https://source.unsplash.com/XT5OInaElMw/1600x900') black no-repeat center center scroll;*/
  }
  header video {
   /* display: none;*/
  }
}




/*fin video - header*/


/* Extra Small Devices, .visible-xs-* */
@media (max-width: 767px) {
  #instafeed {
display: grid;
margin: auto;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
column-gap: 0.3rem;
grid-row-gap: 0.3rem;
}

.my-custom-height {
height: 12vh;
width: 12vh;
}

}
/* Small Devices, .visible-sm-* */
@media (min-width: 768px) and (max-width: 991px) {

#instafeed {
display: grid;
margin: auto;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
column-gap: 0.3rem;
grid-row-gap: 0.3rem;
}

.my-custom-height {
height: 12vh;
width: 12vh;
}
  }

/* Medium Devices, .visible-md-* */
@media (min-width: 992px) and (max-width: 1199px) {

  #instafeed {
display: grid;
margin: auto;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
column-gap: 0.3rem;
grid-row-gap: 0.3rem;
}

.my-custom-height {
height: 40vh;
width: 40vh;
}

}

/* Large Devices, .visible-lg-* */
@media (min-width: 1200px) {

  #instafeed {
display: grid;
margin: auto;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
column-gap: 5px;
grid-row-gap: 0.6rem;
}

.my-custom-height {
height: 50vh;
width: 50vh;
}

  }


/*boton whastapp*/
.float{
  position:fixed;
  width:90px;
  height:90px;
  bottom:90px;
  right:10px;
  background-color:#666;
  border-radius:50px;
  text-align:center; 
  z-index:100;
}
.my-float{
  margin-top:16px;
}
/*fin boton ws*/