@font-face {
  font-family: Arlrdbd;
  src: url('../fonts/ARLRDBD.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --black-2: black;
  --grey: #f0f0f0;
  --blue: #213555;
  --yellow: #fdc400;
  --orange: #ef7809;
  --black: #1c1b22;
  --gradient-transparent: #fff0;
  --dark-grey: #4e4e4e;
  --less-dark-black: #191919;
  --white: white;
}

.modernisaties-im {
  max-width: 100%;
}

.holderblocks {
  display: flex;
  flex-flow: wrap;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}

.block {
  border-radius: 10px;
  padding: 20px;
  background-color: var(--black);
  width: 32.5%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 10px;
}

.block.large {
  width: 69%;
}
.block.small {
  width: 30%;
}

.highlightnumber {
  font-size: 20px;
  line-height: 24px;
  font-weight: 700;
}

  #time-indicator {
      position: absolute;
      width: 90%;
      max-width: 90%;
      height: 3px;
      background-color: #fff;
      border-radius: 5px;
      overflow: hidden;
      bottom: 10px;
  }

  #progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0;
    background-color: var(--black);
    transition: width 0.1s ease-in-out;
    border-radius: 5px;
  }

.title-history {
  max-width: 60%;
  width: 350px;
}

.gradient-vid {
  z-index: 11;
  height: 100%;
  background-image: linear-gradient(to top, var(--black-2) 26%, rgb(0 0 0 / 0%));
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
  display: none;
}

.content-history {
  width: 80vw;
  height: 90%;
  justify-content: space-between;
  margin-bottom: 60px;
  display: flex;
  gap: 40px;
}

.year {
    font-size: 8vw;
    line-height: 8vw;
    position: absolute;
    top: auto;
    bottom: 130px;
    left: 10vw;
    right: auto;
    transition: transform 0.5s ease-in-out;
    z-index: 13;
  }

  .holder-parts-of-story {
    height: 80px;
    justify-content: space-between;
    display: flex;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
    z-index: 14;
  }

.part-story {
  width: 19.5%;
  background-color: var(--black);
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 10px;
  padding-left: 10px;
  display: flex;
  position: relative;
  cursor: pointer;
  color: grey;
}

.part-story.active {
  background-color: #fdc400d4;
  color: var(--white);
  font-weight: 800;
}

.image-story {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-image: url(/images/buttons_image.jpg);
    background-position: 0 0;
    background-size: cover;
    border-radius: 5px;
    overflow: hidden;
    display: none;
    transition: all 0.5s ease;
    background-position: center top;
}

.text-title-story {
  width: 50%
}

.holder-story-image-text {
    width: 50%;
    text-align: center;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.glow-box {
  border-radius: 12px;
  position: relative;
  overflow: hidden;
}

.glow-box::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 70%;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, #ef7809, #fdc400, #ef7809);
  box-shadow:
    0 0 6px #fdc400,
    0 0 12px #fdc400,
    0 0 20px #ef7809;
}
.glow-box-hover {
  border-radius: 12px;
  position: relative;
  overflow: hidden;
}
.glow-box-hover:hover::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 70%;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, #ef7809, #fdc400, #ef7809);
  box-shadow:
    0 0 6px #fdc400,
    0 0 12px #fdc400,
    0 0 20px #ef7809;
}

