#cabecera .slide li .btn { top: 298px; } /* ================================================================ ZONA TT - PRIMERA PRUEBA DE ACCESIBILIDAD Colores corporativos: azul #075C99 / amarillo #FFCC00 Mantener este archivo cargado DESPUES de main.css y responsive.css. No se modifican los colores almacenados en la base de datos. ================================================================ */ /* 1. Foco visible: main.css elimina outline de forma global. */ a:focus, button:focus, input:focus, select:focus, textarea:focus, [tabindex]:focus { outline: 3px solid #FFCC00 !important; outline-offset: 3px; } @supports selector(:focus-visible) { a:focus:not(:focus-visible), button:focus:not(:focus-visible), input:focus:not(:focus-visible), select:focus:not(:focus-visible), textarea:focus:not(:focus-visible), [tabindex]:focus:not(:focus-visible) { outline: none !important; } } a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid #FFCC00 !important; outline-offset: 3px; } /* Foco azul cuando el fondo es blanco o amarillo claro. */ input:focus, select:focus, textarea:focus, .pie-info a:focus, .contents a:focus, .sidebar a:focus { outline-color: #075C99 !important; } /* 2. Contraste de textos secundarios. */ .gris, .submenuizq a, .articulo-detalle .fotografia .zoom { color: #595959; } .predictive-left .predictive-res { background-color: #595959; color: #FFFFFF; } .articulo-detalle .custom-line .inactive { color: #595959; } /* Aumentar legibilidad del texto legal, anteriormente 9-10 px. */ .clausula-rgpd p, .form-register .clausula-rgpd p { font-size: 12px !important; line-height: 17px !important; } /* 3. Controles pequenos: primera ampliacion conservadora. */ .sidebar ul li a { display: inline-block; min-height: 28px; line-height: 28px; box-sizing: border-box; } .articulo-detalle .special-select, .articulo-detalle .special-select select, .articulo-detalle .special-select .selected { min-height: 30px; height: 30px; box-sizing: border-box; } .articulo-detalle .special-select .selected { line-height: 28px; } .cesta-tr .td-can select, .checkout .resumen-tr .td-info .td-can select, .checkout .resumen-tr .td-info .td-facetas select { min-height: 30px; height: 30px; line-height: normal; } .alerta .dismiss { width: 30px; height: 30px; line-height: 30px; border-radius: 50%; text-align: center; } .cookies a { padding: 7px 10px; margin: 3px 4px; min-height: 30px; box-sizing: border-box; } #cookies { font-size: 12px; line-height: 18px; } /* Conserva el sprite de 32 px; el borde transparente amplia el area clicable. */ .back-to-top { border: 6px solid transparent; background-clip: padding-box; box-sizing: content-box; } /* 4. Enlace de salto: requiere insertar el enlace en el HTML del . */ .skip-link { position: absolute; top: -120px; left: 10px; z-index: 99999999; padding: 12px 18px; background: #075C99; color: #FFFFFF !important; font-size: 16px; line-height: 22px; font-weight: bold; text-decoration: underline; } .skip-link:focus, .skip-link:focus-visible { position: fixed; top: 10px; left: 10px; outline-color: #FFCC00 !important; } #main-content { scroll-margin-top: 90px; } /* 5. Desplegables accesibles tambien desde teclado, si usan .submenu. */ nav ul li:focus-within > .submenu { display: block; } @media screen and (max-width: 767px) { #responsive-menu-button { min-height: 40px; box-sizing: border-box; } .sidebar ul li a { min-height: 32px; line-height: 32px; } .pie-newsletter .btn { min-height: 40px; } } /* ACCESIBILIDAD - Contraste de precios de oferta */ /* Sustituye el rojo original #F25B47 */ .oferta { color: #B3261E !important; } /* ===================================================== ACCESIBILIDAD - NEWSLETTER PIE DE PÁGINA ===================================================== */ /* Textos descriptivos */ .pie-newsletter, .pie-newsletter p, .pie-newsletter span, .pie-newsletter strong, .pie-newsletter b { color: #FFFFFF; } /* Campo de correo electrónico */ .pie-newsletter input.input { background-color: #FFFFFF; color: #262626; border: 1px solid #595959; opacity: 1; } /* Placeholder: contraste suficiente sobre blanco */ .pie-newsletter input.input::placeholder { color: #595959; opacity: 1; } /* Compatibilidad con navegadores antiguos */ .pie-newsletter input.input::-webkit-input-placeholder { color: #595959; opacity: 1; } .pie-newsletter input.input::-moz-placeholder { color: #595959; opacity: 1; } /* Botón de suscripción: selector específico para vencer estilos anteriores. */ body .pie-newsletter form button.btn.upper, body .pie-newsletter form button.btn, body .pie-newsletter .btn { background: #075C99 !important; background-color: #075C99 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF; opacity: 1 !important; min-height: 40px; } body .pie-newsletter form button.btn.upper:hover, body .pie-newsletter form button.btn.upper:focus, body .pie-newsletter form button.btn:hover, body .pie-newsletter form button.btn:focus, body .pie-newsletter .btn:hover, body .pie-newsletter .btn:focus { background: #054773 !important; background-color: #054773 !important; color: #FFFFFF !important; } /* Foco del campo */ .pie-newsletter input.input:focus { outline: 3px solid #FFCC00 !important; outline-offset: 2px; } /* ACCESIBILIDAD - AREAS TACTILES: tarjetas de productos y footer */ .productos-populares-list .producto h2 > a, .productos-populares-list .producto h3 > a { display: block; min-height: 24px; line-height: 24px; box-sizing: border-box; } .productos-populares-list .producto h2 em, .productos-populares-list .producto h3 em { display: block; padding-top: 7px; } .productos-populares-list .producto h3 { max-height: none; overflow: visible; } .productos-populares-list .producto h2 em a, .productos-populares-list .producto h3 em a { display: inline-block; min-height: 24px; line-height: 24px; box-sizing: border-box; } footer .pie ul li { line-height: normal; margin-bottom: 5px; } footer .pie ul li > a { display: inline-block; min-height: 24px; line-height: 24px; box-sizing: border-box; } .pie-info a[href^="tel:"], .pie-info a[href^="mailto:"] { display: inline-block; min-height: 28px; line-height: 28px; box-sizing: border-box; } @media screen and (max-width: 767px) { .productos-populares-list .producto h2 > a, .productos-populares-list .producto h3 > a, .productos-populares-list .producto h2 em a, .productos-populares-list .producto h3 em a { min-height: 32px; line-height: 24px; padding: 4px 0; } footer .pie ul li > a { min-height: 32px; line-height: 24px; padding: 4px 0; } }