html {
    --color-primary: #2771d4;
    --color-primary-semi-light: #4182D9;
    --color-primary-light: #5f92d8;
    --color-primary-lighter: #76a3e2;
    --color-primary-lightest: #d4e3f6;
    --color-primary-dark: #1E57A0;

    --color-secondary: #ff991d;
    --color-secondary-lighter: #ffefdb;
    --color-secondary-light: #ffe0bb;
    --color-secondary-dark: #f88802;
    --color-secondary-darker: #E05807;

    --color-tertiary: #029b92;
    --color-tertiary-light: #CCEBE9;
    --color-tertiary-lighter: #E5F5F4;
    --color-tertiary-dark: #006760;

    --color-negative: #ec5555;
    --color-negative-light: #fce6e6;
    --color-negative-lighter: #fef6f6;
    --color-negative-dark: #c53939;

    --color-positive: #71b800;
    --color-positive-light: #e8f2d9;
    --color-positive-lighter: #f7faf2;
    --color-positive-dark: #579a00;
    --color-positive-darker: #488306;

    --color-greyscale-50: #ffffff;
    --color-greyscale-50-rgb: 255, 255, 255;
    --color-greyscale-100: #f7f7f7;
    --color-greyscale-200: #f0f0f0;
    --color-greyscale-300: #dadada;
    --color-greyscale-400: #c5c5c5;
    --color-greyscale-500: #bababa;
    --color-greyscale-600: #999999;
    --color-greyscale-700: #666666;
    --color-greyscale-800: #333333;
    --color-greyscale-900: #000000;

    --color-separator: var(--color-greyscale-300);
    --color-error: var(--color-negative);
    --color-success: var(--color-positive);
    --color-text: var(--color-greyscale-800);
    --color-hint: var(--color-greyscale-700);
    --color-link: var(--color-primary);

    --font-family-1: Hind, Arial, Helvetica, sans-serif;
    --font-family-1-bold: 600;

    --font-size-base: 16px;
    --font-size-hint: .875rem;
    --font-size-title: 1.25rem;

    --line-height-base: 1.4375rem;
    --line-height-hint: 1.25rem;
    --line-height-title: 1.8125rem;

    --gap-size: .625rem; /* 10px */
    --content-gap-size: 3vw;
    --vertical-gap-size: 10px;
    --headline-content-gap-size: 15px;
    --headline-content-small-gap-size: 5px;

    --fd-app-header-z-index: 100;
    --fd-app-header-logo-height: 26px;
    --fd-app-header-height: 50px;

    --fd-backdrop-z-index: 110;
    --fd-layer-z-index: 120;
    --fd-drawer-z-index: 120;
    --fd-dialog-z-index: 130;

    --global-scroll-bar-gap: 0px;
}

