/* FUENTE DE GOOGLE */

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap');
/*font-family: 'Caveat', cursive; */

@import url('https://fonts.googleapis.com/css2?family=Concert+One&display=swap');
/*font-family: 'Concert One', cursive;*/

@import "https://fonts.googleapis.com/css?family=Khand:300,400,600"; 
/* font-family: 'Khand', cursive; cursive;  uso  */


@import url('https://fonts.googleapis.com/css2?family=Grand+Hotel&display=swap');
/* font-family: 'Grand Hotel', cursive; uso  */


@import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed&display=swap'); 
/* font-family: 'Fira Sans Extra Condensed', sans-serif;  uso  */

@import url('https://fonts.googleapis.com/css?family=Bangers&display=swap'); 
/* font-family: 'Bangers', cursive;  uso  */

@import url('https://fonts.googleapis.com/css2?family=Atma:wght@500&display=swap'); /* <===================== SLIDER */
/* font-family: 'Atma', cursive;  uso  */


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
/* font-family: 'Montserrat', sans-serif; uso */


@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
/* font-family: 'Roboto', sans-serif; */


@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&display=swap');

/* font-family: 'Fjalla One', sans-serif; uso */


@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');
/* font-family: 'Architects Daughter', cursive; uso */


@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
/*font-family: 'Parisienne', cursive; uso*/

@import url('https://fonts.googleapis.com/css2?family=Luckiest+Guy&display=swap');
/*font-family: 'Luckiest Guy', cursive; uso */

@import url('https://fonts.googleapis.com/css2?family=Rock+Salt&display=swap');

/*font-family: 'Rock Salt', cursive; uso */

/**********************************************************************************************/
/**************************CAMBIAR SI ES DEMO PARA DIFERNCIAR*********************************/

.letra_titulo_slider {
font-size: 40px; /* <===================== CAMBIAR  */
color: #FFFFFF;
font-weight: bold;
text-shadow: 0.0em 0.0em 0.10em #000;
}


.letra_resumen_slider {
font-size: 18px; /* <===================== CAMBIAR  */
color:#FFFFFF;
font-weight: bold;
text-shadow: 0.0em 0.0em 0.10em #000;

}




.texto_promo_centrado{
position:absolute;
text-align:center;
z-index:2; 
font-weight: bold;
font-size: 26px;
color: #FFF;/* <===================== CAMBIAR  */
text-shadow: 0.0em 0.0em 0.10em #000;
border: solid 0px #fff; /*<===================== CAMBIAR  */
/*background-color: rgba(0,0,0,0.2);
text-transform: uppercase;
font-weight: 400;
margin: 5px 0 0;
font-weight: 600;
padding:10px;
*/
transition: all 0.3s ease 0s;

left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
	
}



.letra_titulo_catalogo {
  
	/*text-transform: lowercase; PASO TODO A MINUSCULA*/
	font-size:36px;
	color:#666666;
    
  }



/*.letra_titulo_catalogo:first-letter { 
    text-transform: uppercase;
}PASO PRIMERA LETRA MAYUSCULAR*/


.precio {
	
	font-size: 28px;
	
	color: #666; 
	
	}
	
/*********************************MENU SIDEBAR VEN EN menu_sidebar.css ******/	
.titulo_categoria_sidebar {
    
  
	color: #000; 
	font-size:26px;
	margin-left:10px;
	
    
  }
	
.titulos_menu_sidebar {
    
    
	color: #000; 
	font-size:16px;

  }
  
  	
/*********************************Fin MENU SIDEBAR VEN EN menu_sidebar.css ******/	

.btn_slider {
    border: solid 2px #fff;/* <===================== CAMBIAR  */
	background-color: #F09; /* <===================== CAMBIAR  */
	color: #FFF;/* <===================== CAMBIAR  */
	font-size: 26px;
	text-transform: uppercase;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
	
	border-radius:10px;
	
}

.btn_slider:hover {
	 border: solid 2px #fff;/* <===================== CAMBIAR  */
	 background-color:transparent;
	
	color:#fff;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
}


/*FONDO CAPTION CARRUSEL */
.carousel-caption {
   /*background: rgba(0, 0, 0, 0.4); 
	top:5%;
    max-width: 600px;*/
		
}


