@charset "UTF-8";

.Debug::after {
    color: var(--color-text);
    position: fixed;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
}

.Debug-grid {
    max-width: calc(1320px + 48px);
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 0px;
    width: 100%;
    z-index: 1000;
}

.Debug-grid::before {
    content: "";
    top: 0;
    bottom: 0;
    display: block;
    left: 0;
    width: 100%;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    background-image: var(--background-columns);
    background-size: var(--background-width);
    z-index: 1000;
    pointer-events: none;
}

.Debug [class*="u-island"] > * {
    background-color: rgba(240, 117, 117, 0.25);
}

.Debug .Grid-cell {
    background-color: rgba(240, 117, 117, 0.25);
}

.Debug-element {
    background-color: rgba(240, 117, 117, 0.25);
}

.Grid {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin-left: calc(-1 * 24px);
    position: relative;
}

.Grid--noGutter {
    margin-left: 0;
}

.Grid--noGutter .Grid-cell {
    padding-left: 0;
}

.Grid--noVerticalGutter > .Grid-cell {
    padding-bottom: 0;
}

@media (min-width: 580px) {
    .u-sm-noVGutter {
        padding-bottom: 0 !important;
    }
}

@media (min-width: 960px) {
    .u-md-noVGutter {
        padding-bottom: 0 !important;
    }
}

@media (min-width: 1320px) {
    .u-lg-noVGutter {
        padding-bottom: 0 !important;
    }
}

.Grid--equalHeight .Grid-cell {
    align-self: stretch;
}

.Grid--equalHeight .Grid-cell > *[class*="u-bg"] {
    flex-grow: 1;
}

.Grid--equalHeight .Grid-cell {
    display: flex;
    flex-direction: column;
}

.Grid--center {
    justify-content: center;
}

.Grid--reverse {
    flex-direction: row-reverse;
}

.Grid--verticalCenter {
    align-items: center;
}

.Grid--verticalBottom {
    align-items: flex-end;
}

.Grid-cell {
    flex: 1 1 0%;
    padding-left: 24px;
    position: relative;
    padding-bottom: 24px;
}

.Grid-cell[class*="u-span"] {
    flex: none;
}

@media (min-width: 580px) {
    .Grid-cell[class*="u-sm-span"] {
        flex: none;
    }
    .Grid-sm--center {
        justify-content: center;
    }
}

@media (min-width: 960px) {
    .Grid-cell[class*="u-md-span"] {
        flex: none;
    }
}

@media (min-width: 1320px) {
    .Grid-cell[class*="u-lg-span"] {
        flex: none;
    }
}

.Grid-cell[class*="u-bg"] {
    background-color: transparent !important;
}

.Grid-cell[class*="u-bg"]::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 0;
    width: calc(100% - 24px);
    height: 100%;
}

.Grid-cell--autoSize {
    flex: none;
}

.Grid--fit > .Grid-cell {
    flex: 1;
}

.Grid--full > .Grid-cell {
    flex: 0 0 100%;
}

