@media screen and (min-width: 750px) {
  /* Add basic styling for the carousel */
  .carousel-container,
  .carousel-container-roles {
    overflow: hidden;
  }

  .carousel,
  .carousel-roles {
    display: flex;
    transition: transform 0.6s ease;
  }

  .carousel-slide,
  .carousel-slide-roles {
    flex: 0 0 25%;
  }
}

@media screen and (max-width: 750px) {
  /* Add basic styling for the carousel */
  .carousel-container,
  .carousel-container-roles {
    overflow: hidden;
  }

  .carousel,
  .carousel-roles {
    display: flex;
    transition: transform 0.6s ease;
  }

  .carousel-slide,
  .carousel-slide-roles {
    flex: 0 0 25%;
  }
}