:root {
    /* value of backgroud image or color */
    --background: url("./assets/img/login-bg.jpg");
    --logo: url("./assets/img/logo.png");
    --font: geomanist, sans-serif;
    /* colors */
    --control-background-color: #fff;
    --control-background-color-10: #e5e5e5;
    --control-background-color-15: #d8d8d8;
    --valid: #55c45f;
    --error: #ff0202;
    --primary: #209ac7;
    --primary--10: #20a8c7;
    --primary-10: #1c8ab3;
    --primary-20: #3eb4e0;
    --primary-dark: #148cb8;
    --accent: #eb0255;
    --accent-10: #d3014c;
    --input-border: #d6d6d6;
    --input-border--10: #dadada;
    --input-label: #919191;
    --input-label-15: #7b7b7b;
    --input-label-20: #747474;
    --input-label-40: #565656;
    --input-label-margin: 5px 0 2px 0px;
    --input-height: 41px;
    --disabled: rgba(0, 0, 0, 0.12);
    --disabled-background-fill: #919191;
    --disabled-text-color: rgba(0, 0, 0, 0.6);
    --button-basic: #777;
    --button-basic-10: #6b6b6b;
    --button-basic--10: #848484;
    --warn: #f44336;
    --warn-10: #f22819;
    --warn--10: #f5554a;
    --table-rows-background: #efefef;
    --table-rows-background-10: #d7d7d7;
    --modal-container-color: #fff;
    --modal-container-width: 1100px !important;
    --modal-container-large-width: 1100px !important;
    --modal-shadow: unset;
    --not-checked: #666;
    --font: geomanist, sans-serif;
    --background-color: #f1f1f1;
    --spinner-color: #209ac7;
    --button-border-radius: 4px;
    --customer-actions-right-button-padding: 0px 0px 0px 4px;
    --customer-actions-left-button-padding: 0px 4px 0px 0px;
    --customer-modal-left-side: 300px;
    --background-image-display: block;
    --header-background-color: transparent;
    --header-position: absolute;
    --header-color: #fff;
    --stepper-display: none;
    --slider-color: #209ac7;
    --slider-color-10: #209ac7;
  }
  .slider-product-template {
    display: none;
  }
  @font-face {
    font-family: "geomanist";
    src: url("./assets/fonts/geomanist-regular-webfont.eot");
    src: url("./assets/fonts/geomanist-regular-webfont.eot?#iefix") format("embedded-opentype"),
      url("./assets/fonts/geomanist-regular-webfont.woff") format("woff"),
      url("./assets/fonts/geomanist-regular-webfont.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: "geomanist";
    src: url("./assets/fonts/geomanist-light-webfont.eot");
    src: url("./assets/fonts/geomanist-light-webfont.eot?#iefix") format("embedded-opentype"),
      url("./assets/fonts/geomanist-light-webfont.woff") format("woff"),
      url("./assets/fonts/geomanist-light-webfont.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
  }
  
  @font-face {
    font-family: "geomanist";
    src: url("./assets/fonts/geomanist-medium-webfont.eot");
    src: url("./assets/fonts/geomanist-medium-webfont.eot?#iefix") format("embedded-opentype"),
      url("./assets/fonts/geomanist-medium-webfont.woff") format("woff"),
      url("./assets/fonts/geomanist-medium-webfont.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
  }
  
  @font-face {
    font-family: "geomanist";
    src: url("./assets/fonts/geomanist-bold-webfont.eot");
    src: url("./assets/fonts/geomanist-bold-webfont.eot?#iefix") format("embedded-opentype"),
      url("./assets/fonts/geomanist-bold-webfont.woff") format("woff"),
      url("./assets/fonts/geomanist-bold-webfont.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
  }
  
  @font-face {
    font-family: "geomanist";
    src: url("./assets/fonts/geomanist-book-webfont.eot");
    src: url("./assets/fonts/geomanist-book-webfont.eot?#iefix") format("embedded-opentype"),
      url("./assets/fonts/geomanist-book-webfont.woff") format("woff"),
      url("./assets/fonts/geomanist-book-webfont.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
  }