/* ==========================================================================
   tokens.css
   ========================================================================== */

:root {
  /* ---------- Colours ---------- */
  --wl-color-666666: rgb(102, 102, 102);
  --wl-color-ffffff: rgb(255, 255, 255);
  --wl-color-000000: rgb(0, 0, 0);
  --wl-color-efefef: rgb(239, 239, 239);
  --wl-color-ffffff-a0p5: rgba(255, 255, 255, 0.5);
  --wl-color-3772b4: rgb(55, 114, 180);
  --wl-color-d7d0d0: rgb(215, 208, 208);
  --wl-color-f3f3f3: rgb(243, 243, 243);
  --wl-color-222222: rgb(34, 34, 34);
  --wl-color-5e5e5e: rgb(94, 94, 94);
  --wl-color-000001-a0p3: rgba(0, 0, 1, 0.3);
  --wl-color-f9f9f9: rgb(249, 249, 249);
  --wl-color-001e37-a0p7: rgba(0, 30, 55, 0.7);
  --wl-color-686868: rgb(104, 104, 104);
  --wl-color-555555: rgb(85, 85, 85);
  --wl-color-cccccc: rgb(204, 204, 204);
  --wl-color-c2c2c2: rgb(194, 194, 194);
  --wl-color-e4e4e4: rgb(228, 228, 228);
  --wl-color-f2f2f2: rgb(242, 242, 242);
  --wl-color-333333: rgb(51, 51, 51);
  --wl-color-aaaaaa: rgb(170, 170, 170);
  --wl-color-464646: rgb(70, 70, 70);
  --wl-color-8a8a8a-a0p15: rgba(138, 138, 138, 0.15);
  --wl-color-101010: rgb(16, 16, 16);
  --wl-color-e9e9e9: rgb(233, 233, 233);
  --wl-color-454640: rgb(69, 70, 64);
  --wl-color-72b41d: rgb(114, 180, 29);
  --wl-color-000000-a0p075: rgba(0, 0, 0, 0.075);
  --wl-color-004678: rgb(0, 70, 120);
  --wl-color-7b674b: rgb(123, 103, 75);
  --wl-color-619e13: rgb(97, 158, 19);
  --wl-color-000000-a0p25: rgba(0, 0, 0, 0.25);
  --wl-color-000000-a0p498: rgba(0, 0, 0, 0.498);
  --wl-color-8a8a8a: rgb(138, 138, 138);
  --wl-color-e5e5e5: rgb(229, 229, 229);
  --wl-color-4d4d4d: rgb(77, 77, 77);
  --wl-color-e59700: rgb(229, 151, 0);
  --wl-color-000000-a0p2: rgba(0, 0, 0, 0.2);
  --wl-color-f0f0f0: rgb(240, 240, 240);
  --wl-color-000000-a0p5: rgba(0, 0, 0, 0.5);
  --wl-color-fbfbfb: rgb(251, 251, 251);
  --wl-color-313030: rgb(49, 48, 48);
  --wl-color-ffffff-a0: rgba(255, 255, 255, 0);
  --wl-color-292929-a0p2: rgba(41, 41, 41, 0.2);
  --wl-color-af9a7d: rgb(175, 154, 125);
  --wl-color-1f1e1e: rgb(31, 30, 30);
  --wl-color-808080: rgb(128, 128, 128);
  --wl-color-464646-a0p98: rgba(70, 70, 70, 0.98);
  --wl-color-cf4d4d: rgb(207, 77, 77);
  --wl-color-626262: rgb(98, 98, 98);
  --wl-color-000000-a0p4: rgba(0, 0, 0, 0.4);
  --wl-color-767676: rgb(118, 118, 118);
  --wl-color-000000-a0p8: rgba(0, 0, 0, 0.8);
  --wl-color-494949: rgb(73, 73, 73);
  --wl-color-000000-a0p1: rgba(0, 0, 0, 0.1);
  --wl-color-ff0000: rgb(255, 0, 0);
  --wl-color-66afe9-a0p6: rgba(102, 175, 233, 0.6);
  --wl-color-8b8b8b: rgb(139, 139, 139);
  --wl-color-ffffff-a0p65: rgba(255, 255, 255, 0.65);
  --wl-color-dae6e9-a0p4: rgba(218, 230, 233, 0.4);
  --wl-color-000000-a0p05: rgba(0, 0, 0, 0.05);
  --wl-color-000000-a0p08: rgba(0, 0, 0, 0.08);
  --wl-color-a09e9e: rgb(160, 158, 158);
  --wl-color-444444: rgb(68, 68, 68);
  --wl-color-text-grey: rgb(102, 102, 102);
  --wl-color-white: rgb(255, 255, 255);
  --wl-color-text: rgb(0, 0, 0);
  --wl-color-primary: rgb(55, 114, 180);
  --wl-color-grey-old-2: rgb(215, 208, 208);
  --wl-color-bg-light: rgb(243, 243, 243);
  --wl-color-button: rgb(94, 94, 94);
  --wl-color-bg-page: rgb(249, 249, 249);
  --wl-color-overlay-navy: rgba(0, 30, 55, 0.7);
  --wl-color-lang-active-bg: rgb(104, 104, 104);
  --wl-color-body-bg: rgb(85, 85, 85);
  --wl-color-border: rgb(204, 204, 204);
  --wl-color-text-muted: rgb(194, 194, 194);
  --wl-color-border-light: rgb(228, 228, 228);
  --wl-color-bg-search: rgb(242, 242, 242);
  --wl-color-popup-text: rgb(51, 51, 51);
  --wl-color-bg-muted: rgb(233, 233, 233);
  --wl-color-totop-border: rgb(69, 70, 64);
  --wl-color-accent: rgb(114, 180, 29);
  --wl-color-primary-dark: rgb(0, 70, 120);
  --wl-color-accent-button: rgb(97, 158, 19);
  --wl-color-tile-border: rgb(240, 240, 240);
  --wl-color-overlay-dark: rgba(0, 0, 0, 0.5);
  --wl-color-totop-icon: rgb(31, 30, 30);
  --wl-color-overlay-tile: rgba(0, 0, 0, 0.4);
  --wl-color-label-bg-old: rgb(73, 73, 73);
  --wl-color-tile-shadow: rgb(139, 139, 139);
  --wl-color-zoo-link: rgb(160, 158, 158);

  /* ---------- Font families ---------- */
  --wl-font-base: NotoSans;
  --wl-font-bold: NotoSans-Bold;
  --wl-font-condensed: "Roboto Condensed";

  /* ---------- Font weights ---------- */
  --wl-fw-300: 300;
  --wl-fw-400: 400;
  --wl-fw-500: 500;
  --wl-fw-700: 700;
  --wl-fw-800: 800;

  /* ---------- Font sizes ---------- */
  --wl-fs-0p001: 0.001px;
  --wl-fs-10: 10px;
  --wl-fs-11: 11px;
  --wl-fs-12: 12px;
  --wl-fs-13: 13px;
  --wl-fs-14: 14px;
  --wl-fs-15: 15px;
  --wl-fs-16: 16px;
  --wl-fs-17: 17px;
  --wl-fs-18: 18px;
  --wl-fs-19: 19px;
  --wl-fs-20: 20px;
  --wl-fs-21: 21px;
  --wl-fs-22: 22px;
  --wl-fs-24: 24px;
  --wl-fs-25: 25px;
  --wl-fs-26: 26px;
  --wl-fs-28: 28px;
  --wl-fs-30: 30px;
  --wl-fs-31: 31px;
  --wl-fs-32: 32px;
  --wl-fs-34: 34px;
  --wl-fs-36: 36px;
  --wl-fs-37: 37px;
  --wl-fs-100: 100px;

  /* ---------- Line heights ---------- */
  --wl-lh-0: 0px;
  --wl-lh-8: 8px;
  --wl-lh-8p8: 8.8px;
  --wl-lh-9: 9px;
  --wl-lh-11: 11px;
  --wl-lh-12: 12px;
  --wl-lh-13: 13px;
  --wl-lh-16: 16px;
  --wl-lh-18: 18px;
  --wl-lh-18p2: 18.2px;
  --wl-lh-19p5: 19.5px;
  --wl-lh-19p6: 19.6px;
  --wl-lh-20: 20px;
  --wl-lh-20p8: 20.8px;
  --wl-lh-21: 21px;
  --wl-lh-22: 22px;
  --wl-lh-24: 24px;
  --wl-lh-25p6: 25.6px;
  --wl-lh-26: 26px;
  --wl-lh-28: 28px;
  --wl-lh-28p8: 28.8px;
  --wl-lh-30: 30px;
  --wl-lh-32: 32px;
  --wl-lh-33p8: 33.8px;
  --wl-lh-34: 34px;
  --wl-lh-36: 36px;
  --wl-lh-40: 40px;
  --wl-lh-44: 44px;
  --wl-lh-100: 100px;
  --wl-lh-normal: normal;

  /* ---------- Letter spacing ---------- */
  --wl-ls-2: 2px;
  --wl-ls-normal: normal;

  /* ---------- Spacing ---------- */
  --wl-space-n55: -55px;
  --wl-space-n40: -40px;
  --wl-space-n30: -30px;
  --wl-space-n25: -25px;
  --wl-space-n20: -20px;
  --wl-space-n15: -15px;
  --wl-space-1: 1px;
  --wl-space-3: 3px;
  --wl-space-4: 4px;
  --wl-space-5: 5px;
  --wl-space-6: 6px;
  --wl-space-7: 7px;
  --wl-space-8: 8px;
  --wl-space-9: 9px;
  --wl-space-10: 10px;
  --wl-space-15: 15px;
  --wl-space-20: 20px;
  --wl-space-25: 25px;
  --wl-space-26: 26px;
  --wl-space-30: 30px;
  --wl-space-33: 33px;
  --wl-space-40: 40px;
  --wl-space-45: 45px;
  --wl-space-50: 50px;
  --wl-space-60: 60px;
  --wl-space-70: 70px;
  --wl-space-80: 80px;
  --wl-space-112: 112px;
  --wl-space-120: 120px;
  --wl-space-130: 130px;
  --wl-space-139: 139px;
  --wl-space-140: 140px;
  --wl-space-163: 163px;
  --wl-space-239: 239px;

  /* ---------- Radius ---------- */
  --wl-radius-2: 2px;
  --wl-radius-3p75: 3.75px;
  --wl-radius-4: 4px;
  --wl-radius-5: 5px;
  --wl-radius-10: 10px;
  --wl-radius-20: 20px;
  --wl-radius-50pc: 50%;
  --wl-radius-50: 50px;
  --wl-radius-100pc: 100%;

  /* ---------- Shadows ---------- */
  --wl-shadow-1: rgba(0, 0, 1, 0.3) 0px 0px 2px 2px;
  --wl-shadow-2: rgba(0, 0, 0, 0) 0px 0px 0px 0px;
  --wl-shadow-3: rgba(0, 0, 0, 0.075) 0px 1px 1px 0px inset;
  --wl-shadow-4: rgba(0, 0, 0, 0.498) 0px 2px 5px;
  --wl-shadow-5: rgba(41, 41, 41, 0.2) 2px 2px 6px 0px inset;
  --wl-shadow-6: rgb(215, 208, 208) 0px 3px 0px 0px;
  --wl-shadow-7: rgba(0, 0, 0, 0.2) 0px 1px 1px -1px;
  --wl-shadow-8: rgba(0, 0, 0, 0.2) 0px 0px 3px 1px, rgba(0, 0, 0, 0.2) 0px 0px 1px 0px;
  --wl-shadow-9: rgba(0, 0, 0, 0.4) 0px 1px 2px -1px, rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
  --wl-shadow-10: rgba(0, 0, 0, 0.075) 0px 1px 1px 0px inset, rgba(102, 175, 233, 0.6) 0px 0px 8px 0px;
  --wl-shadow-11: rgb(139, 139, 139) 1px 1px 3px 2px;
  --wl-shadow-12: rgb(255, 255, 255) 0px 0px 0px 4px, rgba(0, 0, 0, 0.08) 0px 2px 0px 0px inset, rgba(0, 0, 0, 0.05) 0px 3px 0px 4px;

  /* ---------- Layout ---------- */
  --wl-grid-columns: 60;
  --wl-html-font-size: 15px;
  --wl-container-max-width: 980px;
  --wl-container-padding-x: 25px;
  --wl-gutter: 25px;
  --wl-grid-margin: -25px;
  --wl-navbar-container-padding-x: 15px;
  --wl-navbar-container-padding-y: 3px;
  --wl-navbar-container-min-height: 80px;
  --wl-topbar-padding-x: 15px;
  --wl-nav-link-font-size: 12px;
  --wl-nav-link-height: 70px;
  --wl-nav-item-padding-x: 5px;
  --wl-breadcrumbs-height: 196px;
  --wl-breadcrumbs-min-height: 79px;
  --wl-breadcrumb-padding-x: 40px;
  --wl-main-padding-top: 30px;
  --wl-category-main-padding-top: 60px;
  --wl-bottom-a-padding-top: 40px;
  --wl-bottom-a-padding-bottom: 130px;
  --wl-footer-copy-padding-x: 15px;
  --wl-home-top-a-container-max-width: 980px;
  --wl-home-products-title-size: 34px;
  --wl-prosfora-height: 450px;
  --wl-category-col-basis: 100%;
  --wl-category-container-max-width: 1680px;
  --wl-services-icon-size: 127px;
  --wl-sticky-placeholder-height: 139px;
  --wl-logo-height: 84.5469px;

  /* ---------- Breakpoints ---------- */
  --wl-bp-max-320: 320px;
  --wl-bp-max-401: 401px;
  --wl-bp-max-414: 414px;
  --wl-bp-max-468: 468px;
  --wl-bp-min-469: 469px;
  --wl-bp-max-479: 479px;
  --wl-bp-max-480: 480px;
  --wl-bp-min-480: 480px;
  --wl-bp-max-505: 505px;
  --wl-bp-max-568: 568px;
  --wl-bp-min-569: 569px;
  --wl-bp-max-576: 576px;
  --wl-bp-max-600: 600px;
  --wl-bp-min-600: 600px;
  --wl-bp-max-660: 660px;
  --wl-bp-max-689: 689px;
  --wl-bp-max-700: 700px;
  --wl-bp-max-767: 767px;
  --wl-bp-max-768: 768px;
  --wl-bp-min-768: 768px;
  --wl-bp-min-769: 769px;
  --wl-bp-min-800: 800px;
  --wl-bp-max-861: 861px;
  --wl-bp-max-900: 900px;
  --wl-bp-max-929: 929px;
  --wl-bp-max-941: 941px;
  --wl-bp-max-954: 954px;
  --wl-bp-max-959: 959px;
  --wl-bp-min-960: 960px;
  --wl-bp-max-979: 979px;
  --wl-bp-max-992: 992px;
  --wl-bp-min-992: 992px;
  --wl-bp-max-1001: 1001px;
  --wl-bp-max-1020: 1020px;
  --wl-bp-max-1024: 1024px;
  --wl-bp-min-1025: 1025px;
  --wl-bp-max-1059: 1059px;
  --wl-bp-max-1089: 1089px;
  --wl-bp-max-1128: 1128px;
  --wl-bp-max-1141: 1141px;
  --wl-bp-max-1163: 1163px;
  --wl-bp-max-1200: 1200px;
  --wl-bp-min-1200: 1200px;
  --wl-bp-max-1219: 1219px;
  --wl-bp-min-1220: 1220px;
  --wl-bp-max-1255: 1255px;
  --wl-bp-max-1280: 1280px;
  --wl-bp-min-1280: 1280px;
  --wl-bp-max-1360: 1360px;
  --wl-bp-max-1366: 1366px;
  --wl-bp-max-1399: 1399px;
  --wl-bp-max-1400: 1400px;
  --wl-bp-min-1400: 1400px;
  --wl-bp-max-1440: 1440px;
  --wl-bp-min-1520: 1520px;
  --wl-bp-max-1538: 1538px;
  --wl-bp-max-1541: 1541px;

  /* ---------- Motion durations ---------- */
  --wl-duration-100ms: 0.1s;
  --wl-duration-120ms: 0.12s;
  --wl-duration-150ms: 0.15s;
  --wl-duration-200ms: 0.2s;
  --wl-duration-250ms: 0.25s;
  --wl-duration-300ms: 0.3s;
  --wl-duration-350ms: 0.35s;
  --wl-duration-400ms: 400ms;
  --wl-duration-500ms: 0.5s;
  --wl-duration-800ms: 0.8s;
  --wl-duration-1000ms: 1000ms;
  --wl-duration-1200ms: 1.2s;
  --wl-duration-1300ms: 1300ms;
  --wl-duration-3000ms: 3000ms;
  --wl-duration-8000ms: 8000ms;
  --wl-duration-9000ms: 9000ms;

  /* ---------- Motion easings ---------- */
  --wl-ease-ease: ease;
  --wl-ease-ease-in-out: ease-in-out;
  --wl-ease-ease-out: ease-out;
  --wl-ease-linear: linear;
}

