:root {
  --main-color: #FEC34D;
  --main-color-light: #ffe4ae;
  --main-color-dark: #654401;
  --color-secondary: #FE4E5E;
  --color-obligations: #FE4E5E;
  --color-secondary-light: #f0c3ca;
  --color-obligations-light: #f0c3ca;
  --color-secondary-dark: #65010A;
  --color-additional: #939021;
  --color-additional-light: #F1F0C0;
  --color-supplemental: #d3ce30;
  --main-border-radius: 6px;
  --input-border-radius: 24px;

  --color-light: #F5F5F5;
  --color-dark: #39445A;

  --main-text-color: #39445A;
  --color-warning: #FF8A48;
  --color-warning-light: #ff8a4840;
  --color-info: #448abf;
  --color-info-light: #448abf40;
  --color-danger: #FE4949;
  --color-danger-dark: #A11321;
  --color-danger-light: #FEAEAE;
  --color-success: #6fbf44;
  --color-success-light: #cbffad;
  --color-text-dark: #39445A;
  --color-text-light: #fff;
  --color-text-steel-blue: #7e8eae;
  --color-dark-text: #333;
  --color-dark-blue: #03314b;
  --color-dark-gray-blue: #656d78;

  --color-bg-light: #f5f5f5;
  --color-bg-light2: #fff;
  --color-bg-bar: #cdd3e0;
  --color-border-bar: #7e8eae;
  --color-border-default: #b5c4cb;

  --color-grey1: #7E8EAE;
  --color-grey: #7E8EAE;
  --color-grey-light: #CDD3E0;
  --color-light-2: #ebf1f480;

  --border-color: #b5c4cb;
  --border-color-2: #cadae2;
  --color-table-odd: #f9fbfc;
  /* --color-table-even: #ebf1f480; */
  --color-table-even: #f5f8fa;


  --font-main: 'Arimo', 'Calibri', sans-serif;

  --box-shadow-topbar: 0 0 15px 15px #39445a40;

  --box-shadow-grey: 3px 3px 6px -4px var(--color-grey1) !important;
  --box-shadow-green: 3px 3px 6px -4px var(--main-color) !important;
  --box-shadow-red: 3px 3px 6px -4px var(--color-warning) !important;

  --topbar-label-visibility: visible;
  --topbar-label-visibility-hover: visible;

  --dropdown-bg-color: #ebf1f4;
  --dropdown-text-color: var(--main-text-color);

  /* 1rem = 12px */

  --font-size-none: 0;
  /* 0 */
  --font-size-xs: 0.9167rem;
  /* 11px */
  --font-size-sm: 1rem;
  /* 12px */
  --font-size-base: 1.1667rem;
  /* 14px */
  --font-size-base-plus: 1.25rem;
  /* 15px */
  --font-size-md: 1.3333rem;
  /* 16px */
  --font-size-lg: 2rem;
  /* 24px */
  --font-size-xxxl: 3.3333rem;
  /* 40px */

  --font-weight-normal: 400;
  --font-weight-bold: 700;

  --line-height-tight: 1.0;
  --line-height-normal: normal;
  --line-height-label: 0.0573rem;
  /* 0.688px czyli 0.688/12 */

  --margin-none: 0;
  /* 0 */
  --margin-xs: 0.3333rem;
  /* 4px */
  --margin-sm: 0.4167rem;
  /* 5px */
  --margin-base: 0.6667rem;
  /* 8px */
  --margin-md: 0.8333rem;
  /* 10px */
  --margin-md-alt: 1rem;
  /* 12px */
  --margin-lg-alt: 1.3333rem;
  /* 16px */
  --margin-lg: 1.5rem;
  /* 18px */
  --margin-sm-alt: 2.5rem;
  /* 30px */
  --margin-xl: 2.6667rem;
  /* 32px */
  --margin-xl-plus: 3rem;
  /* 36px */
  --margin-xl-alt: 4.1667rem;
  /* 50px */
  --margin-xxl: 5.3333rem;
  /* 64px */

  --gap-sm: 0.6667rem;
  /* 8px */
  --gap-md: 1rem;
  /* 12px */

  --height-switch: 1.5rem;
  /* 18px */

  --radius-xs: 0.1667rem;
  /* 2px */
  --radius-xs-alt: 0.3333rem;
  /* 4px */
  --radius-sm: 0.5rem;
  /* 6px */
  --radius-lg: 0.6667rem;
  /* 8px */
  --radius-md: 1.0667rem;
  /* 12.8px */

  --checkbox-size: 1rem;
  /* 12px */
  --border-radius-lg-alt: 1rem;
  /* 12px */

  --border-width-thin: 0.0833rem;
  /* 1px */
  --border-width-thick: 0.1667rem;
  /* 2px */
  --border-width-thicker: 0.25rem;
  /* 3px */
  --border-width-thicker-plus: 0.416rem;
  /* 5px */

  --transition-base: all 0.2s ease-in;

  --padding-none: 0;
  /* 0 */
  --padding-xxs: 0.5rem;
  /* 6px */
  --padding-xs: 0.6667rem;
  /* 8px */
  --padding-sm-alt2: 0.8333rem;
  /* 10px */
  --padding-sm: 1rem;
  /* 12px */
  --padding-sm-alt: 1.25rem;
  /* 15px */
  --padding-sm-alt-plus: 1.6667rem;
  /* 20px */
  --padding-md: 2rem;
  /* 24px */
  --padding-base: 2.6667rem;
  /* 32px */
  --padding-lg: 3rem;
  /* 36px */
  --padding-xl: 4.6667rem;
  /* 56px */

  --shadow-light: 0 0 15px rgba(0, 0, 0, 0.1);
}