/* =============ABSTRACTS==================== */
.fade-in-section {
  opacity: 0;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, transform 0.5s;
  transition: opacity 0.5s, transform 0.5s, -webkit-transform 0.5s;
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.fade-in-section.is-visible {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

/* =============BASE==================== */
/* VARIABLES =================================================================== */
/*
$gutter: 2%;
$columns: 16;
*/
/* STYLES ====================================================================== */
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  font-family: sans-serif;
  height: 100%;
  max-width: 3000px;
  margin: 0 auto;
  padding: 0;
}

p {
  margin-top: 0;
}
p:last-of-type {
  margin-bottom: 0;
}

#form-success {
  display: none;
}

#feedback.erroneous, #feedback.error {
  padding: 10px;
  text-align: center;
  background-color: crimson;
  color: #fff;
  margin-bottom: 10px;
  font-weight: bold;
}

/* MEDIA QUERY'S =============================================================== */
* {
  outline: none;
}

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
  margin: 0;
  padding: 0;
}

audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden], template {
  display: none;
}

a {
  background-color: transparent;
}

a:active, a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b, strong {
  font-weight: 100;
  font-family: "Helvitica bold";
  color: #000;
}

b, strong:hover {
  text-decoration: none;
}

dfn {
  font-style: italic;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

input, optgroup, select, textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button, select {
  text-transform: none;
}

button, html input[type=button], input[type=reset], input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled], html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
  border-radius: 0;
}

input[type=checkbox], input[type=radio] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

input[type=number]::-webkit-inner-adjust-hue-button, input[type=number]::-webkit-outer-adjust-hue-button {
  height: auto;
}

input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
  border-radius: 0;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td, th {
  padding: 0;
}

/* GRID ======================================================================== */
.clear:before, .clear:after {
  content: "";
  display: table;
}
.clear:after {
  clear: both;
}

body {
  width: 100%;
}
body:before, body:after {
  content: "";
  display: table;
}
body:after {
  clear: both;
}

/* EXTRA ======================================================================= */
img.scale {
  max-width: 100%;
  height: auto;
}

::-moz-selection {
  background: RoyalBlue;
  color: #fff;
}

::selection {
  background: RoyalBlue;
  color: #fff;
}

::-moz-selection {
  background: RoyalBlue;
  color: #fff;
}

#privacypolicy {
  position: fixed;
  right: 0;
  bottom: 0;
  background: rgba(238, 238, 238, 0.6);
  color: RoyalBlue;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 15px 30px;
  width: 100%;
  font-size: 11px;
  line-height: 22px;
  opacity: 0;
  -webkit-transform: translate(0, 30px);
      -ms-transform: translate(0, 30px);
          transform: translate(0, 30px);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  pointer-events: none;
}
#privacypolicy.active {
  opacity: 1;
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
          transform: translate(0, 0);
  pointer-events: auto;
}
#privacypolicy a {
  color: RoyalBlue;
}
#privacypolicy .privacy-btn {
  background-image: url("../images/privacy-close.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: absolute;
  top: 15px;
  right: 10px;
  width: 15px;
  height: 15px;
  cursor: pointer;
}

/* CMS ========================================================================= */
.uniform__potty {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.erroneous {
  border-color: crimson !important;
}

/* PLUGINS ===================================================================== */
@font-face {
  font-family: "Helvitica";
  src: url("../fonts//HelveticaNeueLTStd-LtEx.otf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Helvitica bold";
  src: url("../fonts//HelveticaNeueLTStd-MdEx.otf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
html {
  font-family: "Helvitica";
  font-size: 62.5%;
}

body {
  font-family: "Helvitica";
  line-height: 1.8;
  font-size: 18px;
}

h1, h2, h3 {
  margin: 0;
  padding: 0;
}
h1 a, h2 a, h3 a {
  text-decoration: none;
}

p {
  margin: 0;
}
p:not(p:last-of-type) {
  padding-bottom: 2rem;
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  height: 100%;
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

body {
  height: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
}

img {
  height: 100%;
  width: 100%;
  border-radius: 10px;
}

.error__container a {
  color: unset;
  text-decoration: underline;
}

.swiper {
  height: 100%;
  width: 100%;
}

.isie {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 9999999;
  background: white;
  top: 0;
  left: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.isie h1 {
  padding-bottom: 2vw;
}
.isie .close-isie {
  text-decoration: underline;
  padding-top: 1vw;
  cursor: pointer;
}

.hidden {
  display: none;
  visibility: hidden;
  opacity: 0;
  height: 0;
}

.ratio__portrait {
  position: relative;
  height: 0;
  width: 100%;
  padding-bottom: 150%;
  overflow: hidden;
}
.ratio__landscape {
  position: relative;
  height: 0;
  width: 100%;
  padding-bottom: 70%;
  overflow: hidden;
}
.ratio__square {
  position: relative;
  height: 0;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
}
.ratio__fullscreen {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.ratio__thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.ratio__logo {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.ratio__video {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 124%;
}

/* =============COMPONENTS==================== */
#menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
  padding-left: 90px;
  padding-right: 50px;
  background-color: white;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.logo {
  height: 50px;
  margin-right: 20px;
}

#nav-links {
  list-style-type: none;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 80px;
}

#nav-links li {
  margin: 0;
  padding: 0;
}

#nav-links a {
  text-decoration: none;
  color: black;
  font-weight: 400;
  font-size: 16px;
  padding: 5px 1px;
}

#nav-links a:hover {
  color: #4CAF50;
}

#nav-links a.active {
  font-weight: bold;
  border-bottom: 2px solid #4CAF50;
}

.logolanding {
  height: 20%;
  width: auto;
  padding: 50px;
}

.hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 24px;
  width: 40px;
  position: relative;
  z-index: 1000;
}

.hamburger .bar {
  width: 100%;
  height: 3px;
  background-color: black;
  border-radius: 5px;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  position: relative;
}

.hamburger.active .bar:nth-child(1) {
  -webkit-transform: rotate(45deg) translateY(-50%);
      -ms-transform: rotate(45deg) translateY(-50%);
          transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform-origin: center;
      -ms-transform-origin: center;
          transform-origin: center;
}

.hamburger.active .bar:nth-child(2) {
  opacity: 0;
}

.hamburger.active .bar:nth-child(3) {
  -webkit-transform: rotate(-45deg) translateY(-50%);
      -ms-transform: rotate(-45deg) translateY(-50%);
          transform: rotate(-45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform-origin: center;
      -ms-transform-origin: center;
          transform-origin: center;
}

.submenu {
  background-color: #EDEDED;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 40px;
  list-style-type: none;
  margin: 0;
  padding: 5px 0;
  padding-right: 50px;
  padding-left: 90px;
}

.submenu li a {
  text-transform: uppercase;
  font-size: 12px;
  text-decoration: none;
  color: black;
}

.submenu li a:hover {
  text-decoration: underline;
}

.submenu-mobile {
  display: none;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
  list-style-type: none;
  padding: 10px 0;
  background-color: #EDEDED;
  width: 100%;
}

#nav-links.show + .submenu-mobile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (max-width: 1200px) {
  .logolanding {
    height: 20%;
    width: auto;
    padding: 20px;
  }
  #menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 10px;
    padding-top: 10px;
    background-color: white;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    overflow: hidden;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  .logo {
    height: 40px;
    margin-right: 20px;
  }
  #nav-links {
    z-index: 999;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: fixed;
    top: 60px;
    padding-left: 30px;
    right: 0;
    background-color: white;
    width: 100%;
    height: calc(100vh - 60px);
    gap: 10px;
    margin-top: 20px;
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0.4s ease, -webkit-transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    transition: opacity 0.4s ease, -webkit-transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    transition: transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.4s ease;
    transition: transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.4s ease, -webkit-transform 0.7s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    overflow-y: auto;
  }
  #nav-links.show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
  }
  .hamburger {
    width: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .logo {
    margin-bottom: 0;
  }
  .submenu {
    display: none;
  }
  .submenu-mobile {
    display: block;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 20px;
    list-style-type: none;
    padding: 10px 0;
    background-color: #EDEDED;
    width: 100%;
  }
  .submenu-mobile a {
    text-decoration: none;
    color: black;
    font-size: 14px;
  }
  .submenu-mobile a:hover {
    text-decoration: underline;
  }
}
/* Verberg het contactitem standaard */
.mobile-only {
  display: none;
}

/* Toon het contactitem alleen op mobiele schermen */
@media screen and (max-width: 1200px) {
  .mobile-only {
    display: block;
  }
}
@media screen and (max-width: 480px) {
  .logolanding {
    height: 20%;
    width: auto;
  }
  #menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0px;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    background-color: white;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    overflow: hidden;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
}
.footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: #f5f5f5;
  padding: 90px;
  font-family: "helvitica";
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* Allow wrapping on smaller screens */
}

.hulpvraagtitel {
  display: block;
  font-size: inherit;
  font-weight: bold !important;
  opacity: 1 !important;
  font-size: 14px;
  line-height: 1.4;
  color: #333;
}

