@charset "UTF-8";
/* CSS Document */
*:focus {outline: none !important;}
input:focus, button:focus{box-shadow: none !important;}
body {width: 100%; color:#000;height: 100%; line-height:22px; font-size:16px;position: relative; font-family:'Montserrat', sans-serif; font-weight:300;}
html {width: 100%;height: 100%;}
img{ width:100%;}
*::selection{background:#ff0000; color:#fff;}
h1{letter-spacing: 3px;color:#000; font-size:33px; font-family:'Josefin Sans', sans-serif; }
h2{font-size:25px;  font-family:'Josefin Sans', sans-serif; letter-spacing:2px;}
h3{font-family: 'Josefin Sans', sans-serif; line-height:55px;font-size:60px; color:#fff;letter-spacing: 10px;}
h4{}
h5{font-weight:500; font-size:17px; text-align:center; letter-spacing: 3px;}
a{}
b{font-weight:500;}
a{color:#000;}
a:hover, a:visited, a:active, a:focus{text-decoration: none; color:#000;}
p{letter-spacing:.8px; line-height:24px;}
.btn-hilos,.btn-hilos:visited, .btn-hilos:focus, .btn-hilos:active{display:inline-block; letter-spacing:2px; transition: all ease-in .2s; color:#fff; padding:10px 20px; border:1px solid #fff; margin-top:25px;}
.btn-hilos:hover{color:#000; background:#fff; transition: all ease-in .2s;}
.btn-hilos-negro,.btn-hilos-negro:focus, .btn-hilos-negro:visited, .btn-hilos-negro:active{background:transparent;display:inline-block; letter-spacing:2px; transition: all ease-in .2s; color:#000; padding:10px 20px; border:1px solid #000;font-weight:300;}
.btn-hilos-negro:disabled{background:#ddd !important; color:#fff !important; border:none;}
.btn-hilos-negro:hover{color:#fff; background:#000; transition: all ease-in .2s;}
.header{padding-top:260px; padding-bottom:50px;}
.header h1{font-size:40px; color:#fff;text-align:Center;}

/*productos*/
#header-productos{background:url(../img/header-productos-hilos-hernan.jpg) no-repeat top fixed / 100%;}
#productos {padding: 80px 0px 0px; text-align:center;}
#productos h5{margin-bottom:10px;text-transform:uppercase;max-width:580px; margin-left:auto; margin-right:auto;}
#productos p{max-width: 830px; margin-left:auto; margin-right:auto;}
#productos .linea-negra-h{margin:30px auto 20px;}
.link-inline{border-bottom:1px solid rgba(0,0,0,1); transition:all ease-in .2s;}
.link-inline:hover{color: #f00; transition:all ease-in .2s;}
.navproductos li{display:inline-block;list-style: none;margin:0 10px 10px;}
.navproductos ul{padding-left:0;}
.navproductos {margin-top:35px;}
.navproductos li a{width:200px;}
.body-todos .nav-todos, .body-bondeados .nav-bondeados, .body-lubricados .nav-lubricados, .body-encerados .nav-encerados {background:#000; color:#fff;}
.producto h5{text-transform:uppercase;letter-spacing: .5px;margin-bottom: 0;}
.producto .modelo{text-align: center; font-size:14px; line-height: 20px;}
.producto .datos-producto p{font-size:13px; line-height:18px; margin-bottom:5px; letter-spacing: .5px;}
.producto .datos-producto b{font-size:11px;}
.producto{-webkit-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08);
-moz-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08);
box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08); padding:25px 25px 15px; margin-bottom:30px; min-height:410px;}
#listado-productos{padding-bottom:100px;}
.paginate-pagination .btn-hilos-negro{display:inline-block; width:45px; padding: 10px 0px; text-align: center;margin: 0 5px 10px;}
.paginate-pagination .btn-hilos-negro.active{background:#000; color:#fff;}
.paginate-pagination div div{display:inline-block;}
.paginate-pagination div{text-align: center;}
#cont-productos{padding-top:120px; margin-top:-80px;}

/*gracias*/
#gracias {padding: 80px 20px;}
#gracias p{max-width:550px; margin:auto;text-align:Center;}
#gracias .btn-hilos-negro{margin-top:20px;}
#header-gracias{background:url(../img/header-gracias-hilos-hernan.jpg) no-repeat top fixed / 100%;}


/*footer*/
footer{background:#000000; padding:40px 0 15px;}
footer p{font-weight:200; font-size:12px; line-height:18px; color:#fff;}
footer span{font-weight:500;}
footer a{color:#fff;border-bottom:1px solid rgba(256,256,256,0); padding-bottom:0px; transition:all ease-in .2s; display:inline-block;}
footer a:visited, footer a:focus{color:#fff;}
footer a:hover{color:#fff; border-bottom:1px solid rgba(256,256,256,0); text-decoration: underline;transition:all ease-in .2s;}
.datos{margin-top:70px;line-height:24px;}
.datos span{font-size:16px; }
.redes img{width:17px;}
.redes a{transition:all ease-in .2s;border:1px solid #fff; border-radius:50%; width:30px; margin-right:5px; line-height:25px; height:30px; text-align: center;display:inline-block;}
.redes .facebook:hover{background:#175bf6; border-color:#175bf6 !important;}
.redes .instagram:hover{background:#cd4b74; border-color:#cd4b74 !important;}
.redes .email:hover{background:#f8ba6a; border-color:#f8ba6a !important;}
.nav-footer{font-size:12px;text-align:right;margin-top:70px;}
.nav-footer a{margin-left:15px;}
.copy{font-size:10px; text-align:right;margin-top:70px;}

/*nosotros*/
.linea-negra-h{width:170px; height:1px; background:#000;}
#header-nosotros{background:url(../img/header-nosotros-hilos-hernan.jpg) no-repeat top fixed / 100%;}
#nosotros{background: url(../img/nosotros-hilos-hernan-fondos.jpg) center top /cover; padding: 80px 0px 80px 0px }
#nosotros h1{margin-top:30px; margin-bottom:0;}
#nosotros p{text-align:justify;}
#nosotros .texto{text-align:left;line-height:26px;text-transform: uppercase;color:#000;font-size:17px; letter-spacing: 3px;font-weight:300; margin-bottom:25px;}
#nosotros .texto2{text-align:center;line-height:26px;text-transform: uppercase;color:#fff;font-size:17px; letter-spacing: 2px;font-weight:300; max-width:490px; margin:auto;margin-bottom:25px;}
.links{text-align:center; margin-top:20px;}
.links a{margin-left: 20px;}
.links .btn-hilos-negro{padding:10px 25px;}
.nosotros-info{padding:0 60px;}
.mapa-fondo{padding:0 60px; text-align:center;}
.mapa{width:100%;max-width:550px; margin:auto;}
.popup-nosotros{display: none;max-width:700px; text-align:center;padding:100px;}
.popup-nosotros button{position:absolute; right:30px; top:30px;}
.popup-nosotros .linea-negra-h{margin:20px auto 20px;}
.popup-nosotros p{font-family:'montserrat', sans-serif; font-weight:300;}
.popup-nosotros h1{margin-top:20px;}

/*seccion contacto*/
#header-contacto{background:url(../img/header-contacto-hilos-hernan.jpg) no-repeat top fixed / 100%;}
#ubicacion iframe{width:100%;height:435px;}
#ubicacion{line-height:0;}
#seccion-contacto{padding:80px 0px;}
#seccion-contacto h1{margin-bottom:20px;}
#seccion-contacto .redes a{border:1px solid #000; position:relative;}
#seccion-contacto .redes a img:first-child{position:absolute; top:5px; visibility: hidden;}
#seccion-contacto .redes a:hover img:first-child{visibility: visible;}
#seccion-contacto .redes a:hover img:last-child{visibility: hidden;}

/*home*/
#home{padding:100px 0; text-align:center;}
.logo-home{width:85px; margin-bottom:30px;}
#home p{max-width:510px; margin-left:auto; margin-right:auto;}
.linea-negra{width:1px; margin:auto;height:65px; background:#000;margin-top:20px;}

/*contacto*/
#contacto{padding:100px 0; background:#eeeeee; text-align:center;}
#contacto p{max-width:320px; margin:0 auto 30px;}
#contacto iframe{margin-top:30px; border:0; width:90%; height:330px;-webkit-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08);
-moz-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08);
box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.08);}
#contacto form{max-width:90%;margin:auto;}
.form-control::placeholder{color:#000;}
.form-control{border:none; border-bottom:1px solid #000;  border-radius:0; font-weight:300; font-size:15px; background:transparent;letter-spacing:1px; margin-bottom:25px;}
textarea{resize: none; height:80px;}
#msgSubmit{font-weight:300;}




/*menu*/
.navbar-brand img{width:115px;}
.navbar-nav .nav-link{color:#fff;transition:all ease-in .2s; border-bottom: 1px rgba(225,225,225,0) solid;padding-bottom:5px; font-weight:300; text-transform:uppercase; letter-spacing:.9px;}
.navbar-nav .nav-link:hover{transition:all ease-in .2s;color:#fff; border-bottom: 1px rgba(225,225,225,1) solid;}
#menu-sitio{transition:all ease-in .6s;}
.navbar-toggler-icon{background-image: url(../img/menu-edepac.png);}
.navbar-toggler{border:none;}
.navbar-toggler:focus{box-shadow:none;outline: none;}
.navbar-nav .menu-logo{display:none;}

#menu-sitio.scrolled-nav{background:#000 !important;transition:all ease-in .6s;}


/*slider*/
#slider{background:#000;}
.carousel-item {
  height: 100vh;
  min-height: 700px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.texto-slide{width:100%; position:absolute; text-align:center; color:#fff; top:40%;}
.texto-slide p{line-height:30px;margin-top:0;-webkit-animation: pslide 1s 1; animation: pslide 1s 1;margin-bottom:8px;text-transform: uppercase;color:#fff;font-size:20px; letter-spacing: 4px;font-weight:300;}
.texto-slide h3{margin-top:0;-webkit-animation: h3slide 2s 1; animation: h3slide 2s 1;}
.texto-slide .btn-hilos{-webkit-animation: btnslide 3s; animation: btnslide 3s ;}
.linea-blanca{width:1px; height: 150px;background:#fff; margin:auto;-webkit-animation: lineabca 3s 1; animation: lineabca 3s 1;}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes lineabca {0% {height:0px;} 40% {height: 0px;} 100% {height: 150px;}}
@keyframes lineabca {  0% {height:0px;} 40% {height: 0px;} 100% {height: 150px;}}
@-webkit-keyframes pslide {0% {opacity:0; margin-top:-20px;} 100% {opacity:1; margin-top:0;}}
@keyframes pslide {0% {opacity:0; margin-top:-20px;} 100% {opacity:1; margin-top:0;}}
@-webkit-keyframes h3slide {0% {opacity:0;} 20% {opacity:0; }  100% {opacity:1;}}
@keyframes h3slide {0% {opacity:0;} 20% {opacity:0;} 100% {opacity:1;}}
@-webkit-keyframes btnslide {0% {opacity:0; margin-top:60px;} 80% {opacity:0; margin-top:60px;}  100% {opacity:1; margin-top:0;}}
@keyframes btnslide {0% {opacity:0; margin-top:60px;} 80% {opacity:0; margin-top:60px;} 100% {opacity:1; margin-top:25px;}}

@media (min-width:768px){
.navbar-nav li{display:inline-block;}
.navbar-nav li{margin:0 10px;}
.navbar-nav{display:inline-block;width:100%; text-align: center;}
.navbar-brand{position:absolute; left:50%; margin: 0 0 0 -65px;}
#menu-sitio{padding-top:60px;}
.navbar-nav .nav-empresa{margin-left: 60px; margin-right:30px;}
.navbar-nav .menu-logo{display:inline-block; margin-right:60px; height:10px;}
#menu-sitio.scrolled-nav .navbar-brand img{width:60px;}
#menu-sitio.scrolled-nav{padding-top:20px; padding-bottom:20px;}
#menu-sitio.scrolled-nav .navbar-brand{ margin-left:-40px;}

}

@media(min-width:991px){
  .navbar-nav li{margin:0 20px;}
  .navbar-nav .nav-empresa{margin-left: 70px; margin-right:30px;}
  .navbar-nav .menu-logo{display:inline-block; margin-right:130px; height:10px;}

}

@media (max-width:1200px){
.header{background-size:1400px !important;}
.links a{margin-left: 15px;}
.links .btn-hilos-negro{padding:10px 15px;}
.nosotros-info{padding:0 30px;}
.mapa-fondo{padding:0 30px;}
}

@media (max-width:991px){
h3{line-height:50px;font-size:50px;letter-spacing: 7px;}
footer{text-align:center;}
.nav-footer{text-align:center;margin-top:50px;}
.nav-footer a{margin-left:5px; margin-right:5px;}
.copy{text-align:center;margin-top:30px;}
.mapa-fondo{padding-top:60px; padding-bottom:60px;background:url(../img/nosotros-hilos-hernan-fondo-mobile.jpg) center; background-size:cover;}
#nosotros{background-image:none !important;padding-bottom:0; padding-top:0;}
.nosotros-info{padding-top:60px; padding-bottom:60px;}
#seccion-contacto{text-align:center; padding:60px 0;}
#seccion-contacto .redes{margin-bottom:60px;}
#contacto iframe{margin-bottom:60px;}
.navproductos li a{width:180px;}

}

@media (max-width:768px){
.navbar-nav{display:inline-block;width:100%; text-align: center;}
	.navbar-nav .nav-link{font-size:18px; padding:10px 0; }
	.navbar-nav .nav-link:hover{border-bottom: 1px rgba(225,40,39,0) solid;}
  .navbar-brand img{width:50px;}
  #menu-sitio{background:#000;}
  .texto-slide{top:30%; padding: 0 20px;}
  .datos{margin-top:30px;}
  #nosotros{padding: 60px 0px 0px;}
  #productos{padding:40px 0px 0px;}
  #nosotros h1, #nosotros .texto{text-align:center;}
  .linea-negra-h{margin-left:auto; margin-right:auto;}
  .popup-nosotros{max-width:90%; padding:50px;}

}

@media (max-width:577px){
  .producto{min-height:auto;}
}
@media (max-width:480px){
  h3{line-height:40px;font-size:38px;letter-spacing: 2px;}
  .carousel-item {min-height:600px;}
  .texto-slide p{line-height:24px; font-size:18px;}
  h1{letter-spacing: 2px;color:#000; font-size:28px;}
    #home, #contacto{padding:60px 0;}
    .nav-footer{display:none;}
    .copy{margin-top:40px;}
    .datos span{font-size:14px;display:block;}
    .datos a{display:block;}
    .header h1{font-size:30px;}
    .links a{display:block !important; margin-bottom:20px;}
    #nosotros p{text-align:center;}
      .popup-nosotros{padding:30px;}
      .navproductos li, .navproductos li a{width:100%; }
      .navproductos li{margin: 5px 0}
      .producto{padding:20px 20px 10px;}
}