Problems with horizontal scroll section not adjusting to viewport

Hi!

I’m developing a website which has pages with images that scroll horizontally. I used this Youtube tutorial for it: Advanced interactions: Horizontal scroll in Webflow - YouTube. However I’m facing an issue with this working method that I can’t seem to fix. The ‘length’ of the page works perfectly on my 15 inch when my browser is fullscreen, but as soon as I, or the user, has a different size viewport, for example not full screen or bigger than 15 inch, the ‘length’ is no longer correct and I’m left with a big white space at the end. I don’t understand why this is happing or how I can fix it.

I tried finding other solutions to make it responsive and I’ve found following examples:

Yet I can’t seem to figure out how to apply it in my situation. Any help is much appreciated! Note that I’m not an experienced web-designer so excuse the mess and that the website is currently still being developed.

My Read-Only link: https://preview.webflow.com/preview/gold-matters-exhibition?utm_medium=preview_link&utm_source=designer&utm_content=gold-matters-exhibition&preview=24866a1f06d9de26bdf5721b69e7dece&pageId=60bf4ae8dd0980aaee619938&workflow=preview
Published link: https://gold-matters-exhibition.webflow.io/exhibition-of-the-exhibition/co-labouring-in-art