/* semantic tokens */
html {
    --surface-inverse: var(--color-greyscale-800);
    --on-surface-inverse: var(--color-greyscale-50);
    --on-surface-inverse-primary: var(--color-primary-lighter);

    --hint-warning-surface: var(--color-secondary-lighter);
    --hint-warning-on-surface: var(--color-secondary-dark);

    /* new tokens */
    --color-action-border-focus: #2771d4;
    --color-action-border-focus-variant: #ffffff;
    --color-action-destructive-background: #e11e1e;
    --color-action-destructive-background-disabled: #e3e3e3;
    --color-action-destructive-background-focus: #c80404;
    --color-action-destructive-background-hover: #c80404;
    --color-action-destructive-background-loading: #c80404;
    --color-action-destructive-background-pressed: #950000;
    --color-action-destructive-border: rgba(255, 255, 255, 0);
    --color-action-destructive-border-disabled: rgba(255, 255, 255, 0);
    --color-action-destructive-border-focus: #ffffff;
    --color-action-destructive-border-hover: rgba(255, 255, 255, 0);
    --color-action-destructive-border-loading: rgba(255, 255, 255, 0);
    --color-action-destructive-border-pressed: rgba(255, 255, 255, 0);
    --color-action-destructive-foreground: #ffffff;
    --color-action-destructive-foreground-disabled: #c8c8c8;
    --color-action-destructive-foreground-focus: #ffffff;
    --color-action-destructive-foreground-hover: #ffffff;
    --color-action-destructive-foreground-loading: #ffffff;
    --color-action-destructive-foreground-pressed: #ffffff;
    --color-action-destructive-subtle-background: #fed7d7;
    --color-action-destructive-subtle-background-disabled: #f1f1f1;
    --color-action-destructive-subtle-background-focus: #fd8787;
    --color-action-destructive-subtle-background-hover: #fd8787;
    --color-action-destructive-subtle-background-loading: #fd8787;
    --color-action-destructive-subtle-background-pressed: #e11e1e;
    --color-action-destructive-subtle-border: rgba(255, 255, 255, 0);
    --color-action-destructive-subtle-border-disabled: rgba(255, 255, 255, 0);
    --color-action-destructive-subtle-border-focus: #ffffff;
    --color-action-destructive-subtle-border-hover: rgba(255, 255, 255, 0);
    --color-action-destructive-subtle-border-loading: rgba(255, 255, 255, 0);
    --color-action-destructive-subtle-border-pressed: rgba(255, 255, 255, 0);
    --color-action-destructive-subtle-foreground: #ae0000;
    --color-action-destructive-subtle-foreground-disabled: #d6d6d6;
    --color-action-destructive-subtle-foreground-focus: #7b0000;
    --color-action-destructive-subtle-foreground-hover: #7b0000;
    --color-action-destructive-subtle-foreground-loading: #7b0000;
    --color-action-destructive-subtle-foreground-pressed: #ffffff;
    --color-action-destructive-subtlest-background: rgba(255, 255, 255, 0);
    --color-action-destructive-subtlest-background-disabled: rgba(255, 255, 255, 0);
    --color-action-destructive-subtlest-background-focus: #fed7d7;
    --color-action-destructive-subtlest-background-hover: #fed7d7;
    --color-action-destructive-subtlest-background-loading: #fed7d7;
    --color-action-destructive-subtlest-background-pressed: #fd8787;
    --color-action-destructive-subtlest-border: #c80404;
    --color-action-destructive-subtlest-border-disabled: #f1f1f1;
    --color-action-destructive-subtlest-border-focus: #ffffff;
    --color-action-destructive-subtlest-border-hover: #c80404;
    --color-action-destructive-subtlest-border-loading: #c80404;
    --color-action-destructive-subtlest-border-pressed: #950000;
    --color-action-destructive-subtlest-foreground: #c80404;
    --color-action-destructive-subtlest-foreground-disabled: #e3e3e3;
    --color-action-destructive-subtlest-foreground-focus: #c80404;
    --color-action-destructive-subtlest-foreground-hover: #c80404;
    --color-action-destructive-subtlest-foreground-loading: #c80404;
    --color-action-destructive-subtlest-foreground-pressed: #7b0000;
    --color-action-neutral-boldest-background: #3a3a3a;
    --color-action-neutral-boldest-background-disabled: #878787;
    --color-action-neutral-boldest-background-focus: #545454;
    --color-action-neutral-boldest-background-hover: #545454;
    --color-action-neutral-boldest-background-loading: #545454;
    --color-action-neutral-boldest-background-pressed: #212121;
    --color-action-neutral-boldest-border: rgba(255, 255, 255, 0);
    --color-action-neutral-boldest-border-disabled: rgba(255, 255, 255, 0);
    --color-action-neutral-boldest-border-focus: #ffffff;
    --color-action-neutral-boldest-border-hover: #ffffff;
    --color-action-neutral-boldest-border-loading: #ffffff;
    --color-action-neutral-boldest-border-pressed: #bababa;
    --color-action-neutral-boldest-foreground: #ffffff;
    --color-action-neutral-boldest-foreground-disabled: #545454;
    --color-action-neutral-boldest-foreground-focus: #ffffff;
    --color-action-neutral-boldest-foreground-hover: #ffffff;
    --color-action-neutral-boldest-foreground-loading: #ffffff;
    --color-action-neutral-boldest-foreground-pressed: #ffffff;
    --color-action-neutral-subtle-background: #e3e3e3;
    --color-action-neutral-subtle-background-focus: #c8c8c8;
    --color-action-neutral-subtle-background-hover: #c8c8c8;
    --color-action-neutral-subtle-border: rgba(255, 255, 255, 0);
    --color-action-neutral-subtle-border-focus: #ffffff;
    --color-action-neutral-subtle-border-hover: rgba(255, 255, 255, 0);
    --color-action-neutral-subtle-foreground: #212121;
    --color-action-neutral-subtle-foreground-focus: #212121;
    --color-action-neutral-subtle-foreground-hover: #212121;
    --color-action-neutral-subtlest-background: rgba(255, 255, 255, 0);
    --color-action-neutral-subtlest-background-disabled: #e3e3e3;
    --color-action-neutral-subtlest-background-focus: #e3e3e3;
    --color-action-neutral-subtlest-background-focus-variant: #ffffff;
    --color-action-neutral-subtlest-background-hover: #e3e3e3;
    --color-action-neutral-subtlest-background-loading: #e3e3e3;
    --color-action-neutral-subtlest-background-pressed: #d6d6d6;
    --color-action-neutral-subtlest-background-variant: #ffffff;
    --color-action-neutral-subtlest-border: #878787;
    --color-action-neutral-subtlest-border-disabled: #c8c8c8;
    --color-action-neutral-subtlest-border-focus: #ffffff;
    --color-action-neutral-subtlest-border-hover: #212121;
    --color-action-neutral-subtlest-border-loading: #212121;
    --color-action-neutral-subtlest-border-pressed: #212121;
    --color-action-neutral-subtlest-foreground: #212121;
    --color-action-neutral-subtlest-foreground-disabled: #c8c8c8;
    --color-action-neutral-subtlest-foreground-focus: #212121;
    --color-action-neutral-subtlest-foreground-focus-variant: #878787;
    --color-action-neutral-subtlest-foreground-hover: #212121;
    --color-action-neutral-subtlest-foreground-loading: #212121;
    --color-action-neutral-subtlest-foreground-pressed: #212121;
    --color-action-onbrand-active-background: #ffffff;
    --color-action-onbrand-active-border: rgba(255, 255, 255, 0);
    --color-action-onbrand-active-foreground: #003ea1;
    --color-action-onbrand-background: #ffffff;
    --color-action-onbrand-background-disabled: #528ddd;
    --color-action-onbrand-background-focus: #000b6e;
    --color-action-onbrand-background-focus-variant: #212121;
    --color-action-onbrand-background-hover: #000b6e;
    --color-action-onbrand-background-hover-variant: #212121;
    --color-action-onbrand-background-loading: #000b6e;
    --color-action-onbrand-background-pressed: #000055;
    --color-action-onbrand-background-variant: #ffad4a;
    --color-action-onbrand-border: rgba(255, 255, 255, 0);
    --color-action-onbrand-border-disabled: rgba(255, 255, 255, 0);
    --color-action-onbrand-border-focus: #a9c6ee;
    --color-action-onbrand-border-focus-variant: #a9c6ee;
    --color-action-onbrand-border-hover: #a9c6ee;
    --color-action-onbrand-border-hover-variant: #a9c6ee;
    --color-action-onbrand-border-loading: rgba(255, 255, 255, 0);
    --color-action-onbrand-border-pressed: rgba(255, 255, 255, 0);
    --color-action-onbrand-border-variant: #000b6e;
    --color-action-onbrand-foreground: #0e58ba;
    --color-action-onbrand-foreground-disabled: #7daae5;
    --color-action-onbrand-foreground-focus: #ffffff;
    --color-action-onbrand-foreground-focus-variant: #ffffff;
    --color-action-onbrand-foreground-hover: #ffffff;
    --color-action-onbrand-foreground-hover-variant: #ffffff;
    --color-action-onbrand-foreground-loading: #ffffff;
    --color-action-onbrand-foreground-pressed: #ffffff;
    --color-action-onbrand-foreground-variant: #212121;
    --color-action-onbrand-foreground-variant-2: #801a00;
    --color-action-onbrand-inactive-background: rgba(255, 255, 255, 0);
    --color-action-onbrand-inactive-border: #ffffff;
    --color-action-onbrand-inactive-foreground: #ffffff;
    --color-action-onbrand-selected-background: #003ea1;
    --color-action-onbrand-selected-border: #d4e3f6;
    --color-action-onbrand-selected-foreground: #ffffff;
    --color-action-onbrand-unselected-background: #545454;
    --color-action-onbrand-unselected-border: #a9c6ee;
    --color-action-onbrand-unselected-foreground: #ffffff;
    --color-action-onbrand-subtle-background: #d4e3f6;
    --color-action-onbrand-subtle-background-disabled: #528ddd;
    --color-action-onbrand-subtle-background-focus: #000b6e;
    --color-action-onbrand-subtle-background-hover: #000b6e;
    --color-action-onbrand-subtle-background-loading: #000b6e;
    --color-action-onbrand-subtle-background-pressed: #000055;
    --color-action-onbrand-subtle-border: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtle-border-disabled: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtle-border-focus: #a9c6ee;
    --color-action-onbrand-subtle-border-hover: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtle-border-loading: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtle-border-pressed: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtle-foreground: #003ea1;
    --color-action-onbrand-subtle-foreground-disabled: #7daae5;
    --color-action-onbrand-subtle-foreground-focus: #ffffff;
    --color-action-onbrand-subtle-foreground-hover: #ffffff;
    --color-action-onbrand-subtle-foreground-loading: #ffffff;
    --color-action-onbrand-subtle-foreground-pressed: #ffffff;
    --color-action-onbrand-subtlest-background: #2771d4;
    --color-action-onbrand-subtlest-background-disabled: #2771d4;
    --color-action-onbrand-subtlest-background-focus: #000b6e;
    --color-action-onbrand-subtlest-background-hover: #000b6e;
    --color-action-onbrand-subtlest-background-loading: #000b6e;
    --color-action-onbrand-subtlest-background-pressed: #000055;
    --color-action-onbrand-subtlest-border: #ffffff;
    --color-action-onbrand-subtlest-border-disabled: #528ddd;
    --color-action-onbrand-subtlest-border-focus: #a9c6ee;
    --color-action-onbrand-subtlest-border-hover: #ffffff;
    --color-action-onbrand-subtlest-border-loading: #ffffff;
    --color-action-onbrand-subtlest-border-pressed: #a9c6ee;
    --color-action-onbrand-subtlest-foreground: #ffffff;
    --color-action-onbrand-subtlest-foreground-disabled: #528ddd;
    --color-action-onbrand-subtlest-foreground-focus: #ffffff;
    --color-action-onbrand-subtlest-foreground-hover: #ffffff;
    --color-action-onbrand-subtlest-foreground-loading: #ffffff;
    --color-action-onbrand-subtlest-foreground-pressed: #ffffff;
    --color-action-onbrand-subtlest-selected-background: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtlest-selected-border: #e9f1fb;
    --color-action-onbrand-subtlest-selected-foreground: #e9f1fb;
    --color-action-onbrand-subtlest-unselected-background: rgba(255, 255, 255, 0);
    --color-action-onbrand-subtlest-unselected-border: #e9f1fb;
    --color-action-primary-active-background: #0e58ba;
    --color-action-primary-active-border: rgba(255, 255, 255, 0);
    --color-action-primary-active-foreground: #ffffff;
    --color-action-primary-background: #0e58ba;
    --color-action-primary-background-disabled: #e3e3e3;
    --color-action-primary-background-focus: #002588;
    --color-action-primary-background-hover: #002588;
    --color-action-primary-background-loading: #002588;
    --color-action-primary-background-pressed: #000055;
    --color-action-primary-border: rgba(255, 255, 255, 0);
    --color-action-primary-border-disabled: #d6d6d6;
    --color-action-primary-border-focus: #ffffff;
    --color-action-primary-border-focus-variant: #002588;
    --color-action-primary-border-hover: #002588;
    --color-action-primary-border-loading: rgba(255, 255, 255, 0);
    --color-action-primary-border-pressed: rgba(255, 255, 255, 0);
    --color-action-primary-foreground: #ffffff;
    --color-action-primary-foreground-disabled: #c8c8c8;
    --color-action-primary-foreground-focus: #ffffff;
    --color-action-primary-foreground-hover: #ffffff;
    --color-action-primary-foreground-loading: #ffffff;
    --color-action-primary-foreground-pressed: #ffffff;
    --color-action-primary-inactive-background: rgba(255, 255, 255, 0);
    --color-action-primary-inactive-border: #0e58ba;
    --color-action-primary-inactive-foreground: #0e58ba;
    --color-action-primary-selected-background: #2771d4;
    --color-action-primary-selected-background-variant: #589e00;
    --color-action-primary-selected-border: #2771d4;
    --color-action-primary-selected-foreground: #ffffff;
    --color-action-primary-unselected-background: #878787;
    --color-action-primary-unselected-background-variant: #212121;
    --color-action-primary-unselected-border: #878787;
    --color-action-primary-unselected-foreground: #ffffff;
    --color-action-primary-subtle-active-background: #a9c6ee;
    --color-action-primary-subtle-active-border: #002588;
    --color-action-primary-subtle-active-foreground: #002588;
    --color-action-primary-subtle-background: #d4e3f6;
    --color-action-primary-subtle-background-disabled: #f1f1f1;
    --color-action-primary-subtle-background-focus: #7daae5;
    --color-action-primary-subtle-background-hover: #7daae5;
    --color-action-primary-subtle-background-loading: #7daae5;
    --color-action-primary-subtle-background-pressed: #2771d4;
    --color-action-primary-subtle-border: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-border-disabled: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-border-focus: #ffffff;
    --color-action-primary-subtle-border-hover: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-border-loading: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-border-pressed: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-foreground: #002588;
    --color-action-primary-subtle-foreground-disabled: #d6d6d6;
    --color-action-primary-subtle-foreground-focus: #000055;
    --color-action-primary-subtle-foreground-hover: #000055;
    --color-action-primary-subtle-foreground-loading: #000055;
    --color-action-primary-subtle-foreground-pressed: #ffffff;
    --color-action-primary-subtle-inactive-background: #ffffff;
    --color-action-primary-subtle-inactive-border: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-inactive-foreground: #212121;
    --color-action-primary-subtle-selected-background: #d4e3f6;
    --color-action-primary-subtle-selected-border: rgba(255, 255, 255, 0);
    --color-action-primary-subtle-selected-foreground: #003ea1;
    --color-action-primary-subtle-unselected-background: #878787;
    --color-action-primary-subtle-unselected-border: #545454;
    --color-action-primary-subtle-unselected-foreground: #000000;
    --color-action-primary-subtlest-active-background: #d4e3f6;
    --color-action-primary-subtlest-active-border: #003ea1;
    --color-action-primary-subtlest-active-foreground: #003ea1;
    --color-action-primary-subtlest-background: #ffffff;
    --color-action-primary-subtlest-background-disabled: rgba(255, 255, 255, 0);
    --color-action-primary-subtlest-background-focus: #a9c6ee;
    --color-action-primary-subtlest-background-focus-variant: #7daae5;
    --color-action-primary-subtlest-background-hover: #a9c6ee;
    --color-action-primary-subtlest-background-hover-variant: #7daae5;
    --color-action-primary-subtlest-background-loading: #a9c6ee;
    --color-action-primary-subtlest-background-pressed: #7daae5;
    --color-action-primary-subtlest-border: #0e58ba;
    --color-action-primary-subtlest-border-disabled: #e3e3e3;
    --color-action-primary-subtlest-border-focus: #ffffff;
    --color-action-primary-subtlest-border-focus-variant: #002588;
    --color-action-primary-subtlest-border-hover: #002588;
    --color-action-primary-subtlest-border-hover-variant: #002588;
    --color-action-primary-subtlest-border-loading: #0e58ba;
    --color-action-primary-subtlest-border-pressed: #002588;
    --color-action-primary-subtlest-foreground: #0e58ba;
    --color-action-primary-subtlest-foreground-disabled: #d6d6d6;
    --color-action-primary-subtlest-foreground-focus: #002588;
    --color-action-primary-subtlest-foreground-focus-variant: #000b6e;
    --color-action-primary-subtlest-foreground-hover: #002588;
    --color-action-primary-subtlest-foreground-hover-variant: #000b6e;
    --color-action-primary-subtlest-foreground-loading: #003ea1;
    --color-action-primary-subtlest-foreground-pressed: #000055;
    --color-action-primary-subtlest-inactive-background: #ffffff;
    --color-action-primary-subtlest-inactive-border: #878787;
    --color-action-primary-subtlest-inactive-foreground: #212121;
    --color-action-primary-subtlest-selected-background: rgba(255, 255, 255, 0);
    --color-action-primary-subtlest-selected-border: #0E58BA;
    --color-action-primary-subtlest-selected-foreground: #0E58BA;
    --color-action-primary-subtlest-unselected-background: rgba(255, 255, 255, 0);
    --color-action-primary-subtlest-unselected-border: #545454;
    --color-action-primary-subtlest-unselected-foreground: #545454;
    --color-action-secondary-background: #ffad4a;
    --color-action-secondary-background-disabled: #e3e3e3;
    --color-action-secondary-background-focus: #ffd6a5;
    --color-action-secondary-background-hover: #ffd6a5;
    --color-action-secondary-background-loading: #ffd6a5;
    --color-action-secondary-background-pressed: #ff991d;
    --color-action-secondary-border: #000b6e;
    --color-action-secondary-border-disabled: rgba(255, 255, 255, 0);
    --color-action-secondary-border-focus: #ffffff;
    --color-action-secondary-border-hover: rgba(255, 255, 255, 0);
    --color-action-secondary-border-loading: rgba(255, 255, 255, 0);
    --color-action-secondary-border-pressed: rgba(255, 255, 255, 0);
    --color-action-secondary-foreground: #801a00;
    --color-action-secondary-foreground-disabled: #c8c8c8;
    --color-action-secondary-foreground-focus: #801a00;
    --color-action-secondary-foreground-hover: #801a00;
    --color-action-secondary-foreground-loading: #801a00;
    --color-action-secondary-foreground-pressed: #801a00;
    --color-action-secondary-subtle-background: #ffebd2;
    --color-action-secondary-subtle-background-disabled: #f1f1f1;
    --color-action-secondary-subtle-background-focus: #ffc277;
    --color-action-secondary-subtle-background-hover: #ffc277;
    --color-action-secondary-subtle-background-loading: #ffc277;
    --color-action-secondary-subtle-background-pressed: #ffad4a;
    --color-action-secondary-subtle-border: rgba(255, 255, 255, 0);
    --color-action-secondary-subtle-border-disabled: rgba(255, 255, 255, 0);
    --color-action-secondary-subtle-border-focus: #ffffff;
    --color-action-secondary-subtle-border-hover: rgba(255, 255, 255, 0);
    --color-action-secondary-subtle-border-loading: rgba(255, 255, 255, 0);
    --color-action-secondary-subtle-border-pressed: rgba(255, 255, 255, 0);
    --color-action-secondary-subtle-foreground: #b24d00;
    --color-action-secondary-subtle-foreground-disabled: #d6d6d6;
    --color-action-secondary-subtle-foreground-focus: #801a00;
    --color-action-secondary-subtle-foreground-hover: #801a00;
    --color-action-secondary-subtle-foreground-loading: #801a00;
    --color-action-secondary-subtle-foreground-pressed: #801a00;
    --color-action-secondary-subtlest-background: rgba(255, 255, 255, 0);
    --color-action-secondary-subtlest-background-disabled: rgba(255, 255, 255, 0);
    --color-action-secondary-subtlest-background-focus: #ffebd2;
    --color-action-secondary-subtlest-background-hover: #ffebd2;
    --color-action-secondary-subtlest-background-loading: #ffebd2;
    --color-action-secondary-subtlest-background-pressed: #ffc277;
    --color-action-secondary-subtlest-border: #b24d00;
    --color-action-secondary-subtlest-border-disabled: #f1f1f1;
    --color-action-secondary-subtlest-border-focus: #ffffff;
    --color-action-secondary-subtlest-border-hover: #b24d00;
    --color-action-secondary-subtlest-border-loading: #b24d00;
    --color-action-secondary-subtlest-border-pressed: #993300;
    --color-action-secondary-subtlest-foreground: #b24d00;
    --color-action-secondary-subtlest-foreground-disabled: #e3e3e3;
    --color-action-secondary-subtlest-foreground-focus: #b24d00;
    --color-action-secondary-subtlest-foreground-hover: #b24d00;
    --color-action-secondary-subtlest-foreground-loading: #b24d00;
    --color-action-secondary-subtlest-foreground-pressed: #801a00;
    --color-area-brand-background: #2771d4;
    --color-area-brand-border: rgba(255, 255, 255, 0);
    --color-area-brand-foreground: #ffffff;
    --color-area-brand-bold-background: #003ea1;
    --color-area-brand-bold-foreground: #ffffff;
    --color-area-neutral-boldest-background: #3a3a3a;
    --color-area-neutral-boldest-border: rgba(255, 255, 255, 0);
    --color-area-neutral-boldest-foreground: #ffffff;
    --color-area-neutral-subtler-background: #f1f1f1;
    --color-area-neutral-subtlest-active-foreground: #212121;
    --color-area-neutral-subtlest-background: #ffffff;
    --color-area-neutral-subtlest-border: #c8c8c8;
    --color-area-neutral-subtlest-foreground: #212121;
    --color-area-neutral-subtlest-foreground-body: #212121;
    --color-area-neutral-subtlest-foreground-body-subtle: #545454;
    --color-area-neutral-subtlest-foreground-headline: #212121;
    --color-area-neutral-subtlest-foreground-label: #212121;
    --color-area-neutral-subtlest-foreground-link: #0e58ba;
    --color-area-neutral-subtlest-inactive-foreground: #878787;
    --color-area-neutral-subtlest-selected-foreground: #2771d4;
    --color-area-neutral-subtlest-unselected-foreground: #878787;
    --color-feedback-attentive-background: #cc3a00;
    --color-feedback-attentive-border: rgba(255, 255, 255, 0);
    --color-feedback-attentive-foreground: #ffffff;
    --color-feedback-attentive-subtle-background: #ffe2d6;
    --color-feedback-attentive-subtle-border: #b22000;
    --color-feedback-attentive-subtle-foreground: #800000;
    --color-feedback-attentive-subtle-foreground-variant: #212121;
    --color-feedback-negative-background: #c80404;
    --color-feedback-negative-border: #c80404;
    --color-feedback-negative-border-variant: #ffffff;
    --color-feedback-negative-foreground: #ffffff;
    --color-feedback-negative-subtle-background: #fed7d7;
    --color-feedback-negative-subtle-border: #950000;
    --color-feedback-negative-subtle-border-variant: rgba(255, 255, 255, 0);
    --color-feedback-negative-subtle-foreground: #7b0000;
    --color-feedback-negative-subtle-foreground-variant: #3a3a3a;
    --color-feedback-negative-subtlest-background: rgba(255, 255, 255, 0);
    --color-feedback-negative-subtlest-background-variant: #ffffff;
    --color-feedback-negative-subtlest-border: #e11e1e;
    --color-feedback-negative-subtlest-foreground: #e11e1e;
    --color-feedback-negative-subtlest-foreground-variant: #212121;
    --color-feedback-positive-background: #3e8500;
    --color-feedback-positive-border: rgba(255, 255, 255, 0);
    --color-feedback-positive-foreground: #ffffff;
    --color-feedback-positive-subtle-background: #e3f1cc;
    --color-feedback-positive-subtle-border: #256c00;
    --color-feedback-positive-subtle-foreground: #003900;
    --color-feedback-positive-subtlest-background: rgba(255, 255, 255, 0);
    --color-feedback-positive-subtlest-background-variant: #ffffff;
    --color-feedback-positive-subtlest-border: #3e8500;
    --color-feedback-positive-subtlest-border-variant: #878787;
    --color-feedback-positive-subtlest-border-variant-2: rgba(255, 255, 255, 0);
    --color-feedback-positive-subtlest-foreground: #3e8500;
    --color-feedback-positive-subtlest-foreground-variant: #212121;
    --color-information-general-background: #008179;
    --color-information-general-border: rgba(255, 255, 255, 0);
    --color-information-general-foreground: #ffffff;
    --color-information-general-subtle-background: #ccebe9;
    --color-information-general-subtle-border: #00352c;
    --color-information-general-subtle-foreground: #00352c;
    --color-information-general-subtlest-background: rgba(255, 255, 255, 0);;
    --color-information-general-subtlest-border: #008179;
    --color-information-general-subtlest-foreground: #008179;
    --color-information-general-subtlest-foreground-variant: #212121;
}

