Designing within a fixed aspect ratio with an adaptable border

I am in the early stages on designing a site where all the content fits in within a window with a locked aspect ratio, with a background that grows/shrinks to fill the rest of the screen. I have figured out how to create the window that maintains it’s aspect ratio, but when scrolling, the div block that would house all the content stops at the bottom of the page, and i need it to stop at the bottom of the content window. I am thinking I either need to add some sort of scrolling interaction that this div block would be scrolling inside the parent element, or a mathematical custom code to change the height of a div block below the content that adapt to the length between the bottom of the viewing window and the bottom of the screen.

If anyone has idea how to accomplish this I would greatly appreciate it.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)