@charset "utf-8";
@font-face {
font-family: "mifuente";
src: url(../fuentes/calibri.ttf) format("truetype");
}
html {
    margin: 0px;
    padding: 0px;
}

body {
	/*background-color:#E8E8E8; */
	background-color:#FFF;
    margin: 0px;
    padding: 0px;
    /*font-family: mifuente;*/
	
}


#menu_jje {
    background-color:#39F;    /* Color de barra superior CELESTE */  
	                            /* para catalogo_jje es el color de la barra superior */
								/* para catalogo2021 es el color de la barra de rubros */
	
	/* background-color:#F00;    /* Color de barra superior ROJO */	
	                             /* color del banner de rubros para catalogo2021 */
	
	height:100px;   /*  Altura del banner superior */
                      /*  Altura del banner de rubros para catalogo2021 */
	
	/* height:150px;   /*  Altura del banner superior PARA catalogo_alb LUCIANA */
	
	border-radius:25px;
}

#menu {
    /*background-color:#39F;    /* Color de barra superior CELESTE */  
	                            /* para catalogo_jje es el color de la barra superior */
								/* para catalogo2021 es el color de la barra de rubros */
	
	/* background-color:#F00;    /* Color de barra superior ROJO */	
	                             /* color del banner de rubros para catalogo2021 */
	
	/*height:100px;   /*  Altura del banner superior */
                      /*  Altura del banner de rubros para catalogo2021 */
	
	/* height:150px;   /*  Altura del banner superior PARA catalogo_alb LUCIANA */
	
	border-radius:25px;
    margin: 0px;
    padding: 0px;
    min-height: 80px;
}


#texto {
	font-size:18px;
}
.descrip {
    height: 80px;
    overflow-y: hidden;   
}
.descrip h1 {	
    font-size:14px;
	font-weight:bold;
    color:#555555;  
}

.descrip a {
    color:#555555;
}
.descrip a:hover {
    text-decoration: none;
    color:#000000;
}
	
/*.caja_producto {
	border-bottom-style:solid;
	border-bottom-color:#333;
	border-bottom-width:3px;
	padding-bottom:8px;

}*/
.caja_producto 
    {    
    margin: 0px;
    padding: 0px;    
	margin-bottom:10px;   /* Separacion entre producto y producto */  
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;    
    }


.foto .item a img {	
	height:200px;
    margin: auto;
}




.contenedor_producto {        
    border-style: solid;
    border-width: 1px;
    border-color: #B0B0B0;
    border-radius: 5px;   
    box-shadow: 2px 2px 5px #B0B0B0;
    height: 550px;
}

.rubro_centrado {
    text-align: center;
    color: #999999;
    font-weight: normal;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
    margin-top: 10px;
}
.video_centrado {
    text-align: center;   
}
p.datos {
    font-size: 18px;
    text-align: left;
    text-align: center;
    margin-bottom: 5px;
}
p.datos1 {
    font-size: 11px;
    text-align: left;
}

p.datos2 {
    font-size: 11px;
    text-align: center;
    color:#444444;
    margin: 0px;
    padding: 0px;
    margin-bottom: 25px;
}
p.datos3 {
    font-size: 18px;
    text-align: left;
    text-align: center;       
    margin: 0px;
}



@media (max-width: 992px) {
	#menu {
		/*height:50px;  NO GENERA CAMBIOS EN NINGUN CATALOGO */

	}
	body {	
		padding-top:2px;  /* NO GENERA CAMBIOS EN NINGUN CAALOGO */
	}
	#navbar-1 {
	/*	background-color:#39F;    /* Color de barra superior CELESTE */  
                                  /* Color de barra rubros en catalogo2021 */
	}
}