.info-general { /*Contenedor texto emergencia*/
	background-color: #333;
	color:#FFFFFF;
	margin-bottom:0px;
	border-radius: 20px;
	max-width:500px;
	padding:5px;
	margin-left:10px;
	margin-right:10px;

}


.info-general-florsis { /*Contenedor texto emergencia NO CAMBIAR*/
	background-color: #E4EA1C;
	color:#000;
	margin-bottom:0px;
	border-radius: 20px;
	max-width:700px;
	padding:5px;
	margin-left:10px;
	margin-right:10px;

}

.btn_comprar  {  /* <===================== CAMBIAR   SI CAMBIAS TAMAÑO DE LETRA TAMBIEN EN btn_agregado y btn_ver_opciones   */
	color: #FFF;
	border-color:#666;
	background-color:#666;
	font-size:14px;
	border-radius:0px;
	z-index:2;

	
	
}

.btn_comprar:hover {   /* <===================== CAMBIAR  */

	background-color: #FFF;
	border-color:#999;
	color: #000;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}


.btn_ver_opciones {  /* <===================== CAMBIAR  */
	color: #000;
	border-color:#666;
	background:none;
	border-radius:0px;
	font-size:14px;
}

.btn_ver_opciones:hover {   /* <===================== CAMBIAR  */

text-decoration:none;
	
}



.btn_agregado {  /* <===================== CAMBIAR  */
	background-color: #FFF;
	border-color:#666;
	color: #000;
	font-size:14px;
	border-radius:0px;	
}

.btn_agregado:hover {   /* <===================== CAMBIAR  */

	text-decoration:none;
	
}




.btn_servicio {  /* <===================== CAMBIAR  */
	background-color: #666;
	color: #fff;
	border-radius:0px;
	font-size:14px;

}

.btn_servicio:hover {  /* <===================== CAMBIAR  */
	background-color:#999;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}




.tallas {
    width:40px;
    height:40px;
	background-color:#fff;  /* <===================== CAMBIAR  */
	color:#000; 
    border-radius:50%;
    border: solid 2px #666;
    overflow:hidden; /* Evitar que el contenido se visualice fuera del borde*/
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	cursor:pointer;
	float:left;
	margin:10px;
  }
  
  
  .tallas:hover {
	 
	 background-color:#999;
	  
  }
  
  
  
  .talla_elegida {
    width:50px;
    height:50px;
	background-color:#999;  /* <===================== CAMBIAR  */
	color:#fff;
	font-size:32px;
    border-radius:50%;
    border: solid 2px #999;
    overflow:hidden; /* Evitar que el contenido se visualice fuera del borde*/
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	cursor:pointer;

	margin:10px;
  }
  
 


.btn_agotado {
	color: #FF2222;  /* <===================== CAMBIAR  */
	background-color: transparent;
	text-decoration:none;
	font-size:14px;

}

.btn_agotado:hover {

	text-decoration:none;
	
}






.btn_comprar_pagar  {  /* <===================== CAMBIAR  */
	color: #FFF;
	background-color:#666;
	border-radius:0;
	font-size:18px;
	
	
}

.btn_comprar_pagar:hover {   /* <===================== CAMBIAR  */

	background-color: #FFF;
	border-color:#999;
	color: #000;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}


.btn_seguir_comprando  {  /* <===================== CAMBIAR  */
	
	background-color: #FFF;
	border-color:#666;
	color: #000;
	border-radius:0;
	font-size:18px;
	
	
}

.btn_seguir_comprando:hover {   /* <===================== CAMBIAR  */

	color: #FFF;
	background-color:#999;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}






.btn_ver_detalles  {
	border: solid 1px #999;/* <===================== CAMBIAR  */
	color: #000000;/* <===================== CAMBIAR  */
	background-color: transparent;
	border-radius:0px;
	font-size: 14px;
	text-transform: uppercase;
	margin: 5px 0 0;
	transition: all 0.3s ease 0s;
	z-index:2;
	}

.btn_ver_detalles:hover {  /* <===================== CAMBIAR  */
	color: #FFF;
	background-color: #999;
	border:0px;
	 -webkit-transition: all ease 0.9s;
	-moz-transition: all ease 0.9s;
	transition: all ease 0.9s;
	
}

.btn_comprar_sin_registro {
    border: solid 1px #666;/* <===================== CAMBIAR  */
	color: #000;/* <===================== CAMBIAR  */
	background: none;
	font-size: 24px;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
}

.btn_comprar_sin_registro:hover {
	background-color: #999; /* <===================== CAMBIAR  */
	color:#fff;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
}


.btn_redes_sociales {  /* <===================== CAMBIAR  */
	font-size: 24px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color:#FFF ;/* <===================== CAMBIAR  */
	background: #CCC;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 40px;
	margin-bottom:5px;	
	
}

.btn_redes_sociales:hover {  /* <===================== CAMBIAR  */
	background-color: #444041;
	color: #fff;	
}

.btn_ws {  /* <===================== CAMBIAR  */
	font-size: 24px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color:#fff ;/* <===================== CAMBIAR  */
	background: #3DA831;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 40px;
	margin-bottom:5px;	
	
}

.btn_ws:hover {  /* <===================== CAMBIAR  */
	background-color: #DCFAF5;
	color: #3DA831;	
}


.btn_categorias_sidebar {
	color: #000;  /* <===================== CAMBIAR  */
	/*border-color:#FFF;*/
	border: solid 1px #666;/* <===================== CAMBIAR  */
	font-size:20px;
	background-color: transparent;  /* <===================== CAMBIAR  */
	
}


.btn_categorias_sidebar:hover {

	background-color: transparent;  /* <===================== CAMBIAR  */
	color: #000;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}




.btn_calendario  {  /* <===================== CAMBIAR  */
	color: #FFF;
	background-color:#FF2222;
	border-radius:0;
	font-size:14px;
	
	
}

.btn_calendario:hover {   /* <===================== CAMBIAR  */

	background-color: #003;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}





/***********************************************PIE DE PAGINA*/
footer {
	/*background-image:url(../img/fondo_pie.jpg);*/
	/*degrade 
    background: -webkit-linear-gradient(#464646,#353535); 
    background: -o-linear-gradient(#464646,#353535); 
    background: -moz-linear-gradient(#464646,#353535); 
    background: linear-gradient(#464646,#353535); 
	*/
	background-color:#444041; /* <===================== CAMBIAR  */

    color: #fff; /* <===================== CAMBIAR  */
    min-height:100px;
    padding-top:20px;
    padding-bottom:10px;
	margin-top:80px;
	
}
footer .nav>li>a {
    padding:3px;
    color:#FFF; /* <===================== CAMBIAR  */
	 padding-bottom:10px;
	
}

footer .nav>li>a:hover {
    background-color: transparent; /*AL PASAR EL MOUSE POR EL MUNU DE PIE DE PAGINA */
	
	color:#fff;/* <===================== CAMBIAR  */
	
}

footer .nav>li> a:focus {
  background-color: transparent;
  
}


/***************************************FIN PIE ***************************************/


.btn_agotado_enimagen  {
	border: solid 1px #FF0066;/* <===================== CAMBIAR  */
	color: #FFF;/* <===================== CAMBIAR  */
	background-color: #FF0066;
	border-radius:0px;
	font-size: 16px;
	text-transform: uppercase;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
	z-index:1;
	}

.btn_agotado_enimagen:hover {  /* <===================== CAMBIAR  */
	color: #FFF;
	background-color: #FF0066;
	border:0px;
	 -webkit-transition: all ease 0.9s;
	-moz-transition: all ease 0.9s;
	transition: all ease 0.9s;
	
}


.borde_producto {
	border: 0px solid #CCC; 
	padding:5px;
	}

.borde_producto:hover {  /* <===================== CAMBIAR  */

-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);
box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);

	
}




/*******************ALERTAS STOCK OBJETADO*********/

.alerta_stock_rojo {
	
	padding:2px;
	background-color: #F06;
	border-radius:10px;
	color:#FFF;
	text-align:center;

}


.alerta_stock_amarillo {
	
	padding:2px;
	background-color:#FC0;
	border-radius:10px;
	color: #333;
	text-align:center;

}

/**********************************************************************************************/
/**********************************************************************************************/


















/****************************************GENERAL**************************************/
body {
	
  /*font-family: 'Fira Sans Condensed', sans-serif;  <===================== CAMBIAR  */
  letter-spacing: 0px; 
  padding-top: 0px;
  padding-bottom: 0px;
  overflow-x: hidden; /*eliminio el scroll horizontal*/
}

/**/.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/loading_pagina.gif') 50% 50% no-repeat rgb(249,249,249);
    opacity: .9;
}



/***********************color de todos link */
a {
    color:#1F315F;
}

.centrar_horizontal_vertical  {

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);

}

.cover_imagen {
   object-fit: cover;
   width: 100%;
   height: 100%; 
   position: 50% 50%;
}


/*Saco negrita a todos los lavel*/
label {
    font-weight: normal !important;
}

/*Saco bordes a imagenes thubnail*/
.img-thumbnail{
	border:none;
	padding:0;
}

/*Escondo recaptcha logo*/
.grecaptcha-badge{
display:none !important;
}


.sombra {
-webkit-box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
-moz-box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
}



/*icons como @ */
.inner-addon { 
    position: relative; 
}

/* style icon */
.inner-addon .glyphicon {
  position: absolute;
  padding: 10px;
  pointer-events: none;
}

/* align icon */
.left-addon .glyphicon  { left:  0px;}
.right-addon .glyphicon { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }

/************/


/* loading animado para carga de proceso en espera ajax*/
.animar_loading {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
	color: #CCC; /****************************** <=====   CAMBIAR AQUI  */
	
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}
/****************************************************************************/







.fondo_cabecera {
	background-color:#FFFFFF;  /* <===================== CAMBIAR  */
	color: #666;
}

/****************************************FIN GENERAL**************************************/










/***********************************CARRO**********************************************/

.circulo_items_carro { /*Se muestra el total de items comprados*/
position:absolute;
top:20px;
left:20px;
margin-right:5px;
margin-left:5px;
width: 1rem;
height: 1rem;
border-radius: 50%;
background: #CCC; /*******************<===== CAMBIAR AQUI **************/
display: flex;
justify-content: center;
align-items: center;
text-align: center;
margin:0px auto;
padding:10px;
color:#000;
text-decoration:none;
}

.liston_subtotal_carro{
background-color:#FF2222;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
padding:20px;

}

.pasos_redondos{
background-color: #DFDFDF;  /* <===================== CAMBIAR  */
font-size:24px;
color:#000; 
text-align:center;
padding:10px;
height:40px;
width:40px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}

/*************************************************************************************/










/****************************************SLIDER*************************************/


/*******************CONTROL LEFT Y RIGHT***/
.control_slider {
	font-size: 40px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color: #fff;/* <===================== CAMBIAR  */
	

}

/*******************SACAR SOMBRA A FLECHAS DE CARRUSEL***/
.carousel-control {
    background-image:none !important;
    filter:none !important;
}

.oscuridad_slider {
 position:absolute;
 background-color: rgba(0,0,0,0); /*****0.2  hacia arriba para dar oscuridad**/
 filter:brightness(0);
 width:100%;
 height:100%;
 
}

/*****************************************FIN SLIDER*************************************/











/*******************************CONTROL RESPONSIVE********************************/
/* al achicarse */
@media (max-width:600px) {

		.letra_titulo_slider {
	font-size: 30px;
	}

	.letra_resumen_slider {
	font-size: 20px;
	}
	
	.btn_slider  {
	font-size:20px;
    }
	
	.texto_promo_centrado{

	font-weight: normal;
	font-size: 30px;
	
	}
	
	.letra_titulo_catalogo{

	font-size: 24px;
	
	}

	/*.ver_controles {
	display:none;
	}*/
	
	
	
	/********************BOTON COMPRAR SOBRE LA IMAGEN DE PRODUCTO*/
	.ver_boton_comprar_imagen {
		display:none;
		}

	

}



/* al agrandarse */
@media screen and (min-width:993px) {

		#enlaces_pie {
		/*display:none;*/
		}
		
		.iconos_alpie {
		display:none;
		}
		
		
		
		#cabecera {
		display:block;
		}

		/*SEPARACION DE ELEMENTOS AL TOP */
		.separacion_top {
		margin-top:80px;
		}	
		
		

}
		
