@dnb/eufemia/cjs/style/themes/carnegie/carnegie-theme-basis.css

DNB Eufemia Design System UI Library

@charset "UTF-8";
/**
 * Carnegie UI Theme
 *
 */
/*
 * CSS Properties Carnegie
 *
 */
.eufemia-theme__carnegie,
:root {
  --ca-font-family-heading: 'ArizonaFlare', var(--font-family-default);
  --ca-color-ocean-green: #00343e;
  --ca-color-burgundy-red: #5c0022;
  --ca-color-noir-green: #001114;
  --ca-color-sea-green: #007272;
  --ca-color-noir-red: #24000d;
  --ca-color-sober-red: #8e4049;
  --ca-color-classic-beige: #f6eae4;
  --ca-color-pale-green: #ccf0e7;
  --ca-color-pale-red: #ffdedb;
}

/* This file is auto generated by makePropertiesFile.ts */
:root {
  --carnegie-coldgreen-100: #ddf2ec;
  --carnegie-coldgreen-300: #a5e1d2;
  --carnegie-coldgreen-500: #24968d;
  --carnegie-coldgreen-600: #007272;
  --carnegie-coldgreen-700: #14555a;
  --carnegie-coldgreen-950: #00343e;
  --carnegie-greyscale-0: #fff;
  --carnegie-greyscale-25: #fafafa;
  --carnegie-greyscale-50: #f8f8f8;
  --carnegie-greyscale-100: #ebebeb;
  --carnegie-greyscale-200: #ccc;
  --carnegie-greyscale-300: #b1b1b5;
  --carnegie-greyscale-400: #8e8e93;
  --carnegie-greyscale-500: #737373;
  --carnegie-greyscale-600: #636366;
  --carnegie-greyscale-700: #48484a;
  --carnegie-greyscale-800: #333;
  --carnegie-greyscale-1000-5: rgba(0 0 0 / 5%);
  --carnegie-greyscale-1000-10: rgba(0 0 0 / 10%);
  --carnegie-greyscale-1000-30: rgba(0 0 0 / 30%);
  --carnegie-greyscale-1000-50: rgba(0 0 0 / 50%);
  --carnegie-greyscale-1000: #000;
  --carnegie-burgundy-100: #ffdedb;
  --carnegie-burgundy-300: #e2a2a5;
  --carnegie-burgundy-500: #b66d73;
  --carnegie-burgundy-900: #5c0022;
  --carnegie-burgundy-950: #24000d;
  --carnegie-beige-50: #fdfbf9;
  --carnegie-beige-200: #f6eae4;
  --carnegie-beige-300: #dbcdc5;
  --carnegie-beige-500: #b5a197;
  --carnegie-beige-700: #897971;
  --carnegie-beige-800: #73655e;
  --carnegie-beige-950: #4a3f3a;
  --carnegie-blue-50: #f2f2f5;
  --carnegie-blue-100: #e1e9f9;
  --carnegie-blue-600: #276ace;
  --carnegie-green-50: #ebf4f2;
  --carnegie-green-100: #dcf3e8;
  --carnegie-green-600: #28b482;
  --carnegie-green-700: #007b5e;
  --carnegie-red-50: #fceeee;
  --carnegie-red-100: #fcdddd;
  --carnegie-red-600: #d52525;
  --carnegie-red-700: #b21e1e;
  --carnegie-yellow-50: #fbf6ec;
  --carnegie-yellow-500: #fdbb31;
  --carnegie-yellow-800: #805b0e;
  --carnegie-orange-600: #ff5400;
}

