/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    -webkit-text-size-adjust: 100%;
    line-height: 1.15
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

:root {
    --base-spacing: 8px;
    --small-spacing: 4px;
    --main-spacing: 16px;
    --gutter-main: var(--main-spacing);
    --gutter-extra-small: var(--base-spacing);
    --gutter-small: calc(var(--base-spacing)*2);
    --gutter-medium: calc(var(--base-spacing)*3);
    --gutter-large: calc(var(--base-spacing)*6);
    --gutter-extra-large: calc(var(--base-spacing)*12);
    --animation-slide-left-offset: -100%
}

@media(min-width: 960px) {
    :root {
        --main-spacing: 24px
    }
}

@media(min-width: 800px)and (max-width:800px) {
    html[data-layout=controller] :root {
        --main-spacing: 16px
    }
}

@media(min-width: 1280px)and (max-width:1280px) {
    html[data-layout=controller] :root {
        --main-spacing: 24px
    }
}

:root {
    --base-font-size: 14px;
    --body1-font-size: var(--base-font-size);
    --body2-font-size: calc(var(--base-font-size) - 2px);
    --subtitle1-font-size: var(--base-font-size);
    --button-font-size: calc(var(--base-font-size) + 4px);
    --caption-font-size: calc(var(--base-font-size) - 2px);
    --h1-font-size: 42px;
    --h2-font-size: calc(var(--h1-font-size) - 8px);
    --h3-font-size: calc(var(--h1-font-size) - 16px);
    --h4-font-size: calc(var(--h1-font-size) - 22px);
    --h5-font-size: calc(var(--h1-font-size) - 28px)
}

@media(min-width: 960px) {
    :root {
        --h1-font-size: 44px;
        --button-font-size: calc(var(--base-font-size) + 2px)
    }
}

@media(min-width: 800px)and (max-width:800px) {
    html[data-layout=controller] {
        --base-font-size: 14px;
        --button-font-size: calc(var(--base-font-size) + 4px)
    }
}

@media(min-width: 1280px)and (max-width:1280px) {
    html[data-layout=controller] {
        --base-font-size: 16px;
        --h1-font-size: 44px;
        --button-font-size: calc(var(--base-font-size) + 6px)
    }
}

:root {
    --icon-size: 22px;
    --icon-size-small: calc(var(--icon-size) - var(--base-spacing));
    --icon-size-extra-small: calc(var(--icon-size) - 14px);
    --icon-size-medium: var(--icon-size);
    --icon-size-large: calc(var(--icon-size) + var(--base-spacing)*2);
    --icon-size-extra-large: calc(var(--icon-size)*3);
    --button-height: 44px;
    --button-height-small: calc(var(--button-height) - var(--base-spacing));
    --button-height-extra-small: calc(var(--button-height) - var(--base-spacing)*2);
    --button-round-height: calc(var(--button-height) + var(--base-spacing));
    --button-round-height-extra-small: calc(var(--button-height) - 20px);
    --button-round-height-small: calc(var(--button-height));
    --button-round-height-large: calc(var(--button-height) + var(--base-spacing));
    --button-round-height-extra-large: 110px;
    --button-icon-width: var(--button-height);
    --button-icon-height: var(--button-height);
    --list-item-height: 48px;
    --input-height: var(--button-height);
    --input-padding: calc(var(--base-spacing)*2);
    --input-placeholder-color: var(--color-grey2);
    --main-nav-height-small: var(--list-item-height);
    --main-nav-height: 60px;
    --main-nav-expanded-width: 196px;
    --main-nav-bottom-height: 48px;
    --main-nav-link-min-width: var(--main-nav-height);
    --timeline-icon-size: 60px;
    --bd-mega-menu-width: 100vw;
    --notification-width: 700px;
    --chip-height: 24px;
    --chip-height-large: 32px;
    --chart-dot-size: 8px;
    --chart-y-axis-width: 60px;
    --chart-x-axis-height: 24px;
    --chart-stroke-width: 2px;
    --line-chart-dot-size: 8px;
    --line-chart-axis-line-width: 1px;
    --line-chart-y-ticks-width: 60px;
    --progress-bar-chart-height: var(--list-item-height);
    --progress-bar-chart-dependency-dot-size: 8px;
    --progress-bar-chart-labels-width: 200px;
    --progress-bar-chart-button-width: 33px;
    --dropdown-menu-width: 30vw;
    --dropdown-menu-item-height: calc(var(--list-item-height) - var(--base-spacing));
    --data-table-header-height: 44px;
    --data-table-pagination-height: 60px;
    --data-table-cell-height: var(--list-item-height);
    --data-table-head-z-index: 5;
    --snack-bar-height: 32px;
    --snack-bar-min-height: 32px;
    --badge-size-extra-small: 48px;
    --badge-size-small: calc(83px - var(--base-spacing));
    --badge-size: calc(96px - var(--base-spacing));
    --panel-header-height: 60px;
    --toggle-height: 32px;
    --toggle-height-small: 24px;
    --toggle-circle-size: calc(var(--toggle-height) - var(--small-spacing)*2);
    --toolbar-height: var(--main-nav-height);
    --navigation-bar-height: var(--main-nav-height);
    --select-height: var(--button-height);
    --select-option-height: var(--list-item-height);
    --filter-tabs-height: var(--button-height);
    --filter-tabs-height-small: calc(var(--button-height) - var(--base-spacing)*2);
    --tabs-tab-width: 160px;
    --tabs-fixed-size-icon: var(--button-height);
    --radio-checkmark-size: 16px;
    --radio-checkmark-icon-size: var(--icon-size-extra-small);
    --radio-checkmark-border-width: 1px;
    --checkbox-checkmark-icon-size: var(--icon-size-extra-small);
    --checkbox-checkmark-border-width: 1px;
    --checkbox-checkmark-border-radius: 4px;
    --checkbox-checkmark-size: var(--radio-checkmark-size);
    --checkbox-label-font-weight: var(--font-weight-medium);
    --card-fixed-height-1: 110px;
    --card-fixed-height-2: calc(var(--card-fixed-height-1)*2 + var(--gutter-extra-small));
    --card-fixed-height-3: calc(var(--card-fixed-height-1)*3 + var(--gutter-extra-small)*2);
    --card-low-density-padding: var(--main-spacing);
    --card-high-density-padding: calc(var(--base-spacing));
    --card-box-shadow: 0 4px 4px 0 rgb(0 0 0/8%), 1px 1px 4px 0 rgb(0 0 0/4%);
    --card-button-size: 48px;
    --controller-illustration-width: 250px;
    --controller-illustration-height: 150px;
    --drawer-width: 100vw;
    --drawer-closed-width: 0;
    --side-menu-width: 290px;
    --side-menu-toggle-width: 32px;
    --side-menu-item-height: var(--list-item-height);
    --battery-width: 32px;
    --battery-height: 40px;
    --battery-border-radius: 4px;
    --battery-cap-height: 4px;
    --side-panel-width: 100vw;
    --side-panel-width-large: var(--side-panel-width);
    --side-panel-header-height: var(--main-nav-height);
    --dialog-padding: var(--main-spacing);
    --dialog-width: calc(100% - var(--main-spacing)*2);
    --progress-bar-height-small: var(--chart-stroke-width);
    --progress-bar-height: 16px;
    --progress-bar-height-large: 24px;
    --selection-menu-item-height: var(--input-height);
    --selection-menu-padding: calc(var(--base-spacing)*2);
    --dot-size: 8px;
    --avatar-size: 120px;
    --slider-height: 4px;
    --slider-tooltip-arrow-size: 6px;
    --slider-handle-size: var(--toggle-circle-size);
    --slider-box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .15);
    --page-header-height: var(--main-nav-height);
    --numeric-keypad-typed-height: 60px;
    --numeric-keypad-typed-font-size: 46px;
    --toast-width: 300px;
    --toast-padding: calc(var(--base-spacing)*2);
    --toast-transition-duration: 500ms;
    --toast-close-button-width: calc(var(--icon-size-small) + var(--base-spacing)*2);
    --notification-counter-size: 18px;
    --cage-size: 42px;
    --cage-grid-border-size: 1.5px;
    --cage-stroke-color: var(--color-grey2);
    --cage-stroke-width: 2px;
    --accordion-summary-height: var(--main-nav-height);
    --accordion-summary-padding: var(--main-spacing);
    --splash-generic-illustration-width: 290px;
    --splash-illustration-black: var(--color-grey1);
    --splash-illustration-grey: var(--color-grey4);
    --footer-height: auto;
    --footer-action-height: 48px;
    --menu-block-item-height: var(--list-item-height)
}

@media(min-width: 640px) {
    :root {
        --controller-illustration-width: 300px;
        --controller-illustration-height: 200px;
        --side-menu-width: 310px;
        --panel-header-height: 72px;
        --progress-bar-height-large: 32px;
        --bd-mega-menu-width: 710px;
        --dialog-width: 450px
    }
}

@media(min-width: 960px) {
    :root {
        --button-round-height-large: 88px;
        --button-round-height-extra-large: 140px;
        --footer-height: var(--list-item-height);
        --footer-action-height: var(--footer-height);
        --badge-size-small: 83px;
        --badge-size: 96px;
        --page-header-height: 90px;
        --panel-header-height: 92px;
        --card-fixed-height-1: 135px;
        --card-high-density-padding: calc(var(--base-spacing)*2);
        --controller-illustration-width: 400px;
        --controller-illustration-height: 300px;
        --drawer-width: 330px;
        --drawer-closed-width: calc(var(--base-spacing) + var(--button-round-height)/2);
        --drawer-toggle-size: var(--button-round-height);
        --side-menu-width: 330px;
        --side-panel-width: calc(var(--medium-breakpoint) - var(--main-spacing)*2);
        --side-panel-width-large: calc(100vw - var(--drawer-width));
        --bd-mega-menu-width: 888px;
        --numeric-keypad-typed-height: 100px;
        --numeric-keypad-typed-font-size: 96px;
        --notification-counter-size: 21px;
        --dialog-width: 540px
    }
}

@media(min-width: 1152px) {
    :root {
        --side-panel-width: calc(var(--medium-breakpoint) - var(--main-spacing)*2)
    }
}

@media(min-width: 1280px) {
    :root {
        --side-panel-width: var(--medium-breakpoint)
    }
}

html[data-layout=controller] {
    --icon-size: 24px;
    --button-icon-width: 68px;
    --button-icon-height: var(--button-height-extra-small);
    --list-item-height: 60px;
    --toggle-height: 44px;
    --toggle-height-small: 32px;
    --toggle-circle-size: calc(var(--toggle-height) - var(--small-spacing)*2);
    --data-table-header-height: 48px;
    --data-table-pagination-height: 72px;
    --chart-dot-size: 12px;
    --chart-stroke-width: 3px;
    --line-chart-dot-size: 12px;
    --line-chart-axis-line-width: 2px;
    --radio-checkmark-size: var(--icon-size);
    --radio-checkmark-icon-size: calc(var(--icon-size-small) - 2px);
    --radio-checkmark-border-width: 2px;
    --checkbox-checkmark-icon-size: var(--icon-size-small);
    --checkbox-checkmark-border-width: 2px;
    --checkbox-checkmark-border-radius: var(--border-radius);
    --dropdown-menu-item-height: var(--list-item-height);
    --dialog-padding: calc(var(--base-spacing)*4)
}

@media(min-width: 800px)and (max-width:800px) {
    html[data-layout=controller] {
        --button-height: 48px;
        --dropdown-menu-width: 300px;
        --dialog-width: 450px
    }
}

@media(min-width: 1280px)and (max-width:1280px) {
    html[data-layout=controller] {
        --button-height: 56px;
        --main-nav-height: 72px;
        --dropdown-menu-width: 350px;
        --dialog-width: 540px
    }
}

:root {
    --z-index-navigation-bar: 11;
    --z-index-dropdown-menu: 12;
    --z-index-page-header: 4999;
    --z-index-main-nav: 5000;
    --z-index-drawer: 5001;
    --z-index-snack-bars: 6000;
    --z-index-side-menu: 6500;
    --z-index-veil: 6502;
    --z-index-mega-menu: 7001;
    --z-index-panel: 8001;
    --z-index-dialog: 9001;
    --z-index-notification-portal: 9999;
    --extra-small-breakpoint: 0;
    --small-breakpoint: 640px;
    --medium-breakpoint: 960px;
    --large-breakpoint: 1152px;
    --extra-large-breakpoint: 1280px;
    --controller-7inch-width: 800px;
    --controller-10inch-width: 1280px
}

html[data-theme=big-dutchman] {
    --font-family-primary: "Open Sans", "Noto Sans", sans-serif;
    --font-family-secondary: "Open Sans", "Noto Sans", sans-serif;
    --font-weight-regular: 400;
    --font-weight-medium: 600;
    --font-weight-bold: 700;
    --font-weight-label: 600;
    --border-radius: 4px;
    --button-box-shadow: 2px 5px 10px 0 rgb(0 0 0/8%);
    --default-font-color: #484848;
    --color-font-primary: #dcdcdc;
    --color-font-label: #484848;
    --color-font-label-grey: #787878;
    --color-font-subtitle1: #787878;
    --color-primary-dark: #333;
    --color-primary: #474747;
    --color-primary-light: #ea6f18;
    --color-black: #3a3d3d;
    --color-grey0: #484848;
    --color-grey1: #787878;
    --color-grey2: #a0a0a0;
    --color-grey3: #b4b4b4;
    --color-grey4: #dcdcdc;
    --color-grey5: #f1f2f2;
    --color-grey6: #f8f8f8;
    --color-cloudy: #f8f8f8;
    --color-white: #fff;
    --color-red: #fe3b3b;
    --color-yellow: #fac637;
    --color-green: #56bd5b;
    --color-lavender: #ff95f8;
    --color-violet: #7240ad;
    --color-blue: #69a1f5;
    --color-alarm: #fe3b3b;
    --color-warning: #fac637;
    --color-disabled: #fbe100;
    --color-success: #ea6f18;
    --color-information: #ea6f18;
    --color-active: #ea6f18;
    --color-trust-me: #ea6f18;
    --default-background-color: #f1f2f2;
    --color-primary-background: #474747;
    --color-backdrop-background: rgba(0, 0, 0, .4);
    --color-chart-grid: #dcdcdc;
    --color-chart-reference-line: #3a3d3d;
    --color-border: #dcdcdc;
    --color-border-primary: #686868;
    --color-hover-background: rgb(0 0 0/5%);
    --color-solid-hover-background: #f8f8f8;
    --color-primary-hover-background: rgba(0, 0, 0, .2);
    --color-active-background: rgba(0, 0, 0, .1);
    --color-primary-active-background: rgba(0, 0, 0, .3);
    --color-selected-bounding-box-background: rgb(0 0 0/4%);
    --color-primary-selected-bounding-box-background: rgba(0, 0, 0, .25);
    background-color: var(--default-background-color)
}

html[data-theme=skov] {
    --font-family-primary: "Noto Sans", sans-serif;
    --font-family-secondary: "Noto Sans Display", sans-serif;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 600;
    --font-weight-label: 500;
    --border-radius: 8px;
    --button-box-shadow: 2px 4px 4px 0 rgb(0 0 0/8%), 2px 2px 4px 0 rgb(0 0 0/8%);
    --default-font-color: #484848;
    --color-font-primary: #F6EDD9;
    --color-font-label: #484848;
    --color-font-label-grey: #787878;
    --color-font-subtitle1: #787878;
    --color-primary-dark: #031E00;
    --color-primary: #142C00;
    --color-primary-light: #669200;
    --color-black: #383838;
    --color-grey0: #484848;
    --color-grey1: #787878;
    --color-grey2: #a0a0a0;
    --color-grey3: #b4b4b4;
    --color-grey4: #dcdcdc;
    --color-grey5: #f1f2f2;
    --color-grey6: #f8f8f8;
    --color-cloudy: #f8f8f8;
    --color-white: #fff;
    --color-red: #bf334f;
    --color-yellow: #e4a72b;
    --color-green: #56bd5b;
    --color-lavender: #ff8dfa;
    --color-violet: #9233bf;
    --color-blue: #33bef2;
    --color-alarm: #bf334f;
    --color-warning: #e4a72b;
    --color-disabled: #fbe100;
    --color-success: #56bd5b;
    --color-information: #8cb733;
    --color-trust-me: #cdc2af;
    --color-active: #669200;
    --default-background-color: #f1f2f2;
    --color-primary-background: #142C00;
    --color-backdrop-background: rgba(0, 0, 0, .4);
    --color-chart-grid: #dcdcdc;
    --color-chart-reference-line: #383838;
    --color-border: #dcdcdc;
    --color-border-primary: #406E00;
    --color-hover-background: rgb(0 0 0/5%);
    --color-solid-hover-background: #f8f8f8;
    --color-primary-hover-background: rgba(0, 0, 0, .2);
    --color-active-background: rgba(0, 0, 0, .1);
    --color-primary-active-background: rgba(0, 0, 0, .3);
    --color-selected-bounding-box-background: rgb(0 0 0/4%);
    --color-primary-selected-bounding-box-background: rgba(0, 0, 0, .25);
    background-color: var(--default-background-color)
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/OpenSans-Regular.woff2) format("woff2"), url(/static/fonts/OpenSans-Regular.woff) format("woff");
    unicode-range: U+000-5ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/OpenSans-SemiBold.woff2) format("woff2"), url(/static/fonts/OpenSans-SemiBold.woff) format("woff");
    unicode-range: U+000-5ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/OpenSans-Bold.woff2) format("woff2"), url(/static/fonts/OpenSans-Bold.woff) format("woff");
    unicode-range: U+000-5ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansSc-Medium.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansJp-Medium.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansKr-Medium.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansThai-Regular.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansThai-Medium.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansThai-SemiBold.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKhmer-Regular.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKhmer-Medium.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansKhmer-SemiBold.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansArabic-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansArabic-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    src: url(/static/fonts/NotoSansArabic-Bold.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSans-Regular.woff2) format("woff2"), url(/static/fonts/NotoSans-Regular.woff) format("woff");
    unicode-range: U+000-5ff, U+2080-2089
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSans-Medium.woff2) format("woff2"), url(/static/fonts/NotoSans-Medium.woff) format("woff");
    unicode-range: U+000-5ff, U+2080-2089
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSans-SemiBold.woff2) format("woff2"), url(/static/fonts/NotoSans-SemiBold.woff) format("woff");
    unicode-range: U+000-5ff, U+2080-2089
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansSc-Medium.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansJp-Medium.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKr-Medium.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansThai-Regular.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansThai-Medium.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansThai-SemiBold.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKhmer-Regular.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansKhmer-Medium.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKhmer-SemiBold.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansArabic-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansArabic-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansArabic-Bold.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansDisplay-Regular.woff2) format("woff2"), url(/static/fonts/NotoSansDisplay-Regular.woff) format("woff")
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansDisplay-Medium.woff2) format("woff2"), url(/static/fonts/NotoSansDisplay-Medium.woff) format("woff")
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansDisplay-SemiBold.woff2) format("woff2"), url(/static/fonts/NotoSansDisplay-SemiBold.woff) format("woff")
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKhmer-Regular.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansKhmer-Medium.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKhmer-SemiBold.woff2) format("woff2");
    unicode-range: U+1780-17ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansThaiUI-Regular.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansThaiUI-Medium.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansThaiUI-SemiBold.woff2) format("woff2");
    unicode-range: U+0e00-0e7f
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansSc-Regular.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansSc-Medium.woff2) format("woff2");
    unicode-range: U+3001-3003, U+3009-300b, U+4e00-9fa5, U+e837, U+e844, U+e857, U+e862-e863, U+f9e7
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansJp-Regular.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansJp-Medium.woff2) format("woff2");
    unicode-range: U+3041-3096, U+30a0-30ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansKr-Regular.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansKr-Medium.woff2) format("woff2");
    unicode-range: U+11??, U+3130-318f, U+a960-a97f, U+ac00-d7a3, U+d7b0-d7ff
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 400;
    src: url(/static/fonts/NotoSansArabicUI-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 500;
    src: url(/static/fonts/NotoSansArabicUI-Regular.woff2) format("woff2");
    unicode-range: U+06??
}

@font-face {
    font-family: Noto Sans Display;
    font-style: normal;
    font-weight: 600;
    src: url(/static/fonts/NotoSansArabicUI-Bold.woff2) format("woff2");
    unicode-range: U+06??
}

img {
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    width: 100%
}

a,
button {
    -webkit-tap-highlight-color: transparent
}

a {
    text-decoration: none
}

html {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

body,
html {
    height: 100%
}

body {
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.ui-root {
    min-height: 100vh
}

::-moz-selection {
    background-color: var(--color-active);
    color: var(--color-white)
}

::selection {
    background-color: var(--color-active);
    color: var(--color-white)
}

.ui-page-container {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: var(--main-spacing);
    position: relative
}

@media(min-width: 1152px) {
    html[data-theme=big-dutchman] .ui-page-container {
        padding-left: calc(var(--main-spacing) + var(--main-nav-height))
    }
}

html[data-layout=controller][data-theme=big-dutchman] .ui-page-container {
    padding-left: calc(var(--main-spacing) + var(--main-nav-height))
}

.ui-main-nav,
.ui-main-nav--expanded {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: var(--color-primary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    left: 0;
    padding-left: var(--main-spacing);
    position: fixed;
    right: 0;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform;
    z-index: var(--z-index-main-nav)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--color-primary-dark);
    border-right: 1px solid var(--color-primary-dark);
    bottom: 0;
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    padding-bottom: var(--main-nav-height);
    padding-left: 0;
    width: var(--main-nav-height)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav .ui-main-nav-link__label,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__label {
    display: none
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded {
    background-color: var(--color-primary-dark);
    width: var(--main-nav-expanded-width)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav__logo {
    width: auto
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-title {
    margin-left: calc(var(--main-nav-expanded-width) - var(--main-nav-height))
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    justify-content: flex-start
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__label {
    display: block;
    margin-top: 0;
    text-align: left
}

html[data-theme=big-dutchman] .ui-main-nav .ui-main-nav-link__chevron,
html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__chevron {
    display: none
}

@media(min-width: 1152px) {

    html[data-theme=big-dutchman] .ui-main-nav,
    html[data-theme=big-dutchman] .ui-main-nav--expanded {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        background-color: var(--color-primary-dark);
        border-right: 1px solid var(--color-primary-dark);
        bottom: 0;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        padding-bottom: var(--main-nav-height);
        padding-left: 0;
        width: var(--main-nav-height)
    }

    html[data-theme=big-dutchman] .ui-main-nav .ui-main-nav-link__label,
    html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__label {
        display: none
    }

    html[data-theme=big-dutchman] .ui-main-nav--expanded {
        background-color: var(--color-primary-dark);
        width: var(--main-nav-expanded-width)
    }

    html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav__logo {
        width: auto
    }

    html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-title {
        margin-left: calc(var(--main-nav-expanded-width) - var(--main-nav-height))
    }

    html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: flex-start
    }

    html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__label {
        display: block;
        margin-top: 0;
        text-align: left
    }
}

.ui-main-nav__logo {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-ordinal-group: 1001;
    -ms-flex-order: 1000;
    align-items: center;
    bottom: 0;
    display: none;
    height: var(--main-nav-height);
    justify-content: center;
    left: 0;
    order: 1000;
    position: absolute;
    right: 0;
    width: var(--main-nav-height)
}

.ui-main-nav__logo svg {
    height: calc(var(--main-nav-height) - 20px)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav__logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media(min-width: 1152px) {
    .ui-main-nav__logo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.ui-main-nav__clearer {
    height: var(--main-nav-height);
    width: 100%
}

.ui-main-nav__expand-button {
    border-bottom: 1px solid var(--color-border-primary)
}

html[data-theme=big-dutchman] .ui-main-nav--expanded .ui-main-nav-link__chevron {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 8px
}

.toast-container {
    bottom: var(--main-spacing);
    position: fixed;
    right: var(--main-spacing);
    z-index: 9999
}

.toast-element,
.toast-element--clickable {
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .04), 0 4px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .04), 0 4px 4px 0 rgba(0, 0, 0, .08);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px;
    max-width: var(--toast-width);
    overflow: hidden;
    padding: var(--toast-padding);
    position: relative;
    width: calc(100vw - var(--main-spacing)*2);
    will-change: right, left
}

.toast-element--clickable:last-of-type,
.toast-element:last-of-type {
    margin-bottom: 0
}

.toast-element *,
.toast-element--clickable * {
    position: relative;
    z-index: 1
}

.toast-element__remove-button {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    border-radius: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--toast-close-button-width);
    justify-content: center;
    outline: none;
    padding: 0;
    position: absolute;
    right: calc(var(--toast-padding)/2);
    top: calc(var(--toast-padding)/2);
    -webkit-transition: .2s;
    transition: .2s;
    width: var(--toast-close-button-width);
    z-index: 10
}

.toast-element__remove-button .ui-icon svg {
    fill: var(--color-grey3);
    -webkit-transition: inherit;
    transition: inherit
}

@media(hover: hover) {
    .toast-element__remove-button:hover {
        background-color: var(--color-hover-background)
    }

    .toast-element__remove-button:hover .ui-icon svg {
        fill: var(--color-black)
    }
}

.toast-element__remove-button:active {
    background-color: var(--color-active-background)
}

.toast-element__remove-button:active .ui-icon svg {
    fill: var(--color-black)
}

.toast-element--clickable {
    cursor: pointer
}

.toast-element--clickable:after {
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 2
}

@media(hover: hover) {
    .toast-element--clickable:after {
        -webkit-transition: .2s;
        transition: .2s
    }

    .toast-element--clickable:hover:after {
        background-color: var(--color-hover-background);
        opacity: 1;
        visibility: visible
    }
}

.toast-element--clickable:active {
    -webkit-box-shadow: none;
    box-shadow: none
}

.toast-element--clickable:active:after {
    background-color: var(--color-active-background)
}

.notification-toast,
.notification-toast__sidebar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.notification-toast__sidebar {
    -ms-flex-preferred-size: calc(var(--icon-size) + 12px);
    -ms-flex-negative: 0;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    flex-basis: calc(var(--icon-size) + 12px);
    flex-grow: 0;
    flex-shrink: 0;
    height: calc(100% + var(--toast-padding)*2);
    justify-content: center;
    margin: calc(var(--toast-padding)*-1) var(--toast-padding) calc(var(--toast-padding)*-1) calc(var(--toast-padding)*-1);
    padding-top: var(--toast-padding);
    width: calc(var(--icon-size) + 8px)
}

.notification-toast__sidebar .ui-icon svg {
    fill: var(--color-white)
}

.notification-toast__sub-title {
    color: var(--color-font-subtitle1)
}

.notification-toast--type-alarm .notification-toast__sidebar {
    background-color: var(--color-alarm)
}

.notification-toast--type-warning .notification-toast__sidebar {
    background-color: var(--color-warning)
}

.notification-toast--type-information .notification-toast__sidebar {
    background-color: var(--color-information)
}

.notification-toast--closeable .notification-toast__title {
    padding-right: var(--toast-close-button-width)
}

.loading-toast,
.loading-toast--type-error {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.loading-toast .ui-button,
.loading-toast--type-error .ui-button {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: auto;
    min-width: auto;
    padding: 0 8px
}

.loading-toast .ui-progress-bar,
.loading-toast--type-error .ui-progress-bar {
    border-radius: 0;
    bottom: calc(var(--toast-padding)*-1);
    height: 4px;
    left: calc(var(--toast-padding)*-1);
    position: absolute;
    right: calc(var(--toast-padding)*-1);
    width: calc(100% + var(--toast-padding)*2)
}

.loading-toast .ui-progress-bar__bar,
.loading-toast--type-error .ui-progress-bar__bar {
    height: 4px
}

.loading-toast__content {
    padding-bottom: 4px
}

.loading-toast__content .loading-toast__description,
.loading-toast__content .loading-toast__sub-title {
    padding-left: calc(var(--icon-size) + 8px)
}

.loading-toast__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.loading-toast__title>.ui-typography {
    line-height: 1.3
}

.loading-toast__title>.ui-icon,
.loading-toast__title>.ui-loader {
    margin-right: 8px
}

.loading-toast__sub-title {
    color: var(--color-font-subtitle1)
}

.loading-toast--type-error .loading-toast__title>.ui-icon svg {
    fill: var(--color-alarm)
}

.loading-toast--type-error .ui-progress-bar__progress>div {
    background-color: var(--color-alarm)
}

.message-toast--type-error:before,
.message-toast--type-failed:before,
.message-toast--type-success:before,
.message-toast:before {
    bottom: calc(var(--toast-padding)*-1);
    content: "";
    height: calc(100% + var(--toast-padding)*2);
    left: calc(var(--toast-padding)*-1);
    position: absolute;
    top: calc(var(--toast-padding)*-1);
    width: 4px
}

.message-toast__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.message-toast__title>.ui-icon,
.message-toast__title>.ui-sign {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 8px
}

.message-toast__title>.ui-icon svg {
    fill: var(--color-alarm)
}

.message-toast__sub-title {
    color: var(--color-font-subtitle1)
}

.message-toast--type-error:before {
    background-color: var(--color-alarm)
}

.message-toast--type-error .message-toast__description,
.message-toast--type-error .message-toast__sub-title {
    padding-left: calc(var(--icon-size) + 8px)
}

.message-toast--type-failed:before {
    background-color: var(--color-alarm)
}

.message-toast--type-failed .message-toast__description,
.message-toast--type-failed .message-toast__sub-title {
    padding-left: calc(var(--icon-size) + 8px)
}

.message-toast--type-success:before {
    background-color: var(--color-success)
}

.message-toast--type-success .message-toast__description,
.message-toast--type-success .message-toast__sub-title {
    padding-left: calc(var(--icon-size) + 8px)
}

.message-toast--closeable .message-toast__title {
    padding-right: var(--toast-close-button-width)
}

.ui-icon,
.ui-icon--color-green,
.ui-icon--color-primary,
.ui-icon--color-red,
.ui-icon--color-white,
.ui-icon--color-yellow,
.ui-icon--extra-large,
.ui-icon--extra-small,
.ui-icon--large,
.ui-icon--medium,
.ui-icon--small {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-negative: 0;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-shrink: 0;
    height: var(--icon-size);
    justify-content: center;
    width: var(--icon-size)
}

.ui-icon svg,
.ui-icon--color-green svg,
.ui-icon--color-primary svg,
.ui-icon--color-red svg,
.ui-icon--color-white svg,
.ui-icon--color-yellow svg,
.ui-icon--extra-large svg,
.ui-icon--extra-small svg,
.ui-icon--large svg,
.ui-icon--medium svg,
.ui-icon--small svg {
    fill: var(--color-black);
    height: var(--icon-size);
    width: var(--icon-size)
}

.ui-icon__path--grey {
    fill: var(--color-border)
}

.ui-icon--extra-small,
.ui-icon--extra-small svg {
    height: var(--icon-size-extra-small);
    width: var(--icon-size-extra-small)
}

.ui-icon--small,
.ui-icon--small svg {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

.ui-icon--medium,
.ui-icon--medium svg {
    height: var(--icon-size);
    width: var(--icon-size)
}

.ui-icon--large,
.ui-icon--large svg {
    height: var(--icon-size-large);
    width: var(--icon-size-large)
}

.ui-icon--extra-large,
.ui-icon--extra-large svg {
    height: var(--icon-size-extra-large);
    width: var(--icon-size-extra-large)
}

.ui-icon--color-white svg {
    fill: var(--color-white)
}

.ui-icon--color-primary svg {
    fill: var(--color-font-primary)
}

.ui-icon--color-red svg {
    fill: var(--color-red)
}

.ui-icon--color-yellow svg {
    fill: var(--color-yellow)
}

.ui-icon--color-green svg {
    fill: var(--color-green)
}

.ui-typography,
.ui-typography--body1,
.ui-typography--body2,
.ui-typography--border-bottom,
.ui-typography--border-bottom-primary,
.ui-typography--button,
.ui-typography--caption,
.ui-typography--color,
.ui-typography--color-primary,
.ui-typography--color-white,
.ui-typography--font-weight,
.ui-typography--h1,
.ui-typography--h2,
.ui-typography--h3,
.ui-typography--h4,
.ui-typography--h5,
.ui-typography--label,
.ui-typography--margin-bottom,
.ui-typography--subtitle1,
.ui-typography--truncate {
    color: var(--default-font-color);
    font-family: var(--font-family-primary);
    font-weight: var(--font-weight-regular);
    line-height: 1.5;
    margin: 0;
    white-space: pre-line
}

.ui-typography--h1,
.ui-typography--h2,
.ui-typography--h3,
.ui-typography--h4,
.ui-typography--h5 {
    font-family: var(--font-family-secondary);
    font-weight: var(--font-weight-medium)
}

.ui-typography--h1 {
    font-size: var(--h1-font-size);
    line-height: 1.2
}

.ui-typography--h2 {
    font-size: var(--h2-font-size);
    line-height: 1.2
}

.ui-typography--h3 {
    font-size: var(--h3-font-size);
    line-height: 1.5
}

.ui-typography--h4 {
    font-size: var(--h4-font-size);
    line-height: 1.5
}

.ui-typography--h5 {
    font-size: var(--h5-font-size);
    line-height: 1.5
}

.ui-typography--body1 {
    font-size: var(--body1-font-size)
}

.ui-typography--body2 {
    font-size: var(--body2-font-size)
}

.ui-typography--subtitle1 {
    color: var(--color-font-subtitle1);
    font-size: var(--subtitle1-font-size);
    font-weight: var(--font-weight-medium)
}

.ui-typography--button {
    font-size: var(--button-font-size);
    font-weight: var(--font-weight-medium)
}

.ui-typography--label {
    color: var(--color-font-label);
    font-size: var(--body1-font-size);
    font-weight: var(--font-weight-label)
}

.ui-typography--caption {
    font-size: var(--caption-font-size)
}

.ui-typography--margin-bottom {
    margin-bottom: var(--main-spacing)
}

.ui-typography--truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-typography--color-white {
    color: var(--color-white)
}

.ui-typography--color-primary {
    color: var(--color-font-primary)
}

.ui-typography--border-bottom,
.ui-typography--border-bottom-primary {
    border-bottom: 1px solid var(--color-border);
    margin-bottom: var(--main-spacing);
    padding-bottom: 4px
}

.ui-typography--border-bottom-primary,
.ui-typography--border-bottom-primary-primary {
    border-color: var(--color-border-primary);
    border-width: 2px
}

.ui-typography--font-weight-normal {
    font-weight: var(--font-weight-regular)
}

.ui-typography--font-weight-bold {
    font-weight: var(--font-weight-medium)
}

.ui-typography--font-weight-bolder {
    font-weight: var(--font-weight-bold)
}

.ui-typography--link {
    color: var(--color-active)
}

.ui-typography--link:hover {
    text-decoration: underline
}

.ui-main-nav-title,
.ui-main-nav-title--stacked,
.ui-main-nav-title--with-subtitle {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    min-width: 0;
    order: -1;
    width: 100%
}

.ui-main-nav-title a,
.ui-main-nav-title--stacked a,
.ui-main-nav-title--with-subtitle a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

html[data-theme=big-dutchman] .ui-main-nav-title,
html[data-theme=big-dutchman] .ui-main-nav-title--stacked,
html[data-theme=big-dutchman] .ui-main-nav-title--with-subtitle {
    background-color: var(--color-primary);
    height: var(--main-nav-height);
    left: 0;
    padding-left: var(--main-spacing);
    position: fixed;
    right: 0;
    top: 0
}

@media(min-width: 1152px) {

    html[data-theme=big-dutchman] .ui-main-nav-title,
    html[data-theme=big-dutchman] .ui-main-nav-title--stacked,
    html[data-theme=big-dutchman] .ui-main-nav-title--with-subtitle {
        left: var(--main-nav-height);
        width: calc(100vw - var(--main-nav-height))
    }
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-title,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-title--stacked,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-title--with-subtitle {
    left: var(--main-nav-height);
    width: calc(100vw - var(--main-nav-height))
}

.ui-main-nav-title__container {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    justify-content: flex-start;
    margin-bottom: auto;
    margin-top: auto;
    min-width: 0;
    padding-right: var(--main-spacing);
    position: relative
}

.ui-main-nav-title__icon {
    display: block;
    margin-bottom: auto;
    margin-right: 16px;
    margin-top: auto;
    width: var(--icon-size)
}

.ui-main-nav-title__icon svg {
    fill: var(--color-white)
}

.ui-main-nav-title__icon--clickable {
    cursor: pointer;
    position: relative
}

.ui-main-nav-title__icon--clickable:after {
    background-color: var(--color-active-background);
    border-radius: 100%;
    bottom: 0;
    content: "";
    left: 0;
    margin: -8px;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden
}

.ui-main-nav-title__icon--clickable:active:after {
    opacity: 1;
    visibility: visible
}

.ui-main-nav-title__title {
    color: var(--color-white);
    font-size: var(--h4-font-size);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-main-nav-title__sub-title,
.ui-main-nav-title__sub-title--multiline {
    color: var(--color-font-primary);
    display: inline-block;
    font-size: var(--caption-font-size);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-main-nav-title__sub-title--multiline {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: pre-line;
    width: auto;
    word-break: break-word
}

@media(min-width: 960px) {

    .ui-main-nav-title__sub-title,
    .ui-main-nav-title__sub-title--multiline {
        font-size: var(--subtitle1-font-size)
    }
}

.ui-main-nav-title--with-subtitle .ui-main-nav-title__sub-title,
.ui-main-nav-title--with-subtitle .ui-main-nav-title__sub-title--multiline {
    margin-left: 16px;
    padding-left: 16px;
    position: relative
}

.ui-main-nav-title--with-subtitle .ui-main-nav-title__sub-title--multiline:before,
.ui-main-nav-title--with-subtitle .ui-main-nav-title__sub-title:before {
    border-left: 1px solid var(--color-border-primary);
    content: "";
    height: 100%;
    left: 0;
    position: absolute
}

.ui-main-nav-title--stacked .ui-main-nav-title__sub-title,
.ui-main-nav-title--stacked .ui-main-nav-title__sub-title--multiline,
.ui-main-nav-title--stacked .ui-main-nav-title__title {
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-main-nav-title--stacked .ui-main-nav-title__container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: unset;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center
}

.ui-main-nav-title--stacked .ui-main-nav-title__title {
    -ms-flex-item-align: inherit;
    align-self: inherit;
    font-size: calc(var(--h5-font-size) + 2px);
    margin-left: 0;
    padding-left: 0
}

.ui-main-nav-title--stacked .ui-main-nav-title__sub-title,
.ui-main-nav-title--stacked .ui-main-nav-title__sub-title--multiline {
    margin-left: 0;
    padding-left: 0
}

.ui-main-nav-title--stacked .ui-main-nav-title__sub-title--multiline:before,
.ui-main-nav-title--stacked .ui-main-nav-title__sub-title:before {
    content: none
}

.ui-notification-counter,
.ui-notification-counter--alarms,
.ui-notification-counter--warnings {
    border-radius: 100rem;
    font-size: var(--caption-font-size);
    line-height: var(--notification-counter-size);
    min-width: var(--notification-counter-size);
    position: absolute;
    text-align: center;
    z-index: 1
}

.ui-notification-counter--alarms {
    background-color: var(--color-alarm)
}

.ui-notification-counter--warnings {
    background-color: var(--color-warning)
}

.ui-main-nav-link,
.ui-main-nav-link--margin-auto,
.ui-main-nav-link--with-divider,
.ui-main-nav-link--with-icon,
.ui-main-nav-link--with-toggle-content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -ms-flex-negative: 0;
    -webkit-user-drag: none;
    -webkit-tap-highlight-color: var(--color-primary-active-background);
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-shrink: 0;
    height: 100%;
    justify-content: center;
    margin-left: auto;
    min-width: var(--main-nav-link-min-width);
    order: 2;
    padding: 0 16px;
    position: relative;
    -webkit-transition: .2s;
    transition: .2s;
    z-index: 1
}

.ui-main-nav-link--margin-auto>div,
.ui-main-nav-link--with-divider>div,
.ui-main-nav-link--with-icon>div,
.ui-main-nav-link--with-toggle-content>div,
.ui-main-nav-link>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-main-nav-link--margin-auto~.ui-main-nav-link,
.ui-main-nav-link--margin-auto~.ui-main-nav-link--margin-auto,
.ui-main-nav-link--margin-auto~.ui-main-nav-link--with-divider,
.ui-main-nav-link--margin-auto~.ui-main-nav-link--with-icon,
.ui-main-nav-link--margin-auto~.ui-main-nav-link--with-toggle-content,
.ui-main-nav-link--with-divider~.ui-main-nav-link,
.ui-main-nav-link--with-divider~.ui-main-nav-link--margin-auto,
.ui-main-nav-link--with-divider~.ui-main-nav-link--with-divider,
.ui-main-nav-link--with-divider~.ui-main-nav-link--with-icon,
.ui-main-nav-link--with-divider~.ui-main-nav-link--with-toggle-content,
.ui-main-nav-link--with-icon~.ui-main-nav-link,
.ui-main-nav-link--with-icon~.ui-main-nav-link--margin-auto,
.ui-main-nav-link--with-icon~.ui-main-nav-link--with-divider,
.ui-main-nav-link--with-icon~.ui-main-nav-link--with-icon,
.ui-main-nav-link--with-icon~.ui-main-nav-link--with-toggle-content,
.ui-main-nav-link--with-toggle-content~.ui-main-nav-link,
.ui-main-nav-link--with-toggle-content~.ui-main-nav-link--margin-auto,
.ui-main-nav-link--with-toggle-content~.ui-main-nav-link--with-divider,
.ui-main-nav-link--with-toggle-content~.ui-main-nav-link--with-icon,
.ui-main-nav-link--with-toggle-content~.ui-main-nav-link--with-toggle-content,
.ui-main-nav-link~.ui-main-nav-link,
.ui-main-nav-link~.ui-main-nav-link--margin-auto,
.ui-main-nav-link~.ui-main-nav-link--with-divider,
.ui-main-nav-link~.ui-main-nav-link--with-icon,
.ui-main-nav-link~.ui-main-nav-link--with-toggle-content {
    margin-left: 0
}

.active.ui-main-nav-link--margin-auto,
.active.ui-main-nav-link--with-divider,
.active.ui-main-nav-link--with-icon,
.active.ui-main-nav-link--with-toggle-content,
.ui-main-nav-link.active {
    -webkit-box-shadow: inset 0 -3px 0 var(--color-white);
    box-shadow: inset 0 -3px 0 var(--color-white)
}

.active.ui-main-nav-link--margin-auto .ui-main-nav-link__icon svg,
.active.ui-main-nav-link--with-divider .ui-main-nav-link__icon svg,
.active.ui-main-nav-link--with-icon .ui-main-nav-link__icon svg,
.active.ui-main-nav-link--with-toggle-content .ui-main-nav-link__icon svg,
.ui-main-nav-link.active .ui-main-nav-link__icon svg {
    fill: var(--color-white)
}

.active.ui-main-nav-link--margin-auto .ui-main-nav-link__label,
.active.ui-main-nav-link--with-divider .ui-main-nav-link__label,
.active.ui-main-nav-link--with-icon .ui-main-nav-link__label,
.active.ui-main-nav-link--with-toggle-content .ui-main-nav-link__label,
.ui-main-nav-link.active .ui-main-nav-link__label {
    color: var(--color-white)
}

.ui-main-nav-link--margin-auto:hover,
.ui-main-nav-link--with-divider:hover,
.ui-main-nav-link--with-icon:hover,
.ui-main-nav-link--with-toggle-content:hover,
.ui-main-nav-link:hover {
    background-color: var(--color-primary-hover-background)
}

.ui-main-nav-link--margin-auto:hover .ui-main-nav-link__icon svg,
.ui-main-nav-link--with-divider:hover .ui-main-nav-link__icon svg,
.ui-main-nav-link--with-icon:hover .ui-main-nav-link__icon svg,
.ui-main-nav-link--with-toggle-content:hover .ui-main-nav-link__icon svg,
.ui-main-nav-link:hover .ui-main-nav-link__icon svg {
    fill: var(--color-white)
}

.ui-main-nav-link--margin-auto:hover .ui-main-nav-link__label,
.ui-main-nav-link--with-divider:hover .ui-main-nav-link__label,
.ui-main-nav-link--with-icon:hover .ui-main-nav-link__label,
.ui-main-nav-link--with-toggle-content:hover .ui-main-nav-link__label,
.ui-main-nav-link:hover .ui-main-nav-link__label {
    color: var(--color-white)
}

.ui-main-nav-link .ui-dropdown-menu-title .ui-typography,
.ui-main-nav-link--margin-auto .ui-dropdown-menu-title .ui-typography,
.ui-main-nav-link--with-divider .ui-dropdown-menu-title .ui-typography,
.ui-main-nav-link--with-icon .ui-dropdown-menu-title .ui-typography,
.ui-main-nav-link--with-toggle-content .ui-dropdown-menu-title .ui-typography {
    text-align: left
}

.ui-main-nav-link--margin-auto:active,
.ui-main-nav-link--with-divider:active,
.ui-main-nav-link--with-icon:active,
.ui-main-nav-link--with-toggle-content:active,
.ui-main-nav-link:active {
    background-color: var(--color-primary-active-background);
    -webkit-box-shadow: inset 0 -3px 0 var(--color-white);
    box-shadow: inset 0 -3px 0 var(--color-white)
}

html[data-layout=controller] .ui-main-nav-link,
html[data-layout=controller] .ui-main-nav-link--margin-auto,
html[data-layout=controller] .ui-main-nav-link--with-divider,
html[data-layout=controller] .ui-main-nav-link--with-icon,
html[data-layout=controller] .ui-main-nav-link--with-toggle-content {
    -webkit-transition: 0ms;
    transition: 0ms
}

@media(min-width: 960px) {

    .ui-main-nav-link,
    .ui-main-nav-link--margin-auto,
    .ui-main-nav-link--with-divider,
    .ui-main-nav-link--with-icon,
    .ui-main-nav-link--with-toggle-content {
        padding: 0 calc(var(--main-spacing) + 8px)
    }
}

button.ui-main-nav-link,
button.ui-main-nav-link--margin-auto,
button.ui-main-nav-link--with-divider,
button.ui-main-nav-link--with-icon,
button.ui-main-nav-link--with-toggle-content {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none
}

.ui-main-nav-link__icon {
    pointer-events: none;
    position: relative;
    -webkit-transition: inherit;
    transition: inherit;
    z-index: 1
}

.ui-main-nav-link__icon svg {
    fill: var(--color-font-primary)
}

.ui-main-nav-link__label {
    pointer-events: none;
    -webkit-transition: inherit;
    transition: inherit
}

.ui-main-nav-link .ui-notification-counter,
.ui-main-nav-link--margin-auto .ui-notification-counter,
.ui-main-nav-link--with-divider .ui-notification-counter,
.ui-main-nav-link--with-icon .ui-notification-counter,
.ui-main-nav-link--with-toggle-content .ui-notification-counter {
    left: 50%;
    pointer-events: none;
    top: 12px;
    z-index: 2
}

.ui-main-nav-link__chevron.ui-main-nav-link__chevron {
    margin-left: 8px;
    pointer-events: none
}

.ui-main-nav-link__chevron.ui-main-nav-link__chevron svg {
    fill: var(--color-font-primary)
}

.ui-main-nav-link--with-icon .ui-main-nav-link__label {
    margin-left: 16px
}

.ui-main-nav-link--with-divider:after {
    background-color: var(--color-border-primary);
    content: "";
    height: calc(var(--main-nav-height)/2);
    left: 0;
    position: absolute;
    width: 1px
}

.ui-main-nav-link--with-toggle-content {
    z-index: calc(var(--z-index-main-nav) + 2) !important
}

.ui-main-nav-link--with-toggle-content .ui-dropdown-menu {
    margin-right: 8px;
    margin-top: -8px
}

.ui-main-nav-link--margin-auto {
    margin-right: auto
}

html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto {
    margin-top: auto
}

html[data-theme=big-dutchman] .ui-main-nav-link--big-dutchman-order-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
}

html[data-theme=big-dutchman] .ui-main-nav-link--big-dutchman-order-last {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3
}

html[data-theme=skov] .ui-main-nav-link--skov-order-first {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
}

html[data-theme=skov] .ui-main-nav-link--skov-order-last {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--margin-auto,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: var(--main-nav-height);
    padding: 0;
    width: auto
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link .ui-notification-counter,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-notification-counter,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-notification-counter,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-notification-counter,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-notification-counter {
    -webkit-box-shadow: 0 0 0 3px #484848;
    box-shadow: 0 0 0 3px #484848
}

html[data-layout=controller][data-theme=big-dutchman] .active.ui-main-nav-link--margin-auto,
html[data-layout=controller][data-theme=big-dutchman] .active.ui-main-nav-link--with-divider,
html[data-layout=controller][data-theme=big-dutchman] .active.ui-main-nav-link--with-icon,
html[data-layout=controller][data-theme=big-dutchman] .active.ui-main-nav-link--with-toggle-content,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--margin-auto:active,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider:active,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon:active,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content:active,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link.active,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link:active {
    background-color: var(--color-primary);
    -webkit-box-shadow: inset 4px 0 0 0 var(--color-active);
    box-shadow: inset 4px 0 0 0 var(--color-active)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link .ui-main-nav-link__icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-main-nav-link__icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-main-nav-link__icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-main-nav-link__icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-main-nav-link__icon {
    height: var(--main-nav-height);
    width: var(--main-nav-height)
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link .ui-main-nav-link__label,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-main-nav-link__label,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-main-nav-link__label,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-main-nav-link__label,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-main-nav-link__label {
    margin-left: 0;
    overflow: hidden;
    padding-right: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-dropdown-menu,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-toggle-content .ui-dropdown-menu {
    margin-left: -4px;
    margin-top: 4px
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-icon,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-icon {
    margin-left: 0;
    width: 100%
}

html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link--with-divider:after,
html[data-layout=controller][data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-divider:after {
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 100%
}

@media(min-width: 1152px) {

    html[data-theme=big-dutchman] .ui-main-nav-link,
    html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: var(--main-nav-height);
        padding: 0;
        width: auto
    }

    html[data-theme=big-dutchman] .ui-main-nav-link .ui-notification-counter,
    html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-notification-counter,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-notification-counter,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-notification-counter,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-notification-counter {
        -webkit-box-shadow: 0 0 0 3px #484848;
        box-shadow: 0 0 0 3px #484848
    }

    html[data-theme=big-dutchman] .active.ui-main-nav-link--margin-auto,
    html[data-theme=big-dutchman] .active.ui-main-nav-link--with-divider,
    html[data-theme=big-dutchman] .active.ui-main-nav-link--with-icon,
    html[data-theme=big-dutchman] .active.ui-main-nav-link--with-toggle-content,
    html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto:active,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider:active,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon:active,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content:active,
    html[data-theme=big-dutchman] .ui-main-nav-link.active,
    html[data-theme=big-dutchman] .ui-main-nav-link:active {
        background-color: var(--color-primary);
        -webkit-box-shadow: inset 4px 0 0 0 var(--color-active);
        box-shadow: inset 4px 0 0 0 var(--color-active)
    }

    html[data-theme=big-dutchman] .ui-main-nav-link .ui-main-nav-link__icon,
    html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-main-nav-link__icon,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-main-nav-link__icon,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-main-nav-link__icon,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-main-nav-link__icon {
        height: var(--main-nav-height);
        width: var(--main-nav-height)
    }

    html[data-theme=big-dutchman] .ui-main-nav-link .ui-main-nav-link__label,
    html[data-theme=big-dutchman] .ui-main-nav-link--margin-auto .ui-main-nav-link__label,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider .ui-main-nav-link__label,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon .ui-main-nav-link__label,
    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-main-nav-link__label {
        margin-left: 0;
        overflow: hidden;
        padding-right: 8px;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%
    }

    html[data-theme=big-dutchman] .ui-main-nav-link--with-toggle-content .ui-dropdown-menu,
    html[data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-toggle-content .ui-dropdown-menu {
        margin-left: -4px;
        margin-top: 4px
    }

    html[data-theme=big-dutchman] .ui-main-nav-link--with-icon,
    html[data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-icon {
        margin-left: 0;
        width: 100%
    }

    html[data-theme=big-dutchman] .ui-main-nav-link--with-divider:after,
    html[data-theme=big-dutchman] .ui-main-nav-link.ui-main-nav-link--with-divider:after {
        bottom: 0;
        content: "";
        height: 1px;
        left: 0;
        position: absolute;
        width: 100%
    }
}

.ui-tooltip,
.ui-tooltip--open,
.ui-tooltip--width {
    display: inline-block;
    opacity: 0;
    padding: 4px 8px;
    visibility: hidden;
    width: auto;
    will-change: opacity
}

.ui-tooltip--open:after,
.ui-tooltip--width:after,
.ui-tooltip:after {
    background-color: var(--color-black);
    border-radius: 4px;
    bottom: 0;
    content: "";
    left: 0;
    opacity: .85;
    position: absolute;
    right: 0;
    top: 0
}

.ui-tooltip .ui-typography,
.ui-tooltip--open .ui-typography,
.ui-tooltip--width .ui-typography {
    color: var(--color-white);
    display: block;
    position: relative;
    white-space: nowrap;
    z-index: 1
}

.ui-tooltip--open {
    opacity: 1;
    visibility: visible
}

.ui-tooltip--width .ui-typography {
    white-space: pre-wrap
}

.ui-main-nav-menu-toggle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    outline: none;
    padding: 0;
    position: relative
}

.ui-main-nav-menu-toggle:after {
    background-color: var(--color-border-primary);
    content: ""
}

.ui-main-nav-menu-toggle .ui-icon svg {
    fill: var(--color-font-primary)
}

@media(hover: hover) {
    .ui-main-nav-menu-toggle {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-main-nav-menu-toggle .ui-icon {
        -webkit-transition: inherit;
        transition: inherit
    }

    .ui-main-nav-menu-toggle:hover {
        background-color: var(--color-primary-hover-background)
    }

    .ui-main-nav-menu-toggle:hover .ui-icon svg {
        fill: var(--color-white)
    }
}

.ui-main-nav-menu-toggle:active {
    background-color: var(--color-primary-active-background)
}

html[data-theme=skov] .ui-main-nav-menu-toggle {
    margin-left: 8px;
    padding: 0 32px
}

html[data-theme=skov] .ui-main-nav-menu-toggle:after {
    height: 32px;
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px
}

html[data-theme=big-dutchman] .ui-main-nav-menu-toggle {
    height: var(--main-nav-height);
    position: absolute;
    top: 0;
    width: 100%
}

html[data-theme=big-dutchman] .ui-main-nav-menu-toggle:after {
    bottom: 0;
    height: 1px;
    position: absolute;
    width: 100%
}

.ui-main-nav-bottom-module_bottomNavigation__MJHVI {
    background-color: var(--color-primary);
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-bottom-height);
    position: fixed;
    width: 100vw;
    z-index: var(--z-index-main-nav)
}

.ui-main-nav-bottom-module_links__VdQSG {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    bottom: calc(100vh - var(--main-nav-bottom-height));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh;
    margin-left: auto;
    overflow-x: auto;
    overflow-y: hidden;
    pointer-events: none;
    position: relative;
    scroll-behavior: smooth;
    width: 100vw;
    z-index: 1
}

.ui-main-nav-bottom-module_links__VdQSG>* {
    pointer-events: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1
}

.ui-main-nav-bottom-module_links__VdQSG .ui-main-nav-link {
    height: var(--main-nav-bottom-height)
}

.ui-main-nav-bottom-module_chevron__2Ikx5 {
    -ms-flex-negative: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--color-primary-dark);
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: none;
    flex-shrink: 0;
    height: 100%;
    outline: none;
    padding: 0;
    position: absolute;
    top: 0;
    width: 40px;
    z-index: 2
}

.ui-main-nav-bottom-module_chevron__2Ikx5 .ui-icon {
    margin: auto
}

.ui-main-nav-bottom-module_chevron__2Ikx5 .ui-icon svg {
    fill: var(--color-font-primary)
}

html[data-theme=skov] .ui-main-nav-bottom-module_chevron__2Ikx5 {
    background-color: #068f48
}

.ui-main-nav-bottom-module_scrollable__AXPTP .ui-main-nav-bottom-module_links__VdQSG {
    padding: 0 40px
}

.ui-main-nav-bottom-module_scrollable__AXPTP .ui-main-nav-bottom-module_chevron__2Ikx5 {
    display: block
}

.ui-main-nav-bottom-module_scrollable__AXPTP .ui-main-nav-bottom-module_chevron__2Ikx5:first-of-type {
    left: 0
}

.ui-main-nav-bottom-module_scrollable__AXPTP .ui-main-nav-bottom-module_chevron__2Ikx5:last-of-type {
    right: 0
}

.ui-veil,
.ui-veil--animation {
    background: var(--color-backdrop-background);
    display: block;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    will-change: opacity;
    z-index: var(--z-index-veil)
}

.ui-veil--animation {
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
    will-change: opacity
}

.ui-mega-menu {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    left: 0;
    max-height: 100vh;
    padding-bottom: var(--main-nav-height);
    position: fixed;
    top: 0;
    width: 100%;
    will-change: transform;
    z-index: var(--z-index-mega-menu)
}

.ui-mega-menu+.ui-veil {
    z-index: calc(var(--z-index-mega-menu) - 1)
}

.ui-mega-menu__close {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    justify-content: center;
    outline: none;
    padding: 0;
    position: absolute;
    right: var(--main-spacing);
    top: 0;
    width: var(--main-nav-height);
    z-index: 1
}

.ui-mega-menu__close:active {
    background-color: var(--color-active-background)
}

.ui-mega-menu__links {
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--badge-size) + var(--main-spacing)*2), 1fr));
    justify-content: space-evenly;
    justify-items: center;
    list-style: none;
    margin: 0;
    overflow-y: scroll;
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing);
    padding-top: var(--main-spacing);
    position: relative
}

@media(min-width: 960px) {
    .ui-mega-menu__links {
        padding-top: calc(var(--main-spacing)*2)
    }
}

.ui-mega-menu__information {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    left: 0;
    list-style: none;
    margin: 0;
    padding-left: 0;
    position: absolute;
    right: 0
}

.ui-mega-menu__information li {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1
}

.ui-mega-menu__information li:last-child {
    margin-right: 0 !important
}

.ui-mega-menu__information li .ui-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-mega-menu__header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--panel-header-height);
    padding-left: var(--main-spacing);
    padding-right: calc(16px + var(--panel-header-height));
    padding-top: 8px;
    position: relative
}

.ui-mega-menu__header:after {
    bottom: 0;
    content: "";
    height: 1px;
    left: var(--main-spacing);
    position: absolute;
    right: 0
}

.ui-mega-menu__header img {
    margin-right: 16px;
    width: 48px
}

html[data-theme=skov] .ui-mega-menu {
    background-color: #1F4C00;
}

html[data-theme=skov] .ui-mega-menu__close .ui-icon svg {
    fill: #F6EDD9
}

html[data-theme=skov] .ui-mega-menu {
    padding-top: var(--main-nav-height)
}

html[data-theme=skov] .ui-mega-menu__links {
    max-height: calc(100vh - var(--main-nav-height)*2)
}

html[data-theme=skov] .ui-mega-menu__header {
    display: none
}

html[data-theme=skov] .ui-mega-menu__information {
    border-bottom-color: #406E00;
    left: var(--main-spacing);
    padding-right: var(--main-nav-height);
    right: var(--main-spacing);
    top: 0
}

html[data-theme=skov] .ui-mega-menu__information li {
    margin-right: 24px;
    min-width: 80px
}

html[data-theme=skov] .ui-mega-menu__information li:last-child {
    margin-right: 0
}

html[data-theme=big-dutchman] .ui-mega-menu {
    background-color: var(--color-primary-dark)
}

html[data-theme=big-dutchman] .ui-mega-menu__close .ui-icon svg {
    fill: #b4b4b4
}

html[data-theme=big-dutchman] .ui-mega-menu {
    bottom: 0;
    width: var(--bd-mega-menu-width)
}

html[data-theme=big-dutchman] .ui-mega-menu__links {
    grid-template-columns: repeat(auto-fill, minmax(calc(var(--badge-size) + var(--main-spacing)), 1fr));
    max-height: calc(100vh - var(--main-nav-height)*2 - var(--panel-header-height))
}

html[data-theme=big-dutchman] .ui-mega-menu__close {
    height: var(--panel-header-height);
    right: 0;
    width: var(--panel-header-height)
}

html[data-theme=big-dutchman] .ui-mega-menu__information {
    background-color: var(--color-primary);
    border-top-color: #686868;
    bottom: 0;
    padding: 0 var(--main-spacing)
}

html[data-theme=big-dutchman] .ui-mega-menu__information li {
    min-width: 0;
    padding-right: 24px
}

html[data-theme=big-dutchman] .ui-mega-menu__header {
    background-color: var(--color-primary)
}

html[data-theme=big-dutchman] .ui-mega-menu__header:after {
    background-color: #686868
}

html[data-theme=big-dutchman] .ui-mega-menu__header .ui-typography {
    color: #fff
}

.ui-mega-menu-link {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-user-drag: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    justify-content: center;
    margin-bottom: 64px;
    position: relative;
    width: 100%
}

.ui-mega-menu-link:active .ui-badge {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: .6
}

@media(min-width: 960px) {
    .ui-mega-menu-link {
        margin-bottom: 80px
    }
}

.ui-mega-menu-link__name {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    left: -8px;
    margin: 0 auto;
    overflow: hidden;
    position: absolute;
    right: -8px;
    text-align: center;
    text-overflow: ellipsis;
    top: calc(100% + 8px);
    width: auto;
    width: var(--badge-size);
    word-break: break-word
}

.ui-mega-menu-link--with-divider:before {
    background-color: var(--color-border-primary);
    content: "";
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 1px
}

html[data-theme=skov] .ui-mega-menu-link .ui-mega-menu-link__name {
    color: #F6EDD9
}

html[data-theme=skov] .ui-mega-menu-link.active .ui-mega-menu-link__name,
html[data-theme=skov] .ui-mega-menu-link:active .ui-mega-menu-link__name {
    color: #fff
}

html[data-theme=big-dutchman] .ui-mega-menu-link .ui-mega-menu-link__name {
    color: #b4b4b4
}

html[data-theme=big-dutchman] .ui-mega-menu-link.active .ui-mega-menu-link__name,
html[data-theme=big-dutchman] .ui-mega-menu-link:active .ui-mega-menu-link__name {
    color: #fff
}

.ui-badge,
.ui-badge--raised,
.ui-badge--selected,
.ui-badge--size-extra-small,
.ui-badge--size-small {
    display: block;
    position: relative
}

.ui-badge__icon-container {
    border-radius: var(--border-radius);
    height: var(--badge-size);
    margin: 0 auto;
    position: relative;
    width: var(--badge-size)
}

.ui-badge__icon {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-badge__icon,
.ui-badge__icon svg {
    height: calc(var(--badge-size)/2);
    width: calc(var(--badge-size)/2)
}

.ui-badge__label {
    margin-top: 8px
}

.ui-badge--size-small .ui-badge__icon-container {
    height: var(--badge-size-small);
    width: var(--badge-size-small)
}

.ui-badge--size-small .ui-badge__icon,
.ui-badge--size-small .ui-badge__icon svg {
    height: calc(var(--badge-size-small)/2);
    width: calc(var(--badge-size-small)/2)
}

.ui-badge--size-extra-small .ui-badge__icon-container {
    height: var(--badge-size-extra-small);
    width: var(--badge-size-extra-small)
}

.ui-badge--size-extra-small .ui-badge__icon,
.ui-badge--size-extra-small .ui-badge__icon svg {
    height: calc(var(--badge-size-extra-small)/2);
    width: calc(var(--badge-size-extra-small)/2)
}

.ui-badge--size-extra-small .ui-badge__icon-container {
    border-radius: 4px
}

.ui-badge--raised .ui-badge__icon-container {
    -webkit-box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08)
}

.ui-badge--selected .ui-badge__icon-container {
    background-image: none
}

html[data-theme=skov] .ui-badge__icon-container {
    background-color: none;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200);
}

html[data-theme=skov] .ui-badge--theme-alarm .ui-badge__icon-container {
    background-color: var(--color-alarm);
    background-image: none
}

html[data-theme=skov] .ui-badge--theme-warning .ui-badge__icon-container {
    background-color: var(--color-warning);
    background-image: none
}

html[data-theme=skov] .ui-badge--theme-trust-me .ui-badge__icon-container {
    background-color: var(--color-trust-me);
    background-image: none
}

html[data-theme=skov] .ui-badge__icon svg {
    fill: #fff
}

html[data-theme=skov] .ui-badge--selected .ui-badge__icon-container {
    background-color: #fff;
    background-image: none
}

html[data-theme=skov] .ui-badge--selected .ui-badge__icon svg {
    fill: #8cb733
}

html[data-theme=skov] .ui-badge--selected.ui-badge--theme-alarm .ui-badge__icon svg {
    fill: var(--color-alarm)
}

html[data-theme=skov] .ui-badge--selected.ui-badge--theme-warning .ui-badge__icon svg {
    fill: var(--color-warning)
}

html[data-theme=skov] .ui-badge--selected.ui-badge--theme-trust-me .ui-badge__icon svg {
    fill: var(--color-trust-me)
}

html[data-theme=big-dutchman] .ui-badge__icon-container {
    background-color: #ea6f18;
    background-image: none
}

html[data-theme=big-dutchman] .ui-badge--theme-alarm .ui-badge__icon-container {
    background-color: var(--color-alarm);
    background-image: none
}

html[data-theme=big-dutchman] .ui-badge--theme-warning .ui-badge__icon-container {
    background-color: var(--color-warning);
    background-image: none
}

html[data-theme=big-dutchman] .ui-badge--theme-trust-me .ui-badge__icon-container {
    background-color: var(--color-trust-me);
    background-image: none
}

html[data-theme=big-dutchman] .ui-badge__icon svg {
    fill: #fff
}

html[data-theme=big-dutchman] .ui-badge--selected .ui-badge__icon-container {
    background-color: #fff;
    background-image: none
}

html[data-theme=big-dutchman] .ui-badge--selected .ui-badge__icon svg {
    fill: #ea6f18
}

html[data-theme=big-dutchman] .ui-badge--selected.ui-badge--theme-alarm .ui-badge__icon svg {
    fill: var(--color-alarm)
}

html[data-theme=big-dutchman] .ui-badge--selected.ui-badge--theme-warning .ui-badge__icon svg {
    fill: var(--color-warning)
}

html[data-theme=big-dutchman] .ui-badge--selected.ui-badge--theme-trust-me .ui-badge__icon svg {
    fill: var(--color-trust-me)
}

.ui-mega-menu-language-selector {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    padding: 16px var(--main-spacing)
}

@media(min-width: 960px) {
    .ui-mega-menu-language-selector {
        padding: 20px var(--main-spacing)
    }
}

html[data-theme=skov] .ui-mega-menu-language-selector {
    background-color: #031E00;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0
}

html[data-theme=big-dutchman] .ui-mega-menu-language-selector {
    background-color: var(--color-primary);
    border-bottom: 1px solid var(--color-border-primary)
}

.ui-card-module_card__bDmWH {
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    -webkit-box-shadow: var(--card-box-shadow);
    box-shadow: var(--card-box-shadow);
    padding: var(--card-low-density-padding);
    position: relative;
    width: 100%
}

.ui-card-module_button__cBrXz {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: rgba(0, 0, 0, .1);
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
    width: var(--card-button-size)
}

.ui-card-module_button__cBrXz .ui-icon svg {
    fill: var(--color-grey1)
}

.ui-card-module_button__cBrXz .ui-typography {
    color: var(--color-grey1);
    margin-right: 8px
}

.ui-card-module_stateBorder__ta6xe {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    height: 4px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-card-module_primary__ELlMk {
    background-color: var(--color-primary)
}

.ui-card-module_primary__ELlMk .ui-card-module_button__cBrXz .ui-icon svg {
    fill: var(--color-font-primary)
}

.ui-card-module_primary__ELlMk .ui-card-module_button__cBrXz .ui-typography {
    color: var(--color-font-primary)
}

html[data-theme=skov] .ui-card-module_primary__ELlMk {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200);
}

.ui-card-module_primaryLight__MzawN {
    background-color: var(--color-primary-light)
}

.ui-card-module_primaryLight__MzawN .ui-card-module_button__cBrXz .ui-icon svg {
    fill: var(--color-white)
}

.ui-card-module_primaryLight__MzawN .ui-card-module_button__cBrXz .ui-typography {
    color: var(--color-white)
}

html[data-theme=skov] .ui-card-module_primaryLight__MzawN {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200);
}

.ui-card-module_fixedHeight1__B7UZT {
    height: var(--card-fixed-height-1)
}

.ui-card-module_fixedHeight2__kQoze {
    height: var(--card-fixed-height-2)
}

.ui-card-module_fixedHeight3__vzZLu {
    height: var(--card-fixed-height-3)
}

.ui-card-module_clickableCard__iLKUb {
    cursor: pointer;
    overflow: hidden;
    padding-right: calc(var(--card-button-size) + var(--main-spacing));
    position: relative;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-card-module_clickableCard__iLKUb:after {
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-card-module_clickableCard__iLKUb:hover:after {
    background-color: var(--color-hover-background);
    opacity: 1
}

.ui-card-module_clickableCard__iLKUb:active:after {
    background-color: var(--color-active-background);
    opacity: 1
}

.ui-card-module_clickableLabel__3-cEw .ui-card-module_button__cBrXz {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: 0;
    bottom: 0;
    cursor: pointer;
    height: var(--card-button-size);
    left: 0;
    top: auto;
    width: 100%
}

.ui-card-module_clickableLabel__3-cEw .ui-card-module_button__cBrXz:after {
    background-color: var(--color-black);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-card-module_clickableLabel__3-cEw .ui-card-module_button__cBrXz:hover:after {
    opacity: .1
}

.ui-card-module_clickableLabel__3-cEw .ui-card-module_button__cBrXz:active:after {
    opacity: .2
}

.ui-card-module_clickableLabel__3-cEw.ui-card-module_densityLow__X3OXf {
    padding-bottom: calc(var(--card-button-size) + var(--card-low-density-padding))
}

.ui-card-module_clickableLabel__3-cEw.ui-card-module_densityHigh__Sqil3 {
    padding-bottom: calc(var(--card-button-size) + var(--card-high-density-padding))
}

.ui-card-module_densityHigh__Sqil3 {
    padding: var(--card-high-density-padding)
}

.ui-card-module_stateAlarm__qmTd5 .ui-card-module_stateBorder__ta6xe {
    background-color: var(--color-alarm)
}

.ui-card-module_stateWarning__458cJ .ui-card-module_stateBorder__ta6xe {
    background-color: var(--color-warning)
}

.ui-card-module_stateInformation__QcWdi .ui-card-module_stateBorder__ta6xe {
    background-color: var(--color-information)
}

.ui-card-module_stateTrustMe__6ERxs .ui-card-module_stateBorder__ta6xe {
    background-color: var(--color-trust-me)
}

.ui-card-module_stateDisabled__wfFuk .ui-card-module_stateBorder__ta6xe {
    background-color: var(--color-disabled)
}

.ui-card-module_statePositionLeft__5FCyK .ui-card-module_stateBorder__ta6xe {
    border-bottom-left-radius: var(--border-radius);
    border-top-right-radius: 0;
    bottom: 0;
    height: 100%;
    left: 0;
    right: auto;
    top: 0;
    width: 4px
}

.ui-card-module_flat__aKZwZ {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.ui-card-module_flat__aKZwZ:not(.ui-card-module_primaryLight__MzawN),
.ui-card-module_flat__aKZwZ:not(.ui-card-module_primary__ELlMk) {
    border: 1px solid var(--color-border)
}

.ui-chip,
.ui-chip--hollow.ui-chip--hollow.ui-chip--hollow,
.ui-chip--large,
.ui-chip--theme-alarm,
.ui-chip--theme-ok,
.ui-chip--theme-primary,
.ui-chip--theme-primary-light,
.ui-chip--theme-trust-me,
.ui-chip--theme-warning {
    --button-icon-padding: 2px;
    background-color: var(--default-background-color);
    border-radius: 4px;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    padding-left: 8px;
    padding-right: 8px;
    position: relative
}

.ui-chip__text {
    color: var(--default-font-color);
    line-height: var(--chip-height);
    position: relative;
    z-index: 1
}

.ui-chip__icon {
    border-radius: 100%;
    bottom: 0;
    height: var(--chip-height);
    position: absolute;
    right: 0;
    top: 0;
    width: var(--chip-height)
}

.ui-chip__icon .ui-icon {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1
}

button.ui-chip__icon {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: rgba(0, 0, 0, .1);
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    height: calc(var(--chip-height) - var(--button-icon-padding)*2);
    outline: none;
    padding: 0;
    right: var(--button-icon-padding);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: calc(var(--chip-height) - var(--button-icon-padding)*2)
}

@media(hover: hover) {
    button.ui-chip__icon {
        -webkit-transition: .2s;
        transition: .2s
    }

    button.ui-chip__icon:hover {
        background-color: var(--color-hover-background)
    }

    .ui-chip[class*="--theme"] button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--hollow button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--large button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-alarm button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-ok button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-primary button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-primary-light button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-trust-me button.ui-chip__icon:hover,
    [class*="--theme"].ui-chip--theme-warning button.ui-chip__icon:hover {
        background-color: var(--color-primary-hover-background)
    }
}

button.ui-chip__icon:active {
    background-color: var(--color-active-background)
}

.ui-chip[class*="--theme"] button.ui-chip__icon:active,
[class*="--theme"].ui-chip--hollow button.ui-chip__icon:active,
[class*="--theme"].ui-chip--large button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-alarm button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-ok button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-primary button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-primary-light button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-trust-me button.ui-chip__icon:active,
[class*="--theme"].ui-chip--theme-warning button.ui-chip__icon:active {
    background-color: var(--color-primary-active-background)
}

.ui-chip--theme-alarm .ui-chip__text,
.ui-chip--theme-ok .ui-chip__text,
.ui-chip--theme-primary .ui-chip__text,
.ui-chip--theme-primary-light .ui-chip__text,
.ui-chip--theme-trust-me .ui-chip__text,
.ui-chip--theme-warning .ui-chip__text {
    color: var(--color-white)
}

.ui-chip--theme-alarm .ui-chip__icon svg,
.ui-chip--theme-ok .ui-chip__icon svg,
.ui-chip--theme-primary .ui-chip__icon svg,
.ui-chip--theme-primary-light .ui-chip__icon svg,
.ui-chip--theme-trust-me .ui-chip__icon svg,
.ui-chip--theme-warning .ui-chip__icon svg {
    fill: var(--color-white)
}

.ui-chip--theme-alarm {
    background-color: var(--color-alarm)
}

.ui-chip--theme-warning {
    background-color: var(--color-warning)
}

.ui-chip--theme-ok {
    background-color: var(--color-success)
}

.ui-chip--theme-primary {
    background-color: var(--color-primary)
}

.ui-chip--theme-primary-light {
    background-color: var(--color-primary-light)
}

.ui-chip--theme-trust-me {
    background-color: var(--color-trust-me)
}

.ui-chip--large {
    padding-left: 16px;
    padding-right: 16px
}

.ui-chip--large .ui-chip__text {
    line-height: var(--chip-height-large)
}

.ui-chip--large .ui-chip__icon {
    height: var(--chip-height-large);
    width: var(--chip-height-large)
}

.ui-chip--large button.ui-chip__icon {
    height: calc(var(--chip-height-large) - var(--button-icon-padding)*2);
    width: calc(var(--chip-height-large) - var(--button-icon-padding)*2)
}

.ui-chip--large.ui-chip--with-icon {
    padding-left: 16px;
    padding-right: calc(var(--chip-height-large) + var(--button-icon-padding)*2)
}

.ui-chip--large.ui-chip--icon-position-left {
    padding-left: calc(var(--chip-height-large) + var(--button-icon-padding)*2);
    padding-right: 16px
}

.ui-chip--hollow.ui-chip--hollow.ui-chip--hollow {
    background-color: transparent;
    border: 1px solid var(--color-border)
}

.ui-chip--clickable {
    border-radius: calc(var(--chip-height)/2);
    cursor: pointer
}

.ui-chip--clickable.ui-chip--large {
    border-radius: calc(var(--chip-height-large)/2)
}

.ui-chip--clickable:after {
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0
}

@media(hover: hover) {

    .ui-chip--clickable,
    .ui-chip--clickable:after {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-chip--clickable:hover:after {
        background-color: var(--color-hover-background);
        opacity: 1
    }
}

.ui-chip--clickable:active:after {
    background-color: var(--color-active-background);
    opacity: 1
}

.ui-chip--with-icon {
    padding-right: var(--chip-height)
}

.ui-chip--icon-position-left {
    padding-left: var(--chip-height);
    padding-right: 8px
}

.ui-chip--icon-position-left .ui-chip__icon {
    left: 0;
    right: auto
}

.ui-chip--icon-clickable {
    border-radius: calc(var(--chip-height)/2)
}

.ui-chip--icon-clickable.ui-chip--large {
    border-radius: calc(var(--chip-height-large)/2)
}

.ui-daily-user-card.ui-daily-user-card {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-line-pack: center;
    -webkit-box-flex: 1;
    align-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 0 0px;
    flex: 1 0 0;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding-bottom: calc(var(--main-spacing)*2);
    padding-top: calc(var(--main-spacing)*2);
    position: relative;
    text-align: center
}

.ui-daily-user-card__icon {
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-daily-user-card__icon,
.ui-daily-user-card__icon svg {
    height: var(--icon-size-large);
    width: var(--icon-size-large)
}

.ui-daily-user-card__icon svg {
    fill: var(--color-white)
}

@media(min-width: 960px) {

    .ui-daily-user-card__icon,
    .ui-daily-user-card__icon svg {
        height: var(--icon-size-extra-large);
        width: var(--icon-size-extra-large)
    }
}

.ui-daily-user-card__label {
    font-size: var(--caption-font-size);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

@media(min-width: 960px) {
    .ui-daily-user-card__label {
        font-size: var(--subtitle1-font-size)
    }
}

.ui-daily-user-card__value {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    left: var(--main-spacing);
    position: absolute;
    right: var(--main-spacing);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) {
    border-bottom: 1px solid var(--color-border-primary);
    display: inline-block;
    margin-top: 8px;
    min-width: 0;
    overflow: hidden;
    padding-bottom: 8px;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) .ui-typography {
    display: inline;
    margin-left: 8px
}

.ui-daily-user-card__note {
    bottom: calc(var(--main-spacing)*2);
    font-size: var(--caption-font-size);
    left: 0;
    overflow: hidden;
    padding: 0 var(--main-spacing);
    position: absolute;
    right: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

@media(min-width: 960px) {
    .ui-daily-user-card__note {
        font-size: var(--subtitle1-font-size)
    }
}

.ui-daily-user-card__chip {
    bottom: calc(100% + 8px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 0;
    position: absolute;
    right: 0
}

.ui-daily-user-card__chip .ui-chip {
    display: inline-block;
    margin: 0 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-daily-user-card__footer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    bottom: calc(var(--main-spacing)*4);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--button-height-small);
    justify-content: center;
    left: var(--main-spacing);
    position: absolute;
    right: var(--main-spacing)
}

@media(min-width: 960px) {
    .ui-daily-user-card__footer {
        height: var(--button-height)
    }
}

html[data-theme=skov] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) {
    font-size: 26px;
    font-weight: 400
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) {
        font-size: 56px
    }
}

html[data-theme=big-dutchman] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) {
    font-size: 24px;
    font-weight: 400
}

html[data-theme=big-dutchman] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) .ui-typography {
    font-size: 12px
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) {
        font-size: 48px
    }

    html[data-theme=big-dutchman] .ui-daily-user-card__value>.ui-typography:not(.ui-daily-user-card__label) .ui-typography {
        font-size: var(--body1-font-size)
    }
}

.ui-button-module_button__tVoYk {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    border: none;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-box-shadow: var(--button-box-shadow);
    box-shadow: var(--button-box-shadow);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--button-height);
    justify-content: center;
    outline: none;
    overflow: hidden;
    padding: 0 var(--main-spacing);
    position: relative
}

.ui-button-module_button__tVoYk input {
    bottom: 0;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0
}

@media (min-width: 640px) {
    .ui-button-module_button__tVoYk {
        min-width: 100px
    }
}

@media (min-width: 960px) {
    .ui-button-module_button__tVoYk {
        min-width: 120px
    }
}

.ui-button-module_icon__mLu66 {
    margin-left: 8px
}

.ui-button-module_icon__mLu66 svg {
    fill: var(--color-grey1)
}

.ui-button-module_icon__mLu66.ui-button-module_iconLeft__12qKh {
    margin-left: 0;
    margin-right: 8px
}

.ui-button-module_text__b-wpd {
    color: var(--color-grey1);
    line-height: 100%;
    text-align: center;
    width: auto
}

.ui-button-module_themeAlarm__U-Kc-,
.ui-button-module_themeConfirm__hDnda,
.ui-button-module_themePrimaryLight__6TCvI,
.ui-button-module_themePrimary__PAY8t,
.ui-button-module_themeWarning__Rltrn {
    border: none
}

.ui-button-module_themeAlarm__U-Kc- .ui-button-module_text__b-wpd,
.ui-button-module_themeConfirm__hDnda .ui-button-module_text__b-wpd,
.ui-button-module_themePrimaryLight__6TCvI .ui-button-module_text__b-wpd,
.ui-button-module_themePrimary__PAY8t .ui-button-module_text__b-wpd,
.ui-button-module_themeWarning__Rltrn .ui-button-module_text__b-wpd {
    color: var(--color-white)
}

.ui-button-module_themeAlarm__U-Kc- .ui-button-module_icon__mLu66 svg,
.ui-button-module_themeConfirm__hDnda .ui-button-module_icon__mLu66 svg,
.ui-button-module_themePrimaryLight__6TCvI .ui-button-module_icon__mLu66 svg,
.ui-button-module_themePrimary__PAY8t .ui-button-module_icon__mLu66 svg,
.ui-button-module_themeWarning__Rltrn .ui-button-module_icon__mLu66 svg {
    fill: var(--color-white)
}

.ui-button-module_themeAlarm__U-Kc-.ui-button-module_flat__aZhdR .ui-button-module_text__b-wpd,
.ui-button-module_themeConfirm__hDnda.ui-button-module_flat__aZhdR .ui-button-module_text__b-wpd,
.ui-button-module_themePrimaryLight__6TCvI.ui-button-module_flat__aZhdR .ui-button-module_text__b-wpd,
.ui-button-module_themePrimary__PAY8t.ui-button-module_flat__aZhdR .ui-button-module_text__b-wpd,
.ui-button-module_themeWarning__Rltrn.ui-button-module_flat__aZhdR .ui-button-module_text__b-wpd {
    color: var(--color-font-primary)
}

.ui-button-module_themeAlarm__U-Kc-.ui-button-module_flat__aZhdR .ui-button-module_icon__mLu66 svg,
.ui-button-module_themeConfirm__hDnda.ui-button-module_flat__aZhdR .ui-button-module_icon__mLu66 svg,
.ui-button-module_themePrimaryLight__6TCvI.ui-button-module_flat__aZhdR .ui-button-module_icon__mLu66 svg,
.ui-button-module_themePrimary__PAY8t.ui-button-module_flat__aZhdR .ui-button-module_icon__mLu66 svg,
.ui-button-module_themeWarning__Rltrn.ui-button-module_flat__aZhdR .ui-button-module_icon__mLu66 svg {
    fill: var(--color-font-primary)
}

.ui-button-module_themeAlarm__U-Kc- {
    background-color: var(--color-alarm)
}

html[data-theme=skov] .ui-button-module_themeAlarm__U-Kc- {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#bf334f), to(#ab1f3b));
    background-image: linear-gradient(-180deg, #bf334f, #ab1f3b)
}

.ui-button-module_themeWarning__Rltrn {
    background-color: var(--color-warning)
}

html[data-theme=skov] .ui-button-module_themeWarning__Rltrn {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e7bb20), to(#cfa71c));
    background-image: linear-gradient(-180deg, #e7bb20, #cfa71c)
}

.ui-button-module_themeConfirm__hDnda {
    background-color: var(--color-success)
}

html[data-theme=skov] .ui-button-module_themeConfirm__hDnda {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

.ui-button-module_themePrimary__PAY8t {
    background-color: var(--color-primary)
}

html[data-theme=skov] .ui-button-module_themePrimary__PAY8t {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#406E00), to(#406E00));
    background-image: linear-gradient(-180deg, #406E00, #406E00);
}

html[data-theme=big-dutchman] .ui-button-module_themePrimary__PAY8t {
    background-color: var(--color-grey1)
}

.ui-button-module_themePrimaryLight__6TCvI {
    background-color: var(--color-primary-light)
}

html[data-theme=skov] .ui-button-module_themePrimaryLight__6TCvI {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

.ui-button-module_disabled__FLMFJ {
    cursor: not-allowed;
    opacity: .6
}

.ui-button-module_hollow__6O38U {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.ui-button-module_clickable__WVBYy {
    cursor: pointer;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-button-module_clickable__WVBYy * {
    position: relative;
    z-index: 1
}

.ui-button-module_clickable__WVBYy input {
    cursor: pointer;
    pointer-events: all
}

.ui-button-module_clickable__WVBYy:after {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: background-color .2s;
    transition: background-color .2s
}

.ui-button-module_clickable__WVBYy:hover:not(.ui-button-module_themeAlarm__U-Kc-):after,
.ui-button-module_clickable__WVBYy:hover:not(.ui-button-module_themePrimary__PAY8t):after {
    background-color: var(--color-hover-background)
}

.ui-button-module_clickable__WVBYy:hover.ui-button-module_themeAlarm__U-Kc-:after,
.ui-button-module_clickable__WVBYy:hover.ui-button-module_themePrimary__PAY8t:after {
    background-color: var(--color-primary-hover-background)
}

.ui-button-module_clickable__WVBYy:active {
    -webkit-box-shadow: none;
    box-shadow: none
}

.ui-button-module_clickable__WVBYy:active:not(.ui-button-module_themeAlarm__U-Kc-):after,
.ui-button-module_clickable__WVBYy:active:not(.ui-button-module_themePrimary__PAY8t):after {
    background-color: var(--color-active-background)
}

.ui-button-module_clickable__WVBYy:active.ui-button-module_themeAlarm__U-Kc-:after,
.ui-button-module_clickable__WVBYy:active.ui-button-module_themePrimary__PAY8t:after {
    background-color: var(--color-primary-active-background)
}

.ui-button-module_active__s-4FT {
    background-color: var(--default-background-color);
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.ui-button-module_active__s-4FT .ui-button-module_icon__mLu66 svg {
    fill: var(--color-active)
}

.ui-button-module_active__s-4FT .ui-button-module_text__b-wpd {
    color: var(--color-font-label)
}

.ui-button-module_flat__aZhdR {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.ui-button-module_small__gKA3q {
    height: var(--button-height-small);
    min-width: 100px
}

.ui-button-module_small__gKA3q .ui-button-module_text__b-wpd {
    font-size: var(--base-font-size)
}

.ui-button-module_extraSmall__-xWMM {
    height: var(--button-height-extra-small);
    min-width: 100px;
    padding: 0 16px
}

.ui-button-module_extraSmall__-xWMM .ui-button-module_text__b-wpd {
    font-size: var(--base-font-size)
}

.ui-button-module_block__5xw4- {
    width: 100%
}

.ui-button-icon,
.ui-button-icon--clickable,
.ui-button-icon--disabled,
.ui-button-icon--flat,
.ui-button-icon--primary {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--button-icon-height);
    justify-content: center;
    outline: none;
    padding: 0;
    position: relative;
    width: var(--button-icon-width)
}

.ui-button-icon .ui-icon svg,
.ui-button-icon--clickable .ui-icon svg,
.ui-button-icon--disabled .ui-icon svg,
.ui-button-icon--flat .ui-icon svg,
.ui-button-icon--primary .ui-icon svg {
    fill: var(--color-grey1)
}

.ui-button-icon--primary {
    border-color: var(--color-border-primary)
}

.ui-button-icon--primary .ui-icon svg {
    fill: var(--color-font-primary)
}

.ui-button-icon--disabled {
    cursor: not-allowed;
    opacity: .6
}

.ui-button-icon--flat {
    border: none;
    border-radius: 100%;
    width: var(--button-icon-height)
}

.ui-button-icon--clickable {
    cursor: pointer
}

@media(hover: hover) {
    .ui-button-icon--clickable {
        -webkit-transition: background-color .2s;
        transition: background-color .2s;
        will-change: background-color
    }

    .ui-button-icon--clickable:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-button-icon--clickable:active {
    background-color: var(--color-active-background)
}

@media(hover: hover) {
    .ui-button-icon--clickable.ui-button-icon--primary:hover {
        background-color: var(--color-primary-hover-background)
    }
}

.ui-button-icon--clickable.ui-button-icon--primary:active {
    background-color: var(--color-primary-active-background)
}

.ui-button-container,
.ui-button-container--align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%
}

.ui-button-container [class^=ui-button],
.ui-button-container--align [class^=ui-button] {
    margin-right: 8px
}

@media(min-width: 960px) {

    .ui-button-container [class^=ui-button],
    .ui-button-container--align [class^=ui-button] {
        margin-right: 16px
    }
}

.ui-button-container--align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.ui-button-container--align-right [class^=ui-button]:last-of-type {
    margin-right: 0
}

.ui-button-container--align-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.ui-button-round,
.ui-button-round--disabled,
.ui-button-round--extra-large,
.ui-button-round--extra-small,
.ui-button-round--large,
.ui-button-round--small,
.ui-button-round--small-icon,
.ui-button-round--theme-confirm,
.ui-button-round--theme-primary,
.ui-button-round--theme-primary-light {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border: 1px solid var(--color-border);
    border-radius: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--button-round-height);
    justify-content: center;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-align: center;
    width: var(--button-round-height)
}

.ui-button-round .ui-typography,
.ui-button-round--disabled .ui-typography,
.ui-button-round--extra-large .ui-typography,
.ui-button-round--extra-small .ui-typography,
.ui-button-round--large .ui-typography,
.ui-button-round--small .ui-typography,
.ui-button-round--small-icon .ui-typography,
.ui-button-round--theme-confirm .ui-typography,
.ui-button-round--theme-primary .ui-typography,
.ui-button-round--theme-primary-light .ui-typography {
    color: var(--color-grey1);
    font-size: 24px;
    pointer-events: none
}

.ui-button-round .ui-icon,
.ui-button-round--disabled .ui-icon,
.ui-button-round--extra-large .ui-icon,
.ui-button-round--extra-small .ui-icon,
.ui-button-round--large .ui-icon,
.ui-button-round--small .ui-icon,
.ui-button-round--small-icon .ui-icon,
.ui-button-round--theme-confirm .ui-icon,
.ui-button-round--theme-primary .ui-icon,
.ui-button-round--theme-primary-light .ui-icon {
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-button-round .ui-icon svg,
.ui-button-round--disabled .ui-icon svg,
.ui-button-round--extra-large .ui-icon svg,
.ui-button-round--extra-small .ui-icon svg,
.ui-button-round--large .ui-icon svg,
.ui-button-round--small .ui-icon svg,
.ui-button-round--small-icon .ui-icon svg,
.ui-button-round--theme-confirm .ui-icon svg,
.ui-button-round--theme-primary .ui-icon svg,
.ui-button-round--theme-primary-light .ui-icon svg {
    fill: var(--color-grey1)
}

.ui-button-round--disabled:after,
.ui-button-round--extra-large:after,
.ui-button-round--extra-small:after,
.ui-button-round--large:after,
.ui-button-round--small-icon:after,
.ui-button-round--small:after,
.ui-button-round--theme-confirm:after,
.ui-button-round--theme-primary-light:after,
.ui-button-round--theme-primary:after,
.ui-button-round:after {
    background-color: rgba(0, 0, 0, .1) !important;
    border-radius: 100%;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden
}

.ui-button-round--disabled:active,
.ui-button-round--extra-large:active,
.ui-button-round--extra-small:active,
.ui-button-round--large:active,
.ui-button-round--small-icon:active,
.ui-button-round--small:active,
.ui-button-round--theme-confirm:active,
.ui-button-round--theme-primary-light:active,
.ui-button-round--theme-primary:active,
.ui-button-round:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.ui-button-round--disabled:active:after,
.ui-button-round--extra-large:active:after,
.ui-button-round--extra-small:active:after,
.ui-button-round--large:active:after,
.ui-button-round--small-icon:active:after,
.ui-button-round--small:active:after,
.ui-button-round--theme-confirm:active:after,
.ui-button-round--theme-primary-light:active:after,
.ui-button-round--theme-primary:active:after,
.ui-button-round:active:after {
    opacity: 1;
    visibility: visible
}

@media(min-width: 960px) {

    .ui-button-round .ui-typography,
    .ui-button-round--disabled .ui-typography,
    .ui-button-round--extra-large .ui-typography,
    .ui-button-round--extra-small .ui-typography,
    .ui-button-round--large .ui-typography,
    .ui-button-round--small .ui-typography,
    .ui-button-round--small-icon .ui-typography,
    .ui-button-round--theme-confirm .ui-typography,
    .ui-button-round--theme-primary .ui-typography,
    .ui-button-round--theme-primary-light .ui-typography {
        font-size: 32px
    }
}

.ui-button-round--theme-confirm,
.ui-button-round--theme-primary,
.ui-button-round--theme-primary-light {
    border: none
}

.ui-button-round--small {
    height: var(--button-round-height-small);
    width: var(--button-round-height-small)
}

.ui-button-round--small .ui-typography {
    font-size: 24px
}

.ui-button-round--large {
    height: var(--button-round-height-large);
    width: var(--button-round-height-large)
}

.ui-button-round--extra-large {
    height: var(--button-round-height-extra-large);
    width: var(--button-round-height-extra-large)
}

.ui-button-round--disabled {
    cursor: not-allowed;
    opacity: .5;
    pointer-events: none
}

.ui-button-round--disabled .ui-icon {
    opacity: .4
}

.ui-button-round--small-icon .ui-icon.ui-icon,
.ui-button-round--small-icon .ui-icon.ui-icon svg {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

@media(min-width: 960px) {

    .ui-button-round--small-icon .ui-icon.ui-icon,
    .ui-button-round--small-icon .ui-icon.ui-icon svg {
        height: var(--icon-size);
        width: var(--icon-size)
    }
}

.ui-button-round--extra-small {
    height: var(--button-round-height-extra-small);
    width: var(--button-round-height-extra-small)
}

.ui-button-round--extra-small .ui-typography {
    font-size: 24px
}

html[data-theme=skov] .ui-button-round,
html[data-theme=skov] .ui-button-round--disabled,
html[data-theme=skov] .ui-button-round--extra-large,
html[data-theme=skov] .ui-button-round--extra-small,
html[data-theme=skov] .ui-button-round--large,
html[data-theme=skov] .ui-button-round--small,
html[data-theme=skov] .ui-button-round--small-icon,
html[data-theme=skov] .ui-button-round--theme-confirm,
html[data-theme=skov] .ui-button-round--theme-primary,
html[data-theme=skov] .ui-button-round--theme-primary-light {
    background-color: var(--color-white);
    -webkit-box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08)
}

html[data-theme=skov] .ui-button-round--theme-confirm,
html[data-theme=skov] .ui-button-round--theme-primary,
html[data-theme=skov] .ui-button-round--theme-primary-light {
    background-color: transparent
}

html[data-theme=skov] .ui-button-round--theme-confirm:before,
html[data-theme=skov] .ui-button-round--theme-primary-light:before,
html[data-theme=skov] .ui-button-round--theme-primary:before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

html[data-theme=skov] .ui-button-round--theme-primary {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200)
}

html[data-theme=skov] .ui-button-round--theme-primary-light {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200);
}

html[data-theme=skov] .ui-button-round--theme-confirm {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

html[data-theme=skov] .ui-button-round--theme-confirm .ui-icon svg,
html[data-theme=skov] .ui-button-round--theme-primary .ui-icon svg,
html[data-theme=skov] .ui-button-round--theme-primary-light .ui-icon svg {
    fill: #fff
}

html[data-theme=skov] .ui-button-round--theme-confirm .ui-typography,
html[data-theme=skov] .ui-button-round--theme-primary .ui-typography,
html[data-theme=skov] .ui-button-round--theme-primary-light .ui-typography {
    color: #fff;
    z-index: 1
}

html[data-theme=big-dutchman] .ui-button-round,
html[data-theme=big-dutchman] .ui-button-round--disabled,
html[data-theme=big-dutchman] .ui-button-round--extra-large,
html[data-theme=big-dutchman] .ui-button-round--extra-small,
html[data-theme=big-dutchman] .ui-button-round--large,
html[data-theme=big-dutchman] .ui-button-round--small,
html[data-theme=big-dutchman] .ui-button-round--small-icon,
html[data-theme=big-dutchman] .ui-button-round--theme-confirm,
html[data-theme=big-dutchman] .ui-button-round--theme-primary,
html[data-theme=big-dutchman] .ui-button-round--theme-primary-light {
    background-color: var(--color-white);
    -webkit-box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13);
    box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13)
}

html[data-theme=big-dutchman] .ui-button-round--theme-confirm .ui-icon svg,
html[data-theme=big-dutchman] .ui-button-round--theme-primary .ui-icon svg,
html[data-theme=big-dutchman] .ui-button-round--theme-primary-light .ui-icon svg {
    fill: #fff
}

html[data-theme=big-dutchman] .ui-button-round--theme-confirm .ui-typography,
html[data-theme=big-dutchman] .ui-button-round--theme-primary .ui-typography,
html[data-theme=big-dutchman] .ui-button-round--theme-primary-light .ui-typography {
    color: #fff
}

html[data-theme=big-dutchman] .ui-button-round--theme-primary {
    background-color: #787878
}

html[data-theme=big-dutchman] .ui-button-round--theme-primary-light {
    background-color: var(--color-primary-light)
}

html[data-theme=big-dutchman] .ui-button-round--theme-confirm {
    background-color: var(--color-success)
}

.ui-adjustment {
    width: 100%
}

.ui-adjustment,
.ui-adjustment__button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-adjustment__button {
    height: 100%
}

.ui-adjustment__button:first-of-type {
    margin-right: 4px
}

.ui-adjustment__button:first-of-type .ui-button-round,
.ui-adjustment__button:first-of-type .ui-button-round:after {
    border-radius: 100% 4px 4px 100%
}

.ui-adjustment__button:last-of-type {
    margin-left: 4px
}

.ui-adjustment__button:last-of-type .ui-button-round,
.ui-adjustment__button:last-of-type .ui-button-round:after {
    border-radius: 4px 100% 100% 4px
}

.ui-adjustment__stepper {
    border-radius: 1.5px;
    position: relative;
    width: 100%
}

.ui-adjustment__current-step {
    border-radius: 2px;
    bottom: -2px;
    position: absolute;
    top: -2px;
    -webkit-transition: .1s linear;
    transition: .1s linear;
    width: 2px
}

.ui-adjustment__current-step .ui-icon {
    height: 6px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 6px
}

.ui-adjustment__current-step .ui-icon:first-of-type {
    top: -8px
}

.ui-adjustment__current-step .ui-icon:last-of-type {
    bottom: -8px
}

html[data-theme=skov] .ui-adjustment__stepper {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b);
    -webkit-box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08)
}

html[data-theme=skov] .ui-adjustment__current-step {
    background-color: #fff
}

html[data-theme=skov] .ui-adjustment__current-step .ui-icon svg {
    fill: #fff
}

html[data-theme=big-dutchman] .ui-adjustment__stepper {
    background-color: #ea6f18;
    background-image: none;
    -webkit-box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13);
    box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13)
}

html[data-theme=big-dutchman] .ui-adjustment__current-step {
    background-color: #fff
}

html[data-theme=big-dutchman] .ui-adjustment__current-step .ui-icon svg {
    fill: #fff
}

.ui-simple-list {
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-simple-list__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 4px
}

.ui-simple-list__item:last-child {
    margin-bottom: 0
}

.ui-simple-list__label {
    -ms-flex-preferred-size: 150px;
    color: var(--color-font-subtitle1);
    flex-basis: 150px;
    min-width: 150px;
    padding-right: var(--main-spacing)
}

.ui-simple-list__label,
.ui-simple-list__text {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    word-break: break-word
}

.ui-loader,
.ui-loader--center,
.ui-loader--light {
    height: var(--icon-size);
    width: var(--icon-size)
}

.ui-loader div,
.ui-loader--center div,
.ui-loader--light div {
    -webkit-animation: loader .8s ease-out infinite;
    animation: loader .8s ease-out infinite;
    border: 4px solid var(--color-primary);
    border-radius: 100%;
    height: var(--icon-size);
    width: var(--icon-size);
    will-change: opacity
}

@-webkit-keyframes loader {
    0% {
        opacity: .5;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    50% {
        opacity: 1
    }

    70% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes loader {
    0% {
        opacity: .5;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    50% {
        opacity: 1
    }

    70% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.ui-loader--center {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-loader--light>div {
    border-color: var(--color-white) !important
}

.ui-loader--size-small,
.ui-loader--size-small div {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

.ui-loader--size-extra-small,
.ui-loader--size-extra-small div {
    height: var(--icon-size-extra-small);
    width: var(--icon-size-extra-small)
}

.ui-loader--theme-primary-light>div {
    border-color: var(--color-primary-light)
}

.ui-page-loader {
    background-color: var(--default-background-color);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0
}

.ui-navigation-bar {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--navigation-bar-height);
    justify-content: center;
    padding: 0 var(--main-spacing);
    position: fixed;
    right: 0;
    z-index: var(--z-index-navigation-bar)
}

.ui-navigation-bar__title {
    display: inline-block;
    line-height: 1.5;
    margin: 0 auto;
    min-width: 0;
    overflow: hidden;
    padding: 0 var(--main-spacing);
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-navigation-bar__back-button.ui-navigation-bar__back-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: calc(var(--main-spacing) + var(--side-menu-toggle-width)/2);
    position: absolute
}

.ui-navigation-bar__back-button.ui-navigation-bar__back-button .ui-button {
    min-width: 0;
    padding: 0
}

.ui-navigation-bar__back-button.ui-navigation-bar__back-button .ui-button .ui-typography {
    line-height: 1.5;
    overflow: hidden;
    padding-right: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-navigation-bar__clear {
    height: var(--navigation-bar-height);
    margin: calc(var(--main-spacing)*-1) calc(var(--main-spacing)*-1) var(--main-spacing)
}

html[data-theme=skov] .ui-navigation-bar {
    left: 0
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-navigation-bar {
        left: var(--side-menu-width)
    }
}

html[data-theme=big-dutchman] .ui-navigation-bar {
    left: var(--main-nav-height)
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-navigation-bar {
        left: calc(var(--side-menu-width) + var(--main-nav-height))
    }
}

.ui-filter-tabs,
.ui-filter-tabs--small,
.ui-filter-tabs--theme-primary,
.ui-filter-tabs--theme-primary-light {
    -ms-flex-negative: 0 !important;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    flex-shrink: 0 !important;
    height: var(--filter-tabs-height);
    overflow: hidden
}

.ui-filter-tabs--theme-primary {
    background-color: transparent !important;
    border-color: var(--color-border-primary)
}

.ui-filter-tabs--theme-primary-light {
    border-color: var(--color-primary-light)
}

.ui-filter-tabs--small {
    height: var(--filter-tabs-height-small)
}

.ui-filter-tab,
.ui-filter-tab--disabled,
.ui-filter-tab--with-border,
.ui-filter-tabs--small .ui-filter-tab,
.ui-filter-tabs--small .ui-filter-tab--disabled,
.ui-filter-tabs--small .ui-filter-tab--with-border {
    cursor: pointer;
    position: relative
}

.ui-filter-tab input,
.ui-filter-tab--disabled input,
.ui-filter-tab--with-border input,
.ui-filter-tabs--small .ui-filter-tab input,
.ui-filter-tabs--small .ui-filter-tab--disabled input,
.ui-filter-tabs--small .ui-filter-tab--with-border input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    bottom: 0;
    cursor: pointer;
    height: 100%;
    left: 0;
    outline: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.ui-filter-tab input:checked+.ui-filter-tab__container,
.ui-filter-tab--disabled input:checked+.ui-filter-tab__container,
.ui-filter-tab--with-border input:checked+.ui-filter-tab__container {
    background-color: var(--color-selected-bounding-box-background)
}

.ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography {
    color: var(--color-black)
}

.ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography svg {
    fill: var(--color-black)
}

@media(hover: hover) {

    .ui-filter-tab,
    .ui-filter-tab--disabled,
    .ui-filter-tab--with-border,
    .ui-filter-tabs--small .ui-filter-tab,
    .ui-filter-tabs--small .ui-filter-tab--disabled,
    .ui-filter-tabs--small .ui-filter-tab--with-border {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-filter-tab--disabled:hover,
    .ui-filter-tab--with-border:hover,
    .ui-filter-tab:hover {
        background-color: var(--color-hover-background)
    }

    .ui-filter-tab--disabled:hover .ui-typography,
    .ui-filter-tab--with-border:hover .ui-typography,
    .ui-filter-tab:hover .ui-typography {
        color: var(--color-font-label)
    }

    .ui-filter-tab--disabled:hover .ui-icon svg,
    .ui-filter-tab--with-border:hover .ui-icon svg,
    .ui-filter-tab:hover .ui-icon svg {
        fill: var(--color-font-label)
    }
}

.ui-filter-tab--disabled:active,
.ui-filter-tab--with-border:active,
.ui-filter-tab:active {
    background-color: var(--color-active-background)
}

.ui-filter-tab__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    justify-content: center;
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing);
    pointer-events: none;
    position: relative;
    z-index: 1
}

.ui-filter-tab__container .ui-typography {
    color: var(--color-font-label-grey)
}

.ui-filter-tab__container .ui-icon svg {
    fill: var(--color-font-label-grey)
}

.ui-filter-tabs--theme-primary .ui-filter-tab .ui-typography,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled .ui-typography,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border .ui-typography {
    color: var(--color-font-primary)
}

.ui-filter-tabs--theme-primary .ui-filter-tab .ui-icon svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled .ui-icon svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border .ui-icon svg {
    fill: var(--color-font-primary)
}

.ui-filter-tabs--theme-primary .ui-filter-tab input:checked+.ui-filter-tab__container,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled input:checked+.ui-filter-tab__container,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border input:checked+.ui-filter-tab__container {
    background-color: var(--color-primary-selected-bounding-box-background)
}

.ui-filter-tabs--theme-primary .ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary .ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography {
    color: var(--color-white)
}

.ui-filter-tabs--theme-primary .ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary .ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography svg {
    fill: var(--color-white)
}

.ui-filter-tabs--theme-primary .ui-filter-tab--with-border .ui-filter-tab__container:after {
    background-color: var(--color-border-primary)
}

@media(hover: hover) {

    .ui-filter-tabs--theme-primary .ui-filter-tab--disabled:hover,
    .ui-filter-tabs--theme-primary .ui-filter-tab--with-border:hover,
    .ui-filter-tabs--theme-primary .ui-filter-tab:hover {
        background-color: var(--color-primary-hover-background)
    }
}

.ui-filter-tabs--theme-primary .ui-filter-tab--disabled:active,
.ui-filter-tabs--theme-primary .ui-filter-tab--with-border:active,
.ui-filter-tabs--theme-primary .ui-filter-tab:active {
    background-color: var(--color-primary-active-background)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab .ui-typography,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled .ui-typography,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border .ui-typography {
    color: var(--color-primary-light)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab .ui-icon svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled .ui-icon svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border .ui-icon svg {
    fill: var(--color-primary-light)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border .ui-filter-tab__container:after {
    background-color: var(--color-primary-light)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab input:checked+.ui-filter-tab__container,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled input:checked+.ui-filter-tab__container,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border input:checked+.ui-filter-tab__container {
    background-color: var(--color-active)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary-light .ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography {
    color: var(--color-white)
}

.ui-filter-tabs--theme-primary-light .ui-filter-tab input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--disabled input:checked+.ui-filter-tab__container .ui-typography svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-icon svg,
.ui-filter-tabs--theme-primary-light .ui-filter-tab--with-border input:checked+.ui-filter-tab__container .ui-typography svg {
    fill: var(--color-white)
}

.ui-filter-tab--with-border .ui-filter-tab__container:after {
    background-color: var(--color-border);
    content: "";
    display: block;
    height: 50%;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px
}

.ui-filter-tab--disabled {
    cursor: not-allowed;
    opacity: .6;
    pointer-events: none
}

.ui-filter-tabs--small .ui-filter-tab .ui-filter-tab__container,
.ui-filter-tabs--small .ui-filter-tab--disabled .ui-filter-tab__container,
.ui-filter-tabs--small .ui-filter-tab--with-border .ui-filter-tab__container {
    padding-left: 16px;
    padding-right: 16px
}

.ui-filter-tabs--small .ui-filter-tab .ui-filter-tab__container:after,
.ui-filter-tabs--small .ui-filter-tab--disabled .ui-filter-tab__container:after,
.ui-filter-tabs--small .ui-filter-tab--with-border .ui-filter-tab__container:after {
    height: 100%;
    top: 0;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.ui-filter-tabs--small .ui-filter-tab .ui-icon,
.ui-filter-tabs--small .ui-filter-tab--disabled .ui-icon,
.ui-filter-tabs--small .ui-filter-tab--with-border .ui-icon {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

.ui-divider,
.ui-divider--border,
.ui-divider--extra-large,
.ui-divider--extra-small,
.ui-divider--large,
.ui-divider--medium,
.ui-divider--small,
.ui-divider--theme-primary,
.ui-divider--vertical {
    margin: calc(var(--main-spacing)/2) 0;
    max-height: 1px;
    position: relative
}

.ui-divider--border:after,
.ui-divider--border:before,
.ui-divider--extra-large:after,
.ui-divider--extra-large:before,
.ui-divider--extra-small:after,
.ui-divider--extra-small:before,
.ui-divider--large:after,
.ui-divider--large:before,
.ui-divider--medium:after,
.ui-divider--medium:before,
.ui-divider--small:after,
.ui-divider--small:before,
.ui-divider--theme-primary:after,
.ui-divider--theme-primary:before,
.ui-divider--vertical:after,
.ui-divider--vertical:before,
.ui-divider:after,
.ui-divider:before {
    content: "";
    display: table
}

.ui-divider--border:after,
.ui-divider--extra-large:after,
.ui-divider--extra-small:after,
.ui-divider--large:after,
.ui-divider--medium:after,
.ui-divider--small:after,
.ui-divider--theme-primary:after,
.ui-divider--vertical:after,
.ui-divider:after {
    clear: both
}

.ui-divider--border {
    min-height: 1px
}

.ui-divider--vertical {
    height: auto;
    margin: 0 calc(var(--main-spacing)/2);
    max-height: 100%;
    max-width: 1px;
    min-height: 100%
}

.ui-divider--vertical.ui-divider--extra-small {
    margin: 0 4px
}

.ui-divider--vertical.ui-divider--small {
    margin: 0 8px
}

.ui-divider--vertical.ui-divider--medium {
    margin: 0 12px
}

.ui-divider--vertical.ui-divider--large {
    margin: 0 24px
}

.ui-divider--vertical.ui-divider--extra-large {
    margin: 0 48px
}

.ui-divider--vertical.ui-divider--border {
    width: 1px
}

.ui-divider--extra-small {
    margin: 4px 0
}

.ui-divider--small {
    margin: 8px 0
}

.ui-divider--medium {
    margin: 12px 0
}

.ui-divider--large {
    margin: 24px 0
}

.ui-divider--extra-large {
    margin: 48px 0
}

.ui-divider--align-to-edge {
    width: calc(100% + var(--main-spacing))
}

html[data-theme=skov] .ui-divider--border {
    background-color: #dcdcdc
}

html[data-theme=skov] .ui-divider--border.ui-divider--theme-primary {
    background-color: #406E00
}

html[data-theme=big-dutchman] .ui-divider--border {
    background-color: #dcdcdc
}

html[data-theme=big-dutchman] .ui-divider--border.ui-divider--theme-primary {
    background-color: #686868
}

.ui-notification,
.ui-notification--alarm,
.ui-notification--operation,
.ui-notification--warning {
    -ms-flex-item-align: start;
    align-self: flex-start;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    overflow: hidden;
    width: 100%
}

@media(min-width: 640px) {

    .ui-notification,
    .ui-notification--alarm,
    .ui-notification--operation,
    .ui-notification--warning {
        width: var(--notification-width)
    }
}

@media(min-width: 960px) {

    .ui-notification,
    .ui-notification--alarm,
    .ui-notification--operation,
    .ui-notification--warning {
        width: var(--notification-width)
    }
}

.ui-notification__sidebar {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    margin: calc(var(--main-spacing)*-1);
    margin-right: var(--main-spacing);
    padding: var(--main-spacing) 8px;
    position: relative;
    width: 88px
}

.ui-notification__sidebar:before {
    background-color: var(--color-white);
    border-radius: 2px;
    bottom: calc(var(--icon-size-large) + var(--main-spacing)*2);
    content: "";
    left: 50%;
    opacity: .5;
    position: absolute;
    top: calc(var(--icon-size-large) + var(--main-spacing)*2);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 2px
}

.ui-notification__icon svg {
    fill: var(--color-white)
}

.ui-notification__date {
    color: var(--color-white);
    text-align: center
}

.ui-notification__content {
    width: 100%
}

.ui-notification--alarm .ui-notification__sidebar {
    background-color: var(--color-alarm)
}

.ui-notification--warning .ui-notification__sidebar {
    background-color: var(--color-warning)
}

.ui-notification--information .ui-notification__sidebar {
    background-color: var(--color-information)
}

.ui-notification-header {
    border-bottom: 1px solid var(--color-border);
    margin-bottom: var(--main-spacing);
    margin-right: calc(var(--main-spacing)*-1);
    padding-bottom: var(--main-spacing);
    padding-right: var(--main-spacing)
}

.ui-notification-header__sub-title {
    margin-top: 8px
}

.ui-notification-portal {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--color-backdrop-background);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    will-change: opacity;
    z-index: var(--z-index-notification-portal)
}

.ui-notification-portal__slider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: calc(var(--main-spacing)*-1);
    margin-right: calc(var(--main-spacing)*-1);
    overflow-x: scroll;
    overflow-y: visible;
    padding: 4px 4px 4px calc(50vw - var(--notification-width)/2 + var(--main-spacing));
    position: relative
}

.ui-notification-portal__slider>* {
    margin-right: var(--main-spacing)
}

.ui-notification-portal__slider .ui-notification:last-child {
    margin-right: calc(var(--main-spacing)*2)
}

.ui-notification-portal__slider:after {
    content: "";
    display: block;
    height: auto;
    min-width: 1px
}

.ui-notification-portal__slider>* {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.ui-notification-portal__slider::-webkit-scrollbar,
.ui-notification-portal__slider::-webkit-scrollbar-thumb {
    display: none
}

.ui-top-card,
.ui-top-card--full-screen {
    position: relative
}

.ui-top-card__title-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px
}

@media(min-width: 960px) {
    .ui-top-card__title-container {
        margin-bottom: var(--main-spacing)
    }
}

.ui-top-card--full-screen {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column;
    flex-flow: column;
    height: calc(100vh - var(--main-nav-height) - var(--main-spacing)*2)
}

.ui-top-card--full-screen>* {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1
}

.ui-top-card--full-screen>:last-child {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    -ms-flex-preferred-size: auto;
    -ms-flex-negative: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1
}

.ui-house-overview {
    height: 100%;
    position: relative;
    text-align: center;
    width: 100%
}

.ui-house-overview__image {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: auto;
    max-height: 100%;
    max-width: 100%;
    position: relative;
    text-align: center
}

.ui-house-overview__image img,
.ui-house-overview__image picture {
    height: auto;
    margin: 0 auto;
    max-height: 100%;
    max-width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.ui-progress {
    bottom: 0;
    left: 0;
    pointer-events: none;
    right: 0;
    top: 0;
    z-index: 3
}

.ui-progress,
.ui-progress__label {
    position: absolute
}

.ui-progress__label .ui-typography {
    line-height: 1;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 4px
}

.ui-progress__line {
    border-radius: 2px;
    height: 100%;
    margin-left: -1px;
    position: relative;
    width: 2px
}

.ui-progress__bottom-icon.ui-progress__bottom-icon,
.ui-progress__top-icon.ui-progress__top-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 6px;
    justify-content: center;
    left: -2px;
    position: absolute;
    right: 0;
    width: 6px
}

.ui-progress__bottom-icon.ui-progress__bottom-icon svg,
.ui-progress__top-icon.ui-progress__top-icon svg {
    height: 6px;
    width: 6px
}

.ui-progress__top-icon {
    top: -9px
}

.ui-progress__bottom-icon {
    bottom: -9px
}

html[data-theme=skov] .ui-progress__label .ui-typography {
    color: #383838
}

html[data-theme=skov] .ui-progress__line {
    background-color: #383838
}

html[data-theme=skov] .ui-progress__bottom-icon svg,
html[data-theme=skov] .ui-progress__top-icon svg {
    fill: #383838
}

html[data-theme=big-dutchman] .ui-progress__label .ui-typography {
    color: #3a3d3d
}

html[data-theme=big-dutchman] .ui-progress__line {
    background-color: #3a3d3d
}

html[data-theme=big-dutchman] .ui-progress__bottom-icon svg,
html[data-theme=big-dutchman] .ui-progress__top-icon svg {
    fill: #3a3d3d
}

.ui-multistep {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.ui-multistep__steps,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps,
.ui-multistep__steps--steps {
    -webkit-box-flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.ui-multistep__step,
.ui-multistep__step--current,
.ui-multistep__step--disabled,
.ui-multistep__step--dynamic,
.ui-multistep__step--no-rectangle,
.ui-multistep__step--no-triangle {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-flex: 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    justify-content: flex-end;
    margin-right: 2px;
    max-height: 100%
}

.ui-multistep__step svg.border-radius-bottom-left,
.ui-multistep__step svg.border-radius-top-right,
.ui-multistep__step--current svg.border-radius-bottom-left,
.ui-multistep__step--current svg.border-radius-top-right,
.ui-multistep__step--disabled svg.border-radius-bottom-left,
.ui-multistep__step--disabled svg.border-radius-top-right,
.ui-multistep__step--dynamic svg.border-radius-bottom-left,
.ui-multistep__step--dynamic svg.border-radius-top-right,
.ui-multistep__step--no-rectangle svg.border-radius-bottom-left,
.ui-multistep__step--no-rectangle svg.border-radius-top-right,
.ui-multistep__step--no-triangle svg.border-radius-bottom-left,
.ui-multistep__step--no-triangle svg.border-radius-top-right {
    display: none
}

.ui-multistep__step--current:last-child,
.ui-multistep__step--disabled:last-child,
.ui-multistep__step--dynamic:last-child,
.ui-multistep__step--no-rectangle:last-child,
.ui-multistep__step--no-triangle:last-child,
.ui-multistep__step:last-child {
    margin-right: 0
}

.ui-multistep__step:last-child.ui-multistep__step--no-triangle .ui-multistep__rectangle,
:last-child.ui-multistep__step--no-triangle .ui-multistep__rectangle {
    border-top-right-radius: 4px
}

.ui-multistep__step--current:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step--current:last-child .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step--disabled:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step--disabled:last-child .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step--dynamic:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step--dynamic:last-child .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step--no-rectangle:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step--no-rectangle:last-child .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step--no-triangle:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step--no-triangle:last-child .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step:last-child .ui-multistep__triangle svg.border-radius-bottom-left,
.ui-multistep__step:last-child .ui-multistep__triangle svg.border-radius-none {
    display: none
}

.ui-multistep__step--current:last-child .ui-multistep__triangle svg.border-radius-top-right,
.ui-multistep__step--disabled:last-child .ui-multistep__triangle svg.border-radius-top-right,
.ui-multistep__step--dynamic:last-child .ui-multistep__triangle svg.border-radius-top-right,
.ui-multistep__step--no-rectangle:last-child .ui-multistep__triangle svg.border-radius-top-right,
.ui-multistep__step--no-triangle:last-child .ui-multistep__triangle svg.border-radius-top-right,
.ui-multistep__step:last-child .ui-multistep__triangle svg.border-radius-top-right {
    display: block
}

.ui-multistep__step:first-child.ui-multistep__step--no-triangle .ui-multistep__rectangle,
:first-child.ui-multistep__step--no-triangle .ui-multistep__rectangle {
    border-bottom-left-radius: 4px
}

.ui-multistep__step:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-none,
.ui-multistep__step:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-top-right,
:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-none,
:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-top-right {
    display: none
}

.ui-multistep__step:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-bottom-left,
:first-child.ui-multistep__step--no-rectangle .ui-multistep__triangle svg.border-radius-bottom-left {
    display: block
}

.ui-multistep__triangle {
    -webkit-box-flex: 1;
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    justify-content: flex-end;
    margin-top: auto;
    position: relative
}

.ui-multistep__triangle svg {
    fill: var(--color-primary-light);
    height: 100%;
    width: 100%
}

.ui-multistep__triangle .ui-typography {
    bottom: 4px;
    position: absolute;
    right: 4px
}

@media(min-width: 960px) {
    .ui-multistep__triangle .ui-typography {
        bottom: 8px;
        right: 8px
    }
}

.ui-multistep__rectangle {
    -webkit-box-flex: 1;
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    align-items: flex-end;
    background-color: var(--color-primary-light);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    justify-content: flex-end;
    margin-top: 2px;
    padding-right: 4px
}

@media(min-width: 960px) {
    .ui-multistep__rectangle {
        padding-bottom: 8px;
        padding-right: 8px
    }
}

.ui-multistep__divider {
    bottom: 0;
    left: 0;
    max-height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.ui-multistep__divider .ui-progress {
    left: -1px
}

.ui-multistep__divider .labels .ui-typography {
    position: absolute;
    top: 8px
}

.ui-multistep__divider .labels .ui-typography:first-of-type {
    margin-right: 8px;
    right: 100%;
    text-align: right;
    width: 100%
}

.ui-multistep__divider .labels .ui-typography:last-child {
    left: 0;
    margin-left: 8px
}

.ui-multistep__steps--steps-1 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-1 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(100% - 2px)
}

.ui-multistep__steps--steps-1 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-1 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-1 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(100% + 1px)
}

.ui-multistep__steps--steps-2 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--steps-2 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--steps-2 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-2 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-2 .ui-multistep__step:nth-child(2) .ui-multistep__triangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(50% + 1px)
}

.ui-multistep__steps--steps-3 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--steps-3 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(66.66667% - 2px)
}

.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(33.33333% + 1px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(75% - 2px)
}

.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(25% + 1px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(40% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(60% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(80% - 2px)
}

.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(20% + 1px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(66.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(6) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(6) .ui-multistep__rectangle {
    max-height: calc(83.33333% - 2px)
}

.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(16.66667% + 1px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(28.57143% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(42.85714% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(57.14286% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(6) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(6) .ui-multistep__rectangle {
    max-height: calc(71.42857% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(7) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(7) .ui-multistep__rectangle {
    max-height: calc(85.71429% - 2px)
}

.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(14.28571% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-1 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(50% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step:nth-child(2) .ui-multistep__triangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(33.33333% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-2 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 100% !important
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(25% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-3 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 100% !important
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(40% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(20% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(60% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(20% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-4 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 40% !important
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(33.33333% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(16.66667% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(66.66667% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(16.66667% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-5 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 33.3333333333% !important
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: calc(0% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(28.57143% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(42.85714% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(57.14286% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(6) .ui-multistep__triangle {
    max-height: calc(14.28571% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--current:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step:nth-child(6) .ui-multistep__rectangle {
    max-height: calc(71.42857% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(14.28571% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-6 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 28.5714285714% !important
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:first-child .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:first-child .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:first-child .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:first-child .ui-multistep__rectangle {
    max-height: -2px
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(2) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(2) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(3) .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(3) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(3) .ui-multistep__rectangle {
    max-height: calc(25% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(4) .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(4) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(4) .ui-multistep__rectangle {
    max-height: calc(37.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(5) .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(5) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(5) .ui-multistep__rectangle {
    max-height: calc(50% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(6) .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(6) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(6) .ui-multistep__rectangle {
    max-height: calc(62.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(7) .ui-multistep__triangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(7) .ui-multistep__triangle {
    max-height: calc(12.5% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--current:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--disabled:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-triangle:nth-child(7) .ui-multistep__rectangle,
.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step:nth-child(7) .ui-multistep__rectangle {
    max-height: calc(75% - 2px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--no-rectangle .ui-multistep__triangle.multistep__triangle {
    max-height: calc(12.5% + 1px)
}

.ui-multistep__steps--dynamic.ui-multistep__steps--steps-7 .ui-multistep__step--dynamic .ui-multistep__triangle {
    max-height: 25% !important
}

.ui-multistep__step--current .ui-multistep__triangle svg {
    fill: var(--color-primary)
}

.ui-multistep__step--current .ui-multistep__rectangle {
    background-color: var(--color-primary)
}

.ui-multistep__step--no-triangle .ui-multistep__rectangle {
    margin-top: auto
}

.ui-multistep__step--disabled .ui-multistep__rectangle .ui-typography,
.ui-multistep__step--disabled .ui-multistep__triangle .ui-typography {
    display: none
}

.ui-multistep__step--dynamic {
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
    position: relative
}

.ui-multistep__step--dynamic .ui-multistep__triangle .ui-typography {
    display: none
}

.ui-multistep__step--dynamic .ui-multistep__rectangle {
    margin-top: 0
}

.ui-multistep__step--dynamic .ui-multistep__rectangle .ui-typography {
    display: none
}

html[data-theme=skov] .ui-multistep__rectangle .ui-typography,
html[data-theme=skov] .ui-multistep__triangle .ui-typography {
    color: #fff
}

html[data-theme=skov] .ui-multistep__step--disabled .ui-multistep__triangle svg {
    fill: #dcdcdc
}

html[data-theme=skov] .ui-multistep__step--disabled .ui-multistep__rectangle {
    background-color: #dcdcdc
}

html[data-theme=skov] .ui-multistep__step--dynamic .ui-multistep__triangle svg {
    fill: #787878
}

html[data-theme=skov] .ui-multistep__step--dynamic .ui-multistep__rectangle {
    background-color: #787878
}

html[data-theme=big-dutchman] .ui-multistep__rectangle .ui-typography,
html[data-theme=big-dutchman] .ui-multistep__triangle .ui-typography {
    color: #fff
}

html[data-theme=big-dutchman] .ui-multistep__step--disabled .ui-multistep__triangle svg {
    fill: #f1f2f2
}

html[data-theme=big-dutchman] .ui-multistep__step--disabled .ui-multistep__rectangle {
    background-color: #f1f2f2
}

html[data-theme=big-dutchman] .ui-multistep__step--dynamic .ui-multistep__triangle svg {
    fill: #b4b4b4
}

html[data-theme=big-dutchman] .ui-multistep__step--dynamic .ui-multistep__rectangle {
    background-color: #b4b4b4
}

.ui-multistep-progress-bar {
    height: 16px;
    margin-bottom: 40px;
    position: relative
}

.ui-multistep-progress-bar .ui-progress {
    bottom: -2px;
    top: -2px
}

@media(min-width: 960px) {
    .ui-multistep-progress-bar {
        margin-bottom: 64px
    }
}

.ui-multistep-progress-bar__container {
    background-color: var(--color-primary);
    border-radius: 8px;
    height: 100%;
    overflow: hidden;
    position: relative
}

.ui-multistep-progress-bar__bar {
    background-color: var(--color-primary-light);
    bottom: 0;
    left: 0;
    position: absolute;
    top: 0
}

.ui-multistep-progress-bar__indicator {
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
}

.ui-multistep-progress-bar__indicator-line {
    height: 100%;
    position: absolute;
    width: 100%
}

.ui-multistep-progress-bar__indicator-line line {
    stroke: var(--color-chart-reference-line)
}

.ui-multistep-progress-bar__indicator-arrow {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background: var(--color-chart-reference-line);
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--icon-size);
    justify-content: center;
    position: absolute;
    width: var(--icon-size)
}

html[data-theme=big-dutchman] .ui-multistep-progress-bar__indicator-arrow .ui-icon svg,
html[data-theme=skov] .ui-multistep-progress-bar__indicator-arrow .ui-icon svg {
    fill: #fff
}

.ui-data-table,
.ui-data-table--with-pagination,
.ui-data-table--with-scroll {
    border-radius: var(--border-radius)
}

.ui-data-table__title {
    margin-bottom: 4px
}

@media(min-width: 960px) {
    .ui-data-table__title {
        margin-bottom: 8px
    }
}

.ui-data-table__scroll-wrapper {
    border-bottom: 1px solid var(--color-border);
    border-left: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    border-right: 1px solid var(--color-border);
    position: relative;
    width: 100%
}

.ui-data-table__container {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: auto;
    width: 100%
}

.ui-data-table__container td:last-child {
    width: 100%
}

.ui-data-table--with-scroll {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    width: calc(100% + var(--main-spacing))
}

.ui-data-table--with-scroll .ui-data-table__scroll-wrapper {
    display: block;
    overflow-x: auto;
    -ms-touch-action: pan-right pan-left;
    touch-action: pan-right pan-left;
    white-space: nowrap
}

.ui-data-table--with-scroll .ui-data-table-row .ui-data-table-cell:last-child {
    border-right: 0
}

.ui-data-table--with-scroll .ui-data-table-cell--sticky {
    position: sticky
}

.ui-data-table--with-scroll td.ui-data-table-cell--sticky,
.ui-data-table--with-scroll td.ui-data-table-cell-lite-cell--sticky {
    background: var(--color-white);
    z-index: var(--data-table-head-z-index)
}

.ui-data-table--with-scroll th.ui-data-table-cell--sticky.ui-data-table-cell--sticky.ui-data-table-cell--sticky {
    z-index: calc(var(--data-table-head-z-index) + 1)
}

.ui-data-table--with-scroll .ui-data-table-cell--with-shadow:after,
.ui-data-table--with-scroll .ui-data-table-cell-lite-cell--with-shadow:after {
    background-image: -webkit-gradient(linear, right top, left top, from(transparent), to(rgba(0, 0, 0, .21)));
    background-image: linear-gradient(270deg, transparent, rgba(0, 0, 0, .21));
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    right: -30px;
    top: 0;
    width: 30px;
    z-index: 1
}

.ui-data-table--with-scroll .ui-data-table-head tr:first-child th:last-child {
    border-top-right-radius: 0
}

.ui-data-table--with-scroll .ui-data-table-row:last-of-type,
.ui-data-table--with-scroll .ui-data-table-row:last-of-type .ui-data-table-cell:last-child {
    border-bottom-right-radius: 0
}

.ui-data-table--with-scroll .ui-data-table-row--selected .ui-data-table-cell:first-child:before {
    opacity: 1;
    visibility: visible
}

.ui-data-table--with-scroll .ui-data-table-row .ui-data-table-cell:not(.ui-data-table-cell--disabled):not(.ui-data-table-cell--clickable):first-child {
    background-color: var(--color-white)
}

.ui-data-table--with-scroll .ui-data-table__scroll-wrapper {
    border-bottom-right-radius: 0;
    border-right: none;
    border-top-right-radius: 0
}

.ui-data-table--with-scroll+.ui-data-table-pagination {
    border-bottom-right-radius: 0;
    border-right: none;
    margin-right: calc(var(--main-spacing)*-1)
}

.ui-data-table--with-pagination {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-data-table--with-pagination .ui-data-table__scroll-wrapper {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-data-table--with-pagination .ui-data-table-row:last-of-type:after {
    border-radius: 0
}

.ui-data-table--with-pagination .ui-data-table-row:last-of-type .ui-data-table-cell {
    border-bottom: none
}

.ui-data-table--with-pagination .ui-data-table-row:last-of-type .ui-data-table-cell:first-child,
.ui-data-table--with-pagination .ui-data-table-row:last-of-type .ui-data-table-cell:last-child {
    border-radius: 0
}

.ui-data-table--wrap-text .ui-data-table-cell {
    word-break: break-word
}

.ui-data-table--wrap-text .ui-data-table-cell .ui-data-table-cell__value {
    display: block;
    white-space: normal
}

.ui-data-table-pagination {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    border: 1px solid var(--color-border);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0 var(--main-spacing)
}

.ui-data-table-pagination .ui-data-table-pagination-button[disabled] {
    opacity: .5;
    pointer-events: none
}

@media(min-width: 640px) {
    .ui-data-table-pagination {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: row;
        flex-direction: row;
        height: var(--data-table-pagination-height)
    }
}

.ui-data-table-pagination__change-page {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 8px
}

.ui-data-table-pagination__change-page .ui-typography {
    margin-right: var(--main-spacing)
}

.ui-data-table-pagination__change-page button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(var(--data-table-pagination-height)/2);
    justify-content: center;
    outline: none;
    position: relative;
    width: calc(var(--data-table-pagination-height)/2)
}

.ui-data-table-pagination__change-page button:after {
    background-color: var(--color-active-background);
    border-radius: 100%;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden
}

.ui-data-table-pagination__change-page button:active:after {
    opacity: 1;
    visibility: visible
}

@media(hover: hover) {
    .ui-data-table-pagination__change-page button {
        border-radius: 100%;
        cursor: pointer;
        -webkit-transition: background-color .2s;
        transition: background-color .2s;
        will-change: background-color
    }

    .ui-data-table-pagination__change-page button:hover {
        background-color: var(--color-hover-background)
    }
}

@media(min-width: 640px) {
    .ui-data-table-pagination__change-page {
        margin-left: auto;
        padding: 0
    }
}

.ui-data-table-pagination__rows-per-page {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    padding: 8px 0
}

.ui-data-table-pagination__rows-per-page>.ui-typography {
    margin-right: var(--main-spacing)
}

@media(min-width: 640px) {
    .ui-data-table-pagination__rows-per-page {
        -webkit-box-pack: normal;
        -ms-flex-pack: normal;
        justify-content: normal;
        padding: 0
    }
}

html[data-theme=big-dutchman] .ui-data-table-pagination,
html[data-theme=skov] .ui-data-table-pagination {
    background-color: #f8f8f8
}

.ui-data-table-cell,
.ui-data-table-cell--align,
.ui-data-table-cell--clickable,
.ui-data-table-cell--disabled,
.ui-data-table-cell--editable,
.ui-data-table-cell--error,
.ui-data-table-cell--selected {
    border-bottom: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    height: var(--data-table-cell-height);
    padding: 0 var(--main-spacing);
    position: relative;
    white-space: nowrap;
    width: 1px
}

.ui-data-table-cell .ui-tooltip,
.ui-data-table-cell--align .ui-tooltip,
.ui-data-table-cell--clickable .ui-tooltip,
.ui-data-table-cell--disabled .ui-tooltip,
.ui-data-table-cell--editable .ui-tooltip,
.ui-data-table-cell--error .ui-tooltip,
.ui-data-table-cell--selected .ui-tooltip {
    margin-left: calc(var(--main-spacing)/2);
    margin-right: calc(var(--main-spacing)/2);
    margin-top: -12px
}

.ui-data-table-cell--align:before,
.ui-data-table-cell--clickable:before,
.ui-data-table-cell--disabled:before,
.ui-data-table-cell--editable:before,
.ui-data-table-cell--error:before,
.ui-data-table-cell--selected:before,
.ui-data-table-cell:before {
    background-color: var(--color-selected-bounding-box-background);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    visibility: hidden;
    will-change: opacity;
    z-index: 10
}

.ui-data-table-cell__value {
    display: inline-block;
    white-space: nowrap
}

.ui-data-table-cell__children {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-data-table-cell__input-border {
    background-color: transparent;
    border: 1px solid var(--color-active);
    border-radius: var(--border-radius);
    bottom: 0;
    left: 0;
    margin: 8px calc(var(--main-spacing)/2);
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    visibility: hidden;
    will-change: opacity
}

.ui-data-table-cell--clickable {
    background-color: var(--color-white);
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-data-table-cell--clickable * {
    cursor: pointer
}

@media(hover: hover) {
    .ui-data-table-cell--clickable {
        -webkit-transition: opacity .2s;
        transition: opacity .2s;
        will-change: opacity
    }

    .ui-data-table-cell--clickable.ui-data-table-cell.ui-data-table-cell:hover,
    .ui-data-table-cell--clickable:hover {
        background-color: var(--color-solid-hover-background)
    }
}

.ui-data-table-cell--clickable:active {
    background-color: var(--color-active-background)
}

.ui-data-table-cell--selected {
    background-color: var(--color-grey5)
}

.ui-data-table-cell--align-right {
    text-align: right
}

.ui-data-table-cell--align-right .ui-data-table-cell__children {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.ui-data-table-cell--align-right .ui-data-table-cell__children>* {
    margin-left: 8px;
    margin-right: 0
}

.ui-data-table-cell--align-right .ui-data-table-cell__value {
    margin-left: 32px;
    margin-right: 0
}

@media(min-width: 960px) {
    .ui-data-table-cell--align-right .ui-data-table-cell__value {
        margin-left: 48px
    }
}

.ui-data-table-cell--disabled {
    background-color: var(--color-grey6);
    cursor: not-allowed
}

.ui-data-table-cell--editable {
    padding: 0
}

.ui-data-table-cell--editable .ui-data-table-cell__value {
    display: block;
    line-height: var(--data-table-cell-height);
    outline: none;
    padding: 0 var(--main-spacing);
    width: 100%
}

@media(hover: hover) {
    .ui-data-table-cell--editable:hover {
        background-color: var(--color-hover-background);
        -webkit-transition: opacity .2s;
        transition: opacity .2s;
        will-change: opacity
    }
}

.ui-data-table-cell--editable:focus-within .ui-data-table-cell__input-border {
    opacity: 1;
    visibility: visible
}

.ui-data-table-cell--error .ui-data-table-cell__input-border {
    border-color: var(--color-alarm);
    opacity: 1;
    visibility: visible
}

.ui-data-table-cell-lite,
.ui-data-table-cell-lite--align,
.ui-data-table-cell-lite--clickable,
.ui-data-table-cell-lite--disabled {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    color: var(--default-font-color);
    font-family: Noto Sans, sans-serif;
    font-size: var(--button-font-size);
    font-weight: 400;
    height: var(--data-table-cell-height);
    line-height: 1.5;
    padding: 0 var(--main-spacing);
    white-space: nowrap;
    width: 1px
}

.ui-data-table-cell-lite__value {
    display: inline-block;
    white-space: nowrap
}

.ui-data-table-row .ui-data-table-cell-lite--align:last-of-type,
.ui-data-table-row .ui-data-table-cell-lite--clickable:last-of-type,
.ui-data-table-row .ui-data-table-cell-lite--disabled:last-of-type,
.ui-data-table-row .ui-data-table-cell-lite:last-of-type {
    border-right: unset
}

.ui-data-table--with-scroll .ui-data-table__scroll-wrapper,
.ui-data-table-row:last-of-type>.ui-data-table-cell-lite,
.ui-data-table-row:last-of-type>.ui-data-table-cell-lite--align,
.ui-data-table-row:last-of-type>.ui-data-table-cell-lite--clickable,
.ui-data-table-row:last-of-type>.ui-data-table-cell-lite--disabled {
    border-bottom: unset
}

.ui-data-table--with-scroll .ui-data-table-row:last-of-type>.ui-data-table-cell-lite,
.ui-data-table--with-scroll .ui-data-table-row:last-of-type>.ui-data-table-cell-lite--align,
.ui-data-table--with-scroll .ui-data-table-row:last-of-type>.ui-data-table-cell-lite--clickable,
.ui-data-table--with-scroll .ui-data-table-row:last-of-type>.ui-data-table-cell-lite--disabled {
    border-bottom: 1px solid var(--color-border)
}

.ui-data-table-cell-lite--clickable {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-data-table-cell-lite--align-right {
    text-align: right
}

.ui-data-table-cell-lite--align-right .ui-data-table-cell-lite__children {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.ui-data-table-cell-lite--align-right .ui-data-table-cell-lite__children>* {
    margin-left: 8px;
    margin-right: 0
}

.ui-data-table-cell-lite--align-right .ui-data-table-cell-lite__value {
    margin-left: 32px;
    margin-right: 0
}

@media(min-width: 960px) {
    .ui-data-table-cell-lite--align-right .ui-data-table-cell-lite__value {
        margin-left: 48px
    }
}

.ui-data-table-cell-lite--disabled {
    cursor: not-allowed;
    pointer-events: none
}

html[data-theme=skov] .ui-data-table-cell-lite--disabled {
    background-color: #f1f2f2
}

html[data-theme=big-dutchman] .ui-data-table-cell-lite--disabled {
    background-color: #f8f8f8
}

.ui-data-table-row,
.ui-data-table-row--clickable,
.ui-data-table-row--selected {
    background-color: var(--color-white);
    -webkit-transition: background-color .2s;
    transition: background-color .2s;
    will-change: background-color
}

.ui-data-table-row .ui-data-table-cell:last-of-type,
.ui-data-table-row--clickable .ui-data-table-cell:last-of-type,
.ui-data-table-row--selected .ui-data-table-cell:last-of-type {
    border-right: none
}

.ui-data-table-row--clickable:last-of-type .ui-data-table-cell,
.ui-data-table-row--selected:last-of-type .ui-data-table-cell,
.ui-data-table-row:last-of-type .ui-data-table-cell {
    border-bottom: none
}

.ui-data-table-row--clickable:last-of-type .ui-data-table-cell:first-child,
.ui-data-table-row--selected:last-of-type .ui-data-table-cell:first-child,
.ui-data-table-row:last-of-type .ui-data-table-cell:first-child {
    border-bottom-left-radius: var(--border-radius)
}

.ui-data-table-row--clickable:last-of-type .ui-data-table-cell:last-child,
.ui-data-table-row--selected:last-of-type .ui-data-table-cell:last-child,
.ui-data-table-row:last-of-type .ui-data-table-cell:last-child {
    border-bottom-right-radius: var(--border-radius)
}

.ui-data-table-row--clickable {
    cursor: pointer;
    position: relative
}

@media(hover: hover) {
    .ui-data-table-row--clickable:hover .ui-data-table-cell.ui-data-table-cell.ui-data-table-cell.ui-data-table-cell {
        background-color: var(--color-solid-hover-background);
        -webkit-transition: background-color .2s;
        transition: background-color .2s;
        will-change: background-color
    }
}

.ui-data-table-row--clickable:active .ui-data-table-cell {
    background-color: var(--color-active-background)
}

.ui-data-table-row--selected .ui-data-table-cell {
    background-color: var(--color-grey5)
}

.ui-data-table-header,
.ui-data-table-header--align,
.ui-data-table-header--as-sub-header,
.ui-data-table-header--clickable,
.ui-data-table-header--disabled,
.ui-data-table-header--dropdown-visible,
.ui-data-table-header--has-sub-headers,
.ui-data-table-header--sort-direction {
    background-color: var(--color-primary);
    height: var(--data-table-header-height);
    padding: 0 var(--main-spacing);
    position: relative;
    text-align: left
}

.ui-data-table-header__content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.ui-data-table-header__content .ui-icon {
    margin-left: 8px
}

.ui-data-table-header__content .ui-typography {
    line-height: 1.2;
    white-space: pre
}

.ui-data-table-header--as-sub-header {
    border-top: 1px solid var(--color-border-primary);
    height: calc(var(--data-table-header-height)/1.5)
}

.ui-data-table-header--as-sub-header .ui-typography {
    font-size: var(--caption-font-size);
    position: relative
}

.ui-data-table-header--has-sub-headers {
    height: calc(var(--data-table-header-height)/1.5)
}

.ui-data-table-header--min-width-20 {
    min-width: 20px
}

.ui-data-table-header--min-width-40 {
    min-width: 40px
}

.ui-data-table-header--min-width-60 {
    min-width: 60px
}

.ui-data-table-header--min-width-80 {
    min-width: 80px
}

.ui-data-table-header--min-width-100 {
    min-width: 100px
}

.ui-data-table-header--min-width-120 {
    min-width: 120px
}

.ui-data-table-header--min-width-140 {
    min-width: 140px
}

.ui-data-table-header--min-width-160 {
    min-width: 160px
}

.ui-data-table-header--min-width-180 {
    min-width: 180px
}

.ui-data-table-header--min-width-200 {
    min-width: 200px
}

.ui-data-table-header--min-width-220 {
    min-width: 220px
}

.ui-data-table-header--min-width-240 {
    min-width: 240px
}

.ui-data-table-header--min-width-260 {
    min-width: 260px
}

.ui-data-table-header--min-width-280 {
    min-width: 280px
}

.ui-data-table-header--min-width-300 {
    min-width: 300px
}

.ui-data-table-header--min-width-320 {
    min-width: 320px
}

.ui-data-table-header--min-width-340 {
    min-width: 340px
}

.ui-data-table-header--min-width-360 {
    min-width: 360px
}

.ui-data-table-header--min-width-380 {
    min-width: 380px
}

.ui-data-table-header--min-width-400 {
    min-width: 400px
}

.ui-data-table-header--min-width-420 {
    min-width: 420px
}

.ui-data-table-header--min-width-440 {
    min-width: 440px
}

.ui-data-table-header--min-width-460 {
    min-width: 460px
}

.ui-data-table-header--min-width-480 {
    min-width: 480px
}

.ui-data-table-header--min-width-500 {
    min-width: 500px
}

.ui-data-table-header--min-width-520 {
    min-width: 520px
}

.ui-data-table-header--min-width-540 {
    min-width: 540px
}

.ui-data-table-header--min-width-560 {
    min-width: 560px
}

.ui-data-table-header--min-width-580 {
    min-width: 580px
}

.ui-data-table-header--min-width-600 {
    min-width: 600px
}

.ui-data-table-header--min-width-620 {
    min-width: 620px
}

.ui-data-table-header--min-width-640 {
    min-width: 640px
}

.ui-data-table-header--min-width-660 {
    min-width: 660px
}

.ui-data-table-header--min-width-680 {
    min-width: 680px
}

.ui-data-table-header--min-width-700 {
    min-width: 700px
}

.ui-data-table-header--min-width-720 {
    min-width: 720px
}

.ui-data-table-header--min-width-740 {
    min-width: 740px
}

.ui-data-table-header--min-width-760 {
    min-width: 760px
}

.ui-data-table-header--min-width-780 {
    min-width: 780px
}

.ui-data-table-header--min-width-800 {
    min-width: 800px
}

.ui-data-table-header--min-width-820 {
    min-width: 820px
}

.ui-data-table-header--min-width-840 {
    min-width: 840px
}

.ui-data-table-header--min-width-860 {
    min-width: 860px
}

.ui-data-table-header--min-width-880 {
    min-width: 880px
}

.ui-data-table-header--min-width-900 {
    min-width: 900px
}

.ui-data-table-header--min-width-920 {
    min-width: 920px
}

.ui-data-table-header--min-width-940 {
    min-width: 940px
}

.ui-data-table-header--min-width-960 {
    min-width: 960px
}

.ui-data-table-header--min-width-980 {
    min-width: 980px
}

.ui-data-table-header--min-width-1000 {
    min-width: 1000px
}

.ui-data-table-header--min-width-1020 {
    min-width: 1020px
}

.ui-data-table-header--min-width-1040 {
    min-width: 1040px
}

.ui-data-table-header--min-width-1060 {
    min-width: 1060px
}

.ui-data-table-header--min-width-1080 {
    min-width: 1080px
}

.ui-data-table-header--min-width-1100 {
    min-width: 1100px
}

.ui-data-table-header--min-width-1120 {
    min-width: 1120px
}

.ui-data-table-header--min-width-1140 {
    min-width: 1140px
}

.ui-data-table-header--min-width-1160 {
    min-width: 1160px
}

.ui-data-table-header--min-width-1180 {
    min-width: 1180px
}

.ui-data-table-header--min-width-1200 {
    min-width: 1200px
}

.ui-data-table-header--min-width-1220 {
    min-width: 1220px
}

.ui-data-table-header--min-width-1240 {
    min-width: 1240px
}

.ui-data-table-header--min-width-1260 {
    min-width: 1260px
}

.ui-data-table-header--min-width-1280 {
    min-width: 1280px
}

.ui-data-table-header--min-width-1300 {
    min-width: 1300px
}

.ui-data-table-header--min-width-1320 {
    min-width: 1320px
}

.ui-data-table-header--min-width-1340 {
    min-width: 1340px
}

.ui-data-table-header--min-width-1360 {
    min-width: 1360px
}

.ui-data-table-header--min-width-1380 {
    min-width: 1380px
}

.ui-data-table-header--min-width-1400 {
    min-width: 1400px
}

.ui-data-table-header--min-width-1420 {
    min-width: 1420px
}

.ui-data-table-header--min-width-1440 {
    min-width: 1440px
}

.ui-data-table-header--min-width-1460 {
    min-width: 1460px
}

.ui-data-table-header--min-width-1480 {
    min-width: 1480px
}

.ui-data-table-header--min-width-1500 {
    min-width: 1500px
}

.ui-data-table-header--min-width-1520 {
    min-width: 1520px
}

.ui-data-table-header--min-width-1540 {
    min-width: 1540px
}

.ui-data-table-header--min-width-1560 {
    min-width: 1560px
}

.ui-data-table-header--min-width-1580 {
    min-width: 1580px
}

.ui-data-table-header--min-width-1600 {
    min-width: 1600px
}

.ui-data-table-header--min-width-1620 {
    min-width: 1620px
}

.ui-data-table-header--min-width-1640 {
    min-width: 1640px
}

.ui-data-table-header--min-width-1660 {
    min-width: 1660px
}

.ui-data-table-header--min-width-1680 {
    min-width: 1680px
}

.ui-data-table-header--min-width-1700 {
    min-width: 1700px
}

.ui-data-table-header--min-width-1720 {
    min-width: 1720px
}

.ui-data-table-header--min-width-1740 {
    min-width: 1740px
}

.ui-data-table-header--min-width-1760 {
    min-width: 1760px
}

.ui-data-table-header--min-width-1780 {
    min-width: 1780px
}

.ui-data-table-header--min-width-1800 {
    min-width: 1800px
}

.ui-data-table-header--min-width-1820 {
    min-width: 1820px
}

.ui-data-table-header--min-width-1840 {
    min-width: 1840px
}

.ui-data-table-header--min-width-1860 {
    min-width: 1860px
}

.ui-data-table-header--min-width-1880 {
    min-width: 1880px
}

.ui-data-table-header--min-width-1900 {
    min-width: 1900px
}

.ui-data-table-header--min-width-1920 {
    min-width: 1920px
}

.ui-data-table-header--min-width-1940 {
    min-width: 1940px
}

.ui-data-table-header--min-width-1960 {
    min-width: 1960px
}

.ui-data-table-header--min-width-1980 {
    min-width: 1980px
}

.ui-data-table-header--min-width-2000 {
    min-width: 2000px
}

.ui-data-table-header--width-1 {
    min-width: 0;
    width: 8.33333%
}

.ui-data-table-header--width-2 {
    min-width: 0;
    width: 16.66667%
}

.ui-data-table-header--width-3 {
    min-width: 0;
    width: 25%
}

.ui-data-table-header--width-4 {
    min-width: 0;
    width: 33.33333%
}

.ui-data-table-header--width-5 {
    min-width: 0;
    width: 41.66667%
}

.ui-data-table-header--width-6 {
    min-width: 0;
    width: 50%
}

.ui-data-table-header--width-7 {
    min-width: 0;
    width: 58.33333%
}

.ui-data-table-header--width-8 {
    min-width: 0;
    width: 66.66667%
}

.ui-data-table-header--width-9 {
    min-width: 0;
    width: 75%
}

.ui-data-table-header--width-10 {
    min-width: 0;
    width: 83.33333%
}

.ui-data-table-header--width-11 {
    min-width: 0;
    width: 91.66667%
}

.ui-data-table-header--width-12 {
    min-width: 0;
    width: 100%
}

.ui-data-table-header--dropdown-visible {
    cursor: pointer;
    position: relative
}

.ui-data-table-header--dropdown-visible:before {
    background-color: var(--color-primary-active-background);
    border-radius: var(--border-radius);
    bottom: 8px;
    content: "";
    left: 8px;
    opacity: 0;
    opacity: 1 !important;
    position: absolute;
    right: 8px;
    top: 8px;
    visibility: hidden;
    visibility: visible !important
}

.ui-data-table-header--clickable {
    cursor: pointer;
    position: relative
}

.ui-data-table-header--clickable:before {
    background-color: var(--color-primary-active-background);
    border-radius: var(--border-radius);
    bottom: 8px;
    content: "";
    left: 8px;
    opacity: 0;
    position: absolute;
    right: 8px;
    top: 8px;
    visibility: hidden
}

.ui-data-table-header--clickable * {
    cursor: pointer;
    position: relative;
    z-index: 1
}

@media(hover: hover) {
    .ui-data-table-header--clickable .ui-typography {
        -webkit-transition: color .2s;
        transition: color .2s;
        will-change: color
    }

    .ui-data-table-header--clickable .ui-icon svg {
        -webkit-transition: fill .2s;
        transition: fill .2s;
        will-change: fill
    }

    .ui-data-table-header--clickable:hover .ui-data-table-header__content .ui-typography {
        color: var(--color-white)
    }

    .ui-data-table-header--clickable:hover .ui-data-table-header__content .ui-icon svg {
        fill: var(--color-white)
    }
}

.ui-data-table-header--clickable:active:before {
    opacity: 1;
    visibility: visible
}

.ui-data-table-header--clickable:active .ui-data-table-header__content .ui-typography,
.ui-data-table-header--sort-direction .ui-typography {
    color: var(--color-white)
}

.ui-data-table-header--sort-direction .ui-icon svg {
    fill: var(--color-white)
}

.ui-data-table-header--align-right {
    text-align: right
}

.ui-data-table-header--disabled {
    pointer-events: none
}

.ui-data-table-header--disabled .ui-data-table-header__content {
    opacity: .6;
    will-change: opacity
}

.ui-data-table-header--dropdown {
    position: absolute;
    width: auto
}

.ui-data-table-header--dropdown .ui-dropdown-menu {
    width: auto;
    z-index: var(--data-table-head-z-index)
}

.ui-data-table-header--dropdown .ui-dropdown-menu .ui-dropdown-menu-item__tick {
    margin-left: 16px
}

.ui-dropdown-menu,
.ui-dropdown-menu--align,
.ui-dropdown-menu--flip-x,
.ui-dropdown-menu--show {
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    left: 100%;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .1s linear .25s;
    transition: opacity .1s linear .25s;
    visibility: hidden;
    width: var(--dropdown-menu-width);
    z-index: var(--z-index-dropdown-menu)
}

.ui-dropdown-menu--show {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: opacity .1s linear .25s;
    transition: opacity .1s linear .25s;
    visibility: visible
}

.ui-dropdown-menu--align-left {
    left: auto;
    right: 100%
}

.ui-dropdown-menu--align-bottom-right {
    left: 0;
    right: auto;
    top: 100%
}

.ui-dropdown-menu--align-bottom-left {
    left: auto;
    right: 0;
    top: 100%
}

.ui-dropdown-menu--align-top-right {
    bottom: 100%;
    left: 0;
    right: 0;
    top: auto
}

.ui-dropdown-menu--align-top-left {
    bottom: 100%;
    left: auto;
    right: 0;
    top: auto
}

.ui-dropdown-menu--flip-x {
    left: 0;
    right: auto
}

.ui-dropdown-menu--flip-x.ui-dropdown-menu--align-bottom-left,
.ui-dropdown-menu--flip-x.ui-dropdown-menu--align-bottom-right {
    left: 100%
}

.ui-dropdown-menu--flip-x.ui-dropdown-menu--align-left,
.ui-dropdown-menu--flip-x.ui-dropdown-menu--align-right {
    left: 0
}

.ui-dropdown-menu--flipped-to-bottom {
    bottom: auto;
    top: 100%
}

.ui-dropdown-menu--flipped-to-top {
    bottom: 100%;
    top: auto
}

.ui-dropdown-menu--align-top-right.ui-dropdown-menu--flipped-to-center {
    bottom: auto;
    left: 100%;
    top: 50%
}

.ui-dropdown-menu--align-top-left.ui-dropdown-menu--flipped-to-center {
    bottom: auto;
    right: 100%;
    top: 50%
}

.ui-dropdown-menu--align-bottom-right.ui-dropdown-menu--flipped-to-center {
    bottom: auto;
    left: 100%;
    top: 50%
}

.ui-dropdown-menu--align-bottom-left.ui-dropdown-menu--flipped-to-center {
    bottom: auto;
    right: 100%;
    top: 50%
}

html[data-theme=skov] .ui-dropdown-menu,
html[data-theme=skov] .ui-dropdown-menu--align,
html[data-theme=skov] .ui-dropdown-menu--flip-x,
html[data-theme=skov] .ui-dropdown-menu--show {
    border: 1px solid var(--color-border);
    -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .08), 1px 1px 4px 0 rgba(0, 0, 0, .04);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .08), 1px 1px 4px 0 rgba(0, 0, 0, .04)
}

html[data-theme=big-dutchman] .ui-dropdown-menu,
html[data-theme=big-dutchman] .ui-dropdown-menu--align,
html[data-theme=big-dutchman] .ui-dropdown-menu--flip-x,
html[data-theme=big-dutchman] .ui-dropdown-menu--show {
    -webkit-box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1)
}

.ui-dropdown-menu-item,
.ui-dropdown-menu-item--clickable,
.ui-dropdown-menu-item--disabled,
.ui-dropdown-menu-item--selected,
.ui-dropdown-menu-item[disabled],
[disabled].ui-dropdown-menu-item--clickable,
[disabled].ui-dropdown-menu-item--selected {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--dropdown-menu-item-height);
    outline: none;
    padding: 0 16px;
    position: relative;
    text-align: left;
    width: 100%
}

.ui-dropdown-menu-item--clickable:first-child .ui-dropdown-menu-item__border:first-child,
.ui-dropdown-menu-item--clickable:last-child .ui-dropdown-menu-item__border:last-child,
.ui-dropdown-menu-item--disabled:first-child .ui-dropdown-menu-item__border:first-child,
.ui-dropdown-menu-item--disabled:last-child .ui-dropdown-menu-item__border:last-child,
.ui-dropdown-menu-item--selected:first-child .ui-dropdown-menu-item__border:first-child,
.ui-dropdown-menu-item--selected:last-child .ui-dropdown-menu-item__border:last-child,
.ui-dropdown-menu-item:first-child .ui-dropdown-menu-item__border:first-child,
.ui-dropdown-menu-item:last-child .ui-dropdown-menu-item__border:last-child {
    display: none
}

html[data-layout=controller] .ui-dropdown-menu-item,
html[data-layout=controller] .ui-dropdown-menu-item--clickable,
html[data-layout=controller] .ui-dropdown-menu-item--disabled,
html[data-layout=controller] .ui-dropdown-menu-item--selected {
    padding: 0 var(--main-spacing)
}

.ui-dropdown-menu-item__icon {
    margin-left: 0;
    margin-right: 8px
}

.ui-dropdown-menu-item__icon svg {
    fill: var(--color-grey2)
}

html[data-layout=controller] .ui-dropdown-menu-item__icon {
    margin-left: 8px;
    margin-right: 16px
}

.ui-dropdown-menu-item__label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0
}

.ui-dropdown-menu-item__label>.ui-typography {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    font-size: var(--body1-font-size);
    min-width: 0
}

.ui-dropdown-menu-item__label>* {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

html[data-layout=controller] .ui-dropdown-menu-item__label>.ui-typography {
    font-size: var(--button-font-size)
}

.ui-dropdown-menu-item__border {
    background-color: var(--color-border);
    height: 1px;
    left: 0;
    position: absolute;
    right: 0
}

.ui-dropdown-menu-item__border:first-child {
    top: -1px
}

.ui-dropdown-menu-item__border:last-child {
    bottom: 0
}

html[data-layout=controller] .ui-dropdown-menu-item__border {
    left: var(--main-spacing)
}

.ui-dropdown-menu-item__tick {
    margin-left: auto
}

.ui-dropdown-menu-item__tick svg {
    fill: var(--color-active)
}

.ui-dropdown-menu-item__chevron--back {
    margin-right: 8px
}

.ui-dropdown-menu-item__chevron--forward {
    margin-left: auto
}

.ui-dropdown-menu-item--disabled,
.ui-dropdown-menu-item[disabled],
[disabled].ui-dropdown-menu-item--clickable,
[disabled].ui-dropdown-menu-item--disabled,
[disabled].ui-dropdown-menu-item--selected {
    cursor: not-allowed;
    pointer-events: none
}

.ui-dropdown-menu-item--disabled>*,
.ui-dropdown-menu-item[disabled]>*,
[disabled].ui-dropdown-menu-item--clickable>*,
[disabled].ui-dropdown-menu-item--disabled>*,
[disabled].ui-dropdown-menu-item--selected>* {
    opacity: .6
}

.ui-dropdown-menu-item--clickable {
    cursor: pointer
}

@media(hover: hover) {
    .ui-dropdown-menu-item--clickable {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-dropdown-menu-item--clickable:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-dropdown-menu-item--clickable:active {
    background-color: var(--color-active-background)
}

.ui-dropdown-menu-item--selected .ui-dropdown-menu-item__icon svg {
    fill: var(--color-active)
}

.ui-dropdown-menu-item--selected .ui-dropdown-menu-item__label {
    padding-right: 8px
}

.ui-dropdown-menu-item--selected .ui-dropdown-menu-item__label>.ui-typography {
    color: var(--color-active)
}

.ui-data-table-head,
.ui-data-table-head--sticky {
    position: relative
}

.ui-data-table-head tr:first-child th:first-child,
.ui-data-table-head--sticky tr:first-child th:first-child {
    border-top-left-radius: var(--border-radius)
}

.ui-data-table-head tr:first-child th:last-child,
.ui-data-table-head--sticky tr:first-child th:last-child {
    border-top-right-radius: var(--border-radius)
}

.ui-data-table-head--sticky .ui-data-table-header {
    position: sticky;
    top: 0;
    z-index: var(--data-table-head-z-index)
}

.ui-data-table-head--sticky .ui-data-table-header:first-child:not(.ui-data-table-header--as-sub-header) {
    z-index: 10
}

.ui-data-table-head--sticky .ui-data-table-header--as-sub-header {
    top: calc(var(--data-table-header-height)/1.5)
}

.ui-value,
.ui-value--align-right,
.ui-value--extra-small,
.ui-value--large,
.ui-value--medium,
.ui-value--small,
.ui-value--theme,
.ui-value--truncate-label-after,
.ui-value--truncate-value-after,
.ui-value--with-help,
.ui-value--with-icon {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    text-align: left
}

.ui-value .ui-value__icon,
.ui-value .ui-value__icon--green,
.ui-value .ui-value__icon--red,
.ui-value .ui-value__icon--yellow,
.ui-value .ui-value__value,
.ui-value--align-right .ui-value__icon,
.ui-value--align-right .ui-value__icon--green,
.ui-value--align-right .ui-value__icon--red,
.ui-value--align-right .ui-value__icon--yellow,
.ui-value--align-right .ui-value__value,
.ui-value--extra-small .ui-value__icon,
.ui-value--extra-small .ui-value__icon--green,
.ui-value--extra-small .ui-value__icon--red,
.ui-value--extra-small .ui-value__icon--yellow,
.ui-value--extra-small .ui-value__value,
.ui-value--large .ui-value__icon,
.ui-value--large .ui-value__icon--green,
.ui-value--large .ui-value__icon--red,
.ui-value--large .ui-value__icon--yellow,
.ui-value--large .ui-value__value,
.ui-value--medium .ui-value__icon,
.ui-value--medium .ui-value__icon--green,
.ui-value--medium .ui-value__icon--red,
.ui-value--medium .ui-value__icon--yellow,
.ui-value--medium .ui-value__value,
.ui-value--small .ui-value__icon,
.ui-value--small .ui-value__icon--green,
.ui-value--small .ui-value__icon--red,
.ui-value--small .ui-value__icon--yellow,
.ui-value--small .ui-value__value,
.ui-value--theme .ui-value__icon,
.ui-value--theme .ui-value__icon--green,
.ui-value--theme .ui-value__icon--red,
.ui-value--theme .ui-value__icon--yellow,
.ui-value--theme .ui-value__value,
.ui-value--truncate-label-after .ui-value__icon,
.ui-value--truncate-label-after .ui-value__icon--green,
.ui-value--truncate-label-after .ui-value__icon--red,
.ui-value--truncate-label-after .ui-value__icon--yellow,
.ui-value--truncate-label-after .ui-value__value,
.ui-value--truncate-value-after .ui-value__icon,
.ui-value--truncate-value-after .ui-value__icon--green,
.ui-value--truncate-value-after .ui-value__icon--red,
.ui-value--truncate-value-after .ui-value__icon--yellow,
.ui-value--truncate-value-after .ui-value__value,
.ui-value--with-help .ui-value__icon,
.ui-value--with-help .ui-value__icon--green,
.ui-value--with-help .ui-value__icon--red,
.ui-value--with-help .ui-value__icon--yellow,
.ui-value--with-help .ui-value__value,
.ui-value--with-icon .ui-value__icon,
.ui-value--with-icon .ui-value__icon--green,
.ui-value--with-icon .ui-value__icon--red,
.ui-value--with-icon .ui-value__icon--yellow,
.ui-value--with-icon .ui-value__value {
    height: calc(var(--h3-font-size)*1.4)
}

.ui-value .ui-value__value>.ui-typography,
.ui-value--align-right .ui-value__value>.ui-typography,
.ui-value--extra-small .ui-value__value>.ui-typography,
.ui-value--large .ui-value__value>.ui-typography,
.ui-value--medium .ui-value__value>.ui-typography,
.ui-value--small .ui-value__value>.ui-typography,
.ui-value--theme .ui-value__value>.ui-typography,
.ui-value--truncate-label-after .ui-value__value>.ui-typography,
.ui-value--truncate-value-after .ui-value__value>.ui-typography,
.ui-value--with-help .ui-value__value>.ui-typography,
.ui-value--with-icon .ui-value__value>.ui-typography {
    font-size: var(--h3-font-size);
    line-height: calc(var(--h3-font-size)*1.4)
}

.ui-value .ui-value__subscript-container,
.ui-value--align-right .ui-value__subscript-container,
.ui-value--extra-small .ui-value__subscript-container,
.ui-value--large .ui-value__subscript-container,
.ui-value--medium .ui-value__subscript-container,
.ui-value--small .ui-value__subscript-container,
.ui-value--theme .ui-value__subscript-container,
.ui-value--truncate-label-after .ui-value__subscript-container,
.ui-value--truncate-value-after .ui-value__subscript-container,
.ui-value--with-help .ui-value__subscript-container,
.ui-value--with-icon .ui-value__subscript-container {
    height: calc(var(--h3-font-size)*1.4)
}

.ui-value .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--align-right .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--extra-small .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--large .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--medium .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--small .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--theme .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--truncate-label-after .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--truncate-value-after .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--with-help .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript),
.ui-value--with-icon .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript) {
    font-size: var(--h3-font-size)
}

.ui-value--truncate-value-after-2.ui-value--align-right .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--extra-small .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--large .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--medium .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--small .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--theme .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--truncate-label-after .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--truncate-value-after .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--with-help .ui-value__value,
.ui-value--truncate-value-after-2.ui-value--with-icon .ui-value__value,
.ui-value.ui-value--truncate-value-after-2 .ui-value__value {
    height: calc(var(--h3-font-size)*1.4*2)
}

.ui-value__label,
.ui-value__subscript {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    line-height: 1.4;
    min-height: -webkit-min-content;
    min-height: -moz-min-content;
    min-height: min-content;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    word-break: break-word
}

.ui-value__icon,
.ui-value__icon--green,
.ui-value__icon--red,
.ui-value__icon--yellow {
    margin-right: 8px
}

.ui-value__icon svg,
.ui-value__icon--green svg,
.ui-value__icon--red svg,
.ui-value__icon--yellow svg {
    fill: var(--color-font-subtitle1)
}

.ui-value__icon--red svg {
    fill: var(--color-red)
}

.ui-value__icon--green svg {
    fill: var(--color-green)
}

.ui-value__icon--yellow svg {
    fill: var(--color-yellow)
}

.ui-value__value {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.ui-value__value .ui-value__subscript-container>.ui-typography,
.ui-value__value>.ui-typography {
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-value__value .ui-value__subscript-container>.ui-typography .ui-typography,
.ui-value__value>.ui-typography .ui-typography {
    color: inherit;
    display: inline;
    line-height: inherit
}

.ui-value__dot {
    -ms-flex-item-align: center;
    align-self: center;
    background-color: var(--color-primary);
    border-radius: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 8px;
    margin-right: 8px;
    width: 8px
}

.ui-value__header {
    font-size: var(--body1-font-size) !important
}

.ui-value--extra-small .ui-value__icon,
.ui-value--extra-small .ui-value__icon--green,
.ui-value--extra-small .ui-value__icon--red,
.ui-value--extra-small .ui-value__icon--yellow,
.ui-value--extra-small .ui-value__value {
    height: calc(var(--h5-font-size)*1.4)
}

.ui-value--extra-small .ui-value__value>.ui-typography {
    font-size: var(--h5-font-size);
    line-height: calc(var(--h5-font-size)*1.4)
}

.ui-value--extra-small .ui-value__subscript-container {
    height: calc(var(--h5-font-size)*1.4)
}

.ui-value--extra-small .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript) {
    font-size: var(--h5-font-size)
}

.ui-value--extra-small.ui-value--truncate-value-after-2 .ui-value__value {
    height: calc(var(--h5-font-size)*1.4*2)
}

.ui-value--extra-small .ui-value__label,
.ui-value--extra-small .ui-value__subscript {
    font-size: var(--body2-font-size)
}

.ui-value--small .ui-value__icon,
.ui-value--small .ui-value__icon--green,
.ui-value--small .ui-value__icon--red,
.ui-value--small .ui-value__icon--yellow,
.ui-value--small .ui-value__value {
    height: calc(var(--h3-font-size)*1.4)
}

.ui-value--small .ui-value__value>.ui-typography {
    font-size: var(--h3-font-size);
    line-height: calc(var(--h3-font-size)*1.4)
}

.ui-value--small .ui-value__subscript-container {
    height: calc(var(--h3-font-size)*1.4)
}

.ui-value--small .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript) {
    font-size: var(--h3-font-size)
}

.ui-value--small.ui-value--truncate-value-after-2 .ui-value__value {
    height: calc(var(--h3-font-size)*1.4*2)
}

.ui-value--small .ui-value__label,
.ui-value--small .ui-value__subscript {
    font-size: var(--body2-font-size)
}

.ui-value--medium .ui-value__icon,
.ui-value--medium .ui-value__icon--green,
.ui-value--medium .ui-value__icon--red,
.ui-value--medium .ui-value__icon--yellow,
.ui-value--medium .ui-value__value {
    height: calc(var(--h2-font-size)*1.4)
}

.ui-value--medium .ui-value__value>.ui-typography {
    font-size: var(--h2-font-size);
    line-height: calc(var(--h2-font-size)*1.4)
}

.ui-value--medium .ui-value__subscript-container {
    height: calc(var(--h2-font-size)*1.4)
}

.ui-value--medium .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript) {
    font-size: var(--h2-font-size)
}

.ui-value--medium.ui-value--truncate-value-after-2 .ui-value__value {
    height: calc(var(--h2-font-size)*1.4*2)
}

.ui-value--large .ui-value__value {
    top: -5px
}

.ui-value--large .ui-value__icon,
.ui-value--large .ui-value__icon--green,
.ui-value--large .ui-value__icon--red,
.ui-value--large .ui-value__icon--yellow,
.ui-value--large .ui-value__value {
    height: calc(var(--h1-font-size)*1.4)
}

.ui-value--large .ui-value__value>.ui-typography {
    font-size: var(--h1-font-size);
    line-height: calc(var(--h1-font-size)*1.4)
}

.ui-value--large .ui-value__subscript-container {
    height: calc(var(--h1-font-size)*1.4)
}

.ui-value--large .ui-value__subscript-container>.ui-typography:not(.ui-value__subscript) {
    font-size: var(--h1-font-size)
}

.ui-value--large.ui-value--truncate-value-after-2 .ui-value__value {
    height: calc(var(--h1-font-size)*1.4*2)
}

.ui-value--theme-primary .ui-value__value .ui-typography {
    color: var(--color-white)
}

.ui-value--theme-primary .ui-value__label {
    color: var(--color-font-primary)
}

.ui-value--theme-primary .ui-value__icon svg,
.ui-value--theme-primary .ui-value__icon--green svg,
.ui-value--theme-primary .ui-value__icon--red svg,
.ui-value--theme-primary .ui-value__icon--yellow svg {
    fill: var(--color-font-primary)
}

.ui-value--theme-primary-light .ui-value__label,
.ui-value--theme-primary-light .ui-value__value .ui-typography {
    color: var(--color-white)
}

.ui-value--theme-primary-light .ui-value__icon svg,
.ui-value--theme-primary-light .ui-value__icon--green svg,
.ui-value--theme-primary-light .ui-value__icon--red svg,
.ui-value--theme-primary-light .ui-value__icon--yellow svg {
    fill: var(--color-white)
}

.ui-value--truncate-label-after-1 .ui-value__label {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-value--truncate-value-after-2 .ui-value__value>.ui-typography {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: pre-wrap;
    width: auto;
    word-break: break-word
}

.ui-value--truncate-value-after-2 .ui-value__icon,
.ui-value--truncate-value-after-2 .ui-value__icon--green,
.ui-value--truncate-value-after-2 .ui-value__icon--red,
.ui-value--truncate-value-after-2 .ui-value__icon--yellow {
    -ms-flex-item-align: start;
    align-self: flex-start
}

.ui-value--align-right {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    text-align: right
}

.ui-value--align-right .ui-value__value {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.ui-value--state-alarm .ui-value__value .ui-typography {
    color: var(--color-alarm)
}

.ui-value--state-alarm .ui-value__icon svg,
.ui-value--state-alarm .ui-value__icon--green svg,
.ui-value--state-alarm .ui-value__icon--red svg,
.ui-value--state-alarm .ui-value__icon--yellow svg {
    fill: var(--color-alarm)
}

.ui-value--state-warning .ui-value__value .ui-typography {
    color: var(--color-warning)
}

.ui-value--state-warning .ui-value__icon svg,
.ui-value--state-warning .ui-value__icon--green svg,
.ui-value--state-warning .ui-value__icon--red svg,
.ui-value--state-warning .ui-value__icon--yellow svg {
    fill: var(--color-warning)
}

.ui-value--state-disabled .ui-value__value .ui-typography {
    color: var(--color-disabled)
}

.ui-value--state-disabled .ui-value__icon svg,
.ui-value--state-disabled .ui-value__icon--green svg,
.ui-value--state-disabled .ui-value__icon--red svg,
.ui-value--state-disabled .ui-value__icon--yellow svg {
    fill: var(--color-disabled)
}

.ui-value--with-help .ui-value__label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: visible
}

.ui-value--with-help .ui-button-icon {
    height: var(--icon-size);
    margin-left: 8px;
    position: relative;
    width: var(--icon-size);
    z-index: 99
}

.ui-date-editor,
.ui-date-editor--size-large,
.ui-date-editor--theme-primary {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    position: relative
}

.ui-date-editor__month-selector {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 8px;
    position: relative
}

.ui-date-editor__month-selector .ui-typography {
    margin: 0 auto
}

.ui-date-editor__month-selector .ui-button-icon {
    height: 28px;
    width: 28px;
    z-index: 1
}

.ui-date-editor__month-selector .ui-button-icon svg {
    height: var(--icon-size-extra-small);
    width: var(--icon-size-extra-small)
}

.ui-date-editor__year-selector {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative
}

.ui-date-editor__days {
    list-style: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0
}

.ui-date-editor__days,
.ui-date-editor__days li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-date-editor__days li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-flex: 1;
    align-items: center;
    -ms-flex: 1;
    flex: 1;
    height: 32px;
    justify-content: center;
    text-align: center
}

.ui-date-editor__days li .ui-typography {
    color: var(--color-font-subtitle1)
}

.ui-date-editor__dates {
    height: 100%;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-date-editor__dates:after {
    -webkit-box-flex: 1;
    content: "";
    -ms-flex: auto;
    flex: auto
}

.ui-date-editor__dates li {
    cursor: pointer;
    float: left;
    height: 32px;
    min-height: 1px;
    position: relative;
    text-align: center;
    width: 14.2857142857%
}

.ui-date-editor__dates li:after {
    border-radius: 100%;
    content: "";
    height: 28px;
    left: 50%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    visibility: hidden;
    width: 28px
}

.ui-date-editor__dates li input {
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--body2-font-size);
    font-weight: var(--font-weight-regular);
    height: 100%;
    outline: none;
    position: relative;
    width: 100%;
    z-index: 1
}

.ui-date-editor__dates li.empty {
    cursor: default
}

.ui-date-editor__dates li.empty:after {
    content: none
}

.ui-date-editor__dates li.is-weekend input {
    color: var(--color-font-subtitle1)
}

.ui-date-editor__dates li.is-highlightet--first:before,
.ui-date-editor__dates li.is-highlightet--last:before,
.ui-date-editor__dates li.is-highlightet:before {
    background-color: var(--color-active);
    content: "";
    height: 28px;
    opacity: .2;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%
}

.ui-date-editor__dates li.is-highlightet--first.active:before {
    left: 50%;
    width: 50%
}

.ui-date-editor__dates li.is-highlightet--last.active:before {
    right: 50%;
    width: 50%
}

@media(hover: hover) {
    .ui-date-editor__dates li:hover:after {
        background-color: var(--color-hover-background);
        opacity: 1;
        visibility: visible
    }
}

.ui-date-editor__dates li:active:after {
    background-color: var(--color-active-background);
    opacity: 1;
    visibility: visible
}

.ui-date-editor__dates li.active:after {
    background-color: var(--color-active);
    opacity: 1;
    visibility: visible
}

.ui-date-editor__dates li.active input {
    color: var(--color-white)
}

.ui-date-editor__dates li.is-disabled {
    cursor: not-allowed
}

.ui-date-editor__dates li.is-disabled:after {
    background-color: transparent;
    opacity: 1;
    visibility: visible
}

.ui-date-editor__dates li.is-disabled input {
    cursor: not-allowed
}

.ui-date-editor--theme-primary .ui-date-editor__month-selector {
    border-bottom: 2px solid var(--color-border-primary);
    margin-bottom: var(--main-spacing)
}

.ui-date-editor--theme-primary .ui-date-editor__month-selector .ui-typography {
    color: var(--color-font-primary);
    text-align: center
}

.ui-date-editor--theme-primary .ui-date-editor__month-selector .ui-button-icon {
    height: var(--button-height-small);
    width: var(--button-height-small);
    z-index: 1
}

.ui-date-editor--theme-primary .ui-date-editor__month-selector .ui-button-icon svg {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

@media(min-width: 960px) {
    .ui-date-editor--theme-primary .ui-date-editor__month-selector .ui-button-icon {
        height: var(--button-icon-width);
        width: var(--button-icon-width);
        z-index: 1
    }

    .ui-date-editor--theme-primary .ui-date-editor__month-selector .ui-button-icon svg {
        height: var(--icon-size);
        width: var(--icon-size)
    }
}

.ui-date-editor--theme-primary .ui-date-editor__days {
    margin-bottom: var(--main-spacing)
}

.ui-date-editor--theme-primary .ui-date-editor__dates li.is-weekend input {
    color: var(--color-font-primary)
}

.ui-date-editor--theme-primary .ui-date-editor__dates li.is-disabled input {
    opacity: .25
}

.ui-date-editor--theme-primary .ui-date-editor__dates input {
    color: var(--color-white)
}

.ui-date-editor--theme-primary .ui-date-editor__dates li {
    height: 20%;
    max-height: var(--button-round-height-large)
}

.ui-date-editor--theme-primary .ui-date-editor__days li .ui-typography {
    color: var(--color-font-primary)
}

.ui-date-editor--size-large .ui-date-editor__dates li:after {
    height: var(--button-round-height-large);
    width: var(--button-round-height-large)
}

@media(hover: hover) {
    .ui-date-editor--size-large .ui-date-editor__dates li:hover:after {
        background-color: var(--color-primary-hover-background);
        opacity: 1;
        visibility: visible
    }
}

.ui-date-editor--size-large .ui-date-editor__dates li:active:after {
    background-color: var(--color-primary-active-background);
    opacity: 1;
    visibility: visible
}

.ui-date-editor--size-large .ui-date-editor__dates li.active:after {
    background-color: var(--color-active);
    opacity: 1;
    visibility: visible
}

.ui-date-editor--size-large .ui-date-editor__dates li.active input {
    color: var(--color-white)
}

.ui-date-editor--size-large .ui-date-editor__dates li.is-disabled {
    cursor: not-allowed
}

.ui-date-editor--size-large .ui-date-editor__dates li.is-disabled:after {
    background-color: transparent;
    opacity: 1;
    visibility: visible
}

.ui-date-editor--size-large .ui-date-editor__dates li.is-disabled input {
    cursor: not-allowed
}

.ui-date-editor--size-large .ui-date-editor__dates li input {
    font-size: 24px
}

@media(min-width: 960px) {
    .ui-date-editor--size-large .ui-date-editor__dates li input {
        font-size: 26px
    }
}

.ui-snack-bars-module_snackBars__qFLiP {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 0;
    pointer-events: none;
    position: sticky;
    top: var(--main-nav-height);
    visibility: hidden;
    width: 100%;
    z-index: var(--z-index-snack-bars)
}

html[data-theme=big-dutchman] .ui-snack-bars-module_snackBars__qFLiP {
    left: var(--main-nav-height);
    width: calc(100% - var(--main-nav-height))
}

.ui-snack-bars-module_withChildren__deNeI {
    pointer-events: all;
    visibility: visible
}

.ui-snack-bars-module_relative__T-glb {
    left: auto;
    position: relative;
    right: auto;
    top: auto;
    z-index: 0
}

.ui-snack-bar,
.ui-snack-bar--clickable {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: stretch;
    -webkit-box-flex: 1;
    align-content: stretch;
    align-items: center;
    background-color: var(--color-information);
    border-right: 1px solid var(--color-white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: space-between;
    min-height: var(--snack-bar-min-height);
    overflow: hidden;
    padding: 4px 8px 4px var(--main-spacing);
    position: relative
}

.ui-snack-bar--clickable:last-child,
.ui-snack-bar:last-child {
    border-right: none
}

@media(min-width: 960px) {

    .ui-snack-bar,
    .ui-snack-bar--clickable {
        padding-right: 16px
    }
}

.ui-snack-bar__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.ui-snack-bar__icon {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 var(--icon-size);
    flex: 0 0 var(--icon-size);
    margin-right: 8px
}

@media(min-width: 960px) {
    .ui-snack-bar__icon {
        margin-right: 16px
    }
}

.ui-snack-bar__text {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 33%;
    flex: 1 0 33%
}

.ui-snack-bar__button {
    -ms-flex-preferred-size: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-basis: 100%;
    margin-top: 8px
}

.ui-snack-bar__button .ui-typography {
    margin-right: 8px;
    text-decoration: underline;
    width: auto
}

.ui-snack-bar--icon .ui-snack-bar__button {
    margin-left: calc(var(--icon-size) + 8px)
}

@media(min-width: 960px) {
    .ui-snack-bar--icon .ui-snack-bar__button {
        margin-left: calc(var(--icon-size) + 16px)
    }
}

.ui-snack-bar--information {
    background-color: var(--color-information)
}

.ui-snack-bar--alarm {
    background-color: var(--color-alarm)
}

.ui-snack-bar--warning {
    background-color: var(--color-warning)
}

html[data-theme=skov] .ui-snack-bar,
html[data-theme=skov] .ui-snack-bar--clickable {
    background-color: transparent
}

html[data-theme=skov] .ui-snack-bar--information {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

html[data-theme=skov] .ui-snack-bar--alarm {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#bf334f), to(#ab1f3b));
    background-image: linear-gradient(-180deg, #bf334f, #ab1f3b)
}

html[data-theme=skov] .ui-snack-bar--warning {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e7bb20), to(#cfa71c));
    background-image: linear-gradient(-180deg, #e7bb20, #cfa71c)
}

.ui-snack-bar--clickable {
    cursor: pointer
}

.ui-snack-bar--clickable * {
    position: relative;
    z-index: 1
}

.ui-snack-bar--clickable:after {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-snack-bar--clickable:hover:after {
    background-color: var(--color-primary-hover-background);
    opacity: 1;
    visibility: visible
}

.ui-snack-bar--clickable:active:after {
    background-color: var(--color-primary-active-background);
    opacity: 1;
    visibility: visible
}

.ui-snack-bar--truncate .ui-snack-bar__content {
    width: 100%
}

.ui-snack-bar--truncate.ui-snack-bar--clickable .ui-snack-bar__text {
    margin-right: 8px
}

.ui-snack-bar--truncate .ui-snack-bar__button {
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    margin-left: auto;
    margin-top: 0
}

@media(min-width: 960px) {
    .ui-snack-bar--truncate.ui-snack-bar--clickable .ui-snack-bar__text {
        margin-right: 16px
    }
}

.ui-sign,
.ui-sign--alarm,
.ui-sign--extra-large,
.ui-sign--extra-small,
.ui-sign--large,
.ui-sign--medium,
.ui-sign--small,
.ui-sign--success,
.ui-sign--trust-me,
.ui-sign--warning {
    --sign-size: var(--icon-size);
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--default-background-color);
    border-radius: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--sign-size);
    justify-content: center;
    width: var(--sign-size)
}

.ui-sign .ui-icon,
.ui-sign .ui-icon svg,
.ui-sign--alarm .ui-icon,
.ui-sign--alarm .ui-icon svg,
.ui-sign--extra-large .ui-icon,
.ui-sign--extra-large .ui-icon svg,
.ui-sign--extra-small .ui-icon,
.ui-sign--extra-small .ui-icon svg,
.ui-sign--large .ui-icon,
.ui-sign--large .ui-icon svg,
.ui-sign--medium .ui-icon,
.ui-sign--medium .ui-icon svg,
.ui-sign--small .ui-icon,
.ui-sign--small .ui-icon svg,
.ui-sign--success .ui-icon,
.ui-sign--success .ui-icon svg,
.ui-sign--trust-me .ui-icon,
.ui-sign--trust-me .ui-icon svg,
.ui-sign--warning .ui-icon,
.ui-sign--warning .ui-icon svg {
    height: 75%;
    width: 75%
}

.ui-sign--extra-small {
    --sign-size: var(--icon-size-extra-small)
}

.ui-sign--small {
    --sign-size: var(--icon-size-small)
}

.ui-sign--medium {
    --sign-size: var(--icon-size)
}

.ui-sign--large {
    --sign-size: var(--icon-size-large)
}

.ui-sign--extra-large {
    --sign-size: var(--icon-size-extra-large)
}

.ui-sign--alarm .ui-icon svg,
.ui-sign--success .ui-icon svg,
.ui-sign--trust-me .ui-icon svg,
.ui-sign--warning .ui-icon svg {
    fill: var(--color-white)
}

.ui-sign--alarm {
    background-color: var(--color-alarm)
}

.ui-sign--warning {
    background-color: var(--color-warning)
}

.ui-sign--success {
    background-color: var(--color-success)
}

.ui-sign--trust-me {
    background-color: var(--color-trust-me)
}

.ui-tabs,
.ui-tabs--background-color-grey,
.ui-tabs--fixed-size-icon,
.ui-tabs--no-border,
.ui-tabs--orientation-vertical {
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.ui-tabs--orientation-vertical {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    border-bottom: none;
    border-right: 1px solid var(--color-border);
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100%;
    width: auto
}

.ui-tabs--background-color-grey {
    background-color: var(--color-grey6)
}

.ui-tabs--fixed-size-icon {
    width: var(--tabs-fixed-size-icon)
}

.ui-tabs--no-border {
    border-bottom: none
}

.ui-tab,
.ui-tab--active,
.ui-tab--disabled {
    -ms-flex-negative: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    flex-shrink: 0;
    outline: none;
    padding: 16px var(--main-spacing);
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-tab--active:before,
.ui-tab--disabled:before,
.ui-tab:before {
    background-color: var(--color-active);
    bottom: -1px;
    content: "";
    height: 2px;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    visibility: hidden
}

@media(hover: hover) {

    .ui-tab--active:not(.ui-tab--disabled),
    .ui-tab--disabled:not(.ui-tab--disabled),
    .ui-tab:not(.ui-tab--disabled) {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-tab--active:not(.ui-tab--disabled):hover,
    .ui-tab--disabled:not(.ui-tab--disabled):hover,
    .ui-tab:not(.ui-tab--disabled):hover {
        background-color: var(--color-hover-background)
    }

    .ui-tab--active:not(.ui-tab--disabled):hover .ui-tab__label,
    .ui-tab--disabled:not(.ui-tab--disabled):hover .ui-tab__label,
    .ui-tab:not(.ui-tab--disabled):hover .ui-tab__label {
        color: var(--color-black)
    }

    .ui-tab--active:not(.ui-tab--disabled):hover .ui-tab__icon svg,
    .ui-tab--disabled:not(.ui-tab--disabled):hover .ui-tab__icon svg,
    .ui-tab:not(.ui-tab--disabled):hover .ui-tab__icon svg {
        fill: var(--color-black)
    }
}

.ui-tab--active:not(.ui-tab--disabled):active,
.ui-tab--disabled:not(.ui-tab--disabled):active,
.ui-tab:not(.ui-tab--disabled):active {
    background-color: var(--color-active-background)
}

.ui-tab__label {
    color: var(--color-font-label-grey);
    display: block
}

.ui-tab__icon,
.ui-tab__label {
    -webkit-transition: inherit;
    transition: inherit
}

.ui-tab__icon {
    margin-right: 12px
}

.ui-tab__icon svg {
    fill: var(--color-font-label-grey);
    -webkit-transition: inherit;
    transition: inherit
}

.ui-tab--active:before {
    opacity: 1;
    visibility: visible
}

.ui-tab--active .ui-tab__label {
    color: var(--color-black)
}

.ui-tab--active .ui-tab__icon svg {
    fill: var(--color-black)
}

.ui-tab--disabled {
    cursor: not-allowed;
    opacity: .6
}

.ui-tabs--orientation-vertical .ui-tab,
.ui-tabs--orientation-vertical .ui-tab--active,
.ui-tabs--orientation-vertical .ui-tab--disabled {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-grow: 0;
    height: var(--list-item-height);
    padding-bottom: 0;
    padding-top: 0;
    text-align: left;
    width: auto
}

.ui-tabs--orientation-vertical .ui-tab--active:before,
.ui-tabs--orientation-vertical .ui-tab--disabled:before,
.ui-tabs--orientation-vertical .ui-tab:before {
    bottom: 0;
    height: 100%;
    right: auto;
    top: 0;
    width: 2px
}

.ui-tabs--orientation-vertical .ui-tab--active {
    background-color: var(--color-white)
}

.ui-tab--indicator-color-trust-me:before {
    background-color: var(--color-trust-me)
}

.ui-tabs--fixed-size-icon .ui-tab,
.ui-tabs--fixed-size-icon .ui-tab--active,
.ui-tabs--fixed-size-icon .ui-tab--disabled {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    height: var(--tabs-fixed-size-icon);
    justify-content: center;
    max-height: var(--tabs-fixed-size-icon);
    padding-left: 0;
    padding-right: 0;
    width: var(--tabs-fixed-size-icon)
}

.ui-tabs--fixed-size-icon .ui-tab .ui-tab__icon,
.ui-tabs--fixed-size-icon .ui-tab--active .ui-tab__icon,
.ui-tabs--fixed-size-icon .ui-tab--disabled .ui-tab__icon {
    margin: 0
}

.ui-grid:not(.ui-grid--item) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    min-width: 100%;
    position: relative
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        width: 8.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-1.ui-grid--breakpoint-sm-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        width: 8.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-1.ui-grid--breakpoint-md-1.ui-grid--breakpoint-md-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        width: 8.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-1.ui-grid--breakpoint-lg-1.ui-grid--breakpoint-lg-1.ui-grid--breakpoint-lg-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        width: 8.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-1.ui-grid--breakpoint-xl-1.ui-grid--breakpoint-xl-1.ui-grid--breakpoint-xl-1.ui-grid--breakpoint-xl-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        width: 8.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        width: 16.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-2.ui-grid--breakpoint-sm-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        width: 16.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-2.ui-grid--breakpoint-md-2.ui-grid--breakpoint-md-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        width: 16.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-2.ui-grid--breakpoint-lg-2.ui-grid--breakpoint-lg-2.ui-grid--breakpoint-lg-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        width: 16.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-2.ui-grid--breakpoint-xl-2.ui-grid--breakpoint-xl-2.ui-grid--breakpoint-xl-2.ui-grid--breakpoint-xl-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        width: 16.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        width: 25%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-3.ui-grid--breakpoint-sm-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        width: 25%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-3.ui-grid--breakpoint-md-3.ui-grid--breakpoint-md-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        width: 25%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-3.ui-grid--breakpoint-lg-3.ui-grid--breakpoint-lg-3.ui-grid--breakpoint-lg-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        width: 25%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-3.ui-grid--breakpoint-xl-3.ui-grid--breakpoint-xl-3.ui-grid--breakpoint-xl-3.ui-grid--breakpoint-xl-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        width: 25%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        width: 33.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-4.ui-grid--breakpoint-sm-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        width: 33.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-4.ui-grid--breakpoint-md-4.ui-grid--breakpoint-md-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        width: 33.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-4.ui-grid--breakpoint-lg-4.ui-grid--breakpoint-lg-4.ui-grid--breakpoint-lg-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        width: 33.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-4.ui-grid--breakpoint-xl-4.ui-grid--breakpoint-xl-4.ui-grid--breakpoint-xl-4.ui-grid--breakpoint-xl-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        width: 33.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        width: 41.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-5.ui-grid--breakpoint-sm-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        width: 41.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-5.ui-grid--breakpoint-md-5.ui-grid--breakpoint-md-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        width: 41.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-5.ui-grid--breakpoint-lg-5.ui-grid--breakpoint-lg-5.ui-grid--breakpoint-lg-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        width: 41.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-5.ui-grid--breakpoint-xl-5.ui-grid--breakpoint-xl-5.ui-grid--breakpoint-xl-5.ui-grid--breakpoint-xl-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        width: 41.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        width: 50%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-6.ui-grid--breakpoint-sm-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        width: 50%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-6.ui-grid--breakpoint-md-6.ui-grid--breakpoint-md-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        width: 50%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-6.ui-grid--breakpoint-lg-6.ui-grid--breakpoint-lg-6.ui-grid--breakpoint-lg-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        width: 50%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-6.ui-grid--breakpoint-xl-6.ui-grid--breakpoint-xl-6.ui-grid--breakpoint-xl-6.ui-grid--breakpoint-xl-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        width: 50%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        width: 58.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-7.ui-grid--breakpoint-sm-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        width: 58.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-7.ui-grid--breakpoint-md-7.ui-grid--breakpoint-md-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        width: 58.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-7.ui-grid--breakpoint-lg-7.ui-grid--breakpoint-lg-7.ui-grid--breakpoint-lg-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        width: 58.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-7.ui-grid--breakpoint-xl-7.ui-grid--breakpoint-xl-7.ui-grid--breakpoint-xl-7.ui-grid--breakpoint-xl-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        width: 58.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        width: 66.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-8.ui-grid--breakpoint-sm-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        width: 66.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-8.ui-grid--breakpoint-md-8.ui-grid--breakpoint-md-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        width: 66.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-8.ui-grid--breakpoint-lg-8.ui-grid--breakpoint-lg-8.ui-grid--breakpoint-lg-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        width: 66.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-8.ui-grid--breakpoint-xl-8.ui-grid--breakpoint-xl-8.ui-grid--breakpoint-xl-8.ui-grid--breakpoint-xl-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        width: 66.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        width: 75%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-9.ui-grid--breakpoint-sm-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        width: 75%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-9.ui-grid--breakpoint-md-9.ui-grid--breakpoint-md-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        width: 75%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-9.ui-grid--breakpoint-lg-9.ui-grid--breakpoint-lg-9.ui-grid--breakpoint-lg-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        width: 75%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-9.ui-grid--breakpoint-xl-9.ui-grid--breakpoint-xl-9.ui-grid--breakpoint-xl-9.ui-grid--breakpoint-xl-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        width: 75%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        width: 83.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-10.ui-grid--breakpoint-sm-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        width: 83.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-10.ui-grid--breakpoint-md-10.ui-grid--breakpoint-md-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        width: 83.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-10.ui-grid--breakpoint-lg-10.ui-grid--breakpoint-lg-10.ui-grid--breakpoint-lg-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        width: 83.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-10.ui-grid--breakpoint-xl-10.ui-grid--breakpoint-xl-10.ui-grid--breakpoint-xl-10.ui-grid--breakpoint-xl-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        width: 83.33333%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        width: 91.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-11.ui-grid--breakpoint-sm-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        width: 91.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-11.ui-grid--breakpoint-md-11.ui-grid--breakpoint-md-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        width: 91.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-11.ui-grid--breakpoint-lg-11.ui-grid--breakpoint-lg-11.ui-grid--breakpoint-lg-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        width: 91.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-11.ui-grid--breakpoint-xl-11.ui-grid--breakpoint-xl-11.ui-grid--breakpoint-xl-11.ui-grid--breakpoint-xl-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        width: 91.66667%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 0) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        width: 100%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xs-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 640px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-12.ui-grid--breakpoint-sm-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        width: 100%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-sm-auto.ui-grid--breakpoint-sm-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 960px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-12.ui-grid--breakpoint-md-12.ui-grid--breakpoint-md-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        width: 100%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto.ui-grid--breakpoint-md-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1152px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-12.ui-grid--breakpoint-lg-12.ui-grid--breakpoint-lg-12.ui-grid--breakpoint-lg-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        width: 100%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto.ui-grid--breakpoint-lg-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

@media(min-width: 1280px) {
    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-12.ui-grid--breakpoint-xl-12.ui-grid--breakpoint-xl-12.ui-grid--breakpoint-xl-12.ui-grid--breakpoint-xl-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        width: 100%
    }

    .ui-grid:not(.ui-grid--item) .ui-grid--item.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto.ui-grid--breakpoint-xl-auto {
        -ms-flex-negative: 1;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 1;
        width: auto
    }
}

.ui-grid--item.ui-grid--item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 0;
    min-width: 0;
    width: 100%
}

.ui-grid--gutter-main {
    margin: calc((var(--gutter-main)/2)*-1);
    width: calc(100% + var(--gutter-main))
}

.ui-grid--gutter-main>.ui-grid--item {
    padding: calc(var(--gutter-main)/2)
}

.ui-grid--gutter-extra-small {
    margin: calc((var(--gutter-extra-small)/2)*-1);
    width: calc(100% + var(--gutter-extra-small))
}

.ui-grid--gutter-extra-small>.ui-grid--item {
    padding: calc(var(--gutter-extra-small)/2)
}

.ui-grid--gutter-small {
    margin: calc((var(--gutter-small)/2)*-1);
    width: calc(100% + var(--gutter-small))
}

.ui-grid--gutter-small>.ui-grid--item {
    padding: calc(var(--gutter-small)/2)
}

.ui-grid--gutter-medium {
    margin: calc((var(--gutter-medium)/2)*-1);
    width: calc(100% + var(--gutter-medium))
}

.ui-grid--gutter-medium>.ui-grid--item {
    padding: calc(var(--gutter-medium)/2)
}

.ui-grid--gutter-large {
    margin: calc((var(--gutter-large)/2)*-1);
    width: calc(100% + var(--gutter-large))
}

.ui-grid--gutter-large>.ui-grid--item {
    padding: calc(var(--gutter-large)/2)
}

.ui-grid--gutter-extra-large {
    margin: calc((var(--gutter-extra-large)/2)*-1);
    width: calc(100% + var(--gutter-extra-large))
}

.ui-grid--gutter-extra-large>.ui-grid--item {
    padding: calc(var(--gutter-extra-large)/2)
}

.ui-grid--direction-column.ui-grid--direction-column {
    height: auto;
    min-height: 100%
}

.ui-grid--direction-column.ui-grid--direction-column>.ui-grid--item {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1
}

.ui-jumbotron {
    margin: 0 auto;
    max-width: 650px;
    min-height: 100%;
    padding: var(--main-spacing) 0;
    text-align: center
}

@media(min-width: 960px) {
    .ui-jumbotron {
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: center
    }
}

.ui-jumbotron__icon {
    margin: 0 auto 32px
}

.ui-jumbotron__icon,
.ui-jumbotron__icon svg {
    height: 180px;
    width: auto
}

@media(min-width: 960px) {
    .ui-jumbotron__icon {
        height: 280px;
        margin-bottom: 64px
    }

    .ui-jumbotron__icon svg {
        height: 280px
    }
}

html[data-theme=skov] .ui-jumbotron__icon svg {
    fill: #787878
}

html[data-theme=big-dutchman] .ui-jumbotron__icon svg {
    fill: #a0a0a0
}

html[data-theme=big-dutchman] .ui-house-selector {
    -webkit-box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13);
    box-shadow: 4px 7px 10px 0 rgba(0, 0, 0, .13);
    height: 40px
}

html[data-theme=big-dutchman] .ui-house-selector__options li {
    background-color: var(--color-white);
    cursor: pointer;
    min-width: var(--button-height-small);
    padding: 16px
}

html[data-theme=big-dutchman] .ui-house-selector__options li:first-child {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px
}

html[data-theme=big-dutchman] .ui-house-selector__options li:last-child {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px
}

html[data-theme=big-dutchman] .ui-house-selector__options li .ui-icon svg {
    fill: var(--color-font-label)
}

html[data-theme=big-dutchman] .ui-house-selector__options li.selected {
    background-color: var(--color-active)
}

html[data-theme=big-dutchman] .ui-house-selector__options li.selected .ui-icon svg {
    fill: var(--color-white)
}

html[data-theme=big-dutchman] .ui-house-selector__options li:after {
    background-color: var(--color-active-background);
    border-radius: 4px;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    visibility: hidden
}

html[data-theme=big-dutchman] .ui-house-selector__options li:active:after {
    opacity: 1;
    visibility: visible
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-house-selector__options li {
        min-width: 60px
    }
}

html[data-theme=big-dutchman] .ui-house-selector .ui-notification-counter {
    -webkit-box-shadow: 0 0 0 2px var(--color-primary);
    box-shadow: 0 0 0 2px var(--color-primary);
    right: -9px;
    top: -9px
}

html[data-theme=big-dutchman] .ui-house-selector__background {
    display: none
}

html[data-theme=skov] .ui-house-selector {
    background-color: #406E00;
    border-radius: var(--button-height-small);
    height: var(--button-height-small);
    padding: 4px
}

html[data-theme=skov] .ui-house-selector__options {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

html[data-theme=skov] .ui-house-selector__options li {
    cursor: pointer;
    min-width: var(--main-nav-height-small);
    padding: 0 4px
}

html[data-theme=skov] .ui-house-selector__options li:first-child {
    min-width: calc(var(--button-height-small) - 8px)
}

html[data-theme=skov] .ui-house-selector__options li:last-child {
    padding: 0
}

html[data-theme=skov] .ui-house-selector__options li .ui-icon svg {
    fill: var(--color-font-primary)
}

html[data-theme=skov] .ui-house-selector__options li.selected .ui-house-selector__background {
    -webkit-animation: background .55s;
    animation: background .55s;
    opacity: 1;
    visibility: visible
}

html[data-theme=skov] .ui-house-selector__options li.selected .ui-icon svg {
    fill: #fff
}

html[data-theme=skov] .ui-house-selector__options li:after {
    background-color: var(--color-active-background);
    border-radius: calc(var(--button-height-small) + 4px);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    visibility: hidden
}

html[data-theme=skov] .ui-house-selector__options li:active:after {
    opacity: 1;
    visibility: visible
}

html[data-theme=skov] .ui-house-selector__options li:active .ui-house-selector__background {
    -webkit-box-shadow: none;
    box-shadow: none
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-house-selector__options li {
        margin-right: 8px
    }

    html[data-theme=skov] .ui-house-selector__options li:last-child {
        margin-right: 0
    }
}

html[data-theme=skov] .ui-house-selector .ui-notification-counter {
    right: 0;
    top: -9px
}

html[data-theme=skov] .ui-house-selector__background {
    background-color: #30da59;
    border-radius: calc(var(--button-height-small) + 4px);
    bottom: 0;
    -webkit-box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
    visibility: hidden
}

@-webkit-keyframes background {
    0% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    25% {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes background {
    0% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    25% {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.ui-house-selector {
    -ms-flex-item-align: center;
    align-self: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px;
    position: relative
}

@media(min-width: 960px) {
    .ui-house-selector {
        margin-right: 16px
    }
}

.ui-house-selector__options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-house-selector__options li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 100%;
    position: relative;
    -webkit-transition: .4s;
    transition: .4s
}

.ui-house-selector__options li label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-house-selector__options li input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.ui-house-selector__options li .ui-icon,
.ui-house-selector__options li .ui-typography {
    position: absolute;
    z-index: 1
}

.ui-house-selector__options li.selected .ui-house-selector__label {
    color: var(--color-white)
}

.ui-house-selector .ui-notification-counter {
    pointer-events: none
}

.ui-house-selector__label {
    color: var(--color-font-primary)
}

html[data-theme=big-dutchman] .ui-house-selector__label {
    color: var(--color-font-label)
}

.ui-toolbar,
.ui-toolbar--fixed {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-primary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--toolbar-height);
    padding: 0 var(--main-spacing);
    position: relative;
    z-index: 1
}

.ui-toolbar .ui-typography,
.ui-toolbar--fixed .ui-typography {
    color: var(--color-white)
}

.ui-toolbar__icon {
    background-color: transparent;
    border: 0;
    margin-right: 24px;
    outline: none;
    padding: 0;
    position: relative
}

.ui-toolbar__icon svg {
    fill: var(--color-white)
}

.ui-toolbar__icon.ui-toolbar__icon-has-click-listener {
    cursor: pointer
}

.ui-toolbar__icon.ui-toolbar__icon-has-click-listener:after {
    background-color: var(--color-active-background);
    border-radius: 100%;
    bottom: 0;
    content: "";
    height: calc(var(--icon-size)*2);
    left: 0;
    left: 50%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    visibility: hidden;
    width: calc(var(--icon-size)*2)
}

.ui-toolbar__icon.ui-toolbar__icon-has-click-listener:active:after {
    opacity: 1;
    visibility: visible
}

.ui-toolbar__clearer {
    height: var(--toolbar-height)
}

.ui-toolbar--fixed {
    left: 0;
    position: fixed;
    right: 0;
    top: 0
}

.ui-progress-bar,
.ui-progress-bar--completed,
.ui-progress-bar--size,
.ui-progress-bar--with-checkmark,
.ui-progress-bar--with-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    width: 100%
}

.ui-progress-bar__container {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    width: 100%
}

.ui-progress-bar__bar-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--progress-bar-height)
}

.ui-progress-bar__bar-container .ui-progress-indicator {
    position: absolute;
    right: 8px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1
}

.ui-progress-bar__bar {
    height: 100%;
    position: relative;
    width: 100%
}

.ui-progress-bar__progress {
    background-color: var(--color-grey4);
    border-radius: var(--border-radius);
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0
}

.ui-progress-bar__progress span {
    background-color: var(--color-primary);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-progress-bar__indicator {
    background-color: var(--color-chart-reference-line);
    border-radius: 2px;
    bottom: -2px;
    height: var(--progress-bar-height)4px;
    position: absolute;
    right: 0;
    top: -2px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 2px
}

.ui-progress-bar__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px
}

.ui-progress-bar__title>* {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.ui-progress-bar__title .ui-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-progress-bar__description {
    margin-top: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-progress-bar__progress-info {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    padding-left: 8px;
    text-align: right
}

.ui-progress-bar__progress-info .ui-icon {
    margin-left: 16px
}

.ui-progress-bar__progress-info .ui-typography span {
    color: var(--color-grey3)
}

.ui-progress-bar__checkmark {
    -ms-flex-negative: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-grey4);
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-shrink: 0;
    height: var(--icon-size);
    justify-content: center;
    margin-left: 8px;
    width: var(--icon-size)
}

.ui-progress-bar__checkmark .ui-icon svg {
    fill: var(--color-white)
}

.ui-progress-bar__icon {
    margin-right: 8px
}

.ui-progress-bar--size-small .ui-progress-bar__bar {
    height: var(--progress-bar-height-small)
}

.ui-progress-bar--size-small .ui-progress-bar__bar-container {
    height: calc(var(--progress-bar-height-small) + 4px);
    padding: 0 calc(var(--icon-size) + 8px)
}

.ui-progress-bar--size-small .ui-progress-bar__checkmark,
.ui-progress-bar--size-small .ui-progress-bar__icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-progress-bar--size-small .ui-progress-bar__icon {
    left: 0
}

.ui-progress-bar--size-small .ui-progress-bar__checkmark {
    right: 0
}

.ui-progress-bar--size-small .ui-progress-bar__title {
    margin-bottom: 0
}

.ui-progress-bar--size-small .ui-progress-bar__indicator {
    height: var(--progress-bar-height-small)4px
}

.ui-progress-bar--size-small .ui-progress-bar__description {
    margin-top: 4px
}

.ui-progress-bar--size-large .ui-progress-bar__bar-container {
    height: var(--progress-bar-height-large)
}

.ui-progress-bar--size-large .ui-progress-bar__checkmark {
    height: var(--progress-bar-height-large);
    width: var(--progress-bar-height-large)
}

.ui-progress-bar--bar-type-primary-light .ui-progress-bar__progress span,
.ui-progress-bar--bar-type-primary-light.ui-progress-bar--completed .ui-progress-bar__checkmark {
    background-color: var(--color-primary-light)
}

.ui-progress-bar--bar-type-alarm .ui-progress-bar__progress span,
.ui-progress-bar--bar-type-alarm.ui-progress-bar--completed .ui-progress-bar__checkmark {
    background-color: var(--color-alarm)
}

.ui-progress-bar--bar-type-warning .ui-progress-bar__progress span,
.ui-progress-bar--bar-type-warning.ui-progress-bar--completed .ui-progress-bar__checkmark {
    background-color: var(--color-warning)
}

.ui-progress-bar--bar-type-success .ui-progress-bar__progress span,
.ui-progress-bar--bar-type-success.ui-progress-bar--completed .ui-progress-bar__checkmark {
    background-color: var(--color-green)
}

.ui-progress-bar--theme-primary .ui-progress-bar__icon svg {
    fill: var(--color-font-primary)
}

.ui-progress-bar--theme-primary .ui-progress-bar__title>.ui-typography {
    color: var(--color-font-primary)
}

.ui-progress-bar--theme-primary .ui-progress-bar__bar .ui-progress-indicator svg path {
    fill: var(--color-white)
}

.ui-progress-bar--theme-primary .ui-progress-bar__description {
    color: var(--color-font-primary)
}

.ui-progress-bar--theme-primary .ui-progress-bar__progress {
    background-color: var(--color-border-primary)
}

.ui-progress-bar--theme-primary .ui-progress-bar__progress-info .ui-typography {
    color: var(--color-white)
}

.ui-progress-bar--theme-primary .ui-progress-bar__progress-info .ui-typography span {
    color: var(--color-font-primary)
}

.ui-progress-bar--theme-primary .ui-progress-bar__progress-info .ui-icon svg {
    fill: var(--color-white)
}

.ui-progress-bar--with-icon .ui-progress-bar__description,
.ui-progress-bar--with-icon .ui-progress-bar__title {
    padding-left: calc(var(--icon-size) + 8px)
}

.ui-progress-bar--completed .ui-progress-bar__checkmark {
    background-color: var(--color-primary)
}

.ui-progress-bar--with-checkmark .ui-progress-bar__description,
.ui-progress-bar--with-checkmark .ui-progress-bar__title {
    padding-right: calc(var(--icon-size) + 8px)
}

.ui-progress-indicator,
.ui-progress-indicator--animated,
.ui-progress-indicator--flipped,
.ui-progress-indicator--size-small {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-progress-indicator .ui-icon,
.ui-progress-indicator--animated .ui-icon,
.ui-progress-indicator--flipped .ui-icon,
.ui-progress-indicator--size-small .ui-icon {
    margin-right: 4px
}

.ui-progress-indicator .ui-icon:last-of-type,
.ui-progress-indicator--animated .ui-icon:last-of-type,
.ui-progress-indicator--flipped .ui-icon:last-of-type,
.ui-progress-indicator--size-small .ui-icon:last-of-type {
    margin-right: 0
}

.ui-progress-indicator .ui-icon svg,
.ui-progress-indicator--animated .ui-icon svg,
.ui-progress-indicator--flipped .ui-icon svg,
.ui-progress-indicator--size-small .ui-icon svg {
    fill: var(--color-grey2)
}

.ui-progress-indicator--flipped {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ui-progress-indicator--animated .ui-icon {
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: progress-indicator-pulse;
    animation-name: progress-indicator-pulse;
    opacity: .2
}

.ui-progress-indicator--animated .ui-icon:nth-child(2) {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.ui-progress-indicator--animated .ui-icon:nth-child(3) {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.ui-progress-indicator--size-small .ui-icon:first-child {
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    width: 10px
}

.ui-progress-indicator--size-small .ui-icon:nth-child(2) {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    width: 5px
}

@-webkit-keyframes progress-indicator-pulse {
    0% {
        opacity: .2
    }

    50% {
        opacity: 1
    }

    to {
        opacity: .2
    }
}

@keyframes progress-indicator-pulse {
    0% {
        opacity: .2
    }

    50% {
        opacity: 1
    }

    to {
        opacity: .2
    }
}

.ui-gauge-ticks__inner-tick,
.ui-gauge-ticks__outer-tick {
    stroke: var(--color-border-primary);
    stroke-width: 1px
}

.ui-gauge-ticks--transparent .ui-gauge-ticks__background {
    display: none
}

html[data-theme=skov] .ui-gauge-ticks__background {
    stroke: rgba(51, 104, 140, .2)
}

html[data-theme=skov] .ui-gauge-ticks--transparent .ui-gauge-ticks__inner-tick {
    stroke: #dcdcdc
}

html[data-theme=big-dutchman] .ui-gauge-ticks__background {
    stroke: hsla(0, 0%, 63%, .1)
}

html[data-theme=big-dutchman] .ui-gauge-ticks--transparent .ui-gauge-ticks__inner-tick {
    stroke: hsla(0, 0%, 63%, .5)
}

.ui-value-wheel,
.ui-value-wheel--with-status {
    height: 350px;
    overflow: hidden;
    position: relative;
    width: 350px
}

@media(min-width: 960px) {

    .ui-value-wheel,
    .ui-value-wheel--with-status {
        height: 620px;
        width: 620px
    }
}

.ui-value-wheel__value {
    left: 50%;
    margin: 0 auto;
    pointer-events: none;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-value-wheel__value__top-label {
    top: 0
}

.ui-value-wheel__value__bottom-label {
    bottom: 0
}

.ui-value-wheel__value__value {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: flex-end;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    margin: 16px 0;
    padding-bottom: 8px;
    word-break: keep-all
}

.ui-value-wheel__value__value>span:first-child {
    font-size: 40px
}

@media(min-width: 960px) {
    .ui-value-wheel__value__value>span:first-child {
        font-size: 82px
    }
}

.ui-value-wheel__value__unit {
    margin-bottom: 15px;
    margin-left: 4px
}

.ui-value-wheel__circle,
.ui-value-wheel__gauge-ticks {
    pointer-events: none
}

.ui-value-wheel__circle,
.ui-value-wheel__gauge-ticks,
.ui-value-wheel__handle {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -ms-touch-action: none;
    touch-action: none
}

.ui-value-wheel__handle {
    z-index: 1
}

.ui-value-wheel__handle__circle {
    pointer-events: none;
    -ms-touch-action: none;
    touch-action: none
}

.ui-value-wheel__handle__circle-line {
    stroke-width: 2px
}

.ui-value-wheel__status-ring {
    bottom: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .5s;
    transition: .5s;
    visibility: hidden;
    will-change: stroke
}

.ui-value-wheel__status-ring--alarm circle {
    stroke: var(--color-alarm)
}

.ui-value-wheel__status-ring--warning circle {
    stroke: var(--color-warning)
}

.ui-value-wheel--with-status .ui-value-wheel__status-ring {
    opacity: 1;
    visibility: visible
}

html[data-theme=skov] .ui-value-wheel__value__bottom-label,
html[data-theme=skov] .ui-value-wheel__value__top-label {
    color: #b4e6c6
}

html[data-theme=skov] .ui-value-wheel__value__unit,
html[data-theme=skov] .ui-value-wheel__value__value {
    color: #fff
}

html[data-theme=skov] .ui-value-wheel__value__value {
    border-color: #406E00
}

html[data-theme=skov] .ui-value-wheel__circle circle {
    stroke: #fff
}

html[data-theme=skov] .ui-value-wheel__handle__snake {
    stroke: #30da59
}

html[data-theme=skov] .ui-value-wheel__handle__snake-border {
    stop-color: #30da59
}

html[data-theme=skov] .ui-value-wheel__handle__circle {
    fill: #fff
}

html[data-theme=skov] .ui-value-wheel__handle__circle-line {
    stroke: #a0a0a0
}

html[data-theme=skov] .ui-value-wheel__handle__background-gradient-end,
html[data-theme=skov] .ui-value-wheel__handle__background-gradient-middle,
html[data-theme=skov] .ui-value-wheel__handle__background-gradient-start {
    stop-color: #30da59
}

html[data-theme=big-dutchman] .ui-value-wheel__value__bottom-label,
html[data-theme=big-dutchman] .ui-value-wheel__value__top-label {
    color: #dcdcdc
}

html[data-theme=big-dutchman] .ui-value-wheel__value__unit,
html[data-theme=big-dutchman] .ui-value-wheel__value__value {
    color: #fff
}

html[data-theme=big-dutchman] .ui-value-wheel__value__value {
    border-color: #686868
}

html[data-theme=big-dutchman] .ui-value-wheel__circle circle {
    stroke: #fff
}

html[data-theme=big-dutchman] .ui-value-wheel__handle__snake {
    stroke: #ea6f18
}

html[data-theme=big-dutchman] .ui-value-wheel__handle__snake-border {
    stop-color: #ea6f18
}

html[data-theme=big-dutchman] .ui-value-wheel__handle__circle {
    fill: #fff
}

html[data-theme=big-dutchman] .ui-value-wheel__handle__circle-line {
    stroke: #3a3d3d
}

html[data-theme=big-dutchman] .ui-value-wheel__handle__background-gradient-end,
html[data-theme=big-dutchman] .ui-value-wheel__handle__background-gradient-middle,
html[data-theme=big-dutchman] .ui-value-wheel__handle__background-gradient-start {
    stop-color: #ea6f18
}

.ui-side-menu,
.ui-side-menu--fixed,
.ui-side-menu--primary,
.ui-side-menu--toggled {
    -webkit-overflow-scrolling: touch;
    background-color: var(--default-background-color);
    max-height: 100%;
    overflow-y: auto;
    padding-bottom: calc(var(--main-nav-height)*1.5);
    position: relative;
    width: var(--side-menu-width)
}

@media(min-width: 960px) {

    .ui-side-menu,
    .ui-side-menu--fixed,
    .ui-side-menu--primary,
    .ui-side-menu--toggled {
        border-right: 1px solid var(--color-border)
    }
}

.ui-side-menu__toggle {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    height: calc(100vh - var(--main-nav-height));
    left: 0;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: fixed;
    right: 0;
    top: var(--main-nav-height);
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    width: var(--side-menu-toggle-width);
    z-index: calc(var(--z-index-side-menu) - 1)
}

.ui-side-menu__toggle:after {
    background-color: var(--color-white);
    bottom: 0;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .3);
    box-shadow: 0 0 20px rgba(0, 0, 0, .3);
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: calc(var(--side-menu-toggle-width)/2)
}

@media(min-width: 960px) {
    .ui-side-menu__toggle {
        display: none
    }
}

.ui-side-menu__toggle-icon {
    background-color: var(--color-white);
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(var(--side-menu-toggle-width)*1.5);
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: calc(var(--side-menu-toggle-width)/2 + 8px);
    z-index: 1
}

.ui-side-menu__toggle-icon .ui-icon {
    background-color: var(--color-active);
    border-radius: 100%;
    height: var(--icon-size-small);
    margin: auto;
    width: var(--icon-size-small)
}

.ui-side-menu__toggle-icon .ui-icon svg {
    fill: var(--color-white)
}

.ui-side-menu--fixed {
    bottom: 0;
    left: 0;
    position: fixed;
    top: 0;
    z-index: var(--z-index-side-menu)
}

.ui-side-menu--fixed+.ui-veil {
    -webkit-transition: .5s;
    transition: .5s;
    z-index: calc(var(--z-index-side-menu) - 1)
}

@media(min-width: 640px) {
    .ui-side-menu--fixed {
        -webkit-transform: translateX(-420px);
        transform: translateX(-420px);
        -webkit-transition: all .35s ease-in;
        transition: all .35s ease-in;
        width: 420px;
        will-change: transform
    }
}

@media(min-width: 960px) {
    .ui-side-menu--fixed {
        top: var(--main-nav-height);
        -webkit-transform: none;
        transform: none;
        -webkit-transition: 0ms;
        transition: 0ms;
        width: var(--side-menu-width);
        z-index: 1
    }

    .ui-side-menu--fixed+.ui-veil {
        display: none
    }
}

.ui-side-menu--toggled {
    -webkit-transform: none;
    transform: none;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.ui-side-menu--toggled .ui-side-menu__children {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

html.side-menu-open {
    overflow: hidden;
    -ms-touch-action: none;
    touch-action: none
}

@media(min-width: 960px) {
    html.side-menu-open {
        overflow: auto;
        -ms-touch-action: initial;
        touch-action: auto
    }
}

.ui-side-menu--primary {
    background-color: transparent;
    border-right: 0
}

html[data-theme=big-dutchman] .ui-side-menu__toggle {
    left: var(--main-nav-height)
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-side-menu--fixed {
        left: var(--main-nav-height)
    }
}

.ui-side-menu-item,
.ui-side-menu-item[data-expanded=true] {
    cursor: pointer
}

.ui-side-menu-item__toggle a,
.ui-side-menu-item__toggle button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-user-drag: none;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--side-menu-item-height);
    outline: none;
    padding: 0 var(--main-spacing);
    position: relative;
    text-align: left;
    width: 100%
}

.ui-side-menu-item__toggle a.ui-side-menu-item__button__no_children,
.ui-side-menu-item__toggle button.ui-side-menu-item__button__no_children {
    padding-right: var(--main-spacing)
}

.ui-side-menu-item__toggle a.ui-side-menu-item__button__no_children .ui-side-menu-item__title,
.ui-side-menu-item__toggle button.ui-side-menu-item__button__no_children .ui-side-menu-item__title {
    width: 100%
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a,
.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button {
    border-bottom: 1px solid var(--color-border)
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:after,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:before {
    background-color: var(--color-border);
    content: "";
    height: 1px;
    left: var(--main-spacing);
    position: absolute;
    right: 0
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:before {
    top: 0
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:after {
    bottom: -1px
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active {
    background-color: var(--color-white)
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active:before,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active:before,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active:before {
    left: 0
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active:after,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active:after,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active:after {
    background-color: var(--color-active);
    height: 2px;
    left: 0;
    z-index: 1
}

@media(hover: hover) {

    .ui-side-menu-item__toggle a:hover,
    .ui-side-menu-item__toggle button:hover {
        background-color: var(--color-hover-background) !important
    }

    .ui-side-menu-item__toggle a:hover:after,
    .ui-side-menu-item__toggle a:hover:before,
    .ui-side-menu-item__toggle button:hover:after,
    .ui-side-menu-item__toggle button:hover:before {
        left: 0 !important
    }
}

.ui-side-menu-item__toggle a:active,
.ui-side-menu-item__toggle button:active {
    background-color: var(--color-active-background) !important
}

.ui-side-menu-item__toggle a:active:after,
.ui-side-menu-item__toggle a:active:before,
.ui-side-menu-item__toggle button:active:after,
.ui-side-menu-item__toggle button:active:before {
    left: 0 !important
}

.ui-side-menu-item__chevron {
    height: var(--main-nav-height);
    position: relative;
    width: var(--main-nav-height)
}

.ui-side-menu-item__chevron .ui-icon {
    bottom: 12px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-side-menu-item__chevron .ui-icon svg {
    fill: var(--color-font-label)
}

@media(min-width: 960px) {
    .ui-side-menu-item__chevron .ui-icon {
        bottom: 21px
    }
}

.ui-side-menu-item__dropdown {
    max-height: 0;
    overflow: hidden
}

.ui-side-menu-item[data-level="1"] {
    position: relative
}

.ui-side-menu-item[data-level="1"] .ui-side-menu-item[data-level="2"]:first-of-type>.ui-side-menu-item__toggle a:before,
.ui-side-menu-item[data-level="1"] .ui-side-menu-item[data-level="2"]:first-of-type>.ui-side-menu-item__toggle button:before {
    display: none !important
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a,
.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    padding-right: var(--main-nav-height-small);
    position: relative
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title {
    bottom: 15%;
    font-weight: var(--font-weight-bold);
    overflow: hidden;
    position: absolute;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - var(--main-nav-height))
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a .ui-icon,
.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button .ui-icon {
    bottom: 15%;
    position: absolute
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__chevron {
    height: var(--main-nav-height);
    position: absolute;
    right: 0;
    top: 0
}

.ui-side-menu-item[data-level="1"]>.ui-side-menu-item__chevron .ui-icon {
    bottom: calc(15% + 4px);
    position: absolute;
    right: 0
}

.ui-side-menu-item[data-level="1"][data-expanded=true]>.ui-side-menu-item__chevron .ui-icon {
    -webkit-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg)
}

@media(min-width: 960px) {
    .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__chevron .ui-icon {
        bottom: calc(15% + 6px)
    }
}

.ui-side-menu-item[data-level="2"],
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button {
    position: relative
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.ui-side-menu-item__button__no_children .ui-side-menu-item__title,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.ui-side-menu-item__button__no_children .ui-side-menu-item__title {
    margin-right: 0
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title {
    margin-right: var(--main-nav-height);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-icon,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-icon {
    margin-right: 16px
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-icon svg,
.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-icon svg {
    fill: var(--color-font-subtitle1)
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__chevron {
    height: var(--main-nav-height);
    position: absolute;
    right: 0;
    top: 0;
    width: var(--main-nav-height)
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__chevron:before {
    background-color: var(--color-black);
    border-radius: 100%;
    bottom: 8px;
    content: "";
    position: absolute;
    top: 8px;
    width: 1px
}

.ui-side-menu-item[data-level="2"]>.ui-side-menu-item__chevron .ui-icon {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-side-menu-item[data-level="2"][data-expanded=true] {
    background-color: rgba(0, 0, 0, .03)
}

.ui-side-menu-item[data-level="2"][data-expanded=true]>.ui-side-menu-item__chevron .ui-icon {
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg)
}

@media(min-width: 960px) {
    .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__chevron {
        display: none
    }

    .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
    .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title {
        margin-right: 0
    }
}

.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button {
    height: var(--side-menu-item-height);
    padding-left: calc(var(--main-spacing) + 32px + var(--icon-size));
    position: relative
}

.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    word-break: break-word
}

.ui-side-menu-item__title {
    line-height: 1.4 !important
}

.ui-side-menu-item__sub-title {
    color: var(--color-font-subtitle1);
    display: block;
    line-height: 1.4 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-side-menu-item[data-expanded=true]>.ui-side-menu-item__dropdown {
    max-height: 100%;
    overflow: visible
}

.ui-side-menu-item[data-expanded=true] .ui-side-menu-item:last-of-type .ui-side-menu-item__toggle a:after,
.ui-side-menu-item[data-expanded=true] .ui-side-menu-item:last-of-type .ui-side-menu-item__toggle button:after {
    left: 0
}

.ui-side-menu--primary .ui-side-menu-item .ui-side-menu-item__sub-title {
    color: var(--color-font-primary)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button .ui-side-menu-item__title {
    color: var(--color-white)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__chevron .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__chevron .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__chevron .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button .ui-icon svg {
    fill: var(--color-white)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle a,
.ui-side-menu--primary .ui-side-menu-item[data-level="1"]>.ui-side-menu-item__toggle button {
    border-bottom: 2px solid var(--color-border-primary)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"][data-expanded=true] {
    background-color: rgba(0, 0, 0, .1)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button:before,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a:before,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button:before {
    background-color: var(--color-border-primary)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active {
    background-color: transparent
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active .ui-side-menu-item__title,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active .ui-side-menu-item__title {
    color: var(--color-active)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active .ui-icon svg,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active .ui-icon svg {
    fill: var(--color-active)
}

.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle a.active:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle button.active:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle a.active:after,
.ui-side-menu--primary .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle button.active:after {
    background-color: var(--color-active);
    display: block;
    height: 2px
}

html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active {
    background-color: var(--color-active)
}

html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active:after,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active:after,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active:after,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active:after {
    content: none
}

html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active .ui-side-menu-item__title,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active .ui-side-menu-item__title,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active .ui-side-menu-item__title,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active .ui-side-menu-item__title {
    color: var(--color-white)
}

html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active .ui-icon svg,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active .ui-icon svg,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active .ui-icon svg,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active .ui-icon svg {
    fill: var(--color-white)
}

@media(hover: hover) {

    html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active:hover,
    html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active:hover,
    html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active:hover,
    html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active:hover {
        background-color: var(--color-active) !important;
        opacity: .9
    }
}

html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>a.active:active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="2"]>.ui-side-menu-item__toggle>button.active:active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>a.active:active,
html[data-theme=big-dutchman] .ui-side-menu-item[data-level="3"]>.ui-side-menu-item__toggle>button.active:active {
    background-color: var(--color-active) !important;
    opacity: .8
}

.ui-side-menu-splitter {
    -webkit-overflow-scrolling: touch;
    padding-left: var(--side-menu-toggle-width)
}

@media(min-width: 960px) {
    .ui-side-menu-splitter {
        padding-left: var(--side-menu-width)
    }
}

.ui-dropdown-menu-title {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 8px;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: var(--main-spacing)
}

html[data-layout=controller] .ui-dropdown-menu-title {
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing)
}

.ui-toggle,
.ui-toggle--disabled,
.ui-toggle--flip-label,
.ui-toggle--small {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative
}

.ui-toggle input,
.ui-toggle--disabled input,
.ui-toggle--flip-label input,
.ui-toggle--small input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.ui-toggle input:checked+.ui-toggle__background,
.ui-toggle--disabled input:checked+.ui-toggle__background,
.ui-toggle--flip-label input:checked+.ui-toggle__background,
.ui-toggle--small input:checked+.ui-toggle__background {
    background-color: var(--color-success)
}

.ui-toggle input:checked+.ui-toggle__background .ui-toggle__circle,
.ui-toggle--disabled input:checked+.ui-toggle__background .ui-toggle__circle,
.ui-toggle--flip-label input:checked+.ui-toggle__background .ui-toggle__circle,
.ui-toggle--small input:checked+.ui-toggle__background .ui-toggle__circle {
    left: calc(100% - var(--toggle-circle-size) - 4px)
}

.ui-toggle input:checked+.ui-toggle__background .ui-toggle__circle svg,
.ui-toggle--disabled input:checked+.ui-toggle__background .ui-toggle__circle svg,
.ui-toggle--flip-label input:checked+.ui-toggle__background .ui-toggle__circle svg,
.ui-toggle--small input:checked+.ui-toggle__background .ui-toggle__circle svg {
    fill: var(--color-success)
}

.ui-toggle input:checked+.ui-toggle__background .ui-toggle__circle .tick,
.ui-toggle--disabled input:checked+.ui-toggle__background .ui-toggle__circle .tick,
.ui-toggle--flip-label input:checked+.ui-toggle__background .ui-toggle__circle .tick,
.ui-toggle--small input:checked+.ui-toggle__background .ui-toggle__circle .tick {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-toggle input:checked+.ui-toggle__background .ui-toggle__circle .close,
.ui-toggle--disabled input:checked+.ui-toggle__background .ui-toggle__circle .close,
.ui-toggle--flip-label input:checked+.ui-toggle__background .ui-toggle__circle .close,
.ui-toggle--small input:checked+.ui-toggle__background .ui-toggle__circle .close {
    display: none
}

.ui-toggle__background {
    background-color: var(--color-border);
    border-radius: calc(var(--toggle-height)/2);
    height: var(--toggle-height);
    position: relative;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    width: calc(var(--toggle-height)*2)
}

.ui-toggle__circle {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-white);
    border-radius: 100%;
    -webkit-box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .16);
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .16);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--toggle-circle-size);
    justify-content: center;
    left: 4px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .2s;
    transition: .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: var(--toggle-circle-size)
}

.ui-toggle__circle .ui-icon.tick {
    display: none
}

.ui-toggle__circle .ui-icon svg {
    fill: var(--color-alarm);
    -webkit-transition: inherit;
    transition: inherit
}

.ui-toggle__label {
    margin-right: 8px;
    max-width: 200px;
    text-align: right
}

@media(min-width: 960px) {
    .ui-toggle__label {
        margin-right: 16px
    }
}

.ui-toggle--small .ui-toggle__background {
    height: var(--toggle-height-small);
    width: calc(var(--toggle-height-small)*2)
}

.ui-toggle--small .ui-toggle__circle {
    height: calc(var(--toggle-height-small) - 8px);
    width: calc(var(--toggle-height-small) - 8px)
}

.ui-toggle--small input:checked+.ui-toggle__background .ui-toggle__circle {
    left: calc(100% - var(--toggle-height-small) + 4px)
}

.ui-toggle--disabled {
    cursor: not-allowed
}

.ui-toggle--disabled .ui-toggle__circle {
    border: 2px solid var(--color-white)
}

.ui-toggle--disabled input:checked+.ui-toggle__background {
    background-color: transparent
}

.ui-toggle--disabled input:checked+.ui-toggle__background .ui-toggle__circle.ui-toggle__circle .ui-icon svg {
    fill: var(--color-white)
}

.ui-toggle--disabled .ui-toggle__background {
    background-color: transparent;
    border: 2px solid var(--color-border)
}

.ui-toggle--disabled .ui-toggle__circle {
    background-color: var(--color-border);
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.ui-toggle--disabled .ui-toggle__circle svg {
    fill: var(--color-white)
}

.ui-toggle--flip-label .ui-toggle__label {
    margin-left: 8px;
    margin-right: 0;
    text-align: left
}

@media(min-width: 960px) {
    .ui-toggle--flip-label .ui-toggle__label {
        margin-left: 16px
    }
}

.ui-page-setup {
    padding-bottom: 24px;
    padding-top: 24px;
    text-align: center;
    width: 100%
}

@media(min-width: 960px) {
    .ui-page-setup {
        padding-bottom: 40px;
        padding-top: 40px
    }
}

.ui-page-setup__options {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    justify-content: center;
    width: 100%
}

.ui-page-setup-option {
    margin-right: 16px;
    max-width: 240px;
    position: relative;
    text-align: center;
    width: 100%
}

.ui-page-setup-option:last-child {
    margin-right: 0
}

.ui-page-setup-option input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.ui-page-setup-option input:checked+.ui-page-setup-option__sections+.ui-page-setup-option__checkmark {
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .08), 2px 2px 4px 0 rgba(0, 0, 0, .08)
}

.ui-page-setup-option input:checked+.ui-page-setup-option__sections+.ui-page-setup-option__checkmark .ui-icon {
    display: block
}

.ui-page-setup-option:active .ui-page-setup-option__checkmark,
.ui-page-setup-option:active .ui-page-setup-option__sections {
    background-color: rgba(0, 0, 0, .1) !important
}

.ui-page-setup-option__sections {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--default-background-color);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 150px;
    padding: 8px
}

.ui-page-setup-option__section,
.ui-page-setup-option__section--bottom,
.ui-page-setup-option__section--slim,
.ui-page-setup-option__section--top {
    -ms-flex-preferred-size: 60%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-border);
    border-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-basis: 60%;
    justify-content: center
}

.ui-page-setup-option__section+.ui-page-setup-option__section,
.ui-page-setup-option__section+.ui-page-setup-option__section--bottom,
.ui-page-setup-option__section+.ui-page-setup-option__section--slim,
.ui-page-setup-option__section+.ui-page-setup-option__section--top,
.ui-page-setup-option__section--bottom+.ui-page-setup-option__section,
.ui-page-setup-option__section--bottom+.ui-page-setup-option__section--bottom,
.ui-page-setup-option__section--bottom+.ui-page-setup-option__section--slim,
.ui-page-setup-option__section--bottom+.ui-page-setup-option__section--top,
.ui-page-setup-option__section--slim+.ui-page-setup-option__section,
.ui-page-setup-option__section--slim+.ui-page-setup-option__section--bottom,
.ui-page-setup-option__section--slim+.ui-page-setup-option__section--slim,
.ui-page-setup-option__section--slim+.ui-page-setup-option__section--top,
.ui-page-setup-option__section--top+.ui-page-setup-option__section,
.ui-page-setup-option__section--top+.ui-page-setup-option__section--bottom,
.ui-page-setup-option__section--top+.ui-page-setup-option__section--slim,
.ui-page-setup-option__section--top+.ui-page-setup-option__section--top {
    margin-top: 8px
}

.ui-page-setup-option__checkmark {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 16px;
    width: 34px
}

.ui-page-setup-option__checkmark .ui-icon.ui-icon {
    display: none
}

.ui-page-setup-option__checkmark .ui-icon.ui-icon svg {
    fill: var(--color-white)
}

.ui-page-setup-option__section--slim {
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

.ui-page-setup-option__section--top {
    margin-bottom: auto
}

.ui-page-setup-option__section--bottom {
    margin-top: auto
}

html[data-theme=skov] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section,
html[data-theme=skov] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--bottom,
html[data-theme=skov] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--slim,
html[data-theme=skov] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--top {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

html[data-theme=skov] .ui-page-setup-option input:checked+.ui-page-setup-option__sections+.ui-page-setup-option__checkmark {
    background-color: #30da59
}

html[data-theme=big-dutchman] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section,
html[data-theme=big-dutchman] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--bottom,
html[data-theme=big-dutchman] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--slim,
html[data-theme=big-dutchman] .ui-page-setup-option input:checked+.ui-page-setup-option__sections .ui-page-setup-option__section--top,
html[data-theme=big-dutchman] .ui-page-setup-option input:checked+.ui-page-setup-option__sections+.ui-page-setup-option__checkmark {
    background-color: #ea6f18
}

.ui-sticky-container {
    height: 100%
}

.ui-sticky-container .ui-sticky-content {
    overflow-y: scroll;
    position: fixed
}

.ui-sticky-container .ui-sticky-content::-webkit-scrollbar {
    display: none
}

.ui-center-both {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-center-vertical {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-center-horizontal {
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-absolute-position-full-width {
    width: 100%
}

.ui-simple-line-chart {
    height: 100%;
    width: 100%
}

.ui-hotspot-card,
.ui-hotspot-card--with-click {
    display: inline-block;
    position: absolute
}

.ui-hotspot-card--with-click,
.ui-hotspot-card--with-click .ui-card {
    cursor: pointer
}

.ui-hotspot-card--with-click .ui-card:after {
    background-color: var(--color-active-background);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden
}

.ui-hotspot-card--with-click .ui-card:active:after {
    opacity: 1;
    visibility: visible
}

.custom-shared-tooltip {
    max-width: 250px !important;
    padding: 0 !important
}

.custom-shared-tooltip .ui-typography {
    font-size: var(--caption-font-size)
}

.custom-shared-tooltip__label {
    background-color: var(--default-background-color);
    border-bottom: 1px solid var(--color-border);
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    display: block;
    padding: 8px 16px
}

.custom-shared-tooltip__values {
    list-style: none;
    margin: 0;
    padding-left: 16px
}

.custom-shared-tooltip__values li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 32px;
    padding-right: 16px
}

.custom-shared-tooltip__values li:last-child {
    border-bottom: none
}

.custom-shared-tooltip__values li span {
    -ms-flex-negative: 0;
    border-radius: 100%;
    display: inline-block;
    flex-shrink: 0;
    height: var(--dot-size);
    margin-right: 8px;
    width: var(--dot-size)
}

.custom-shared-tooltip__value-label {
    overflow: hidden;
    padding-right: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

html[data-theme=big-dutchman] .custom-shared-tooltip {
    -webkit-box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1)
}

.ui-line-chart-footer,
.ui-line-chart-footer--in-card {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

.ui-line-chart-footer__legends {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-line-chart-footer__legends li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--icon-size);
    margin-right: var(--main-spacing)
}

.ui-line-chart-footer__legends li .ui-typography {
    color: var(--color-grey3);
    font-size: var(--caption-font-size)
}

.ui-line-chart-footer__legends li:last-child {
    margin-right: 0
}

.ui-line-chart-footer__legend-line {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--chart-stroke-width);
    justify-content: space-between;
    margin-left: 8px;
    margin-right: -3px;
    position: relative;
    width: 24px
}

.ui-line-chart-footer__legend-line span {
    border-radius: var(--chart-stroke-width);
    display: inline-block;
    height: var(--chart-stroke-width);
    margin-right: 3px;
    width: 100%
}

.ui-line-chart-footer--in-card {
    background-color: var(--color-cloudy);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    border-top: 1px solid var(--color-border);
    margin-bottom: calc(var(--card-low-density-padding)*-1);
    margin-left: calc(var(--card-low-density-padding)*-1);
    margin-right: calc(var(--card-low-density-padding)*-1);
    padding: 0 var(--card-low-density-padding)
}

.custom-axis-label {
    fill: var(--color-grey1);
    font-size: var(--caption-font-size)
}

html[data-theme=skov] .custom-axis-label {
    fill: var(--color-grey1);
    font-family: Noto Sans, sans-serif;
    font-weight: 500
}

html[data-theme=big-dutchman] .custom-axis-label {
    font-family: Open Sans, Noto Sans, sans-serif;
    font-weight: 600
}

.ui-line-chart {
    min-height: 0;
    position: relative
}

.ui-line-chart .recharts-tooltip-wrapper {
    pointer-events: all !important
}

.ui-line-chart .ui-hotspot-card {
    max-width: 120px;
    min-width: auto;
    position: relative
}

.ui-line-chart .ui-hotspot-card .ui-card {
    margin-top: 4px;
    padding: 8px
}

.ui-line-chart .ui-chip,
.ui-line-chart .ui-hotspot-card {
    pointer-events: all
}

.ui-line-chart .recharts-surface {
    overflow: visible
}

.ui-line-chart .recharts-surface path {
    stroke: var(--color-primary-light);
}

.ui-line-chart .recharts-cartesian-grid-horizontal line {
    stroke-dasharray: 0, 0;
    stroke-width: 1px
}

.ui-line-chart .recharts-cartesian-grid-vertical line {
    display: none
}

.ui-line-chart.ui-line-chart--show-grid-x .recharts-cartesian-grid-vertical line {
    stroke-dasharray: 0, 0;
    stroke-width: 1px;
    display: block
}

.ui-line-chart .recharts-xAxis line,
.ui-line-chart .recharts-yAxis line {
    stroke-width: var(--line-chart-axis-line-width)
}

.ui-line-chart .recharts-xAxis .recharts-cartesian-axis-line,
.ui-line-chart .recharts-yAxis .recharts-cartesian-axis-line {
    stroke: var(--color-chart-grid);
    stroke-width: var(--line-chart-axis-line-width)
}

.ui-line-chart .recharts-label-list svg,
.ui-line-chart--custom-label {
    overflow: visible
}

.ui-line-chart--custom-label .ui-chip:after {
    border: 6px solid transparent;
    content: " ";
    height: 0;
    pointer-events: none;
    position: absolute;
    width: 0
}

.ui-line-chart .ui-custom-label--chip-arrow-bottom-left .ui-chip:after {
    border-top-color: var(--color-chart-reference-line);
    left: 13px;
    margin-left: -6px;
    top: 100%
}

.ui-line-chart .ui-custom-label--chip-arrow-top-right .ui-chip:after {
    border-bottom-color: var(--color-chart-reference-line);
    bottom: 100%;
    margin-left: -6px;
    right: 19px
}

.ui-line-chart .ui-custom-label--chip-arrow-bottom-right .ui-chip:after {
    border-top-color: var(--color-chart-reference-line);
    margin-left: -6px;
    right: 24px;
    top: 100%
}

.ui-line-chart .ui-custom-label--chip-arrow-top-left .ui-chip:after {
    border-bottom-color: var(--color-chart-reference-line);
    bottom: 100%;
    left: 12px;
    margin-left: -6px
}

.ui-line-chart__tooltip--invisible {
    opacity: 0
}

.ui-line-chart__tooltip--invisible,
.ui-line-chart__tooltip--visible {
    -webkit-transition: opacity .25s linear;
    transition: opacity .25s linear
}

.ui-line-chart__tooltip--visible {
    opacity: 1
}

.ui-line-chart__tooltip--foreign-object {
    overflow: visible;
    pointer-events: none
}

.ui-line-chart .ui-progress {
    bottom: 0;
    margin-bottom: 27px;
    right: var(--line-chart-y-ticks-width);
    top: -2px
}

.ui-line-chart__line-gradient {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: calc(100% - var(--line-chart-y-ticks-width))
}

.ui-line-chart__chip .ui-chip.ui-chip {
    background-color: var(--color-chart-reference-line)
}

.ui-line-chart__tooltip__click-indicator {
    position: absolute;
    right: 4px;
    top: 8px
}

.ui-line-chart__tooltip--with-stroke {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: flex-start
}

.ui-line-chart__tooltip--with-stroke svg {
    margin-right: 8px
}

.ui-line-chart .recharts-tooltip-cursor {
    stroke-width: 2px;
    stroke: var(--color-red)
}

html[data-theme=skov] .ui-line-chart__chip .ui-chip .ui-typography {
    color: #fff
}

html[data-theme=skov] .ui-line-chart .recharts-cartesian-axis-tick text {
    fill: #b4b4b4;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 400
}

html[data-theme=skov] .ui-line-chart .recharts-label-list text {
    fill: #fff;
    font-family: Noto Sans, sans-serif;
    font-size: 10px;
    font-weight: 500
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-line-chart .recharts-label-list text {
        font-size: 12px
    }
}

html[data-theme=big-dutchman] .ui-line-chart__chip .ui-chip .ui-typography {
    color: #fff
}

html[data-theme=big-dutchman] .ui-line-chart .recharts-cartesian-axis-tick text {
    fill: #b4b4b4;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 400
}

html[data-theme=big-dutchman] .ui-line-chart .recharts-label-list text {
    fill: #fff;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-size: 10px;
    font-weight: 600
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-line-chart .recharts-label-list text {
        font-size: 12px
    }
}

.ui-card-edit,
.ui-card-edit--align,
.ui-card-edit--min-height,
.ui-card-edit--mode-delete,
.ui-card-edit--mode-edit,
.ui-card-edit--mode-move {
    height: 100%
}

.ui-card-edit__button {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-card-edit__button,
.ui-card-edit__button-lower {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 50%;
    position: absolute;
    top: 50%;
    z-index: 1
}

@media(min-width: 640px) {
    .ui-card-edit__button-lower {
        -webkit-transform: translate(-50%, -5%);
        transform: translate(-50%, -5%)
    }
}

@media(min-width: 960px) {
    .ui-card-edit__button-lower {
        -webkit-transform: translate(-50%);
        transform: translate(-50%)
    }
}

.ui-card-edit--mode-delete,
.ui-card-edit--mode-edit,
.ui-card-edit--mode-move {
    position: relative
}

.ui-card-edit--mode-delete:after,
.ui-card-edit--mode-edit:after,
.ui-card-edit--mode-move:after {
    border-radius: var(--border-radius);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-card-edit--min-height {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 60px
}

@media(min-width: 960px) {
    .ui-card-edit--min-height {
        min-height: 96px
    }
}

.ui-card-edit--align-bottom {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

html[data-theme=skov] .ui-card-edit--align:after,
html[data-theme=skov] .ui-card-edit--min-height:after,
html[data-theme=skov] .ui-card-edit--mode-delete:after,
html[data-theme=skov] .ui-card-edit--mode-edit:after,
html[data-theme=skov] .ui-card-edit--mode-move:after,
html[data-theme=skov] .ui-card-edit:after {
    background-color: hsla(0, 0%, 100%, .72)
}

html[data-theme=skov] .ui-card-edit [class^=body],
html[data-theme=skov] .ui-card-edit--align [class^=body],
html[data-theme=skov] .ui-card-edit--min-height [class^=body],
html[data-theme=skov] .ui-card-edit--mode-delete [class^=body],
html[data-theme=skov] .ui-card-edit--mode-edit [class^=body],
html[data-theme=skov] .ui-card-edit--mode-move [class^=body] {
    color: #fff
}

html[data-theme=big-dutchman] .ui-card-edit--align:after,
html[data-theme=big-dutchman] .ui-card-edit--min-height:after,
html[data-theme=big-dutchman] .ui-card-edit--mode-delete:after,
html[data-theme=big-dutchman] .ui-card-edit--mode-edit:after,
html[data-theme=big-dutchman] .ui-card-edit--mode-move:after,
html[data-theme=big-dutchman] .ui-card-edit:after {
    background-color: hsla(0, 0%, 100%, .72)
}

html[data-theme=big-dutchman] .ui-card-edit [class^=body],
html[data-theme=big-dutchman] .ui-card-edit--align [class^=body],
html[data-theme=big-dutchman] .ui-card-edit--min-height [class^=body],
html[data-theme=big-dutchman] .ui-card-edit--mode-delete [class^=body],
html[data-theme=big-dutchman] .ui-card-edit--mode-edit [class^=body],
html[data-theme=big-dutchman] .ui-card-edit--mode-move [class^=body] {
    color: #fff
}

.ui-panel,
.ui-panel--frame,
.ui-panel--primary {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    bottom: 0;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, .24);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .24);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    left: 0;
    margin-top: 8px;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    will-change: transform;
    z-index: var(--z-index-panel)
}

@media(min-width: 960px) {

    .ui-panel,
    .ui-panel--frame,
    .ui-panel--primary {
        margin-left: 8px;
        margin-right: 8px;
        margin-top: var(--main-spacing)
    }
}

.ui-panel--primary>.ui-panel-content {
    border-top: 0 !important;
    margin-top: 0 !important
}

@media(min-width: 640px) {

    html[data-theme=skov] .ui-panel,
    html[data-theme=skov] .ui-panel--frame,
    html[data-theme=skov] .ui-panel--primary {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px
    }
}

.ui-panel-header {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    background-color: var(--color-white);
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    min-height: var(--panel-header-height);
    padding: 0 var(--main-spacing)
}

.ui-panel-header,
.ui-panel-header__icon.ui-panel-header__icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.ui-panel-header__icon.ui-panel-header__icon {
    height: var(--panel-header-height);
    width: var(--panel-header-height)
}

.ui-panel-header__title.ui-panel-header__title {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-right: auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-panel-header__children {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.ui-panel--primary .ui-panel-header {
    background-color: var(--color-primary-background);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.ui-panel--primary .ui-panel-header:after {
    background-color: var(--color-border-primary);
    bottom: 0;
    content: "";
    height: 1px;
    left: var(--main-spacing);
    position: absolute;
    right: var(--main-spacing)
}

.ui-panel--primary .ui-panel-header__icon.ui-panel-header__icon svg {
    fill: var(--color-white)
}

.ui-panel--primary .ui-panel-header__title {
    color: var(--color-white)
}

@media(min-width: 640px) {
    html[data-theme=skov] .ui-panel-header {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px
    }
}

.ui-panel-content,
.ui-panel-content--with-background-color,
.ui-panel-content--with-frame,
.ui-panel-content--with-sidebar {
    -webkit-overflow-scrolling: touch;
    overflow: hidden;
    position: relative
}

.ui-panel>:last-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.ui-panel-content__container {
    -ms-scroll-chaining: none;
    background-color: var(--default-background-color);
    border-top: 1px solid var(--color-border);
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--main-spacing);
    position: relative;
    width: 100%;
    z-index: 10
}

.ui-panel-content__container:before {
    background-color: var(--color-border);
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    top: -1px;
    z-index: 10
}

.ui-panel-content__frame {
    background-color: var(--color-white);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-panel-content__frame .ui-panel-content__content {
    border-left: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    border-top: 1px solid var(--color-border)
}

.ui-panel-content__sidebar {
    background-color: var(--color-white);
    left: 0;
    max-width: 180px;
    min-width: 180px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: var(--main-spacing);
    position: sticky;
    top: 0;
    z-index: 1
}

@media(min-width: 960px) {
    .ui-panel-content__sidebar {
        max-width: 260px;
        min-width: 260px
    }
}

.ui-panel--primary .ui-panel-content__container {
    background-color: var(--color-primary-background);
    border: none
}

.ui-panel--primary .ui-panel-content__container:before {
    content: none
}

@media(min-width: 640px) {
    .ui-panel--primary .ui-panel-content__container {
        padding-top: 32px
    }
}

@media(min-width: 960px) {
    .ui-panel--primary .ui-panel-content__container {
        padding-top: 64px
    }
}

.ui-panel-content--with-frame .ui-panel-content__container {
    border-left: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    margin-left: var(--main-spacing);
    margin-right: var(--main-spacing)
}

.ui-panel-content--with-sidebar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-panel-content--with-background-color .ui-panel-content__container {
    background-color: var(--color-white);
    border-top: none
}

.ui-panel-content--with-background-color .ui-panel-content__container:before {
    background-color: var(--color-border);
    content: "";
    height: 1px;
    left: var(--main-spacing);
    position: absolute;
    right: var(--main-spacing);
    top: 0
}

html[data-theme=skov] .ui-list--primary .ui-list__headers.ui-list__headers {
    border-bottom: 2px solid #406E00
}

html[data-theme=skov] .ui-list--align-to-edge {
    width: calc(100% + var(--main-spacing))
}

html[data-theme=skov] .ui-list--align-to-edge .ui-list-item__content.ui-list-item__content.ui-list-item__content {
    border-bottom-right-radius: 0;
    border-right: none;
    border-top-right-radius: 0
}

html[data-theme=skov] .ui-list--align-to-edge .ui-list-item.ui-list-item {
    border-radius: 0
}

html[data-theme=skov] .ui-list--expandable .ui-list-item--has-expandable-children .ui-list-item__content .ui-list-item-cell {
    min-height: var(--main-nav-height-small)
}

html[data-theme=big-dutchman] .ui-list--primary .ui-list__headers.ui-list__headers {
    border-bottom: 2px solid #686868
}

html[data-theme=big-dutchman] .ui-list--expandable .ui-list-item--has-expandable-children>.ui-list-item__content>.ui-list-item-cell {
    min-height: var(--main-nav-height-small)
}

.ui-list,
.ui-list--align-to-edge,
.ui-list--flat,
.ui-list--primary {
    overflow: hidden;
    position: relative;
    width: 100%
}

.ui-list .ui-list-item--with-description+.ui-list-item .ui-list-item__border,
.ui-list--align-to-edge .ui-list-item--with-description+.ui-list-item .ui-list-item__border,
.ui-list--align-to-edge:not(.ui-list--primary) .ui-list-item--selected+.ui-list-item>.ui-list-item__border,
.ui-list--align-to-edge:not(.ui-list--primary) .ui-list__items>.ui-list-item:first-child>.ui-list-item__border,
.ui-list--flat .ui-list-item--with-description+.ui-list-item .ui-list-item__border,
.ui-list--flat .ui-list-item__border,
.ui-list--flat:not(.ui-list--primary) .ui-list-item--selected+.ui-list-item>.ui-list-item__border,
.ui-list--flat:not(.ui-list--primary) .ui-list__items>.ui-list-item:first-child>.ui-list-item__border,
.ui-list--primary .ui-list-item--with-description+.ui-list-item .ui-list-item__border,
.ui-list--primary:not(.ui-list--primary) .ui-list-item--selected+.ui-list-item>.ui-list-item__border,
.ui-list--primary:not(.ui-list--primary) .ui-list__items>.ui-list-item:first-child>.ui-list-item__border,
.ui-list.ui-list--flat .ui-list-item__border,
.ui-list:not(.ui-list--primary) .ui-list-item--selected+.ui-list-item>.ui-list-item__border,
.ui-list:not(.ui-list--primary) .ui-list__items>.ui-list-item:first-child>.ui-list-item__border {
    display: none
}

.ui-list__headers {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    padding-left: var(--main-spacing)
}

.ui-list__headers,
.ui-list__headers .ui-list__header,
.ui-list__headers .ui-list__header--align-right,
.ui-list__headers .ui-list__header--clickable,
.ui-list__headers .ui-list__header--sort,
.ui-list__headers .ui-list__header--theme-primary,
.ui-list__headers .ui-list__header--width {
    padding-right: var(--main-spacing)
}

.ui-list__headers .ui-list__header--align-right:last-child,
.ui-list__headers .ui-list__header--clickable:last-child,
.ui-list__headers .ui-list__header--sort:last-child,
.ui-list__headers .ui-list__header--theme-primary:last-child,
.ui-list__headers .ui-list__header--width:last-child,
.ui-list__headers .ui-list__header:last-child {
    padding-right: 0
}

.ui-list__headers .ui-list__header .ui-typography,
.ui-list__headers .ui-list__header--align-right .ui-typography,
.ui-list__headers .ui-list__header--clickable .ui-typography,
.ui-list__headers .ui-list__header--sort .ui-typography,
.ui-list__headers .ui-list__header--theme-primary .ui-typography,
.ui-list__headers .ui-list__header--width .ui-typography {
    display: inline-block;
    text-transform: uppercase
}

.ui-list__header,
.ui-list__header--align-right,
.ui-list__header--clickable,
.ui-list__header--sort,
.ui-list__header--theme-primary,
.ui-list__header--width {
    -webkit-box-flex: 1;
    display: block;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    height: 100%;
    padding-right: calc(var(--icon-size-extra-small) + 4px)
}

.ui-list__header .ui-typography,
.ui-list__header--align-right .ui-typography,
.ui-list__header--clickable .ui-typography,
.ui-list__header--sort .ui-typography,
.ui-list__header--theme-primary .ui-typography,
.ui-list__header--width .ui-typography {
    -webkit-transition: .2s;
    transition: .2s
}

.ui-list__header .ui-typography>.ui-icon,
.ui-list__header--align-right .ui-typography>.ui-icon,
.ui-list__header--clickable .ui-typography>.ui-icon,
.ui-list__header--sort .ui-typography>.ui-icon,
.ui-list__header--theme-primary .ui-typography>.ui-icon,
.ui-list__header--width .ui-typography>.ui-icon {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-list__header--clickable {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.ui-list__header--clickable .ui-typography {
    padding-right: 8px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: auto !important
}

@media(hover: hover) {
    .ui-list__header--clickable:hover .ui-typography {
        color: var(--color-black)
    }
}

.ui-list__header--clickable:active {
    background-color: var(--color-active-background);
    border-radius: var(--border-radius)
}

.ui-list__header--sort-asc .trend-negative,
.ui-list__header--sort-desc .trend-positive {
    opacity: .5
}

.ui-list__header--theme-primary .ui-icon svg {
    fill: var(--color-white)
}

@media(hover: hover) {
    .ui-list__header--theme-primary.ui-list__header--clickable:hover .ui-typography {
        color: var(--color-white)
    }

    .ui-list__header--theme-primary.ui-list__header--clickable:hover .ui-icon svg {
        fill: var(--color-white)
    }
}

.ui-list__header--theme-primary:active {
    background-color: var(--color-primary-active-background)
}

.ui-list__header--width-1 {
    -ms-flex-preferred-size: 8.33333%;
    flex-basis: 8.33333%;
    min-width: 0
}

.ui-list__header--width-1 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-2 {
    -ms-flex-preferred-size: 16.66667%;
    flex-basis: 16.66667%;
    min-width: 0
}

.ui-list__header--width-2 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-3 {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    min-width: 0
}

.ui-list__header--width-3 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-4 {
    -ms-flex-preferred-size: 33.33333%;
    flex-basis: 33.33333%;
    min-width: 0
}

.ui-list__header--width-4 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-5 {
    -ms-flex-preferred-size: 41.66667%;
    flex-basis: 41.66667%;
    min-width: 0
}

.ui-list__header--width-5 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-6 {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    min-width: 0
}

.ui-list__header--width-6 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-7 {
    -ms-flex-preferred-size: 58.33333%;
    flex-basis: 58.33333%;
    min-width: 0
}

.ui-list__header--width-7 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-8 {
    -ms-flex-preferred-size: 66.66667%;
    flex-basis: 66.66667%;
    min-width: 0
}

.ui-list__header--width-8 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-9 {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    min-width: 0
}

.ui-list__header--width-9 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-10 {
    -ms-flex-preferred-size: 83.33333%;
    flex-basis: 83.33333%;
    min-width: 0
}

.ui-list__header--width-10 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-11 {
    -ms-flex-preferred-size: 91.66667%;
    flex-basis: 91.66667%;
    min-width: 0
}

.ui-list__header--width-11 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--width-12 {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    min-width: 0
}

.ui-list__header--width-12 .ui-typography {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-list__header--align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    padding-left: var(--main-spacing);
    padding-right: 0;
    text-align: right
}

.ui-list--primary .ui-list__headers.ui-list__headers {
    padding-left: 0;
    padding-right: 0
}

.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--align-right:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--align-right:last-of-type .ui-typography,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--clickable:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--clickable:last-of-type .ui-typography,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--sort:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--sort:last-of-type .ui-typography,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--theme-primary:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--theme-primary:last-of-type .ui-typography,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--width:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header--width:last-of-type .ui-typography,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header:last-of-type,
.ui-list--primary .ui-list__headers.ui-list__headers .ui-list__header:last-of-type .ui-typography {
    padding-right: 0
}

.ui-list--expandable:not(.ui-list--flat):not(.ui-list--primary) .ui-list__items {
    border-radius: var(--border-radius);
    overflow: hidden
}

.ui-list--expandable .ui-list__item__expandable__content {
    margin-left: 0;
    position: relative;
    width: 100%
}

.ui-list--expandable .ui-list__item__expandable__content .ui-list-item:active,
.ui-list--expandable .ui-list__item__expandable__content .ui-list-item:active .ui-list-item__content {
    border-radius: 0
}

.ui-list--expandable .ui-list__item__expandable__content .ui-list-item--with-link:first-of-type .ui-list-item__border {
    display: block
}

.ui-list--expandable .ui-list__items .ui-list-item .ui-list-item__content,
.ui-list--expandable .ui-list__items .ui-list-item .ui-list-item__content:first-of-type {
    border: 0;
    border-radius: 0
}

.ui-list--expandable .ui-list__item__expandable__content>.ui-list-item .ui-list-item__content,
.ui-list--expandable .ui-list__item__expandable__content>.ui-list-item>.ui-list-item__content:last-of-type {
    border: 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.ui-list--flat .ui-list__items {
    border-top: 1px solid var(--color-border)
}

.ui-list--flat .ui-list__headers {
    padding: 0
}

.ui-list--flat .ui-list-item-cell {
    padding-right: 16px
}

html[data-theme=skov] .ui-list--expandable:not(.ui-list--flat):not(.ui-list--primary) .ui-list__items {
    border: 1px solid var(--color-border)
}

.ui-list-item,
.ui-list-item--clickable,
.ui-list-item--density,
.ui-list-item--disabled,
.ui-list-item--expanded,
.ui-list-item--selected,
.ui-list-item--state-alarm,
.ui-list-item--state-warning,
.ui-list-item--with-description,
.ui-list-item--with-link {
    display: block;
    position: relative
}

.ui-list-item--clickable:first-child .ui-list-item__content,
.ui-list-item--density:first-child .ui-list-item__content,
.ui-list-item--disabled:first-child .ui-list-item__content,
.ui-list-item--expanded:first-child .ui-list-item__content,
.ui-list-item--selected:first-child .ui-list-item__content,
.ui-list-item--state-alarm:first-child .ui-list-item__content,
.ui-list-item--state-warning:first-child .ui-list-item__content,
.ui-list-item--with-description:first-child .ui-list-item__content,
.ui-list-item--with-link:first-child .ui-list-item__content,
.ui-list-item:first-child .ui-list-item__content {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.ui-list-item--clickable:last-child .ui-list-item__content,
.ui-list-item--density:last-child .ui-list-item__content,
.ui-list-item--disabled:last-child .ui-list-item__content,
.ui-list-item--expanded:last-child .ui-list-item__content,
.ui-list-item--selected:last-child .ui-list-item__content,
.ui-list-item--state-alarm:last-child .ui-list-item__content,
.ui-list-item--state-warning:last-child .ui-list-item__content,
.ui-list-item--with-description:last-child .ui-list-item__content,
.ui-list-item--with-link:last-child .ui-list-item__content,
.ui-list-item:last-child .ui-list-item__content {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.ui-list-item__content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    background-color: var(--color-white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    min-height: var(--list-item-height);
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing);
    position: relative
}

.ui-list-item__link-icon {
    position: absolute;
    right: var(--main-spacing);
    top: calc(var(--list-item-height)/2 - var(--icon-size-small)/2);
    z-index: 1
}

.ui-list-item__link-icon svg {
    fill: var(--color-font-subtitle1)
}

.ui-list-item__border {
    background-color: var(--color-border);
    height: 1px;
    left: var(--main-spacing);
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.ui-list-item__description {
    color: var(--color-font-subtitle1);
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing);
    padding-top: 8px
}

.ui-list-item__select-border {
    background-color: var(--color-success);
    bottom: 0;
    height: 2px;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    visibility: hidden;
    z-index: 2
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list-item__content,
.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list__item__expandable__content:not(:first-child) {
    padding-left: 0
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list-item__content:first-of-type .ui-list-item__link-icon {
    left: 24px
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list-item__content .ui-list-item-cell.ui-list-item-cell.ui-list-item-cell:first-of-type {
    padding-left: 56px
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list-item__content .ui-list-item-cell.ui-list-item-cell.ui-list-item-cell:last-of-type {
    padding-right: 16px
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--left .ui-list-item__link-icon {
    left: 16px
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--right .ui-list-item-cell {
    padding-right: 32px
}

.ui-list-item--has-expandable-children.ui-list-item--chevron-position--right .ui-list-item__content .ui-list-item-cell.ui-list-item-cell.ui-list-item-cell:first-of-type {
    padding-left: 0
}

.ui-list--primary .ui-list-item,
.ui-list--primary .ui-list-item--clickable,
.ui-list--primary .ui-list-item--density,
.ui-list--primary .ui-list-item--disabled,
.ui-list--primary .ui-list-item--expanded,
.ui-list--primary .ui-list-item--selected,
.ui-list--primary .ui-list-item--state-alarm,
.ui-list--primary .ui-list-item--state-warning,
.ui-list--primary .ui-list-item--with-description,
.ui-list--primary .ui-list-item--with-link {
    border-radius: 0;
    padding-left: 0;
    padding-right: 0
}

.ui-list--primary .ui-list-item .ui-list-item__content,
.ui-list--primary .ui-list-item--clickable .ui-list-item__content,
.ui-list--primary .ui-list-item--density .ui-list-item__content,
.ui-list--primary .ui-list-item--disabled .ui-list-item__content,
.ui-list--primary .ui-list-item--expanded .ui-list-item__content,
.ui-list--primary .ui-list-item--selected .ui-list-item__content,
.ui-list--primary .ui-list-item--state-alarm .ui-list-item__content,
.ui-list--primary .ui-list-item--state-warning .ui-list-item__content,
.ui-list--primary .ui-list-item--with-description .ui-list-item__content,
.ui-list--primary .ui-list-item--with-link .ui-list-item__content {
    background-color: transparent;
    border: none !important;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0
}

.ui-list--primary .ui-list-item--with-link .ui-list-item__link-icon {
    right: 0
}

.ui-list--primary .ui-list-item--with-link .ui-list-item__link-icon svg {
    fill: var(--color-font-primary)
}

.ui-list--primary .ui-list-item .ui-list-item__border,
.ui-list--primary .ui-list-item--clickable .ui-list-item__border,
.ui-list--primary .ui-list-item--density .ui-list-item__border,
.ui-list--primary .ui-list-item--disabled .ui-list-item__border,
.ui-list--primary .ui-list-item--expanded .ui-list-item__border,
.ui-list--primary .ui-list-item--selected .ui-list-item__border,
.ui-list--primary .ui-list-item--state-alarm .ui-list-item__border,
.ui-list--primary .ui-list-item--state-warning .ui-list-item__border,
.ui-list--primary .ui-list-item--with-description .ui-list-item__border,
.ui-list--primary .ui-list-item--with-link .ui-list-item__border {
    bottom: 0;
    left: 0;
    top: auto
}

.ui-list--primary .ui-list-item .ui-list-item__select-border,
.ui-list--primary .ui-list-item--clickable .ui-list-item__select-border,
.ui-list--primary .ui-list-item--density .ui-list-item__select-border,
.ui-list--primary .ui-list-item--disabled .ui-list-item__select-border,
.ui-list--primary .ui-list-item--expanded .ui-list-item__select-border,
.ui-list--primary .ui-list-item--selected .ui-list-item__select-border,
.ui-list--primary .ui-list-item--state-alarm .ui-list-item__select-border,
.ui-list--primary .ui-list-item--state-warning .ui-list-item__select-border,
.ui-list--primary .ui-list-item--with-description .ui-list-item__select-border,
.ui-list--primary .ui-list-item--with-link .ui-list-item__select-border {
    background-color: var(--color-active)
}

.ui-list--primary .ui-list-item .ui-list-item__border,
.ui-list--primary .ui-list-item--clickable .ui-list-item__border,
.ui-list--primary .ui-list-item--density .ui-list-item__border,
.ui-list--primary .ui-list-item--disabled .ui-list-item__border,
.ui-list--primary .ui-list-item--expanded .ui-list-item__border,
.ui-list--primary .ui-list-item--selected .ui-list-item__border,
.ui-list--primary .ui-list-item--state-alarm .ui-list-item__border,
.ui-list--primary .ui-list-item--state-warning .ui-list-item__border,
.ui-list--primary .ui-list-item--with-description .ui-list-item__border,
.ui-list--primary .ui-list-item--with-link .ui-list-item__border {
    background-color: var(--color-border-primary)
}

.ui-list--primary .ui-list-item--selected .ui-list-item-cell__sub-title.ui-list-item-cell__sub-title,
.ui-list--primary .ui-list-item--selected .ui-list-item-cell__title .ui-typography:not(.ui-chip__text) {
    color: var(--color-active)
}

.ui-list--primary .ui-list-item--selected .ui-icon.ui-icon svg {
    fill: var(--color-active)
}

.ui-list-item--with-link .ui-list-item-cell:nth-last-child(2) {
    padding-right: calc(8px + var(--icon-size-small))
}

.ui-list-item--state-alarm .ui-list-item__content:before,
.ui-list-item--state-warning .ui-list-item__content:before {
    content: "";
    height: calc(var(--list-item-height) - 10px);
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 3px
}

.ui-list-item--state-alarm .ui-list-item__content:before {
    background-color: var(--color-alarm)
}

.ui-list-item--state-warning .ui-list-item__content:before {
    background-color: var(--color-warning)
}

.ui-list-item--selected .ui-list-item-cell__sub-title,
.ui-list-item--selected .ui-list-item-cell__title .ui-typography:not(.ui-chip__text) {
    color: var(--color-success)
}

.ui-list-item--selected .ui-icon.ui-icon svg {
    fill: var(--color-success)
}

.ui-list-item--selected .ui-list-item__select-border {
    opacity: 1;
    visibility: visible
}

.ui-list-item--with-description {
    margin-bottom: var(--main-spacing)
}

.ui-list-item--with-description .ui-list-item__content {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.ui-list-item--with-description+.ui-list-item .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--clickable .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--density .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--disabled .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--expanded .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--selected .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--state-alarm .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--state-warning .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--with-description .ui-list-item__content,
.ui-list-item--with-description+.ui-list-item--with-link .ui-list-item__content {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.ui-list-item--density-low .ui-list-item__content {
    height: calc(var(--list-item-height) + 12px)
}

.ui-list-item--density-medium .ui-list-item__content {
    height: calc(var(--list-item-height) + 8px)
}

.ui-list-item--density-high {
    height: var(--list-item-height)
}

.ui-list-item--disabled {
    pointer-events: none !important
}

.ui-list-item--disabled .ui-list-item__content {
    cursor: not-allowed !important
}

.ui-list-item--disabled .ui-list-item__content * {
    opacity: .8
}

.ui-list-item--disabled.ui-list-item--selected .ui-list-item__select-border {
    display: none
}

.ui-list--draggable .ui-list-item .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--clickable .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--density .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--disabled .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--expanded .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--selected .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--state-alarm .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--state-warning .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--with-description .ui-list-item__content>div,
.ui-list--draggable .ui-list-item--with-link .ui-list-item__content>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-list-item__draggable-wrapper,
.ui-list-item__draggable-wrapper--dragging {
    position: relative
}

.ui-list-item__draggable-wrapper--dragging:after,
.ui-list-item__draggable-wrapper:after {
    border-radius: var(--border-radius);
    bottom: 0;
    -webkit-box-shadow: 0 2px 20px 2px rgba(0, 0, 0, .1);
    box-shadow: 0 2px 20px 2px rgba(0, 0, 0, .1);
    content: "";
    left: -8px;
    opacity: 0;
    position: absolute;
    right: -8px;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s;
    visibility: visible
}

.ui-list-item__draggable-wrapper *,
.ui-list-item__draggable-wrapper--dragging * {
    z-index: 1
}

.ui-list-item__draggable-wrapper--dragging:after {
    opacity: 1;
    visibility: visible
}

.ui-list--primary .ui-list-item__draggable-wrapper--dragging:after,
.ui-list--primary .ui-list-item__draggable-wrapper:after {
    background-color: var(--color-primary-dark);
    border: 1px solid var(--color-border-primary)
}

.ui-list--flat .ui-list-item__draggable-wrapper--dragging:after,
.ui-list--flat .ui-list-item__draggable-wrapper:after {
    background-color: var(--color-white);
    border: 1px solid var(--color-border)
}

.ui-list-item--fluid-text .ui-list-item__content .ui-list-item-cell {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 25%;
    overflow: hidden
}

.ui-list-item--fluid-text .ui-list-item__content .ui-list-item-cell:first-child {
    -ms-flex-negative: 3;
    flex-shrink: 3
}

.ui-list--flat .ui-list-item,
.ui-list--flat .ui-list-item--clickable,
.ui-list--flat .ui-list-item--density,
.ui-list--flat .ui-list-item--disabled,
.ui-list--flat .ui-list-item--expanded,
.ui-list--flat .ui-list-item--selected,
.ui-list--flat .ui-list-item--state-alarm,
.ui-list--flat .ui-list-item--state-warning,
.ui-list--flat .ui-list-item--with-description,
.ui-list--flat .ui-list-item--with-link {
    border-bottom: 1px solid var(--color-border)
}

.ui-list--flat .ui-list-item .ui-list-item__content,
.ui-list--flat .ui-list-item--clickable .ui-list-item__content,
.ui-list--flat .ui-list-item--density .ui-list-item__content,
.ui-list--flat .ui-list-item--disabled .ui-list-item__content,
.ui-list--flat .ui-list-item--expanded .ui-list-item__content,
.ui-list--flat .ui-list-item--selected .ui-list-item__content,
.ui-list--flat .ui-list-item--state-alarm .ui-list-item__content,
.ui-list--flat .ui-list-item--state-warning .ui-list-item__content,
.ui-list--flat .ui-list-item--with-description .ui-list-item__content,
.ui-list--flat .ui-list-item--with-link .ui-list-item__content {
    background-color: transparent;
    border: none !important;
    border-radius: 0;
    padding: 0
}

.ui-list--flat .ui-list-item .ui-list-item__select-border,
.ui-list--flat .ui-list-item--clickable .ui-list-item__select-border,
.ui-list--flat .ui-list-item--density .ui-list-item__select-border,
.ui-list--flat .ui-list-item--disabled .ui-list-item__select-border,
.ui-list--flat .ui-list-item--expanded .ui-list-item__select-border,
.ui-list--flat .ui-list-item--selected .ui-list-item__select-border,
.ui-list--flat .ui-list-item--state-alarm .ui-list-item__select-border,
.ui-list--flat .ui-list-item--state-warning .ui-list-item__select-border,
.ui-list--flat .ui-list-item--with-description .ui-list-item__select-border,
.ui-list--flat .ui-list-item--with-link .ui-list-item__select-border {
    display: none !important
}

.ui-list--flat .ui-list-item .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--clickable .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--density .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--disabled .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--expanded .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--selected .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--state-alarm .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--state-warning .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--with-description .ui-list-item__link-icon,
.ui-list--flat .ui-list-item--with-link .ui-list-item__link-icon {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    justify-content: center;
    right: 0;
    width: var(--button-height-extra-small)
}

.ui-list--flat .ui-list-item--state-alarm .ui-list-item__content,
.ui-list--flat .ui-list-item--state-warning .ui-list-item__content,
.ui-list--flat .ui-list-item.ui-list-item--state-alarm .ui-list-item__content,
.ui-list--flat .ui-list-item.ui-list-item--state-warning .ui-list-item__content {
    padding-left: var(--main-spacing)
}

.ui-list--flat .ui-list-item--selected .ui-list-item-cell__sub-title,
.ui-list--flat .ui-list-item--selected .ui-list-item-cell__title .ui-typography:not(.ui-chip__text),
.ui-list--flat .ui-list-item.ui-list-item--selected .ui-list-item-cell__sub-title,
.ui-list--flat .ui-list-item.ui-list-item--selected .ui-list-item-cell__title .ui-typography:not(.ui-chip__text) {
    color: var(--color-active)
}

.ui-list--flat .ui-list-item--selected .ui-icon.ui-icon svg,
.ui-list--flat .ui-list-item.ui-list-item--selected .ui-icon.ui-icon svg {
    fill: var(--color-active)
}

.ui-list .ui-list .ui-list .ui-list-item__content .ui-list-item-cell:first-of-type {
    padding-left: 88px !important
}

.ui-list-item--clickable>.ui-list-item__content {
    cursor: pointer
}

@media(hover: hover) {

    .ui-list-item--clickable:hover+.ui-list-item--clickable>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--density>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--disabled>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--expanded>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--selected>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--state-alarm>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--state-warning>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--with-description>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item--with-link>.ui-list-item__border,
    .ui-list-item--clickable:hover+.ui-list-item>.ui-list-item__border,
    .ui-list-item--clickable:hover>.ui-list-item__border {
        left: 0 !important
    }

    .ui-list-item--clickable>.ui-list-item__content:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-list-item--clickable:active+.ui-list-item--clickable>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--density>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--disabled>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--expanded>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--selected>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--state-alarm>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--state-warning>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--with-description>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item--with-link>.ui-list-item__border,
.ui-list-item--clickable:active+.ui-list-item>.ui-list-item__border,
.ui-list-item--clickable:active>.ui-list-item__border {
    left: 0 !important
}

.ui-list-item--clickable>.ui-list-item__content:active {
    background-color: var(--color-active-background)
}

.ui-list-item--expanded .ui-list__item__expandable__content {
    max-height: 100%;
    overflow: visible
}

html[data-theme=skov] .ui-list-item .ui-list-item__content,
html[data-theme=skov] .ui-list-item--clickable .ui-list-item__content,
html[data-theme=skov] .ui-list-item--density .ui-list-item__content,
html[data-theme=skov] .ui-list-item--disabled .ui-list-item__content,
html[data-theme=skov] .ui-list-item--expanded .ui-list-item__content,
html[data-theme=skov] .ui-list-item--selected .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-alarm .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-warning .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-link .ui-list-item__content {
    border-left: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border)
}

html[data-theme=skov] .ui-list-item--clickable:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--density:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--disabled:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--expanded:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--selected:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-alarm:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-warning:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-link:first-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item:first-child .ui-list-item__content {
    border-top: 1px solid var(--color-border)
}

html[data-theme=skov] .ui-list-item--clickable:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--density:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--disabled:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--expanded:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--selected:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-alarm:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--state-warning:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-link:last-child .ui-list-item__content,
html[data-theme=skov] .ui-list-item:last-child .ui-list-item__content {
    border-bottom: 1px solid var(--color-border)
}

html[data-theme=skov] .ui-list-item--with-description+.ui-list-item .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--clickable .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--density .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--disabled .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--expanded .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--selected .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--state-alarm .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--state-warning .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--with-description .ui-list-item__content,
html[data-theme=skov] .ui-list-item--with-description+.ui-list-item--with-link .ui-list-item__content {
    border-top: 1px solid var(--color-border)
}

.ui-list-item-cell,
.ui-list-item-cell--align-right,
.ui-list-item-cell--chip-aligned-left,
.ui-list-item-cell--value,
.ui-list-item-cell--width {
    -webkit-box-flex: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    padding-right: var(--main-spacing)
}

.ui-list-item-cell--align-right:last-of-type,
.ui-list-item-cell--chip-aligned-left:last-of-type,
.ui-list-item-cell--value:last-of-type,
.ui-list-item-cell--width:last-of-type,
.ui-list-item-cell:last-of-type {
    padding-right: 0
}

.ui-list-item-cell__content {
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden
}

.ui-list-item-cell__title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-list-item-cell__sub-title,
.ui-list-item-cell__title>.ui-typography {
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-list-item-cell__icon {
    margin-right: 16px
}

.ui-list-item-cell__icon svg {
    fill: var(--color-font-subtitle1)
}

.ui-list-item-cell__chip {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 16px
}

.ui-list-item-cell__traffic-light {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: var(--icon-size);
    justify-content: center;
    margin-right: 16px;
    width: var(--icon-size)
}

.ui-list-item-cell--width-1 {
    -ms-flex-preferred-size: 8.33333%;
    flex-basis: 8.33333%;
    min-width: 0
}

.ui-list-item-cell--width-2 {
    -ms-flex-preferred-size: 16.66667%;
    flex-basis: 16.66667%;
    min-width: 0
}

.ui-list-item-cell--width-3 {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    min-width: 0
}

.ui-list-item-cell--width-4 {
    -ms-flex-preferred-size: 33.33333%;
    flex-basis: 33.33333%;
    min-width: 0
}

.ui-list-item-cell--width-5 {
    -ms-flex-preferred-size: 41.66667%;
    flex-basis: 41.66667%;
    min-width: 0
}

.ui-list-item-cell--width-6 {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    min-width: 0
}

.ui-list-item-cell--width-7 {
    -ms-flex-preferred-size: 58.33333%;
    flex-basis: 58.33333%;
    min-width: 0
}

.ui-list-item-cell--width-8 {
    -ms-flex-preferred-size: 66.66667%;
    flex-basis: 66.66667%;
    min-width: 0
}

.ui-list-item-cell--width-9 {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    min-width: 0
}

.ui-list-item-cell--width-10 {
    -ms-flex-preferred-size: 83.33333%;
    flex-basis: 83.33333%;
    min-width: 0
}

.ui-list-item-cell--width-11 {
    -ms-flex-preferred-size: 91.66667%;
    flex-basis: 91.66667%;
    min-width: 0
}

.ui-list-item-cell--width-12 {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    min-width: 0
}

.ui-list-item-cell--width-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.ui-list-item-cell--align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: right
}

.ui-list-item-cell--align-right .ui-list-item-cell__icon {
    margin-right: 0
}

.ui-list-item-cell--align-right .ui-list-item-cell__sub-title,
.ui-list-item-cell--align-right .ui-list-item-cell__title {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.ui-list-item-cell--value .ui-list-item-cell__title .ui-typography {
    color: var(--color-font-subtitle1)
}

.ui-list-item-cell--chip-aligned-left .ui-list-item-cell__chip {
    margin-left: 0;
    margin-right: 16px
}

.ui-list--primary .ui-list-item-cell .ui-list-item-cell__title>.ui-typography,
.ui-list--primary .ui-list-item-cell--align-right .ui-list-item-cell__title>.ui-typography,
.ui-list--primary .ui-list-item-cell--chip-aligned-left .ui-list-item-cell__title>.ui-typography,
.ui-list--primary .ui-list-item-cell--value .ui-list-item-cell__title>.ui-typography,
.ui-list--primary .ui-list-item-cell--width .ui-list-item-cell__title>.ui-typography {
    color: var(--color-white)
}

.ui-list--primary .ui-list-item-cell .ui-list-item-cell__sub-title,
.ui-list--primary .ui-list-item-cell--align-right .ui-list-item-cell__sub-title,
.ui-list--primary .ui-list-item-cell--chip-aligned-left .ui-list-item-cell__sub-title,
.ui-list--primary .ui-list-item-cell--value .ui-list-item-cell__sub-title,
.ui-list--primary .ui-list-item-cell--width .ui-list-item-cell__sub-title {
    color: var(--color-font-primary)
}

.ui-list--primary .ui-list-item-cell .ui-list-item-cell__icon svg,
.ui-list--primary .ui-list-item-cell--align-right .ui-list-item-cell__icon svg,
.ui-list--primary .ui-list-item-cell--chip-aligned-left .ui-list-item-cell__icon svg,
.ui-list--primary .ui-list-item-cell--value .ui-list-item-cell__icon svg,
.ui-list--primary .ui-list-item-cell--width .ui-list-item-cell__icon svg {
    fill: var(--color-font-primary)
}

.ui-list--primary .ui-list-item-cell--value .ui-list-item-cell__title>.ui-typography,
.ui-list--primary .ui-list-item-cell.ui-list-item-cell--value .ui-list-item-cell__title>.ui-typography {
    color: var(--color-font-primary)
}

.ui-traffic-light {
    -ms-flex-negative: 0;
    background-color: var(--color-primary);
    border-radius: 100%;
    flex-shrink: 0;
    height: var(--dot-size);
    width: var(--dot-size)
}

.ui-traffic-light--ok {
    background-color: var(--color-green)
}

.ui-traffic-light--warning {
    background-color: var(--color-warning)
}

.ui-traffic-light--alarm {
    background-color: var(--color-alarm)
}

.ui-traffic-light--indeterminate {
    background-color: var(--color-grey3)
}

.ui-list__item__expandable__content {
    max-height: 0;
    overflow: hidden;
    position: relative
}

.ui-list__item__expandable__content:after,
.ui-list__item__expandable__content:before {
    background-color: var(--color-border);
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1
}

.ui-list__item__expandable__content:after {
    bottom: -1px
}

.ui-list__item__expandable__content:before {
    top: 0
}

.ui-list__item__expandable__content .ui-list-item__content {
    background-color: var(--color-cloudy);
    min-height: calc(var(--list-item-height) - 8px) !important
}

.ui-list__item__expandable__content .ui-list-item__content .ui-list-item-cell:first-child {
    padding-left: var(--main-spacing)
}

.ui-list__item__expandable__content>.ui-list-item .ui-list-item__border {
    left: calc(var(--main-spacing)*2)
}

.ui-list__item__expandable__content .ui-list-item-cell__title .ui-typography {
    font-size: var(--base-font-size)
}

.ui-list__item__expandable__content .ui-list.ui-list .ui-list__header {
    border-bottom: 1px solid var(--color-border)
}

.ui-list__item__expandable__content .ui-list.ui-list .ui-list__items.ui-list__items.ui-list__items {
    border: 0;
    border-radius: 0
}

.ui-list--flat .ui-list__item__expandable__content {
    padding-left: calc(var(--icon-size) + 16px)
}

.ui-list--flat .ui-list__item__expandable__content .ui-list-item:last-child {
    border-bottom: none
}

.ui-list--flat .ui-list__item__expandable__content:after {
    content: none
}

.ui-list--flat .ui-list__item__expandable__content .ui-list-item__content.ui-list-item__content .ui-list-item-cell {
    padding: 0
}

.ui-dialog,
.ui-dialog--auto-width,
.ui-dialog--full-height,
.ui-dialog--full-width,
.ui-dialog--primary,
.ui-dialog--relative-to-container,
.ui-dialog--variant-form {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: center;
    align-content: center;
    align-items: center;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    will-change: opacity;
    z-index: var(--z-index-dialog)
}

.ui-dialog--relative-to-container,
.ui-dialog.ui-dialog--relative-to-container {
    -webkit-box-align: inherit;
    -ms-flex-align: inherit;
    -ms-flex-line-pack: inherit;
    align-content: inherit;
    align-items: inherit
}

html[data-theme=big-dutchman] .ui-dialog,
html[data-theme=big-dutchman] .ui-dialog--auto-width,
html[data-theme=big-dutchman] .ui-dialog--full-height,
html[data-theme=big-dutchman] .ui-dialog--full-width,
html[data-theme=big-dutchman] .ui-dialog--primary,
html[data-theme=big-dutchman] .ui-dialog--relative-to-container,
html[data-theme=big-dutchman] .ui-dialog--variant-form {
    -webkit-box-shadow: 20px 22px 65px 0 rgba(0, 0, 0, .4);
    box-shadow: 20px 22px 65px 0 rgba(0, 0, 0, .4)
}

html[data-theme=skov] .ui-dialog,
html[data-theme=skov] .ui-dialog--auto-width,
html[data-theme=skov] .ui-dialog--full-height,
html[data-theme=skov] .ui-dialog--full-width,
html[data-theme=skov] .ui-dialog--primary,
html[data-theme=skov] .ui-dialog--relative-to-container,
html[data-theme=skov] .ui-dialog--variant-form {
    -webkit-box-shadow: 12px 12px 48px 0 rgba(0, 0, 0, .48);
    box-shadow: 12px 12px 48px 0 rgba(0, 0, 0, .48)
}

.ui-dialog__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: calc(100vh - var(--main-spacing)*2);
    overflow: hidden;
    overflow-y: auto;
    pointer-events: all;
    width: var(--dialog-width);
    z-index: 1
}

.ui-dialog--primary .ui-dialog__title {
    color: var(--color-white)
}

.ui-dialog--primary .ui-dialog__text {
    color: var(--color-font-primary)
}

.ui-dialog--primary .ui-dialog__content {
    background-color: var(--color-primary-background)
}

.ui-dialog--full-width .ui-dialog__content {
    width: calc(100% - var(--main-spacing)*2)
}

.ui-dialog--auto-width .ui-dialog__content.ui-dialog__content {
    width: auto
}

.ui-dialog--relative-to-container {
    position: absolute
}

.ui-dialog--relative-to-container .ui-dialog__content {
    bottom: var(--main-spacing);
    left: var(--main-spacing);
    position: absolute;
    top: 50%;
    top: var(--main-spacing);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform: none;
    transform: none
}

.ui-dialog--relative-to-container .ui-dialog__content .ui-dialog-content {
    height: 100%
}

.ui-dialog--variant-form .ui-dialog-title {
    background-color: var(--color-primary-background);
    height: var(--main-nav-height);
    padding: 12px var(--dialog-padding)
}

.ui-dialog--variant-form .ui-dialog-title .ui-typography {
    color: var(--color-white);
    font-size: var(--h4-font-size);
    margin-bottom: 0
}

.ui-dialog--variant-form .ui-dialog-footer {
    margin-left: 0;
    padding-left: var(--dialog-padding)
}

.ui-dialog--variant-form .ui-dialog__content {
    background-color: var(--default-background-color);
    border-radius: 0
}

@media(min-width: 960px) {
    .ui-dialog--variant-form .ui-dialog-title {
        height: auto
    }

    .ui-dialog--variant-form .ui-dialog-title .ui-typography {
        font-size: var(--h5-font-size)
    }

    .ui-dialog--variant-form .ui-dialog__content {
        border-radius: var(--border-radius);
        height: auto;
        max-height: calc(100vh - var(--main-spacing)*2)
    }
}

.ui-dialog--full-height .ui-dialog-content,
.ui-dialog--full-height .ui-dialog__content {
    height: 100%
}

.ui-dialog-footer {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    background-color: var(--color-white);
    border-top: 1px solid var(--color-border);
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    margin-left: var(--dialog-padding);
    padding-bottom: var(--dialog-padding);
    padding-right: 24px;
    padding-top: var(--main-spacing);
    position: sticky
}

@media(min-width: 960px) {
    .ui-dialog-footer {
        padding-right: 32px
    }
}

.ui-dialog--primary .ui-dialog-footer {
    background-color: transparent;
    border-top-color: var(--color-border-primary)
}

.ui-dialog-jumbotron {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% + var(--dialog-padding)*2);
    margin-bottom: calc(var(--dialog-padding)*-1);
    margin-left: calc(var(--dialog-padding)*-1);
    margin-right: 0;
    margin-top: calc(var(--dialog-padding)*-1);
    padding: var(--dialog-padding);
    width: 280px
}

@media(min-width: 960px) {
    .ui-dialog-jumbotron {
        width: 338px
    }
}

.ui-dialog-jumbotron__title {
    margin-bottom: 16px
}

.ui-dialog-jumbotron__text {
    margin-bottom: var(--main-spacing)
}

.ui-dialog-jumbotron__icon {
    margin-bottom: 32px
}

.ui-dialog-jumbotron__icon svg {
    fill: var(--color-white)
}

.ui-dialog-jumbotron__children {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.ui-dialog--primary .ui-dialog-jumbotron {
    background-color: var(--color-primary-light)
}

.ui-dialog-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: var(--dialog-padding);
    padding-right: var(--dialog-padding);
    padding-top: var(--dialog-padding);
    position: sticky;
    top: 0
}

.ui-dialog-title__icon,
.ui-dialog-title__sign {
    margin-right: 12px
}

.ui-dialog--primary .ui-dialog-title .ui-typography {
    color: var(--color-white)
}

.ui-dialog-content,
.ui-dialog-content--remove-padding {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: overlay;
    padding: var(--dialog-padding)
}

.ui-dialog-content--remove-padding {
    padding: 0 !important
}

.ui-numeric-keypad,
.ui-numeric-keypad--no-controls,
.ui-numeric-keypad--without-title {
    margin: 0 auto;
    max-width: 250px;
    outline: none;
    width: 250px
}

@media(min-width: 960px) {

    .ui-numeric-keypad,
    .ui-numeric-keypad--no-controls,
    .ui-numeric-keypad--without-title {
        max-width: 416px;
        width: 416px
    }
}

.ui-numeric-keypad__keys {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    top: -16px
}

.ui-numeric-keypad__keys>div {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 0px;
    flex: 0 1 0
}

.ui-numeric-keypad .ui-button-round,
.ui-numeric-keypad--no-controls .ui-button-round,
.ui-numeric-keypad--without-title .ui-button-round {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    margin-bottom: 4px;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative
}

@media(hover: hover) {

    .ui-numeric-keypad .ui-button-round,
    .ui-numeric-keypad--no-controls .ui-button-round,
    .ui-numeric-keypad--without-title .ui-button-round {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-numeric-keypad .ui-button-round:hover,
    .ui-numeric-keypad--no-controls .ui-button-round:hover,
    .ui-numeric-keypad--without-title .ui-button-round:hover {
        opacity: .8
    }
}

.ui-numeric-keypad .ui-button-round:active,
.ui-numeric-keypad--no-controls .ui-button-round:active,
.ui-numeric-keypad--without-title .ui-button-round:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: .7
}

@media(min-width: 960px) {

    .ui-numeric-keypad .ui-button-round,
    .ui-numeric-keypad--no-controls .ui-button-round,
    .ui-numeric-keypad--without-title .ui-button-round {
        margin-bottom: 8px
    }

    .ui-numeric-keypad .ui-button-round .ui-icon,
    .ui-numeric-keypad .ui-button-round .ui-icon svg,
    .ui-numeric-keypad--no-controls .ui-button-round .ui-icon,
    .ui-numeric-keypad--no-controls .ui-button-round .ui-icon svg,
    .ui-numeric-keypad--without-title .ui-button-round .ui-icon,
    .ui-numeric-keypad--without-title .ui-button-round .ui-icon svg {
        height: 44px;
        width: 44px
    }
}

.ui-numeric-keypad__typed {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(var(--numeric-keypad-typed-height) + 16px + var(--chip-height));
    position: relative;
    width: 100%
}

.ui-numeric-keypad__typed input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: inline-block;
    font-size: var(--numeric-keypad-typed-font-size);
    height: 100%;
    line-height: 0;
    outline: none;
    padding: 0;
    text-align: right;
    width: 100%
}

.ui-numeric-keypad__typed div {
    text-align: right
}

.ui-numeric-keypad__combined-buttons .ui-button-round {
    margin-bottom: 0
}

.ui-numeric-keypad__combined-buttons .ui-button-round:first-child,
.ui-numeric-keypad__combined-buttons .ui-button-round:first-child:after {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-numeric-keypad__combined-buttons .ui-button-round:last-child,
.ui-numeric-keypad__combined-buttons .ui-button-round:last-child:after {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.ui-numeric-keypad__combined-buttons--alone .ui-button-round:first-child,
.ui-numeric-keypad__combined-buttons--alone .ui-button-round:last-child {
    border-radius: 100%
}

.ui-numeric-keypad__errors.ui-numeric-keypad__errors {
    position: absolute;
    right: 0;
    top: -8px
}

.ui-numeric-keypad__errors.ui-numeric-keypad__errors .ui-chip {
    margin-right: 8px
}

.ui-numeric-keypad__errors.ui-numeric-keypad__errors .ui-chip:last-of-type {
    margin-right: 0
}

.ui-numeric-keypad__controls-buttons>:nth-child(n+2) {
    margin-top: 16px
}

.ui-numeric-keypad__controls-buttons .ui-numeric-keypad__max-button>.ui-typography,
.ui-numeric-keypad__controls-buttons .ui-numeric-keypad__min-button>.ui-typography {
    font-size: 18px
}

@media(min-width: 1152px) {

    .ui-numeric-keypad__controls-buttons .ui-numeric-keypad__max-button>.ui-typography,
    .ui-numeric-keypad__controls-buttons .ui-numeric-keypad__min-button>.ui-typography {
        font-size: 28px
    }
}

.ui-numeric-keypad--without-title .ui-numeric-keypad__typed {
    display: none
}

.ui-numeric-keypad--no-controls {
    width: 200px
}

@media(min-width: 960px) {
    .ui-numeric-keypad--no-controls {
        width: 304px
    }
}

.ui-numeric-keypad--layout-pin-code {
    max-width: 200px;
    width: 200px
}

@media(min-width: 960px) {
    .ui-numeric-keypad--layout-pin-code {
        max-width: 304px;
        width: 304px
    }
}

.ui-numeric-keypad--layout-phone-dial {
    max-width: 200px;
    width: 200px
}

.ui-numeric-keypad--layout-phone-dial .ui-numeric-keypad__back-space-button {
    position: absolute;
    right: calc((var(--button-round-height)*2)*-1);
    top: calc(var(--numeric-keypad-typed-height)/2*-1 + var(--button-round-height)/2*-1 + -16px)
}

@media(min-width: 960px) {
    .ui-numeric-keypad--layout-phone-dial {
        max-width: 304px;
        width: 304px
    }
}

html[data-theme=skov] .ui-numeric-keypad__combined-buttons .ui-button-round:first-child {
    border-bottom: 1px solid #093f1b
}

html[data-theme=skov] .ui-numeric-keypad__typed input,
html[data-theme=skov] .ui-numeric-keypad__typed>div {
    color: #fff;
    font-family: Noto Sans Display, sans-serif;
    font-weight: 400
}

html[data-theme=big-dutchman] .ui-numeric-keypad .ui-typography,
html[data-theme=big-dutchman] .ui-numeric-keypad--no-controls .ui-typography,
html[data-theme=big-dutchman] .ui-numeric-keypad--without-title .ui-typography {
    text-align: left !important
}

html[data-theme=big-dutchman] .ui-numeric-keypad__combined-buttons .ui-button-round:first-child {
    border-bottom: 1px solid #474747
}

html[data-theme=big-dutchman] .ui-numeric-keypad__typed input,
html[data-theme=big-dutchman] .ui-numeric-keypad__typed>div {
    color: #fff;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-weight: 400;
    text-align: left
}

html[data-theme=big-dutchman] .ui-numeric-keypad__errors {
    left: 0
}

.ui-password-display,
.ui-password-display--error,
.ui-password-display--success {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 100px;
    margin-bottom: 32px;
    position: relative;
    width: 400px
}

@media(min-width: 960px) {

    .ui-password-display,
    .ui-password-display--error,
    .ui-password-display--success {
        height: 150px;
        width: 540px
    }
}

.ui-password-display__digits {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    justify-content: center;
    margin: auto;
    padding: 0 4px;
    width: 200px
}

@media(min-width: 960px) {
    .ui-password-display__digits {
        width: 304px
    }
}

.ui-password-display__digit,
.ui-password-display__digit--filled,
.ui-password-display__digit--next {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    width: 50px
}

.ui-password-display__digit .ui-dot,
.ui-password-display__digit--filled .ui-dot,
.ui-password-display__digit--next .ui-dot {
    border-radius: 100%;
    border-style: solid;
    border-width: 2px;
    height: 20px;
    -webkit-transition: .2s;
    transition: .2s;
    width: 20px
}

@media(min-width: 960px) {

    .ui-password-display__digit,
    .ui-password-display__digit--filled,
    .ui-password-display__digit--next {
        width: 76px
    }

    .ui-password-display__digit .ui-dot,
    .ui-password-display__digit--filled .ui-dot,
    .ui-password-display__digit--next .ui-dot {
        border-width: 4px;
        height: 32px;
        width: 32px
    }
}

.ui-password-display__show-password {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: 0;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-password-display__show-password .ui-icon,
.ui-password-display__show-password .ui-icon svg {
    height: 32px;
    width: 32px
}

.ui-password-display__error {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-password-display__success {
    opacity: 0;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%) scale(0) rotate(-40deg);
    transform: translateY(-50%) scale(0) rotate(-40deg);
    -webkit-transition: .5s;
    transition: .5s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    visibility: hidden
}

.ui-password-display--error .ui-password-display__digits {
    -webkit-animation: wobbleDigits .35s linear 1;
    animation: wobbleDigits .35s linear 1
}

.ui-password-display--success .ui-password-display__show-password {
    opacity: 0;
    visibility: hidden
}

.ui-password-display--success .ui-password-display__success {
    opacity: 1;
    -webkit-transform: translateY(-50%) scale(1) rotate(0);
    transform: translateY(-50%) scale(1) rotate(0);
    visibility: visible
}

@-webkit-keyframes wobbleDigits {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    15% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    30% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    45% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    75% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes wobbleDigits {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    15% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    30% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    45% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    75% {
        -webkit-transform: translateX(-3%);
        transform: translateX(-3%)
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

html[data-theme=skov] .ui-password-display,
html[data-theme=skov] .ui-password-display--error,
html[data-theme=skov] .ui-password-display--success {
    border-bottom-color: #406E00;
    color: #fff;
    font-family: Noto Sans Display, sans-serif;
    font-size: 48px
}

@media(min-width: 960px) {

    html[data-theme=skov] .ui-password-display,
    html[data-theme=skov] .ui-password-display--error,
    html[data-theme=skov] .ui-password-display--success {
        font-size: 96px
    }
}

html[data-theme=skov] .ui-password-display__digit .ui-dot,
html[data-theme=skov] .ui-password-display__digit--filled .ui-dot,
html[data-theme=skov] .ui-password-display__digit--next .ui-dot {
    border-color: #406E00
}

html[data-theme=skov] .ui-password-display__show-password .ui-icon svg {
    fill: #fff
}

html[data-theme=skov] .ui-password-display__digit--filled .ui-dot {
    background-color: #fff;
    border-color: #fff
}

html[data-theme=skov] .ui-password-display__digit--next .ui-dot {
    border-color: #fff
}

html[data-theme=skov] .ui-password-display__success {
    height: var(--button-height-small);
    width: var(--button-height-small)
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-password-display__success {
        height: var(--button-height);
        width: var(--button-height)
    }
}

html[data-theme=big-dutchman] .ui-password-display,
html[data-theme=big-dutchman] .ui-password-display--error,
html[data-theme=big-dutchman] .ui-password-display--success {
    border-bottom-color: #686868;
    color: #fff;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-size: 48px
}

@media(min-width: 960px) {

    html[data-theme=big-dutchman] .ui-password-display,
    html[data-theme=big-dutchman] .ui-password-display--error,
    html[data-theme=big-dutchman] .ui-password-display--success {
        font-size: 96px
    }
}

html[data-theme=big-dutchman] .ui-password-display__digit .ui-dot,
html[data-theme=big-dutchman] .ui-password-display__digit--filled .ui-dot,
html[data-theme=big-dutchman] .ui-password-display__digit--next .ui-dot {
    border-color: #686868
}

html[data-theme=big-dutchman] .ui-password-display__show-password .ui-icon svg {
    fill: #fff
}

html[data-theme=big-dutchman] .ui-password-display__digit--filled .ui-dot {
    background-color: #fff;
    border-color: #fff
}

html[data-theme=big-dutchman] .ui-password-display__digit--next .ui-dot {
    border-color: #fff
}

html[data-theme=big-dutchman] .ui-password-display__success {
    height: var(--button-height-small);
    width: var(--button-height-small)
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-password-display__success {
        height: var(--button-height);
        width: var(--button-height)
    }
}

.ui-time-editor,
.ui-time-editor--time {
    -webkit-box-orient: vertical;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    -ms-flex-line-pack: stretch;
    align-items: stretch;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto;
    position: relative;
    text-align: center
}

.ui-time-editor,
.ui-time-editor--time,
.ui-time-editor__inner {
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-content: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

.ui-time-editor__inner {
    -webkit-box-orient: horizontal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: stretch;
    align-items: center;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.ui-time-editor__inner .ui-time-editor__format {
    display: inline-block;
    margin-right: 35px;
    position: relative
}

.ui-time-editor__inner .ui-time-editor__format:last-child {
    margin-right: 0
}

@media(min-width: 960px) {
    .ui-time-editor__inner .ui-time-editor__format {
        margin-right: 60px
    }
}

.ui-time-editor--negate-sign-visible .ui-time-editor__format:last-child {
    margin-right: 40px
}

.ui-time-editor__value {
    line-height: 1;
    position: relative
}

.ui-time-editor__label {
    bottom: auto;
    font-size: var(--body1-font-size);
    left: 0;
    line-height: 1;
    margin-left: 4px;
    margin-top: -16px;
    overflow: hidden;
    position: absolute;
    right: 0;
    text-overflow: ellipsis;
    top: 0;
    white-space: nowrap
}

.ui-time-editor .ui-button-round:first-of-type,
.ui-time-editor--time .ui-button-round:first-of-type {
    margin-bottom: 32px
}

.ui-time-editor .ui-button-round:last-of-type,
.ui-time-editor--time .ui-button-round:last-of-type {
    margin-top: 32px
}

@media(min-width: 960px) {

    .ui-time-editor .ui-button-round:first-of-type,
    .ui-time-editor--time .ui-button-round:first-of-type {
        margin-bottom: 64px
    }

    .ui-time-editor .ui-button-round:last-of-type,
    .ui-time-editor--time .ui-button-round:last-of-type {
        margin-top: 64px
    }
}

.ui-time-editor__sign {
    margin-left: -40px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-time-editor__fab {
    display: inline-block;
    position: relative
}

.ui-time-editor--time .ui-time-editor__format {
    margin-right: 45px
}

.ui-time-editor--time .ui-time-editor__format:last-child .ui-time-editor__value:after {
    content: none
}

.ui-time-editor--time .ui-time-editor__value:after {
    content: ":";
    left: 100%;
    margin-left: 12px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-time-editor--time .ui-time-editor .ui-button-round:first-of-type,
.ui-time-editor--time .ui-time-editor--time .ui-button-round:first-of-type {
    margin-bottom: 48px
}

.ui-time-editor--time .ui-time-editor .ui-button-round:last-of-type,
.ui-time-editor--time .ui-time-editor--time .ui-button-round:last-of-type {
    margin-top: 32px
}

@media(min-width: 960px) {

    .ui-time-editor--time .ui-time-editor .ui-button-round:first-of-type,
    .ui-time-editor--time .ui-time-editor--time .ui-button-round:first-of-type {
        margin-bottom: 80px
    }

    .ui-time-editor--time .ui-time-editor .ui-button-round:last-of-type,
    .ui-time-editor--time .ui-time-editor--time .ui-button-round:last-of-type {
        margin-top: 64px
    }

    .ui-time-editor--time .ui-time-editor__format {
        margin-right: 60px
    }

    .ui-time-editor--time .ui-time-editor__value:after {
        margin-left: 16px
    }
}

.ui-time-editor .ui-chip,
.ui-time-editor--time .ui-chip {
    bottom: calc(100% + var(--main-spacing));
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

html[data-theme=skov] .ui-time-editor__value {
    color: #fff;
    font-family: Noto Sans Display, sans-serif;
    font-size: 82px;
    font-weight: 400
}

@media(min-width: 960px) {
    html[data-theme=skov] .ui-time-editor__value {
        font-size: 120px
    }
}

html[data-theme=big-dutchman] .ui-time-editor__value {
    color: #fff;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-size: 76px;
    font-weight: 400
}

@media(min-width: 960px) {
    html[data-theme=big-dutchman] .ui-time-editor__value {
        font-size: 110px
    }
}

.ui-press-and-hold,
.ui-press-and-hold--timer-completed {
    height: 350px;
    margin: 0 auto;
    position: relative;
    width: 350px
}

@media(min-width: 960px) {

    .ui-press-and-hold,
    .ui-press-and-hold--timer-completed {
        height: 620px;
        width: 620px
    }
}

.ui-press-and-hold__content {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 45%
}

.ui-press-and-hold__content .ui-typography {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    bottom: 68%;
    display: -webkit-box;
    font-size: var(--caption-font-size);
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    opacity: 1;
    overflow: hidden;
    position: absolute;
    right: 0;
    text-align: center;
    text-overflow: ellipsis;
    -webkit-transition: .45s;
    transition: .45s;
    width: 100%;
    word-break: break-word
}

@media(min-width: 960px) {
    .ui-press-and-hold__content {
        width: 40%
    }

    .ui-press-and-hold__content .ui-typography {
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        bottom: 66%;
        display: -webkit-box;
        font-size: var(--subtitle1-font-size);
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
        word-break: break-word
    }
}

.ui-press-and-hold__button {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-press-and-hold__success {
    background-color: var(--color-success);
    border-radius: 100%;
    bottom: 0;
    left: 0;
    margin: 4%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scale(0) rotate(-90deg);
    transform: scale(0) rotate(-90deg);
    visibility: hidden
}

.ui-press-and-hold__success .ui-icon.ui-icon {
    height: 100px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100px
}

.ui-press-and-hold__success .ui-icon.ui-icon svg {
    fill: var(--color-white);
    height: 100px;
    width: 100px
}

@media(min-width: 960px) {

    .ui-press-and-hold__success .ui-icon.ui-icon,
    .ui-press-and-hold__success .ui-icon.ui-icon svg {
        height: 180px;
        width: 180px
    }
}

.ui-press-and-hold__progress {
    stroke: var(--color-white);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: rotate(-86deg);
    transform: rotate(-86deg)
}

.ui-press-and-hold--timer-completed .ui-press-and-hold__content .sub-head {
    margin-bottom: 200%;
    opacity: 0;
    visibility: hidden
}

.ui-press-and-hold--timer-completed .ui-press-and-hold__success {
    -webkit-animation-delay: .55s;
    animation-delay: .55s;
    -webkit-animation-duration: .55s;
    animation-duration: .55s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: UIPressAndHoldSuccessAnimation;
    animation-name: UIPressAndHoldSuccessAnimation;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    opacity: 1;
    -webkit-transform: scale(0) rotate(-90deg);
    transform: scale(0) rotate(-90deg);
    visibility: visible
}

@-webkit-keyframes UIPressAndHoldCircleAnimation {
    to {
        stroke-dashoffset: 0
    }
}

@keyframes UIPressAndHoldCircleAnimation {
    to {
        stroke-dashoffset: 0
    }
}

@-webkit-keyframes UIPressAndHoldSuccessAnimation {
    0% {
        -webkit-transform: scale(0) rotate(-90deg);
        transform: scale(0) rotate(-90deg)
    }

    50% {
        -webkit-transform: scale(1.05) rotate(20deg);
        transform: scale(1.05) rotate(20deg)
    }

    to {
        -webkit-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0)
    }
}

@keyframes UIPressAndHoldSuccessAnimation {
    0% {
        -webkit-transform: scale(0) rotate(-90deg);
        transform: scale(0) rotate(-90deg)
    }

    50% {
        -webkit-transform: scale(1.05) rotate(20deg);
        transform: scale(1.05) rotate(20deg)
    }

    to {
        -webkit-transform: scale(1) rotate(0);
        transform: scale(1) rotate(0)
    }
}

.ui-stepper,
.ui-stepper--level,
.ui-stepper--visible {
    list-style: none;
    margin: 0;
    overflow: hidden;
    padding: 0
}

.ui-stepper .ui-stepper,
.ui-stepper .ui-stepper--level,
.ui-stepper .ui-stepper--visible,
.ui-stepper--level .ui-stepper,
.ui-stepper--level .ui-stepper--level,
.ui-stepper--level .ui-stepper--visible,
.ui-stepper--visible .ui-stepper,
.ui-stepper--visible .ui-stepper--level,
.ui-stepper--visible .ui-stepper--visible {
    padding-left: 16px
}

li ol {
    display: none
}

li.active.open>ol,
li.done>ol {
    display: block;
    padding-left: 16px
}

li.ui-stepper__step {
    display: block;
    opacity: .4
}

li.ui-stepper__step.ui-stepper__step-hidden.ui-stepper__step-hidden {
    display: none
}

li.ui-stepper__step.active .ui-stepper__step {
    opacity: .4
}

li.ui-stepper__step.active,
li.ui-stepper__step.done {
    opacity: 1
}

li.ui-stepper__step.active>.ui-stepper,
li.ui-stepper__step.active>.ui-stepper--level,
li.ui-stepper__step.active>.ui-stepper--visible,
li.ui-stepper__step.done>.ui-stepper,
li.ui-stepper__step.done>.ui-stepper--level,
li.ui-stepper__step.done>.ui-stepper--visible {
    max-height: 100%;
    overflow: visible
}

li.ui-stepper__step.active~li {
    opacity: .4
}

li.ui-stepper__step.active-children>.ui-stepper__name .ui-stepper__dot,
li.ui-stepper__step.active>.ui-stepper__name .ui-stepper__dot,
li.ui-stepper__step.done>.ui-stepper__name .ui-stepper__dot {
    background: var(--color-success)
}

.ui-stepper__name {
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    word-break: break-word
}

.ui-stepper__name .ui-stepper__dot {
    border-radius: 8px;
    height: 8px;
    margin-right: 8px;
    margin-top: 2px;
    width: 8px
}

.ui-stepper--level {
    max-height: 0;
    overflow: hidden;
    padding-left: 8px
}

.ui-stepper--level .ui-stepper__step {
    margin: 8px
}

@media(min-width: 960px) {
    .ui-stepper--level {
        padding-left: 16px
    }
}

html[data-theme=skov] .ui-stepper__step.active-children>.ui-stepper__name,
html[data-theme=skov] .ui-stepper__step.active>.ui-stepper__name {
    color: #383838;
    font-weight: 500
}

html[data-theme=skov] .ui-stepper__name {
    color: #787878
}

html[data-theme=skov] .ui-stepper__name .ui-stepper__dot {
    background: #787878
}

html[data-theme=big-dutchman] .ui-stepper__step.active-children>.ui-stepper__name,
html[data-theme=big-dutchman] .ui-stepper__step.active>.ui-stepper__name {
    color: #3a3d3d;
    font-weight: 700
}

html[data-theme=big-dutchman] .ui-stepper__name {
    color: #a0a0a0
}

html[data-theme=big-dutchman] .ui-stepper__name .ui-stepper__dot {
    background: #a0a0a0
}

.ui-controller-illustration__illustration {
    border-radius: var(--border-radius);
    height: var(--controller-illustration-height);
    margin: 0 auto;
    position: relative;
    width: var(--controller-illustration-width)
}

.ui-controller-illustration__screen {
    border: 20px solid var(--color-black);
    border-radius: var(--border-radius);
    height: calc(var(--controller-illustration-height)/1.4);
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: calc(var(--controller-illustration-width)/1.2)
}

@media(min-width: 960px) {
    .ui-controller-illustration__screen {
        border-width: 30px
    }
}

.ui-controller-illustration__icon {
    left: 50%;
    opacity: 1;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-controller-illustration__icon,
.ui-controller-illustration__icon svg {
    height: calc(var(--controller-illustration-width)/4);
    width: calc(var(--controller-illustration-width)/4)
}

html[data-theme=skov] .ui-controller-illustration__illustration {
    background-color: #00704b;
    -webkit-box-shadow: 0 0 30px 10px rgba(0, 0, 0, .2);
    box-shadow: 0 0 30px 10px rgba(0, 0, 0, .2)
}

html[data-theme=skov] .ui-controller-illustration__screen {
    background-color: #f8f8f8
}

html[data-theme=big-dutchman] .ui-controller-illustration__illustration {
    background-color: silver;
    -webkit-box-shadow: 0 0 30px 10px rgba(0, 0, 0, .1);
    box-shadow: 0 0 30px 10px rgba(0, 0, 0, .1)
}

html[data-theme=big-dutchman] .ui-controller-illustration__screen {
    background-color: #f8f8f8
}

.ui-side-panel,
.ui-side-panel--align-left,
.ui-side-panel--align-right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    bottom: 0;
    -webkit-box-shadow: 0 0 65px 0 rgba(0, 0, 0, .4);
    box-shadow: 0 0 65px 0 rgba(0, 0, 0, .4);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100vh;
    position: fixed;
    top: 0;
    width: var(--side-panel-width);
    will-change: left, right;
    z-index: var(--z-index-panel)
}

.ui-side-panel__header {
    -ms-flex-align: center;
    -webkit-box-flex: 0;
    background-color: var(--color-primary);
    -ms-flex: 0 0 var(--side-panel-header-height);
    flex: 0 0 var(--side-panel-header-height);
    padding: 0 var(--main-spacing)
}

.ui-side-panel__header,
.ui-side-panel__header button {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--side-panel-header-height)
}

.ui-side-panel__header button {
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    justify-content: center;
    outline: none;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s;
    width: var(--main-nav-link-min-width)
}

.ui-side-panel__header button:before {
    background-color: var(--color-border-primary);
    content: "";
    height: calc(var(--side-panel-header-height) - var(--main-spacing)*2);
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px
}

.ui-side-panel__header button .ui-icon svg {
    fill: var(--color-font-primary);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-side-panel__header button:hover {
    background-color: var(--color-primary-hover-background)
}

.ui-side-panel__header button:hover .ui-icon svg {
    fill: var(--color-white)
}

.ui-side-panel__header button:active {
    background-color: var(--color-primary-active-background)
}

.ui-side-panel__header button:active .ui-icon svg {
    fill: var(--color-white)
}

@media(min-width: 960px) {
    .ui-side-panel__header {
        padding-left: calc(var(--main-spacing)*2 + var(--button-height))
    }

    .ui-side-panel__header button {
        border-radius: 100%;
        left: 0;
        width: var(--side-panel-header-height)
    }

    .ui-side-panel__header button:before {
        content: none
    }
}

.ui-side-panel__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--default-background-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% - var(--main-spacing)*2.5);
    padding: var(--main-spacing);
    position: relative
}

.ui-side-panel__content>* {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -ms-flex-negative: 1;
    flex-grow: 0;
    flex-shrink: 1
}

.ui-side-panel--align-left .ui-side-panel__header {
    padding-left: var(--main-spacing);
    padding-right: calc(var(--main-spacing)*2 + var(--button-height))
}

.ui-side-panel--align-left .ui-side-panel__header button {
    left: auto;
    right: 0
}

.ui-side-panel--size-large {
    width: var(--side-panel-width-large)
}

.ui-side-panel-footer {
    background-color: var(--default-background-color);
    border-top: 1px solid var(--color-border);
    margin-top: auto;
    padding-top: var(--main-spacing)
}

.ui-side-panel-scrollable-content {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    height: 100%;
    margin: 0 calc(var(--main-spacing)*-1);
    overflow-y: overlay;
    padding: var(--main-spacing);
    position: relative
}

@-moz-document url-prefix("") {
    .ui-side-panel-scrollable-content {
        overflow-y: auto
    }
}

.ui-battery,
.ui-battery--theme-primary {
    background-color: var(--color-border);
    border-radius: var(--battery-border-radius);
    display: inline-block;
    height: var(--battery-height);
    position: relative;
    top: var(--battery-cap-height);
    width: var(--icon-size)
}

.ui-battery--theme-primary:before,
.ui-battery:before {
    background-color: var(--color-border);
    border-top-left-radius: var(--battery-border-radius);
    border-top-right-radius: var(--battery-border-radius);
    content: "";
    height: var(--battery-cap-height);
    left: 50%;
    position: absolute;
    top: calc(var(--battery-cap-height)*-1);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .2s;
    transition: .2s;
    width: 12px
}

.ui-battery--theme-primary:after,
.ui-battery:after {
    background-color: var(--color-alarm);
    border-bottom-left-radius: var(--battery-border-radius);
    border-bottom-right-radius: var(--battery-border-radius);
    bottom: 0;
    content: "";
    height: 0%;
    left: 0;
    position: absolute;
    right: 0;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-battery--theme-primary,
.ui-battery--theme-primary:before {
    background-color: var(--color-font-primary)
}

.ui-battery--level-1:after {
    height: calc(10% + var(--battery-cap-height))
}

.ui-battery--level-2:after {
    height: calc(20% + var(--battery-cap-height))
}

.ui-battery--level-3:after {
    background-color: var(--color-warning);
    height: calc(30% + var(--battery-cap-height))
}

.ui-battery--level-4:after {
    background-color: var(--color-warning);
    height: calc(40% + var(--battery-cap-height))
}

.ui-battery--level-5:after {
    background-color: var(--color-warning);
    height: calc(50% + var(--battery-cap-height))
}

.ui-battery--level-6:after {
    background-color: var(--color-success);
    height: calc(60% + var(--battery-cap-height))
}

.ui-battery--level-7:after {
    background-color: var(--color-success);
    height: calc(70% + var(--battery-cap-height))
}

.ui-battery--level-8:after {
    background-color: var(--color-success);
    height: calc(80% + var(--battery-cap-height))
}

.ui-battery--level-9:after {
    border-radius: var(--battery-border-radius);
    height: calc(90% + var(--battery-cap-height))
}

.ui-battery--level-10:after,
.ui-battery--level-10:before,
.ui-battery--level-9:after {
    background-color: var(--color-success)
}

.ui-battery--level-10:after {
    border-radius: var(--battery-border-radius);
    height: 100%
}

.ui-touch-keyboard,
.ui-touch-keyboard--disabled,
.ui-touch-keyboard--shift {
    --key-width: 20px;
    --keys-gutter: 3px;
    --typed-font-size: 6em;
    --typed-height: 18vh;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 20%;
    height: 100%;
    outline: none;
    position: relative;
    -ms-touch-action: none !important;
    touch-action: none !important;
    width: 100%
}

.ui-touch-keyboard input,
.ui-touch-keyboard--disabled input,
.ui-touch-keyboard--shift input {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ui-touch-keyboard input::-moz-selection,
.ui-touch-keyboard--disabled input::-moz-selection,
.ui-touch-keyboard--shift input::-moz-selection {
    background: transparent
}

.ui-touch-keyboard input::selection,
.ui-touch-keyboard--disabled input::selection,
.ui-touch-keyboard--shift input::selection {
    background: transparent
}

.disabled.ui-touch-keyboard--disabled .touch-keyboard-key--button,
.disabled.ui-touch-keyboard--disabled .ui-button-round,
.disabled.ui-touch-keyboard--disabled input,
.disabled.ui-touch-keyboard--shift .touch-keyboard-key--button,
.disabled.ui-touch-keyboard--shift .ui-button-round,
.disabled.ui-touch-keyboard--shift input,
.ui-touch-keyboard.disabled .touch-keyboard-key--button,
.ui-touch-keyboard.disabled .ui-button-round,
.ui-touch-keyboard.disabled input {
    opacity: .5;
    pointer-events: none
}

@media(min-width: 0) {

    .ui-touch-keyboard,
    .ui-touch-keyboard--disabled,
    .ui-touch-keyboard--shift {
        --key-width: 42px
    }
}

@media(min-width: 640px) {

    .ui-touch-keyboard,
    .ui-touch-keyboard--disabled,
    .ui-touch-keyboard--shift {
        --key-width: 73px;
        --keys-gutter: 4px;
        font-size: 45%
    }
}

@media(min-width: 960px) {

    .ui-touch-keyboard,
    .ui-touch-keyboard--disabled,
    .ui-touch-keyboard--shift {
        --key-width: 100px;
        --typed-height: 180px;
        --keys-gutter: 8px;
        font-size: 100%
    }
}

@media(min-width: 1152px) {

    .ui-touch-keyboard,
    .ui-touch-keyboard--disabled,
    .ui-touch-keyboard--shift {
        --typed-height: 200px
    }
}

.ui-touch-keyboard__typed {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: var(--color-white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: var(--typed-font-size);
    height: var(--typed-height);
    line-height: var(--typed-height);
    outline: none;
    position: relative;
    top: calc(var(--chip-height)/2*-1 + -4px);
    width: calc(100% - var(--button-height) - var(--main-spacing))
}

textarea.ui-touch-keyboard__typed {
    font-size: calc(var(--typed-font-size)/2);
    line-height: calc(var(--typed-font-size) + 1.2);
    overflow: hidden;
    padding-bottom: 0;
    padding-left: 0;
    padding-top: 0;
    resize: none;
    top: 0
}

.ui-touch-keyboard__keys {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    margin: 0 calc(var(--keys-gutter)/2*-1);
    text-align: center
}

.ui-touch-keyboard__errors {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: var(--chip-height);
    margin-bottom: 8px;
    margin-top: 8px;
    position: relative
}

.ui-touch-keyboard__errors .ui-chip {
    margin-right: 8px
}

.ui-touch-keyboard__errors .ui-chip:last-child {
    margin-right: 0
}

.ui-touch-keyboard__clear-all {
    bottom: 0;
    position: absolute;
    right: 0;
    top: calc((var(--chip-height) + 8px)*-1);
    width: calc(var(--button-height) + var(--main-spacing))
}

.ui-touch-keyboard__clear-all .ui-button-round {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-touch-keyboard__title {
    margin: 0
}

.ui-touch-keyboard__keys-row {
    -ms-flex-negative: 1;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    -ms-flex-preferred-size: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-basis: 100%;
    flex-grow: 1;
    flex-shrink: 1;
    justify-content: center;
    max-height: var(--button-round-height-large);
    padding-bottom: calc(var(--keys-gutter)*2)
}

.ui-touch-keyboard--shift .touch-keyboard-key:not(.touch-keyboard-key--button) {
    text-transform: uppercase
}

.ui-touch-keyboard--disabled .touch-keyboars-key {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: .5;
    pointer-events: none
}

html[data-theme=skov] .ui-touch-keyboard__typed {
    font-family: Noto Sans, sans-serif;
    font-weight: 400
}

html[data-theme=big-dutchman] .ui-touch-keyboard__typed {
    font-family: Open Sans, Noto Sans, sans-serif;
    font-weight: 400
}

.touch-keyboard-key,
.touch-keyboard-key--placeholder,
.touch-keyboard-key--theme-primary,
.touch-keyboard-key--theme-primary-light,
.touch-keyboard-key--variant-alt-gr,
.touch-keyboard-key--variant-backspace,
.touch-keyboard-key--variant-lang-backspace,
.touch-keyboard-key--variant-lang-key,
.touch-keyboard-key--variant-lang-shift,
.touch-keyboard-key--variant-lang-space,
.touch-keyboard-key--variant-lang-special,
.touch-keyboard-key--variant-shift,
.touch-keyboard-key--variant-space,
.touch-keyboard-key--variant-special {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: var(--button-box-shadow);
    box-shadow: var(--button-box-shadow);
    color: var(--color-white);
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: var(--caption-font-size);
    height: 100%;
    justify-content: center;
    margin-left: calc(var(--keys-gutter)/2);
    margin-right: calc(var(--keys-gutter)/2);
    max-width: 1000px;
    outline: none;
    position: relative;
    -ms-touch-action: none !important;
    touch-action: none !important;
    vertical-align: middle;
    width: var(--key-width)
}

.touch-keyboard-key .ui-icon,
.touch-keyboard-key--placeholder .ui-icon,
.touch-keyboard-key--theme-primary .ui-icon,
.touch-keyboard-key--theme-primary-light .ui-icon,
.touch-keyboard-key--variant-alt-gr .ui-icon,
.touch-keyboard-key--variant-backspace .ui-icon,
.touch-keyboard-key--variant-lang-backspace .ui-icon,
.touch-keyboard-key--variant-lang-key .ui-icon,
.touch-keyboard-key--variant-lang-shift .ui-icon,
.touch-keyboard-key--variant-lang-space .ui-icon,
.touch-keyboard-key--variant-lang-special .ui-icon,
.touch-keyboard-key--variant-shift .ui-icon,
.touch-keyboard-key--variant-space .ui-icon,
.touch-keyboard-key--variant-special .ui-icon {
    height: 70%;
    width: 70%
}

.touch-keyboard-key .ui-icon svg,
.touch-keyboard-key--placeholder .ui-icon svg,
.touch-keyboard-key--theme-primary .ui-icon svg,
.touch-keyboard-key--theme-primary-light .ui-icon svg,
.touch-keyboard-key--variant-alt-gr .ui-icon svg,
.touch-keyboard-key--variant-backspace .ui-icon svg,
.touch-keyboard-key--variant-lang-backspace .ui-icon svg,
.touch-keyboard-key--variant-lang-key .ui-icon svg,
.touch-keyboard-key--variant-lang-shift .ui-icon svg,
.touch-keyboard-key--variant-lang-space .ui-icon svg,
.touch-keyboard-key--variant-lang-special .ui-icon svg,
.touch-keyboard-key--variant-shift .ui-icon svg,
.touch-keyboard-key--variant-space .ui-icon svg,
.touch-keyboard-key--variant-special .ui-icon svg {
    fill: var(--color-white);
    height: 70%;
    width: 70%
}

@media(hover: hover) {

    .touch-keyboard-key,
    .touch-keyboard-key--placeholder,
    .touch-keyboard-key--theme-primary,
    .touch-keyboard-key--theme-primary-light,
    .touch-keyboard-key--variant-alt-gr,
    .touch-keyboard-key--variant-backspace,
    .touch-keyboard-key--variant-lang-backspace,
    .touch-keyboard-key--variant-lang-key,
    .touch-keyboard-key--variant-lang-shift,
    .touch-keyboard-key--variant-lang-space,
    .touch-keyboard-key--variant-lang-special,
    .touch-keyboard-key--variant-shift,
    .touch-keyboard-key--variant-space,
    .touch-keyboard-key--variant-special {
        -webkit-transition: .2s;
        transition: .2s
    }

    .touch-keyboard-key--placeholder:hover,
    .touch-keyboard-key--theme-primary-light:hover,
    .touch-keyboard-key--theme-primary:hover,
    .touch-keyboard-key--variant-alt-gr:hover,
    .touch-keyboard-key--variant-backspace:hover,
    .touch-keyboard-key--variant-lang-backspace:hover,
    .touch-keyboard-key--variant-lang-key:hover,
    .touch-keyboard-key--variant-lang-shift:hover,
    .touch-keyboard-key--variant-lang-space:hover,
    .touch-keyboard-key--variant-lang-special:hover,
    .touch-keyboard-key--variant-shift:hover,
    .touch-keyboard-key--variant-space:hover,
    .touch-keyboard-key--variant-special:hover,
    .touch-keyboard-key:hover {
        opacity: .8
    }
}

.touch-keyboard-key--active,
.touch-keyboard-key--placeholder:active,
.touch-keyboard-key--theme-primary-light:active,
.touch-keyboard-key--theme-primary:active,
.touch-keyboard-key--variant-alt-gr:active,
.touch-keyboard-key--variant-backspace:active,
.touch-keyboard-key--variant-lang-backspace:active,
.touch-keyboard-key--variant-lang-key:active,
.touch-keyboard-key--variant-lang-shift:active,
.touch-keyboard-key--variant-lang-space:active,
.touch-keyboard-key--variant-lang-special:active,
.touch-keyboard-key--variant-shift:active,
.touch-keyboard-key--variant-space:active,
.touch-keyboard-key--variant-special:active,
.touch-keyboard-key:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: .6
}

@media(min-width: 640px) {

    .touch-keyboard-key,
    .touch-keyboard-key--placeholder,
    .touch-keyboard-key--theme-primary,
    .touch-keyboard-key--theme-primary-light,
    .touch-keyboard-key--variant-alt-gr,
    .touch-keyboard-key--variant-backspace,
    .touch-keyboard-key--variant-lang-backspace,
    .touch-keyboard-key--variant-lang-key,
    .touch-keyboard-key--variant-lang-shift,
    .touch-keyboard-key--variant-lang-space,
    .touch-keyboard-key--variant-lang-special,
    .touch-keyboard-key--variant-shift,
    .touch-keyboard-key--variant-space,
    .touch-keyboard-key--variant-special {
        border-radius: var(--border-radius);
        font-size: 26px
    }

    .touch-keyboard-key .ui-icon,
    .touch-keyboard-key .ui-icon svg,
    .touch-keyboard-key--placeholder .ui-icon,
    .touch-keyboard-key--placeholder .ui-icon svg,
    .touch-keyboard-key--theme-primary .ui-icon,
    .touch-keyboard-key--theme-primary .ui-icon svg,
    .touch-keyboard-key--theme-primary-light .ui-icon,
    .touch-keyboard-key--theme-primary-light .ui-icon svg,
    .touch-keyboard-key--variant-alt-gr .ui-icon,
    .touch-keyboard-key--variant-alt-gr .ui-icon svg,
    .touch-keyboard-key--variant-backspace .ui-icon,
    .touch-keyboard-key--variant-backspace .ui-icon svg,
    .touch-keyboard-key--variant-lang-backspace .ui-icon,
    .touch-keyboard-key--variant-lang-backspace .ui-icon svg,
    .touch-keyboard-key--variant-lang-key .ui-icon,
    .touch-keyboard-key--variant-lang-key .ui-icon svg,
    .touch-keyboard-key--variant-lang-shift .ui-icon,
    .touch-keyboard-key--variant-lang-shift .ui-icon svg,
    .touch-keyboard-key--variant-lang-space .ui-icon,
    .touch-keyboard-key--variant-lang-space .ui-icon svg,
    .touch-keyboard-key--variant-lang-special .ui-icon,
    .touch-keyboard-key--variant-lang-special .ui-icon svg,
    .touch-keyboard-key--variant-shift .ui-icon,
    .touch-keyboard-key--variant-shift .ui-icon svg,
    .touch-keyboard-key--variant-space .ui-icon,
    .touch-keyboard-key--variant-space .ui-icon svg,
    .touch-keyboard-key--variant-special .ui-icon,
    .touch-keyboard-key--variant-special .ui-icon svg {
        height: var(--icon-size);
        width: var(--icon-size)
    }
}

@media(min-width: 960px) {

    .touch-keyboard-key,
    .touch-keyboard-key--placeholder,
    .touch-keyboard-key--theme-primary,
    .touch-keyboard-key--theme-primary-light,
    .touch-keyboard-key--variant-alt-gr,
    .touch-keyboard-key--variant-backspace,
    .touch-keyboard-key--variant-lang-backspace,
    .touch-keyboard-key--variant-lang-key,
    .touch-keyboard-key--variant-lang-shift,
    .touch-keyboard-key--variant-lang-space,
    .touch-keyboard-key--variant-lang-special,
    .touch-keyboard-key--variant-shift,
    .touch-keyboard-key--variant-space,
    .touch-keyboard-key--variant-special {
        font-size: 32px
    }
}

.touch-keyboard-key--variant-alt-gr,
.touch-keyboard-key--variant-backspace,
.touch-keyboard-key--variant-lang-backspace,
.touch-keyboard-key--variant-lang-key,
.touch-keyboard-key--variant-lang-shift,
.touch-keyboard-key--variant-lang-space,
.touch-keyboard-key--variant-lang-special,
.touch-keyboard-key--variant-shift,
.touch-keyboard-key--variant-space,
.touch-keyboard-key--variant-special {
    font-size: var(--button-font-size)
}

.touch-keyboard-key--variant-space {
    width: calc(var(--key-width)*4 + var(--keys-gutter)*3)
}

.touch-keyboard-key--variant-special {
    width: calc(var(--key-width)*2 + var(--keys-gutter)*1)
}

@media(min-width: 640px) {
    .touch-keyboard-key--variant-lang-special {
        width: 135px
    }
}

@media(min-width: 960px) {
    .touch-keyboard-key--variant-lang-special {
        width: 213px
    }
}

@media(min-width: 640px) {
    .touch-keyboard-key--variant-lang-backspace {
        width: calc(9.1% - var(--keys-gutter))
    }
}

@media(min-width: 960px) {
    .touch-keyboard-key--variant-lang-backspace {
        width: calc(9% - var(--keys-gutter))
    }
}

@media(min-width: 640px) {
    .touch-keyboard-key--variant-lang-space {
        width: 277px
    }
}

@media(min-width: 960px) {
    .touch-keyboard-key--variant-lang-space {
        width: 431px
    }
}

@media(min-width: 640px) {
    .touch-keyboard-key--variant-lang-key {
        min-width: calc(9% - var(--keys-gutter))
    }
}

@media(min-width: 960px) {
    .touch-keyboard-key--variant-lang-key {
        font-size: 32px;
        width: var(--key-width)
    }
}

@media(min-width: 640px) {
    .touch-keyboard-key--variant-lang-shift {
        min-width: calc(9% - var(--keys-gutter))
    }
}

@media(min-width: 960px) {
    .touch-keyboard-key--variant-lang-shift {
        font-size: 32px;
        width: var(--key-width)
    }
}

.touch-keyboard-key--variant-smaller-special {
    min-width: calc(var(--key-width)*1.8766)
}

.touch-keyboard-key--variant-smaller-backspace {
    width: calc(var(--key-width)*.9315)
}

.touch-keyboard-key--variant-smaller-space {
    min-width: calc(var(--key-width)*3 + var(--keys-gutter)*14.25)
}

.touch-keyboard-key--variant-smaller-key,
.touch-keyboard-key--variant-smaller-shift {
    min-width: calc(9% - var(--keys-gutter))
}

.touch-keyboard-key[disabled],
[disabled].touch-keyboard-key--placeholder,
[disabled].touch-keyboard-key--theme-primary,
[disabled].touch-keyboard-key--theme-primary-light,
[disabled].touch-keyboard-key--variant-alt-gr,
[disabled].touch-keyboard-key--variant-backspace,
[disabled].touch-keyboard-key--variant-lang-backspace,
[disabled].touch-keyboard-key--variant-lang-key,
[disabled].touch-keyboard-key--variant-lang-shift,
[disabled].touch-keyboard-key--variant-lang-space,
[disabled].touch-keyboard-key--variant-lang-special,
[disabled].touch-keyboard-key--variant-shift,
[disabled].touch-keyboard-key--variant-space,
[disabled].touch-keyboard-key--variant-special {
    opacity: .5;
    pointer-events: none
}

.touch-keyboard-key--placeholder {
    opacity: 0;
    pointer-events: none
}

html[data-theme=skov] .touch-keyboard-key,
html[data-theme=skov] .touch-keyboard-key--placeholder,
html[data-theme=skov] .touch-keyboard-key--theme-primary,
html[data-theme=skov] .touch-keyboard-key--theme-primary-light,
html[data-theme=skov] .touch-keyboard-key--variant-alt-gr,
html[data-theme=skov] .touch-keyboard-key--variant-backspace,
html[data-theme=skov] .touch-keyboard-key--variant-lang-backspace,
html[data-theme=skov] .touch-keyboard-key--variant-lang-key,
html[data-theme=skov] .touch-keyboard-key--variant-lang-shift,
html[data-theme=skov] .touch-keyboard-key--variant-lang-space,
html[data-theme=skov] .touch-keyboard-key--variant-lang-special,
html[data-theme=skov] .touch-keyboard-key--variant-shift,
html[data-theme=skov] .touch-keyboard-key--variant-space,
html[data-theme=skov] .touch-keyboard-key--variant-special {
    font-family: Noto Sans, sans-serif;
    font-weight: 500
}

html[data-theme=skov] .touch-keyboard-key--theme-primary {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#669200), to(#669200));
    background-image: linear-gradient(-180deg, #669200, #669200);
}

html[data-theme=skov] .touch-keyboard-key--theme-primary-light {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#30da59), to(#56bd5b));
    background-image: linear-gradient(-180deg, #30da59, #56bd5b)
}

html[data-theme=big-dutchman] .touch-keyboard-key,
html[data-theme=big-dutchman] .touch-keyboard-key--placeholder,
html[data-theme=big-dutchman] .touch-keyboard-key--theme-primary,
html[data-theme=big-dutchman] .touch-keyboard-key--theme-primary-light,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-alt-gr,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-backspace,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-lang-backspace,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-lang-key,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-lang-shift,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-lang-space,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-lang-special,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-shift,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-space,
html[data-theme=big-dutchman] .touch-keyboard-key--variant-special {
    background-color: #ea6f18;
    font-family: Open Sans, Noto Sans, sans-serif;
    font-weight: 700
}

html[data-theme=big-dutchman] .touch-keyboard-key--theme-primary {
    background-color: #787878;
    color: var(--color-white)
}

.ui-selection-menu {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    overflow-x: hidden;
    overflow-y: auto
}

.ui-selection-menu__search {
    border-bottom: 1px solid var(--color-border);
    padding: var(--selection-menu-padding);
    position: sticky;
    top: 0;
    z-index: 10
}

.ui-selection-menu__list {
    list-style: none;
    margin: 0;
    min-height: 450px;
    padding-left: 0;
    position: relative
}

.ui-selection-menu__list--search-results {
    padding: var(--selection-menu-padding)
}

.helper-text {
    margin-left: var(--input-padding);
    margin-top: 4px;
    -webkit-transition: .2s;
    transition: .2s
}

.helper-text--with-error p {
    color: var(--color-alarm)
}

.helper-text--with-helper-text-position-right {
    left: auto;
    right: var(--input-padding);
    text-align: right
}

.ui-label label {
    display: block;
    margin-bottom: 4px;
    margin-left: var(--input-padding)
}

.ui-label--with-error label {
    color: var(--color-alarm)
}

.ui-input,
.ui-input--as-button,
.ui-input--clickable,
.ui-input--disabled,
.ui-input--read-only,
.ui-input--theme-primary,
.ui-input--with-clear-all,
.ui-input--with-error,
.ui-input--with-icon {
    position: relative
}

.ui-input__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--input-height);
    position: relative
}

.ui-input__input {
    background-color: transparent;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: var(--default-font-color);
    display: block;
    font-family: var(--font-family-primary);
    font-size: var(--base-font-size);
    font-weight: var(--font-weight-regular);
    line-height: var(--input-height);
    outline: none;
    padding: 0 var(--input-padding);
    position: relative;
    width: 100%
}

.ui-input__input[type=number] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield
}

.ui-input__input[type=number]::-webkit-inner-spin-button,
.ui-input__input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

.ui-input__input::input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input:placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input::-webkit-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input::-moz-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input:-ms-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input::-ms-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input::placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__input:input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-input__icon {
    border-radius: 100%;
    height: calc(var(--icon-size)*2);
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: calc(var(--icon-size)*2)
}

.ui-input__icon svg {
    fill: var(--color-grey1);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-input__clear-all {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--input-height);
    justify-content: center;
    outline: none;
    padding: 0;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2
}

.ui-input__clear-all>.ui-icon {
    background-color: var(--color-border);
    border-radius: 100%;
    height: var(--icon-size);
    -webkit-transition: inherit;
    transition: inherit;
    width: var(--icon-size)
}

@media(min-width: 960px) {
    .ui-input__clear-all {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-input__clear-all:hover>.ui-icon {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
}

.ui-input__loader {
    margin-right: -6.4px;
    position: absolute;
    right: var(--input-padding);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-input__loader,
.ui-input__loader div {
    height: calc(var(--icon-size-small) + 12px);
    width: calc(var(--icon-size-small) + 12px)
}

.ui-input__icon-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    height: var(--input-height);
    outline: none;
    padding: 0;
    position: absolute;
    width: calc(var(--icon-size)*2);
    z-index: 1
}

.ui-input__icon-button svg {
    fill: var(--color-black)
}

@media(hover: hover) {
    .ui-input__icon-button .ui-input__icon {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-input__icon-button:hover .ui-input__icon {
        background-color: var(--color-hover-background)
    }
}

.ui-input__icon-button:active .ui-input__icon {
    background-color: var(--color-active-background)
}

.ui-input__static-placeholder,
.ui-input__static-placeholder--right {
    -ms-flex-negative: 0;
    color: var(--color-font-subtitle1);
    cursor: text;
    flex-shrink: 0;
    font-size: var(--base-font-size);
    line-height: var(--input-height);
    padding-left: var(--input-padding)
}

.ui-input__static-placeholder--right {
    padding-left: 0;
    padding-right: var(--input-padding)
}

.ui-input--with-icon .ui-input__icon-button {
    border-bottom-left-radius: var(--border-radius);
    border-top-left-radius: var(--border-radius);
    left: 0
}

.ui-input--with-icon .ui-input__input {
    padding-left: calc(var(--icon-size-small) + var(--input-padding)*2)
}

.ui-input--with-icon-left .ui-input__icon-button {
    left: 0
}

.ui-input--with-icon-left .ui-input__input {
    padding-left: calc(var(--icon-size-small) + var(--input-padding)*2)
}

.ui-input--with-icon-right .ui-input__icon-button {
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    right: 0
}

.ui-input--with-icon-right .ui-input__icon.ui-input__icon {
    left: auto;
    right: 0
}

.ui-input--with-icon-right .ui-input__input {
    padding-left: var(--input-padding);
    padding-right: calc(var(--icon-size-small) + var(--input-padding)*2)
}

.ui-input--with-error .ui-input__container {
    border-color: var(--color-alarm) !important
}

.ui-input--with-error .ui-input__icon.ui-input__icon svg {
    fill: var(--color-alarm) !important
}

.ui-input--disabled {
    opacity: .6
}

.ui-input--disabled .ui-input__input {
    cursor: not-allowed
}

@media(hover: hover) {
    .ui-input--disabled .ui-input__input:hover {
        border-color: var(--color-border)
    }
}

.ui-input--with-clear-all .ui-input__input {
    padding-right: calc(var(--icon-size) + var(--input-padding)*2)
}

.ui-input--with-clear-all .ui-input__clear-all {
    width: calc(var(--icon-size) + var(--input-padding)*2)
}

.ui-input--read-only .ui-input__container {
    background-color: var(--color-hover-background)
}

.ui-input--clickable .ui-input__container {
    cursor: pointer
}

@media(hover: hover) {
    .ui-input--clickable .ui-input__container {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-input--clickable .ui-input__container:hover {
        border-color: var(--color-black)
    }
}

.ui-input--clickable .ui-input__container:focus-within {
    border-color: var(--color-active)
}

.ui-input--clickable .ui-input__container:focus-within+.ui-input__icon svg {
    fill: var(--color-black)
}

@media(hover: hover) {
    .ui-input--clickable .ui-label {
        cursor: pointer;
        -webkit-transition: .2s;
        transition: .2s
    }
}

.ui-input--theme-primary .ui-input__container {
    background-color: transparent;
    border-color: var(--color-border-primary)
}

@media(hover: hover) {
    .ui-input--theme-primary .ui-input__container:hover {
        border-color: var(--color-active)
    }
}

.ui-input--theme-primary .ui-input__icon svg {
    fill: var(--color-white)
}

.ui-input--theme-primary .ui-input__input {
    color: var(--color-white) !important
}

.ui-input--theme-primary .ui-input__input::input-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input:placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input::-webkit-input-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input::-moz-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input:-ms-input-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input::-ms-input-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input::placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__input:input-placeholder {
    color: var(--color-font-primary) !important
}

.ui-input--theme-primary .ui-input__clear-all {
    background-color: var(--color-active)
}

.ui-input--theme-primary .ui-input__clear-all svg {
    fill: var(--color-white)
}

.ui-input--as-button {
    cursor: pointer;
    display: inline-block;
    width: auto
}

.ui-input--as-button * {
    cursor: pointer
}

.ui-input--as-button .ui-input__input {
    color: var(--color-font-label);
    font-weight: var(--font-weight-medium);
    text-align: left
}

.ui-input--as-button .ui-input__container {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

@media(hover: hover) {
    .ui-input--as-button.ui-input--clickable {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-input--as-button.ui-input--clickable:hover .ui-input__container {
        background-color: var(--color-hover-background)
    }
}

.ui-input--as-button.ui-input--clickable:active .ui-input__container,
.ui-input--as-button.ui-input--clickable:focus-within .ui-input__container {
    background-color: var(--color-active-background);
    border-color: var(--color-border)
}

.ui-select,
.ui-select--clickable,
.ui-select--error,
.ui-select--flip,
.ui-select--multiple,
.ui-select--open,
.ui-select--required,
.ui-select--theme-primary {
    position: relative
}

.ui-select__label {
    display: block;
    margin-bottom: 4px;
    padding-left: var(--input-padding);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-select__placeholder {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--select-height);
    justify-content: space-between;
    overflow: hidden;
    padding: 0 var(--input-padding);
    position: relative;
    -webkit-transition: .2s;
    transition: .2s;
    z-index: 1
}

.ui-select__placeholder .ui-icon {
    margin-right: var(--input-padding)
}

.ui-select__placeholder .ui-icon svg {
    fill: var(--color-font-label);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-select__placeholder .ui-icon.chevron {
    margin: 0;
    position: absolute;
    right: var(--input-padding);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-select__placeholder>.ui-typography {
    line-height: calc(var(--select-height) - 2px);
    min-width: 0;
    overflow: hidden;
    padding-right: var(--checkbox-checkmark-size);
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.ui-select__placeholder>.ui-typography .ui-typography {
    color: var(--color-grey2);
    margin-left: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.ui-select__container {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    -webkit-box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    margin-top: -1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    visibility: hidden;
    width: 100%;
    will-change: opacity;
    z-index: 2
}

.ui-select__options {
    list-style: none;
    margin: 0;
    padding-left: 0;
    width: 100%
}

.ui-select__option,
.ui-select__option--checked,
.ui-select__option--disabled,
.ui-select__option--indeterminate {
    cursor: pointer;
    height: var(--select-option-height);
    position: relative
}

.ui-select__option label,
.ui-select__option--checked label,
.ui-select__option--disabled label,
.ui-select__option--indeterminate label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--select-option-height)
}

.ui-select__option .ui-icon,
.ui-select__option--checked .ui-icon,
.ui-select__option--disabled .ui-icon,
.ui-select__option--indeterminate .ui-icon {
    position: absolute;
    right: var(--input-padding);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-select__option .ui-icon svg,
.ui-select__option--checked .ui-icon svg,
.ui-select__option--disabled .ui-icon svg,
.ui-select__option--indeterminate .ui-icon svg {
    fill: var(--color-active);
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: inherit;
    transition: inherit;
    visibility: hidden
}

.ui-select__option--checked:last-child label,
.ui-select__option--disabled:last-child label,
.ui-select__option--indeterminate:last-child label,
.ui-select__option:last-child label {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.ui-select__option label>.ui-typography span,
.ui-select__option--checked label>.ui-typography span,
.ui-select__option--disabled label>.ui-typography span,
.ui-select__option--indeterminate label>.ui-typography span {
    color: var(--color-font-subtitle1);
    display: block
}

.ui-select__option input,
.ui-select__option--checked input,
.ui-select__option--disabled input,
.ui-select__option--indeterminate input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    width: 100%;
    z-index: 1
}

.ui-select__option--checked .ui-typography {
    color: var(--color-active)
}

.ui-select__option--checked .ui-icon svg {
    opacity: 1;
    visibility: visible
}

.ui-select__option--disabled {
    cursor: not-allowed;
    opacity: .6
}

.ui-select__option--disabled input,
.ui-select__option--disabled label {
    pointer-events: none
}

.ui-select__option--indeterminate .ui-typography {
    color: var(--color-active)
}

.ui-select__option--indeterminate .ui-icon.ui-icon.ui-icon {
    background-color: var(--color-active);
    border-color: var(--color-active)
}

.ui-select__option--indeterminate .ui-icon.ui-icon.ui-icon svg {
    fill: var(--color-white);
    height: var(--icon-size-extra-small);
    opacity: 1;
    visibility: visible;
    width: var(--icon-size-extra-small)
}

.ui-select__option input:checked+.ui-typography,
.ui-select__option input:checked+.ui-typography span,
.ui-select__option--checked input:checked+.ui-typography,
.ui-select__option--checked input:checked+.ui-typography span,
.ui-select__option--disabled input:checked+.ui-typography,
.ui-select__option--disabled input:checked+.ui-typography span,
.ui-select__option--indeterminate input:checked+.ui-typography,
.ui-select__option--indeterminate input:checked+.ui-typography span {
    color: var(--color-active)
}

.ui-select__option input:checked+.ui-typography+.ui-icon svg,
.ui-select__option--checked input:checked+.ui-typography+.ui-icon svg,
.ui-select__option--disabled input:checked+.ui-typography+.ui-icon svg,
.ui-select__option--indeterminate input:checked+.ui-typography+.ui-icon svg {
    opacity: 1;
    visibility: visible
}

.ui-select__option label,
.ui-select__option--checked label,
.ui-select__option--disabled label,
.ui-select__option--indeterminate label,
button.ui-select__option,
button.ui-select__option--checked,
button.ui-select__option--disabled,
button.ui-select__option--indeterminate {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-select__option label>.ui-typography,
.ui-select__option--checked label>.ui-typography,
.ui-select__option--disabled label>.ui-typography,
.ui-select__option--indeterminate label>.ui-typography,
button.ui-select__option--checked>.ui-typography,
button.ui-select__option--disabled>.ui-typography,
button.ui-select__option--indeterminate>.ui-typography,
button.ui-select__option>.ui-typography {
    padding-left: var(--input-padding);
    padding-right: calc(var(--icon-size-small) + 32px);
    pointer-events: none
}

@media(hover: hover) {

    .ui-select__option label:hover,
    .ui-select__option--checked label:hover,
    .ui-select__option--disabled label:hover,
    .ui-select__option--indeterminate label:hover,
    button.ui-select__option--checked:hover,
    button.ui-select__option--disabled:hover,
    button.ui-select__option--indeterminate:hover,
    button.ui-select__option:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-select__option label:active,
.ui-select__option--checked label:active,
.ui-select__option--disabled label:active,
.ui-select__option--indeterminate label:active,
button.ui-select__option--checked:active,
button.ui-select__option--disabled:active,
button.ui-select__option--indeterminate:active,
button.ui-select__option:active {
    background-color: var(--color-active-background)
}

button.ui-select__option,
button.ui-select__option--checked,
button.ui-select__option--disabled,
button.ui-select__option--indeterminate {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: 0;
    text-align: left;
    width: 100%
}

.ui-select__header {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border);
    padding: 8px;
    position: sticky;
    top: 0;
    z-index: 1
}

.ui-select__header>button {
    margin: -8px;
    width: calc(100% + var(--input-padding))
}

.ui-select__header--with-select-all .ui-input {
    margin-bottom: 8px
}

.ui-select__header--with-search.ui-select__header--with-select-all>button {
    margin-top: 8px
}

.ui-select__footer {
    background-color: var(--default-background-color);
    border-top: 1px solid var(--color-border);
    bottom: 0;
    position: sticky
}

.ui-select__footer button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    height: var(--select-option-height);
    outline: none;
    padding: 0 16px;
    text-align: left;
    width: 100%
}

.ui-select__footer button .ui-typography {
    color: var(--color-font-label);
    cursor: pointer;
    font-size: var(--body1-font-size);
    text-align: left
}

@media(hover: hover) {
    .ui-select__footer button:not(.ui-select--disabled) {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-select__footer button:not(.ui-select--disabled):hover {
        background-color: var(--color-hover-background)
    }
}

.ui-select__footer button:not(.ui-select--disabled):active {
    background-color: var(--color-active-background)
}

.ui-select__helper-text {
    margin-left: var(--input-padding);
    margin-top: 4px;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-select--open .ui-select__placeholder {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-select--open .ui-select__placeholder .ui-icon.chevron {
    -webkit-transform: rotate(180deg) translateY(50%);
    transform: rotate(180deg) translateY(50%)
}

.ui-select--open .ui-select__container {
    opacity: 1;
    overflow-x: hidden;
    overflow-y: auto;
    visibility: visible
}

.ui-select--theme-primary .ui-select__container {
    background-color: var(--color-primary-dark);
    border: none
}

.ui-select--theme-primary .ui-select__placeholder {
    background-color: transparent;
    border: none
}

.ui-select--theme-primary .ui-select__placeholder .ui-icon svg,
.ui-select--theme-primary .ui-select__placeholder .ui-icon.chevron svg {
    fill: var(--color-font-primary)
}

@media(hover: hover) {
    .ui-select--theme-primary.ui-select--clickable .ui-select__placeholder:hover {
        background-color: var(--color-primary-hover-background)
    }
}

.ui-select--theme-primary.ui-select--clickable .ui-select__placeholder:active {
    background-color: var(--color-primary-active-background)
}

@media(hover: hover) {
    .ui-select--theme-primary .ui-select__options li label:hover {
        background-color: var(--color-primary-hover-background)
    }
}

.ui-select--theme-primary .ui-select__options li label:active {
    background-color: var(--color-primary-active-background)
}

.ui-select--theme-primary .ui-select__container {
    border-color: var(--color-border-primary);
    border-radius: var(--border-radius)
}

.ui-select--multiple .ui-select__option .ui-icon,
.ui-select--multiple .ui-select__option--checked .ui-icon,
.ui-select--multiple .ui-select__option--disabled .ui-icon,
.ui-select--multiple .ui-select__option--indeterminate .ui-icon {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: calc(var(--border-radius)/2);
    height: var(--checkbox-checkmark-size);
    width: var(--checkbox-checkmark-size)
}

.ui-select--multiple .ui-select__option input:checked+.ui-typography+.ui-icon,
.ui-select--multiple .ui-select__option--checked .ui-icon,
.ui-select--multiple .ui-select__option--disabled input:checked+.ui-typography+.ui-icon,
.ui-select--multiple .ui-select__option--indeterminate input:checked+.ui-typography+.ui-icon {
    background-color: transparent;
    border: 1px solid transparent
}

.ui-select--disabled {
    opacity: .6
}

.ui-select--disabled .ui-select__placeholder {
    cursor: not-allowed
}

@media(hover: hover) {
    .ui-select--clickable .ui-select__placeholder {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-select--clickable .ui-select__placeholder:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-select--clickable .ui-select__placeholder:active {
    background-color: var(--color-active-background)
}

.ui-select--error .ui-select__helper-text,
.ui-select--error .ui-select__label {
    color: var(--color-alarm)
}

.ui-select--error .ui-select__placeholder {
    border-color: var(--color-alarm)
}

.ui-select--error .ui-select__placeholder .ui-icon svg {
    fill: var(--color-alarm)
}

.ui-select--with-lazy-load .ui-select__container {
    overflow-y: hidden
}

.ui-select--with-lazy-load .ui-select__container ol {
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-select--flip .ui-select__container {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    bottom: 100%;
    -webkit-box-shadow: 0 -5px 5px 3px rgba(0, 0, 0, .04);
    box-shadow: 0 -5px 5px 3px rgba(0, 0, 0, .04);
    margin-bottom: -1px;
    margin-top: 0
}

.ui-select--flip.ui-select--open .ui-select__placeholder {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.ui-text-area textarea,
.ui-text-area--disabled textarea,
.ui-text-area--resizable textarea,
.ui-text-area--with-error textarea {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    -webkit-box-shadow: none;
    box-shadow: none;
    color: var(--default-font-color);
    display: block;
    font-family: var(--font-family-primary);
    font-size: var(--base-font-size);
    font-weight: var(--font-weight-regular);
    line-height: calc(var(--input-height)/2);
    outline: none;
    padding: calc(var(--input-padding)/2) var(--input-padding);
    position: relative;
    resize: none;
    -webkit-transition: border .2s linear;
    transition: border .2s linear;
    width: 100%
}

.ui-text-area textarea::input-placeholder,
.ui-text-area--disabled textarea::input-placeholder,
.ui-text-area--resizable textarea::input-placeholder,
.ui-text-area--with-error textarea::input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea:placeholder,
.ui-text-area--disabled textarea:placeholder,
.ui-text-area--resizable textarea:placeholder,
.ui-text-area--with-error textarea:placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea::-webkit-input-placeholder,
.ui-text-area--disabled textarea::-webkit-input-placeholder,
.ui-text-area--resizable textarea::-webkit-input-placeholder,
.ui-text-area--with-error textarea::-webkit-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea::-moz-placeholder,
.ui-text-area--disabled textarea::-moz-placeholder,
.ui-text-area--resizable textarea::-moz-placeholder,
.ui-text-area--with-error textarea::-moz-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea:-ms-input-placeholder,
.ui-text-area--disabled textarea:-ms-input-placeholder,
.ui-text-area--resizable textarea:-ms-input-placeholder,
.ui-text-area--with-error textarea:-ms-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea::-ms-input-placeholder,
.ui-text-area--disabled textarea::-ms-input-placeholder,
.ui-text-area--resizable textarea::-ms-input-placeholder,
.ui-text-area--with-error textarea::-ms-input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea::placeholder,
.ui-text-area--disabled textarea::placeholder,
.ui-text-area--resizable textarea::placeholder,
.ui-text-area--with-error textarea::placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea:input-placeholder,
.ui-text-area--disabled textarea:input-placeholder,
.ui-text-area--resizable textarea:input-placeholder,
.ui-text-area--with-error textarea:input-placeholder {
    color: var(--input-placeholder-color);
    font-size: var(--base-font-size)
}

.ui-text-area textarea:hover,
.ui-text-area--disabled textarea:hover,
.ui-text-area--resizable textarea:hover,
.ui-text-area--with-error textarea:hover {
    border-color: var(--color-black)
}

.ui-text-area textarea:active,
.ui-text-area textarea:focus,
.ui-text-area--disabled textarea:active,
.ui-text-area--disabled textarea:focus,
.ui-text-area--resizable textarea:active,
.ui-text-area--resizable textarea:focus,
.ui-text-area--with-error textarea:active,
.ui-text-area--with-error textarea:focus {
    border-color: var(--color-active)
}

.ui-text-area--resizable textarea {
    resize: both
}

.ui-text-area--with-error textarea {
    border-color: var(--color-alarm) !important
}

.ui-text-area--disabled {
    opacity: .6
}

.ui-text-area--disabled textarea,
.ui-text-area--disabled textarea:active,
.ui-text-area--disabled textarea:focus,
.ui-text-area--disabled textarea:hover {
    border: 1px solid var(--color-border);
    cursor: not-allowed
}

.date-time-picker,
.date-time-picker--stacked {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.date-time-picker__date-editor {
    margin-right: var(--main-spacing)
}

.date-time-picker__time-editor {
    margin-left: var(--main-spacing)
}

.date-time-picker--stacked {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.date-time-picker--stacked .date-time-picker__date-editor,
.date-time-picker--stacked .date-time-picker__time-editor {
    margin: 0
}

.date-time-picker--period-selector .ui-filter-tab__container {
    padding-left: calc(var(--main-spacing)/2);
    padding-right: calc(var(--main-spacing)/2)
}

.ui-date-time-picker,
.ui-date-time-picker--open,
.ui-date-time-picker--with-placeholder,
.ui-date-time-range-picker,
.ui-date-time-range-picker--open,
.ui-date-time-range-picker--with-placeholder {
    position: relative
}

.ui-date-time-picker .ui-filter-tab,
.ui-date-time-picker .ui-filter-tab span,
.ui-date-time-picker .ui-filter-tabs,
.ui-date-time-picker--open .ui-filter-tab,
.ui-date-time-picker--open .ui-filter-tab span,
.ui-date-time-picker--open .ui-filter-tabs,
.ui-date-time-picker--with-placeholder .ui-filter-tab,
.ui-date-time-picker--with-placeholder .ui-filter-tab span,
.ui-date-time-picker--with-placeholder .ui-filter-tabs,
.ui-date-time-range-picker .ui-filter-tab,
.ui-date-time-range-picker .ui-filter-tab span,
.ui-date-time-range-picker .ui-filter-tabs,
.ui-date-time-range-picker--open .ui-filter-tab,
.ui-date-time-range-picker--open .ui-filter-tab span,
.ui-date-time-range-picker--open .ui-filter-tabs,
.ui-date-time-range-picker--with-placeholder .ui-filter-tab,
.ui-date-time-range-picker--with-placeholder .ui-filter-tab span,
.ui-date-time-range-picker--with-placeholder .ui-filter-tabs {
    width: 100%
}

.ui-date-time-picker--open>.ui-input,
.ui-date-time-picker--with-placeholder>.ui-input,
.ui-date-time-picker>.ui-input,
.ui-date-time-range-picker--open>.ui-input,
.ui-date-time-range-picker--with-placeholder>.ui-input,
.ui-date-time-range-picker>.ui-input {
    display: block
}

.ui-date-time-picker--open>.ui-input .ui-input__input,
.ui-date-time-picker--with-placeholder>.ui-input .ui-input__input,
.ui-date-time-picker>.ui-input .ui-input__input,
.ui-date-time-range-picker--open>.ui-input .ui-input__input,
.ui-date-time-range-picker--with-placeholder>.ui-input .ui-input__input,
.ui-date-time-range-picker>.ui-input .ui-input__input {
    font-weight: var(--font-weight-regular)
}

.ui-date-time-picker--open>.ui-input .ui-input__container,
.ui-date-time-picker--with-placeholder>.ui-input .ui-input__container,
.ui-date-time-picker>.ui-input .ui-input__container,
.ui-date-time-range-picker--open>.ui-input .ui-input__container,
.ui-date-time-range-picker--with-placeholder>.ui-input .ui-input__container,
.ui-date-time-range-picker>.ui-input .ui-input__container {
    width: 100%
}

.ui-date-time-picker--open>.ui-input svg,
.ui-date-time-picker--with-placeholder>.ui-input svg,
.ui-date-time-picker>.ui-input svg,
.ui-date-time-range-picker--open>.ui-input svg,
.ui-date-time-range-picker--with-placeholder>.ui-input svg,
.ui-date-time-range-picker>.ui-input svg {
    height: var(--icon-size-extra-small);
    width: var(--icon-size-extra-small)
}

.ui-date-time-picker__container,
.ui-date-time-range-picker__container {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    -webkit-box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    margin-top: -1px;
    opacity: 0;
    overflow: hidden;
    padding: var(--main-spacing);
    position: absolute;
    visibility: hidden;
    width: 100%;
    will-change: opacity;
    z-index: 2
}

.ui-date-time-picker__container input,
.ui-date-time-range-picker__container input {
    text-align: center
}

.ui-date-time-picker__container .ui-input__input,
.ui-date-time-range-picker__container .ui-input__input {
    padding: 0 4px
}

.ui-date-time-picker--open>.ui-input .ui-input__container,
.ui-date-time-range-picker--open>.ui-input .ui-input__container {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-date-time-picker--open .ui-date-time-picker__container,
.ui-date-time-picker--open .ui-date-time-range-picker__container,
.ui-date-time-range-picker--open .ui-date-time-picker__container,
.ui-date-time-range-picker--open .ui-date-time-range-picker__container {
    opacity: 1;
    visibility: visible
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input {
    color: transparent;
    cursor: pointer
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input::input-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input::input-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input:placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input:placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input::-webkit-input-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input::-webkit-input-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input::-moz-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input::-moz-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input:-ms-input-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input:-ms-input-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input::-ms-input-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input::-ms-input-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input::placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input::placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input input.ui-input__input:input-placeholder,
.ui-date-time-range-picker--with-placeholder>.ui-input input.ui-input__input:input-placeholder {
    color: var(--default-font-color)
}

.ui-date-time-picker--with-placeholder>.ui-input .ui-input__container:hover,
.ui-date-time-range-picker--with-placeholder>.ui-input .ui-input__container:hover {
    background-color: var(--color-hover-background)
}

.ui-date-time-picker--with-placeholder>.ui-input .ui-input__container:active,
.ui-date-time-picker--with-placeholder>.ui-input .ui-input__container:focus-within,
.ui-date-time-range-picker--with-placeholder>.ui-input .ui-input__container:active,
.ui-date-time-range-picker--with-placeholder>.ui-input .ui-input__container:focus-within {
    background-color: var(--color-active-background);
    border-color: var(--color-border)
}

.ui-date-time-range-picker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.ui-date-time-range-picker__start-date .ui-date-editor {
    height: 260px
}

.ui-date-time-range-picker__start-date .date-time-picker__time-editor {
    border-top: 1px solid var(--color-border);
    margin-top: calc(var(--main-spacing)/2);
    padding-top: calc(var(--main-spacing)/2)
}

.ui-date-time-range-picker__end-date .ui-date-editor {
    height: 260px
}

.ui-date-time-range-picker__end-date .date-time-picker__time-editor {
    border-top: 1px solid var(--color-border);
    margin-top: calc(var(--main-spacing)/2);
    padding-top: calc(var(--main-spacing)/2)
}

.ui-date-time-range-picker__separator {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    min-height: 100%;
    position: relative;
    width: calc(var(--main-spacing)*2)
}

.ui-date-time-range-picker__separator:after,
.ui-date-time-range-picker__separator:before {
    background-color: var(--color-border);
    content: "";
    height: 40%;
    left: 50%;
    position: absolute;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px
}

.ui-date-time-range-picker__separator:before {
    top: 20%
}

.ui-date-time-range-picker__separator:after {
    bottom: -20%
}

.ui-date-time-range-picker__separator .ui-typography {
    color: var(--color-font-subtitle1)
}

.ui-checkbox,
.ui-checkbox--disabled,
.ui-checkbox--theme-primary,
.ui-checkbox--variant-list {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-width: 0;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-checkbox input,
.ui-checkbox--disabled input,
.ui-checkbox--theme-primary input,
.ui-checkbox--variant-list input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    width: 100%
}

.ui-checkbox input:checked+.ui-checkbox__checkmark,
.ui-checkbox--disabled input:checked+.ui-checkbox__checkmark,
.ui-checkbox--theme-primary input:checked+.ui-checkbox__checkmark,
.ui-checkbox--variant-list input:checked+.ui-checkbox__checkmark {
    background-color: var(--color-active);
    border-color: var(--color-active)
}

.ui-checkbox input:checked+.ui-checkbox__checkmark .ui-icon,
.ui-checkbox--disabled input:checked+.ui-checkbox__checkmark .ui-icon,
.ui-checkbox--theme-primary input:checked+.ui-checkbox__checkmark .ui-icon,
.ui-checkbox--variant-list input:checked+.ui-checkbox__checkmark .ui-icon {
    opacity: 1;
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
}

@media(hover: hover) {

    .ui-checkbox input:not(:checked):hover+.ui-checkbox__checkmark,
    .ui-checkbox--disabled input:not(:checked):hover+.ui-checkbox__checkmark,
    .ui-checkbox--theme-primary input:not(:checked):hover+.ui-checkbox__checkmark,
    .ui-checkbox--variant-list input:not(:checked):hover+.ui-checkbox__checkmark {
        border-color: var(--color-black)
    }
}

.ui-checkbox__label {
    font-weight: var(--checkbox-label-font-weight);
    margin-left: 8px;
    pointer-events: none
}

.ui-checkbox__checkmark {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-white);
    border: var(--checkbox-checkmark-border-width) solid var(--color-border);
    border-radius: var(--checkbox-checkmark-border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--checkbox-checkmark-size);
    justify-content: center;
    min-width: var(--checkbox-checkmark-size);
    overflow: hidden;
    -webkit-transition: .2s linear;
    transition: .2s linear;
    width: var(--checkbox-checkmark-size)
}

.ui-checkbox__checkmark .ui-icon {
    height: var(--checkbox-checkmark-icon-size);
    opacity: 0;
    -webkit-transform: rotate(-50deg) scale(.1);
    transform: rotate(-50deg) scale(.1);
    -webkit-transition: .2s linear;
    transition: .2s linear;
    width: var(--checkbox-checkmark-icon-size)
}

.ui-checkbox__checkmark .ui-icon svg {
    fill: var(--color-white)
}

.ui-checkbox--disabled {
    cursor: not-allowed
}

.ui-checkbox--disabled:not(.ui-checkbox--theme-primary) .ui-checkbox__checkmark,
.ui-checkbox--disabled:not(.ui-checkbox--theme-primary) input:checked+.ui-checkbox__checkmark {
    background-color: var(--default-background-color);
    border-color: var(--color-border)
}

.ui-checkbox--disabled:not(.ui-checkbox--theme-primary) input:checked+.ui-checkbox__checkmark .ui-icon svg {
    fill: var(--color-grey3)
}

@media(hover: hover) {
    .ui-checkbox--disabled:not(.ui-checkbox--theme-primary) input:not(:checked):hover+.ui-checkbox__checkmark {
        border-color: var(--color-border)
    }
}

.ui-checkbox--disabled.ui-checkbox--theme-primary {
    opacity: .6
}

@media(hover: hover) {
    .ui-checkbox--disabled.ui-checkbox--theme-primary input:not(:checked):hover+.ui-checkbox__checkmark {
        border-color: var(--color-border-primary)
    }
}

.ui-checkbox--indeterminate input+.ui-checkbox__checkmark {
    background-color: var(--color-active);
    border-color: var(--color-active)
}

.ui-checkbox--indeterminate input+.ui-checkbox__checkmark .ui-icon {
    opacity: 1;
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
}

.ui-checkbox--variant-list:not(.ui-checkbox--indeterminate) input:checked+.ui-checkbox__checkmark {
    background-color: transparent;
    border-color: transparent
}

.ui-checkbox--variant-list:not(.ui-checkbox--indeterminate) input:checked+.ui-checkbox__checkmark .ui-icon {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

.ui-checkbox--variant-list:not(.ui-checkbox--indeterminate) input:checked+.ui-checkbox__checkmark .ui-icon svg {
    fill: var(--color-active)
}

.ui-checkbox--variant-list:not(.ui-checkbox--indeterminate) input:checked+.ui-checkbox__checkmark+.ui-typography {
    color: var(--color-active)
}

.ui-checkbox--theme-primary input:checked+.ui-checkbox__checkmark,
.ui-checkbox--theme-primary.ui-checkbox--indeterminate input+.ui-checkbox__checkmark {
    background-color: transparent
}

.ui-checkbox--theme-primary input:checked+.ui-checkbox__checkmark .ui-icon svg,
.ui-checkbox--theme-primary.ui-checkbox--indeterminate input+.ui-checkbox__checkmark .ui-icon svg {
    fill: var(--color-active)
}

.ui-checkbox--theme-primary .ui-checkbox__label.ui-checkbox__label {
    color: var(--color-font-primary)
}

.ui-checkbox--theme-primary .ui-checkbox__checkmark {
    background-color: transparent;
    border-color: var(--color-border-primary)
}

@media(hover: hover) {
    .ui-checkbox--theme-primary input:not(:checked):hover+.ui-checkbox__checkmark {
        border-color: var(--color-active)
    }
}

.ui-radio,
.ui-radio--checkmark-align,
.ui-radio--disabled,
.ui-radio--no-border,
.ui-radio--theme-primary {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ui-radio input,
.ui-radio--checkmark-align input,
.ui-radio--disabled input,
.ui-radio--no-border input,
.ui-radio--theme-primary input {
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    width: 100%
}

.ui-radio input:checked+.ui-radio__checkmark,
.ui-radio input:checked+.ui-radio__label+.ui-radio__checkmark,
.ui-radio--checkmark-align input:checked+.ui-radio__checkmark,
.ui-radio--checkmark-align input:checked+.ui-radio__label+.ui-radio__checkmark,
.ui-radio--disabled input:checked+.ui-radio__checkmark,
.ui-radio--disabled input:checked+.ui-radio__label+.ui-radio__checkmark,
.ui-radio--no-border input:checked+.ui-radio__checkmark,
.ui-radio--no-border input:checked+.ui-radio__label+.ui-radio__checkmark,
.ui-radio--theme-primary input:checked+.ui-radio__checkmark,
.ui-radio--theme-primary input:checked+.ui-radio__label+.ui-radio__checkmark {
    background-color: var(--color-active);
    border-color: var(--color-active)
}

.ui-radio input:checked+.ui-radio__checkmark .ui-icon,
.ui-radio input:checked+.ui-radio__label+.ui-radio__checkmark .ui-icon,
.ui-radio--checkmark-align input:checked+.ui-radio__checkmark .ui-icon,
.ui-radio--disabled input:checked+.ui-radio__checkmark .ui-icon,
.ui-radio--no-border input:checked+.ui-radio__checkmark .ui-icon,
.ui-radio--theme-primary input:checked+.ui-radio__checkmark .ui-icon {
    opacity: 1;
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
}

@media(hover: hover) {

    .ui-radio input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark,
    .ui-radio--checkmark-align input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio--checkmark-align input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark,
    .ui-radio--disabled input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio--disabled input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark,
    .ui-radio--no-border input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio--no-border input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark,
    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark {
        border-color: var(--color-black)
    }
}

.ui-radio__label {
    font-weight: var(--checkbox-label-font-weight);
    margin-left: 8px;
    margin-right: 16px;
    pointer-events: none;
    position: relative
}

.ui-radio__checkmark {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-white);
    border: var(--radio-checkmark-border-width) solid var(--color-border);
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--radio-checkmark-size);
    justify-content: center;
    min-width: var(--radio-checkmark-size);
    overflow: hidden;
    width: var(--radio-checkmark-size)
}

.ui-radio__checkmark,
.ui-radio__checkmark .ui-icon {
    -webkit-transition: .2s linear;
    transition: .2s linear
}

.ui-radio__checkmark .ui-icon {
    height: var(--radio-checkmark-icon-size);
    opacity: 0;
    -webkit-transform: rotate(-50deg) scale(.1);
    transform: rotate(-50deg) scale(.1);
    width: var(--radio-checkmark-icon-size)
}

.ui-radio__checkmark .ui-icon svg {
    fill: var(--color-white)
}

.ui-radio--theme-primary input:checked+.ui-radio__checkmark,
.ui-radio--theme-primary input:checked+.ui-radio__label+.ui-radio__checkmark {
    background-color: transparent;
    border-color: var(--color-active)
}

.ui-radio--theme-primary input:checked+.ui-radio__checkmark+.ui-radio__label,
.ui-radio--theme-primary input:checked+.ui-radio__label {
    color: var(--color-active)
}

.ui-radio--theme-primary .ui-radio__label.ui-radio__label {
    color: var(--color-font-primary)
}

.ui-radio--theme-primary .ui-radio__checkmark {
    background-color: transparent;
    border-color: var(--color-border-primary)
}

.ui-radio--theme-primary .ui-radio__checkmark .ui-icon svg {
    fill: var(--color-active)
}

@media(hover: hover) {
    .ui-radio--theme-primary .ui-radio__label {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__checkmark,
    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__checkmark+.ui-radio__label,
    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__label,
    .ui-radio--theme-primary input:not(:checked):hover+.ui-radio__label+.ui-radio__checkmark {
        border-color: var(--color-active);
        color: var(--color-active)
    }
}

.ui-radio--checkmark-align-right .ui-radio__label {
    margin-left: 0;
    margin-right: 8px
}

.ui-radio--disabled {
    cursor: not-allowed
}

.ui-radio--disabled:not(.ui-radio--theme-primary) .ui-radio__checkmark,
.ui-radio--disabled:not(.ui-radio--theme-primary) input:checked+.ui-radio__checkmark {
    background-color: var(--default-background-color);
    border-color: var(--color-border)
}

.ui-radio--disabled:not(.ui-radio--theme-primary) input:checked+.ui-radio__checkmark .ui-icon svg {
    fill: var(--color-grey3)
}

@media(hover: hover) {
    .ui-radio--disabled:not(.ui-radio--theme-primary) input:not(:checked):hover+.ui-radio__checkmark {
        border-color: var(--color-border)
    }
}

.ui-radio--disabled.ui-radio--theme-primary {
    opacity: .6
}

@media(hover: hover) {
    .ui-radio--disabled.ui-radio--theme-primary input:not(:checked):hover+.ui-radio__checkmark {
        border-color: var(--color-border-primary)
    }
}

.ui-radio--no-border .ui-radio__checkmark {
    border-style: none;
    border-width: 0
}

.ui-phone-input.ui-phone-input--autocomplete .ui-input--as-phone .ui-input__icon:after {
    background-image: url(/static/images/chevronDownIcon-f6681b001e4748bd911e.svg);
    background-repeat: no-repeat;
    background-size: 8px 8px;
    content: " ";
    display: block;
    -webkit-filter: invert(47%) sepia(1%) saturate(461%) hue-rotate(27deg) brightness(99%) contrast(94%);
    filter: invert(47%) sepia(1%) saturate(461%) hue-rotate(27deg) brightness(99%) contrast(94%);
    height: 8px;
    margin-left: 6px;
    width: 8px
}

.ui-phone-input .ui-auto-complete__options .ui-input {
    border-bottom: 1px solid var(--color-grey4)
}

.ui-phone-input .ui-auto-complete__options .ui-input__container {
    border-radius: 8px;
    margin: 8px 16px
}

.ui-phone-input .ui-input--as-phone.ui-input--with-icon .ui-input__input {
    padding-left: 8px
}

.ui-phone-input .ui-input--as-phone .ui-input__container label {
    margin-left: 40px
}

.ui-phone-input .ui-input--as-phone .ui-input__static-placeholder {
    color: #474747
}

.ui-phone-input .ui-input--as-phone .ui-input__input::-webkit-input-placeholder {
    color: var(--color-grey2)
}

.ui-phone-input .ui-input--as-phone .ui-input__input::-moz-placeholder {
    color: var(--color-grey2)
}

.ui-phone-input .ui-input--as-phone .ui-input__input:-ms-input-placeholder {
    color: var(--color-grey2)
}

.ui-phone-input .ui-input--as-phone .ui-input__input::-ms-input-placeholder {
    color: var(--color-grey2)
}

.ui-phone-input .ui-input--as-phone .ui-input__input::placeholder {
    color: var(--color-grey2)
}

.ui-phone-input .ui-input--as-phone .ui-input__icon {
    left: 8px
}

.ui-phone-input .ui-input--as-phone .ui-input__icon svg {
    height: 12px;
    width: 16px
}

.ui-auto-complete,
.ui-auto-complete--show {
    position: relative
}

.ui-auto-complete__options {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    -webkit-box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, .04);
    margin-top: -1px;
    min-height: calc(var(--select-option-height) + 2px) !important;
    opacity: 0;
    opacity: 1;
    overflow: hidden;
    overflow-y: auto;
    position: absolute !important;
    position: absolute;
    visibility: hidden;
    visibility: visible;
    width: 100%;
    will-change: opacity;
    z-index: 2
}

.ui-auto-complete__options ul {
    list-style: none;
    margin: 0;
    overflow-y: hidden;
    padding: 0
}

.ui-auto-complete__option,
.ui-auto-complete__option--disabled,
.ui-auto-complete__option--highlight {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--select-option-height);
    padding: 0 var(--input-padding)
}

.ui-auto-complete__option--highlight {
    background-color: var(--color-active-background)
}

.ui-auto-complete__option--disabled:not(.ui-auto-complete__option--disabled),
.ui-auto-complete__option--highlight:not(.ui-auto-complete__option--disabled),
.ui-auto-complete__option:not(.ui-auto-complete__option--disabled) {
    cursor: pointer
}

@media(hover: hover) {

    .ui-auto-complete__option--disabled:not(.ui-auto-complete__option--disabled):hover,
    .ui-auto-complete__option--highlight:not(.ui-auto-complete__option--disabled):hover,
    .ui-auto-complete__option:not(.ui-auto-complete__option--disabled):hover {
        background-color: var(--color-hover-background)
    }
}

.ui-auto-complete__option--disabled:not(.ui-auto-complete__option--disabled):active,
.ui-auto-complete__option--highlight:not(.ui-auto-complete__option--disabled):active,
.ui-auto-complete__option:not(.ui-auto-complete__option--disabled):active {
    background-color: var(--color-active-background)
}

.ui-auto-complete--show .ui-input__container {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ui-selection-menu-header {
    padding: 8px var(--selection-menu-padding)
}

.ui-selection-menu-header+li.ui-selection-menu-item div:before,
li.ui-selection-menu-item:last-of-type div:after {
    opacity: 0
}

.ui-selection-menu-item,
.ui-selection-menu-item--clickable,
.ui-selection-menu-item--disabled,
.ui-selection-menu-item--expanded,
.ui-selection-menu-item--selectable,
.ui-selection-menu-item--selected,
.ui-selection-menu-item--with-children {
    background-color: var(--color-white);
    position: relative
}

.ui-selection-menu-item--clickable:after,
.ui-selection-menu-item--disabled:after,
.ui-selection-menu-item--expanded:after,
.ui-selection-menu-item--selectable:after,
.ui-selection-menu-item--selected:after,
.ui-selection-menu-item--with-children:after,
.ui-selection-menu-item:after {
    content: "";
    height: var(--side-menu-item-height);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.ui-selection-menu-item__toggle {
    height: var(--side-menu-item-height);
    padding: var(--selection-menu-padding);
    position: relative;
    z-index: 1
}

.ui-selection-menu-item__toggle,
.ui-selection-menu-item__toggle .ui-typography {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-selection-menu-item__toggle .ui-typography {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin-right: 8px;
    width: 100%
}

.ui-selection-menu-item__toggle .ui-checkbox {
    margin-right: 16px;
    pointer-events: none;
    z-index: -1
}

.ui-selection-menu-item__label-icon {
    height: var(--checkbox-checkmark-size);
    margin-right: 16px;
    width: var(--checkbox-checkmark-size)
}

.ui-selection-menu-item__children {
    list-style: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0 0 0 calc(var(--checkbox-checkmark-size) + 16px);
    position: relative
}

.ui-selection-menu-item__children:after {
    background-color: var(--color-border);
    bottom: 0;
    content: "";
    height: 1px;
    position: absolute;
    right: 0;
    z-index: 1
}

.ui-selection-menu-item--clickable>.ui-selection-menu-item__toggle {
    cursor: pointer
}

@media(hover: hover) {
    .ui-selection-menu-item--clickable>.ui-selection-menu-item__toggle {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-selection-menu-item--clickable>.ui-selection-menu-item__toggle:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-selection-menu-item--clickable>.ui-selection-menu-item__toggle:active {
    background-color: var(--color-active-background)
}

.ui-selection-menu-item--selected:not(.ui-selection-menu-item--with-children) .ui-typography {
    color: var(--color-active)
}

.ui-selection-menu-item--disabled {
    cursor: not-allowed
}

.ui-selection-menu-item--disabled>.ui-selection-menu-item__toggle .ui-typography {
    opacity: .6
}

.ui-selection-menu-item--disabled * {
    cursor: not-allowed
}

.ui-selection-menu-item--with-children:after {
    content: none
}

.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle {
    position: relative
}

.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle .ui-checkbox {
    pointer-events: all
}

.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle:after,
.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle:before {
    background-color: var(--color-border);
    content: "";
    height: 1px;
    left: var(--selection-menu-padding);
    position: absolute;
    right: 0
}

.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle:after {
    bottom: 0
}

.ui-selection-menu-item--with-children>.ui-selection-menu-item__toggle:before {
    top: -1px
}

.ui-selection-menu-counter {
    background: var(--color-grey5);
    border-radius: 8px;
    margin-left: auto;
    margin-right: 16px;
    padding: 4px 8px
}

.ui-selection-menu-counter .ui-typography {
    margin: 0
}

.ui-button-form,
.ui-button-form--block,
.ui-button-form--with-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    border: none;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--input-height);
    outline: none;
    padding: 0 var(--input-padding)
}

.ui-button-form__icon svg {
    fill: var(--color-grey1)
}

.ui-button-form--disabled {
    cursor: not-allowed;
    opacity: .6
}

.ui-button-form--clickable {
    cursor: pointer
}

@media(hover: hover) {
    .ui-button-form--clickable {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-button-form--clickable:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-button-form--clickable:active {
    background-color: var(--color-active-background)
}

.ui-button-form--with-icon .ui-button-form__label {
    margin-left: 12px
}

.ui-button-form--block {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

.ui-page-header-module_pageHeader__gIkns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: calc(var(--main-spacing)*-1) calc(var(--main-spacing)*-1) var(--main-spacing);
    min-height: var(--page-header-height);
    padding-left: var(--main-spacing);
    padding-right: var(--main-spacing);
    position: sticky;
    top: var(--main-nav-height);
    z-index: var(--z-index-page-header)
}

@media (min-width: 960px) {
    .ui-page-header-module_pageHeader__gIkns {
        height: var(--page-header-height);
        position: relative;
        top: 0
    }
}

.ui-page-header-module_topContainer__q05mn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--page-header-height);
    width: 100%
}

.ui-page-header-module_title__UEdGe.ui-page-header-module_title__UEdGe {
    font-size: var(--h4-font-size);
    margin: auto 0;
    width: 50%
}

@media (min-width: 960px) {
    .ui-page-header-module_title__UEdGe.ui-page-header-module_title__UEdGe {
        -ms-flex-negative: 0;
        -ms-flex-preferred-size: calc(var(--drawer-width) + var(--drawer-toggle-size)/2 - 8px - var(--main-spacing));
        flex-basis: calc(var(--drawer-width) + var(--drawer-toggle-size)/2 - 8px - var(--main-spacing));
        flex-shrink: 0;
        font-size: var(--h3-font-size);
        margin-bottom: 16px;
        margin-right: var(--main-spacing);
        margin-top: auto;
        width: calc(var(--drawer-width) + var(--drawer-toggle-size)/2 - 8px - var(--main-spacing))
    }
}

.ui-page-header-module_actionButton__mUW1A {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    margin: auto 0;
    padding-left: var(--main-spacing);
    width: 50%
}

@media (min-width: 960px) {
    .ui-page-header-module_actionButton__mUW1A {
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin-left: auto;
        padding-left: 0;
        width: auto
    }

    .ui-page-header-module_content__oabAo {
        margin-right: auto;
        min-width: 0
    }

    .ui-page-header-module_withContent__TU2uF .ui-page-header-module_content__oabAo {
        margin-right: auto
    }

    .ui-page-header-module_withContent__TU2uF .ui-page-header-module_actionButton__mUW1A {
        margin-left: var(--main-spacing)
    }
}

.ui-scroll-container,
.ui-scroll-container--horizontal,
.ui-scroll-container--max-decrement-reached,
.ui-scroll-container--max-increment-reached,
.ui-scroll-container--not-scrollable,
.ui-scroll-container--vertical {
    height: 100%;
    position: relative;
    width: 100%
}

.ui-scroll-container--horizontal:after,
.ui-scroll-container--max-decrement-reached:after,
.ui-scroll-container--max-increment-reached:after,
.ui-scroll-container--not-scrollable:after,
.ui-scroll-container--vertical:after,
.ui-scroll-container:after {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-white)), to(hsla(0, 0%, 100%, 0)));
    background: linear-gradient(90deg, var(--color-white) 0, hsla(0, 0%, 100%, 0) 100%)
}

.ui-scroll-container--horizontal:before,
.ui-scroll-container--max-decrement-reached:before,
.ui-scroll-container--max-increment-reached:before,
.ui-scroll-container--not-scrollable:before,
.ui-scroll-container--vertical:before,
.ui-scroll-container:before {
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(var(--color-white)));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, var(--color-white) 100%)
}

.ui-scroll-container--vertical:after,
.ui-scroll-container.ui-scroll-container--vertical:after {
    background: -webkit-gradient(linear, left bottom, left top, from(hsla(0, 0%, 100%, 0)), to(var(--color-white)));
    background: linear-gradient(0deg, hsla(0, 0%, 100%, 0) 0, var(--color-white) 100%)
}

.ui-scroll-container--vertical:before,
.ui-scroll-container.ui-scroll-container--vertical:before {
    background: -webkit-gradient(linear, left bottom, left top, from(var(--color-white)), to(hsla(0, 0%, 100%, 0)));
    background: linear-gradient(0deg, var(--color-white) 0, hsla(0, 0%, 100%, 0) 100%)
}

.ui-scroll-container--horizontal:after,
.ui-scroll-container--horizontal:before,
.ui-scroll-container--max-decrement-reached:after,
.ui-scroll-container--max-decrement-reached:before,
.ui-scroll-container--max-increment-reached:after,
.ui-scroll-container--max-increment-reached:before,
.ui-scroll-container--not-scrollable:after,
.ui-scroll-container--not-scrollable:before,
.ui-scroll-container--vertical:after,
.ui-scroll-container--vertical:before,
.ui-scroll-container:after,
.ui-scroll-container:before {
    bottom: 0;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s;
    width: 40px
}

.ui-scroll-container--horizontal:after,
.ui-scroll-container--max-decrement-reached:after,
.ui-scroll-container--max-increment-reached:after,
.ui-scroll-container--not-scrollable:after,
.ui-scroll-container--vertical:after,
.ui-scroll-container:after {
    left: 0
}

.ui-scroll-container--horizontal:before,
.ui-scroll-container--max-decrement-reached:before,
.ui-scroll-container--max-increment-reached:before,
.ui-scroll-container--not-scrollable:before,
.ui-scroll-container--vertical:before,
.ui-scroll-container:before {
    right: 0;
    z-index: 1
}

.ui-scroll-container .ui-button-icon,
.ui-scroll-container .ui-button-round,
.ui-scroll-container--horizontal .ui-button-icon,
.ui-scroll-container--horizontal .ui-button-round,
.ui-scroll-container--max-decrement-reached .ui-button-icon,
.ui-scroll-container--max-decrement-reached .ui-button-round,
.ui-scroll-container--max-increment-reached .ui-button-icon,
.ui-scroll-container--max-increment-reached .ui-button-round,
.ui-scroll-container--not-scrollable .ui-button-icon,
.ui-scroll-container--not-scrollable .ui-button-round,
.ui-scroll-container--vertical .ui-button-icon,
.ui-scroll-container--vertical .ui-button-round {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .2s;
    transition: .2s;
    z-index: 1
}

.ui-scroll-container .ui-button-icon:first-of-type,
.ui-scroll-container .ui-button-round:first-of-type,
.ui-scroll-container--horizontal .ui-button-icon:first-of-type,
.ui-scroll-container--horizontal .ui-button-round:first-of-type,
.ui-scroll-container--max-decrement-reached .ui-button-icon:first-of-type,
.ui-scroll-container--max-decrement-reached .ui-button-round:first-of-type,
.ui-scroll-container--max-increment-reached .ui-button-icon:first-of-type,
.ui-scroll-container--max-increment-reached .ui-button-round:first-of-type,
.ui-scroll-container--not-scrollable .ui-button-icon:first-of-type,
.ui-scroll-container--not-scrollable .ui-button-round:first-of-type,
.ui-scroll-container--vertical .ui-button-icon:first-of-type,
.ui-scroll-container--vertical .ui-button-round:first-of-type {
    left: calc((var(--button-round-height)/2)*-1)
}

.ui-scroll-container .ui-button-icon:last-of-type,
.ui-scroll-container .ui-button-round:last-of-type,
.ui-scroll-container--horizontal .ui-button-icon:last-of-type,
.ui-scroll-container--horizontal .ui-button-round:last-of-type,
.ui-scroll-container--max-decrement-reached .ui-button-icon:last-of-type,
.ui-scroll-container--max-decrement-reached .ui-button-round:last-of-type,
.ui-scroll-container--max-increment-reached .ui-button-icon:last-of-type,
.ui-scroll-container--max-increment-reached .ui-button-round:last-of-type,
.ui-scroll-container--not-scrollable .ui-button-icon:last-of-type,
.ui-scroll-container--not-scrollable .ui-button-round:last-of-type,
.ui-scroll-container--vertical .ui-button-icon:last-of-type,
.ui-scroll-container--vertical .ui-button-round:last-of-type {
    right: calc((var(--button-round-height)/2)*-1)
}

.ui-scroll-container .ui-button-icon .ui-icon,
.ui-scroll-container--horizontal .ui-button-icon .ui-icon,
.ui-scroll-container--max-decrement-reached .ui-button-icon .ui-icon,
.ui-scroll-container--max-increment-reached .ui-button-icon .ui-icon,
.ui-scroll-container--not-scrollable .ui-button-icon .ui-icon,
.ui-scroll-container--vertical .ui-button-icon .ui-icon {
    height: var(--icon-size-extra-small);
    width: var(--icon-size-extra-small)
}

.ui-scroll-container__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth
}

.ui-scroll-container__content>* {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.ui-scroll-container--vertical:after,
.ui-scroll-container--vertical:before {
    height: 40px;
    left: 0;
    right: 0;
    width: 100%
}

.ui-scroll-container--vertical:after {
    top: 0
}

.ui-scroll-container--vertical:before {
    bottom: 0;
    top: auto
}

.ui-scroll-container--vertical .ui-button-icon,
.ui-scroll-container--vertical .ui-button-round {
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

.ui-scroll-container--vertical .ui-button-icon:first-of-type,
.ui-scroll-container--vertical .ui-button-round:first-of-type {
    left: 50%;
    right: auto;
    top: calc((var(--main-spacing) - 8px)*-1)
}

.ui-scroll-container--vertical .ui-button-icon:last-of-type,
.ui-scroll-container--vertical .ui-button-round:last-of-type {
    bottom: calc((var(--main-spacing) - 8px)*-1);
    left: 50%;
    right: auto;
    top: auto
}

.ui-scroll-container--vertical .ui-scroll-container__content {
    display: block;
    overflow-x: hidden;
    overflow-y: auto
}

.ui-scroll-container--max-decrement-reached .ui-button-icon:last-of-type,
.ui-scroll-container--max-decrement-reached .ui-button-round:last-of-type,
.ui-scroll-container--max-decrement-reached:before,
.ui-scroll-container--max-increment-reached .ui-button-icon:first-of-type,
.ui-scroll-container--max-increment-reached .ui-button-round:first-of-type,
.ui-scroll-container--max-increment-reached:after,
.ui-scroll-container--not-scrollable .ui-button-icon,
.ui-scroll-container--not-scrollable .ui-button-round,
.ui-scroll-container--not-scrollable:after,
.ui-scroll-container--not-scrollable:before {
    opacity: 0;
    visibility: hidden
}

.ui-scroll-container--theme-primary:after {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-primary)), to(hsla(0, 0%, 100%, 0)));
    background: linear-gradient(90deg, var(--color-primary) 0, hsla(0, 0%, 100%, 0) 100%)
}

.ui-scroll-container--theme-primary:before {
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(var(--color-primary)));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, var(--color-primary) 100%)
}

.ui-scroll-container--theme-primary.ui-scroll-container--vertical:after {
    background: -webkit-gradient(linear, left bottom, left top, from(hsla(0, 0%, 100%, 0)), to(var(--color-primary)));
    background: linear-gradient(0deg, hsla(0, 0%, 100%, 0) 0, var(--color-primary) 100%)
}

.ui-scroll-container--theme-primary.ui-scroll-container--vertical:before {
    background: -webkit-gradient(linear, left bottom, left top, from(var(--color-primary)), to(hsla(0, 0%, 100%, 0)));
    background: linear-gradient(0deg, var(--color-primary) 0, hsla(0, 0%, 100%, 0) 100%)
}

.ui-application-switcher {
    background-color: var(--color-primary-dark);
    border: 1px solid var(--color-border-primary);
    border-radius: var(--border-radius);
    -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .08), 1px 1px 4px 0 rgba(0, 0, 0, .04);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .08), 1px 1px 4px 0 rgba(0, 0, 0, .04);
    display: grid;
    grid-template-columns: auto auto auto;
    height: calc(var(--badge-size-extra-small)*2.5 + 150px);
    overflow-y: auto;
    padding: var(--main-spacing) 12px;
    position: absolute;
    right: 8px;
    top: calc(100% - 8px);
    width: calc(var(--badge-size-extra-small)*2.1*3);
    z-index: var(--z-index-main-nav)
}

html[data-theme=big-dutchman] .ui-application-switcher {
    background-color: var(--color-primary);
    -webkit-box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1)
}

@media(min-width: 1152px) {
    html[data-theme=big-dutchman] .ui-application-switcher {
        left: calc(100% - 8px);
        right: auto;
        top: 8px
    }
}

.ui-application-switcher__application {
    border-radius: var(--border-radius);
    height: calc(var(--badge-size-extra-small) + 60px)
}

.ui-application-switcher__application .ui-typography {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: none;
    display: -webkit-box;
    font-size: var(--body2-font-size);
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    left: 0;
    overflow: hidden;
    padding: 0 4px;
    position: absolute;
    right: 0;
    text-overflow: ellipsis;
    top: 100%;
    width: 100%;
    word-break: break-word
}

@media(hover: hover) {
    .ui-application-switcher__application .ui-typography {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-application-switcher__application:hover .ui-typography {
        color: var(--color-white)
    }
}

.ui-avatar {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--color-primary-light);
    border-radius: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--avatar-size);
    justify-content: center;
    text-align: center;
    width: var(--avatar-size)
}

.ui-slider,
.ui-slider--always-show-tooltip,
.ui-slider--show-tooltip {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--slider-handle-size);
    position: relative
}

.ui-slider__input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: var(--color-grey4);
    border: none;
    border-radius: calc(var(--slider-height)/2);
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    height: var(--slider-height);
    outline: none;
    width: 100%
}

@media(hover: hover) {
    .ui-slider__input {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-slider__input:hover {
        background-color: var(--color-grey3)
    }
}

.ui-slider__input:active::-moz-range-thumb,
.ui-slider__input:active::-webkit-slider-thumb {
    -webkit-box-shadow: none;
    box-shadow: none
}

.ui-slider__handle {
    height: var(--slider-handle-size);
    pointer-events: none;
    position: absolute;
    width: var(--slider-handle-size)
}

.ui-slider__input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 100%;
    box-shadow: var(--slider-box-shadow);
    cursor: pointer;
    height: var(--slider-handle-size);
    position: relative;
    width: var(--slider-handle-size)
}

@media(hover: hover) {
    .ui-slider__input::-moz-range-thumb {
        -moz-transition: .2s;
        transition: .2s
    }

    .ui-slider__input::-moz-range-thumb:hover {
        background-color: var(--color-grey5)
    }
}

.ui-slider__input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 100%;
    -webkit-box-shadow: var(--slider-box-shadow);
    box-shadow: var(--slider-box-shadow);
    cursor: pointer;
    height: var(--slider-handle-size);
    position: relative;
    width: var(--slider-handle-size)
}

@media(hover: hover) {
    .ui-slider__input::-webkit-slider-thumb {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-slider__input::-webkit-slider-thumb:hover {
        background-color: var(--color-grey5)
    }
}

.ui-slider__input::-moz-focus-outer {
    border: 0
}

.ui-slider__progress {
    border-bottom-left-radius: calc(var(--slider-height)/2);
    border-top-left-radius: calc(var(--slider-height)/2);
    cursor: pointer;
    height: var(--slider-height);
    pointer-events: none;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-slider__progress,
.ui-slider__tooltip {
    background-color: var(--color-active);
    position: absolute
}

.ui-slider__tooltip {
    border-radius: 4px;
    bottom: 70%;
    -webkit-box-shadow: var(--slider-box-shadow);
    box-shadow: var(--slider-box-shadow);
    left: 50%;
    margin-bottom: calc(4px + var(--slider-tooltip-arrow-size));
    opacity: 0;
    padding: 4px 8px;
    text-align: center;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .15s ease-in-out;
    transition: .15s ease-in-out;
    -webkit-transition-delay: .5s;
    transition-delay: .5s;
    visibility: hidden
}

.ui-slider__tooltip .ui-typography {
    line-height: 1;
    white-space: pre
}

.ui-slider__tooltip:after {
    border: var(--slider-tooltip-arrow-size) solid transparent;
    border-top: var(--slider-tooltip-arrow-size) solid var(--color-active);
    content: "";
    height: 0;
    left: 50%;
    position: absolute;
    top: 100%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0
}

.ui-slider--always-show-tooltip .ui-slider__tooltip,
.ui-slider--show-tooltip .ui-slider__tooltip {
    bottom: 100%;
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    visibility: visible
}

.ui-house-compass {
    --cardinal-points-offset: var(--h4-font-size);
    height: calc(350px - var(--cardinal-points-offset));
    position: relative;
    width: calc(350px - var(--cardinal-points-offset))
}

.ui-house-compass * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

@media(min-width: 640px) {
    .ui-house-compass {
        --cardinal-points-offset: var(--h3-font-size)
    }
}

@media(min-width: 960px) {
    .ui-house-compass {
        --cardinal-points-offset: var(--h1-font-size);
        height: calc(620px - var(--cardinal-points-offset));
        width: calc(620px - var(--cardinal-points-offset))
    }
}

.ui-house-compass__degrees .ui-typography {
    position: absolute
}

.ui-house-compass__degrees .ui-typography:first-child {
    right: 8%;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg)
}

.ui-house-compass__degrees .ui-typography:nth-child(2) {
    bottom: 8%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-house-compass__degrees .ui-typography:nth-child(3) {
    left: 8%;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(-90deg);
    transform: translateY(-50%) rotate(-90deg)
}

.ui-house-compass__cardinal-points {
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0
}

.ui-house-compass__cardinal-points .ui-typography {
    font-size: var(--cardinal-points-offset);
    position: absolute
}

.ui-house-compass__cardinal-points .ui-typography:first-child {
    left: 50%;
    top: calc((var(--cardinal-points-offset) + 1%)*-1);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-house-compass__cardinal-points .ui-typography:nth-child(2) {
    right: calc((var(--cardinal-points-offset) + 1%)*-1);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-house-compass__cardinal-points .ui-typography:nth-child(3) {
    bottom: calc((var(--cardinal-points-offset) + 1%)*-1);
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-house-compass__cardinal-points .ui-typography:nth-child(4) {
    left: calc((var(--cardinal-points-offset) + 1%)*-1);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-house-compass__handle {
    background-color: var(--color-white);
    border-radius: 100%;
    -webkit-box-shadow: var(--button-box-shadow);
    box-shadow: var(--button-box-shadow);
    cursor: pointer;
    height: 12%;
    left: 50%;
    max-height: var(--button-round-height);
    max-width: var(--button-round-height);
    position: absolute;
    top: 5%;
    -ms-touch-action: none;
    touch-action: none;
    -webkit-transform: translateX(-50%) rotate(90deg);
    transform: translateX(-50%) rotate(90deg);
    width: 12%
}

.ui-house-compass__handle .ui-icon {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-house-compass__handle .ui-icon svg {
    fill: var(--color-primary)
}

.ui-house-compass__dial {
    -ms-touch-action: none;
    touch-action: none
}

.ui-house-compass__content {
    height: 50%;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 50%
}

.ui-house-compass__value {
    bottom: -10%;
    left: 0;
    position: absolute;
    right: 0;
    text-align: center
}

.ui-house-compass__value .ui-typography:first-child {
    font-size: var(--h4-font-size)
}

.ui-house-compass__value .ui-typography:last-child {
    font-size: var(--h5-font-size)
}

@media(min-width: 640px) {
    .ui-house-compass__value .ui-typography:first-child {
        font-size: var(--h3-font-size)
    }

    .ui-house-compass__value .ui-typography:last-child {
        font-size: var(--h4-font-size)
    }
}

@media(min-width: 960px) {
    .ui-house-compass__value .ui-typography:first-child {
        font-size: var(--h1-font-size)
    }

    .ui-house-compass__value .ui-typography:last-child {
        font-size: var(--h3-font-size)
    }
}

.ui-house-compass__image {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 95%
}

.ui-house-compass__image-pointer {
    bottom: 0;
    left: 0;
    margin: -10%;
    position: absolute;
    right: 0;
    top: 0
}

.ui-house-compass__image-pointer svg {
    fill: var(--color-active);
    height: 10%;
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(-90deg);
    transform: translateY(-50%) rotate(-90deg);
    width: 10%
}

.ui-silo,
.ui-silo--fill-state-alarm,
.ui-silo--fill-state-ok,
.ui-silo--fill-state-warning {
    position: relative;
    width: 60px
}

.ui-silo__silo-icon {
    fill: var(--color-grey1);
    width: 100%
}

.ui-silo__silo-icon stop {
    stop-color: var(--color-red)
}

.ui-silo__states-container .ui-icon {
    position: absolute
}

.ui-silo__states-container .ui-icon svg {
    fill: var(--color-grey1)
}

.ui-silo__delivery-icon {
    bottom: 0;
    left: calc((var(--icon-size) + 4px)*-1);
    position: relative
}

.ui-silo__shared-icon {
    left: calc((var(--icon-size) + 4px)*-1)
}

.ui-silo__shared-icon,
.ui-silo__shared-icon:after {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-silo__shared-icon:after {
    border-top: 1px dashed var(--color-grey1);
    content: "";
    height: 1px;
    left: 100%;
    position: absolute;
    width: 14px
}

.ui-silo__active-icon {
    bottom: 0;
    right: 0
}

.ui-silo--fill-state-ok .ui-silo__silo-icon stop {
    stop-color: var(--color-green)
}

.ui-silo--fill-state-warning .ui-silo__silo-icon stop {
    stop-color: var(--color-warning)
}

.ui-silo--fill-state-alarm .ui-silo__silo-icon stop {
    stop-color: var(--color-alarm)
}

.ui-timeline__list {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 0
}

.ui-timeline__list li:first-child:after {
    content: none
}

.ui-timeline__list-item,
.ui-timeline__list-item--active,
.ui-timeline__list-item--completed {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    text-align: center
}

.ui-timeline__list-item--active:after,
.ui-timeline__list-item--completed:after,
.ui-timeline__list-item:after {
    background-color: var(--color-grey3);
    content: "";
    height: 2px;
    position: absolute;
    right: 50%;
    top: calc(var(--timeline-icon-size)/2);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%
}

.ui-timeline__list-item--active:after {
    background-color: var(--color-active)
}

.ui-timeline__list-item--active .ui-timeline__icon-container {
    background-color: var(--color-active);
    border-color: var(--color-active)
}

.ui-timeline__list-item--active .ui-timeline__icon-container .ui-timeline__state-icon svg {
    fill: var(--color-white)
}

.ui-timeline__list-item--completed:after {
    background-color: var(--color-active)
}

.ui-timeline__list-item--completed .ui-timeline__checkmark {
    display: block
}

.ui-timeline__list-item--completed .ui-timeline__icon-container {
    border-color: var(--color-active)
}

.ui-timeline__list-item--completed .ui-timeline__icon-container .ui-timeline__state-icon svg {
    fill: var(--color-active)
}

.ui-timeline__icon-container {
    -ms-flex-negative: 0;
    background-color: var(--color-white);
    border: 2px solid var(--color-grey3);
    border-radius: 100%;
    display: inline-block;
    flex-shrink: 0;
    height: var(--timeline-icon-size);
    margin-bottom: var(--main-spacing);
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: var(--timeline-icon-size);
    z-index: 1
}

.ui-timeline__state-icon svg {
    fill: var(--color-grey3);
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-timeline__checkmark {
    background-color: var(--color-active);
    border-radius: 100%;
    bottom: 0;
    display: none;
    height: 16px;
    position: absolute;
    right: 0;
    width: 16px
}

.ui-timeline__checkmark svg {
    fill: var(--color-white);
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-timeline__sub-label {
    -ms-flex-negative: 0;
    color: var(--color-font-subtitle1);
    flex-shrink: 0
}

.ui-timeline--vertical .ui-timeline__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.ui-timeline--vertical .ui-timeline__list li:first-child:after {
    content: ""
}

.ui-timeline--vertical .ui-timeline__list li:last-child:after {
    content: none
}

.ui-timeline--vertical .ui-timeline__list-item,
.ui-timeline--vertical .ui-timeline__list-item--active,
.ui-timeline--vertical .ui-timeline__list-item--completed {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: var(--main-spacing);
    text-align: left
}

.ui-timeline--vertical .ui-timeline__list-item--active:after,
.ui-timeline--vertical .ui-timeline__list-item--completed:after,
.ui-timeline--vertical .ui-timeline__list-item:after {
    background-color: var(--color-grey3);
    height: 100%;
    left: calc(var(--timeline-icon-size)/2);
    right: auto;
    top: 0;
    -webkit-transform: translateY(0) translateX(-50%);
    transform: translateY(0) translateX(-50%);
    width: 2px
}

.ui-timeline--vertical .ui-timeline__sub-label {
    margin-right: var(--main-spacing)
}

.ui-timeline--vertical .ui-timeline__icon-container {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: var(--main-spacing)
}

.ui-timeline--vertical:not(.ui-timeline--size-small) .ui-timeline__label,
.ui-timeline--vertical:not(.ui-timeline--size-small) .ui-timeline__sub-label {
    padding-top: 8px
}

.ui-timeline--size-small .ui-timeline__list-item--active:after,
.ui-timeline--size-small .ui-timeline__list-item--completed:after,
.ui-timeline--size-small .ui-timeline__list-item:after {
    background-color: var(--color-grey3);
    top: calc(var(--icon-size)/2)
}

.ui-timeline--size-small .ui-timeline__list-item .ui-timeline__checkmark,
.ui-timeline--size-small .ui-timeline__list-item--active .ui-timeline__checkmark,
.ui-timeline--size-small .ui-timeline__list-item--completed .ui-timeline__checkmark {
    display: none
}

.ui-timeline--size-small .ui-timeline__list-item--completed .ui-timeline__icon-container {
    background-color: var(--color-grey3);
    border-color: var(--color-grey3)
}

.ui-timeline--size-small .ui-timeline__list-item--completed .ui-timeline__icon-container .ui-timeline__state-icon svg {
    fill: var(--color-white)
}

.ui-timeline--size-small .ui-timeline__icon-container {
    height: calc(var(--icon-size) + 8px);
    margin-bottom: 8px;
    width: calc(var(--icon-size) + 8px)
}

.ui-timeline--size-small.ui-timeline--vertical .ui-timeline__list-item--active:after,
.ui-timeline--size-small.ui-timeline--vertical .ui-timeline__list-item--completed:after,
.ui-timeline--size-small.ui-timeline--vertical .ui-timeline__list-item:after {
    left: calc(var(--icon-size)/2 + 4px)
}

.ui-cage {
    min-height: var(--cage-size);
    min-width: var(--cage-size);
    position: relative
}

.ui-cage,
.ui-cage__box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-cage__box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100%;
    width: 100%
}

.ui-cage__box-rows {
    background-image: linear-gradient(to left, var(--color-border) var(--cage-grid-border-size), transparent 1px), linear-gradient(to top, var(--color-border) var(--cage-grid-border-size), transparent 1px);
    border: var(--cage-stroke-width) solid var(--cage-stroke-color);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    height: 100%;
    position: relative
}

.ui-cage__box-rows:after {
    background-color: var(--cage-stroke-color);
    bottom: calc(var(--cage-stroke-width)*-1);
    content: "";
    height: var(--cage-stroke-width);
    position: absolute;
    right: -5px;
    width: calc(100% + 10px)
}

.ui-cage__box-rows:before {
    background-color: var(--color-active);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: .2s linear;
    transition: .2s linear;
    visibility: hidden
}

.ui-cage__box-rows .ui-cage__box-row .ui-cage__box-net:first-child {
    border-left: none
}

.ui-cage__box-rows .ui-cage__box-row .ui-cage__box-net:last-child {
    border-right: none
}

.ui-cage__box-rows .ui-cage__box-row:first-child .ui-cage__box-net {
    border-top: none
}

.ui-cage__box-rows .ui-cage__box-row:last-child .ui-cage__box-net {
    border-bottom: none
}

.ui-cage__box-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%
}

.ui-cage__box-net {
    border: 1px solid var(--color-border);
    width: 100%
}

.ui-cage__box-bottom {
    border-bottom: var(--cage-stroke-width) solid var(--cage-stroke-color);
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-left: var(--cage-stroke-width) solid var(--cage-stroke-color);
    border-right: var(--cage-stroke-width) solid var(--cage-stroke-color);
    height: 12px;
    position: relative
}

.ui-cage__box-bottom:after,
.ui-cage__box-bottom:before {
    background-color: var(--cage-stroke-color);
    border-radius: 1px;
    content: "";
    height: var(--cage-stroke-width);
    position: absolute;
    top: -4px;
    width: 6px
}

.ui-cage__box-bottom:before {
    right: -10px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.ui-cage__box-bottom:after {
    left: -10px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.ui-cage__icon {
    bottom: 0;
    position: absolute;
    right: 0
}

.ui-cage__icon:after {
    background-color: var(--default-background-color);
    border-radius: 100%;
    content: "";
    height: calc(var(--icon-size) + 16px);
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: calc(var(--icon-size) + 16px)
}

.ui-cage__icon svg {
    fill: var(--cage-stroke-color);
    position: relative;
    z-index: 1
}

.ui-cage .ui-notification-counter {
    position: absolute;
    right: calc((var(--notification-counter-size)/2)*-1);
    top: calc((var(--notification-counter-size)/2)*-1)
}

.ui-cage--active .ui-cage__box-rows:before {
    opacity: .2;
    visibility: visible
}

.ui-simple-bar-chart {
    height: 100%;
    width: 100%
}

.ui-progress-bar-chart-bar,
.ui-progress-bar-chart-bar--has-dependencies,
.ui-progress-bar-chart-bar--with-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--progress-bar-chart-height);
    position: relative;
    width: 100%;
    z-index: 1
}

.ui-progress-bar-chart-bar--has-dependencies:first-child,
.ui-progress-bar-chart-bar--with-button:first-child,
.ui-progress-bar-chart-bar:first-child {
    border-top: 1px solid var(--color-border)
}

.ui-progress-bar-chart-bar__chart {
    -webkit-box-flex: 1;
    border-bottom: 1px solid var(--color-border);
    -ms-flex: 1;
    flex: 1;
    height: var(--progress-bar-chart-height);
    position: relative;
    width: 0
}

.ui-progress-bar-chart-bar__chart .disabled path {
    fill: var(--color-chart-grid)
}

.ui-progress-bar-chart-bar__chart .recharts-text {
    font-size: 14px
}

.ui-progress-bar-chart-bar__chart .recharts-responsive-container {
    pointer-events: none
}

.ui-progress-bar-chart-bar__chart .recharts-surface {
    overflow: visible
}

.ui-progress-bar-chart-bar__chart .recharts-cartesian-grid-vertical line {
    stroke: var(--color-border)
}

.ui-progress-bar-chart-bar__chart .recharts-cartesian-axis-ticks rect {
    fill: var(--color-border)
}

.ui-progress-bar-chart-bar__chart .recharts-cartesian-grid-horizontal {
    display: none
}

.ui-progress-bar-chart-bar__name {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--progress-bar-chart-height);
    padding-right: 16px;
    width: var(--progress-bar-chart-labels-width);
    z-index: 2
}

.ui-progress-bar-chart-bar__name>.ui-typography {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: var(--default-font-color);
    display: -webkit-box;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    word-break: break-word
}

.ui-progress-bar-chart-bar__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-flex: 0;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    border-bottom-right-radius: var(--border-radius);
    border-left: 2px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    border-top-right-radius: var(--border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 0 var(--progress-bar-chart-button-width);
    flex: 0 0 var(--progress-bar-chart-button-width);
    height: var(--progress-bar-chart-height);
    justify-content: center;
    position: relative;
    right: 0;
    top: 0;
    z-index: 1
}

.ui-progress-bar-chart-bar__button-disabled {
    -webkit-box-flex: 0;
    border-bottom: 1px solid var(--color-border);
    -ms-flex: 0 0 calc(var(--progress-bar-chart-button-width) - var(--border-radius) + 2px);
    flex: 0 0 calc(var(--progress-bar-chart-button-width) - var(--border-radius) + 2px);
    margin-right: calc(var(--border-radius) - 2px)
}

.ui-progress-bar-chart-bar__button-disabled-last {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 var(--progress-bar-chart-button-width);
    flex: 0 0 var(--progress-bar-chart-button-width)
}

.ui-progress-bar-chart-bar__progress-label {
    left: var(--progress-bar-chart-labels-width);
    position: absolute;
    right: 0;
    top: 0
}

.ui-progress-bar-chart-bar__progress-label>span {
    left: 0;
    position: absolute
}

.ui-progress-bar-chart-bar__progress-label>span>.ui-typography.ui-typography {
    color: var(--default-font-color);
    position: relative;
    text-align: right;
    top: -2px
}

.ui-progress-bar-chart-bar--with-button {
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

@media(hover: hover) {
    .ui-progress-bar-chart-bar--with-button {
        -webkit-transition: .2s;
        transition: .2s
    }

    .ui-progress-bar-chart-bar--with-button:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-progress-bar-chart-bar--with-button:active {
    background-color: var(--color-active-background)
}

.ui-progress-bar-chart-bar--has-dependencies .ui-progress-bar-chart-bar__name {
    padding-left: var(--progress-bar-chart-button-width)
}

html[data-theme=skov] .ui-progress-bar-chart-bar__chart .recharts-text {
    fill: #b4b4b4;
    font-family: Noto Sans, sans-serif;
    font-weight: 400
}

html[data-theme=skov] .ui-progress-bar-chart-bar__button .ui-icon svg {
    fill: #b4b4b4
}

html[data-theme=big-dutchman] .ui-progress-bar-chart-bar__chart .recharts-text {
    fill: #b4b4b4;
    font-family: Noto Sans, sans-serif;
    font-weight: 400
}

html[data-theme=big-dutchman] .ui-progress-bar-chart-bar__button .ui-icon svg {
    fill: #b4b4b4
}

.ui-progress-bar-chart-footer,
.ui-progress-bar-chart-footer--in-card {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

.ui-progress-bar-chart-footer__legend {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-progress-bar-chart-footer__legend li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--icon-size);
    margin-right: var(--main-spacing)
}

.ui-progress-bar-chart-footer__legend li .ui-typography {
    color: var(--color-grey3);
    font-size: var(--caption-font-size)
}

.ui-progress-bar-chart-footer__legend li:last-child {
    margin-right: 0
}

.ui-progress-bar-chart-footer__legend-bar {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--chart-stroke-width);
    justify-content: space-between;
    margin-left: 8px;
    margin-right: -3px;
    position: relative;
    width: 24px
}

.ui-progress-bar-chart-footer--in-card {
    background-color: var(--color-cloudy);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    border-top: 1px solid var(--color-border);
    margin-bottom: calc(var(--card-low-density-padding)*-1);
    margin-left: calc(var(--card-low-density-padding)*-1);
    margin-right: calc(var(--card-low-density-padding)*-1);
    padding: 0 var(--card-low-density-padding)
}

.ui-progress-bar-chart,
.ui-progress-bar-chart--with-buttons,
.ui-progress-bar-chart--with-titles {
    position: relative;
    width: 100%
}

.ui-progress-bar-chart__x-axis-clearer {
    height: var(--chart-x-axis-height);
    width: 100%
}

.ui-progress-bar-chart__reference-line {
    bottom: var(--chart-x-axis-height);
    left: -1px;
    margin-bottom: -2px;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: -2px;
    -webkit-transform: translateX(-1px);
    transform: translateX(-1px);
    z-index: 3
}

.ui-progress-bar-chart__reference-line .label {
    margin: 0 8px;
    position: absolute;
    top: 2px
}

.ui-progress-bar-chart__reference-line .label .ui-typography {
    color: var(--default-font-color);
    line-height: 1.35
}

.ui-progress-bar-chart__reference-line .ui-line {
    background-color: var(--color-chart-reference-line);
    border-radius: 2px;
    height: 100%;
    position: relative;
    width: 2px
}

.ui-progress-bar-chart__reference-line .ui-line .bottom-icon,
.ui-progress-bar-chart__reference-line .ui-line .top-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: block;
    justify-content: center;
    left: -2px;
    position: absolute;
    right: 0
}

.ui-progress-bar-chart__reference-line .ui-line .bottom-icon .ui-icon,
.ui-progress-bar-chart__reference-line .ui-line .top-icon .ui-icon {
    height: 6px;
    width: 6px
}

.ui-progress-bar-chart__reference-line .ui-line .bottom-icon .ui-icon svg,
.ui-progress-bar-chart__reference-line .ui-line .top-icon .ui-icon svg {
    fill: var(--color-chart-reference-line);
    height: 6px;
    width: 6px
}

.ui-progress-bar-chart__reference-line .ui-line .top-icon {
    top: -8px
}

.ui-progress-bar-chart__reference-line .ui-line .bottom-icon {
    bottom: -8px
}

.ui-progress-bar-chart__dependencies {
    bottom: 0;
    left: 0;
    position: absolute;
    top: 0;
    width: var(--progress-bar-chart-button-width);
    z-index: 1
}

.ui-progress-bar-chart__dependency-indicater,
.ui-progress-bar-chart__dependency-indicater--dependency {
    left: 50%;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: var(--progress-bar-chart-dependency-dot-size)
}

.ui-progress-bar-chart__dependency-indicater .ui-dot,
.ui-progress-bar-chart__dependency-indicater--dependency .ui-dot {
    background-color: var(--color-grey1);
    border-radius: 100%;
    height: var(--progress-bar-chart-dependency-dot-size);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: var(--progress-bar-chart-dependency-dot-size)
}

.ui-progress-bar-chart__dependency-indicater .ui-line,
.ui-progress-bar-chart__dependency-indicater--dependency .ui-line {
    background-color: var(--color-chart-grid);
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 2px
}

.ui-progress-bar-chart__dependency-indicater--dependency .ui-dot.ui-dot.ui-dot {
    background-color: transparent;
    border: 2px solid var(--color-grey1)
}

.ui-progress-bar-chart--with-buttons .ui-progress-bar-chart__reference-line {
    right: var(--progress-bar-chart-button-width)
}

.ui-progress-bar-chart--with-titles .ui-progress-bar-chart__reference-line {
    left: calc(var(--progress-bar-chart-labels-width) - 1px)
}

.ui-single-stacked-bar-chart {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    min-width: 100%
}

.ui-single-stacked-bar-chart__container {
    border-radius: var(--border-radius);
    height: var(--progress-bar-height-small);
    overflow: hidden;
    position: relative;
    width: 100%
}

.ui-single-stacked-bar-chart__container .recharts-responsive-container {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    top: -2px
}

@media(min-width: 960px) {
    .ui-single-stacked-bar-chart__container {
        height: var(--icon-size)
    }
}

.ui-single-stacked-bar-chart__legends {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 4px -8px;
    padding: 0
}

.ui-single-stacked-bar-chart__legends li {
    margin: 4px 8px;
    width: calc(50% - 16px)
}

@media(min-width: 960px) {
    .ui-single-stacked-bar-chart__legends {
        margin-left: -8px;
        margin-right: -8px
    }

    .ui-single-stacked-bar-chart__legends li {
        margin: 4px 8px
    }
}

html[data-theme=skov] .ui-single-stacked-bar-chart__container {
    background-color: #dcdcdc
}

html[data-theme=skov] .ui-single-stacked-bar-chart .recharts-bar:first-of-type .recharts-rectangle {
    fill: var(--color-primary)
}

html[data-theme=skov] .ui-single-stacked-bar-chart__legends li:first-child .ui-value__dot {
    background-color: var(--color-primary)
}

html[data-theme=skov] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(2) .recharts-rectangle {
    fill: var(--color-primary-light)
}

html[data-theme=skov] .ui-single-stacked-bar-chart__legends li:nth-child(2) .ui-value__dot {
    background-color: var(--color-primary-light)
}

html[data-theme=skov] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(3) .recharts-rectangle {
    fill: var(--color-primary-green)
}

html[data-theme=skov] .ui-single-stacked-bar-chart__legends li:nth-child(3) .ui-value__dot {
    background-color: var(--color-primary-green)
}

html[data-theme=skov] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(4) .recharts-rectangle {
    fill: var(--color-success)
}

html[data-theme=skov] .ui-single-stacked-bar-chart__legends li:nth-child(4) .ui-value__dot {
    background-color: var(--color-success)
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart__container {
    background-color: #f1f2f2
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart .recharts-bar:first-of-type .recharts-rectangle {
    fill: #321705
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart__legends li:first-child .ui-value__dot {
    background-color: #321705
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(2) .recharts-rectangle {
    fill: #78380b
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart__legends li:nth-child(2) .ui-value__dot {
    background-color: #78380b
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(3) .recharts-rectangle {
    fill: #ea6f18
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart__legends li:nth-child(3) .ui-value__dot {
    background-color: #ea6f18
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart .recharts-bar:nth-of-type(4) .recharts-rectangle {
    fill: #f5b88d
}

html[data-theme=big-dutchman] .ui-single-stacked-bar-chart__legends li:nth-child(4) .ui-value__dot {
    background-color: #f5b88d
}

.ui-circular-progress-module_circularProgress__LDbQE {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.ui-circular-progress-module_circularProgress__LDbQE,
.ui-circular-progress-module_value__5Hc6C {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

.ui-circular-progress-module_value__5Hc6C {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    bottom: 0;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0
}

.ui-circular-progress-module_pieCharts__csv8E {
    margin: 0 auto;
    position: relative
}

.ui-circular-progress-module_pieCharts__csv8E .recharts-surface {
    overflow: visible
}

html[data-theme=skov] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:first-of-type path {
    fill: #30da59
}

html[data-theme=skov] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:nth-of-type(2) path {
    fill: var(--color-primary-light)
}

html[data-theme=skov] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:nth-of-type(3) path {
    fill: var(--color-primary-green)
}

html[data-theme=big-dutchman] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:first-of-type path {
    fill: #ea6f18
}

html[data-theme=big-dutchman] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:nth-of-type(2) path {
    fill: #f3a976
}

html[data-theme=big-dutchman] .ui-circular-progress-module_pieChartForeground__huc-Q .recharts-pie-sector:nth-of-type(3) path {
    fill: #78380b
}

.ui-circular-progress-module_pieChartBackground__otvO- {
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.ui-circular-progress-module_pieChartBackground__otvO- .recharts-pie-sector path {
    fill: var(--default-background-color)
}

.ui-circular-progress-module_legends__F3nyx {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    list-style: none;
    margin-bottom: 0;
    margin-top: var(--main-spacing);
    padding: 0
}

.ui-circular-progress-module_legends__F3nyx li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 16px
}

.ui-circular-progress-module_legends__F3nyx li:last-child {
    margin-right: 0
}

.ui-circular-progress-module_legends__F3nyx li span {
    border-radius: 100%;
    display: block;
    height: 8px;
    margin-right: 4px;
    width: 8px
}

html[data-theme=skov] .ui-circular-progress-module_legends__F3nyx li:first-of-type span {
    background-color: #30da59
}

html[data-theme=skov] .ui-circular-progress-module_legends__F3nyx li:nth-of-type(2) span {
    background-color:
}
}

html[data-theme=skov] .ui-circular-progress-module_legends__F3nyx li:nth-of-type(3) span {
    background-color: var(--color-primary-green)
}

html[data-theme=big-dutchman] .ui-circular-progress-module_legends__F3nyx li:first-of-type span {
    background-color: #ea6f18
}

html[data-theme=big-dutchman] .ui-circular-progress-module_legends__F3nyx li:nth-of-type(2) span {
    background-color: #f3a976
}

html[data-theme=big-dutchman] .ui-circular-progress-module_legends__F3nyx li:nth-of-type(3) span {
    background-color: #78380b
}

.ui-circular-progress-module_progressIndicator__-K-xK {
    bottom: -4px;
    left: -4px;
    margin: 0 auto;
    position: absolute;
    right: -4px;
    top: -4px
}

.ui-circular-progress-module_progressIndicator__-K-xK:after {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 100%;
    content: "";
    height: 14px;
    left: 50%;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 14px
}

.ui-circular-progress-module_themePrimary__nvr0D .ui-circular-progress-module_pieChartBackground__otvO- .recharts-pie-sector {
    opacity: .2
}

.ui-circular-progress-module_themePrimary__nvr0D .ui-circular-progress-module_pieChartBackground__otvO- .recharts-pie-sector path {
    fill: var(--color-font-primary)
}

.ui-circular-progress-module_themePrimary__nvr0D .ui-circular-progress-module_legends__F3nyx li .ui-typography {
    color: var(--color-font-primary)
}

.ui-new-composed-chart .recharts-surface {
    overflow: visible
}

.ui-new-composed-chart .recharts-tooltip-cursor {
    stroke-width: var(--chart-stroke-width);
    stroke: var(--color-chart-grid)
}

.ui-new-composed-chart .recharts-reference-line line {
    stroke-width: 2
}

.ui-new-composed-chart .recharts-cartesian-grid line,
.ui-new-composed-chart .xAxis line,
.ui-new-composed-chart .yAxis line {
    stroke: var(--color-chart-grid)
}

.ui-new-composed-chart .recharts-area path,
.ui-new-composed-chart .recharts-line path {
    stroke-width: var(--chart-stroke-width)
}

.ui-new-composed-chart .recharts-brush {
    stroke-width: 0
}

.ui-new-composed-chart .recharts-brush rect:first-child {
    fill: var(--color-cloudy)
}

.ui-new-composed-chart .recharts-brush .recharts-brush-slide {
    fill: var(--color-primary-light)
}

.ui-new-composed-chart .recharts-brush .recharts-brush-texts text {
    fill: var(--color-grey1);
    font-family: var(--font-family-primary);
    font-size: var(--caption-font-size)
}

.ui-new-composed-chart .recharts-brush .recharts-brush-traveller rect {
    fill: var(--color-primary-light)
}

.ui-new-composed-chart .recharts-brush .recharts-brush-traveller line {
    stroke-width: 1px;
    stroke: var(--color-white)
}

.ui-new-composed-chart .recharts-brush .recharts-area path {
    fill: var(--color-grey4)
}

.ui-new-composed-chart .recharts-brush .recharts-area path,
.ui-new-composed-chart .recharts-brush .recharts-line path {
    stroke: var(--color-grey4);
    stroke-opacity: .5;
    fill-opacity: .5
}

.dot {
    fill: var(--color-white);
    stroke-width: var(--chart-stroke-width)
}

.reference-line-label foreignobject {
    height: var(--icon-size-small);
    width: var(--icon-size-small)
}

.reference-line-label foreignobject svg,
.reference-line-label text {
    fill: var(--color-chart-reference-line)
}

.reference-line-label text {
    font-family: var(--font-family-primary);
    font-size: var(--body1-font-size);
    font-weight: var(--font-weight-bold)
}

.new-custom-tooltip {
    max-width: 250px !important;
    padding: 0 !important
}

.new-custom-tooltip .ui-typography {
    font-size: var(--caption-font-size)
}

.new-custom-tooltip__label {
    background-color: var(--default-background-color);
    border-bottom: 1px solid var(--color-border);
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    display: block;
    padding: 8px 16px
}

.new-custom-tooltip__values {
    list-style: none;
    margin: 0;
    padding-left: 16px
}

.new-custom-tooltip__values li {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 32px;
    justify-content: space-between;
    padding-right: 16px;
    width: 100%
}

.new-custom-tooltip__values li:last-child {
    border-bottom: none
}

.new-custom-tooltip__value-label {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    min-width: 0;
    padding-right: 8px
}

.new-custom-tooltip__value-label span {
    -ms-flex-negative: 0;
    border-radius: 100%;
    display: inline-block;
    flex-shrink: 0;
    height: var(--chart-dot-size);
    margin-right: 8px;
    width: var(--chart-dot-size)
}

.new-custom-tooltip__value-label .ui-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.new-custom-tooltip__value-value {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    min-width: 0;
    text-align: right
}

.new-custom-tooltip__value-value .ui-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

html[data-theme=big-dutchman] .new-custom-tooltip {
    -webkit-box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 10px 20px 5px rgba(0, 0, 0, .1)
}

.axis-label text {
    fill: var(--color-grey3);
    font-family: var(--font-family-primary);
    font-size: var(--body1-font-size)
}

.legends {
    list-style: none;
    margin: 0;
    padding: 0
}

.legends__legend {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: var(--main-spacing)
}

.legends__legend .ui-typography {
    color: var(--color-grey3);
    margin-right: 4px
}

.legends__legend:last-child {
    margin-right: 0
}

.legends__icon,
.legends__icon--dashed {
    width: 20px
}

.legends__icon span,
.legends__icon--dashed span {
    border-radius: 2px;
    display: block;
    height: 4px;
    width: 20px
}

.legends__icon--dashed {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

.legends__icon--dashed span {
    width: 5px
}

.ui-skeleton-chart {
    --y-axis-width: 75px
}

.ui-skeleton-chart,
.ui-skeleton-chart__y-axis {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.ui-skeleton-chart__y-axis {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    height: 100%;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-skeleton-chart__y-axis li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    position: relative
}

.ui-skeleton-chart__y-axis li:before {
    background-color: var(--color-grey5);
    content: "";
    height: 1px;
    margin-right: auto;
    width: calc(100% - var(--y-axis-width))
}

.ui-skeleton-chart__y-axis li .ui-skeleton {
    width: calc(var(--y-axis-width) - var(--main-spacing))
}

.ui-skeleton-chart__x-axis {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    -ms-flex-negative: 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0 var(--y-axis-width) 0 0
}

.ui-skeleton-chart__x-axis li {
    width: 30px
}

.ui-skeleton-chart__legend {
    margin-top: 16px
}

.ui-skeleton-chart__main {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-bottom: 8px;
    position: relative
}

.ui-skeleton-chart__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: center;
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1
}

.ui-skeleton-chart__content .ui-typography {
    color: var(--color-grey1)
}

.ui-skeleton-chart__content .ui-icon {
    margin-bottom: 8px
}

.ui-skeleton-chart__content .ui-icon svg {
    fill: var(--color-grey1)
}

@-webkit-keyframes pulse {
    0% {
        opacity: 1
    }

    50% {
        opacity: .5
    }

    to {
        opacity: 1
    }
}

@keyframes pulse {
    0% {
        opacity: 1
    }

    50% {
        opacity: .5
    }

    to {
        opacity: 1
    }
}

.ui-skeleton,
.ui-skeleton--animation,
.ui-skeleton--height-small,
.ui-skeleton--shade-darker,
.ui-skeleton--shade-darkest {
    background-color: var(--color-grey5);
    border-radius: var(--border-radius);
    height: 16px
}

.ui-skeleton--animation:before,
.ui-skeleton--height-small:before,
.ui-skeleton--shade-darker:before,
.ui-skeleton--shade-darkest:before,
.ui-skeleton:before {
    content: " "
}

.ui-skeleton--height-small {
    height: 10px;
    min-height: auto
}

.ui-skeleton--shade-darker {
    background-color: var(--color-grey4)
}

.ui-skeleton--shade-darkest {
    background-color: var(--color-grey3)
}

.ui-skeleton--animation {
    -webkit-animation: pulse 1.5s ease-in-out .5s infinite;
    animation: pulse 1.5s ease-in-out .5s infinite
}

.ui-setpoint-value-module_setPointValue__Lx4OO {
    --icon-path-fill: var(--color-grey1);
    --setpoint-value-height: 70px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--setpoint-value-height);
    position: relative
}

.ui-setpoint-value-module_chip__iuTLu {
    margin-right: 8px
}

.ui-setpoint-value-module_icon__1-uTm {
    fill: var(--color-border);
    height: var(--setpoint-value-height);
    width: auto
}

.ui-setpoint-value-module_icon__1-uTm path:first-child {
    fill: var(--icon-path-fill);
    opacity: .2
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(2) {
    fill: var(--icon-path-fill);
    opacity: .5
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(3) {
    fill: var(--icon-path-fill);
    opacity: .8
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(4) {
    fill: var(--icon-path-fill)
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(5) {
    fill: var(--icon-path-fill);
    opacity: .8
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(6) {
    fill: var(--icon-path-fill);
    opacity: .5
}

.ui-setpoint-value-module_icon__1-uTm path:nth-child(7) {
    fill: var(--icon-path-fill);
    opacity: .2
}

.ui-setpoint-value-module_label__dHyjB {
    font-size: var(--caption-font-size);
    left: 0;
    position: absolute;
    top: 0
}

.ui-setpoint-value-module_themePrimary__HhTQm {
    --icon-path-fill: var(--color-font-primary)
}

.ui-setpoint-value-module_sizeLarge__INnBk {
    --setpoint-value-height: 80px
}

.ui-setpoint-value-module_disabled__dQagf .ui-setpoint-value-module_chip__iuTLu {
    background-color: var(--color-primary-dark)
}

.ui-setpoint-value-module_disabled__dQagf .ui-setpoint-value-module_chip__iuTLu .ui-chip__text {
    color: var(--color-font-primary);
    opacity: .6
}

.ui-thermometer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center
}

.ui-thermometer__relative-container {
    border-left: 8px solid var(--color-active);
    border-right: 8px solid var(--color-active);
    left: 8px;
    position: relative;
    width: 56px
}

.ui-thermometer__icon {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: var(--main-spacing);
    padding-bottom: 69px;
    padding-top: 28px;
    position: relative;
    width: 72px
}

.ui-thermometer__icon:before {
    border: 8px solid var(--color-active);
    border-bottom: 0;
    border-top-left-radius: 28px;
    border-top-right-radius: 28px;
    content: "";
    height: 20px;
    top: 0;
    width: 40px
}

.ui-thermometer__icon:before,
.ui-thermometer__icon>svg {
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ui-thermometer__icon>svg {
    bottom: 0;
    height: 70px;
    width: 74px
}

.ui-thermometer__icon>svg path:first-child {
    fill: var(--color-active)
}

.ui-thermometer__icon>svg path:nth-child(2) {
    fill: var(--color-font-primary)
}

.ui-thermometer__icon>svg stop {
    stop-color: var(--color-font-primary)
}

.ui-thermometer__value {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-thermometer__value .ui-value {
    margin: 0 var(--main-spacing)
}

.ui-thermometer__value .ui-value__value {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.ui-thermometer__indicator {
    background-color: var(--color-white);
    height: 2px;
    left: -8px;
    margin: 0 -1px;
    position: absolute;
    -webkit-transition: .2s;
    transition: .2s;
    width: calc(100% + 18px)
}

.ui-thermometer__indicator .ui-icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-thermometer__indicator .ui-icon svg {
    fill: var(--color-white)
}

.ui-thermometer__indicator .ui-icon:first-child {
    left: calc((var(--icon-size-extra-small) + 2px)*-1);
    -webkit-transform: translateY(-50%) rotate(-90deg);
    transform: translateY(-50%) rotate(-90deg)
}

.ui-thermometer__indicator .ui-icon:last-child {
    right: calc((var(--icon-size-extra-small) + 2px)*-1);
    -webkit-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg)
}

.ui-thermometer__scale {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% + 2px);
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    right: -16px;
    top: -2px
}

.ui-thermometer__scale li {
    background-color: var(--color-active);
    height: 2px;
    position: relative;
    width: 8px
}

.ui-thermometer__scale li .ui-typography {
    left: calc(100% + 12px);
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-thermometer__feature-indicators {
    bottom: 0;
    left: -16px;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0
}

.ui-thermometer__feature-indicators li {
    background-color: var(--color-active);
    height: 2px;
    position: absolute;
    right: calc(100% - 8px);
    width: 8px
}

.ui-thermometer__feature-indicators li .ui-icon {
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-thermometer__temperature-indicator {
    background-color: var(--color-font-primary);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    bottom: 0;
    left: 50%;
    position: absolute;
    right: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: .2s;
    transition: .2s;
    width: 8px
}

.ui-footer-module_footer__qsqdo {
    background-color: var(--color-grey6);
    border-top: 1px solid var(--color-border);
    height: var(--footer-height);
    position: relative
}

@media (min-width: 640px) {
    .ui-footer-module_footer__qsqdo {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: space-between;
        padding-left: var(--main-spacing);
        padding-right: calc(var(--main-spacing)/2)
    }
}

@media (min-width: 1152px) {
    html[data-theme=big-dutchman] .ui-footer-module_footer__qsqdo {
        left: var(--main-nav-height)
    }
}

.ui-footer-module_logo__-cuyg {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px var(--main-spacing)
}

.ui-footer-module_logo__-cuyg svg {
    fill: var(--color-grey1);
    height: calc(var(--footer-action-height) - 16px)
}

@media (min-width: 640px) {
    .ui-footer-module_logo__-cuyg {
        height: var(--footer-height);
        padding: 0
    }
}

.ui-footer-module_actions__mp-6k {
    list-style: none;
    margin: 0 0 0 auto;
    padding: 0
}

.ui-footer-module_actions__mp-6k .ui-footer-module_ui-divider__RzfjW {
    height: 16px
}

@media (min-width: 640px) {
    .ui-footer-module_actions__mp-6k {
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: flex-end
    }
}

.ui-footer-module_action__8pG6q {
    cursor: pointer;
    height: var(--footer-action-height);
    padding: 0 var(--main-spacing);
    -webkit-transition: .2s;
    transition: .2s
}

.ui-footer-module_action__8pG6q,
.ui-footer-module_action__8pG6q a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-footer-module_action__8pG6q a {
    width: 100%
}

.ui-footer-module_action__8pG6q .ui-icon {
    margin-right: 8px
}

.ui-footer-module_action__8pG6q .ui-icon svg {
    fill: var(--color-font-subtitle1)
}

.ui-footer-module_action__8pG6q:hover {
    background-color: var(--color-hover-background)
}

.ui-footer-module_action__8pG6q:active {
    background-color: var(--color-active-background)
}

@media (min-width: 640px) {
    .ui-footer-module_action__8pG6q {
        padding: 0 calc(var(--main-spacing)/2);
        position: relative
    }

    .ui-footer-module_action__8pG6q:after {
        background-color: var(--color-border);
        content: "";
        height: 20px;
        position: absolute;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 1px
    }

    .ui-footer-module_action__8pG6q:last-of-type:after {
        content: none
    }

    .ui-footer-module_action__8pG6q:active,
    .ui-footer-module_action__8pG6q:hover {
        background-color: transparent
    }

    .ui-footer-module_action__8pG6q:active .ui-typography,
    .ui-footer-module_action__8pG6q:hover .ui-typography {
        text-decoration: underline
    }
}

.ui-accordion {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border)
}

.ui-accordion--expanded {
    background-color: transparent
}

.ui-accordion-summary {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--accordion-summary-height);
    padding: 0 var(--accordion-summary-padding);
    position: relative;
    -webkit-transition: background-color .15s linear 0ms;
    transition: background-color .15s linear 0ms
}

@media(hover: hover) {
    .ui-accordion-summary:hover {
        background-color: var(--color-hover-background)
    }
}

.ui-accordion-summary:active {
    background-color: var(--color-active-background)
}

.ui-accordion-summary__expand-icon {
    margin-left: auto
}

.ui-accordion-summary__expand-icon svg {
    -webkit-transition: -webkit-transform .15s cubic-bezier(.4, 0, .2, 1) 0ms;
    transition: -webkit-transform .15s cubic-bezier(.4, 0, .2, 1) 0ms;
    transition: transform .15s cubic-bezier(.4, 0, .2, 1) 0ms;
    transition: transform .15s cubic-bezier(.4, 0, .2, 1) 0ms, -webkit-transform .15s cubic-bezier(.4, 0, .2, 1) 0ms
}

.ui-accordion-summary__title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.ui-accordion--expanded .ui-accordion-summary__expand-icon svg {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ui-accordion-summary--align-content-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 8px
}

.ui-accordion-details {
    display: none;
    padding: 16px var(--accordion-summary-padding)
}

.ui-accordion--expanded .ui-accordion-details {
    display: block
}

.ui-splash-module_splash__w4Y0O {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    position: relative;
    text-align: center
}

.ui-splash-module_title__Zzy0B .ui-typography {
    font-size: var(--h3-font-size);
    margin-bottom: calc(var(--main-spacing)*1.5)
}

@media (min-width: 640px) {
    .ui-splash-module_title__Zzy0B .ui-typography {
        font-size: var(--h1-font-size)
    }
}

.ui-splash-module_description__0FTUN .ui-typography {
    margin-bottom: var(--main-spacing)
}

.ui-splash-module_content__ll17Z {
    position: relative;
    z-index: 1
}

.farm-in-landscape-module_farmInLandscape__1JJpv {
    bottom: 0;
    left: 0;
    margin: 0 auto;
    max-height: 50%;
    max-width: 1750px;
    position: absolute;
    right: 0;
    top: 0;
    top: 10%
}

.farm-in-landscape-module_left__cyh5o,
.farm-in-landscape-module_right__QEc3g {
    fill: var(--color-grey5);
    max-height: 100%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 30%
}

.farm-in-landscape-module_left__cyh5o {
    left: 0
}

.farm-in-landscape-module_right__QEc3g {
    right: 0
}

.apollo-module_apolloGenericSplashScreen__F1CcM {
    margin-bottom: calc(var(--main-spacing)*2);
    max-width: var(--splash-generic-illustration-width)
}

.walking-chicken-module_walkingChicken__j93eL {
    max-width: 400px;
    position: relative
}

.walking-chicken-module_chicken__1kubz {
    fill: var(--color-grey1);
    bottom: 0;
    position: absolute;
    right: 0;
    width: 60px
}

@media (min-width: 640px) {
    .walking-chicken-module_chicken__1kubz {
        width: 98px
    }
}

.ui-value-display-module_value__rsrKR {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 2px solid var(--color-border-primary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 0;
    position: relative
}

.ui-value-display-module_value__rsrKR .ui-typography {
    color: var(--color-white);
    font-size: calc(var(--h1-font-size)*2)
}

.ui-value-display-module_value__rsrKR .ui-button-round {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ui-value-display-module_description__JA-V7 {
    margin-top: 8px
}

.ui-value-display-module_description__JA-V7 .ui-typography {
    color: var(--color-font-primary)
}

.ui-value-display-module_chip__77R28 {
    height: var(--chip-height)
}

.ui-value-display-module_error__zdA2p .ui-value-display-module_value__rsrKR {
    border-color: var(--color-alarm)
}

.ui-value-display-module_warning__srtHY .ui-value-display-module_value__rsrKR {
    border-color: var(--color-warning)
}

.ui-breadcrumbs-module_breadcrumbs__0hSyW .ui-dropdown-menu {
    margin-top: 8px
}

.ui-breadcrumbs-module_crumbs__VSA41 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-breadcrumbs-module_crumbs__VSA41 li:last-child {
    margin-right: 0
}

.ui-breadcrumbs-module_crumb__eKCSb {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: calc(var(--main-spacing)/2)
}

.ui-breadcrumbs-module_crumb__eKCSb .ui-icon {
    margin-left: calc(var(--main-spacing)/2)
}

.ui-breadcrumbs-module_crumb__eKCSb .ui-icon svg {
    fill: var(--color-grey2)
}

.ui-breadcrumbs-module_crumb__eKCSb>.ui-typography {
    color: var(--color-grey2);
    cursor: pointer;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-breadcrumbs-module_crumb__eKCSb>.ui-typography:active,
.ui-breadcrumbs-module_crumb__eKCSb>.ui-typography:hover {
    color: var(--default-font-color)
}

.ui-breadcrumbs-module_activeCrumb__e9fLv .ui-typography {
    color: var(--default-font-color)
}

.ui-breadcrumbs-module_moreButton__8wIJp {
    position: relative
}

.ui-breadcrumbs-module_moreButton__8wIJp>button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    border-radius: 100%;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    outline: none;
    -webkit-transition: .2s;
    transition: .2s
}

.ui-breadcrumbs-module_moreButton__8wIJp:hover>button {
    background-color: var(--color-hover-background)
}

.ui-breadcrumbs-module_moreButton__8wIJp:active>button {
    background-color: var(--color-active-background)
}

.ui-menu-block-module_menuItems__u1sYs {
    list-style: none;
    margin: 0;
    padding: 0
}

.ui-menu-block-module_title__5xj2j {
    padding-bottom: 4px
}

.ui-menu-block-item-module_menuBlockItem__L-Lhu {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--menu-block-item-height);
    position: relative;
    -webkit-transition-duration: .2s;
    transition-duration: .2s
}

.ui-menu-block-item-module_menuBlockItem__L-Lhu * {
    position: relative;
    z-index: 1
}

.ui-menu-block-item-module_menuBlockItem__L-Lhu:after {
    background-color: var(--color-border);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    -webkit-transition: .2s;
    transition: .2s;
    width: 100%
}

.ui-menu-block-item-module_menuBlockItem__L-Lhu:last-child:after {
    left: calc(var(--main-spacing)*-1);
    width: calc(var(--main-spacing) + 100%)
}

.ui-menu-block-item-module_menuBlockItem__L-Lhu:hover:after {
    background-color: var(--color-active)
}

html[data-layout=controller] .ui-menu-block-item-module_menuBlockItem__L-Lhu {
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms
}

html[data-layout=controller] .ui-menu-block-item-module_menuBlockItem__L-Lhu:active {
    background-color: var(--color-active-background)
}

html[data-theme=big-dutchman] .ui-menu-block-item-module_menuBlockItem__L-Lhu:after {
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms
}

.ui-menu-block-item-module_icon__qhIQA {
    margin-right: 12px
}

.ui-menu-block-item-module_text__77Pcf {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--color-font-label);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-family: var(--font-family-primary);
    font-size: var(--body1-font-size);
    font-weight: var(--font-weight-label);
    height: 100%;
    text-align: left;
    width: 100%
}

.ui-menu-block-item-module_text__77Pcf span {
    color: var(--color-font-label);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

html[data-layout=controller] .ui-menu-block-item-module_text__77Pcf {
    font-size: var(--button-font-size);
    line-height: 1.4
}

button.ui-menu-block-item-module_text__77Pcf {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    outline: none;
    padding: 0
}

.ui-menu-block-item-module_link__-LY9A {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    width: 100%
}

html[data-theme=skov] .ui-menu-block-item-module_active__i-f-y .ui-menu-block-item-module_icon__qhIQA svg,
html[data-theme=skov] .ui-menu-block-item-module_link__-LY9A.active .ui-menu-block-item-module_icon__qhIQA svg {
    fill: var(--color-active)
}

html[data-theme=skov] .ui-menu-block-item-module_active__i-f-y span,
html[data-theme=skov] .ui-menu-block-item-module_link__-LY9A.active span {
    color: var(--color-active)
}

html[data-theme=skov] .ui-menu-block-item-module_active__i-f-y:after,
html[data-theme=skov] .ui-menu-block-item-module_link__-LY9A.active:after {
    background-color: var(--color-active);
    height: 2px
}

html[data-theme=big-dutchman] .ui-menu-block-item-module_active__i-f-y:after,
html[data-theme=big-dutchman] .ui-menu-block-item-module_link__-LY9A.active:after {
    background-color: var(--color-active);
    height: 100%;
    left: calc(var(--main-spacing)*-1);
    top: -1px;
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms;
    width: calc(var(--main-spacing) + 100%)
}

html[data-theme=big-dutchman] .ui-menu-block-item-module_active__i-f-y .ui-menu-block-item-module_icon__qhIQA svg,
html[data-theme=big-dutchman] .ui-menu-block-item-module_link__-LY9A.active .ui-menu-block-item-module_icon__qhIQA svg {
    fill: var(--color-white)
}

html[data-theme=big-dutchman] .ui-menu-block-item-module_active__i-f-y span,
html[data-theme=big-dutchman] .ui-menu-block-item-module_link__-LY9A.active span {
    color: var(--color-white)
}

.ui-menu-block-item-module_primaryThemed__Se-hO:after {
    background-color: var(--color-border-primary)
}

.ui-menu-block-item-module_primaryThemed__Se-hO .ui-menu-block-item-module_icon__qhIQA svg {
    fill: var(--color-font-primary)
}

.ui-menu-block-item-module_primaryThemed__Se-hO .ui-menu-block-item-module_text__77Pcf span {
    color: var(--color-font-primary)
}

.ui-drawer-module_drawer__-M30S {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background-color: var(--color-white);
    border-right: 1px solid var(--color-border);
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    left: calc(var(--drawer-width)*-1);
    position: fixed;
    top: 0;
    -webkit-transition: left .25s cubic-bezier(0, .1, .8, 1);
    transition: left .25s cubic-bezier(0, .1, .8, 1);
    width: var(--drawer-width);
    will-change: left;
    z-index: var(--z-index-drawer)
}

@media (min-width: 960px) {
    .ui-drawer-module_drawer__-M30S {
        left: calc(var(--drawer-width)*-1 + var(--drawer-closed-width))
    }
}

@media (min-width: 1152px) {
    html[data-theme=big-dutchman] .ui-drawer-module_drawer__-M30S {
        left: calc(var(--drawer-width)*-1 + var(--main-nav-height) + var(--drawer-closed-width));
        z-index: calc(var(--z-index-main-nav) - 1)
    }
}

.ui-drawer-module_children__9hVEI {
    height: 100%;
    max-height: 100%;
    overflow-y: auto
}

.ui-drawer-module_closeButton__cXZ4h {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    justify-content: center;
    outline: none;
    padding: 0;
    position: relative;
    width: var(--main-nav-link-min-width)
}

.ui-drawer-module_closeButton__cXZ4h:before {
    background-color: var(--color-border);
    content: "";
    height: calc(var(--main-nav-height) - var(--main-spacing)*2);
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px
}

.ui-drawer-module_closeButton__cXZ4h:hover {
    background-color: var(--color-hover-background)
}

.ui-drawer-module_closeButton__cXZ4h:active {
    background-color: var(--color-active-background)
}

@media (min-width: 960px) {
    .ui-drawer-module_closeButton__cXZ4h {
        display: none
    }
}

.ui-drawer-module_header__Z7ZnI {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--main-nav-height);
    justify-content: space-between;
    padding-left: var(--main-spacing);
    position: sticky;
    z-index: 20
}

@media (min-width: 960px) {
    .ui-drawer-module_header__Z7ZnI {
        border-bottom: none;
        margin-bottom: var(--main-spacing);
        padding-top: var(--main-spacing)
    }
}

.ui-drawer-module_mobileToggleButton__Hqfxd {
    bottom: var(--main-spacing);
    position: fixed;
    right: var(--main-spacing);
    z-index: calc(var(--z-index-drawer) - 1)
}

.ui-drawer-module_mobileToggleButton__Hqfxd .ui-icon svg {
    fill: var(--color-grey1)
}

@media (min-width: 960px) {
    .ui-drawer-module_mobileToggleButton__Hqfxd {
        display: none
    }
}

.ui-drawer-module_toggleButton__cJpiz {
    display: none;
    position: relative;
    right: calc((var(--button-round-height)/2)*-1)
}

.ui-drawer-module_toggleButton__cJpiz .ui-drawer-module_ui-icon__ZOR0l svg {
    fill: var(--color-grey1)
}

@media (min-width: 960px) {
    .ui-drawer-module_toggleButton__cJpiz {
        display: block
    }
}

.ui-drawer-module_open__TRzUZ {
    left: 0
}

@media (min-width: 960px) {

    .ui-drawer-module_open__TRzUZ .ui-drawer-module_children__9hVEI,
    .ui-drawer-module_open__TRzUZ .ui-drawer-module_header__Z7ZnI .ui-typography {
        opacity: 1;
        pointer-events: all;
        -webkit-transition: opacity .2s linear;
        transition: opacity .2s linear;
        will-change: opacity
    }
}

@media (min-width: 1152px) {
    html[data-theme=big-dutchman] .ui-drawer-module_open__TRzUZ {
        left: var(--main-nav-height)
    }
}

@media (min-width: 960px) {

    .ui-drawer-module_closed__uvWQf .ui-drawer-module_children__9hVEI,
    .ui-drawer-module_closed__uvWQf .ui-drawer-module_header__Z7ZnI .ui-typography {
        opacity: 0;
        pointer-events: none;
        -webkit-transition: opacity .2s linear;
        transition: opacity .2s linear;
        will-change: opacity
    }
}

.ui-drawer-splitter-module_drawerSplitter__Aok08 {
    -webkit-transition: .35s ease-in-out;
    transition: .35s ease-in-out
}

@media (min-width: 960px) {
    .ui-drawer-splitter-module_drawerSplitter__Aok08 {
        padding-left: calc(16px + var(--drawer-closed-width))
    }

    .ui-drawer-splitter-module_open__YkWh7 {
        padding-left: calc(16px + var(--drawer-width))
    }
}