.fila1 {
	/*text-align:center;*/   
	/*background-color:#F00;    /* Color de barra superior ROJO */
	background-color:#39F;    /* Color de barra superior CELESTE 
	
	/*height:120px; /*para alberto 125 */
	height:60px; 
	
	/*border-radius:25px;*/
}
.fila1 a {
	color:#FFF;
}
.fila2 {
	text-align:center;
	border-color:#666;
	border-width:1px;
	border-style:solid;
	border-radius:5px;
	box-shadow: 5px 5px #333;
	

    /*  Fondo de las filas de productos en catalogo_jje
	/*background-color: #FFFFFF;      /* Fondo blanco */
	background-color:#538ED4;    /* Fondo azul LUCIANA */
    /* background-color: #FF9;     /*  Fondo amarillo */
} 



.carrito {
	/*background-color:#FF9;
	height:30px;*/
}
.precio {
	height:30px;
}
.foto {
	/*height:300px;*/
}
#logo {
	display:inline;
}
@media (max-width: 992px) {
	#logo {
		width:100px;	
	}
}
#boton_buscar {
	display:inline;
}
#titulo_alberto {
	margin:0px;
	padding:0px;
	color:#FFF;
	text-shadow: 2px 2px 5px #333;
	font-size:18px;
}
#datos_alberto p {
	color:#FFF; 
	font-size:16px;
	text-shadow: 2px 2px 5px #333;
	
}
@media (max-width: 992px) {
	#datos_alberto p {
		margin:0px;
	}
}

.foto_borde {
	border-style:solid;
	/*border-color:#000;*/
	border-width:6px;
	border-color:#666;
	border-radius:25px;
	box-shadow: 5px 5px #666;
}

.elipse {
	width:170px;
	height:64px;
	border-radius:50%;
	background-color:#000;
	border-width: 4px;
	border-style:solid;
	border-color:#FFF;
	padding-top:18px;
	color:#FFF;
	
}

.rectangulo {
	border-radius:5px;
	background-color:#000;
	border-width: 4px;
	border-style:solid;
	border-color:#FFF;
	color:#FFF;
}

.rectangulo2 {
	border-radius:5px;
	background-color:#000;
	border-width: 4px;
	border-style:solid;
	border-color:#333;
	color:#FFF;
}


.outter{
   height:25px;
   width:500px;
   border:solid 1px #000;
}

.inner{
   height:25px;
   width:120;
   border-right:solid 1px #000;
   background-color:lightblue; 
}

/*Estilos de la forma de pago */
#candado {
	display: inline;
}
#leyenda_pago_seguro {
	display:inline;
}
#logo_mp {
	display: inline;
}
#leyendas_f_pago h1 {
	font-size:18px;
}
#cuadro_f_pago {
	border-width:1px;
	border-color:#000;
	border-radius:5px;
	border-style:solid;
	padding:7px;
	background-color:#FFF;
}
.foto_prod {
	position:relative;
	z-index:0;
	width:50%
}
.foto_prod img {
	position:relative;
	z-index:0;
}

.cartel_agotado {
	position:absolute;
	top:0; left:0;
	z-index:1;
	width:100%

}
.cartel_agotado img {
	position:relative;
	top:0; left:0;
	z-index:1;
}
#boton_ver_compra {
	display:block;
	background-color:#2288C9;
	color:#FFF;
	margin-top:7px;
	margin-left:15px;
	border-radius:5px;
	height:25px;
	width:100px;
	text-align:center;
    padding-top: 5px;
}
	
