Responsive Scrolling Div (Best Practices?)

I’m trying to figure out what the best practice is for setting up a site with a custom scrollbar. I have managed to set up a scroll bar, and have set up a div animation that scrolls only the page content up and down. However, I can’t seem to make the scroll length (or scroll end point) responsive. Depending on the size of the browser, I end up with different amounts of div space left over at the bottom of the page (or sometimes not even reaching the end of the div.) Should I be working with %, VH, etc in my scroll animation… or does it matter more how the parent divs are set up?


Here is my site Read-Only: https://preview.webflow.com/preview/a1-mobile-kc?preview=ea1034cda9a00847d49c43444ab219e7