.footer__credit {
  background-color: #f5f5f5;
  position: static;
  text-align: right;
  padding: 30px;
  font-size: 14px;
}

.footer__credit a {
  color: black;
  text-decoration: none;
}

.footer__credit a:hover {
  text-decoration: underline;
}

.logo2 {
  height: 50px;
}

.logofooter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.footlefttext {
  margin-top: 70px;
  width: 50%;
}

.footerleft {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 65%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.footer__sitemap ul li:hover a {
  color: #005e2b;
}

.footerright {
  margin-top: 135px;
  width: 30%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.footer__sociallist {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.footer__contact,
.footer__sitemap,
.footer__socials,
.footer__legal {
  width: 100%;
  margin-bottom: 20px;
}

.footer__sociallist ul {
  list-style: none;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 30px;
}

.footer__sociallist ul li {
  margin: 0;
}

.footer__sociallist ul li a {
  text-decoration: none;
  color: #000000;
}

.footer__sociallist ul li a:hover {
  color: #333;
}

.footer h3 {
  font-family: "helvitica";
  font-size: 18px;
  margin-bottom: 20px;
  color: #000000;
}

.footer p,
.footer ul {
  opacity: 0.64;
  font-size: 14px;
  line-height: 1.7;
  color: #333;
}

.footer ul {
  list-style: none;
  padding: 0;
}

.footer ul li {
  margin-bottom: 5px;
}

.footer ul li a {
  text-decoration: none;
  color: #000000;
}

.footer ul li a:hover {
  color: #005e2b;
}

.footer__contact a {
  color: #000000;
  text-decoration: none;
}

.footer__contact a:hover {
  color: #005e2b;
}

.footer__legal ul {
  list-style: none;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 30px;
}

.footer__legal ul li {
  margin: 0;
}

.footer__legal ul li a {
  text-decoration: none;
  color: #000000;
}

.footer__legal ul li a:hover {
  color: #005e2b;
}

.footer__sitemap ul {
  list-style: none;
  padding: 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.footer__sitemap ul li {
  margin: 0;
}

.footer__sitemap ul li a {
  text-decoration: none;
  color: #000000;
}

.footlefttext-contact {
  width: 50%;
  padding-top: 20px;
}

.footerright-contact {
  padding-top: 20px;
  width: 30%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* Responsive styling for smaller screens */
@media (max-width: 1024px) {
  .footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 30px;
  }
  .footlefttext-contact {
    width: 100%;
    padding-top: 50px;
  }
  .footerleft,
  .footerright {
    width: 100%;
    margin-top: 30px;
  }
  .footlefttext {
    width: 100%;
    margin-top: 30px;
  }
  .footerblock {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .footer__sitemap ul {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr; /* Stack in a single column */
  }
}
@media (max-width: 768px) {
  .footer {
    padding: 20px;
  }
  .footer__sociallist ul {
    gap: 15px;
  }
  .footer h3 {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .footer p, .footer ul {
    font-size: 12px;
  }
}
@media (max-width: 480px) {
  .logo2 {
    padding-left: 0px;
    height: 40px;
  }
  .footer {
    padding: 30px;
  }
  form {
    width: 100% !important;
  }
  .footer__sitemap ul {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr; /* Single column for smaller screens */
  }
  .footer__sociallist ul {
    gap: 10px;
  }
  .titelfooter {
    margin-bottom: 10px !important;
  }
  .footer h3 {
    margin-bottom: 10px !important;
    font-size: 20px;
  }
  .footer p, .footer ul {
    font-size: 14px;
  }
  .footerright {
    margin-top: 20px;
  }
}
#privacypolicy {
  background: #fff;
  color: #222222;
}
#privacypolicy a {
  color: #222222;
}

.termsfeed-com---nb-simple {
  max-width: 100% !important;
}

.cc-nb-main-container {
  font-size: 1.3rem !important;
  background: #fff !important;
  display: -ms-grid !important;
  display: grid !important;
  -ms-grid-columns: 1fr 1fr !important;
  grid-template-columns: 1fr 1fr !important;
  padding: 2rem 10rem !important;
}
@media (max-width: 1000px) {
  .cc-nb-main-container {
    padding: 2rem 5rem !important;
    -ms-grid-columns: 1fr !important;
    grid-template-columns: 1fr !important;
  }
}
.cc-nb-title {
  font-size: 2.5rem !important;
  text-transform: uppercase !important;
  line-height: 1.3 !important;
  color: #222222 !important;
  margin: 0 !important;
  padding-bottom: 3rem !important;
}
.cc-nb-title-container {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
@media (max-width: 1000px) {
  .cc-nb-title-container {
    grid-column: unset !important;
    grid-row: unset !important;
  }
}
.cc-nb-text {
  color: #222222 !important;
  line-height: 1.5 !important;
  font-size: 1.2rem !important;
}
.cc-nb-text-container {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
}
@media (max-width: 1000px) {
  .cc-nb-text-container {
    grid-column: unset !important;
    grid-row: unset !important;
  }
}
.cc-nb-okagree {
  background: none !important;
  border: none !important;
  color: #222222 !important;
}
.cc-nb-okagree:hover {
  background: #222222 !important;
  color: #fff !important;
}
.cc-nb-reject {
  background: none !important;
  border: none !important;
  color: #222222 !important;
  opacity: 40% !important;
}
.cc-nb-changep {
  color: #222222 !important;
  background: #fff !important;
}
.cc-nb-buttons-container {
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: reverse !important;
      -ms-flex-direction: row-reverse !important;
          flex-direction: row-reverse !important;
  -webkit-box-pack: start !important;
      -ms-flex-pack: start !important;
          justify-content: flex-start !important;
  height: 100% !important;
}
@media (max-width: 1000px) {
  .cc-nb-buttons-container {
    grid-column: unset !important;
    grid-row: unset !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: reverse !important;
        -ms-flex-direction: column-reverse !important;
            flex-direction: column-reverse !important;
  }
}
.cc-nb-buttons-container button {
  text-transform: uppercase !important;
  letter-spacing: 0.075em !important;
  font-size: 1rem !important;
  outline: none !important;
  border-radius: 20px !important;
  -ms-flex-item-align: end !important;
      align-self: flex-end !important;
  padding: 1rem 2rem !important;
}
@media (max-width: 1000px) {
  .cc-nb-buttons-container button {
    width: 100% !important;
  }
}

.cc-cp-foot-save {
  background: #222222 !important;
}
.cc-cp-foot-save:focus {
  outline: none !important;
  border: none !important;
}

.plg-container {
  padding: 30px;
}

/* Basic styling */
form {
  background-color: transparent;
  width: 90%;
  margin-top: 75px;
  padding-right: 90px;
}

/* Flexbox styling for row and columns */
.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.form-left, .form-right {
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%; /* Both columns take up 48% width */
}

.form-right {
  margin-left: 30px;
}

.form-column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

label {
  font-weight: bold;
  color: #333;
  font-size: 14px;
}

input[type=text],
input[type=email],
input[type=tel],
textarea {
  padding-left: 0px;
  width: 100%;
  background-color: transparent;
  padding-top: 10px;
  padding-bottom: 5px;
  margin-bottom: 50px;
  border: none;
  border-bottom: 1px solid #68B728; /* Light green underline */
  font-size: 16px;
  outline: none;
}

input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
textarea:focus {
  border-bottom-color: #6B8E23; /* Darker green on focus */
}

textarea {
  height: 100px;
}

.group-category {
  margin-bottom: 20px;
}

.checkbox-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.checkbox-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 5px; /* Ruimte tussen checkbox en label */
}

.checkbox-item label {
  margin: 0; /* Zorg ervoor dat er geen extra marge bij het label is */
}

.checkbox-group label {
  margin-top: 5px;
  margin-right: 10px;
}

.submit-button {
  background-color: #68b728; /* Light green button */
  color: white;
  padding: 18px 35px;
  border: none;
  cursor: pointer;
  font-size: 14px;
  float: right;
  margin-top: 20px;
  border-radius: 70px;
  font-family: "Helvetica";
}

.submit-button:hover {
  background-color: #6B8E23; /* Darker green on hover */
}

.policy {
  margin-top: 20px;
}

a {
  color: #007BFF;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

.form-column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

/* Standaard instellingen */
#contact-form {
  display: block; /* Standaard zichtbaarheid voor desktop */
}

#contact-form-mobile {
  display: none; /* Standaard verborgen */
}

/* Verberg het desktopformulier en toon alleen het mobiele formulier op schermen kleiner dan 768px */
@media (max-width: 1024px) {
  #contact-form {
    display: none; /* Verberg desktopformulier */
  }
  #contact-form-mobile {
    display: block; /* Toon mobiele versie */
  }
}
/* Media Queries for Responsiveness */
/* Tablets and small screens */
@media (max-width: 1024px) {
  .checkbox-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 20px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
  }
  form {
    width: 85%; /* Adjust form width */
    padding-right: 30px;
  }
  .row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; /* Stack form columns */
  }
  .form-left, .form-right {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%; /* Full-width form inputs */
  }
  .form-right {
    margin-left: 0px;
  }
  .submit-button {
    float: none;
    width: 100%; /* Full-width submit button */
    text-align: center;
    margin-top: 20px;
  }
}
/* Mobile devices */
@media (max-width: 768px) {
  .order-1 {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .order-2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .order-3 {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .order-4 {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .order-5 {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
  .order-6 {
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
  }
  .order-7 {
    -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
            order: 7;
  }
  form {
    width: 90%; /* Further adjust form width */
    padding-right: 20px;
    padding-left: 20px;
  }
  input[type=text],
  input[type=email],
  input[type=tel],
  textarea {
    margin-bottom: 30px; /* Reduce spacing for mobile */
  }
  .submit-button {
    width: 100%;
    margin-top: 10px;
    padding: 16px; /* Adjust padding for smaller screens */
  }
  .checkbox-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 15px;
    margin-bottom: 20px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
  }
}
/* Small mobile devices */
@media (max-width: 480px) {
  form {
    width: 100%; /* Full width on very small screens */
    padding-right: 15px;
    padding-left: 0px;
  }
  input[type=text],
  input[type=email],
  input[type=tel],
  textarea {
    margin-bottom: 20px; /* Reduce margin for inputs */
  }
  .submit-button {
    padding: 14px; /* Slightly smaller button for tiny screens */
  }
}
.feedbackcontact2 {
  font-size: 14px;
  opacity: 0;
  color: #333;
  padding: 10px;
  padding-left: 0px;
}

.privacy-policy {
  color: #333;
}

.fancybox__content {
  padding: 5rem !important;
}
.fancybox__content .carousel__button.is-close {
  top: 0 !important;
  right: 0;
}
.fancybox__content .carousel__button.is-close svg {
  color: #222222;
  -webkit-filter: none;
          filter: none;
  width: 2rem;
  height: 2rem;
}

.swiper-buttons-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.swiper-buttons-prev, .swiper-buttons-next {
  position: relative;
  cursor: pointer;
  padding: 1rem 0;
}
.swiper-buttons-prev span, .swiper-buttons-next span {
  position: relative;
  display: block;
  width: 2.5rem;
  height: 1px;
  background: #222222;
  margin: 2px 0 0 2rem;
}
.swiper-buttons-prev span:before, .swiper-buttons-prev span:after, .swiper-buttons-next span:before, .swiper-buttons-next span:after {
  content: "";
  width: 4px;
  height: 1px;
  background: #222222;
  position: absolute;
  -webkit-transform-origin: right;
      -ms-transform-origin: right;
          transform-origin: right;
  top: 0;
  right: 0;
}
.swiper-buttons-prev span:before, .swiper-buttons-next span:before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.swiper-buttons-prev span:after, .swiper-buttons-next span:after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.swiper-buttons-prev span {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

/* Base styling for the circular button */
.circle-button {
  margin-top: 97px;
  background-color: #77b745;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.circle-button:hover {
  background-color: #69a03d;
}

/* Styling for the down arrow */
.arrow-down {
  font-size: 24px;
  color: white;
}

/* Positioning the button */
.scroll-button {
  display: inline-block;
  text-decoration: none;
  position: relative;
}

/* Responsive Design: Adjust size and margins for smaller screens */
@media (max-width: 768px) {
  .circle-button {
    width: 35px;
    height: 35px;
    margin-top: 50px;
  }
  .arrow-down {
    font-size: 20px;
  }
}
@media (max-width: 480px) {
  .circle-button {
    width: 30px;
    height: 30px;
    margin-top: 30px;
  }
  .arrow-down {
    font-size: 18px;
  }
}
.columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-left: -1rem;
  margin-right: -1rem;
}

.column {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 100%;
          flex: 0 1 100%;
  margin-left: 1rem;
  margin-right: 1rem;
  max-width: 100%;
}

@media (max-width: 1000px) {
  .column {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
}
.homehero {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.homehero-text {
  padding-left: 90px;
}

.homehero-titel {
  line-height: 1.4;
  color: black;
  font-family: "helvitica";
  position: relative;
  z-index: 2;
  font-size: 47px;
}

.homehero-textblok {
  line-height: 1.7;
  max-width: 600px;
  font-size: 14px;
  text-align: left;
  color: black;
}

.homehero-textblok2 {
  line-height: 1.7;
  max-width: 500px;
  font-size: 14px;
  text-align: left;
  color: black;
}

.homehero-image {
  z-index: 1;
  max-width: 50%;
  height: auto;
}

.homecontent {
  font-size: 1.1em;
  color: #666;
}

.homecontent p {
  margin-bottom: 14px;
}

@media (max-width: 1024px) {
  .homehero {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 30px;
    padding-top: 200px;
  }
  .homehero-text {
    padding-left: 0;
    text-align: start;
  }
  .homehero-image {
    max-width: 70%;
  }
  .homehero-titel {
    text-align: start;
    font-size: 40px;
  }
  .homehero-textblok {
    font-size: 14px;
    max-width: 100%;
    text-align: start;
  }
}
@media (max-width: 768px) {
  .homecontent {
    padding: 5px;
    color: #666;
  }
  .homehero-text,
  .homehero-image {
    margin-bottom: 40px;
    max-width: 100%;
    padding-left: 0;
  }
  .homehero-image img {
    max-width: 80%;
  }
  .homehero-titel {
    font-size: 30px;
  }
  .homehero-textblok {
    max-width: 100%;
    font-size: 14px;
  }
}
@media (max-width: 480px) {
  .homehero {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 30px;
    padding-top: 100px;
  }
  .homehero-image img {
    max-width: 100%;
  }
  .homehero-titel {
    font-size: 30px;
  }
  .homehero-textblok {
    font-size: 14px;
  }
  .homecontent {
    font-size: 1em;
  }
}
.titel-werkwijze {
  line-height: 1.4;
  margin-top: 111px;
  padding-right: 90px;
  padding-left: 90px;
  position: relative;
  z-index: 2;
  font-size: 47px;
  font-family: "helvitica";
}

/* steps */
.steps-container {
  padding-right: 90px;
  padding-left: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.step {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(20% - 3rem);
          flex: 1 1 calc(20% - 3rem);
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.stepstitel {
  font-size: 18px;
}

.steptext {
  margin-bottom: 20px;
}

.step-imagecontainer {
  margin: auto 0 0 0;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%; /* This sets a square aspect ratio for consistency */
  overflow: hidden;
}

.step-imagecontainer img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px; /* Adjust or remove if rounded corners are not desired */
}

.stepnummers {
  color: #4CAF50;
  font-size: 35px;
}

.step p {
  margin-top: 5px;
  font-size: 14px;
  line-height: 1.7;
}

/* Responsive Styles */
@media (max-width: 1200px) {
  .steps-container {
    padding-right: 60px;
    padding-left: 60px;
  }
  .step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
  }
}
@media (max-width: 992px) {
  .steps-container {
    padding-right: 30px;
    padding-left: 30px;
  }
  .step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    min-width: 100%;
  }
}
@media (max-width: 768px) {
  .titel-werkwijze {
    margin-top: 50px;
    padding-right: 30px;
    padding-left: 30px;
    position: relative;
    z-index: 2;
    font-size: 30px;
    font-family: "helvitica";
  }
  .steps-container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    min-width: 100%; /* Zorgt ervoor dat ze stapelen */
  }
}
@media (max-width: 576px) {
  .step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    min-width: 100%;
  }
}
/*  */
/*quote  */
.quotesection {
  margin-top: 200px;
  margin-bottom: 10px;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.quotetext {
  line-height: 1.17;
  font-size: 47px;
}

@media (max-width: 1024px) {
  .quotesection {
    margin-top: 50px;
    margin-bottom: 120px;
  }
  .quotetext {
    font-size: 47px;
  }
}
/* Media query for mobile devices */
@media (max-width: 768px) {
  .quotesection {
    margin-top: 100px;
    margin-bottom: 80px;
  }
  .quotetext {
    font-size: 35px;
    line-height: 1.3;
    /* Adjust line-height for smaller text */
  }
}
/* Media query for very small mobile screens */
@media (max-width: 480px) {
  .quotesection {
    margin-top: 70px;
    margin-bottom: 50px;
  }
  .quotetext {
    font-size: 28px;
    line-height: 1.4;
  }
}
/*  */
/* 
..duurzaam */
.containerduurzaam {
  padding: 0 90px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.image-container {
  width: 50%;
}

.image-container img {
  width: 80%;
}

.duurzaamtextblock {
  width: 40%;
}

.duurzaam {
  padding: 0px;
}

.contentduurzaam {
  width: 40%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.duurzamentextblock {
  width: 100%;
}

.duurzamentext {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
  margin-top: auto;
  /* Pushes the text to the bottom */
}

.prijslink:hover {
  text-decoration: none;
}

.duurzaamtitel {
  font-family: "helvitica";
  font-size: 47px;
  margin-bottom: 20px;
  line-height: 1.4;
}

.duurzaam img {
  max-width: 100%;
  height: auto;
}

/* Media query for tablet devices */
@media (max-width: 1024px) {
  .containerduurzaam {
    padding: 0 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .image-container,
  .contentduurzaam {
    width: 100%;
    text-align: center;
  }
  .image-container img {
    width: 60%;
  }
  .duurzaamtitel {
    text-align: start;
    margin-top: 50px;
    font-size: 45px;
  }
}
/* Media query for mobile devices */
@media (max-width: 768px) {
  .containerduurzaam {
    padding: 0 30px;
  }
  .image-container img {
    width: 100%;
  }
  .duurzaamtitel {
    font-size: 25px;
  }
  .duurzamentext {
    text-align: left;
    font-size: 14px;
  }
}
/*  */
/* prijs */
.prijsscontainer {
  padding-bottom: 108px;
  padding-top: 150px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* Zorgt ervoor dat elementen onder elkaar staan */
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* Centreert de inhoud horizontaal */
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.wittebol {
  width: 10px;
  /* Breedte van de bol */
  height: 10px;
  /* Hoogte van de bol (zelfde als breedte voor een cirkel) */
  background-color: white;
  /* Witte achtergrond */
  border-radius: 50%;
  /* Maakt het element rond */
}

.prijsssection {
  margin: 0 90px;
  border-radius: 10px;
  margin-top: 190px;
  margin-bottom: 195px;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #6abf47;
  /* The green background */
}

.prijstitel {
  font-family: "helvitica";
  font-size: 60px;
  color: #fff;
  line-height: 1.4;
  margin-bottom: 10px;
}

.prijsscontainer p {
  font-family: "helvitica";
  font-size: 20px;
  color: #fff;
  line-height: 1.7;
  max-width: 900px;
  margin: 0 auto 10px;
}

.cta-button {
  font-size: 18px;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid #fff;
  padding: 10px 20px;
  display: inline-block;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.cta-button:hover {
  background-color: #fff;
  color: #68b728;
}

/* Responsive Styles */
@media (max-width: 1024px) {
  .prijsssection {
    margin: 0 0px;
    border-radius: 0px;
    margin-top: 190px;
    margin-bottom: 195px;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: #6abf47;
    /* The green background */
  }
  .prijstitel {
    font-family: "helvitica";
    font-size: 30px;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 10px;
  }
  .prijsscontainer h1 {
    font-size: 50px;
  }
  .prijsscontainer {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .prijsscontainer p {
    font-size: 18px;
  }
  .cta-button {
    font-size: 16px;
  }
}
@media (max-width: 768px) {
  .prijsssection {
    margin-top: 15px;
    margin-bottom: 0px;
    padding: 30px;
  }
  .prijsscontainer h1 {
    font-size: 40px;
  }
  .prijsscontainer p {
    font-size: 16px;
  }
}
@media (max-width: 480px) {
  .prijsscontainer h1 {
    font-size: 30px;
  }
  .prijsscontainer p {
    font-size: 14px;
  }
}
/* Voordelen */
.voordelen-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 90px;
  padding-bottom: 200px;
}

.voordeelcontainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* Allow the columns to wrap on smaller screens */
  width: 100%;
  margin: 0 auto;
}

.left-column {
  width: 50%;
}

.right-column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 50%;
}

.left-column, .right-column {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1; /* Zorgt ervoor dat beide kolommen even veel ruimte innemen */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.right-column h2 {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 20px;
}

.right-column p {
  font-size: 14px;
}

.voordelen-list {
  list-style: none;
  padding: 0;
}

.voordeel-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid black;
  padding: 35px 0;
}

.voordeelimg {
  width: 40px;
  height: 40px;
  margin-right: 15px;
}

.voordeelbanner {
  height: auto;
  /* Make the image height responsive */
  width: 80%;
  /* Ensure the image scales to full width */
}

.titelvoordeel {
  line-height: 1.4;
  font-size: 60px;
}

/* Media queries for responsive design */
@media (max-width: 768px) {
  .voordelen-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 30px;
    padding-bottom: 50px;
  }
  .left-column {
    display: none;
  }
  .right-column {
    width: 100%;
    /* Stack columns on smaller screens */
  }
  .voordeel-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    /* Stack items vertically on smaller screens */
    text-align: center;
  }
  .voordeelimg {
    margin-bottom: 15px;
    /* Add space between image and text */
  }
  .titelvoordeel {
    font-size: 40px;
    /* Adjust title font size for smaller screens */
  }
}
@media (max-width: 480px) {
  .right-column h2 {
    font-size: 1.5rem;
    /* Adjust font size further for very small screens */
  }
  .titelvoordeel {
    text-align: center;
    font-size: 30px;
    /* Adjust title font size for mobile */
  }
  .voordeel-item {
    padding: 30px 0;
    /* Reduce padding for smaller screens */
  }
}
/* steps */
.stappensectie {
  padding-bottom: 100px;
  background-color: #68b728;
}

.step::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 2px; /* De dikte van de streep */
  height: 25%; /* Zorg dat de streep de volledige hoogte van de stap inneemt */
  background-color: lightgray; /* Witte kleur voor de streep */
}

.step:last-child::after {
  display: none;
}

.steptexten {
  font-size: 12px;
}

.stepnummers2 {
  color: white;
  font-size: 35px;
}

.steptitel {
  font-size: 18px;
  color: #fff;
}

.steptexts {
  margin-top: 15px;
  color: #fff !important;
  margin-bottom: 20px;
}

.filters {
  padding-top: 100px;
  padding-bottom: 100px;
  margin-left: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* Allows buttons to wrap on smaller screens */
  gap: 10px;
  /* Space between buttons */
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  /* Align filters to the left */
}

/* Buttons styling */
.filter-btn {
  font-family: "Helvetica", sans-serif;
  /* Correcting to the actual font */
  background-color: transparent;
  border: 1px solid white;
  border-radius: 44px;
  color: #fff;
  padding: 10px 20px;
  margin: 5px;
  cursor: pointer;
  font-size: 16px;
  -webkit-transition: background-color 0.3s ease, color 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease;
  /* Add smooth transition for hover effects */
}

/* Active button styling */
.filter-btn.active {
  background-color: white;
  color: #68b728;
}

/* For screens up to 1200px */
@media (max-width: 1200px) {
  .filters {
    margin-left: 40px;
    /* Reduce left margin on medium screens */
    padding-top: 80px;
    padding-bottom: 80px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    /* Center the buttons */
  }
  .filter-btn {
    font-size: 15px;
    padding: 8px 18px;
  }
  .stappensectie {
    padding-bottom: 80px;
    /* Reduce padding */
  }
  .stepnummers2 {
    font-size: 30px;
    /* Reduce font size */
  }
  .steptitel {
    font-size: 22px;
    /* Adjust title font size */
  }
  .steptexts {
    margin-top: 24px;
    margin-bottom: 50px;
    font-size: 15px;
    /* Reduce text size */
  }
}
/* For screens up to 768px */
@media (max-width: 768px) {
  .filters {
    margin-left: 0px;
    /* Further reduce left margin */
    padding-top: 60px;
    padding-bottom: 60px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    /* Center the buttons */
  }
  .filter-btn {
    font-size: 14px;
    padding: 8px 16px;
    /* Adjust padding for smaller screens */
  }
  .stappensectie {
    padding-bottom: 60px;
    /* Further reduce padding */
  }
  .stepnummers2 {
    font-size: 28px;
    /* Adjust step number size */
  }
  .steptitel {
    font-size: 20px;
    /* Reduce step title size */
  }
  .steptexts {
    margin-top: 20px;
    margin-bottom: 40px;
    font-size: 14px;
    /* Smaller text for step description */
  }
}
/* For screens up to 480px (mobile) */
@media (max-width: 480px) {
  .filters {
    padding-bottom: 40px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    /* Keep buttons centered */
  }
  .filter-btn {
    font-size: 12px;
    /* Smaller font size for mobile */
    padding: 6px 12px;
    /* Reduce padding for mobile */
  }
  .stappensectie {
    padding-bottom: 40px;
    /* Minimal padding for mobile */
  }
  .stepnummers2 {
    font-size: 24px;
    /* Smaller font size for step numbers */
  }
  .steptitel {
    font-size: 18px;
    /* Smaller title size */
  }
  .steptext2 {
    margin-top: 0px;
    margin-bottom: 30px;
    font-size: 13px;
    /* Smallest font size for mobile */
  }
}
/* Gallery */
/* Image Gallery Grid Layout */
/* Gallery */
/* Image Gallery Grid Layout */
.image-gallery {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Responsive grid layout */
  grid-gap: 40px; /* Increase the gap between items to ensure no overlap */
  padding: 110px; /* Padding around the gallery */
  position: relative;
  padding-bottom: 100px;
}

/* Gallery Item Styles */
.gallery-item {
  position: relative;
  overflow: hidden; /* Prevent overflow of images */
  padding: 10px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease; /* Smooth transition for hover effects */
}

/* Scattered Effect with Controlled Transforms */
.gallery-item:nth-child(1) {
  -webkit-transform: translate(-10px, 5px) scale(1.05);
      -ms-transform: translate(-10px, 5px) scale(1.05);
          transform: translate(-10px, 5px) scale(1.05);
}

.gallery-item:nth-child(2) {
  -webkit-transform: translate(15px, -10px) scale(1.02);
      -ms-transform: translate(15px, -10px) scale(1.02);
          transform: translate(15px, -10px) scale(1.02);
}

.gallery-item:nth-child(3) {
  -webkit-transform: translate(-15px, 20px) scale(1);
      -ms-transform: translate(-15px, 20px) scale(1);
          transform: translate(-15px, 20px) scale(1);
}

.gallery-item:nth-child(4) {
  -webkit-transform: translate(10px, -20px) scale(0.98);
      -ms-transform: translate(10px, -20px) scale(0.98);
          transform: translate(10px, -20px) scale(0.98);
}

.gallery-item:nth-child(5) {
  -webkit-transform: translate(-20px, 10px) scale(1.03);
      -ms-transform: translate(-20px, 10px) scale(1.03);
          transform: translate(-20px, 10px) scale(1.03);
}

.gallery-item:nth-child(6) {
  -webkit-transform: translate(25px, -5px) scale(1.05);
      -ms-transform: translate(25px, -5px) scale(1.05);
          transform: translate(25px, -5px) scale(1.05);
}

.gallery-item:nth-child(7) {
  -webkit-transform: translate(0px, 15px) scale(0.97);
      -ms-transform: translate(0px, 15px) scale(0.97);
          transform: translate(0px, 15px) scale(0.97);
}

.gallery-item:nth-child(8) {
  -webkit-transform: translate(-5px, -15px) scale(1.04);
      -ms-transform: translate(-5px, -15px) scale(1.04);
          transform: translate(-5px, -15px) scale(1.04);
}

.gallery-item:nth-child(9) {
  -webkit-transform: translate(10px, -5px) scale(1.01);
      -ms-transform: translate(10px, -5px) scale(1.01);
          transform: translate(10px, -5px) scale(1.01);
}

.gallery-item:nth-child(10) {
  -webkit-transform: translate(-10px, 10px) scale(1);
      -ms-transform: translate(-10px, 10px) scale(1);
          transform: translate(-10px, 10px) scale(1);
}

/* Hover Effect to Bring Items Back to Normal */
.gallery-item:hover {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1); /* Reset scale on hover */
}

/* Image Styles */
.gallery-item img {
  width: 100%; /* Full width of the grid column */
  height: 200px; /* Fixed height for uniformity */
  border-radius: 10px; /* Rounded corners */
  -o-object-fit: cover;
     object-fit: cover; /* Ensure images maintain aspect ratio */
}

/* Responsive Design: Tablets */
@media (max-width: 768px) {
  .image-gallery {
    -ms-grid-columns: 1fr 20px 1fr;
    grid-template-columns: repeat(2, 1fr); /* 2 columns for tablet screens */
    grid-gap: 20px; /* Adjust gaps to ensure no overlap */
  }
  .gallery-item {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; /* Reset transforms for simplicity on smaller screens */
  }
  .gallery-item img {
    height: auto; /* Allow height to adjust */
  }
}
/* Responsive Design: Mobile */
@media (max-width: 480px) {
  .image-gallery {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr; /* Single column for mobile */
    grid-gap: 15px; /* Adjust gap */
  }
  .image-gallery {
    padding: 10px;
  }
  .gallery-item {
    padding: 20px; /* Adjust padding */
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; /* No transforms on mobile */
  }
  .gallery-item img {
    width: 100%; /* Full width for mobile */
    height: auto; /* Dynamic height */
  }
}
/* Cases Section */
.titel-werkwijze2 {
  text-align: left;
  margin-top: 20px;
  padding-left: 90px;
  position: relative;
  z-index: 2;
  line-height: 1.4;
  font-size: 47px;
  font-family: "helvitica";
}

.case-textblok {
  width: 75%;
  padding-top: 75px;
}

.cases-section {
  padding-top: 100px;
  padding-bottom: 100px;
  background-color: #f7f7f7;
}

.cases-titels {
  width: 60%;
}

.cases-text {
  width: 40%;
}

.cases-header {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: left;
  margin-bottom: 200px;
}

.cases-header h2 {
  padding-right: 90px;
  padding-left: 90px;
  font-size: 16px;
  text-align: left;
  color: #4CAF50;
  /* Green color for title */
}

.cases-header p {
  font-size: 14px;
  color: #333;
}

.cases-grid {
  padding-right: 90px;
  padding-left: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  /* Default alignment for all items */
  gap: 20px;
  /* Add some spacing between items */
}

.casetext {
  font-size: 14px;
  padding-left: 90px;
  margin-bottom: 80px;
}

.case-item {
  text-decoration: none !important;
  cursor: pointer;
}

.case-item-1,
.case-item-2,
.case-item-3 {
  border-radius: 10px;
  -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
}

.case-item-1 {
  height: 50%;
  width: 25%;
}

.case-item-2 {
  width: 50%;
  height: auto;
  /* Allow dynamic height for item 2 */
}

.case-item-3 {
  height: 50%;
  width: 25%;
  -ms-flex-item-align: end;
      align-self: flex-end;
  /* Align item 3 to the bottom */
}

.case-item:hover {
  -webkit-transform: translateY(-5px);
      -ms-transform: translateY(-5px);
          transform: translateY(-5px);
}

.case-image-1 img {
  width: 100%;
}

.case-content {
  margin-top: 15px;
}

.case-content h3 {
  font-size: 1.5rem;
  color: #333;
  margin-bottom: 10px;
}

.case-content p {
  font-size: 12px;
  color: #666;
  margin-bottom: 15px;
}

.case-link {
  font-size: 14px !important;
  color: #4CAF50 !important;
  text-decoration: none !important;
  font-weight: bold !important;
}

.case-link:hover {
  text-decoration: underline;
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
  .titel-werkwijze2 {
    font-size: 40px;
    padding-left: 60px;
  }
  .cases-titels {
    width: 100%;
    padding-right: 5px;
  }
  .case-textblok {
    width: 100%;
    padding-top: 20px;
  }
  .cases-text {
    width: 100%;
  }
  .cases-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .cases-header h2,
  .cases-header p {
    text-align: start;
    padding-right: 60px;
  }
  .cases-grid {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding-left: 60px;
    padding-right: 60px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .case-item-1,
  .case-item-2,
  .case-item-3 {
    width: 100%;
    height: auto;
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
  }
}
@media (max-width: 768px) {
  .cases-header {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  .casestext-section {
    padding: 30px;
  }
  .cases-section {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #f7f7f7;
  }
  .casetext {
    font-size: 15px;
    padding-left: 0px;
    margin-bottom: 20px;
    margin-bottom: 20px;
  }
  .cases-grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .titel-werkwijze2 {
    font-size: 25px;
    padding-left: 30px;
    margin-top: 80px;
    padding-bottom: 30px;
  }
  .cases-header h2,
  .cases-header p {
    padding-left: 30px;
    font-size: 13px;
    padding-right: 30px;
  }
  .case-item-1,
  .case-item-3 {
    width: 100%;
    height: auto;
  }
  .case-item-2 {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .titel-werkwijze2 {
    padding-left: 0px;
  }
  .cases-header h2 {
    font-size: 13px;
    padding-left: 0px;
    padding-right: 20px;
  }
  .cases-header p {
    font-size: 13px;
    padding-left: 0px;
  }
  .cases-grid {
    padding-left: 30px;
    padding-right: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .case-item-1,
  .case-item-2,
  .case-item-3 {
    width: 100%;
    height: auto;
  }
}
/* rental */
#rental + footer {
  margin-top: 100px;
}

.rental {
  padding-right: 40px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.rental2 {
  padding-top: 20px;
  padding-bottom: 40px;
  padding-right: 40px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.image-left,
.image-right {
  width: 25%;
  padding: 0;
}

.ruimte {
  width: 15%;
}

.ruimte2 {
  width: 80%;
}

.text-right {
  padding-right: 5px;
  width: 20%;
  padding: 50px;
}

.undertext {
  font-size: 14px;
  color: #4CAF50;
}

.rentaltext {
  margin-right: 20px;
}

/* Responsieve aanpassingen */
@media (max-width: 1200px) {
  .image-left,
  .image-right {
    width: 30%;
  }
  .ruimte {
    width: 10%;
  }
  .ruimte2 {
    width: 40%;
  }
  .text-right {
    width: 30%;
    padding: 20px;
  }
}
@media (max-width: 768px) {
  .rental, .rental2 {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; /* Zorgt ervoor dat items op de volgende regel komen indien nodig */
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 30px;
  }
  .image-left,
  .image-right {
    width: 100%;
  }
  .text-right {
    width: 100%;
    padding: 10px;
  }
  .ruimte,
  .ruimte2 {
    width: 0%;
  }
  .rentaltext {
    margin-right: 10px;
    margin-top: 20px;
  }
}
@media (max-width: 480px) {
  .undertext {
    font-size: 10px;
  }
  .rentaltext {
    margin-right: 10px;
  }
}
/* linkedin */
.artikel-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* Ensures wrapping on smaller screens */
}

.line {
  margin-top: 40px;
  margin-bottom: 40px;
  width: 100%; /* Full width line */
  height: 1px;
  background-color: #000; /* Black line */
}

/* General styles for the artikelen section */
.artikelen {
  padding-bottom: 50px;
  margin-top: 80px;
  padding-left: 20px; /* Adjusted padding for mobile responsiveness */
  padding-right: 20px;
}

.articles-grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* Ensures wrapping of articles on smaller screens */
  gap: 60px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; /* Even spacing between articles */
  text-align: left;
}

.article-item {
  margin-bottom: 20px;
  border-radius: 10px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%; /* Full width on mobile */
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  text-decoration: none !important;
}

.article-item2 {
  margin-bottom: 20px;
  border-radius: 10px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%; /* Full width on mobile */
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  text-decoration: none !important;
}

.article-item:hover {
  -webkit-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
          transform: translateY(-10px);
}

.article-item2:hover {
  -webkit-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
          transform: translateY(-10px);
}

.article-image {
  max-height: 70%;
  margin-bottom: 0px;
  border-radius: 10px;
}

.article-title {
  text-decoration: none;
  color: #000;
  font-size: 25px;
  margin-bottom: 10px;
}

.article-title:hover {
  text-decoration: none;
}

.article-description {
  font-size: 16px;
  margin-bottom: 20px;
  color: #555;
}

.meer-info-link {
  font-size: 14px;
  margin-top: 5px;
  text-align: left;
  color: #4CAF50;
  text-decoration: none;
  border-radius: 5px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

.article-item {
  border-radius: 10px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.article-item2 {
  border-radius: 10px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

/* Media Queries for responsiveness */
@media (max-width: 768px) {
  .artikel-container {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .article-item {
    padding-bottom: 40px;
    margin-bottom: 100px;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 48%;
            flex: 1 1 48%; /* Two articles side by side on tablet screens */
  }
  .article-item2 {
    padding-bottom: 40px;
    margin-bottom: 10px;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 48%;
            flex: 1 1 48%; /* Two articles side by side on tablet screens */
  }
  .artikelen {
    margin-top: 10px;
    padding-left: 50px; /* Adjusted padding for tablets */
    padding-right: 50px;
  }
}
@media (min-width: 1024px) {
  .article-item {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 30%;
            flex: 1 1 30%; /* Three articles side by side on larger screens */
  }
  .article-item2 {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 30%;
            flex: 1 1 30%; /* Three articles side by side on larger screens */
  }
  .artikelen {
    padding-left: 90px;
    padding-right: 90px;
  }
}
/* Basisinstellingen voor de container */
.artikelen {
  padding: 0px;
}

/* Grid voor artikelen, standaard layout voor grotere schermen */
.articles-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 20px 1fr 20px 1fr;
  grid-template-columns: repeat(3, 1fr); /* 3 kolommen op grotere schermen */
  gap: 20px;
}

/* Responsieve aanpassingen voor verschillende schermformaten */
@media (max-width: 1200px) {
  .articles-grid {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr); /* 2 kolommen voor tablets en kleinere schermen */
  }
}
@media (max-width: 768px) {
  .articles-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr; /* 1 kolom voor mobiele schermen */
  }
}
/* Styling voor elk artikel */
.article-item:hover {
  -webkit-transform: translateY(-5px);
      -ms-transform: translateY(-5px);
          transform: translateY(-5px);
}

/* Artikel afbeelding styling */
.article-image {
  width: 100%;
  border-radius: 10px;
  -o-object-fit: cover;
     object-fit: cover;
}

/* Titel en beschrijving styling */
.article-title {
  font-size: 20px;
  margin: 0px 0;
}

.article-description {
  font-size: 14px;
  margin-bottom: 15px;
}

/* Link styling */
.meer-info-link {
  color: #4CAF50;
  text-decoration: none;
  font-weight: bold;
}

.meer-info-link:hover {
  text-decoration: underline;
}

.artikel-a {
  text-decoration: none;
}

.artikel-a:hover {
  text-decoration: none;
}

.left-column2 {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.left-column2 {
  width: 50%;
}

@media (max-width: 768px) {
  .left-column2 {
    display: none;
  }
}
/* header*/
.biogashead {
  padding: 90px;
}

/* werkwijze */
.werkwijzebio {
  background-color: #68b728;
  color: white;
}

.stepnummers2 {
  color: white;
  font-size: 35px;
}

.steps-container2 {
  padding: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.steptext {
  margin-top: 28px;
  width: 90%;
}

.steps-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 20px; /* Space between the items */
}

.step {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1; /* Make each step take up equal space */
  padding: 20px;
  position: relative;
}

.step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 1px;
  background-color: lightgray;
}

@media (max-width: 1024px) {
  .step:not(:last-child)::after {
    display: none;
  }
  .steps-container2 {
    padding-top: 30px;
    padding-right: 50px;
    padding-left: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .steps-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .step {
    margin-bottom: 20px;
  }
  .stepnummers2 {
    font-size: 30px;
  }
  .biogashead {
    padding: 30px;
    padding-top: 110px;
  }
}
@media (max-width: 768px) {
  .biogashead {
    padding: 30px;
    padding-top: 100px;
  }
  .steps-container2 {
    padding-top: 80px;
    padding-right: 30px;
    padding-left: 30px;
  }
  .stepnummers2 {
    font-size: 28px;
  }
  .steptext {
    width: 100%;
  }
  .step {
    padding: 15px;
  }
  .steps-wrapper {
    gap: 15px;
  }
  .step:not(:last-child)::after {
    height: 70%;
  }
}
@media (max-width: 480px) {
  .steps-container2 {
    padding-top: 50px;
    padding-right: 15px;
    padding-left: 15px;
  }
  .stepnummers2 {
    font-size: 24px;
  }
  .steptext {
    width: 100%;
    margin-top: 20px;
  }
  .step {
    padding: 10px;
  }
  .step:not(:last-child)::after {
    height: 60%;
  }
}
/* Duurzaam actie */
.duurzaamheidactie {
  padding-top: 230px;
  padding-left: 266px;
  padding-right: 90px;
  padding-bottom: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

/* Zorg ervoor dat de linker en rechter zijdes behouden blijven */
.duurzaamactief__left {
  width: 60%;
  font-size: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; /* Kolomopmaak om elementen onder elkaar te plaatsen */
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; /* Zorgt ervoor dat .resultaatduurzaam onderaan komt */
}

.duurzaamactief__right {
  width: 40%;
}

.duurzaam__resultaat2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 14px;
  padding: 10px 0;
  padding-top: 20px;
}

/* De resultatenlijst blijft hetzelfde */
.duurzaam__resultaat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 14px;
  padding: 10px 0;
  padding-top: 0px;
}

.resultaatduurzaam {
  margin-top: 20px;
}

@media (max-width: 1200px) {
  .duurzaamheidactie {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 100px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .duurzaamactief__left, .duurzaamactief__right {
    width: 100%;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    text-align: start;
  }
  .duurzaamactief__left {
    margin-bottom: 20px;
  }
  .duurzaam__resultaat {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .resultaatduurzaam {
    margin-top: 20px;
  }
}
@media (max-width: 480px) {
  .duurzaamheidactie {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 100px;
  }
  .duurzaamactief__left, .duurzaamactief__right {
    font-size: 18px;
  }
  .duurzaam__resultaat {
    padding: 5px 0;
  }
}
/* waarom */
.waaromkiezen {
  background-color: #F5F5F5;
}

.waaromkiezen2 {
  background-color: white;
}

.waaromkiezencontainer {
  padding-top: 120px;
  padding-left: 90px;
  padding-right: 90px;
  padding-bottom: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

@media (max-width: 1200px) {
  .waaromkiezencontainer {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 150px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (max-width: 480px) {
  .waaromkiezencontainer {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 100px;
  }
}
.sectorimg {
  width: 70%;
  height: auto;
}

.sector__right {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 40%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media (max-width: 1200px) {
  .sector__right {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (max-width: 1024px) {
  .sectorimg {
    width: 100%;
    height: auto;
  }
}
@media (max-width: 480px) {
  .sectorimg {
    width: 100%;
    height: auto;
  }
}
/*invest*/
.investering-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  padding: 100px;
  background-size: cover;
  background-position: center;
  min-height: 75vh;
}

.investering-section {
  position: relative;
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 50px;
}

.investering-section .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5); /* Witte overlay met 50% transparantie */
  z-index: 1;
}

.investering-container {
  padding-left: 40px;
  position: relative;
  z-index: 2; /* Zorgt ervoor dat de content boven de overlay verschijnt */
}

@media (max-width: 480px) {
  .investering-container {
    padding-left: 0px;
    position: relative;
    z-index: 2; /* Zorgt ervoor dat de content boven de overlay verschijnt */
  }
}
/* carouselle*/
.carousel {
  overflow: hidden;
  position: relative;
  width: 100%;
  background-color: #F5F5F5;
  padding-top: 150px;
  padding-bottom: 150px;
}

.carousel-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow-x: scroll;
  -ms-scroll-snap-type: x mandatory;
      scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  will-change: transform;
  cursor: -webkit-grab;
  cursor: grab;
  padding-left: 0;
  margin-left: auto;
  margin-right: auto;
}

.carousel-item {
  min-width: 300px; /* Minimale breedte voor elk item */
  margin: 0 10px; /* Marges tussen items */
  scroll-snap-align: center; /* Zorgt ervoor dat het item in het midden uitlijnt */
}

.carousel-item {
  min-width: 300px; /* Minimale breedte voor elk item */
  margin: 0 10px; /* Marges tussen items */
  scroll-snap-align: center; /* Zorgt ervoor dat het item in het midden uitlijnt */
}

.carousel-container.active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

.carousel-item {
  min-width: 100%; /* Full width on mobile */
  max-width: 800px; /* Max width on larger screens */
  border-radius: 8px;
  padding: 20px;
  text-align: left;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto; /* Prevent shrinking */
}

.carousel-item p {
  line-height: 1.7;
  font-size: 14px;
}

.carousel-item img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.titelrating {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
}

.rating {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
}

.rating span {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: #68b728;
  border-radius: 50%;
}

.homehero-titel2 {
  color: black;
  line-height: 1.4;
  position: relative;
  z-index: 2;
  font-size: 47px;
  padding-left: 90px;
}

/* Media Queries for responsiveness */
@media (max-width: 768px) {
  .carousel {
    padding-bottom: 100px;
    padding-top: 30px;
  }
  .carousel-item {
    max-width: 50%; /* Two items side by side on tablets */
  }
  .homehero-titel2 {
    color: black;
    position: relative;
    z-index: 2;
    font-size: 25px;
    padding-left: 20px;
  }
}
@media (min-width: 1024px) {
  .carousel-item {
    min-width: 33.33%; /* Three items side by side on desktops */
  }
}
.arrow-step img {
  height: 130%;
}

.werkwijzebio3 img {
  border-radius: 0px !important;
}

.werkwijzebio3 {
  background-color: #F5F5F5;
}

.stepssection {
  padding: 90px;
  background-color: #F5F5F5;
}

.process-container {
  margin: 0 auto;
}

.process-steps {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start; /* Align items to the start */
}

.process-step {
  margin-top: 90px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(33.333% - 30px);
          flex: 1 1 calc(33.333% - 30px); /* Each step takes up 1/3 of the row on large screens */
  text-align: center;
  margin-bottom: 20px;
}

.step-image img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.steptitle2 {
  background: #FFFFFF;
  padding-top: 20px;
  padding-bottom: 30px;
  border-radius: 8px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  margin-bottom: -10px;
  color: #68b728;
}

/* Responsive Adjustments */
/* Medium screens (tablets) */
@media (max-width: 1024px) {
  .arrow-step {
    display: none;
  }
  .process-steps {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; /* Allows wrapping for responsive layouts */
    gap: 20px;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start; /* Align items to the start */
  }
  .process-step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 calc(50% - 30px);
            flex: 1 1 calc(50% - 30px); /* Two columns per row on medium screens */
    margin-top: 60px; /* Adjust margin to suit smaller screens */
  }
}
/* Small screens (mobile phones) */
@media (max-width: 768px) {
  .stepssection {
    padding: 30px; /* Reduce padding for smaller screens */
  }
  .process-step {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%; /* Single column layout on small screens */
    margin-top: 30px; /* Further reduce the top margin */
  }
  .steptitle2 {
    font-size: 14px;
    padding-top: 15px;
    padding-bottom: 15px;
  }
}
/* Container for the whole section */
.werkwijzebio2 {
  padding-top: 120px;
  background-color: #f5f5f5;
  text-align: center;
}

.titel-werkwijze3 {
  text-align: center;
  font-size: 30px;
  color: #333;
}

/* Flex container for the steps */
.steps-container2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* Allows wrapping of steps */
  gap: 20px; /* Adds space between steps */
  margin: 0 auto;
}

/* Wrapper for individual steps */
.steps-wrapper2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly; /* Evenly distribute items */
  padding: 10px;
  gap: 10px; /* Space between steps */
  width: 100%; /* Full width for flex items */
}

/* Individual step */
.steps {
  font-size: 20px;
  padding: 20px;
  border-radius: 8px; /* Rounded corners */
  text-align: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(33.333% - 40px);
          flex: 1 1 calc(33.333% - 40px); /* Make each step take up 1/3 of the row */
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* Include padding in width calculation */
  color: #333; /* Text color */
  position: relative; /* For positioning the right line */
}

/* Add a right border to each step */
.steps:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 1px; /* Width of the line */
  background-color: #68b728; /* Green line */
}

/* Image styling */
.voordeelimg2 {
  width: 40px;
  height: 40px;
  margin-bottom: 5px; /* Space between image and text */
}

/* Text inside each step */
.steptext2 {
  color: #333;
  font-size: 16px;
  line-height: 1.7;
}

@media (max-width: 1250px) {
  .steps-wrapper2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly; /* Evenly distribute items */
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 10px; /* Space between steps */
    width: 100%; /* Full width for flex items */
  }
}
/* Responsive adjustments */
@media (max-width: 768px) {
  /* Add a right border to each step */
  .steps:not(:last-child)::after {
    display: none;
  }
  .titel-werkwijze3 {
    font-size: 15px;
  }
  /* Wrapper for individual steps */
  .werkwijzebio2 {
    padding-top: 60px;
    background-color: #f5f5f5;
    text-align: center;
  }
  .steps-wrapper2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly; /* Evenly distribute items */
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 60px; /* Space between steps */
    width: 100%; /* Full width for flex items */
  }
  .steps {
    padding: 0px;
    gap: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    text-align: start;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 calc(50% - 20px);
            flex: 1 1 calc(50% - 20px); /* Two columns on tablets */
  }
  /* Remove the line for the last column in each row */
  .steps:nth-child(2n):not(:last-child)::after {
    display: none;
  }
  .steps-container2 {
    padding-left: 30px;
    padding-right: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; /* Allows wrapping of steps */
    gap: 20px; /* Adds space between steps */
    margin: 0 auto;
  }
}
@media (max-width: 480px) {
  .steptext2 {
    color: #333;
    font-size: 16px;
    line-height: 1.5;
  }
  .steps {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%; /* Full width for small screens */
  }
  /* No right border on mobile */
  .steps::after {
    display: none;
  }
}
.image-container2 {
  width: 40%;
}

.duurzamentext2 {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
  width: 80%;
  margin-top: auto;
}

.innotitel2 {
  line-height: 1.4;
  width: 100%;
  font-family: "helvitica";
  font-size: 45px;
  margin-bottom: 20px;
}

@media (max-width: 1024px) {
  .image-container2 {
    width: 100%;
  }
  .duurzamentext2 {
    text-align: start;
    font-size: 14px;
    width: 90%;
  }
  .innotitel2 {
    text-align: start;
    font-size: 45px;
    width: 90%;
  }
}
@media (max-width: 768px) {
  .image-container2 {
    width: 100%;
  }
  .duurzamentext2 {
    font-size: 14px;
    width: 100%;
  }
  .innotitel2 {
    font-size: 25px;
    width: 100%;
  }
}
.quotetextinnovatie {
  line-height: 1.17;
  font-size: 70px;
  color: #68b728;
}

.duurzaam {
  padding-top: 200px;
  padding-bottom: 50px;
}

.innvovatietext {
  font-size: 14px;
  width: 75%;
  padding-top: 50px;
}

.titel-werkwijze3 {
  text-align: left;
  margin-top: 20px;
  position: relative;
  z-index: 2;
  font-size: 47px;
  font-family: "helvitica";
}

.titel-werkwijze4 {
  text-align: center;
  margin-top: 20px;
  line-height: 1.4;
  position: relative;
  z-index: 2;
  font-size: 47px;
  font-family: "helvitica";
}

.subtitel-werkwijze3 {
  padding-right: 90px;
  text-align: start;
  font-size: 16px;
  text-align: left;
  color: #4CAF50;
}

@media (max-width: 768px) {
  .quotetextinnovatie {
    text-align: center;
    padding: 30px;
    font-size: 25px;
  }
  .titel-werkwijze4 {
    text-align: start;
    margin-top: 20px;
    position: relative;
    z-index: 2;
    font-size: 20px;
    font-family: "helvitica";
    padding-left: 40px;
  }
  .duurzaam {
    text-align: start;
    padding-top: 20px;
    padding-bottom: 10px;
  }
  .innvovatietext {
    padding-left: 0px;
    text-align: start;
    width: 100%;
    padding-top: 30px;
  }
  .titel-werkwijze3 {
    text-align: start;
    font-size: 30px;
  }
  .subtitel-werkwijze3 {
    text-align: start;
    padding-right: 20px;
    font-size: 1.5rem;
  }
}
.servicess-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  padding: 90px;
}

.serviceleft, .serviceright {
  width: 50%;
}

.serviceleft {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.serviceleft img {
  width: 80%;
  border-radius: 10px !important;
  height: auto;
}

.service-item {
  width: 80%;
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
  opacity: 40%;
}

.service-item:hover {
  opacity: 100%;
}

.service-item h2 {
  font-size: 18px;
  margin-bottom: 5px;
}

.service-item p {
  font-size: 14px;
  color: #666;
}

.half-image {
  border-radius: 0px !important;
}

@media (max-width: 768px) {
  .service-item {
    width: 100%;
    opacity: 100%;
  }
  .serviceleft {
    display: none;
  }
  .serviceright {
    width: 100%;
  }
  .servicess-container {
    padding: 30px;
  }
}
.landing-page .landing-page-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 90px;
  padding-bottom: 90px;
}

.landing-page .landing-page-section {
  width: 45%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.landing-page h2 {
  font-size: 50px;
  margin-bottom: 10px;
}

.landing-page p {
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 30px;
}

.landing-page .landing-page-button {
  font-size: 14px;
  margin-top: auto; /* Zorg ervoor dat de knop naar de onderkant van de container wordt geduwd */
  display: inline-block;
  color: #4CAF50;
  text-decoration: none;
  border-radius: 5px;
}

.landing-page-image-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.imglanding-left, .imglanding-right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 400px; /* Stel hier de gewenste hoogte in */
  overflow: hidden; /* Zorg ervoor dat de afbeelding niet buiten de container komt */
}

.imglanding-left img, .imglanding-right img {
  border-radius: 0px;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover; /* Zorgt ervoor dat de afbeelding bijgesneden wordt zonder te vervormen */
}

/* Media Queries voor tablets (schermen kleiner dan 1024px) */
@media screen and (max-width: 1024px) {
  .landing-page .landing-page-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 20px;
  }
  .landing-page .landing-page-section {
    width: 100%;
    margin-bottom: 20px;
  }
  .landing-page h2 {
    font-size: 40px;
  }
  .landing-page p {
    font-size: 14px;
  }
  .imglanding-left, .imglanding-right {
    height: 300px; /* Verklein de hoogte voor tablets */
  }
}
/* Media Queries voor mobiele apparaten (schermen kleiner dan 768px) */
@media screen and (max-width: 768px) {
  .landing-page .landing-page-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 30px;
    margin-top: 100px;
  }
  .landing-page h2 {
    font-size: 35px;
  }
  .landing-page p {
    font-size: 14px;
  }
  .landing-page .landing-page-button {
    font-size: 14px;
  }
  .landing-page-image-section {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .imglanding-left, .imglanding-right {
    height: 200px; /* Verklein de hoogte verder voor mobiele apparaten */
  }
}
/* Base Styles */
.cases-industrie__container {
  padding-left: 90px;
  padding-right: 90px;
  padding-bottom: 100px;
  padding-top: 50px;
}

.case-images {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 250px;
  padding-right: 250px;
  padding-bottom: 40px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.second-row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 60px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.second-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
}

.imgcase-left1,
.imgcase-right1 {
  width: 50%;
  overflow: hidden;
}

.imgcase-left1 img,
.imgcase-right1 img {
  width: 98%;
  height: auto;
}

.imgcase-left,
.imgcase-right {
  width: 50%;
  overflow: hidden;
}

.text-case {
  padding: 20px;
  padding-left: 250px;
}

.quotecase {
  margin-top: 230px;
  color: green;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.imgcase-left,
.imgcase-right {
  width: 50%;
}

video {
  border-radius: 10px;
}

/* Responsive Adjustments */
/* Large Tablets and Desktops */
@media (max-width: 1200px) {
  .cases-industrie__container {
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 200px;
  }
  .case-images {
    padding-left: 100px;
    padding-right: 100px;
    gap: 8px;
  }
  .text-case {
    padding-left: 100px;
  }
  .quotecase {
    margin-top: 180px;
  }
}
/* Small Tablets */
@media (max-width: 768px) {
  .second-row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    /* Stack images vertically on smaller screens */
  }
  .imgcase-left1,
  .imgcase-right1 {
    width: 100%;
    /* Full width for each image on smaller screens */
  }
  .cases-industrie__container {
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 200px;
    padding-top: 100px;
  }
  .case-images {
    padding-left: 40px;
    padding-right: 40px;
    gap: 5px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .imgcase-left,
  .imgcase-right {
    width: 90%;
  }
  .text-case {
    padding-left: 20px;
    padding-right: 20px;
  }
  .quotecase {
    margin-top: 100px;
  }
}
/* Mobile Devices */
@media (max-width: 480px) {
  .cases-industrie__container {
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 100px;
    padding-top: 100px;
  }
  .verhuurhead {
    padding: 40px !important;
    padding-top: 100px !important;
  }
  .case-images {
    padding-left: 10px;
    padding-right: 10px;
    gap: 5px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .imgcase-left,
  .imgcase-right {
    width: 100%;
  }
  .text-case {
    padding: 10px;
  }
  .quotecase {
    margin-top: 60px;
    font-size: 16px;
  }
}
.case-images {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
}

.imgcase-single {
  width: 98%;
  text-align: center;
}

.imgcase-single img {
  height: 98.5%;
  width: 98%;
  /* Volledige breedte voor enkele afbeelding */
}

.product-page {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; /* Allow wrapping for smaller screens */
}

.product-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  padding: 90px;
}

.product-image img {
  width: 100%;
}

.product-image {
  padding-left: 260px;
  padding-right: 260px;
  padding-top: 70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.productheaderleft {
  width: 50%;
}

.productheaderright {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.product-button {
  color: #68B728;
  border-radius: 70px;
  padding-top: 10px;
  padding-bottom: 8px;
  padding-left: 20px;
  padding-right: 20px;
  border: 1px solid #68B728;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.product-button:hover {
  text-decoration: none;
  color: white;
  background-color: #68B728;
  border: 1px solid white;
}

.producten-uitleg {
  padding-left: 260px;
  padding-right: 260px;
  padding-top: 70px;
  padding-bottom: 70px;
}

.form-product {
  margin-top: 10px;
  width: 100%;
  background-color: white;
}

.formuliertitel {
  font-size: 23px;
}

.productenformulier {
  margin-top: 90px;
  padding-left: 260px;
  padding-right: 260px;
  padding-bottom: 150px;
}

/* Media Queries for Responsiveness */
/* Large Tablets and Small Desktops */
@media (max-width: 1024px) {
  .product-header {
    padding: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; /* Stack items */
  }
  .product-image {
    padding-left: 100px;
    padding-right: 100px;
    padding-top: 50px;
  }
  .producten-uitleg,
  .productenformulier {
    padding-left: 100px;
    padding-right: 100px;
  }
  .productheaderleft,
  .productheaderright {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
  }
}
/* Mobile Devices */
@media (max-width: 768px) {
  .product-header {
    padding: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .product-image {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 30px;
  }
  .producten-uitleg,
  .productenformulier {
    padding-left: 20px;
    padding-right: 20px;
  }
  .productheaderleft,
  .productheaderright {
    width: 100%;
    text-align: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
/* Very Small Mobile Devices */
@media (max-width: 480px) {
  .product-header {
    padding: 20px;
  }
  .product-image {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 20px;
  }
  .producten-uitleg,
  .productenformulier {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.verhuurhead {
  padding-top: 90px;
  padding-right: 90px;
  padding-left: 90px;
  padding-bottom: 20px;
}

.contactpage {
  background-color: #f5f5f5;
  padding: 90px;
}

.job-button {
  display: inline-block;
  background-color: transparent;
  color: #81b757;
  font-size: 16px;
  padding: 10px 20px;
  padding-top: 12px;
  border-radius: 20px;
  border: 1px solid #81b757;
  text-align: center;
  text-decoration: none;
  margin-right: 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  margin-bottom: 10px;
  /* Add some space between buttons on smaller screens */
}

.job-button:hover {
  background-color: #81b757;
  color: white;
  border: 1px solid #81b757;
}

.jobimg {
  width: 100%;
  height: auto;
}

.job-description {
  line-height: 1.7;
  padding-right: 300px;
  font-size: 14px;
}

.jobcontainer {
  padding: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* Distribute the content evenly */
}

/* Responsive adjustments */
@media only screen and (max-width: 768px) {
  .job-description {
    line-height: 1.7;
    padding: 0px;
    font-size: 14px;
  }
  .jobcontainer {
    padding-top: 120px;
    padding: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    /* Stack the content vertically on smaller screens */
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    /* Center align the content */
  }
  .job-button {
    font-size: 14px;
    /* Adjust button font size for smaller screens */
    padding: 8px 16px;
    /* Adjust padding for smaller screens */
    width: 100%;
    /* Make buttons full width */
    max-width: 300px;
    /* Limit the max width of buttons */
    margin-right: 0;
    /* Remove the right margin */
    margin-bottom: 10px;
    /* Space between buttons */
  }
  .jobimg {
    max-width: 100%;
    /* Ensure images fit within the container */
    margin-bottom: 20px;
    /* Add some spacing below the image */
  }
}
@media only screen and (max-width: 480px) {
  .job-button {
    font-size: 12px;
    /* Further adjust font size for very small screens */
    padding: 6px 12px;
    /* Adjust padding for smaller screens */
  }
  .jobcontainer {
    margin-top: 100px;
    /* Reduce padding on very small screens */
  }
}
/* =============PAGES==================== */