/* This file is auto generated by makePropertiesFile.ts */
:root {
  --token-color-background-page-background: var(--carnegie-greyscale-0);
  --token-color-background-action: var(--carnegie-greyscale-1000);
  --token-color-background-action-hover: var(--carnegie-greyscale-800);
  --token-color-background-action-hover-subtle: var(
    --carnegie-greyscale-1000-5
  );
  --token-color-background-action-pressed: var(--carnegie-greyscale-1000);
  --token-color-background-action-pressed-subtle: var(
    --carnegie-greyscale-1000-10
  );
  --token-color-background-action-focus: var(--carnegie-blue-600);
  --token-color-background-action-focus-subtle: var(--carnegie-blue-100);
  --token-color-background-action-disabled: var(--carnegie-greyscale-200);
  --token-color-background-action-inverse: var(--carnegie-greyscale-300);
  --token-color-background-action-hover-inverse: var(
    --carnegie-greyscale-300
  );
  --token-color-background-action-hover-subtle-inverse: var(
    --carnegie-greyscale-1000
  );
  --token-color-background-action-pressed-subtle-inverse: var(
    --carnegie-greyscale-800
  );
  --token-color-background-action-ondark: var(--carnegie-greyscale-0);
  --token-color-background-action-hover-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-background-action-hover-subtle-ondark: var(
    --carnegie-greyscale-1000-30
  );
  --token-color-background-action-pressed-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-background-action-pressed-subtle-ondark: var(
    --carnegie-greyscale-1000-50
  );
  --token-color-background-action-disabled-ondark: var(
    --carnegie-greyscale-700
  );
  --token-color-background-action-alternative: var(
    --carnegie-greyscale-1000
  );
  --token-color-background-action-alternative-hover-subtle: var(
    --carnegie-greyscale-100
  );
  --token-color-background-selected: var(--carnegie-greyscale-1000);
  --token-color-background-selected-subtle: var(--carnegie-beige-200);
  --token-color-background-selected-ondark: var(--carnegie-greyscale-0);
  --token-color-background-selected-subtle-ondark: var(
    --carnegie-greyscale-1000
  );
  --token-color-background-neutral: var(--carnegie-greyscale-0);
  --token-color-background-neutral-static: var(--carnegie-greyscale-0);
  --token-color-background-neutral-subtle: var(--carnegie-greyscale-50);
  --token-color-background-neutral-base: var(--carnegie-greyscale-100);
  --token-color-background-neutral-bold: var(--carnegie-greyscale-200);
  --token-color-background-neutral-alternative: var(--carnegie-blue-50);
  --token-color-background-info: var(--carnegie-coldgreen-600);
  --token-color-background-info-subtle: var(--carnegie-green-50);
  --token-color-background-positive: var(--carnegie-green-700);
  --token-color-background-positive-subtle: var(--carnegie-green-50);
  --token-color-background-warning: var(--carnegie-yellow-500);
  --token-color-background-warning-subtle: var(--carnegie-yellow-50);
  --token-color-background-error: var(--carnegie-red-600);
  --token-color-background-error-subtle: var(--carnegie-red-50);
  --token-color-background-marketing: var(--carnegie-greyscale-800);
  --token-color-background-marketing-subtle: var(--carnegie-blue-50);
  --token-color-text-action: var(--carnegie-greyscale-1000);
  --token-color-text-action-hover: var(--carnegie-greyscale-1000);
  --token-color-text-action-pressed: var(--carnegie-greyscale-1000);
  --token-color-text-action-focus: var(--carnegie-blue-600);
  --token-color-text-action-disabled: var(--carnegie-greyscale-200);
  --token-color-text-action-inverse: var(--carnegie-greyscale-0);
  --token-color-text-action-hover-inverse: var(--carnegie-greyscale-0);
  --token-color-text-action-pressed-inverse: var(--carnegie-greyscale-0);
  --token-color-text-selected: var(--carnegie-greyscale-800);
  --token-color-text-action-ondark: var(--carnegie-greyscale-0);
  --token-color-text-action-hover-ondark: var(--carnegie-greyscale-0);
  --token-color-text-action-pressed-ondark: var(--carnegie-greyscale-0);
  --token-color-text-action-disabled-ondark: var(--carnegie-greyscale-400);
  --token-color-text-action-alternative-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-text-neutral: var(--carnegie-greyscale-1000);
  --token-color-text-neutral-onlight: var(--carnegie-greyscale-1000);
  --token-color-text-neutral-alternative: var(--carnegie-greyscale-500);
  --token-color-text-neutral-inverse: var(--carnegie-greyscale-0);
  --token-color-text-neutral-ondark: var(--carnegie-greyscale-0);
  --token-color-text-neutral-subtle: var(--carnegie-greyscale-200);
  --token-color-text-neutral-subtle-ondark: var(--carnegie-greyscale-200);
  --token-color-text-destructive: var(--carnegie-red-600);
  --token-color-text-destructive-inverse: var(--carnegie-orange-600);
  --token-color-text-warning: var(--carnegie-yellow-800);
  --token-color-text-warning-inverse: var(--carnegie-yellow-500);
  --token-color-text-positive: var(--carnegie-green-700);
  --token-color-text-positive-inverse: var(--carnegie-green-600);
  --token-color-icon-action: var(--carnegie-greyscale-1000);
  --token-color-icon-action-hover: var(--carnegie-greyscale-1000);
  --token-color-icon-action-pressed: var(--carnegie-greyscale-1000);
  --token-color-icon-action-focus: var(--carnegie-blue-600);
  --token-color-icon-action-disabled: var(--carnegie-greyscale-200);
  --token-color-icon-action-inverse: var(--carnegie-greyscale-0);
  --token-color-icon-action-hover-inverse: var(--carnegie-greyscale-0);
  --token-color-icon-action-pressed-inverse: var(--carnegie-greyscale-0);
  --token-color-icon-selected: var(--carnegie-greyscale-1000);
  --token-color-icon-selected-ondark: var(--carnegie-greyscale-100);
  --token-color-icon-action-ondark: var(--carnegie-greyscale-0);
  --token-color-icon-action-alternative-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-icon-action-hover-ondark: var(--carnegie-greyscale-0);
  --token-color-icon-action-pressed-ondark: var(--carnegie-greyscale-0);
  --token-color-icon-action-disabled-ondark: var(--carnegie-greyscale-400);
  --token-color-icon-neutral: var(--carnegie-greyscale-1000);
  --token-color-icon-neutral-static: var(--carnegie-greyscale-1000);
  --token-color-icon-neutral-inverse: var(--carnegie-greyscale-0);
  --token-color-icon-neutral-ondark: var(--carnegie-greyscale-0);
  --token-color-icon-neutral-alternative: var(--carnegie-greyscale-500);
  --token-color-icon-destructive: var(--carnegie-red-600);
  --token-color-icon-info: var(--carnegie-coldgreen-600);
  --token-color-icon-info-subtle: var(--carnegie-green-50);
  --token-color-icon-positive: var(--carnegie-green-700);
  --token-color-icon-positive-subtle: var(--carnegie-green-50);
  --token-color-icon-warning: var(--carnegie-yellow-500);
  --token-color-icon-warning-subtle: var(--carnegie-yellow-50);
  --token-color-icon-error: var(--carnegie-red-600);
  --token-color-icon-error-subtle: var(--carnegie-red-50);
  --token-color-icon-marketing: var(--carnegie-greyscale-800);
  --token-color-icon-marketing-subtle: var(--carnegie-blue-50);
  --token-color-stroke-action: var(--carnegie-greyscale-1000);
  --token-color-stroke-action-alternative: var(--carnegie-greyscale-1000);
  --token-color-stroke-action-hover: var(--carnegie-greyscale-1000);
  --token-color-stroke-action-pressed: var(--carnegie-greyscale-700);
  --token-color-stroke-action-inverse: var(--carnegie-greyscale-0);
  --token-color-stroke-action-hover-inverse: var(--carnegie-greyscale-0);
  --token-color-stroke-action-pressed-inverse: var(
    --carnegie-greyscale-400
  );
  --token-color-stroke-action-focus: var(--carnegie-blue-600);
  --token-color-stroke-action-focus-subtle: var(--carnegie-blue-100);
  --token-color-stroke-action-disabled: var(--carnegie-greyscale-300);
  --token-color-stroke-selected: var(--carnegie-greyscale-1000);
  --token-color-stroke-selected-ondark: var(--carnegie-greyscale-300);
  --token-color-stroke-action-ondark: var(--carnegie-greyscale-0);
  --token-color-stroke-action-alternative-ondark: var(
    --carnegie-greyscale-200
  );
  --token-color-stroke-action-hover-ondark: var(--carnegie-greyscale-0);
  --token-color-stroke-action-pressed-ondark: var(--carnegie-greyscale-0);
  --token-color-stroke-action-disabled-ondark: var(
    --carnegie-greyscale-600
  );
  --token-color-stroke-neutral: var(--carnegie-beige-300);
  --token-color-stroke-neutral-ondark: var(--carnegie-greyscale-0);
  --token-color-stroke-neutral-subtle: var(--carnegie-beige-200);
  --token-color-stroke-neutral-bold: var(--carnegie-greyscale-1000);
  --token-color-stroke-neutral-alternative: var(--carnegie-greyscale-200);
  --token-color-stroke-info: var(--carnegie-coldgreen-600);
  --token-color-stroke-positive: var(--carnegie-green-700);
  --token-color-stroke-warning: var(--carnegie-yellow-500);
  --token-color-stroke-error: var(--carnegie-red-600);
  --token-color-stroke-marketing: var(--carnegie-greyscale-800);
  --token-color-decorative-first-muted: var(--carnegie-beige-50);
  --token-color-decorative-first-muted-static: var(--carnegie-beige-50);
  --token-color-decorative-first-subtle: var(--carnegie-beige-200);
  --token-color-decorative-first-subtle-static: var(--carnegie-beige-200);
  --token-color-decorative-first-base: var(--carnegie-beige-500);
  --token-color-decorative-first-base-static: var(--carnegie-beige-500);
  --token-color-decorative-first-bold: var(--carnegie-beige-800);
  --token-color-decorative-first-bold-static: var(--carnegie-beige-800);
  --token-color-decorative-first-intense: var(--carnegie-beige-950);
  --token-color-decorative-first-intense-static: var(--carnegie-beige-950);
  --token-color-decorative-second-muted: var(--carnegie-burgundy-100);
  --token-color-decorative-second-muted-static: var(
    --carnegie-burgundy-100
  );
  --token-color-decorative-second-subtle: var(--carnegie-burgundy-300);
  --token-color-decorative-second-subtle-static: var(
    --carnegie-burgundy-300
  );
  --token-color-decorative-second-base: var(--carnegie-burgundy-500);
  --token-color-decorative-second-base-static: var(
    --carnegie-burgundy-500
  );
  --token-color-decorative-second-bold: var(--carnegie-burgundy-900);
  --token-color-decorative-second-bold-static: var(
    --carnegie-burgundy-900
  );
  --token-color-decorative-second-intense: var(--carnegie-burgundy-950);
  --token-color-decorative-second-intense-static: var(
    --carnegie-burgundy-950
  );
  --token-color-decorative-third-muted: var(--carnegie-coldgreen-100);
  --token-color-decorative-third-muted-static: var(--carnegie-green-100);
  --token-color-decorative-third-subtle: var(--carnegie-coldgreen-300);
  --token-color-decorative-third-subtle-static: var(
    --carnegie-coldgreen-300
  );
  --token-color-decorative-third-base: var(--carnegie-coldgreen-500);
  --token-color-decorative-third-base-static: var(
    --carnegie-coldgreen-500
  );
  --token-color-decorative-third-bold: var(--carnegie-coldgreen-700);
  --token-color-decorative-third-bold-static: var(
    --carnegie-coldgreen-700
  );
  --token-color-decorative-third-intense: var(--carnegie-coldgreen-950);
  --token-color-decorative-third-intense-static: var(
    --carnegie-coldgreen-950
  );
  --token-color-component-button-background-action: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-background-action-hover: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-background-action-destructive: var(
    --carnegie-red-600
  );
  --token-color-component-button-background-action-destructive-hover: var(
    --carnegie-red-600
  );
  --token-color-component-button-background-action-destructive-hover-subtle: var(
    --carnegie-red-50
  );
  --token-color-component-button-background-action-destructive-pressed: var(
    --carnegie-red-700
  );
  --token-color-component-button-background-action-destructive-pressed-subtle: var(
    --carnegie-red-100
  );
  --token-color-component-button-text-neutral: var(--carnegie-greyscale-0);
  --token-color-component-button-text-neutral-inverse: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-text-neutral-ondark: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-text-action: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-text-action-hover: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-text-action-inverse: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-action-hover-inverse: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-action-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-action-hover-ondark: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-action-disabled: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-neutral-destructive: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-text-action-destructive: var(
    --carnegie-red-600
  );
  --token-color-component-button-text-action-destructive-hover: var(
    --carnegie-red-600
  );
  --token-color-component-button-text-action-destructive-pressed: var(
    --carnegie-red-700
  );
  --token-color-component-button-icon-neutral: var(--carnegie-greyscale-0);
  --token-color-component-button-icon-neutral-ondark: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-icon-action: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-icon-action-hover: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-icon-action-disabled: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-icon-neutral-destructive: var(
    --carnegie-greyscale-0
  );
  --token-color-component-button-icon-action-destructive: var(
    --carnegie-red-600
  );
  --token-color-component-button-icon-action-destructive-hover: var(
    --carnegie-red-600
  );
  --token-color-component-button-icon-action-destructive-pressed: var(
    --carnegie-red-700
  );
  --token-color-component-button-stroke-action: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-stroke-action-hover: var(
    --carnegie-greyscale-1000
  );
  --token-color-component-button-stroke-action-destructive: var(
    --carnegie-red-600
  );
  --token-color-component-button-stroke-action-destructive-hover: var(
    --carnegie-red-600
  );
  --token-color-component-button-stroke-action-destructive-pressed: var(
    --carnegie-red-700
  );
  --token-color-component-button-stroke-selected: var(
    --carnegie-beige-700
  );
  --token-color-component-tooltip-background-neutral: var(
    --carnegie-greyscale-800
  );
  --token-color-component-table-background-neutral-alternative: var(
    --carnegie-greyscale-25
  );
  --token-color-component-dimmer-background: var(
    --carnegie-greyscale-1000-30
  );
  --token-color-component-switch-action-disabled-ondark: var(
    --carnegie-greyscale-800
  );
  --token-color-component-progressbar-neutral-onsubtle: var(
    --carnegie-greyscale-200
  );
}

