Brine: How customize split color background in an index

Hello! I'm working in Brine and I'm having trouble with my split color background.  The code I'm using works, however, I want the color to extend all the way up to the top of the page—including the header. Right now, the header remains all white. I set the logo and nav to the Bottom—which would normally make the header act transparent and allow the background image/video show thru. The custom CSS I used is throwing something off... or not taking something into account.

Custom CSS currently being used:

/*** SPLIT WELCOME BANNER ***/
#welcome {
background: linear-gradient(90deg, #0814b3 40%, #FFFFFF 0% ); } @media only screen and (max-width: 640px) {#welcome {background: #FFFFFF !important }}

Screenshot:

Website is kaciemclean.com / password: kmtemp01

-----

Follow up questions would be how to make the markdown text, "tiny studio..." to revert to black in mobile view; and how to make logo revert to blue in mobile view/white in desktop view.

@Kacie set position absolute or fixed.. for Header

@tuanphan Thank you! Worked like a charm.

I've tried adding fixed header code into mine like suggested but it's not working for me to get the color all the way to the top. Where does that go? 

10 hours ago, Sherri said:

I've tried adding fixed header code into mine like suggested but it's not working for me to get the color all the way to the top. Where does that go? 

Can you share link to your site?