/*********************************************+++ AL ACHICARSE LA PAGINA */
@media screen and (max-width:992px) {

			#cabecera {
			display:none;
			}
			
			#enlaces_pie {
			/*display:block;*/
			}	
			
			
			.iconos_alpie {
			display:block;
			}	

			/*SEPARACION DE ELEMENTOS AL TOP */
			.separacion_top {
			margin-top:63px;
			}
			
			#menu_lateral_fijo_contenedor {
			display:none;
			}
			
			
			#menu_lineas { /**************MENU DE LINEAS DEL MENU RESPONSIVE*****/
			display:none;
			}
			
			
 }

/*******************************FIN CONTROL RESPONSIVE********************************/

























/*********************************************TITULOS **********************************/


.precio_agregamas {
	font-size: 24px;
	text-align:center;
	color: #999; 
	
	}
	
.Estilo_nombre {	
	font-size: 12px;
	color: #666666;
}


.agotado  {
	color:#FF2222;  /* <===================== CAMBIAR  */
	border-radius:0;
	font-size:14px;
}


.terecomendamos {
    
	color: #666;/* <===================== CAMBIAR  */
	font-size:16px;
	
	
}

.titulos_pie {
	margin-top:10px;
	margin-bottom:10px;
	
}
/*********************************************FIN TITULOS **********************************/














