@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed&family=Barlow:ital,wght@0,400;0,700;1,400;1,700&family=Young+Serif&display=swap');

:root{
  --btn-dur: 450ms;
  --btn-ease: cubic-bezier(.22, 1, .36, 1);
  --btn-ff: 'Barlow Condensed', sans-serif;
  --btn-fz: 16px;
  --btn-fw: 400;
  --btn-ls: 3px;
  --btn-tt: uppercase;
  --btn-pad-y: 12px;
  --btn-pad-x: 20px;
}

.frontpage .main,
.node--type-woningtypen .main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.toolbar-fixed .toolbar-oriented .toolbar-bar {
  z-index: 9999;
}

/* ============= BASIS SLIDESHOW WRAPPERS ============= */
.slideshow-blok .views_slideshow_cycle_main,
.slideshow-blok .views_slideshow_cycle_teaser_section,
.slideshow-blok .views_slideshow_cycle_teaser_section .views-row {
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  height: 100dvh;
  position: relative !important;
  overflow: hidden !important;
  background: transparent !important;
}

/* de main als positioning context */
.slideshow-blok .views_slideshow_cycle_main {
  position: relative !important;
}

/* ============= SLIDES (crossfade) ============= */
.slideshow-blok .views_slideshow_cycle_teaser_section .views_slideshow_cycle_slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;     /* override inline display:none */
  opacity: 0;
  transition: none;
  background: transparent !important;
  will-change: opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
}

.slideshow-blok
  .views_slideshow_cycle_teaser_section
  .views_slideshow_cycle_slide:not(.views_slideshow_cycle_hidden) {
  opacity: 1;
  z-index: 2;
}

/* ============= BEELD FULL BLEED ============= */
.slideshow-blok .views-field-field-afbeelding,
.slideshow-blok .views-field-field-afbeelding .field-content,
.slideshow-blok .item-image,
.slideshow-blok .item-image img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  z-index: 1;
  background: transparent !important;
}

/* ============= OVERLAY MET TEKST + KNOP ============= */
.slideshow-blok .slide,
.slideshow-blok .overlay {
  position: absolute !important;
  inset: 0 !important;
}

.slideshow-blok .overlay {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  color: #fff;
  padding: 0 1rem;
  z-index: 3;

  /* stacking context + tint */
  position: relative;
  background: transparent;
}

.frontpage .slideshow-blok .overlay::after,
.node--type-woningtypen .slideshow-blok .overlay::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;                    /* onder de tekst */
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, var(--tint, 0.6)) 0%,
    rgba(0, 0, 0, 0.2) 30%,
    rgba(0, 0, 0, 0) 50%
  );
  mix-blend-mode: multiply;
  pointer-events: none;
}


/* tekst boven de tint */
.slideshow-blok .slide-text,
.slideshow-blok .slide-button,
.slideshow-blok .slide-button * {
  position: relative;
  z-index: 1;
}



/* responsive text breedtes */
.slideshow-blok .slide-text { max-width: 90%; margin: 0 auto; }
@media (min-width: 1024px) { .slideshow-blok .slide-text { max-width: 1000px; } }
@media (min-width: 1600px) { .slideshow-blok .slide-text { max-width: 1200px; } }

/* titels */
.slideshow-blok .slide-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 20px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 6px;
  margin-bottom: 30px;
  line-height: 1.2;
  color: #fff;
}
.slideshow-blok .slide-subtitle {
  margin-bottom: 50px;
  font-family: "Young Serif", serif;
  font-weight: 400;
  font-size: 55px;
  text-transform: uppercase;
  line-height: 1.1;
  letter-spacing: 3px;
}

/* ============= CONTROLS RECHTSONDER ============= */
.slideshow-blok .views-slideshow-controls-bottom {
  position: absolute;
  bottom: 7%;
  right: 12%;
  z-index: 10;
  display: flex;
  gap: 8px;
  pointer-events: all;
  background: transparent;
}

/* reset/flatten de controls-wrapper, generiek */
.slideshow-blok .views_slideshow_controls_text {
  all: unset;
  display: contents;
}

/* previous/next – block-onafhankelijk via starts-with id selectors */
.slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a,
.slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,1);
  cursor: pointer;
  text-decoration: none;
  transition: background .2s ease-in-out, border-color .2s ease-in-out, transform .2s ease-in-out;
  font-size: 0; /* linktekst verbergen */
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* pijltjes */
.slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a::before,
.slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a::before {
  background-image: url("data:image/svg+xml;utf8,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z'/></svg>");
}
.slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a::before {
  background-image: url("data:image/svg+xml;utf8,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6z'/></svg>");
}

