@charset "utf-8";
/* Selectores Basicos */
header, section, article, nav, footer, aside, figure, form{
	display:block;
	margin:0;
	padding:0;	
}
body{
	margin:0;
	background:#FFFFFF;	
}
*{
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
p, h1, h2, h3, h4{
	font-family:Arial, sans-serif;
	font-size:14px;
	color:#555555;
	margin:6px;
}
h1{ font-size:24px; }
h2{ font-size:20px; }
h3{ font-size:18px; }
h4{ font-size:16px; }
a{
	text-decoration:none;
	color:#555555;
}
a img{
	border:none;
}
ul, ol{
	font-family:Arial, sans-serif;
	font-size:14px;
	color:#555555;
}

/****************************************************/
/**************** Estilos para la cabecera **********/
/****************************************************/
#cabecera{
	border-bottom: 1px solid  #E7E7E7;
	overflow:hidden;	
}

.usuario {
	width:33.3%;
		float:left;	
}
.usuario h1{
	font-size: 1px;
	color: #FFFFFF;
}
.buscador{
	width:33.3%;
	float:left;	
}
.enlacesub{
	width: 33.3%;
		float:left;
	}
.usuario p{
	line-height: 42px;
	width: 100%;
	max-width: 250px;
	/*border-right: 1px solid #C91215;*/
	margin: 0;
	padding: 0 10px;
	}
.fbuscador{
	width: 260px;
	margin: auto;
	overflow: hidden;
	margin-top: 6px;
	}
.txtbuscador{
	width: 220px;
	line-height: 30px;
	height: 30px;
	display: block;
	border-radius: 4px 0 0 4px;
	border: 1px solid #E7E7E7;
	padding: 0 5px;
	float: left;
	}
.botonb{
	width: 40px;
	line-height: 30px;
	height: 30px;
	display: block;
	border: none;
	border-radius: 0 4px 4px 0;
	background: #E7E7E7;
	float: left;
	color: #FFFFFF;
	text-align: center;
	
	}
.enlacesub ul{
	display: block;
	float: right;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;	
}
.enlacesub ul li{
	float: left;
	}
.enlacesub ul li a{
	
	line-height: 42px;
	height: 42px;
	display: block;
	padding: 0 6px;
	border-left: 1px solid  #EFEFEF;
}
.enlacesub ul li a:hover, .enlacesub ul li a i:hover{
	color: #5279B8;
}
.enlacesub ul li a i {
	color: #4D4D4D;
	font-size: 18px;
	
}

/****************************************************/
/**************** Estilos para MENU *****************/
/****************************************************/


#cajamenu {
	overflow: hidden;
	padding: 4px 1%;
	}
#logo{
	width: 15%;
	float: left;
	}
#menu {
	width: 85%;
	float:left;
	margin:0;
	padding:0;
	list-style:none;
}
	
#menu li{
		float: right;
	}
#menu li a{
	line-height: 60px;
	height:50px;
	display: block;
	padding: 0 15px;
	font-size: 14px;
	color: #808180;
	font-weight: bold
	/*border-right: 1px solid #C91215;*/
}

#menu li a:hover{
	font-size: 16px;
border-bottom: 4px solid   #DDDDDD;
	color: #FFFFFF;
	background: #D87D1A;
}
#mmovil{
	display:none;
}

/****************************************************/
/**************** Estilos para PIE MENU PIE ************/
/**************** Estilos para PIE MENU PIE ************/
/****************************************************/


#cajamenup {
	overflow: hidden;
	padding: 0.3% 1%;
	background: #D87D1A;
	}

#menup {
	width: 70%;
	float:left;
	margin:0;
	padding:0;
	list-style:none;
}
	
#menup li{
			float:right;
	}
#menup li a{
	line-height:30px;
	height:40px;
	display: block;
	padding: 0 15px;
	font-size: 14px;
	color:#F4F3F3 ;
	font-weight: bold;
	text-align: center;
	/*border:1px solid #C91215;*/
}

#menup li a:hover{
	font-size: 16px;
/*border-bottom: 4px solid   #DDDDDD;*/
	color: #FFFFFF;
	background: #5279B8;
}


/***************** #D87D1A - NARANJA **************/
/*****************  #5279B8 - Azul **************/
/*****************  #808180 - GRIS *****************/

/* h1{font-size: 10px;
	color: #CC0609;}*/

/************9******************* ****************************/
/*****************  CUERPO WEB ***********************************/
/************************************ *************************/

