.paginacion{ 
font-family: 'Poppins', sans-serif 	margin-top: 10px; 
 	font-size: 13px ;
	display: table; 
	margin: 20px auto;
	font-weight:400 ;
} 
.tachado{text-decoration: line-through; font-size: 12px!important; color: #666666!important; font-weight:300;}
.avance{cursor: pointer; 
display: block; 
background-color: #ffffff; 
color: #e00000; 
height: auto; 
padding:9px 10px ; 
width: auto; 
float: left; 
text-align: center; 
border:1px solid #cccccc ;  
}
.avance:hover{background-color: #e00000; color: #ffffff;}


.numeracion {cursor: pointer; 
display: block; 
float: left; 
background-color: #ffffff; 
border:1px solid #cccccc ; 
border-left:0; 
border-right:1; 
width: auto; 
height: auto; 
padding:9px 10px ; 
text-align: center;
}
.borderleftcero{border-left:0px;}



.numeracion:hover{
background-color: #e00000; 
color: #ffffff; 
}

.numeroactivo{ 
background-color: #e00000; 
color:#ffffff; 
}

.disabled {
pointer-events: none; 
cursor: none;
}



.productos_box{
display: grid; 
grid-template-columns:1fr 1fr 1fr  ; 
justify-items:left; 
align-items:flex-start; 
grid-column-gap:20px;
}
@media only screen and (max-width: 618px) {
.productos_box{
display: grid; 
grid-template-columns:1fr ; 
justify-items:left; 
align-items:center; 
grid-column-gap:20px;
}
}




.caja1 {
	background-color: #f2f2f2;
	padding: 4px ;
	border-radius:10px ;
	width: 100%;
	margin-bottom: 8px ;
}
.caja2 {
	background-color: #ffffff;
		border-radius:10px ;
		border:1px solid #ffffff ;
		
	
	padding: 10px ;
	
}


.sumariacodigo {
	font-size: 16px ;
	font-weight: 300 ;
	color: #2d6da9;
	margin: 0px ;
}
.sumariaprecio {
	font-size: 22px ;
letter-spacing: -2px;
	font-weight: 500;
	color: #e60000;
	margin: 0px 0px 10px 0px ;
}
.p_recomen{font-size: 19px !important;}

.sumariatitulo {
	font-size: 20px ;
	font-weight: 900 ;
	color: #2d6da9;
	margin: 0px ;
}
.sumaria {

	font-size: 16px ;
	font-weight:300 ;
	color: #4d4d4d;
	display: block;
	text-align: justify;
	height: 80px ;
}


.fotico {
	border: 1px solid #cccccc;
	border-spacing: 0px;
	cellpadding: 0px;
	padding: 3px;
	width:100%;
	height:1000px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	
}


.imagenweb{background-repeat: no-repeat; background-size: cover; background-position: center; display: block;}
























/* CSS Document */
.t10{
	font-family: Arial;
	font-size: 10px;
	font-weight: normal;
	color: #666666;
}
.r_titulo {
	font-family: Arial;
	font-size: 20px;
	font-weight: normal;
	color: #666666;
	padding-left: 10px;
}
.r_info {
	font-family: Arial;
	font-size: 11px;
	font-weight: normal;
	color: #666666;
	padding-bottom: 15px;
	padding-left: 10px;
}


.sumaria_fecha {
	font-family: Arial;
	font-size: 10px;
	font-weight: normal;
	color: #666666;
	text-align: justify;
	display: block;
	margin-bottom: 10px;
}


.crop {
	width: 205px;
	height: 133px;
	overflow: hidden;
}
div {
	text-align:justify;
}
.crop img {
	width: 205px;
	margin: -15px 0 0 0px;
}
.r_precio {
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	color: #FF0000;
}
.l_fecha {
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	color: #F60;
	text-shadow:#fff 1px 1px 0;
}


.estadisticas {
	font-family: Arial;
	font-size: 11px;
	font-weight: normal;
	color: #333;
	text-shadow:#fff 1px 1px 0;
}
.c_label {
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	color: #333;
	text-shadow:#fff 1px 1px 0;
}


.l_titulo18 {
	font-family: Arial;
	font-size: 18px;
	font-weight: normal;
	color: #333333;
	text-shadow:#ccc 1px 1px 0;
}
.l_titulo20 {
	font-family: Arial;
	font-size: 20px;
	font-weight: normal;
	color: #333333;
	text-shadow:#ccc 1px 1px 0;
}
.l_titulo12b {
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: #333333;
}
.l_titulo14b {
	font-family: Arial;
	font-size: 14px;
	font-weight: bold;
	color: #000000;
}
.l_titulo22 {
	font-family: Arial;
	font-size: 22px;
	font-weight: normal;
	color: #000000;
}
.r_precio_tachado {
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: #999999;
	text-decoration: line-through;
}
.r_l_precio_tachado {
	font-family: Arial;
	font-size: 13px;
	font-weight: bold;
	color: #FF0000;
	text-decoration: line-through;
}
.formula2 {
	font-family:  Arial;
	font-size: 11px;
	color: #000000;
	border:1px;
	background-color: #FFFFFF;
	border-color: #999999;
	border-style: solid;
	padding-bottom: 1px;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	width: 150px;
}
.formula3 {
	font-family:  Arial;
	font-size: 11px;
	color: #000000;
	border:1px;
	background-color: #FFFFFF;
	border-color: #999999;
	border-style: solid;
	padding-bottom: 1px;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 1px;
	width: 150px;
	height: 50px;
}



/* Contenedor principal */
.image-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* Etiqueta de descuento */
.descuento-label {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 10;
  background: red;
  color: white;
  font-weight: 500;
  padding: 2px 6px;
  font-size: 0.9em;
  border-radius: 3px;
}

/* Wrapper ocupa todo el alto del contenedor */
.image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

/* Imagen rellena todo y se recorta */
.image-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
  display: block;
}

/* Zoom efecto */
.image-wrapper:hover img,
.image-wrapper a:hover img {
  transform: scale(1.05);
}

/* Responsive */
@media (max-width: 768px) {
  .image-container {
    height: auto !important;
  }

  .image-wrapper {
    position: static;
    height: auto;
  }

  .image-wrapper img {
    position: static;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}

.related{
	display: grid; 
	grid-template-columns: repeat(4, 1fr); 
	justify-items: center; 
	align-items: center; 
	grid-column-gap: 20px; 
	width: 96%; 
	margin: auto;
}

@media only screen and (max-width: 618px) {
.related{
 
	grid-template-columns: repeat(1, 1fr); 
 
}
}

.related-one{
	display: grid; 
	grid-template-columns: 120px 1fr; 
	justify-items: left; 
	align-items: center; 
	grid-gap: 20px; 
	margin-bottom: 10px; 
	width: 100%;
}