[data-theme] {
	background-color: hsl(0, 0%, 100%);
	background-color: var(--color-bg);
	color: hsl(240, 4%, 20%);
	color: var(--color-contrast-high)
}

:root {
	--space-unit: 1em;
	--space-xxxxs: calc(0.125*var(--space-unit));
	--space-xxxs: calc(0.25*var(--space-unit));
	--space-xxs: calc(0.375*var(--space-unit));
	--space-xs: calc(0.5*var(--space-unit));
	--space-sm: calc(0.75*var(--space-unit));
	--space-md: calc(1.25*var(--space-unit));
	--space-lg: calc(2*var(--space-unit));
	--space-xl: calc(3.25*var(--space-unit));
	--space-xxl: calc(5.25*var(--space-unit));
	--space-xxxl: calc(8.5*var(--space-unit));
	--space-xxxxl: calc(13.75*var(--space-unit));
	--component-padding: var(--space-md)
}

@supports (--css: variables) {
	@media (min-width: 64rem) {
		:root {
			--space-unit: 1.25em
		}
	}
}

.grid {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

.grid>* {
	background-clip: content-box;
	-ms-flex-preferred-size: 100%;
	flex-basis: 100%
}

.grid--gap-xs,
.grid-gap--xs {
	margin: -0.5em 0 0 -0.5em;
	margin: calc(var(--space-xs)*-1) 0 0 calc(var(--space-xs)*-1)
}

.grid--gap-xs>*,
.grid-gap--xs>* {
	padding: 0.5em 0 0 0.5em;
	padding: var(--space-xs) 0 0 var(--space-xs)
}

.grid--gap-sm,
.grid-gap--sm {
	margin: -0.75em 0 0 -0.75em;
	margin: calc(var(--space-sm)*-1) 0 0 calc(var(--space-sm)*-1)
}

.grid--gap-sm>*,
.grid-gap--sm>* {
	padding: 0.75em 0 0 0.75em;
	padding: var(--space-sm) 0 0 var(--space-sm)
}

.grid--gap-md,
.grid-gap--md {
	margin: -1.25em 0 0 -1.25em;
	margin: calc(var(--space-md)*-1) 0 0 calc(var(--space-md)*-1)
}

.grid--gap-md>*,
.grid-gap--md>* {
	padding: 1.25em 0 0 1.25em;
	padding: var(--space-md) 0 0 var(--space-md)
}

.grid--gap-lg,
.grid-gap--lg {
	margin: -2em 0 0 -2em;
	margin: calc(var(--space-lg)*-1) 0 0 calc(var(--space-lg)*-1)
}

.grid--gap-lg>*,
.grid-gap--lg>* {
	padding: 2em 0 0 2em;
	padding: var(--space-lg) 0 0 var(--space-lg)
}

.grid--gap-xl,
.grid-gap--xl {
	margin: -3.25em 0 0 -3.25em;
	margin: calc(var(--space-xl)*-1) 0 0 calc(var(--space-xl)*-1)
}

.grid--gap-xl>*,
.grid-gap--xl>* {
	padding: 3.25em 0 0 3.25em;
	padding: var(--space-xl) 0 0 var(--space-xl)
}

.col {
	-ms-flex-positive: 1;
	flex-grow: 1;
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	max-width: 100%
}

.col--1 {
	-ms-flex-preferred-size: 8.33%;
	flex-basis: 8.33%;
	max-width: 8.33%
}

.col--2 {
	-ms-flex-preferred-size: 16.66%;
	flex-basis: 16.66%;
	max-width: 16.66%
}

.col--3 {
	-ms-flex-preferred-size: 25%;
	flex-basis: 25%;
	max-width: 25%
}

.col--4 {
	-ms-flex-preferred-size: 33.33%;
	flex-basis: 33.33%;
	max-width: 33.33%
}

.col--5 {
	-ms-flex-preferred-size: 41.66%;
	flex-basis: 41.66%;
	max-width: 41.66%
}

.col--6 {
	-ms-flex-preferred-size: 50%;
	flex-basis: 50%;
	max-width: 50%
}

.col--7 {
	-ms-flex-preferred-size: 58.33%;
	flex-basis: 58.33%;
	max-width: 58.33%
}

.col--8 {
	-ms-flex-preferred-size: 66.66%;
	flex-basis: 66.66%;
	max-width: 66.66%
}

.col--9 {
	-ms-flex-preferred-size: 75%;
	flex-basis: 75%;
	max-width: 75%
}

.col--10 {
	-ms-flex-preferred-size: 83.33%;
	flex-basis: 83.33%;
	max-width: 83.33%
}

.col--11 {
	-ms-flex-preferred-size: 91.66%;
	flex-basis: 91.66%;
	max-width: 91.66%
}

.col--12 {
	-ms-flex-preferred-size: 100%;
	flex-basis: 100%;
	max-width: 100%
}

@media (min-width: 30rem) {
	.col--xs {
		-ms-flex-positive: 1;
		flex-grow: 1;
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		max-width: 100%
	}
	.col--xs-1 {
		-ms-flex-preferred-size: 8.33%;
		flex-basis: 8.33%;
		max-width: 8.33%
	}
	.col--xs-2 {
		-ms-flex-preferred-size: 16.66%;
		flex-basis: 16.66%;
		max-width: 16.66%
	}
	.col--xs-3 {
		-ms-flex-preferred-size: 25%;
		flex-basis: 25%;
		max-width: 25%
	}
	.col--xs-4 {
		-ms-flex-preferred-size: 33.33%;
		flex-basis: 33.33%;
		max-width: 33.33%
	}
	.col--xs-5 {
		-ms-flex-preferred-size: 41.66%;
		flex-basis: 41.66%;
		max-width: 41.66%
	}
	.col--xs-6 {
		-ms-flex-preferred-size: 50%;
		flex-basis: 50%;
		max-width: 50%
	}
	.col--xs-7 {
		-ms-flex-preferred-size: 58.33%;
		flex-basis: 58.33%;
		max-width: 58.33%
	}
	.col--xs-8 {
		-ms-flex-preferred-size: 66.66%;
		flex-basis: 66.66%;
		max-width: 66.66%
	}
	.col--xs-9 {
		-ms-flex-preferred-size: 75%;
		flex-basis: 75%;
		max-width: 75%
	}
	.col--xs-10 {
		-ms-flex-preferred-size: 83.33%;
		flex-basis: 83.33%;
		max-width: 83.33%
	}
	.col--xs-11 {
		-ms-flex-preferred-size: 91.66%;
		flex-basis: 91.66%;
		max-width: 91.66%
	}
	.col--xs-12 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%
	}
}