/*****************  BANNER **************/
#banner{
	overflow: hidden;
	padding: 0.5% 0.5%;
	
	
}
#banner img{
	border: 4px solid #DFDFDF;
}

/*****************  texto productos **************/
/*****************  texto productos **************/
.cajatitulos{
	background:  #F0F0F0;
	padding: 2px 2px;
	border-bottom: 3px solid #D87D1A;
} 
.cajatitulos h2{
	text-align: center;
	font-size: 20px;
	color: #313030;
	}
.cajatitulos p{
	text-align: center;
	font-size: 16px;
	color:#313030;
	}
/***--------------------------   NOVEDADES --------**/
/***--------------------------   NOVEDADES --------**/
/***--------------------------   NOVEDADES --------**/

.cajanovedades{
	overflow: hidden;
	
}
.novedades{
	width: 33.3%;
	float: left;
	padding: 0.5% 0.5%;
}
.novedades img{
	width:100%;
	height: auto;
	display: block;
	}
.novedades h2{
	font-size: 10px;
	color: #929292;
	/*display: block;*/
	text-align: center;
}

/***--------------------------   OFERTAS --------**/
/***--------------------------   OFERTAS --------**/
/***--------------------------   OFERTAS --------**/

.cajaofertas{
	overflow: hidden;
}
.ofertas{
	width: 49%;
	float: left;
	padding: 0.5% 0.5%;
}
.ofertas img{
	width: 100%;
	height: auto;
	display: block;
}
.ofertas  h2{
	font-size: 10px;
	color: #929292;
	/*display: block;*/
	text-align: center;
}

/***--------------------------   PRODUCTOS --------**/
/***--------------------------   PRODUCTOS --------**/
/***--------------------------   PRODUCTOS --------**/
	.cajaproductos{
		overflow: hidden; /***crece o achica de manera auto las imagenes o la caja****/
		padding: 0.5%;
	}
	.productos{
		width: 20%;
		float: left;
	}
.productos img{
	width: 100%;
	height: auto;
	display: block;
	}
.productos .datospro{
	min-height: 285px;
	border-right: 1px solid #e5e5e5;
	padding: 2%;
	position: relative;
}
.productos .datospro h2{
	font-size: 15px;
	font-weight: bold;
	color: #000000;
}
.productos .datospro p{
	font-size: 13px;
}
.productos .datospro .precio{
	font-size: 14px;
	font-weight: bold;
	color: #5279B8;
	margin: 15px 6px;
	position: absolute;
	left: 10px;
	bottom: 55px;
}
.productos .datospro a{
	width: 150px;
	height: 34px;
	line-height: 34px;
	display: block;
	text-align: center;
	color: #FFFFFF;
	background: #5279B8;
	font-size: 13px;
	position: absolute;
	left: 10px;
	bottom: 20px;
	}
.productos .datospro a:hover{
	background: #D87D1A;
	font-size: 16px;
	font-weight: bold;
	}

/****************************************************/
/****************   MARCAS y SUS LOGOS  *****************/
/****************************************************/
.cajamarcas{
	overflow: hidden;
/*	border:1px solid #FD0307;*/
	background: #FFFFFF;
	padding: 1% 0.5%;
	}
.marcas {
	width: 12.5%;
	float: left;
	padding: 0.3%;
	/*border:1px solid #FD0307;*/
}
.marcas img{
		width: 100%;
	height: auto;
	display: block;
	/*border:1px solid #FD0307;*/
	}
	
/****************************************************/
/****************   CONTACTANOS  *****************/
/****************************************************/
.contactanos{
	overflow: hidden;
	/*border:1px solid #FD0307;*/
	background:  #FFFFFF;
	padding: 1% 0.5%;
	}
.mapa {
	width: 61%;
	float: left;
	padding: 0.3%;
	height: auto;
	display: block;
	/*border:1px solid #FD0307;*/
}
.mapa img{
	width: 100%;
	height: auto;
	display: block;
}
.escribenos{
	width: 39%;
	float: left;
	height: auto;
	display: block;
	padding: 0.3%;
	/*border:1px solid #FD0307;*/
	}
.escribenos a{
	width: 100%;
	height: auto;
	display: block;
}


/****************************************************/
/****************   PIE DE PAGINA   *****************/
/****************************************************/

h5{
	color:#393838;
	font-size: 10px;
	text-align: center;
}
#piepagina{
	background: #000000;
	padding: 10px 0;
	}

