.contact-page {
  background-color: #1A1F25;
  color: #F3F3E9;    
}
.titel{
    font-family: 'MonumentExtendedUltraBold', sans-serif ;
}
.under-titel{
    font-family: 'MonumentExtended', sans-serif;
}

.under-titel{
    font-weight: 300;
}
.small-text {
  font-weight: 200;
  font-size: clamp(0.85rem, 1vw + 0.5rem, 1.2rem);
  line-height: 1.4;
}


.small-text bold{
  font-weight: 800;
}


.contact-page h2 {
  font-family: 'MonumentExtended-Regular', sans-serif;
  color: #fff;
}

.contact-page .custom-input {
  background: transparent;
  border: none;
  border-bottom: 1px solid #fff;
  border-radius: 0;
  color: #fff;
}

.contact-page .custom-input::placeholder {
  color: #ccc;
}

.contact-page .custom-input:focus {
  box-shadow: none;
  border-color: #0d6efd; /* accentkleur */
}

#formMessage.text-success {
  color: #77ff96 !important; /* groen */
  background-color: #b0ebbe3b !important;
  border: 2px solid #77ff96 !important;
  border-radius: 5px !important;
  padding: 5px 10px !important;
}

#formMessage.text-danger {
  color: #e94b5b !important; /* rood */
  background-color: #f9c2c671 !important; /* lichtroze achtergrond voor contrast */
  border: 2px solid #e94b5b !important; /* rode border */
  border-radius: 5px !important;
  padding: 5px 10px !important;
}

.contact-page .row {
  display: flex; /* forceert gelijke hoogte van beide kolommen */
  align-items: stretch; /* beide kolommen rekken uit */
}

.contact-page iframe {
  width: 100%;
  height: 100%;  /* neemt de volledige hoogte van de row */
  border-radius: 0.5rem;
  min-height: 450px; /* optioneel, zodat op small screens het niet té klein wordt */
}
.mediaicons a {
  display: inline-block;
  margin-right: 15px;
  font-size: 28px;        /* grootte van de iconen */
  color: #fff;            /* standaard wit */
  transition: color 0.3s, transform 0.3s;
}

.mediaicons a:hover {
  transform: scale(1.2);  /* klein zoom-effect */
}

.mediaicons a:hover {
color: #f5c252;  
}