@media (min-width: 37.5rem) {
	.col--sm {
		-ms-flex-positive: 1;
		flex-grow: 1;
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		max-width: 100%
	}
	.col--sm-1 {
		-ms-flex-preferred-size: 8.33%;
		flex-basis: 8.33%;
		max-width: 8.33%
	}
	.col--sm-2 {
		-ms-flex-preferred-size: 16.66%;
		flex-basis: 16.66%;
		max-width: 16.66%
	}
	.col--sm-3 {
		-ms-flex-preferred-size: 25%;
		flex-basis: 25%;
		max-width: 25%
	}
	.col--sm-4 {
		-ms-flex-preferred-size: 33.33%;
		flex-basis: 33.33%;
		max-width: 33.33%
	}
	.col--sm-5 {
		-ms-flex-preferred-size: 41.66%;
		flex-basis: 41.66%;
		max-width: 41.66%
	}
	.col--sm-6 {
		-ms-flex-preferred-size: 50%;
		flex-basis: 50%;
		max-width: 50%
	}
	.col--sm-7 {
		-ms-flex-preferred-size: 58.33%;
		flex-basis: 58.33%;
		max-width: 58.33%
	}
	.col--sm-8 {
		-ms-flex-preferred-size: 66.66%;
		flex-basis: 66.66%;
		max-width: 66.66%
	}
	.col--sm-9 {
		-ms-flex-preferred-size: 75%;
		flex-basis: 75%;
		max-width: 75%
	}
	.col--sm-10 {
		-ms-flex-preferred-size: 83.33%;
		flex-basis: 83.33%;
		max-width: 83.33%
	}
	.col--sm-11 {
		-ms-flex-preferred-size: 91.66%;
		flex-basis: 91.66%;
		max-width: 91.66%
	}
	.col--sm-12 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%
	}
}

@media (min-width: 64rem) {
	.col--md {
		-ms-flex-positive: 1;
		flex-grow: 1;
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		max-width: 100%
	}
	.col--md-1 {
		-ms-flex-preferred-size: 8.33%;
		flex-basis: 8.33%;
		max-width: 8.33%
	}
	.col--md-2 {
		-ms-flex-preferred-size: 16.66%;
		flex-basis: 16.66%;
		max-width: 16.66%
	}
	.col--md-3 {
		-ms-flex-preferred-size: 25%;
		flex-basis: 25%;
		max-width: 25%
	}
	.col--md-4 {
		-ms-flex-preferred-size: 33.33%;
		flex-basis: 33.33%;
		max-width: 33.33%
	}
	.col--md-5 {
		-ms-flex-preferred-size: 41.66%;
		flex-basis: 41.66%;
		max-width: 41.66%
	}
	.col--md-6 {
		-ms-flex-preferred-size: 50%;
		flex-basis: 50%;
		max-width: 50%
	}
	.col--md-7 {
		-ms-flex-preferred-size: 58.33%;
		flex-basis: 58.33%;
		max-width: 58.33%
	}
	.col--md-8 {
		-ms-flex-preferred-size: 66.66%;
		flex-basis: 66.66%;
		max-width: 66.66%
	}
	.col--md-9 {
		-ms-flex-preferred-size: 75%;
		flex-basis: 75%;
		max-width: 75%
	}
	.col--md-10 {
		-ms-flex-preferred-size: 83.33%;
		flex-basis: 83.33%;
		max-width: 83.33%
	}
	.col--md-11 {
		-ms-flex-preferred-size: 91.66%;
		flex-basis: 91.66%;
		max-width: 91.66%
	}
	.col--md-12 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%
	}
}

@media (min-width: 80rem) {
	.col--lg {
		-ms-flex-positive: 1;
		flex-grow: 1;
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		max-width: 100%
	}
	.col--lg-1 {
		-ms-flex-preferred-size: 8.33%;
		flex-basis: 8.33%;
		max-width: 8.33%
	}
	.col--lg-2 {
		-ms-flex-preferred-size: 16.66%;
		flex-basis: 16.66%;
		max-width: 16.66%
	}
	.col--lg-3 {
		-ms-flex-preferred-size: 25%;
		flex-basis: 25%;
		max-width: 25%
	}
	.col--lg-4 {
		-ms-flex-preferred-size: 33.33%;
		flex-basis: 33.33%;
		max-width: 33.33%
	}
	.col--lg-5 {
		-ms-flex-preferred-size: 41.66%;
		flex-basis: 41.66%;
		max-width: 41.66%
	}
	.col--lg-6 {
		-ms-flex-preferred-size: 50%;
		flex-basis: 50%;
		max-width: 50%
	}
	.col--lg-7 {
		-ms-flex-preferred-size: 58.33%;
		flex-basis: 58.33%;
		max-width: 58.33%
	}
	.col--lg-8 {
		-ms-flex-preferred-size: 66.66%;
		flex-basis: 66.66%;
		max-width: 66.66%
	}
	.col--lg-9 {
		-ms-flex-preferred-size: 75%;
		flex-basis: 75%;
		max-width: 75%
	}
	.col--lg-10 {
		-ms-flex-preferred-size: 83.33%;
		flex-basis: 83.33%;
		max-width: 83.33%
	}
	.col--lg-11 {
		-ms-flex-preferred-size: 91.66%;
		flex-basis: 91.66%;
		max-width: 91.66%
	}
	.col--lg-12 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%
	}
}

