positioning webkit-scrollbar absolute and vertically center
<p>I want to make responsive menu. On mobile I want to allow a scrollable menu, and I need to make it with default scrollbar. I want these scroll arrows make vertically centered on my menu, but I dont know how. There's my <a href="https://jsfiddle.net/eatmailyo/ofjwe6jp/" rel="nofollow noreferrer"><strong>JSFiddle</strong></a> (green and red is arrows, what I replace with images)</p>

<p>There is my webkit-scrollbar CSS</p>

<pre><code>#page .page-nav::-webkit-scrollbar{    
   -webkit-appearance: none;
   background: transparent;
   z-index: 300;
}

#page .page-nav::-webkit-scrollbar-button{}

#page .page-nav::-webkit-scrollbar-button:increment{
   background: red;
}

#page .page-nav::-webkit-scrollbar-button:decrement{
   background: green;
}
</code></pre>