/**********************************ESTILO PAGINACION ************/

.pagination2>li>a,
.pagination2>li>span {
  
  color: #444041;  /* <===================== CAMBIAR  */
  background-color:#fff;  /* <===================== CAMBIAR  */
}
.pagination2 > li > a:focus,
.pagination2 > li > a:hover,
.pagination2 > li > span:focus,
.pagination2 > li > span:hover {
   
    color: #FFF;  /* <===================== CAMBIAR  */
    background-color: #444041;  /* <===================== CAMBIAR  */
   
}

/********************************** FIN ESTILO PAGINACION ************/












/********************************************************* BOTONES */

/* BOTON QUE APARECE AL BAJAR SCROLL */
.arrowtop{
	width: 60px;
	height: 60px;
	position: fixed;
	bottom: 40%;
	right: 20px;
	display: none;
	text-indent: -9999px;
	background: url(../img/up.png) no-repeat;
	cursor: pointer;
	z-index:1002;
}










/**************************************BUSCADORES***********/

.btn_buscar  {  /* <===================== CAMBIAR  */
	background-color:transparent;
	
}


.btn_buscar:hover {  /* <===================== CAMBIAR  */
	
	background-color:transparent;
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}


.caja_buscar_modal{
	
	font-size:24px;
	border-color: #000; /* <===================== CAMBIAR  */
	color:#000; /* <===================== CAMBIAR  */
	height:50px;
	border-radius:0;
	text-align:center;

}