@media (min-width: 90rem) {
	.col--xl {
		-ms-flex-positive: 1;
		flex-grow: 1;
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		max-width: 100%
	}
	.col--xl-1 {
		-ms-flex-preferred-size: 8.33%;
		flex-basis: 8.33%;
		max-width: 8.33%
	}
	.col--xl-2 {
		-ms-flex-preferred-size: 16.66%;
		flex-basis: 16.66%;
		max-width: 16.66%
	}
	.col--xl-3 {
		-ms-flex-preferred-size: 25%;
		flex-basis: 25%;
		max-width: 25%
	}
	.col--xl-4 {
		-ms-flex-preferred-size: 33.33%;
		flex-basis: 33.33%;
		max-width: 33.33%
	}
	.col--xl-5 {
		-ms-flex-preferred-size: 41.66%;
		flex-basis: 41.66%;
		max-width: 41.66%
	}
	.col--xl-6 {
		-ms-flex-preferred-size: 50%;
		flex-basis: 50%;
		max-width: 50%
	}
	.col--xl-7 {
		-ms-flex-preferred-size: 58.33%;
		flex-basis: 58.33%;
		max-width: 58.33%
	}
	.col--xl-8 {
		-ms-flex-preferred-size: 66.66%;
		flex-basis: 66.66%;
		max-width: 66.66%
	}
	.col--xl-9 {
		-ms-flex-preferred-size: 75%;
		flex-basis: 75%;
		max-width: 75%
	}
	.col--xl-10 {
		-ms-flex-preferred-size: 83.33%;
		flex-basis: 83.33%;
		max-width: 83.33%
	}
	.col--xl-11 {
		-ms-flex-preferred-size: 91.66%;
		flex-basis: 91.66%;
		max-width: 91.66%
	}
	.col--xl-12 {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%
	}
}

.flex {
	display: -ms-flexbox;
	display: flex
}

.flex>* {
	display: inline-block
}

.flex--wrap {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

.flex--column {
	-ms-flex-direction: column;
	flex-direction: column
}

.flex--end {
	-ms-flex-pack: end;
	justify-content: flex-end
}

.flex--center {
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center
}

.flex--center-x {
	-ms-flex-pack: center;
	justify-content: center
}

.flex--center-y {
	-ms-flex-align: center;
	align-items: center
}

.flex--space-between {
	-ms-flex-pack: justify;
	justify-content: space-between
}

.flex--space-around {
	-ms-flex-pack: distribute;
	justify-content: space-around
}

.flex--space-evenly {
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly
}

.flex--grow>* {
	-ms-flex-positive: 1;
	flex-grow: 1
}

.flex--shrink-none>* {
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.flex--gap>*,
.flex--gap-md>*,
.flex-gap>*,
.flex-gap--md>* {
	margin-right: 1.25em;
	margin-right: var(--space-md)
}

.flex--gap>*:last-child,
.flex--gap-md>*:last-child,
.flex-gap>*:last-child,
.flex-gap--md>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap,
.flex--wrap.flex--gap-md,
.flex--wrap.flex-gap,
.flex--wrap.flex-gap--md {
	margin-bottom: -1.25em;
	margin-bottom: calc(-1*var(--space-md))
}

.flex--wrap.flex--gap>*,
.flex--wrap.flex--gap-md>*,
.flex--wrap.flex-gap>*,
.flex--wrap.flex-gap--md>* {
	margin-bottom: 1.25em;
	margin-bottom: var(--space-md)
}

.flex--gap-xxs>*,
.flex-gap--xxs>* {
	margin-right: 0.375em;
	margin-right: var(--space-xxs)
}

.flex--gap-xxs>*:last-child,
.flex-gap--xxs>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap-xxs,
.flex--wrap.flex-gap--xxs {
	margin-bottom: -0.375em;
	margin-bottom: calc(-1*var(--space-xxs))
}

.flex--wrap.flex--gap-xxs>*,
.flex--wrap.flex-gap--xxs>* {
	margin-bottom: 0.375em;
	margin-bottom: var(--space-xxs)
}

.flex--gap-xs>*,
.flex-gap--xs>* {
	margin-right: 0.5em;
	margin-right: var(--space-xs)
}

.flex--gap-xs>*:last-child,
.flex-gap--xs>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap-xs,
.flex--wrap.flex-gap--xs {
	margin-bottom: -0.5em;
	margin-bottom: calc(-1*var(--space-xs))
}

.flex--wrap.flex--gap-xs>*,
.flex--wrap.flex-gap--xs>* {
	margin-bottom: 0.5em;
	margin-bottom: var(--space-xs)
}

.flex--gap-sm>*,
.flex-gap--sm>* {
	margin-right: 0.75em;
	margin-right: var(--space-sm)
}

.flex--gap-sm>*:last-child,
.flex-gap--sm>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap-sm,
.flex--wrap.flex-gap--sm {
	margin-bottom: -0.75em;
	margin-bottom: calc(-1*var(--space-sm))
}

.flex--wrap.flex--gap-sm>*,
.flex--wrap.flex-gap--sm>* {
	margin-bottom: 0.75em;
	margin-bottom: var(--space-sm)
}

.flex--gap-lg>*,
.flex-gap--lg>* {
	margin-right: 2em;
	margin-right: var(--space-lg)
}

.flex--gap-lg>*:last-child,
.flex-gap--lg>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap-lg,
.flex--wrap.flex-gap--lg {
	margin-bottom: -2em;
	margin-bottom: calc(-1*var(--space-lg))
}

.flex--wrap.flex--gap-lg>*,
.flex--wrap.flex-gap--lg>* {
	margin-bottom: 2em;
	margin-bottom: var(--space-lg)
}

.flex--gap-xl>*,
.flex-gap--xl>* {
	margin-right: 3.25em;
	margin-right: var(--space-xl)
}

.flex--gap-xl>*:last-child,
.flex-gap--xl>*:last-child {
	margin-right: 0
}

.flex--wrap.flex--gap-xl,
.flex--wrap.flex-gap--xl {
	margin-bottom: -3.25em;
	margin-bottom: calc(-1*var(--space-xl))
}

.flex--wrap.flex--gap-xl>*,
.flex--wrap.flex-gap--xl>* {
	margin-bottom: 3.25em;
	margin-bottom: var(--space-xl)
}

.flex-item--end {
	-ms-flex-item-align: end;
	align-self: flex-end
}

.flex-item--grow {
	-ms-flex-positive: 1;
	flex-grow: 1
}

.flex-item--shrink-none {
	-ms-flex-negative: 0;
	flex-shrink: 0
}

:root {
	--radius: 0.25em;
	--shadow-sm: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 8px rgba(0, 0, 0, .1);
	--shadow-md: 0 1px 8px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .15);
	--shadow-lg: 0 1px 8px rgba(0, 0, 0, .1), 0 16px 48px rgba(0, 0, 0, .1), 0 24px 60px rgba(0, 0, 0, .1);
	--transition-bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
	--transition-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
	--transition-ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	--transition-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1)
}

