/* Theme Name: Fabrica Author: veenkes Description: Minimal theme for fabrica® style landing. Version: 1.0 */ :root { --fx-bg: rgb(245, 245, 245); --fx-card-bg: #fff; --fx-text: #0b0b0b; --fx-muted: #5c5c5c; --fx-radius: 18px; --fx-ring: #ececec; --fx-shadow: 0 1px 0 rgba(0, 0, 0, .04), 0 3px 10px rgba(0, 0, 0, .04); --fx-shadow-hover: 0 2px 0 rgba(0, 0, 0, .05), 0 6px 18px rgba(0, 0, 0, .06); --fx-ease: cubic-bezier(.2, .8, .2, 1); --bg: #f5f5f5; --dark: #0b0b0b; --light: #ffffff; --font-sans: "Manrope", Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif; } .preloader.is-hidden { display: none !important; } @keyframes curtain-up { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-100%); opacity: 0; } } .preloader { position: fixed; inset: 0; z-index: 99999; background: #000; display: grid; place-items: center; will-change: transform, opacity; } .preloader__center { display: flex; align-items: center; justify-content: center; width: min(90vw, 560px); } .preloader svg { display: block; width: 100%; height: auto; } .preloader svg path { transform-box: fill-box; transform-origin: 50% 50%; } .logo-piece { opacity: 0; transform: translateY(40vh) scale(0.98); } .logo-piece.animate { animation: logo-rise 700ms cubic-bezier(.2, .75, .2, 1) forwards; animation-delay: var(--d, 0s); } @keyframes logo-rise { 0% { opacity: 0; transform: translateY(40vh) scale(0.98); } 60% { opacity: 1; transform: translateY(-6vh) scale(1.01); } 100% { opacity: 1; transform: translateY(0) scale(1); } } .letter-piece { opacity: 0; transform: translateY(60vh); } .letter-piece.animate { animation: letter-rise 680ms cubic-bezier(.2, 1, .25, 1) forwards; animation-delay: calc(0.45s + var(--d, 0s)); } @keyframes letter-rise { 0% { opacity: 0; transform: translateY(60vh); } 70% { opacity: 1; transform: translateY(-3vh); } 100% { opacity: 1; transform: translateY(0); } } .preloader.go-away { animation: curtain-up 1000ms cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: var(--leave-delay, 0s); } @keyframes curtain-up { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-100%); opacity: 0; } } .preloader svg { filter: drop-shadow(0 0 0 rgba(0, 0, 0, .001)); } h1, h2, h3, h4, h5, p { margin: 0; } * { box-sizing: border-box; -webkit-font-smoothing: inherit; } body { margin: 0; background: var(--fx-bg); font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, Helvetica, sans-serif; color: var(--fx-text); font-family: var(--font-sans); } .bottom-blur { position: fixed; left: 0; right: 0; bottom: 0; height: clamp(100px, 14vh, 220px); z-index: 9999; } .bottom-blur .bb-layer { position: absolute; inset: 0; opacity: 1; border-radius: 0; will-change: auto; backdrop-filter: blur(var(--blur, 0.5px)); -webkit-backdrop-filter: blur(var(--blur, 0.5px)); mask-image: linear-gradient(rgba(0, 0, 0, 0) var(--from, 0%), rgba(0, 0, 0, 1) calc(var(--from, 0%) + (var(--to, 100%) - var(--from, 0%))/2), rgba(0, 0, 0, 1) var(--to, 100%), rgba(0, 0, 0, 0) calc(var(--to, 100%) + 12.5%)); mask-size: 100% 100%; mask-repeat: no-repeat; -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) var(--from, 0%), rgba(0, 0, 0, 1) calc(var(--from, 0%) + (var(--to, 100%) - var(--from, 0%))/2), rgba(0, 0, 0, 1) var(--to, 100%), rgba(0, 0, 0, 0) calc(var(--to, 100%) + 12.5%)); -webkit-mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; } .fx-faq { background: var(--fx-bg); } .fx-wrap { max-width: 1520px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: minmax(320px, 1fr) minmax(640px, 820px); gap: 48px 68px; align-items: start; } .fx-h { font-weight: 800; line-height: .95; font-size: clamp(56px, 12vw, 144px); letter-spacing: -.02em; margin: 0 0 24px 0; } .fx-dot { font-weight: 800; } .fx-sub { margin: 0; max-width: 460px; font-size: 18px; line-height: 1.6; color: var(--fx-muted); } .fx-right { display: flex; flex-direction: column; gap: 4px; } .fx-item { background: var(--fx-card-bg); border-radius: var(--fx-radius); overflow: hidden; transition: box-shadow .25s var(--fx-ease), transform .25s var(--fx-ease); } .fx-q { -webkit-tap-highlight-color: transparent; display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; background: transparent; border: 0; cursor: pointer; padding: 26px; font-family: Inter, "Inter Placeholder", sans-serif; font-size: 18px; font-weight: 500; text-align: left; } .fx-q:focus { outline: none; } .fx-q:focus-visible { outline: none; box-shadow: inset 0 0 0 2px #dfe3ff; border-radius: calc(var(--fx-radius) - 2px); } .fx-icon { position: relative; flex: 0 0 24px; width: 24px; height: 24px; border-radius: 999px; background: #5D8D9E; transition: transform .28s var(--fx-ease), background .2s var(--fx-ease), opacity .2s var(--fx-ease); } .fx-item:hover .fx-icon { opacity: .95; } .fx-icon::before, .fx-icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 2px; background: #fff; transform: translate(-50%, -50%); border-radius: 1px; transition: transform .28s var(--fx-ease); } .fx-icon::after { transform: translate(-50%, -50%) rotate(90deg); } .fx-a { height: 0; transition: height .28s var(--fx-ease); overflow: hidden; } .fx-a-inner { padding: 0 24px 20px 24px; color: var(--fx-muted); font-size: 16px; line-height: 1.6; opacity: 0; transform: translateY(-4px); transition: opacity .26s var(--fx-ease), transform .26s var(--fx-ease); } .fx-item.fx-open .fx-a { height: auto; } .fx-item.fx-open .fx-a-inner { opacity: 1; transform: translateY(0); } .fx-item.fx-open .fx-icon::after { transform: translate(-50%, -50%) rotate(0deg); } @media (max-width:860px) { .fx-wrap { grid-template-columns: 1fr; gap: 40px; padding: 84px 18px; } .fx-right { gap: 10px; } .fx-q { padding: 18px 20px; font-size: 18px; } .fx-a-inner { padding: 0 20px 18px; } } #site-main { display: flex; flex-direction: column; gap: 190px; } :root { --dark: #0a0a0a; --light: #fff; --muted: rgba(255, 255, 255, .7); } .fabrica-hero { align-content: center; align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 110px; height: min-content; justify-content: center; overflow: hidden; padding: 0; position: relative; width: 100%; } .fabrica-hero__card { align-content: center; align-items: center; background-color: #f5f5f5; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 0px; min-height: calc(100vh - 65px); justify-content: center; overflow: hidden; position: relative; width: 100%; z-index: 3; } .fabrica-hero__container { align-items: center; display: flex; flex: 1 0 0px; flex-direction: row; flex-wrap: nowrap; gap: 10px; height: 1px; justify-content: center; overflow: hidden; padding: 0 4px 4px; position: relative; width: 100%; } .fabrica-hero__bg { align-items: center; border-radius: 25px; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 10px; justify-content: center; inset: 0 6px 6px; overflow: hidden; padding: 0; position: absolute; } .fabrica-hero__bg video { width: 100%; height: 100%; object-fit: cover } .fabrica-hero__dark { position: absolute; inset: 0; background: rgba(0, 0, 0, .45) } .fabrica-hero__grain { position: absolute; inset: -200%; width: 400%; height: 400%; opacity: .05; pointer-events: none; background-image: url("/images/grain.png"); background-size: cover; transform: translate(-8%, -4%); } .fabrica-hero__content { align-items: center; display: flex; flex: 1 0 0px; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: space-between; overflow: hidden; padding: 90px 36px; position: relative; width: 1px; z-index: 1; } .fabrica-hero__top { align-content: center; align-items: center; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 0px; height: min-content; justify-content: center; overflow: visible; padding: 0; position: relative; width: 100%; } .fabrica-hero__brand { align-content: flex-end; align-items: flex-end; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 0px; height: min-content; justify-content: center; overflow: visible; position: relative; } .fabrica-hero__word { align-content: flex-start; align-items: flex-start; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 0px; height: min-content; justify-content: flex-end; overflow: visible; padding: 0; position: relative; width: 100%; } .fabrica-hero__fabrica { text-align: center; font-weight: 600; font-size: clamp(64px, 21vw, 120px); letter-spacing: -0.06em; line-height: .9; color: #fff; display: block; } .fabrica-hero__studio { font-family: Inter, system-ui, sans-serif; font-weight: 600; color: #fff; font-size: clamp(28px, 4.2vw, 54px); letter-spacing: -0.06em; line-height: 1.2; margin-left: 8px; } .fabrica-hero__services { list-style: none; margin: 0; padding: 0; align-content: flex-start; align-items: flex-start; display: flex; flex: 1 0 0px; flex-direction: column; flex-wrap: nowrap; gap: 12px; height: min-content; justify-content: flex-start; overflow: hidden; padding: 0; position: relative; width: 1px; } .fabrica-hero__services li { font: Inter, sans-serif; color: #fff; font-size: 18px; font-weight: 600; } .fabrica-hero__bottom { margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 32px } .fabrica-hero__tagline { max-width: 620px; color: #fff; font: 600 20px/1.2 Inter, sans-serif; letter-spacing: -0.04em; } .fabrica-hero__tagline .muted { color: var(--muted) } .fabrica-hero__team { display: flex; gap: 14px; background: #fff; border-radius: 16px; padding: 14px; align-items: center; box-shadow: 0 8px 24px rgba(0, 0, 0, .25) } .fabrica-hero__team-img img { width: 88px; height: 88px; border-radius: 12px; object-fit: cover } .fabrica-hero__team-info .role { margin: 0; font: 600 14px/1 Inter, sans-serif; letter-spacing: -0.04em; color: #0a0a0a } .fabrica-hero__team-info .company { margin: 4px 0 8px; font: 600 12px/1.1 Inter, sans-serif; opacity: .6 } .fabrica-hero__team-info .name { margin: 0 0 10px; font: 600 22px/1.15 Inter, sans-serif } .btn-pill { display: inline-block; padding: 10px 18px; border-radius: 50px; background: #0a0a0a; color: #fff; font: 600 12px/1 Inter; text-decoration: none } .fabrica-hero__crosses { align-content: center; align-items: center; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; height: min-content; justify-content: space-between; opacity: .6; overflow: hidden; padding: 0; position: relative; width: 100%; } .fabrica-hero__crosses .cross { align-items: center; display: flex; flex: 1 0 0px; flex-direction: row; flex-wrap: nowrap; gap: 4px; height: min-content; justify-content: flex-start; overflow: hidden; padding: 0; position: relative; width: 1px; } .fabrica-clients { align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 70px; height: min-content; justify-content: center; overflow: hidden; padding: 0; position: relative; width: 100%; } .fabrica-clients__static { align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 70px; height: min-content; justify-content: center; overflow: hidden; padding: 0 36px; position: relative; width: 100%; } .fabrica-clients__container { align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 70px; height: min-content; justify-content: center; max-width: 1520px; overflow: hidden; padding: 0; position: relative; width: 100%; } .fabrica-clients__head { display: grid; flex: none; gap: 4px; grid-auto-rows: minmax(0, 1fr); grid-template-columns: repeat(4, minmax(50px, 1fr)); grid-template-rows: repeat(1, minmax(0, 1fr)); height: min-content; justify-content: center; overflow: visible; padding: 0; position: relative; width: 100%; } .fabrica-clients .title { display: flex; align-items: center; gap: 10px; font: 500 16px/1 Inter; } /* .fabrica-clients .badge { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; border-radius: 50px; background: #0a0a0a; color: #fff; font-weight: 400; font-size: 12px; } */ .fabrica-clients .years { font: 500 16px/1 Inter; color: #000 } .fabrica-clients__logos { display: grid; gap: 4px; grid-auto-rows: minmax(0, 1fr); grid-template-columns: repeat(6, minmax(50px, 1fr)); grid-template-rows: repeat(1, minmax(0, 1fr)); height: min-content; width: 100%; } .fabrica-clients__logos .logo { flex: 1 1 auto; min-width: 160px; height: 163px; background: #fff; border: 1px solid #e5e5e5; border-radius: 14px; display: flex; align-items: center; justify-content: center; } .fabrica-clients__logos img { max-height: 48px; max-width: 100% } @media (max-width:900px) { .fabrica-hero__bg { height: 665px; } .fabrica-hero__fabrica { font-size: 60px; } .fabrica-clients__logos { display: flex; flex-wrap: wrap; } .fabrica-hero__top { flex-direction: column; align-items: flex-start } .fabrica-hero__services { text-align: left } .fabrica-hero__bottom { flex-direction: column; align-items: flex-start; gap: 20px } .fabrica-clients__logos .logo { flex: 1 1 calc(50% - 12px) } } .testimonials { align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 70px; height: min-content; justify-content: center; overflow: visible; padding: 0 36px; position: relative; width: 100%; } .testimonials__container { align-items: center; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 90px; height: min-content; justify-content: center; max-width: 1520px; overflow: visible; padding: 0; position: relative; width: 100%; } .testimonials__top { display: grid; flex: none; gap: 4px; grid-auto-rows: minmax(0, 1fr); grid-template-columns: repeat(4, minmax(50px, 1fr)); grid-template-rows: repeat(1, minmax(0, 1fr)); height: min-content; justify-content: center; overflow: visible; padding: 0; position: relative; width: 100%; } .badge__desktop { align-items: center; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 9px; height: min-content; justify-content: flex-start; overflow: visible; padding: 0; position: relative; width: 100%; } .badge__icon { flex: none; height: auto; position: relative; width: auto; } .badge__icon-inner { align-items: center; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 10px; height: 18px; justify-content: center; overflow: hidden; padding: 0; position: relative; width: 18px; background-color: var(--token-88d5059b-bc5d-4e0a-ad79-b21e9a2c4948, rgb(10, 10, 10)); border-radius: 50px; opacity: 1; } .badge__line { background-color: rgb(255, 255, 255); opacity: 1; flex: none; height: 8px; left: calc(50.00000000000002% - 2px / 2); overflow: visible; position: absolute; top: calc(50.00000000000002% - 8px / 2); width: 2px; z-index: 1; } .badge__line--h { background-color: rgb(255, 255, 255); transform: rotate(90deg); opacity: 1; } .section-label p { font-size: 16px; font-weight: 500; } .heading { align-items: flex-start; align-self: start; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 22px; grid-column: span 3; height: min-content; justify-content: center; justify-self: start; overflow: hidden; padding: 0; position: relative; width: 100%; } .heading__title { outline: none; display: flex; flex-direction: column; justify-content: flex-start; flex-shrink: 0; transform: none; } .heading__title h2 { font-size: 70px; font-weight: 600; margin: 0; } .heading__year p { font-size: 36px; font-weight: 600; } .about { align-items: center; display: flex; flex: none; flex-wrap: nowrap; gap: 70px; height: min-content; padding: 0 36px; position: relative; width: 100%; } .about__container { width: 100%; } .about__top { display: grid; flex: none; gap: 4px; grid-auto-rows: minmax(0, 1fr); grid-template-columns: repeat(4, minmax(50px, 1fr)); grid-template-rows: repeat(1, minmax(0, 1fr)); height: min-content; justify-content: center; overflow: visible; padding: 0; position: relative; width: 100%; } .projects-section { padding: 0 24px; } .projects-section .projects__container { max-width: 1520px; margin: 0 auto; display: flex; flex-direction: column; gap: 60px; } .projects-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; } .projects-header span { font-size: 13px; color: #666; } .projects-title { font-size: 72px; font-weight: 500; letter-spacing: -0.02em; margin-bottom: 8px; } .projects-year { font-size: 16px; color: #000; margin-bottom: 48px; } .projects-subtitle { font-size: 15px; color: #666; line-height: 1.6; max-width: 580px; margin-bottom: 80px; } .projects-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; } .project-card { background: white; border-radius: 20px; padding: 20px; overflow: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer; position: relative; } .project-categories { display: flex; gap: 8px; flex-wrap: wrap; } .project-category { font-size: 11px; color: #666; text-transform: capitalize; } .project-date { font-size: 11px; color: #999; font-style: italic; } .project-card:hover { transform: translateY(-4px); } .project-card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding: 0 4px; } .project-tags { display: flex; align-items: baseline; gap: 4px; } .project-tag { font-size: 13px; color: #000; font-weight: 500; } .project-year-tag { font-size: 11px; color: #999; font-style: italic; } .project-dots { display: flex; gap: 4px; align-items: center; } .project-dot { width: 10px; height: 10px; border-radius: 50%; background: #e0e0e0; transition: background 0.2s ease; } .project-card:hover .project-dot:nth-child(1) { background: #ff5f56; } .project-card:hover .project-dot:nth-child(2) { background: #ffbd2e; } .project-card:hover .project-dot:nth-child(3) { background: #27c93f; } .project-image-wrapper { position: relative; width: 100%; height: 380px; background: white; border-radius: 16px; overflow: hidden; padding: 12px; } .project-image { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), filter 0.6s cubic-bezier(0.4, 0, 0.2, 1); } .project-card:hover .project-image { transform: scale(1.08); filter: blur(3px); } .projects-section .projects-grid { will-change: transform; transition: transform 0s; } .project-logo { position: absolute; bottom: 32px; left: 32px; z-index: 10; height: 28px; filter: brightness(0) invert(1); } .footer { padding: 200px 0 40px; } .footer .container { max-width: 1520px; margin: 0 auto; padding: 0 24px; overflow-x: clip } /* верхняя сетка */ .footer-grid { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 48px; row-gap: 48px; align-items: start; margin-bottom: 72px; } /* колонки (как в рефе) */ .footer-col--contact { grid-column: 1 / span 5 } .footer-col--nav { grid-column: 7 / span 3 } .footer-col--social { grid-column: 10 / span 3 } /* плюсики */ .footer-plus { font-size: 28px; line-height: 1; color: #bdbdbd; margin-bottom: 28px; user-select: none; } /* капшоны */ .footer-cap { font-size: 14px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); margin-bottom: 24px; } /* ===== Contact (блоком) ===== */ .footer-contact { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; } .footer-map { overflow: hidden; border-radius: 12px; /* 👈 регулируй радиус здесь */ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06); grid-column: 1 / span 5; align-self: start; } .footer-map iframe { display: block; width: 100%; height: 240px; border: none; border-radius: 12px; /* 👈 обязательно и для iframe */ } .footer-phone { font-size: 16px; color: var(--ink); text-decoration: none; } .footer-email { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; line-height: 32px; } .footer-email .dot { width: 14px; height: 14px; border-radius: 50%; background: #000; flex: 0 0 14px; } .footer-email .email-text { font-size: 30px; line-height: 62px; font-weight: 800; color: var(--ink); text-decoration: underline; text-underline-offset: 6px; } /* ===== Navigation ===== */ .footer-links { list-style: none; margin: 0; padding: 0 } .footer-links li { margin: 0 0 16px } .footer-links--nav .nav-link { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; padding: 0; } .nav-text { font-size: 22px; font-weight: 700; letter-spacing: -.01em } .bullet-roller { width: 10px; height: 10px; overflow: hidden; position: relative } .bullet { width: 10px; height: 10px; border-radius: 50%; background: #c9c9c9; transform: translateY(12px); /* скрыта снизу */ transition: transform .28s cubic-bezier(.2, .8, .2, 1); } .footer-links--nav .nav-link:hover .bullet, .footer-links--nav .nav-link:focus-visible .bullet { transform: translateY(0); } /* ===== Social ===== */ .footer-links--social .social-link { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; } .social-text { font-size: 22px; font-weight: 700; letter-spacing: -.01em } /* «роллер» для стрелки: верхняя уезжает ВВЕРХ, нижняя поднимается СНИЗУ */ .ext-roller { width: 16px; height: 16px; overflow: hidden; position: relative } .ext { display: block; width: 16px; height: 16px; line-height: 16px; text-align: center; font-size: 14px; color: #7b7b7b; transition: transform .28s cubic-bezier(.2, .8, .2, 1); } .ext--top { transform: translateY(0) } .ext--bottom { transform: translateY(16px) } .footer-links--social .social-link:hover .ext--top, .footer-links--social .social-link:focus-visible .ext--top { transform: translateY(-16px) } .footer-links--social .social-link:hover .ext--bottom, .footer-links--social .social-link:focus-visible .ext--bottom { transform: translateY(0) } /* ===== Big brand right bottom ===== */ .footer-brand { grid-column: 7 / span 5; grid-row: 2; align-self: start; } .footer-brand__title { font-weight: 900; letter-spacing: -.03em; font-size: 180px; line-height: .9; } .footer-brand__title .reg { font-size: .6em; vertical-align: top; margin-left: .04em } .footer-brand__sub { font-size: 44px; font-weight: 700; margin-top: 10px } /* ===== bottom bar ===== */ .footer-bottom { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 24px; padding-top: 28px; border-top: 1px solid var(--line); } .footer-bottom__left { display: flex; flex-direction: column } .footer-logo { font-size: 18px; font-weight: 700 } .footer-logo-sub { font-size: 14px; color: #666; margin-top: 4px } .footer-legal { display: flex; gap: 28px } .footer-legal a { font-size: 14px; color: #777; text-decoration: none; } .footer-legal a:hover { color: #000 } .footer-copy { font-size: 14px; color: #777 } /* ===== Responsive ===== */ @media (max-width:1200px) { .footer-brand__title { font-size: 150px } .footer-brand__sub { font-size: 36px } } @media (max-width:992px) { .footer-grid { grid-template-columns: repeat(6, 1fr); column-gap: 32px } .footer-col--contact { grid-column: 1 / span 6 } .footer-col--nav { grid-column: 1 / span 3 } .footer-col--social { grid-column: 4 / span 3 } .footer-brand { grid-column: 1 / span 6 } .footer-brand__title { font-size: 112px } } @media (max-width:640px) { .footer { padding: 72px 0 32px } .footer-grid { grid-template-columns: 1fr; row-gap: 32px } .footer-brand__title { font-size: 76px } .footer-brand__sub { font-size: 26px } .footer-bottom { grid-template-columns: 1fr; justify-items: flex-start } } :root { --bg: #efefef; --panel: #fff; --ink: #0b0b0b; --muted: #868686; --line: #e6e6e6; --r: 18px; --r-xl: 22px; } .showreel__overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 18px; padding: 0 8%; pointer-events: none; transition: all .6s cubic-bezier(.2, .8, .2, 1); } .showreel__overlay .play { transition: all .6s cubic-bezier(.2, .8, .2, 1); pointer-events: auto; } .showreel__text { color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .45); transition: opacity .45s ease, transform .6s cubic-bezier(.2, .8, .2, 1); } .showreel:hover .showreel__overlay { justify-content: center; gap: 0; } .launch { max-width: 1540px; margin: 0 auto; padding: 0 24px; } .launch__title { margin: 0 0 10px; font-weight: 900; letter-spacing: -.04em; line-height: 1.02; font-size: 64px } .launch__title span { opacity: .92 } .launch__subtitle { margin: 0 0 18px; color: var(--muted); font-size: 14px; line-height: 1.7; max-width: 620px } .steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 20px 0 14px } .step { background: var(--panel); border-radius: var(--r-xl); padding: 16px 18px; box-shadow: 0 1px 0 rgba(0, 0, 0, .05), 0 6px 16px rgba(0, 0, 0, .07) } .step__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px } .step__no { font-size: 12px; color: #9b9b9b; font-weight: 700; letter-spacing: .02em } .step__dots { display: grid; grid-auto-flow: column; gap: 6px } .step__dots span { width: 6px; height: 6px; border-radius: 50%; background: #d9d9d9; display: block } .step__dots[data-fill="1"] span:nth-child(-n+1), .step__dots[data-fill="2"] span:nth-child(-n+2), .step__dots[data-fill="3"] span:nth-child(-n+3), .step__dots[data-fill="4"] span:nth-child(-n+4) { background: #0b0b0b } .step__body { display: grid; grid-template-columns: 48px 1fr; gap: 12px; align-items: center } .step__thumb { width: 48px; height: 48px; border-radius: 12px; overflow: hidden; background: #eee } .step__thumb img { width: 100%; height: 100%; object-fit: cover } .step__title { font-size: 18px; line-height: 1.3; font-weight: 800; margin: 0 } .steps-divider { height: 12px; border-bottom: 1px solid var(--line); border-radius: 0 0 var(--r-xl) var(--r-xl); margin-bottom: 18px } .showreel { position: relative; border-radius: 26px; overflow: hidden; min-height: 520px; background: #ddd } .showreel__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(100%) contrast(104%) blur(0px); transform: scale(1); transition: transform .9s cubic-bezier(.2, .8, .2, 1), filter .9s cubic-bezier(.2, .8, .2, 1); } .showreel__overlay { position: absolute; inset: 0; display: flex; align-items: center; gap: 18px; padding: 0 8%; left: 50%; transform: translate(-50%); pointer-events: none } .play { width: 74px; height: 74px; border-radius: 50%; border: none; cursor: pointer; background: rgba(255, 255, 255, .95); box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 10px 30px rgba(0, 0, 0, .15); position: relative; pointer-events: auto; transform: translateX(-8%); transition: transform .6s cubic-bezier(.2, .8, .2, 1); } .play::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-40%, -50%); width: 0; height: 0; border-left: 18px solid #111; border-top: 11px solid transparent; border-bottom: 11px solid transparent; } .showreel__text { color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .45); transition: opacity .45s ease, transform .6s cubic-bezier(.2, .8, .2, 1) } .showreel__title { font-size: 30px; font-weight: 800; margin: 0 } .showreel__meta { font-size: 12px; opacity: .9; margin-top: 4px } .showreel:hover .showreel__img { transform: scale(1.06); filter: grayscale(100%) contrast(108%) blur(2px) } .showreel:hover .showreel__text { opacity: 0; transform: translateX(10%); } .fade-up { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; } .fade-up.visible { opacity: 1; transform: translateY(0); } .fade-delay-1 { transition-delay: 0.1s; } .fade-delay-2 { transition-delay: 0.3s; } .fade-delay-3 { transition-delay: 0.5s; } .fade-delay-4 { transition-delay: 0.7s; } .showreel:hover .play { transform: translateX(130px) } @media (max-width:1100px) { .launch__title { font-size: 56px } } @media (max-width:920px) { .steps { grid-template-columns: 1fr 1fr } .fx-wrap { display: flex; flex-wrap: wrap; } .showreel { min-height: 420px } } @media (max-width:560px) { #site-main { gap: 50px; } .project-card-wrapper { width: 100%; } .heading__title h2 { font-size: 32px; } .projects-grid { display: flex; flex-wrap: wrap; } .fabrica-clients__logos .logo { height: 90px; min-width: 120px; } .showreel__overlay { display: none; } .steps { display: flex; flex-wrap: wrap; } .launch__title { font-size: 38px } .showreel { min-height: 320px } .showreel__overlay { grid-template-columns: 1fr; justify-items: center; text-align: center } .play { transform: none } } .fx-product-page { display: flex; gap: 40px; padding: 60px 0; } .fx-gallery { flex: 1; position: sticky; top: 100px; } .fx-main-image img, .fx-gallery-row img { width: 100%; border-radius: 12px; } .fx-gallery-list { margin-top: 20px; display: flex; flex-direction: column; gap: 20px; } .fx-gallery-row.fx-two { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .fx-info { flex: 1; max-width: 500px; } .fx-title { font-size: 28px; font-weight: 700; } .fx-price { font-size: 20px; margin-top: 10px; color: #87ABB7; } .fx-colors { margin-top: 20px; } .fx-color-list { display: flex; gap: 10px; } .fx-color { display: inline-block; border: 1px solid #ccc; padding: 5px 10px; border-radius: 8px; font-size: 14px; } .woocommerce button.button.alt { background: #87ABB7; border: none; color: white; font-weight: 600; padding: 15px 30px; font-size: 16px; border-radius: 8px; margin-top: 20px; } @media(max-width: 768px) { .fx-product-page { flex-direction: column; } .fx-gallery-row.fx-two { grid-template-columns: 1fr 1fr; } } @starting-style { .rtr-show-footer { transform: translateY(100%) } } .sgh-tile__category { background-color: #efefef; border-radius: 3.2rem; gap: 1rem; margin-top: .4rem; min-height: 2.1rem; padding: .3rem 1rem; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content } @media (min-width:1024px) { .sgh-tile__category { white-space: nowrap } } @media (max-width:767px) { .sgh-pdp .sgh-tile__badge--price { position: absolute; right: 0; top: 0 } } .pdp-specs__description { margin-bottom: 30px; margin-top: 30px; font-size: 16px; line-height: 1.6; } .pdp-specs__grid { display: flex; flex-wrap: wrap; gap: 40px; } .pdp-specs__column { flex: 1; min-width: 250px; } .pdp-specs__title { font-size: 18px; font-weight: bold; margin-bottom: 10px; text-transform: uppercase; } .pdp-specs__list { list-style: none; padding: 0; margin: 0; } .pdp-specs__list li { display: flex; justify-content: space-between; margin-bottom: 5px; font-size: 14px; } .pdp-specs__list .label { color: #888; font-weight: 500; } .pdp-specs__list .value { font-weight: 600; text-align: right; } .common__icon { background-position: 50%; background-repeat: no-repeat; background-size: contain; border: none; display: inline-block; height: 24px; overflow: hidden; text-indent: -9999px; vertical-align: middle; width: 24px } .common__icon--small { height: 16px; width: 16px } .common__icon--medium { height: 18px; width: 18px } .common__icon--arrow-down { -webkit-transform: rotate(270deg); transform: rotate(270deg) } .common__icon--arrow-up { -webkit-transform: rotate(90deg); transform: rotate(90deg) } .skip-nav-link { background: #111; border-bottom: 1px solid #fff; border-bottom-right-radius: 8px; border-right: 1px solid #fff; color: #fff; left: 0; padding: 6px; position: fixed; top: -40px; -webkit-transition: top 1s ease-out; transition: top 1s ease-out } .skip-nav-link:focus, a.skip-nav:focus { color: #fff; outline-color: transparent; position: fixed; top: 0; -webkit-transition: top .1s ease-in; transition: top .1s ease-in; z-index: 10010 } #header-end { left: 0; position: absolute; top: 0; z-index: -1 } template { display: none } a { background-color: transparent } a:active, a:hover { outline: 0 } button, input { color: inherit; font: inherit; margin: 0 } button { overflow: visible } button { text-transform: none } button { -webkit-appearance: button; cursor: pointer } *, :after, :before { -webkit-box-sizing: border-box; box-sizing: border-box } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } button, input { font-family: inherit; font-size: inherit; line-height: inherit } a { text-decoration: none } a:focus, a:hover { text-decoration: underline } a:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px } .img-responsive { height: auto; width: 100% } [role=button] { cursor: pointer } h1, h2, h3 { color: inherit; font-family: inherit } h1, h2, h3 { margin-bottom: 10px; margin-top: 20px } p { margin: 0 } .container { margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 0 } .row { margin-left: 0; margin-right: 0 } .col-xs-12 { min-height: 1px; padding-left: 0; padding-right: 0; position: relative } .col-xs-12 { float: left } .col-xs-12 { width: 100% } @media (min-width:768px) { .col-sm-12 { float: left } .col-sm-12 { width: 100% } } @media (min-width:1024px) { .col-lg-6 { float: left } .col-lg-6 { width: 50% } } @media (min-width:768px) { .navbar { border-radius: 4px } } .visible-lg { display: none !important } @media (min-width:1024px) { .visible-lg { display: block !important } } @media (max-width:767px) { .hidden-xs { display: none !important } } @media (min-width:768px) and (max-width:1023px) { .hidden-sm { display: none !important } } .btn-default { -webkit-box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075) } .btn-default:active { -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125) } .btn.active, .btn:active { background-image: none } .btn-default { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), to(#e0e0e0)); background-image: linear-gradient(180deg, #fff 0, #e0e0e0); background-repeat: repeat-x; border-color: #ccc; -webkit-filter: progid:dximagetransform.microsoft.gradient(startColorstr="#ffffffff", endColorstr="#ffe0e0e0", GradientType=0); -webkit-filter: progid:dximagetransform.microsoft.gradient(enabled=false) } .btn-default:focus, .btn-default:hover { background-color: #e0e0e0; background-position: 0-15px } .btn-default.active, .btn-default:active { background-color: #e0e0e0; border-color: #dbdbdb } [class^=icon-] { font-family: sgh !important; font-style: normal; font-weight: 400; line-height: 1; speak: none; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .icon-close:before { content: "" } .icon-logo:before { content: "" } .container-custom { display: block; margin: 0 auto; max-width: 1160px } .container-custom .col-20p { float: left; width: 20% } @media screen and (max-width:1160px) { .container-custom { padding: 0 15px } } #pdp button:focus { outline: revert !important } h1, h2 { letter-spacing: normal } h2 { font-weight: 300 } h3 { letter-spacing: normal; line-height: 1.64 } .btn { -webkit-box-shadow: none; box-shadow: none; font-family: Helvetica Neue, sans-serif; font-weight: 400; letter-spacing: normal; padding: 9px 10px; text-shadow: none; -webkit-transition: all .6s } .btn.cta-secondary { background: #fff } @media screen and (max-width:767px) { .icon-close:before { content: "" } } .sgh-header { left: 0; position: fixed; top: 0; z-index: 10000 } .sgh-header a.sgh-logo:hover { text-decoration: none } .sgh-header .desktop .sgh-logo { color: #222; font-size: 2.1rem; padding: .5rem .5rem .5rem 0 } .sgh-footer { background: #fff; border-top: .1rem solid #ccc; padding-top: 4.8rem; position: relative; z-index: 0 } .sgh-footer a { color: #555; display: block; font-size: 1.2rem; font-weight: 400; letter-spacing: normal; line-height: 1; min-height: 4.4rem; min-width: 4.4rem; padding: .5rem } @media (min-width:768px) { .sgh-footer a { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content } } .sgh-footer a:active, .sgh-footer a:hover { text-decoration: underline } .sgh-footer h3 { color: #555; display: block; font-size: 1.2rem; font-weight: 400; letter-spacing: normal; line-height: 1 } .sgh-footer .text-bold { font-size: 1.4rem; font-weight: 500; line-height: 1.17; margin-bottom: 1.9rem } .sgh-footer .text-bold.chat-bot-footer-btn-title { margin-bottom: .8rem } .sgh-footer .follow-us-box a { display: inline-block } .sgh-footer .lang-selector-box h3 { display: inline-block } .sgh-footer .payment-box a { display: inline-block; margin-bottom: 0; text-decoration: none } .sgh-footer .payment-box a:hover { text-decoration: none } .sgh-footer .payment-box img { display: inline-block; max-width: 32px } .sgh-footer .sgh-after-footer { border: none; border-top: .1rem solid #ccc; height: auto; margin-top: 4rem; padding: 1.4rem 0 } .sgh-footer .sgh-after-footer span { font-size: 1rem } .sgh-footer .sgh-after-footer a, .sgh-footer .sgh-after-footer span { color: #555; font-weight: 400; letter-spacing: normal; line-height: 1.6rem } .sgh-footer .sgh-after-footer a { display: inline-block; font-size: 1.2rem; margin-bottom: 0 } @media screen and (max-width:1023px) and (min-width:768px) { .sgh-footer .text-bold { font-size: 1.2rem } .sgh-footer .sgh-after-footer { padding: 9px 0 } .sgh-footer .sgh-after-footer .container-custom { padding: 0 104px } .sgh-footer .payment-box img { display: inline-block; max-width: 32px } } @media screen and (max-width:767px) { .sgh-footer { border: none; padding-top: 0; position: static } .sgh-footer .follow-us-box { padding-bottom: 30px; padding-top: 30px; text-align: center } .sgh-footer .follow-us-box a { color: #555; font-size: 1.6rem; font-weight: 400; letter-spacing: normal; line-height: 1.2rem; margin: 0 } .sgh-footer .sgh-after-footer { border: none; margin: 0; text-align: center } .sgh-footer .sgh-after-footer .col-copyright span { color: #4a4a4a; font-size: 1rem; font-weight: 400; letter-spacing: normal; line-height: 1.9rem } .sgh-footer .sgh-after-footer .col-tos { margin: 20px 0; text-align: center } .sgh-footer .sgh-after-footer .col-tos a { color: #4a4a4a; font-size: 1.2rem; font-weight: 400; letter-spacing: normal; line-height: 1.2rem; margin: 4px 0 } } .sgh-footer .sgh-after-footer .collapse-brands-footer { color: #555; font-size: 1rem; line-height: 1.4rem; text-decoration: underline } @media (max-width:767px) { .sgh-footer .sgh-after-footer .collapse-brands-footer { font-size: 1.2rem } } a, a:hover { color: #222 } a:focus, a:hover { text-decoration: none } .offer-list-section { overflow: visible !important } @font-face { font-family: sgh; font-style: normal; font-weight: 400; src: url(data:text/plain;base64,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)format("woff") } html.cm-home { background: #fff } input:focus::-webkit-input-placeholder { color: transparent; opacity: 0 } .container-custom { position: relative } .common__icon--account-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2218%22%20fill%3D%22none%22%20viewBox%3D%220%200%2018%2018%22%3E%3Cg%20fill%3D%22%23000%22%20clip-path%3D%22url%28%23bhtge5fzda%29%22%3E%3Cpath%20d%3D%22M9%209.75a4.88%204.88%200%20004.875-4.875A4.88%204.88%200%20009%200a4.88%204.88%200%2000-4.875%204.875A4.88%204.88%200%20009%209.75zm0-9a4.13%204.13%200%20014.125%204.125A4.13%204.13%200%20019%209a4.13%204.13%200%2001-4.125-4.125A4.13%204.13%200%20019%20.75zm3.913%2010.5H5.087C2.277%2011.25%200%2013.869%200%2017.1v.15c0%20.414.336.75.75.75h16.5a.75.75%200%2000.75-.75v-.15c0-3.231-2.277-5.85-5.087-5.85zm4.337%206H.75v-.15c0-2.812%201.946-5.1%204.337-5.1h7.826c2.392%200%204.337%202.288%204.337%205.1v.15z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22bhtge5fzda%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h18v18H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E) } .common__icon--arrow-down-bannertop-white { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20fill%3D%22none%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M47.707%2013.207l-1.414-1.414L24%2034.086%201.707%2011.793.293%2013.207%2024%2036.914l23.707-23.707z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--arrow-down, .common__icon--arrow-up { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226%22%20height%3D%2211%22%20viewBox%3D%220%200%206%2011%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23555%22%20stroke-linecap%3D%22round%22%20d%3D%22M5.143.143l-4.286%205%204.286%205%22%2F%3E%3C%2Fsvg%3E) } .common__icon--arrow-right-menu { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2218%22%20fill%3D%22none%22%20viewBox%3D%220%200%2018%2018%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M4.765%2017.89L13.655%209%204.765.11l-.53.53L12.595%209l-8.36%208.36.53.53z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--camera-black { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2217%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2017%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M22.5%202.993h-4.293L15.853.64A.499.499%200%200015.5.493h-7a.499.499%200%2000-.354.147L5.793%202.993H1.5c-.827%200-1.5.673-1.5%201.5v11c0%20.827.673%201.5%201.5%201.5h21c.827%200%201.5-.673%201.5-1.5v-11c0-.827-.673-1.5-1.5-1.5zm.5%2012.5a.5.5%200%2001-.5.5h-21a.5.5%200%2001-.5-.5v-11a.5.5%200%2001.5-.5H6a.499.499%200%2000.354-.146l2.353-2.354h6.586l2.354%202.354a.499.499%200%2000.353.146h4.5a.5.5%200%2001.5.5v11z%22%2F%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M12%204.993a4.505%204.505%200%2000-4.5%204.5c0%202.482%202.019%204.5%204.5%204.5s4.5-2.018%204.5-4.5c0-2.481-2.019-4.5-4.5-4.5zm0%208c-1.93%200-3.5-1.57-3.5-3.5s1.57-3.5%203.5-3.5%203.5%201.57%203.5%203.5-1.57%203.5-3.5%203.5z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--carousel-arrow { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22none%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M11.128%201.372l-.59.59%207.623%207.621H0v.834h18.16l-7.621%207.622.589.589L19.756%2010l-8.628-8.628z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--cart-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2218%22%20fill%3D%22none%22%20viewBox%3D%220%200%2018%2018%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M15.403%204.81a.746.746%200%2000-.747-.685h-2.28v-.75A3.38%203.38%200%20009%200a3.38%203.38%200%2000-3.375%203.375v.75h-2.28a.746.746%200%2000-.748.686L1.57%2016.779A1.128%201.128%200%20002.692%2018h12.616a1.128%201.128%200%20001.121-1.221L15.403%204.811zM6.375%203.376A2.628%202.628%200%20019%20.75a2.628%202.628%200%20012.625%202.625v.75h-5.25v-.75zm-3.03%201.5h2.28V6.75h.75V4.875h5.25V6.75h.75V4.875h2.28l.836%209.75H2.51l.835-9.75zm12.24%2012.253a.371.371%200%2001-.277.122H2.692a.371.371%200%2001-.276-.122.37.37%200%2001-.097-.285l.125-1.468h13.112l.126%201.468a.37.37%200%2001-.098.285z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--delivery-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M23.826%2013.174L21.48%209.522A1.153%201.153%200%200020.51%209H17V4.547a1%201%200%2000-1-1H6v1h10V18H5.929c-.224-.86-1-1.5-1.929-1.5s-1.705.64-1.929%201.5H1v-2.5H0V18a1%201%200%20001%201h1.071c.224.86%201%201.5%201.929%201.5s1.705-.64%201.929-1.5h12.142c.223.86%201%201.5%201.929%201.5s1.706-.64%201.929-1.5h.928c.631%200%201.143-.497%201.143-1.11v-4.127c0-.208-.06-.412-.174-.589zM4%2019.5a1.001%201.001%200%20010-2%201.001%201.001%200%20010%202zm16%200a1.001%201.001%200%20010-2%201.001%201.001%200%20010%202zm3-1.61c0%20.053-.058.11-.143.11h-.928c-.223-.86-1-1.5-1.929-1.5s-1.706.64-1.929%201.5H17v-8h3.51c.052%200%20.103.025.127.063l2.348%203.652c.01.015.015.032.015.048v4.126z%22%2F%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M9%206.5H4v1h5v-1zm-2%203H2v1h5v-1zm-2%203H0v1h5v-1z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--favorites { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23222%22%20d%3D%22M14.781%203.778a5.535%205.535%200%20013.934.308c1.419.668%202.478%201.76%203.01%203.093.543%201.363.509%202.892-.128%204.353-.892%202.05-3.929%205.39-9.148%2010.1l-.37.334-.37-.334c-5.22-4.71-8.256-8.05-9.148-10.1-.637-1.462-.67-2.99-.128-4.353.532-1.333%201.591-2.426%203.01-3.093a5.53%205.53%200%20013.934-.308c.996.293%201.941.98%202.702%201.898.76-.918%201.706-1.605%202.702-1.898zm5.803%207.313c.52-1.194.547-2.417.114-3.502-.426-1.068-1.283-1.952-2.453-2.503a4.427%204.427%200%2000-3.152-.247c-.936.275-1.87%201.044-2.555%202.069l-.46.686-.458-.686c-.686-1.024-1.62-1.794-2.555-2.07a4.433%204.433%200%2000-3.152.248c-1.17.55-2.027%201.435-2.453%202.503-.433%201.085-.406%202.308.114%203.502.786%201.807%203.633%204.96%208.505%209.385%204.872-4.425%207.718-7.578%208.505-9.385z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--info { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2217%22%20fill%3D%22none%22%20viewBox%3D%220%200%2016%2017%22%3E%3Cg%20fill%3D%22%23000%22%20clip-path%3D%22url%28%23clip0_282_16350%29%22%3E%3Cpath%20d%3D%22M8%20.941c-4.411%200-8%203.59-8%208%200%204.411%203.589%208%208%208s8-3.589%208-8c0-4.41-3.589-8-8-8zm0%2015.333c-4.044%200-7.333-3.29-7.333-7.333%200-4.044%203.29-7.333%207.333-7.333%204.044%200%207.333%203.29%207.333%207.333%200%204.044-3.29%207.333-7.333%207.333z%22%2F%3E%3Cpath%20d%3D%22M8.333%206.941h-.666v6h.666v-6zm0-2h-.666v.667h.666V4.94z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_282_16350%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h16v16H0z%22%20transform%3D%22translate%280%20.941%29%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E) } .common__icon--loading-spinner { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20id%3D%22Layer_2%22%20data-name%3D%22Layer%202%22%20viewBox%3D%220%200%20360%20360%22%3E%3Cdefs%3E%3CclipPath%20id%3D%22clippath%22%3E%3Cpath%20d%3D%22M327.27%20117.36l-.12-.28-.09-.23c-2.11-5.1.32-10.95%205.43-13.06s10.95.31%2013.05%205.42l.13.32-18.4%207.84z%22%20class%3D%22cls-1%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clippath-1%22%3E%3Cpath%20d%3D%22M244.33%2011.84l.32.12c5.17%201.93%207.81%207.69%205.88%2012.86-1.93%205.17-7.69%207.81-12.86%205.88l-.2-.08-.29-.11%207.15-18.68z%22%20class%3D%22cls-1%22%2F%3E%3C%2FclipPath%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22Layer_1-2%22%20data-name%3D%22Layer%201%22%3E%3Cg%20clip-path%3D%22url%28%23clippath%29%22%3E%3Cimage%20width%3D%2235%22%20height%3D%2247%22%20transform%3D%22translate%28311.01%2071.35%29%22%20xlink%3Ahref%3D%22data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAACMAAAAvCAYAAABpG3MiAAAACXBIWXMAAAsSAAALEgHS3X78AAAA10lEQVRYhdXZ2wqDMBAE0LH4%2F79cXxoJNLZ738mAPupwNhAvQFzen8OcM6hESI6kEqbramXCFFaRlkktMfKP01NCPaqVTInCKnP7jBIqnTOphCmv7gJzBmOmjnhUlDIAgQ6VzFzGs0%2BFpEpGtASoxrQaTdtCppcBmnSoZKjK%2FFpQ5aPaRgYo1qGSoSoj2RzLRrWdDFCks6UMUKBDJUNVRvvcmzqqrWWARB0qGaoy1he3lFFFfHqNyHGfjPHqfN27Q%2BYRwPuyL9UR3SdbRv2Bsb1EZNx%2FU0YuP4AbVbA%2Fb8UAAAAASUVORK5CYII%3D%22%2F%3E%3C%2Fg%3E%3Cimage%20width%3D%22361%22%20height%3D%22361%22%20transform%3D%22translate%28-.99%20-.65%29%22%20xlink%3Ahref%3D%22data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAWkAAAFpCAYAAABee9lOAAAACXBIWXMAAAsSAAALEgHS3X78AAAgAElEQVR4nO3decwdVRnH8XPLKxAUJRqNiWsIUYNGBRWxstQWWkCgFCg7KEjciLiLikqIKCqioFaWlk2o7MgOsgkiigvEjUgwGNwNwQW1grQ6%2FoHzct5zz%2FKcM2f27ydp%2Bt6Zufd9e2fur8%2F7zJkzEwX0XFEUhW%2F9ZDKZNPWzALlx8KJzQqFbJwIdXcMBiUa0Gbx1ItRRNw4wZDPUIK6CEEdVHEBIRijHI7QRiwMGUQjmvAhthHCAwItQbh7BDR0HA%2BYglLuFwAYHwMgRyv1BYI8TO31kCOVhILDHgx09AgTzsBHYw8bOHSiCeZwI7OFhhw4M4QylCOshmWn7B0AehDMwTIR0jxHMwPDxK1EPEc7wodUxLFTSPUI4A%2BPD%2F7g9QDhDiip6eKikO4xwBkBIdxDhDKDEr0YdQTCjKlodw0Ql3TLCOU7OIOK9Rx%2FwP29LCIgndL0C7Mu%2B6vr7iDTs1Ib15QOf21ADpCv7c6jvLwjpxnTlw9yEsQdGG%2Ft67O%2F5kLFjGzDkgCYcZOo8BtgHw8bOrdEQw5lAyCPnscE%2BGTZ2bg2GFs6EQL2qHi%2Fsn2Fj52Y2hIDmQ9%2BumGOIfTV87OBM%2Bh7OfNi7KXRcsd%2BGjx2cQZ8Dmg95P9iOMfbdOLCTK%2BhrOPPh7rfyuGM%2FjgM7OVHfApoPNNBPfHAjEc4AmsQHOEJfAppgBoaDD7NQHwKacAaGhw91AOEMoE18uD26HtCEMzB8fMgduhzQhDMwHnzYDYQzgC7hQ6%2FpakATzsB48eH%2Fvy4GNOEMYF7bP0AX%2FPe%2F%2FyWgAXTS6O8W3rWAJpwB6EYbCLZwbjMfCWcANqMMBl%2F13EZWEtAAXEYXDpL2RlOZSTgDCBlVSPznP%2F8p5%2BENblt3fhLQACRGExRlQCslD%2BA6cpRwBhBjFEPw9IBWSqm2hkQT0ABiDT40zIDWNdX2IJwBpBp0ePgCulR3UBPQAKoYbICsW7euyNl7js1awhlADoMMknXr1tVykjDitQb5vgJo3uBOHOoBHUNyMlGyDQENIKdBBYoroGNyM7Staz3hDKAOgwmWUAVdZ1AT0ADqMohwiWlx5OpRl%2BsJaAB16n1Peu3ata3M118UBQENoHa9Dpm1a9fOSeecLY3QNvPmzev1ewegH3obNGZAK5U0ljl6G8IZQJN63%2B7QFUWRfV4O%2FfUIaABN62Xo2KpoU%2B6Z7tZbb71evlcA%2Bq13wSMJ6FKuHjUBDaAtvQqfxx57TDxpv65KVU1AA2hTbwKoDGhd3aM5CGgAbevFiUNbQNdBP0lIQAPogs4HkSSgc1fUMzMznX9fAIxDp8MopoLOFdQENIAu6UW7QyJmfLRrWwIaQNd0NpT%2B%2Fe9%2F1zqSw9yWgAbQRZ0MpjKgS3UHNQENoKs61%2B549NFHp3oRsZd6x2xPQAPoss6FtFL2OThi5%2BWQbP%2BkJz2JgAbQaZ0KaVsVbcpVVRPQAPqgMyH9yCOPWNscOWa1M1%2BDgAbQF50JaaXcoWwuTwnvNu7eAgBVdSKk%2F%2FWvf81JUGmgpgQvVTSAPmk9sMqAdg2bsy233K1b9L3WX3%2F91v%2B9ABCjE5W0Uv5WR2hbSfuDgAbQR60G15o1a4rcFbRtGQENoK9aC681a9bMlr7SsJVuqz8moAH0WSfaHZKWRsy2ddyQFgDa0EqV%2Bc9%2F%2FrPyyULbMvPxBhtsQBUNoNcaD7EyoGd%2FgJqCmoAGMASNtjv%2B8Y9%2FOCdPss3VYds2tF1RFAQ0gMFovCft6zNLJ1WqOvkSAPRFYyGtV9G%2BQI05WWiz4YYbUkUDGIzGQjp2BIarrWG%2Bho6ABjA0jYTa3%2F%2F%2Bd%2B%2BY6NjltmUbbbQRAQ1gcFrpSce0L2K2BYChqb36fPjhh7OMibatK7%2BmigYwVI32pKXLpb3qoigIaACDNlPni5dVdEkPWL0iLpfblpnLAWBMaku%2Fv%2F3tb942h2%2Bd9MrCJz%2F5yaQ3gEGrvd3hG2onvV1WuUxHQAMYg1pC%2Bq9%2F%2FWvUTWXrvLchAPRZbZV0KHhjwtbc9ilPeQpVNIBRyB52tira13suiiJqxruNN96YgAYwGtkr6aoT%2BIdeBwDGJGtV%2Bpe%2F%2FCV4%2BXfKunLZU5%2F6VKpoAKNSe086prJ2raOCBjBW2SrTP%2F%2F5z1nHRZvLn%2Fa0p1FFAxidWnrSMZeA68upoAFgrizV6UMPPVTYrgh0jdzQt5Es32STTaiiAYxStkraduGJ%2FrfrOaHlBDSAMasc0g899JBzEiV9metEYsrwPAAYi8oh7QvelN40VTQAPCFru8O1XHKHcCpnAJhWqVJ98MEHp04Yzr5wxeVPf%2FrTqaIBDEWhEvM2S7sjdjk9aAAjUGh%2FkiVXqw8%2B%2BKDzG1e9n%2BEznvEMqmgAfeUL5ehsS66kq1y0In0dAOiRylWzTeV7HNruT6gvN9f5lk8mE6poAH0iDuX%2F511RFEVUxiWF9J%2F%2B9CfrnVeMH2bOOltbwwx4KmoAPREbzsmSK%2BlQKJfLy4A2Azh0t3AA6CBROOfMsuhX%2BuMf%2F1jbsLtnPvOZpDSArsleNce0PJIq6VAf2tef1tfrVTZVNIAOCga0NLtc5%2BZCKo2T9k0xKh39UX5NFQ2gTyaTSTCgy%2FVVitCokP7DH%2F5QuOZ8jr0LC0PvAPRNGcyScPYF9Lx588Thl1RJS6pkX3VtVtLPetazqKIBdNFsNkmqYUmAS1%2BrJO5J%2F%2F73vxcPuzOD2jX8jj40gK6TtjQkr5OSe1GVtPQGsjFzRtPyANBH0qq53Fb%2FWyml1ltvPVH4VRrdYf4A%2BjpbFW2rvJ%2F97GdTTgPorKIoJpPJJHijbVOuToGokv7d7343dcJQJ6mwucksgD6L6UlLA3pmZiYYhMntjtBtskLPV4oqGkA%2FuC4%2B0dsYsVW2OMglG5nNbumJQfOHcr0eAPSFeQIw92gOk7gnnRrIodcDgL6QBnPUELuZmWLdunXOJwRf6be%2F%2Fa03TVP%2FF3nOc55DKQ2gV0IjMlIrZl9IByvp0Ax1vtnwpK8BAH1UNdMkzxefOAxd%2Fm2u4z6GAIao6nwcsSNAvFv9%2Bte%2Fdk5Lqn9DpfwnA83lz33ucympAfSSZNicSRLIa9eutW4U1e4IXaAivQMLAAxZyvSlLtGjO8qvJT1q84eg3QFgqGLn8JDyhnTMsDvJdpPJRD3vec%2BjnAbQW%2BvWrZuULY%2FY7kBKP9t54vCBBx6YTVfXNKMmThwCGIOUOaVD26%2B%2F%2FvrWgHRW0lUuXrEFNf1oAEOlD6DQH5tf%2B57rEhyCF6qO9W2oogGMWY67tpiix0n7vtYf29ojz3%2F%2B8ymnAfTe2rVrJzG30ir%2FjqmwS9aQ%2FtWvflWEphi13QbLhSoawNjEVsxKKbXBBhtMhaV4FrzyG9mG30l60AQ1gKGq8%2FJwayXtu92Vvj5mbukXvvCFtDoADMZjjz02USptGJ75xyeqkrb9QHpQhyptABiSuueSVspSSd9%2F%2F%2F1T46N1vjHTvpOGADAGMVWyzYYbbjgnOKcq6dixzdIx0wAwVDmuA3G9huiy8JgfJuUuLQDQR1WmK5WaaneEKl%2Bz3SHZftNNNyWpAQzOo48%2BGsy22BOFJmsl7Qpe38x35sxOVNAAxqaO3BNfcaiUv4p2nUQEgCGrcpLQfH75Z6ONNpoN0DmV9H333VeY1bBv7mil%2FFU0QQ1grFK6C7ZtvJW09OIV31C8zTbbjL4HgMF65JFHpjLOnK%2FDF9ChS8fnVNKhqrncRv%2B7fHHzuVTRAMai6u2yfBMvBcdJS8p1M7glbRIAGLKYeaR98%2FdHjZOOvWUW1TSAMUgJZOnzp9od5pMkJw7Nb0YVDWCszEA2s9D22FdJz544vPfee%2BekrW2InaRCds03DQBDZjtB6DuBGLoH4sYbb1wopYW0L1R9d2XxXX344he%2FmHIawOCtWbNmNutCVxdKRnvo2zhPHIZOGoYCnXYHgLFxhbL5OCYng3cLtz02v4ntG9LqADAmrvHOtnyMKWJnQzrmpKGv%2FRH7AwDAkEnGRvsEJ1jyVdAuVNEAxiY0iiOV6PZZJd%2BESiWqaABjVcf80jNKKXXPPfdYJ1YyXyDmsnEAGJOqbQ2bTTbZpHDeLdx87JtsyTb8bvPNN6ekBjAaDz%2F88KTqBP82M0ql9Z3N59keAwDCzOmd9ez1TrDkC93YsX4AMDa%2B8PVtr5utpGOD1jcCBADGKLUvbbtRytQVh5LRGpw4BAA5X%2Fj6ttcFh%2BCl9J2ppgGMUa4RHlM9addl3alhSzUNYOxCk%2FpL%2B9TO%2BaTNFwndaJbqGQBkkyy5ltmIrjiUtDyongGMnWsSJWkl7Txx6KqY9WWuO65wFxYA8KtSXXvbHfoy311Z9BB3fSMAGLqYkRvSotd74tC2zPVDSC%2BCAYChk9wkJXsl7VtGFQ0AeYbgWSvpGKHQpooGgOonDktTEyyVT5IOuWMYHgA8LqaSTmp3lFKH3FFFAxi73MXqPKWqhbBt2RZbbEFJDWB06ugmzNx9992FUvmDGgDGJnRhSsqyeVtuuSVVLwBkZrs7S8oy6%2B2zAADdMNuTzvnnrrvuov8BYHRc9zf0LbM9Xxc9ThoAICMZZhfappZ2BycSAYyRrVq2bRPDejELACBdKKjN5b6rD2l3AEDDYloe1naH7YrDmDHTVOYAxsg8QWj%2BbW4bWqeUp5LmQhYASJcjqIuisA%2FBq4rgBjBG0uo45vXEPWnpXQQIaABjJglqMzt9l4aLZsHzLSeUASBOzInD7EPwCG0AY%2BXqLLgmU5LkZVK7IzRrEwAgXDH77iFLuwMAMqtStLoCfJ5SSm211VaTHKM7co4QAYC%2BMidack2wJCFqd3BvQwDIQxrUZcZOXXEYqoZt62zL7rzzTsppAKPxghe8oLBVzKnK15mtpHP0m2lzAMDjpEGtjwCxZWiWdgcAjJ2ZjdIhdq72R1EU6je%2F%2Bc1kKqRDvWbCGQDcXKM0XGOkXWE%2B52IW8wV8y1K2AYChs4Wt7yShJMyVErQ7CGEAkPFVzb72hy%2FMvZU0ACCeq0qWBLaJO7MAQEWbbrppoZSs2PXNkmd7jagb0epPNuegtv254447KM8BjIbtziyxY6bL5zzwwAMTpQJzd9j6KzFtEVooAMYg9qRhSTJcb7aSnj9%2F%2Fuz8HfoLpAYtAQ1gTFKuNrRV3c4Th7EIYQCw81XOkgsCxTeirXp1IUEOYAxct8LybWe7lZbtuXNOHJqTK%2BVod9x%2B%2B%2B0kNYDB2myzzeZkXOyJQzO4ze3nhPQ222wjaqaYIW77AwBj4AphW%2FhK%2B9aidkfJNfCaS8YB4HHSdofrOebz7r%2F%2F%2FtmVottnSQOZGfIAjI1ZxKZOTOeqrr2z4IWkhDkADE2oQPUFd%2Bi5oisOXT1oyfOKolC33XYb6Q1gcF70ohdZTxpK%2B86SC16mQnrbbbedKGUf6RHCyUMAYxIK45SRHqKLWWJ60KFtCWsAQ2eeOPT1qUPjo3%2F5y1%2FOSWnx7bNSRngQ0ADGxjbLXUxwm5w96dztjltvvZXEBjAYL3nJSwqzneEi2ca1vlK7Q4JqGsDQuapn37Y6X05aK%2Bntt99%2B6lVSLhUnoAEMVexJQ8lr3XfffVMbRt3jkB40AMwVqp6lPWqXYE%2FaRzLkTl9%2Fyy23kOIAem%2FzzTe3Zpl0nHRoDmld0nzSVNQAxi53%2F1l8MUtpwYIFUxe1SKtrABgy293AY680NLe99957rU%2F0XhYe2%2B6QtDxuvvlmUhxAb730pS8tlAoPuZPeRiu0XVS7I%2BYqQ2bEAzB0MReslNuEXsckvuIw9E3M9YQzgCFyFaC2FkhoG9vrmILtjhwjPMztbrrpJhIcQO%2B87GUvm80uVw86Znx0uc0vfvEL54bekF64cGHyRS0pF78AQJe5es2%2BHrQZ5jH9aqUietLSlodkO0IbQJ9JWx7mNuakSpUuZtG%2FgbSNId1OKaVuvPFGkhpAb7z85S%2Bfyizp5EqhKtsnGNKLFi2a8wq52h1U0wD6xtaHjp2fw9zunnvu8T5RdPusknTkRmg7AhpA3%2Fl606GThzF9aVFIL1q0aFK15WFbf8MNN5DWADrvFa94RREKZZvQPQwlQZ00d0epyrzTVNMA%2BsZ3kZ55WyzbCUPz%2BT%2F%2F%2Bc%2BDKR0d0tKrDQlhAEPwyle%2BsjBzzXcloSuQdTFD8MQ96R122EHU8nD9UK4Tiddffz1pDqDTQicHpeOkY8K5FHXi0BQ7Mx7VNYC%2BsV1RaFteLpPex%2FBnP%2FuZKLGjQzp2THToRKJSVNMAummLLbawzngXunow5oRiSFRI77jjjs5Xlgy7cwU3FTaArkttabTa7lAq3Iv2LdfXXXfddSQ1gM7Ycssti1DouoTW%2FfSnPxWndS23z5JsQ%2FUMoC9cI9Z8I9lyzakfXUkvXrw4S8vDthwAusrVtgi1M8zlP%2FnJT6J6HpXbHUpVa3noy6%2B99lqSGkDrXvWqV1lbHRKuS8Ib7UkvWbJkzk1qbUIjPKieAfSBZGy075LvlGDWJVfS0jmlbet8oX3NNdeQ3ABa8%2BpXv9o6JamvnaH%2FbVOu%2B%2FGPfxyd2JXm7iiFQtnXXKeaBtA1qScEJfN3xEqupHfaaafgd3T1qUP966uvvprkBtA4vYquOswutI1ULbPgSW8GIH0OADTBVkHrQRuzztzm7rvvTkrsLKM7SqF%2Bc0yoX3XVVaQ2gMa85jWvmVNF20gu9c5RPesqhfTOO%2B%2FsHeURexMAfR0AtEF6IjDmJGJqFa1UpsvCY5aHnqOvo5oG0IStttrKe%2BcVF8l8HlVVDulddtll9qeQVMcxFTcVNYAmSa8atK13qVJFK5WxJx17slDap77yyitJagC1ee1rX2sdF20Tc%2Fl3LllCWq%2BmdSlXFXIlIoCm5Wx16MvvuuuuyqmddXSHUvW0PK644gpSG0B2ehVdpUL2nUSsKmtt7roIpcol5LqlS5fm%2F10CwChtvfXWRcqEcL6rEfXn%2FuhHP8qSV1kuC7dJvRycE4gAmuK6xNt1kYqkOg6FeKys7Y5dd911zr8gZey0z%2BWXX05aA6hs6623npMlsa2JUAskVxWtVA2VdOr46JjXAYAqfJd%2F%2B6pqc73ksvCqaunxmheh5AhnffmyZcvoTQNI8rrXvS45nyTP%2BeEPf5g1n2rtSceuYzpTAHWaP3%2F%2B1MlC3%2F0LlQpPSWpbnlP2IXhKKbXbbrtFjZu2LffNlnfZZZeR2gCSxA6zi1n3gx%2F8IHtK1xLSutDc0THjqfXHBDWAGPPnz88yy13suqpqC%2Bndd999zpweppj5OrgKEUBuKYHsuyy8jipaqZoraT2oS7HTmtqq6fLPpZdeSnIDCHr961%2FvvPt36ix2dVbPutrbHbqqJwxt211yySUENQCnbbbZZmpMtBmwkhvN2pTrvv%2F979eW2LWH9NKlSyfS6lnvRYcCmvYHgDqknFisU6OVdCnmqkPJthdffDGJDWBKWUWnVM%2FSqvrOO%2B%2BsNaUbuyikvKS76oUtvmXLly%2FnIhcASimltt12W2fmpF5IZy6vO6CVarCSdrUwbC0PSbvD9poXXXQRFTWA2YBWSj6NaOwJxMGdODQv5U75n4w%2BNIBcqvaev%2Fe97zWS0q31pCXLfNu6Km2qaWDctttuu6mbyuboPfu2r1PjPVzzSsHcPery8b777kt%2FGhiZ7bbbLvvkbrZ13%2F3udxvLl1Yq6VIdJxFLF154IRU1MCLbb7%2B9tYK2qdLqaDKglWohpPfcc8%2BJUnFtjByhDWAcpEPtUi4Jb0NrLQH9ku66Wh5KKbXffvvR9gAGbsGCBVNTkOaex14ppe64447G86S1dsdee%2B3lrKhdy1Oq5%2FPPP5%2FyGhiwBQsWWD%2FjMZVv16pnXed60lXaG67LzAlqYJj0gJb2mX3tD99IjzaqaKVabHeUygmSqlTUkucWRaEOOOCA1v%2B9APJ4wxveMNXiKOUY5qv7zne%2B01p2tFpJK6XU3nvvHX0XlxDmnwbGIXb0Rsq2bQa0Uh0IaaXcQW2StDd826xevZrkBgZg4cKFs8Ptcgyzi2l%2FNK0TIa2TDMOTVsq2bQhqoN8WLlw49RlOuXJQ4vbbb289pTsT0suXL59UGfsc2k5ff9555xHUQA8tWrRoagJ%2F3%2BNyWcwkS%2BXyLgS0Uh04cWjS595IOWkY85yDDjqoc%2F9%2BAHZ6QFe5KYgkI7797W93Jhs6U0nrUqcvja3Ezz33XCpqoAd22GEH72fVrJZje8ld6D27dC6k99lnn6STiJJtbEFPUAPdZgtoSQsjtU%2FdpSpaqQ62O0rlBEmh6jjHpeNFUahDDjmks%2B8FMFZmQOf4vPuW33bbbZ3Lgc79QLoLLrjAu4Ny7bDyMUENdMeOO%2B5o7UGnXqgS2qaLAa1UB9sdLikXp8T2sc855xxaH0AH6AFtSr2VVZfn5%2FDpdEiXM9hJesuSsdOSoCeogXYtXrw4OC906n0LXYHc1SpaqY63O0r6BEmp%2FafYkSFvetObevHeAEOyePFiZ4sz9%2Fw%2B5bJbb72105%2F1TlfSpqYCuigKdfbZZ1NRAw1asmSJt4Kucpm267Lvrge0Uj0J6f3333%2FqakRpvzkloEsENdCMJUuWOKcclTyueteVLutFSCul5kwzWmV2vJjHSil11llnEdRAjXbaaafgZ0wawuY2vj71t771rV4kdm9CWqnHgzp1qtKYy0bNbc4880yCGqhBGdA5TgzGXLzSl4BWqmchrZRSBx544Jw3N8eoDkmoE9RAXjvvvLN3siSb1Eu%2F9W1vueWW3gS0Uj0Z3WGzevXqQlItTyaT4NWGJtf6oijUW97ylt6%2BZ0BX6AGdMoIj9cK2m2%2B%2BuXef395V0iVbRW0TOw916IA544wzqKiBCnbZZZeoC1Uk20naHH0MaKV6HNJKPTHVaB1D83zrVq1aRVADCWwBnXpHlJig7mtAK9XjdofOnMku99hp37rDDz98EO8hUKc3vvGNUxOm5WphhJ5300039foz2utKunTwwQc7h%2BelVNDSA6koCrVy5UqqasCjDGhTrku%2Ffdv0PaCVGkhIK%2FV4UOducYSeWyKoAbtdd93VO4Ijx4UqrvbIEAJaqQGFtFL%2BqUYlw%2BxC27ueWxSFOv300wlqQFMGdFN3SalyZ5YuG86%2FRPO1r32tCFXIVdaHqvG3ve1tg3xfAYnddtttqv9sPq76mQwtu%2FHGGwfzGRxUJV2Kraht20jX2Q6s0047jaoao1QGtFL%2BajZU6Urn47AtG1JAKzXQkFbq8alGUwI5tiXicuqppxLUGJXdd9%2Fde8znOFEY2uaGG24YVEArNdB2h06fya7KjHjmY%2Bm2RVGod7zjHYN%2FnzFeZjjHti1yDMX75je%2FOdjP2GAraVPOgI597VNOOYWqGoO0dOnSqTmgdSnD6GJHeAw5oJUaQSVd0qccrbOi1pfZtnvnO985mvccw7XHHnt4T87nPBnv22boAa3UiCrpQw891Hm%2FRJ%2FU7V3bffWrX6WqRq%2Ftscceoku7fXL0p8cQ0EqNqJIu6VOO1vm%2Fv%2BR5RxxxxOjef%2FTXsmXLitTfKnM9Lpddf%2F31o%2FnsjKaSLh122GHinVv117PQa37lK1%2BhqkYvLFu2bPbClJy3pkqpqMcU0EqNsJIu6VOOVr18vOq6oijUu971rtHuC3TXnnvuaf2c5Owvx3z%2BrrvuutF9Tkb3DzadccYZ2X6Fq9oOIajRJXpAKyUPaduyHG2Oa6%2B9dpSfj1H%2Bo036%2FNC5xkrHVA9myB955JHsF7Rmr732En0eqozuiH081oBWipCetWrVKm9FHfs4te2hL3v3u9%2FN%2FkFj9t5770Kp9Io510lB8%2FGYA1opQnoOc8rROvvQoW31rwlr1Gn58uVFjmM25bHv9a655hqOe0VIT1m5cmWwotaXVakuYgP7Pe95D%2FsL2Sxfvjy6rRG7bezzy8cE9BN4Ixz0%2BaHr7EPHbFcUhXrve9%2FLPkNl%2B%2ByzT22tjar96auvvppjXMOb4XH66adH9anr7FGbjwlrpCjDudTEiXHpY8LZjjclQJ8buom%2BXezX73vf%2B9iHCNp3330rtzZynkg3l1111VUcxw68MQJlUNfdh%2FZtK%2Fn6%2Fe9%2FP%2FsTs%2Fbbb7%2FoYK56IjClP01A%2B%2FHmCOmT%2BOc8cHP3rJVS6gMf%2BAD7dcT233%2F%2FqX6z%2Bbiu%2FnLMZ%2BHKK6%2FkOBXgTYp06qmnFqkHpbTKyBXyH%2FzgB9m%2FI3LAAQdEnQys%2B7c%2F2%2BNyGQEtxxuVoJzEP%2FasddMVtf74Qx%2F6EPt6gA488EBvKy6lSAi9Tuxjc90VV1zBsRiBN6sCc27oOirsnD3roijUUUcdxT4fgIMOOsgZzjmCuY4QJ5zT8KZlUIZ1U8Gbss627MMf%2FjD7v0cOPvhg0XGWK2xznBQsXX755RxriXjjMlmxYsXsEVlH78%2B1TvofQOi1P%2FKRj3AsdNAhhxxiPa5iKuhc61KeSzhXxxuY2YoVK4ocvWfptjn73OXfH%2F3oRzkuWvTmN7%2FZegzFHAO5grhKaH%2FjG9%2FgOMqAN7EG5R1XmuhLu56bq5d99NFHc4w04NBDD43qMTfxn3bK46IoCOfMeDNr9OUvf3nO0Zz719Hcve7Q1x%2F72Mc4XjI67LDDnD3m3CGdO4ht6y677DKOjxrwptasDOq6QzlnQEu2K4pCfeITn%2BD4iXD44YcHq%2BWUkE7Zxvc9Uh5feumlHAs14Y1tyJe%2B9KXZozo1eH3rc%2F7Km9r7POaYYzieNG9961uLKpVx6n7I8duWdFvCuX68wQ07%2BeSTxS0Q3%2FqcQZzyHGlQHHvssaM4xt7%2B9rcX0vekiUDO8Zuab%2F0ll1wyiv3aBbzRLSiDOleVU1dgV9lGEkjHHXdcr46%2FI444wlsZ1xnSuX4DilnnekxAN4s3u0UnnXSSuKrOva6uylmyjfR1jz%2F%2B%2BEaPzyOPPDJ7NVw1fHOHd%2Bixb93FF19MXrSAN70DTjrpJGs46OoK4irPr%2Bt5Varzqs%2FpWiDn%2Fs809BzbOsK5Xbz5HfLFL36xUCpPFdRE5eB9vvEAAAJvSURBVN1EoIdeo0oYNv0fQM7vHfO9fM%2F1bXvRRReRDx3ATuigL3zhC7OfmNwBm3u7Oqrqup%2BfI7jrXp%2F7vY9Zd%2BGFF5ILHcLO6LgTTzxRFNjm41zhW%2BXr1Mqvjeq6%2FLorIZ3ys8d8bXt8wQUXkAcdxE7piRNPPLHIHcrS12iioo55jaar66rPqes9i92vrm0I525j5%2FTM5z%2F%2F%2BUKpuAopZ8WVOyzarK6rrs9dxVf5mVK%2Bz%2Fnnn8%2FnvwfYST11wgknzPmExgamb9tcId129ZzztZr6Pjm29X399a9%2Fnc98z7DDeu6EE04ocoVt6HFdAZzjNZoK6ZzPSX39lNcjnPuLHTcQn%2Fvc5wql8lXHMdvVFdKSn6uNqrypkK%2F6vNWrV%2FP5HgB24gB99rOfzRLY0teoK7Bzfo%2B2K%2B0c%2Fy7p65133nl8rgeEnTlwn%2FnMZ7yB7VsXU71W2b7p%2Fwj6UgnHvMa5557LZ3mg2LEjcvzxx2cJ7Da%2BbrJCb%2Bu3gdj35pxzzuHzOwLs5JH69Kc%2FPRXY5uNQkEi2z%2FV1l0I6ddsc3%2BPss8%2FmMzsy7HAopZT61Kc%2BVcRW2LFtj9ivu9TuaPNnPOuss%2Ficjhg7H1OOO%2B64QhK0VYJcsk3TVWpXwv3MM8%2Fkc4lZHAzw%2BuQnP%2BmssNv%2Bum9tFNe2q1at4nMIJw4ORDv22GMLpfobzDleu8q2K1eu5HMHMQ4WZHHMMcfMJlGfwruJ733aaafxOUMyDh7U5uMf%2F%2FicJnRXgjnHa9uWnXLKKXyekB0HFRp39NFHdya89WWh1yiKQq1YsYLPDBrFAYdeOOqoo2rvg5988sl8HtA5%2FwPtqc2%2B1oSWnQAAAABJRU5ErkJggg%3D%3D%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clippath-1%29%22%3E%3Cimage%20width%3D%2247%22%20height%3D%2234%22%20transform%3D%22translate%28236.01%2011.35%29%22%20xlink%3Ahref%3D%22data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAC8AAAAiCAYAAADPuYByAAAACXBIWXMAAAsSAAALEgHS3X78AAAA7klEQVRYhdWYQQ6EIAwAqf%2F%2FM14sKQJVoKXtnDZZgRmTXUFIDDnnjJ8BALhrLWCFqHw1yEnIUGIkXg02jtiSryYyCOkuOCveTHooREW%2BTK4coSpfLaQQ0kyoId4sKhRiIl8W34yoBp8Ub0QWQtzIU%2F6GuJSncCHlC4%2FilF5EGHkKhoSURyCloOIAcFlL7HBFvOtIyDuPP9iQ8oj7h1SP5q%2FyjdcQ%2BrD63EN4i5iSp1iHvLcIy%2FtpixAxecTy8CJ6rtQMYXeV0kiHHJVHJCJGB5Kjb7lWQ1zIU2ZC3MkjXxG%2FzrAe6IVYv4leIj9w19y%2BGYAapqGqIwAAAABJRU5ErkJggg%3D%3D%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E) } .common__icon--minus-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2217%22%20fill%3D%22none%22%20viewBox%3D%220%200%2016%2017%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16%207.823H0v1.333h16V7.823z%22%2F%3E%3C%2Fsvg%3E) } .common__icon--pickup-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22%23000%22%20clip-path%3D%22url%28%23clip0_5810_16383%29%22%3E%3Cpath%20d%3D%22M19%2012H5v1h14v-1z%22%2F%3E%3Cpath%20d%3D%22M23%208c.552%200%201-.449%201-1V5c0-.551-.448-1-1-1h-1.4L20.251.628A1%201%200%200019.323%200H4.677a1%201%200%2000-.928.628L2.4%204H1c-.551%200-1%20.449-1%201v2c0%20.551.449%201%201%201h1v15H0v1h24v-1h-2V8h1zM4.677%201h14.646l1.2%203H3.477l1.2-3zM1%207V5h22v2H1zm5%2016v-7h4v7H6zm8%200v-7h4v7h-4zm7%200h-2v-7a1%201%200%2000-1-1h-4a1%201%200%2000-1%201v7h-2v-7a1%201%200%2000-1-1H6c-.551%200-1%20.448-1%201v7H3V8h18v15z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_5810_16383%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E) } .common__icon--rtr { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22none%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22%23000%22%3E%3Cpath%20d%3D%22M14.48%203.168L8.149.034h-.296L1.519%203.168l-.186.299v9.066l.186.299%206.333%203.133h.296l6.333-3.133.186-.299V3.467l-.186-.3zM8%20.705L13.649%203.5l-5.65%202.795L2.352%203.5%208%20.705zM2%204.07l5.667%202.804v8.256L2%2012.326V4.07zm6.333%2011.06V6.874L14%204.07v8.256L8.333%2015.13z%22%2F%3E%3Cpath%20d%3D%22M5.202%209.114l.725-.906-.26-.541h-2v.666h1.306l-.633.792.26.542h.067a.667.667%200%2011-.667.666h-.667a1.335%201.335%200%20002.667%200c0-.544-.33-1.012-.798-1.219zM11%207.667h-1v4h1c.735%200%201.333-.598%201.333-1.334V9c0-.735-.598-1.333-1.333-1.333zm.667%202.666A.667.667%200%200111%2011h-.333V8.333H11c.368%200%20.667.3.667.667v1.333z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E) } .common__icon--search-icon { background-image: url(data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2218%22%20fill%3D%22none%22%20viewBox%3D%220%200%2018%2018%22%3E%3Cg%20clip-path%3D%22url%28%237cvqob9jna%29%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M17.89%2017.36l-4.834-4.835A7.462%207.462%200%200015%207.5%207.5%207.5%200%20107.5%2015c1.936%200%203.695-.74%205.025-1.944l4.835%204.834.53-.53zM7.5%2014.25A6.758%206.758%200%2001.75%207.5%206.758%206.758%200%20017.5.75a6.758%206.758%200%20016.75%206.75%206.758%206.758%200%2001-6.75%206.75z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%227cvqob9jna%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M0%200h18v18H0z%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E) } .sgh-header { width: 100% !important } .sgh-header .sgh-main-menu__wrapper { padding-top: 4rem } @media (max-width:1023px) { .sgh-header .sgh-main-menu__wrapper { margin-top: 4.8rem; padding-top: 0 } } .sgh-header:has(.sgh-search-overlay.in) .main-menu-center { z-index: -1 } @media (max-width:1279px) {} .text-black { color: #000 } .bg-black { background-color: #000 } .text-boulder { color: #767676 } .text-emperor { color: #555 } .text-mine-shaft { color: #222 } .bg-white { background-color: #fff } .bg-wild-sand { background-color: #f6f6f6 } .skeleton { list-style: none; position: relative } .cms-custom-color-black { background-color: #000 } .cms-custom-color-alabaster-white { background-color: #f7f7f7 } .cms-custom-text-color-mercury-white { color: #e6e6e6 } .cms-custom-text-color-white, .cms-custom-text-color-white:hover { color: #fff } .overflow-hidden { overflow: hidden !important } .float-right { float: right } .m-0 { margin: 0 } .mx-4 { margin-left: 1rem; margin-right: 1rem } .mb-0 { margin-bottom: 0 } .mb-2\.4rem { margin-bottom: 2.4rem } .mb-3\.2rem { margin-bottom: 3.2rem } .mb-6 { margin-bottom: 1.5rem } .ml-2 { margin-left: .5rem } .ml-4 { margin-left: 1rem } .mr-4 { margin-right: 1rem } .mt-3\.2rem { margin-top: 3.2rem } .mt-4 { margin-top: 1rem } .block { display: block } .inline-block { display: inline-block } .inline { display: inline } .flex { display: -webkit-box; display: -ms-flexbox; display: flex } .grid { display: grid } .h-16 { height: 4rem } .h-full { height: 100% } .w-full { width: 100% } .min-w-9\.5rem { min-width: 9.5rem } .grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0 } .cursor-pointer { cursor: pointer } .list-none { list-style-type: none } .flex-row-reverse { -webkit-box-orient: horizontal } .flex-row-reverse { -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse } .flex-col { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .content-center { -ms-flex-line-pack: center; align-content: center } .items-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end } .items-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center } .justify-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start } .justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .overflow-hidden { overflow: hidden } .border { border-width: 1px } .border-t { border-top-width: 1px } .p-0 { padding: 0 } .pt-0 { padding-top: 0 } .pt-2 { padding-top: .5rem } .text-left { text-align: left } .text-center { text-align: center } .text-right { text-align: right } .text-2xl { font-size: 2.2rem } .text-base { font-size: 1.4rem } .text-tiny { font-size: 1.2rem } .font-bold { font-weight: 700 } .font-light { font-weight: 300 } .font-medium { font-weight: 500 } .font-normal { font-weight: 400 } .uppercase { text-transform: uppercase } .capitalize { text-transform: capitalize } .leading-6 { line-height: 1.5rem } .underline { text-decoration-line: underline } .ratio-a { padding-top: 73.33% } @media (min-width:640px) { .container { max-width: 640px } } @media (min-width:768px) { .container { max-width: 768px } } @media (min-width:1024px) {} @media (min-width:1280px) { .container { max-width: 1280px } } .first\:border-t-0:first-child { border-top-width: 0 } @media (min-width:640px) { .sm\:mx-10 { margin-left: 2.5rem; margin-right: 2.5rem } .sm\:mt-8 { margin-top: 2rem } .sm\:block { display: block } .sm\:inline-block { display: inline-block } .sm\:flex { display: -webkit-box; display: -ms-flexbox; display: flex } .sm\:hidden { display: none } .sm\:min-w-47rem { min-width: 47rem } .sm\:flex-row { -webkit-box-orient: horizontal; -ms-flex-direction: row; flex-direction: row } .sm\:flex-col, .sm\:flex-row { -webkit-box-direction: normal } .sm\:flex-col { -webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column } .sm\:justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .sm\:text-right { text-align: right } .sm\:justify-between-unset { -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } } @media (min-width:768px) { .md\:px-2\.4rem { padding-left: 2.4rem; padding-right: 2.4rem } } @media (min-width:1024px) { .lg\:mb-2\.4rem { margin-bottom: 2.4rem } .lg\:pr-1\.6rem { padding-right: 1.6rem } } @media (max-width:1023px) { .lgr\:h-4-8 { height: 4.8rem } } @media (max-width:767px) { .mdr\:w-full { width: 100% } .mdr\:text-8xl { font-size: 3.2rem } } @media (max-width:639px) { .smr\:w-29rem { width: 29rem } .smr\:truncate { overflow: hidden; text-overflow: ellipsis } .smr\:truncate { white-space: nowrap } } .main-price-container { display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #000 } .main-price-container span { display: inline-block; margin-right: .6rem } .sgh-pdp__button { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; background-color: transparent; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.6rem; height: 4.8rem; justify-content: space-between; line-height: 1.6rem; margin-bottom: 1.2rem; padding: 1.6rem 2.1rem; position: relative; -webkit-transition: background-color .5s linear; transition: background-color .5s linear; width: 100% } .sgh-pdp__button__primary { color: #fff; -webkit-box-pack: center; -ms-flex-pack: center; background-color: #5D8D9E; justify-content: center } .sgh-pdp__button__primary:hover { background-color: #517A89; } .sgh-pdp__button--size-label { color: #767676; font-size: 1.2rem; margin-right: .4rem } .sgh-pdp__button--size-selector { border-bottom: .1rem solid #e2e2e5; border-top: .1rem solid #e2e2e5; color: #000; font-size: 1.4rem; padding-left: 0; text-transform: uppercase } .sgh-pdp__button--size-selector.common__icon--arrow-right-menu { background-position: 100%; background-repeat: no-repeat } .sgh-pdp__button--size-selector.sgh-pdp__button { margin-bottom: 2.4rem } .sgh-pdp__button--size-selector.sgh-pdp__button :hover { background-color: transparent !important } .sgh-pdp__button--text-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative } .sgh-pdp__button__primary { border-radius: 5rem } .sgh-pdp__button :not(.disabled):active { background-color: #d1d1d1 } .sgh-pdp__button.sgh-pdp__button__primary :active { background-color: #4e4e4e } @media (max-width:1023px) { .sgh-pdp__button { margin-bottom: 1.6rem } } .common__icon--loading-spinner { left: -3rem; position: absolute; top: -.3rem } :root { --button-shadow: 0 0 0 0.1rem #d8d8d8 !important; --base-primary: var(--base-black) } .sgh-rtr--button { -webkit-box-align: center; -ms-flex-align: center; display: -webkit-box; display: -ms-flexbox; -webkit-box-pack: center; -ms-flex-pack: center } .product-images { position: relative } .product-images-main { background: #f2f2f2; cursor: var(--sf-img-10), auto; /* height: 48.3333vw; */ margin-bottom: .2rem; padding-bottom: .2rem } @media (max-width:1023px) { .product-images-main { height: 100vw; width: 100%; } } .product-images-main img { width: 100%; } #order_review th { text-align: left; } #order_review td { text-align: right; } .product-images-secondary { display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: .2rem } .product-images-secondary--images { background-color: #f2f2f2; display: -webkit-box; display: -ms-flexbox; display: flex; /* height: 23.9583333333vw; */ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: var(--sf-img-10), auto; overflow: hidden } .product-images-secondary--images img { width: 100%; height: 100%; object-fit: contain; } .all-images-present .product-images-secondary--images.image-even.last-img { grid-column: span 2; height: 48.3333vw } .product-images-secondary--view-more { color: #000; font-size: 1.4rem; font-style: normal; font-weight: 500; grid-column: span 2; line-height: 2.1rem; margin: 1.6rem auto; min-height: 2.4rem; text-align: center; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content } .product-images-secondary--view-more .view-more-less { margin-right: .8rem; text-decoration: underline; text-transform: uppercase } .product-images-secondary--view-more .view-more-less :hover { text-decoration: none } .product-images-secondary--view-more .view-more-less :active { color: #646464 } .product-images-secondary--spacer { margin-bottom: 5.3rem } .product-images .back-arrow { cursor: pointer; height: 1.6rem; width: 1.6rem } .product-images .sgh-pdp__gallery--back { padding: .2rem .5rem } @media (max-width:1023px) { .product-images .sgh-pdp__gallery--back { left: 2.4rem; position: absolute; top: 2rem; z-index: 2 } } .product-images .sgh-pdp__gallery--btn { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 2.4rem } @media (max-width:1023px) { .product-images .sgh-pdp__gallery--btn { bottom: -1.6rem; position: absolute; right: 2.4rem } } .product-images .sgh-pdp__gallery--desktop-container { position: absolute; width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: transparent; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 1.8rem 2.4rem 1.8rem 4rem; z-index: 2 } .common__icon--minus-icon { cursor: pointer; display: inline-block; height: 1.6rem; margin-bottom: .2rem; width: 1.6rem } button { background-color: transparent; border: none } .shop-by-section { background: #000; color: #fff; content-visibility: auto; padding: 3.2rem 4rem } @media (max-width:1023px) { .shop-by-section { padding: 2.4rem 1.6rem } } .shop-by-section h2 { font-size: 2.8rem; font-weight: 400; letter-spacing: .014rem; line-height: 2.8rem; margin-bottom: .8rem } @media (max-width:1023px) { .shop-by-section h2 { font-size: 2.4rem; line-height: 2.4rem } } .shop-by-section ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .shop-by-section ul li { list-style: none; margin-right: 1.6rem; padding: .8rem 0 } .shop-by-section ul li a { padding: .4rem 0 } .shop-by-section a { color: #fff; text-decoration: underline; text-transform: uppercase } .shop-by-section a:hover { cursor: pointer; text-decoration: none } .shop-by-section a:active { outline: none } .shop-by-section .link-url { outline-offset: .5rem } .pdp-breadcrumbs { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #fff; border-top: .1rem solid #d8d8d8; content-visibility: auto; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 2.9rem 4rem } @media (max-width:767px) { .pdp-breadcrumbs { padding: 2.9rem 1.6rem } } .pdp-breadcrumbs-item { color: #000; font-family: Helvetica Neue; font-size: 1.4rem; font-weight: 400; line-height: 2.1rem; padding: .2rem .5rem .2rem 0 } .pdp-breadcrumbs-item :not(:last-child):hover { text-decoration: underline } .pdp-breadcrumbs__separator { padding-right: .5rem } .grid-container-info { grid-template-columns: repeat(2, 1fr); grid-gap: 3.2rem } @media (max-width:767px) { .grid-container-info { grid-template-columns: repeat(1, 1fr); grid-gap: 2.4rem } } .grid-container-info__title { color: #000; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.2rem; font-style: normal; font-weight: 500; line-height: 2.4rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: .8rem } .grid-container-info__title img { height: 2.4rem; margin-right: 1.2rem; width: 2.4rem } .pdp-accordion-content { font-size: 1.4rem; font-style: normal; font-weight: 400 } .grid-container-info__wrapper:first-of-type p:last-child { font-size: 1.2rem } .grid-container-info__wrapper:nth-of-type(2) { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3 } .grid-container-info__content p:not(:has(.alert-warning)) { padding: .8rem 0 } .grid-container-info__content p:first-of-type { padding-top: 0 } .grid-container-info__content p .alert-warning { color: #767676; display: block; font-size: 1.2rem; line-height: 1.5; margin-bottom: -.8rem } a.tertiary-2023 { margin-top: .4rem } @media (max-width:767px) { a.tertiary-2023 { border-bottom: none; margin-top: 1.2rem; text-align: left; text-decoration: underline } } .accordion { grid-column: 1; -webkit-transition: .2s linear; transition: .2s linear } .accordion-header { scroll-margin-top: 4.8rem; -webkit-transition: padding-bottom .2s ease; transition: padding-bottom .2s ease } .accordion-header> { color: #000; font-size: 2.8rem; line-height: 1 } @media (max-width:767px) { .accordion-header> { font-size: 2.4rem } } .accordion-item { background-color: #f2f2f2; color: #222; font-size: 2.8rem; font-weight: 400; letter-spacing: .014rem; line-height: 100%; margin-bottom: .2rem; min-height: 9.2rem; padding: 3.2rem 3.2rem 3.2rem 4rem } @media (max-width:767px) { .accordion-item { min-height: 7.2rem; padding: 2.4rem 1.6rem } } .accordion-content { background-color: #f2f2f2; font-size: 1.6rem } .accordion-content> { color: #000; font-family: Helvetica Neue, sans-serif } .accordion .pdp-accordion-content { line-height: 2.1rem; padding-top: 1.6rem } .common__icon { height: 1.2rem; width: 1.2rem } .pdp-disclaimer { padding: 4rem } @media (max-width:767px) { .pdp-disclaimer { padding: 2.4rem 1.6rem } } .pdp-disclaimer-copy { color: #000; font-size: 1.2rem; font-weight: 400; line-height: 1.8rem } .favorites { & :hover { cursor: pointer } } .faqs-implementation-container { content-visibility: auto; grid-column: 1; margin: 0 1.6rem 0 4rem } @media (max-width:767px) { .faqs-implementation-container { margin: 0 1.6rem } } .faqs-implementation-container .faqs-title { font-size: 2.8rem; font-weight: 400; letter-spacing: .014rem; line-height: 2.8rem; margin-top: 3.2rem; text-align: left } @media (max-width:767px) { .faqs-implementation-container .faqs-title { font-size: 2.4rem; line-height: 2.4rem; margin-bottom: 1.6rem } } .faqs-implementation-container .faqs-container .faqs-sub-container { display: -webkit-box; display: -ms-flexbox; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; border-bottom: .1rem solid #f7f7f7; display: block } .faqs-implementation-container .faqs-container .faqs-sub-container p { line-height: 2.1rem; margin-bottom: 1.6rem } @media (min-width:1024px) { .faqs-implementation-container .faqs-container .faqs-sub-container p { margin-right: 3.2rem } } .faqs-implementation-container .faqs-container .faqs-sub-container a, .faqs-implementation-container .faqs-container .faqs-sub-container a:visited { text-decoration: underline } .faqs-implementation-container .faqs-container .faqs-sub-container .title div { color: #000; font-size: 1.6rem; font-weight: 500; letter-spacing: 0; line-height: 2.4rem; margin-bottom: 2.4rem; margin-top: 2.4rem; text-align: left } @media (min-width:1024px) { .faqs-implementation-container .faqs-container .faqs-sub-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; break-inside: avoid-column } } .faqs-implementation-container .faqs-container .common__icon { height: 1.2rem; margin-left: .5rem; margin-top: .5rem; width: 1.2rem } @media (min-width:1024px) { .faqs-implementation-container .faqs-container .common__icon { position: relative } } .faqs-implementation-container .faqs-container .view-more-button { color: #000; font-size: 1.4rem; font-weight: 500; line-height: 1.6rem; -ms-flex-item-align: start; align-self: flex-start; background-color: transparent; border-bottom: .1rem solid #000; margin: 2.4rem 0 } .video-module { margin-bottom: .4rem; padding: 0 .4rem; width: 50% } @media (max-width:767px) { .video-module { margin-bottom: .4rem; padding: 0; width: 100% } } .video-module-media { position: relative } .video-module-media img { display: block; max-width: 100% } .video-module-content { font-size: 1.4rem; line-height: 2rem; padding: 1.6rem 2.4rem 4.5rem 3.2rem } @media (max-width:767px) { .video-module-content { padding: 1.6rem 1.6rem 2rem 0 } } .video-module-content h3 { font-size: 1.2rem; font-weight: 700; line-height: 1.8rem; margin-bottom: .4rem; text-transform: uppercase } .module-title { font-size: 2.8rem; font-weight: 400; letter-spacing: .014rem; line-height: 1; margin: 2.8rem 1.6rem 2rem 4rem; text-align: left } @media (max-width:767px) { .module-title { font-size: 2.4rem; margin: 2.4rem 1.6rem 1.6rem } } .video-module-container { grid-column: 1 } .modules-container { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } @media (max-width:767px) { .modules-container { display: block; margin-left: 1.6rem; overflow: visible } } .sgh-pdp-pickup { background-color: transparent; border: none; color: #000; width: 100%; padding: 0; } .sgh-pdp-pickup-title { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; gap: 1.2rem; margin-bottom: .6rem } .sgh-pdp-pickup-title .common__icon--pickup-icon { height: 2.4rem; width: 2.4rem } .accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; display: block !important; } .accordion-item[aria-expanded="true"] .accordion-content { max-height: 1000px; } .sgh-pdp { margin-bottom: 40px; } .sgh-pdp-pickup-title .title-pickup-text { font-size: 1.2rem; font-weight: 500; line-height: 2.2rem; text-align: left; text-transform: uppercase; margin: 0; } .sgh-pdp-pickup .find-in-store-button, .sgh-pdp-pickup .subtitle-pickup-text { font-size: 1.4rem; font-weight: 400; line-height: 2.1rem; margin-bottom: .8rem; min-height: 2.1rem; text-align: left; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content } .sgh-pdp-pickup .find-in-store-button-text { border-radius: 0; color: #222; display: inline-block; font-weight: 500; height: 1.5rem; letter-spacing: .02rem; line-height: 1.2; max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; text-decoration: underline; text-transform: uppercase; white-space: inherit; width: auto } .sgh-pdp-pickup .find-in-store-button-text :hover, .sgh-pdp-pickup .subtitle-pickup-text-text :hover { text-decoration: none } .sgh-pdp-pickup .find-in-store-button-text :active, .sgh-pdp-pickup .subtitle-pickup-text-text :active { opacity: .6; text-decoration: none } .sgh-pdp-pickup-container .common__icon--delivery-icon { display: block; height: 2.4rem; width: 2.4rem } .sgh-pdp-pickup-container .sgh-pdp-delivery-title { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; gap: 1.2rem } .sgh-pdp-pickup-container .sgh-pdp-delivery-title .title-delivery-text { font-size: 1.2rem; font-weight: 500; line-height: 2.2rem; text-align: left; text-transform: uppercase; margin: 0; } .sgh-pdp-pickup-container .sgh-pdp-delivery .subtitle-delivery-text { font-size: 1.4rem; font-weight: 400; line-height: 2.1rem; padding-top: .4rem; text-align: left } .sgh-pdp-pickup-container .sgh-pdp-delivery-edd-text { color: #006952; white-space: nowrap } .sgh-pdp-pickup-container { margin: 2.4rem 0 } @media (max-width:1023px) { .sgh-pdp-pickup-container { margin: 2.4rem -1.6rem } } .badges-list { -ms-flex-wrap: wrap; flex-wrap: wrap } .badges-list, .badges-list li { display: -webkit-box; display: -ms-flexbox; display: flex; height: 1.8rem } .badges-list li { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #000; font-size: 1.2rem; font-weight: 500; line-height: 1.8rem; position: relative; text-transform: uppercase } .badges-list li.with-icon { padding-right: 2.6rem } .badges-list li:not(:first-child) { padding-left: 1.9rem } .badges-list li:not(:first-child):before { background-color: #000; border-radius: 50%; content: ""; font-size: 3rem; height: .4rem; left: .8rem; width: .4rem } .badges-list li img, .badges-list li:not(:first-child):before { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .badges-list li img { height: auto; right: 0; width: 1.8rem } body:has(.X_LP_SizeGuide) { padding-top: 0 !important } body:has(.X_LP_SizeGuide) .sgh-header { position: relative !important } @media (max-width:1023px) { .color-wrapper { height: 14.8rem; position: relative; width: 100% } .internal-color-wrapper { left: -1.6rem; overflow-x: auto; position: absolute; right: -1.6rem; top: 2.4rem; -webkit-transition: left .3s ease; transition: left .3s ease } } .colors { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: .2rem; margin-bottom: 2.4rem } @media (max-width:1023px) { .colors { -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin-bottom: 0 } } .colors-image { background-color: #f2f2f2; color: #000; height: 8.328rem; width: 8.328rem } @media (max-width:1023px) { .colors-image { height: 10rem; min-width: 10rem; width: 10rem } } .colors-image img { width: 100% } .colors-image.active { border: .1rem solid #000 } .colors-image { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 } .hidden-scrollbar { -ms-overflow-style: none; scrollbar-width: none } .hidden-scrollbar ::-webkit-scrollbar { display: none } button { border: none } .common__icon--loading-spinner { opacity: 0 } .sgh-pdp__button { border: none } .sgh-pdp__button.add-to-bag-button :focus-visible { outline: .3rem solid #005fcc } .sgh-pdp__button--add-bag-wrapper { display: block; } .swiper-tiles-2023 { margin-left: 0; margin-right: 0; overflow-y: auto !important } .swiper-tiles-2023 article .ratio-a { height: 24rem; padding: 0 } @media (max-width:767px) { .swiper-tiles-2023 article .ratio-a { height: 13.4rem } } @media screen and (min-width:1600px) { .swiper-tiles-2023 article .ratio-a { height: 32rem } } @media (min-width:1280px) { .swiper-tiles-2023 article .sgh-tile__brand { font-size: 1.2rem; font-weight: 500 } .swiper-tiles-2023 article .sgh-tile__model-name { font-size: 1.2rem; font-weight: 300 } .swiper-tiles-2023 article .sgh-tile__price { font-size: 1.2rem; font-weight: 500 } } @media (max-width:767px) { .swiper-tiles-2023 article .sgh-tile__brand { color: #000; font-size: 1.4rem; font-weight: 500; line-height: 2.1rem; max-width: 16ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .swiper-tiles-2023 article .sgh-tile__model-name { font-size: 1.2rem; line-height: 1.8rem } .swiper-tiles-2023 article .sgh-tile__price { font-size: 1.2rem; font-weight: 500; line-height: 1.8rem; position: absolute; right: 0; top: .2rem } .swiper-tiles-2023 article .sgh-tile__add-to-bag { color: #000; font-size: 1.4rem; font-weight: 500; line-height: 2.1rem } .swiper-tiles-2023 article .sgh-tile__badge-container { position: relative } } .swiper-tiles-2023 article img { padding: 0; width: 85% } .swiper-tiles-2023 .swiper-pagination { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; margin: 0 auto; width: 27.4rem } .swiper-tiles-2023 .swiper-pagination:not(:has(:nth-child(2))) { visibility: hidden } .swiper-tiles-2023 .swiper-pagination-bullet { background-color: #222; border: none; border-radius: 0; height: .25rem; margin: 0 !important; margin-top: 3.6rem; opacity: .1; width: 100% } .swiper-tiles-2023 .swiper-pagination-bullet:first-child { border-radius: .5rem 0 0 .5rem } .swiper-tiles-2023 .swiper-pagination-bullet:last-child { border-radius: 0 .5rem .5rem 0 } .swiper-tiles-2023 .swiper-pagination-bullet-active { background-color: #222; border-radius: .5rem; opacity: 1 } .swiper-tiles-2023 .swiper-container { padding-left: 0; padding-right: 0 } .swiper-tiles-2023 .swiper-button-next { right: 0 } .swiper-tiles-2023 .swiper-button-next { background-color: #fff; height: 4rem; opacity: .8; top: 12rem; visibility: hidden; width: 4rem } @media (max-width:1023px) { .swiper-tiles-2023 .swiper-button-next { background-color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; opacity: 1 } } @media (max-width:767px) { .swiper-tiles-2023 .swiper-button-next { top: 6.7rem } } @media screen and (min-width:1600px) { .swiper-tiles-2023 .swiper-button-next { top: 16rem } } .swiper-tiles-2023 .swiper-button-next:hover, .swiper-tiles-2023 .swiper-button-prev:hover { background-color: #fff; opacity: 1 } .swiper-tiles-2023 .swiper-button-next:after, .swiper-tiles-2023 .swiper-button-prev:after { content: "" } .benefit-bar-container { display: -webkit-box; display: -ms-flexbox; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-box-align: center; -ms-flex-align: center } @media (max-width:1023px) { .benefit-bar-container { height: auto; line-height: 150%; min-height: 4.5rem; padding: 1.2rem } } @media (max-width:1023px) { .benefit-bar-container__wrapper>div, .benefit-bar-container__wrapper p { display: inline } } .loyalty-widget { background: #f7f7f7; color: #000; font-size: 1.4rem; line-height: 2.1rem; padding: 2.4rem 1.6rem } @media (max-width:1023px) { .loyalty-widget { margin: 0-1.6rem } } .loyalty__main-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-bottom: 1.6rem } .loyalty__main-wrapper.line-present { border-bottom: 1px solid #d8d8d8 } .loyalty__widget-logo img { width: 11.8rem } .loyalty__widget-info { padding-left: .8rem } .loyalty__widget-info a { text-transform: uppercase } .loyalty__widget-info a .common__icon--info { bottom: .3rem; height: 1.8rem; margin-left: .8rem; position: relative; width: 1.8rem } .loyalty__login-info { padding-top: 1.6rem } .loyalty__login-info a { font-weight: 500; margin-left: .8rem; padding: .4rem 0; text-decoration: underline; text-transform: uppercase } .loyalty__login-info a :hover { text-decoration: none } .loyalty-points { min-height: 2.4rem } .loyalty-points a { display: block; min-height: 2.4rem } .pdp-text-module { display: -webkit-box; display: -ms-flexbox; display: flex; font-weight: 400; grid-column: 1; padding: 3.2rem 3.2rem 3.2rem 4rem; -webkit-box-pack: justify; -ms-flex-pack: justify; gap: 3.2rem; justify-content: space-between } @media (max-width:767px) { .pdp-text-module { display: block; padding: 1.6rem } } .pdp-text-module__left-section, .pdp-text-module__right-section { width: 100% } .pdp-text-module__pre-title { font-size: 1.2rem; line-height: 1.8rem } .pdp-text-module__title { font-size: 4rem; font-weight: 400; letter-spacing: .014rem; line-height: 4rem } @media (max-width:767px) { .pdp-text-module__title { font-size: 3.2rem; line-height: 3.2rem; margin-bottom: 1.6rem } } .pdp-text-module__long-text { font-size: 1.4rem; line-height: 2.1rem; margin-bottom: 1rem } .overlay-popup { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); background: rgba(26, 25, 25, .69); z-index: 10005 } #available { text-transform: uppercase; } article, div, footer, h1, h2, h3, header, iframe, img, li, nav, section, span, strong, ul { background: transparent; border: 0; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline } body, html { border: 0; margin: 0; vertical-align: baseline } html { line-height: 1.6rem; padding: 0 } article, footer, header, nav { display: block } a { background: transparent; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline } input { border: none } button:focus { outline: revert } @media (min-width:1024px) { .sgh-pdp__sidebar { grid-column: 2; grid-row: 1/span 4; width: 51.2rem } } .product-page { background-color: var(--fx-bg); display: grid; grid-template-columns: 1fr 51.2rem; width: 100% } .product-page-wrapper .pdp-disclaimer { margin-top: 2.5rem } @media (min-width:768px) { .product-page-wrapper .pdp-disclaimer { margin-top: 3.2rem } } @media (max-width:1023px) { .product-page { display: block; grid-template-columns: none } } .product-page--carousels { content-visibility: auto } .product-page--carousels .offer-list-section__heading { color: #000; font-size: 1.6rem; font-style: normal; font-weight: 400; letter-spacing: normal; padding: 0 4rem } @media (max-width:767px) { .product-page--carousels .offer-list-section__heading { padding: 0 1.6rem } } .product-page--carousels .swiper-pagination { margin-top: 1.6rem } .product-page--carousels .ymal-container:last-child .swiper-pagination { margin-bottom: 3rem } .product-page-ctas { margin-bottom: 3.6rem } .product-page-buttons :nth-last-child(2 of.product-page-buttons__element) { margin-bottom: 3.2rem } .product-details { height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; padding: 2.4rem 4rem 2.2rem } @media (max-width:1023px) { .product-details { padding: 1.6rem 1.6rem 0 } } .product-details .badges-list { padding-top: 0 } .product-details .badges-list li { margin-bottom: 0 } @media (max-width:1023px) { .product-info-holder { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse } } .top-container { color: #000; font-size: 1.2rem; line-height: 1.5rem; margin-bottom: 1.8rem; position: relative } @media (max-width:1023px) { .top-container { margin-bottom: 1.6rem } } .top-container h2 { font-size: 2.4rem; font-weight: 400; line-height: 2.4rem; margin-bottom: .4rem; padding-right: 3rem } .top-container h2 a { color: #000 } .top-container h2 a :hover { text-decoration: underline } .top-container h1 { color: #767676; font-size: 1.4rem; font-weight: 400; line-height: 2.1rem; margin-bottom: .4rem } .top-container .price-wishlist-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 2.4rem } .top-container .price-wishlist-wrapper .main-price-container { margin-bottom: 0 } .sgh-pdp__button { height: 4.8rem } .offer-list-section { padding-top: 2.8rem } .offer-list-section__heading { margin-bottom: 1.6rem } .sgh-tile__badge-container { min-height: 0 !important } @media (min-width:640px) { .pdp-frame-details-wrapper { margin-bottom: 2.4rem } } .pdp-frame-details-content, .pdp-lens-details { line-height: inherit } .pdp-frame-details-content span :first-child, .pdp-lens-details span :first-child { margin-right: .8rem } .pdp-frame-details-content .value, .pdp-lens-details .value { display: inline-block; line-height: 2.1rem } .grid-col-1 { grid-column: 1 } .pdp-banners-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .sgh-header-top { left: 0; padding: 0 3.2rem 0 4rem; position: fixed; top: 0; z-index: 6 } @media (max-width:1023px) { .sgh-header-top { padding: 0 1rem } } .sgh-header-top a :focus { outline-color: transparent; outline-offset: .2rem } .sgh-header-top__text { margin: .8rem 0; max-width: 60rem } .sgh-header-top__menu .lang { margin-left: .8rem } .sgh-header-top__menu ul { display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.2rem; gap: 2.5rem; list-style: none } .sgh-header-top__menu a, .sgh-header-top__menu li { padding-bottom: .6rem; padding-top: .6rem } .sgh-header-top__menu a { color: inherit } .sgh-header-top__menu a :hover { text-decoration: underline } .sgh-header-top__menu a :active { opacity: .6 } .sgh-header-top .controllerOn { -webkit-transform: rotate(-90deg) !important; transform: rotate(-90deg) !important } @media (max-width:1023px) { .sgh-header-top .controllerOn { position: static !important } } .sgh-header-top .controllerOnPrevious { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transform: rotate(90deg); transform: rotate(90deg) } @media (max-width:1023px) { .sgh-header-top .controllerOnPrevious { position: static !important } } .sgh-header-top .common__icon--arrow-down-bannertop { outline-color: transparent; outline-offset: .2rem; width: 1.19rem } @media (max-width:1023px) { .sgh-header-top .common__icon--arrow-down-bannertop { position: absolute; right: 2.4rem; width: 1.58rem } } @media (max-width:1023px) { .header-tablet-controllerOn { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important } } .btn-lang-selector { padding-left: .5rem; padding-right: .5rem } .sgh-header-top__text-wrapper a { color: inherit; font-size: 1.2rem; padding: .6rem 0 } .sgh-header-top__text-wrapper a :focus { outline-color: transparent; outline-offset: .2rem } .sgh-header-top__text-wrapper a :hover { text-decoration: underline } .sgh-header-top__text-wrapper a :active { opacity: .6 } @media (max-width:767px) { .sgh-header-top__text-wrapper { max-width: 29.4rem } } #right-menu-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0 4.8rem; position: relative; z-index: 1 } #right-menu-wrapper .btn-cart, #right-menu-wrapper .left-part, #right-menu-wrapper .menuwrapper { height: 4rem; position: absolute; top: 0; width: 4rem } #right-menu-wrapper .left-part { background-color: transparent; border-radius: 0; left: 0; -webkit-transition: all .3s linear; transition: all .3s linear; z-index: 2 } #right-menu-wrapper .left-part .main-menu-right__link { left: 0; position: absolute; top: 0; -webkit-transition: left .3s linear; transition: left .3s linear; z-index: 11 } #right-menu-wrapper .search-input-holder { background-color: #f7f7f7; border-radius: 2rem; height: 4rem; overflow: hidden; position: absolute; right: 0; top: 0; -webkit-transition: width .3s linear; transition: width .3s linear; width: 0; z-index: 12 } @media (max-width:767px) { #right-menu-wrapper .search-input-holder { right: .4rem } } #right-menu-wrapper .right-part { display: -webkit-box; display: -ms-flexbox; display: flex; gap: .8rem; overflow: hidden; position: relative; z-index: 2 } #right-menu-wrapper .right-part>* { left: 0; position: relative; -webkit-transition: left .3s linear; transition: left .3s linear } #right-menu-wrapper .right-part:has(.myaccount-overlay) { z-index: 6 } #right-menu-wrapper .btn-cart, #right-menu-wrapper .close-search-btn, #right-menu-wrapper .menuwrapper { right: 0; -webkit-transition: opacity .3s linear; transition: opacity .3s linear; z-index: 4 } #right-menu-wrapper .close-search-btn { z-index: 0 } .close-search-btn { border: none; border-radius: 50%; height: 4rem; opacity: 0; outline: none; position: absolute; top: 0; width: 4rem } .close-search-btn:hover { background-color: #f7f7f7; cursor: pointer } .close-search-btn:after, .close-search-btn:before { background: #555; content: ""; height: .1rem; left: 50%; position: absolute; top: 50%; width: 2.5rem } .close-search-btn:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg) } .close-search-btn:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg) } .menu-item-link { display: -webkit-box; display: -ms-flexbox; height: auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: .8rem } @media (max-width:1023px) { .menu-item-link { height: 4rem; line-height: 1.6rem; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .menu-item-link :active { color: #888 } } @media (min-width:1024px) { .menu-item-link { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content } } .menu-item-link :focus { outline: none } .menu-item-link :focus-visible { outline: thin auto -webkit-focus-ring-color } .menu-item--firstLevel { background: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; height: 4rem; line-height: 1.904rem } @media (min-width:1024px) { .menu-item--firstLevel { display: unset; height: 6rem } .menu-item--firstLevel :hover { border-bottom: 2px solid #222 } } .menu-item--firstLevel>.menu-item-link { color: #222; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.4rem; letter-spacing: .1rem; line-height: 1.6rem; text-transform: uppercase; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media (min-width:1024px) { .menu-item--firstLevel>.menu-item-link { border: none; color: #222; font-size: 1.2rem; height: 6rem; letter-spacing: .1rem; padding: 2.2rem 3.2rem } .menu-item--firstLevel>.menu-item-link--has-url { cursor: pointer } .menu-item--firstLevel>.menu-item-link :hover { text-decoration: none } } @media (max-width:1023px) { .menu-item--firstLevel>.menu-item-link { -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100% } .menu-item--firstLevel>.menu-item-link :active { color: #888 } } .menu-item--highlighted>.menu-item-link { color: #7b0000 } @media (min-width:1024px) { .menu-item--highlighted :hover { border-bottom: 2px solid #7b0000 } } .sub-menu { height: 100%; overflow-y: hidden; width: 100%; -ms-scroll-chaining: none; list-style: none; overscroll-behavior: none } @media (min-width:1024px) { .sub-menu { height: unset; left: 0; position: absolute } } .main-menu-content { display: -webkit-box; display: -ms-flexbox; display: flex; height: inherit; list-style: none; margin: 0; padding: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1.6rem } @media (min-width:1024px) { .main-menu-content { gap: 0; -webkit-box-orient: initial; -webkit-box-direction: initial; -ms-flex-direction: initial; flex-direction: row } } .sgh-main-menu__wrapper .sgh-main-menu { background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; height: 6rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 2.9rem 0 4rem } @media (max-width:1023px) { .sgh-main-menu__wrapper .sgh-main-menu { padding: 0 1.4rem 0 2rem } } .sgh-main-menu__wrapper .sgh-main-menu .main-menu-center { height: inherit } .sgh-main-menu__wrapper .sgh-main-menu .main-menu-right { display: -webkit-box; display: -ms-flexbox; display: flex; gap: .8rem } .sgh-main-menu__wrapper .sgh-main-menu .main-menu-right .main-menu-right__link { border-radius: 10rem; display: -webkit-box; display: -ms-flexbox; display: flex; height: 4rem; width: 4rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative } .sgh-main-menu__wrapper .sgh-main-menu .main-menu-right .main-menu-right__link:hover { background-color: #f7f7f7 } .sgh-main-menu__wrapper .sgh-main-menu .main-menu-right .main-menu-right__link:active { background-color: rgba(34, 34, 34, .12) } .sgh-main-menu__wrapper .sgh-main-menu .menuwrapper button { -webkit-appearance: none; background: none; border: none; border-radius: 10rem; display: -webkit-box; display: -ms-flexbox; display: flex; height: 4rem; margin: 0; padding: 0; width: 4rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .sgh-main-menu__wrapper .sgh-main-menu .menuwrapper button :active { background-color: rgba(34, 34, 34, .12) } .menu { background-color: rgba(0, 0, 0, .5); height: calc(var(--vh, 1vh)*100 - 10rem); position: fixed; right: 0; top: 10.8rem; width: 100vw } .myaccount-icon { display: inline-block } #hamburger-icon { cursor: pointer; height: 1.8rem; position: relative; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; width: 1.8rem } #hamburger-icon span { background: #555; display: block; height: .1rem; left: 0; opacity: 1; position: absolute; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .7s ease-in-out; transition: .7s ease-in-out; width: 100% } #hamburger-icon span :first-child { top: .3rem; -webkit-transform-origin: right center; transform-origin: right center } #hamburger-icon span :nth-child(2) { top: .9rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transform-origin: right center; transform-origin: right center } #hamburger-icon span :nth-child(3) { bottom: .3rem; -webkit-transform-origin: right center; transform-origin: right center } @font-face { font-family: swiper-icons; font-style: normal; font-weight: 400; src: url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA)format("woff") } :root { --swiper-theme-color: #007aff } .swiper-container { list-style: none; margin-left: auto; margin-right: auto; overflow: hidden; padding: 0; position: relative; z-index: 1 } .swiper-wrapper { box-sizing: content-box; display: flex; height: 100%; position: relative; transition-property: transform; width: 100%; z-index: 1 } .swiper-wrapper { transform: translateZ(0) } .swiper-slide { flex-shrink: 0; height: 100%; position: relative; transition-property: transform } .sgh-swiper { overflow: hidden; position: relative; z-index: 1 } .sgh-swiper .swiper-pagination { position: relative } .sgh-swiper .swiper-pagination-bullet { margin-right: 18px } .sgh-swiper .swiper-pagination-bullet:last-child { margin: 0 } .ghost-2023, .secondary, .tertiary-2023 { border: none; border-radius: 10rem; font-size: 1.4rem; height: 4rem; line-height: 1.14; text-align: center; text-decoration: none; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; white-space: nowrap } .sgh-button__anchor { -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 } .secondary { background-color: rgba(34, 34, 34, 0); border: .1rem solid #000; color: #000 } .secondary :hover { background-color: rgba(34, 34, 34, .12) } .secondary :active { background-color: rgba(34, 34, 34, .17) } .secondary :disabled { opacity: .2 } .ghost-2023 { background-color: transparent; white-space: inherit; --clickable-space-around-button: -0.5rem; position: relative } .ghost-2023 :after { bottom: var(--clickable-space-around-button); content: ""; left: 0; position: absolute; right: 0; top: var(--clickable-space-around-button) } .ghost-2023 :hover { background-color: rgba(34, 34, 34, .1) } .ghost-2023 :active { background-color: rgba(34, 34, 34, .17) } .ghost-2023 :disabled { opacity: .2 } .ghost-2023.dark { border: .1rem solid #fff; color: #fff } .ghost-2023.dark :hover { background-color: hsla(0, 0%, 100%, .1) } .ghost-2023.dark :active { background-color: hsla(0, 0%, 100%, .17) } .tertiary-2023 { background-color: transparent; border-radius: 0; color: #222; font-weight: 500; height: 1.5rem; letter-spacing: .02rem; max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; min-width: 0 !important; padding: 0; text-decoration: underline; text-transform: uppercase; white-space: inherit; width: auto !important } .tertiary-2023 :hover { text-decoration: none } .tertiary-2023 :active { opacity: .6; text-decoration: none } @media (max-width:767px) { .sgh-pay-over-time { font-size: 1.4rem } } @media (max-width:767px) { .sgh-pay-over-time-custom-page { text-align: left } } @media (max-width:767px) { .sgh-pay-over-time .sgh-installments { text-align: center } } :root { --button-shadow: 0 0 0 0.1rem #d8d8d8 !important; --base-primary: var(--base-black) } .sgh-rtr--button { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #fff; border: .1rem solid #d8d8d8; border-radius: 20rem; color: #222; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.2rem; font-style: normal; font-weight: 400; gap: .8rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 1.8rem; padding: 1.1rem 1.2rem } .sgh-tile { font-family: Helvetica Neue, sans-serif; padding: .1rem } .sgh-tile.container { width: auto } .isHover .sgh-tile__img { display: block; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: opacity .2s ease-in .2s; transition: opacity .2s ease-in .2s } .sgh-tile__img-container { max-height: 100%; width: calc(100% - 3.2rem) } .sgh-tile__img-container.isHover { height: 100% } .sgh-tile__img-container img { max-height: 100%; -o-object-fit: cover; object-fit: cover } .sgh-tile__img-container:not(.isHover) img.sgh-tile__img--hover { display: none } .sgh-tile .isHover img.sgh-tile__img--hover { left: 50%; opacity: 0; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: opacity .2s ease-in .2s; transition: opacity .2s ease-in .2s } @media (min-width:640px) { #contentPage .sgh-tile:hover .isHover .sgh-tile__img, .sgh-tile:hover .isHover .sgh-tile__img { opacity: 0; -webkit-transition: opacity .2s ease-in .2s; transition: opacity .2s ease-in .2s } #contentPage .sgh-tile:hover .sgh-tile__img-container:not(.isHover) .sgh-tile__img, .sgh-tile:hover .sgh-tile__img-container:not(.isHover) .sgh-tile__img { display: none } #contentPage .sgh-tile:hover .isHover .sgh-tile__img--hover, .sgh-tile:hover .isHover .sgh-tile__img--hover { opacity: 1; -webkit-transition: opacity .2s ease-in .2s; transition: opacity .2s ease-in .2s } #contentPage .sgh-tile:hover .sgh-tile__img-container:not(.isHover) .sgh-tile__img--hover, .sgh-tile:hover .sgh-tile__img-container:not(.isHover) .sgh-tile__img--hover { display: block } } .sgh-tile__brand { font-size: 1.4rem } .sgh-tile__badge-container { min-height: 7.2rem } @media (min-width:640px) { .sgh-tile__badge-container { min-height: 11rem } } .sgh-tile__link.isNotSafari:focus-visible .sgh-tile__picture, .sgh-tile__link.isSafari:focus .sgh-tile__picture { outline: .5rem auto -webkit-focus-ring-color } @media (max-width:767px) { .sgh-tile__model-name { max-width: 15ch } } .sgh-tile__add-to-bag { background: none; border: none; cursor: pointer; line-height: 2.1rem; margin: 0; padding: 0; text-align: left } @media (min-width:1024px) { .sgh-tile__add-to-bag :hover { text-decoration: none } } .sgh-tile__add-to-bag :active { color: #7b7b7b } .sgh-tile__add-to-bag :focus { text-decoration: none } .sgh-tile .smart-glasses-container { -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: .4rem; margin-bottom: .7rem; margin-right: 2.5rem } .sgh-tile .smart-glasses-container .smart-glasses-text { color: #000; font-size: 1.1rem; font-weight: 500; line-height: 1.34rem } .sgh-tile .smart-glasses-container .smart-glasses-icon { height: 2.4rem; margin: .3rem 0; width: 2.4rem } @media (max-width:767px) { .sgh-tile .smart-glasses-container .smart-glasses-icon { height: 1.8rem; margin: .3rem .4rem; width: 1.8rem } .sgh-tile .smart-glasses-container { margin-right: .7rem } } .focus-out-btn { opacity: 0 } .focus-out-btn :active, .focus-out-btn :focus, .focus-out-btn :hover { background: transparent; border: none; outline: none } .benefit-bar-container { display: -webkit-box; display: -ms-flexbox; display: flex; height: 4rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center } @media (max-width:1023px) { .benefit-bar-container { height: auto; line-height: 150%; min-height: 4.5rem; padding: 1.2rem } } .benefit-bar-container__wrapper>div, .benefit-bar-container__wrapper p { display: inline-block } @media (max-width:1023px) { .benefit-bar-container__wrapper>div, .benefit-bar-container__wrapper p { display: inline } } @media (min-width: 992px) { .sgh-pdp__sidebar .sticky-sidebar { position: -webkit-sticky; position: sticky; top: var(--pdp-sticky-top, 96px); align-self: start; } .sgh-pdp__sidebar .sticky-sidebar__inner { max-height: calc(100vh - var(--pdp-sticky-top, 96px) - 16px); overflow: auto; overscroll-behavior: contain; } } .product-page-wrapper, .product-page, .sgh-pdp__sidebar { overflow: visible; }