#boton_general {
	display:block;
	background-color:#2288C9;
	color:#FFF;
	margin-top:7px;
	margin-left:15px;
	border-radius:5px;
	height:25px;
	width:100px;
	text-align:center;
    padding-top: 5px;
}
#boton_novedades {
	display:block;
	background-color:#2288C9;
	color:#FFF;
	margin-top:7px;
	margin-left:15px;
	border-radius:5px;
	height:25px;
	width:100px;
	text-align:center;
    padding-top: 5px;
}
#boton_menu {
	background-color:#6FF;
}
#boton_comprar {
	background: #2288C9;
    color:#FFF;	
	margin-left:0px;
	margin-top: 0px;
	border-radius:5px;
	height:35px;
	width:90%;
	text-align:center;	
    border:none;
    margin-bottom: 5px;
    font-size: 12px;	
	/*background-color:#00C;*/
	 /*color:#FFF;   /* Normal */
	/*	color:#000;    /*  reyesdeloeste */
	/*margin-left:0px;
	margin-top: 0px;
	border-radius:5px;
	height:40px;
	width:80px;
	text-align:center;
	background: linear-gradient(to right, #00B2B2, #0859AA);   /* Normal, celeste degradee */
	/*    background: linear-gradient(to right, #FF0, #FF0);   /* reyesdeloeste */
}
#boton_volver {
    
    display:inline-block;
	background: #2288C9;
    color:#FFF;	 	
	border-radius:5px;
	height:35px;
	width:90%;
	padding-top: 8px;
	text-align:center;	
    margin-bottom: 5px;
    font-size: 12px;
    
	/*display:inline-block;
	background-color:#00C;
	 color:#FFF;	 
	/*    color:#000;    /*  reyesdeloeste */
	/*border-radius:5px;
	height:40px;
	width:80px;
	padding-top: 8px;
	text-align:center;
	background: linear-gradient(to right, #00B2B2, #0859AA); 
	/*    background: linear-gradient(to right, #FF0, #FF0);   /* reyesdeloeste */

}

#boton_volver:hover {
    text-decoration: none;
}

.controles_productos {
    margin: 0px;
    padding: 0px;
}

.boton_superior {
	display:block;
	background-color:#2288C9;
	color:#FFF;
	margin-top:7px;
	margin-left:15px;
	border-radius:5px;
	height:25px;
	width:110px;
	text-align:center;	
    font-size: 12px;
}
.boton_superior:hover {
    text-decoration: none;
}
.caja_precio_javier {
	border-radius:10px;
	background: linear-gradient(to bottom, #3399FF, #0859AA); 
	/* background: linear-gradient(to right, #7D0101, #0859AA); /* reyesdeloeste */
	padding:20px;
	color:#FFF;  /*  Color de la fuente */
	/*	color: #000;  /*  Color de la fuente reyesdeloeste*/
}
#banner {
    margin: 0px;
    padding: 0px;
}
.mi_fila {
    padding: 0px;
    margin: 0px;
}
#contenedor_principal {
    margin: 0px;
    padding: 0px;
}
#datos_locales {
    margin: 0px;
    padding: 0px;
    background-color: #000000;
}
#datos_locales h1 {
    font-size: 16px;
    color:#BABABA;
    text-align: center;
}
#datos_locales a {
   color:#BABABA;    
}
#datos_locales a:hover {
    text-decoration: none;
}
.col_datos {
    margin: 0px;
    padding: 0px;
}
#fila_buscador {
    background-color: #000000;
    margin: 0px;
    padding: 0px;
}

@media (max-width: 992px) {
    #caja_buscador {
        margin-bottom: 10px;       
    }   
}

.tira_colores {
    background-color: #000000;
    margin: 0px;
    padding: 0px;
    padding-top: 10px;
    padding-bottom: 20px;
}
#encabezado {
    margin: 0px;
    padding: 0px;
}
#los_links li {
    height: 20px;
    text-align: left;
}
#los_links li a {
    font-size: 10px;
    
}
#contador {
    margin: 0px;
    padding: 0px;
}
#list_adelanto_rub li a {
    font-size: 10px;
    color:#A3A3A3;
}
#list_adelanto_rub li a:hover {
    text-decoration:none;
}
#list_adelanto_rub {
    list-style: none;
}

#rubro_actual {
    background-color: #1E75AE;
    margin: 0px;  
    padding: 0px;
    margin-top: 20px;
    margin-bottom: 20px;    
}
#rubro_actual h1 {
    color:#FFFFFF;
    font-size: 20px;
    text-shadow: 1px 1px 2px black; 
    margin-left: 20px;
}

