JSFiddle - React, Tailwind, and code Playground

HTML

<div class="background">
    <div class='top-img'></div>
    <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSJGQ7eqRuhZQqbX1roKW8zBGVHW-VlmQq0uTGCZjDGDHCRljPp" />
</div>
<div class='top'>
</div>
<div class='page'>
</div>

CSS

.background {
    position:fixed;
    width:100%;
}
.top-img {
	height:100px;
    background:black;
    position:relative;
    z-index:9;
}
.background img {
    width:100%;
    position:relative;
    z-index:7;
}
.top {
    position:fixed;
    width:60%;
    height:60px;
    top:60px;
    background:yellow;
    z-index:10;
}
.page {
    height:900px;
    background:orange;
    width:80%;
    position:relative;
    z-index:15;
    top:120px;
}