@utrecht/component-library-css 1.0.0-alpha.43 → 1.0.0-alpha.430

package/dist/bem.css

@@ -1,1493 +0,0 @@
-@charset "UTF-8";
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- */
-/* Collection of all BEM class names in the component library */
-/*
- * TODO: Once every component is a separate npm package, these imports should
- * be updated to use a package reference instead of a relative path.
- *
- * For example:
- *     @import "../../blockquote/index";
- *
- * Will become:
- *     @import "@utrecht/blockquote/index";
- */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-/* stylelint-disable-next-line block-no-empty */
-/* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-article {
-  max-inline-size: var(--utrecht-article-max-inline-size);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
-  background-color: var(--utrecht-badge-background-color, black);
-  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
-  color: var(--utrecht-badge-color, white);
-  display: inline-block;
-  font-family: var(--utrecht-document-font-family, sans-serif);
-  font-style: normal;
-  /* no inheritance */
-  font-weight: var(--utrecht-badge-font-weight, bold);
-  /* no inheritance */
-  padding-block-end: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-block-start: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
-  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
-  text-decoration: none;
-  /* no inheritance */
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
-  background-color: var(--utrecht-badge-background-color, black);
-  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
-  color: var(--utrecht-badge-color, white);
-  display: inline-block;
-  font-family: var(--utrecht-document-font-family, sans-serif);
-  font-style: normal;
-  /* no inheritance */
-  font-weight: var(--utrecht-badge-font-weight, bold);
-  /* no inheritance */
-  padding-block-end: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-block-start: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
-  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
-  text-decoration: none;
-  /* no inheritance */
-}
-
-.utrecht-badge-counter {
-  background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, black));
-  border-radius: var(--utrecht-badge-counter-border-radius, var(--utrecht-badge-border-radius, 0.5ch));
-  color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, white));
-  display: inline-block;
-  font-family: var(--utrecht-document-font-family, sans-serif);
-  font-style: normal;
-  /* no inheritance */
-  font-weight: var(--utrecht-badge-counter-font-weight, var(--utrecht-badge-font-weight, bold));
-  /* no inheritance */
-  padding-block-end: var(--utrecht-badge-counter-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
-  padding-block-start: var(--utrecht-badge-counter-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
-  padding-inline-end: var(--utrecht-badge-counter-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
-  padding-inline-start: var(--utrecht-badge-counter-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
-  text-decoration: none;
-  /* no inheritance */
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
-  background-color: var(--utrecht-badge-background-color, black);
-  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
-  color: var(--utrecht-badge-color, white);
-  display: inline-block;
-  font-family: var(--utrecht-document-font-family, sans-serif);
-  font-style: normal;
-  /* no inheritance */
-  font-weight: var(--utrecht-badge-font-weight, bold);
-  /* no inheritance */
-  padding-block-end: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-block-start: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
-  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
-  text-decoration: none;
-  /* no inheritance */
-}
-
-.utrecht-badge-data {
-  letter-spacing: var(--utrecht-badge-data-letter-spacing, inherit);
-  text-transform: var(--utrecht-badge-data-text-transform, inherit);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
-  background-color: var(--utrecht-badge-background-color, black);
-  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
-  color: var(--utrecht-badge-color, white);
-  display: inline-block;
-  font-family: var(--utrecht-document-font-family, sans-serif);
-  font-style: normal;
-  /* no inheritance */
-  font-weight: var(--utrecht-badge-font-weight, bold);
-  /* no inheritance */
-  padding-block-end: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-block-start: var(--utrecht-badge-padding-block, 0.5ex);
-  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
-  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
-  text-decoration: none;
-  /* no inheritance */
-}
-
-.utrecht-badge-status {
-  letter-spacing: var(--utrecht-badge-status-letter-spacing, inherit);
-  text-transform: var(--utrecht-badge-status-text-transform, inherit);
-}
-
-.utrecht-badge-status--danger {
-  background-color: var(--utrecht-feedback-danger-fill-background-color, red);
-  color: var(--utrecht-feedback-danger-fill-color, white);
-}
-
-.utrecht-badge-status--warning {
-  background-color: var(--utrecht-feedback-warning-fill-background-color, #ffa600);
-  color: var(--utrecht-feedback-warning-fill-color, white);
-}
-
-.utrecht-badge-status--safe {
-  background-color: var(--utrecht-feedback-safe-fill-background-color, green);
-  color: var(--utrecht-feedback-safe-fill-color, white);
-}
-
-.utrecht-badge-status--valid {
-  background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, red));
-  color: var(--utrecht-feedback-valid-fill-color, var(--utrecht-feedback-safe-fill-color, white));
-}
-
-.utrecht-badge-status--invalid {
-  background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
-  color: var(--utrecht-feedback-invalid-fill-color, var(--utrecht-feedback-danger-fill-color, white));
-}
-
-.utrecht-badge-status--error {
-  background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
-  color: var(--utrecht-feedback-error-fill-color, var(--utrecht-feedback-danger-fill-color, white));
-}
-
-.utrecht-badge-status--success {
-  background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
-  color: var(--utrecht-feedback-success-fill-color, var(--utrecht-feedback-safe-fill-color, white));
-}
-
-.utrecht-badge-status--active {
-  background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
-  color: var(--utrecht-feedback-active-fill-color, var(--utrecht-feedback-safe-fill-color, white));
-}
-
-.utrecht-badge-status--inactive {
-  background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
-  color: var(--utrecht-feedback-inactive-fill-color, var(--utrecht-feedback-danger-fill-color, white));
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-blockquote {
-  font-family: var(--utrecht-document-font-family);
-  font-size: var(--utrecht-blockquote-font-size);
-  margin-inline-start: var(--utrecht-blockquote-margin-inline-start);
-  margin-inline-end: var(--utrecht-blockquote-margin-inline-end);
-}
-
-.utrecht-blockquote__attribution {
-  color: var(--utrecht-blockquote-attribution-color, inherit);
-  font-size: var(--utrecht-blockquote-attribution-font-size, inherit);
-}
-
-.utrecht-blockquote__content {
-  --utrecht-document-color: var(--utrecht-blockquote-content-color, inherit);
-  --utrecht-paragraph-font-size: var(--utrecht-blockquote-content-font-size, inherit);
-  color: var(--utrecht-blockquote-content-color, inherit);
-  font-size: var(--utrecht-blockquote-content-font-size, inherit);
-}
-
-.utrecht-blockquote--distanced {
-  margin-block-start: var(--utrecht-blockquote-margin-block-start);
-  margin-block-end: var(--utrecht-blockquote-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-breadcrumb {
-  --utrecht-focus-background-color: var(--utrecht-breadcrumb-link-focus-background-color);
-  --utrecht-link-background-color: var(--utrecht-breadcrumb-link-background-color);
-  --utrecht-link-color: var(--utrecht-breadcrumb-link-color);
-  --utrecht-link-focus-color: var(--utrecht-breadcrumb-link-focus-color, var(--utrecht-breadcrumb-link-color));
-  --utrecht-link-focus-text-decoration: var(--utrecht-link-text-decoration);
-  --utrecht-link-hover-color: var(--utrecht-breadcrumb-link-color);
-  --utrecht-link-hover-text-decoration: var(--utrecht-link-text-decoration);
-  --utrecht-link-visited-color: var(--utrecht-breadcrumb-link-color);
-  --utrecht-link-visited-text-decoration: var(--utrecht-link-text-decoration);
-  font-size: var(--utrecht-breadcrumb-font-size);
-  font-family: var(--utrecht-document-font-family, inherit);
-  text-transform: var(--utrecht-document-text-transform, inherit);
-}
-
-.utrecht-breadcrumb__list {
-  display: flex;
-  block-size: var(--utrecht-breadcrumb-block-size);
-}
-
-ol.utrecht-breadcrumb__list {
-  list-style: none;
-  margin-block-start: 0;
-  margin-block-end: 0;
-  padding-inline-start: 0;
-}
-
-.utrecht-breadcrumb__item {
-  block-size: 100%;
-}
-
-.utrecht-breadcrumb__item ~ .utrecht-breadcrumb__item {
-  margin-inline-start: var(--utrecht-breadcrumb-item-divider-inline-size);
-}
-
-.utrecht-breadcrumb__link {
-  background-color: var(--utrecht-breadcrumb-link-background-color);
-  padding-block-start: var(--utrecht-breadcrumb-item-padding-block-start, 8px);
-  padding-block-end: var(--utrecht-breadcrumb-item-padding-block-end, 8px);
-  padding-inline-start: var(--utrecht-breadcrumb-item-padding-inline-start, 8px);
-  padding-inline-end: var(--utrecht-breadcrumb-item-padding-inline-end, 8px);
-  display: block;
-}
-
-/* stylelint-disable-next-line block-no-empty */
-.utrecht-breadcrumb--arrows {
-  /* https://css-tricks.com/triangle-breadcrumbs/ */
-  --utrecht-breadcrumb-arrow-size: 24px;
-  overflow: hidden;
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__item ~ .utrecht-breadcrumb__item .utrecht-breadcrumb__link {
-  padding-inline-start: calc( var(--utrecht-breadcrumb-item-padding-inline-start) + var(--utrecht-breadcrumb-arrow-size) );
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link {
-  position: relative;
-  padding-inline-end: 0;
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link::after,
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link::before {
-  border-block-end-width: var(--utrecht-breadcrumb-block-size);
-  border-block-start-width: var(--utrecht-breadcrumb-block-size);
-  border-color: transparent;
-  border-style: solid;
-  content: " ";
-  display: block;
-  height: 0;
-  left: 100%;
-  margin-block-start: calc(-1 * var(--utrecht-breadcrumb-block-size));
-  position: absolute;
-  top: 50%;
-  width: 0;
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link::after {
-  border-inline-start-color: var(--utrecht-breadcrumb-link-background-color);
-  border-inline-start-width: var(--utrecht-breadcrumb-arrow-size);
-  z-index: 2;
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link::before {
-  border-inline-start-color: var(--utrecht-document-background-color);
-  border-inline-start-width: var(--utrecht-breadcrumb-arrow-size);
-  margin-block-start: calc(-1 * var(--utrecht-breadcrumb-block-size));
-  margin-inline-start: 1px;
-  z-index: 1;
-}
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link--focus::after,
-.utrecht-breadcrumb--arrows .utrecht-breadcrumb__link:focus::after {
-  border-inline-start-color: var(--utrecht-breadcrumb-link-focus-background-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-button {
-  color: var(--utrecht-button-primary-action-color);
-  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
-  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
-  font-weight: var(--utrecht-button-font-weight);
-  background-color: var(--utrecht-button-primary-action-background-color);
-  border-radius: var(--utrecht-button-border-radius);
-  border-width: var(--utrecht-button-border-width);
-  letter-spacing: var(--utrecht-button-letter-spacing);
-  padding-inline-start: var(--utrecht-button-padding-inline-start);
-  padding-inline-end: var(--utrecht-button-padding-inline-end);
-  padding-block-start: var(--utrecht-button-padding-block-start);
-  padding-block-end: var(--utrecht-button-padding-block-end);
-  text-transform: var(--utrecht-button-text-transform);
-}
-
-.utrecht-button--distanced {
-  margin-inline-start: var(--utrecht-button-margin-inline-start);
-  margin-inline-end: var(--utrecht-button-margin-inline-end);
-  margin-block-start: var(--utrecht-button-margin-block-start);
-  margin-block-end: var(--utrecht-button-margin-block-end);
-}
-
-.utrecht-button:disabled,
-.utrecht-button--disabled {
-  color: var(--utrecht-button-disabled-color);
-  background-color: var(--utrecht-button-disabled-background-color);
-}
-
-.utrecht-button--focus,
-.utrecht-button:not(.utrecht-button--disabled):focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-.utrecht-button--hover:not(:disabled),
-.utrecht-button:hover:not(:disabled):not(.utrecht-button--disabled) {
-  color: var(--utrecht-button-primary-action-color);
-  background-color: var(--utrecht-button-primary-action-hover-background-color);
-  transform: scale(var(--utrecht-button-focus-transform-scale, 1));
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-checkbox {
-  /* reset native margin for input[type="checkbox"] */
-  margin-block-start: 0;
-  margin-block-end: 0;
-  margin-inline-start: 0;
-  margin-inline-end: 0;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-document {
-  background-color: var(--utrecht-document-background-color, inherit);
-  color: var(--utrecht-document-color, inherit);
-  font-family: var(--utrecht-document-font-family, inherit);
-  font-size: var(--utrecht-document-font-size, inherit);
-  line-height: var(--utrecht-document-line-height, inherit);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-emphasis--stressed {
-  font-style: var(--utrecht-emphasis-stressed-font-style, italic);
-}
-
-.utrecht-emphasis--strong {
-  font-weight: var(--utrecht-emphasis-strong-font-weight, bold);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-form-field-checkbox {
-  font-family: var(--utrecht-document-font-family, inherit);
-}
-
-.utrecht-form-field-checkbox--distanced {
-  margin-block-start: var(--utrecht-form-field-margin-block-start, var(--utrecht-paragraph-margin-block-start));
-  margin-block-end: var(--utrecht-form-field-margin-block-end, var(--utrecht-paragraph-margin-block-end));
-}
-
-.utrecht-form-field-checkbox__label {
-  margin-inline-start: 1ch;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-form-field-radio {
-  font-size: var(--utrecht-paragraph-font-size);
-  font-family: var(--utrecht-document-font-family, inherit);
-}
-
-.utrecht-form-field-radio--distanced {
-  margin-block-start: var(--utrecht-form-field-margin-block-start, var(--utrecht-paragraph-margin-block-start));
-  margin-block-end: var(--utrecht-form-field-margin-block-end, var(--utrecht-paragraph-margin-block-end));
-}
-
-.utrecht-form-field-radio__label {
-  margin-inline-start: 1ch;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-form-field-radio-group {
-  font-size: var(--utrecht-paragraph-font-size);
-  font-family: var(--utrecht-document-font-family, inherit);
-}
-
-.utrecht-form-field-radio-group--distanced {
-  margin-block-start: var(--utrecht-form-field-margin-block-start, var(--utrecht-paragraph-margin-block-start));
-  margin-block-end: var(--utrecht-form-field-margin-block-end, var(--utrecht-paragraph-margin-block-end));
-}
-
-.utrecht-form-field-radio-group__label {
-  margin-block-start: var(--utrecht-paragraph-margin-block-start);
-  margin-block-end: var(--utrecht-paragraph-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-form-fieldset--distanced {
-  margin-block-start: var(--utrecht-form-fieldset-margin-block-start, 0);
-  margin-block-end: var(--utrecht-form-fieldset-margin-block-end, 0);
-}
-
-.utrecht-form-fieldset__legend {
-  font-family: var(--utrecht-form-fieldset-legend-font-family, var(--utrecht-document-font-family));
-  font-size: var(--utrecht-form-fieldset-legend-font-size);
-  font-weight: var(--utrecht-form-fieldset-legend-font-weight);
-  line-height: var(--utrecht-form-fieldset-legend-line-height);
-  color: var(--utrecht-form-fieldset-legend-color, var(--utrecht-document-color, inherit));
-}
-
-.utrecht-form-fieldset__legend--distanced {
-  margin-block-start: var(--utrecht-form-fieldset-legend-margin-block-start);
-  margin-block-end: var(--utrecht-form-fieldset-legend-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-form-label {
-  font-weight: var(--utrecht-form-label-font-weight);
-  font-size: var(--utrecht-form-label-font-size);
-}
-
-.utrecht-form-label--checkbox {
-  font-weight: var(--utrecht-form-label-checkbox-font-weight, var(--utrecht-form-label-font-weight));
-}
-
-.utrecht-form-label--radio {
-  font-weight: var(--utrecht-form-label-radio-font-weight, var(--utrecht-form-label-font-weight));
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-1 {
-  font-family: var(--utrecht-heading-1-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-1-font-size);
-  font-weight: var(--utrecht-heading-1-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-1-letter-spacing);
-  line-height: var(--utrecht-heading-1-line-height);
-  text-transform: var(--utrecht-heading-1-text-transform, inherit);
-  color: var(--utrecht-heading-1-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-1--distanced {
-  margin-block-start: var(--utrecht-heading-1-margin-block-start);
-  margin-block-end: var(--utrecht-heading-1-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-2 {
-  font-family: var(--utrecht-heading-2-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-2-font-size);
-  font-weight: var(--utrecht-heading-2-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-2-letter-spacing);
-  line-height: var(--utrecht-heading-2-line-height);
-  text-transform: var(--utrecht-heading-2-text-transform, inherit);
-  color: var(--utrecht-heading-2-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-2--distanced {
-  margin-block-start: var(--utrecht-heading-2-margin-block-start);
-  margin-block-end: var(--utrecht-heading-2-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-3 {
-  font-family: var(--utrecht-heading-3-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-3-font-size);
-  font-weight: var(--utrecht-heading-3-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-3-letter-spacing);
-  line-height: var(--utrecht-heading-3-line-height);
-  text-transform: var(--utrecht-heading-3-text-transform, inherit);
-  color: var(--utrecht-heading-3-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-3--distanced {
-  margin-block-start: var(--utrecht-heading-3-margin-block-start);
-  margin-block-end: var(--utrecht-heading-3-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-4 {
-  font-family: var(--utrecht-heading-4-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-4-font-size);
-  font-weight: var(--utrecht-heading-4-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-4-letter-spacing);
-  line-height: var(--utrecht-heading-4-line-height);
-  text-transform: var(--utrecht-heading-4-text-transform, inherit);
-  color: var(--utrecht-heading-4-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-4--distanced {
-  margin-block-start: var(--utrecht-heading-4-margin-block-start);
-  margin-block-end: var(--utrecht-heading-4-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-5 {
-  font-family: var(--utrecht-heading-5-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-5-font-size);
-  font-weight: var(--utrecht-heading-5-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-5-letter-spacing);
-  line-height: var(--utrecht-heading-5-line-height);
-  text-transform: var(--utrecht-heading-5-text-transform, inherit);
-  color: var(--utrecht-heading-5-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-5--distanced {
-  margin-block-start: var(--utrecht-heading-5-margin-block-start);
-  margin-block-end: var(--utrecht-heading-5-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-heading-6 {
-  font-family: var(--utrecht-heading-6-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
-  font-size: var(--utrecht-heading-6-font-size);
-  font-weight: var(--utrecht-heading-6-font-weight, var(--utrecht-heading-font-weight, bold));
-  letter-spacing: var(--utrecht-heading-6-letter-spacing);
-  line-height: var(--utrecht-heading-6-line-height);
-  text-transform: var(--utrecht-heading-6-text-transform, inherit);
-  color: var(--utrecht-heading-6-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
-}
-
-.utrecht-heading-6--distanced {
-  margin-block-start: var(--utrecht-heading-6-margin-block-start);
-  margin-block-end: var(--utrecht-heading-6-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-link {
-  text-decoration: var(--utrecht-link-text-decoration, underline);
-  color: var(--utrecht-link-color, blue);
-}
-
-.utrecht-link:visited,
-.utrecht-link--visited {
-  color: var(--utrecht-link-visited-color, var(--utrecht-link-color));
-}
-
-.utrecht-link:hover,
-.utrecht-link--hover {
-  color: var(--utrecht-link-hover-color, var(--utrecht-link-color));
-  text-decoration: var(--utrecht-link-hover-text-decoration, var(--utrecht-link-text-decoration, underline));
-}
-
-.utrecht-link:active,
-.utrecht-link--active {
-  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
-}
-
-.utrecht-link:focus,
-.utrecht-link--focus {
-  color: var(--utrecht-link-focus-color, var(--utrecht-link-color));
-  text-decoration: var(--utrecht-link-focus-text-decoration, var(--utrecht-link-text-decoration, underline));
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-/* stylelint-disable-next-line block-no-empty */
-.utrecht-link--telephone {
-  white-space: nowrap;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-mapcontrolbutton {
-  color: var(--utrecht-mapcontrolbutton-color);
-  border-color: var(--utrecht-mapcontrolbutton-border-color);
-  background-color: var(--utrecht-mapcontrolbutton-background-color);
-  border-radius: var(--utrecht-mapcontrolbutton-border-radius);
-  border-width: var(--utrecht-mapcontrolbutton-border-width);
-  border-style: var(--utrecht-mapcontrolbutton-border-style);
-  width: var(--utrecht-mapcontrolbutton-width);
-  height: var(--utrecht-mapcontrolbutton-height);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-.utrecht-mapcontrolbutton .utrecht-mapcontrolbutton-polygon {
-  fill: var(--utrecht-mapcontrolbutton-color);
-}
-
-.utrecht-mapcontrolbutton:disabled,
-.utrecht-mapcontrolbutton--disabled {
-  color: var(--utrecht-mapcontrolbutton-disabled-color);
-  background-color: var(--utrecht-mapcontrolbutton-disabled-background-color);
-  border-color: var(--utrecht-mapcontrolbutton-disabled-border-color);
-}
-
-.utrecht-mapcontrolbutton--disabled .utrecht-mapcontrolbutton-polygon {
-  fill: var(--utrecht-mapcontrolbutton-disabled-color);
-}
-
-.utrecht-mapcontrolbutton--focus,
-.utrecht-mapcontrolbutton:not(.utrecht-mapcontrolbutton--disabled):focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-.utrecht-mapcontrolbutton--focus .utrecht-mapcontrolbutton-polygon {
-  fill: var(--utrecht-mapcontrolbutton-focus-color, var(--utrecht-mapcontrolbutton-color));
-}
-
-.utrecht-mapcontrolbutton--hover:not(:disabled),
-.utrecht-mapcontrolbutton:hover:not(:disabled):not(.utrecht-mapcontrolbutton--disabled) {
-  color: var(--utrecht-mapcontrolbutton-color);
-  background-color: var(--utrecht-mapcontrolbutton-hover-background-color);
-}
-
-.utrecht-mapcontrolbutton--hover .utrecht-mapcontrolbutton-polygon {
-  fill: var(--utrecht-mapcontrolbutton-color);
-}
-
-.utrecht-menulijst {
-  border-top: var(--utrecht-border-width-md) solid var(--utrecht-color-grey-90);
-  border-bottom: var(--utrecht-border-width-md) solid var(--utrecht-color-grey-90);
-  font-family: var(--document-font-family);
-  padding-block-start: var(--utrecht-space-block-sm);
-  padding-block-end: var(--utrecht-space-block-sm);
-  padding-inline-start: 0;
-}
-
-.utrecht-menulijst__item {
-  margin-block-start: var(--utrecht-space-block-sm);
-  margin-block-end: var(--utrecht-space-block-sm);
-  list-style: none;
-}
-
-.utrecht-menulijst__item a:link {
-  display: block;
-  color: var(--utrecht-menulijst-item-color, var(--utrecht-link-color, blue));
-  font-weight: var(--utrecht-typography-weight-scale-bold-font-weight);
-  background-image: url("./pijltje.svg");
-  background-repeat: no-repeat;
-  background-position: 0 0.25em;
-  padding-inline-start: var(--utrecht-space-block-md);
-  text-decoration: none;
-}
-
-.utrecht-menulijst__item a:hover {
-  color: var(--utrecht-menulijst-item-hover-color, var(--utrecht-link-hover-color, red));
-}
-
-.utrecht-menulijst__link--focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 A Herring
- */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-navhtml {
-  font-family: var(--utrecht-font-family-sans-serif);
-}
-
-.utrecht-sidenav {
-  padding-block-start: 0;
-  padding-block-end: 0;
-  margin-block-start: 0;
-  margin-block-end: 0;
-  width: 13rem;
-  border-block-start: 1px solid var(--utrecht-color-grey-80);
-  border-block-end: 1px solid var(--utrecht-color-grey-80);
-}
-
-.utrecht-sidenav__list {
-  padding-block-start: 0;
-  padding-block-end: 0;
-  margin-block-start: 0.2rem;
-  margin-block-end: 0;
-  padding-inline-start: 0;
-}
-
-.utrecht-sidenav__list ul {
-  padding-block-start: 0;
-  padding-block-end: 0;
-  margin-block-end: 0;
-  padding-inline-start: 1.2rem;
-}
-
-.utrecht-sidenav__item,
-.utrecht-sidenav__sibling__item {
-  list-style: none;
-  position: relative;
-  margin-inline-start: 0;
-}
-
-.utrecht-sidenav__item:last-child {
-  border-block-end: none;
-}
-
-/*draw the li item box bottom line*/
-.utrecht-sidenav__item span:not(.utrecht-sidenav__item:last-child span, .utrecht-sidenav__item--has-children span:first-of-type) {
-  display: block;
-  border-block-end: 1px solid var(--utrecht-color-grey-80);
-  margin-inline-start: var(--utrecht-space-inline-sm);
-}
-
-/*Remove bottom padding form first item in list with children*/
-.utrecht-sidenav__item .utrecht-sidenav__link--has-children {
-  padding-block-end: 0;
-}
-
-.utrecht-sidenav__child__item {
-  list-style: none;
-}
-
-.utrecht-sidenav__link,
-.utrecht-sidenav__link--sibling {
-  display: block;
-  color: var(--utrecht-sidenav-link-color, var(--utrecht-link-color, blue));
-  padding-block-start: var(--utrecht-space-block-xs);
-  padding-block-end: var(--utrecht-space-block-xs);
-  padding-inline-start: var(--utrecht-space-inline-lg);
-  padding-inline-end: var(--utrecht-space-inline-3xs);
-  margin-inline-start: 0;
-  text-decoration: none;
-}
-
-/*How to select the parent of the nestsed UL to remove the bottom padding of te link item*/
-.utrecht-sidenav__link--child,
-.utrecht-sidenav__link--child--current {
-  display: block;
-  color: var(--utrecht-sidenav-link-color, var(--utrecht-link-color, blue));
-  text-decoration: none;
-  padding-block-start: var(--utrecht-space-block-2xs);
-  padding-block-end: var(--utrecht-space-block-2xs);
-  padding-inline-start: var(--utrecht-space-inline-lg);
-  padding-inline-end: var(--utrecht-space-inline-3xs);
-  margin-block-start: 0;
-  margin-block-end: 0;
-}
-
-/*Dot for link with siblings */
-.utrecht-sidenav__link::before,
-.utrecht-sidenav__link--sibling::before,
-.utrecht-sidenav__item:last-child .utrecht-sidenav__link--current::before {
-  overflow: hidden;
-  position: absolute;
-  top: 20px;
-  /*Hard value?*/
-  transform: translateY(-50%) translateX(-2.5ch);
-  content: "";
-  width: 8px;
-  height: 8px;
-  border-radius: 100%;
-  z-index: 10;
-  box-shadow: 0 0 2px 2px #fff;
-  /*Make var*/
-}
-
-.utrecht-sidenav__link::before,
-.utrecht-sidenav__link--sibling::before {
-  background-color: var(--utrecht-sidenav-item-marker-color);
-}
-
-.utrecht-sidenav__link::before,
-.utrecht-sidenav__link--sibling::before {
-  left: 26px;
-}
-
-/*Little fix to move the dot to the right*/
-.utrecht-sidenav__link--current::before {
-  left: 27px;
-}
-
-/* Hover layout for mousover on sidenav__link */
-.utrecht-sidenav__link:hover::before,
-.utrecht-sidenav__link--sibling:hover::before {
-  background-color: var(--utrecht-sidenav-link-hover-color);
-}
-
-.utrecht-sidenav__item a:hover {
-  color: var(--utrecht-sidenav-link-hover-color, var(--utrecht-link-hover-color, red));
-  text-decoration: underline;
-}
-
-.utrecht-sidenav__item--current {
-  color: var(--utrecht-sidenav-item-hover-color, var(--utrecht-link-hover-color, red));
-}
-
-/* Draw metro connection lines on sidenav link items */
-.utrecht-sidenav__link::after,
-.utrecht-sidenav__item:last-child .utrecht-sidenav__link::after {
-  display: block;
-  content: "";
-  overflow: hidden;
-  width: 3px;
-  background: var(--utrecht-sidenav-item-marker-color);
-  position: absolute;
-  left: 3px;
-  top: -22px;
-  /*  min-height: 100%;
-  height: calc(100% + 2px);*/
-  bottom: 0;
-  z-index: 5;
-}
-
-/* Draw short metro connection lines on sidenav child link items */
-.utrecht-sidenav__item:last-child .utrecht-sidenav__link::after,
-.utrecht-sidenav__link--current::after,
-.utrecht-sidenav__item--has-children a::after {
-  min-height: 38px;
-  height: calc(38px + 2px);
-}
-
-/* Remove first metro line in listing*/
-.utrecht-sidenav__item:first-child .utrecht-sidenav__link::after {
-  content: "";
-  display: none;
-}
-
-/* Make current link bold */
-.utrecht-sidenav__link--current,
-.utrecht-sidenav__link--child--current {
-  font-weight: var(--utrecht-typography-weight-scale-bold-font-weight);
-}
-
-.utrecht-sidenav__list--child {
-  margin-block-start: 0;
-  margin-block-end: 0;
-  padding-block-start: 0;
-  padding-block-end: 0;
-  padding-inline-start: 1.4rem;
-  padding-inline-end: 0;
-}
-
-.utrecht-sidenav__item--child {
-  list-style: none;
-  position: relative;
-  border: none;
-}
-
-/*No last border on child item*/
-.utrecht-sidenav__item--child:last-child {
-  border: none;
-}
-
-/* Add dot bullets on child links */
-.utrecht-sidenav__link--child::before,
-.utrecht-sidenav__link--child--current::before {
-  overflow: hidden;
-  position: absolute;
-  top: 16px;
-  left: 1.2rem;
-  transform: translateY(-50%) translateX(-19.5px);
-  content: "";
-  width: 4px;
-  height: 4px;
-  border-radius: 100%;
-  border: 2px solid var(--utrecht-sidenav-link-color);
-  z-index: 10;
-}
-
-.utrecht-sidenav__link--child::before {
-  background-color: transparent;
-}
-
-/* Make current marker dots bold */
-.utrecht-sidenav__link--current::before,
-.utrecht-sidenav__link--child--current::before {
-  background-color: var(--utrecht-sidenav-link-hover-color);
-}
-
-/* Hover layout for mousover on child__link */
-.utrecht-sidenav__link--child:hover::before {
-  background-color: var(--utrecht-sidenav-link-hover-color);
-  border: 2px solid var(--utrecht-sidenav-link-hover-color);
-}
-
-/* remove :after lines in child and sibling links */
-.utrecht-sidenav__item--child:first-child .utrecht-sidenav__link--child--current::after,
-.utrecht-sidenav__link--child::after,
-.utrecht-sidenav__item .utrecht-sidenav__item--child .utrecht-sidenav__link--child::after,
-.utrecht-sidenav__item .utrecht-sidenav__link--sibling::after,
-.utrecht-sidenav__item--sibling:last-child .utrecht-sidenav__link--sibling::after {
-  display: none;
-}
-
-.utrecht-sidenav__link:focus,
-.utrecht-sidenav__link--focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 A Herring
- */
-.utrecht-navhtml {
-  font-family: var(--utrecht-font-family-sans-serif);
-}
-
-.utrecht-topnav__list {
-  list-style: none;
-  list-style-image: none;
-  overflow: visible;
-  display: flex;
-  justify-content: space-between;
-  background-color: var(--utrecht-topnav-list-background-color);
-  padding-inline-start: 0;
-  padding-inline-end: 0;
-  padding-block-start: 0;
-  padding-block-end: 0;
-  margin-block-start: 0;
-  margin-block-end: 0;
-}
-
-.utrecht-topnav__item {
-  flex: 1 0 auto;
-  border-inline-end: 1px solid var(--utrecht-topnav-list-border-color);
-  text-align: center;
-  margin-inline-start: 0;
-}
-
-.utrecht-topnav__item li:first-child {
-  border-inline-start: 1px solid var(--utrecht-topnav-list-border-color);
-  padding-inline-start: 0;
-}
-
-.utrecht-topnav__link {
-  color: var(--utrecht-topnav-link-color);
-  text-decoration: none;
-  display: block;
-  padding-block-start: 1rem;
-  padding-block-end: 1rem;
-}
-
-.utrecht-topnav__link:hover {
-  text-decoration: underline;
-  background-color: var(--utrecht-topnav-link-hover-background-color);
-  color: var(--utrecht-topnav-link-color);
-}
-
-.utrecht-topnav__link--current {
-  text-decoration: underline;
-  background-color: var(--utrecht-topnav-list-background-active);
-}
-
-.utrecht-topnav__link:focus,
-.utrecht-topnav__link--focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-  color: var(--utrecht-topnav-link-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 A Herring
- */
-.utrecht-navhtml {
-  font-family: var(--utrecht-font-family-sans-serif);
-}
-
-.utrecht-topnav__list {
-  list-style: none;
-  list-style-image: none;
-  overflow: visible;
-  display: flex;
-  justify-content: space-between;
-  background-color: var(--utrecht-topnav-list-background-color);
-  padding-inline-start: 0;
-  padding-inline-end: 0;
-  padding-block-start: 0;
-  padding-block-end: 0;
-  margin-block-start: 0;
-  margin-block-end: 0;
-}
-
-.utrecht-topnav__item {
-  flex: 1 0 auto;
-  border-inline-end: 1px solid var(--utrecht-topnav-list-border-color);
-  text-align: center;
-  margin-inline-start: 0;
-}
-
-.utrecht-topnav__item li:first-child {
-  border-inline-start: 1px solid var(--utrecht-topnav-list-border-color);
-  padding-inline-start: 0;
-}
-
-.utrecht-topnav__link {
-  color: var(--utrecht-topnav-link-color);
-  text-decoration: none;
-  display: block;
-  padding-block-start: 1rem;
-  padding-block-end: 1rem;
-}
-
-.utrecht-topnav__link:hover {
-  text-decoration: underline;
-  background-color: var(--utrecht-topnav-link-hover-background-color);
-  color: var(--utrecht-topnav-link-color);
-}
-
-.utrecht-topnav__link--current {
-  text-decoration: underline;
-  background-color: var(--utrecht-topnav-list-background-active);
-}
-
-.utrecht-topnav__link--focus {
-  outline: 2px var(--utrecht-topnav-link-focus-border-type) var(--utrecht-topnav-link-focus-outline-color);
-  color: var(--utrecht-topnav-link-focus-color, var(--utrecht-topnav-link-color));
-  /*-webkit-box-shadow: 0 0 0 2px var(--utrecht-link-focus-box-shadow-color);*/
-  box-shadow: 0 0 0 2px var(--utrecht-topnav-link-focus-box-shadow-color);
-  outline-offset: 0;
-  text-decoration: var(--utrecht-topnav-link-focus-text-decoration, var(--utrecht-topnav-link-text-decoration, underline));
-  background-color: var(--utrecht-topnav-link-focus-background-color);
-  /*#ffd633*/
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-ordered-list {
-  font-family: var(--utrecht-document-font-family, inherit);
-}
-
-.utrecht-ordered-list--distanced {
-  margin-block-end: var(--utrecht-ordered-list-margin-block-end);
-  margin-block-start: var(--utrecht-ordered-list-margin-block-start);
-}
-
-.utrecht-ordered-list__item {
-  margin-block-end: var(--utrecht-ordered-list-item-margin-block-end);
-  margin-block-start: var(--utrecht-ordered-list-item-margin-block-start);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-page-footer {
-  font-family: var(--utrecht-document-font-family);
-  font-size: var(--utrecht-document-font-size);
-  background-color: var(--utrecht-page-footer-background-color);
-  background-image: var(--utrecht-page-footer-background-image);
-  color: var(--utrecht-page-footer-color);
-  padding-block-start: var(--utrecht-page-footer-padding-block-start);
-  padding-inline-end: var(--utrecht-page-footer-padding-inline-end);
-  padding-block-end: var(--utrecht-page-footer-padding-block-end);
-  padding-inline-start: var(--utrecht-page-footer-padding-inline-start);
-  --utrecht-document-color: currentColor;
-  --utrecht-heading-color: currentColor;
-  --utrecht-link-color: currentColor;
-  --utrecht-link-focus-color: currentColor;
-  --utrecht-link-hover-color: currentColor;
-  --utrecht-link-active-color: currentColor;
-  --utrecht-link-visited-color: currentColor;
-}
-
-.utrecht-page-footer__address--reset-address {
-  /* reset <address> */
-  font-style: inherit;
-  margin-block-start: 0;
-  margin-block-end: 0;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-paragraph {
-  color: var(--utrecht-document-color, inherit);
-  font-family: var(--utrecht-paragraph-font-family, var(--utrecht-document-font-family, inherit));
-  font-size: var(--utrecht-paragraph-font-size, var(--utrecht-document-font-size, inherit));
-  font-weight: var(--utrecht-paragraph-font-weight, inherit);
-  line-height: var(--utrecht-paragraph-line-height, var(--utrecht-document-line-height, inherit));
-}
-
-.utrecht-paragraph--lead {
-  font-size: var(--utrecht-paragraph-lead-font-size, inherit);
-  font-weight: var(--utrecht-paragraph-lead-font-weight, inherit);
-  line-height: var(--utrecht-paragraph-lead-line-height, inherit);
-}
-
-.utrecht-paragraph--distanced {
-  margin-block-start: var(--utrecht-paragraph-margin-block-start);
-  margin-block-end: var(--utrecht-paragraph-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-radio-button {
-  /* reset native margin for input[type="radio"] */
-  margin-block-start: 0;
-  margin-block-end: 0;
-  margin-inline-start: 0;
-  margin-inline-end: 0;
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-search-bar {
-  --utrecht-button-border-color: var(--utrecht-search-bar-button-border-color);
-  --utrecht-button-focus-transform-scale: var(--utrecht-search-bar-hover-transform);
-  --utrecht-button-font-size: var(--utrecht-search-bar-button-font-size);
-  --utrecht-button-font-weight: var(--utrecht-search-bar-button-font-weight);
-  --utrecht-button-letter-spacing: var(--utrecht-search-bar-button-letter-spacing);
-  --utrecht-button-primary-action-background-color: var(--utrecht-search-bar-button-background-color);
-  --utrecht-button-primary-action-color: var(--utrecht-search-bar-button-color);
-  --utrecht-button-primary-action-hover-background-color: var(--utrecht-search-bar-hover-background-color);
-  --utrecht-button-text-transform: var(--utrecht-search-bar-button-text-transform);
-  --utrecht-button-primary-action-hover-background-color: var(--utrecht-searchbar-hover-background-color);
-  --utrecht-button-focus-transform-scale: var(--utrecht-searchbar-hover-background-transform);
-  --utrecht-textbox-border-color: var(--utrecht-search-bar-textbox-border-color);
-  --utrecht-textbox-padding-inline-start: var(--utrecht-search-bar-textbox-padding-inline-start);
-  --utrecht-textbox-border-bottom-width: var(--utrecht-search-bar-textbox-border-bottom-width);
-  display: flex;
-}
-
-.utrecht-search-bar__input {
-  background-image: url("./icoon-zoek-rood.svg");
-  background-position-x: var(--utrecht-search-bar-textbox-background-position-x);
-  background-position-y: var(--utrecht-search-bar-textbox-background-position-y);
-  background-repeat: no-repeat;
-  background-size: var(--utrecht-search-bar-textbox-background-size);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 The Knights Who Say NIH! B.V.
- */
-.utrecht-separator {
-  border-style: solid;
-  border-color: var(--utrecht-separator-color);
-  border-width: 0 0 var(--utrecht-separator-width) 0;
-  margin-block-start: var(--utrecht-separator-margin-block-start);
-  margin-block-end: var(--utrecht-separator-margin-block-end);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-table {
-  border-collapse: collapse;
-  width: 100%;
-}
-
-.utrecht-table--distanced {
-  margin-block-end: var(--utrecht-table-margin-block-end);
-  margin-block-start: var(--utrecht-table-margin-block-start);
-}
-
-.utrecht-table__caption {
-  font-weight: var(--utrecht-table-caption-font-weight);
-  font-family: var(--utrecht-table-caption-font-family);
-  font-size: var(--utrecht-table-caption-font-size);
-  color: var(--utrecht-table-caption-color);
-  line-height: var(--utrecht-table-caption-line-height);
-  margin-block-end: var(--utrecht-table-caption-margin-block-end);
-  text-align: var(--utrecht-table-caption-text-align, center);
-}
-
-.utrecht-table__header {
-  font-weight: var(--utrecht-table-header-font-weight);
-  color: var(--utrecht-table-header-color);
-  text-transform: var(--utrecht-table-header-text-transform);
-  vertical-align: bottom;
-}
-
-.utrecht-table__cell--last-header-row {
-  border-block-end-style: solid;
-  border-block-end-color: var(--utrecht-table-header-border-block-end-color, transparent);
-  border-block-end-width: var(--utrecht-table-header-border-block-end-width, 0);
-}
-
-.utrecht-table__body {
-  vertical-align: baseline;
-}
-
-.utrecht-table__heading {
-  font-weight: var(--utrecht-table-heading-font-weight);
-  color: var(--utrecht-table-heading-color);
-  text-transform: var(--utrecht-table-heading-text-transform);
-}
-
-.utrecht-table__cell {
-  border-block-end-style: solid;
-  border-block-end-color: var(--utrecht-table-row-border-block-end-color, transparent);
-  border-block-end-width: var(--utrecht-table-row-border-block-end-width, 0);
-  line-height: var(--utrecht-table-cell-line-height, inherit);
-  padding-inline-start: var(--utrecht-table-cell-padding-inline-start, 0);
-  padding-inline-end: var(--utrecht-table-cell-padding-inline-end, 0);
-  padding-block-start: var(--utrecht-table-cell-padding-block-start, 0);
-  padding-block-end: var(--utrecht-table-cell-padding-block-end, 0);
-  text-align: start;
-}
-
-.utrecht-table__cell--first {
-  padding-inline-start: var(--utrecht-table-row-padding-inline-start, var(--utrecht-table-cell-padding-inline-start, 0));
-}
-
-.utrecht-table__cell--last {
-  padding-inline-end: var(--utrecht-table-row-padding-inline-end, var(--utrecht-table-cell-padding-inline-end, 0));
-}
-
-.utrecht-table__cell--numeric {
-  /* stylelint-disable-next-line declaration-property-value-disallowed-list */
-  text-align: right;
-}
-
-.utrecht-table__row--alternate-odd {
-  background-color: var(--utrecht-table-row-alternate-odd-background-color);
-  color: var(--utrecht-table-row-alternate-odd-color);
-}
-
-.utrecht-table__row--alternate-even {
-  background-color: var(--utrecht-table-row-alternate-even-background-color);
-  color: var(--utrecht-table-row-alternate-even-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-textarea {
-  border-width: var(--utrecht-textarea-border-width);
-  border-bottom-width: var(--utrecht-textarea-border-bottom-width, var(--utrecht-textarea-border-width));
-  border-color: var(--utrecht-textarea-border-color);
-  border-radius: var(--utrecht-textarea-border-radius, 0);
-  border-style: solid;
-  color: var(--utrecht-textarea-color);
-  font-family: var(--utrecht-textarea-font-family);
-  font-size: var(--utrecht-textarea-font-size, 1em);
-  max-width: var(--utrecht-textarea-max-width);
-  padding-block-end: var(--utrecht-textarea-padding-block-end);
-  padding-block-start: var(--utrecht-textarea-padding-block-start);
-  padding-inline-end: var(--utrecht-textarea-padding-inline-end);
-  padding-inline-start: var(--utrecht-textarea-padding-inline-start);
-  width: 100%;
-}
-
-.utrecht-textarea--invalid, .utrecht-textarea--html-textarea:invalid, .utrecht-textarea--html-textarea[aria-invalid=true] {
-  border-color: var(--utrecht-textarea-invalid-border-color);
-  border-width: var(--utrecht-textarea-invalid-border-width);
-}
-
-.utrecht-textarea--disabled, .utrecht-textarea--html-textarea:disabled {
-  border-color: var(--utrecht-textarea-disabled-border-color);
-  color: var(--utrecht-textarea-disabled-color);
-}
-
-.utrecht-textarea--focus, .utrecht-textarea--html-textarea:focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-.utrecht-textarea--read-only, .utrecht-textarea--html-textarea:read-only {
-  border-color: var(--utrecht-textarea-read-only-border-color);
-  color: var(--utrecht-textarea-read-only-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- */
-.utrecht-textbox {
-  border-width: var(--utrecht-textbox-border-width);
-  border-bottom-width: var(--utrecht-textbox-border-bottom-width, var(--utrecht-textbox-border-width));
-  border-color: var(--utrecht-textbox-border-color);
-  border-radius: var(--utrecht-textbox-border-radius, 0);
-  border-style: solid;
-  color: var(--utrecht-textbox-color);
-  font-family: var(--utrecht-textbox-font-family);
-  font-size: var(--utrecht-textbox-font-size, 1em);
-  max-width: var(--utrecht-textbox-max-width);
-  padding-block-end: var(--utrecht-textbox-padding-block-end);
-  padding-block-start: var(--utrecht-textbox-padding-block-start);
-  padding-inline-end: var(--utrecht-textbox-padding-inline-end);
-  padding-inline-start: var(--utrecht-textbox-padding-inline-start);
-  box-sizing: border-box;
-  width: 100%;
-}
-
-.utrecht-textbox--invalid, .utrecht-textbox--html-input:invalid, .utrecht-textbox--html-input[aria-invalid=true] {
-  border-color: var(--utrecht-textbox-invalid-border-color);
-  border-width: var(--utrecht-textbox-invalid-border-width);
-}
-
-.utrecht-textbox--disabled, .utrecht-textbox--html-input:disabled {
-  border-color: var(--utrecht-textbox-disabled-border-color);
-  color: var(--utrecht-textbox-disabled-color);
-}
-
-.utrecht-textbox--focus, .utrecht-textbox--html-input:focus {
-  outline-width: var(--utrecht-focus-outline-width, 0);
-  outline-style: var(--utrecht-focus-outline-style, solid);
-  outline-color: var(--utrecht-focus-outline-color, transparent);
-  color: var(--utrecht-focus-color, inherit);
-  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
-  outline-offset: 0;
-  background-color: var(--utrecht-focus-background-color);
-}
-
-.utrecht-textbox--read-only, .utrecht-textbox--html-input:read-only {
-  border-color: var(--utrecht-textbox-read-only-border-color);
-  color: var(--utrecht-textbox-read-only-color);
-}
-
-/**
- * @license EUPL-1.2
- * Copyright (c) 2021 Robbert Broersma
- * Copyright (c) 2021 Gemeente Utrecht
- */
-.utrecht-unordered-list {
-  font-family: var(--utrecht-document-font-family, inherit);
-  font-size: var(--utrecht-document-font-size, inherit);
-  line-height: var(--utrecht-document-line-height, inherit);
-  padding-inline-start: 2ch;
-}
-
-.utrecht-unordered-list--distanced {
-  margin-block-start: var(--utrecht-unordered-list-margin-block-start, var(--utrecht-paragraph-margin-block-start));
-  margin-block-end: var(--utrecht-unordered-list-margin-block-end, var(--utrecht-paragraph-margin-block-end));
-}
-
-.utrecht-unordered-list--nested {
-  margin-inline-start: 2ch;
-  margin-block-end: 0;
-}
-
-.utrecht-unordered-list__item {
-  padding-inline-start: 1ch;
-  margin-block-start: var(--utrecht-unordered-list-item-margin-block-start);
-  margin-block-end: var(--utrecht-unordered-list-item-margin-block-end);
-}
-
-.utrecht-unordered-list__item::marker,
-.utrecht-unordered-list__marker {
-  color: var(--utrecht-unordered-list-marker-color);
-  content: "●";
-}