Styling Mobile Header area, including top bar, on mobile

Hi:

I have a new site for which I have an overlapping logo on desktop, and transparent menu on home page. Using css, I have made logo smaller on mobile, which is fine, but now the hamburger icon is too low and there is SO much white space above it, the top bar area… The top bar is not taking on the top bar color set in advanced settings, so it’s white and some of the text is white.. It just looks really ugly on mobile and I wondered if you could take a look? to sum up

1) Top Bar area on Mobile is too large
2) Font color of phone number text is white – which is great for the transpaent header and great for pages without, but doesn’t appear at all on mobile beccause it’s white on white
3) Background color on mobile can’t be set in enfold theme settings not for the Header area or for the Top Bar area.

I do have a coming soon page up, so you would have to login to backend to see front-end.