:root {
	--font-primary: sans-serif;
	--text-base-size: 1em;
	--text-scale-ratio: 1.2;
	--text-xs: calc(1em/var(--text-scale-ratio)/var(--text-scale-ratio));
	--text-sm: calc(var(--text-xs)*var(--text-scale-ratio));
	--text-md: calc(var(--text-sm)*var(--text-scale-ratio)*var(--text-scale-ratio));
	--text-lg: calc(var(--text-md)*var(--text-scale-ratio));
	--text-xl: calc(var(--text-lg)*var(--text-scale-ratio));
	--text-xxl: calc(var(--text-xl)*var(--text-scale-ratio));
	--text-xxxl: calc(var(--text-xxl)*var(--text-scale-ratio));
	--body-line-height: 1.4;
	--heading-line-height: 1.2;
	--font-primary-capital-letter: 1
}

@supports (--css: variables) {
	@media (min-width: 64rem) {
		:root {
			--text-base-size: 1.25em;
			--text-scale-ratio: 1.25
		}
	}
}

body {
	font-size: 1em;
	font-size: var(--text-base-size);
	font-family: 'Open Sans', sans-serif;
	font-family: var(--font-primary);
	color: hsl(240, 4%, 20%);
	color: var(--color-contrast-high)
}

h1,
h2,
h3,
h4 {
	color: hsl(240, 8%, 12%);
	color: var(--color-contrast-higher);
	line-height: 1.2;
	line-height: var(--heading-line-height)
}

.text--xxxl {
	font-size: 2.48832em;
	font-size: var(--text-xxxl)
}

h1,
.text--xxl {
	font-size: 2.0736em;
	font-size: var(--text-xxl)
}

h2,
.text--xl {
	font-size: 1.728em;
	font-size: var(--text-xl)
}

h3,
.text--lg {
	font-size: 1.44em;
	font-size: var(--text-lg)
}

h4,
.text--md {
	font-size: 1.2em;
	font-size: var(--text-md)
}

.text--sm,
small {
	font-size: 0.83333em;
	font-size: var(--text-sm)
}

.text--xs {
	font-size: 0.69444em;
	font-size: var(--text-xs)
}

a,
.link {
	color: hsl(220, 90%, 56%);
	color: var(--color-primary);
	text-decoration: underline
}

mark {
	background-color: hsla(355, 90%, 61%, 0.2);
	background-color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.2);
	color: inherit
}

strong {
	font-weight: bold
}

s {
	text-decoration: line-through
}

u {
	text-decoration: underline
}

.text--subtle,
.text-component .text--subtle {
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium)
}

.text--inherit,
.text-component .text--inherit {
	color: inherit
}

.text-component {
	--component-body-line-height: calc(var(--body-line-height)*var(--line-height-multiplier, 1));
	--component-heading-line-height: calc(var(--heading-line-height)*var(--line-height-multiplier, 1));
	--line-height-multiplier: 1;
	--text-vspace-multiplier: 1
}

.text-component h1,
.text-component h2,
.text-component h3,
.text-component h4 {
	line-height: 1.2;
	line-height: var(--component-heading-line-height);
	margin-bottom: 0.25em;
	margin-bottom: calc(var(--space-xxxs)*var(--text-vspace-multiplier))
}

.text-component h2,
.text-component h3,
.text-component h4 {
	margin-top: 0.75em;
	margin-top: calc(var(--space-sm)*var(--text-vspace-multiplier))
}

.text-component p,
.text-component blockquote,
.text-component ul li,
.text-component ol li {
	line-height: 1.4;
	line-height: var(--component-body-line-height);
	color: hsl(240, 4%, 20%);
	color: var(--color-contrast-high)
}

.text-component ul,
.text-component ol,
.text-component p,
.text-component blockquote,
.text-component .text-component__block,
.text-component .text-component__img {
	margin-bottom: 0.75em;
	margin-bottom: calc(var(--space-sm)*var(--text-vspace-multiplier))
}

.text-component ul,
.text-component ol {
	padding-left: 1em
}

.text-component ul {
	list-style-type: disc
}

.text-component ol {
	list-style-type: decimal
}

.text-component em {
	font-style: italic
}

.text-component blockquote {
	padding-left: 1em;
	border-left: 4px solid hsl(240, 1%, 83%);
	border-left: 4px solid var(--color-contrast-low)
}

.text-component hr {
	background: hsl(240, 1%, 83%);
	background: var(--color-contrast-low);
	height: 1px;
	margin: 2em auto;
	margin: calc(var(--space-lg)*var(--text-vspace-multiplier)) auto
}

.text-component>*:first-child {
	margin-top: 0
}

.text-component>*:last-child {
	margin-bottom: 0
}

.article.text-component {
	--line-height-multiplier: 1.13;
	--text-vspace-multiplier: 1.2
}