.li_buscar_principal{
	
	margin-top:15px;
	font-size:16px;
	color:#000; /* <===================== CAMBIAR  */

}



#buscar1{
	
width:350px; 


}







/********************************************************/






.close  {
	color: #000;
	font-size:36px;
}






.btn_costos_envios {
	border: solid 1px #666;/* <===================== CAMBIAR  */
	color: #000000;  /* <===================== CAMBIAR  */
	font-size:20px;
	background-color: transparent;
	text-decoration:none;

}




.btn_costos_envios:hover {

	text-decoration:none;
	
}



/*********************************************************FIN  BOTONES */












/**************************** DESTACADOS Y DESCUENTOS CONTENEDOR PRODUCTO / LISTON IMAGENES CATEGORIAS ******************/

.liston_oferta_producto{
position:absolute;
color:#FFF;  /* <===================== CAMBIAR  */
margin-right:5px;
margin-left:5px;
font-size:10px; 
margin-top:0px; 
z-index:1;
background-color: #FF2222;   /* <===================== CAMBIAR  */
padding:2px;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:50px;
height:30px;

}

.liston_descuento_producto{
position:absolute; 
left:10%;
margin-top:5%; 
background-color: #F00;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;

font-weight: bold;

text-align:center;
display: flex;
justify-content: center;
align-items: center;


padding:3px;
width:50px;
height:50px;
border-radius:2px;

}
   
