@import url("https://openstad-cdn.nl/css/haarlemmermeer/fonts_v3.css");
@import url('https://openstad-cdn.nl/css/addon.css');

.openstad,
[data-apos-level] {
  --nlds-iconsection-color: #9c2f85;
  --nlds-default-background-color: #FCF9FB;
  --utrecht-form-field-error-message-color: #DE1B25;
  --_utrecht-link-state-text-decoration-color: #067F8A;
  --utrecht-link-text-decoration-color: #067F8A;
}


.openstad #main .section h1,
[data-apos-level] #main .section h1 {
  color: #9c2f85;
}

.openstad p.utrecht-paragraph,
.openstad a,
.openstad li,
.openstad h1,
.openstad h2,
.openstad h3,
.openstad h4,
.openstad h5,
.openstad h6,
.openstad button,
.openstad span,
.openstad label,
.openstad strong,
.openstad figcaption,
.openstad .utrecht-form-field__input *,
[data-apos-level] p.utrecht-paragraph,
[data-apos-level] a,
[data-apos-level] li,
[data-apos-level] h1,
[data-apos-level] h2,
[data-apos-level] h3,
[data-apos-level] h4,
[data-apos-level] h5,
[data-apos-level] h6,
[data-apos-level] button,
[data-apos-level] span,
[data-apos-level] label,
[data-apos-level] strong,
[data-apos-level] .utrecht-form-field__input * {
  font-family: "axiforma", Arial, Helvetica, sans-serif !important;
  word-break: unset;
  word-wrap: unset;
  overflow-wrap: normal;
  -webkit-hyphens: unset;
  -moz-hyphens: unset;
  -ms-hyphens: unset;
  hyphens: none;
}

html [data-apos-level] button,
html [data-apos-level] a {
  hyphens: auto;
}

.osc-begrootmodule-resource-detail-texts-and-actions-container strong,
.osc-resource-detail-content p.utrecht-paragraph strong {
  display: block;
  margin-top: 1rem;
}

.openstad,
[data-apos-level] {
  --utrecht-link-social-background-color: #9d2f87;
  --nlds-header-compact-background-color: #9d2f87;
}

.openstad .utrecht-button-link.utrecht-button-link--primary-action,
.openstad .utrecht-button-link.utrecht-button-link--secondary-action,
.openstad .utrecht-button-link.utrecht-button-link--subtle,
.openstad #main .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action),
[data-apos-level] .utrecht-button-link.utrecht-button-link--primary-action,
[data-apos-level] .utrecht-button-link.utrecht-button-link--secondary-action,
[data-apos-level] .utrecht-button-link.utrecht-button-link--subtle,
[data-apos-level] .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action) {
  font-size: 0.9rem;
  padding: 0.9rem 1.8rem;
  transition: 0.1s;
  font-weight: 600;
  scale: 1 !important;
}

.openstad .utrecht-button-link.utrecht-button-link--primary-action:hover,
[data-apos-level] .utrecht-button-link.utrecht-button-link--primary-action:hover {
  background-color: #027581;
  border-color: #027581;
}

.openstad .utrecht-button-link.utrecht-button-link--secondary-action,
[data-apos-level] .utrecht-button-link.utrecht-button-link--secondary-action {
  border-width: 1px;
}

.openstad .utrecht-button-link.utrecht-button-link--secondary-action:hover,
[data-apos-level] .utrecht-button-link.utrecht-button-link--secondary-action:hover {
  background-color: #fcf9fb;
}

.openstad .custom-cta,
[data-apos-level] .custom-cta {
  background-color: #07838f;
  padding: 40px 30px;
}

.--solid.section.custom-cta{
    background-color: #07838f!important;
  .utrecht-unordered-list__item{
    color: #fff;
  }

}

.custom-cta .utrecht-link:any-link{
  color: white;
  text-decoration-color: white;

}

[data-apos-level] .custom-cta .utrecht-paragraph,
[data-apos-level] .custom-cta h1,
[data-apos-level] .custom-cta h2,
[data-apos-level] .custom-cta h3,
[data-apos-level] .custom-cta h4,
[data-apos-level] .custom-cta h5,
[data-apos-level] .custom-cta .utrecht-paragraph a {
  color: white;
}

.openstad .custom-cta .utrecht-button-link--primary-action,
[data-apos-level] .custom-cta .utrecht-button-link--primary-action {
  background-color: white;
  color: black;
}

.openstad .custom-cta .utrecht-button-link--subtle,
[data-apos-level] .custom-cta .utrecht-button-link--subtle {
  background-color: transparent;
  color: white;
  border: 1px solid white;
}

.openstad .custom-cta .utrecht-button-link--primary-action:hover,
[data-apos-level] .custom-cta .utrecht-button-link--primary-action:hover,
[data-apos-level] .custom-cta .utrecht-button-link--secondary-action:hover,
[data-apos-level] .custom-cta .utrecht-button-link--subtle:hover {
  text-decoration: underline;
  background-color: white;
  color: #027581;
}

.openstad .centered p,
.openstad .centered h1,
.openstad .centered h2,
.openstad .centered h3,
.openstad .centered h4,
[data-apos-level] .centered p,
[data-apos-level] .centered h1,
[data-apos-level] .centered h2,
[data-apos-level] .centered h3,
[data-apos-level] .centered h4 {
  text-align: center;
  justify-content: center;
}

