Section is Larger than I need

Site URL: https://www.colinmacknair.com/

I'm trying to make it so that my website is only as big as the browser window that it lives inside of. However, as you can see it utilizes a huge amount of vertical space that is unnecessary. There's no spacers or anything below my content area and if I try to change the Section height to anything but 100%, a null white space shows up at the bottom of my browser.

Any sugggestions? Thanks!

Which space? Can you take a screenshot? We can help easier

Sure! Also here's the CSS I inject on the website.

[data-section-id="5fbae80405f44a5f709446f4"]{
  background-color: #000000;
  @media(min-width:767px){
    .section-background{
      width:50%;
      margin-left:50%;
      max-height:100vh;
    }
    .content-wrapper {
      width:50%;
      //height:100vh;
      margin-right:50% !important;
    }  
  }

As you can see in the screenshot, there's all this extra space at the bottom of my website that I don't want or need. I just want the section height to be 100vh, but it doesn't seem to want to do that.