.med {
  width:calc(100% - 30px);
  margin:30px 15px;
  aspect-ratio:.8;
  position:relative;
  overflow:visible;
  border-radius:23px;
  background-size:cover;
  background-position:center;
  font-size:16px;
}
  .med .overlay {
    padding:20px 5px 5px 30px;
  }


#introductie h3 {
  display:inline;
}

  #introductie .arrow_dot {
    position:relative;
    display:inline-block;
    width:40px;
    background-color:var(--orange);
    text-align:center;
  }
  #introductie .arrow_dot:hover {
    background-color:black;
  }
  #introductie .arrow_dot:active {
    transform:scale(.9);
  }
    #introductie .arrow_dot:after {
      position:absolute;
      top:20%;
      left:20%;
      background:var(--lightgray);
      transform:rotate(90deg);
    }





/* Cross Slider */

.cross-slider {

  width:104%;
  left:-2%;
  height:auto;
  position:relative;
  overflow:hidden;
  display:flex;
  gap:30px;
  flex-direction:column;
  align-items:center;
  transform:rotate(-2deg);

}
  .cross-slider .rails {
    width:fit-content;
    height:auto;
    display:flex;
    gap:30px;
    white-space:nowrap;
    position:relative;
    will-change: transform;
  }
  .cross-slider .rails.top {
    flex-direction:row-reverse;
    left:-50vw;
  }
  .cross-slider .rails.bottom {
    right:-50vw;
  }
    .cross-slider .rails .slide {
      height:24vh;
      max-height:400px;
      aspect-ratio:1920/1080;
      background:black;
      color:var(--orange);
      font-size:30px;
      border-radius:23px;
      background-size:cover;
      background-position:center;
    }

@media (max-width:767px) {
  #introductie .arrow_dot {
    width:28px;
  }
  .cross-slider, .cross-slider .rails {
    gap:15px;
  }
}


/* Vacature */
.med.vacature {
  display:flex;
  align-items:center;
  justify-content:center;
}
.med.vacature.man .zoom-bg {
  background-image:url('../../img/vac-man.webp');
}
.med.vacature.vrouw {
  background-image:url('../../img/vac-vrouw.webp');
}