.liston_descuento_categoria{
position:absolute; 
right:10%;
margin-top:60%; 
background-color:#F63;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;

text-align:center;
/*display: flex;
justify-content: center;
align-items: center;
*/

padding:3px;
width:50px;
height:50px;
border-radius:2px;

}

/********************************************************************************/









/*********************************SECCION CATEGORIAS CON IMAGENES*************/

.liston_descuento_categoria_seccion{
position:absolute; 
right:0;
margin-top:0; 
background-color:#999;  /* <===================== CAMBIAR  */
font-size:24px;
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:auto;

}


.liston_nombre_categoriaOK SIN MARCO{
position:absolute; 
z-index:2; 

font-family: 'Bangers', cursive; /* <===================== CAMBIAR  */
font-size: 18px; /* <===================== CAMBIAR  */
color:#00CCFF;

    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);

}


.liston_nombre_categoria{
position:absolute; 
z-index:2; 

	border: solid 1px #fff;/* <===================== CAMBIAR  */
	color: #fff;/* <===================== CAMBIAR  */
	
	background-color: rgba(0,0,0,0.2);
	
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
	padding:10px;

    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
	

}

/*********************************FIN SECCION CATEGORIAS CON IMAGENES*************/








/**************************************BUSQUEDA AUTO COMPLETA BUSQUEDA PRINCIPAL*/

#sugerencias1 {
box-shadow: 2px 2px 8px 0 rgba(0,0,0,.2);
height: auto;
position: absolute;
top: 45px;
z-index: 9999;
max-width:500px;
    					
}
 
#sugerencias1 .sugerencia-element1 {
background-color: #FFF;
border-top: 1px solid #d6d4d4;
cursor: pointer;
padding: 8px;
width: 100%;
min-width:500px;
float: left;
}

/*************************************************************************************/



/**************************************BUSQUEDA AUTO COMPLETA MODAL*/

#sugerencias {
box-shadow: 2px 2px 8px 0 rgba(0,0,0,.2);
height: auto;
position: absolute;
top: 45px;
z-index: 9999;
max-width:300px;
    					
}
 
#sugerencias .sugerencia-element {
background-color: #FFF;
border-top: 1px solid #d6d4d4;
cursor: pointer;
padding: 8px;
width: 100%;
float: left;
}

/*************************************************************************************/











/***********************INPUT ORDENAR DE MAYOR A MENOR********************** */

.caja_ordenar {
	height:40px;
	/*width:200px; */
	text-align:center;
	border-radius:0;
    color:#999;
}

/*************************************************************/











/************************CONTENEDOR ICONOS MOVILES PIE DE PAGINA */
div#enlaces_pie 
{
bottom: 0;
background-color: transparent;
position:fixed;
padding:10px;
margin-right:30px;
width:auto;
font-size:30px;
z-index:1001;
right:0;
}

/************************ FIN CONTENEDOR ICONOS MOVILES PIE DE PAGINA */












/************************ESTILOS MAS Y MENOS CANTIDAD PRODUCTO FICHA**************************/
  
.caja_cantidad {
	height:40px;
	width:10px;
	text-align:center;
	border-radius:0;
    color:#666;	
}

input[readonly].caja_cantidad{
  background-color:transparent;
  border: 0;
  font-size:18px;
  
}

/************************FIN ESTILOS MAS Y MENOS CANTIDAD PRODUCTO FICHA**************************/






/***************************************CHECK Y RADIO SITIO********************/
.switch_sis {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  
}
/* Hide default HTML checkbox */
.switch_sis input {display:none;}