/*
 * Typography
 *
 * The font-family properties are defined in the properties.scss file, like:
 * --font-family-default:
 *
 */
/*
 * Typography
 *
 * The font-family properties are defined in the properties.scss file, like:
 * --font-family-default:
 *
 */
.dnb-typo-regular {
  font-family: var(--font-family-default);
  font-weight: normal;
  font-style: normal;
}

.dnb-typo-medium {
  font-family: var(--font-family-default);
  font-weight: var(--font-weight-medium);
  font-style: normal;
}

.dnb-typo-bold {
  font-family: var(--font-family-default);
  font-weight: var(--font-weight-bold);
  font-style: normal;
}

.dnb-typo-mono-regular {
  font-family: var(--font-family-monospace);
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: DNB;
  src: url("../../../assets/fonts/dnb/DNB-Regular.woff2") format("woff2"), url("../../../assets/fonts/dnb/DNB-Regular.woff") format("woff"), url("../../../assets/fonts/dnb/DNB-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: DNB;
  src: url("../../../assets/fonts/dnb/DNB-Medium.woff2") format("woff2"), url("../../../assets/fonts/dnb/DNB-Medium.woff") format("woff"), url("../../../assets/fonts/dnb/DNB-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: DNB;
  src: url("../../../assets/fonts/dnb/DNB-Bold.woff2") format("woff2"), url("../../../assets/fonts/dnb/DNB-Bold.woff") format("woff"), url("../../../assets/fonts/dnb/DNB-Bold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: DNBMono;
  src: url("../../../assets/fonts/dnb/DNBMono-Regular.woff2") format("woff2"), url("../../../assets/fonts/dnb/DNBMono-Regular.woff") format("woff"), url("../../../assets/fonts/dnb/DNBMono-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: fallback;
}
.dnb-typo-regular {
  font-family: var(--font-family-default);
  font-weight: normal;
  font-style: normal;
}

.dnb-typo-medium {
  font-family: var(--font-family-default);
  font-weight: var(--font-weight-medium);
  font-style: normal;
}

.dnb-typo-bold {
  font-family: var(--font-family-default);
  font-weight: var(--font-weight-bold);
  font-style: normal;
}

@font-face {
  font-family: ArizonaFlare;
  src: url("../../../assets/fonts/carnegie/ArizonaFlare-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: ArizonaFlare;
  src: url("../../../assets/fonts/carnegie/ArizonaFlare-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: ArizonaFlare;
  src: url("../../../assets/fonts/carnegie/ArizonaFlare-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: fallback;
}
/**
 * ATTENTION: This file is auto generated by using "themeFactory".
 * But you still can change the content of this file on the very top.
 */
/**
 * ATTENTION: This file is auto generated by using "styleFactory".
 * Do not change the content!
 *
 */
/*
 * Utilities
 */
/*
 * Utilities
 */
/*
 * Blockquote
 *
 */
/*
 * Core Styles
 * Mainly only the margins are defined in here
 *
 */
/*
 * Blockquote
 *
 */
/**
 * ATTENTION: This file is auto generated by using "styleFactory".
 * Do not change the content!
 *
 */
/*
 * Anchor mixins
 *
 */
/*
 * Utilities
 */
.dnb-blockquote {
  --blockquote-padding-top: 1.5rem;
  --blockquote-padding-left: 1.5rem;
  --blockquote-padding-bottom: 2rem;
  --blockquote-quote-size: 3rem;
  --blockquote-quote-padding: 5.5rem;
  --blockquote-cite-style: italic;
  display: inline-block;
  width: auto;
}
.dnb-blockquote:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-blockquote:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-blockquote:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-blockquote:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-blockquote {
  padding: 1.5rem;
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
  border-radius: 1rem;
  color: var(--token-color-text-action-ondark);
  background-color: var(--token-color-decorative-first-intense-static);
  position: relative;
}
.dnb-blockquote .dnb-blockquote__quote-icon {
  position: absolute;
  top: var(--blockquote-padding-top);
  left: var(--blockquote-padding-left);
  width: var(--blockquote-quote-size);
  height: var(--blockquote-quote-size);
  color: var(--blockquote-icon-color, currentcolor);
  fill: currentcolor;
  stroke: currentcolor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.dnb-blockquote .dnb-anchor {
  font-size: inherit;
}
.dnb-blockquote, .dnb-blockquote.dnb-blockquote--left {
  padding-left: var(--blockquote-quote-padding);
  padding-top: var(--blockquote-padding-top);
  padding-bottom: var(--blockquote-padding-bottom);
}
.dnb-blockquote.dnb-blockquote--top {
  padding-left: var(--blockquote-padding-left);
  padding-top: var(--blockquote-quote-padding);
  padding-bottom: var(--blockquote-padding-bottom);
}
.dnb-blockquote.dnb-blockquote--no-background {
  color: inherit;
  background-color: transparent;
}
.dnb-blockquote .dnb-cite,
.dnb-blockquote .dnb-figcaption,
.dnb-blockquote cite,
.dnb-blockquote footer,
.dnb-blockquote figcaption {
  display: block;
  margin-top: 1rem;
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-basis);
  font-style: var(--blockquote-cite-style);
}
.dnb-blockquote .dnb-cite::before,
.dnb-blockquote .dnb-figcaption::before,
.dnb-blockquote cite::before,
.dnb-blockquote footer::before,
.dnb-blockquote figcaption::before {
  content: "—";
  display: inline-block;
  padding-right: 0.5rem;
}
.dnb-spacing .dnb-blockquote h1, .dnb-spacing .dnb-blockquote h2, .dnb-spacing .dnb-blockquote h3, .dnb-spacing .dnb-blockquote .dnb-h--xx-large, .dnb-spacing .dnb-blockquote .dnb-h--large, .dnb-spacing .dnb-blockquote .dnb-h--medium, .dnb-spacing .dnb-blockquote .dnb-lead {
  margin: 0;
}

.dnb-spacing .dnb-blockquote:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-spacing .dnb-blockquote:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}
.dnb-spacing .dnb-blockquote p:last-child {
  margin-bottom: 0;
}

/*
 * Blockquote
 *
 */
/*
 * Code / Pre
 *
 */
/*
 * Blockquote
 *
 */
/*
 * Utilities
 */
.dnb-code {
  display: inline-block;
}
del .dnb-code {
  -webkit-text-decoration: line-through;
  text-decoration: line-through;
}
.dnb-code:not([class*=dnb-space]) {
  margin: calc(-0.25em / 0.875) 0;
}
.dnb-code {
  padding: calc(0.25em / 0.875);
  font-size: 0.875em;
  text-decoration: inherit;
  line-height: calc(var(--line-height-xx-small--em) / 0.875);
  color: var(--token-color-text-neutral);
  background-color: var(--token-color-background-positive-subtle);
  box-shadow: inset 0 0 0 0.0625rem var(--token-color-stroke-neutral-subtle);
  border-radius: 0.25em;
}
.dnb-code--surface-dark {
  color: var(--token-color-text-neutral-ondark);
  background-color: inherit;
  box-shadow: inset 0 0 0 0.0625rem var(--token-color-stroke-action-disabled-ondark);
}
.dnb-code .dnb-anchor {
  font-size: inherit;
}

.dnb-pre {
  display: block;
  overflow: auto;
}
.dnb-pre:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-pre:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-pre:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-pre:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-pre {
  padding: 1rem;
  border-radius: 0.5rem;
  white-space: pre;
  vertical-align: baseline;
  outline: none;
  text-shadow: none;
  -webkit-hyphens: none;
          hyphens: none;
  word-wrap: normal;
  word-break: normal;
  text-align: left;
  word-spacing: normal;
  tab-size: 2;
  font-size: inherit;
  font-family: var(--font-family-monospace);
  color: var(--color-white);
  background-color: var(--color-black-80);
}
.dnb-pre pre {
  padding: 1rem;
}
.dnb-pre .dnb-spacing pre:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-pre .dnb-spacing pre:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}

.dnb-spacing .dnb-pre:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-spacing .dnb-pre:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}

.dnb-skeleton > .dnb-code {
  background-color: transparent;
}

/*
 * Blockquote
 *
 */
/*
 * Hr tag / line
 *
 */
/*
 * Blockquote
 *
 */
/*
 * Utilities
 */
.dnb-hr {
  position: relative;
  padding: 0;
  width: 100%;
  height: 0;
  display: flow-root;
}
.dnb-hr:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-hr:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-hr:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-hr:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-hr {
  border: 0;
}
.dnb-hr::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  height: var(--thickness);
  background-color: var(--hr-color, grey);
  border-radius: calc(var(--thickness) / 2);
}
.dnb-hr--dashed::after {
  background-image: linear-gradient(to right, var(--hr-color, grey) 50%, transparent 0%);
  background-size: 0.5rem 0.0625rem;
  background-repeat: repeat-x;
  background-color: transparent;
}
.dnb-hr--breakout::after {
  left: -100vw;
  box-shadow: 100vw 0 0 0 var(--hr-color, grey);
  border-radius: 0;
}
.dnb-hr {
  --thickness: calc(var(--hr-thickness, 0.0625rem) + var(--modifier, 0px));
}
.dnb-spacing .dnb-hr:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-spacing .dnb-hr:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}

/*
 * Image
 *
 */
/*
 * Utilities
 */
/*
 * Image
 *
 */
.dnb-img {
  display: inline-flex;
  flex-direction: column;
}
.dnb-img:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-img:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-img:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-img:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-img {
  padding: 0;
  text-align: center;
  align-items: center;
}
.dnb-img img,
.dnb-img figcaption {
  font-size: var(--font-size-basis);
}
.dnb-img img {
  position: relative;
  z-index: 2;
  box-sizing: content-box;
  max-width: 100%;
  border-style: none;
  border-radius: inherit;
}
.dnb-img img[alt]::after {
  content: attr(alt);
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
}
.dnb-img figcaption {
  margin-top: 0.5rem;
}

/*
 * Label
 *
 */
.dnb-label {
  cursor: pointer;
  overflow-wrap: break-word;
  color: var(--token-color-text-neutral);
}
.dnb-label[disabled] {
  cursor: not-allowed;
}

/*
 * Blockquote
 *
 */
/*
 * Lists
 *
 */
/*
 * Blockquote
 *
 */
/**
 * ATTENTION: This file is auto generated by using "styleFactory".
 * Do not change the content!
 *
 */
/*
 * Utilities
 */
/*
 * Lists
 *
 */
.dnb-ul:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-ul:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-ul:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-ul:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-ul {
  padding: 0;
}
.dnb-ul:not([class*=dnb-space__left]) {
  padding-left: 2rem;
}
.dnb-ul {
  font-size: var(--font-size-basis);
  line-height: var(--line-height-basis);
  color: var(--token-color-text-neutral, currentColor);
}
.dnb-ul ul, .dnb-ul ol {
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-left: 2rem;
}
.dnb-ul li, .dnb-ul--outside li {
  position: relative;
}
.dnb-ul li::before, .dnb-ul--outside li::before {
  position: absolute;
  left: -10rem;
  width: 10rem;
  padding-right: 0.25rem;
  text-align: right;
}
.dnb-ul--inside li::before {
  position: relative;
  left: 0;
  width: auto;
  padding-right: 0;
  text-align: initial;
}
.dnb-ul .dnb-anchor {
  font-size: inherit;
}
.dnb-ul li {
  display: list-item;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.dnb-ol:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-ol:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-ol:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-ol:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-ol {
  padding: 0;
}
.dnb-ol:not([class*=dnb-space__left]) {
  padding-left: 2rem;
}
.dnb-ol {
  font-size: var(--font-size-basis);
  line-height: var(--line-height-basis);
  color: var(--token-color-text-neutral, currentColor);
}
.dnb-ol ul, .dnb-ol ol {
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-left: 2rem;
}
.dnb-ol li, .dnb-ol--outside li {
  position: relative;
}
.dnb-ol li::before, .dnb-ol--outside li::before {
  position: absolute;
  left: -10rem;
  width: 10rem;
  padding-right: 0.25rem;
  text-align: right;
}
.dnb-ol--inside li::before {
  position: relative;
  left: 0;
  width: auto;
  padding-right: 0;
  text-align: initial;
}
.dnb-ol .dnb-anchor {
  font-size: inherit;
}
.dnb-ol li {
  display: list-item;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.dnb-ol {
  color: var(--token-color-text-neutral, currentColor);
}
.dnb-ol ul, .dnb-ol ol {
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-left: 2rem;
}
.dnb-ol li, .dnb-ol--outside li {
  position: relative;
}
.dnb-ol li::before, .dnb-ol--outside li::before {
  position: absolute;
  left: -10rem;
  width: 10rem;
  padding-right: 0.25rem;
  text-align: right;
}
.dnb-ol--inside li::before {
  position: relative;
  left: 0;
  width: auto;
  padding-right: 0;
  text-align: initial;
}
.dnb-ol .dnb-anchor {
  font-size: inherit;
}
.dnb-ol > li {
  list-style-type: decimal;
}
.dnb-ol--nested, .dnb-ol--nested ol {
  counter-reset: item;
}
.dnb-ol--nested li {
  display: block;
}
.dnb-ol--nested li::before {
  content: counters(item, ".") ". ";
  counter-increment: item;
}
.dnb-ol--nested li li::before {
  content: counters(item, ".") " ";
  counter-increment: item;
}
.dnb-ol[type] li {
  display: list-item;
  list-style-type: inherit;
}
.dnb-ol[type] li::before, .dnb-ol[type] li li::before {
  content: none;
}

.dnb-dl {
  --column-gap: 1rem;
  --row-gap: 0.5rem;
}
.dnb-dl:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-dl:not([class*=dnb-space__bottom]) {
  margin-bottom: 0;
}
.dnb-dl {
  padding: 0;
  font-size: var(--font-size-basis);
  line-height: var(--line-height-basis);
}
.dnb-dl dt {
  padding: 0;
  font-weight: var(--font-weight-medium);
}
.dnb-dl dd ~ dt {
  margin-top: var(--row-gap);
}
.dnb-dl dt:not(:first-of-type) {
  margin-top: calc(var(--row-gap) + 1rem);
}
.dnb-dl dd {
  padding: 0;
  margin: 0.5rem 0 1rem;
}
.dnb-dl > dd > dl, .dnb-dl:not([class*=dnb-space]) > dd > dl {
  margin-top: calc(var(--row-gap) + 0.5rem);
  margin-left: 2rem;
}
@media screen and (min-width: 40.00625em) {
  .dnb-dl__layout--horizontal {
    --dt-max-width: 40%;
    --dd-max-width: calc(60% - 1rem);
    display: flex;
    flex-wrap: wrap;
    max-width: var(--prose-max-width);
    width: 100%;
  }
  .dnb-dl__layout--horizontal dt {
    margin-top: 0;
    margin-right: calc(var(--column-gap) - 0.5rem);
    max-width: var(--dt-max-width);
  }
  .dnb-dl__layout--horizontal dd {
    width: var(--dd-max-width);
    align-self: end;
  }
  .dnb-dl__layout--horizontal dt:not(:first-of-type), .dnb-dl__layout--horizontal dd, .dnb-dl__layout--horizontal dd ~ dt:not(:first-of-type) {
    margin-top: var(--row-gap);
    margin-bottom: 0;
  }
  .dnb-dl__layout--horizontal dt:not(:first-of-type):first-of-type, .dnb-dl__layout--horizontal dd:first-of-type, .dnb-dl__layout--horizontal dd ~ dt:not(:first-of-type):first-of-type {
    margin-top: 0;
  }
  .dnb-dl dd.dnb-dl__item {
    visibility: hidden;
    -webkit-user-select: none;
            user-select: none;
    flex-basis: 100%;
    height: 0;
    margin: 0;
  }
  .dnb-dl:not(.dnb-dl__layout--horizontal) dd.dnb-dl__item {
    display: none;
  }
  .dnb-dl__layout--grid {
    --dt-max-width: 15ch;
    --dd-max-width: 40ch;
    display: grid;
    grid-template-columns: -webkit-max-content 1fr;
    grid-template-columns: max-content 1fr;
    column-gap: var(--column-gap);
    row-gap: var(--row-gap);
    /* stylelint-disable */
  }
  .dnb-dl__layout--grid dt {
    max-width: var(--dt-max-width);
  }
  .dnb-dl__layout--grid dt:not(:first-of-type) {
    margin-top: 0;
  }
  .dnb-dl__layout--grid dd {
    max-width: var(--dd-max-width);
    align-self: end;
  }
  .dnb-dl__layout--grid dt, .dnb-dl__layout--grid dd, .dnb-dl__layout--grid dd ~ dt {
    margin: 0;
  }
  .dnb-dl__layout--grid {
    /* stylelint-enable */
  }
}

.dnb-spacing .dnb-ul:not([class*=dnb-space__top]),
.dnb-spacing .dnb-ol:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-spacing .dnb-ul:not([class*=dnb-space__bottom]),
.dnb-spacing .dnb-ol:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}
.dnb-spacing .dnb-ul > li,
.dnb-spacing .dnb-ol > li {
  margin-top: 1rem;
  margin-bottom: 1rem;
  /* stylelint-disable-next-line */
}
.dnb-spacing .dnb-ul > li > p,
.dnb-spacing .dnb-ol > li > p {
  margin-top: 1rem;
}
.dnb-spacing .dnb-ul li > ul, .dnb-spacing .dnb-ul:not([class*=dnb-space]) li > ul, .dnb-spacing .dnb-ul li > ol, .dnb-spacing .dnb-ul:not([class*=dnb-space]) li > ol,
.dnb-spacing .dnb-ol li > ul,
.dnb-spacing .dnb-ol:not([class*=dnb-space]) li > ul,
.dnb-spacing .dnb-ol li > ol,
.dnb-spacing .dnb-ol:not([class*=dnb-space]) li > ol {
  margin-top: -0.5rem;
}
.dnb-spacing .dnb-dl:not([class*=dnb-space__top]) {
  margin-top: 0;
}
.dnb-spacing .dnb-dl:not([class*=dnb-space__bottom]) {
  margin-bottom: 1.5rem;
}

.dnb-unstyled-list {
  list-style-type: none;
}
.dnb-unstyled-list:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-unstyled-list:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-unstyled-list:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-unstyled-list:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-unstyled-list:not([class*=dnb-space__left]) {
  padding-left: 0;
}
.dnb-unstyled-list > li {
  list-style-type: none;
}
.dnb-unstyled-list > li::before {
  content: none;
}
.dnb-unstyled-list > dl,
.dnb-unstyled-list > dd {
  margin-left: 0;
}

/*
 * Blockquote
 *
 */
/*
 * Typography
 *
 */
/*
 * Blockquote
 *
 */
/*
 * Utilities
 */
.dnb-lead, .dnb-h--xx-large, .dnb-h--x-large, .dnb-h--large, .dnb-h--medium, .dnb-h--basis, .dnb-h--small, .dnb-h--x-small, .dnb-core-style .dnb-lead, .dnb-core-style .dnb-h--xx-large, .dnb-core-style .dnb-h--x-large, .dnb-core-style .dnb-h--large, .dnb-core-style .dnb-h--medium, .dnb-core-style .dnb-h--basis, .dnb-core-style .dnb-h--small, .dnb-core-style .dnb-h--x-small, h1, h2, h3, h4, h5, h6, p, b, small, strong, .dnb-p, .dnb-small, .dnb-table, sub, sup {
  --typography-h-default-font-weight: var(--font-weight-medium);
  --typography-h-xx-large-font-size: var(--font-size-xx-large);
  --typography-h-xx-large-line-height: var(--line-height-xx-large);
  --typography-h-xx-large-small-font-size: var(--font-size-x-large);
  --typography-h-xx-large-small-line-height: var(--line-height-x-large);
  --typography-h-xx-large-weight: var(--font-weight-medium);
  --typography-h-x-large-font-size: var(--font-size-x-large);
  --typography-h-x-large-line-height: var(--line-height-x-large);
  --typography-h-x-large-small-font-size: var(--font-size-large);
  --typography-h-x-large-small-line-height: var(--line-height-large);
  --typography-h-x-large-weight: var(--font-weight-medium);
  --typography-h-large-font-size: var(--font-size-large);
  --typography-h-large-line-height: var(--line-height-large);
  --typography-h-large-small-font-size: var(--font-size-medium);
  --typography-h-large-small-line-height: var(--line-height-medium);
  --typography-h-large-weight: var(--font-weight-medium);
  --typography-lead-font-size: var(--font-size-lead);
  --typography-lead-line-height: var(--line-height-lead);
  --typography-lead-small-font-size: var(--font-size-lead);
  --typography-lead-small-line-height: var(--line-height-lead);
  --typography-lead-weight: var(--font-weight-medium);
  --typography-h-medium-font-size: var(--font-size-medium);
  --typography-h-medium-line-height: var(--line-height-medium);
  --typography-h-medium-small-font-size: var(--font-size-basis);
  --typography-h-medium-small-line-height: var(--line-height-basis);
  --typography-h-medium-weight: var(--font-weight-medium);
  --typography-h-basis-font-size: var(--font-size-basis);
  --typography-h-basis-line-height: var(--line-height-basis);
  --typography-h-basis-small-font-size: var(--font-size-small);
  --typography-h-basis-small-line-height: var(--line-height-small);
  --typography-h-basis-weight: var(--font-weight-medium);
  --typography-h-basis-font-family: var(--font-family-default);
  --typography-h-small-font-size: var(--font-size-small);
  --typography-h-small-line-height: var(--line-height-small);
  --typography-h-small-small-font-size: var(--font-size-x-small);
  --typography-h-small-small-line-height: var(--line-height-x-small);
  --typography-h-small-weight: var(--font-weight-medium);
  --typography-h-small-font-family: var(--font-family-default);
  --typography-h-x-small-font-size: var(--font-size-x-small);
  --typography-h-x-small-line-height: var(--line-height-x-small);
  --typography-h-x-small-weight: var(--font-weight-medium);
  --typography-h-x-small-font-family: var(--font-family-default);
}

.dnb-lead,
.dnb-h--xx-large,
.dnb-h--x-large,
.dnb-h--large,
.dnb-h--medium,
.dnb-h--basis,
.dnb-h--small,
.dnb-h--x-small,
.dnb-core-style .dnb-lead,
.dnb-core-style .dnb-h--xx-large,
.dnb-core-style .dnb-h--x-large,
.dnb-core-style .dnb-h--large,
.dnb-core-style .dnb-h--medium,
.dnb-core-style .dnb-h--basis,
.dnb-core-style .dnb-h--small,
.dnb-core-style .dnb-h--x-small {
  padding: 0;
}
.dnb-lead:not([class*=space__top]),
.dnb-h--xx-large:not([class*=space__top]),
.dnb-h--x-large:not([class*=space__top]),
.dnb-h--large:not([class*=space__top]),
.dnb-h--medium:not([class*=space__top]),
.dnb-h--basis:not([class*=space__top]),
.dnb-h--small:not([class*=space__top]),
.dnb-h--x-small:not([class*=space__top]),
.dnb-core-style .dnb-lead:not([class*=space__top]),
.dnb-core-style .dnb-h--xx-large:not([class*=space__top]),
.dnb-core-style .dnb-h--x-large:not([class*=space__top]),
.dnb-core-style .dnb-h--large:not([class*=space__top]),
.dnb-core-style .dnb-h--medium:not([class*=space__top]),
.dnb-core-style .dnb-h--basis:not([class*=space__top]),
.dnb-core-style .dnb-h--small:not([class*=space__top]),
.dnb-core-style .dnb-h--x-small:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-lead:not([class*=space__bottom]),
.dnb-h--xx-large:not([class*=space__bottom]),
.dnb-h--x-large:not([class*=space__bottom]),
.dnb-h--large:not([class*=space__bottom]),
.dnb-h--medium:not([class*=space__bottom]),
.dnb-h--basis:not([class*=space__bottom]),
.dnb-h--small:not([class*=space__bottom]),
.dnb-h--x-small:not([class*=space__bottom]),
.dnb-core-style .dnb-lead:not([class*=space__bottom]),
.dnb-core-style .dnb-h--xx-large:not([class*=space__bottom]),
.dnb-core-style .dnb-h--x-large:not([class*=space__bottom]),
.dnb-core-style .dnb-h--large:not([class*=space__bottom]),
.dnb-core-style .dnb-h--medium:not([class*=space__bottom]),
.dnb-core-style .dnb-h--basis:not([class*=space__bottom]),
.dnb-core-style .dnb-h--small:not([class*=space__bottom]),
.dnb-core-style .dnb-h--x-small:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-lead:not([class*=space__left]),
.dnb-h--xx-large:not([class*=space__left]),
.dnb-h--x-large:not([class*=space__left]),
.dnb-h--large:not([class*=space__left]),
.dnb-h--medium:not([class*=space__left]),
.dnb-h--basis:not([class*=space__left]),
.dnb-h--small:not([class*=space__left]),
.dnb-h--x-small:not([class*=space__left]),
.dnb-core-style .dnb-lead:not([class*=space__left]),
.dnb-core-style .dnb-h--xx-large:not([class*=space__left]),
.dnb-core-style .dnb-h--x-large:not([class*=space__left]),
.dnb-core-style .dnb-h--large:not([class*=space__left]),
.dnb-core-style .dnb-h--medium:not([class*=space__left]),
.dnb-core-style .dnb-h--basis:not([class*=space__left]),
.dnb-core-style .dnb-h--small:not([class*=space__left]),
.dnb-core-style .dnb-h--x-small:not([class*=space__left]) {
  margin-left: 0;
}
.dnb-lead:not([class*=space__right]),
.dnb-h--xx-large:not([class*=space__right]),
.dnb-h--x-large:not([class*=space__right]),
.dnb-h--large:not([class*=space__right]),
.dnb-h--medium:not([class*=space__right]),
.dnb-h--basis:not([class*=space__right]),
.dnb-h--small:not([class*=space__right]),
.dnb-h--x-small:not([class*=space__right]),
.dnb-core-style .dnb-lead:not([class*=space__right]),
.dnb-core-style .dnb-h--xx-large:not([class*=space__right]),
.dnb-core-style .dnb-h--x-large:not([class*=space__right]),
.dnb-core-style .dnb-h--large:not([class*=space__right]),
.dnb-core-style .dnb-h--medium:not([class*=space__right]),
.dnb-core-style .dnb-h--basis:not([class*=space__right]),
.dnb-core-style .dnb-h--small:not([class*=space__right]),
.dnb-core-style .dnb-h--x-small:not([class*=space__right]) {
  margin-right: 0;
}
.dnb-lead,
.dnb-h--xx-large,
.dnb-h--x-large,
.dnb-h--large,
.dnb-h--medium,
.dnb-h--basis,
.dnb-h--small,
.dnb-h--x-small,
.dnb-core-style .dnb-lead,
.dnb-core-style .dnb-h--xx-large,
.dnb-core-style .dnb-h--x-large,
.dnb-core-style .dnb-h--large,
.dnb-core-style .dnb-h--medium,
.dnb-core-style .dnb-h--basis,
.dnb-core-style .dnb-h--small,
.dnb-core-style .dnb-h--x-small {
  font-family: var(--font-family-heading);
  color: var(--token-color-text-neutral);
}
.dnb-lead.dnb-t--surface-dark,
.dnb-h--xx-large.dnb-t--surface-dark,
.dnb-h--x-large.dnb-t--surface-dark,
.dnb-h--large.dnb-t--surface-dark,
.dnb-h--medium.dnb-t--surface-dark,
.dnb-h--basis.dnb-t--surface-dark,
.dnb-h--small.dnb-t--surface-dark,
.dnb-h--x-small.dnb-t--surface-dark,
.dnb-core-style .dnb-lead.dnb-t--surface-dark,
.dnb-core-style .dnb-h--xx-large.dnb-t--surface-dark,
.dnb-core-style .dnb-h--x-large.dnb-t--surface-dark,
.dnb-core-style .dnb-h--large.dnb-t--surface-dark,
.dnb-core-style .dnb-h--medium.dnb-t--surface-dark,
.dnb-core-style .dnb-h--basis.dnb-t--surface-dark,
.dnb-core-style .dnb-h--small.dnb-t--surface-dark,
.dnb-core-style .dnb-h--x-small.dnb-t--surface-dark {
  color: var(--token-color-text-neutral-ondark);
}
.dnb-lead .dnb-icon--default,
.dnb-h--xx-large .dnb-icon--default,
.dnb-h--x-large .dnb-icon--default,
.dnb-h--large .dnb-icon--default,
.dnb-h--medium .dnb-icon--default,
.dnb-h--basis .dnb-icon--default,
.dnb-h--small .dnb-icon--default,
.dnb-h--x-small .dnb-icon--default,
.dnb-core-style .dnb-lead .dnb-icon--default,
.dnb-core-style .dnb-h--xx-large .dnb-icon--default,
.dnb-core-style .dnb-h--x-large .dnb-icon--default,
.dnb-core-style .dnb-h--large .dnb-icon--default,
.dnb-core-style .dnb-h--medium .dnb-icon--default,
.dnb-core-style .dnb-h--basis .dnb-icon--default,
.dnb-core-style .dnb-h--small .dnb-icon--default,
.dnb-core-style .dnb-h--x-small .dnb-icon--default {
  font-size: 1em;
}
.dnb-lead .dnb-icon--medium,
.dnb-h--xx-large .dnb-icon--medium,
.dnb-h--x-large .dnb-icon--medium,
.dnb-h--large .dnb-icon--medium,
.dnb-h--medium .dnb-icon--medium,
.dnb-h--basis .dnb-icon--medium,
.dnb-h--small .dnb-icon--medium,
.dnb-h--x-small .dnb-icon--medium,
.dnb-core-style .dnb-lead .dnb-icon--medium,
.dnb-core-style .dnb-h--xx-large .dnb-icon--medium,
.dnb-core-style .dnb-h--x-large .dnb-icon--medium,
.dnb-core-style .dnb-h--large .dnb-icon--medium,
.dnb-core-style .dnb-h--medium .dnb-icon--medium,
.dnb-core-style .dnb-h--basis .dnb-icon--medium,
.dnb-core-style .dnb-h--small .dnb-icon--medium,
.dnb-core-style .dnb-h--x-small .dnb-icon--medium {
  font-size: 1.5em;
}
.dnb-lead a,
.dnb-lead .dnb-anchor,
.dnb-h--xx-large a,
.dnb-h--xx-large .dnb-anchor,
.dnb-h--x-large a,
.dnb-h--x-large .dnb-anchor,
.dnb-h--large a,
.dnb-h--large .dnb-anchor,
.dnb-h--medium a,
.dnb-h--medium .dnb-anchor,
.dnb-h--basis a,
.dnb-h--basis .dnb-anchor,
.dnb-h--small a,
.dnb-h--small .dnb-anchor,
.dnb-h--x-small a,
.dnb-h--x-small .dnb-anchor,
.dnb-core-style .dnb-lead a,
.dnb-core-style .dnb-lead .dnb-anchor,
.dnb-core-style .dnb-h--xx-large a,
.dnb-core-style .dnb-h--xx-large .dnb-anchor,
.dnb-core-style .dnb-h--x-large a,
.dnb-core-style .dnb-h--x-large .dnb-anchor,
.dnb-core-style .dnb-h--large a,
.dnb-core-style .dnb-h--large .dnb-anchor,
.dnb-core-style .dnb-h--medium a,
.dnb-core-style .dnb-h--medium .dnb-anchor,
.dnb-core-style .dnb-h--basis a,
.dnb-core-style .dnb-h--basis .dnb-anchor,
.dnb-core-style .dnb-h--small a,
.dnb-core-style .dnb-h--small .dnb-anchor,
.dnb-core-style .dnb-h--x-small a,
.dnb-core-style .dnb-h--x-small .dnb-anchor {
  padding-top: 0;
  padding-bottom: 0.03125rem;
}

.dnb-small {
  font-size: var(--font-size-small);
}

sup,
sub {
  font-size: 0.777777em;
  line-height: 0.5em;
}

.dnb-p {
  font-size: var(--font-size-basis);
  color: var(--token-color-text-neutral);
}
.dnb-p.dnb-t--surface-dark {
  color: var(--token-color-text-neutral-ondark);
}
.dnb-p:not([class*=space__top]) {
  margin-top: 0;
}
.dnb-p:not([class*=space__bottom]) {
  margin-bottom: 0;
}
.dnb-p {
  padding: 0;
}
.dnb-p--lead {
  font-size: var(--typography-lead-font-size);
  line-height: var(--typography-lead-line-height);
  font-weight: var(--typography-lead-weight);
}
.dnb-p--lead > small {
  font-size: var(--typography-lead-small-font-size);
  line-height: var(--typography-lead-small-line-height);
}
.dnb-p b,
.dnb-p strong {
  font-weight: var(--font-weight-medium);
}
.dnb-p > small {
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
}
.dnb-p > cite {
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-basis);
  font-style: italic;
}

/*
 * Typography
 * Universal set of helper classes that do not have a specific element. 
 * The class ".dnb-t" does nothing, only it's modifiers ".dnb-t__[***]" do.
 */
.dnb-t__size--xx-large {
  font-size: var(--font-size-xx-large);
}

.dnb-t__size--x-large {
  font-size: var(--font-size-x-large);
}

.dnb-t__size--large {
  font-size: var(--font-size-large);
}

.dnb-t__size--medium {
  font-size: var(--font-size-medium);
}

.dnb-t__size--basis {
  font-size: var(--font-size-basis);
}

.dnb-t__size--small {
  font-size: var(--font-size-small);
}

.dnb-t__size--x-small {
  font-size: var(--font-size-x-small);
}

.dnb-t__line-height--xx-large {
  line-height: var(--line-height-xx-large);
}

.dnb-t__line-height--x-large {
  line-height: var(--line-height-x-large);
}

.dnb-t__line-height--large {
  line-height: var(--line-height-large);
}

.dnb-t__line-height--medium {
  line-height: var(--line-height-medium);
}

.dnb-t__line-height--basis {
  line-height: var(--line-height-basis);
}

.dnb-t__line-height--small {
  line-height: var(--line-height-small);
}

.dnb-t__line-height--x-small {
  line-height: var(--line-height-x-small);
}

.dnb-t__weight--regular {
  font-weight: var(--font-weight-regular);
}

.dnb-t__weight--medium {
  font-weight: var(--font-weight-medium);
}

.dnb-t__weight--bold {
  font-weight: var(--font-weight-bold);
}

.dnb-t__align--center {
  text-align: center;
}

.dnb-t__align--left {
  text-align: left;
}

.dnb-t__align--right {
  text-align: right;
}

.dnb-t__family--default {
  font-family: var(--font-family-default);
}

.dnb-t__family--heading {
  font-family: var(--font-family-heading);
}

.dnb-t__family--monospace {
  font-family: var(--font-family-monospace);
}

.dnb-t__decoration--underline {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.dnb-t__slant--italic {
  font-style: italic;
}

.dnb-table b,
.dnb-table strong {
  font-weight: var(--font-weight-medium);
}

.dnb-h--xx-large {
  font-size: var(--typography-h-xx-large-font-size);
  line-height: var(--typography-h-xx-large-line-height);
  font-weight: var(--typography-h-xx-large-weight);
}
.dnb-h--xx-large > small {
  font-size: var(--typography-h-xx-large-small-font-size);
  line-height: var(--typography-h-xx-large-small-line-height);
}
.dnb-h--xx-large > small {
  display: block;
}

.dnb-h--x-large {
  font-size: var(--typography-h-x-large-font-size);
  line-height: var(--typography-h-x-large-line-height);
  font-weight: var(--typography-h-x-large-weight);
}
.dnb-h--x-large > small {
  font-size: var(--typography-h-x-large-small-font-size);
  line-height: var(--typography-h-x-large-small-line-height);
}
.dnb-h--x-large > small {
  display: block;
}

.dnb-h--large {
  font-size: var(--typography-h-large-font-size);
  line-height: var(--typography-h-large-line-height);
  font-weight: var(--typography-h-large-weight);
}
.dnb-h--large > small {
  font-size: var(--typography-h-large-small-font-size);
  line-heig