.fa-principal {
border: 1px solid #dddddd;
margin-top: 10px;
border-radius: 15px;
-moz-border-radius: 15px;
/* Firefox */
-webkit-border-radius: 15px;
/* Safari y Chrome */
padding: 5px;
}
.fa-titulo {
text-align: center;
}
.fa-titulo-titulo {
width: 100%;
}
.fa-titulo-titulo img {
max-width: 100%;
}
.referenciaFichaProductoTitulo {
position: absolute;
right: 10px;
}
.fa-titulo-marca {
width: 150px;
text-align: right;
padding-top: 5px;
display: none;
}
.fa-pagamastarde {
width: 92%;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
}
.fa-media {
width: 100%;
position: relative;
}
.fa-media-envio-gratis {
position: absolute;
right: 0;
pointer-events: none;
}
.fa-media-envio-gratis img {
width: 70px;
}
.fa-media-img {
width: 100%;
height: 100%;
padding-left: 9px;
padding-bottom: 9px;
padding-top: 9px;
margin-bottom: 15px;
}
.imagenFichaProductoGeneral {
width: 100%;
height: auto;
}
.fa-media-carrusel {
width: 100%;
text-align: center;
}
.fa-media-carrusel div {
display: inline-flex;
}
.fa-media-carrusel div:hover {
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-media-carrusel-foto {
/* border: 1px solid #aaaaaa; */
padding: 4px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-datos {
width: 100%;
height: 100%;
}
.fa-cuerpo {
margin-top: 20px;
}
.fa-precio-grande {
font-size: 3.3em;
font-weight: bold;
}
.fa-currency {
font-size: 2.3em;
font-weight: bold;
padding-top: 14px;
margin-bottom: 10px;
margin-left: -7px;
}
.fa-precio-tipo-oferta {
display: inline-block;
background: #fff3e9;
color: #d15600;
font-size: 14px;
font-weight: 700;
padding: 6px 14px;
border-radius: 20px;
margin-bottom: 8px;
line-height: 1.3;
white-space: normal;
width: auto;
}
.fa-precio-pequeno {
font-size: xx-large;
}
.fa-precio-pequeno-tachado {
font-size: 1em;
text-decoration: line-through;
color: #969696;
font-weight: 400;
}
.fa-precio-grande-mayorista {
font-size: 1.5em;
padding-top: 20px;
width: 230px;
text-align: right;
padding-right: 10px;
}
.fa-margen {
padding-right: 10px;
width: 230px;
text-align: right;
font-size: 1.1em;
}
.fa-precio-pequeno-mayorista {
font-size: 1.1em;
font-weight: bold;
background-color: #dddddd;
border: 1px solid #dddddd;
width: 220px;
text-align: right;
padding-right: 10px;
padding-top: 5px;
padding-left: 5px;
padding-bottom: 5px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-boton-comprar {
clear: both;
text-align: center;
}
.fa-datos-marca {
padding-left: 20px;
margin-bottom: 20px;
}
.fa-datos-marca a {
text-decoration: none;
}
.fa-datos-nombre {
display: none;
}
.fa-datos-edad {
text-align: center;
}
.fa-datos-descripcion-corta {
display: none;
/*margin-bottom: 10px;*/
margin-top: 10px;
}
.fa-datos-descripcion-corta-mas-detalles {
margin-bottom: 10px;
display: none;
}
.fa-datos-descripcion-corta a {
text-decoration: none;
display: none;
}
.fa-datos-descripcion-corta-mas-detalles a {
margin-bottom: 10px;
text-decoration: none;
display: none;
color: #de6c24;
font-weight: bold;
}
.fa-datos-descripcion-corta-mas-detalles a:hover {
color: #343d7a;
display: none;
}
.fa-datos-gastos-envio {
display: none;
}
.fa-datos-envio {
display: none;
}
.fa-datos-compartir {
border: 1px solid #eeeeee;
padding-bottom: 10px;
padding-left: 5px;
padding-right: 0px;
width: 135px;
border-radius: 10px;
-moz-border-radius: 10px;
/* Firefox */
-webkit-border-radius: 10px;
/* Safari y Chrome */
background-color: #eeeeee;
margin-bottom: 5px;
margin-top: 5px;
text-align: center;
}
.fa-datos-compartir-wrap {
clear: both;
margin-top: 15px;
width: max-content;
width: -moz-max-content;
width: -webkit-max-content;
margin-left: auto;
margin-right: auto;
}
.fa-datos-compartir-derecha {
border: 1px solid #eeeeee;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
padding-top: 8px;
width: 160px;
float: left;
border-radius: 10px;
-moz-border-radius: 10px;
/* Firefox */
-webkit-border-radius: 10px;
/* Safari y Chrome */
background-color: #eeeeee;
margin-top: 5px;
font-size: 0.9em;
margin-left: 5px;
text-align: center;
}
.fa-datos-compartir-derecha a {
text-decoration: none;
}
/* INICIO ESTILO ZOOM IMAGENES*/
/* these styles are for the demo, but are not required for the plugin */
.zoom {
display: inline-block;
position: relative;
}
.zoom .zoomImg {
cursor: cell;
}
/* magnifying glass icon */
.zoom:after {
content: "";
display: block;
width: 33px;
height: 33px;
position: absolute;
top: 0;
right: 0;
background: url(icon.png);
}
.zoom img {
display: block;
}
.zoom img::selection {
background-color: transparent;
}
/* FIN ESTILO ZOOM IMAGENES*/
.fa-complementos-titulo {
background-color: #db702a;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-complementos-articulos {
width: 100%;
text-align: center;
}
.fa-complementos-articulos-articulo {
width: 76px;
text-align: center;
display: inline-block;
vertical-align: top;
}
.fa-complementos-articulos-articulo a {
text-decoration: none;
}
.fa-otros-articulos {
width: 100%;
margin-bottom: 20px;
}
.fa-otros-articulos-largo {
width: 100%;
margin-bottom: 20px;
}
.fa-sustitutos-titulo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-advertencias-titulo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
margin-right: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-advertencias-cuerpo {
width: 100%;
}
.fa-advertencias-titulo-largo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-advertencias-cuerpo-largo {
width: 100%;
}
.fa-advertencias-ficha {
width: 100%;
}
.fa-superiores-titulo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-superiores-cuerpo {
width: 100%;
}
.fa-superiores-titulo-largo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-superiores-cuerpo-largo {
width: 100%;
}
#anterior {
color: #db702a;
font-weight: bold;
font-size: 0.9em;
margin-right: 30px;
}
#siguiente {
color: #db702a;
font-weight: bold;
font-size: 0.9em;
}
#anterior:hover {
color: #666666;
}
#siguiente:hover {
color: #666666;
}
.fa-otros-articulos-titulo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-otros-articulos-articulo {
float: left;
width: 100px;
font-size: 0.8em;
text-align: center;
margin-right: 5px;
}
.fa-otros-articulos-articulo a {
text-decoration: none;
}
.fa-seccion-titulo {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-seccion-titulo-naranja {
background-color: #db702a;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
.fa-seccion-cuerpo {
padding: 5px;
}
.fa-seccion-medio {
width: 470px;
}
.fa-seccion-titulo-medio {
background-color: #999999;
font-weight: bold;
font-size: 1.2em;
color: #fff;
padding: 5px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
}
/* INICIO ESTILO MODAL POPUP */
/* Z-index of #mask must lower than #boxes .window */
#mask {
position: absolute;
z-index: 9000;
background-color: #000;
display: none;
}
#boxes .window {
position: fixed;
width: 440px;
height: 200px;
display: none;
z-index: 9999;
padding: 20px;
}
.tallasProducto:empty {
display: none !important;
}
/* Customize your modal window here, you can add background image too */
#boxes #dialog {
/* border: 1px solid #333333;
background-color: #fff;
border-radius:5px; 
-moz-border-radius:5px; Firefox 
-webkit-border-radius:5px; Safari y Chrome */
}
#boxes #dialog a {
text-decoration: none;
font-size: 1.4em;
}
/* FIN ESTILO MODAL POPUP */
#dialog #nombre {
width: 330px;
}
#dialog #email {
width: 330px;
}
#error-dialog {
color: #d40000;
}
#error-dialog-nombre {
color: #d40000;
}
#error-dialog-email {
color: #d40000;
}
#error-comment-stars {
color: #d40000;
}
#error-comment-name {
color: #d40000;
}
#error-comment-comentario {
color: #d40000;
}
#error-comment {
color: #d40000;
}
#error-comment-politica {
color: #d40000;
margin-top: 30px;
}
#contenido-dialog-ok {
color: green;
font-size: 1.5em;
}
.fa-disponible {
display: inline-flex;
align-items: center;
gap: 6px;
color: #1ca21c;
font-weight: 700;
font-size: 14px;
margin-top: 4px;
}
.fa-disponible .glyphicon {
color: #1ca21c;
}
.fa-no-disponible {
margin-bottom: 10px;
margin-left: 20px;
color: #d40000;
}
.fa-comentarios-boton {
border: 1px solid #dddddd;
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
padding: 10px;
width: 200px;
font-size: 1.5em;
/*background-color: #db702a;*/
background-color: #999999;
}
.fa-comentarios-boton a {
text-decoration: none;
color: #ffffff;
}
.fa-comentarios-boton a:hover {
color: #dddddd;
}
#star1,
#star2,
#star3,
#star4,
#star5 {
width: 18px;
height: 16px;
}
.commentStar {
width: 18px;
height: 16px;
}
.stars {
margin-bottom: 10px;
}
.fa-comentarios {
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
margin-bottom: 10px;
}
.fa-comentariosModeracion {
border-radius: 5px;
-moz-border-radius: 5px;
/* Firefox */
-webkit-border-radius: 5px;
/* Safari y Chrome */
padding: 10px;
margin-top: 10px;
}
#mensaje-cookies {
background-color: #666666;
color: #dddddd;
}
.buttoncookies,
.buttoncookies:visited {
display: inline-block;
padding: 5px 10px 6px;
color: #fff;
text-decoration: none;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
border-bottom: 1px solid rgba(0, 0, 0, 0.25);
position: relative;
cursor: pointer;
}
.buttoncookies:hover {
background-color: #111;
color: #fff;
}
.buttoncookies:active {
top: 1px;
}
.buttoncookies,
.buttoncookies:visited {
font-size: 14px;
font-weight: bold;
line-height: 1;
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
}
.orange.buttoncookies,
.orange.buttoncookies:visited {
background-color: #fb6a12;
width: 60px;
text-align: center;
padding: 8px 14px 9px;
}
.orange.buttoncookies:hover {
background-color: #d45500;
}
.gray.buttoncookies,
.gray.buttoncookies:visited {
background-color: #cccccc;
width: 60px;
text-align: center;
padding: 2px 14px 2px;
}
.gray.buttoncookies:hover {
background-color: #aaaaaa;
}
.comentariosVerificadosFichaArticulo {
margin-bottom: auto;
margin-left: auto;
margin-right: auto;
margin-top: auto;
width: 100%;
}
a.morelink {
text-decoration: none;
outline: none;
}
.morecontent span {
display: none;
}
.inputCantidad {
font-size: 18px;
text-align: center;
}
.contenedorCantidad {
display: flex;
align-items: center;
gap: 10px;
margin: 14px 0;
}
.labelCantidad {
font-size: 16px;
margin: 0;
white-space: nowrap;
font-weight: 600;
color: #555;
}
.contenedorClickAndCollect {
color: #0070bf;
font-weight: bold;
margin-bottom: 20px;
}
.contenedorClickAndCollect a {
color: #de6c24;
text-decoration: none;
}
.contenedorClickAndCollect a:hover {
color: #343d7a;
}
/* .ofertaFichaArticulo{
height: 35px;
color: #d40000;
font-size: 1.4em;
font-weight: bold;
margin-bottom: -13px;
text-align: center;
} */
.logoOfertaFichaArticulo {
/* float:left; */
/* height: 67px; */
}
.fb-like {
margin-top: 10px;
}
.listaArticulosFoto {
width: 100%;
}
.listaComplementosArticulo {
width: 100%;
}
span.portesGratis {
font-size: inherit;
color: red;
font-weight: bold;
}
.col-xs-6.imagenOfertaPopUp {
position: absolute;
text-align: initial;
}
.banerOferta {
z-index: 999;
}
.enlaceYoutube {
-webkit-transition: all 500ms ease-out;
-moz-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}
a.enlaceYoutube:hover {
font-size: 125%;
text-decoration: none;
color: #ff0000 !important;
}
/* NUEVO FICHA ARTICULO */
.product-text-left {
font-size: initial;
}
.botonComprarFichaProducto {
height: 48px;
border-radius: 10px;
padding: 0 20px;
background-color: #fb6a12;
border: none;
font-size: 16px;
font-weight: 500;
box-shadow: 0 3px 10px rgba(251, 106, 18, 0.28);
transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group {
margin-left: 0px;
margin-top: -1px;
}
.bootstrap-touchspin-up {
padding: 11px;
}
/* Botones +/- del contador (TouchSpin) restilizados más abajo, en el bloque dedicado */
.btn-default:focus,
.btn-default:hover {
background-position: 0;
}
.reviewsProducto {}
.textoChequeRegalo {
color: #d40000;
font-weight: bold;
font-size: large;
white-space: nowrap;
}
.separadorImagenDesktop {
clear: both;
margin-bottom: 75%;
}
.fa-pagamastarde {
min-height: 107px;
}
/* FECHA POR IDIOMA */
.fechaProducto_es {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_es.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_pt {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_pt.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_it {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_it.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_fr {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_fr.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_be {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_be.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_lu {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_lu.alert.alert-light {
text-align: center;
font-size: initial;
}
.fechaProducto_de {
font-size: initial;
margin-bottom: 5px;
}
.fechaProducto_de.alert.alert-light {
text-align: center;
font-size: initial;
}
/* PARA EL PROY-J-WEB */
.col-xs-12.imagen {
text-align: center;
}
.col-xs-12.nombre {
text-align: center;
font-size: initial;
font-weight: bold;
margin-top: 3px;
}
.col-xs-6.precioAntiguo {
text-align: center;
color: currentcolor;
font-size: large;
}
.col-xs-6.precioConDescuento {
text-align: center;
color: #1ca21c;
font-weight: bold;
font-size: x-large;
}
.col-xs-12.precioConDescuento {
text-align: center;
color: #1ca21c;
font-weight: bold;
font-size: x-large;
}
.col-xs-12.precio {
text-align: center;
font-size: x-large;
color: #0090d8;
}
.col-xs-12.imagenOfertaPopUp {
text-align: center;
}
.col-md-6.seguir-comprando>button.btn.btn-info {
padding: 7px;
font-size: initial;
margin-bottom: 5px;
}
.col-md-6.ir-a-cesta>a.btn.btn-warning {
padding: 7px;
font-size: initial;
color: white;
font-weight: bold;
}
div#fila15cp {
font-size: large !important;
font-weight: bold;
color: coral;
margin-left: 135px;
/* text-align: center !IMPORTANT; */
}
.col-xs-12.precioAntiguoSinTachar {
text-align: center;
font-size: x-large;
color: #0090d8;
}
.col-xs-12.textoSeungaUnidad {
text-align: center;
}
.col-xs-12.textoChequeRegalo {
text-align: center;
}
/* CARRUSEL */
.fotos .carousel-control-prev-icon {
opacity: 0.7;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23956398' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}
.fotos .carousel-control-next-icon {
opacity: 0.7;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23956398' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}
.fa-media-img .fotos .carousel-control-prev-icon {
width: 33px;
height: 33px;
}
.fa-media-img .fotos .carousel-control-next-icon {
width: 33px;
height: 33px;
}
.contenedorFotos .fotos .carousel-control-prev-icon {
width: 20px;
height: 20px;
}
.contenedorFotos .fotos .carousel-control-next-icon {
width: 20px;
height: 20px;
}
.carouselFotos .carousel-item.item {
transition-duration: 0.2s;
transition-property: right, opacity !important;
}
.carousel-item.active:not(.next):not(.prev) {
right: 0;
}
.carousel-item:not(.active):not(.left):not(.right) {
opacity: 0;
transition: none;
}
.carouselFotos {
overflow: hidden;
display: inline-block !important;
}
.carousel-item.item.next {
right: -120%;
}
.carousel-item.item.prev {
right: 120%;
}
.carousel-item.item.left:not(.next) {
right: 120%;
}
.carousel-item.item.right:not(.prev) {
right: -120%;
}
.imagenFichaProductoGeneral {
max-width: 800px;
}
body.zoomPopup>*:not(.zoomPopup-cloned):not(.botonComprarFichaProducto) {
display: none !important;
}
/* =========================================================
PESTAÑAS DE LA FICHA (Descripción / Comentarios / etc.)
========================================================= */
#pills-tab {
display: flex;
flex-wrap: wrap;
gap: 8px;
border-bottom: 2px solid #f0f2f4;
padding-bottom: 0;
margin-bottom: 20px !important;
}
#pills-tab .nav-link {
color: #667 !important;
font-weight: 600 !important;
font-size: 14px;
padding: 10px 18px !important;
border-radius: 10px 10px 0 0;
background: transparent;
border: none;
transition: background 0.15s ease, color 0.15s ease;
position: relative;
}
/* Pestaña activa: azul con línea inferior destacada */
#pills-tab .nav-link.active {
color: #0090d8 !important;
background: #eef7fc;
}
#pills-tab .nav-link.active::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: -2px;
height: 2px;
background: #0090d8;
border-radius: 2px;
}
/* Hover en las no activas */
#pills-tab .nav-link:not(.active):hover {
background: #f5f6f8;
color: #0090d8 !important;
}
/* Contenido de las pestañas: un poco de aire arriba */
#pills-tabContent {
padding-top: 4px;
}
/* .nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
color: #fff !important;
background-color: #0090d8 !important;
font-weight: bold !important;
}
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
color: #fff !important;
background-color: #0090d8 !important;
font-weight: bold !important;
}
.nav>li>a:focus,
.nav>li>a:hover {
text-decoration: none;
background-color: #fb6a12;
color: #fff !important;
} */
body {
background-color: #fafafa;
}
.heartboxHeart {}
.checkboxHeart+label svg {
cursor: pointer;
overflow: visible;
width: 60px;
}
svg #heart {
transform-origin: center;
animation: animateHeartOut 0.3s linear forwards;
}
svg #main-circ {
transform-origin: 29.5px 29.5px;
}
.checkboxHeart {
display: none;
}
.checkboxHeart:checked+label svg #heart {
transform: scale(0.2);
fill: #e2264d;
animation: animateHeart 0.3s linear forwards 0.25s;
}
.checkboxHeart:checked+label svg #main-circ {
transition: all 2s;
animation: animateCircle 0.3s linear forwards;
opacity: 1;
}
.checkboxHeart:checked+label svg #heartgroup1 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup1 #heart1 {
transform: scale(0) translate(0, -30px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup1 #heart2 {
transform: scale(0) translate(10px, -50px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup2 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup2 #heart1 {
transform: scale(0) translate(30px, -15px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup2 #heart2 {
transform: scale(0) translate(60px, -15px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup3 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup3 #heart1 {
transform: scale(0) translate(30px, 0px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup3 #heart2 {
transform: scale(0) translate(60px, 10px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup4 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup4 #heart1 {
transform: scale(0) translate(30px, 15px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup4 #heart2 {
transform: scale(0) translate(40px, 50px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup5 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup5 #heart1 {
transform: scale(0) translate(-10px, 20px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup5 #heart2 {
transform: scale(0) translate(-60px, 30px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup6 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup6 #heart1 {
transform: scale(0) translate(-30px, 0px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup6 #heart2 {
transform: scale(0) translate(-60px, -5px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup7 {
opacity: 1;
transition: 0.1s all 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup7 #heart1 {
transform: scale(0) translate(-30px, -15px);
transform-origin: 0 0 0;
transition: 0.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup7 #heart2 {
transform: scale(0) translate(-55px, -30px);
transform-origin: 0 0 0;
transition: 1.5s transform 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup2 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup3 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup4 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup5 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup6 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
.checkboxHeart:checked+label svg #heartgroup7 {
opacity: 1;
transition: 0.1s opacity 0.3s;
}
@keyframes animateCircle {
40% {
transform: scale(10);
opacity: 1;
fill: #dd4688;
}
55% {
transform: scale(11);
opacity: 1;
fill: #d46abf;
}
65% {
transform: scale(12);
opacity: 1;
fill: #cc8ef5;
}
75% {
transform: scale(13);
opacity: 1;
fill: transparent;
stroke: #cc8ef5;
stroke-width: 0.5;
}
85% {
transform: scale(17);
opacity: 1;
fill: transparent;
stroke: #cc8ef5;
stroke-width: 0.2;
}
95% {
transform: scale(18);
opacity: 1;
fill: transparent;
stroke: #cc8ef5;
stroke-width: 0.1;
}
100% {
transform: scale(19);
opacity: 1;
fill: transparent;
stroke: #cc8ef5;
stroke-width: 0;
}
}
@keyframes animateHeart {
0% {
transform: scale(0.2);
}
40% {
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
@keyframes animateHeartOut {
0% {
transform: scale(1.4);
}
100% {
transform: scale(1);
}
}
/* El botón flota fijo abajo SOLO en pantallas <=991px (ver bloque de media queries al final) */
.mfp-figure button.mfp-close {
background-color: rgba(100, 100, 100, 0.5);
width: 1em;
margin-right: 8px;
text-align: center;
padding-right: 0;
}
#popup {
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 1001;
}
.content-popup {
margin: 0px auto;
margin-top: 120px;
position: relative;
padding: 10px;
width: 500px;
min-height: 100px;
border-radius: 4px;
background-color: #ffffff;
box-shadow: 0 2px 5px #666666;
border: 1px solide #0090d8;
}
.content-popup h2 {
color: #48484b;
margin-top: 30px;
padding-bottom: 4px;
text-align: center;
}
.popup-overlay {
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 999;
display: none;
background-color: #777777;
cursor: pointer;
opacity: 0.7;
}
.close {
position: absolute;
right: 15px;
font-size: large;
}
.btn-default {
text-shadow: 0 1px 0 #fff;
background-repeat: repeat-x;
border-color: #ccc !important;
}
th.sticky-column {
position: sticky;
left: -2px;
z-index: 1;
background-color: white;
min-width: 135px;
padding: 20px !important;
}
td.sticky-column {
padding: 20px !important;
}
.col-sm-12.col-md-12.col-lg-4.col-xl-4.info-product {
justify-content: space-between;
border-bottom: 1px solid #d3d3d3;
margin-bottom: 10px;
line-height: 25px;
font-size: 12px;
color: #4e4949;
}
/* REGLAS ESPECIALES */
.cn_content+div>a {
color: black ! important;
}
.modal-body.modal-comprar {
min-height: 400px ! important;
max-height: 100% ! important;
}
.carritoLP {
text-align: center;
position: absolute;
width: 100%;
margin-top: 20px;
opacity: 0;
transition: opacity 1s;
}
h1,
h2,
h3 {
font-family: 'Baloo Bhaina 2', cursive;
}
p,
span,
a,
b {
font-family: 'Baloo Bhaina 2', cursive;
}
.search-izq {
font-family: 'Baloo Bhaina 2', cursive;
}
.breadscrumb {
font-family: 'Baloo Bhaina 2', cursive;
}
.txtArticulo {
font-family: 'Baloo Bhaina 2', cursive;
}
.fa-boton-comprar.fa-boton-comprar-pagamastarde {
font-family: 'Baloo Bhaina 2', cursive;
}
.fa-disponible {
font-family: 'Baloo Bhaina 2', cursive;
}
a.cn_v3_dynamic_element_button {
font-family: 'Baloo Bhaina 2', cursive;
}
.input-group.bootstrap-touchspin {
flex-wrap: nowrap;
}
.social-share a {
display: inline-block;
width: 30px;
/* Ancho y alto iguales para que sea un círculo perfecto */
height: 30px;
border-radius: 50%;
/* Hace que el botón sea redondo */
margin-right: 10px;
text-align: center;
line-height: 33px;
/* Centra el ícono verticalmente */
transition: background-color 0.3s ease;
}
.btn-facebook {
background-color: #4267B2;
}
.btn-facebook:hover {
background-color: #365899;
}
.btn-twitter {
background-color: #1DA1F2;
}
.btn-twitter:hover {
background-color: #0d95e8;
}
.btn-whatsapp {
background-color: #25D366;
}
.btn-whatsapp:hover {
background-color: #1ebd5b;
}
.suscripciones {
border: 0px;
}
/* =========================================================
BOTÓN COMPRAR — flotante controlado en móvil/tablet
(único bloque que decide la posición, sin huecos)
========================================================= */
.botonComprarFichaProducto:hover {
background-color: #0090d8;
transform: translateY(-1px);
box-shadow: 0 5px 14px rgba(0, 144, 216, 0.28);
}
/* =========================================================
SUMADOR − [n] + DE LA FICHA
========================================================= */
.fichaCantidad {
display: inline-flex;
align-items: stretch;
border: 1px solid #DADADA;
border-radius: 8px;
overflow: hidden;
vertical-align: middle;
}
.fichaCantidad__btn {
width: 36px;
height: 44px;
background: #f5f5f5;
border: none;
color: #333;
font-size: 18px;
line-height: 1;
cursor: pointer;
transition: background 0.15s ease;
}
.fichaCantidad__btn:hover {
background: #e9e9e9;
}
.fichaCantidad .inputCantidad {
width: 46px !important;
height: 44px;
text-align: center;
border: none !important;
border-left: 1px solid #DADADA !important;
border-right: 1px solid #DADADA !important;
border-radius: 0 !important;
font-size: 16px;
float: none !important;
-moz-appearance: textfield;
}
.fichaCantidad .inputCantidad::-webkit-outer-spin-button,
.fichaCantidad .inputCantidad::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* Contador dentro del TouchSpin (si se usa en vez de los botones manuales) */
.contenedorCantidad .bootstrap-touchspin {
display: inline-flex !important;
align-items: stretch;
width: auto !important;
border: 1px solid #DADADA;
border-radius: 8px;
overflow: hidden;
}
.contenedorCantidad .input-group-btn {
display: inline-flex !important;
width: auto !important;
}
.contenedorCantidad .bootstrap-touchspin-up,
.contenedorCantidad .bootstrap-touchspin-down,
button.btn.btn-default.bootstrap-touchspin-up,
button.btn.btn-default.bootstrap-touchspin-down {
margin: 0 !important;
padding: 0 !important;
width: 40px !important;
height: 44px;
background-image: none !important;
background: #f5f5f5 !important;
color: #333 !important;
border: none !important;
border-radius: 0 !important;
font-size: 20px !important;
box-shadow: none !important;
}
.contenedorCantidad .bootstrap-touchspin-up:hover,
.contenedorCantidad .bootstrap-touchspin-down:hover {
background: #e9e9e9 !important;
}
.contenedorCantidad .inputCantidad {
width: 50px !important;
height: 44px !important;
text-align: center;
border: none !important;
border-left: 1px solid #DADADA !important;
border-right: 1px solid #DADADA !important;
border-radius: 0 !important;
float: none !important;
font-size: 16px !important;
}
/* =========================================================
PRECIO — ahorro, tachado, oferta, cheque regalo
========================================================= */
.fa-precio-ahorro {
display: inline-block;
background: #eafaf0;
color: #0090d8 !important;
font-size: 13px !important;
font-weight: 700 !important;
padding: 3px 10px;
border-radius: 8px;
white-space: nowrap;
}
.precioAnteriorB {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
margin-bottom: 8px;
}
.fa-precio-tipo-oferta.chequeRegalo {
background: #eafaf0;
color: #07800f;
}
.fa-precio-tipo-oferta span[style*="d40000"] {
color: #d15600 !important;
}
.ofertaFichaArticulo {
display: inline-block;
background: #fff3e9;
color: #d15600;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
padding: 4px 12px;
border-radius: 20px;
margin-bottom: 8px;
}
/* =========================================================
DATOS DEL PRODUCTO (SKU, marca, edad, envío, fecha, financiación)
========================================================= */
#info-producto {
flex-wrap: wrap !important;
white-space: normal !important;
font-size: 12px !important;
gap: 8px !important;
margin: 10px 0 !important;
}
#info-producto>div {
background: #f5f6f8;
padding: 4px 10px;
border-radius: 6px;
color: #667;
}
.marcaProducto,
.edadProducto,
.envioGratisProducto,
.financiacionProducto,
[class^="fechaProducto"],
[class*=" fechaProducto"],
.recogidaTiendaProducto,
.tallasProducto {
font-size: 14px !important;
padding: 4px 0;
color: #3a4550;
line-height: 1.4;
margin-bottom: 0 !important;
}
.marcaProducto b,
.edadProducto b,
.envioGratisProducto b,
.financiacionProducto>b,
[class^="fechaProducto"] b,
[class*=" fechaProducto"] b,
.recogidaTiendaProducto b,
.tallasProducto b {
color: #1a2530;
font-weight: 600;
margin-right: 4px;
}
.marcaProducto a span {
color: #0090d8 !important;
font-weight: 600 !important;
font-size: 14px !important;
}
.envioGratisProducto span[style*="green"] {
color: #07800f !important;
font-weight: 700;
background: #eafaf0;
padding: 2px 10px;
border-radius: 12px;
font-size: 13px;
}
[class^="fechaProducto"] span[style*="green"],
[class*=" fechaProducto"] span[style*="green"] {
color: #07800f !important;
font-weight: 700;
text-transform: uppercase;
}
[class^="fechaProducto"].alert,
[class*=" fechaProducto"].alert {
border-bottom: none;
}
.recogidaTiendaProducto img {
height: 22px;
width: auto;
vertical-align: middle;
margin-left: 4px;
}
/* Financiación (Aplazame) */
a.financiacionProducto {
display: inline-flex !important;
align-items: center;
gap: 8px;
flex-wrap: wrap;
width: auto !important;
margin-top: 0 !important;
white-space: normal !important;
border-bottom: none;
padding: 0 !important;
text-decoration: none !important;
color: #3a4550;
cursor: pointer;
}
a.financiacionProducto br {
display: none;
}
a.financiacionProducto svg {
vertical-align: middle;
}
.financiacionProducto .financiacion {
color: #3a4550 !important;
font-size: 14px !important;
}
.financiacionProducto span[style*="fb6a12"] {
color: #fb6a12 !important;
font-weight: 700;
font-size: 14px !important;
}
/* =========================================================
VALORACIÓN CON ESTRELLAS
========================================================= */
.comentariosFichaProductoTitulo {
width: 100%;
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.comentariosFichaProductoTitulo picture,
.comentariosFichaProductoTitulo img.imagenEstrellasItemArticulo {
float: none !important;
display: block;
}
.imagenEstrellasItemArticulo {
height: 18px;
width: auto;
}
.valoracionTexto {
display: flex;
align-items: center;
gap: 8px;
float: none !important;
margin: 0 !important;
font-size: 14px;
}
.valoracionNota {
font-weight: 700;
color: #1a2530;
}
.valoracionSobre {
color: #99a;
font-weight: 400;
}
.valoracionLink {
color: #0090d8;
text-decoration: none;
font-weight: 600;
}
.valoracionLink:hover {
text-decoration: underline;
}
/* =========================================================
VENTAJAS + MÉTODOS DE PAGO + SOCIAL SHARE
========================================================= */
.articulo-card-ventajas {
border: none;
background: #f8faf9;
border-radius: 16px;
padding: 8px 20px;
margin: 8px auto 1.2rem;
max-width: 520px;
}
.ventajas-list {
list-style: none;
padding: 0;
margin: 0;
}
.ventaja-item {
display: flex;
align-items: center;
gap: 12px;
padding: 12px 0;
}
.ventaja-item+.ventaja-item {
border-top: 1px solid #eaefec;
}
.ventaja-icon {
flex-shrink: 0;
display: inline-flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
}
.ventaja-icon img {
width: 100%;
height: auto;
max-height: 30px;
object-fit: contain;
display: block;
}
.ventaja-label {
font-size: 14px;
color: #3a4550;
font-weight: 500;
line-height: 1.3;
}
.metodos-pago {
display: flex;
align-items: center;
justify-content: center;
border-top: 1px solid #eaefec;
margin-top: 8px;
padding-top: 14px;
}
.metodos-pago img {
height: 32px;
width: auto;
max-width: 95%;
object-fit: contain;
display: block;
opacity: 0.9;
margin: 0 auto;
}
.social-share {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
max-width: 520px;
margin: 0 auto 18px;
width: 100%;
}
.social-share__btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
background: #f5f6f8;
color: #666;
transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}
.social-share__btn svg {
width: 20px !important;
height: 20px !important;
overflow: visible;
vertical-align: middle;
}
.social-share__btn:hover {
transform: translateY(-2px);
color: #fff;
}
.social-share__btn--fb:hover {
background: #1877F2;
}
.social-share__btn--x:hover {
background: #000;
}
.social-share__btn--wa:hover {
background: #25D366;
}
.social-share__btn--pin:hover {
background: #E60023;
}
/* =========================================================
REGALO EN LA FICHA
========================================================= */
.regaloProducto {
background: #f7fbf8;
border: none;
border-left: 3px solid #07800f;
border-radius: 10px;
padding: 12px 14px;
margin: 12px 0;
}
.regaloProducto__titulo {
display: flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
color: #07800f;
margin-bottom: 10px;
}
.regaloProducto__titulo i {
font-size: 16px;
}
.regaloProducto__item {
display: flex;
align-items: center;
gap: 12px;
padding: 8px 0;
}
.regaloProducto__item+.regaloProducto__item {
border-top: 1px solid #e3efe7;
}
.regaloProducto__img {
flex-shrink: 0;
width: 60px;
}
.regaloProducto__img img {
width: 100%;
height: auto;
border-radius: 8px;
display: block;
}
.regaloProducto__info {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 4px;
}
.regaloProducto__nombre {
font-size: 14px;
font-weight: 600;
color: #0090d8;
text-decoration: none;
line-height: 1.3;
}
.regaloProducto__nombre:hover {
text-decoration: underline;
}
.regaloProducto__precio {
display: flex;
align-items: center;
gap: 8px;
}
.regaloProducto__tachado {
font-size: 13px;
color: #DE6B1C;
text-decoration: line-through;
}
.regaloProducto__gratis {
font-size: 15px;
font-weight: 700;
color: #07800f;
}
/* =========================================================
BADGES DE PROMO (esquina superior de la imagen)
========================================================= */
.promo-badge {
position: absolute;
left: 0;
top: 18px;
z-index: 10;
display: flex;
align-items: center;
text-decoration: none;
}
.promo-badge__barra {
display: inline-block;
width: 5px;
height: 26px;
border-radius: 4px 0 0 4px;
}
.promo-badge__texto {
background: #fff;
font-size: 13px;
font-weight: 700;
padding: 5px 18px 5px 10px;
border-radius: 0 16px 16px 0;
letter-spacing: 1px;
box-shadow: 0 2px 10px -5px rgba(0, 0, 0, 0.35);
text-transform: uppercase;
white-space: nowrap;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.promo-badge:hover .promo-badge__texto {
transform: translateX(2px);
box-shadow: 0 3px 12px -4px rgba(0, 0, 0, 0.4);
}
.promo-badge--azul .promo-badge__barra {
background: #0090d8;
}
.promo-badge--azul .promo-badge__texto {
color: #0090d8;
}
.promo-badge--rojo .promo-badge__barra {
background: #e53935;
}
.promo-badge--rojo .promo-badge__texto {
color: #e53935;
}
.promo-badge--cole .promo-badge__barra {
background: #e63946;
}
.promo-badge--cole .promo-badge__texto {
color: #e63946;
}
.promo-badge--verde .promo-badge__barra {
background: #07800f;
}
.promo-badge--verde .promo-badge__texto {
color: #07800f;
}
.promo-badge--naranja .promo-badge__barra {
background: #fb6a12;
}
.promo-badge--naranja .promo-badge__texto {
color: #d15600;
}
/* =========================================================
TÍTULO Y GALERÍA — toque moderno
========================================================= */
.nombreProducto {
font-size: 24px;
font-weight: 600;
line-height: 1.3;
color: #1a2530;
margin: 0 0 6px;
}
.nombreProducto b {
font-weight: 600;
}
.info-product hr {
border: none;
border-top: 1px solid #eef1f4;
margin: 16px 0;
}
.fa-media-img img,
.fa-media-carrusel img {
border-radius: 14px;
}
.contenedorFotos img {
border-radius: 8px;
border: 1px solid #eef1f4;
transition: border-color 0.15s ease, transform 0.1s ease;
cursor: pointer;
}
.contenedorFotos img:hover {
border-color: #fb6a12;
transform: translateY(-2px);
}
.info-product .alert-light {
border: 1px solid #ffe0c2 !important;
background: #fff8f2 !important;
border-radius: 10px !important;
padding: 8px 12px !important;
}
.info-product .alert-light a {
color: #d15600 !important;
font-weight: 600;
}
/* Overlay mejorado que aparece encima del contenedorBotonesPieMovil */
.overlay-precio {
position: fixed;
bottom: 93px;
/* justo encima del contenedorBotonesPieMovil */
left: 0;
right: 0;
background: white;
border-top: 1px solid #e0e6ed;
/* padding: 12px 16px;
box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1); */
z-index: 999;
/* por debajo del contenedorBotonesPieMovil pero visible */
display: none;
animation: slideUp 0.3s ease-out;
}
@keyframes slideUp {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.overlay-precio.visible {
display: block;
font-size: smaller;
}
/* Ocultar el "Disponible" en el overlay */
.overlay-precio .fa-disponible {
display: none;
}
.contenedorBotonesPieMovil {
z-index: 280;
}
.overlay-precio .textoChequeRegalo {
color: #0090d8 !important;
}
.overlay-precio .fa-precio-grande {
color: black;
}
.overlay-precio .fa-currency {
color: black;
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 319px
Condicion real: @media only screen and (max-width: 319px)
========================================================= */
@media only screen and (max-width: 319px) {
img.product-images-left-mas-vistas {
width: 180%;
height: auto;
max-width: 60px;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 320px
Condicion real: @media only screen and (max-width: 320px)
========================================================= */
@media only screen and (max-width: 320px) {
.contenedorFotos {
margin-left: -3px;
}
.fotos.carousel-control-prev {
left: -15px;
width: auto;
}
.fotos.carousel-control-next {
right: -30px;
width: auto;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 400px
Condicion real: @media (max-width: 400px)
========================================================= */
@media (max-width: 400px) {
.mfp-figure button.mfp-close {
margin-right: 10px;
width: 37px;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 420px
Condicion real: @media (max-width: 420px)
========================================================= */
@media (max-width: 420px) {
header.cabecera-movil-atida {
height: 56px;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 500px
Condicion real: @media (max-width: 500px)
========================================================= */
@media (max-width: 500px) {
.mfp-figure button.mfp-close {
margin-right: 2px;
margin-top: 50px;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 575px
Condicion real: @media only screen and (max-width: 575px)
========================================================= */
@media only screen and (max-width: 575px) {
.col-xs-12.col-sm-8.col-md-7.col-lg-7.col-xl-12.txtArticulo {
width: 118%;
margin-left: -30px;
border-bottom: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
margin-top: 15px;
}
.separadorEspecial {
border-bottom: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
margin-top: 15px;
}
h1.nombreProducto {
width: 118%;
margin-left: -30px;
}
.infoPvp {
border-bottom: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
text-align: center;
}
.precioAnteriorB {
display: block !important;
}
}
/* =========================================================
BLOQUE: MÓVIL — pantallas hasta 600px
Condicion real: @media only screen and (max-width: 600px)
========================================================= */
@media only screen and (max-width: 600px) {
.banerOferta {
position: initial;
z-index: 999;
}
.fa-boton-comprar {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 300;
background: #fff;
padding: 10px 14px;
box-shadow: 0 -4px 14px rgba(0, 0, 0, 0.12);
display: flex;
align-items: center;
gap: 10px;
}
.divYoutube {
text-align: center;
font-size: large;
}
.fa-titulo-marca {
display: block;
}
.fa-titulo-marca img {
width: 50px;
height: auto;
}
.content-popup {
width: 313px;
}
.fa-otros-articulos-largo {
margin-bottom: -10px;
}
img.popImg {
width: 45%;
}
.col-md-6.col-md-offset-1.nombre {
font-size: 0.7em;
font-style: oblique;
font-weight: bold;
}
.col-md-12.carritoSmallDialog {
font-size: 0.8em;
}
.col-md-6.col-md-offset-1.nombre.fabricante {
display: none;
}
.col-xs-12.carritoSmallDialog {
font-size: large;
text-align: center;
}
.col-xs-12.importeTotal {
font-size: initial;
text-align: center;
}
.col-xs-12.portes {
font-size: initial;
text-align: center;
}
.col-xs-12.portesBaleares {
font-size: initial;
text-align: center;
}
.imgFichaArticulo {
width: 100%;
height: auto;
}
}
/* =========================================================
BLOQUE: MÓVIL + TABLET — pantallas hasta 991px (sin mínimo: incluye también el móvil)
Condicion real: @media (max-width: 991px)
(Este archivo tenia 2 bloques @media distintos con exactamente
esta misma condicion; se han juntado en uno solo sin cambiar nada)
========================================================= */
@media (max-width: 991px) {
#pills-tab {
gap: 1px;
}
.fa-boton-comprar {
padding-top: 0 !important;
margin-bottom: 2%;
left: 0;
right: 0;
bottom: 0;
z-index: 300;
background: #fff;
padding: 10px 14px;
align-items: center;
gap: 10px;
}
.botonComprarFichaProducto {
flex: 1;
min-width: 0;
height: 48px;
font-size: 15px;
}
/* deja hueco al final de la página para que el botón fijo no tape contenido */
#info-producto,
.txtArticulo {
padding-bottom: 5px;
}
.labelCantidad {
font-size: 12px;
}
.botonComprarFichaProducto {
margin-top: 1px;
}
}
/* =========================================================
BLOQUE: CASO ESPECIAL (dispositivo/orientación concretos)
Condicion real: @media (max-width: 1024px) and (orientation: landscape)
========================================================= */
@media (max-width: 1024px) and (orientation: landscape) {
.breadscrumb {
font-size: inherit;
}
.product-images-left {
display: inline-flex;
text-align: center;
}
.imagenFichaProductoGeneral {
width: 100%;
}
.product-images-marcas-left.sibling-fade {
text-align: center;
}
h1.nombreProducto {
text-align: center;
}
.row.carruselArticulosFichaArticulos {
margin-left: -15px !important;
margin-right: -15px !important;
}
}
/* =========================================================
BLOQUE: MÓVIL + TABLET + PARTE DE ESCRITORIO — pantallas hasta 1200px
Condicion real: @media only screen and (max-width: 1200px)
========================================================= */
@media only screen and (max-width: 1200px) {
.contenedorFotos {
margin-left: 0px;
}
.fotos.carousel-control-prev {
left: -5px;
width: auto;
}
.fotos.carousel-control-next {
right: -15px;
width: auto;
}
}
/* =========================================================
BLOQUE: CASO ESPECIAL (dispositivo/orientación concretos)
Condicion real: @media only screen and (max-device-width: 480px)
========================================================= */
@media only screen and (max-device-width: 480px) {
input.searchNavigation {
font-size: 14px;
}
}
/* =========================================================
BLOQUE: MÓVIL — rango 320px a 767px
Condicion real: @media only screen and (min-width: 320px) and (max-width: 767px)
(Este archivo tenia 2 bloques @media distintos con exactamente
esta misma condicion; se han juntado en uno solo sin cambiar nada)
========================================================= */
@media only screen and (min-width: 320px) and (max-width: 767px) {
.product-images-left.sibling-fade {
display: inline-flex;
text-align: center;
}
img.product-images-left-mas-vistas {
width: 180%;
height: auto;
max-width: 60px;
}
a.imagenPrincipal {}
.product-images-marcas-left.sibling-fade {
text-align: center;
}
h1.nombreProducto {
font-size: x-large;
text-align: center;
}
.comentariosFichaProductoTitulo {
width: 100%;
/* margin-bottom: 5px; */
white-space: nowrap;
text-align: center;
gap: 0px !important;
flex-wrap: nowrap !important;
/* margin: 8px 0; */
font-size: smaller;
}
.stock {
text-align: center;
margin-bottom: 5px;
}
.fa-precio {
text-align: center;
}
.refProducto {
font-size: initial;
}
a.btn.financiacionProducto {}
.fa-precio-grande {
font-size: xxx-large;
}
.fa-currency {
font-size: x-large;
}
.fa-disponible {
text-align: center;
}
.edadProducto {
font-size: initial;
}
.tallasProducto {
font-size: initial;
}
.regaloProducto {
font-size: large;
}
.fechaProducto_es {
font-size: initial !important;
}
.marcaProducto {
font-size: initial;
}
a.btn.financiacionProducto {
text-align: center;
font-size: x-small !important;
}
.financiacionProducto {
font-size: initial;
}
a.btn.financiacionProducto img {
display: none;
}
.envioProducto {
font-size: large;
}
.envioGratisProducto {
font-size: initial;
}
.entregaDomicilioProducto {
font-size: large;
}
.recogidaTiendaProducto {
font-size: initial;
}
.eligeModeloProducto {
font-size: large;
}
.modeloProducto {
font-size: small;
}
.contenedorClickAndCollect.contenedorEscritorio {
text-align: center;
font-size: small;
}
.ofertaFichaArticulo {
color: #d40000;
font-size: initial;
font-weight: bold;
text-align: center;
margin-bottom: 5px;
}
.fa-precio-pequeno-tachado {
font-size: initial !important;
}
.fa-precio-ahorro {
font-size: initial !important;
margin-left: 5px;
color: #0090d8 !important;
background: #eafaf0;
padding: 3px 10px;
border-radius: 8px;
display: inline-block;
font-weight: 700;
}
span.IVA {
font-size: large;
font-weight: bold;
color: #0090d8;
text-align: center !important;
}
span.popUpIVA {
font-size: large;
font-weight: bold;
color: #fb6a12;
text-align: center !important;
}
.cn_articulosComplemento_articulo {
width: 50%;
float: left;
margin-top: 15px !important;
}
img.img_cn_articulosComplemento_articulo {
width: 70%;
}
.nombre_cn_articulosComplemento_articulo {
font-size: 15px !important;
height: 4.5em !important;
}
span.precio-normal-complementos {
font-size: 11px !important;
}
h2.h1.products-section-title.text-uppercase.home_secttion_title {
font-size: 17px;
}
a.boton_cn_articulosComplemento_articulo.cn_v2_dynamic_element_button>span {
font-size: 15px;
}
a.boton_cn_articulosComplemento_articulo.cn_v2_dynamic_element_button {
max-width: 96% !important;
padding: 12px 9px !important;
margin-top: 3px !important;
}
img.bannerFichaArticulo {
text-align: center;
margin-top: 5px;
margin-bottom: -18px;
width: 100%;
}
.precioAnteriorB {
text-align: center;
}
.fa-media-img.popup-gallery {
margin-top: 18px;
}
.navbar-fixed-top {
position: fixed !important;
}
.textoChequeRegalo {
text-align: center;
}
.fa-precio-tipo-oferta.chequeRegalo {
text-align: center;
}
.fa-media-carrusel div {
display: inline-flex;
}
button.btn.btn-warning.botonComprarFichaProducto.btn-primary.btn-lg.modeloButton {
display: none;
}
.col-sm-12.contenedorFotos {
max-height: 91px;
}
.fechaProducto_es.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_pt.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_it.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_fr.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_be.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_lu.alert.alert-light {
font-size: small;
text-align: center;
}
.fechaProducto_de.alert.alert-light {
font-size: small;
text-align: center;
}
div#fila15cp {
margin-left: 90px;
}
.overlay-precio .fa-precio {
margin-bottom: -8px !important;
}
.overlay-precio .fa-precio-grande {
font-size: xx-large !important;
}
.overlay-precio .ofertaFichaArticulo {
margin-bottom: -5px !important;
}
.overlay-precio .fa-precio-tipo-oferta.chequeRegalo {
margin-bottom: -8px;
margin-top: 5px;
}
}
/* =========================================================
BLOQUE: AJUSTE DESDE 360px EN ADELANTE (afecta a móviles grandes, tablet y escritorio; sin máximo)
Condicion real: @media (min-width: 360px)
========================================================= */
@media (min-width: 360px) {
.btn-lg {
font-size: 18px !important;
}
}
/* =========================================================
BLOQUE: MÓVIL — rango 500px a 767px
Condicion real: @media only screen and (min-width: 500px) and (max-width: 767px)
========================================================= */
@media only screen and (min-width: 500px) and (max-width: 767px) {
.botonComprarFichaProducto {}
}
/* =========================================================
BLOQUE: AJUSTE DESDE 500px EN ADELANTE (afecta a móviles grandes, tablet y escritorio; sin máximo)
Condicion real: @media (min-width: 500px)
========================================================= */
@media (min-width: 500px) {
.fa-titulo {
text-align: inherit;
}
.fa-pagamastarde {
float: left;
width: 90%;
}
.fa-media {
width: 50%;
}
.fa-media-carrusel {
text-align: inherit;
}
.fa-datos {
width: 50%;
height: 50%;
padding: 5px;
}
.fa-boton-comprar {
float: initial;
text-align: left;
margin-top: 1em;
}
.fa-boton-comprar-pagamastarde {
margin-top: 0;
}
.fa-datos-edad {
text-align: inherit;
}
.fa-datos-compartir {
margin-right: 10px;
}
.fa-datos-compartir-wrap {
margin-left: 0;
width: inherit;
float: left;
}
.fa-datos-compartir-derecha {
float: left;
}
.labelCantidad {
margin: 0;
display: inline-block;
}
.listaComplementosArticulo {
width: 49%;
display: inline-block;
margin-left: 0.5%;
margin-right: 0.5%;
}
}
/* =========================================================
BLOQUE: RANGO MIXTO — 576px a 1199px (cruza tablet/escritorio)
Condicion real: @media only screen and (min-width: 576px) and (max-width: 1199px)
========================================================= */
@media only screen and (min-width: 576px) and (max-width: 1199px) {
h1.nombreProducto {
text-align: center !important;
}
.fa-disponible {
text-align: center !important;
}
.fa-precio-grande {
font-size: xxx-large;
}
.fa-currency {
font-size: xx-large;
}
.ofertaFichaArticulo {
text-align: center !important;
}
.precioAnteriorB {
text-align: center !important;
}
.col-xs-12.col-sm-8.col-md-7.col-lg-7.col-xl-12.txtArticulo {
border-right: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
}
.infoPvp {
border-bottom: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
text-align: center;
}
.separadorEspecial {
border-bottom: 1px solid rgba(0, 0, 0, .1);
margin-bottom: 15px;
margin-left: 30px;
margin-right: 30px;
}
}
/* =========================================================
BLOQUE: AJUSTE DESDE 600px EN ADELANTE (afecta a móviles grandes, tablet y escritorio; sin máximo)
Condicion real: @media only screen and (min-width: 600px)
========================================================= */
@media only screen and (min-width: 600px) {
.col-xs-12.carritoSmallDialog {
font-size: x-large;
}
.col-xs-12.importeTotal {
font-size: large;
}
.col-xs-12.portes {
font-size: large;
}
.col-xs-12.portesBaleares {
font-size: large;
}
}
/* =========================================================
BLOQUE: AJUSTE DESDE 650px EN ADELANTE (afecta a móviles grandes, tablet y escritorio; sin máximo)
Condicion real: @media (min-width: 650px)
========================================================= */
@media (min-width: 650px) {
.comentariosFichaProductoTitulo {
display: block;
}
.fa-titulo-marca {
display: block;
width: 435px;
}
.fa-titulo-titulo {
width: 500px;
display: block;
}
.referenciaFichaProductoTitulo {
position: relative;
right: 10px;
margin-top: 0px;
}
}
/* =========================================================
BLOQUE: TABLET — rango 768px a 1024px
Condicion real: @media only screen and (min-width: 768px) and (max-width: 1024px)
========================================================= */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.product-images-left {
display: inline-grid;
margin-top: 0px !important;
width: 85% !important;
}
.product-images-left .justify-content-center {
padding-left: 5px;
padding-right: 5px;
}
img.product-images-left-mas-vistas {
margin: -5px;
width: 100% !important;
height: auto;
}
.breadscrumb {
font-size: inherit;
}
.product-images-left.sibling-fade.fotosSecundariasProducto {
text-align: center;
}
.imagenFichaProductoGeneral {
width: 100%;
height: auto;
}
.product-images-marcas-left.sibling-fade {
text-align: center;
}
.refProducto {
font-size: large;
}
.fa-disponible {
text-align: center;
}
.fa-precio-grande {
font-size: xxx-large;
}
.fa-currency {
font-size: xx-large;
}
.fa-seccion-precio {
text-align: center;
}
.precioAnteriorB {
text-align: center;
}
.edadProducto {
font-size: large;
}
.regaloProducto {
font-size: large;
}
.marcaProducto {
font-size: large;
}
.financiacionProducto {
font-size: large;
}
.envioProducto {
font-size: large;
}
.envioGratisProducto {
font-size: large;
}
.entregaDomicilioProducto {
font-size: large;
}
.recogidaTiendaProducto {
font-size: large;
}
.eligeModeloProducto {
font-size: large;
}
.contenedorClickAndCollect.contenedorEscritorio {
text-align: center;
font-size: initial;
margin-left: auto;
margin-right: auto;
width: -webkit-min-content;
min-width: 50%;
}
h1.nombreProducto {
text-align: center;
font-size: x-large;
}
.ofertaFichaArticulo {
color: #d40000;
font-size: initial;
font-weight: bold;
text-align: center;
}
.fa-precio-pequeno-tachado {
font-size: initial !important;
}
.fa-precio-ahorro {
font-size: initial !important;
margin-left: 5px;
color: #0090d8 !important;
background: #eafaf0;
padding: 3px 10px;
border-radius: 8px;
display: inline-block;
font-weight: 700;
}
span.IVA {
font-size: large;
font-weight: bold;
color: #0090d8;
text-align: center !important;
}
span.popUpIVA {
font-size: large;
font-weight: bold;
color: #fb6a12;
text-align: center !important;
}
.bannerFichaArticulo {
width: 386px;
}
.fa-media-carrusel div {
display: inline-flex;
}
.row.carruselArticulosFichaArticulos {
display: block;
margin-left: 15px;
margin-right: 15px;
}
button.btn.btn-warning.botonComprarFichaProducto.btn-primary.btn-lg.modeloButton {
width: 134px;
}
.row.comentarioDestacado {
display: block;
font-size: medium;
width: 100%;
margin-bottom: 4% !important;
}
.col-sm-12.contenedorFotos {
max-height: 215px;
}
.divYoutube {
font-size: large;
margin-left: 323px;
}
.input-group.bootstrap-touchspin {
display: flex;
}
.fechaProducto_es {
font-size: large;
}
.fechaProducto_de {
font-size: large;
}
.fechaProducto_it {
font-size: large;
}
.fechaProducto_fr {
font-size: large;
}
.fechaProducto_pt {
font-size: large;
}
.fechaProducto_be {
font-size: large;
}
.fechaProducto_lu {
font-size: large;
}
.float-left.comentariosFichaProductoTitulo {
margin-left: auto;
margin-right: auto;
width: -webkit-min-content;
min-width: 60%;
float: none !important;
}
.botonComprarFichaProducto {}
}
/* =========================================================
BLOQUE: TABLET Y ESCRITORIO — pantallas desde 768px (sin máximo, no afecta al móvil)
Condicion real: @media (min-width: 768px)
========================================================= */
@media (min-width: 768px) {
.fa-datos-compartir-derecha {
float: right;
margin-left: 0px;
}
}
/* =========================================================
BLOQUE: TABLET Y ESCRITORIO — pantallas desde 768px (sin máximo, no afecta al móvil)
Condicion real: @media only screen and (min-width: 768px)
========================================================= */
@media only screen and (min-width: 768px) {
.fa-media-img .fotos .carousel-control-prev-icon {
width: 55px;
height: 55px;
}
.fa-media-img .fotos .carousel-control-next-icon {
width: 55px;
height: 55px;
}
.contenedorFotos .fotos .carousel-control-prev-icon {
width: 25px;
height: 25px;
}
.contenedorFotos .fotos .carousel-control-next-icon {
width: 25px;
height: 25px;
}
}
/* =========================================================
BLOQUE: ESCRITORIO — pantallas desde 992px
Condicion real: @media (min-width: 992px)
========================================================= */
@media (min-width: 992px) {
.fa-pagamastarde {
width: 47%;
margin-top: -7px;
min-height: 249px;
float: right;
}
.fa-pagamastarde .pmt-financiacion {
height: 1em;
overflow: visible;
}
.fa-media-envio-gratis img {
width: inherit;
}
.fa-media {
width: 500px;
}
.fa-titulo-titulo {
width: 500px;
display: block;
height: 120px;
}
.fa-datos {
width: 430px;
min-height: 420px;
padding: 5px;
}
.fa-boton-comprar {
margin-top: 1em;
}
.fa-datos-nombre {
display: block;
}
.fa-datos-edad {
display: block;
}
.fa-datos-descripcion-corta-mas-detalles {
margin-bottom: 10px;
display: block;
}
.fa-datos-descripcion-corta a {
text-decoration: none;
display: block;
}
.fa-datos-descripcion-corta-mas-detalles a {
margin-bottom: 10px;
text-decoration: none;
display: block;
color: #de6c24;
font-weight: bold;
}
.fa-datos-descripcion-corta-mas-detalles a:hover {
color: #343d7a;
display: block;
}
.fa-datos-gastos-envio {
display: block;
}
.fa-datos-envio {
display: block;
}
.fa-datos-compartir-wrap {
margin-top: 30px;
}
.fa-complementos-articulos {
text-align: inherit;
}
.fa-complementos-articulos-articulo {
width: 90px;
}
.fa-otros-articulos {
width: 320px;
}
.fa-otros-articulos-largo {
width: 500px;
}
.fa-advertencias-titulo {
width: 485px;
}
.fa-advertencias-cuerpo {
width: 495px;
}
.fa-advertencias-cuerpo-largo {
width: 960px;
}
.fa-superiores-titulo {
width: 420px;
}
.fa-superiores-cuerpo {
width: 420px;
}
.fa-superiores-titulo-largo {
width: 930px;
}
.fa-superiores-cuerpo-largo {
width: 930px;
}
.comentariosFichaProductoTitulo {
/* width: 400px; */
display: block;
}
.fa-pagamastarde {
width: 94% !important;
margin-top: 10px;
}
.fa-boton-comprar-pagamastarde {
float: initial !important;
}
.separadorImagenDesktop {
clear: both;
margin-bottom: 1em;
}
.botonComprarFichaProducto {
position: static;
}
}
/* =========================================================
BLOQUE: ESCRITORIO — pantallas desde 1025px
Condicion real: @media only screen and (min-width: 1025px)
========================================================= */
@media only screen and (min-width: 1025px) {
.product-images-left {
display: inline-grid;
}
img.product-images-left-mas-vistas {
width: 50%;
height: auto;
}
.fa-media-img {
width: 100%;
height: 360px;
min-height: 600px;
}
.imagenFichaProductoGeneral {
width: 100%;
height: auto;
}
.fa-precio {
width: 100%;
}
.refProducto {
font-size: initial;
margin-bottom: 5px;
}
.edadProducto {
font-size: initial;
margin-bottom: 5px;
}
.regaloProducto {
font-size: initial;
margin-bottom: 5px;
}
.marcaProducto {
font-size: initial;
margin-bottom: 5px;
}
.financiacionProducto {
font-size: initial;
margin-bottom: 5px;
}
.envioProducto {
font-size: initial;
margin-bottom: 5px;
}
.envioGratisProducto {
font-size: initial;
margin-bottom: 5px;
}
.entregaDomicilioProducto {
font-size: initial;
margin-bottom: 5px;
}
.recogidaTiendaProducto {
font-size: initial;
margin-bottom: 5px;
}
.eligeModeloProducto {
font-size: initial;
margin-bottom: 5px;
}
.fa-datos-descripcion-corta {
display: block;
margin-bottom: 10px;
font-size: initial;
}
.contenedorClickAndCollect {
display: block;
font-size: initial;
margin-bottom: 5px;
}
.divYoutube {
font-size: initial;
margin-bottom: 5px;
}
.modeloProducto {
font-size: initial;
margin-bottom: 5px;
}
.tallasProducto {
font-size: initial;
margin-bottom: 5px;
}
.fa-boton-comprar-pagamastarde {
align-items: center;
flex-wrap: wrap;
display: flex !important;
gap: 12px;
}
.contenedorCantidad {}
.fa-precio-pequeno-tachado {
font-size: large !important;
}
.fa-precio-ahorro {
font-size: large !important;
margin-left: 5px;
color: #0090d8 !important;
}
.ofertaFichaArticulo {
color: #d40000;
font-size: large;
font-weight: bold;
}
span.IVA {
font-size: large;
font-weight: bold;
color: #0090d8;
text-align: center !important;
}
span.popUpIVA {
font-size: large;
font-weight: bold;
color: #fb6a12;
text-align: center !important;
}
.cn_articulosComplemento_articulo {
width: 25%;
float: left;
}
.fa-media-img popup-gallery {
position: absolute;
min-height: 250px;
}
img.bannerFichaArticulo {
width: 80%;
float: right;
}
.row.carruselArticulosFichaArticulos {
margin-left: -15px !important;
margin-right: -15px !important;
}
.botonComprarFichaProducto {}
button.btn.btn-warning.botonComprarFichaProducto.btn-primary.btn-lg.modeloButton {
width: 18% !important;
;
}
.row.comentarioDestacado {
background: white !important;
font-size: initial;
}
h1.nombreProducto {
margin-top: 10px;
}
.col-sm-12.contenedorFotos {
min-height: 148px;
}
}
/* =========================================================
BLOQUE: ESCRITORIO — pantallas desde 1200px
========================================================= */
@media only screen and (min-width: 1200px) {
.aCarouselResto {
border: 1px solid;
color: #0090d833;
margin-bottom: 5px;
}
.carousel.vertical .carousel-inner {
height: 100%;
}
.carousel.vertical .carousel-inner>.item {
transition: 0.6s ease-in-out top;
}
@media all and (transform-3d) {
.carousel.vertical .carousel-inner>.item {
transition: transform 0.6s ease-in-out;
backface-visibility: hidden;
perspective: 1000;
}
.carousel.vertical .carousel-inner>.item.next,
.carousel.vertical .carousel-inner>.item.active.right {
top: 0;
transform: translate3d(0, 100%, 0);
}
.carousel.vertical .carousel-inner>.item.prev,
.carousel.vertical .carousel-inner>.item.active.left {
top: 0;
transform: translate3d(0, -100%, 0);
}
.carousel.vertical .carousel-inner>.item.next.left,
.carousel.vertical .carousel-inner>.item.prev.right,
.carousel.vertical .carousel-inner>.item.active {
top: 0;
transform: translate3d(0, 0, 0);
}
}
.carousel.vertical .carousel-inner>.active {
top: 0;
}
.carousel.vertical .carousel-inner>.next,
.carousel.vertical .carousel-inner>.prev {
top: 0;
height: 100%;
width: 100%;
}
.carousel.vertical .carousel-inner>.next {
left: 0;
top: 100%;
}
.carousel.vertical .carousel-inner>.prev {
left: 0;
top: -100%;
}
.carousel.vertical .carousel-inner>.next.left,
.carousel.vertical .carousel-inner>.prev.right {
top: 0;
}
.carousel.vertical .carousel-inner>.active.left {
left: 0;
top: -100%;
}
.carousel.vertical .carousel-inner>.active.right {
left: 0;
top: 100%;
}
.carousel.vertical .carousel-indicators {
right: 20px;
top: 50%;
transform: translate(-50%);
bottom: auto;
left: auto;
width: auto;
margin: 0;
padding: 0;
}
.carousel.vertical .carousel-indicators li {
display: block;
margin: 5px 0;
}
.botonComprarFichaProducto {
margin-top: 0px;
}
.fechaProducto_es.alert.alert-light {
white-space: unset;
}
.fa-precio-grande {
float: left;
text-align: left;
font-size: xxx-large;
}
.fa-currency {
padding-left: 5px;
float: left;
margin-left: 0;
font-size: xx-large;
}
}
/* =========================================================
MODAL "Artículo añadido correctamente"
========================================================= */
/* El modal (por id, máxima especificidad) siempre por encima de todo */
#modal-comprar-directo {
z-index: 999999 !important;
}
/* Su fondo oscuro, justo debajo del modal pero por encima del resto (header, carrito, botón sticky...) */
.modal-backdrop {
z-index: 999998 !important;
pointer-events: none !important;
}
/* Oculta la barra flotante de precio mientras haya un modal abierto */
body.modal-open .overlay-precio {
display: none !important;
}
body.modal-open .overlay-precio {
display: none !important;
}
/* En móvil, el opacity del backdrop se renderiza por encima del modal (bug de apilamiento).
Solución: quitamos la opacidad ahí y oscurecemos el fondo con rgba en su lugar. */
@media (max-width: 767px) {
.modal-backdrop.show {
opacity: .0 !important;
}
.modal-backdrop {
background-color: rgba(0, 0, 0, 0.5) !important;
}
}