/* ---------- Responsive overrides ---------- */

@media (min-width: 321px) {
  :root {
    --wl-breadcrumbs-min-height: 89px;
  }
}

@media (min-width: 402px) {
  :root {
    --wl-breadcrumbs-min-height: 100px;
  }
}

@media (min-width: 481px) {
  :root {
    --wl-nav-link-height: 100px;
  }
}

@media (min-width: 506px) {
  :root {
    --wl-breadcrumbs-min-height: 126px;
  }
}

@media (min-width: 690px) {
  :root {
    --wl-breadcrumbs-min-height: 168px;
  }
}

@media (min-width: 768px) {
  :root {
    --wl-navbar-container-min-height: 100px;
    --wl-bottom-a-padding-top: 60px;
  }
}

@media (min-width: 769px) {
  :root {
    --wl-nav-link-font-size: 14px;
    --wl-breadcrumbs-min-height: 160px;
  }
}

@media (min-width: 862px) {
  :root {
    --wl-breadcrumbs-height: 210px;
    --wl-breadcrumbs-min-height: 210px;
  }
}

@media (min-width: 960px) {
  :root {
    --wl-bottom-a-padding-top: 120px;
  }
}

@media (min-width: 993px) {
  :root {
    --wl-footer-copy-padding-x: 140px;
    --wl-prosfora-height: 280px;
    --wl-category-col-basis: 25%;
  }
}

