.myslider {
  height: 240px;
  position: relative;
  width: 100%;

  display: grid;
  place-items: center;
  overflow: hidden;
  /*background: url(../images/dots.png);*/
  background: linear-gradient(0deg, black, transparent) !important;
}
.myslider::before,
.myslider::after{
  position:absolute;
  /*background-image:linear-gradient(to right,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);*/
  /*background-image: linear-gradient(to right,rgb(140 179 105) 0%,rgba(255,255,255,0) 100%);*/
  content:'';
  height:100%;width:25%;
  z-index:2;pointer-events:none;
}
.myslider::before{
  left:0;
  top:0;
}
.myslider::after{
  right:0;
  top:0;
  transform:rotateZ(180deg);
}

/*  IMPORTANT CODE BELOW */

.slide-track2 {
  width: calc(150px * 15);
  display: flex;
  animation: scroll2 15s linear infinite;
  justify-content: space-between;
}

.slide {
  width: 180px;
  height: 180px;

  display: grid;
  place-items: center;
  transition:0.5s;
  cursor:pointer;
}
.slide:hover{
  transform:scale(0.8)
}
.slide img{
    width:180px;
}

@keyframes scroll {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(calc(-150px * 10));
  }
}

@keyframes scroll2 {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(calc(-150px * 5));
  }
}

@media screen and (max-width: 768px) {
 
  .slide-track2 {
    width: calc(80px * 15);
  }

  .slide {
    width: 180px;
  }
  .slide img{
    width:110px;
  }
  .myslider {
    height: 140px;
  }

  @keyframes scroll {
    0% {
      transform: translateX(0px);
    }
    100% {
      transform: translateX(calc(-80px * 10));
    }
  }

  @keyframes scroll2 {
    0% {
      transform: translateX(0px);
    }
    100% {
      transform: translateX(calc(-80px * 5));
    }
  }
}