 @media (min-width: 768px) {

      /* show 3 items */
    #carouselClients  .carousel-inner .active,
      #carouselClients .carousel-inner .active + .carousel-item,
       #carouselClients .carousel-inner .active + .carousel-item + .carousel-item,
      #carouselClients .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
          display: block;
      }

     #carouselClients  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
      #carouselClients .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
      #carouselClients .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
      #carouselClients .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
          transition: none;
      }

     #carouselClients  .carousel-inner .carousel-item-next,
      #carouselClients .carousel-inner .carousel-item-prev {
          position: relative;
          transform: translate3d(0, 0, 0);
      }

      #carouselClients .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: absolute;
          top: 0;
          right: -25%;
          z-index: -1;
          display: block;
          visibility: visible;
      }

      /* left or forward direction */
     #carouselClients  .active.carousel-item-left + .carousel-item-next.carousel-item-left,
    #carouselClients  .carousel-item-next.carousel-item-left + .carousel-item,
     #carouselClients .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
       #carouselClients .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item,
       #carouselClients .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(-100%, 0, 0);
          visibility: visible;
      }

      /* farthest right hidden item must be abso position for animations */
      #carouselClients .carousel-inner .carousel-item-prev.carousel-item-right {
          position: absolute;
          top: 0;
          left: 0;
          z-index: -1;
          display: block;
          visibility: visible;
      }

      /* right or prev direction */
    #carouselClients  .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
     #carouselClients .carousel-item-prev.carousel-item-right + .carousel-item,
      #carouselClients .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
      #carouselClients .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item,
       #carouselClients .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(100%, 0, 0);
          visibility: visible;
          display: block;
          visibility: visible;
      }

  }


 @media (min-width: 768px) {

      /* show 3 items */
    #carouselExample  .carousel-inner .active,
      #carouselExample .carousel-inner .active + .carousel-item,
       #carouselExample .carousel-inner .active + .carousel-item + .carousel-item,
      #carouselExample .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
          display: block;
      }

     #carouselExample  .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
      #carouselExample .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
      #carouselExample .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
      #carouselExample .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
          transition: none;
      }

     #carouselExample  .carousel-inner .carousel-item-next,
      #carouselExample .carousel-inner .carousel-item-prev {
          position: relative;
          transform: translate3d(0, 0, 0);
      }

      #carouselExample .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: absolute;
          top: 0;
          right: -25%;
          z-index: -1;
          display: block;
          visibility: visible;
      }

      /* left or forward direction */
     #carouselExample  .active.carousel-item-left + .carousel-item-next.carousel-item-left,
    #carouselExample  .carousel-item-next.carousel-item-left + .carousel-item,
     #carouselExample .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
       #carouselExample .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item,
       #carouselExample .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(-100%, 0, 0);
          visibility: visible;
      }

      /* farthest right hidden item must be abso position for animations */
      #carouselExample .carousel-inner .carousel-item-prev.carousel-item-right {
          position: absolute;
          top: 0;
          left: 0;
          z-index: -1;
          display: block;
          visibility: visible;
      }

      /* right or prev direction */
    #carouselExample  .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
     #carouselExample .carousel-item-prev.carousel-item-right + .carousel-item,
      #carouselExample .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
      #carouselExample .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item,
       #carouselExample .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(100%, 0, 0);
          visibility: visible;
          display: block;
          visibility: visible;
      }

  }