@media (min-width: 1002px) {
  :root {
    --wl-nav-link-font-size: 16px;
  }
}

@media (min-width: 1025px) {
  :root {
    --wl-navbar-container-padding-x: 40px;
    --wl-topbar-padding-x: 40px;
    --wl-prosfora-height: 370px;
  }
}

@media (min-width: 1142px) {
  :root {
    --wl-breadcrumbs-height: 280px;
    --wl-breadcrumbs-min-height: 280px;
  }
}

@media (min-width: 1220px) {
  :root {
    --wl-container-max-width: 1200px;
    --wl-container-padding-x: 40px;
    --wl-gutter: 40px;
    --wl-grid-margin: -40px;
    --wl-home-top-a-container-max-width: 1200px;
  }
}

@media (min-width: 1367px) {
  :root {
    --wl-navbar-container-padding-x: 140px;
    --wl-navbar-container-padding-y: 15px;
    --wl-topbar-padding-x: 140px;
    --wl-prosfora-height: 450px;
  }
}

@media (min-width: 1441px) {
  :root {
    --wl-nav-item-padding-x: 15px;
  }
}

@media (min-width: 1520px) {
  :root {
    --wl-home-top-a-container-max-width: 1500px;
  }
}

@media (min-width: 1542px) {
  :root {
    --wl-breadcrumbs-height: 380px;
    --wl-breadcrumbs-min-height: 380px;
  }
}
