The page content overlap on the header bar in tabs component page

Hi ,

I’m trying to solve the problem when using the same background image in header bar and content with the tabs component. I’m trying to achieve the same result (without tabs component) like below;

This is not working when changing the header bar to transparent in the tabs component page. The content will overlap on the header title like below;

This is my code for not working page. (with tabs component)

Tab code
12

The first tab page code
image

CSS for background image
13

Thanks,
CC

See: https://github.com/Robinyo/big-top

This is great. I manage to solve it. Thank you.