#logo-image {
  max-height: 100px;
}

@media screen and (min-width: 768px) {

  .openstad header,
  [data-apos-level] header {
    padding: 13px;
    padding-top: 0;
  }

  .openstad #logo-image,
  [data-apos-level] #logo-image {
    max-height: 150px;
    width: 100px;
  }
}



.openstad header.--compact::after,
[data-apos-level] header.--compact::after {
  display: none;
}

.openstad header.--compact,
[data-apos-level] header.--compact {
  margin-bottom: 0;
  max-height: fit-content;
}

.openstad .main-header-container,
[data-apos-level] .main-header-container {
  height: 4.5rem;
}

.openstad .main-header-container .col-xs-12,
[data-apos-level] .main-header-container .col-xs-12 {
  position: relative;
  padding: 2.25rem;
  padding-top: 0;
  background-color: white;
}

@media screen and (max-width: 768px) {

  .openstad .main-header-container .col-xs-12,
  [data-apos-level] .main-header-container .col-xs-12 {
    padding: 1rem;
  }

  .openstad #main .section h1,
  [data-apos-level] #main .section h1 {
    color: #9c2f85;
    font-size: calc(var(--utrecht-heading-1-font-size) * 0.66);
  }

  .openstad #main .section h2,
  [data-apos-level] #main .section h2 {
    color: #9c2f85;
    font-size: calc(var(--utrecht-heading-2-font-size) * 0.75);
  }
}

@media screen and (max-width: 768px) {
    .openstad #main .section h2.utrecht-heading-4 , [data-apos-level] #main .section h2.utrecht-heading-4 {
        color: #333;
        font-size: var(--utrecht-heading-4-font-size);
    }
}

.openstad .main-header-container>.row,
[data-apos-level] .main-header-container>.row {
  justify-content: space-between;
  align-items: flex-start;
}

.openstad .header-top-bar,
[data-apos-level] .header-top-bar {
  margin: 0;
  border-bottom: none;
}

@media screen and (min-width: 768px) {
  [data-apos-level] header.--compact .header-top-bar {
    height: 2.5rem;
    display: flex;
  }
}

.topmenu-buttons a, .logout-button a{
  color: #9c2f85;
}

.openstad #main .section.--solid.Paars,
.openstad #main .section.--solid.paars,
[data-apos-level] #main .section.--solid.Paars,
[data-apos-level] #main .section.--solid.paars {
  background-color: #9c2f85;
}

@media screen and (min-width: 768px) {

  .openstad #main .section.--solid,
  [data-apos-level] #main .section.--solid {
    padding: 2.5rem 2.75rem;
  }

  .openstad .section.--negative,
  [data-apos-level] .section.--negative {
    margin-block-start: -12.5rem;
  }

  .openstad #main section.page>.apos-area>.section.--solid:first-child,
  .openstad .page .apos-area>.apos-area .apos-areas-widgets-list>.apos-area-widget-wrapper:first-child>.apos-area-widget-inner>div>.section.--solid,
  [data-apos-level] #main section.page>.apos-area>.section.--solid:first-child,
  [data-apos-level] .page .apos-area>.apos-area .apos-areas-widgets-list>.apos-area-widget-wrapper:first-child>.apos-area-widget-inner>div>.section.--solid {
    padding: 10rem 2.75rem 2rem !important;
  }
}

.openstad #main section.page>.apos-area>.section.--solid:first-child,
.openstad .page .apos-area>.apos-area .apos-areas-widgets-list>.apos-area-widget-wrapper:first-child>.apos-area-widget-inner>div>.section.--solid,
[data-apos-level] #main section.page>.apos-area>.section.--solid:first-child,
[data-apos-level] .page .apos-area>.apos-area .apos-areas-widgets-list>.apos-area-widget-wrapper:first-child>.apos-area-widget-inner>div>.section.--solid {
  background-color: #FCF9FB;
  padding: 5rem 1.25rem 1.25rem;
}


@media screen and (max-width: 575px) {

  .openstad .section.--negative,
  [data-apos-level] .section.--negative {
    margin-block-start: -4rem;
  }
}

.openstad #main .section.--solid.paars .utrecht-paragraph,
.openstad #main .section.--solid.paars h1,
.openstad #main .section.--solid.paars h2,
.openstad #main .section.--solid.paars h3,
.openstad #main .section.--solid.paars h4,
.openstad #main .section.--solid.paars h5,
.openstad #main .section.--solid.paars h6,
[data-apos-level] #main .section.--solid.paars .utrecht-paragraph,
[data-apos-level] #main .section.--solid.paars h1,
[data-apos-level] #main .section.--solid.paars h2,
[data-apos-level] #main .section.--solid.paars h3,
[data-apos-level] #main .section.--solid.paars h4,
[data-apos-level] #main .section.--solid.paars h5,
[data-apos-level] #main .section.--solid.paars h6,
[data-apos-level] #main .section.--solid.paars p.utrecht-paragraph .utrecht-link--html-a {
  color: white;
  text-decoration-color: white;
}

.openstad #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--secondary-action,
.openstad #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--secondary-action,
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--secondary-action,
[data-apos-level] #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--secondary-action {
  color: #9c2f85;
  border-color: white;
  background-color: white;
}