/* The slider */
.slider_sis {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider_sis:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider_sis {
  background-color: #3C0; /* COLOR FONDO */  /* <===================== CAMBIAR  */
}

input:focus + .slider_sis {
  box-shadow: 0 0 1px #018A29; 
}

input:checked + .slider_sis:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider_sis.round {
  border-radius: 34px;
}

.slider_sis.round:before {
  border-radius: 50%;
}

/***************************************FIN CHECK Y RADIO SITIO********************/









/********************************DIV QUE CONTIENE BOTON ATRAS Y PAGAR EN LA FICHA Y FORMULARIO***********************/

div#pie_ficha 
{
bottom:0;
position:fixed;
margin-top:20px;
margin-bottom:20px;
width:100%;
z-index:102;

}

/****************************************************************************************/











/********************************************************* TOLTIP */
/* Tooltip container */
.tooltip1 {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted black;  If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip1 .tooltiptext1 {
  visibility: hidden;
  width: 120px;
  background-color: #CCC;  /************ <------ CAMBIAR AQUI   */
  color: #000;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip1 .tooltiptext1::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #ccc transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip1:hover .tooltiptext1 {
  visibility: visible;
  opacity: 1;
}

/****************************************************************************/




/********************************************************* TOLTIP  WS */
/* Tooltip container */
.tooltip_ws {
  position: relative;
  display: inline-block;
 /* border-bottom: 1px dotted black;  If you want dots under the hoverable text*/
}

/* Tooltip text */
.tooltip_ws .tooltiptext_ws {
  
  visibility: visible;
  /*antes visibility: hidden;*/
  width: 120px;
  background-color: #390;  /************ <------ CAMBIAR AQUI   */
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 10px;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 110%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 1;
  
  /*antes opacity: 0; */
  transition: opacity 15s;
}

/* Tooltip arrow */
.tooltip_ws .tooltiptext_ws::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #390 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip_ws:hover .tooltiptext_ws {
  
  /*antes visibility: visible;
  opacity: 1;*/
  
  
   visibility: hidden;
  opacity: 0;
   transition: opacity 0.3s;
  
  
}

/****************************************************************************/






/********************CAJAS INPUT*************/


input {
 
  width: 100%;
  max-width:600px;
  background: transparent;
  height: 3em;
  padding: 16px 8px;
  border-radius: 0;
  font-size: 16px;
  font-weight: 400;
 border: 1px solid #999; /**************<===CAMBIAR */
 margin-bottom:15px;
}



/***************************************************************************************/













/**********************TICKET ANIMADO OK PARA VENTANAS DE EXITO**********/

.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #7ac142;
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 2% auto;
  box-shadow: inset 0px 0px 0px #7ac142;
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #7ac142;
  }
}

/*******************************************************************************************************/










/**************************ESTILO PARA INPUT CHECK ACEPTA CONDICIONES, MISMOS DATOS Y MOSTRAR FACTURA**************/
.contendor_check {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
   
}

/* Hide the browser's default checkbox */
.contendor_check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
  
}

/* Create a custom checkbox */
.checkmark_form {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  
}

/* On mouse-over, add a grey background color */
.contendor_check:hover input ~ .checkmark_form {
  background-color: #ccc;
  
}

/* When the checkbox is checked, add a blue background */
.contendor_check input:checked ~ .checkmark_form {
  background-color: #FF2222;   /*********************** <======= CAMBIAR AQUI */
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_form:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.contendor_check input:checked ~ .checkmark_form:after {
  display: block;
}

/* Style the checkmark/indicator */
.contendor_check .checkmark_form:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/*****************************************************************************************/








/*******************************************EFECTO HOVER IMAGEN SOBRE STOCK */

.view-sixth img {
	
	 
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth .mask {
   background: rgba(255,255,255,0.8);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}

.view-sixth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover img {
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}


/* BORDE IMAGEN */
.view {
   width: auto;
   height: auto;
   margin: 0px;
   border: 0px;
   /*border: 1px solid #CCC; */
   overflow: hidden;
   position: relative;
   text-align: center;
   
   /*
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   */
   cursor: default;
   background: #fff;
}
.view .mask,.view .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
  
}

/***********************************************************FIN MASCARA IMAGEN/









/*******************************************EFECTO HOVER IMAGEN STOCK 0*/

.view-sixth2 img {
	
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth2 .mask2 {
   background: rgba(255,255,255,0.6);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=60)";
   filter: alpha(opacity=60);
   opacity: 60;
	
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}

.view-sixth2:hover .mask2 {
background: rgba(255,255,255,0);
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 100;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth2:hover img {

   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}

/* BORDE IMAGEN */
.view2 {
   width: auto;
   height: auto;
   margin: 0px;
   border: 0px;
   /*border: 1px solid #CCC; */
   overflow: hidden;
   position: relative;
   text-align: center;
   
   /*
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   */
   cursor: default;
   background: #fff;
}
.view2 .mask2,.view2 .content2 {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view2 img {
   display: block;
   position: relative;
  
}

/***********************************************************FIN MASCARA IMAGEN/










/***********************************EFECTO 2 IMAGEN**************/

.efecto2_imagenes {
    overflow: hidden; /*esta propiedad evita que la imagen ocupe mas espacio que su contenedor*/
    width:100%;
    border: 5px solid #FFF;
    box-sizing:border-box;
    float:left;
}
 
.efecto2_imagenes img {
    transition: all .4s ease;
    width:100%;
}
 
.efecto2_imagenes img:hover {
    transform:scale(1.5) rotate(20deg); /*cuando nos posicionamos sobre la imagen con esta propiedad aumentamos su escala y ademas la giramos*/
    /*opacity:0.6;*/
	
}


















/****************************RESPONSIVE IFRAME */
.responsive-video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 60px; overflow: hidden;
}

.responsive-video iframe,
.responsive-video object,
.responsive-video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/***************************FIN RESPONSIVE IFRAME***************/


/************************BOTON COMPRAR WEBPAY PRUEBA**********/

.btn_WEBPAYPRUEBA {
	color: #FFF;
	border-radius:0;
	font-size:18px;
	background-color:#F06;
}

.btn_WEBPAYPRUEBA :hover {

	background-color:#E41438;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}










/********************************************MENU LATERAL FIJO*******************************************/
#menu_lateral_fijo {
	max-width:250px;
    top: 0;
    /*left: -250px; */
	background-color:#FFF;/*<========= CAMBIAR  */
    color: #fff;
    transition: all 0.3s;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}

#menu_lateral_fijo.active {
    left: 0;
}

/********************************TITULO DEL MENU*****/
#menu_lateral_fijo .menu_lateral_fijo-header {
    padding: 20px;
	background-color:#FFF;/*<========= CAMBIAR  */
    
}

