@import url('./vars.css');
@import url('./footer.css');
@import url('./hero.css');
@import url('./waarom.css');
@import url('./werkgevers.css');
@import url('./over-ons.css');
@import url('./reviews.css');
@import url('./sections.css');
@import url('./parallax.css');
@import url('./cta-animation.css');
@import url('./navbar/navbar-base.css');
@import url('./navbar/navbar-dropdown.css');
@import url('./navbar/navbar-search.css');
@import url('./navbar/navbar-buttons.css');
@import url('./navbar/navbar-toggle.css');


* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

@media (max-width: 768px) {
  main {
    padding: 2.5% 6%;
  }

  section {
    padding: 0 1rem;
  }

  #section-hero,
  #section-waarom,
  #section-over-ons {
    width: 100%;
  }
}

.section-row img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}


body {
  font-family: var(--ff-noir);
  background-color: var(--bg-dark);
  color: var(--light-base);
}

a {
  text-decoration: none;
}

.btn {
  text-decoration: none !important;
}

.btn,
.btn:hover,
.btn:focus,
.btn:visited {
  text-decoration: none !important;
}


.divider {
  background-image: url('/assets/divider/Divider.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: auto;

  width: 100%;
}




main {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  height: fit-content;
  width: 100%;
  padding: 2.5% 12%;
  margin-top: 3%;
  margin-bottom: 3%;
  gap: 1rem;
}



section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: fit-content;
  width: 100%;
  gap: 32px;
  margin-bottom: 64px;
  padding: 0;
}



footer {
  width: 100%;
  background-color: var(--bg-base);
  color: var(--light-base);
  padding: 2vw 4vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  justify-content: center;
}