.text-component__block--full-width {
	width: 100vw;
	margin-left: calc(50% - 50vw)
}

.text-component__img {
	text-align: center
}

.text-component__img img {
	display: block;
	margin: 0 auto
}

.text-component__img figcaption {
	text-align: center;
	font-size: 0.83333em;
	font-size: var(--text-sm);
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium);
	margin-top: 0.5em;
	margin-top: var(--space-xs)
}

.text-component__block .text-component__img {
	margin-bottom: 0
}

@media (min-width: 37.5rem) {
	.text-component__block--left,
	.text-component__block--right,
	.text-component__img--left,
	.text-component__img--right {
		width: 45%
	}
	.text-component__block--left img,
	.text-component__block--right img,
	.text-component__img--left img,
	.text-component__img--right img {
		width: 100%
	}
	.text-component__block--left,
	.text-component__img--left {
		float: left;
		margin-right: 0.75em;
		margin-right: calc(var(--space-sm)*var(--text-vspace-multiplier, 1))
	}
	.text-component__block--right,
	.text-component__img--right {
		float: right;
		margin-left: 0.75em;
		margin-left: calc(var(--space-sm)*var(--text-vspace-multiplier, 1))
	}
}

@media (min-width: 90rem) {
	.text-component__block--outset,
	.text-component__img--outset {
		width: calc(100% + 10.5em);
		width: calc(100% + 2*var(--space-xxl))
	}
	.text-component__block--outset img,
	.text-component__img--outset img {
		width: 100%
	}
	.text-component__block--outset:not(.text-component__block--right),
	.text-component__img--outset:not(.text-component__img--right) {
		margin-left: -5.25em;
		margin-left: calc(-1*var(--space-xxl))
	}
	.text-component__block--left,
	.text-component__block--right,
	.text-component__img--left,
	.text-component__img--right {
		width: 50%
	}
	.text-component__block--right.text-component__block--outset,
	.text-component__img--right.text-component__img--outset {
		margin-right: -5.25em;
		margin-right: calc(-1*var(--space-xxl))
	}
}

.truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.text--center {
	text-align: center
}

.text--replace {
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap
}

:root {
	--icon-xxs: 12px;
	--icon-xs: 16px;
	--icon-sm: 24px;
	--icon-md: 32px;
	--icon-lg: 48px;
	--icon-xl: 64px;
	--icon-xxl: 128px
}

.icon {
	display: inline-block;
	color: hsl(240, 8%, 12%);
	color: var(--color-contrast-higher);
	fill: currentColor;
	height: 1em;
	width: 1em;
	line-height: 1
}

.icon--xxs {
	font-size: 12px;
	font-size: var(--icon-xxs)
}

.icon--xs {
	font-size: 16px;
	font-size: var(--icon-xs)
}

.icon--sm {
	font-size: 24px;
	font-size: var(--icon-sm)
}

.icon--md {
	font-size: 32px;
	font-size: var(--icon-md)
}

.icon--lg {
	font-size: 48px;
	font-size: var(--icon-lg)
}

.icon--xl {
	font-size: 64px;
	font-size: var(--icon-xl)
}

.icon--xxl {
	font-size: 128px;
	font-size: var(--icon-xxl)
}

.icon-text {
	display: -ms-inline-flexbox;
	display: inline-flex;
	-ms-flex-align: center;
	align-items: center
}

.icon-text>*:nth-child(2) {
	margin-left: 0.375em;
	margin-left: var(--space-xxs)
}

.icon-text .icon {
	color: inherit;
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.icon-text.icon-text--gap-none>*:nth-child(2) {
	margin-left: 0
}

.icon-text.icon-text--gap-xxxs>*:nth-child(2) {
	margin-left: 0.25em;
	margin-left: var(--space-xxxs)
}

.icon-text.icon-text--gap-xxxxs>*:nth-child(2) {
	margin-left: 0.125em;
	margin-left: var(--space-xxxxs)
}

.icon-text--space-between {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between
}

.icon--is-spinning {
	-webkit-animation: icon-spin 1s infinite linear;
	animation: icon-spin 1s infinite linear
}

@-webkit-keyframes icon-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg)
	}
}

@keyframes icon-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg)
	}
}

.icon use {
	color: inherit;
	fill: currentColor
}

:root {
	--btn-font-size: 1em;
	--btn-sm: calc(var(--btn-font-size) - 0.2em);
	--btn-md: calc(var(--btn-font-size) + 0.2em);
	--btn-lg: calc(var(--btn-font-size) + 0.4em)
}

.btn {
	display: -ms-inline-flexbox;
	display: inline-flex;
	position: relative;
	white-space: nowrap;
	text-decoration: none;
	line-height: 1;
	padding: 0.5em 0.75em;
	padding: var(--space-xs) var(--space-sm);
	border-radius: 0.25em;
	font-size: 1em;
	font-size: var(--btn-font-size);
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center
}