/********************************FIN TITULO DEL MENU*****/

#menu_lateral_fijo ul.components {
    padding: 20px 0;
}


#menu_lateral_fijo ul li a {
    padding:10px;
	color:#000028; /*<========= CAMBIAR  */
    font-size: 0.8em;
    display: block;
	text-decoration:none;
}
#menu_lateral_fijo ul li a:hover {
    color:#FFF; /*<========= CAMBIAR  */
    background:#00CCFF; /*<========= CAMBIAR  */
	text-decoration:none;
}

/************TITULO CATEGORIA PRINCIPAL*********/
#menu_lateral_fijo ul li.active > a, a[aria-expanded="true"] {
    color: #fff; /*<========= CAMBIAR  */
    background: #FF2222; /*<========= CAMBIAR  */
	text-decoration:none;
}


a[data-toggle="collapse"] {
    position: relative;
}

a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
    content: '\e259';
    display: block;
    position: absolute;
    right: 20px;
    font-family: 'Glyphicons Halflings';
    font-size: 0.9em;
}
a[aria-expanded="true"]::before {
    content: '\e260';
}

/*********************************SUB MENU********/
ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #FFF; /*<========= CAMBIAR  */
}






/************************************* CONTROL DE SLIDER PARA PC Y MOVIL */

@media screen and (min-width:701px) { /********* AL AGRANDARSE LA PAGINA */
  #slider_grande {
    display: block;
  }
  
  #slider_chico {
    display: none;
  }

}
		

@media screen and (max-width:700px) { /*********** AL ACHICARSE LA PAGINA */
	
#slider_chico {
    display: block;
  }
  
  #slider_grande {
    display: none;
  }
  
  
  .btn_costos_envios {
	
	font-size:14px;
	

}


.btn_categorias_sidebar {
	
	font-size:14px;
	
	
}
  
 
	
}



.colores_ficha{
font-size:18px;
color:#FFFFFF; 
text-align:center;
padding:10px;
height:40px;
width:40px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}



.colores_chicos{
font-size:18px;
color:#FFFFFF; 
text-align:center;
padding:10px;
height:10px;
width:10px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}




/******************************RADIO COLORES FICHA********/

/* Customize the label (the container) */
.container_color {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container_color input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark_color {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container_color:hover input ~ .checkmark_color {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container_color input:checked ~ .checkmark_color {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark_color:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container_color input:checked ~ .checkmark_color:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container_color .checkmark_color:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}
 