* {
  box-sizing: border-box;
}
.slider {
  position: relative;
/*  width: 200px;*/
/*  height: 200px;*/
  width: 90%;
  margin: 5% 5%;
/*  padding-bottom: 50%;*/
/*  margin: 5% auto;*/
  user-select: none;
  touch-action: pan-y;
}

.slider img {
  poiner-events: none;
}

.slider-list {
/*  width: 200px;*/
/*  height: 200px;*/
/*  width: 90%;*/
/*  margin: 5% 5%;*/
/*  padding-bottom: 50%;*/
  overflow: hidden;
}

.slider-list.grab {
  cursor: grab;
}

.slider-list.grabbing{
  cursor: grabbing;
}

.slider-track {
  display: flex;
}

.slide {
/*  width: 200px;*/
/*  height: 200px;*/
  width: 100%;
/*  margin: 5% 5%;*/
  padding-bottom: 75%;
  flex-shrink: 0;
  font-size: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #000;
}

.slider-arrows {
  margin-top: 15px;
  text-align: center;
}

.next,
.prev {
  color: white;
  background: none;
  border: none;
  margin: 0 10px;
  font-size: 30px;
  cursor: pointer;
}

.next.disabled,
.prev.disabled {
  opacity: .25;
  pointer-events: none;
}