/* states */
.slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a:hover,
.slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a:hover {
  border-color: rgba(255,255,255,1);
  transform: scale(1.1);
}
.slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a:focus-visible,
.slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a:focus-visible {
  outline: 2px solid rgba(255,255,255,1);
  outline-offset: 2px;
}

/* pauzeknop verbergen – generiek */
.slideshow-blok [id^="views_slideshow_controls_text_pause_site_slideshow-block_"] { display:none; }

/* responsive kleiner */
@media (max-width: 480px) {
  .slideshow-blok .views-slideshow-controls-bottom { bottom: 6%; right: 6%; }
  .slideshow-blok [id^="views_slideshow_controls_text_previous_site_slideshow-block_"] a,
  .slideshow-blok [id^="views_slideshow_controls_text_next_site_slideshow-block_"] a {
  width: 34px; height: 34px;
  }
}

/* ============= SLIDESHOW BLOK ============= */
.slideshow-blok {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  height: 100dvh;
  overflow: hidden;
  padding-bottom: env(safe-area-inset-bottom);
}

/* extra fallback specifiek voor iOS Safari waar nodig */
@supports (-webkit-touch-callout: none) {
  .slideshow-blok {
  min-height: -webkit-fill-available;
  }
}

/* scroll-indicator in het midden */
.slideshow-blok .scroll-indicator {
  position: absolute;
  bottom: 7%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  justify-content: center;
}

.slideshow-blok .scroll-indicator .chev {
  width: 35px;
  height: 40px;
  background: url("../images/arrows.svg") no-repeat center;
  background-size: contain;
  animation: scroll-down-sync 1.8s ease-in-out infinite;
  opacity: .9;
}

@keyframes scroll-down-sync {
  0%   { transform: translateY(0);    opacity: .9; }
  40%  { transform: translateY(6px);  opacity: 1;  }
  80%  { transform: translateY(12px); opacity: .25;}
  100% { transform: translateY(0);    opacity: .9; }
}

/* impressie-titel links op 12% */
.slideshow-blok .impressie-title {
  position: absolute;
  bottom: 7%;
  left: 12%;
  font-size: 20px;   /* pas aan naar wens */
  font-weight: 400;
  line-height: 1;
  color: #fff;
  z-index: 10;
}

/* navigatie rechts op 12% */
.slideshow-blok .views-slideshow-controls-bottom {
  position: absolute;
  bottom: 7%;
  right: 12%;
  z-index: 10;
  display: flex;
  gap: 8px;
  pointer-events: all;
  background: transparent;
}

.slideshow-blok .woninginfo h2{color: #FFFFFF; font-size: 70px; line-height: 1}


.slideshow-blok .slide-woning-title{font-family: "Young Serif", serif; font-size: 30px; margin-bottom: 30px;}
.slideshow-blok .slide-woning-subtitle{font-size: 24px; font-weight: 600; margin: 30px 0 15px 0}
.slideshow-blok .slide-woning-bouwnummer{font-size: 24px; font-weight: 600; text-transform: uppercase; margin: 15px 0 0 0}


/* mobiel: alles centreren en stapelen */
@media (max-width: 767px) {
  .slideshow-blok .impressie-title {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    text-align: center;
    font-size: 18px;               /* evt. iets kleiner op mobiel */
    bottom: calc(7% + 88px);       /* boven scroll + controls */
    width: calc(100% - 24px);      /* wat marge links/rechts */
  }
  
  .slideshow-blok .woninginfo h2 {
      font-size: 45px;
  }
  
  .slideshow-blok .slide-woning-title {
      font-size: 24px;
      margin-bottom: 20px;
  }
  
  .slideshow-blok .slide-woning-subtitle {
      font-size: 20px;
      font-weight: 600;
      margin: 15px 0;
  }

 .slideshow-blok .views-slideshow-controls-bottom {
    right: 20px;
    bottom: 7%;
    justify-content: center;
  }
}

/* basis: mobiel – gecentreerd */
.slideshow-blok .verkoop-label {
  position: absolute;
  top: 150px;
  left: 50%;
  transform: translateX(-50%) rotate(3deg);
  z-index: 10;
  color: #fff;
  border: 2px solid #fff;
  background: rgba(255,255,255,.06);
  font-family: 'Barlow Condensed', sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  white-space: nowrap;
  pointer-events: none;

  /* mobiel-formaten */
  font-size: clamp(24px, 2.25vw, 42px);
  padding: clamp(12px, 1.35vw, 24px) clamp(21px, 1.8vw, 54px);
  border-width: clamp(3px, .375vw, 4.5px);
}

/* tablet: nog gecentreerd, maar iets groter voor meer présence */
@media (min-width: 768px) and (max-width: 991.98px) {
  .slideshow-blok .verkoop-label {
    /* blijft gecentreerd */
    font-size: clamp(26px, 2.4vw, 44px);
    padding: clamp(14px, 1.6vw, 26px) clamp(24px, 2.1vw, 58px);
    border-width: clamp(3px, .4vw, 4.5px);
    top: 140px;
  }
}

/* desktop: rechts binnen container, en iets groter dan je vorige desktop-waarden */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .slideshow-blok .verkoop-label {
    left: auto;
    right: calc((100vw - 1200px) / 2 + 40px); /* binnen (virtuele) 1200px container */
    transform: rotate(3deg);
    font-size: clamp(22px, 1.9vw, 38px);
    padding: clamp(12px, 1.2vw, 22px) clamp(20px, 1.6vw, 46px);
    border-width: clamp(2.5px, .32vw, 4px);
    top: 130px;
  }
}