.Media {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.Media-figure {
    margin-right: 16px;
}

@media screen and (min-width: 320px) {
    .Media-figure {
        margin-right: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .Media-figure {
        margin-right: 32px;
    }
}

.Media-figure {
    margin-bottom: 16px;
}

@media screen and (min-width: 320px) {
    .Media-figure {
        margin-bottom: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .Media-figure {
        margin-bottom: 32px;
    }
}

.Media-body {
    flex: 1;
    min-width: 320px;
}

.Media-fill {
    display: block;
    width: 100%;
}

.Media-gradient {
    position: relative;
}

.Media-gradient::after {
    content: "";
    background: linear-gradient(
        to bottom,
        rgba(39, 39, 39, 0.5) 0%,
        rgba(39, 39, 39, 0) 100%
    );
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-height: 170px;
}

.MediaEmbed {
    display: block;
    position: relative;
}

/**
* The aspect-ratio hack is applied to an empty element because it allows
* the component to respect `max-height`. Default aspect ratio is 1:1.
*/
.MediaEmbed-ratio {
    display: block;
    padding-bottom: 100%;
    width: 100%;
}

.MediaEmbed-ratio--3by1 {
    padding-bottom: 33.3333333333%;
}

.MediaEmbed-ratio--2by1 {
    padding-bottom: 50%;
}

.MediaEmbed-ratio--16by9 {
    padding-bottom: 56.25%;
}

.MediaEmbed-ratio--4by3 {
    padding-bottom: 75%;
}

.MediaEmbed-ratio--5by4 {
    padding-bottom: 80%;
}

.MediaEmbed-content {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.MediaEmbed-content--contain {
    object-fit: contain;
    width: 100%;
}

.MediaEmbed-content--cover {
    object-fit: cover;
    width: 100%;
}

.Section {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.Section--shadow {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
}

.Section--zoom {
    overflow: hidden;
}

.Section-bg {
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-position: center center;
    background-size: cover;
    transition: transform 1s ease-out;
    transform: translate3d(0, 0, 0);
    top: 0;
    left: 0;
    bottom: 0;
    width: calc(100% + 90px);
    position: absolute;
    transform: scale(1.2);
}

[data-scroll] .Section-bg,
.active .Section-bg {
    transition-duration: 20s;
    transform: scale(1);
}

[class*="Copy"] + [class*="Copy"] {
    margin-top: 32px;
}

[class*="Copy"] > * + * {
    margin-top: 1rem;
}

[class*="Copy"] > * + .Button {
    margin-top: 3rem;
}

[class*="Copy"] > * + * > .Button {
    margin-top: 2rem;
}

[class*="Copy"] h2:not([class]) + *,
[class*="Copy"] h3:not([class]) + *,
[class*="Copy"] h4:not([class]) + *,
[class*="Copy"] .u-sansSerif26 + *,
[class*="Copy"] .SearchField-input + *,
[class*="Copy"] .u-sansSerif26Bd + * {
    margin-top: 4px;
}

[class*="Copy"] .u-serif56 + *,
[class*="Copy"] .Copy--sm h1:not([class]) + *,
.Copy--sm [class*="Copy"] h1:not([class]) + * {
    margin-top: 0.5rem;
}

[class*="Copy"] .Devider + * {
    margin-top: 0;
}

[class*="Copy"] * + h2:not([class]),
[class*="Copy"] * + h3:not([class]),
[class*="Copy"] * + h4:not([class]),
[class*="Copy"] * + .u-sansSerif26,
[class*="Copy"] * + .SearchField-input,
[class*="Copy"] * + .u-sansSerif26Bd {
    margin-top: 2rem;
}

[class*="Copy"] * + .u-serif56,
[class*="Copy"] .Copy--sm * + h1:not([class]),
.Copy--sm [class*="Copy"] * + h1:not([class]) {
    margin-top: 3rem;
}

[class*="Copy"] ol:not([class]) {
    list-style-type: decimal;
    margin-left: 2rem;
}

[class*="Copy"] ul:not([class]) {
    list-style-type: disc;
    margin-left: 2rem;
}

[class*="Copy"] li + li {
    margin-top: 0.5rem;
}

[class*="Copy"] a:not([class]) {
    text-decoration: underline;
}

[class*="Copy"] time {
    display: block;
}

.Grid-cell[data-scroll]:nth-child(1) {
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.Grid-cell[data-scroll]:nth-child(2) {
    transition: all 0.75s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.Grid-cell[data-scroll]:nth-child(3) {
    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.Grid-cell[data-scroll]:nth-child(4) {
    transition: all 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.Grid-cell[data-scroll]:nth-child(5) {
    transition: all 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.StyleGuide-section {
    border: solid rgba(240, 117, 240, 0.25);
    border-width: 5px 0 0 0;
    padding: 80px 0;
    position: relative;
    margin-top: 100px;
}

.StyleGuide-sectionTitle {
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0 20px;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase;
}

.StyleGuide-block {
    position: relative;
}

.StyleGuide-block + .StyleGuide-block {
    margin-top: 60px;
}

.StyleGuide-blockTitle {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: #fff;
    font-weight: 700;
    text-align: center;
    position: relative;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-size: 14px;
}

.StyleGuide-blockTitle span {
    padding: 0 20px;
}

.StyleGuide-blockTitle:before,
.StyleGuide-blockTitle:after {
    content: "";
    flex-grow: 1;
    height: 3px;
}

.StyleGuide-blockTitle:before {
    background: rgba(240, 117, 240, 0.25);
}

.StyleGuide-blockTitle:after {
    background: rgba(240, 117, 240, 0.25);
}

.Dummy-grid {
    width: 100%;
    padding: 24px 24px 0 24px;
    background: rgba(117, 199, 240, 0.15);
    border-radius: 3px;
    text-align: center;
    position: relative;
    z-index: 1001;
}

.Dummy-grid::after {
    content: " ";
    display: block;
    margin-top: 1em;
    height: 0;
    visibility: hidden;
}

.Dummy-block {
    background: rgba(117, 199, 240, 0.15);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px;
    min-height: 300px;
}

.Dummy-space {
    background: rgba(117, 199, 240, 0.15);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 1em;
}

.StyleGuide-island {
    background: rgba(117, 199, 240, 0.15);
}

.StyleGuide-island > div {
    background: rgba(117, 199, 240, 0.15);
    height: 100px;
}

.StyleGuide-table {
    table-layout: fixed;
    width: 100%;
}

.StyleGuide-table th,
.StyleGuide-table td {
    text-align: center;
}

.StyleGuide-table th,
.StyleGuide-table td {
    padding: 10px 20px;
}

.StyleGuide-table tr:nth-child(odd) td {
    background-color: #f5f6f8;
}

.StyleGuide-table a {
    text-decoration: underline;
}

[class*="StyleGuide-status"] {
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 100%;
    width: 20px;
    height: 20px;
    margin: 0 auto;
}

.StyleGuide-status0 {
    background-color: #ed0812;
}

.StyleGuide-status1 {
    background-color: #ffdb38;
}

.StyleGuide-status2 {
    background-color: #25d287;
}

/* Sans serif
--------------------------------------------------------------------------------*/
.u-sansSerif26,
.SearchField-input,
.u-sansSerif26Bd,
[class*="Copy"] h2:not([class]),
[class*="Copy"] h3:not([class]),
[class*="Copy"] h4:not([class]) {
    line-height: 1.4;
}

.u-sansSerif26,
.SearchField-input,
.u-sansSerif26Bd,
[class*="Copy"] h2:not([class]),
[class*="Copy"] h3:not([class]),
[class*="Copy"] h4:not([class]) {
    font-size: 18px;
}

@media screen and (min-width: 320px) {
    .u-sansSerif26,
    .SearchField-input,
    .u-sansSerif26Bd,
    [class*="Copy"] h2:not([class]),
    [class*="Copy"] h3:not([class]),
    [class*="Copy"] h4:not([class]) {
        font-size: calc(0.2vw + 17.36px);
    }
}

@media screen and (min-width: 1320px) {
    .u-sansSerif26,
    .SearchField-input,
    .u-sansSerif26Bd,
    [class*="Copy"] h2:not([class]),
    [class*="Copy"] h3:not([class]),
    [class*="Copy"] h4:not([class]) {
        font-size: 20px;
    }
}

.u-sansSerif20,
.Table tbody td,
[class*="Copy"],
.u-sansSerif20Bd,
.Table th,
.Copy--sm h2:not([class]),
.Copy--sm h3:not([class]),
.Copy--sm h4:not([class]) {
    line-height: 1.5;
}

.u-sansSerif20,
.Table tbody td,
[class*="Copy"],
.u-sansSerif20Bd,
.Table th,
.Copy--sm h2:not([class]),
.Copy--sm h3:not([class]),
.Copy--sm h4:not([class]) {
    font-size: 16px;
}

@media screen and (min-width: 320px) {
    .u-sansSerif20,
    .Table tbody td,
    [class*="Copy"],
    .u-sansSerif20Bd,
    .Table th,
    .Copy--sm h2:not([class]),
    .Copy--sm h3:not([class]),
    .Copy--sm h4:not([class]) {
        font-size: calc(0.2vw + 15.36px);
    }
}

@media screen and (min-width: 1320px) {
    .u-sansSerif20,
    .Table tbody td,
    [class*="Copy"],
    .u-sansSerif20Bd,
    .Table th,
    .Copy--sm h2:not([class]),
    .Copy--sm h3:not([class]),
    .Copy--sm h4:not([class]) {
        font-size: 18px;
    }
}

.u-sansSerif16Bd {
    line-height: 1.5;
    text-transform: uppercase;
}

.u-sansSerif16Bd {
    font-size: 14px;
}

@media screen and (min-width: 320px) {
    .u-sansSerif16Bd {
        font-size: calc(0.2vw + 13.36px);
    }
}

@media screen and (min-width: 1320px) {
    .u-sansSerif16Bd {
        font-size: 16px;
    }
}

.u-sansSerif16,
html,
.Copy--sm {
    line-height: 1.5;
}

.u-sansSerif16,
html,
.Copy--sm {
    font-size: 14px;
}

@media screen and (min-width: 320px) {
    .u-sansSerif16,
    html,
    .Copy--sm {
        font-size: calc(0.2vw + 13.36px);
    }
}

@media screen and (min-width: 1320px) {
    .u-sansSerif16,
    html,
    .Copy--sm {
        font-size: 16px;
    }
}

.u-sansSerif14,
.Table tfoot,
.Button {
    line-height: 1.5;
}

.u-sansSerif14,
.Table tfoot,
.Button {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .u-sansSerif14,
    .Table tfoot,
    .Button {
        font-size: calc(0.2vw + 11.36px);
    }
}

@media screen and (min-width: 1320px) {
    .u-sansSerif14,
    .Table tfoot,
    .Button {
        font-size: 14px;
    }
}

.u-sansSerif12,
.Form-error,
.field-validation-error,
.Form-label {
    font-size: 12px;
    line-height: 1.6;
}

.u-sansSerif26Bd,
[class*="Copy"] h2:not([class]),
[class*="Copy"] h3:not([class]),
[class*="Copy"] h4:not([class]),
.u-sansSerif20Bd,
.Table th,
.Copy--sm h2:not([class]),
.Copy--sm h3:not([class]),
.Copy--sm h4:not([class]),
.u-sansSerif16Bd {
    font-weight: 700;
}

.Accordion {
    background-color: #f5f6f8;
}

.Accordion[data-component="accordion-active"] {
    transition: background 0.3s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Accordion[data-component="accordion-active"]:hover {
    background-color: #d6d6d6;
}

.Accordion-title {
    display: flex;
    align-items: center;
    min-height: 64px;
    position: relative;
}

[data-component="accordion-active"] .Accordion-title {
    padding-left: 0;
    padding-right: 0;
}

.Accordion-toggle {
    width: 100%;
    min-height: 64px;
    padding-left: 32px;
    padding-right: 56px !important;
    text-align: left;
    transition: transform 0.1s ease-in;
}

.Accordion-toggle:not([aria-expanded="true"]):hover {
    transform: translateY(-1px);
}

.Accordion-toggle:not([aria-expanded="true"]):active {
    transform: translateY(1px);
}

.Accordion-toggle > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.Accordion-toggle > * {
    line-height: 1.2;
}

.Accordion-icon {
    border-radius: 100%;
    color: #fff;
    background-color: #0f3d24;
    display: none;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-left: 16px;
    transition: transform 0.3s cubic-bezier(0.51, 0.92, 0.24, 1);
    position: absolute;
    top: calc(50% - 16px);
    right: 16px;
}

[data-component="accordion-active"] .Accordion-icon {
    display: flex;
}

[data-component="accordion-active"] [aria-expanded="true"] .Accordion-icon {
    transform: rotate(45deg);
}

.all-green-dot {
    display: inline-block;
    vertical-align: middle;
    height: 0.2em;
    width: 0.2em;
    border-radius: 100%;
    background: #25d287;
    text-indent: -9999px;
    overflow: hidden;
    margin: -3px 4px 0;
}

.BarChart-wrapper {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.BarChart-wrapperDevided::after {
    content: "";
    border-top: 7px solid #002b6b;
    border-bottom: 7px solid #002b6b;
    position: absolute;
    top: 50%;
    left: 0;
    height: 23px;
    width: 100%;
    transform: skewY(-30deg);
}

.BarChart-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 300px;
    position: relative;
}

@media (min-width: 580px) {
    .BarChart-item {
        height: 400px;
    }
}

@media (min-width: 1320px) {
    .BarChart-item {
        height: 500px;
    }
}

.BarChart-itemBar {
    border-radius: 12px;
    margin: 8px 0;
    width: 24px;
    transform-origin: center bottom;
    position: relative;
    transform: scaleY(0);
    transition: transform 1s 0s cubic-bezier(0.51, 0.92, 0.24, 1);
}

[data-scroll] .BarChart-itemBar,
.active .BarChart-itemBar {
    transform: scaleY(1);
    transition-delay: 0.5s;
}

.BarChart-itemValue {
    opacity: 0;
    transition: opacity 1s 0s cubic-bezier(0.51, 0.92, 0.24, 1);
}

[data-scroll] .BarChart-itemValue,
.active .BarChart-itemValue {
    opacity: 1;
    transition-delay: 1.3s;
}

.Button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 24px/24px;
    cursor: pointer;
    display: inline-flex;
    font-weight: 700;
    align-items: center;
    justify-content: center;
    letter-spacing: 1px;
    padding: 12px 40px;
    min-height: 44px;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: transform 0.1s ease-in, box-shadow 0.25s ease-in;
}

@media (min-width: 580px) {
    .Button {
        min-width: 180px;
    }
}

button.button-skip-link,
a.button-skip-link {
    position: absolute;
    z-index: -9999;
    opacity: 0;
    margin: 10px;
    transform: translateY(10px);
    padding: 22px 14px;
    display: inline-flex;
    height: auto;
    background-color: #ffffff;
    color: #272727;
    text-align: center;
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: uppercase;
    text-overflow: ellipsis;
    line-height: 0.9;
    font-weight: bold;
    font-size: 16px;
    border-radius: 44px;
    min-width: inherit;
    max-width: 100%;
}

button.button-skip-link:focus-visible,
a.button-skip-link:focus-visible {
    opacity: 1;
    z-index: 10001;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.Button.u-textLight {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.Button svg {
    fill: currentColor;
    margin-left: 16px;
    margin-top: 2px;
}

.Button--primary {
    border: none;
    overflow: hidden;
    position: relative;
    text-transform: uppercase;
}

.Button--primary:hover {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
    transform: translateY(-1px);
}

.Button--primary:active {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0);
    transform: translateY(1px);
}

.Button--secondary {
    overflow: hidden;
    position: relative;
    background-color: transparent;
    border: 2px solid currentColor;
    text-transform: uppercase;
}

.Button--secondary::before {
    --size: 0;
    content: "";
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--size);
    height: var(--size);
    background: radial-gradient(circle closest-side, #d3f4e8, transparent);
    transform: translate(-50%, -50%);
    transition: width 0.2s cubic-bezier(0.51, 0.92, 0.24, 1),
        height 0.2s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Button--secondary:hover::before {
    --size: 200px;
}

.Button--secondary span {
    position: relative;
}

/* Button promoted
--------------------------------------------------------------------------------*/
.ButtonPromoted {
    overflow: hidden;
    position: relative;
    background: #fff;
    border-radius: 6px/6px;
    color: #272727;
    padding: 16px 48px 16px 24px;
    min-height: 88px;
    position: relative;
    text-align: left;
    width: 100%;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.ButtonPromoted::before {
    --size: 0;
    content: "";
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--size);
    height: var(--size);
    background: radial-gradient(circle closest-side, #d3f4e8, transparent);
    transform: translate(-50%, -50%);
    transition: width 0.2s cubic-bezier(0.51, 0.92, 0.24, 1),
        height 0.2s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.ButtonPromoted:hover::before {
    --size: 400px;
}

.ButtonPromoted span {
    position: relative;
}

.ButtonPromoted::after {
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='14' xmlns='http://www.w3.org/2000/svg'%3E%3Cdesc%3E Created with Sketch. %3C/desc%3E%3Cg stroke='%23FFF' stroke-width='1.5' fill='none' fill-rule='evenodd'%3E%3Cpath d='M6 1l6 6-6 6M0 7h11'/%3E%3C/g%3E%3C/svg%3E");
    background-color: #0f3d24;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 100%;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 32px;
    height: 32px;
}

.ButtonPromoted--primary {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
}

.ButtonPromoted--primary:hover {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.3);
}

.ButtonPromoted--secondary {
    border: 2px solid #d6d6d6;
}

.u-bgStrongGreen .ButtonPromoted--secondary {
    border-color: transparent;
}

.ButtonPromoted--secondary:hover {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
}

.Button--shadow {
    box-shadow: 0 16px 34px 0 rgba(0, 0, 0, 0.21);
}

.Button--shadow:active {
    box-shadow: 0 16px 34px 0 rgba(0, 0, 0, 0.1);
    transform: translateY(2px);
}

[class^="Button"]:disabled {
    cursor: not-allowed;
    opacity: 0.5;
    pointer-events: none;
}

.Card {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.Card .Button {
    margin-top: 24px;
}

.Card-inner {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    position: relative;
    flex-grow: 1;
}

.Card-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.Card-footer {
    align-self: center;
    padding-top: 32px;
}

.Card-footer .Button:first-child {
    margin-top: 0;
}

.Carousel {
    position: relative;
}

.Carousel-inner {
    position: relative;
}

.Carousel-prev:disabled,
.Carousel-next:disabled {
    cursor: not-allowed;
    opacity: 0;
    pointer-events: none;
}

.Carousel-content > div {
    display: flex;
}

.Carousel-content > div > div {
    display: flex;
    float: none !important;
}

.Carousel-content > div > div > div {
    box-shadow: inset 10px 0 38px 0 rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    width: 100%;
}

.Carousel:not(.Carousel--fullscreen) .Carousel-content {
    position: relative;
}

.Carousel:not(.Carousel--fullscreen) .Carousel-content > div {
    margin-left: calc(-0.5 * 24px);
}

.Carousel:not(.Carousel--fullscreen) .Carousel-content > div > div {
    padding-left: 24px;
}

.Carousel:not(.Carousel--fullscreen) .Carousel-prev,
.Carousel:not(.Carousel--fullscreen) .Carousel-next {
    background-color: rgba(214, 214, 214, 0);
    color: #838383;
    border-radius: 100%;
    border: 2px solid #d6d6d6;
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    transition: background-color 0.4s ease;
    position: absolute;
    top: 50%;
    z-index: 1;
}

.Carousel:not(.Carousel--fullscreen) .Carousel-prev:hover,
.Carousel:not(.Carousel--fullscreen) .Carousel-prev:focus,
.Carousel:not(.Carousel--fullscreen) .Carousel-next:hover,
.Carousel:not(.Carousel--fullscreen) .Carousel-next:focus {
    background-color: #d6d6d6;
}

.Carousel:not(.Carousel--fullscreen) .Carousel-prev {
    left: -16px;
    left: 4px;
    transform: translate(-100%, -50%);
}

@media (min-width: 580px) {
    .Carousel:not(.Carousel--fullscreen) .Carousel-prev {
        left: -24px;
    }
}

.Carousel:not(.Carousel--fullscreen) .Carousel-next {
    right: -16px;
    right: 4px;
    transform: translate(100%, -50%);
}

@media (min-width: 580px) {
    .Carousel:not(.Carousel--fullscreen) .Carousel-next {
        right: -24px;
    }
}

.Carousel:not(.Carousel--fullscreen)[data-component="carousel-active"]
    .Carousel-prev,
.Carousel:not(.Carousel--fullscreen)[data-component="carousel-active"]
    .Carousel-next {
    display: flex;
}

.Carousel--fullscreen .Carousel-prev,
.Carousel--fullscreen .Carousel-next {
    background-color: #6b55ec;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 0;
    top: 50%;
    width: 54px;
    height: 54px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s 0s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Carousel--fullscreen .is-offset .Carousel-prev,
.Carousel--fullscreen .is-offset .Carousel-next {
    left: 0;
    right: auto;
    transform: translateX(-27px);
}

.Carousel--fullscreen .Carousel-next {
    top: calc(50% - 54px - 8px);
    transform: translateX(27px);
}

.Carousel--fullscreen .Carousel-prev {
    transform: translate(27px, 8px);
}

.Carousel--fullscreen .is-active .Carousel-prev,
.Carousel--fullscreen .is-active .Carousel-next {
    opacity: 1;
}

.Carousel-dots {
    display: none;
    justify-content: center;
    margin-top: 32px;
}

[data-component="carousel-active"] .Carousel-dots {
    display: flex;
}

.Carousel-dot {
    border-radius: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    position: relative;
}

.Carousel-dot::after {
    background-color: rgba(214, 214, 214, 0);
    border: 2px solid #d6d6d6;
    border-radius: 100%;
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    transition: background-color 0.4s ease;
}

.Carousel-dot:hover::after,
.Carousel-dot:focus::after,
.Carousel-dot.is-active::after {
    background-color: #d6d6d6;
}

.Checkbox {
    display: flex;
    position: relative;
}

.Checkbox-label-header {
    display: block;
    margin-bottom: 4px;
    font-weight: 700;
}
.Checkbox-input {
    position: absolute;
    opacity: 0;
}

.Checkbox-input:checked + .Checkbox-label::before {
    background-color: #25d287;
    border-color: #25d287;
}

.Checkbox-input:checked + .Checkbox-label::after {
    opacity: 1;
}

.Checkbox-input:disabled,
.Checkbox-input:disabled + .Checkbox-label {
    cursor: not-allowed;
    pointer-events: none;
    user-select: none;
}

.Checkbox-input:disabled + .Checkbox-label,
.Checkbox-input:disabled + .Checkbox-label::before {
    opacity: 0.5;
}

.Checkbox-input:focus + .Checkbox-label::before {
    outline: 2px solid #000;
}

.Checkbox-label {
    display: inline-flex;
    align-items: center;
    line-height: 1.3;
}

.Checkbox-label a {
    text-decoration: underline;
}

.Checkbox-label a:hover {
    text-decoration: none;
}

.Checkbox-label::before {
    align-self: flex-start;
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    content: "";
    display: block;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-right: 16px;
    transition: background-color 0.3s ease-out, border-color 0.3s ease-out;
}

.Checkbox-label::after {
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFF' fill-rule='nonzero' d='M6.923 14L0 6.581 1.937 4.58l4.949 5.231L15.986 0 18 1.964z'/%3E%3C/svg%3E");
    content: "";
    display: block;
    width: 18px;
    height: 14px;
    position: absolute;
    left: 7px;
    top: 16px;
    opacity: 0;
    transform: translateY(-50%);
    transition: opacity 0.2s ease-out;
}

.Checkbox--top-aligned .Checkbox-label {
    align-items: flex-start;
}

.Checkbox--top-aligned .Checkbox-label::before {
    margin-top: 4px;
}

.Checkbox--top-aligned .Checkbox-label::after {
    top: 20px;
}

.Devider {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 2px;
    margin-top: 16px;
    margin-bottom: 16px;
    position: relative;
}

.Devider::after {
    background-color: inherit;
    content: "";
    display: block;
    margin: 0 auto;
    height: 2px;
    width: 100%;
}

.Devider--lg {
    width: 148px;
}

.Devider--lg {
    margin-top: 16px;
}

@media screen and (min-width: 320px) {
    .Devider--lg {
        margin-top: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .Devider--lg {
        margin-top: 32px;
    }
}

.Devider--lg {
    margin-bottom: 16px;
}

@media screen and (min-width: 320px) {
    .Devider--lg {
        margin-bottom: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .Devider--lg {
        margin-bottom: 32px;
    }
}

.Devider--center {
    display: flex;
    margin-left: auto;
    margin-right: auto;
}

.DashedLine {
    background-image: linear-gradient(
        90deg,
        currentColor,
        currentColor 20%,
        transparent 21%,
        transparent 100%
    );
    background-size: 5px 1px;
    height: 1px;
    margin: 16px 0;
    width: 100%;
}

.DashedLine--noSpacing {
    margin: 0;
}

.DashedLine--spacingLg {
    margin-top: 16px;
}

@media screen and (min-width: 320px) {
    .DashedLine--spacingLg {
        margin-top: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .DashedLine--spacingLg {
        margin-top: 32px;
    }
}

.DashedLine--spacingLg {
    margin-bottom: 16px;
}

@media screen and (min-width: 320px) {
    .DashedLine--spacingLg {
        margin-bottom: calc(1.6vw + 10.88px);
    }
}

@media screen and (min-width: 1320px) {
    .DashedLine--spacingLg {
        margin-bottom: 32px;
    }
}

.DashedLine--spacingXl {
    margin-top: 32px;
}

@media screen and (min-width: 320px) {
    .DashedLine--spacingXl {
        margin-top: calc(3.2vw + 21.76px);
    }
}

@media screen and (min-width: 1320px) {
    .DashedLine--spacingXl {
        margin-top: 64px;
    }
}

.DashedLine--spacingXl {
    margin-bottom: 32px;
}

@media screen and (min-width: 320px) {
    .DashedLine--spacingXl {
        margin-bottom: calc(3.2vw + 21.76px);
    }
}

@media screen and (min-width: 1320px) {
    .DashedLine--spacingXl {
        margin-bottom: 64px;
    }
}

.Footer {
    margin-top: 120px;
}

@media screen and (min-width: 320px) {
    .Footer {
        margin-top: calc(12vw + 81.6px);
    }
}

@media screen and (min-width: 1320px) {
    .Footer {
        margin-top: 240px;
    }
}

.Footer a {
    position: relative;
    transition: color 0.3s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Footer a:not([class])::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: all 0.3s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Footer a:hover,
.Footer a.is-active {
    color: #272727;
}

.Footer a:hover::before,
.Footer a.is-active::before {
    transform: scale(1);
}

.Footer-top {
    line-height: 2;
    padding-bottom: 40px;
}

.Footer-middle {
    line-height: 2;
    padding: 48px 0 8px 0;
    position: relative;
}

.Footer-middle::before {
    background-image: linear-gradient(
        90deg,
        currentColor,
        currentColor 20%,
        transparent 21%,
        transparent 100%
    );
    background-size: 5px 1px;
    content: "";
    display: block;
    height: 1px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.Footer-middle a:not([class])::before {
    transform: scale(1);
}

.Footer-title {
    margin-bottom: 8px;
}

@media screen and (min-width: 320px) {
    .Footer-title {
        margin-bottom: calc(2.4vw + 0.32px);
    }
}

@media screen and (min-width: 1320px) {
    .Footer-title {
        margin-bottom: 32px;
    }
}

.Footer-logoWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.Footer-logo {
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    margin-bottom: 8px;
    width: 100%;
}

.Footer-logo + .Footer-logo {
    width: calc(100% / 3 - (8px * 2) / 3);
    margin-bottom: 0;
}

.Footer-bottom {
    padding-top: 16px;
    position: relative;
}

.Footer-bottom::before {
    background-image: linear-gradient(
        90deg,
        currentColor,
        currentColor 20%,
        transparent 21%,
        transparent 100%
    );
    background-size: 5px 1px;
    content: "";
    display: block;
    height: 1px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.Footer-bottom a:not([class])::before {
    transform: scale(1);
}

.Footer-bottom .Grid-cell {
    display: flex;
    align-items: center;
}

@media (max-width: 959px) {
    .Footer-bottom .Grid-cell > * {
        margin-right: 32px;
    }
}

@media (min-width: 960px) {
    .Footer-bottom .Grid-cell > * + * {
        margin-left: 32px;
    }
}

.Footer-bottom .Grid-cell:first-child {
    flex-wrap: wrap;
}

@media (min-width: 960px) {
    .Footer-bottom .Grid-cell:last-child {
        justify-content: flex-end;
    }
}

.umbraco-forms-hidden {
    display: none !important;
}

.Form fieldset + fieldset {
    margin-top: 48px;
}

.Form legend {
    margin-bottom: 16px;
}

.Form-item,
.umbraco-forms-field {
    position: relative;
    text-align: left;
}

.hide-submit-button input[type="submit"] {
    display: none;
}

.align-radio-buttons .radiobuttonlist {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.align-radio-buttons .RadioButton {
    margin-right: 32px;
    margin-bottom: 12px;
}

p + .Form-item,
.Form-item + .Form-item,
p + .umbraco-forms-field,
.Form-item + .umbraco-forms-field,
.umbraco-forms-field + .Form-item,
.umbraco-forms-field + .umbraco-forms-field {
    margin-top: 24px;
}

@media (min-width: 580px) {
    .Form-item--half > *:first-child {
        width: calc(50% - 12px);
    }
}

.Form-label {
    color: #838383;
    position: absolute;
    top: 0;
    left: 16px;
    padding-left: 2px;
    transform: translateY(4px);
    transition: all 0.2s ease-out;
    touch-action: manipulation;
}

.Form-error,
.field-validation-error {
    color: #ed0812;
    margin-top: 8px;
}

.Form-info {
    color: #838383;
    display: flex;
    margin-top: 8px;
}

.Form-info svg {
    margin-right: 16px;
}

.umbraco-forms-navigation {
    margin-top: 32px;
}

.umbraco-forms-tooltip.help-block {
    display: block;
    margin-bottom: 4px;
}

.oldie .umbraco-forms-field-wrapper {
    width: 100%;
}

.oldie .Form-label {
    transform: translateY(-10px);
}

/*!
* Pikaday
* Copyright © 2014 David Bushell | BSD & MIT license | https://dbushell.com/
*/
.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    color: #272727;
    background: #fff;
    border: none;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    font-family: "NORLYSText", sans-serif;
}

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
}

.pika-single:before,
.pika-single:after {
    content: " ";
    display: table;
}

.pika-single:after {
    clear: both;
}

.pika-lendar {
    float: left;
    width: 280px;
    margin: 8px;
}

.pika-title {
    position: relative;
    text-align: center;
}

.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    opacity: 0;
}

.pika-label {
    display: inline-block;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 1;
    font-weight: bold;
    color: #272727;
    background-color: #fff;
}

.pika-prev,
.pika-next {
    display: block;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    text-indent: 20px;
    white-space: nowrap;
    overflow: hidden;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    opacity: 0.5;
}

.pika-prev:hover,
.pika-next:hover {
    opacity: 1;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
    cursor: default;
    opacity: 0.2;
}

.pika-prev,
.is-rtl .pika-next {
    float: left;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
}

.pika-next,
.is-rtl .pika-prev {
    float: right;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
}

.pika-select {
    display: inline-block;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th,
.pika-table td {
    width: 14.2857142857%;
    padding: 0;
}

.pika-table th {
    color: #838383;
    font-size: 12px;
    line-height: 25px;
    font-weight: bold;
    text-align: center;
}

.pika-table abbr {
    border-bottom: none;
    cursor: help;
}

.pika-button {
    cursor: pointer;
    display: block;
    box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 10px 8px;
    color: #838383;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    background: #fff;
}

.is-today .pika-button {
    color: #272727;
    font-weight: bold;
}

.is-selected .pika-button {
    color: #fff;
    font-weight: bold;
    background: #25d287;
    box-shadow: none;
    border-radius: 4px;
}

.is-disabled .pika-button,
.is-outside-current-month .pika-button {
    color: #999;
    opacity: 0.3;
}

.is-disabled .pika-button {
    pointer-events: none;
    cursor: default;
}

.pika-button:hover {
    color: #fff;
    background: #25d287;
    box-shadow: none;
    border-radius: 4px;
}

.pika-button .is-selection-disabled {
    pointer-events: none;
    cursor: default;
}

.pika-week {
    font-size: 12px;
    color: #838383;
}

.is-inrange .pika-button {
    color: #666;
    background: #d5e9f7;
}

.is-startrange .pika-button {
    color: #fff;
    background: #6cb31d;
    box-shadow: none;
    border-radius: 4px;
}

.is-endrange .pika-button {
    color: #fff;
    background: #25d287;
    box-shadow: none;
    border-radius: 4px;
}

.FactCard-bg {
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
    width: 100%;
}

.FactCard-bg::before,
.FactCard-bg::after {
    content: "";
    display: block;
    background-color: #fff;
    flex: 1 auto;
}

#norlysvideo {
    position: relative;
    z-index: 2;
    margin-top: -49px;
}

.Header-backdrop.is-active ~ #norlysvideo {
    z-index: 1;
}

.HomepageHero {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-bottom: 56.25%;
}

.HomepageHero video {
    bottom: 0;
    left: 0;
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
}

@media (max-width: 1271px) {
    .HomepageHero {
        left: -24px;
        width: 100vw;
    }
}

@media (min-width: 960px) {
    .HomepageHero {
        padding-bottom: 43.75%;
    }
}

.HomepageHero-content {
    height: 100%;
    position: relative;
}

.HomepageHero-cta {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.HomepageHero-cta .Button {
    white-space: nowrap;
    overflow: hidden;
}

@media (max-width: 959px) {
    .HomepageHero-cta .Button {
        transform: translateY(35%);
    }
}

.HomepageHero-social {
    color: #fff;
    display: flex;
    position: absolute;
    left: 0;
    top: 50%;
    height: 100%;
    width: 100px;
    transform: translateY(-50%);
}

@media (min-width: 960px) {
    .HomepageHero-social {
        display: block;
    }
}

.HomepageHero-socialInner {
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
    display: flex;
    transform: rotate(-90deg) translateY(-100%);
    transform-origin: 100% 0%;
    position: absolute;
    left: 0%;
    top: 0%;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 100px;
    /*equal to parent width*/
    line-height: 100px;
    /*center text*/
}

.HomepageHero-socialInner div {
    display: flex;
    align-items: center;
    font-family: "NORLYSText";
    font-weight: 500;
    font-size: 10px;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-left: 24px;
    white-space: nowrap;
}

.HomepageHero-socialInner a {
    margin-left: 24px;
    transform: rotate(90deg);
}

.HomepageHero-socialInner svg {
    margin-right: 0;
}

@media (min-width: 1320px) {
    .HomepageHero-socialInner div {
        margin-left: 0;
    }

    .HomepageHero-socialInner div::before {
        background-color: #fff;
        content: "";
        display: block;
        width: 60px;
        height: 2px;
        margin: 0 24px;
    }
}

.Hero .Copy + .Button {
    margin-top: 24px;
}

@media screen and (min-width: 320px) {
    .Hero .Copy + .Button {
        margin-top: calc(2.4vw + 16.32px);
    }
}

@media screen and (min-width: 1320px) {
    .Hero .Copy + .Button {
        margin-top: 48px;
    }
}

.IllustrationLoop {
    display: none;
}

.IllustrationLoop,
.IllustrationLoop-fallback {
    max-height: 300px;
    position: relative;
}

@media (min-width: 580px) {
    .IllustrationLoop,
    .IllustrationLoop-fallback {
        max-height: 400px;
    }
}

@media (min-width: 960px) {
    .IllustrationLoop,
    .IllustrationLoop-fallback {
        max-height: 500px;
    }
}

@media (min-width: 1320px) {
    .IllustrationLoop,
    .IllustrationLoop-fallback {
        max-height: 700px;
    }
}

@supports (mix-blend-mode: multiply) {
    .IllustrationLoop {
        display: block;
    }

    .IllustrationLoop-fallback {
        display: none !important;
    }
}

.InfoCard {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
}

.InfoCard img {
    display: flex;
    margin: 0 auto;
}

.InfoCard a:not([class]) {
    text-decoration: underline;
}

.InfoCard > * {
    max-width: 100%;
}

.InfoCard > * + * {
    margin-top: 16px;
}

.InfoCard .Devider + * {
    margin-top: 0;
}

.InfoCard > *:nth-last-child(2) {
    margin-bottom: 32px;
}

.InfoCard > *:nth-last-child(1):not(.Button) {
    margin-top: -16px;
}

.InfoCard .Button {
    margin-top: auto;
}

.InfoCard--alignTop {
    justify-content: flex-start;
}

.Logo {
    position: relative;
    height: 0;
    width: 100%;
    padding: 0;
    padding-bottom: 19.0355329949%;
}

.Logo-svg {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}

.modal__wrapper {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100vh;
    width: 100%;
    background: rgba(0, 0, 0, 0.31);
    z-index: 1000;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal__wrapper[aria-hidden="false"] {
    position: fixed;
    opacity: 1;
    visibility: visible;
    transform: scale(1) translate3d(0, 0, 0);
    pointer-events: auto;
}

.modal__close-button {
    position: absolute;
    top: 0;
    right: 0;
}

[data-modal-content] {
    position: relative;
    background-color: white;
    box-shadow: 0 11px 38px 0 rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    width: 85%;
    max-width: 648px;
}

.OrderCard {
    color: #272727;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 12px 45px 0 rgba(0, 0, 0, 0.23);
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: space-between;
}

.OrderCard .Particles {
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.OrderCard:hover .Particles,
.OrderCard .Particles--active {
    opacity: 1;
}

.OrderCard .Particle,
.OrderCard .Particle-inner,
.OrderCard .Particle-inner::after {
    animation-iteration-count: 1;
}

.OrderCard:hover .Particle,
.OrderCard:hover .Particle-inner,
.OrderCard:hover .Particle-inner::after,
.OrderCard .Particles--active .Particle,
.OrderCard .Particles--active .Particle-inner,
.OrderCard .Particles--active .Particle-inner::after {
    animation-iteration-count: infinite;
}

.OrderCard--cta {
    position: relative;
}

.OrderCard--cta::before {
    background-color: #f5f6f8;
    border-radius: 0 0 100px 0 6px 6px;
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transition: all 0.2s cubic-bezier(0.51, 0.92, 0.24, 1);
    transform: scaleY(0.1);
    transform-origin: center bottom;
}

.OrderCard--cta::before {
    height: 100px;
}

@media screen and (min-width: 320px) {
    .OrderCard--cta::before {
        height: calc(4vw + 87.2px);
    }
}

@media screen and (min-width: 1320px) {
    .OrderCard--cta::before {
        height: 140px;
    }
}

.OrderCard--cta:hover::before {
    background-color: #d3f4e8;
    transform: scaleY(1);
}

.OrderCard-icon {
    position: relative;
    margin-bottom: 16px;
}

.OrderCard-icon img {
    position: relative;
}

.OrderCard-checkmark {
    box-shadow: 0 10px 14px rgba(0, 0, 0, 0.14);
    border-radius: 100%;
    width: 46px;
    height: 46px;
    margin: 0 auto;
}

.OrderCard-flipper__container,
.OrderCard-flipper__container .OrderCard {
    width: 358px;
    height: 500px;
    max-width: 100%;
}

.OrderCard-flipper__container {
    perspective: 800px;
}

.OrderCard-flipper__container.is-flipped .Particles {
    display: none;
}

.OrderCard-flipper__container .OrderCard-flipper {
    transform: rotateY(0deg);
    transition: 0.4s;
    transform-style: preserve-3d;
    transition-timing-function: ease-in-out;
    position: relative;
}

.OrderCard-flipper__container.is-flipped .OrderCard-flipper {
    transform: rotateY(180deg);
}

.OrderCard-flipper__container .OrderCard {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    transform-style: preserve-3d;
}

.OrderCard-flipper__container .OrderCard-actionableContent .Button,
.OrderCard-flipper__container .OrderCard-actionableContent .RadioPill-wrapper {
    transform: translateY(-5px) translateZ(30px);
}

@supports (-moz-appearance: none) {
    /* This is necessary in Firefox when we do translateZ on the elements */
    .OrderCard-flipper__container .OrderCard-actionableContent .Button,
    .OrderCard-flipper__container
        .OrderCard-actionableContent
        .RadioPill-wrapper {
        overflow: inherit;
        transform-style: preserve-3d;
    }
}

.OrderCard-flipper__container.is-flipped .RadioPill-wrapper {
    visibility: hidden;
}

.OrderCard-flipper__container .OrderCard-flipper-front {
    z-index: 2;
    transform: rotateY(0deg);
}

.OrderCard-flipper__container.is-flipped .OrderCard-flipper-front {
    pointer-events: none;
}

.OrderCard-flipper__container .OrderCard-flipper-back {
    transform: rotateY(180deg);
}

.oldie .OrderCard-flipper__container.is-flipped .OrderCard-flipper {
    transform: none;
}

.oldie .OrderCard-flipper__container.is-flipped .OrderCard-flipper-front,
.oldie .OrderCard-flipper__container.is-flipped .OrderCard-flipper-back {
    transform: none !important;
}

.oldie .OrderCard-flipper__container.is-flipped .OrderCard-flipper-front {
    display: none;
}

.oldie .OrderCard-flipper__container.is-flipped .OrderCard-flipper-back {
    display: block;
}

.OrderCard--all-green {
    padding-bottom: 0 !important;
}

.OrderCard--all-green .OrderCard-title {
    font-size: 40px;
}

.OrderCard--all-green .OrderCard-icon {
    text-align: center;
    margin: 16px 0 0;
}

.OrderCard--all-green .OrderCard-icon img {
    display: inline;
    height: 47px;
    width: 29px;
}

.OrderCard--all-green__price {
    margin-top: 8px;
}

.OrderCard-flipper__image {
    position: absolute;
    top: 4px;
    right: 4px;
}

.OrderCard-footer {
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.OrderCard-footer__flip-button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 51px;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

.OrderCard-footer__flip-button:hover {
    text-decoration: underline;
}

.OrderCard-footer__flip-button:after {
    content: "";
    height: 24px;
    width: 24px;
    margin-left: 8px;
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='14' xmlns='http://www.w3.org/2000/svg'%3E%3Cdesc%3E Created with Sketch. %3C/desc%3E%3Cg stroke='%23FFF' stroke-width='1.5' fill='none' fill-rule='evenodd'%3E%3Cpath d='M6 1l6 6-6 6M0 7h11'/%3E%3C/g%3E%3C/svg%3E");
    background-color: #0f3d24;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 100%;
}

.OrderCard-footer__flip-button--reversed {
    flex-direction: row-reverse;
}

.OrderCard-footer__flip-button--reversed:after {
    margin-left: 0;
    margin-right: 8px;
    transform: rotate(180deg);
}

.orderSummary--all-green-product-title-block {
    background-repeat: no-repeat;
    background-position: top right;
    background-image: url(/Assets/Img/groen-stroem-badge.98659ebe.png);
    background-size: contain;
}

.Particles {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
}

.Particles:before {
    animation: flash 8s infinite;
    background-color: rgba(255, 219, 56, 0.25);
    border-radius: 100%;
    content: "";
    position: absolute;
    left: 50%;
    top: 30%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%);
}

.Particle {
    animation: 10s infinite forwards ease;
    position: absolute;
    top: 50%;
    left: 50%;
}

.Particle:nth-child(1) {
    animation-name: yAxis1;
    width: 15px;
    height: 15px;
}

.Particle:nth-child(1),
.Particle:nth-child(1) .Particle-inner,
.Particle:nth-child(1) .Particle-inner::after {
    animation-delay: 1s;
}

.Particle:nth-child(1) .Particle-inner {
    animation-name: xAxis1;
}

.Particle:nth-child(1) .Particle-inner::after {
    border: 7.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 15px 15px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis1 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-240px);
    }
}

@keyframes xAxis1 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(35px);
    }

    50%,
    100% {
        transform: translateX(-32px);
    }
}

.Particle:nth-child(2) {
    animation-name: yAxis2;
    width: 13px;
    height: 13px;
}

.Particle:nth-child(2),
.Particle:nth-child(2) .Particle-inner,
.Particle:nth-child(2) .Particle-inner::after {
    animation-delay: 2s;
}

.Particle:nth-child(2) .Particle-inner {
    animation-name: xAxis2;
}

.Particle:nth-child(2) .Particle-inner::after {
    border: 6.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 13px 13px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis2 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-577px);
    }
}

@keyframes xAxis2 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(-43px);
    }

    50%,
    100% {
        transform: translateX(42px);
    }
}

.Particle:nth-child(3) {
    animation-name: yAxis3;
    width: 12px;
    height: 12px;
}

.Particle:nth-child(3),
.Particle:nth-child(3) .Particle-inner,
.Particle:nth-child(3) .Particle-inner::after {
    animation-delay: 3s;
}

.Particle:nth-child(3) .Particle-inner {
    animation-name: xAxis3;
}

.Particle:nth-child(3) .Particle-inner::after {
    border: 6px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 12px 12px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis3 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-317px);
    }
}

@keyframes xAxis3 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(-34px);
    }

    50%,
    100% {
        transform: translateX(27px);
    }
}

.Particle:nth-child(4) {
    animation-name: yAxis4;
    width: 7px;
    height: 7px;
}

.Particle:nth-child(4),
.Particle:nth-child(4) .Particle-inner,
.Particle:nth-child(4) .Particle-inner::after {
    animation-delay: 4s;
}

.Particle:nth-child(4) .Particle-inner {
    animation-name: xAxis4;
}

.Particle:nth-child(4) .Particle-inner::after {
    border: 3.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 7px 7px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis4 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-325px);
    }
}

@keyframes xAxis4 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(28px);
    }

    50%,
    100% {
        transform: translateX(-46px);
    }
}

.Particle:nth-child(5) {
    animation-name: yAxis5;
    width: 13px;
    height: 13px;
}

.Particle:nth-child(5),
.Particle:nth-child(5) .Particle-inner,
.Particle:nth-child(5) .Particle-inner::after {
    animation-delay: 5s;
}

.Particle:nth-child(5) .Particle-inner {
    animation-name: xAxis5;
}

.Particle:nth-child(5) .Particle-inner::after {
    border: 6.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 13px 13px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis5 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-502px);
    }
}

@keyframes xAxis5 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(-49px);
    }

    50%,
    100% {
        transform: translateX(44px);
    }
}

.Particle:nth-child(6) {
    animation-name: yAxis6;
    width: 14px;
    height: 14px;
}

.Particle:nth-child(6),
.Particle:nth-child(6) .Particle-inner,
.Particle:nth-child(6) .Particle-inner::after {
    animation-delay: 6s;
}

.Particle:nth-child(6) .Particle-inner {
    animation-name: xAxis6;
}

.Particle:nth-child(6) .Particle-inner::after {
    border: 7px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 14px 14px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis6 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-331px);
    }
}

