/* reCAPTCHA v3: hide floating badge and inline form widget; disclosure text in footer satisfies ToS */ .grecaptcha-badge { visibility: hidden !important; } .field-recaptcha { display: none !important; } .recaptcha-disclosure { width: 100%; flex-basis: 100%; clear: both; text-align: center; font-size: 11px; color: #999; padding: 8px 0 4px; } .recaptcha-disclosure a { color: #999; text-decoration: underline; } /* .fotorama__caption__wrap{ display:none !important; } */ .eoHideMe { display:none; } .boxConfidence__wrap___2skKG{ text-align:center } .boxConfidence__item___3OCaH{ position:relative; display:inline-block; vertical-align:middle; height:60px; cursor:help } .boxConfidence__item___3OCaH:after{ content:""; display:inline-block; height:100%; min-height:inherit; vertical-align:middle } .boxConfidence__item___3OCaH:before{ content:""; display:inline-block; vertical-align:middle; width:1px; height:16px; margin:0 25px; background:#2d2d2d } .boxConfidence__item___3OCaH:first-of-type:before{ display:none } .boxConfidence__name___1fo-i{ display:inline-block; vertical-align:middle; font-size:13px } .boxConfidence__title___3Rmn1{ display:block; font-size:15px; font-weight:700; border-bottom:1px solid #eae9e5; color:#2d2d2d; padding-bottom:10px; margin-bottom:12px } .boxConfidence__text___3xOLW{ font-family:Arial; font-size:12px; line-height:1.8; letter-spacing:.04em; color:#4d4d4d } .boxConfidence__text___3xOLW a{ font-size:13px; -webkit-transition:color .1s ease; transition:color .1s ease; text-decoration:underline; color:#000 } .boxConfidence__text___3xOLW a:hover{ color:#5ecfea } .boxConfidence__tooltip___1oA-y{ border:1px solid #efefef; cursor:default; padding:15px 20px 20px; width:356px; background-color:#fff; -webkit-box-shadow:0 3px 6px 0 rgba(0,0,0,.11); box-shadow:0 3px 6px 0 rgba(0,0,0,.11); -webkit-box-sizing:border-box; box-sizing:border-box; text-align:center } .boxConfidence__tooltip___1oA-y .rc-tooltip-arrow{ -webkit-box-shadow:-2px 2px 0 -1px #efefef; box-shadow:-2px 2px 0 -1px #efefef } .boxConfidence__showOnTopOverlay___U19Ef{ z-index:100015 } .topStrip__wrap___1m-8A{ background:#2d2d2d } .topStrip__showOnTopOverlay___20ROX{ z-index:100014 } .topStrip__invisible___OzW96{ display:none } .topStrip__body___82_9H{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; margin:0 auto; max-width:1440px; min-width:965px; padding:0 20px; -webkit-box-sizing:border-box; box-sizing:border-box } @media (min-width:1280px) and (max-width:1439.9px){ .topStrip__body___82_9H{ padding:0 65px } } @media (min-width:1440px){ .topStrip__body___82_9H{ padding:0 95px } } .topStrip__boxPhone___2iMNd a{ color:#6cf } .topStrip__boxPhone___2iMNd a:after{ content:""; display:inline-block; vertical-align:middle; width:2px; height:16px; margin:0 10px; background:#fff } .topStrip__boxPhone___2iMNd:after{ content:""; display:inline-block; height:100%; min-height:inherit; vertical-align:middle } .topStrip__boxConfidence___38ugK{ -webkit-box-flex:1; -ms-flex:1 1 auto; flex:1 1 auto } .topStrip__boxConfidence___38ugK.topStrip__sticky___1u8Bd div{ text-align:left } .topStrip__boxConfidence___38ugK div>div{ height:35px; cursor:default } .topStrip__boxConfidence___38ugK div>div:before{ width:2px; margin:0 10px; background:#fff } .topStrip__boxConfidence___38ugK span{ font-size:14px; line-height:1.1; color:#fff; font-weight:700 } .topStrip__boxMenu___3eHOf{ -webkit-box-flex:1; -ms-flex:1 1 auto; flex:1 1 auto; text-align:right } .topStrip__boxMenu___3eHOf>div{ height:100% } .home-main-slider__item__content { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .home-main-slider { width: 100%; padding: 0px; } .home-main-slider__item {width: 100%; margin: 0; padding: 0; position: relative; } .home-main-slider__item img {} .home-main-slider__item__img { } .home-main-slider__item__content .col-xs-4 { position: relative; height: 100%; } .home-main-slider__item__content__button-left, .home-main-slider__item__content__button-left:hover, .home-main-slider__item__content__button-right, .home-main-slider__item__content__button-right:hover, .home-main-slider__item__content__button-right:visited, .home-main-slider__item__content__button-left:visited { display: inline-block; background-color: #4286f4; /* font-family: "Roboto", sans-serif; */ font-size: 1.3vw; color: #fff; text-transform: uppercase; text-decoration: none; white-space: nowrap; padding: 3% 9%; position: absolute; left: 50%; bottom: 10%; transform: translateX(-50%);} .home-main-slider__item__content__text-container__spans { text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .home-main-slider__item__content__text-container__spans-h1 { /* font-family: "Roboto", sans-serif; */ font-size: 2vw; color: #fff; white-space: nowrap; } .home-main-slider__item__content__text-container__spans-h2 { /* font-family: "Roboto", sans-serif; */ font-size: 1.3vw; color: #fff; font-weight: 300; } .home-main-slider .owl-controls .owl-nav div img {height: 100%;} .home-main-slider .owl-controls .owl-nav div, .home-main-slider .owl-controls .owl-nav div:hover { background: none; margin: 0 10px; padding: 0;} @media (max-width: 991px){ .home-main-slider .owl-controls .owl-nav div { top: 40%; height: 30%;} } @media (max-width: 1200px){ .home-main-slider .owl-controls .owl-next { right: 0; top: 30%; } .home-main-slider .owl-controls .owl-prev { left: 0; top: 30%; } } .home-main-slider .owl-controls .owl-next { right: 0; top: 35%; } .home-main-slider .owl-controls .owl-prev { left: 0; top: 35%; } .home-feature-categories { text-align: center; } .home-feature-categories ul { display:block; width:100%; text-align:center; margin:0; } .home-feature-categories .subcat-boxes { display:inline-block; width:auto; max-width:100%; margin:0 auto;} .home-feature-categories .item { display: inline-block; border-right: 1px solid #ececec;} .home-feature-categories .item:last-child { border-right: 0;} .home-feature-categories .item a{ display:block; padding:36px 25px; color:#343434; font-family: 'Open-Sans', sans-serif; font-weight:400; text-align:center; text-decoration:none; font-size:16px; text-transform:uppercase } .home-feature-categories .item a:hover{ text-decoration:none; opacity:0.5 } .home-feature-categories .item a img{ clear:both; display:block; margin:0 auto 15px;} .home-feature-categories .item a span{ clear:both; display:block} .page-header .panel.wrapper { border-bottom: 1px solid #e8e8e8; background-color: #eae9e4; } .minicart-wrapper .action.showcart.active:before { content: '\f07a'; } .minicart-wrapper .action.showcart:before { content: '\f07a'; } .block-search, .minicart-wrapper { margin-top: 5px !important; } .header.links.header-cms-links.eoheaderlinks.li:before { content: ""; display: inline-block; vertical-align: middle; width: 1px; height: 16px; margin: 0 25px; background: #2d2d2d; } .button__btn___xRa52 { display: inline-block; vertical-align: middle; position: relative; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; border: 0; } .button__btn___xRa52.button__blue___B5gfi { background: #F15B47; color: #fff; } .popupFindSizeForm__header___1uHR5 { height: 72px; margin-bottom: 10px; font-size: 31px; line-height: 72px; font-weight: 700; text-align: center; background-color: #efefef; } .popupFindSizeForm__text___Av9SK { color: #4d4d4d; font-size: 16px; margin-bottom: 44px; text-align: center; } .popupFindSizeForm__pic___3mlwU { display: block; width: 334px; margin: 0 auto; } .popupFindSizeForm__form___GNOyW { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 363px; margin: 32px auto; } .popupFindSizeForm__item___pvSAw { -webkit-box-flex: 0; -ms-flex: 0 0 100px; flex: 0 0 100px; text-align: center; } .popupFindSizeForm__name___1-Rk7 { display: block; font-size: 16px; margin-bottom: 5px; white-space: nowrap; color: #4d4d4d; } .popupFindSizeForm__optional___qW-Rd { display: block; padding-left: 4px; text-align: left; font-size: 10px; color: #4d4d4d; } .popupFindSizeForm__input___3XPvl { width: 100%; height: 34px; border: 1px solid #b1b1b1; padding: 0 12px; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; } .popupFindSizeForm__nameBtn___-C8J1 { font-size: 17px; } .popupFindSize__wrap___3iWE0 { } body > div.modals-wrapper > aside.modal-popup.modal-slide._show > div.modal-inner-wrap { width:590px !important; } .rc-dialog-mask { background: rgba(0, 0, 0, .8); height: 100%; } .rc-dialog-mask, .rc-dialog-wrap { bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 100; } .rc-dialog-wrap { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: auto; outline: 0; -webkit-overflow-scrolling: touch; } .rc-dialog { position: relative; width: auto; max-height: 100%; } .rc-dialog-content { background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; color: #000; position: relative; } .rc-dialog-content+div { display: none; } .rc-dialog-body { -webkit-box-sizing: border-box; box-sizing: border-box; } .rc-dialog-mask { background: rgba(0, 0, 0, .8); height: 100%; z-index: 1001; } .rc-dialog-mask, .rc-dialog-wrap { bottom: 0; left: 0; position: fixed; right: 0; top: 0; } .rc-dialog-wrap { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: auto; outline: 0; z-index: 1002; -webkit-overflow-scrolling: touch; } .rc-dialog { position: relative; width: auto; } .rc-dialog-content { background-color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; } .rc-dialog-content+div { display: none; } .rc-dialog-body { -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .rc-dialog-close { border: 0; background: #23aae2; cursor: pointer; height: 42px; position: absolute; right: -42px; top: 10px; width: 42px; } .rc-dialog-close:after, .rc-dialog-close:before { content: ""; position: absolute; top: 21px; right: 13px; width: 15px; height: 1px; background-color: #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .rc-dialog-close:before { -webkit-transform: rotate(135deg); transform: rotate(135deg); } div, img, p, span { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } *, :after, :before { -webkit-box-sizing: border-box; box-sizing: border-box; } p { margin: 0; } /* //magento.stackexchange.com/questions/245361/hide-the-qty-box-in-bundle-product */ /* .bundle-options-container .nested .field.qty:last-child { display : none; } */ /* ── Checkout heading consistency ──────────────────────────────────────────── Luma sets checkout section titles to font-weight:300 / text-transform:none. Override to match the bold-uppercase style used throughout the rest of the site. */ .step-title, .opc-block-summary > .title, .shipping-information-title span, .checkout-payment-method .step-title { font-weight: 700 !important; text-transform: uppercase !important; } .fotorama--fullscreen .fotorama__stage__frame .fotorama__img--full { width: 100% !important; height: 100% !important; object-fit: contain !important; max-width: 100% !important; max-height: 100% !important; } @media (max-width: 767px) { [class*="popupFindSizeForm__header"] { font-size: 22px !important; } } .product-item-actions { display: none !important; } .products-grid .product-item .product-item-info, .products-grid .product-item:hover .product-item-info { padding: 8px !important; } .products-grid .product-item-info .product-image-container { width: 100% !important; max-width: 100% !important; } /* Frame Colour is always populated — suppress required asterisk */ .swatch-attribute.framecolours > .swatch-attribute-label:after { display: none !important; } /* Qty switcher: prevent inc button wrapping below input */ .qty-wrapper { white-space: nowrap; } /* ── fa-stack icon fix inside .block-benefits ──────────────────────────────── The easyoptical.css "span { font: inherit; vertical-align: baseline }" reset and FA 4.7 "line-height: inherit" interact to push the foreground icon to the bottom of the circle. Replace the line-height centering trick with explicit flexbox centering: fill the fa-stack container, then use align-items/justify- content to centre the glyph (::before) regardless of font or line-height. */ .block-benefits .fa-stack { vertical-align: top; } .block-benefits .fa-stack .fa-stack-1x, .block-benefits .fa-stack .fa-stack-2x { top: 0; left: 0; right: 0; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 1; } .block-benefits .fa-stack .fa-circle { color: #1150b5; } /* == Racing green (2026-08-08) ============================================== Buttons + links. Lives HERE, in plain CSS, because this theme chain imports neither _extend.less nor .extend.less — the latter sat unconsumed for years (its reCAPTCHA-badge rule never reached any compiled stylesheet, so that is re-stated below too). Swissup config drives only the hollow-outline style; the approved mock uses a solid primary. */ button.action.primary, .action.primary, .action.primary.tocart { background: #1e5c40 !important; border-color: #1e5c40 !important; color: #fff !important; } button.action.primary:hover, .action.primary:hover, .action.primary:focus, button.action.primary:active, .action.primary:active { background: #174a33 !important; border-color: #174a33 !important; color: #fff !important; } /* :not(.btn) -- the homepage hero overlay buttons (.btn.btn-transparent) are white-on-photo by design, styled inside the CMS block at specificity (0,1,0). This rule is (0,3,1), so it was repainting them green on top of a dark photograph. Regression from the 2026-08-08 green propagation, caught on the live homepage. */ .page-main a:not(.action):not(.eol-chipbtn):not(.btn), .footer.content a, a.action.view { color: #1e5c40; } .page-main a:not(.action):not(.btn):hover, .footer.content a:hover { color: #174a33; } .grecaptcha-badge { visibility: hidden !important; } /* Checkout progress bar + header cart counter: the last orange (Luma default) surfaces, brought into the racing green with everything else (2026-08-08). */ /* !important because checkout MERGES css and the merge order puts the theme after this file — on merged pages equal-specificity source order flips against us. */ .opc-progress-bar-item._active:before, .opc-progress-bar-item._active > span:before { background: #1e5c40 !important; border-color: #1e5c40 !important; } .opc-progress-bar-item._complete > span:before { background: #1e5c40 !important; } .opc-progress-bar-item._active > span:after, .opc-progress-bar-item._complete > span:after { border-color: #1e5c40 !important; } .opc-progress-bar-item._complete:before { background: #1e5c40 !important; border-color: #1e5c40 !important; } /* The completed step LABEL is Magento's default #006bb4 blue. It is only visible from step 2 onward -- step 1 is the only state you see before entering an address -- which is why it survived the first pass. Verified with getComputedStyle on the live page, not by reading the rule: the earlier attempt here was 'correct' CSS painting elements that a parent-theme rule had already set to display:none. */ .opc-progress-bar-item._complete > span { color: #1e5c40 !important; } .opc-progress-bar-item._complete:hover:before, .opc-progress-bar-item._complete:hover > span:before { background: #174a33 !important; } .minicart-wrapper .action.showcart .counter.qty { background: #1e5c40; } /* ------------------------------------------------------------------------ Racing green footer — Option A, applied 2026-08-11. The ground was #222337, a blue-violet. Racing green #1e5c40 is 84° away in hue: neither analogous nor complementary, which is the gap that reads muddy, and the cool violet pushed the green toward grey. Worse, the green button and social icons sat at 1.95:1 against it — below the 3:1 floor for non-text controls, so they read as smudges rather than things you can click. Ground moves into the green family so the accent belongs, and the accent lifts so it is actually visible: ground #16211c white text 16.6:1 accent #2a7a55 3.16:1 on the ground, white on it 5.23:1 (AA) hover #35916a icons #3fa87b 5.60:1 on the ground ⚠ Scoped to .page-footer on purpose. #1e5c40 is the site-wide brand green (checkout progress, minicart counter) and must NOT be swept up in this. ------------------------------------------------------------------------ */ .page-footer, .page-footer .footer.content .switcher-store { background: #16211c; } .page-footer .action.subscribe.primary { background-color: #2a7a55; border-color: #2a7a55; color: #fff; } .page-footer .action.subscribe.primary:hover, .page-footer .action.subscribe.primary:focus { background-color: #35916a; border-color: #35916a; } .page-footer .social-icons a, .page-footer .social-icons a:link, .page-footer .social-icons a:visited { color: #3fa87b; } .page-footer .social-icons a:hover, .page-footer .social-icons a:focus { color: #fff; } /* The copyright bar is a SEPARATE element with its own colours and was missed on the first pass: .footer-toolbar-bottom{color:#b8b9d3;background-color:#1c1d2e} — a darker indigo with blue-grey text. It sits directly under the footer, so leaving it behind left a violet stripe below the new green ground. Kept slightly darker than the footer, as it was before. #a8b5ad on #111a16 = 8.35:1, matching the 8.63:1 it had. */ .page-footer .footer-toolbar-bottom, .footer-toolbar.footer-toolbar-bottom { background: #111a16; background-color: #111a16; color: #a8b5ad; } .page-footer .footer-toolbar-bottom a, .footer-toolbar.footer-toolbar-bottom a { color: #a8b5ad; } .page-footer .footer-toolbar-bottom a:hover, .footer-toolbar.footer-toolbar-bottom a:hover { color: #fff; }.ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 10px 0 0 0; padding: 0.8em .5em 0.8em 1em; font-size: 15px; font-weight: bold; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; } .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } .faq-accordion .ui-widget.ui-widget-content { border: 1px solid #c5c5c5; } .faq-accordion .ui-widget-content { border: 1px solid #dddddd; /* background: #ffffff; */ /* color: #333333; */ } .faq-accordion .ui-widget-content a { /* color: #333333; */ } .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #c5c5c5; /* background: #f6f6f6; */ font-weight: normal; /* color: #454545; */ } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited { /* color: #2b2b2b; */ text-decoration: none; } .ui-visual-focus { /* box-shadow: 0 0 3px 1px rgb(94, 158, 214); */ } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { /* border: 1px solid #003eff; */ /* background: #007fff; */ font-weight: normal; /* color: #ffffff; */ } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { /* color: #ffffff; */ text-decoration: none; } .faq-content { float: left; width: 100%; } .group-title{ margin: 25px 0; font-size: 18px; text-transform: uppercase; line-height: 1.5; padding-bottom: 0.25em; border-bottom: 1px solid #ddd; width: 100%; /* color: #198dd3; */ font-weight: bold; } .group-title i { float: left; width: 2.15em; border-bottom: 1px solid #b55; position: absolute; bottom: -1px; z-index: 9999; border-bottom-color: #198dd3; } .faq-groups { width: 100%; float: left; margin-bottom: 30px; } .faq-group { float: left; } .faq-group-image { border: 1px solid #1979C3; padding: 20px; margin-right: 25px; } img.group-image { height: 100px; width: 100px; } .faq-groupname { font-size: 15px; font-weight: 700; text-align: center; text-transform: uppercase; margin: 10px 25px 0 0; } .faq-group a.group-link:hover { /* color: #ff5501; */ text-decoration: none; } .faq-group .faq-group-image:hover { /* border-color: #ff5501; */ } .faq-content .ui-accordion-header:hover { /* background-color: #1979c3; * color: #ffffff; */ } .faq-group:hover{ /* border-color: #ff5501; */ } .faq-collection { margin-bottom: 30px; float: left; width: 100%; } .ui-accordion .ui-state-default:after { content: '\f107'; font-family: 'FontAwesome'; float: right; } .ui-accordion .ui-accordion-header-active:after { content: '\f106'; font-family: 'FontAwesome'; }