/* ≥1200: iets compacter dan mid-desktop, maar nog steeds aanwezig */
@media (min-width: 1200px) {
  .slideshow-blok .verkoop-label {
    left: auto;
    right: calc((100vw - 1200px)/2 + 50px);
    transform: rotate(3deg);
    font-size: clamp(20px, 1.6vw, 34px);
    padding: clamp(10px, 1vw, 20px) clamp(18px, 1.4vw, 40px);
    border-width: clamp(2px, .3vw, 3.5px);
    top: 130px;
  }
}




/* ============= UI-DIALOG (ongewijzigd) ============= */
.ui-dialog {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  max-width: 90vw;
  max-height: 90vh;
  width: 600px;
  z-index: 10000;
}

.ui-dialog .ui-dialog-content {
  overflow-y: auto !important;
  max-height: calc(90vh - 80px) !important; /* 80px aftrek voor header + padding */
  padding: 20px;
  box-sizing: border-box;
}


.fieldset-legend{font-weight: 600; font-size: 18px}

.form-required::after {
  content: " *";
  color: #e00; /* rood, kies je eigen kleur */
  margin-left: 2px;
  font-weight: bold;
}

.slide-button,
.button,
.button-wrapper{
  display: inline-block;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--btn-border, #717A92);
}

.slide-button::before,
.button::before,
.button-wrapper::before{
  content: "";
  position: absolute;
  inset: 0;
  background: var(--btn-fill, #717A92);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--btn-dur, 450ms) var(--btn-ease, cubic-bezier(.22,1,.36,1));
  z-index: 0;
}

.slide-button > a,
.button > a,
.button-wrapper > input.button{
  position: relative;
  z-index: 1;
  display: inline-block;
  background: transparent;
  border: none;
  font-family: var(--btn-ff, 'Barlow Condensed', sans-serif);
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 3px;
  padding: var(--btn-pad-y, 12px) var(--btn-pad-x, 20px);
  text-decoration: none;
  cursor: pointer;
  color: var(--btn-text, #0a0a36);
  transition: color var(--btn-dur, 450ms) var(--btn-ease, cubic-bezier(.22,1,.36,1));
}

.slide-button:hover::before,
.button:hover::before,
.button-wrapper:hover::before{
  transform: scaleX(1);
  transform-origin: left center;
}

.slide-button:hover > a,
.button:hover > a,
.button-wrapper:hover > input.button{
  color: var(--btn-text-hover, #FFFFFF);
}

.slide-button:not(:hover)::before,
.button:not(:hover)::before,
.button-wrapper:not(:hover)::before{
  transform-origin: right center;
}

@media (prefers-reduced-motion: reduce){
  .slide-button::before, .button::before, .button-wrapper::before,
  .slide-button > a,    .button > a,    .button-wrapper > input.button{
  transition: none;
  }
}

.slide-button{
  --btn-border: #FFFFFF;
  --btn-fill:   #FFFFFF;
  --btn-text:   #FFFFFF;
  --btn-text-hover: #0a0a36;
  mix-blend-mode: multiply; /* laat staan als je dat effect wilt */
}

.button,
.button-wrapper{
  --btn-border: #717A92;
  --btn-fill:   #717A92;
  --btn-text:   #0a0a36;
  --btn-text-hover: #FFFFFF;
}

.portfolio-hover .slide-button > a{
  padding: 7px 15px;
  font-size: 14px;
}

.button-box{display: flex; justify-content: center;}

table.tablesaw tbody tr.is-hover td {
  background: #b8bcc8; /* zacht oranje vlak */
  transition: background .15s ease-in-out;
}

#block-vastenburghof-views-block-site-metrages-block-1 .block-content .contextual-region {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table[id^="tablesaw-"] th,
table[id^="tablesaw-"] td {
  white-space: nowrap; /* optioneel */
}

@media (max-width: 39.9375em) {
    .views-field-field-huisnummer {
        background: #717A92;
        color: #FFFFFF;
    }
    table[id^="tablesaw-"] tbody tr{margin-bottom: 10px;}
}

@media screen and (max-width: 39.9375em) {
    .metrages {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .tablesaw-stack td .tablesaw-cell-label{width: 50% !important;}
}

.owl-next i,
.owl-prev i{line-height: 48px;}

.block-views-blocksite-woninginfo-block-2 h2.block-title{font-size: 30px;}
.views-field-field-plattegronden-1{text-align: center;}
.views-field-field-gevels-1{text-align: center;}

.node--type-woningen .after-content{background: #f9f9f9; margin-top: 50px; padding: 50px 0;}
.views-field-field-gevels .field-content img {
  mix-blend-mode: multiply;
}
.block-views-blocksite-woninginfo-block-3{margin-top: 30px !important;}

.before_content .col-xs-12{width: 100%;}
.before_content{background: #f9f9f9; margin-bottom: 80px;}
.before_content .block-views-blocksite-woninginfo-block-2{margin-bottom: 0 !important}

/* container */
.woning-kenmerken .view-content-wrap .item {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 0;
  gap: 0; /* geen visuele gap; we gebruiken borders als scheiding */
  box-sizing: border-box;
}

/* tegel: desktop exact 4 kolommen die samen 100% vullen */
.woning-kenmerken .views-field {
  position: relative;
  box-sizing: border-box;
  /* vier kolommen: 100% min 3 scheidslijnen (3x1px), gedeeld door 4 */
  flex: 0 0 calc((100% - 3px) / 4);
  min-width: 0; /* laat inhoud krimpen indien nodig (ellipsis werkt) */

  padding: 40px 16px 40px 64px; /* ruimte voor icoon + wat rechts */
  color: #0a0a36;

  /* verticale scheidslijn alleen tussen kolommen */
  border-right: 1px solid #cfd3d6;
}

/* geen lijn na de laatste kolom op desktop */
.woning-kenmerken .view-content-wrap .item > .views-field:nth-child(4) {
  border-right: 0;
}

/* icoon links */
.woning-kenmerken .views-field::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 40px;
  width: 32px;
  height: 32px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left top;
}

/* label op één regel met ellipsis (JS schaalt corps overal gelijk) */
.woning-kenmerken .views-label {
  display: block;
  font-weight: 800;
  font-size: 28px;   /* wordt door je JS eventueel verlaagd */
  line-height: 1.15;
  margin: 0 0 6px 0;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* waarde (eventueel ook door JS geschaald) */
.woning-kenmerken .field-content {
  display: block;
  font-size: 28px;
  line-height: 1.25;
  font-weight: 400;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* iconen (pad: ../images/...) */
.woning-kenmerken .views-field-field-woonoppervlak::before   { background-image: url("../images/gbo.svg"); }
.woning-kenmerken .views-field-field-kaveloppervlak::before  { background-image: url("../images/kavel.svg"); }
.woning-kenmerken .views-field-field-slaapkamers::before     { background-image: url("../images/kamers.svg"); }
.woning-kenmerken .views-field-field-parkeerplaatsen::before { background-image: url("../images/parkeer.svg"); }

/* volgorde (optioneel) */
.woning-kenmerken .views-field-field-woonoppervlak   { order: 1; }
.woning-kenmerken .views-field-field-kaveloppervlak  { order: 2; }
.woning-kenmerken .views-field-field-slaapkamers     { order: 3; }
.woning-kenmerken .views-field-field-parkeerplaatsen { order: 4; }

/* tablet: 2 kolommen, lijnen tussen én een horizontale lijn tussen rijen */
@media (max-width: 1024px) {
  .woning-kenmerken .views-field {
  flex: 0 0 calc((100% - 1px) / 2); /* 2 kolommen, 1 scheidslijn */
  padding-left: 56px;
  border-right: 1px solid #cfd3d6;
  border-bottom: 1px solid #cfd3d6; /* lijn tussen rijen */
  }
  /* geen rechterlijn op het einde van elke rij van 2 */
  .woning-kenmerken .view-content-wrap .item > .views-field:nth-child(2n) {
  border-right: 0;
  }
  .woning-kenmerken .views-label,
  .woning-kenmerken .field-content {
  font-size: 24px;
  }
}

/* mobiel: 1 kolom, alleen horizontale lijnen, laatste zonder lijn */
@media (max-width: 640px) {
  .woning-kenmerken .views-field {
  flex: 0 0 100%;
  padding: 20px 0 20px 52px;
  border-right: 0;
  border-bottom: 1px solid #cfd3d6;
  }
  .woning-kenmerken .view-content-wrap .item > .views-field:last-child {
  border-bottom: 0;
  }
  .woning-kenmerken .views-label,
  .woning-kenmerken .field-content {
  font-size: 22px;
  }
}



.views-field-field-plattegronden-1 .field-content{font-size: 22px; font-weight: 800; color: #0a0a36}

.type-info .kenmerk-label{font-family: "Young Serif", serif; font-size: 24px; margin-bottom: 20px; color:#0a0a36 }
.type-info .kenmerk-type{font-family: "Young Serif", serif; font-size: 44px; margin-bottom: 30px; color:#0a0a36}
.type-info .kenmerk-soort{font-size: 22px; font-weight: 600; margin: 30px 0 20px 0; color:#0a0a36}
.type-info .kenmerk-hnr{font-size: 24px; font-weight: 600; text-transform: uppercase; margin: 15px 0 0 0; color:#0a0a36}
.type-info .kenmerk-bnr{font-size: 20px; font-weight: 600; text-transform: uppercase; margin: 10px 0 0 0; color:#717A92}

/* lijst in 2 kolommen */
.kenmerken .item-list ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 32px;   /* ruimte tussen rijen en kolommen */
  margin: 0;
  padding: 0;
  list-style: none; /* standaard bullets weg */
}

/* li met custom bullet */
.kenmerken .item-list li.view-list-item {
  position: relative;
  padding-left: 24px;   /* ruimte voor bolletje */
  margin: 0 0 5px;
  color: #0a0a36;       /* tekstkleur */
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
}

.kenmerken .item-list li.view-list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border: 2px solid #0a0a36;
  border-radius: 50%;
  background: transparent;
}



.margin-auto{margin-left: auto; margin-right: auto;}
.main{padding-top: 80px;}
.node--type-woningen .main,
.node--type-woningtypen .main{padding-top: 0;}

.copyright-inner .content.block-content {
  display: flex;
  justify-content: space-between; /* eerste links, tweede rechts */
  align-items: center;            /* netjes verticaal uitlijnen */
}

.copyright-inner .content.block-content p {
  margin: 0; /* standaard marge weghalen */
}

.footer-second .field.field--name-body {
  display: flex;
  align-items: center;   /* centreert verticaal */
  height: 80px;          /* of bv. 100px / 100vh afhankelijk van de context */
}

.footer-second .field.field--name-body p {
  margin: 0;             /* standaard marge weghalen */
  font-size: 18px;
  padding-left: 20px;
}

#block-vastenburghof-logodebuntevastgoedoost img{max-width: 170px;}
#block-vastenburghof-contactmakelaars img{max-width: 160px; position: relative;  top: -20px;}

/* responsive: terug naar 1 kolom */
@media (max-width: 768px) {
  .kenmerken .item-list ul {
  grid-template-columns: 1fr;
  }
  
  .slideshow-blok .slide-subtitle {
    font-size: 20px;
    line-height: 1.3;
  }
  .footer-second .field.field--name-body {
    display: block;
    height: initial;
  }
  .copyright-inner .content.block-content{display: block;}
  .main{padding-top: 40px;}
  h2.title{font-size: 40px;}
  .gsc-heading.style-1 .title, .content-title {
      font-size: 40px;
  }
  .grecaptcha-badge{display: none;}
}

thead{background: #717A92; color: #ffffff;}
td.views-field-field-status{font-weight: 600;}
.tablesaw td{padding: 1em;}


.gbb-row-wrapper.section.row-first-level.first-map {
  position: relative;
  z-index: 1;
}

.gbb-row-wrapper.section.row-first-level.first-map::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%; /* hoogte van de schaduw */
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%);
  z-index: 2;
}

.views-field-field-impressies-wt-1{text-align: center; margin-top: 10px; padding-top: 5px; border-top: 1px solid #717A92}