.openstad #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--secondary-action:hover,
.openstad #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--secondary-action:hover,
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--secondary-action:hover,
[data-apos-level] #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--secondary-action:hover,
.openstad #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--subtle:hover,
.openstad #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--subtle:hover,
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--subtle:hover,
[data-apos-level] #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--subtle:hover,
.openstad #main .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action):hover,
.openstad #main .section.--solid.paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action):hover,
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action):hover,
[data-apos-level] #main .section.--solid.paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action):hover {
  text-decoration: underline;
}

.openstad #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--subtle,
.openstad #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--subtle,
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link.utrecht-button-link--subtle,
[data-apos-level] #main .section.--solid.paars .utrecht-button-link.utrecht-button-link--subtle {
  color: white;
  border-color: white;
  background-color: transparent;
}

.openstad #main .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action),
.openstad #main .section.--solid.paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action),
[data-apos-level] #main .section.--solid.Paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action),
[data-apos-level] #main .section.--solid.paars .utrecht-button-link:not(.utrecht-button-link--subtle, .utrecht-button-link--secondary-action, .utrecht-button-link--primary-action) {
  color: white;
  border-color: white;
  border-width: 0;
  background-color: transparent;
  font-weight: 400;
}

.section.lijst .rte .utrecht-unordered-list {
  padding-left: 0;
}

.section.lijst .utrecht-unordered-list__item::marker {
  content: "";
}

.section.lijst .utrecht-unordered-list__item {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='26px' height='26px' viewBox='0 0 26 26' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EGroup Copy%3C/title%3E%3Cg id='grafieken' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Group-Copy'%3E%3Ccircle id='Oval' fill='%239C2F85' cx='13' cy='13' r='13'%3E%3C/circle%3E%3Cg id='check' transform='translate(5, 5)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cpath d='M15.2050781,3.54492187 C15.5171873,3.85703105 15.5171873,4.36171895 15.2050781,4.67050761 L6.43945312,13.4394531 C6.12734395,13.7515623 5.62265605,13.7515623 5.31386739,13.4394531 L0.794921875,8.92382812 C0.482812703,8.61171895 0.482812703,8.10703105 0.794921875,7.79824239 C1.10703105,7.48945373 1.61171845,7.48613322 1.92050761,7.79824239 L5.87167948,11.7494143 L14.0761719,3.54492187 C14.388281,3.2328127 14.892969,3.2328127 15.2017576,3.54492187 L15.2050781,3.54492187 Z' id='Path'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  display: block;
  position: relative;
  background-repeat: no-repeat;
  padding: 0.5rem 0 0.5rem 2.25rem;
  background-position-y: 6px;
}

.openstad #navbar .container #main-menu .level-1:hover,
.openstad #navbar .container #main-menu .level-1:focus-visible,
[data-apos-level] #navbar .container #main-menu .level-1:hover,
[data-apos-level] #navbar .container #main-menu .level-1:focus-visible {
  color: #9c2f85;
  border-color: transparent;
  text-decoration: underline;
  border-width: 1px;
}

.openstad #navbar .container #main-menu .level-1,
[data-apos-level] #navbar .container #main-menu .level-1 {
  font-weight: 400;
  font-size: 0.9rem;
}

[data-apos-level] nav#main-menu {
  flex-wrap: wrap;
}

@media screen and (max-width: 767px) {
  [data-apos-level] header.--compact {
    margin-bottom: 0;
    max-height: fit-content;
    padding-top: 0;
  }

}

[data-apos-level] .--mobile.header_navbar-container {
  justify-content: start;
}

[data-apos-level] .header_navbar-container {
  flex-shrink: 1;
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 0.5rem;
}

[data-apos-level] header.--compact .row {
  flex-wrap: nowrap;
}

/* Icon section */

.openstad article.icon-section-card,
[data-apos-level] article.icon-section-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.openstad .icon-section .icon-section-card img,
[data-apos-level] .icon-section .icon-section-card img {
  height: 12.5rem;
  aspect-ratio: 1 / 1;
}

@media screen and (min-width: 768px) {
  .icon-section .icon-section-card img {
    object-position: left;
  }
}

.openstad .icon-section .icon-section-grid .container,
[data-apos-level] .icon-section .icon-section-grid .container {
  align-items: start;
}

.openstad .icon-section .icon-section-content,
[data-apos-level] .icon-section .icon-section-content {
  padding: 0;
}

.openstad .icon-section .icon-section-content a,
[data-apos-level] .icon-section .icon-section-content a {
  color: #9c2f85;
  text-decoration-color: #9C2F85;
}

.icon-section .icon-section-content a:before {
  border-color: #9C2F85;
}

.openstad .icon-section .utrecht-heading-2.utrecht-accordion__header .utrecht-button.utrecht-button--subtle.utrecht-accordion__button,
[data-apos-level] .icon-section .utrecht-heading-2.utrecht-accordion__header .utrecht-button.utrecht-button--subtle.utrecht-accordion__button {
  background-color: #9c2f85;
}

.icon-section .icon-section-container .utrecht-paragraph {
  color: #000;
}

[data-apos-level] .icon-section .utrecht-accordion__panel {
  background-color: #FCF9FB
}

.openstad .section.--solid,
[data-apos-level] .section.--solid {
  background-color: #FCF9FB;
}

.openstad .osc .osc-listview-template-columns-3 {

  grid-gap: 1.5rem;
}






