:root {
  --main-color: #FEC34D;
  --main-color-light: #ffe4ae;
  --main-color-dark: #654401;
  --color-secondary: #FE4E5E;
  --color-obligations: #FE4E5E;
  --color-sceondary-light: #f0c3ca;
  --color-obligations-light: #f0c3ca;
  --color-sceondary-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-light: #FEAEAE;
  --color-success-light: #AEFFAE;
  --color-success: #5DFE5D;
  --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);
}