height 100vh pushes scroll bar under the screen/page
but
it seems height 82.5vh is perfect size
how can I ensure that height fits the screen/page? or calculate which height will fit the screen in this case 82.5vh?
You need to know the height of the top element, for example if it is 200px you can then set : height: calc(100vh - 200px) to the scrollable container. Just make sure you include any eventual margin in the calc.
200px
height: calc(100vh - 200px)