.elevator-menu {
  position: fixed;
  inset: 0;
  background: var(--black);
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  z-index: 999;
}
/* doors */
.door {
  position: absolute;
  top: 0;
  height: 100%;
  background: linear-gradient(to right, #0d0d0d, #1a1a1a);
  transition: none;
}
/* left/front door - will slide to half the screen */
.door-front {
  width: 50vw;        /* half of the viewport */
  left: -50vw;        /* start completely offscreen left */
  z-index: 2;
  box-shadow: inset -4px 0 8px rgba(255,255,255,0.05);
}
/* right/back door - covers full screen */
.door-back {
  width: 100vw;
  left: -100vw;       /* start completely offscreen left */
  z-index: 1;
  box-shadow: inset -2px 0 6px rgba(255,255,255,0.05);
}
/* seam effect */
.door-front::after,
.door-back::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, #444, #111);
  opacity: 0.7;
}
.door-front::after { right: 0; }
.door-back::before { left: 0; }
/* panel */
.panel {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  padding: 100px;
  opacity: 0;
  z-index: -1; /* hidden until doors are gone */
  transition: opacity 0.8s ease, z-index 0s linear 0.8s;
  background-color: var(--black-2);
}
/* panel nav buttons */
.panel nav {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.nav-button {
  display: inline-block;
  background: #222;
  border: 2px solid var(--grey);
  border-radius: 10px;
  padding: 1rem;
  width: 50px;
  height: 50px;
  text-align: center;
  color: white;
  font-size: 24px;
  font-weight: bold;
  text-decoration: none;
  box-shadow: inset 0 0 10px rgba(253,196,0,0.4),
              0 0 12px rgba(0,0,0,0.6);
  transition: all 0.3s ease;
}
.nav-text {
  display: inline-block;
  text-align: center;
  color: white;
  font-size: 24px;
  font-weight: bold;
  text-decoration: none;

}
.panel nav a {
  display: flex;
  align-items: center;
  gap: 20px;
  text-decoration: none;
  min-width: 300px;
}
.panel nav a:hover .nav-button {
  border: 2px solid var(--yellow);
  box-shadow: inset 0 0 12px rgba(0,0,0,0.6),
              0 0 20px rgba(239,120,9,0.6);
}

.elevator-menu.active {
  pointer-events: auto;
  opacity: 1;
}
.elevator-menu.active .door-front {
  animation: door-front-close 1s forwards;
}
.elevator-menu.active .door-back {
  animation: door-back-close 1s forwards;
}
@keyframes door-front-close {
  0%   { transform: translateX(0); }
  100% { transform: translateX(50vw); }
}
@keyframes door-back-close {
  0%   { transform: translateX(0); }
  100% { transform: translateX(100vw); } 
}

.elevator-menu.active .door-front,
.elevator-menu.active .door-back {
  animation-fill-mode: forwards;
}
.elevator-menu.active .panel {
  opacity: 1;
  z-index: 5;
  transition-delay: 1s;
}
.btn-elevator {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1.6rem;
  font-size: 1rem;
  line-height: 1.2;
  font-weight: 500;
  color: var(--text);
  background: var(--black);
  border: 1px solid var(--yellow);
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  overflow: hidden;
  max-width: 100%;
}
/* text always visible */
.btn-elevator .btn-text {
  white-space: nowrap;
}
/* prefix container shows one line */
.prefix-elev {
  height: 1.2em;       /* exactly one line */
  overflow: hidden;
  display: inline-block;
  align-items: flex-start;
}
/* stack of prefix items */
.prefix-inner {
  display: flex;
  flex-direction: column;
  transform: translateY(0); /* start at top = dot */
  font-weight: 700;
  color: var(--orange);
}
/* each item exactly 1.2em tall */
.prefix-inner span {
  height: 1.2em;
  line-height: 1.2em;
  display: block;
  text-align: center;
}
/* animate on hover */
.btn-elevator:hover .prefix-inner {
  animation: prefix-roll 1.6s steps(4) forwards;
}
/* roll through all 4 states */
@keyframes prefix-roll {
  0%   { transform: translateY(0); }       /* dot */
  25%  { transform: translateY(-1.2em); } /* 0 */
  50%  { transform: translateY(-2.4em); } /* 1 */
  75%  { transform: translateY(-3.6em); } /* arrow */
  100% { transform: translateY(-3.6em); } /* hold on arrow */
}

.btn-elevator.play .prefix-inner {
  animation: prefix-roll 1.6s steps(4) forwards;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.body {
  background-color: var(--black-2);
  color: var(--grey);
  font-family: Montserrat, sans-serif;
  font-size: 1.1vw;
  line-height: 1.75vw;
}

.body.blue {
  background-color: var(--blue);
}

.body.changed {
  background-color: #191919;
}

.hero-section {
  z-index: 12;
  background-image: linear-gradient(#000, #19191980), url('../images/herowiish.png');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  height: 100vh;
  display: flex;
  position: relative;
}

.hero-section.new {
  background-image: linear-gradient(#000, #19191980);
  justify-content: center;
  align-items: center;
}

.leftside-hero {
  background-image: linear-gradient(to right, #0e0e0e 44%, #19191900);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 50vw;
  padding-top: 6vw;
  padding-bottom: 2vw;
  padding-left: 10vw;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.heading-1 {
  margin-bottom: 3vw;
  font-family: Archivo, sans-serif;
  font-size: 3.6vw;
  line-height: 5vw;
  position: relative;
}

.heading-1.tiltedright {
  margin-bottom: 20px;
  right: -10vw;
}

.heading-1.tiltedleft {
  width: 120%;
  transform: translate(-10vw);
}

.heading-1.centered {
  text-align: center;
}

.heading-1.normal {
  width: 100%;
  margin-bottom: 2vw;
}

.heading-1.diensten {
  max-width: 65%;
}

.flexleftverticzl {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.mainbutton {
  background-color: #fff0;
  background-image: linear-gradient(to right, var(--yellow), var(--orange));
  text-transform: uppercase;
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto;
  border-radius: 10px;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 1vw 30px;
  font-family: Exo, sans-serif;
  font-weight: 400;
}

.mainbutton:hover {
  background-image: url('../images/arrow-white-straight.svg'), linear-gradient(to right, var(--yellow), var(--orange));
  background-position: 10px, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 25px, auto;
  padding-left: 50px;
}

.mainbutton.diff:hover {
  text-decoration: underline;
}

.mainbutton.black {
  background-color: var(--black);
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
}

.holderliftbuttons {
  justify-content: center;
  align-items: center;
  width: 17vw;
  padding-top: 6vw;
  display: flex;
  position: absolute;
  inset: 0% 10vw 0% auto;
}

.childliftholder {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.liftbutton {
  opacity: .85;
  color: var(--grey);
  text-transform: uppercase;
  align-items: center;
  margin-bottom: 10px;
  padding-right: 10px;
  font-size: .8vw;
  text-decoration: none;
  display: flex;
}

.liftbutton:hover {
  opacity: 1;
  font-weight: 600;
}

.liftbuttonimage {
  width: 3vw;
  height: 3vw;
  margin-right: 20px;
}

.navbar {
  z-index: 9999;
  justify-content: center;
  align-items: center;
  height: 6vw;
  padding-top: 1vw;
  padding-bottom: 1vw;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.navbar.blue {
  background-color: var(--blue);
}

.logohero {
  position: absolute;
  inset: 20px auto auto 6vw;
}

.holderlogohero {
  z-index: 10;
  justify-content: center;
  align-items: center;
  padding-top: 40px;
  display: flex;
  position: absolute;
  inset: 0% 0% auto;
}

.line {
  background-color: #575756;
  border-radius: 20px;
  width: 30vw;
  height: 1px;
  margin-left: 20px;
  margin-right: 20px;
}

.html-embed {
  position: relative;
}

.sectionstandard {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 10vw;
  padding-bottom: 10vw;
  display: flex;
  border-top: 1px solid var(--black);
}

.sectionstandard.history {
    height: 100vh;
    min-height: 600px;
    position: relative;
    justify-content: flex-start;
}

.sectionstandard.smallspaced {
  padding-top: 40px;
  padding-bottom: 40px;
}

.sectionstandard.partners {
  position: relative;
}

.sectionstandard.white {
  background-color: var(--grey);
  color: var(--blue);
}

.sectionstandard.nopaddingdown {
  padding-bottom: 0;
}

.sectionstandard.first {
  padding-top: 5vw;
  border-top: 0px;
}

.sectionstandard.higher-rel {
  z-index: 16;
  background-color: var(--black);
  position: relative;
}

.sectionstandard.blackbg {
  background-color: var(--black-2);
}

.sectionstandard.orange {
  color: var(--black);
}

.sectionstandard.lesspaddingup {
  padding-top: 5vw;
}

.sectionstandard.page-intro {
  background-color: var(--black);
}

.sectionstandard.relative {
  position: relative;
}

.contain-center {
  flex-direction: column;
  width: 70vw;
  display: flex;
}

.contain-center.centered {
  text-align: center;
  align-items: center;
}

.contain-center.centered.scrolls {
  z-index: 10;
  width: 100vw;
  position: relative;
}

.contain-center.centered.left {
  text-align: left;
}

.contain-center.contactsection {
  flex-direction: row;
  justify-content: space-between;
}

.contain-center.navbar {
  background-color: #0a0a0a00;
  flex-direction: row;
  justify-content: space-between;
  width: 90vw;
  height: 7vw;
  position: static;
}

.contain-center.footer {
  flex-direction: row;
  justify-content: space-around;
  width: 90vw;
}

.contain-center.explainer {
  flex-direction: row;
  align-items: flex-start;
  width: 90vw;
  position: relative;
}

.contain-center.secondsectiondiensten {
  flex-direction: column;
  align-items: flex-start;
  width: 90vw;
  position: relative;
}

.contain-center.hero {
  width: 50vw;
}

.contain-center.contact {
  background-color: var(--black);
  color: var(--grey);
  border-radius: 20px;
  width: 50vw;
  padding: 40px;
}

.contain-center.contact.glow-box {
  padding-top: 40px;
  padding-bottom: 40px;
}

.grid-type-liften {
  grid-column-gap: 2vw;
  grid-row-gap: 2vw;
  grid-template-columns: 1fr 1fr 1fr;
  width: 90%;
}

.item-types {
  background-color: var(--grey);
  color: var(--grey);
  border-radius: 10px;
  height: 22vw;
  text-decoration: none;
  overflow: hidden;
  box-shadow: 10px 10px 10px 7px #0000004d;
  border: 1px solid var(--grey);
}

.item-types:hover {
  background-image: linear-gradient(270deg, var(--yellow), var(--orange));
}

.item-types.blue {
  box-shadow: none;
  color: var(--grey);
}

.image-type-lift {
  opacity: .9;
  mix-blend-mode: luminosity;
  background-image: url('../images/personenliften_greyscale.jpg');
  background-position: 0 0;
  background-size: cover;
  height: 80%;
}

.image-type-lift.huisliften {
  background-image: url('../images/huisliften_greyscale.jpg');
}

.image-type-lift.horeca {
  background-image: url('../images/horecaliften_greyscale.jpg');
}

.image-type-lift.roltrappen {
  background-image: url('../images/roltrappen_greyscale.jpg');
}

.image-type-lift.autoliften {
  background-image: url('../images/autoliften-greyscale.jpg');
}

.image-type-lift.rolstoel {
  background-image: url('../images/rolstoelliften-greyscale.jpg');
}

.image-type-lift.trapliften {
  background-image: url('../images/trapliften_greyscale.png');
}

.image-type-lift.hefplatformen {
  background-image: url('../images/goederenliften-greyscale.jpg');
}

.image-type-lift.maritiem {
  background-image: url('../images/maritiem_greyscale.png');
}

.holder-type-lift-cta {
  background-color: var(--black);
  justify-content: center;
  align-items: center;
  height: 20%;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 1.2vw;
  display: flex;
}

.holder-type-lift-cta.blue {
  background-color: var(--blue);
}

.big-heading {
  margin-bottom: 5vw;
  font-family: Archivo Black, sans-serif;
  font-size: 3.6vw;
  line-height: 4.2vw;
}

.grid {
  grid-column-gap: 2vw;
  grid-row-gap: 2vw;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  width: 100%;
}

.dienst {
  background-color: var(--black);
  color: var(--grey);
  border: 1px solid #000;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  max-width: 22vw;
  min-height: 25vw;
  padding-left: 20px;
  padding-right: 20px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.dienst.small {
  align-items: flex-start;
  min-height: auto;
  padding-left: 20px;
  padding-right: 20px;
  flex-direction: column;
  padding: 20px;
}

.dienst:hover {
  border: 1px solid var(--black);
  background-color: var(--gradient-transparent);
  box-shadow: inset 0 2px 5px 0 var(--dark-grey);
  background-image: none;
}

.arrow-dienst {
  width: 4vw;
  position: absolute;
  inset: 10px 10px auto auto;
}

.title-dienst {
  font-size: 1.2vw;
  font-weight: 800;
  position: absolute;
  inset: auto auto 1vw 2vw;
}

.title-dienst.static {
  position: static;
  margin-bottom: 5px;
}

.icon-dienst {
  width: 2vw;
}

.icon-dienst.explainer {
  position: absolute;
  inset: auto auto 1vw 1vw;
}

.text-dienst {
  font-size: 1vw;
  line-height: 1.6vw;
  display: none;
}

.paragraph-hero {
  padding-right: 10vw;
}

.left-side-contact {
  opacity: .5;
  background-image: url('../images/contact-image.png');
  background-position: 0 0;
  background-size: cover;
  border-radius: 20px;
  width: 50%;
  height: 75vh;
}
.left-side-contact.image {
  background-image: none;
  object-fit: contain;
}

.left-side-contact.vestigingen {
  background-color: var(--black);
  opacity: 1;
  background-image: none;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: auto;
  display: flex;
}

.left-side-contact.newpic {
  background-image: url('../images/buttons_image.jpg');
}

.left-side-contact.personenliften {
  background-image: url('../images/personenliften_greyscale.jpg');
}

.left-side-contact.huisliften {
  background-image: url('../images/huisliften_greyscale.jpg');
  background-position: 50%;
}

.left-side-contact.goederenliften {
  background-image: url('../images/goederenliften-greyscale.jpg');
  background-position: 50%;
}

.left-side-contact.rolstoelliften {
  background-image: url('../images/rolstoelliften-greyscale.jpg');
  background-position: 50%;
}

.left-side-contact.roltrappen {
  background-image: url('../images/roltrappen_greyscale.jpg');
}

.left-side-contact.autoliften {
  background-image: url('../images/autoliften-greyscale.jpg');
}

.left-side-contact.horecaliften {
  background-image: url('../images/horecaliften_greyscale.jpg');
}

.contact-right-side {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 50%;
  padding-left: 3vw;
  display: flex;
}

.form-field {
  color: var(--grey);
  background-color: #ffffff1a;
  border: 1px #000;
  border-radius: 10px;
  width: 100%;
  height: 4vw;
  margin-bottom: 1vw;
}

.form-field.textarea {
  height: 6vw;
}

.form-field.textarea.white {
  height: 10vw;
}

.form-field.white {
  background-color: #fff;
}

.form-block-contact {
  width: 100%;
}

.line-partners {
  background-color: #707070;
  width: 100%;
  height: 1px;
}

.box-partners {
  z-index: 3;
  border-radius: 20px;
  height: 10vw;
  display: flex;
  position: absolute;
  left: 5vw;
  right: 5vw;
  overflow: hidden;
}

.partner {
  justify-content: center;
  align-items: center;
  min-height: 10vw;
  margin-left: 50px;
  margin-right: 50px;
  display: flex;
  min-width: 100px;
  min-width: 200px;
  max-width: 200px;
  background-color: white;
  border-radius: 10px;
  padding: 10px;
}
.partner.white {
  border: none;
}

.partner:hover {
  opacity: 1;
}

.logo-partner {
  max-height: 7vw;
  padding: 5px;
  background-color: white;
  border-radius: 5px;
}

.partners-holder {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 12vw;
  padding-top: 2vw;
  display: flex;
  position: relative;
}

.sectionfull {
  background-image: linear-gradient(#000000bf, #000000bf), url('../images/sectionfullimage.svg');
  background-position: 0 0, 0 0;
  background-size: auto, cover;
  background-attachment: scroll, fixed;
  justify-content: center;
  align-items: center;
  height: 65vh;
  display: flex;
  box-shadow: 13px 13px 15px 3px #0003;
}

.all-partners-link {
  grid-column-gap: 1vw;
  grid-row-gap: 1vw;
  color: var(--grey);
  align-items: center;
  font-size: 1vw;
  text-decoration: none;
  transition: all .2s;
  display: flex;
  position: absolute;
  inset: 0% 7vw auto auto;
}

.all-partners-link:hover {
  grid-column-gap: 2vw;
  grid-row-gap: 2vw;
}

.all-partners-link.notabs {
  position: static;
}

.logo-navs {
  opacity: .85;
  width: 8vw;
}

.logo-navs:hover {
  opacity: 1;
}

.holder-nav-links {
  z-index: 12;
  background-color: var(--black);
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.navlink {
  color: var(--grey);
  padding: 2vw;
  font-size: 1vw;
  text-decoration: none;
}

.navlink:hover {
  border-bottom: 1px solid var(--orange);
  font-weight: 600;
}

.slider-partner {
  display: flex;
}

.herotext-new {
  width: 50vw;
  position: absolute;
  inset: auto auto 3vw 3vw;
}

.video-hero-new {
  width: 100%;
  height: 100vh;
  position: absolute;
  overflow: hidden;
}

.image-2 {
  z-index: 22;
  position: relative;
}

.paragraafdubbel {
  text-align: left;
}

.contain-diensten-section {
  width: 90%;
}

.line-heading {
  border-top: 1px none var(--grey);
  border-bottom: 1px solid #2e2e2e;
  flex-direction: column;
  align-items: flex-end;
  margin-bottom: 2vw;
  margin-left: 50vw;
  font-weight: 100;
  display: flex;
}

.heading-2 {
  margin-right: 1vw;
  font-size: 1.5vw;
}

.hero-video {
  z-index: 15;
  justify-content: center;
  align-items: flex-end;
  padding-top: 20px;
  padding-bottom: 10vh;
  display: flex;
  position: relative;
}

.hero-video.advies {
  background-image: linear-gradient(#000000d9, #000000d9), url('../images/hero_advies_v2.jpg');
  background-position: 0 0, 0 0;
  background-size: auto, cover;
  padding-top: 6vw;
}

.hero-video.onderhoud {
  background-image: linear-gradient(#000000bf, #000000bf), url('../images/wiish_onderhoud.jpg');
  background-position: 0 0, 0 0;
  background-size: auto, cover;
}

.hero-video.installatie {
  background-image: linear-gradient(#00000080, #00000080), url('../images/elevator_hallway.jpg');
  background-position: 0 0, 0 0;
  background-size: auto, cover;
}

.hero-video.new {
  align-items: flex-start;
  height: 300vh;
  padding-top: 55vh;
}

.video-intro {
  z-index: 20;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
}

.absolute-full {
  z-index: 21;
  position: absolute;
  inset: 0%;
}

.loading-div {
  z-index: 30;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.wiish-loading {
  z-index: 30;
  width: 15px;
}

.wiish-loading-holder {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.holder-socials {
  height: 6vw;
  display: flex;
  overflow: hidden;
}

.social {
  opacity: .76;
  justify-content: center;
  align-items: center;
  width: 6vw;
  height: 100%;
  display: flex;
}

.social:hover {
  opacity: 1;
}

.social-icon {
  height: 1.2vw;
}

.logo-footer {
  width: 10vw;
  margin-bottom: 3vw;
}

.footer-parts {
  flex-direction: column;
  align-items: flex-start;
  width: 23vw;
  padding-left: 3vw;
  padding-right: 3vw;
  display: flex;
}

.titel-footer {
  text-transform: uppercase;
  border-bottom: 1px solid #707070;
  width: 100%;
  margin-bottom: 1.5vw;
  font-size: 1.2vw;
}

.link-footer {
  color: var(--grey);
  margin-bottom: .5vw;
  padding-left: 1vw;
  padding-right: 1vw;
  text-decoration: none;
}

.link-footer:hover {
  color: var(--yellow);
}

.left-side-footer {
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 2vw;
  display: flex;
}

.subtitle-small {
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 3vw;
  font-size: 1vw;
}

.nav-static-holder {
  justify-content: center;
  align-items: center;
  display: flex;
}

.leftside-explainer {
  width: 40%;
  padding-right: 3vw;
}

.rightside-explainer {
  border-radius: 10px;
  align-items: center;
  width: 60%;
  max-height: 60vh;
  display: flex;
  overflow: hidden;
}

.heading {
  margin-top: 0;
  margin-bottom: 2vw;
}

.image-3 {
  object-fit: scale-down;
}

.image-explainer {
  width: 100%;
}

.holder-klanten {
  flex-wrap: wrap;
  justify-content: center;
  width: 70vw;
  display: flex;
  gap: 20px;
}

.logo-footer-full-section {
  width: 10vw;
}

.hamburger-holder {
  background-color: var(--grey);
  border-radius: 10px;
  padding: 10px;
}

.hamburger-holder:hover {
  background-image: linear-gradient(to right, var(--yellow), var(--orange));
}

.hero-diensten {
  justify-content: flex-end;
  height: 100vh;
  display: flex;
  position: relative;
}

.hero-diensten.advies {
  background-image: url('../images/kyle-philip-coulson-9gn3kJCLFR8-unsplash.jpg');
  background-position: 0%;
  background-size: cover;
}

.diensten-hero-content {
  background-color: var(--black);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 50%;
  padding-left: 2vw;
  padding-right: 2vw;
  display: flex;
}

.logo-diensten-hero {
  width: 8vw;
  position: absolute;
  inset: auto auto 2vw 2vw;
}

.diensten-second-section {
  z-index: 20;
  background-image: linear-gradient(to top, #000 60%, #080808bf 85%, #0a0a0a00);
  flex-direction: column;
  align-items: center;
  padding-top: 10vh;
  padding-bottom: 10vh;
  display: flex;
}

._50-element {
  width: 50%;
  min-width: 50%;
}

._50-element.step {
  margin-bottom: 5vw;
  display: flex;
}

.menu-opener {
  z-index: 9999;
  border: 1px solid var(--grey);
  background-color: var(--black);
  cursor: pointer;
  border-radius: 15px;
  padding: 5px 2vw;
  display: flex;
}

.rest-page-diensten {
  z-index: 30;
  background-color: var(--black);
  position: relative;
}

.paragraafsmalhero {
  width: 60%;
}

.heading-two {
  font-family: Archivo, sans-serif;
  font-size: 2vw;
  line-height: 3vw;
}

.circlednumber {
  border: 1px solid var(--dark-grey);
  color: var(--dark-grey);
  border-radius: 20vw;
  justify-content: center;
  align-items: center;
  width: 4vw;
  min-width: 4vw;
  height: 4vw;
  min-height: 4vw;
  margin-right: 2vw;
  transition: all .2s;
  display: flex;
}

.circlednumber.active {
  background-image: linear-gradient(to right, var(--yellow), var(--orange));
  color: var(--grey);
  border-style: none;
  font-weight: 800;
}

.holderstep {
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-start;
  min-height: 85vh;
  margin-top: 100px;
  display: flex;
}

.heading-step {
  margin-top: 0;
  margin-bottom: 1vw;
  font-family: Archivo, sans-serif;
  font-size: 2vw;
  line-height: 3vw;
}

.image-advies-holder {
  object-fit: contain;
  border-radius: 5px;
  align-items: flex-start;
  width: 30%;
  margin-top: 2vw;
  margin-left: 10%;
  display: flex;
}

.sticky {
  position: sticky;
  top: 1vw;
  bottom: 0;
}

.rounded-element {
  border-radius: 20px;
}

.holder-advies-info-extra {
  width: 100%;
  padding-left: 6vw;
  display: flex;
  gap: 2vw;
}

.holder-advies-info-extra.nopadding {
  padding-left: 0;
}

.horizontal-flex {
  align-items: flex-start;
  display: flex;
}

.phone-form {
  border: 1px solid var(--dark-grey);
  background-color: var(--less-dark-black);
  border-radius: 20px;
  flex-direction: column;
  justify-content: space-between;
  width: 30vw;
  height: 40vw;
  margin-top: 4vw;
  position: relative;
  overflow: hidden;
}

.inside-phone-form {
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  display: flex;
}

.part-phone-form {
  border-bottom: 1px solid var(--dark-grey);
  justify-content: space-between;
  align-items: center;
  height: 15%;
  padding-left: 2vw;
  padding-right: 2vw;
  font-weight: 800;
  display: flex;
}

.part-phone-form.bottom {
  border-bottom-style: none;
}

.part-phone-form.bottom.first {
  background-color: var(--less-dark-black);
  position: absolute;
  inset: auto 0% 0%;
}

.part-phone-form.messages {
  border-bottom-style: none;
  flex-direction: column;
  justify-content: flex-end;
}

.icon-social-phone {
  height: 1.7vw;
  margin-left: 3vw;
}

.messages {
  height: 70%;
}

.sending-messages {
  align-items: center;
  height: 15%;
  display: flex;
}

.message-box {
  border: 1px solid var(--dark-grey);
  color: var(--grey);
  background-color: #fff0;
  border-radius: 10px;
  margin-bottom: 0;
  font-weight: 100;
}

.sendbutton {
  -webkit-text-stroke-color: var(--dark-grey);
  background-color: #3898ec00;
  background-image: url('../images/sendbutton.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 75% 75%;
  width: 1vw;
  height: 2vw;
  margin-left: 1vw;
}

.message-holder {
  text-align: left;
  align-items: flex-start;
  width: 100%;
  padding-top: 1vw;
  padding-bottom: 1vw;
  padding-right: 20%;
  font-weight: 100;
  display: flex;
}

.message-holder.reply {
  justify-content: flex-end;
  padding-left: 20%;
  padding-right: 0%;
}

.profilepic-message {
  background-color: var(--grey);
  border-radius: 100vw;
  justify-content: center;
  align-items: center;
  width: 4vw;
  min-width: 4vw;
  height: 4vw;
  min-height: 4vw;
  margin-right: 2vw;
  display: flex;
}

.profilepic-message.reply {
  margin-left: 2vw;
  margin-right: 0;
}

.picinsideprofile {
  max-width: 55%;
  max-height: 55%;
}

.message {
  background-color: var(--grey);
  color: var(--black);
  border-radius: 10px;
  padding: .5vw 1vw;
  font-size: 1vw;
}

.nav-fixed-holder {
  z-index: 100;
  justify-content: center;
  width: 100%;
  display: flex;
  position: fixed;
}

.holder-box-advies {
  text-align: left;
  cursor: pointer;
  background-color: #ffffff1a;
  border-radius: 5px;
  flex-direction: column;
  align-items: flex-start;
  width: 40%;
  padding: 2vw;
  display: flex;
  color: var(--grey);
  text-decoration: none;
}

.holder-box-advies:hover {
  background-color: var(--gradient-transparent);
  background-image: linear-gradient(to right, #fdc40033, #ef780933);
}

.holder-box-advies.with3 {
  width: 30%;
}

.heading-inside-box {
  margin-top: 0;
  font-size: 1.2vw;
  line-height: 1.6vw;
}

.holder-intro-lr {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.holder-intro-lr.down {
  align-items: flex-end;
  margin-top: 10vw;
}

.image-4 {
  width: 50%;
}

.spacedown {
  margin-bottom: 2vw;
}

.holder-heading-and-boxes {
  flex-direction: column;
  align-items: flex-start;
  margin-top: 10vw;
  display: flex;
}

.imageinpopup {
  background-image: url('../images/buttons_image.jpg');
  background-position: 0 0;
  background-size: cover;
  border-radius: 10px 0 0 10px;
  width: 50%;
  height: 100%;
  position: absolute;
  inset: 0% auto 0% 0%;
  overflow: hidden;
}

.circle {
  background-color: #ed8432;
  border-radius: 20px;
  width: 5px;
  min-width: 5px;
  height: 5px;
  min-height: 5px;
  margin-top: 7px;
  margin-right: 10px;
}

.popupinside {
  z-index: 112;
  color: #121d25;
  background-color: #fff;
  border-radius: 10px;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 75vw;
  height: 75vh;
  display: none;
  position: relative;
  box-shadow: 1px 1px 3px #000;
}

.popupinside.vis {
  display: flex;
}

.horizontalflex {
  align-items: flex-start;
  display: flex;
}

.close-button {
  z-index: 113;
  color: #121d25;
  cursor: pointer;
  background-color: #e2e2e2;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  display: flex;
  position: absolute;
  inset: 12vh 12vw auto auto;
}

.width-100 {
  width: 100%;
}

.width-100.centered {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.heading-hoofd {
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 20px;
  font-weight: 700;
}

.heading-hoofd.as-section-title {
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 40px;
  font-weight: 700;
}

.heading-hoofd.as-section-title.smaller {
  text-align: left;
  margin-bottom: 20px;
}

.text-holder-popup {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 50%;
  height: 100%;
  margin-left: 50%;
  padding: 40px;
  display: flex;
  overflow: scroll;
}

.popupholder {
  z-index: 111;
  background-color: #000000bf;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.text-block {
  display: inline;
}

.hamburgericon {
  width: 2vw;
}

.hamburger {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-left: 1vw;
  display: flex;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.hamb-line {
  background-color: var(--grey);
  border-radius: 20px;
  width: 10px;
  height: 1px;
  margin-top: 2px; 
  margin-bottom: 2px;
  transition: all 0.3s ease-in-out;
}

.hamburger.open .hamb-line:nth-child(1) {
  transform: translateY(5px) rotate(45deg);
}

.hamburger.open .hamb-line:nth-child(2) {
  opacity: 0;
}

.hamburger.open .hamb-line:nth-child(3) {
  transform: translateY(-5px) rotate(-45deg);
}

.holder-logo-nav {
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}

.holder-lines-logo {
  justify-content: space-between;
  align-items: center;
  width: 16px;
  height: 50px;
  display: flex;
  position: relative;
}

.line-logo {
  background-color: var(--grey);
  border-radius: 10px;
  width: 4px;
  min-width: 4px;
  max-width: 4px;
  height: 80%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.line-logo.right {
  min-width: 20%;
  inset: auto 0% 0% auto;
}

.holder-text-logo {
  flex-flow: column;
  align-items: center;
  height: 80%;
  margin-left: 2vw;
  display: flex;
}

.wiish-logo {
  letter-spacing: 8px;
  text-transform: uppercase;
  margin-bottom: 4px;
  font-family: Arlrdbd, sans-serif;
  font-size: 12px;
  line-height: 18px;
}

.liften-logo {
  letter-spacing: 2px;
  text-transform: uppercase;
  font-family: Archivo, sans-serif;
  font-size: 10px;
  font-weight: 100;
  line-height: 16px;
}

.circlehero {
  background-color: #fff;
  background-image: linear-gradient(180deg, var(--orange), var(--yellow));
  color: var(--black);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  font-family: Changa One, Impact, sans-serif;
  display: flex;
  position: sticky;
  top: 45vh;
  transform: rotate(90deg);
}

.circlehero.liftbtn {
  background-color: #fff0;
  background-image: url('../images/lift_button_lit.png');
  background-position: 0 0;
  background-size: cover;
}

.holder-scroller {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 20%;
  margin-bottom: 100px;
  display: flex;
  position: relative;
}

.line-in-scroll {
  background-image: radial-gradient(circle farthest-corner at 50% 50%, var(--yellow), var(--orange));
  border-radius: 5px;
  width: 5px;
  height: 200vh;
}

.div-block {
  z-index: 3;
  width: 100vw;
  height: 100vh;
  position: fixed;
  inset: 0% 0% auto;
}

.holder-scrolling-columns {
  width: 70%;
  display: flex;
}

._40-column {
  width: 40%;
}

._40-column.rightscr {
  flex-flow: column;
  justify-content: space-between;
  margin-top: 40vh;
  display: flex;
}

._40-column.left {
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  margin-top: 40vh;
  display: flex;
}

.contentboxscr {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  text-align: left;
  background-color: var(--black);
  border-radius: 10px;
  padding: 20px;
}

.heading-3 {
  color: var(--yellow);
  text-transform: uppercase;
  margin-top: 0;
  font-family: Archivo, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
}

.scrollimage {
  z-index: 10;
  opacity: 0;
  object-fit: cover;
  border-radius: 10px;
  width: 80vw;
  height: 70vh;
  margin-top: 15vh;
  margin-left: 10vw;
  transition: opacity .3s;
  position: fixed;
  inset: 0%;
}

.scrollimage.two {
  margin-top: 100vh;
}

.scrollimage.three {
  margin-top: 200vh;
}

.scrollimage.full {
  width: 100vw;
  height: 100vh;
  margin-top: 0;
  margin-left: 0;
}

.higher-rel {
  z-index: 16;
  margin-top: 140px;
  position: relative;
}

.field-label {
  padding-left: 10px;
}

.titel-lift-naam {
  color: var(--yellow);
  margin-bottom: 5px;
  padding-left: 10px;
}

.buttonwithanimation {
  background-image: linear-gradient(180deg, var(--yellow), var(--orange) 61%);
  color: var(--grey);
  border-radius: 5px;
  align-items: center;
  padding: 8px 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all .2s;
  display: flex;
}

.buttonwithanimation:hover {
  background-color: var(--white);
  color: var(--orange);
  background-image: none;
}

.buttonwithanimation.margleft {
  margin-left: 10px;
}

.buttonwithanimation.second {
  background-image: linear-gradient(180deg, var(--grey), var(--dark-grey) 92%);
}

.buttonwithanimation.second:hover {
  background-image: none;
}

.triangle {
  border-top: 8px solid #0000;
  border-bottom: 8px solid #0000;
  border-left: 15px solid;
  border-radius: 3px;
  width: 0;
  height: 0;
}

.triangle.reverse {
  transform: rotate(-180deg);
}

.closeelevatorbtn {
  color: var(--orange);
  justify-content: flex-start;
  align-items: center;
  margin-right: 20px;
  text-decoration: none;
  display: none;
}

.centerlinebtn {
  background-color: var(--orange);
  border-radius: 20px;
  width: 3px;
  height: 20px;
  margin-left: 4px;
  margin-right: 4px;
}

.holder-btns {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: flex-start;
  display: flex;
}

.elevatordoor {
  z-index: 99999;
  background-color: var(--black);
  width: 0;
  transition: all .4s;
  position: fixed;
  inset: 0% auto 0% 0%;
}

.elevatordoor.right {
  inset: 0% 0% 0% auto;
}

.logonav {
  width: 160px;
}

.logodisplay {
  width: 160px;
}

.logodisplay._16 {
  width: 160px;
}

.divider {
  background-color: var(--black);
  width: 100%;
  height: 1px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.divider.onlight {
  background-color: var(--dark-grey);
}

.vestiginginfo {
  width: 100%;
  padding: 20px;
  transition: all 0.8s ease;
}

.vestiginginfo.active {
  padding-left: 40px;
}

.title-vestiging {
  margin-bottom: 10px;
  font-weight: 700;
}

.holdermap {
  position: relative;
  width: 60%;
  min-width: 60%;
}

.map-pinpoint {
  border: 1px solid var(--dark-grey);
  background-color: #00000080;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
  position: absolute;
  top: 8%;
  left: 45%;
  box-shadow: 0 2px 5px #0003;
  transition: all 0.8s ease;
  cursor: pointer;
}

.map-pinpoint.active {
  border: 1px solid var(--yellow);
  z-index: 1;
}

.map-pinpoint.limburg {
  top: 12%;
  left: 68%;
}

.map-pinpoint.willebroek {
  top: 20%;
  left: 45%;
}

.map-pinpoint.wemmel {
  top: 28%;
  left: 43%;
}

.map-pinpoint.aalter {
  top: 18%;
  left: 25%;
}

.map-pinpoint.wallonie {
  top: 45%;
  left: 60%;
}

.spacer {
  height: 10px;
}

.spacer.large {
  height: 20px;
}

.spacer.xl {
  height: 40px;
}

.card {
  z-index: 1;
  background-color: #191919;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  width: 80%;
  height: 85%;
  margin-bottom: 20px;
  padding: 5vw;
  position: absolute;
  inset: auto auto 0% 0%;
}

.card.smiplevers {
  z-index: 5;
  background-color: #19191900;
  border-style: none;
  width: 100%;
  height: auto;
  margin-bottom: 0;
  display: flex;
  position: relative;
  text-align: left;
}

.imagecard {
  border-radius: 5px;
  width: 45%;
  margin-left: 3vw;
  object-fit: cover;
}

.imagecard.left {
  margin-left: 0;
  margin-right: 4vw;
}

.heading-in-card {
  max-width: 325px;
  margin-bottom: 20px;
  font-size: 1.8vw;
  line-height: 2.4vw;
}

.bold-text {
  font-weight: 700;
}

.gradient-radial {
  z-index: 1;
  opacity: .5;
  background-image: radial-gradient(circle, #107136, #163422 40%, #191919 66%, #191919);
  width: 400px;
  min-width: 35vw;
  max-width: 90vw;
  height: 310px;
  min-height: 29vw;
  margin-bottom: -10vw;
  position: absolute;
  inset: auto 0% 0%;
}

.gradient-radial.rightup {
  background-image: radial-gradient(circle farthest-corner at 50% 50%, #8b4401, #2c1500 40%, var(--black-2) 66%, var(--black-2));
  margin-bottom: 0;
  inset: 120px 0% auto auto;
}

.toepassingitem {
  background-color: var(--black);
  text-align: left;
  border-radius: 10px;
  justify-content: flex-start;
  align-items: center;
  width: 600px;
  max-width: 100%;
  padding: 20px;
  display: flex;
}

.toepassingitem.simple {
  background-color: #1c1b2200;
  width: auto;
  padding: 0;
}

.dotcircle {
  background-color: var(--grey);
  border-radius: 50%;
  width: 8px;
  min-width: 8px;
  height: 8px;
  min-height: 8px;
  margin-right: 20px;
  display: inline-block;
}

.inlinetext {
  display: inline-block;
}

.holderlistgap {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  align-items: stretch;
  display: flex;
}

@media screen and (max-width: 991px) {
  .body {
    font-size: 12px;
    line-height: 20px;
  }

  .content-history {
    position: relative;
    width: 90vw;
  }

  .sectionfull {
    background-position: 0 0, 75% 0%;
    height: 300px;
  }

  .heading-inside-box {
    font-size: 14px;
    line-height: 18px;
  }

  .titel-footer {
    font-size: 10px;
  }

  .social {
    width: calc(100% / 3);
  }

  .holder-socials {
    height: 60px;
    margin-top: 20px;
    width: 200px;
  }

  .social-icon {
    height: 14px;
  }

  .logofooter {
    width: 120px;
  }

  .text-dienst {
    font-size: 12px;
    line-height: 20px;
    display: block;
  }

  .heading-1 {
    margin-bottom: 30px;
    font-size: 30px;
    line-height: 36px;
  }

  .mainbutton {
    padding-top: 9px;
    padding-bottom: 9px;
  }

  .navbar {
    height: 80px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .sectionstandard {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .contain-center {
    width: 80vw;
  }

  .contain-center.centered, .contain-center.contact {
    width: 90vw;
  }

  .grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
  }

  .dienst {
    max-width: none;
    min-height: 300px;
  }

  .arrow-dienst {
    width: 30px;
  }

  .title-dienst {
    font-size: 16px;
    bottom: 10px;
    left: 20px;
  }

  .icon-dienst {
    width: 20px;
  }

  .icon-dienst.diensten {
    display: none;
  }

  .text-dienst {
    display: block;
  }

  .left-side-contact {
    height: auto;
  }

  .form-field {
    height: 50px;
    margin-bottom: 10px;
  }

  .form-field.textarea {
    height: 80px;
  }

  .box-partners {
    height: 210px;
  }

  .partner {
    min-width: 200px;
    min-height: 200px;
    max-width: 200px;
  }

  .logo-partner {
    max-height: 100px;
  }

  .partners-holder {
    height: 240px;
    padding-top: 20px;
  }

  .all-partners-link {
    font-size: 14px;
  }

  .logo-navs {
    width: 60px;
  }

  .holder-nav-links {
    flex-direction: column;
    justify-content: center;
    display: none;
  }

  .navlink {
    padding: 20px;
    font-size: 12px;
  }

  .line-heading {
    margin-bottom: 20px;
    margin-left: 20vw;
  }

  .heading-2 {
    font-size: 18px;
    line-height: 24px;
  }

  .hero-video {
    padding-bottom: 0;
  }

  .logo-footer {
    width: 100px;
  }

  .left-side-footer {
    padding-top: 20px;
  }

  .subtitle-small {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 22px;
  }

  .logo-footer-full-section {
    width: 100px;
  }

  .hamburger-holder {
    z-index: 40;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 100%;
    display: flex;
    position: relative;
  }

  .line-hamburger-top {
    background-color: var(--grey);
    width: 30px;
    height: 3px;
  }

  .menu-opener {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .paragraafsmalhero, .heading-two {
    font-size: 16px;
    line-height: 22px;
  }

  .circlednumber {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    margin-right: 20px;
  }

  .heading-step {
    font-size: 16px;
    line-height: 22px;
  }

  .phone-form {
    width: 350px;
    height: 500px;
  }

  .part-phone-form {
    padding-left: 15px;
    padding-right: 15px;
  }

  .icon-social-phone {
    height: 20px;
  }

  .sendbutton {
    width: 10px;
    height: 20px;
  }

  .message-holder {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .profilepic-message {
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
  }

  .message {
    padding: 5px 10px;
    font-size: 12px;
  }

  .card {
    overflow: scroll;
  }

  .card.smiplevers {
    overflow: visible;
  }

  .heading-in-card {
    font-size: 18px;
    line-height: 24px;
  }
}

@media screen and (max-width: 767px) {
  .contain-center, .contain-center.centered {
    width: 90vw;
  }

  .holderblocks {
    gap: 10px;
  }
  
  .block {
    width: 100%;
  }
  
  .block.large {
    width: 100%;
  }
  .block.small {
    width: 100%;
  }

  .gradient-vid {
    display: block;
  }

  .year {
    left: 0px;
  }

  .text-title-story {
    z-index: 13;
    text-align: right;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    display: flex;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
    width: 100%;
  }

    .image-story {
      position: absolute;
      top: 0%;
      bottom: auto;
      left: auto;
      right: 0%;
    }

  .text-story {
      text-align: right;
      margin-bottom: 40px;
      max-width: 60%;
  }

  .holder-advies-info-extra {
    flex-direction: column;
    gap: 10px;
    padding-left: 0px;
  }

  .holder-box-advies {
    width: 100%;
    padding: 20px;
  }

  .holder-box-advies.with3 {
    width: 100%;
  }

  .grid-type-liften {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .item-types {
    height: 320px;
    width: 300px;
  }

  .holder-type-lift-cta {
    font-size: 12px;
  }

  .nav-static-holder {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .message-box {
    font-size: 16px;
  }

  .heading-hoofd {
    font-size: 30px;
    line-height: 36px;
  }

  .heading-hoofd.as-section-title.smaller {
    font-size: 18px;
    line-height: 24px;
  }

  .popupholder {
    display: none;
  }

  .card {
    width: 100%;
    height: auto;
    position: static;
  }

  .card.smiplevers {
    align-items: center;
  }

  .card.smiplevers {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
    padding: 0;
  }

  .imagecard {
    width: 100%;
    margin-left: 0;
  }

  .toepassingitem, .holderlistgap {
    width: 100%;
  }
}

@media screen and (max-width: 479px) {
  .heading-1.tiltedleft {
    width: 100%;
    transform: none;
  }

  #time-indicator {
    width: 50px;
  }

  .part-story {
    font-size: 10px;
  }

  .logonav {
  width: 120px;
  }
  
  .logodisplay {
    width: 120px;
  }

  .nav-button {
    width: 40px;
    height: 40px;
  }

  .heading-1.centered {
    text-align: left;
  }

  .item-types {
    width: 100%;
  }

  .contain-center.contact {
      padding: 20px;
    }

  .btn-elevator {
    font-size: 12px;
  }

  .navbar {
    position: static;
  }

  .contain-center.centered.scrolls {
    width: 90vw;
  }

  .contain-center.contactsection {
    flex-direction: column;
    width: 90vw;
  }

  .contain-center.contactsection.phoneill {
    flex-flow: column-reverse;
    display: flex;
    align-items: center;
    gap: 40px;
  }

  .contain-center.reverseph {
    flex-flow: column-reverse;
  }

  .contain-center.footer {
    flex-flow: column;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .dienst {
    height: 90vw;
  }

  .title-dienst {
    font-size: 14px;
  }

  .icon-dienst.diensten {
    display: none;
  }

  .text-dienst {
    display: block;
  }

  .left-side-contact.vestigingen, .contact-right-side {
    width: 100%;
  }

  .hero-video {
    align-items: center;
  }

  .hero-video.new {
    height: auto;
    padding-top: 100px;
  }

  .holder-socials {
    justify-content: space-around;
    height: 50px;
  }

  .social-icon {
    height: 20px;
  }

  .footer-parts {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
  }

  .titel-footer {
    margin-bottom: 10px;
    font-size: 12px;
  }

  .left-side-footer {
    margin-bottom: 10px;
  }

  ._50-element, .paragraafsmalhero {
    width: 100%;
  }

  .image-advies-holder {
    display: none;
  }

  .phone-form {
    width: 90vw;
    height: 80vh;
  }

  .imageinpopup {
    display: none;
  }

  .popupinside {
    width: 100vw;
    height: auto;
    position: absolute;
    inset: 25vh 0% 0%;
  }

  .close-button {
    top: 25vh;
    right: 1vw;
  }

  .text-holder-popup {
    width: 100%;
    margin-left: 0%;
  }

  .holder-scroller {
    display: none;
  }

  .holder-scrolling-columns {
    flex-flow: column;
    width: 100%;
    gap: 20px;
    flex-flow: column-reverse;
  }

  ._40-column.rightscr, ._40-column.left {
    width: 100%;
    margin-top: 0;
    gap: 20px;
  }

  .scrollimage.full {
    display: none;
  }

  .card.smiplevers {
    flex-flow: column;
  }

  .card.smiplevers.revrseph {
    flex-flow: wrap-reverse;
  }

  .imagecard {
    width: 100%;
  }
}

#w-node-b8b33ed4-2e08-1b1b-e136-c95da3f0df8f-010abb61, #w-node-db40267b-cdb7-a3b1-ce59-3c3e1832b169-010abb61, #w-node-a125461d-8f22-23a8-a954-3a882dccce25-010abb61, #w-node-_2366621c-1204-5a66-b0aa-af0dfbbd8edc-010abb61, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7942-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7947-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b794c-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7951-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7956-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b795b-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7960-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b7965-c4971f4f, #w-node-bf37ae95-1d2c-4926-d794-7fafdc1b796a-c4971f4f, #w-node-_2366621c-1204-5a66-b0aa-af0dfbbd8edc-c4971f4f, #w-node-a125461d-8f22-23a8-a954-3a882dccce25-c4971f4f, #w-node-db40267b-cdb7-a3b1-ce59-3c3e1832b169-c4971f4f, #w-node-b8b33ed4-2e08-1b1b-e136-c95da3f0df8f-c4971f4f, #w-node-b8b33ed4-2e08-1b1b-e136-c95da3f0df8f-09843010, #w-node-db40267b-cdb7-a3b1-ce59-3c3e1832b169-09843010, #w-node-a125461d-8f22-23a8-a954-3a882dccce25-09843010, #w-node-_2366621c-1204-5a66-b0aa-af0dfbbd8edc-09843010, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6c96-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6c9b-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6ca0-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6ca5-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6caa-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6caf-14c277c1, #w-node-_9b2e2a2e-fb69-dcc6-c6ec-faf92cec6cb4-14c277c1 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}


@font-face {
  font-family: 'Arlrdbd';
  src: url('../fonts/ARLRDBD.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}