remove white space at bottom of page

I have 2 problems:

1.) I need my front page to be as responsive as the front page of the website https://www.suttonpr.com : my website is visioncy.org – if you compare the 2 you can see that my 3 buttons at the bottom (which are actually ‘custom headings’ with links) they don’t stay at the bottom of the page when you resize the browser. The ones on suttonpr.com stay at the bottom of the page as you resize it. And on bigger sized browsers/screens, there is a big white space at the bottom of the 3 buttons (kuala lumpur, paris and berlin), which is also not the case for suttonpr.com.

The 3 buttons(custom headings) and the image carousel are within the same row, the three buttons(custom headings) are in an inner-row which is inside the same row holding the image carousel.

2.) The front page carousel I believe is responsive as the browser gets bigger, but only until a certain size. On bigger screens it doesn’t fill up as big a space as I would want. I want it to react the same as on suttonpr.com. its just not big enough on bigger desktop size monitors.

I’m using a twenty sixteen child theme

here is my style-sheet: name style.css (see link below)

https://pastebin.com/RbYLRQVJ

Please help this is urgent.