@charset "utf-8";
/* CSS Document */

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

* { padding: 0; margin: 0;}
*:focus { outline: none; } 

html, body { margin: 0; padding: 0; min-height: 100vh; font-family: 'Roboto', sans-serif;}

main{
	width:100%;
	height:100vh;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}



header{width: 100%; background-color: #efefef;  position: fixed; z-index: 100; }

#desktop{height: 100px;}
#responsive{ display: none; height: 50px;}

.slide-mobile{ display:none}


#home{
	width:100%;
	height:100vh;
    -moz-background-size:cover; /* Firefox 3.6 */ 
    background-size: cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */


}

.logo{ width: 40%; height: 100px;float: left; }
.logo img { width: 300px; height: 50px; margin-top: 25px; margin-left: 30px}

nav{ width: 60%; height: 100px; float:right;}
nav ul{list-style: none; width: 94%; margin: auto;  margin-top: 55px;}
nav li{display: inline-block; padding: 0%;  text-align: center; width: 16%; }
nav a:link{ text-decoration: none; color: #d96011}
nav a:visited{ text-decoration: none; color: #d96011}
nav a:hover{ text-decoration:underline; color:#599522;}
.active{ color:#599522 !important; text-decoration: underline !important}

.social{ width: auto; height: 50px;  float: right; right: 0;}
.icon{ width: 50px; height: 50px; margin: 5px 0px;  float: left }
.icon img{ width: 50px; height: auto; position: absolute}


footer{ width: 100%; height: 50px; background-color: #2b2a28; bottom: 0; clear: both }
.terminos{ width: 40%; height: 20px; float: left; margin-top: 20px; font-size: 12px  }
.terminos a:link{ color:#fff; text-decoration: none; margin-left: 20px;}
.terminos a:visited{ color:#fff; text-decoration: none; margin-right: 20px}
.terminos a:hover{ color:#599522; text-decoration: none; margin-right: 20px}

.logo-footer{ width: 20%; height: 50px; float: left; }
.logo-footer img { width: 40px; height: auto; display:block; margin: 9px auto 0 auto}

.derechos{ width: 40%; height: 20px; float: right; margin-top: 20px;  text-align: right; font-size: 12px; }
.derechos a:link{ color:#fff; text-decoration: none; margin-right: 20px}
.derechos a:visited{ color:#fff; text-decoration: none; margin-right: 20px}
.derechos a:hover{ color:#599522;; text-decoration: none; margin-right: 20px}

#politica{
    width:100%;
	height:100vh;
	background:#fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}

.info-politica{
	width: 70%;
	height: auto;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 6%;

}

.info-politica h2{ color:#d96012; font-size: 50px; margin-bottom: 20px;}
.info-politica p{ font-size: 16px; padding: 0 80px 0 80px;line-height: 30px}

.content-politica{ width: 940px; height: 343px; margin: auto;}

.iso{ width: 300px; height: 343px; float: left;  background:url(../img/iso.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;  opacity: 1;

    -webkit-transition: opacity 0.3s;
   transition: opacity 0.3s;}

.iso:hover{ width: 300px; height: 343px; float: left;  background: url(../img/iso-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;    }
.iso img{ width: 70%; height: auto;  margin-top: 80px; margin-left: 15% }


.logistica{ width: 300px; height: 343px; float: left;  background: url(../img/logistica.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;}

.logistica:hover{ width: 300px; height: 343px; float: left;  background: url(../img/logistica-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; cursor: pointer}
.logistica img{ width: 70%; height: auto;  margin-top: 80px; margin-left: 15% }


.experiencia{ width: 300px; height: 343px; float: left;  background: url(../img/experiencia.png) center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;}

.experiencia:hover{ width: 300px; height: 343px; float: left;  background: url(../img/experiencia-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; cursor: pointer}
.experiencia img{ width: 70%; height: auto;  margin-top: 80px; margin-left: 15% }

.marginLeft-n{ margin-left: 20px}

.link-selection{ width:100%; height:100%; display:block;}

			


#ingenieria{
    width:100%;
	height:100vh;
	background:url(../img/ingenieria.jpg) no-repeat center center fixed;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}


.info-producto{
	width: 70%;
	height: auto;
	margin: 0 auto 0 auto;
	text-align: center;
	padding-top: 10%;

}


.info-producto h2{ color:#d96012; font-size: 50px; margin-bottom: 20px;}
.info-producto p{ font-size: 16px; padding: 0 80px 0 80px; line-height: 30px}


.servicios{ width: 90%; height: 260px;  margin: 20px auto 20px auto;}


.servicios-ingenieria{ width: 30%; height: auto; ; float: left;}
.servicios-ingenieria img{ width: 80%; height: auto; margin: 0; padding: 0; margin-bottom: 20px; }
.servicios-ingenieria a:link{color:#d96012; text-decoration: none; font-size: 18px; font-weight: bold;}
.servicios-ingenieria a:visited{color:#d96012; text-decoration: none; font-size: 18px; font-weight: bold; }
.servicios-ingenieria a:hover{color:#599522; text-decoration: none; font-size: 18px; font-weight: bold; }

.marginLeft{margin-left: 5%;}



/* About */
#about{
    width:100%;
	height:100vh;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	
}


.info-nosotros{
	width: 70%;
	height: auto;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 15%;
	line-height: 30px
}


.info-nosotros h2{ color:#d96012; font-size: 50px; margin-bottom: 20px; text-align: center}
.info-nosotros p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}

.info-valores{ width: 100%; height: auto; text-align: justify; margin-top: 70px; line-height: 30px}
.mision{ width: 50%; height: 100%; float: left; }
.vision{ width: 50%; height: 100%; float: right; }


#ubicacion{
    width:100%;
	height:100vh;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}

#ubicacion h2{color:#d96012; font-size: 50px; margin-bottom: 20px; text-align: center; margin-top: 50px}

.map{ width: 90%; height: 60%; margin: 20px auto 0 auto;}
.map p{  width:80%; margin:30px auto 0 auto; text-align: center; line-height: 30px}
iframe{ margin-left:5%;}

#alcance{
    width:100%;
	height:100vh;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}
	
	
#alcance h2{ color:#d96012; font-size: 50px; margin-bottom: 30px; text-align: center}

.info-alcance{ width: 90%; height: 54%; margin: 20px auto 0 auto; text-align: justify }

.map-distribucion{ width: 50%; height: 100%; float: left;  }
.map-description{ width: 50%; height: 100%; float: right;}
.map-description p{ padding: 20% 5% 8% 5%; line-height: 30px}

.map-distribucion img{  width: 78%; height: 90%; margin-left:13% }
	


/* Productos */
#productos{
    width:100%;
	height:auto;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}


.info-productos{
	width: 90%;
	height: auto;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 130px;	
}


.info-productos h2{ color:#d96012; font-size: 50px; margin-bottom: 20px;}
.info-productos p{ font-size: 16px; padding: 0 80px 0 80px; }


.content-categorias{ 
	width: 100%;
	height: 900px;
	margin: 0px auto 3% auto;
	text-align: center;
}

.info-cateoria{ width: 20%; height: 300px; float: left; margin-top: 100px; font-size: 14px   }
.info-imagen{ width: 100%; height: auto; }

.info-imagen img{ width: 100%; height: auto;}

.info-description{ width: 100%; height: 150px; }
.info-description h2{ color:#d96012; font-size: 14px;  text-align: center; margin-top: 12px  }
.info-description p{  font-size: 14px; padding: 0; margin: 0 5px 0 5px; line-height: 20px  }

.marginLeft2{ margin-left: 6%; }


/*Detalles de producto*/

#detalles-producto{
    width:100%;
	height:auto;	
	background-color: #000;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	
}

.ficha-productos{
	width: 90%;
	height: auto;

	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 130px;	

}

.productos-navegation{ width:100; height:auto; text-align:left; margin-bottom:50px}
.productos-navegation a:link{ color:#d96012;}
.productos-navegation a:visited{ color:#d96012;}
.productos-navegation a:hover{ color:#599522;}

.ficha-productos h2{ color:#d96012; font-size: 50px; margin-bottom: 20px;}
.ficha-productos p{ font-size: 16px; padding: 0 80px 0 80px; line-height: 30px}


.ficha-left{ width:50%; height:auto; float:left; margin-bottom:60px; margin-top:30px; }
.ficha-left h3{color:#d96012; font-size: 24px; margin-bottom: 20px;}

.more-imagenes{ witdh:100%; height:auto; margin-bottom:150px}
.asociados{ width:30%; height:auto;  float:left; margin-left:2.5%; background-color: #cccccc}
.asociados img{ width:100%; height:auto;}

.ficha-imagen{ width:100%; height:auto;	}
.ficha-imagen img { width:100%; height:auto;} 

.ficha-right{ width:50%; height:auto; float:right; margin-bottom:60px; margin-top:30px;}
.ficha-right p{ font-size: 16px; padding: 0 80px 0 80px; line-height: 30px; text-align:justify}
.ficha-right ul{ list-style:none; text-align:center; line-height:30px}
.ficha-right h3{color:#d96012; font-size: 24px; margin-bottom: 20px;}

.similares{ width:100%;  height:auto; overflow: hidden; clear:both;  margin-bottom: 100px;}
.similares h3{ text-align: left;}

.ficha-left form{ margin-top: 100px !important; font-size: 16px}

.info-asociados{ width: 22.5%; float: left;  height: auto;  margin-top: 50px; font-size: 14px; background-color: #cccccc   }
.marginLeft-asociados{ margin-left: 3.333333333333333%;}
.marginLeft-asociadoss{ margin-left: 3.333333333333333%;}

.img-asociados{ width: 100%; height: auto; }
.img-asociados h2{ color:#d96012; font-size: 14px;  text-align: center; margin-top: 12px  }
.info-asociados img{ width: 80%; height: auto;}


/* Serivicios */
#servicios{
    width:100%;
	height:auto;	
	background-color: #000;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	
}



.banner-servicios{
	width: 100%;
	height:38%;
	background: url(../img/bg-servicios.jpg) no-repeat center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	margin-top:  100px;
	float: left;
	margin-bottom: 50px;

	
}

.info-servicios{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	
}


.info-servicios h2{ color:#d96012; font-size: 50px; margin-bottom: 20px; text-align: center}
.info-servicios p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center; }



.content-servicios{
	width: 80%;
	height: 1300px;
	max-height: 1600px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 5%;
	line-height: 25px;


	
}

.norma-iso{
	width: 45%;
	height: auto;
	float: left;

}

.just-time{
	width: 45%;
	height: auto;
	float: right;
	margin-left: 10%;
}

.inventarios{
	width: 45%;
	height: auto;
	float: left;
	margin-top: 0px;
}

.empaques{
	width: 45%;
	height: auto;
	float: right;
	margin-left: 10%;
	margin-top: 0px;
	
}

.imagen{ width: 90%; height: auto; margin: auto  }
.imagen img{ width: 100%; height: 100%}

.servicios-description{ width: 90%; height: 300px; margin: auto }

.servicios-description h2{ color:#d96012; font-size: 20px; margin-bottom: 20px; text-align: center}
.servicios-description p{ font-size: 16px; padding: 0 20px 0 20px; text-align: center}


/*Ayuda*/
#ayuda{
    width:100%;
	height:auto;
	background-color: #000;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	
}

.banner-ayuda{
	width: 100%;
	height:45%;
	max-height: 500px;
	background: url(../img/bg-ayuda.jpg) no-repeat center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	margin-top:  100px;
	float: left;
	margin-bottom: 50px;	
}

.info-ayuda{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}

.info-ayuda a:link{ color: #d96011}
.info-ayuda a:visited{ color: #d96011}
.info-ayuda a:hover{ color:#599522;}


.info-ayuda h2{ color:#d96012; font-size: 50px; margin-bottom: 20px; text-align: center}
.info-ayuda p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}




.accordion {
  margin: 50px;
	text-align: center;
	font-size: 16px;
	line-height: 30px;
}
.accordion dt, .accordion dd {
  padding: 10px;

}
.accordion dt:last-of-type, .accordion dd:last-of-type {

}
.accordion dt a, .accordion dd a {
  display: block;
  color: black;
 
}
.accordion dd {
  border-top: 0;

}
.accordion dd:last-of-type {
  position: relative;
  top: -1px;
}

.accordion a:link {
  text-decoration: none;
}

.accordion a:hover{ color:#599522;}



/* Contacto */
#contacto{
    width:100%;
	height:auto;
	max-height: 20000px;
	background-color: #000;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;

	
}

.banner-contacto{
	width: 100%;
	height:38%;
	max-height: 2000px;
	background:url(../img/bg-contacto.jpg) no-repeat center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	margin-top:  100px;
	float: left;
	margin-bottom: 50px;
}


.info-contacto{
	width: 72%;
	height: auto;
	max-height: 2000px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom:10px;	
}

.content-contacto{
	width: 100%;
	height: 530px;

	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 80px;
	margin-top: 70px;


	
}

.info-contacto h2{ color:#d96012; font-size: 50px; margin-bottom: 20px; text-align: center}
.info-contacto p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}


input{ width: 80%;  border: 0; padding: 20px 0px; color: #fff; font-size: 12px; background-color: #d96011; margin-top: 20px;  margin: 10px 0;  -webkit-appearance: none; -moz-appearance: none; appearance: none;}
textarea{ width: 80%;  border: 0; padding: 20px 0px; color: #fff; background-color: #d96011; margin-top: 20px;  margin: 10px 0;  -webkit-appearance: none; -moz-appearance: none; appearance: none;	}
.witdh{ width: 45% !important; margin-left: 0;  -webkit-appearance: none; -moz-appearance: none; appearance: none;}

.form{ width: 50%; height: 530px; float: left;   }
.form h3{color:#d96012; font-size: 18px; margin-bottom: 20px}

.space-top{width: 100%; height: 50px;}

input.placeholder {
    text-align: left;
	 -webkit-appearance: none; -moz-appearance: none; appearance: none;
}
.style {
    
    font-size: 12px;
    text-align: left;
	padding: 20px;
	color: #fff !important

}

.direccion{ width: 50%; height: 530px; float: right; overflow: hidden; padding-bottom: 0px}
.direccion h3{color:#d96012; font-size: 18px; margin-bottom: 20px}

.ubication{ width: 90%; height: 48%; margin: 20px auto 0 5%;}
iframe{ width: 90%; height: 100%; }


	
::-webkit-input-placeholder { color: #fff; } 
:-moz-placeholder { /* Firefox 18- */ color: #fff; } 
::-moz-placeholder { /* Firefox 19+ */ color: #fff; } 
:-ms-input-placeholder { color: #fff; }
:focus::-webkit-input-placeholder{color:transparent;}

.confirmacion{  color:#599522; }


/* Certificacion-iso*/
#page-iso{
	width:100%;
	height:100px;
}


#page-iso-banner{
	width:100%;
	height:100vh;
	background: url(../img/iso-bg.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */
}

.page-info-iso{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 50px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}




.page-info-iso h2{ color:#d96012; font-size: 40px; margin-bottom: 20px; text-align: center; line-height: 60px;}
.page-info-iso p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}


.page-certificado{ width: 40%; height: auto; margin: 40px auto 0 auto}
.page-certificado img{ width: 100%; height: auto;}



/* logistica*/
#page-logistica{
	width:100%;
	height:100px;


}


#page-logistica-banner{
	width:100%;
	height:100vh;
	background: url(../img/logistica-bg.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */
}

.page-info-logistica{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 50px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}




.page-info-logistica h2{ color:#d96012; font-size: 40px; margin-bottom: 20px; text-align: center; line-height: 60px;}
.page-info-logistica p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}

.marginTop{ margin-top:40px}

.page-mapa-certificado{ width: 60%; height: auto; margin: 40px auto 0 auto}
.page-mapa-certificado img{ width: 100%; height: auto;}


/*Experiencia*/

/* logistica*/
#page-experiencia{
	width:100%;
	height:100px;


}


#page-experiencias-banner{
	width:100%;
	height:100vh;
	background: url(../img/experiencia-bg.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */
	
}

.page-info-logistica{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 50px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}




.page-info-logistica h2{ color:#d96012; font-size: 40px; margin-bottom: 20px; text-align: center; line-height: 60px;}
.page-info-logistica p{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}

.marginTop{ margin-top:40px}

.page-nuestros-clientes{ width: 60%; height: auto; margin: 60px auto 0 auto}
.page-nuestros-clientes img{ width: 100%; height: auto;}


/*/*Experiencia*/

/* logistica*/
#ingenieria-producto{
	width:100%;
	height:100px;


}


#page-ingenieria-producto{
	width:100%;
	height:100vh;
	background: url(../img/ingeneria-producto.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */
	
}

.info-ingenieria-producto{
	width: 70%;
	height: auto;
	max-height: 20000px;
	margin: 50px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}




.info-ingenieria-producto h2{ color:#d96012; font-size: 40px; margin-bottom: 20px; text-align: center; line-height: 60px;}
.info-ingenieria-productop{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}

.marginTop{ margin-top:40px}

.pasos-ingenieria-producto{ width: 90%; height: 68%; margin: 20px auto 0 auto; text-align: justify }

.info-pasos{ width: 50%; height: 100%; float: left;  }
.info-pasos h3{ color:#d96012; font-size: 20px; margin-bottom: 20px; text-align: center;   }
.imagen-ingenieria{ width: 50%; height: 100%; float: right;}
.info-pasos p{ padding: 5% 5% 8% 5%; line-height: 30px}

.imagen-ingenieria img{  width: 78%; height: 90%; margin-left:13% }

.logo-ingenieria-producto{ width: 200px; height: auto; margin: auto }
.logo-ingenieria-producto img{ width: 150px; height: auto;}
.logo-ingenieria-producto a:link{ color:#d96012; font-size:20px; text-decoration: none; text-align: center}
.logo-ingenieria-producto a:visited{ color:#d96012;  font-size:20px; text-decoration: none}


.form-ingenieria{ width: 400px; height: auto; margin: auto; margin-bottom: 80px}
.form-ingenieria h3{ color:#d96012; font-size: 24px; text-align: center}
.form-ingenieria form{ margin-left: 70px}




@media screen and (max-width:1200px){
iframe{ width: 90%; height: 80%;}	
}


@media screen and (max-width:960px){




#desktop{ display: none;}
#responsive { display: block}
	
.logo{ width: 40%; height: 100px;float: left; }
.logo img { width: 136px; height: 33px; margin-top: 10px; margin-left: 10px}

	
/*Menu responsivo*/
.hamburger{
  position:absolute;
  top:0;
  right:0;
  line-height:45px;
  padding:5px 15px 0px 15px;
  color:#fff;
  border:0;
  font-size:1.4em;
  font-weight:bold;
  cursor:pointer;
  outline:none;
  z-index:10000000000000;
  background-color:#000;
}
	
.cross{
  background:none;
  position:absolute;
  top:0px;
  right:0;
  padding:7px 15px 0px 15px;
  color:#000;
  border:0;
  font-size:3em;
  line-height:65px;
  font-weight:bold;
  cursor:pointer;
  outline:none;
  z-index:10000000000000;
}
	
.menu{z-index:1000000; font-weight:bold; font-size:0.8em; width:100%; background-color:rgba(255,255,255,.8);  position:absolute; text-align:center;}
	
.menu ul {margin: 0; padding: 0; list-style-type: none; list-style-image: none;}
.menu li {display: block;   padding:27px 0 27px 0; border-bottom:#dddddd 1px solid; font-size:15px;}
.menu li:hover{display: block;    background:#ffffff; padding:27px 0 27px 0; }
.menu ul li a { text-decoration:none;  margin: 0px; color:#666;}
.menu ul li a:hover {  color: #666; text-decoration:none;}
.menu a{text-decoration:none; color:#666;}
.menu a:hover{text-decoration:none; color:#666;}

	

	
	.politica{
	height:100%;
	height:auto;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}
	
	
.ing-producto{
    width:100%;
	height:100vh;
	

}
	
	
	
.info-politica{
		width: 90%;
	height: auto;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 10%;
}
	
	
.info-politica h2{  font-size: 30px; margin-bottom: 20px;}
.info-politica p{ font-size: 16px; padding: 0 20px 0 20px}
	
	
.content-politica{ width: 90%; height: 343px; margin: 0 auto 80px auto;}

.iso{ width: 32%; height: 343px; }
.iso:hover{ width: 32%; height: 343px;}
	
.logistica{ width: 32%;height: 343px; }
.logistica:hover{width: 32%; height: 343px; }

.experiencia{ width: 32%; height: 343px; }
.experiencia:hover{ width: 32%; height: 343px;}

.marginLeft-n{ margin-left: 2%}
	
	
.info-producto{
	width: 90%;
	height: auto;
	margin: 0 auto 3% auto;
	line-height: 30px;
	

}
	
.info-producto h2{ color:#d96012; font-size: 30px; margin-bottom: 20px;}
.info-producto p{ font-size: 16px; padding: 0 20px 0 20px}	


footer{ height: 50px; position: fixed; z-index:100}
.logo-footer{  display: none;}
.derechos{ width: 60%;}

#politica{
    width:100%;
	height:auto;
	max-height: 2000px;
	background:#fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}
	
	
#ingenieria{
    width:100%;
	height:auto;
	max-height: 3000px;

	background:url(../img/ingenieria.jpg) no-repeat center center fixed;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}

	
/*About*/

	
/* About */
#about{
    width:100%;
	height:auto;
	max-height: 13000px;
	background-color: #fff;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
}

.info-nosotros{
	width: 90%;
	height: auto;
	max-height: 12000px;
	margin: 0 auto 120px auto;
	text-align: center;
	padding-top: 80px;
	

}


.info-nosotros h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center}
.info-nosotros p{ font-size: 16px; padding: 0 20px 0 20px; text-align: center}

	

.info-valores{ width: 100%; height: 300%;  margin-top: 30px;  }
.mision{ width: 100%; height: 100%; float: none; ; clear: both; }
.vision{ width: 100%; height: 400%; float: none;  clear: both; margin-top: 30px; margin-bottom: -80px; }
	

	
#ubicacion{
	height:auto;
}

#ubicacion h2{color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center; margin-top: 0px}

.map{ width: 90%; height: 50%; margin: 20px auto 0 auto; }
.map p{  width: 90%; margin: auto;  line-height: 30px; margin-bottom: 100px}
	iframe{ width: 100%; margin-left: 0}
	


	
#alcance{
    width:100%;
	height:auto;

}
	
#alcance h2{ color:#d96012; font-size: 30px; margin-bottom: 30px; text-align: center; margin-top: -50px}

.info-alcance{
width: 90%; height: auto; max-height: 1300px; padding: 0 auto 60px auto; }
	
.map-distribucion{ width: 100%; height: 100%; float: none; }
.map-description{ width:100%; height: 100%; float: none;}
.map-description p{ padding: 20px 20px 100px 20px; text-align: center}

.map-distribucion img{  width: 100%; height: auto; margin-left: 0}


	
	
/* Productos */	

.info-productos h2{ color:#d96012; font-size: 30px; margin-bottom: 20px;}
.info-productos p{ font-size: 16px; padding: 0 20px 0 20px}
	
	
	
.info-productos{

	padding-top: 80px;}
	

.content-categorias{ 
	width: 90%;
	height: auto;
	margin: 20px auto 3% auto;
	text-align: center;
	
	
}
	
.info-productos h2{ color:#d96012; font-size: 30px; margin-bottom: 20px;}
.info-productos p{ font-size: 16px; padding: 0 20px 0 20px}
	
	

.info-cateoria{ width: 47.65625%; height: auto; float: left; margin-top: 70px; font-size: 14px;  }
.info-imagen{ width:  100%; height: auto; }

.info-imagen img{ width: 100%; height:auto;}

.info-description{ width: 100%;; height: 200px; }
.info-description h2{ color:#d96012; font-size: 14px;  text-align: center  }
.info-description p{  font-size: 14px; padding: 0;  }

.marginLeft2{ margin-left: 0}
.marginLeft3{ margin-left: 2.34375% }	



	
	
	
	

/*Detalles de producto*/

#detalles-producto{
    width:100%;
	height:auto;	

	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	
}

.ficha-productos{
	width: 90%;
	height: auto;

	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 80px;	

}
.productos-navegation{  text-align:center; }
.ficha-productos h2{ color:#d96012; font-size: 30px; margin-bottom: 20px;}
.ficha-productos p{ font-size: 16px; padding: 0 20px 0 20px; line-height: 30px}



.ficha-left{ width:100%; height:auto; float:none; margin-bottom:60px; margin-top:30px; }
.ficha-left h3{color:#d96012; font-size: 24px; margin-bottom: 20px;}


.more-imagenes{ witdh:100%; height:auto; margin-bottom:150px}
.asociados{ width:30%; height:auto;  float:left; margin-left:2.5%}
.asociados img{ width:100%; height:auto;}

.ficha-imagen{ width:100%; height:auto;	}
.ficha-imagen img { width:100%; height:auto;} 

.ficha-right{ width:100%; height:auto; float:none; margin-bottom:80px; margin-top:30px;}
.ficha-right p{ font-size: 16px; padding: 0 20px 0 20px; line-height: 30px; text-align:justify}
.ficha-right ul{ list-style:none; text-align:center; line-height:30px}
.ficha-right h3{color:#d96012; font-size: 24px; margin-bottom: 20px;}



.ficha-left form{ margin-top: 100px !important; font-size: 16px}

.info-asociados{ width: 47.65625%; height: auto; float: left; margin-top: 50px; font-size: 14px; background-color: #cccccc   }
.marginLeft-asociados{ margin-left: 4.6875%}
.marginLeft-asociadoss{ margin-left: 0%}

.img-asociados{ width: 100%; height: auto; }
.img-asociados h2{ color:#d96012; font-size: 14px !important;  text-align: center; margin-top: 12px; }
.info-asociados img{ width: 80%; height: auto;}

	

/* Servicios */
	
.banner-servicios{
	width: 100%;
	height:48%;
	background: url(../img/bg-servicios.jpg) no-repeat center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	margin-top:  0;
	float: left;
	margin-bottom: 30px;	
}

.info-servicios{
	width: 90%;

	max-height: 2000px;
	margin: 0 auto 50px auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px; 


	
}


.info-servicios h2{font-size: 30px; margin-bottom: 20px; line-height: 40px }
.info-servicios p{ font-size: 16px; padding: 0 20px 0 20px}	
	
.content-servicios h2{line-height: 40px; margin-top: 20px;}
	

	
.norma-iso{
	width: 45%;
	height: auto;
	float: left;
	margin-bottom: 50px;


}

.just-time{
	width: 45%;
	height: auto;
	float: right;
	margin-left: 10%;
	margin-bottom: 50px;
	
}

.inventarios{
	width: 45%;
	height: auto;
	float: left;
	
}

.empaques{
	width: 45%;
	height: auto;
	float: right;
	margin-left: 10%;
	
	
}	

.content-servicios{
	width: 80%;
	height: 1400px;
	max-height: 1900px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0px;
	line-height: 25px;

	



}
	
	
.servicios-description h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center}
.servicios-description p{ font-size: 16px; padding: 0 10px 0 10px; text-align: center}
	
/* Ayuda */
	
.info-ayuda{
	width: 90%;
	height: auto;
	max-height: 20000px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 100px;
}


.info-ayuda h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center}
.info-ayuda p{ font-size: 16px; padding: 0 10px 0 10px; text-align: center}

.banner-ayuda{
	width: 100%;
	height:38%;
	max-height: 300px;
	background: url(../img/bg-ayuda.jpg) no-repeat center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	z-index:1;
	margin-top:  50px;
	float: left;
	margin-bottom: 50px;	
}
	
	
	
/* Contacto*/
	
#contacto{
    width:90%;	
}

.banner-contacto{
	margin-top:  50px;
}


.info-contacto{
	width: 90%;
}

.content-contacto{
	width: 100%;
	height: auto;
	margin: 0 auto 0% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 80px;
	margin-top: 70px;
}

.info-contacto h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center}
.info-contacto p{ font-size: 16px; padding: 0 20px 0 20px; text-align: center}


input{ width: 80%;  border: 0; padding: 20px 0px; color: #fff; font-size: 12px; background-color: #d96011; margin-top: 20px; cursor: pointer; margin: 10px 0;}
textarea{ width: 80%;  border: 0; padding: 20px 0px; color: #fff; background-color: #d96011; margin-top: 20px; cursor: pointer; margin: 10px 0;	}
.witdh{ width: 45% !important; margin-left: 0;}

.form{ width: 100%; height: 530px; float:none;   }
.form h3{color:#d96012; font-size: 18px; margin-bottom: 20px}

.space-top{width: 100%; height: 50px;}

input.placeholder {
    text-align: left;
}
.style {
    
    font-size: 12px;
    text-align: left;
	padding: 20px;
	color: #fff !important

}

.direccion{ width: 100%; height: auto; float: none; margin-top: 60px}
.direccion h3{color:#d96012; font-size: 18px; margin-bottom: 20px}

.ubication{ width: 90%; height: 45%; margin: 20px auto 0 5%;
	
}
	
	
	
/*Certificaion*/
#page-iso{
	width:100%;
	height:50px;
}
#page-iso-banner{
	width:100%;
	height:100vh;
	background: url(../img/iso-bg.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */

	
}
	
.page-info-iso{
	width: 90%;
	height: auto;
	max-height: 20000px;
	margin: 0px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}


.page-info-iso h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center; line-height: 30px; margin-top:50px}
.page-info-iso p{ font-size: 16px; padding: 0 10px 0 10px; text-align: center}


.page-certificado{ width: 90%; height: auto; margin: 40px auto 120px 5%}
.page-certificado img{ width: 100%; height: auto;}


/*Logistica*/

#page-logistica{
	width:100%;
	height:50px;
}


#page-logistica-banner{
	width:100%;
	height:100vh;
	background: url(../img/logistica-bg.jpg)no-repeat 50% 50%;
    -moz-background-size:  cover; /* Firefox 3.6 */ 
    background-size:  cover; /* Chrome, Firefox 4.0+, Safari 4.1+, Opera 10+ and IE9 */
}

.page-info-logistica{
	width: 90%;
	height: auto;
	max-height: 20000px;
	margin: 50px auto 3% auto;
	text-align: center;
	padding-top: 0%;
	line-height: 30px;
	padding-bottom: 20px;
	
}

#page-experiencia{
	width:100%;
	height:50px;

}


.page-info-logistica h2{ color:#d96012; font-size: 30px; margin-bottom: 20px; text-align: center; line-height: 40px;}
.page-info-logistica p{ font-size: 16px; padding: 0 10px 0 10px; text-align: center}

.marginTop{ margin-top:40px}

.page-mapa-certificado{ width: 90%; height: auto; margin: 40px auto 100px auto}
.page-mapa-certificado img{ width: 100%; height: auto;}


	
.page-nuestros-clientes{ width: 90%; height: auto; margin: 60px auto 60px auto; overflow: hidden}
.page-nuestros-clientes img{ width: 100%; height: auto;}
	
	
	
/*Ingeneria producto*/

#ingenieria-producto{
	width:100%;
	height:50px;

}
	
.info-ingenieria-producto h2{ color:#d96012; font-size: 20px; margin-bottom: 20px; text-align: center; line-height: 20px;}
.info-ingenieria-productop{ font-size: 16px; padding: 0 50px 0 50px; text-align: center}

.marginTop{ margin-top:40px}

.pasos-ingenieria-producto{ width: 90%; height: auto; overflow:hidden; margin: 20px auto 0 auto; text-align: justify }

.info-pasos{ width: 100%; height: 100%; float: none;  }
.info-pasos h3{ color:#d96012; font-size: 20px; margin-bottom: 20px; text-align: center;   }
.imagen-ingenieria{ width: 100%; height: 100%; float: none;}
.info-pasos p{ padding: 5% 5% 8% 5%; line-height: 30px}

.imagen-ingenieria img{  width: 78%; height: 90%; margin-left:13% }

.logo-ingenieria-producto{ width: 200px; height: auto; margin: auto }
.logo-ingenieria-producto img{ width: 150px; height: auto;}
.logo-ingenieria-producto a:link{ color:#d96012; text-decoration: none; text-align: center}
.logo-ingenieria-producto a:visited{ color:#d96012; text-decoration: none}	
.form-ingenieria{ width: 100%; height: auto; margin: auto; margin-bottom: 80px}
.form-ingenieria h3{ color:#d96012; font-size: 20px; text-align: center; margin-top: 40px}
.form-ingenieria form{ margin-left:20%}
}




@media screen and (max-width:580px){
	



.slide-desktop{ display:none}

.slide-mobile{ display: inline-block; width:100%; height:100vh;}



	


.content-politica{ width: 90%; height: 1240px; margin: auto; }

.iso{ width: 100%; height: 343px; float: none;  background:url(../img/iso.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; margin-top: 50px }

.iso:hover{ width: 100%; height: 343px; float: none;  background: url(../img/iso-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; cursor: pointer}

.logistica{ width: 100%; height: 343px; float: none;  background: url(../img/logistica.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; margin-top: 50px;}

.logistica:hover{ width: 100%; height: 343px; float: none;  background: url(../img/logistica-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; cursor: pointer}

.experiencia{ width: 100%; height: 343px; float:none;  background: url(../img/experiencia.png) center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; margin-top: 50px}

.experiencia:hover{ width: 100%; height: 343px; float: none;  background: url(../img/experiencia-h.png) no-repeat center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover; cursor: pointer}

.marginLeft-n{ margin-left: 0}
.marginLeft{ margin: 0;}
	

	
	
.servicios{ width: 90%; height: auto;  margin: 20px auto auto auto; padding-bottom: 100px   }


.servicios-ingenieria{ width: 80%; height:auto; ; float: none; margin:  40px auto 0 auto; }
.servicios-ingenieria img{ width: 50%; height: auto; margin: auto !important; padding: 10px;  }
.servicios-ingenieria a:link{ font-size: 16px;}
.servicios-ingenieria a:visited{ font-size: 16px;  }
.servicios-ingenieria a:hover{ font-size: 16px;  }

.marginLeft{margin-left: 10%;}	

	
footer{ text-align: center; height: 55px}
	
	

.terminos{ width: 100%;  float: none; margin-top: 8px;  }
.terminos a:link{  margin-left: 0px;}
.terminos a:visited{  margin-right: 0px}
.terminos a:hover{ margin-right: 0px}


.derechos{ width: 100%; float: none; margin-top: 5px;  text-align: center; ;}
.derechos a:link{  margin-right: 0px}
.derechos a:visited{  margin-right: 0px}
.derechos a:hover{ margin-right: 0px}
	
/*Productos*/

.content-categorias{ 
	width: 90%;
	height: auto;
	margin: 70px auto 3% auto;
	text-align: center;
	
	
	
}

.info-cateoria{ width: 100%; height: auto; float: none; margin-top: 0px; font-size: 14px;   }
.info-imagen{ width:  100%; height: auto; }

.info-imagen img{ width: 100%; height:auto;}

.info-description{ width: 100%;; height: 200px; }
.info-description h2{ color:#d96012; font-size: 14px;  text-align: center  }
.info-description p{  font-size: 14px; padding: 0;  }

.marginLeft2{ margin-left: 0}
.marginLeft3{ margin-left: 2.34375% }

.marginLeft2{ margin-left: 0}
.marginLeft3{ margin-left: 0% }
	
	
/*info productos*/

.similares h3{ margin-bottom: 40px; text-align: center}
	
.ficha-left form{ margin-top: 100px !important; font-size: 16px}

.info-asociados{ width: 90%; height: auto; float: none; margin-top: 50px; margin: auto; font-size: 14px; background-color: #cccccc   }

.marginLeft-asociados{ margin-left: auto}
.marginLeft-asociadoss{ margin-left: auto}

.img-asociados{ width: 100%; height: auto; }
.img-asociados h2{ color:#d96012; font-size: 14px !important;  text-align: center !important; margin-top: 12px;   }
	.info-asociados img{ width: 80%; height: auto;}
	
/*Servicios*/	
	
	
.norma-iso{
	width: 90%;
	height: auto;
	float: none;
	margin: auto;
	margin-bottom: 50px;


}

.just-time{
	width: 90%;
	height: auto;
	float: none;
	margin: auto;
	margin-left: 5%;
	margin-bottom: 50px;
	
}

.inventarios{
	width: 90%;
	height: auto;
	float: none;
	margin: auto;
	margin-bottom: 50px;

}

.empaques{
	width: 90%;
	height: auto;
	float: none;
	margin: auto;
	margin-left: 5%;
	margin-bottom: 50px;
	
	
}	

.content-servicios{
	width: 90%;
	height: 1300px;
	max-height: 1600px;
	margin: 0 auto 3% auto;
	text-align: center;
	padding-top: -40px;
	line-height: 25px;
}

.servicios-description p{ font-size: 16px; padding: 0 5px 0 5px; text-align: center}
	
}