.openstad .artikelen .icon-section-container,
[data-apos-level] .artikelen .icon-section-container {
  padding-block-start: 0;
  padding-block-end: 0;
}

.openstad .artikelen .icon-section,
[data-apos-level] .artikelen .icon-section {
  background-color: transparent;
}

[data-apos-level] .artikelen .icon-section .icon-section-grid .container {
  grid-template-columns: repeat(auto-fit, minmax(260px, auto));
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card {
  position: relative;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child {
  display: grid;
  grid-template-rows: 1fr 1fr;
  background-color: #9c2f85 !important;
  grid-column: span 2;
}

@media screen and (max-width: 767px) {

  .openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child,
  [data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child {
    grid-column: 1;
    grid-template-rows: 1fr;
  }

  [data-apos-level] .artikelen .icon-section .icon-section-grid .container {
    grid-template-columns: repeat(auto-fit, minmax(280px, auto));
  }
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:nth-child(2n + 1),
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:nth-child(2n + 1) {
  background-color: #f0f4f8;
}

@media screen and (min-width: 768px) {

  .openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content,
  [data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content {
    padding: 2rem;
  }
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card .icon-section-content,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card .icon-section-content {
  padding: 1.5rem 1.25rem;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:hover h3,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:hover h3 {
  text-decoration: underline;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3 {
  font-size: 1.333rem;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content h3,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content h3 {
  font-size: 1.666rem;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content *,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content * {
  color: white;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child img,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card:first-child img {
  width: 100%;
  height: -webkit-fill-available;
  object-fit: cover;
  aspect-ratio: unset;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card img,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card img {
  width: 100%;
  height: 175px;
  object-fit: cover;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card a,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card a {
  font-size: 0;
  opacity: 0;
}

.openstad .artikelen .icon-section .icon-section-grid .container .icon-section-card a.utrecht-link::after,
[data-apos-level] .artikelen .icon-section .icon-section-grid .container .icon-section-card a.utrecht-link::after {
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  display: block;
}

.openstad .themas .icon-section-container,
[data-apos-level] .themas .icon-section-container {
  padding-block-start: 0;
  padding-block-end: 0;
}

.openstad .themas .icon-section,
[data-apos-level] .themas .icon-section {
  background-color: transparent;
}

@media screen and (min-width: 768px) {

  .openstad .themas .icon-section .icon-section-grid .container,
  [data-apos-level] .themas .icon-section .icon-section-grid .container {
    grid-template-columns: repeat(2, 1fr);
  }
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card {
  position: relative;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card {
  display: grid;
  grid-template-rows: 1fr 1fr;
  background-color: #9c2f85 !important;
  max-height: 32em;
}

.themas .icon-section-content {
  display: flex;
  gap: 0px;
  align-items: center;
}

.openstad .themas article.icon-section-card,
[data-apos-level] article.icon-section-card {

  gap: 0;
}

@media screen and (max-width: 767px) {

  .openstad .themas .icon-section .icon-section-grid .container .icon-section-card,
  [data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card {
    grid-column: 1/1;
    grid-template-rows: 1fr;
    grid-gap: 0;
  }
}

@media screen and (min-width: 768px) {

  .openstad .themas .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content,
  [data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card:first-child .icon-section-content {
    padding: 2rem;
  }
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content {
  padding: 1.5rem 1.25rem;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card:hover h3,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card:hover h3 {
  text-decoration: underline;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3 {
  font-size: 1rem;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content h3 {
  font-size: 1.333rem;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content *,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card .icon-section-content * {
  color: white;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card img,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card img {
  width: 100%;
  height: 250px;
  object-fit: cover;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card img,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card img {
  width: 100%;
  height: 400px;
  object-fit: cover;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card a,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card a {
  font-size: 0;
  opacity: 0;
}

.openstad .themas .icon-section .icon-section-grid .container .icon-section-card a.utrecht-link::after,
[data-apos-level] .themas .icon-section .icon-section-grid .container .icon-section-card a.utrecht-link::after {
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  display: block;
}

.openstad .container .footer-section h2,
[data-apos-level] .container .footer-section h2 {
  margin-bottom: 1rem;
}

.openstad #footer-container footer,
[data-apos-level] #footer-container footer {
  background-color: #07838F;
}

.openstad #footer-container footer *,
[data-apos-level] #footer-container footer * {
  color: white;
}

.openstad #footer-container footer a,
[data-apos-level] #footer-container footer a {
  text-decoration: underline;
  text-decoration-color: white;
}

.openstad #footer-container footer a:hover,
[data-apos-level] #footer-container footer a:hover {
  text-decoration: none;
}

@media screen and (max-width: 768px) {

  .openstad .header_navbar-container.--mobile .close-button,
  [data-apos-level] .header_navbar-container.--mobile .close-button {
    margin-top: 25px;
  }
}

.openstad .header_navbar-container.--mobile.--show .close-button,
[data-apos-level] .header_navbar-container.--mobile.--show .close-button {
  margin-top: 0;
}

.openstad .utrecht-heading-1,
[data-apos-level] .utrecht-heading-1 {
  margin: 0 0 0.66rem;
}

.openstad .utrecht-heading-2,
[data-apos-level] .utrecht-heading-2 {
  margin: 0.25rem 0 0.5rem;
}

.openstad .utrecht-heading-3,
[data-apos-level] .utrecht-heading-3 {
  margin: 0.25rem 0 0.5rem;
  --utrecht-heading-3-color: #07838F;
}

.openstad .utrecht-heading-4,
[data-apos-level] .utrecht-heading-4 {
  margin: 0.25rem 0 0.5rem;
  --utrecht-heading-4-color: #333;
}

.openstad .utrecht-heading-5,
[data-apos-level] .utrecht-heading-5 {
  margin: 0.25rem 0 0.5rem;
  --utrecht-heading-5-color: #333;
}

.openstad .utrecht-heading-6,
[data-apos-level] .utrecht-heading-6 {
  margin: 0.25rem 0 0.5rem;
  --utrecht-heading-6-color: #333;
}

.openstad .utrecht-button.utrecht-button--subtle.utrecht-accordion__button,
[data-apos-level] .utrecht-button.utrecht-button--subtle.utrecht-accordion__button {
  background-color: #f0f4f8;
}

.openstad .utrecht-accordion__button-label,
[data-apos-level] .utrecht-accordion__button-label {
  color: #9c2f85;
}

.openstad a.logo-uploaded.logo-main-container,
.openstad .header_navbar-container,
[data-apos-level] a.logo-uploaded.logo-main-container,
[data-apos-level] .header_navbar-container {
  pointer-events: all;
  min-height: 3.4rem;
}

.openstad .container.relative.main-header-container>.row,
[data-apos-level] .container.relative.main-header-container>.row {
  pointer-events: none;
}

[data-apos-refreshable] .section:not(.inzending-detail) .map-container.osc-map,
.openstad .section:not(.inzending-detail) .map-container.osc-map {
  width: var(--basemap-map-width);
  height: 350px;
  aspect-ratio: unset;
}

@media screen and (min-width: 768px) {
  [data-apos-refreshable] .bp-wrapper {
    padding: 2rem;
    padding-top: 0;
  }
}

.openstad .--margin-top-small,
[data-apos-refreshable] .--margin-top-small {
  margin-top: -25px;
}

.openstad .osc .stem-begroot--container>*,
[data-apos-refreshable] .osc .stem-begroot--container>* {
  margin: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.openstad .osc-resource-detail-content .osc-resource-detail-content-items,
[data-apos-refreshable] .osc-resource-detail-content .osc-resource-detail-content-items {
  padding: 0;
}

@media screen and (max-width: 1300px) and (min-width: 768px) {
  [data-apos-level] .header_navbar-container {
    flex-flow: column;
    align-items: flex-end;
  }

  [data-apos-level] .container.relative.main-header-container>.row {
    flex-flow: row;
  }

  [data-apos-level] #navbar .container #main-menu {
    align-items: center;
    flex-wrap: wrap;
    margin-top: 1rem;
  }

  [data-apos-level] .main-header-container {
    height: 7.5rem;
  }
}

.osc-resource-detail-content-items h2:has(+ .map-container) {
  font-size: 0;
  margin-top: 1rem;
}

.osc-resource-detail-content-items h2:has(+ .map-container)::after {
  content: 'Waar is dit knelpunt?';
  font-size: 1.75rem;
}

@media screen and (max-width: 767px) {
  .openstad .osc-begrootmodule-resource-detail-texts-and-actions-container .utrecht-heading-1 {
    font-size: 1.5rem;
  }

  .openstad .begroot-step-2-instruction-budget-status-panel {
    display: flex;
    flex-direction: column;
  }

  .openstad .begroot-step-2-instruction-budget-status-panel .spacer-1 {
    display: none;
  }
}

/* Formulier borders */

.openstad .form-container .question:has([required]) .utrecht-form-fieldset__legend:after,
.openstad .form-container .question:has([required])>.utrecht-paragraph.utrecht-form-field__label>label.utrecht-form-label:after,
.openstad .utrecht-form-field.utrecht-form-field--text:has(.utrecht-textbox[required]) .utrecht-form-label:after,
.openstad .question:has([required]) .utrecht-form-field--text p>label.utrecht-form-label:after {
  content: "(Verplicht)";
  font-weight: 400;
  font-style: normal;
  opacity: .8;
  margin-left: .5rem;
  font-size: 14px;
}

.openstad .utrecht-radio-button--html-input:invalid,
.openstad .utrecht-radio-button--html-input[aria-invalid=true],
.openstad .utrecht-checkbox--custom.utrecht-checkbox--html-input:invalid,
.openstad .utrecht-checkbox--custom.utrecht-checkbox--html-input[aria-invalid=true],
.openstad .utrecht-custom-checkbox--html-input:invalid,
.openstad .question-type-text .utrecht-form-field__input textarea,
.openstad .utrecht-custom-checkbox--html-input[aria-invalid=true] {
  border-color: black;
  border-width: 1px;
}


.openstad .question-type-text .utrecht-form-field__input input,
html .openstad .utrecht-form-field.utrecht-form-field--text:has(.utrecht-textbox[required]) .utrecht-textbox--html-input:invalid,
.openstad .question-type-text input[type=text],
.openstad .utrecht-textbox {
  border-width: 1px;
}

/* Alert section */

.section.alert {
  background-color: #D6E5F5;
  padding: 1.25rem;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  margin-block-end: 2rem;
}

.section.alert p.utrecht-paragraph {
  margin: 0;
}

.section.alert:before {
  content: '\EE59';
  font-family: 'remixicon' !important;
  font-size: 1.66em;
  line-height: 1;
}

.section.alert a {
  color: #9C2F85;
}

.section.alert.orange {
  background-color: #f28e09;
}

.section.alert.orange * {
  color: black;
  text-decoration-color: black;
}

.openstad .osc-begrootmodule-resource-detail-photo {
  width: 100%;
}


.openstad article.stem-begroot--container {
  align-content: space-between;
}

.utrecht-unordered-list--html-content>li::marker,
.utrecht-unordered-list--html-content ul>li::marker,
.utrecht-unordered-list__item::marker,
.utrecht-unordered-list__marker {
  content: "■";
  color: #9C2F85;
}



.budget-list-container:not(:has(.image-container))+.spacer-1+.begroot-step-panel-navigation-section .utrecht-button--primary-action {
  pointer-events: none;
  background: lightgray;
  color: gray;
}

[data-apos-refreshable] [data-custom-class="margin-top-0"] *,
.openstad [data-custom-class="margin-top-0"] * {
  margin-top: 0;
  margin-block-start: 0;
}

[data-apos-refreshable] [data-custom-class="margin-bottom-0"] *,
.openstad [data-custom-class="margin-bottom-0"] * {
  margin-bottom: 0;
  margin-block-end: 0;
}


[data-apos-refreshable] [data-custom-class="margin-top"] *,
.openstad [data-custom-class="margin-top"] * {
  margin-top: 3rem;
}

[data-apos-refreshable] [data-custom-class="margin-bottom"] *,
.openstad [data-custom-class="margin-bottom"] * {
  margin-bottom: 3rem;
}

[data-apos-refreshable] [data-custom-class="margin-top-bottom"] *,
.openstad [data-custom-class="margin-top-bottom"] * {
  margin-top: 3rem;
  margin-bottom: 1rem;
}


/* Kaart Lisserbroek */
.groot .osc-base-map-widget-container {
  height: 542px;
}

.section.groot>.container {
  max-width: unset;
}

[data-apos-refreshable] .groot.section:not(.inzending-detail) .map-container.osc-map {
  height: auto;
}

@media screen and (min-width: 768px) {
  .groot {
    min-height: 542px;
  }
}


/* .groot .leaflet-zoom-animated g path:nth-of-type(4){
	stroke: #00ff00;
  fill: #00ff00;
  fill-opacity: .25;
}

.groot .leaflet-zoom-animated g path:nth-of-type(4):hover{
  fill-opacity: .15;
} */

/* Kaart Buslijnen */
.deelgebieden .osc-base-map-widget-container {
  height: 542px;
}

.deelgebieden {
  min-height: 542px;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(1),
.deelgebied .leaflet-zoom-animated g path:nth-of-type(1) {
  stroke: #D691F3;
  fill: #D691F3;
  fill-opacity: .50;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(2) {
  stroke: #FFC965;
  fill: #FFC965;
  fill-opacity: .50;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(3) {
  stroke: #91D4F3;
  fill: #91D4F3;
  fill-opacity: .50;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(1):hover {
  fill-opacity: .25;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(2):hover {
  fill-opacity: .25;
}

.deelgebieden .leaflet-zoom-animated g path:nth-of-type(3):hover {
  fill-opacity: .25;
}

[data-apos-refreshable] .kaart-lang.section:not(.inzending-detail) .map-container.osc-map {
  height: 542px;
}

.kaart-lang {
  min-height: 542px;
}

.openstad .reaction-container .comment-item {
  padding-inline-start: 1rem;
  background-color: rgba(255, 255, 255, 0.8);
}

[data-apos-level] #footer-container h2.utrecht-heading-4 {
  font-size: 1.25rem;
}

[data-apos-level] .icon-section-content h3.utrecht-heading-3 {
  font-size: 1.5rem;
  margin-top: 0.75rem;
}

.stadscentrum .icon-section {
  background-color: transparent;
}

.stadscentrum .icon-section .icon-section-card img {
  object-fit: cover;
}

@media screen and (max-width: 768px) {
  [data-apos-level] .image-component.--large {
    --image-height: 16rem;
  }

  .openstad .section.--negative,
  [data-apos-level] .section.--negative {
    margin-block-start: 1rem;
  }

  .section:has(.paars) {
    margin-block-start: 0;
  }
}

/* keuzewijze afbeelding keuze */
.openstad .image-choice-container .utrecht-form-field--radio {
  gap: unset;
  grid-template-columns: 1fr;
}

.openstad .image-choice-container figure {
  position: relative;
}

.openstad fieldset .image-choice-container .utrecht-form-field--radio:nth-last-child(n + 2) {
  margin-bottom: 1.5rem;
}

.openstad .image-choice-container figcaption {
  background: var(--nlds-default-background-color);
  padding: 10px;
}

.openstad .form-container>.question {
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.verplicht .form-container .question:has([required]) .utrecht-form-fieldset__legend:after,
.verplicht .form-container .question:has([required])>.utrecht-paragraph.utrecht-form-field__label>label.utrecht-form-label:after,
.verplicht .utrecht-form-field.utrecht-form-field--text:has(.utrecht-textbox[required]) .utrecht-form-label:after,
.verplicht .utrecht-form-field.utrecht-form-field--text:has([aria-required="true"]) .utrecht-form-label:after,
.verplicht .question:has([required]) .utrecht-form-field--text p>label.utrecht-form-label:after {
  display: none;
}

.column-text,
.row-text {
  font-size: 0.875rem;
  line-height: 1.25;
}


.openstad .utrecht-table__cell,
.openstad .utrecht-table__header-cell {
  padding: 8px;
}

@media screen and (max-width: 480px) {
  .openstad fieldset.utrecht-form-fieldset__fieldset table.utrecht-table td {
    justify-items: start;
  }
}

.custom-cta .apos-area-widget-controls * {
  color: black !important;
}

.openstad .documentMap--container .map-container button.info-trigger {
  left: unset;
  right: 10px;
}

.utrecht-button.utrecht-button--primary-action.info-trigger .sr-only {
  position: absolute;
}


.openstad .utrecht-paragraph.comment-reaction-text {
  hyphens: auto;
}

.utrecht-link:any-link,
a {
  display: inline;
}

.icon-section .icon-section-content {
  position: unset;
}

.openstad .artikelen .icon-section .icon-section-content a,
[data-apos-level] .artikelen .icon-section .icon-section-content a,
.openstad .themas .icon-section .icon-section-content a,
[data-apos-level] .themas .icon-section .icon-section-content a {
  position: absolute;
  inset: 0;
}

#large .image-component.--xlarge {
  --image-height: unset;
}

.openstad .spacer-2:has(+.osc-raw-resource-container) {
  margin-bottom: 0;
}

.news-overview-header {
  padding-block-start: 3rem;
}

[data-openstad-accordion]+[data-openstad-title],
[data-openstad-rte]+[data-openstad-title] {
  margin-block-start: 3rem;
}

[data-openstad-rte]+[data-openstad-rte] {
  margin-block-start: 3rem;
}

[data-openstad-rte]+img {
  margin-block: 1.5rem;
}

[data-apos-level] .apos-rich-text-table th {
  --a-base-8: #9C2F85;


}

[data-apos-level] .apos-rich-text-table th,
[data-apos-level] .apos-rich-text-table td {
  --a-base-4: #eee;
}

[data-apos-level] .apos-rich-text-table th p {
  color: white;
}

[data-apos-level] .apos-rich-text-table {
  display: block;
  overflow-x: auto;
  width: 100% !important;      /* verslaat de inline width van het editor-script */
  max-width: 100% !important;
  min-width: 0 !important;     /* verslaat de inline min-width van het script */
  margin: 0;
}

[data-apos-level] .apos-rich-text-table tbody,
[data-apos-level] .apos-rich-text-table thead {
  display: table;
  width: 100%;
  table-layout: auto;          /* kolommen naar inhoud, geen vaste 600px meer */
}

[data-apos-level] .apos-rich-text-table tr {
  display: table-row;
}

.apos-rich-text-table th,
.apos-rich-text-table td {
  position: relative;
  box-sizing: border-box;
  padding: 6px 8px;
  border: 1px solid var(--a-base-4);
  min-width: 8em;              /* was 1em → leesbare minimumbreedte per kolom */
  vertical-align: top;
}

.apos-rich-text-table th {
  background-color: var(--a-base-8);
  font-weight: 700;
  text-align: left;
}




.openstad .leaflet-container a.leaflet-popup-close-button{
  font-size: 24px;
  top: 8px;
  right: 8px;

}

/* doorfietsroute */

.header .image-component {
    object-position: right;
}


/* Nieuwsberichten */
html:has(.news-overview-header) #main{
  overflow-x: hidden;
}

.news-overview-header{
padding-bottom:32px;
padding-top:160px;
background-color: #fcf9fb;
z-index: 1;
position: relative;
}

.news-overview-header h1{
  z-index: 1;
  position: relative;
}

.news-overview-header::after{
  content: "";
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  overflow-x: hidden;
  background-color: #fcf9fb;
  z-index: 0;
  padding-inline: 2rem;
}

html:has(.news-overview-header) #main > .section {
  margin-top: 0;
}


.apos-area div[id] {
  scroll-margin-top: 100px;
}

.section.news-detail{
  margin-block-start: 0;
}

@container related-posts-container (max-width: 450px) {
    .related-posts .static-grid .news-card figure {
        display: block;
    }
}


@media screen and (max-width: 768px) {
.mobile-margin {
    margin-block-start: 3rem!important;
}

.news-overview-header{
  padding-top: 80px;
  padding-bottom: 20px;
}
}

@media screen and (max-width: 576px) {
  .news-overview-header .utrecht-heading-1 {
    padding-left: 2rem;
  }
  
  .openstad article.icon-section-card, [data-apos-level] article.icon-section-card{
  padding-inline: 1rem;
}
}

@media screen and (min-width: 768px) and (max-width: 794px) {
  .news-overview-header .utrecht-heading-1 {
    padding-left: 2rem;
  }
}

@media screen and (min-width: 992px) and (max-width: 1032px) {
  .news-overview-header .utrecht-heading-1 {
    padding-left: 2rem;
  }
}

.related-posts .static-grid .static-list,
.news-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2rem;
}

.static-list li:nth-of-type(1) .news-card,  .news-grid a.news-card:nth-of-type(1) {
        background-color: #9C2F85;
        .card-content{
          padding: 2rem;
        }
        figure{
               height: 350px;
        }
        
        *, h2.utrecht-heading-4 {
          color: #fff!important;
        }
 }

 .static-list li:nth-of-type(2) .news-card, .news-grid a.news-card:not(:first-child):nth-of-type(even) {
        background-color: #fff;
        .card-content{
        padding: 1.5rem 1.25rem;
        }
        h2.utrecht-heading-4, h3{
          color: #9C2F85!important;
        }
 }

  .static-list li:nth-of-type(3) .news-card, .news-grid a.news-card:not(:first-child):nth-of-type(odd) {
        background-color: #FCF9FB;
        .card-content{
        padding: 1.5rem 1.25rem;
}
        h2.utrecht-heading-4, h3{
          color: #9C2F85!important;
        }
 }

@media screen and (min-width: 540px){
.static-list li:nth-of-type(1), .news-grid a.news-card:nth-of-type(1) {
    display: grid;
    grid-column: span 2;
}
}

.news-card{
    border: unset;
    height: 100%;
    border-radius: 0;
}

.news-card .card-content p{
  -webkit-line-clamp: unset
}

/* @media screen and (min-width: 1200px){
  .news-grid a.news-card:nth-of-type(1) {
        .card-content{
          padding: 2rem;
          margin-top: -5rem;

          p{
            margin-top: 1rem;
          }
          
 }
}
} */

.section.news-detail > .container.u-small-dropdowns > .row > div:nth-of-type(1){
  width: 100%;
}

.section.news-detail > .container.u-small-dropdowns > .row > div:nth-of-type(2), .news-detail-title{
  display: none;
  position: absolute;
}

html:has(.section.news-detail) .section.--solid{
  background-color: #9C2F85;
  .utrecht-paragraph, .utrecht-heading-1, .utrecht-heading-2, .utrecht-heading-3, .utrecht-heading-4, a{
    color: #fff;
  }
}

html:has(.section.news-detail) [data-apos-level] #main .section h1{
  color: #fff;
}

html:has(.section.news-detail) [data-apos-level] .page .apos-area>.apos-area .apos-areas-widgets-list>.apos-area-widget-wrapper:first-child>.apos-area-widget-inner>div>.section.--solid{
  background-color: #9C2F85;
}

@media screen and (max-width: 767px) {
    .related-posts .static-grid .static-list,
    .news-grid {
        grid-template-columns: 1fr;
    }

    .static-list li:nth-of-type(1),
    .news-grid a.news-card:nth-of-type(1) {
        display: grid;
        grid-column: 1;
    }
}

.openstad:has(.osc-raw-resource-container) .spacer-2{
  display: block;
}

.openstad .osc-resource-detail-content-items{
  font-family: "axiforma", Arial, Helvetica, sans-serif !important;
}

.utrecht-accordion__button[aria-expanded]:after{
  display: none;
}

.openstad:has(.--youth-intro) .osc-enquete-item-content.--youth .button-group.--flex .utrecht-button--primary-action:after {
    background-color: #fff;
}

@media screen and (min-width: 540px) {
  .news-grid a.news-card:nth-of-type(1),
  .static-list li:nth-of-type(1) .news-card {
    height: fit-content;            /* niet meerekken met hoogste kaart in de rij */
    grid-template-rows: 350px auto; /* foto blijft 350px, paars vlak wordt compact */
  }
}

.openstad main.page > .apos-area > .section.--solid:first-child,
[data-apos-level] main.page > .apos-area > .section.--solid:first-child {
  background-color: #FCF9FB;
  padding: 5rem 1.25rem 1.25rem;
}
 
@media screen and (min-width: 768px) {
  .openstad main.page > .apos-area > .section.--solid:first-child,
  [data-apos-level] main.page > .apos-area > .section.--solid:first-child {
    padding: 10rem 2.75rem 2rem !important;
  }
}
 
.openstad .news-grid .pagination,
[data-apos-level] .news-grid .pagination {
  grid-column: 1 / -1; /* eigen rij onder het overzicht */
}
 
.openstad .pagination > div,
[data-apos-level] .pagination > div {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  padding-block: 1.5rem 0.5rem;
}
 
.openstad .pagination span a,
.openstad .pagination span.is-active,
[data-apos-level] .pagination span a,
[data-apos-level] .pagination span.is-active {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  height: 2.75rem;
  padding: 0 0.75rem;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
}
 
.openstad .pagination span a,
[data-apos-level] .pagination span a {
  color: #9C2F85;
  background-color: #fff;
  border: 1px solid #9C2F85;
}
 
.openstad .pagination span a:hover,
.openstad .pagination span a:focus-visible,
[data-apos-level] .pagination span a:hover,
[data-apos-level] .pagination span a:focus-visible {
  background-color: #9C2F85;
  color: #fff;
}
 
.openstad .pagination span.is-active,
[data-apos-level] .pagination span.is-active {
  background-color: #9C2F85;
  color: #fff;
}

.tabel-100 .apos-rich-text-table{
   width: 100%;
}

@media screen and (max-width: 768px) {


.spacing{
	margin-top: 2rem!important;
}

[data-apos-level] #main .section.custom-cta h2{
  color: #fff;

}
}

.section.custom-cta .utrecht-unordered-list__item::marker {
  color: #fff;
}

.form-container { position: relative; }
.form-container::after {
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: -2px;
  height: 2px;
  background: #eee;      /* of #ccc, iets lichter */
  z-index: 3;            /* boven de witte fade (z-index: 0) */
  pointer-events: none;
}