:root {
    /* General */
   --globalBackdropBlur: blur(30px); 

    /* Font Styles */
    --bodyFontSize: 12px;
    --bodyFontFamily: "MarkOT";
    --light: "MarkOTLight";
    --bold: "MarkOTBold";
    --medium: "MarkOTMedium";
    --justified: "justify";
    --white: #FFFFFF;
    --black: #1a1a1a;
    --black-a50: color_mix(in srgb, var(--black), transparent 50%);
    --white-a50: color_mix(in srgb, var(--white), transparent 50%);
    --blackAlpha: 26, 26, 26;
    --widthOffset: 75px;

    /* Nav Styles */
    --navHeight: 52px;

    /* Button Styles */
    --btnTransform: uppercase;
    --btnFontSize: 12px;
    --btnLetterSpacing: .2px;

    /* btnOWStroke Off White */
    --btnOWBG: transparent;
    --btnOWBorder: 1px solid var(--white);
    --btnOWColor: var(--white);
    --btnOWPadding: 5px 20px;
    --btnOWTransition: background-color 200ms, color 200ms;

    /* Modal Styles */
    --modalBorderRadius: 2px;

      /* Button / BTN Styles */
    --btnFocusBG: #727272;
    --btnLetterSpacing: .5px;
    --btnTextTransform: uppercase;
    --btnPadding: 6px 0;
    --btnBorderRadius: 0;
  
    /* btnNior */
    --btnNiorBGColor: #1a1a1a;
    --btnNiorFontColor: #ffffff;
    --btnNiorHoverBGColor: #727272;
    --btnNiorFontFamily: var(--medium);
  
    /* btnOW */
    --btnOWBGColor: #ffffff;
    --btnOWFontColor: #1a1a1a;
    --btnOWHoverBGColor: #727272;

    /* Collection Banner */
    --collectionHeroWidth: 80vw;

    /* SideBar */
    --sbBorderColor: #ffffff1f;
    --sbFontColor: #9b9a9a;
    --marginLeft4Sidebar: 20vw;

    /* Product Thumbnail Images */
    --productImgHoverHeightOffset: 100%;

    /* Product Zoom */
    --productInfoLabelFontSize: 10px;

    /* Input / Label / Form Styles */
    --inputLabelFontSize: 10px;

    /* footer */
    --footerLinkListColor: #8c8c8c;
  }