.slider-wrapper {
overflow: hidden;
}

.slider-container {
overflow: hidden;
position: relative;
touch-action: pan-y;
}

.slider-wrapper .controls {
display: flex;
justify-content: center;
margin-top: 20px;
}

.slides {
display: flex;
justify-content: flex-start;
}

.slide {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
user-select: none;
}

/*

CODE For Header
<link rel="stylesheet" href="/sh-slider/sh-slider.css">

CODE For Footer
<script src="/sh-slider/sh-slider.js"></script>


CODE Slider
<div class="slider-wrapper slider1">
	<div class="slides">
		<div class="slide">
			1
		</div>
		<div class="slide">
			2
		</div>
		<div class="slide">
			3
		</div>
	</div>
	<div class="controls">
		<div class="prev">
			Back
		</div>
		<div class="next">
	 		Next
		</div>
	   <div class="pagination"></div>
	</div>
</div>