#pie {
   background: linear-gradient(#2288C9, #000000);
    margin: 0px;
    padding: 0px;    
    padding-top: 15px;
    padding-bottom: 15px;
}
#pie h1 {
    color: #FFFFFF;
    font-size: 20px;
}
@media (max-width: 992px) {
    #pie h1 {        
        font-size: 18px;
    }
    
}
#pie h2 {
    color: #FFFFFF;
    font-size: 16px;
    display: inline;
    margin-bottom: 10px;
    font-weight: normal;
}
#pie a {
   color:#FFFFFF;
   font-size: 18px;
}
#pie a:hover {
    color:#FFFFFF; 
    text-decoration:none;
}
#pie img {
    display: inline;
    margin-top: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    width: 30px;
}
#barra_info {
    background-color: #2288C9;    
    margin: 0px;
    padding: 0px;
    padding-top: 10px;
    padding-bottom: 10px;    
}
#barra_info img {
    display: inline;
    margin-right: 5px;
}
#barra_info h1 {
    display: inline;
    font-size: 16px;
    color: #FFFFFF;
    font-weight: normal;
}
#barra_info a {
    color: #FFFFFF;
}
#barra_info a:hover {
    text-decoration: none;
}

#locales {
    margin: 0px;
    padding: 0px;
}
#contacto_whatsapp {
    margin: 0px;
    padding: 0px;
}


#fondo {
    background: linear-gradient(#000000, #2288C9);
    min-height: 130px;
    padding-top: 20px;
    text-align: left;
}

.alinear_logo {
    margin-top: 50px;
}

@media (max-width: 992px) {
    #barra_info img {
        height: 20px;
         margin-right: 3px;
    }
    #barra_info h1 {    
        font-size: 10px;    
    }   
    .alinear_logo {
        margin-top: 0px;
    }
    #formulario {
        margin-top: 15px;       
    }    
    #lista_rubros {
        margin-bottom: 15px;
    }
}



/*----------------------------------------------------------------------------------------------*/
/*Estilos del carrusel de rubros */
#contenedor_carrusel_rubros {
    box-sizing: border-box;    
    display: flex;
    align-items: center;
    justify-content: center;    
}
.slide-container {
    max-width: 1120px;
    width: 100%;
   
    padding: 40px 0;
}
.slide-content {    
    margin: 0px 40px;
   
    overflow: hidden;
    border-radius: 25px;
}
.card {    
    border-radius: 25px;
    background-color: #EFEFEF;;
}
.image-content, .card-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 14px;
}
.card-image {
    position: relative;
    height: 125px;
    width: 125px;
    border-radius: 50%;
    background-color: #EFEFEF;
    padding: 3px;    
    border: none;
}
.card-image .card-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 4px solid #2288C9;
}
.image-content {
    position: relative;
    row-gap: 5px;  
    padding: 25px 0;
}
.overlay {
    position: absolute;
    left: 0px;
    top:0px;
    height: 100%;
    width: 100%;
    background-color: #2288C9;    
    border-radius: 25px 25px 0 25px;
}
.overlay::before, .overlay::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -40px;
    height: 40px;
    width: 40px;
    background-color: #EFEFEF;
}
.overlay::after {
    border-radius: 0 25px 0 0; 
    background-color: #EFEFEF;
    border-style: none;
}
.name {
    font-size: 10px;
    font-weight: 500;
    color:#333;
    text-align: center;
}
h2.name {
    text-align: center;
}
.name a {
    color:#333;
}
.name :hover {
    text-decoration: none;
}
.swiper-navBtn {
    color:#000000;
    trasition: color 0.3s ease;
    
}
.swiper-navBtn:hover {
    color:#393939;;
    
}
.swiper-navBtn::before,
.swiper-navBtn::after {
    font-size: 20px;
}
.swiper-button-next {
    right: 0;
}
.swiper-button-prev {
    left: 0;
}
@media (max-width: 519px) {
    .slide-content {
        margin: 0 10px;
    }
    div.swiper-navBtn {
        display: none;
    }
}

#subir {
  position: fixed;   
  bottom: 20px;     
  right: 1px;       
  z-index: 1000;    
  cursor: pointer;
  display: block;   
}
#subir img {
  display: block;
  width: 100px;       
  height: 100px;      
}

#wa-btn {
  position: fixed;
  bottom: 120px;        
  right: 20px;         
  z-index: 1000;
  cursor: pointer;
}
#wa-btn img {
  display: block;
  width: 60px;         
  height: 60px;
}