.btn--primary {
	background-color: hsl(220, 90%, 56%);
	background-color: var(--color-primary);
	color: hsl(0, 0%, 100%);
	color: var(--color-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.btn--subtle {
	color: hsl(240, 8%, 12%);
	color: var(--color-contrast-higher);
	border: 1px solid hsl(240, 1%, 83%);
	border: 1px solid var(--color-contrast-low)
}

.btn--accent {
	background-color: hsl(355, 90%, 61%);
	background-color: var(--color-accent);
	color: hsl(0, 0%, 100%);
	color: var(--color-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.btn--disabled {
	cursor: not-allowed;
	box-shadow: none;
	opacity: 0.6
}

.btn--sm {
	font-size: 0.8em;
	font-size: var(--btn-sm)
}

.btn--md {
	font-size: 1.2em;
	font-size: var(--btn-md)
}

.btn--lg {
	font-size: 1.4em;
	font-size: var(--btn-lg)
}

.btn--full-width {
	display: -ms-flexbox;
	display: flex;
	width: 100%
}

.btn .icon {
	color: inherit;
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.btn--icon-text {
	-ms-flex-align: center;
	align-items: center
}

.btn--icon-text>*:nth-child(2) {
	margin-left: 0.375em;
	margin-left: var(--space-xxs)
}

.btn--icon {
	padding: 0.5em;
	padding: var(--space-xs)
}

.form-control {
	padding: 0.5em 0.75em;
	padding: var(--space-xs) var(--space-sm);
	background: hsl(0, 0%, 100%);
	background: var(--color-bg);
	border: 2px solid hsl(240, 1%, 83%);
	border: 2px solid var(--color-contrast-low);
	width: 100%
}

.form-control:focus {
	outline: none;
	border-color: hsl(220, 90%, 56%);
	border-color: var(--color-primary);
	--color-shadow: hsla(220, 90%, 56%, 0.2);
	--color-shadow: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
	box-shadow: undefined;
	box-shadow: 0 0 0 3px var(--color-shadow)
}

.form-control:focus:focus {
	box-shadow: 0 0 0 3px hsla(220, 90%, 56%, 0.2);
	box-shadow: 0 0 0 3px var(--color-shadow)
}

.form-control::-webkit-input-placeholder {
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium)
}

.form-control::-moz-placeholder {
	opacity: 1;
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium)
}

.form-control:-ms-input-placeholder {
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium)
}

.form-control:-moz-placeholder {
	color: hsl(240, 1%, 48%);
	color: var(--color-contrast-medium)
}

.form-control[disabled],
.form-control[readonly] {
	cursor: not-allowed
}

.form-control[aria-invalid="true"] {
	border-color: hsl(355, 90%, 61%);
	border-color: var(--color-error)
}

.form-control[aria-invalid="true"]:focus {
	--color-shadow: hsla(355, 90%, 61%, 0.2);
	--color-shadow: hsla(var(--color-error-h), var(--color-error-s), var(--color-error-l), 0.2);
	box-shadow: undefined;
	box-shadow: 0 0 0 3px var(--color-shadow)
}

.form-control[aria-invalid="true"]:focus:focus {
	box-shadow: 0 0 0 3px hsla(355, 90%, 61%, 0.2);
	box-shadow: 0 0 0 3px var(--color-shadow)
}

.form-legend {
	color: hsl(240, 8%, 12%);
	color: var(--color-contrast-higher);
	line-height: 1.2;
	font-size: 1.2em;
	font-size: var(--text-md);
	margin-bottom: 0.375em;
	margin-bottom: var(--space-xxs)
}

.form-label {
	display: inline-block;
	font-size: 0.83333em;
	font-size: var(--text-sm);
	margin-bottom: 0.25em;
	margin-bottom: var(--space-xxxs)
}

.form__msg-error {
	background-color: hsl(355, 90%, 61%);
	background-color: var(--color-error);
	color: hsl(0, 0%, 100%);
	color: var(--color-white);
	font-size: 0.83333em;
	font-size: var(--text-sm);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	padding: 0.5em;
	padding: var(--space-xs);
	margin-top: 0.75em;
	margin-top: var(--space-sm);
	border-radius: 0.25em;
	position: absolute;
	clip: rect(1px, 1px, 1px, 1px)
}

.form__msg-error::before {
	content: '';
	position: absolute;
	left: 0.75em;
	left: var(--space-sm);
	top: 0;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-bottom-color: hsl(355, 90%, 61%);
	border-bottom-color: var(--color-error)
}

.form__msg-error--is-visible {
	position: relative;
	clip: auto
}

.radio-list>*,
.checkbox-list>* {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: baseline;
	align-items: baseline;
	margin-bottom: 0.375em;
	margin-bottom: var(--space-xxs)
}

.radio-list>*:last-of-type,
.checkbox-list>*:last-of-type {
	margin-bottom: 0
}

.radio-list label,
.checkbox-list label {
	line-height: 1.4;
	line-height: var(--body-line-height);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}

.radio-list input,
.checkbox-list input {
	vertical-align: top;
	margin-right: 0.25em;
	margin-right: var(--space-xxxs);
	-ms-flex-negative: 0;
	flex-shrink: 0
}

.radio-list.radio-list--inline,
.radio-list.checkbox-list--inline,
.checkbox-list.radio-list--inline,
.checkbox-list.checkbox-list--inline {
	display: -ms-flexbox;
	display: flex;
	margin-bottom: -1.25em;
	margin-bottom: calc(-1*var(--space-md))
}

.radio-list.radio-list--inline>*,
.radio-list.checkbox-list--inline>*,
.checkbox-list.radio-list--inline>*,
.checkbox-list.checkbox-list--inline>* {
	margin: 0 1.25em 1.25em 0;
	margin: 0 var(--space-md) var(--space-md) 0
}

:root {
	--zindex-header: 2;
	--zindex-popover: 4;
	--zindex-fixed-element: 5;
	--zindex-overlay: 10
}

@media not all and (min-width: 30rem) {
	.display--xs {
		display: none !important
	}
}

@media (min-width: 30rem) {
	.hide--xs {
		display: none !important
	}
}

@media not all and (min-width: 37.5rem) {
	.display--sm {
		display: none !important
	}
}

@media (min-width: 37.5rem) {
	.hide--sm {
		display: none !important
	}
}

@media not all and (min-width: 64rem) {
	.display--md {
		display: none !important
	}
}

@media (min-width: 64rem) {
	.hide--md {
		display: none !important
	}
}

@media not all and (min-width: 80rem) {
	.display--lg {
		display: none !important
	}
}

@media (min-width: 80rem) {
	.hide--lg {
		display: none !important
	}
}

@media not all and (min-width: 90rem) {
	.display--xl {
		display: none !important
	}
}

@media (min-width: 90rem) {
	.hide--xl {
		display: none !important
	}
}

:root {
	--display: block
}

.is-visible {
	display: block !important;
	display: var(--display) !important
}

.is-hidden {
	display: none !important
}

.sr-only {
	position: absolute;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	overflow: hidden;
	padding: 0;
	border: 0;
	white-space: nowrap
}

:root {
	--cd-color-1: hsl(0, 0%, 87%);
	--cd-color-1-h: 0;
	--cd-color-1-s: 0%;
	--cd-color-1-l: 87%;
	--cd-color-2: hsl(201, 38%, 29%);
	--cd-color-2-h: 201;
	--cd-color-2-s: 38%;
	--cd-color-2-l: 29%;
	--cd-color-3: hsl(210, 14%, 49%);
	--cd-color-3-h: 210;
	--cd-color-3-s: 14%;
	--cd-color-3-l: 49%;
	--cd-color-4: hsl(0, 0%, 0%);
	--cd-color-4-h: 0;
	--cd-color-4-s: 0%;
	--cd-color-4-l: 0%;
	--font-primary: 'Open Sans', sans-serif
}

.cd-faq {
	box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 8px rgba(0, 0, 0, .1);
	box-shadow: var(--shadow-sm)
}

.cd-faq::before {
	content: 'mobile';
	display: none
}

.cd-faq a {
	text-decoration: none;
	font-size: 14px;
}

.cd-faq a:hover {
	color: black;
}

.cd-faq a:focus {
	color: black;
}

@media (min-width: 64rem) {
	.cd-faq {
		position: relative;
		box-shadow: none;
		display: -ms-flexbox;
		display: flex;
	}
	.cd-faq::before {
		content: 'desktop'
	}
}

@media (min-width: 64rem) {
	.cd-faq__categories {
		position: -webkit-sticky;
		position: sticky;
		-ms-flex-item-align: start;
		align-self: flex-start;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		top: 50px;
		width: 20%;
		box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 8px rgba(0, 0, 0, .1);
		box-shadow: var(--shadow-sm);
		margin-top: 1.25em;
		margin-top: var(--space-md)
	}
}

@media (min-width: 80rem) {
	.cd-faq__categories {
		width: 250px
	}
}

.cd-faq__category {
	position: relative;
	display: block;
	height: 50px;
	line-height: 50px;
	padding: 0 2em 0 1.05em;
	padding: 0 var(--space-lg) 0 calc(var(--space-sm)*1.4);
	color: hsl(0, 0%, 0%);
	color: var(--cd-color-4);
	background-color: hsl(213, 7%, 33%);
	background-color: var(--cd-color-1);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	--border-color: hsl(213, 7%, 36.3%);
	--border-color: hsl(var(--cd-color-1-h), var(--cd-color-1-s), calc(var(--cd-color-1-l)*1.1));
	border-bottom: 1px solid hsl(213, 7%, 36.3%);
	border-bottom: 1px solid var(--border-color)
}

.cd-faq__category::before,
.cd-faq__category::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 16px;
	display: inline-block;
	height: 1px;
	width: 10px;
	background-color: hsl(213, 7%, 52.8%);
	background-color: hsl(var(--cd-color-1-h), var(--cd-color-1-s), calc(var(--cd-color-1-l)*1.6))
}

.cd-faq__category::after {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg)
}

