Reduce gap between custom menu and sections

Hi all,

I have a custom css coded set of buttons on my site. These hide and show sections. I took the code from a youtube video and it has worked. The problem I have now is a bit too much space between the menu buttons and the sections. I've done everything possible manually, moved the menu downwards and moved the sections up (using out of the box functionality). I'd like to reduce the gap further. Is this possible? Probably easier if you see it! 

https://www.innosee.co.uk/strategicdirection

Many thanks, Tim

If you move these to new section, we can reduce gap easier

Move the buttons into their own section? I've now tried this, doesn't make any difference. 

I then added this to the site CSS to see if it was a page section issue. This did help a bit but not much. I'm wondering if it's the image in the code block that is top aligned? 

/*test*/
#page section .content-wrapper {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

Taking this further it seems to be a code block height problem. I have a fix for this but it's across the whole site instead of just a single code block (which I'd prefer)....

/*REMOVING THE SPACE UNDER CODE BLOCKS IN SQUARESPACE 7.1 WHEN USING FLUID ENGINE*/
html.squarespace-damask .sqs-blockStatus,
.sqs-block .removed-script {
  display: none;
}

I'd prefer to do this for just one code block at a time but this isn't working for me... any thoughts? I have replaced the YOUR-BLOCK-ID-GOES-HERE but I'm not sure what's wrong. 

/*REMOVING THE SPACE UNDER CODE BLOCKS IN SQUARESPACE 7.1 WHEN USING FLUID ENGINE*/
html.squarespace-damask #YOUR-BLOCK-ID-GOES-HERE .sqs-blockStatus,
#YOUR-BLOCK-ID-GOES-HERE.sqs-block .removed-script {
  display: none;
}

You can move to new section, then I will give the code to reduce space

Sorry for the long delay. I’ve done as you asked. Thanks Tim 

Thanks v much!