Make a carousel display more than one item in mobile

I've tried multiple codes I've found in the forum to fix this but can't seem to get it right. I want scrolling carousel on our home page to show multiple logos at a time and hide the arrows. Goodmerchsupply.com
Could it be possible that something else in my CSS could be breaking this?

I've tried:

/**
* Auto List Carousel
* Home Page
* Add Multiple Items on
* Mobile & Tablet
**/

section[data-section-id="123"]{
  //Tablet
  @media (max-width: 1024px) {
    .user-items-list-carousel__slides {
      grid-template-columns: ~"repeat(4,1fr)" !important;
    }
  }

  //Mobile
  @media (max-width: 767px) {
    .user-items-list-carousel__slides {
      grid-template-columns: ~"repeat(3,1fr)" !important;
    }
  }

  .mobile-arrows{
    display:none
  }
}

Thanks!!

@Goodmerch can you share a link to your site? The code you've used above includes a section that you'll need to update specific to your site - section[data-section-id="123"] needs to be replaced