@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
1,339 lines (1,317 loc) • 71.6 kB
CSS
@charset "UTF-8";
/**
* DNB Eiendom UI Theme
*
*/
/*
* CSS Properties Eiendom
*
*/
.eufemia-scope--11_0_0 {
--color-emerald-green-50: #89aaac;
--color-emerald-green-25: #c4d4d6;
--color-emerald-green-10: #e8eeef;
}
/* Includes all foundation variables for now. We might want to separate them by theme later */
/* This file is auto generated by makePropertiesFile.ts */
.eufemia-scope--11_0_0 {
--dnb-coldgreen-100: #d8f3ec;
--dnb-coldgreen-200: #bce8dc;
--dnb-coldgreen-300-40: rgba(165 225 210 / 40%);
--dnb-coldgreen-300: #a5e1d2;
--dnb-coldgreen-400: #5cbdad;
--dnb-coldgreen-500: #4a948d;
--dnb-coldgreen-600: #007272;
--dnb-coldgreen-700-40: rgba(20 85 90 / 40%);
--dnb-coldgreen-700: #14555a;
--dnb-coldgreen-800: #08454d;
--dnb-coldgreen-900: #023939;
--dnb-coldgreen-950: #00343e;
--dnb-greyscale-0: #fff;
--dnb-greyscale-25: #fafafa;
--dnb-greyscale-50: #f8f8f8;
--dnb-greyscale-100: #ebebeb;
--dnb-greyscale-200: #ccc;
--dnb-greyscale-300: #b1b1b5;
--dnb-greyscale-400: #8e8e93;
--dnb-greyscale-500: #737373;
--dnb-greyscale-600: #636366;
--dnb-greyscale-700: #48484a;
--dnb-greyscale-800-60: rgba(51 51 51 / 60%);
--dnb-greyscale-800: #333;
--dnb-greyscale-950: #1c1c1e;
--dnb-greyscale-1000-30: rgba(0 0 0 / 30%);
--dnb-greyscale-1000: #000;
--dnb-warmgreen-50: #f2f4ec;
--dnb-warmgreen-100: #e4eed7;
--dnb-warmgreen-300: #bce5ac;
--dnb-warmgreen-500: #80ba77;
--dnb-warmgreen-700: #5d7650;
--dnb-warmgreen-900: #3b4736;
--dnb-green-50: #ebf4f2;
--dnb-green-100: #dcf3e8;
--dnb-green-300: #b9e7ce;
--dnb-green-500: #47d197;
--dnb-green-600: #28b482;
--dnb-green-700: #007b5e;
--dnb-green-900: #0d4637;
--dnb-green-950: #1c342d;
--dnb-red-50: #fceeee;
--dnb-red-100: #fcdddd;
--dnb-red-500: #ed4c4c;
--dnb-red-600: #d52525;
--dnb-red-700: #b21e1e;
--dnb-red-900: #541515;
--dnb-red-950: #401a1a;
--dnb-orange-500: #ff7633;
--dnb-orange-600: #ff5400;
--dnb-yellow-50: #fbf6ec;
--dnb-yellow-500: #fdbb31;
--dnb-yellow-800: #805b0e;
--dnb-yellow-950: #3d2e0f;
--dnb-blue-50: #f2f2f5;
--dnb-blue-100: #e1e9f9;
--dnb-blue-600: #276ace;
}
/* Uses ui theme tokens */
/* This file is auto generated by makePropertiesFile.ts */
.eufemia-scope--11_0_0 {
--token-color-background-page-background: var(--dnb-greyscale-0);
--token-color-background-action: var(--dnb-coldgreen-600);
--token-color-background-action-hover: var(--dnb-coldgreen-600);
--token-color-background-action-hover-subtle: var(--dnb-coldgreen-100);
--token-color-background-action-pressed: var(--dnb-coldgreen-700);
--token-color-background-action-pressed-subtle: var(--dnb-coldgreen-200);
--token-color-background-action-focus: var(--dnb-blue-600);
--token-color-background-action-focus-subtle: var(--dnb-blue-100);
--token-color-background-action-disabled: var(--dnb-greyscale-200);
--token-color-background-action-inverse: var(--dnb-coldgreen-300);
--token-color-background-action-hover-inverse: var(--dnb-coldgreen-300);
--token-color-background-action-hover-subtle-inverse: var(
--dnb-coldgreen-900
);
--token-color-background-action-pressed-subtle-inverse: var(
--dnb-coldgreen-700
);
--token-color-background-action-ondark: var(--dnb-coldgreen-300);
--token-color-background-action-hover-ondark: var(--dnb-coldgreen-300);
--token-color-background-action-hover-subtle-ondark: var(
--dnb-coldgreen-800
);
--token-color-background-action-pressed-ondark: var(--dnb-coldgreen-400);
--token-color-background-action-pressed-subtle-ondark: var(
--dnb-coldgreen-700
);
--token-color-background-action-disabled-ondark: var(
--dnb-greyscale-700
);
--token-color-background-action-alternative: var(--dnb-greyscale-400);
--token-color-background-action-alternative-hover-subtle: var(
--dnb-greyscale-100
);
--token-color-background-selected: var(--dnb-coldgreen-800);
--token-color-background-selected-subtle: var(--dnb-warmgreen-100);
--token-color-background-selected-ondark: var(--dnb-coldgreen-100);
--token-color-background-selected-subtle-ondark: var(--dnb-green-900);
--token-color-background-neutral: var(--dnb-greyscale-0);
--token-color-background-neutral-static: var(--dnb-greyscale-0);
--token-color-background-neutral-subtle: var(--dnb-greyscale-50);
--token-color-background-neutral-base: var(--dnb-greyscale-100);
--token-color-background-neutral-bold: var(--dnb-greyscale-200);
--token-color-background-neutral-alternative: var(--dnb-blue-50);
--token-color-background-info: var(--dnb-coldgreen-600);
--token-color-background-info-subtle: var(--dnb-warmgreen-50);
--token-color-background-positive: var(--dnb-green-700);
--token-color-background-positive-subtle: var(--dnb-green-50);
--token-color-background-warning: var(--dnb-yellow-500);
--token-color-background-warning-subtle: var(--dnb-yellow-50);
--token-color-background-error: var(--dnb-red-600);
--token-color-background-error-subtle: var(--dnb-red-50);
--token-color-background-marketing: var(--dnb-greyscale-800);
--token-color-background-marketing-subtle: var(--dnb-blue-50);
--token-color-text-action: var(--dnb-coldgreen-600);
--token-color-text-action-hover: var(--dnb-coldgreen-600);
--token-color-text-action-pressed: var(--dnb-coldgreen-700);
--token-color-text-action-focus: var(--dnb-blue-600);
--token-color-text-action-disabled: var(--dnb-greyscale-200);
--token-color-text-action-inverse: var(--dnb-coldgreen-300);
--token-color-text-action-hover-inverse: var(--dnb-coldgreen-300);
--token-color-text-action-pressed-inverse: var(--dnb-coldgreen-400);
--token-color-text-selected: var(--dnb-coldgreen-800);
--token-color-text-action-ondark: var(--dnb-coldgreen-300);
--token-color-text-action-hover-ondark: var(--dnb-coldgreen-300);
--token-color-text-action-pressed-ondark: var(--dnb-coldgreen-400);
--token-color-text-action-disabled-ondark: var(--dnb-greyscale-400);
--token-color-text-action-alternative-ondark: var(--dnb-greyscale-0);
--token-color-text-neutral: var(--dnb-greyscale-800);
--token-color-text-neutral-onlight: var(--dnb-greyscale-800);
--token-color-text-neutral-alternative: var(--dnb-greyscale-500);
--token-color-text-neutral-inverse: var(--dnb-greyscale-0);
--token-color-text-neutral-ondark: var(--dnb-greyscale-0);
--token-color-text-neutral-subtle: var(--dnb-greyscale-200);
--token-color-text-neutral-subtle-ondark: var(--dnb-greyscale-200);
--token-color-text-destructive: var(--dnb-red-600);
--token-color-text-destructive-inverse: var(--dnb-orange-600);
--token-color-text-warning: var(--dnb-yellow-800);
--token-color-text-warning-inverse: var(--dnb-yellow-500);
--token-color-text-positive: var(--dnb-green-700);
--token-color-text-positive-inverse: var(--dnb-green-600);
--token-color-icon-action: var(--dnb-coldgreen-600);
--token-color-icon-action-hover: var(--dnb-coldgreen-600);
--token-color-icon-action-pressed: var(--dnb-coldgreen-700);
--token-color-icon-action-focus: var(--dnb-blue-600);
--token-color-icon-action-disabled: var(--dnb-greyscale-200);
--token-color-icon-action-inverse: var(--dnb-coldgreen-300);
--token-color-icon-action-hover-inverse: var(--dnb-coldgreen-300);
--token-color-icon-action-pressed-inverse: var(--dnb-coldgreen-400);
--token-color-icon-selected: var(--dnb-coldgreen-800);
--token-color-icon-selected-ondark: var(--dnb-coldgreen-100);
--token-color-icon-action-ondark: var(--dnb-coldgreen-300);
--token-color-icon-action-alternative-ondark: var(--dnb-greyscale-0);
--token-color-icon-action-hover-ondark: var(--dnb-coldgreen-300);
--token-color-icon-action-pressed-ondark: var(--dnb-coldgreen-400);
--token-color-icon-action-disabled-ondark: var(--dnb-greyscale-400);
--token-color-icon-neutral: var(--dnb-greyscale-800);
--token-color-icon-neutral-static: var(--dnb-greyscale-800);
--token-color-icon-neutral-inverse: var(--dnb-greyscale-0);
--token-color-icon-neutral-ondark: var(--dnb-greyscale-0);
--token-color-icon-neutral-alternative: var(--dnb-greyscale-500);
--token-color-icon-destructive: var(--dnb-red-600);
--token-color-icon-info: var(--dnb-coldgreen-600);
--token-color-icon-info-subtle: var(--dnb-warmgreen-50);
--token-color-icon-positive: var(--dnb-green-700);
--token-color-icon-positive-subtle: var(--dnb-green-50);
--token-color-icon-warning: var(--dnb-yellow-500);
--token-color-icon-warning-subtle: var(--dnb-yellow-50);
--token-color-icon-error: var(--dnb-red-600);
--token-color-icon-error-subtle: var(--dnb-red-50);
--token-color-icon-marketing: var(--dnb-greyscale-800);
--token-color-icon-marketing-subtle: var(--dnb-blue-50);
--token-color-stroke-action: var(--dnb-coldgreen-600);
--token-color-stroke-action-alternative: var(--dnb-greyscale-400);
--token-color-stroke-action-hover: var(--dnb-coldgreen-600);
--token-color-stroke-action-pressed: var(--dnb-coldgreen-700);
--token-color-stroke-action-inverse: var(--dnb-coldgreen-300);
--token-color-stroke-action-hover-inverse: var(--dnb-coldgreen-300);
--token-color-stroke-action-pressed-inverse: var(--dnb-coldgreen-400);
--token-color-stroke-action-focus: var(--dnb-blue-600);
--token-color-stroke-action-focus-subtle: var(--dnb-blue-100);
--token-color-stroke-action-disabled: var(--dnb-greyscale-300);
--token-color-stroke-selected: var(--dnb-coldgreen-800);
--token-color-stroke-selected-ondark: var(--dnb-coldgreen-100);
--token-color-stroke-action-ondark: var(--dnb-coldgreen-300);
--token-color-stroke-action-alternative-ondark: var(--dnb-greyscale-200);
--token-color-stroke-action-hover-ondark: var(--dnb-coldgreen-300);
--token-color-stroke-action-pressed-ondark: var(--dnb-coldgreen-400);
--token-color-stroke-action-disabled-ondark: var(--dnb-greyscale-600);
--token-color-stroke-neutral: var(--dnb-greyscale-800);
--token-color-stroke-neutral-ondark: var(--dnb-greyscale-0);
--token-color-stroke-neutral-subtle: var(--dnb-greyscale-100);
--token-color-stroke-neutral-bold: var(--dnb-greyscale-200);
--token-color-stroke-neutral-alternative: var(--dnb-blue-50);
--token-color-stroke-info: var(--dnb-coldgreen-600);
--token-color-stroke-positive: var(--dnb-green-700);
--token-color-stroke-warning: var(--dnb-yellow-500);
--token-color-stroke-error: var(--dnb-red-600);
--token-color-stroke-marketing: var(--dnb-greyscale-800);
--token-color-decorative-first-muted: var(--dnb-coldgreen-100);
--token-color-decorative-first-muted-static: var(--dnb-coldgreen-100);
--token-color-decorative-first-subtle: var(--dnb-coldgreen-300);
--token-color-decorative-first-subtle-static: var(--dnb-coldgreen-300);
--token-color-decorative-first-base: var(--dnb-coldgreen-500);
--token-color-decorative-first-base-static: var(--dnb-coldgreen-500);
--token-color-decorative-first-bold: var(--dnb-coldgreen-700);
--token-color-decorative-first-bold-static: var(--dnb-coldgreen-700);
--token-color-decorative-first-intense: var(--dnb-coldgreen-950);
--token-color-decorative-first-intense-static: var(--dnb-coldgreen-950);
--token-color-decorative-second-muted: var(--dnb-green-100);
--token-color-decorative-second-muted-static: var(--dnb-green-100);
--token-color-decorative-second-subtle: var(--dnb-green-300);
--token-color-decorative-second-subtle-static: var(--dnb-green-300);
--token-color-decorative-second-base: var(--dnb-green-500);
--token-color-decorative-second-base-static: var(--dnb-green-500);
--token-color-decorative-second-bold: var(--dnb-green-700);
--token-color-decorative-second-bold-static: var(--dnb-green-700);
--token-color-decorative-second-intense: var(--dnb-green-900);
--token-color-decorative-second-intense-static: var(--dnb-green-900);
--token-color-decorative-third-muted: var(--dnb-warmgreen-50);
--token-color-decorative-third-muted-static: var(--dnb-warmgreen-50);
--token-color-decorative-third-subtle: var(--dnb-warmgreen-300);
--token-color-decorative-third-subtle-static: var(--dnb-warmgreen-300);
--token-color-decorative-third-base: var(--dnb-warmgreen-500);
--token-color-decorative-third-base-static: var(--dnb-warmgreen-500);
--token-color-decorative-third-bold: var(--dnb-warmgreen-700);
--token-color-decorative-third-bold-static: var(--dnb-warmgreen-700);
--token-color-decorative-third-intense: var(--dnb-warmgreen-900);
--token-color-decorative-third-intense-static: var(--dnb-warmgreen-900);
--token-color-component-button-background-action: var(
--dnb-coldgreen-600
);
--token-color-component-button-background-action-hover: var(
--dnb-coldgreen-600
);
--token-color-component-button-background-action-destructive: var(
--dnb-red-600
);
--token-color-component-button-background-action-destructive-hover: var(
--dnb-red-600
);
--token-color-component-button-background-action-destructive-hover-subtle: var(
--dnb-red-50
);
--token-color-component-button-background-action-destructive-pressed: var(
--dnb-red-700
);
--token-color-component-button-background-action-destructive-pressed-subtle: var(
--dnb-red-100
);
--token-color-component-button-text-neutral: var(--dnb-greyscale-0);
--token-color-component-button-text-neutral-inverse: var(
--dnb-coldgreen-900
);
--token-color-component-button-text-neutral-ondark: var(
--dnb-coldgreen-900
);
--token-color-component-button-text-action: var(--dnb-coldgreen-600);
--token-color-component-button-text-action-hover: var(
--dnb-coldgreen-600
);
--token-color-component-button-text-action-inverse: var(
--dnb-coldgreen-300
);
--token-color-component-button-text-action-hover-inverse: var(
--dnb-coldgreen-300
);
--token-color-component-button-text-action-ondark: var(
--dnb-coldgreen-300
);
--token-color-component-button-text-action-hover-ondark: var(
--dnb-coldgreen-300
);
--token-color-component-button-text-action-disabled: var(
--dnb-greyscale-0
);
--token-color-component-button-text-neutral-destructive: var(
--dnb-greyscale-0
);
--token-color-component-button-text-action-destructive: var(
--dnb-red-600
);
--token-color-component-button-text-action-destructive-hover: var(
--dnb-red-600
);
--token-color-component-button-text-action-destructive-pressed: var(
--dnb-red-700
);
--token-color-component-button-icon-neutral: var(--dnb-greyscale-0);
--token-color-component-button-icon-neutral-ondark: var(
--dnb-coldgreen-900
);
--token-color-component-button-icon-action: var(--dnb-coldgreen-600);
--token-color-component-button-icon-action-hover: var(
--dnb-coldgreen-600
);
--token-color-component-button-icon-action-disabled: var(
--dnb-greyscale-0
);
--token-color-component-button-icon-neutral-destructive: var(
--dnb-greyscale-0
);
--token-color-component-button-icon-action-destructive: var(
--dnb-red-600
);
--token-color-component-button-icon-action-destructive-hover: var(
--dnb-red-600
);
--token-color-component-button-icon-action-destructive-pressed: var(
--dnb-red-700
);
--token-color-component-button-stroke-action: var(--dnb-coldgreen-600);
--token-color-component-button-stroke-action-hover: var(
--dnb-coldgreen-600
);
--token-color-component-button-stroke-action-destructive: var(
--dnb-red-600
);
--token-color-component-button-stroke-action-destructive-hover: var(
--dnb-red-600
);
--token-color-component-button-stroke-action-destructive-pressed: var(
--dnb-red-700
);
--token-color-component-button-stroke-selected: var(
--dnb-coldgreen-700-40
);
--token-color-component-tooltip-background-neutral: var(
--dnb-greyscale-800
);
--token-color-component-table-background-neutral-alternative: var(
--dnb-greyscale-25
);
--token-color-component-dimmer-background: var(--dnb-greyscale-1000-30);
--token-color-component-switch-action-disabled-ondark: var(
--dnb-greyscale-800
);
--token-color-component-progressbar-neutral-onsubtle: var(
--dnb-greyscale-200
);
}
/*
* Typography
*
* The font-family properties are defined in the properties.scss file, like:
* --font-family-default:
*
*/
.eufemia-scope--11_0_0 .dnb-typo-regular {
font-family: var(--font-family-default);
font-weight: normal;
font-style: normal;
}
.eufemia-scope--11_0_0 .dnb-typo-medium {
font-family: var(--font-family-default);
font-weight: var(--font-weight-medium);
font-style: normal;
}
.eufemia-scope--11_0_0 .dnb-typo-bold {
font-family: var(--font-family-default);
font-weight: var(--font-weight-bold);
font-style: normal;
}
.eufemia-scope--11_0_0 .dnb-typo-mono-regular {
font-family: var(--font-family-monospace);
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: DNB;
src: url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Regular.woff2") format("woff2"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Regular.woff") format("woff"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
font-display: fallback;
}
@font-face {
font-family: DNB;
src: url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Medium.woff2") format("woff2"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Medium.woff") format("woff"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
font-display: fallback;
}
@font-face {
font-family: DNB;
src: url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Bold.woff2") format("woff2"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Bold.woff") format("woff"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNB-Bold.ttf") format("truetype");
font-weight: 600;
font-style: normal;
font-display: fallback;
}
@font-face {
font-family: DNBMono;
src: url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNBMono-Regular.woff2") format("woff2"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNBMono-Regular.woff") format("woff"), url("https://assets.dnb.no/shared/fonts/1.0.0/dnb/DNBMono-Regular.ttf") format("truetype");
font-weight: normal;
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
*/
.eufemia-scope--11_0_0 .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;
}
.eufemia-scope--11_0_0 .dnb-blockquote:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-blockquote:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-blockquote:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-blockquote:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_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;
}
.eufemia-scope--11_0_0 .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;
}
.eufemia-scope--11_0_0 .dnb-blockquote .dnb-anchor {
font-size: inherit;
}
.eufemia-scope--11_0_0 .dnb-blockquote, .eufemia-scope--11_0_0 .dnb-blockquote.dnb-blockquote--left {
padding-left: var(--blockquote-quote-padding);
padding-top: var(--blockquote-padding-top);
padding-bottom: var(--blockquote-padding-bottom);
}
.eufemia-scope--11_0_0 .dnb-blockquote.dnb-blockquote--top {
padding-left: var(--blockquote-padding-left);
padding-top: var(--blockquote-quote-padding);
padding-bottom: var(--blockquote-padding-bottom);
}
.eufemia-scope--11_0_0 .dnb-blockquote.dnb-blockquote--no-background {
color: inherit;
background-color: transparent;
}
.eufemia-scope--11_0_0 .dnb-blockquote .dnb-cite,
.eufemia-scope--11_0_0 .dnb-blockquote .dnb-figcaption,
.eufemia-scope--11_0_0 .dnb-blockquote cite,
.eufemia-scope--11_0_0 .dnb-blockquote footer,
.eufemia-scope--11_0_0 .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);
}
.eufemia-scope--11_0_0 .dnb-blockquote .dnb-cite::before,
.eufemia-scope--11_0_0 .dnb-blockquote .dnb-figcaption::before,
.eufemia-scope--11_0_0 .dnb-blockquote cite::before,
.eufemia-scope--11_0_0 .dnb-blockquote footer::before,
.eufemia-scope--11_0_0 .dnb-blockquote figcaption::before {
content: "—";
display: inline-block;
padding-right: 0.5rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote h1, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote h2, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote h3, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote .dnb-h--xx-large, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote .dnb-h--large, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote .dnb-h--medium, .eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote .dnb-lead {
margin: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-blockquote p:last-child {
margin-bottom: 0;
}
/*
* Blockquote
*
*/
/*
* Code / Pre
*
*/
/*
* Blockquote
*
*/
/*
* Utilities
*/
.eufemia-scope--11_0_0 .dnb-code {
display: inline-block;
}
.eufemia-scope--11_0_0 del .dnb-code {
-webkit-text-decoration: line-through;
text-decoration: line-through;
}
.eufemia-scope--11_0_0 .dnb-code:not([class*=dnb-space]) {
margin: calc(-0.25em / 0.875) 0;
}
.eufemia-scope--11_0_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;
}
.eufemia-scope--11_0_0 .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);
}
.eufemia-scope--11_0_0 .dnb-code .dnb-anchor {
font-size: inherit;
}
.eufemia-scope--11_0_0 .dnb-pre {
display: block;
overflow: auto;
}
.eufemia-scope--11_0_0 .dnb-pre:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-pre:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-pre:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-pre:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_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);
}
.eufemia-scope--11_0_0 .dnb-pre pre {
padding: 1rem;
}
.eufemia-scope--11_0_0 .dnb-pre .dnb-spacing pre:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-pre .dnb-spacing pre:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-pre:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-pre:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
.eufemia-scope--11_0_0 .dnb-skeleton > .dnb-code {
background-color: transparent;
}
/*
* Blockquote
*
*/
/*
* Hr tag / line
*
*/
/*
* Blockquote
*
*/
/*
* Utilities
*/
.eufemia-scope--11_0_0 .dnb-hr {
position: relative;
padding: 0;
width: 100%;
height: 0;
display: flow-root;
}
.eufemia-scope--11_0_0 .dnb-hr:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-hr:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-hr:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-hr:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-hr {
border: 0;
}
.eufemia-scope--11_0_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);
}
.eufemia-scope--11_0_0 .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;
}
.eufemia-scope--11_0_0 .dnb-hr--breakout::after {
left: -100vw;
box-shadow: 100vw 0 0 0 var(--hr-color, grey);
border-radius: 0;
}
.eufemia-scope--11_0_0 .dnb-hr {
--thickness: calc(var(--hr-thickness, 0.0625rem) + var(--modifier, 0px));
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-hr:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-hr:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
/*
* Image
*
*/
/*
* Utilities
*/
/*
* Image
*
*/
.eufemia-scope--11_0_0 .dnb-img {
display: inline-flex;
flex-direction: column;
}
.eufemia-scope--11_0_0 .dnb-img:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-img:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-img:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-img:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-img {
padding: 0;
text-align: center;
align-items: center;
}
.eufemia-scope--11_0_0 .dnb-img img,
.eufemia-scope--11_0_0 .dnb-img figcaption {
font-size: var(--font-size-basis);
}
.eufemia-scope--11_0_0 .dnb-img img {
position: relative;
z-index: 2;
box-sizing: content-box;
max-width: 100%;
border-style: none;
border-radius: inherit;
}
.eufemia-scope--11_0_0 .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;
}
.eufemia-scope--11_0_0 .dnb-img figcaption {
margin-top: 0.5rem;
}
/*
* Label
*
*/
.eufemia-scope--11_0_0 .dnb-label {
cursor: pointer;
overflow-wrap: break-word;
color: var(--token-color-text-neutral);
}
.eufemia-scope--11_0_0 .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
*
*/
.eufemia-scope--11_0_0 .dnb-ul:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-ul:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-ul:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-ul:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-ul {
padding: 0;
}
.eufemia-scope--11_0_0 .dnb-ul:not([class*=dnb-space__left]) {
padding-left: 2rem;
}
.eufemia-scope--11_0_0 .dnb-ul {
font-size: var(--font-size-basis);
line-height: var(--line-height-basis);
color: var(--token-color-text-neutral, currentColor);
}
.eufemia-scope--11_0_0 .dnb-ul ul, .eufemia-scope--11_0_0 .dnb-ul ol {
margin-top: 0;
margin-bottom: 1.5rem;
padding-left: 2rem;
}
.eufemia-scope--11_0_0 .dnb-ul li, .eufemia-scope--11_0_0 .dnb-ul--outside li {
position: relative;
}
.eufemia-scope--11_0_0 .dnb-ul li::before, .eufemia-scope--11_0_0 .dnb-ul--outside li::before {
position: absolute;
left: -10rem;
width: 10rem;
padding-right: 0.25rem;
text-align: right;
}
.eufemia-scope--11_0_0 .dnb-ul--inside li::before {
position: relative;
left: 0;
width: auto;
padding-right: 0;
text-align: initial;
}
.eufemia-scope--11_0_0 .dnb-ul .dnb-anchor {
font-size: inherit;
}
.eufemia-scope--11_0_0 .dnb-ul li {
display: list-item;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.eufemia-scope--11_0_0 .dnb-ol:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-ol:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-ol:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-ol:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-ol {
padding: 0;
}
.eufemia-scope--11_0_0 .dnb-ol:not([class*=dnb-space__left]) {
padding-left: 2rem;
}
.eufemia-scope--11_0_0 .dnb-ol {
font-size: var(--font-size-basis);
line-height: var(--line-height-basis);
color: var(--token-color-text-neutral, currentColor);
}
.eufemia-scope--11_0_0 .dnb-ol ul, .eufemia-scope--11_0_0 .dnb-ol ol {
margin-top: 0;
margin-bottom: 1.5rem;
padding-left: 2rem;
}
.eufemia-scope--11_0_0 .dnb-ol li, .eufemia-scope--11_0_0 .dnb-ol--outside li {
position: relative;
}
.eufemia-scope--11_0_0 .dnb-ol li::before, .eufemia-scope--11_0_0 .dnb-ol--outside li::before {
position: absolute;
left: -10rem;
width: 10rem;
padding-right: 0.25rem;
text-align: right;
}
.eufemia-scope--11_0_0 .dnb-ol--inside li::before {
position: relative;
left: 0;
width: auto;
padding-right: 0;
text-align: initial;
}
.eufemia-scope--11_0_0 .dnb-ol .dnb-anchor {
font-size: inherit;
}
.eufemia-scope--11_0_0 .dnb-ol li {
display: list-item;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.eufemia-scope--11_0_0 .dnb-ol {
color: var(--token-color-text-neutral, currentColor);
}
.eufemia-scope--11_0_0 .dnb-ol ul, .eufemia-scope--11_0_0 .dnb-ol ol {
margin-top: 0;
margin-bottom: 1.5rem;
padding-left: 2rem;
}
.eufemia-scope--11_0_0 .dnb-ol li, .eufemia-scope--11_0_0 .dnb-ol--outside li {
position: relative;
}
.eufemia-scope--11_0_0 .dnb-ol li::before, .eufemia-scope--11_0_0 .dnb-ol--outside li::before {
position: absolute;
left: -10rem;
width: 10rem;
padding-right: 0.25rem;
text-align: right;
}
.eufemia-scope--11_0_0 .dnb-ol--inside li::before {
position: relative;
left: 0;
width: auto;
padding-right: 0;
text-align: initial;
}
.eufemia-scope--11_0_0 .dnb-ol .dnb-anchor {
font-size: inherit;
}
.eufemia-scope--11_0_0 .dnb-ol > li {
list-style-type: decimal;
}
.eufemia-scope--11_0_0 .dnb-ol--nested, .eufemia-scope--11_0_0 .dnb-ol--nested ol {
counter-reset: item;
}
.eufemia-scope--11_0_0 .dnb-ol--nested li {
display: block;
}
.eufemia-scope--11_0_0 .dnb-ol--nested li::before {
content: counters(item, ".") ". ";
counter-increment: item;
}
.eufemia-scope--11_0_0 .dnb-ol--nested li li::before {
content: counters(item, ".") " ";
counter-increment: item;
}
.eufemia-scope--11_0_0 .dnb-ol[type] li {
display: list-item;
list-style-type: inherit;
}
.eufemia-scope--11_0_0 .dnb-ol[type] li::before, .eufemia-scope--11_0_0 .dnb-ol[type] li li::before {
content: none;
}
.eufemia-scope--11_0_0 .dnb-dl {
--column-gap: 1rem;
--row-gap: 0.5rem;
}
.eufemia-scope--11_0_0 .dnb-dl:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-dl:not([class*=dnb-space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-dl {
padding: 0;
font-size: var(--font-size-basis);
line-height: var(--line-height-basis);
}
.eufemia-scope--11_0_0 .dnb-dl dt {
padding: 0;
font-weight: var(--font-weight-medium);
}
.eufemia-scope--11_0_0 .dnb-dl dd ~ dt {
margin-top: var(--row-gap);
}
.eufemia-scope--11_0_0 .dnb-dl dt:not(:first-of-type) {
margin-top: calc(var(--row-gap) + 1rem);
}
.eufemia-scope--11_0_0 .dnb-dl dd {
padding: 0;
margin: 0.5rem 0 1rem;
}
.eufemia-scope--11_0_0 .dnb-dl > dd > dl, .eufemia-scope--11_0_0 .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) {
.eufemia-scope--11_0_0 .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%;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dt {
margin-top: 0;
margin-right: calc(var(--column-gap) - 0.5rem);
max-width: var(--dt-max-width);
}
.eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dd {
width: var(--dd-max-width);
align-self: end;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dt:not(:first-of-type), .eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dd, .eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dd ~ dt:not(:first-of-type) {
margin-top: var(--row-gap);
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dt:not(:first-of-type):first-of-type, .eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dd:first-of-type, .eufemia-scope--11_0_0 .dnb-dl__layout--horizontal dd ~ dt:not(:first-of-type):first-of-type {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-dl dd.dnb-dl__item {
visibility: hidden;
-webkit-user-select: none;
user-select: none;
flex-basis: 100%;
height: 0;
margin: 0;
}
.eufemia-scope--11_0_0 .dnb-dl:not(.dnb-dl__layout--horizontal) dd.dnb-dl__item {
display: none;
}
.eufemia-scope--11_0_0 .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 */
}
.eufemia-scope--11_0_0 .dnb-dl__layout--grid dt {
max-width: var(--dt-max-width);
}
.eufemia-scope--11_0_0 .dnb-dl__layout--grid dt:not(:first-of-type) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--grid dd {
max-width: var(--dd-max-width);
align-self: end;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--grid dt, .eufemia-scope--11_0_0 .dnb-dl__layout--grid dd, .eufemia-scope--11_0_0 .dnb-dl__layout--grid dd ~ dt {
margin: 0;
}
.eufemia-scope--11_0_0 .dnb-dl__layout--grid {
/* stylelint-enable */
}
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ul:not([class*=dnb-space__top]),
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ol:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ul:not([class*=dnb-space__bottom]),
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ol:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ul > li,
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ol > li {
margin-top: 1rem;
margin-bottom: 1rem;
/* stylelint-disable-next-line */
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ul > li > p,
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ol > li > p {
margin-top: 1rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-ul li > ul, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ul:not([class*=dnb-space]) li > ul, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ul li > ol, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ul:not([class*=dnb-space]) li > ol, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ol li > ul, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ol:not([class*=dnb-space]) li > ul, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ol li > ol, .eufemia-scope--11_0_0 .dnb-spacing .dnb-ol:not([class*=dnb-space]) li > ol {
margin-top: -0.5rem;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-dl:not([class*=dnb-space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-spacing .dnb-dl:not([class*=dnb-space__bottom]) {
margin-bottom: 1.5rem;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list {
list-style-type: none;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list:not([class*=dnb-space__left]) {
padding-left: 0;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list > li {
list-style-type: none;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list > li::before {
content: none;
}
.eufemia-scope--11_0_0 .dnb-unstyled-list > dl,
.eufemia-scope--11_0_0 .dnb-unstyled-list > dd {
margin-left: 0;
}
/*
* Blockquote
*
*/
/*
* Typography
*
*/
/*
* Blockquote
*
*/
/*
* Utilities
*/
.eufemia-scope--11_0_0 .dnb-lead, .eufemia-scope--11_0_0 .dnb-h--xx-large, .eufemia-scope--11_0_0 .dnb-h--x-large, .eufemia-scope--11_0_0 .dnb-h--large, .eufemia-scope--11_0_0 .dnb-h--medium, .eufemia-scope--11_0_0 .dnb-h--basis, .eufemia-scope--11_0_0 .dnb-h--small, .eufemia-scope--11_0_0 .dnb-h--x-small, .eufemia-scope--11_0_0 .dnb-core-style .dnb-lead, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small, .eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small, .eufemia-scope--11_0_0 h1, .eufemia-scope--11_0_0 h2, .eufemia-scope--11_0_0 h3, .eufemia-scope--11_0_0 h4, .eufemia-scope--11_0_0 h5, .eufemia-scope--11_0_0 h6, .eufemia-scope--11_0_0 p, .eufemia-scope--11_0_0 b, .eufemia-scope--11_0_0 small, .eufemia-scope--11_0_0 strong, .eufemia-scope--11_0_0 .dnb-p, .eufemia-scope--11_0_0 .dnb-small, .eufemia-scope--11_0_0 .dnb-table, .eufemia-scope--11_0_0 sub, .eufemia-scope--11_0_0 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);
}
.eufemia-scope--11_0_0 .dnb-lead,
.eufemia-scope--11_0_0 .dnb-h--xx-large,
.eufemia-scope--11_0_0 .dnb-h--x-large,
.eufemia-scope--11_0_0 .dnb-h--large,
.eufemia-scope--11_0_0 .dnb-h--medium,
.eufemia-scope--11_0_0 .dnb-h--basis,
.eufemia-scope--11_0_0 .dnb-h--small,
.eufemia-scope--11_0_0 .dnb-h--x-small,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small {
padding: 0;
}
.eufemia-scope--11_0_0 .dnb-lead:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--xx-large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--x-large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--medium:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--basis:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--small:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-h--x-small:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small:not([class*=space__top]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small:not([class*=space__top]) {
margin-top: 0;
}
.eufemia-scope--11_0_0 .dnb-lead:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--xx-large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--x-large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--medium:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--basis:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--small:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-h--x-small:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small:not([class*=space__bottom]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small:not([class*=space__bottom]) {
margin-bottom: 0;
}
.eufemia-scope--11_0_0 .dnb-lead:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--xx-large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--x-large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--medium:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--basis:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--small:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-h--x-small:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small:not([class*=space__left]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small:not([class*=space__left]) {
margin-left: 0;
}
.eufemia-scope--11_0_0 .dnb-lead:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--xx-large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--x-large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--medium:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--basis:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--small:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-h--x-small:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small:not([class*=space__right]),
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small:not([class*=space__right]) {
margin-right: 0;
}
.eufemia-scope--11_0_0 .dnb-lead,
.eufemia-scope--11_0_0 .dnb-h--xx-large,
.eufemia-scope--11_0_0 .dnb-h--x-large,
.eufemia-scope--11_0_0 .dnb-h--large,
.eufemia-scope--11_0_0 .dnb-h--medium,
.eufemia-scope--11_0_0 .dnb-h--basis,
.eufemia-scope--11_0_0 .dnb-h--small,
.eufemia-scope--11_0_0 .dnb-h--x-small,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small {
font-family: var(--font-family-heading);
color: var(--token-color-text-neutral);
}
.eufemia-scope--11_0_0 .dnb-lead.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--xx-large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--x-large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--medium.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--basis.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--small.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-h--x-small.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--small.dnb-t--surface-dark,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-small.dnb-t--surface-dark {
color: var(--token-color-text-neutral-ondark);
}
.eufemia-scope--11_0_0 .dnb-lead .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--xx-large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--x-large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--medium .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--basis .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--small .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-h--x-small .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-lead .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--xx-large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--x-large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--large .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--medium .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h--basis .dnb-icon--default,
.eufemia-scope--11_0_0 .dnb-core-style .dnb-h-