@keyframes xAxis6 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(27px);
    }

    50%,
    100% {
        transform: translateX(-36px);
    }
}

.Particle:nth-child(7) {
    animation-name: yAxis7;
    width: 13px;
    height: 13px;
}

.Particle:nth-child(7),
.Particle:nth-child(7) .Particle-inner,
.Particle:nth-child(7) .Particle-inner::after {
    animation-delay: 7s;
}

.Particle:nth-child(7) .Particle-inner {
    animation-name: xAxis7;
}

.Particle:nth-child(7) .Particle-inner::after {
    border: 6.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 13px 13px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis7 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-529px);
    }
}

@keyframes xAxis7 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(-35px);
    }

    50%,
    100% {
        transform: translateX(35px);
    }
}

.Particle:nth-child(8) {
    animation-name: yAxis8;
    width: 6px;
    height: 6px;
}

.Particle:nth-child(8),
.Particle:nth-child(8) .Particle-inner,
.Particle:nth-child(8) .Particle-inner::after {
    animation-delay: 8s;
}

.Particle:nth-child(8) .Particle-inner {
    animation-name: xAxis8;
}

.Particle:nth-child(8) .Particle-inner::after {
    border: 3px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 6px 6px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis8 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-300px);
    }
}

@keyframes xAxis8 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(46px);
    }

    50%,
    100% {
        transform: translateX(-43px);
    }
}

