.carousel{
  clip-path: inset( -100vw -100vw -100vw 0 );
}
/* -------- START carousel 3 columns ---------- */
/* col-lg-4 col-md-6 */
/* small - display 1  */
@media (max-width: 767px) {
  /* #TriggerNameCarousel1{ border: solid 1px purple; background-color: purple;} */
  .carousel-inner-col3 .carousel-item > div {
      display: none;
  }
  .carousel-inner-col3 .carousel-item > div:first-child {
      display: block;
  }
}

/* medium - display 2  */
@media (min-width: 768px) {
  /* #TriggerNameCarousel1{ border: solid 1px pink; background-color: pink;} */
  .carousel-inner-col3 .carousel-item-end.active,
  .carousel-inner-col3 .carousel-item-next {
      transform: translateX(50%);
  }

  .carousel-inner-col3 .carousel-item-start.active,
  .carousel-inner-col3 .carousel-item-prev {
      transform: translateX(-50%);
  }
}

/* large - display 3 */
@media (min-width: 992px) {
  /* #TriggerNameCarousel1{ border: solid 1px green; background-color: green;} */
  .carousel-inner-col3 .carousel-item-end.active,
  .carousel-inner-col3 .carousel-item-next {
      transform: translateX(33.333%);
  }

  .carousel-inner-col3 .carousel-item-start.active,
  .carousel-inner-col3 .carousel-item-prev {
      transform: translateX(-33.333%);
  }
}

/* extra large - display 4 - Delete niet nodig */
/* -------- END carousel 3 columns ---------- */


/* -------- START carousel 4 columns ---------- */
/* col-xl-3 col-lg-4 col-md-6 */
/* small - display 1  */
@media (max-width: 767px) {
  /* #TriggerNameCarousel2{ border: solid 1px purple; background-color: purple;} */
  .carousel-inner-col4 .carousel-item > div {
      display: none;
  }
  .carousel-inner-col4 .carousel-item > div:first-child {
      display: block;
  }
}

/* medium - display 2  */
@media (min-width: 768px) {
  /* #TriggerNameCarousel2{ border: solid 1px pink; background-color: pink;} */
  .carousel-inner-col4 .carousel-item-end.active,
  .carousel-inner-col4 .carousel-item-next {
      transform: translateX(50%);
  }

  .carousel-inner-col4 .carousel-item-start.active,
  .carousel-inner-col4 .carousel-item-prev {
      transform: translateX(-50%);
  }
}

/* large - display 3 */
@media (min-width: 992px) {
  /* #TriggerNameCarousel2{ border: solid 1px green; background-color: green;} */
  .carousel-inner-col4 .carousel-item-end.active,
  .carousel-inner-col4 .carousel-item-next {
      transform: translateX(33.333%);
  }

  .carousel-inner-col4 .carousel-item-start.active,
  .carousel-inner-col4 .carousel-item-prev {
      transform: translateX(-33.333%);
  }
}

/* extra large - display 4 */
@media (min-width: 1200px) {
  /* #TriggerNameCarousel2{ border: solid 1px red; background-color: red;} */
  .carousel-inner-col4 .carousel-item-end.active,
  .carousel-inner-col4 .carousel-item-next {
      transform: translateX(25%);
  }

  .carousel-inner-col4 .carousel-item-start.active,
  .carousel-inner-col4 .carousel-item-prev {
      transform: translateX(-25%);
  }
}
/* -------- END carousel 4 columns ---------- */


/* -------- START carousel 6 columns ---------- */
/* col-xl-2 col-lg-3 col-md-4 col-sm-6 */
/* small - display 1  */
@media (max-width: 576px) {
   /* #TriggerNameCarousel3{ border: solid 1px pink; background-color: pink;} */
  .carousel-inner-col6 .carousel-item-end.active,
  .carousel-inner-col6 .carousel-item-next {
      transform: translateX(50%);
  }

  .carousel-inner-col6 .carousel-item-start.active,
  .carousel-inner-col6 .carousel-item-prev {
      transform: translateX(-50%);
  }
}

/* small - display 1  */
@media (min-width: 767px) {
  /* #TriggerNameCarousel2{ border: solid 1px pink; background-color: pink;} */
  .carousel-inner-col6 .carousel-item-end.active,
  .carousel-inner-col6 .carousel-item-next {
      transform: translateX(50%);
  }

  .carousel-inner-col6 .carousel-item-start.active,
  .carousel-inner-col6 .carousel-item-prev {
      transform: translateX(-50%);
  }
}

/* medium - display 2  */
@media (min-width: 768px) {
  /* #TriggerNameCarousel2{ border: solid 1px pink; background-color: pink;} */
  .carousel-inner-col6 .carousel-item-end.active,
  .carousel-inner-col6 .carousel-item-next {
      transform: translateX(33.333%);
  }

  .carousel-inner-col6 .carousel-item-start.active,
  .carousel-inner-col6 .carousel-item-prev {
      transform: translateX(-33.333%);
  }
}

/* large - display 3 */
@media (min-width: 992px) {
  /* #TriggerNameCarousel2{ border: solid 1px green; background-color: green;} */
  .carousel-inner-col6 .carousel-item-end.active,
  .carousel-inner-col6 .carousel-item-next {
      transform: translateX(25%);
  }

  .carousel-inner-col6 .carousel-item-start.active,
  .carousel-inner-col6 .carousel-item-prev {
      transform: translateX(-25%);
  }
}

/* extra large - display 4 */
@media (min-width: 1200px) {
  /* #TriggerNameCarousel2{ border: solid 1px red; background-color: red;} */
  .carousel-inner-col6 .carousel-item-end.active,
  .carousel-inner-col6 .carousel-item-next {
      transform: translateX(16.666%);
  }

  .carousel-inner-col6 .carousel-item-start.active,
  .carousel-inner-col6 .carousel-item-prev {
      transform: translateX(-16.666%);
  }
}
/* -------- END carousel 6 columns ---------- */


/* General specs Latest load in CSS file */
.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
  display: flex;
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start { 
transform: translateX(0);
}