.slider {
  /*background: #efeef2;*/
  height: 75pt;
  margin: 48px auto;
  overflow: hidden;
  position: relative;
  cursor: default;
  user-select: none;
  touch-action: none;
}
.slider:before {
  left: 0;
  top: 0;
}
/*
.slider:after,
.slider:before {
  background: linear-gradient(
      to right,
      #efeef2 0%,
      hsla(0, 0%, 100%, 0) 100%
  );
  content: "";
  height: 75pt;
  position: absolute;
  width: 200px;
  z-index: 2;
}
*/
.slider:after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
/*
.slider:after,
.slider:before {
  background: linear-gradient(
      to right,
      #efeef2 0%,
      hsla(0, 0%, 100%, 0) 100%
  );
  content: "";
  height: 75pt;
  position: absolute;
  width: 200px;
  z-index: 2;
}
*/
.slider .slide-track{
  animation: scroll-r 30s linear infinite;
  display: flex;
  width: 4000px;/* number of total images multiply by 250 multiply by 2 */
}

.slider .slide {
  height: 75pt;
  width: 250px;
  display: flex;
  align-items: center;
  text-align: center;
}
.slider .slide img {
  width: 180px;
  padding: 1pc;
  vertical-align: middle;
  margin: 0 auto;
  display: inline-block;
  max-width: 100%;
  height: auto;
}
@keyframes scroll-r {
  100% {
      transform: translateX(0);
  }
  0% {
      transform: translateX(calc(-250px * 7));
  }
}