#contenidopie{
	width:100%;
	max-width: 1100px;
	margin: auto;
	overflow: hidden;
	
}
#logopie{
	display: block;
	overflow:hidden;
	width: 100%;
	float: none;
	/*border:1px solid #FD0307;*/

}
#logopie img{
	float:none;
	padding:0 42%;
	text-align: center;
}

.cajapie{
	width: 100%;
	float: left;
	padding: 0 5%;
}
.cajapie ul li{
	font-size: 20px;
	color: #C8C7C7;
	text-align: center;
	display: block;
	/*border-bottom: 1px dotted #908D8D;*/
	margin: 10px 0;
}

.cajapie ul p{
	font-size: 14px;
	color:#4B4949;
	text-align: center;
	display: block;
	/*border-bottom: 1px dotted #908D8D;*/
	margin: 2px 0;
}

/****************************************************/
/****************   ESTILO PLANTILLA  *****************/
/****************   ESTILO PLANTILLA  *****************/
/****************************************************/
#cuerpo{
	width:100%;
	max-width: 1100px;
	margin: auto;
	min-height: 600px;/*-------ALTO de la CAJA------*/
}
.titulosinternos {
	background: #5279B8;
	padding: 5px 0;
	}
.titulosinternos h2{
	text-align: center;
	font-size: 24px;
	color: #fff;
	}
.titulosinternos p{
	text-align: center;
	font-size: 18px;
	color: #F1F1F1;
	
}

/*****************************************************************/
/****************   PAG ESTILO DETALLE PRODUCTO  *****************/
/****************   PAG ESTILO DETALLE PRODUCTO  *****************/
/*****************************************************************/
#cajadetalles{
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 10px;
	}
#imgproducto{
	width: 49%;
	float: left;
	border: 4px solid #E7E7E7;
	margin-right: 1%;
	}
#datosproducto{
	width: 50%;
	float: left;
	background: #E5E5E5;
	padding: 3%;
	min-height: 400px;
}
#imgproducto img{
	width: 100%;
	height: auto;
	display: block;
}
#galeriapro {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
	}
#galeriapro li {
	float: left;
	width: 25%;
	padding: 0.25%;
}
#galeriapro li a{
	display: block;
}
#galeriapro li a img{
	width: 100%;
	height: auto;
	display:block;
	border: 2px solid #E7E7E7;
	border-radius: 3px;
}
#galeriapro li a:hover img{
	border:3px solid #3C7EF1;
	border-radius:0;
	
}
/****************************************************/
/****************   ESTILO TABS  *****************/
/****************   ESTILO TABS  *****************/
/****************************************************/

#cajadescripcion {
	overflow: hidden;
	margin-bottom: 10px;
}

/****************************************************/
/****************   ESTILO LISTA DE PRODUCTO  *****************/
/****************   ESTILO LISTA DE PRODUCTO  *****************/
/****************************************************/
#c-productos{
	overflow: hidden;
	margin: 10px 0;
}
#col-cat{
	width: 20%;
	float: left;
	margin-right: 1%;
			
}
#col-prod{
	width: 79%;
	float: left;
		
	}

#col-cat h2, #col-prod h2{
	display: block;
	line-height: 40px;
	background:  #E5E5E5;
	margin: 0;
	padding: 0 15px;
	color: #666666;
	font-weight: normal;
	font-size: 17px;
}
#col-prod h2{
 	margin-right: 1%;
}
#contproductos {
	overflow: hidden;
	margin: 10px 0;
}
.prodet {
	width: 24%;
	float: left;
	margin-right: 1%;
	border: 1px solid #CCCCCC;
	margin-bottom: 1%;
	padding: 3% 1%;
}
.prodet img{
	width: 100%;
	height: auto;
	display: block;
}
.prodet h3{
	font-size: 14px;
	}
.prodet p{
	font-size: 14px;
	color: #5279b8;
	margin: 15px 6px;
	font-weight: bold;
	}
.prodet a{
	width: 100%;
	height: 40px;
	line-height: 40px;
	display: block;
	background: #5279b8;
	color: #FFF;
	text-align: center;
	font-size: 13px;
	border-radius: 4px;
}

.prodet a:hover{
	width: 100%;
	height: 40px;
	line-height: 40px;
	display: block;
	background: #b4b4b4;
	color: #FFF;
	text-align: center;
	font-size: 13px;
	border-radius: 4px;
}