li:last-child .cd-faq__category {
	border-bottom: none
}

@media (min-width: 64rem) {
	.cd-faq__category {
		font-size: 0.69444em;
		font-size: var(--text-xs);
		font-weight: 600;
		padding: 0 1.25em;
		padding: 0 var(--space-md);
		transition: background .2s
	}
	.cd-faq__category::before,
	.cd-faq__category::after {
		display: none
	}
	.cd-faq__category:hover {
		background: hsl(213, 7%, 36.3%);
		background: hsl(var(--cd-color-1-h), var(--cd-color-1-s), calc(var(--cd-color-1-l)*1.1))
	}
}

@media (min-width: 80rem) {
	.cd-faq__category::before {
		display: block;
		top: 0;
		right: auto;
		left: 0;
		height: 100%;
		width: 3px;
		background-color: hsl(73, 46%, 55%);
		background-color: var(--cd-color-2);
		opacity: 0;
		transition: opacity .2s
	}
}

@media (min-width: 80rem) {
	.cd-faq__category-selected {
		background: hsl(213, 7%, 26.4%);
		background: hsl(var(--cd-color-1-h), var(--cd-color-1-s), calc(var(--cd-color-1-l)*0.8))
	}
	.cd-faq__category-selected:hover {
		background: hsl(213, 7%, 26.4%);
		background: hsl(var(--cd-color-1-h), var(--cd-color-1-s), calc(var(--cd-color-1-l)*0.8))
	}
	.cd-faq__category-selected::before {
		opacity: 1
	}
}

.cd-faq__items {
	position: fixed;
	z-index: 1;
	height: 100%;
	width: 90%;
	top: 0;
	right: 0;
	background: hsl(0, 0%, 100%);
	/*background: var(--cd-color-4);*/
	padding: 0 1.25em 1.25em;
	padding: 0 var(--component-padding) var(--space-md);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateZ(0) translateX(100%);
	transform: translateZ(0) translateX(100%);
	transition: -webkit-transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s
}

@media (min-width: 64rem) {
	.cd-faq__items {
		position: static;
		height: auto;
		width: auto;
		-ms-flex-positive: 1;
		flex-grow: 1;
		overflow: visible;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
		padding: 0 0 0 0.75em;
		padding: 0 0 0 var(--space-sm);
		background: transparent
	}
}

.cd-faq__items--slide-in {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0)
}

html:not(.js) .cd-faq__items {
	position: static;
	height: auto;
	width: 100%;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0)
}

.cd-faq__group {
	display: none
}

@media (min-width: 64rem) {
	.cd-faq__group {
		display: block;
		padding-top: 12px
	}
}

html:not(.js) .cd-faq__group,
.cd-faq__group--selected {
	display: block
}

.cd-faq__title {
	margin: 1.25em 0;
	margin: var(--space-md) 0
}

