@import url('https://fonts.googleapis.com/css?family=Barlow:300|Montserrat:400,700&display=swap');

:root {
  --main-foreground: #000000;
  --main-background: #ffffff;

  --primary-color: #151515;
  --secondary-color: #9c1d21;
  --accent-color: #c0392b;

  --button-background: #c0392b;
  --button-foreground: #ffffff;

  --label-background: #c0392b;
  --label-foreground: #ffffff;



  --adbar-background: #9c1d21;
  --adbar-foreground: #ffffff;
  --adbar-icon: #ffffff;

  --header-badge-background: #151515;
  --header-badge-foreground: #ffffff;

  --nav-desktop-foreground: #ffffff;

  --nav-desktop-background: #151515;
  --nav-desktop-hover: #ffffff;

  --header-featured-link-foreground: #000000;
  --header-featured-link-background: #c0392b;

  --topbar-background: #000000;
  --topbar-foreground: #ffffff;
  --topbar-icons: #ffffff;

  --search-background: #ffffff;
  --search-foreground: #000000;
  --search-icon: #9c1d21;

  --nav-mobile-background: #ffffff;
  --nav-mobile-foreground: #000000;


  --footer-background: #000000;
  --footer-foreground: #ffffff;
  --footer-titles: #ffffff;
  --footer-icons: #ffffff;
  --footer-form-background: #fcfcfc;
  --footer-form-foreground: #181818;
  --footer-form-input-background: #ffffff;
  --footer-form-input-foreground: #181818;
  --footer-form-titles: #181818;
  --footer-form-button-background: #181818;
  --footer-form-button-foreground: #ffffff;
  --footer-social-icons: #888888;


  --slider-background: #ffffff;

  --main-categories-background: #ffffff;
  --main-categories-foreground: #000000;

  --featured-background: #ffffff;
  --featured-foreground: #000000;

  --new-background: #ffffff;
  --new-foreground: #000000;

  --sale-background: #ffffff;
  --sale-foreground: #000000;

  --promotion-background: #ffffff;
  --promotion-foreground: #000000;

  --best-seller-background: #ffffff;
  --best-seller-foreground: #000000;

  --banner-products-background: #ffffff;
  --banner-products-foreground: #000000;
  --banner-products-content: #ffffff;

  --newsletter-background: #dddddd;
  --newsletter-foreground: #181818;
  --newsletter-button: #555555;
  --newsletter-button-text: #ffffff;

  --welcome-background: ;
  --welcome-foreground: ;

  --testimonials-background: #ffffff;
  --testimonials-titles: #000000;
  --testimonials-foreground: #000000;
  --faq-background: #ffffff;
  --faq-foreground: #000000;

  --institutional-background: #ffffff;
  --institutional-foreground: #000000;

  --categories-background: #ffffff;
  --categories-foreground: #000000;

  --gridbanners-background: #ffffff;
  --gridbanners-foreground: #000000;

  --brands-background: #ffffff;
  --brands-foreground: #000000;

  --featured-banner-background: #ffffff;

  --video-foreground: #ffffff;

  --banner-services-background: #fcfcfc;
  --banner-services-foreground: #6d6d6e;
  --banner-services-title: #151515;
  --banner-services-icon: #151515;
  --banner-services-width: 1200px;

  --instafeed-background: #000000;
  --instafeed-foreground: #ffffff;

  --extra-menu-background: #ffffff;
  --extra-menu-foreground: #000000;

  --blog-background: #ffffff;
  --blog-foreground: #000000;

      --extra-menu-size: 15px;
    --extra-menu-padding: 20px;
    --extra-menu-min: 60px;

  --extra-menu-gap: 20px;




  --main-foreground-opacity-03: #00000008;
  --main-foreground-opacity-05: #0000000D;
  --main-foreground-opacity-08: #00000014;
  --main-foreground-opacity-10: #0000001A;
  --main-foreground-opacity-20: #00000033;
  --main-foreground-opacity-30: #0000004D;
  --main-foreground-opacity-40: #00000066;
  --main-foreground-opacity-50: #00000080;
  --main-foreground-opacity-60: #00000099;
  --main-foreground-opacity-70: #000000B3;
  --main-foreground-opacity-80: #000000CC;

  --main-background-opacity-30: #ffffff4D;
  --main-background-opacity-40: #ffffff66;
  --main-background-opacity-50: #ffffff80;
  --main-background-opacity-80: #ffffffCC;
  --main-background-opacity-90: #ffffffE6;

  --header-desktop-background: #000000;
  --header-desktop-background-opacity: #0000000D;
  --header-desktop-foreground: #ffffff;
  --header-icons: #ffffff;

  --header-foreground-opacity-10: #ffffff1A;
  --header-foreground-opacity-20: #ffffff33;
  --header-foreground-opacity-50: #ffffff80;

  --nav-desktop-foreground-opacity-05: #ffffff0D;
  --nav-desktop-foreground-opacity-10: #ffffff1A;
  --nav-desktop-foreground-opacity-60: #ffffff99;

  --nav-mobile-foreground-opacity-05: #0000000D;
  --nav-mobile-foreground-opacity-10: #0000001A;
  --nav-mobile-foreground-opacity-20: #00000033;
  --nav-mobile-foreground-opacity-30: #0000004D;
  --nav-mobile-foreground-opacity-40: #00000066;

      --nav-item-spacing: 0;

  --header-badge-foreground-opacity-20: #ffffff33;

  --adbar-foreground-opacity-10: 1A;

      --topbar-border: 1px solid #0000000D;

  --search-foreground-opacity-50: #00000080;

      --search-border: #0000004D;

  --main-categories-foreground-opacity-20: #00000033;

  --brands-foreground-opacity-10: #0000001A;

  --welcome-foreground-opacity-90: E6;

  --institutional-foreground-opacity-30: #0000004D;

      --institutional-opacity: 0.2;

      --testimonials-block: #ffffff;


  --news-foreground-opacity-10: #1818181A;
  --news-foreground-opacity-30: #1818184D;
  --news-foreground-opacity-50: #18181880;
  --news-foreground-opacity-70: #181818B3;

  --footer-foreground-opacity-10: #ffffff1A;
  --footer-foreground-opacity-20: #ffffff33;
  --footer-foreground-opacity-50: #ffffff80;
  --footer-foreground-opacity-60: #ffffff99;
  --footer-foreground-opacity-80: #ffffffCC;

  --footer-form-input-foreground-opacity-50: #18181880;


  --banner-promotional-background: #ffffff;
  --banner-promotional-foreground: #000000;
  --banner-promotional-overlay: #c0392b26;

  --extra-menu-foreground-opacity-10: #0000001A;


  --custom-section-1-background: #ffffff;
  --custom-section-2-background: #ffffff;
  --custom-section-3-background: #ffffff;
  --custom-section-4-background: #ffffff;
  --custom-section-5-background: #ffffff;

  --custom-section-1-foreground: #000000;
  --custom-section-2-foreground: #000000;
  --custom-section-3-foreground: #000000;
  --custom-section-4-foreground: #000000;
  --custom-section-5-foreground: #000000;

  --custom-section-1-button-background: #181818;
  --custom-section-1-button-foreground: #ffffff;
  --custom-section-2-button-background: #181818;
  --custom-section-2-button-foreground: #ffffff;
  --custom-section-3-button-background: #181818;
  --custom-section-3-button-foreground: #ffffff;
  --custom-section-4-button-background: #181818;
  --custom-section-4-button-foreground: #ffffff;
  --custom-section-5-button-background: #181818;
  --custom-section-5-button-foreground: #ffffff;


  --success: #4bb98c;
  --danger: #dd7774;
  --warning: #dc8f38;



  --heading-font: "Barlow", sans-serif;
  --menu-font: "Montserrat", sans-serif;
  --body-font: "Montserrat", sans-serif;


  --h1: 1.75rem;
  --h1-huge: 1.875rem;
  --h1-huge-md: 2.5rem;
  --h2: 1.75rem;
  --h3: 1.25rem;
  --h4: 1.125rem;
  --h5: 1rem;
  --h6: 0.875rem;

  --font-big: 1rem;
  --font-base: 0.875rem;
  --font-small: 0.75rem;
  --font-smallest: 0.625rem;

  --font-11: 0.6875rem;
  --font-12: 0.75rem;
  --font-13: 0.8125rem;
  --font-14: 0.875rem;
  --font-15: 0.9375rem;
  --font-16: 1rem;
  --font-18: 1.125rem;
  --font-20: 1.25rem;
  --font-22: 1.375rem;
  --font-24: 1.5rem;
  --font-26: 1.625rem;
  --font-28: 1.75rem;
  --font-30: 1.875rem;
  --font-32: 2rem;
  --font-36: 2.25rem;
  --font-40: 2.5rem;
  --font-44: 2.75rem;
  --font-48: 3rem;

      --font-menu: var(--font-13);

      --font-headings: var(--font-32);

      --font-rest: var(--font-14);


  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;


  --font-style-normal: normal;
  --font-style-italic: italic;

      --font-headings-weight: var(--font-weight-light);

      --font-headings-style: var(--font-style-normal);

      --font-menu-weight: var(--font-weight-bold);

      --font-headings-style: var(--font-style-normal);

        --font-menu-transform: uppercase;




  --gutter: 15px;
  --gutter-container: 15px;
  --gutter-container-md: 80px;
  --gutter-negative: calc(var(--gutter) * -1);
  --gutter-half: calc(var(--gutter) / 2);
  --gutter-half-negative: calc(var(--gutter) * -1 / 2);
  --gutter-double: calc(var(--gutter) * 2);



  --border-radius-none : 0px;
  --border-radius-full: 100%;
  --border-radius-30: 30px;
  --border-radius-half: calc(var(--border-radius) / 2);
  --border-radius-quarter: calc(var(--border-radius) / 4);
  --border-solid: 1px solid;
  --border-dashed: 1px dashed;

      --border-radius-item-image: 0;

  --btn-border-radius: var(--border-radius);

      --border-radius: 4px;


      --theme-round-full: var(--border-radius);
    --theme-round: var(--border-radius);


  --shadow-distance: 0 0 5px;


      --column-custom: 20%;


      --section-distance: 20px;
    --section-negative-distance: calc(var(--section-distance) * -1);


      --popup-width: fit-content;


      --banner-services-icon-size-desktop: 32px;
        --banner-services-icon-size-mobile: 32px;


      --item-background: #ffffff;

      --item-name-size: 14px;

      --item-name-lines: 2;

      --item-name-wrapper: calc(var(--item-name-size) * var(--item-name-lines) + 10px);

      --item-price-size: 14px;

  --item-price-color: ;
  --item-payment-discount-price-color: inherit;





      --item-container-height: calc(var(--item-name-container) + 23px);

  --item-name-container: calc((var(--item-name-size) * var(--item-name-lines) + 18px) + 23px);



      --item-price-container: calc(var(--item-price-size)*1.5 + 20px);


  --item-bullet-border: var(--main-foreground-opacity-30);


    --product-price-color: ;
    --instafeed-font-size: var(--font-24);

    --search-mobile-padding: 0 15px 15px;

    --container-width-sm: 540px;
    --container-width-md: 720px;
    --container-width-lg: 960px;
    --container-width-xl: 1140px;
    --container-width: 1200px;
    --container-width-max: 1300px;

    --header-background-image: none;
    --header-background-repeat: no-repeat;
    --header-background-size: auto;
    --header-background-image-mobile: none;
    --header-background-repeat-mobile: no-repeat;
    --header-background-size-mobile: auto;
    --header-contact-bar-background: var(--topbar-background);
    --header-contact-bar-background-mobile: var(--topbar-background);
}

@media (min-width: 768px) {
  :root {
    --item-name-size: 16px;
    --item-price-size: 16px;
  }
}