/*****************************************************************/
/****************   ESTILO PAG CONTACTO **************************/
/****************   ESTILO PAG CONTACTO  ***********************/
/*****************************************************************/
#cajaformulario{
	padding: 30px;
	background:  #F0F0F0;
}
#cajaformulario img{
	display: block;
	margin: auto;
}
#cajaformulario h2{
	text-align: center;
}
.cajacampos{
	margin-bottom: 10px;
	}
.campos{
	width: 100%;
	height: 35px;
	line-height: 38px;
	border: 1px solid #B81316;
	padding: 0 10px;
	border-radius: 4px;
	}
.campos:hover, .campos:focus{
	border: 2px solid #000;
}
.comentarios{
	width: 100%;
	height: 120px;
	border: 1px solid #B81316;
	padding: 10px;
	}
.comentarios:hover, .comentarios:focus{
	border: 2px solid #000;
}
.benviar{
	width: 100%;
	height: 50px;
	line-height: 50px;
	border-radius: 4px;
	text-align: center;
	background: #1E42A2;
	font-size: 16px;
	color: #fff;
	transition:all 0.5s;
		border:none;
	}
.benviar:hover{
	background: #000;
}


/*****************************************************************/
/****************   PAG ESTILO NOSOTROS          *****************/
/****************   PAG ESTILO NOSOTROS          *****************/
/*****************************************************************/
#cajamisi{
	width: 70%;
	/*border:2px solid #ED1519;*/
	padding: 2%;
	margin: auto; /*centrar caja*/
		}
#cajamisi img{
	width: 100%;
	margin: auto;
	padding: 2%;
	
}

.intec{
	width: 100;
	float: inherit;
	display: block;
	border-bottom: 1px solid  #827F7F;
	}
.intec p{
	text-align: justify;
	}
.mision{
	width: 47%;
	float: left;
	/*border: 1px solid #D0090C;*/
	border-right: 1px solid  #868686;
	
	}
.mision p{
	text-align: justify;
}
.vision{
	width: 49%;
	float: left;
	}
.vision p{
		text-align: justify;}


/*****************************************************************/
/****************   PAG ESTILO MARCAS         *****************/
/****************   PAG ESTILO MARCAS          *****************/
/*****************************************************************/
#cajamarca{
	width: 70%;
	padding: 2%;
	margin: auto;
	/*border: 1px solid #E7181B;*/
}
#cajamarca img{
	width: 20%;
	padding: 2%;
	margin: 0% 0% 0% 10%;
	
}


/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/
/***------------------------------------   RESPONSIVE  --------------------------------------------------------**/

/****************************************************/
/****************    Estilos para 1440    **********/
/****************************************************/
@media only screen and (max-width:1440px){
	
	.productos .datospro{
		min-height:350px;
	}
	.productos .datospro p{
		/*color:#4405C9; */ /***********************Borrar ********************/
		text-align:inherit;		
	}
	
}/****************    Estilos para 1440     **********/


/****************************************************/
/****************    Estilos para 1024     **********/
/****************************************************/
@media only screen and (max-width:1024px){
	
	/******MENU RESPONSIVE******/
	#logo{
	width: 100%;
	float: none;
		}
	
#menu {
	width: 100%;
	display: block;
	float:none;
	overflow: hidden;
}
	#menu li{
		float: left;
		
	}
	/****************  producto responsive **********/
		.productos{
		width: 25%;			
	}
	.productos .datospro{
		min-height:320px;
	}
	.productos .datospro p{
		/*color: #FD0509;*/  /***********************Borrar ********************/
		}
	
		
	
	/****************  CAJA MENU PIE responsive **********/
	#menup {
	width: 80%;
		/*float:left;*/
		}
	
	#menup li a{
	line-height:20px;
	height:30px;
	display: block;
	padding: 0 10px;
	font-size: 12px;
	color:#F4F3F3 ;
	font-weight: bold;
	text-align: center;
		/*border:1px solid #C91215;*/}
	
}/****************    Estilos para 1024     **********/



