@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700");
@font-face {
  font-family: 'Open Sans';
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Zetta Sans';
  src: url("../../font/zetta-sans/ZettaSansDemiBold.eot");
  src: url("../../font/zetta-sans/ZettaSansDemiBold.eot?#iefix") format("embedded-opentype"), url("../../font/zetta-sans/ZettaSansDemiBold.woff") format("woff"), url("../../font/zetta-sans/ZettaSansDemiBold.svg#webfont") format("svg");
  font-weight: 600;
  font-style: normal;
}

button[type=submit],
.button-link {
  color: white;
  background-color: #24408f;
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.5);
  border-radius: 0;
  cursor: pointer;
  height: 44px;
  font-size: 22px;
  text-decoration: none;
  color: white;
  padding-left: 5ch;
  padding-right: 5ch;
  display: inline-block;
  line-height: 44px;
  font-weight: 600;
  font-size: 16px;
}

.env--dev button[type=submit], .env--dev
.button-link {
  content: "Contrast OK: 190.366";
}

/* Override default link styling by increasing specificity */
.button-link a:link,
.button-link a:visited,
.button-link a:hover,
.button-link a:link:active, .button-link:link, .button-link:visited, .button-link:link:hover, .button-link:link:active,
.page--article .button-link a:link,
.page--article .button-link a:visited,
.page--article .button-link a:hover,
.page--article .button-link a:link:active,
.page--article .button-link:link,
.page--article .button-link:visited,
.page--article .button-link:link:hover,
.page--article .button-link:link:active {
  color: white;
}

.env--dev .button-link a:link, .env--dev
.button-link a:visited, .env--dev
.button-link a:hover, .env--dev
.button-link a:link:active, .env--dev .button-link:link, .env--dev .button-link:visited, .env--dev .button-link:link:hover, .env--dev .button-link:link:active, .env--dev
.page--article .button-link a:link, .env--dev
.page--article .button-link a:visited, .env--dev
.page--article .button-link a:hover, .env--dev
.page--article .button-link a:link:active, .env--dev
.page--article .button-link:link, .env--dev
.page--article .button-link:visited, .env--dev
.page--article .button-link:link:hover, .env--dev
.page--article .button-link:link:active {
  content: "Contrast OK: 190.366";
}

.page-footer__content, .page-footer__menu, .news-page__content {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  -webkit-box-flex: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  overflow: hidden;
}

.page-footer__content > div, .page-footer__menu > div, .news-page__content > div {
  flex-direction: column;
  display: flex;
  flex: 0 1 auto;
  flex-grow: 0;
  flex-shrink: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-box-flex: 0;
  -ms-flex-direction: column;
  -ms-flex-positive: 0;
  -ms-flex: 0 1 auto;
  margin: 5px;
}

@media (max-width: 1050px) {
  .page-footer__content > div, .page-footer__menu > div, .news-page__content > div {
    float: none;
  }
}