/* --small-max-viewport */
@media (min-width: 414px) and (max-width: 767px) {
    html {
        --content-gap-size: 4vw;
        --fd-app-header-logo-height: 33px;
        --fd-app-header-height: 64px;
    }
}

/* --medium-viewport */
@media (min-width: 768px) and (max-width: 1219px) {
    html {
        --headline-content-gap-size: 20px;
        --content-wrapper-max-width: 830px;
        --fd-app-header-logo-height: 33px;
        --fd-app-header-height: 64px;
    }
}

/* --large-viewport */
@media (min-width: 1220px) {
    html {
        --content-wrapper-max-width: 1200px;
        --main-section-width: 830px;
        --main-aside-width: 330px;
        --headline-content-gap-size: 30px;
        --fd-app-header-logo-height: 43px;
        --fd-app-header-height: 80px;
    }
}

/* --medium-viewport and --large-viewport combined */
@media (min-width: 768px) {
    html {
        --content-gap-size: 30px;
        --vertical-gap-size: 20px;
    }
}

html {
    font-size: var(--font-size-base);
    font-family: var(--font-family-1);
    color: var(--color-text);
    -webkit-font-smoothing: antialiased;
}

body {
    margin: 0;
    background: var(--color-greyscale-200);
    /* Fixes the auto font-size adjustments on ios devices */
    --webkit-text-size-adjust: 100%;
}

/* Hide tracking pixel so there's no unwanted border at the bottom of the page. */
img[src="//a.clicktripz.com/api/advertisers/v1/prof?advertiserID=455&format=image"] {
    display: none;
}

@font-face {
    font-family: "Hind";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Hind Regular"), local("Hind-Regular"), url("https://media.fluege.de/fonts/hind/hind-v16-latin-regular.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Hind";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("https://media.fluege.de/fonts/hind/hind-v16-latin-500.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Hind";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local("Hind SemiBold"), local("Hind-SemiBold"), url("https://media.fluege.de/fonts/hind/hind-v16-latin-600.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}