/****************************************************/
/****************    Estilos para 800      **********/
/****************************************************/
@media only screen and (max-width:800px){
	/******CABECERA RESPONSIVE******/
	.usuario {
	width:100%;
	border-bottom: 1px solid #EFEDED;
}
.buscador{
	width:100%;
	border-bottom: 1px solid #EFEDED;
	padding-bottom: 6px;
}
.enlacesub{
	width: 100%;
				}
	
.usuario p{
	border-right: none;
	margin:0 0;
		}
	.enlacesub ul{
		width: 290px;
		float:none;
	   margin:0 auto;
	 border-right:1px solid  #EFEDED;
		border-bottom: 1px solid  #EFEDED;
		padding:0 0px;
		}
	.enlacesub ul li i{
		
		padding:0 15px;
		}
		
	/******mMENU PRINcipal RESPONSIVE******/
	#logo img{
		display:block;
		margin: auto;
		}
	#cajamenu{
		padding: 4px 0;		
	}
	#mmovil {
		display: block;
		height: 40px;
		line-height: 40px;
		padding: 0 2%;
		color: #FFFFFF;
		background: #5279B8;
		margin: 10px 0 0 0;
		position: relative;
		}
	#mmovil i{
		position:absolute;
		right: 10px;
		font-size: 20px;
		color:#FFFFFF;
		}
	#menu{
		display: none;
		width: 100%;
		height: auto;
		}
	#menu li{
		float: none;
	}
	
	#menu li a{
	line-height: 40px;
	height: 40px;
	padding: 0 2%;
	background: #EFEFEF;
		border-bottom: 1px solid #FFFFFF;
		text-align: center;
		}

#menu li a:hover{
	border-bottom: none;
	color: #FFFFFF;
	background: #D87D1A;
}
	
	/****************  producto responsive 800px **********/
	
	.productos{
		width: 33.3%;
			}
	.productos .datospro{
		min-height:320px;
	}


.productos .datospro p{
	font-size: 12px;
	text-align: justify;
	}
	
	/***--------------------------   NOVEDADES responsive--------**/

	.novedades{
	width: 50%;
	}
	/***--------------------------   OFERTAS responsive--------**/

	.ofertas{
	width: 100%;
	}
	
	/***--------------botones pie responsive--------**/
	#menup {
	width: 100%;
	float:left;
	}
	#menup li{
		padding:5 0 0 0;
		float:none;}
	
	/***-------------- FIN bontones pie responsive--------**/
	
	#logopie img{
	float:none;
	padding:0 33%;
	}
	
	/***-------------- LISTA DE PRODUCTOS responsive--------**/
	.prodet{
		width: 49%;
	}
	#col-cat{
	display: none;			
}
#col-prod{
	width: 100%;
	float:none;
			}
	} /***-------------- FIN LISTA DE PRODUCTOS responsive--------**/	
	
	

/****************************************************/
/****************    Estilos para 603      **********/
/****************************************************/
@media only screen and (max-width:603px){
	/*---------DETALLES PIE DE PAG-------*/
	#logopie img{
	float:none;
	padding:0 30%;
	}
	
	/*---------DETALLES DE PRODUCTOS-------*/
	#imgproducto{
	width: 95%;
	float: none;
		margin-right: 0;
		margin: auto;
		margin-bottom: 10px;
		}
#datosproducto{
	width: 95%;
	float: none;
	margin: auto;
	min-height:inherit;
}
	
	
	
	
}
/****************************************************/
/****************    Estilos para 533      **********/
/****************************************************/
@media only screen and (max-width:533px){
	
	/***---------   TITULO de cuerpo --------**/
	.cajatitulos{
	background: #D87D1A;
		padding: 1px 0;}
		
	.cajatitulos h2{
	text-align: center;
	font-size:16px;
	color: #FFFFFF;
	}
.cajatitulos p{
	text-align: center;
	font-size: 10px;
	color: #FFFFFF;
	}
	
	
	/***--------------------------   NOVEDADES responsive--------**/
	.novedades{
	width: 100%;
	}
	
	
	/****************  producto responsive 533px **********/
		.productos{
		width: 50%;
			}
	
}
/****************************************************/
/****************    Estilos para 480      **********/
/****************************************************/
@media only screen and (max-width:480px){
	/****************  producto responsive px **********/
	
	.productos{
		width: 90%;
		float: none;
		margin: auto;
		}
	.productos .datospro{
		min-height: 200px;
		border-right: none;
		border-bottom:1px solid  #EDEAEA;
		bottom: 5px;
	}
	/**************** LISTA DE PRODUCTOS    **********/
	.prodet{
		width: 90%;
		float: none;
		margin-right:o;
		margin: auto;
		margin-bottom: 2%;
	}
}
/****************************************************/
/****************    Estilos para 360      **********/
/****************************************************/
@media only screen and (max-width:360px){
	
}
/****************************************************/
/****************    Estilos para 320      **********/
/****************************************************/
@media only screen and (max-width:320px){
	
}
