/* ========================================================== Got Hot Wheels Auctions - Home Button Text + Category Color v64 Scope: homepage hero CTA text + Browse Categories labels only ========================================================== */ /* BUTTON TEXT FAILSAFE: Some older patches left the real anchor text invisible. This paints the labels with ::before so the buttons cannot appear blank. */ html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a { position: relative !important; box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 218px !important; min-width: 218px !important; max-width: 218px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; padding: 0 16px !important; margin: 0 !important; border-radius: 8px !important; overflow: visible !important; text-decoration: none !important; white-space: nowrap !important; text-align: center !important; /* hide any broken/invisible leftover text nodes, then paint clean text below */ font-size: 0 !important; line-height: 0 !important; color: transparent !important; -webkit-text-fill-color: transparent !important; text-shadow: none !important; text-indent: 0 !important; } html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:first-child::before, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:first-child::before, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a:first-child::before { content: "Browse Auctions" !important; } html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:last-child::before, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:last-child::before, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a:last-child::before { content: "Sell Your Cars" !important; } html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a::before, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a::before, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a::before { display: inline-flex !important; align-items: center !important; justify-content: center !important; position: static !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; opacity: 1 !important; visibility: visible !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', Arial, sans-serif !important; font-size: 14px !important; font-weight: 900 !important; font-style: normal !important; line-height: 1 !important; letter-spacing: .035em !important; text-transform: uppercase !important; text-align: center !important; white-space: nowrap !important; text-shadow: 0 2px 0 rgba(0,0,0,.82), 0 0 9px rgba(0,0,0,.88) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; } /* Keep old arrow/span overlays hidden. */ html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a::after, html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a span, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a::after, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a span, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a::after, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a span { content: none !important; display: none !important; } /* Preserve button backgrounds. */ html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:first-child, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:first-child, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a:first-child { border: 1px solid rgba(255,48,52,.98) !important; background: linear-gradient(180deg, #ff3438 0%, #ec101b 56%, #b50008 100%) !important; box-shadow: 0 0 20px rgba(237,17,28,.34), inset 0 1px 0 rgba(255,255,255,.18) !important; } html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:last-child, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a:last-child, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a:last-child { border: 2px solid rgba(255,157,0,.98) !important; background: linear-gradient(180deg, rgba(18,20,26,.98), rgba(4,6,10,.98)) !important; box-shadow: 0 0 18px rgba(255,157,0,.20), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* CATEGORY LABEL COLOR: Switch labels to Hot Wheels gold/yellow so they pop over the metal panel. */ html body:has(.ghw-ref-hero) #categories .ghw-category strong, html body:has(.ghw-ref-hero) #categories a.ghw-category strong, html body.ghw64-home #categories .ghw-category strong, html body.ghw64-home #categories a.ghw-category strong { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 108px !important; min-height: 27px !important; margin-top: 1px !important; padding: 4px 6px 5px !important; border-radius: 7px !important; border: 1px solid rgba(255, 213, 73, .32) !important; background: rgba(0,0,0,.88) !important; color: #ffd54a !important; -webkit-text-fill-color: #ffd54a !important; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', Arial, sans-serif !important; font-size: 11.5px !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: .028em !important; text-align: center !important; text-transform: uppercase !important; text-decoration: none !important; text-shadow: 0 2px 0 #000, 0 0 5px #000, 0 0 10px rgba(0,0,0,1), 0 0 7px rgba(255,157,0,.35) !important; box-shadow: 0 0 12px rgba(0,0,0,.74), inset 0 1px 0 rgba(255,255,255,.06) !important; opacity: 1 !important; visibility: visible !important; overflow: visible !important; } html body:has(.ghw-ref-hero) #categories a.ghw-category:hover strong, html body.ghw64-home #categories a.ghw-category:hover strong { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; border-color: rgba(255,157,0,.70) !important; background: rgba(0,0,0,.94) !important; } @media (max-width: 900px) { html body:has(.ghw-ref-hero) .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a, html body.ghw64-home .ghw-ref-hero .ghw-hero-copy .ghw-hero-buttons > a, html body.ghw64-home .ghw-hero-fixed .ghw-hero-copy .ghw-hero-buttons > a { width: 100% !important; min-width: 0 !important; max-width: 100% !important; } }