Oh, I looked for whitespace on the frontpage. The code you need for the sites is:
padding: 0 !important;
This should reduce the whitespace a bit. That there are such gaps is because the content is wrapped in multiple containers which have an padding again and again.
To fix the white overlay on your front page image try this:
Go to appearance -> customizer -> header area -> tick “disable overlay” at the very bottom.
Does this help maybe? Otherwise I don’t really know where the overlay comes from. Because I don’t find any css that cause this overlay.
Found a class called overlay. Take this code:
background-color: transparent !important;
Maybe both works.