.Particle:nth-child(9) {
    animation-name: yAxis9;
    width: 15px;
    height: 15px;
}

.Particle:nth-child(9),
.Particle:nth-child(9) .Particle-inner,
.Particle:nth-child(9) .Particle-inner::after {
    animation-delay: 9s;
}

.Particle:nth-child(9) .Particle-inner {
    animation-name: xAxis9;
}

.Particle:nth-child(9) .Particle-inner::after {
    border: 7.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 15px 15px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis9 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-495px);
    }
}

@keyframes xAxis9 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(29px);
    }

    50%,
    100% {
        transform: translateX(-45px);
    }
}

.Particle:nth-child(10) {
    animation-name: yAxis10;
    width: 11px;
    height: 11px;
}

.Particle:nth-child(10),
.Particle:nth-child(10) .Particle-inner,
.Particle:nth-child(10) .Particle-inner::after {
    animation-delay: 10s;
}

.Particle:nth-child(10) .Particle-inner {
    animation-name: xAxis10;
}

.Particle:nth-child(10) .Particle-inner::after {
    border: 5.5px solid rgba(255, 219, 56, 0.25);
    box-shadow: 0 0 11px 11px rgba(255, 219, 56, 0.25);
}

@keyframes yAxis10 {
    100% {
        animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
        transform: translateX(-50%) translateY(-420px);
    }
}