.cd-faq__title h2 {
	text-transform: uppercase;
	font-size: 0.83333em;
	font-size: var(--text-sm);
	font-weight: 700;
	color: hsl(240, 1%, 74.7%);
	color: hsl(var(--color-contrast-low-h), var(--color-contrast-low-s), calc(var(--color-contrast-low-l)*0.9))
}

@media (min-width: 64rem) {
	.cd-faq__title {
		margin-bottom: 0.75em;
		margin-bottom: var(--space-sm)
	}
	.cd-faq__title h2 {
		font-size: 0.69444em;
		font-size: 16px;
	}
}

@media (min-width: 64rem) {
	.cd-faq__item {
		background: hsl(0, 0%, 100%);
		/*background: var(--cd-color-4);*/
		margin-bottom: 0.25em;
		margin-bottom: var(--space-xxxs);
		box-shadow: 0 1px 10px rgba(0, 0, 0, 0.08);
		transition: box-shadow .2s
	}
	.cd-faq__item:hover {
		--box-shadow: hsla(210, 14%, 49%, 0.3);
		--box-shadow: hsla(var(--cd-color-3-h), var(--cd-color-3-s), var(--cd-color-3-l), 0.3);
		box-shadow: undefined;
		box-shadow: 0 1px 10px var(--box-shadow)
	}
	@media (min-width: 64rem) {
		.cd-faq__item:hover {
			box-shadow: 0 1px 10px hsla(210, 14%, 49%, 0.3);
			box-shadow: 0 1px 10px var(--box-shadow)
		}
	}
	.cd-faq__item:last-of-type {
		margin-bottom: 0
	}
	.cd-faq__item a:hover {
		color: var(--cd-color-2);
	}
	
	.cd-faq__item a:focus {
		color: var(--cd-color-2);
	}
}

.cd-faq__trigger {
	display: block;
	position: relative;
	margin: 1.25em 0 0.5em;
	margin: var(--space-md) 0 var(--space-xs);
	color: hsl(73, 46%, 55%);
	color: var(--cd-color-2)
}

@media (min-width: 64rem) {
	.cd-faq__trigger {
		font-weight: 300;
		margin: 0;
		padding: 0.75em 2em 0.75em 0.75em;
		padding: var(--space-sm) var(--space-lg) var(--space-sm) var(--space-sm)
	}
	.cd-faq__trigger span {
		font-size: 1.2em;
		font-size: var(--text-md)
	}
	.cd-faq__trigger::before,
	.cd-faq__trigger::after {
		content: '';
		position: absolute;
		right: 24px;
		top: 50%;
		height: 2px;
		width: 13px;
		background: hsl(73, 46%, 71.5%);
		background: hsl(var(--cd-color-2-h), var(--cd-color-2-s), calc(var(--cd-color-2-l)*1.3));
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transition: -webkit-transform .2s;
		transition: transform .2s;
		transition: transform .2s, -webkit-transform .2s
	}
	.cd-faq__trigger::before {
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		right: 32px
	}
	.cd-faq__trigger::after {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg)
	}
	.cd-faq__item-visible .cd-faq__trigger::before {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg)
	}
	.cd-faq__item-visible .cd-faq__trigger::after {
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg)
	}
}

.cd-faq__content .text-component {
	font-size: 0.95em
}

.cd-faq__content p {
	color: hsl(210, 14%, 49%);
	color: black;
}

@media (min-width: 64rem) {
	.cd-faq__content {
		display: none;
		padding: 0 0.75em;
		padding: 0 var(--space-sm);
		overflow: hidden
	}
	.cd-faq__content .text-component {
		font-size: 14px;
		padding-bottom: 1.25em;
		padding-bottom: var(--space-md)
	}
}

.cd-faq__content--visible {
	display: block
}

.cd-faq__close-panel {
	position: fixed;
	z-index: 2;
	display: block;
	top: 5px;
	right: -40px;
	height: 40px;
	width: 40px;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: right .3s
}

.cd-faq__close-panel::before,
.cd-faq__close-panel::after {
	content: '';
	position: absolute;
	top: 16px;
	left: 12px;
	display: inline-block;
	height: 3px;
	width: 18px;
	background: hsl(210, 14%, 49%);
	background: var(--cd-color-3)
}

.cd-faq__close-panel::before {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg)
}

.cd-faq__close-panel::after {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg)
}

@media (min-width: 64rem) {
	.cd-faq__close-panel {
		display: none
	}
}

.cd-faq__close-panel--move-left {
	right: 1.25em;
	right: var(--component-padding);
	transition-delay: 0.3s
}

.cd-faq__overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: hsla(213, 7%, 33%, 0.8);
	background-color: hsla(var(--cd-color-1-h), var(--cd-color-1-s), var(--cd-color-1-l), 0.8);
	visibility: hidden;
	opacity: 0;
	transition: opacity .3s, visibility .3s
}

@media (min-width: 64rem) {
	.cd-faq__overlay {
		display: none
	}
}

.cd-faq__overlay--is-visible {
	visibility: visible;
	opacity: 1
}

body {
	background-color: hsl(0, 0%, 95%);
	background-color: var(--color-contrast-lower)
}

.cd-header {
	--header-height: 180px;
	height: 180px;
	height: var(--header-height);
	background-color: hsl(73, 46%, 55%);
	background-color: var(--cd-color-2)
}

@media (min-width: 80rem) {
	.cd-header {
		height: 240px;
		height: var(--header-height)
	}
}

.cd-header h1 {
	font-size: 1.728em;
	font-size: var(--text-xl);
	font-weight: 300;
	color: hsl(0, 0%, 100%);
	color: var(--cd-color-4);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

@media (min-width: 80rem) {
	.cd-header {
		--header-height: 240px
	}
}

.cd-article-link {
	color: hsl(73, 46%, 27.5%);
	color: hsl(var(--cd-color-2-h), var(--cd-color-2-s), calc(var(--cd-color-2-l)*0.5));
	font-size: 0.83333em;
	font-size: var(--text-sm)
}