body {
  margin: 0;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: #f9f6f1;
  color: #333;
}

section {
  scroll-margin-top: 80px;
  margin-bottom: 2rem;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

section.visible {
  opacity: 1;
  transform: translateY(0);
}

header {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.Indexlogo {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.container {
  max-width: 4000px;
  margin: 2rem auto;
  padding: 0 1rem;

}

.slogan {
  font-size:1.25rem;
  text-align: center;
}
/* Zorg dat de form elementen breed zijn binnen .container_contact */
.container_contact form input,
.container_contact form textarea {
  width: 100%;        /* volledige breedte van de container */
  max-width: 800px;   /* maximale breedte, kan je aanpassen */
  padding: 0.5rem;
  font-size: 1rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box; /* belangrijk voor padding + width */
}

/* Maak de container_contact ook iets breder als je wilt */
.container_contact {
  max-width: 900px;   /* iets breder dan nu */
  margin: 2rem auto;
  padding: 0 1rem;
}

/* Optioneel: knop ook breed maken */
.container_contact form button {
  width: 100%;
  max-width: 800px;
  padding: 0.75rem;
  background-color: #5c4528;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 1.1rem;
}

.container_contact form button:hover {
  background-color: #48391f;
}

}

h2 {
  color: #5c4528;
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
}

.navbar-custom {
  background-color: #e0d6c8;
}

.navbar-custom .navbar-brand,
.navbar-custom .nav-link {
  color: #5c4528 !important;
  font-weight: bold;
}

footer {
  background-color: #5c4528;
  color: #fff;
  text-align: center;
  padding: 1rem;
}

/* Hover effect op nav-links */
.navbar-custom .nav-link:hover {
  background-color: #d6c9b8; /* iets donkerder dan de navbar zelf */
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

/* Actieve link (pagina waarop je bent) */
.navbar-custom .nav-link.active {
  background-color: #c2b4a3;
  color: #fff !important;
  border-radius: 5px;
}

.navbar .dropdown .btn { border: none !important;