@keyframes xAxis10 {
    0% {
        transform: translateX(-50%);
    }

    15%,
    75% {
        transform: translateX(-45px);
    }

    50%,
    100% {
        transform: translateX(40px);
    }
}

.Particle-inner {
    animation: 10s infinite both ease;
    position: relative;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.Particle-inner::after {
    animation: appear 10s infinite forwards cubic-bezier(0.3, 0.27, 0.07, 1.64);
    background: #fff1b4;
    border-radius: 100%;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    transform: scale(0);
    top: 0;
    left: 0;
}

@keyframes appear {
    0%,
    90%,
    100% {
        opacity: 0;
        transform: scale(0);
    }

    20% {
        animation-timing-function: cubic-bezier(0.3, 0.27, 0.07, 1.64);
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes flash {
    0%,
    50%,
    100% {
        box-shadow: 0 0 20px 20px rgba(255, 219, 56, 0.25);
    }

    30%,
    80% {
        box-shadow: 0 0 30px 30px rgba(255, 219, 56, 0.35);
    }
}

@media (min-width: 580px) {
    .PriceGuide-middle,
    .PriceGuide-middle > div {
        height: 100%;
    }
}

@media (min-width: 580px) {
    .PriceGuide-right {
        height: calc(100% - 89px);
    }

    .PriceGuide-right > div {
        height: 100%;
    }

    .PriceGuide-right::before {
        content: "";
        display: block;
        background-color: #fff;
        width: 100%;
        height: 89px;
    }
}

.PriceGuide-section {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    min-height: 160px;
    margin-top: 24px;
    padding-top: 24px;
}

@media (min-width: 580px) {
    .PriceGuide-section {
        margin-top: 40px;
        padding-top: 40px;
        min-height: 180px;
    }
}

.PriceGuide-section::after {
    background-image: linear-gradient(
        90deg,
        currentColor,
        currentColor 20%,
        transparent 21%,
        transparent 100%
    );
    background-size: 5px 1px;
    content: "";
    height: 1px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.PriceCard {
    min-width: 250px;
    max-width: 350px;
}

.PriceCard-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.PriceCard-savings {
    border-radius: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    line-height: 1;
    width: 74px;
    height: 74px;
    margin-top: auto;
}

.PriceCard-note {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.ProductComparison {
    -webkit-filter: drop-shadow(0 16px 34px rgba(0, 0, 0, 0.21));
    filter: drop-shadow(0 16px 34px rgba(0, 0, 0, 0.21));
    table-layout: fixed;
}

.ProductComparison thead th {
    background-color: #fff;
    padding: 16px 8px;
}

@media (min-width: 960px) {
    .ProductComparison tbody th:empty::before {
        content: "";
        display: block;
        height: 23px;
    }

    .ProductComparison tbody tr:first-child th,
    .ProductComparison tbody tr:first-child td {
        padding-top: 40px;
    }

    .ProductComparison tbody tr:last-child th,
    .ProductComparison tbody tr:last-child td {
        padding-bottom: 40px;
    }

    .ProductComparison tbody tr:not(:last-child) th,
    .ProductComparison tbody tr:not(:last-child) td {
        position: relative;
    }

    .ProductComparison tbody tr:not(:last-child) th::after,
    .ProductComparison tbody tr:not(:last-child) td::after {
        background-image: linear-gradient(
            90deg,
            currentColor,
            currentColor 20%,
            transparent 21%,
            transparent 100%
        );
        background-size: 5px 1px;
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        position: absolute;
        left: 0;
        bottom: 0;
    }
}

.ProductComparison tbody th,
.ProductComparison tbody td {
    padding: 16px 32px;
}

.ProductComparison tbody th {
    background-color: #272727;
    color: #fff;
    font-weight: 700;
    text-align: right;
}

.ProductComparison tbody td {
    background-color: #fff;
    text-align: center;
    vertical-align: center;
}

.ProductComparison tfoot td {
    padding: 24px 8px;
}

@media (max-width: 959px) {
    .ProductComparison thead {
        border: 0;
        clip: rect(1px, 1px, 1px, 1px);
        height: 1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .ProductComparison tbody,
    .ProductComparison tr,
    .ProductComparison th,
    .ProductComparison td {
        display: block;
        padding: 0;
        text-align: left;
        white-space: normal;
    }

    .ProductComparison tbody th {
        text-align: left;
    }

    .ProductComparison tbody td {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .ProductComparison tbody th:empty,
    .ProductComparison tbody td:empty {
        display: none;
    }

    .ProductComparison td[data-title]:before {
        content: attr(data-title);
        float: left;
        color: rgba(94, 93, 82, 0.75);
    }
}

/* Radio button
--------------------------------------------------------------------------------*/
.RadioButton {
    display: flex;
    position: relative;
}

.RadioButton-input {
    position: absolute;
    opacity: 0;
}

.RadioButton-input:checked + .RadioButton-label::before {
    border-color: #25d287;
}

.RadioButton-input:checked + .RadioButton-label::after {
    background-color: #25d287;
}

.RadioButton-input:disabled,
.RadioButton-input:disabled + .RadioButton-label {
    cursor: not-allowed;
    pointer-events: none;
}

.RadioButton-input:disabled + .RadioButton-label,
.RadioButton-input:disabled + .RadioButton-label::before,
.RadioButton-input:disabled + .RadioButton-label::after {
    opacity: 0.5;
}

.RadioButton-label {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    position: relative;
}

.RadioButton-label::before {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 100%;
    content: "";
    display: block;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-right: 16px;
    transition: all 0.3s ease-out;
}

.RadioButton-label::after {
    background-color: #fff;
    border-radius: 100%;
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 50%;
    left: 16px;
    transform: translate(-50%, -50%);
}

/* Radio block
--------------------------------------------------------------------------------*/
.RadioBlock-input {
    position: absolute;
    opacity: 0;
}

.RadioBlock-input:checked + .RadioBlock-label {
    background-color: #25d287;
    border-color: #25d287;
    color: #fff;
}

.RadioBlock-input:checked + .RadioBlock-label::before {
    opacity: 1;
}

.RadioBlock-input:not(:checked) + .RadioBlock-label svg {
    color: #d6d6d6;
}

.RadioBlock-input:disabled,
.RadioBlock-input:disabled + .RadioBlock-label {
    cursor: not-allowed;
    pointer-events: none;
}

.RadioBlock-input:disabled + .RadioBlock-label {
    opacity: 0.5;
}

.RadioBlock-label {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    color: #838383;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 96px;
    padding: 8px 24px;
    position: relative;
    text-align: center;
}

.RadioBlock-label::before {
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cdesc%3E Created with Sketch. %3C/desc%3E%3Cpath fill='%2326D187' fill-rule='nonzero' d='M3.846 8L0 3.761l1.076-1.144 2.75 2.989L8.881 0 10 1.122z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 100%;
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 8px;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.RadioPill-wrapper {
    background-color: #f5f6f8;
    border-radius: 16px;
    display: inline-flex;
    padding: 3px;
}

.RadioPill-wrapper--small {
    border-radius: 16px;
}

.RadioPill {
    position: relative;
}

.RadioPill-input {
    position: absolute;
    opacity: 0;
}

.RadioPill-input:checked + .RadioPill-label {
    background-color: #fff;
    box-shadow: 0 16px 34px 0 rgba(0, 0, 0, 0.21);
    font-weight: 700;
}

.RadioPill-input:disabled,
.RadioPill-input:disabled + .RadioPill-label {
    cursor: not-allowed;
    pointer-events: none;
}

.RadioPill-input:disabled + .RadioPill-label,
.RadioPill-input:disabled + .RadioPill-label::before,
.RadioPill-input:disabled + .RadioPill-label::after {
    opacity: 0.5;
}

.RadioPill--small .RadioPill-input:checked + .RadioPill-label {
    color: #fff;
    background-color: #6b55ec;
    font-weight: inherit;
    box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.22);
}

.RadioPill-label {
    border-radius: 24px;
    height: 44px;
    padding: 0 48px;
    display: inline-flex;
    align-items: center;
    line-height: 1;
    position: relative;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.RadioPill--small .RadioPill-label {
    font-size: 16px;
    height: 24px;
    padding: 0 24px;
}

.SearchField {
    position: relative;
}

.SearchField-input {
    background-color: rgba(39, 39, 39, 0.05);
    border: 2px solid transparent;
    border-radius: 8px;
    color: #272727;
    padding: 0 64px 0 24px;
    width: 100%;
}

.SearchField-input {
    height: 48px;
}

@media (max-width: 959px) {
    .SearchField-input {
        max-height: 44px;
        padding: 0 56px 0 16px;
    }
}

.SearchField-input:hover {
    border-color: #838383;
}

.SearchField-input:focus {
    border-color: #25d287;
    outline: none;
}

.SearchField-submit {
    color: #838383;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
}

.SearchField-submit:hover,
.SearchField-submit:focus {
    color: #272727;
}

@media (max-width: 959px) {
    .SearchField-submit {
        right: 16px;
    }
}

.Select {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease-out;
    touch-action: manipulation;
    height: 56px;
}

.Select-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cdesc%3E Created with Sketch. %3C/desc%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath stroke='%23838383' stroke-width='1.25' d='M1 1l6 6 6-6'/%3E%3C/g%3E%3C/svg%3E");
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: calc(100% - 16px) 50%;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    height: 56px;
    line-height: normal;
    padding: 0 16px;
    width: 100%;
    transition: all 0.3s ease-out;
}

.Select-input::-ms-expand {
    display: none;
}

.Select-input:focus {
    border-color: #25d287;
    outline: none;
}

.Select-input:disabled {
    opacity: 0.5;
    pointer-events: none;
}

.Select-input.has-error {
    border-color: #ffdee5;
}

.Shortcut {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.1s ease-in, box-shadow 0.25s ease-in;
}

.Shortcut:hover {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.Shortcut:active {
    box-shadow: 0 10px 38px 0 rgba(0, 0, 0, 0.05);
    transform: translateY(2px);
}

.Shortcut .Shortcut-icon {
    padding-top: 16px;
    margin-top: auto;
}

/* Recommended styles for Splitting */
.splitting .word,
.splitting .char {
    display: inline-block;
}

/* Psuedo-element chars */
.splitting .char {
    position: relative;
}

/**
* Populate the psuedo elements with the character to allow for expanded effects
* Set to `display: none` by default; just add `display: block` when you want
* to use the psuedo elements
*/
.splitting .char::before,
.splitting .char::after {
    content: attr(data-char);
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    transition: inherit;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Expanded CSS Variables */
.splitting {
    /* The center word index */
    --word-center: calc((var(--word-total) - 1) / 2);
    /* The center character index */
    --char-center: calc((var(--char-total) - 1) / 2);
    /* The center character index */
    --line-center: calc((var(--line-total) - 1) / 2);
}

.splitting .word {
    /* Pecent (0-1) of the word's position */
    --word-percent: calc(var(--word-index) / var(--word-total));
    /* Pecent (0-1) of the line's position */
    --line-percent: calc(var(--line-index) / var(--line-total));
}

.splitting .char {
    /* Percent (0-1) of the char's position */
    --char-percent: calc(var(--char-index) / var(--char-total));
    /* Offset from center, positive & negative */
    --char-offset: calc(var(--char-index) - var(--char-center));
    /* Absolute distance from center, only positive */
    --distance: calc(
        (var(--char-offset) * var(--char-offset)) / var(--char-center)
    );
    /* Distance from center where -1 is the far left, 0 is center, 1 is far right */
    --distance-sine: calc(var(--char-offset) / var(--char-center));
    /* Distance from center where 1 is far left/far right, 0 is center */
    --distance-percent: calc((var(--distance) / var(--char-center)));
}

.splitting.cells img {
    width: 100%;
    display: block;
}

@supports (display: grid) {
    .splitting.cells {
        position: relative;
        overflow: hidden;
        background-size: cover;
        visibility: hidden;
    }

    .splitting .cell-grid {
        background: inherit;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: grid;
        grid-template: repeat(var(--row-total), 1fr) / repeat(
                var(--col-total),
                1fr
            );
    }

    .splitting .cell {
        background: inherit;
        position: relative;
        overflow: hidden;
    }

    .splitting .cell-inner {
        background: inherit;
        position: absolute;
        visibility: visible;
        /* Size to fit the whole container size */
        width: calc(100% * var(--col-total));
        height: calc(100% * var(--row-total));
        /* Position properly */
        left: calc(-100% * var(--col-index));
        top: calc(-100% * var(--row-index));
    }
    /* Helper variables for advanced effects */
    .splitting .cell {
        --center-x: calc((var(--col-total) - 1) / 2);
        --center-y: calc((var(--row-total) - 1) / 2);
        /* Offset from center, positive & negative */
        --offset-x: calc(var(--col-index) - var(--center-x));
        --offset-y: calc(var(--row-index) - var(--center-y));
        /* Absolute distance from center, only positive */
        --distance-x: calc(
            (var(--offset-x) * var(--offset-x)) / var(--center-x)
        );
        /* Absolute distance from center, only positive */
        --distance-y: calc(
            (var(--offset-y) * var(--offset-y)) / var(--center-y)
        );
    }
}

.splitting .char {
    opacity: 0;
    transform: translateY(0.25em);
    transition: transform 0.3s 0s cubic-bezier(0.3, 0, 0.3, 1),
        opacity 0.3s 0s linear;
}

.active .splitting .char,
.splitting[data-scroll="in"] .char {
    opacity: 1;
    transform: translateY(0);
    transition-delay: calc(1s + 15ms * var(--char-index));
}

.SummaryBar {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    position: relative;
    padding: 24px;
}

@media (max-width: 959px) {
    .SummaryBar {
        flex-direction: column;
    }

    .SummaryBar::before {
        background-image: linear-gradient(
            90deg,
            currentColor,
            currentColor 20%,
            transparent 21%,
            transparent 100%
        );
        background-size: 5px 1px;
        content: "";
        display: block;
        position: absolute;
        height: 1px;
        left: 0;
        top: 0;
        width: 100%;
    }
}

@media (min-width: 960px) {
    .SummaryBar {
        box-shadow: 0 2px 44px 0 rgba(0, 0, 0, 0.5);
    }

    .SummaryBar.is-fixed {
        width: 100vw;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 1;
    }
}

.SummaryBar-item {
    position: relative;
}

@media (max-width: 959px) {
    .SummaryBar-item + .SummaryBar-item {
        margin-top: 16px;
    }
}

@media (min-width: 960px) {
    .SummaryBar-item {
        padding: 0 32px;
    }

    .SummaryBar-item + .SummaryBar-item::before {
        background-image: linear-gradient(
            currentColor,
            currentColor 20%,
            transparent 21%,
            transparent 100%
        );
        background-size: 1px 5px;
        content: "";
        display: block;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        width: 1px;
    }
}

.Spot .Grid .Grid-cell {
    display: flex;
}

.Spot-mediaWrapper {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-height: 140px;
    position: relative;
}

.Spot-media {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding-bottom: 56.25%;
}

.TabList {
    display: flex;
    padding: 0;
}

.Tab,
.TabList a {
    display: flex;
}

.Tab a {
    background-color: #fff;
    border: 2px solid;
    border-width: 2px 0;
    align-items: center;
    min-height: 44px;
    text-decoration: none;
    padding: 0 48px;
}

.Tab:first-child a {
    border-left-width: 2px;
    border-top-left-radius: 24px;
    border-bottom-left-radius: 24px;
}

.Tab:last-child a {
    border-right-width: 2px;
    border-top-right-radius: 24px;
    border-bottom-right-radius: 24px;
}

.Tab [aria-selected] {
    background-color: #0f3d24;
    border-color: #0f3d24;
    color: #fff;
    position: relative;
}

/*
*:focus {
outline: none;
box-shadow: inset 0 0 0 4px lightBlue;
}
*/
@media (max-width: 960px) {
    .Tap,
    .Tap a {
        display: flex;
    }

    .Tap a {
        border: 2px solid #222 !important;
    }

    .Tap + .Tap a {
        border-top: 0 !important;
    }
}

.Table {
    width: 100%;
}

.Table tbody td {
    position: relative;
}

.Table tfoot {
    color: #838383;
}

.Table tfoot a {
    text-decoration: underline;
    transition: all 0.3s cubic-bezier(0.51, 0.92, 0.24, 1);
}

.Table tfoot a:hover,
.Table tfoot a:focus {
    color: #272727;
}

@media (min-width: 960px) {
    .Table th,
    .Table td {
        padding-top: 24px;
        padding-bottom: 24px;
        text-align: left;
    }

    .Table th:not(:first-child),
    .Table td:not(:first-child) {
        padding-left: 24px;
    }

    .Table th:not(:last-child),
    .Table td:not(:last-child) {
        padding-right: 24px;
    }

    .Table tbody td::before {
        background-image: linear-gradient(
            90deg,
            currentColor,
            currentColor 20%,
            transparent 21%,
            transparent 100%
        );
        background-size: 5px 1px;
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        position: absolute;
        left: 0;
        top: 0;
    }

    .Table tbody tr:last-child td::after {
        background-image: linear-gradient(
            90deg,
            currentColor,
            currentColor 20%,
            transparent 21%,
            transparent 100%
        );
        background-size: 5px 1px;
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        position: absolute;
        left: 0;
        bottom: 0;
    }
}

@media (max-width: 959px) {
    .Table thead {
        left: -9999px;
        position: absolute;
        visibility: hidden;
    }

    .Table tbody tr {
        border-bottom: 0;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: 40px;
    }

    .Table tbody td {
        border: 1px solid #d6d6d6;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 -1px -1px 0;
        position: relative;
        width: 50%;
        padding: 48px 16px 16px 16px;
    }

    .Table td[data-header]::after {
        background-color: #d6d6d6;
        font-family: "NORLYSHeadline";
        font-weight: 700;
        line-height: 1.3333333333;
        content: attr(data-header);
        display: block;
        padding: 4px 16px;
        position: absolute;
        top: 0;
        left: 0;
    }

    .Table td[data-header]::after {
        font-size: 16px;
    }
}

@media screen and (max-width: 959px) and (min-width: 320px) {
    .Table td[data-header]::after {
        font-size: calc(0.2vw + 15.36px);
    }
}

@media screen and (max-width: 959px) and (min-width: 1320px) {
    .Table td[data-header]::after {
        font-size: 18px;
    }
}

@media (max-width: 959px) {
    .Table td[data-title]::before {
        background-color: #0f3d24;
        color: #fff;
        font-weight: 700;
        content: attr(data-title);
        display: block;
        padding: 4px 16px;
        position: absolute;
        top: 0;
        left: 0;
    }
}

@media (max-width: 959px) {
    .Table td[data-label]::before {
        font-weight: 700;
        content: attr(data-label);
        display: block;
    }
}

@media (max-width: 579px) {
    .Table tbody td {
        width: 100%;
    }
}

.Table-promotedHeader {
    padding: 4px 8px;
}

.rte-table {
    position: relative;
}

.rte-table.is-scrollable {
    cursor: grab;
}

.rte-table.is-dragging {
    cursor: grabbing;
}

.rte-table.has-overflown-content:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(
        90deg,
        transparent calc(100% - 10px),
        rgba(153, 153, 153, 0.1) calc(100% - 5px),
        rgba(77, 76, 76, 0.2) 100%
    );
    pointer-events: none;
}

.rte-table .rte-table-inner {
    position: relative;
    width: 100%;
    overflow-x: auto;
}

.rte-table table {
    width: 100%;
    min-width: 100%; /* Ensures table takes up at least 100% of container */
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.rte-table table tr:first-child td,
.rte-table table tr:first-child th {
    font-weight: 700;
    white-space: nowrap;
}

.rte-table table tr:first-child p {
    font-weight: inherit;
}

.rte-table table td,
.rte-table table th {
    border: 0;
    border-collapse: collapse;
    padding: 4px 16px;
    text-align: left;
}

.rte-table table tr:nth-child(odd) {
    background-color: #e5e6e8;
}

.Textarea {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease-out;
    touch-action: manipulation;
    min-height: 175px;
}

.Textarea ::-webkit-input-placeholder {
    opacity: 0;
    -webkit-transition: inherit;
    transition: inherit;
}

.Textarea :-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.Textarea ::-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.Textarea ::placeholder {
    opacity: 0;
    transition: inherit;
}

.Textarea.is-disabled {
    opacity: 0.5;
}

.Textarea.has-error {
    border-color: #ffdee5;
}

.Textarea:not(.has-error):focus-within {
    border-color: #25d287;
}

.Textarea-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    line-height: normal;
    padding: 0 16px;
    flex-grow: 1;
    width: 100%;
    /**
* When the element is focused, remove the label transform.
* Also, do this when the placeholder is _not_ shown, i.e. when
* there's something in the input at all.
*/
    padding-top: 16px;
    padding-bottom: 16px;
    resize: none;
}

.Textarea-input::-webkit-input-placeholder {
    color: #838383;
}

.Textarea-input:-ms-input-placeholder {
    color: #838383;
}

.Textarea-input::-ms-input-placeholder {
    color: #838383;
}

.Textarea-input::placeholder {
    color: #838383;
}

.Textarea-input:-webkit-autofill,
.Textarea-input:-webkit-autofill:hover,
.Textarea-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 0 transparent;
    -webkit-transition: background-color 3600s ease-in-out 0s;
    transition: background-color 3600s ease-in-out 0s;
}

.Textarea-input:focus {
    outline: none;
}

.Textarea-input:-ms-input-placeholder + .Form-label {
    cursor: text;
    max-width: 60%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform-origin: left bottom;
    transform: translateY(1.55rem) scale(1.666);
}

.Textarea-input:placeholder-shown + .Form-label,
.Textarea-input:empty + .Form-label {
    cursor: text;
    max-width: 60%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform-origin: left bottom;
    transform: translateY(1.55rem) scale(1.666);
}

.Textarea-input:not(:-ms-input-placeholder) + .Form-label {
    cursor: pointer;
    transform: translateY(0.375rem) scale(1);
}

.Textarea-input:not(:placeholder-shown) + .Form-label,
.Textarea-input:focus + .Form-label {
    cursor: pointer;
    transform: translateY(0.375rem) scale(1);
}

.Textarea-input:disabled {
    cursor: not-allowed;
    pointer-events: none;
}

.has-label .Textarea-input {
    min-height: 145px;
    padding-top: 25px;
}

.oldie .Textarea {
    background-color: transparent;
    border: none;
    min-height: none;
}

.oldie .Textarea.has-label {
    margin-top: 12px;
}

.oldie .Textarea.is-disabled {
    opacity: 1;
}

.oldie .Textarea.has-error .Textarea-input {
    border-color: #ffdee5;
}

.oldie .Textarea:not(.has-error) .Textarea-input:focus {
    border-color: #25d287;
}

.oldie .Textarea-input {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease-out;
    touch-action: manipulation;
    padding-top: 16px;
}

.oldie .Textarea-input ::-webkit-input-placeholder {
    opacity: 0;
    -webkit-transition: inherit;
    transition: inherit;
}

.oldie .Textarea-input :-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.oldie .Textarea-input ::-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.oldie .Textarea-input ::placeholder {
    opacity: 0;
    transition: inherit;
}

.oldie .Textarea-input:disabled {
    opacity: 0.5;
}

.Form-item select {
    color: #000;
    padding: 16px 20px 0px 16px;
}

.TextField,
.Form-item select {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease-out;
    touch-action: manipulation;
    height: 56px;
}

.TextField ::-webkit-input-placeholder {
    opacity: 0;
    -webkit-transition: inherit;
    transition: inherit;
}

.TextField :-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.TextField ::-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.TextField ::placeholder {
    opacity: 0;
    transition: inherit;
}

.TextField.is-disabled {
    opacity: 0.5;
}

.TextField.has-error {
    border-color: #ffdee5;
}

.TextField:not(.has-error):focus-within {
    border-color: #25d287;
}

.TextField-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    line-height: normal;
    padding: 0 16px;
    flex-grow: 1;
    width: 100%;
    /**
* When the element is focused, remove the label transform.
* Also, do this when the placeholder is _not_ shown, i.e. when
* there's something in the input at all.
*/
}

.TextField-input::-webkit-input-placeholder {
    color: #838383;
}

.TextField-input:-ms-input-placeholder {
    color: #838383;
}

.TextField-input::-ms-input-placeholder {
    color: #838383;
}

.TextField-input::placeholder {
    color: #838383;
}

.TextField-input:-webkit-autofill,
.TextField-input:-webkit-autofill:hover,
.TextField-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 0 transparent;
    -webkit-transition: background-color 3600s ease-in-out 0s;
    transition: background-color 3600s ease-in-out 0s;
}

.TextField-input:focus {
    outline: none;
}

.TextField-input:-ms-input-placeholder + .Form-label {
    cursor: text;
    max-width: 60%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform-origin: left bottom;
    transform: translateY(1.55rem) scale(1.666);
}

.TextField-input:placeholder-shown + .Form-label,
.TextField-input:empty + .Form-label {
    cursor: text;
    max-width: 60%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform-origin: left bottom;
    transform: translateY(1.55rem) scale(1.666);
}

.TextField-input:not(:-ms-input-placeholder) + .Form-label {
    cursor: pointer;
    transform: translateY(0.375rem) scale(1);
}

.TextField-input:not(:placeholder-shown) + .Form-label,
.TextField-input:focus + .Form-label {
    cursor: pointer;
    transform: translateY(0.375rem) scale(1);
}

.TextField-input:disabled {
    cursor: not-allowed;
    pointer-events: none;
}

.has-label .TextField-input {
    height: calc(56px - 15px);
    transform: translateY(8px);
}

.oldie .TextField {
    background-color: transparent;
    border: none;
    height: auto;
}

.oldie .TextField.has-label {
    margin-top: 12px;
}

.oldie .TextField.is-disabled {
    opacity: 1;
}

.oldie .TextField.has-error .TextField-input {
    border-color: #ffdee5;
}

.oldie .TextField:not(.has-error) .TextField-input:focus {
    border-color: #25d287;
}

.oldie .TextField-input {
    background-color: #fff;
    border: 2px solid #d6d6d6;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease-out;
    touch-action: manipulation;
    height: 56px;
}

.oldie .TextField-input ::-webkit-input-placeholder {
    opacity: 0;
    -webkit-transition: inherit;
    transition: inherit;
}

.oldie .TextField-input :-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.oldie .TextField-input ::-ms-input-placeholder {
    opacity: 0;
    -ms-transition: inherit;
    transition: inherit;
}

.oldie .TextField-input ::placeholder {
    opacity: 0;
    transition: inherit;
}

.oldie .TextField-input:disabled {
    opacity: 0.5;
}

.ToggleButton {
    position: relative;
}

.ToggleButton-input {
    position: absolute;
    opacity: 0;
}

.ToggleButton-input:focus + .ToggleButton-label::before {
    border-color: #25d287;
}

.ToggleButton-input:focus:checked + .ToggleButton-label::before {
    border-color: #d6d6d6;
}

.ToggleButton-input:checked + .ToggleButton-label {
    color: #25d287;
}

.ToggleButton-input:checked + .ToggleButton-label::before {
    background-color: #25d287;
    border-color: #25d287;
}

.ToggleButton-input:checked + .ToggleButton-label::after {
    transform: translateX(24px);
}

.ToggleButton-input:disabled,
.ToggleButton-input:disabled + .ToggleButton-label {
    cursor: not-allowed;
    pointer-events: none;
}

.ToggleButton-input:disabled + .ToggleButton-label,
.ToggleButton-input:disabled + .ToggleButton-label::before,
.ToggleButton-input:disabled + .ToggleButton-label::after {
    opacity: 0.5;
}

.ToggleButton-label {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    transition: all 0.3s ease-out;
}

.ToggleButton-label::before {
    background-color: #d6d6d6;
    border: 2px solid #d6d6d6;
    border-radius: 15px;
    content: "";
    display: block;
    width: 54px;
    height: 30px;
    margin-right: 16px;
    transition: all 0.3s ease-out;
}

.ToggleButton-label::after {
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.35);
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 3px;
    top: 3px;
    transition: transform 0.2s ease-out;
}

.IconList {
    display: inline-flex;
    flex-direction: column;
    text-align: left;
}

.IconList li {
    display: flex;
    align-items: baseline;
}

.IconList svg {
    flex-shrink: 0;
    margin-right: 8px;
    margin-top: 3px;
}

[class*="u-textLight"] .IconList svg path {
    fill: black;
}

[class*="u-textLight"] .IconList svg circle {
    fill: white;
}

[class*="u-textDark"] .IconList svg path {
    fill: white;
}

[class*="u-textDark"] .IconList svg circle {
    fill: black;
}

.OrderCard .IconList svg path {
    fill: white;
}

.OrderCard .IconList svg circle {
    fill: #25d287;
}

.Textarea-input + .Form-label,
.TextField-input + .Form-label {
    pointer-events: none;
}