/* Fonts and the few page-level rules every template relies on. Area styles are in the other files in this folder. */
@font-face{font-family:"PIRULEN";src:url("../fonts/PirulenRg-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../fonts/barlow-condensed-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../fonts/barlow-condensed-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../fonts/barlow-condensed-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F4F6F8}
[hidden]{display:none!important}

/* Text for screen readers only (WordPress and WooCommerce both print elements with this class). */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background:#fff;clip:auto!important;clip-path:none;color:#021A2B;display:block;font-size:16px;font-weight:700;height:auto;left:8px;padding:12px 16px;top:8px;width:auto;z-index:100000}


/* ==========================================================================
   HEADER AND FOOTER ADDITIONS (owner: inc/areas/header.php, template-parts/header-*.php, footer-*.php)
   Things the static design files do not have: the search field as a real form, rows drawn by
   theme.js, and the Tools & Cameras dropdown. Keep this block at the end of the file.
   ========================================================================== */
.tg-search-box{margin:0}
.tg-search-box input[type="search"]{-webkit-appearance:none;appearance:none;border-radius:0}
/* Suggestion rows are drawn by theme.js; the first product is the top match. */
.tg-suggest a.tg-suggest-row:hover,.tg-suggest a.tg-suggest-row:focus-visible,.tg-suggest [data-suggest-products]>a:first-child{background:#F4F6F8}
/* Tools & Cameras: a <details> in the category band. The list hangs under the band, like the Shop by OEM menu. */
.tg-dd{display:block;position:static}
.tg-dd>summary{cursor:pointer;-webkit-user-select:none;user-select:none}
.tg-dd[open]>summary{background:rgba(255,255,255,.12)}
.tg-dd:not([open])>.tg-dd-menu{display:none}
.tg-dd-menu{position:absolute;top:100%;z-index:35;min-width:280px;max-width:calc(100vw - 32px);padding:8px 0;box-sizing:border-box;display:flex;flex-direction:column;background:#FFFFFF;border-top:4px solid #FFB81C;border-bottom:1px solid #C5CED7;border-radius:0 0 6px 6px;box-shadow:0 18px 30px rgba(2,26,43,.18);font-family:Barlow,"Segoe UI",system-ui,sans-serif;font-weight:600;font-size:16px;letter-spacing:0;text-transform:none;white-space:nowrap}
.tg-band nav .tg-dd-menu a{display:flex;align-items:center;min-height:44px;padding:0 18px!important;color:#0E1B26;text-decoration:none}
.tg-band nav .tg-dd-menu a:hover{background:#F4F6F8}
.tg-band nav .tg-dd-menu a:focus-visible{outline-color:#003050}
@media (max-width:1079px){
  /* the band can scroll sideways here, so the list is tied to the right edge instead of the button */
  .tg-dd-menu{right:24px}
  .tg-band nav summary{padding-left:11px!important;padding-right:11px!important}
}
@media (min-width:700px) and (max-width:989px){
  /* same short name as the links beside it (site.css does this for a[data-short]) */
  .tg-band nav summary[data-short]{font-size:0!important;letter-spacing:0!important}
  .tg-band nav summary[data-short]::before{content:attr(data-short);font-size:17px;letter-spacing:.05em}
  .tg-band nav summary[data-short]>span{display:none}
}
/* END header and footer additions */

/* Screen-reader text inside a card is absolutely positioned. Without a positioned ancestor it escapes a
   swipe row and makes the page scroll sideways on phones. */
.tg-swipe,.tg-card{position:relative}