html,
body {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

abbr {
  text-decoration: none;
}

body {
  color: #1A1A1A;
  background-color: #efeff2;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
}

.env--dev body {
  content: "Contrast OK: 213.342";
}

p {
  line-height: 25px;
}

p.nav-link a {
  line-height: 2.7rem;
}

h1, h2, h3, h4 {
  font-weight: 600;
}

u {
  text-decoration: underline;
}

main,
header,
footer,
details,
summary {
  display: block;
}

article h1,
article h2,
article h3,
article h4,
article h5,
article h6,
article .heading {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  color: #24408f;
  line-height: 2rem;
}

.env--dev article h1, .env--dev
article h2, .env--dev
article h3, .env--dev
article h4, .env--dev
article h5, .env--dev
article h6, .env--dev
article .heading {
  content: "Contrast OK: 190.366";
}

article h1 a:link,
article h1 a:visited,
article h1 a:hover,
article h1 a:active, article h1:link, article h1:link:visited, article h1:link:hover, article h1:link:active,
article h2 a:link,
article h2 a:visited,
article h2 a:hover,
article h2 a:active,
article h2:link,
article h2:link:visited,
article h2:link:hover,
article h2:link:active,
article h3 a:link,
article h3 a:visited,
article h3 a:hover,
article h3 a:active,
article h3:link,
article h3:link:visited,
article h3:link:hover,
article h3:link:active,
article h4 a:link,
article h4 a:visited,
article h4 a:hover,
article h4 a:active,
article h4:link,
article h4:link:visited,
article h4:link:hover,
article h4:link:active,
article h5 a:link,
article h5 a:visited,
article h5 a:hover,
article h5 a:active,
article h5:link,
article h5:link:visited,
article h5:link:hover,
article h5:link:active,
article h6 a:link,
article h6 a:visited,
article h6 a:hover,
article h6 a:active,
article h6:link,
article h6:link:visited,
article h6:link:hover,
article h6:link:active,
article .heading a:link,
article .heading a:visited,
article .heading a:hover,
article .heading a:active,
article .heading:link,
article .heading:link:visited,
article .heading:link:hover,
article .heading:link:active {
  color: #24408f;
}

.env--dev article h1 a:link, .env--dev
article h1 a:visited, .env--dev
article h1 a:hover, .env--dev
article h1 a:active, .env--dev article h1:link, .env--dev article h1:link:visited, .env--dev article h1:link:hover, .env--dev article h1:link:active, .env--dev
article h2 a:link, .env--dev
article h2 a:visited, .env--dev
article h2 a:hover, .env--dev
article h2 a:active, .env--dev
article h2:link, .env--dev
article h2:link:visited, .env--dev
article h2:link:hover, .env--dev
article h2:link:active, .env--dev
article h3 a:link, .env--dev
article h3 a:visited, .env--dev
article h3 a:hover, .env--dev
article h3 a:active, .env--dev
article h3:link, .env--dev
article h3:link:visited, .env--dev
article h3:link:hover, .env--dev
article h3:link:active, .env--dev
article h4 a:link, .env--dev
article h4 a:visited, .env--dev
article h4 a:hover, .env--dev
article h4 a:active, .env--dev
article h4:link, .env--dev
article h4:link:visited, .env--dev
article h4:link:hover, .env--dev
article h4:link:active, .env--dev
article h5 a:link, .env--dev
article h5 a:visited, .env--dev
article h5 a:hover, .env--dev
article h5 a:active, .env--dev
article h5:link, .env--dev
article h5:link:visited, .env--dev
article h5:link:hover, .env--dev
article h5:link:active, .env--dev
article h6 a:link, .env--dev
article h6 a:visited, .env--dev
article h6 a:hover, .env--dev
article h6 a:active, .env--dev
article h6:link, .env--dev
article h6:link:visited, .env--dev
article h6:link:hover, .env--dev
article h6:link:active, .env--dev
article .heading a:link, .env--dev
article .heading a:visited, .env--dev
article .heading a:hover, .env--dev
article .heading a:active, .env--dev
article .heading:link, .env--dev
article .heading:link:visited, .env--dev
article .heading:link:hover, .env--dev
article .heading:link:active {
  content: "Contrast OK: 190.366";
}

article h1:link,
article h1 :link,
article h2:link,
article h2 :link,
article h3:link,
article h3 :link,
article h4:link,
article h4 :link,
article h5:link,
article h5 :link,
article h6:link,
article h6 :link,
article .heading:link,
article .heading :link {
  text-decoration: none;
}

article h1:link:hover, article h1:link:focus, article h1:link:hover, article h1:link:focus,
article h2:link:hover,
article h2:link:focus,
article h2:link:hover,
article h2:link:focus,
article h3:link:hover,
article h3:link:focus,
article h3:link:hover,
article h3:link:focus,
article h4:link:hover,
article h4:link:focus,
article h4:link:hover,
article h4:link:focus,
article h5:link:hover,
article h5:link:focus,
article h5:link:hover,
article h5:link:focus,
article h6:link:hover,
article h6:link:focus,
article h6:link:hover,
article h6:link:focus,
article .heading:link:hover,
article .heading:link:focus,
article .heading:link:hover,
article .heading:link:focus {
  text-decoration: underline;
}

article P {
  margin-top: 0.3rem;
}

address {
  font-style: normal;
}

h1,
h2,
h3,
h4,
.heading--1,
.heading--2 .heading--3,
.heading--4 {
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-weight: 600;
  font-weight: bold;
}

.article h2,
.article h3,
.article h4 {
  font-size: 18px;
  font-family: inherit;
  margin-bottom: 0.5em;
}

@media (min-width: 780px) {
  .article h2,
  .article h3,
  .article h4 {
    margin-top: 2em;
  }
}

.article h2 + *,
.article h3 + *,
.article h4 + * {
  margin-top: 0.5em;
}

.page .intro {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.8rem;
  color: #612C51;
}

.page--overview .intro {
  font-size: 20px;
  color: inherit;
  font-weight: normal;
}

@media (max-width: 1049px) {
  .page--overview .page__content,
  .page--article .page__content {
    margin-left: 10px;
    margin-right: 10px;
  }
}

.page--overview .page__content .featured-cards {
  padding-left: 0;
  padding-right: 0;
}

@media (min-width: 1050px) {
  .page--article article.page__content {
    margin-left: 16.66667%;
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}

.page--article article,
.page--article aside {
  margin-bottom: 2em;
}

@media (min-width: 1050px) {
  .page--article article,
  .page--article aside {
    margin-bottom: 6em;
  }
  .page--article aside {
    flex-basis: calc(33.33333% - 10px);
    max-width: calc(33.33333% - 10px);
    margin-right: 10px;
    padding-top: 57px;
  }
}

.page--article aside h2,
.page--article aside h3,
.page--article aside h4,
.page--article aside h5,
.page--article aside h6 {
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-weight: normal;
  font-size: 20px;
}

.page--article aside h2 a,
.page--article aside h3 a,
.page--article aside h4 a,
.page--article aside h5 a,
.page--article aside h6 a {
  text-decoration: none;
}

.page--article aside .page__related-content > .heading,
.page--article aside > .heading {
  color: #24408f;
}

.env--dev .page--article aside .page__related-content > .heading, .env--dev
.page--article aside > .heading {
  content: "Contrast OK: 174.708";
}

.page--article aside .page-card h2,
.page--article aside .page-card h3,
.page--article aside .page-card h4,
.page--article aside .page-card h5,
.page--article aside .page-card h6 {
  font-size: 28px;
}

.page--article th,
.page--article td {
  text-align: left;
  vertical-align: top;
}

.page--article address {
  font-style: normal;
}

.page--article figure {
  color: #1a1a1a;
  background-color: white;
}

.env--dev .page--article figure {
  content: "Contrast OK: 229";
}

.page--article figcaption {
  color: #24408f;
  background-color: white;
  display: flex;
  justify-content: space-between;
  padding: 10px;
}

.env--dev .page--article figcaption {
  content: "Contrast OK: 190.366";
}

.page--article .figure--fill > img {
  width: 100%;
  height: 100%;
}

.page--article .figure--panorama {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.page--article .figure--panorama > img {
  width: 100%;
  max-width: 100% !important;
}

.page--article .figure__description {
  font-weight: bold;
}

.page--article .figure__author {
  color: #626262;
}

.env--dev .page--article .figure__author {
  content: "Contrast OK: 157";
}

.page--article .result--card--collection {
  margin-top: 2em;
}

.page--article .result--card--collection:first-child {
  margin-top: 0em;
}

.page--article a[rel=external]::before,
.page--article a[target=_blank]::before {
  background-image: url("/static/img/icons/icon-externallink.svg");
  background-size: 28px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 28px;
  height: 28px;
  vertical-align: -15%;
}

.page--article a:link,
.page--article a:visited,
.page--article a:hover,
.page--article a:active, .page--article:link, .page--article:link:visited, .page--article:link:hover, .page--article:link:active {
  color: #24408f;
}

.env--dev .page--article a:link, .env--dev
.page--article a:visited, .env--dev
.page--article a:hover, .env--dev
.page--article a:active, .env--dev .page--article:link, .env--dev .page--article:link:visited, .env--dev .page--article:link:hover, .env--dev .page--article:link:active {
  content: "Contrast OK: 174.708";
}

.page--news-item a[rel=external],
.page--news-item a[target=_blank] {
  font-weight: bold;
}

.page__breadcrumbs {
  margin-top: 38px;
}

.page__breadcrumbs a {
  font-weight: 600;
}

.page__breadcrumbs a a:link,
.page__breadcrumbs a a:visited,
.page__breadcrumbs a a:hover,
.page__breadcrumbs a a:link:active, .page__breadcrumbs a:link, .page__breadcrumbs a:visited, .page__breadcrumbs a:link:hover, .page__breadcrumbs a:link:active {
  color: #24408f;
}

.env--dev .page__breadcrumbs a a:link, .env--dev
.page__breadcrumbs a a:visited, .env--dev
.page__breadcrumbs a a:hover, .env--dev
.page__breadcrumbs a a:link:active, .env--dev .page__breadcrumbs a:link, .env--dev .page__breadcrumbs a:visited, .env--dev .page__breadcrumbs a:link:hover, .env--dev .page__breadcrumbs a:link:active {
  content: "Contrast OK: 174.708";
}

.page__breadcrumbs-separator {
  background-position: center center;
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: 1ch;
  margin-right: 1ch;
}

.page__breadcrumbs-separator::before {
  background-image: url("/static/img/icons/icon-rechts.svg");
  background-size: 16px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: -15%;
}

.page__breadcrumbs-label {
  border: none;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.download-button {
  color: #1a1a1a;
  background-color: white;
  background-color: white !important;
  display: inline-block;
  width: auto;
  padding: 13px 13px 13px 36px;
  line-height: 28px;
  background-position: 8px 13px;
  text-decoration: none;
}

.env--dev .download-button {
  content: "Contrast OK: 229";
}

.download-button--with-size {
  background-position: 13px 13px;
}

.download-button--title {
  color: #24408f;
  background-color: white;
  word-break: break-all;
  display: block;
  font-weight: bold;
  text-decoration: underline;
}

.env--dev .download-button--title {
  content: "Contrast OK: 190.366";
}

.download-button--size {
  color: black;
}

.download-button--icon {
  background-image: url("/static/img/icons/icon-download.svg");
  background-size: 28px;
  background-repeat: no-repeat;
}

.download-button--icon-doc {
  background-image: url("/static/img/icons/icon-download-doc.svg");
  background-size: 28px;
  background-repeat: no-repeat;
}

.download-button--icon-image {
  background-image: url("/static/img/icons/icon-download-image.svg");
  background-size: 28px;
  background-repeat: no-repeat;
}

.download-button--icon-pdf {
  background-image: url("/static/img/icons/icon-download-pdf.svg");
  background-size: 28px;
  background-repeat: no-repeat;
}

.download-button--icon-zip {
  background-image: url("/static/img/icons/icon-download-zip.svg");
  background-size: 28px;
  background-repeat: no-repeat;
}

.download-button--icon.download-button--with-size, .download-button--icon-doc.download-button--with-size, .download-button--icon-image.download-button--with-size, .download-button--icon-pdf.download-button--with-size, .download-button--icon-zip.download-button--with-size {
  padding-left: 82px;
  padding-right: 20px;
}

.download-button--icon.download-button--with-size {
  background-image: url("/static/img/icons/icon-download.svg");
  background-size: 56px;
  background-repeat: no-repeat;
}

.download-button--icon-doc.download-button--with-size {
  background-image: url("/static/img/icons/icon-download-doc.svg");
  background-size: 56px;
  background-repeat: no-repeat;
}

.download-button--icon-image.download-button--with-size {
  background-image: url("/static/img/icons/icon-download-image.svg");
  background-size: 56px;
  background-repeat: no-repeat;
}

.download-button--icon-pdf.download-button--with-size {
  background-image: url("/static/img/icons/icon-download-pdf.svg");
  background-size: 56px;
  background-repeat: no-repeat;
}

.download-button--icon-zip.download-button--with-size {
  background-image: url("/static/img/icons/icon-download-zip.svg");
  background-size: 56px;
  background-repeat: no-repeat;
}

.metadata-fields {
  border-collapse: collapse;
  margin-top: 2em;
  margin-bottom: 1em;
}

.metadata-fields th {
  font-weight: normal;
}

.metadata-fields td {
  font-weight: 600;
}

.metadata-fields th,
.metadata-fields td {
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 2em;
}

.metadata-fields tr {
  border-top: 2px solid black;
}

.metadata-fields tr:last-child {
  border-bottom: 2px solid black;
}

.environmental-notice__call-to-action {
  margin-bottom: 3em;
}

.page--news-overview h1 {
  font-size: 40px;
}

.page--news-overview h3 {
  font-size: 24px;
}

.page--news-overview h1,
.page--news-overview h2,
.page--news-overview h3 {
  font-family: "Zetta Sans", "Open Sans", sans-serif;
}

.page--complaint-page h1,
.page--index h1,
.page--project h1,
.page--publication h1,
.page--environmental-notice h1,
.page--vacancy h1,
.page--vacancies h1,
.page--sitemap h1 {
  font-size: 41px;
}

@media (min-width: 1050px) {
  .page--article,
  .page--index,
  .page--environmental-notice,
  .page--publication,
  .page--static-page,
  .page--vacancies,
  .page--subject {
    display: flex;
    justify-content: space-between;
  }
}

@media (min-width: 1050px) {
  .featured-img ~ .page .page-card--nav-links:first-child {
    margin-top: -150px;
    min-height: 365px;
  }
}

.page--overview .heading {
  color: #24408f;
}

.env--dev .page--overview .heading {
  content: "Contrast OK: 174.708";
}

@media (min-width: 780px) {
  .page--overview .page__intro {
    width: 50%;
  }
}

.page--overview .page__intro .intro {
  font-size: 1.1rem;
  line-height: 1.4rem;
}

.page--overview .page__intro h1 {
  margin-bottom: 0;
}

.page--overview .page-card .heading a:link {
  text-decoration: none;
}

.page--overview * + .featured-cards {
  margin-top: 2em;
}

.page--company h1::before {
  background-image: url("/static/img/icons/icon-bedrijven.svg");
  background-size: 2em;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 2em;
  height: 2em;
  vertical-align: -15%;
}

.page--company a.address-link {
  pointer-events: none;
}

.page--company a.address-link::before {
  background-image: url("/static/img/icons/icon-locatie.svg");
  background-size: 1em;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -15%;
}

.page--exemptions article > section {
  margin-top: 2em;
}

.page--vacancy .intro {
  color: #71a330;
  background-color: #efeff2;
}

.env--dev .page--vacancy .intro {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-#efeff2";
}

.env--dev .page--vacancy .intro::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-#efeff2";
}

.page--sitemap {
  margin-top: 38px;
}

.page--sitemap th, .page--sitemap td {
  text-align: left;
  padding-right: 2ch;
}

@media (max-width: 1049px) {
  .page--my-district aside {
    margin-left: 10px;
    margin-right: 10px;
  }
}

.page--my-district aside .result--card--collection h2 {
  color: #003b49;
  font-size: 22px;
  margin-bottom: 0;
}

.page--my-district aside .result--card--collection h3 {
  /*
                on the my-district overview page the main column with results doesn't have
                font-sizing applied to the H3 elements in de result cards
                so we default here to the browser default size
                */
  font-size: 1.17em;
}

.page-card {
  color: #1a1a1a;
  background-color: white;
  box-shadow: 1px 1px 3px rgba(120, 120, 120, 0.2);
  padding-bottom: 10px;
}

.env--dev .page-card {
  content: "Contrast OK: 229";
}

.page-card a:link,
.page-card a:visited,
.page-card a:hover,
.page-card a:link:active, .page-card:link, .page-card:visited, .page-card:link:hover, .page-card:link:active {
  color: #24408f;
}

.env--dev .page-card a:link, .env--dev
.page-card a:visited, .env--dev
.page-card a:hover, .env--dev
.page-card a:link:active, .env--dev .page-card:link, .env--dev .page-card:visited, .env--dev .page-card:link:hover, .env--dev .page-card:link:active {
  content: "Contrast OK: 190.366";
}

.page-card > * {
  margin-top: 0;
  margin-bottom: 0;
}

.page-card > h1,
.page-card > h2,
.page-card > h3,
.page-card > h4,
.page-card > h5,
.page-card > h6,
.page-card > .heading {
  padding-top: 10px;
  line-height: 1.5rem;
}

.page-card > :first-child {
  margin-top: 0;
}

.page-card--hidden-show-more {
  display: none;
}

.page-card--image-left {
  overflow: hidden;
  position: relative;
  padding-top: 0;
  padding-left: 166px;
}

.page-card--image-left .page-card__figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 166px;
  height: 166px;
}

.page-card > .image-link {
  margin: 0;
}

.page-card--small {
  width: 440px;
}

.page-card__meta {
  color: #626262;
  font-size: 14px;
}

.env--dev .page-card__meta {
  content: "Contrast OK: 157";
}

.page-card__meta--not-last {
  margin-bottom: 0px;
}

.page-card__meta ~ .page-card__meta {
  margin-top: -14px;
}

.page-card__meta > * {
  display: inline-block;
}

.page-card__meta > *:not(:last-child) {
  margin-right: 1ch;
}

@media (min-width: 1050px) {
  .page-card__meta {
    display: flex;
  }
  .page-card__meta--with-location {
    justify-content: space-between;
  }
}

.page-card__meta-label::after {
  content: ':';
}

.page-card__meta-location {
  color: #612C51;
  flex-grow: 2;
  /* icon placeholder */
  /*
    &::before {
        content: '📍 ';
    }
    */
}

.env--dev .page-card__meta-location {
  content: "Contrast OK: 175.277";
}

@media (min-width: 780px) {
  .page-card__meta-location {
    text-align: right;
  }
}

.page-card__meta-location a {
  text-decoration: none;
}

.page-card__meta-location--contains-icon .iconimg {
  width: 1em;
  height: 1em;
}

.page-card-header {
  font-size: 22px;
}

.page-card-header::after {
  content: ':';
}

.page-card-header--alert {
  color: white;
  background-color: #e35205;
}

.env--dev .page-card-header--alert {
  content: "Contrast OK: 138.423";
}

.page-card,
.page-card-header {
  margin-top: 0;
  margin-bottom: 0;
}

.page-card > *,
.page-card-header > * {
  margin-left: 15px;
  margin-right: 15px;
}

h1.page-card-header,
h2.page-card-header,
h3.page-card-header,
h4.page-card-header,
h5.page-card-header,
h6.page-card-header {
  padding: 18px 15px;
}

* ~ .page-card,
* ~ .page-card-header {
  margin-top: 10px;
}

.page-card__figure {
  margin: 0;
  width: 100%;
  position: relative;
}

.page-card__figure img {
  width: 100%;
}

.page-card--actueel {
  border-top: 10px solid #64a70b;
}

.page-card--actueel > h2,
.page-card--actueel .page-card__heading {
  color: #64a70b;
}

.page-card--afgerond {
  border-top: 10px solid #808080;
}

.page-card--afgerond > h2,
.page-card--afgerond .page-card__heading {
  color: #808080;
}

.page-card--contact {
  color: #FFF;
  background-color: #612C51;
  padding: 30px;
  text-align: center;
}

.env--dev .page-card--contact {
  content: "Contrast OK: 190.935";
}

.page-card--contact a:link,
.page-card--contact a:visited,
.page-card--contact a:hover,
.page-card--contact a:link:active, .page-card--contact:link, .page-card--contact:visited, .page-card--contact:link:hover, .page-card--contact:link:active {
  color: #FFF;
}

.env--dev .page-card--contact a:link, .env--dev
.page-card--contact a:visited, .env--dev
.page-card--contact a:hover, .env--dev
.page-card--contact a:link:active, .env--dev .page-card--contact:link, .env--dev .page-card--contact:visited, .env--dev .page-card--contact:link:hover, .env--dev .page-card--contact:link:active {
  content: "Contrast OK: 190.935";
}

.page-card--contact a[href^="tel:"]::before, .page-card--contact__tel::before {
  background-image: url("/static/img/icons/icon-tel.svg");
  background-size: 32px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 32px;
  height: 32px;
  vertical-align: -15%;
}

.page-card--contact a[href^="tel:"]::before, .page-card--contact__tel::before {
  vertical-align: -40%;
}

.page-card--contact a[href^="mailto:"], .page-card--contact__mail {
  font-size: 20px;
  text-decoration: none;
  font-weight: 600;
}

.page-card--contact a[href^="mailto:"]::before, .page-card--contact__mail::before {
  background-image: url("/static/img/icons/icon-mail.svg");
  background-size: 32px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 32px;
  height: 32px;
  vertical-align: -15%;
}

.page-card--contact a[href^="mailto:"]::before, .page-card--contact__mail::before {
  vertical-align: -40%;
}

.page-card--contact__telnr {
  font-weight: 600;
  text-decoration: underline;
}

.page-card--call-to-action {
  border-bottom: 12px solid #4e87a0;
}

.page-card--call-to-action .heading {
  color: #24408f;
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-size: 28px;
  padding-top: 18px;
}

.env--dev .page-card--call-to-action .heading {
  content: "Contrast OK: 190.366";
}

.page-card--exemption table {
  border-collapse: collapse;
  width: 100%;
}

.page-card--exemption table th {
  font-weight: normal;
}

.page-card--exemption table td {
  font-weight: 600;
}

.page-card--exemption table th,
.page-card--exemption table td {
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 2em;
}

.page-card--exemption table tr {
  border-top: 2px solid black;
}

.page-card--exemption table tr:last-child {
  border-bottom: 2px solid black;
}

.page-card--exemption table tr:last-child {
  /* The border of the table doesn't look great next to the 12px border of the card */
  border-bottom: 0;
}

.page-card--exemption > summary {
  background-image: url("/static/img/icons/icon-onder.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.page-card--exemption[open] {
  border-bottom: 12px solid #4e87a0;
}

.page-card--exemption[open] > summary {
  background-image: url("/static/img/icons/icon-boven.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.page-card--exemption summary {
  display: block;
  cursor: pointer;
  font-size: 18px;
  font-weight: bold;
  text-decoration: underline;
  padding-top: 10px;
  padding-bottom: 10px;
}

.page-card--exemption summary::-webkit-details-marker {
  display: none;
}

details.page-card--exemption {
  padding-top: 0;
  padding-bottom: 0;
}

details.page-card--exemption summary,
details.page-card--exemption .page-card__content {
  padding-top: 10px;
  padding-bottom: 10px;
}

.page-card--vacancy {
  padding-top: 0;
  padding-bottom: 16px;
}

.page-card--vacancy h3 {
  font-family: "Open Sans", sans-serif;
}

.page-card--vacancy .page-card {
  padding-top: 0;
}

.page-card--vacancy .heading {
  padding-top: 16px;
  padding-bottom: 10px;
}

.page-card--nav-links a:hover {
  color: #FFF;
  background-color: #5066a5;
  text-decoration: none;
}

.env--dev .page-card--nav-links a:hover {
  content: "Contrast OK: 152.396";
}

.page-card--news.page-card--featured-img .page-card__excerpt {
  display: none;
}

.page-card--featured-img .page-card__figure,
.page-card--subject .page-card__figure {
  height: 160px;
}

.page-card--explanation {
  background-color: #efeff2;
  border: 2px solid white;
}

.page-card--explanation .heading {
  color: #003b49;
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 0.25em;
}

.page-card--explanation .heading + * {
  margin-top: 0;
}

@media (min-width: 1050px) {
  .page-card--explanation {
    margin-top: -150px;
  }
}

.company-link {
  color: #24408f;
  background-color: white;
  box-shadow: 1px 1px 3px rgba(120, 120, 120, 0.2);
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 50px;
}

.env--dev .company-link {
  content: "Contrast OK: 190.366";
}

.company-link a:link,
.company-link a:visited,
.company-link a:hover,
.company-link a:link:active, .company-link:link, .company-link:visited, .company-link:link:hover, .company-link:link:active {
  color: #24408f;
}

.env--dev .company-link a:link, .env--dev
.company-link a:visited, .env--dev
.company-link a:hover, .env--dev
.company-link a:link:active, .env--dev .company-link:link, .env--dev .company-link:visited, .env--dev .company-link:link:hover, .env--dev .company-link:link:active {
  content: "Contrast OK: 190.366";
}

.company-link a {
  display: flex;
  width: 100%;
}

.company-link--no-icon {
  padding-left: 32px;
}

.company-link .iconimg {
  margin-top: 4px;
  margin-bottom: 4px;
  margin-left: 10px;
  margin-right: 10px;
  width: 28px;
  height: 28px;
  vertical-align: bottom;
}

.company-link + .company-link {
  margin-top: 10px;
}

.page--complaint-page {
  margin-top: 2em;
  margin-bottom: 1em;
}

@media (max-width: 1049px) {
  .page--complaint-page article.page__content {
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (min-width: 1050px) {
  .page--complaint-page article.page__content {
    margin-left: 16.66667%;
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
    margin-bottom: 50px;
  }
}

.page--complaint-page .form-row {
  margin-top: 2em;
  margin-bottom: 1em;
}

.page--complaint-page .form-row--2-col,
.page--complaint-page .form-row--4-col {
  display: flex;
  flex-direction: row;
}

.page--complaint-page .form-row--2-col .label + .label,
.page--complaint-page .form-row--4-col .label + .label {
  margin-left: 1em;
}

.page--complaint-page .form-row--2-col .label {
  width: 50%;
}

.page--complaint-page .form-row--4-col .label {
  width: 23%;
}

.page--complaint-page .form-row--4-col input {
  width: 100%;
}

.page--complaint-page ul.complaint__categories,
.page--complaint-page ul.complaint__subcategories {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  list-style: none;
}

.page--complaint-page ul.complaint__categories > li,
.page--complaint-page ul.complaint__subcategories > li {
  margin: 0;
}

.page--complaint-page summary {
  display: block;
  color: #24408f;
  display: block;
  list-style: none;
}

.page--complaint-page summary::-webkit-details-marker {
  display: none;
}

.page--complaint-page details {
  display: block;
  width: 100%;
  cursor: pointer;
}

.page--complaint-page details > summary {
  background-image: url("/static/img/icons/icon-onder.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.page--complaint-page details[open] > summary {
  background-image: url("/static/img/icons/icon-boven-wit.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.page--complaint-page details > summary::before,
.page--complaint-page details[open] > summary::before {
  content: none;
}

.complaint-received__banner {
  color: white;
  background-color: #64a70b;
  background-image: url("/static/img/icons/icon-melding-verzonden-wit.svg");
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: center top;
  font-size: 20px;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
  padding-top: 20px;
  padding-bottom: 20px;
  padding-top: 70px;
  text-align: center;
}

.env--dev .complaint-received__banner {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/white-on-#64a70b";
}

.env--dev .complaint-received__banner::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/white-on-#64a70b";
}

.complaint-received--type, .complaint-received--sender {
  font-weight: 600;
  font-style: normal;
}

.complaint__submit-buttons {
  display: flex;
  justify-content: space-around;
}

.complaint__submit-buttons button[rel='prev'] {
  background: none;
  border: none;
  color: #24408f;
  cursor: pointer;
  font-size: 16px;
  text-decoration: underline;
}

.complaint__input-longdesc {
  color: #24408f;
  background-color: #e7e7e7;
  background-image: url("/static/img/icons/icon-form-info.svg");
  background-size: 20px;
  background-repeat: no-repeat;
  padding: 1em;
  padding-left: 40px;
  background-position: 10px 18px;
}

.env--dev .complaint__input-longdesc {
  content: "Contrast OK: 166.141";
}

.complaint__category-header {
  color: #24408f;
  background-color: white;
  margin: 0;
  line-height: 50px;
  padding-left: 14px;
  padding-right: 14px;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
  margin-top: 5px;
  font-weight: 600;
  text-decoration: underline;
}

.env--dev .complaint__category-header {
  content: "Contrast OK: 190.366";
}

details[open] > .complaint__category-header {
  color: white;
  background-color: #24408f;
  margin: 0;
  line-height: 50px;
  padding-left: 14px;
  padding-right: 14px;
}

.env--dev details[open] > .complaint__category-header {
  content: "Contrast OK: 190.366";
}

.complaint__category-expand-button {
  padding: 0;
  margin: 0;
  display: inline;
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  display: flex;
  width: 100%;
  cursor: pointer;
}

.complaint__category-expand-button[aria-expanded=false] {
  background-image: url("/static/img/icons/icon-omhoog-wit.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.complaint__category-expand-button[aria-expanded=true] {
  background-image: url("/static/img/icons/icon-onder-wit.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: right center;
}

.complaint__subcategories--collapsed {
  display: none;
}

.complaint__type, .complaint__redirect {
  margin: 0;
  line-height: 50px;
  padding-left: 14px;
  padding-right: 14px;
  color: #24408f;
  background-color: #e7e7e7;
  margin-top: 2px;
  margin-bottom: 1px;
}

.env--dev .complaint__type, .env--dev .complaint__redirect {
  content: "Contrast OK: 166.141";
}

.complaint__redirect {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 1.6;
}

.complaint__type input[type=radio] {
  border: none;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.complaint__type label {
  margin: 0;
  line-height: 50px;
  padding-left: 14px;
  padding-right: 14px;
  cursor: pointer;
  background-image: url("/static/img/icons/icon-rechts.svg");
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: 98% center;
  display: flex;
}

.complaint__type label:hover {
  color: #24408f;
  background-color: white;
}

.env--dev .complaint__type label:hover {
  content: "Contrast OK: 190.366";
}

.complaint__type label > * {
  display: inline-block;
}

@media (max-width: 439px) {
  .complaint__type label {
    width: 100%;
    display: block;
    line-height: 24px;
    padding: 13px 0;
  }
  .complaint__type label div {
    margin-left: 0;
    display: block;
    margin-right: 30px;
  }
}

.complaint__subcategory-label {
  width: 30%;
}

.complaint__type-label {
  font-weight: 600;
  text-decoration: underline;
}

.complaint-form-wrapper {
  overflow: auto;
}

.complaint-form {
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

.complaint-form--long #stap2 legend a {
  margin-left: 25%;
}

.complaint-form--long #stap3 legend a {
  margin-left: 50%;
}

.complaint-form--long #stap4 legend a {
  margin-left: 75%;
}

@media (max-width: 1049px) {
  .complaint-form__fieldset-content {
    padding: 10px;
  }
}

@media (min-width: 1050px) {
  .complaint-form {
    margin-bottom: 6em;
  }
}

.complaint-form--tabbed {
  position: relative;
  margin-top: 100px;
}

.complaint-form--tabbed .complaint-form__fieldset + .complaint-form__fieldset .complaint-form__step {
  /* create the illusion of a margin with `space-between` */
  border-left: 10px solid #efeff2;
}

.complaint-form--tabbed legend a {
  position: absolute;
  top: -100px;
  height: 100px;
  left: 0;
  pointer-events: none;
}

@media (max-width: 1049px) {
  .complaint-form--tabbed .complaint__fieldset--inactive {
    display: none;
  }
}

@media (min-width: 1050px) {
  .complaint-form--tabbed legend a {
    width: 25%;
  }
  .complaint-form--tabbed #stap2 legend a {
    left: 25%;
  }
  .complaint-form--tabbed #stap3 legend a {
    left: 50%;
  }
  .complaint-form--tabbed #stap4 legend a {
    left: 75%;
  }
}

.complaint-form .complaint-form__step {
  color: #24408f;
  background-color: white;
}

.env--dev .complaint-form .complaint-form__step {
  content: "Contrast OK: 190.366";
}

.complaint-form .label--text,
.complaint-form .label--radio {
  font-weight: 600;
}

.complaint-form .label--text {
  display: flex;
  flex-direction: column-reverse;
}

.complaint-form .label--checkbox {
  display: flex;
  flex-direction: row;
}

.complaint-form textarea + label::after,
.complaint-form input[type=text] + label::after {
  content: ":";
}

.complaint-form .label--required::after,
.complaint-form .form-row input:not([type=radio]):required + label::after {
  content: ": *";
}

.complaint-form .label--invalid {
  font-weight: normal;
  color: #e35205;
}

.complaint-form > * {
  color: #1a1a1a;
  background-color: white;
  margin-left: 15%;
  margin-right: 15%;
}

.env--dev .complaint-form > * {
  content: "Contrast OK: 229";
}

.complaint-form__legend {
  padding: 0;
  display: table;
  width: 100%;
}

.complaint-form__step {
  text-decoration: none;
  width: 320px;
  max-width: 320px;
  height: 100px;
  display: flex;
  padding-top: 10px;
  padding-bottom: 10px;
  align-items: center;
  justify-content: flex-end;
  flex-direction: column;
}

.complaint-form__step-icon, .complaint-form__step-number, .complaint-form__step-title {
  display: block;
  text-align: center;
}

.complaint-form__step-title {
  font-weight: 600;
}

.complaint-form__step-icon {
  width: 40px;
  height: 40px;
  background-position: top center;
}

.complaint-form__step-icon--melding-over {
  background-image: url("/static/img/icons/icon-melding-klachtover.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset.fieldset--valid .complaint-form__step-icon--melding-over {
  background-image: url("/static/img/icons/icon-melding-klachtover-checked.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon--melding-tijd {
  background-image: url("/static/img/icons/icon-melding-tijd.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset.fieldset--valid .complaint-form__step-icon--melding-tijd {
  background-image: url("/static/img/icons/icon-melding-tijd-checked.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset:not(.fieldset--valid) + fieldset .complaint-form__step-icon--melding-tijd {
  background-image: url("/static/img/icons/icon-melding-tijd-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon--melding-locatie {
  background-image: url("/static/img/icons/icon-melding-locatie.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset.fieldset--valid .complaint-form__step-icon--melding-locatie {
  background-image: url("/static/img/icons/icon-melding-locatie-checked.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset:not(.fieldset--valid) + fieldset .complaint-form__step-icon--melding-locatie {
  background-image: url("/static/img/icons/icon-melding-locatie-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon--melding-verzonden {
  background-image: url("/static/img/icons/icon-melding-verzonden.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset.fieldset--valid .complaint-form__step-icon--melding-verzonden {
  background-image: url("/static/img/icons/icon-melding-verzonden-checked.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

fieldset:not(.fieldset--valid) + fieldset .complaint-form__step-icon--melding-verzonden {
  background-image: url("/static/img/icons/icon-melding-verzonden-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon fieldset.fieldset--invalid + fieldset .complaint-form__step {
  color: #7E5475;
  cursor: default;
}

.env--dev .complaint-form__step-icon fieldset.fieldset--invalid + fieldset .complaint-form__step {
  content: "Contrast OK: 154.68";
}

.complaint-form__step-icon fieldset.fieldset--invalid + fieldset--klachtover {
  background-image: url("/static/img/icons/icon-melding-klachtover-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon fieldset.fieldset--invalid + fieldset--melding-tijd {
  background-image: url("/static/img/icons/icon-melding-tijd-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon fieldset.fieldset--invalid + fieldset--melding-locatie {
  background-image: url("/static/img/icons/icon-melding-locatie-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form__step-icon fieldset.fieldset--invalid + fieldset--melding-verzonden {
  background-image: url("/static/img/icons/icon-melding-verzonden-disabled.svg");
  background-size: 40px;
  background-repeat: no-repeat;
}

.complaint-form--long fieldset + fieldset {
  margin-top: 2em;
  margin-bottom: 1em;
}

.complaint-form--long .complaint-form__fieldset-content {
  border: 1px solid white;
  box-sizing: border-box;
}

.complaint-form--long .complaint-form__fieldset + .complaint-form__fieldset {
  margin-top: 2em;
  margin-bottom: 1em;
}

.complaint-form--long .complaint-form__fieldset-content,
.complaint-form--long .complaint-form__step {
  color: #1a1a1a;
  background-color: white;
}

.env--dev .complaint-form--long .complaint-form__fieldset-content, .env--dev
.complaint-form--long .complaint-form__step {
  content: "Contrast OK: 229";
}

.complaint-form--tabbed .complaint__fieldset {
  position: absolute;
  display: flex;
  width: 100%;
}

.complaint-form--tabbed .complaint__fieldset .form__tab {
  color: #7E5475;
  background-color: #efeff2;
  position: absolute;
}

.env--dev .complaint-form--tabbed .complaint__fieldset .form__tab {
  content: "Contrast OK: 139.022";
}

.complaint-form--tabbed .complaint__fieldset .fieldset-content {
  border: none;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.complaint-form--tabbed .complaint__fieldset--active .form__tab {
  color: #1a1a1a;
}

.env--dev .complaint-form--tabbed .complaint__fieldset--active .form__tab {
  content: "Contrast OK: 229";
}

.complaint-form--tabbed .complaint__fieldset--active .fieldset-content {
  margin-top: 100px;
}

.complaint-form--tabbed .complaint__fieldset--inactive .complaint-form__fieldset-content {
  display: none;
}

.complaint-form--tabbed .complaint__fieldset--inactive .complaint-form__step {
  background-color: transparent;
}

@media (min-width: 1050px) {
  .complaint-form--tabbed .complaint-form__form-block, .complaint-form--tabbed .complaint-form__instructions, .complaint-form--tabbed .complaint__submit-buttons {
    margin-left: 16.66667%;
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}

.complaint-form__fieldset {
  border: 0;
  padding: 0.01em 0 0 0;
  margin: 0;
  min-width: 0;
}

body:not(:-moz-handler-blocked) .complaint-form__fieldset {
  display: table-cell;
}

.complaint-form__fieldset .phone-number {
  font-weight: 600;
  text-decoration: none;
  color: inherit;
}

.complaint-form__fieldset .matching-address {
  background-color: #efeff2;
  padding: 10px;
  background-image: url("/static/img/icons/icon-form-check.svg");
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: 10px 12px;
  padding-left: 35px;
}

.complaint-form__fieldset .now-button,
.complaint-form__fieldset input[type=text],
.complaint-form__fieldset input[type=email],
.complaint-form__fieldset input[type=date],
.complaint-form__fieldset textarea {
  border: 2px solid #24408f;
  font-size: 20px;
  font-family: "Open Sans", sans-serif;
  padding-left: 10px;
  padding-right: 10px;
  box-sizing: border-box;
  /* According to Zeplin:
            box-shadow: inset 0 4px 2px 0 rgba(0, 0, 0, 0.14);

            According to Robbert:
            */
  box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.14);
}

.complaint-form__fieldset input[type=radio],
.complaint-form__fieldset input[type=checkbox] {
  transform: scale(1.4);
}

.complaint-form__fieldset textarea {
  padding-top: 10px;
  padding-bottom: 10px;
  height: 7em;
}

.complaint-form__fieldset .now-button,
.complaint-form__fieldset input[type=text],
.complaint-form__fieldset input[type=date],
.complaint-form__fieldset input[type=email] {
  height: 56px;
  line-height: 56px;
}

.complaint-form__fieldset input[type=checkbox],
.complaint-form__fieldset input[type=radio] {
  margin: 10px;
}

.complaint-form__fieldset--hidden {
  border: none;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.complaint-form--tabbed .complaint-form__fieldset-content,
.complaint-form--long legend a, .complaint-form--long {
  color: #1a1a1a;
  background-color: white;
}

.env--dev .complaint-form--tabbed .complaint-form__fieldset-content, .env--dev
.complaint-form--long legend a, .env--dev .complaint-form--long {
  content: "Contrast OK: 229";
}

.complaint-form--submitted #stap1,
.complaint-form--submitted #stap2,
.complaint-form--submitted #stap3 {
  pointer-events: none;
}

.complaint-form .now-button {
  color: #FFF;
  background-color: #64a70b;
  box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.5);
  border: 0;
}

.env--dev .complaint-form .now-button {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#FFF-on-#64a70b";
}

.env--dev .complaint-form .now-button::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#FFF-on-#64a70b";
}

.complaint-form .form-row--time {
  display: flex;
  align-items: flex-end;
}

.complaint-form .form-row--time .input--time {
  display: flex;
}

.complaint-form .form-row--time .input--time #complaint-when-time {
  width: 95px;
}

.complaint-form .form-row--time .input--time .now-button {
  margin-left: 2ch;
  cursor: pointer;
}

.complaint-form .form-row--time > * + * {
  margin-left: 2ch;
}

#complaint-when-other ~ input {
  display: none;
}

#complaint-when-other:checked ~ input {
  display: block;
}

.homepage .complaint-call-to-action,
.complaint-call-to-action {
  margin-top: 1em;
  margin-bottom: 1em;
  width: 37ch;
  padding-right: 5ch;
  box-sizing: border-box;
  position: relative;
  background-color: transparent;
  margin: 0 !important;
  box-shadow: none !important;
}

.homepage .complaint-call-to-action .call-to-action-icon,
.complaint-call-to-action .call-to-action-icon {
  position: absolute;
  top: 10px;
  right: 0;
}

@media (max-width: 439px) {
  .homepage .complaint-call-to-action .call-to-action-icon,
  .complaint-call-to-action .call-to-action-icon {
    top: 0;
  }
}

@media (max-width: 439px) {
  .homepage .complaint-call-to-action,
  .complaint-call-to-action {
    margin: 10px 0;
    font-size: .8em;
    width: 70%;
  }
}

.homepage .complaint-call-to-action h2,
.complaint-call-to-action h2 {
  color: #71a330;
  font-family: "Open Sans", sans-serif;
  font-weight: normal;
}

.env--dev .homepage .complaint-call-to-action h2, .env--dev
.complaint-call-to-action h2 {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.env--dev .homepage .complaint-call-to-action h2::after, .env--dev
.complaint-call-to-action h2::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.homepage .complaint-call-to-action h2 a:link,
.homepage .complaint-call-to-action h2 a:visited,
.homepage .complaint-call-to-action h2 a:hover,
.homepage .complaint-call-to-action h2 a:link:active, .homepage .complaint-call-to-action h2:link, .homepage .complaint-call-to-action h2:visited, .homepage .complaint-call-to-action h2:link:hover, .homepage .complaint-call-to-action h2:link:active,
.complaint-call-to-action h2 a:link,
.complaint-call-to-action h2 a:visited,
.complaint-call-to-action h2 a:hover,
.complaint-call-to-action h2 a:link:active,
.complaint-call-to-action h2:link,
.complaint-call-to-action h2:visited,
.complaint-call-to-action h2:link:hover,
.complaint-call-to-action h2:link:active {
  color: #71a330;
}

.env--dev .homepage .complaint-call-to-action h2 a:link, .env--dev
.homepage .complaint-call-to-action h2 a:visited, .env--dev
.homepage .complaint-call-to-action h2 a:hover, .env--dev
.homepage .complaint-call-to-action h2 a:link:active, .env--dev .homepage .complaint-call-to-action h2:link, .env--dev .homepage .complaint-call-to-action h2:visited, .env--dev .homepage .complaint-call-to-action h2:link:hover, .env--dev .homepage .complaint-call-to-action h2:link:active, .env--dev
.complaint-call-to-action h2 a:link, .env--dev
.complaint-call-to-action h2 a:visited, .env--dev
.complaint-call-to-action h2 a:hover, .env--dev
.complaint-call-to-action h2 a:link:active, .env--dev
.complaint-call-to-action h2:link, .env--dev
.complaint-call-to-action h2:visited, .env--dev
.complaint-call-to-action h2:link:hover, .env--dev
.complaint-call-to-action h2:link:active {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.env--dev .homepage .complaint-call-to-action h2 a:link::after, .env--dev
.homepage .complaint-call-to-action h2 a:visited::after, .env--dev
.homepage .complaint-call-to-action h2 a:hover::after, .env--dev
.homepage .complaint-call-to-action h2 a:link:active::after, .env--dev .homepage .complaint-call-to-action h2:link::after, .env--dev .homepage .complaint-call-to-action h2:visited::after, .env--dev .homepage .complaint-call-to-action h2:link:hover::after, .env--dev .homepage .complaint-call-to-action h2:link:active::after, .env--dev
.complaint-call-to-action h2 a:link::after, .env--dev
.complaint-call-to-action h2 a:visited::after, .env--dev
.complaint-call-to-action h2 a:hover::after, .env--dev
.complaint-call-to-action h2 a:link:active::after, .env--dev
.complaint-call-to-action h2:link::after, .env--dev
.complaint-call-to-action h2:visited::after, .env--dev
.complaint-call-to-action h2:link:hover::after, .env--dev
.complaint-call-to-action h2:link:active::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.homepage .complaint-call-to-action h2 a,
.complaint-call-to-action h2 a {
  color: #71a330;
  line-height: 1.5em;
  text-decoration: none;
}

.env--dev .homepage .complaint-call-to-action h2 a, .env--dev
.complaint-call-to-action h2 a {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-#FFF";
}

.env--dev .homepage .complaint-call-to-action h2 a::after, .env--dev
.complaint-call-to-action h2 a::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-#FFF";
}

.page-footer {
  color: #1a1a1a;
  background-color: white;
}

.env--dev .page-footer {
  content: "Contrast OK: 229";
}

.page-footer .heading {
  color: #24408f;
}

.env--dev .page-footer .heading {
  content: "Contrast OK: 190.366";
}

.page-footer__content {
  padding-top: 2em;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 0 20px;
}

.page-footer__content > div:nth-of-type(1n) {
  flex-basis: calc(50% - 10px);
  max-width: calc(50% - 10px);
}

.page-footer__content > div:nth-of-type(2n) {
  flex-basis: calc(50% - 10px);
  max-width: calc(50% - 10px);
}

@media (max-width: 439px) {
  .page-footer__content {
    max-width: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .page-footer__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .page-footer__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) {
  .page-footer__content {
    max-width: 1280px;
  }
}

@media (min-width: 1500px) {
  .page-footer__content {
    max-width: 1440px;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .page-footer__content {
    width: 100%;
    padding: 0 20px;
  }
}

.page-footer .page-footer__contact {
  width: 50%;
  display: flex;
  flex-direction: column;
  margin-top: 1em;
  margin-bottom: 1em;
}

@media (min-width: 440px) and (max-width: 779px) {
  .page-footer .page-footer__contact {
    width: 100%;
  }
}

@media (max-width: 439px) {
  .page-footer .page-footer__contact {
    width: 100%;
    margin: 0;
  }
}

.page-footer__contactdetails {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  flex-grow: 0;
  flex-direction: row;
  justify-content: flex-start;
}

.page-footer__contactdetails h2 {
  margin-bottom: 0px;
}

.page-footer__contactdetails p {
  margin: 0;
  padding: 0;
}

@media (max-width: 439px) {
  .page-footer__contactdetails {
    flex-grow: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .page-footer__contactdetails {
    flex-grow: 100%;
  }
}

.page-footer__contactdetails > div {
  padding-right: 16px;
  padding-left: 0px;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
  flex-grow: 50;
  flex-direction: column;
  align-items: flex-start;
}

.page-footer__menu {
  margin-top: 1em;
  margin-bottom: 1em;
  width: 100%;
}

@media (max-width: 439px) {
  .page-footer__menu > * {
    flex-grow: 1 !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .page-footer__menu > div:nth-of-type(1n) {
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
  .page-footer__menu > div:nth-of-type(2n) {
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}

@media (min-width: 1050px) {
  .page-footer__menu > div:nth-of-type(1n) {
    flex-basis: calc(25% - 10px);
    max-width: calc(25% - 10px);
  }
  .page-footer__menu > div:nth-of-type(2n) {
    flex-basis: calc(25% - 10px);
    max-width: calc(25% - 10px);
  }
  .page-footer__menu > div:nth-of-type(3n) {
    flex-basis: calc(25% - 10px);
    max-width: calc(25% - 10px);
  }
  .page-footer__menu > div:nth-of-type(4n) {
    flex-basis: calc(25% - 10px);
    max-width: calc(25% - 10px);
  }
}

.page-footer__pictograms {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: nowrap;
  justify-content: center;
  width: 100%;
}

.page-footer__pictograms figure {
  margin: 0;
}

.page-footer__pictogrammen-bedrijven, .page-footer__pictogrammen-bewoners {
  height: 4.25em;
  width: 16em;
  vertical-align: bottom;
}

.page-footer .social-link {
  margin-left: 1em;
  margin-right: 1em;
}

.call-to-action-icon {
  height: 60px;
}

.homepage .page__content {
  margin-bottom: 2em;
}

@media (min-width: 1050px) {
  .homepage .page__content {
    margin-bottom: 6em;
  }
}

@media (max-width: 439px) {
  .homepage .featured-img {
    max-height: 35vh;
  }
}

@media (min-width: 1050px) {
  .homepage .featured-img__content {
    width: 100% !important;
  }
}

@media (max-width: 439px) {
  .homepage .featured-img__content {
    width: 80%;
    transform: none !important;
    left: 0 !important;
  }
}

.homepage .heading {
  color: #24408f;
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-weight: 600;
}

.env--dev .homepage .heading {
  content: "Contrast OK: 174.708";
}

.homepage .heading a:link,
.homepage .heading a:visited,
.homepage .heading a:hover,
.homepage .heading a:link:active, .homepage .heading:link, .homepage .heading:visited, .homepage .heading:link:hover, .homepage .heading:link:active {
  color: #24408f;
}

.env--dev .homepage .heading a:link, .env--dev
.homepage .heading a:visited, .env--dev
.homepage .heading a:hover, .env--dev
.homepage .heading a:link:active, .env--dev .homepage .heading:link, .env--dev .homepage .heading:visited, .env--dev .homepage .heading:link:hover, .env--dev .homepage .heading:link:active {
  content: "Contrast OK: 174.708";
}

.homepage .heading a:link {
  text-decoration: none;
}

.homepage .melding-maken-call-to-action {
  color: #71a330;
  background-color: transparent;
  position: relative;
  margin: 0 !important;
  box-shadow: none !important;
}

.env--dev .homepage .melding-maken-call-to-action {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.env--dev .homepage .melding-maken-call-to-action::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.homepage .melding-maken-call-to-action a:link,
.homepage .melding-maken-call-to-action a:visited,
.homepage .melding-maken-call-to-action a:hover,
.homepage .melding-maken-call-to-action a:link:active, .homepage .melding-maken-call-to-action:link, .homepage .melding-maken-call-to-action:visited, .homepage .melding-maken-call-to-action:link:hover, .homepage .melding-maken-call-to-action:link:active {
  color: #71a330;
}

.env--dev .homepage .melding-maken-call-to-action a:link, .env--dev
.homepage .melding-maken-call-to-action a:visited, .env--dev
.homepage .melding-maken-call-to-action a:hover, .env--dev
.homepage .melding-maken-call-to-action a:link:active, .env--dev .homepage .melding-maken-call-to-action:link, .env--dev .homepage .melding-maken-call-to-action:visited, .env--dev .homepage .melding-maken-call-to-action:link:hover, .env--dev .homepage .melding-maken-call-to-action:link:active {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.env--dev .homepage .melding-maken-call-to-action a:link::after, .env--dev
.homepage .melding-maken-call-to-action a:visited::after, .env--dev
.homepage .melding-maken-call-to-action a:hover::after, .env--dev
.homepage .melding-maken-call-to-action a:link:active::after, .env--dev .homepage .melding-maken-call-to-action:link::after, .env--dev .homepage .melding-maken-call-to-action:visited::after, .env--dev .homepage .melding-maken-call-to-action:link:hover::after, .env--dev .homepage .melding-maken-call-to-action:link:active::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/#71a330-on-white";
}

.homepage .melding-maken-call-to-action,
.homepage .melding-maken-call-to-action h2 {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  width: 22ch;
  margin: 15px 40px;
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage .melding-maken-call-to-action,
  .homepage .melding-maken-call-to-action h2 {
    width: 40%;
    margin-left: 20px;
  }
}

@media (max-width: 439px) {
  .homepage .melding-maken-call-to-action,
  .homepage .melding-maken-call-to-action h2 {
    font-size: 1em;
    margin: 0 15px;
  }
}

.homepage .melding-maken-call-to-action .call-to-action-icon {
  width: auto;
  opacity: 100;
  position: absolute;
  right: 33.33%;
  top: 15px;
}

@media (max-width: 439px) {
  .homepage .melding-maken-call-to-action .call-to-action-icon {
    top: 0;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage .melding-maken-call-to-action .call-to-action-icon {
    left: 40%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage .homepage--featured {
    display: flex;
    flex-direction: column;
  }
  .homepage .featured-cards .page-card {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    box-sizing: border-box;
    margin: 0 0 10px 10px;
  }
}

@media (min-width: 780px) {
  .homepage .featured-cards .page-card {
    width: calc(33.33333% - 15px);
    margin: 0 0 15px 15px;
  }
}

@media (max-width: 439px) {
  .homepage .homepage--features {
    display: flex;
    flex-direction: column;
  }
  .homepage .page-card {
    display: flex;
    flex-direction: column;
    width: calc(100% - 10px);
    word-break: break-all;
  }
  .homepage .page-card--link-list h2 {
    font-size: 24px;
  }
  .homepage .homepage--featured {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .homepage .featured-cards--subjects .page-card h3 {
    padding-top: 0;
    margin-top: 20px;
  }
  .homepage .heading {
    width: auto;
  }
}

.homepage__quicklinks {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.homepage__quicklinks .small-link-lists {
  display: none;
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage__quicklinks .small-link-lists {
    display: block;
    position: relative;
    width: calc(50% - 10px);
    box-sizing: border-box;
    margin-left: 10px;
  }
  .homepage__quicklinks .small-link-lists .page-card--bedrijven .heading {
    right: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--bewoners .heading {
    left: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list {
    display: block;
    width: 100%;
    padding-bottom: 0;
    margin-top: 0;
    margin-left: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading {
    position: absolute;
    top: 10px;
    width: 50%;
    height: 40px;
    margin: 0;
    padding: 10px 20px;
    background-color: #24408f;
    color: #fff;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading a {
    color: white;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading a::before {
    content: none;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .content {
    margin-top: 50px;
    display: none;
    padding-bottom: 10px;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list p {
    line-height: 35px;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .heading {
    background-color: #fff;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .heading a {
    color: #24408f;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .content {
    display: block;
  }
}

@media (max-width: 439px) {
  .homepage__quicklinks .small-link-lists {
    display: block;
    position: relative;
    width: calc(100% - 0px);
    box-sizing: border-box;
    margin-left: 0px;
  }
  .homepage__quicklinks .small-link-lists .page-card--bedrijven .heading {
    right: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--bewoners .heading {
    left: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list {
    display: block;
    width: 100%;
    padding-bottom: 0;
    margin-top: 0;
    margin-left: 0;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading {
    position: absolute;
    top: 10px;
    width: 50%;
    height: 40px;
    margin: 0;
    padding: 10px 20px;
    background-color: #24408f;
    color: #fff;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading a {
    color: white;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .heading a::before {
    content: none;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list .content {
    margin-top: 50px;
    display: none;
    padding-bottom: 10px;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list p {
    line-height: 35px;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .heading {
    background-color: #fff;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .heading a {
    color: #24408f;
  }
  .homepage__quicklinks .small-link-lists .page-card--link-list.active .content {
    display: block;
  }
}

.homepage__quicklinks .page-card {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

@media (max-width: 439px) {
  .homepage__quicklinks .page-card {
    width: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage__quicklinks .page-card {
    width: calc(50% - 10px);
    margin-left: 10px;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .homepage__quicklinks .page-card {
    width: calc(33.33333% - 15px);
    margin-left: 15px;
  }
}

@media (min-width: 1050px) {
  .homepage__quicklinks .page-card {
    width: calc(33.33333% - 15px);
    margin-left: 15px;
  }
}

.homepage__quicklinks .page-card--mijn-wijk {
  position: relative;
  background-color: black;
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url("https://storage.googleapis.com/dcmr-acc-assets/assets/banner-mijnwijk.png");
  background-repeat: no-repeat;
  background-size: cover, cover;
  padding-left: 15px;
  padding-right: 15px;
}

.homepage__quicklinks .page-card--mijn-wijk > * {
  margin-left: 0;
  margin-right: 0;
}

.homepage__quicklinks .page-card--mijn-wijk,
.homepage__quicklinks .page-card--mijn-wijk h2 {
  color: white;
}

.env--dev .homepage__quicklinks .page-card--mijn-wijk, .env--dev
.homepage__quicklinks .page-card--mijn-wijk h2 {
  content: "Contrast OK: 255";
}

.homepage__quicklinks .page-card--mijn-wijk .heading {
  padding-top: 10px;
  font-size: 1.5em;
  font-weight: normal;
  line-height: 1.2em;
  margin-top: 10px;
}

.homepage__quicklinks .page-card--mijn-wijk .overlay {
  background-image: linear-gradient(-26deg, rgba(26, 26, 26, 0), rgba(26, 26, 26, 0.44) 39%, rgba(26, 26, 26, 0.63) 60%, #1a1a1a);
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.homepage__quicklinks .page-card--mijn-wijk form {
  position: relative;
  z-index: 2;
}

.homepage__quicklinks .page-card--mijn-wijk label {
  display: block;
  font-family: "Zetta Sans", "Open Sans", sans-serif;
}

.homepage__quicklinks .page-card--mijn-wijk input {
  color: #24408f;
  margin-top: 10px;
  margin-bottom: 5px;
  border-radius: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  height: 50px;
  padding: 0 10px;
  width: 100%;
}

.env--dev .homepage__quicklinks .page-card--mijn-wijk input {
  content: "Contrast OK: 174.708";
}

@media (min-width: 1050px) {
  .homepage__quicklinks .page-card--mijn-wijk input {
    max-width: 60%;
  }
}

.homepage__quicklinks .page-card--mijn-wijk input[type=submit] {
  visibility: hidden;
  color: white;
  background-color: #24408f;
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.5);
  border-radius: 0;
  cursor: pointer;
  height: 50px;
  font-size: 25px;
  text-decoration: none;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 600;
  opacity: 0;
  transition: opacity 0.35s ease;
}

.env--dev .homepage__quicklinks .page-card--mijn-wijk input[type=submit] {
  content: "Contrast OK: 190.366";
}

.homepage__quicklinks .page-card--mijn-wijk input[type=submit]:hover {
  cursor: pointer;
}

.homepage__quicklinks .page-card--mijn-wijk input[type=submit].is-visible {
  visibility: visible;
  opacity: 1;
}

.homepage__quicklinks .page-card--mijn-wijk .mijn-wijk-login {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 100;
}

.homepage__quicklinks .page-card--bedrijven {
  background-color: white;
  background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url("/static/img/icons/pictogrammen-bedrijven-grijs.svg");
  background-repeat: no-repeat;
  background-size: cover, cover;
  background-position: bottom center;
  background-size: 66%;
}

.homepage__quicklinks .page-card--bewoners {
  background-color: white;
  background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url("/static/img/icons/pictogrammen-bewoners-grijs.svg");
  background-repeat: no-repeat;
  background-size: cover, cover;
  background-position: bottom center;
  background-size: 66%;
}

@media (min-width: 440px) and (max-width: 779px) {
  .homepage__quicklinks .page-card--link-list {
    display: none;
  }
}

@media (max-width: 439px) {
  .homepage__quicklinks .page-card--link-list {
    display: none;
  }
}

.homepage__organisation h2,
.homepage--featured h2 {
  font-size: 41px;
  margin-top: 1em;
  margin-bottom: 0.5em;
  text-align: center;
}

.homepage__organisation .page-card,
.homepage--featured .page-card {
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
}

@media (min-width: 1050px) {
  .homepage__organisation .page-card,
  .homepage--featured .page-card {
    width: 75%;
  }
}

.homepage__organisation .page-card h3,
.homepage--featured .page-card h3 {
  color: #24408f;
  font-size: 20px;
  font-family: "Zetta Sans", "Open Sans", sans-serif;
}

.env--dev .homepage__organisation .page-card h3, .env--dev
.homepage--featured .page-card h3 {
  content: "Contrast OK: 190.366";
}

.homepage__organisation .page-card p:last-child a,
.homepage--featured .page-card p:last-child a {
  text-decoration: none;
}

.homepage__organisation .page-card p:last-child a::before,
.homepage--featured .page-card p:last-child a::before {
  background-image: url("/static/img/icons/icon-rechts.svg");
  background-size: 16px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: -15%;
}

.homepage__organisation .page-card-tabs {
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

@media (min-width: 1050px) {
  .homepage__organisation .page-card-tabs {
    width: 75%;
  }
}

@media (max-width: 1049px) {
  .homepage__organisation .page-card-tabs {
    margin: 0 10px;
  }
}

@media (max-width: 439px) {
  .homepage__organisation .page-card-tabs {
    display: none;
  }
}

.homepage__organisation .page-card-tabs .page-card-tabs--tab {
  padding: 13px 15px;
  min-height: 50px;
  cursor: pointer;
  flex: 1;
  color: #FFF;
  background-color: #24408f;
}

.env--dev .homepage__organisation .page-card-tabs .page-card-tabs--tab {
  content: "Contrast OK: 190.366";
}

.homepage__organisation .page-card-tabs .page-card-tabs--tab.active {
  color: #24408f;
  background-color: #FFF;
}

.env--dev .homepage__organisation .page-card-tabs .page-card-tabs--tab.active {
  content: "Contrast OK: 190.366";
}

.homepage__organisation .page-card-tabs .page-card-tabs--tab h3 {
  margin: 0;
}

.homepage__organisation .page-card-tabs .page-card-tabs--tab + .page-card-tabs--tab {
  margin-left: 2px;
}

.homepage__organisation .page-card {
  margin-top: 0;
  display: none;
  box-shadow: none;
}

@media (max-width: 1049px) {
  .homepage__organisation .page-card {
    margin: 0 10px;
    width: calc(100% - 20px);
  }
}

.homepage__organisation .page-card.active {
  display: block;
}

.homepage__organisation .page-card > div {
  background-color: white;
}

.homepage__organisation .page-card > div h2, .homepage__organisation .page-card > div h3, .homepage__organisation .page-card > div h4 {
  margin: 0;
  padding-top: 1em;
}

.homepage__organisation .page-card > div p {
  margin: 0;
  padding: 1em 0;
}

.homepage__organisation .page-card-list-mobile {
  display: none;
  margin: 0 10px;
  margin-top: 2px;
}

@media (max-width: 439px) {
  .homepage__organisation .page-card-list-mobile {
    display: block;
  }
}

.homepage__organisation .page-card-list-mobile > h3 {
  color: #24408f;
  background-color: #FFF;
  padding: 13px 15px;
  min-height: 50px;
  margin: 0;
  right: 20px;
  background-image: url("/static/img/icons/icon-onder.svg");
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: 98% center;
}

.env--dev .homepage__organisation .page-card-list-mobile > h3 {
  content: "Contrast OK: 190.366";
}

.homepage__organisation .page-card-list-mobile.active > h3 {
  background-image: url("/static/img/icons/icon-boven.svg");
  background-size: 20px;
  background-repeat: no-repeat;
}

@media (min-width: 442px) {
  .homepage__quicklinks,
  .featured-cards {
    padding-left: 10px;
    padding-right: 10px;
    margin-left: -10px;
  }
  .featured-cards {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .featured-cards .page-card h1,
  .featured-cards .page-card h2,
  .featured-cards .page-card h3,
  .featured-cards .page-card h4,
  .featured-cards .page-card h5,
  .featured-cards .page-card h6,
  .featured-cards .page-card .heading {
    font-family: "Zetta Sans", "Open Sans", sans-serif;
    margin-top: 0;
  }
}

@media (min-width: 780px) {
  .homepage__quicklinks,
  .featured-cards {
    padding-left: 15px;
    padding-right: 15px;
    margin-left: -15px;
  }
}

@media (min-width: 1050px) {
  .homepage__quicklinks,
  .featured-cards {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 442px) {
  .homepage .featured-cards__show-more {
    text-align: center;
  }
  .homepage .featured-news .page-card:nth-of-type(5) {
    height: 560px;
  }
}

.melding__label {
  display: inline-block;
  padding: 0.5ch 2ch;
  margin-left: 1ch;
  margin-right: 1ch;
  line-height: 100%;
  font-weight: 600;
  color: white;
  background-color: #71a330;
}

.env--dev .melding__label {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/white-on-#71a330";
}

.env--dev .melding__label::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/white-on-#71a330";
}

.melding__label--actueel {
  color: white;
  background-color: #71a330;
}

.env--dev .melding__label--actueel {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/white-on-#71a330";
}

.env--dev .melding__label--actueel::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/white-on-#71a330";
}

.melding__label--rectificatie {
  color: white;
  background-color: #612C51;
}

.env--dev .melding__label--rectificatie {
  content: "Contrast OK: 190.935";
}

.melding__label--afgerond {
  color: white;
  background-color: #808080;
}

.env--dev .melding__label--afgerond {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/white-on-#808080";
}

.env--dev .melding__label--afgerond::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/white-on-#808080";
}

nav a:link {
  text-decoration: none;
}

nav a:hover,
nav a:focus {
  text-decoration: underline;
}

@media (min-width: 780px) {
  header .mobile-link-to-home {
    display: none;
  }
}

@media (min-width: 780px) and (min-width: 780px) {
  header .keynav-shortcut {
    border: none;
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
}

@media (min-width: 780px) {
  header #menu {
    color: #24408f;
    background-color: white;
    position: relative;
    z-index: 200;
  }
  .env--dev header #menu {
    content: "Contrast OK: 190.366";
  }
  .primary-nav {
    -webkit-transition: background-color 0.5s ease, color 0.5s ease;
    -ms-transition: background-color 0.5s ease, color 0.5s ease;
    transition: background-color 0.5s ease, color 0.5s ease;
  }
  .primary-nav__content {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    height: 114px;
  }
  .primary-nav__content a:link,
  .primary-nav__content a:visited,
  .primary-nav__content a:hover,
  .primary-nav__content a:link:active, .primary-nav__content:link, .primary-nav__content:visited, .primary-nav__content:link:hover, .primary-nav__content:link:active {
    color: #24408f;
  }
  .env--dev .primary-nav__content a:link, .env--dev
  .primary-nav__content a:visited, .env--dev
  .primary-nav__content a:hover, .env--dev
  .primary-nav__content a:link:active, .env--dev .primary-nav__content:link, .env--dev .primary-nav__content:visited, .env--dev .primary-nav__content:link:hover, .env--dev .primary-nav__content:link:active {
    content: "Contrast OK: 190.366";
  }
}

@media (min-width: 780px) and (max-width: 439px) {
  .primary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (min-width: 440px) and (max-width: 779px) {
  .primary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (min-width: 780px) and (max-width: 1049px) {
  .primary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (min-width: 1050px) {
  .primary-nav__content {
    max-width: 1280px;
  }
}

@media (min-width: 780px) and (min-width: 1500px) {
  .primary-nav__content {
    max-width: 1440px;
  }
}

@media (min-width: 780px) {
  .primary-nav .logo {
    display: flex;
    align-items: center;
    width: 100px;
  }
  .primary-nav .logo a {
    background-image: url("/static/img/icons/DCMR-Logo.svg");
    background-size: 96px;
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -1000ch;
    min-width: 96px;
    overflow: hidden;
    background-size: contain;
    background-position: left center;
    display: block;
    height: 96px;
    width: 68.69333px;
  }
  .primary-nav__items {
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    font-weight: bold;
  }
  .primary-nav__items > :first-child a {
    padding-left: 0;
  }
  .primary-nav__items > :last-child a {
    padding-right: 0;
  }
  .primary-nav__dropdown-menu {
    color: #24408f;
    background-color: white;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 100;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    height: 260px;
    font-weight: bold;
    padding-left: calc(100% / 12 * 2);
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .env--dev .primary-nav__dropdown-menu {
    content: "Contrast OK: 190.366";
  }
  .primary-nav__dropdown-menu a:link,
  .primary-nav__dropdown-menu a:visited,
  .primary-nav__dropdown-menu a:hover,
  .primary-nav__dropdown-menu a:link:active, .primary-nav__dropdown-menu:link, .primary-nav__dropdown-menu:visited, .primary-nav__dropdown-menu:link:hover, .primary-nav__dropdown-menu:link:active {
    color: #24408f;
  }
  .env--dev .primary-nav__dropdown-menu a:link, .env--dev
  .primary-nav__dropdown-menu a:visited, .env--dev
  .primary-nav__dropdown-menu a:hover, .env--dev
  .primary-nav__dropdown-menu a:link:active, .env--dev .primary-nav__dropdown-menu:link, .env--dev .primary-nav__dropdown-menu:visited, .env--dev .primary-nav__dropdown-menu:link:hover, .env--dev .primary-nav__dropdown-menu:link:active {
    content: "Contrast OK: 190.366";
  }
  .primary-nav__dropdown-menu--hidden {
    display: none;
  }
  .primary-nav__dropdown-menu a {
    height: 60px;
    min-width: 200px;
    display: flex;
    align-items: center;
    padding-left: 1em;
    border-bottom: 1px solid #e8e8e8;
    box-sizing: border-box;
    color: #24408f !important;
  }
  .primary-nav__dropdown-menu a::before {
    background-image: url("/static/img/icons/icon-rechts.svg");
    background-size: 16px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: -15%;
  }
  .primary-nav__dropdown-menu a::before {
    padding-left: 5px;
  }
  .primary-nav__item {
    padding-left: 20px;
    padding-right: 20px;
    height: 75px;
    display: flex;
    align-items: center;
    flex-grow: 1;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .primary-nav__item {
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (min-width: 780px) {
  .primary-nav__item[aria-current=page] {
    background: #efeff2;
  }
  .primary-nav__item--dropdown-icon {
    flex-shrink: 0;
  }
  .primary-nav__item--dropdown-icon > a::after {
    background-image: url("/static/img/icons/icon-menu-dropdown.svg");
    background-size: 25px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 25px;
    height: 25px;
    vertical-align: -33%;
  }
  .primary-nav:hover .primary-nav__item--dropdown-icon > a::after {
    background-image: url("/static/img/icons/icon-menu-dropdown-wit.svg");
    background-size: 25px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 25px;
    height: 25px;
    vertical-align: -33%;
  }
  .primary-nav__item--dropdown-icon:hover > a::after,
  .primary-nav:hover .primary-nav__item--dropdown-icon:hover > a::after {
    background-image: url("/static/img/icons/icon-menu-dropdown.svg");
    background-size: 25px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 25px;
    height: 25px;
    vertical-align: -33%;
  }
  .primary-nav__item--search {
    border: 0;
    background: inherit;
    font: inherit;
    color: inherit;
    cursor: pointer;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .primary-nav__item--search {
    font-size: 0;
  }
}

@media (min-width: 780px) {
  .primary-nav__item--search::before {
    background-image: url("/static/img/icons/icon-zoeken.svg");
    background-size: 35px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 35px;
    height: 35px;
    vertical-align: -15%;
  }
  .primary-nav:hover .primary-nav__item--search::before {
    background-image: url("/static/img/icons/icon-zoeken-wit.svg");
    background-size: 35px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 35px;
    height: 35px;
    vertical-align: -15%;
  }
  .primary-nav:hover .primary-nav__item--search:hover::before {
    background-image: url("/static/img/icons/icon-zoeken.svg");
    background-size: 35px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 35px;
    height: 35px;
    vertical-align: -15%;
  }
  .primary-nav__item--mobile-only {
    display: none;
  }
  .primary-nav__item:focus,
  .primary-nav__item:focus a, .primary-nav__item:hover,
  .primary-nav__item:hover a {
    background-color: #FFF !important;
    color: #24408f !important;
  }
  .primary-nav__item:focus > .primary-nav__dropdown-menu,
  .primary-nav__item:hover > .primary-nav__dropdown-menu {
    display: flex;
  }
  .primary-nav:hover {
    color: #FFF;
    background-color: #24408f;
  }
  .env--dev .primary-nav:hover {
    content: "Contrast OK: 190.366";
  }
  .primary-nav:hover a:link,
  .primary-nav:hover a:visited,
  .primary-nav:hover a:hover,
  .primary-nav:hover a:link:active, .primary-nav:hover:link, .primary-nav:hover:visited, .primary-nav:hover:link:hover, .primary-nav:hover:link:active {
    color: #FFF;
  }
  .env--dev .primary-nav:hover a:link, .env--dev
  .primary-nav:hover a:visited, .env--dev
  .primary-nav:hover a:hover, .env--dev
  .primary-nav:hover a:link:active, .env--dev .primary-nav:hover:link, .env--dev .primary-nav:hover:visited, .env--dev .primary-nav:hover:link:hover, .env--dev .primary-nav:hover:link:active {
    content: "Contrast OK: 190.366";
  }
  .primary-nav:hover__dropdown-menu {
    color: #24408f;
    background-color: white;
  }
  .env--dev .primary-nav:hover__dropdown-menu {
    content: "Contrast OK: 190.366";
  }
  .primary-nav:hover__dropdown-menu a:link,
  .primary-nav:hover__dropdown-menu a:visited,
  .primary-nav:hover__dropdown-menu a:hover,
  .primary-nav:hover__dropdown-menu a:link:active, .primary-nav:hover__dropdown-menu:link, .primary-nav:hover__dropdown-menu:visited, .primary-nav:hover__dropdown-menu:link:hover, .primary-nav:hover__dropdown-menu:link:active {
    color: #24408f;
  }
  .env--dev .primary-nav:hover__dropdown-menu a:link, .env--dev
  .primary-nav:hover__dropdown-menu a:visited, .env--dev
  .primary-nav:hover__dropdown-menu a:hover, .env--dev
  .primary-nav:hover__dropdown-menu a:link:active, .env--dev .primary-nav:hover__dropdown-menu:link, .env--dev .primary-nav:hover__dropdown-menu:visited, .env--dev .primary-nav:hover__dropdown-menu:link:hover, .env--dev .primary-nav:hover__dropdown-menu:link:active {
    content: "Contrast OK: 190.366";
  }
  .primary-nav:hover .logo a {
    background-image: url("/static/img/icons/DCMR-Logo-wit.svg");
    background-size: 96px;
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -1000ch;
    min-width: 96px;
    overflow: hidden;
    background-size: contain;
    background-position: left center;
  }
}

.secondary-nav {
  color: white;
  background-color: #24408f;
}

@media (max-width: 439px) {
  .secondary-nav {
    display: none !important;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .secondary-nav {
    display: none !important;
  }
}

.env--dev .secondary-nav {
  content: "Contrast OK: 190.366";
}

.secondary-nav a:link,
.secondary-nav a:visited,
.secondary-nav a:hover,
.secondary-nav a:link:active, .secondary-nav:link, .secondary-nav:visited, .secondary-nav:link:hover, .secondary-nav:link:active {
  color: white;
}

.env--dev .secondary-nav a:link, .env--dev
.secondary-nav a:visited, .env--dev
.secondary-nav a:hover, .env--dev
.secondary-nav a:link:active, .env--dev .secondary-nav:link, .env--dev .secondary-nav:visited, .env--dev .secondary-nav:link:hover, .env--dev .secondary-nav:link:active {
  content: "Contrast OK: 190.366";
}

.secondary-nav__content {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 439px) {
  .secondary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .secondary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .secondary-nav__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) {
  .secondary-nav__content {
    max-width: 1280px;
  }
}

@media (min-width: 1500px) {
  .secondary-nav__content {
    max-width: 1440px;
  }
}

.secondary-nav a {
  line-height: 50px;
  display: inline-block;
}

.secondary-nav a[href^='tel:'] {
  flex-grow: 2;
}

.secondary-nav .phone-number {
  font-weight: bold;
}

.secondary-nav .number-badge {
  color: #24408f;
  background-color: white;
  border: 1px solid white;
  border-radius: 1em;
  line-height: 1em;
  padding: 0.25ch 1ch;
  display: inline-block;
}

.env--dev .secondary-nav .number-badge {
  content: "Contrast OK: 190.366";
}

.secondary-nav__item > a {
  padding-left: 2em;
  padding-right: 2em;
}

.secondary-nav__item > a[aria-current=page] {
  background-color: rgba(255, 255, 255, 0.2);
}

.secondary-nav__item:first-child > a {
  padding-left: 0;
}

.secondary-nav__item:last-child > a {
  padding-right: 0;
}

.secondary-nav__item--milieuklacht {
  width: 100%;
}

@media (max-width: 1049px) {
  .secondary-nav__item--milieuklacht {
    display: none;
  }
}

.number-badge {
  display: inline-block;
  margin-left: 0.5ch;
  margin-right: 0.5ch;
}

.badge-target {
  display: flex !important;
  flex-direction: row-reverse;
  align-items: baseline;
}

.nav__close-button {
  display: none;
}

.social-link + .social-link {
  margin-left: 24px;
}

.secondary-nav__item--readspeaker a {
  background-image: url("/static/img/icons/icon-readspeaker.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -1000ch;
  min-width: 24px;
  overflow: hidden;
}

.social-link--twitter {
  background-image: url("/static/img/icons/icon-social-twitter.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -1000ch;
  min-width: 24px;
  overflow: hidden;
}

.social-link--facebook {
  background-image: url("/static/img/icons/icon-social-facebook.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -1000ch;
  min-width: 24px;
  overflow: hidden;
}

.social-link--linkedin {
  background-image: url("/static/img/icons/icon-social-linkedin.svg");
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  text-indent: -1000ch;
  min-width: 24px;
  overflow: hidden;
}

.nav__link-list,
.nav__link-list h2,
.page-card--link-list,
.page-card--link-list h2 {
  color: #24408f;
  background-color: #FFF;
}

.env--dev .nav__link-list, .env--dev
.nav__link-list h2, .env--dev
.page-card--link-list, .env--dev
.page-card--link-list h2 {
  content: "Contrast OK: 190.366";
}

.nav__link-list a:link,
.nav__link-list a:visited,
.nav__link-list a:hover,
.nav__link-list a:link:active, .nav__link-list:link, .nav__link-list:visited, .nav__link-list:link:hover, .nav__link-list:link:active,
.page-card--link-list a:link,
.page-card--link-list a:visited,
.page-card--link-list a:hover,
.page-card--link-list a:link:active,
.page-card--link-list:link,
.page-card--link-list:visited,
.page-card--link-list:link:hover,
.page-card--link-list:link:active {
  color: #24408f;
}

.env--dev .nav__link-list a:link, .env--dev
.nav__link-list a:visited, .env--dev
.nav__link-list a:hover, .env--dev
.nav__link-list a:link:active, .env--dev .nav__link-list:link, .env--dev .nav__link-list:visited, .env--dev .nav__link-list:link:hover, .env--dev .nav__link-list:link:active, .env--dev
.page-card--link-list a:link, .env--dev
.page-card--link-list a:visited, .env--dev
.page-card--link-list a:hover, .env--dev
.page-card--link-list a:link:active, .env--dev
.page-card--link-list:link, .env--dev
.page-card--link-list:visited, .env--dev
.page-card--link-list:link:hover, .env--dev
.page-card--link-list:link:active {
  content: "Contrast OK: 190.366";
}

.nav__link-list h2,
.page-card--link-list h2 {
  margin-bottom: 0;
  padding-top: 18px;
  padding-bottom: 10px;
  font-size: 24px;
  line-height: 40px;
}

.nav__link-list p,
.page-card--link-list p {
  margin: 0;
}

.nav__link-list p a,
.page-card--link-list p a {
  padding-left: 36px;
  padding-right: 10px;
  min-height: 38px;
  line-height: 38px;
  position: relative;
}

.nav__link-list p.secondary-link a:link,
.nav__link-list p.secondary-link a:visited,
.nav__link-list p.secondary-link a:hover,
.nav__link-list p.secondary-link a:link:active, .nav__link-list p.secondary-link:link, .nav__link-list p.secondary-link:visited, .nav__link-list p.secondary-link:link:hover, .nav__link-list p.secondary-link:link:active,
.page-card--link-list p.secondary-link a:link,
.page-card--link-list p.secondary-link a:visited,
.page-card--link-list p.secondary-link a:hover,
.page-card--link-list p.secondary-link a:link:active,
.page-card--link-list p.secondary-link:link,
.page-card--link-list p.secondary-link:visited,
.page-card--link-list p.secondary-link:link:hover,
.page-card--link-list p.secondary-link:link:active {
  color: #24408f;
}

.env--dev .nav__link-list p.secondary-link a:link, .env--dev
.nav__link-list p.secondary-link a:visited, .env--dev
.nav__link-list p.secondary-link a:hover, .env--dev
.nav__link-list p.secondary-link a:link:active, .env--dev .nav__link-list p.secondary-link:link, .env--dev .nav__link-list p.secondary-link:visited, .env--dev .nav__link-list p.secondary-link:link:hover, .env--dev .nav__link-list p.secondary-link:link:active, .env--dev
.page-card--link-list p.secondary-link a:link, .env--dev
.page-card--link-list p.secondary-link a:visited, .env--dev
.page-card--link-list p.secondary-link a:hover, .env--dev
.page-card--link-list p.secondary-link a:link:active, .env--dev
.page-card--link-list p.secondary-link:link, .env--dev
.page-card--link-list p.secondary-link:visited, .env--dev
.page-card--link-list p.secondary-link:link:hover, .env--dev
.page-card--link-list p.secondary-link:link:active {
  content: "Contrast OK: 190.366";
}

.nav__link-list p.secondary-link:before,
.page-card--link-list p.secondary-link:before {
  color: #24408f !important;
}

.nav__link-list p.secondary-link a,
.page-card--link-list p.secondary-link a {
  color: inherit;
}

.nav__link-list a,
.page-card--link-list a {
  font-weight: 600;
  display: block;
}

.nav__link-list a::before,
.page-card--link-list a::before {
  background-image: url("/static/img/icons/icon-rechts.svg");
  background-size: 16px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: -15%;
}

.nav__link-list a::before,
.page-card--link-list a::before {
  margin-right: 1ch;
  vertical-align: -6.66%;
  position: absolute;
  left: 10px;
  top: 12px;
}

.nav__link-list :link,
.page-card--link-list :link {
  text-decoration: none;
}

.page-card--nav-links,
.page-card--nav-links h2 {
  color: #FFF;
  background-color: #24408f;
}

.env--dev .page-card--nav-links, .env--dev
.page-card--nav-links h2 {
  content: "Contrast OK: 190.366";
}

.page-card--nav-links a:link,
.page-card--nav-links a:visited,
.page-card--nav-links a:hover,
.page-card--nav-links a:link:active, .page-card--nav-links:link, .page-card--nav-links:visited, .page-card--nav-links:link:hover, .page-card--nav-links:link:active {
  color: #FFF;
}

.env--dev .page-card--nav-links a:link, .env--dev
.page-card--nav-links a:visited, .env--dev
.page-card--nav-links a:hover, .env--dev
.page-card--nav-links a:link:active, .env--dev .page-card--nav-links:link, .env--dev .page-card--nav-links:visited, .env--dev .page-card--nav-links:link:hover, .env--dev .page-card--nav-links:link:active {
  content: "Contrast OK: 190.366";
}

.page-card--nav-links h2 {
  margin-bottom: 0;
  padding-top: 18px;
  padding-bottom: 10px;
  font-size: 24px;
  line-height: 40px;
}

.page-card--nav-links p {
  margin: 0;
}

.page-card--nav-links p a {
  padding-left: 36px;
  padding-right: 10px;
  min-height: 38px;
  line-height: 38px;
  position: relative;
}

.page-card--nav-links p.secondary-link a:link,
.page-card--nav-links p.secondary-link a:visited,
.page-card--nav-links p.secondary-link a:hover,
.page-card--nav-links p.secondary-link a:link:active, .page-card--nav-links p.secondary-link:link, .page-card--nav-links p.secondary-link:visited, .page-card--nav-links p.secondary-link:link:hover, .page-card--nav-links p.secondary-link:link:active {
  color: #FFF;
}

.env--dev .page-card--nav-links p.secondary-link a:link, .env--dev
.page-card--nav-links p.secondary-link a:visited, .env--dev
.page-card--nav-links p.secondary-link a:hover, .env--dev
.page-card--nav-links p.secondary-link a:link:active, .env--dev .page-card--nav-links p.secondary-link:link, .env--dev .page-card--nav-links p.secondary-link:visited, .env--dev .page-card--nav-links p.secondary-link:link:hover, .env--dev .page-card--nav-links p.secondary-link:link:active {
  content: "Contrast OK: 190.366";
}

.page-card--nav-links p.secondary-link:before {
  color: #FFF !important;
}

.page-card--nav-links p.secondary-link a {
  color: inherit;
}

.page-card--nav-links a {
  font-weight: 600;
  display: block;
}

.page-card--nav-links a::before {
  background-image: url("/static/img/icons/icon-rechts-wit.svg");
  background-size: 16px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: -15%;
}

.page-card--nav-links a::before {
  margin-right: 1ch;
  vertical-align: -6.66%;
  position: absolute;
  left: 10px;
  top: 12px;
}

.page-card--nav-links :link {
  text-decoration: none;
}

.primary-nav__content,
.secondary-nav__content {
  padding-left: 10px;
  padding-right: 10px;
}

.mobile-sub-header {
  display: none;
  background: #24408f;
  color: white;
  padding: 15px;
}

.mobile-sub-header a,
.mobile-sub-header a:visited {
  color: white !important;
}

@media (max-width: 779px) {
  .mobile-sub-header {
    display: block;
  }
}

@media (max-width: 779px) {
  #menu {
    position: absolute;
    display: flex;
    width: 1px;
    height: 1px;
    clip: rect(1px, 1px, 1px, 1px);
    overflow: hidden;
  }
  .nav__close-button {
    display: none;
    position: absolute;
    width: 100%;
    height: 50px;
    left: 0;
    top: 0;
    z-index: 30;
    box-sizing: border-box;
    background-position: right;
    border-right: solid 10px transparent;
    text-indent: -1000ch;
    background-image: url("/static/img/icons/icon-menu-mobiel-sluiten.svg");
    background-size: 100px;
    background-repeat: no-repeat;
  }
  #menu:target {
    position: static;
    display: flex;
    clip: auto;
    width: auto;
    height: auto;
    overflow: visible;
  }
  #menu:target ~ .nav__close-button {
    display: block;
  }
  #menu:focus,
  #menu:focus-within {
    position: static;
    display: flex;
    clip: auto;
    width: auto;
    height: auto;
    overflow: visible;
  }
  #menu:focus ~ .nav__close-button,
  #menu:focus-within ~ .nav__close-button {
    display: block;
  }
  h1 {
    order: 2;
  }
  .keynav-shortcut {
    display: block;
    order: 1;
    height: 50px;
  }
  .keynav-shortcut--menu {
    padding-left: 13px;
    padding-right: 13px;
    font-weight: bold;
    align-items: center;
    box-sizing: border-box;
    text-decoration: none;
    display: flex;
    align-items: center;
    position: absolute;
    height: 50px;
    font-weight: normal;
  }
  .keynav-shortcut--menu::before {
    content: "☰";
    padding-right: 1ch;
  }
  .keynav-shortcut--content {
    display: none;
  }
  /*
    .keynav-shortcut--content {
        @include visually-hide-text();
        margin-left: -1 * $logo-width / 2;
        width: $logo-width;
        left: 50%;
    }*/
  header {
    position: relative;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(120, 120, 120, 0.2);
    color: #24408f;
    background-color: #FFF;
  }
  .env--dev header {
    content: "Contrast OK: 190.366";
  }
  header a:link,
  header a:visited,
  header a:hover,
  header a:active, header:link, header:link:visited, header:link:hover, header:link:active {
    color: #24408f;
  }
  .env--dev header a:link, .env--dev
  header a:visited, .env--dev
  header a:hover, .env--dev
  header a:active, .env--dev header:link, .env--dev header:link:visited, .env--dev header:link:hover, .env--dev header:link:active {
    content: "Contrast OK: 190.366";
  }
  header {
    display: flex;
    flex-direction: row;
  }
  header > nav {
    display: flex;
    flex-direction: column;
  }
  header .mobile-link-to-home {
    display: block;
    margin: 0;
    background-image: url("/static/img/icons/DCMR-Logo-mobile.svg");
    background-size: 100px;
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -1000ch;
    min-width: 100px;
    overflow: hidden;
    background-position: center center;
    background-position: calc(50% - 28px) center;
    height: 50px;
    width: 100%;
    min-width: 100px;
    margin-left: 1ch;
  }
  .primary-nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding-top: 50px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
    /*
        display: flex;
        justify-content: space-between;
        padding: $grid-margin 20px;
        align-items: center;
        */
    display: flex;
    flex-direction: column;
    /*
        .search {
            display: flex;
            a {
                @include icon-without-text('icon-zoeken', 30px)
            }
        }
        */
  }
  .primary-nav a {
    height: 66px;
    display: flex;
    padding-left: 13px;
    padding-right: 13px;
    font-weight: bold;
    align-items: center;
    box-sizing: border-box;
    text-decoration: none;
    display: flex;
    align-items: center;
    border-bottom: 3px solid #f1f1f1;
  }
  .primary-nav .logo {
    display: none;
  }
  .primary-nav a:focus {
    @color ($focus-color, $brand-primary-color);
    background-color: #ffbf47;
    border-bottom-color: transparent;
  }
  .primary-nav__item:first-child {
    border-top: 1px solid #f1f1f1;
  }
  .primary-nav__item .primary-nav__dropdown-menu {
    display: none;
  }
  .primary-nav__item .primary-nav__dropdown-menu a {
    text-indent: 2em;
  }
  .primary-nav__content {
    color: #24408f;
    background-color: #FFF;
  }
  .env--dev .primary-nav__content {
    content: "Contrast OK: 190.366";
  }
  .primary-nav__content a:link,
  .primary-nav__content a:visited,
  .primary-nav__content a:hover,
  .primary-nav__content a:link:active, .primary-nav__content:link, .primary-nav__content:visited, .primary-nav__content:link:hover, .primary-nav__content:link:active {
    color: #24408f;
  }
  .env--dev .primary-nav__content a:link, .env--dev
  .primary-nav__content a:visited, .env--dev
  .primary-nav__content a:hover, .env--dev
  .primary-nav__content a:link:active, .env--dev .primary-nav__content:link, .env--dev .primary-nav__content:visited, .env--dev .primary-nav__content:link:hover, .env--dev .primary-nav__content:link:active {
    content: "Contrast OK: 190.366";
  }
  .primary-nav .primary-nav__item--search {
    padding-left: 13px;
    padding-right: 13px;
    font-weight: bold;
    align-items: center;
    box-sizing: border-box;
    text-decoration: none;
    display: flex;
    align-items: center;
    height: 66px;
    display: flex;
    color: #24408f;
    background-color: #FFF;
    border: none;
    font-size: 16px;
    width: 100%;
  }
  .env--dev .primary-nav .primary-nav__item--search {
    content: "Contrast OK: 190.366";
  }
  .primary-nav .primary-nav__item--search::before {
    background-image: url("/static/img/icons/icon-zoeken.svg");
    background-size: 35px;
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    width: 35px;
    height: 35px;
    vertical-align: -15%;
  }
  .primary-nav .primary-nav__item--search::before {
    padding-right: 10px;
  }
}

.news-page__content > div:nth-of-type(1n) {
  flex-basis: calc(66.66667% - 10px);
  max-width: calc(66.66667% - 10px);
}

.news-page__content > div:nth-of-type(2n) {
  flex-basis: calc(33.33333% - 10px);
  max-width: calc(33.33333% - 10px);
}

@media (max-width: 767px) {
  .news-page__content > div:nth-of-type(1n) {
    margin: 5px 0;
    flex-basis: 100%;
    max-width: 100%;
  }
}

.news-page__sidebar {
  margin-top: 4em;
}

.news-page__sidebar li.page-card {
  margin: 0;
}

.news-page__sidebar li.page-card,
.news-page__sidebar > ul {
  margin-top: 10px;
}

.news-page__sidebar > ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  list-style: none;
}

.page--news h2 {
  font-size: 28px;
}

@media (min-width: 1050px) {
  .page--news h2 {
    font-size: 41px;
  }
}

.search--filters {
  display: none;
  float: right;
  margin-top: -54px;
  width: 33.33333%;
}

@media (min-width: 768px) {
  .search--filters {
    display: block;
  }
}

.search--filters h2,
.search--filters h3 {
  margin-top: 0;
  margin-bottom: 0;
}

.search--filters h2 {
  color: #003b49;
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 1em;
  margin-top: 0.25em;
}

.search--filters h3 {
  color: white;
  background-color: #003b49;
  padding-left: 12px;
  padding-right: 12px;
  height: 50px;
  line-height: 50px;
  font-size: 22px;
}

.env--dev .search--filters h3 {
  content: "Contrast OK: 212.045";
}

.search--filters ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.search--filters li {
  border-bottom: 2px solid white;
  display: flex;
  padding: 12px;
  position: relative;
}

.search--filters li label {
  flex: 1;
}

.search--filters input[type=checkbox] {
  margin-right: 2ch;
}

.search--filters label:hover {
  color: #24408f;
  cursor: pointer;
}

.search--filters label::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
}

.search--filters .numeric {
  text-align: right;
  font-weight: bold;
  color: #24408f;
}

.search--filters .search--filters__collection + .search--filters__collection {
  margin-top: 2em;
}

.search--filters .search--filter--active {
  background-color: #24408f;
}

.search--filters .search--filter--active label,
.search--filters .search--filter--active .numeric {
  color: white;
}

.search-page::after {
  content: "";
  display: table;
  clear: both;
}

@media (min-width: 1050px) {
  .search-page h1 {
    font-size: 41px;
  }
}

.search-page input[type=submit] {
  color: white;
  background-color: #24408f;
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.5);
  border-radius: 0;
  cursor: pointer;
  height: 50px;
  font-size: 25px;
  text-decoration: none;
  padding-left: 2ch;
  padding-right: 2ch;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: bold;
}

.env--dev .search-page input[type=submit] {
  content: "Contrast OK: 190.366";
}

@media (min-width: 768px) {
  .search-page input[type=submit] {
    padding-left: 6ch;
    padding-right: 6ch;
  }
}

@media (min-width: 1050px) {
  .search-page input[type=submit] {
    padding-left: 10ch;
    padding-right: 10ch;
  }
}

.search-page button {
  color: white;
  background-color: #24408f;
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.5);
  border-radius: 0;
  cursor: pointer;
  height: 44px;
  font-size: 22px;
  text-decoration: none;
  padding-left: 4ch;
  padding-right: 4ch;
  font-size: 16px;
}

.env--dev .search-page button {
  content: "Contrast OK: 190.366";
}

.search-page .search--show-more {
  margin-top: 2em;
  text-align: center;
}

.search-page .search--query,
.search-page article {
  width: 100%;
}

@media (min-width: 768px) {
  .search-page .search--query,
  .search-page article {
    width: calc(66.66667% - 15px);
  }
}

.search-page .search--query {
  display: flex;
  float: left;
  margin-top: 0;
  position: relative;
}

.search-page .search--query::before {
  background-image: url("/static/img/icons/icon-zoeken.svg");
  background-size: 35px;
  background-repeat: no-repeat;
  content: " ";
  display: inline-block;
  width: 35px;
  height: 35px;
  vertical-align: -15%;
}

.search-page .search--query::before {
  position: absolute;
  z-index: 2;
  left: 6px;
  margin-top: 10px;
}

@media (min-width: 768px) {
  .search-page .search--query input + input {
    margin-left: 10px;
  }
}

.search-page .search--query input[type=text],
.search-page .search--query input[type=search] {
  flex: 1;
}

.search-page .search--query input[type=text],
.search-page .search--query input[type=search] {
  color: #24408f;
  background-color: white;
  border: 2px solid transparent;
  font-size: 25px;
  height: 50px;
  line-height: 50px;
  padding: 16px;
  box-sizing: border-box;
  box-shadow: 1px 1px 3px rgba(120, 120, 120, 0.2);
  font-family: "Zetta Sans", "Open Sans", sans-serif;
  font-size: 16px;
  padding: 0 0 0 50px;
}

.env--dev .search-page .search--query input[type=text], .env--dev
.search-page .search--query input[type=search] {
  content: "Contrast OK: 190.366";
}

.search-page .search--query input[type=text]:focus, .search-page .search--query input[type=text]:hover,
.search-page .search--query input[type=search]:focus,
.search-page .search--query input[type=search]:hover {
  border-color: #24408f;
}

@media (min-width: 768px) {
  .search-page .search--query input[type=text],
  .search-page .search--query input[type=search] {
    font-size: 20px;
  }
}

.search-page .page__show-more,
.search-page .results__show-more {
  text-align: center;
}

.search-page .search-results {
  clear: left;
}

.search-page .search-results--category {
  margin-bottom: 4em;
}

.search-page .search-results--count {
  color: #24408f;
}

.search-overlay--buttons {
  padding-right: 60px;
  padding-left: 60px;
  color: white;
  background-color: #24408f;
  box-shadow: 0 0 20px 20px #24408f;
  z-index: 10;
  margin: 0;
  height: 100px;
  line-height: 100px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.env--dev .search-overlay--buttons {
  content: "Contrast OK: 190.366";
}

@media (max-width: 779px) {
  .search-overlay--buttons {
    height: 50px;
    line-height: 50px;
    padding-right: 15px;
  }
}

.search-overlay--buttons .close-button {
  float: right;
}

.search-overlay--buttons :link {
  display: block;
  text-decoration: none;
  margin: 1ch;
}

.search-overlay--buttons .close-button::before {
  content: '✖';
  margin: 1ch;
}

.search-overlay-page {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  color: white;
  background-color: #24408f;
  overflow-y: auto;
  padding: 0 15px;
}

.env--dev .search-overlay-page {
  content: "Contrast OK: 190.366";
}

.search-overlay-page a:link,
.search-overlay-page a:visited,
.search-overlay-page a:hover,
.search-overlay-page a:link:active, .search-overlay-page:link, .search-overlay-page:visited, .search-overlay-page:link:hover, .search-overlay-page:link:active {
  color: white;
}

.env--dev .search-overlay-page a:link, .env--dev
.search-overlay-page a:visited, .env--dev
.search-overlay-page a:hover, .env--dev
.search-overlay-page a:link:active, .env--dev .search-overlay-page:link, .env--dev .search-overlay-page:visited, .env--dev .search-overlay-page:link:hover, .env--dev .search-overlay-page:link:active {
  content: "Contrast OK: 190.366";
}

.search-overlay-page h1,
.search-overlay-page h2,
.search-overlay-page h3,
.search-overlay-page h4,
.search-overlay-page h5,
.search-overlay-page h6,
.search-overlay-page .heading {
  color: white;
  background-color: #24408f;
}

.env--dev .search-overlay-page h1, .env--dev
.search-overlay-page h2, .env--dev
.search-overlay-page h3, .env--dev
.search-overlay-page h4, .env--dev
.search-overlay-page h5, .env--dev
.search-overlay-page h6, .env--dev
.search-overlay-page .heading {
  content: "Contrast OK: 190.366";
}

.search-overlay-page h1 a:link,
.search-overlay-page h1 a:visited,
.search-overlay-page h1 a:hover,
.search-overlay-page h1 a:link:active, .search-overlay-page h1:link, .search-overlay-page h1:visited, .search-overlay-page h1:link:hover, .search-overlay-page h1:link:active,
.search-overlay-page h2 a:link,
.search-overlay-page h2 a:visited,
.search-overlay-page h2 a:hover,
.search-overlay-page h2 a:link:active,
.search-overlay-page h2:link,
.search-overlay-page h2:visited,
.search-overlay-page h2:link:hover,
.search-overlay-page h2:link:active,
.search-overlay-page h3 a:link,
.search-overlay-page h3 a:visited,
.search-overlay-page h3 a:hover,
.search-overlay-page h3 a:link:active,
.search-overlay-page h3:link,
.search-overlay-page h3:visited,
.search-overlay-page h3:link:hover,
.search-overlay-page h3:link:active,
.search-overlay-page h4 a:link,
.search-overlay-page h4 a:visited,
.search-overlay-page h4 a:hover,
.search-overlay-page h4 a:link:active,
.search-overlay-page h4:link,
.search-overlay-page h4:visited,
.search-overlay-page h4:link:hover,
.search-overlay-page h4:link:active,
.search-overlay-page h5 a:link,
.search-overlay-page h5 a:visited,
.search-overlay-page h5 a:hover,
.search-overlay-page h5 a:link:active,
.search-overlay-page h5:link,
.search-overlay-page h5:visited,
.search-overlay-page h5:link:hover,
.search-overlay-page h5:link:active,
.search-overlay-page h6 a:link,
.search-overlay-page h6 a:visited,
.search-overlay-page h6 a:hover,
.search-overlay-page h6 a:link:active,
.search-overlay-page h6:link,
.search-overlay-page h6:visited,
.search-overlay-page h6:link:hover,
.search-overlay-page h6:link:active,
.search-overlay-page .heading a:link,
.search-overlay-page .heading a:visited,
.search-overlay-page .heading a:hover,
.search-overlay-page .heading a:link:active,
.search-overlay-page .heading:link,
.search-overlay-page .heading:visited,
.search-overlay-page .heading:link:hover,
.search-overlay-page .heading:link:active {
  color: white;
}

.env--dev .search-overlay-page h1 a:link, .env--dev
.search-overlay-page h1 a:visited, .env--dev
.search-overlay-page h1 a:hover, .env--dev
.search-overlay-page h1 a:link:active, .env--dev .search-overlay-page h1:link, .env--dev .search-overlay-page h1:visited, .env--dev .search-overlay-page h1:link:hover, .env--dev .search-overlay-page h1:link:active, .env--dev
.search-overlay-page h2 a:link, .env--dev
.search-overlay-page h2 a:visited, .env--dev
.search-overlay-page h2 a:hover, .env--dev
.search-overlay-page h2 a:link:active, .env--dev
.search-overlay-page h2:link, .env--dev
.search-overlay-page h2:visited, .env--dev
.search-overlay-page h2:link:hover, .env--dev
.search-overlay-page h2:link:active, .env--dev
.search-overlay-page h3 a:link, .env--dev
.search-overlay-page h3 a:visited, .env--dev
.search-overlay-page h3 a:hover, .env--dev
.search-overlay-page h3 a:link:active, .env--dev
.search-overlay-page h3:link, .env--dev
.search-overlay-page h3:visited, .env--dev
.search-overlay-page h3:link:hover, .env--dev
.search-overlay-page h3:link:active, .env--dev
.search-overlay-page h4 a:link, .env--dev
.search-overlay-page h4 a:visited, .env--dev
.search-overlay-page h4 a:hover, .env--dev
.search-overlay-page h4 a:link:active, .env--dev
.search-overlay-page h4:link, .env--dev
.search-overlay-page h4:visited, .env--dev
.search-overlay-page h4:link:hover, .env--dev
.search-overlay-page h4:link:active, .env--dev
.search-overlay-page h5 a:link, .env--dev
.search-overlay-page h5 a:visited, .env--dev
.search-overlay-page h5 a:hover, .env--dev
.search-overlay-page h5 a:link:active, .env--dev
.search-overlay-page h5:link, .env--dev
.search-overlay-page h5:visited, .env--dev
.search-overlay-page h5:link:hover, .env--dev
.search-overlay-page h5:link:active, .env--dev
.search-overlay-page h6 a:link, .env--dev
.search-overlay-page h6 a:visited, .env--dev
.search-overlay-page h6 a:hover, .env--dev
.search-overlay-page h6 a:link:active, .env--dev
.search-overlay-page h6:link, .env--dev
.search-overlay-page h6:visited, .env--dev
.search-overlay-page h6:link:hover, .env--dev
.search-overlay-page h6:link:active, .env--dev
.search-overlay-page .heading a:link, .env--dev
.search-overlay-page .heading a:visited, .env--dev
.search-overlay-page .heading a:hover, .env--dev
.search-overlay-page .heading a:link:active, .env--dev
.search-overlay-page .heading:link, .env--dev
.search-overlay-page .heading:visited, .env--dev
.search-overlay-page .heading:link:hover, .env--dev
.search-overlay-page .heading:link:active {
  content: "Contrast OK: 190.366";
}

.search-overlay-page h1:link,
.search-overlay-page h1 :link,
.search-overlay-page h2:link,
.search-overlay-page h2 :link,
.search-overlay-page h3:link,
.search-overlay-page h3 :link,
.search-overlay-page h4:link,
.search-overlay-page h4 :link,
.search-overlay-page h5:link,
.search-overlay-page h5 :link,
.search-overlay-page h6:link,
.search-overlay-page h6 :link,
.search-overlay-page .heading:link,
.search-overlay-page .heading :link {
  text-decoration: none;
}

.search-overlay-page h1:link:hover, .search-overlay-page h1:link:focus,
.search-overlay-page h1 :link:hover,
.search-overlay-page h1 :link:focus,
.search-overlay-page h2:link:hover,
.search-overlay-page h2:link:focus,
.search-overlay-page h2 :link:hover,
.search-overlay-page h2 :link:focus,
.search-overlay-page h3:link:hover,
.search-overlay-page h3:link:focus,
.search-overlay-page h3 :link:hover,
.search-overlay-page h3 :link:focus,
.search-overlay-page h4:link:hover,
.search-overlay-page h4:link:focus,
.search-overlay-page h4 :link:hover,
.search-overlay-page h4 :link:focus,
.search-overlay-page h5:link:hover,
.search-overlay-page h5:link:focus,
.search-overlay-page h5 :link:hover,
.search-overlay-page h5 :link:focus,
.search-overlay-page h6:link:hover,
.search-overlay-page h6:link:focus,
.search-overlay-page h6 :link:hover,
.search-overlay-page h6 :link:focus,
.search-overlay-page .heading:link:hover,
.search-overlay-page .heading:link:focus,
.search-overlay-page .heading :link:hover,
.search-overlay-page .heading :link:focus {
  text-decoration: underline;
}

.search-overlay {
  margin: 0 auto;
  max-width: 720px;
  margin-top: 132px;
  position: relative;
}

@media (max-width: 779px) {
  .search-overlay {
    margin-top: 90px;
  }
}

.search-overlay hr {
  border-color: white;
}

.search-overlay input[type='text'],
.search-overlay input[type='search'] {
  color: white;
  background-color: rgba(255, 255, 255, 0.2);
  border: 2px solid transparent;
  font-size: 31.5px;
  height: 63px;
  line-height: 63px;
  padding: 16px;
  box-sizing: border-box;
}

.env--dev .search-overlay input[type='text'], .env--dev
.search-overlay input[type='search'] {
  outline: 2px solid red;
  content: "https://leaverou.github.io/contrast-ratio/white-on-rgba(255, 255, 255, 0.2)";
}

.env--dev .search-overlay input[type='text']::after, .env--dev
.search-overlay input[type='search']::after {
  display: block;
  border: 1px solid black;
  background: white;
  color: black;
  content: "Low color contrast is not accessible. Visit: https://leaverou.github.io/contrast-ratio/white-on-rgba(255, 255, 255, 0.2)";
}

.search-overlay input[type='text']:focus, .search-overlay input[type='text']:hover,
.search-overlay input[type='search']:focus,
.search-overlay input[type='search']:hover {
  border-color: white;
}

.search-overlay .search--query {
  display: flex;
  justify-content: space-between;
}

.search-overlay .search--query input {
  display: block;
}

.search-overlay .search--query input[type=text],
.search-overlay .search--query input[type=search] {
  width: 100%;
}

.search-overlay .search--query input[type=submit] {
  height: 100px;
  width: 100px;
  display: none;
}

.search-overlay .query-emphasis--match {
  text-decoration: underline;
}

.search-autocomplete__results-company {
  max-height: 174px;
  overflow-y: auto;
}

.search-autocomplete__result {
  padding-left: 20px;
}

.search-autocomplete__result-company {
  line-height: 58px;
  padding: 0;
  position: relative;
  padding-left: 90px;
  margin: 0;
}

.search-autocomplete__result-company .darkImage {
  display: none;
}

.search-autocomplete__result-company img {
  position: absolute;
  top: 5px;
  left: 20px;
  width: 40px;
  height: 40px;
}

.search-autocomplete__result-company:hover {
  color: #24408f;
  background-color: white;
}

.search-autocomplete__result-company:hover .darkImage {
  display: inline;
}

.search-autocomplete__result-company:hover .lightImage {
  display: none;
}

.env--dev .search-autocomplete__result-company:hover {
  content: "Contrast OK: 190.366";
}

.search-autocomplete__result-company:hover a:link,
.search-autocomplete__result-company:hover a:visited,
.search-autocomplete__result-company:hover a:hover,
.search-autocomplete__result-company:hover a:link:active, .search-autocomplete__result-company:hover:link, .search-autocomplete__result-company:hover:visited, .search-autocomplete__result-company:hover:link:hover, .search-autocomplete__result-company:hover:link:active {
  color: #24408f;
}

.env--dev .search-autocomplete__result-company:hover a:link, .env--dev
.search-autocomplete__result-company:hover a:visited, .env--dev
.search-autocomplete__result-company:hover a:hover, .env--dev
.search-autocomplete__result-company:hover a:link:active, .env--dev .search-autocomplete__result-company:hover:link, .env--dev .search-autocomplete__result-company:hover:visited, .env--dev .search-autocomplete__result-company:hover:link:hover, .env--dev .search-autocomplete__result-company:hover:link:active {
  content: "Contrast OK: 190.366";
}

.searchButton {
  height: 63px;
  position: absolute;
  right: 0;
  padding-right: 20px;
}

.searchButton img {
  width: 50px;
  height: 63px;
}

.page--styleguide {
  margin: 4em 2em;
}

.color-demo ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  list-style: none;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.color-demo li {
  margin: 0;
  list-style: none;
  width: 320px;
  height: 120px;
  outline: 1px solid silver;
}

.color-demo .color-sample {
  outline: 1px solid black;
  width: 3em;
  height: 2em;
}

.color-demo .color-label {
  font-family: 'Monaco', monospace;
}

.color-demo .brand-primary-color .color-sample {
  background-color: #24408f;
}

.color-demo .brand-secondary-color .color-sample {
  background-color: #64a70b;
}

.color-demo .brand-third-color .color-sample {
  background-color: #00A7B5;
}

.color-demo .brand-fourth-color .color-sample {
  background-color: #f67c00;
}

.color-demo .brand-fifth-color .color-sample {
  background-color: #473729;
}

.color-demo .brand-sixth-color .color-sample {
  background-color: #612C51;
}

.color-demo .brand-seventh-color .color-sample {
  background-color: #7E5475;
}

.color-demo .brand-eight-color .color-sample {
  background-color: #71a330;
}

.color-demo .brand-success-color .color-sample {
  background-color: #64a70b;
}

.color-demo .brand-warning-color .color-sample {
  background-color: #f67c00;
}

.color-demo .brand-danger-color .color-sample {
  background-color: #e35205;
}

.color-demo .brand-info-color .color-sample {
  background-color: #24408f;
}

.color-demo .text-color-base .color-sample {
  background-color: #1A1A1A;
}

.color-demo .text-article-summary-color .color-sample {
  background-color: #612C51;
}

.color-demo .body-bg .color-sample {
  background-color: #efeff2;
}

.color-demo .text-color .color-sample {
  background-color: #1A1A1A;
}

.page--subjects {
  padding-bottom: 6em;
}

@media (min-width: 780px) {
  .page--subjects h1 {
    padding-top: 1em;
  }
}

.featured-cards--subjects .page-card h3 {
  font-size: 24px;
  margin-bottom: 0;
  padding-top: 1em;
}

.featured-cards--subjects .page-card p {
  margin-top: 0;
}

@media (min-width: 440px) and (max-width: 779px) {
  .featured-cards--subjects .page-card {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    box-sizing: border-box;
    margin: 0 0 10px 10px;
  }
}

@media (min-width: 780px) {
  .featured-cards--subjects .page-card {
    width: calc(33.33333% - 15px);
    margin: 0 0 15px 15px;
  }
}

.page-card--subject h3 {
  font-size: 24px;
  margin-bottom: 0;
  padding-top: 1em;
}

.page-card--subject p {
  margin-top: 0;
}

.vacancy__summary-table {
  border-collapse: collapse;
}

.vacancy__summary-table th {
  font-weight: normal;
}

.vacancy__summary-table td {
  font-weight: 600;
}

.vacancy__summary-table th,
.vacancy__summary-table td {
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 2em;
}

.vacancy__summary-table tr {
  border-top: 2px solid black;
}

.vacancy__summary-table tr:last-child {
  border-bottom: 2px solid black;
}

.page--loading {
  min-height: 70vh;
}

.page--loading .loading {
  display: block;
  position: absolute;
  width: 100px;
  height: 100px;
  left: 50%;
  top: 50%;
  margin-left: -50px;
  margin-top: -50px;
}

main .rsbtn {
  z-index: 1;
}

.rsbtn_exp a[rel=external]::before,
.rsbtn_exp a[target=_blank]::before {
  content: none;
}

.featured-img {
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.featured-img > img {
  display: none;
}

.featured-img__content {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  text-align: left;
}

@media (max-width: 439px) {
  .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) {
  .featured-img__content {
    max-width: 1280px;
  }
}

@media (min-width: 1500px) {
  .featured-img__content {
    max-width: 1440px;
  }
}

.featured-image-below-header,
.featured-image-my-district {
  min-height: 150px;
  height: 300px;
}

.featured-image-my-district {
  color: white;
}

.featured-image-my-district .heading {
  font-size: 24px;
  margin: 0;
}

.featured-image-my-district .featured-img__content {
  padding-bottom: 20px;
  position: relative;
  top: 60%;
}

@media (min-width: 1050px) {
  .featured-image-my-district .featured-img__content {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
  }
}

@media (min-width: 1050px) and (max-width: 439px) {
  .featured-image-my-district .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) and (min-width: 440px) and (max-width: 779px) {
  .featured-image-my-district .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) and (min-width: 780px) and (max-width: 1049px) {
  .featured-image-my-district .featured-img__content {
    max-width: 100%;
  }
}

@media (min-width: 1050px) and (min-width: 1050px) {
  .featured-image-my-district .featured-img__content {
    max-width: 1280px;
  }
}

@media (min-width: 1050px) and (min-width: 1500px) {
  .featured-image-my-district .featured-img__content {
    max-width: 1440px;
  }
}

.featured-image-my-district .featured-img__content h2 {
  font-family: "Open Sans", sans-serif;
  font-size: 34px;
  font-weight: normal;
  margin: 0;
}

@media (min-width: 1050px) {
  .featured-image-my-district .featured-img__content .mijn-wijk-login__wrapper {
    padding-left: 16.66667%;
  }
}

.featured-image-my-district .featured-img__content .mijn-wijk-login__input-row label {
  display: block;
  line-height: calc(34px * 1.352941176);
}

.featured-image-my-district .featured-img__content .mijn-wijk-login__form-field {
  color: #24408f;
  border-radius: 0;
  font-family: "Open Sans", sans-serif;
  height: 35px;
  font-size: 16px;
  padding-left: 10px;
  width: 120px;
}

.env--dev .featured-image-my-district .featured-img__content .mijn-wijk-login__form-field {
  content: "Contrast OK: 174.708";
}

.featured-image-my-district .featured-img__content .mijn-wijk-login__form-btn {
  background-color: #24408f;
  border: 0;
  color: white;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 600;
  height: 35px;
  padding: 0 10px;
}

.featured-image-my-district .featured-img__content .mijn-wijk-login__form-btn:hover {
  cursor: pointer;
}

main {
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 439px) {
  main {
    max-width: 100%;
  }
}

@media (min-width: 440px) and (max-width: 779px) {
  main {
    max-width: 100%;
  }
}

@media (min-width: 780px) and (max-width: 1049px) {
  main {
    max-width: 100%;
  }
}

@media (min-width: 1050px) {
  main {
    max-width: 1280px;
  }
}

@media (min-width: 1500px) {
  main {
    max-width: 1440px;
  }
}

.hidden {
  display: none !important;
}

.visually-hidden {
  border: none;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

html {
  color: white;
  background-color: black;
}

.env--dev html {
  content: "Contrast OK: 255";
}

a:link,
a:visited {
  color: #24408f;
}

.env--dev a:link, .env--dev
a:visited {
  content: "Contrast OK: 190.366";
}

/*# sourceMappingURL=main.css.map */