Dropdown menu open under div - html

Question

I need help with this site: http://www.jsdkqwoj.eu/
In mobile drop down menu goes under the div. Tried z-index:9999 for the header / topnav elements and z-index:-9999 to div. Not help. Also tried this Dropdown menu hidden under div and it is not helping.
I googled yesterday few hours and tried many things, and not helping. I also would like to get image top of the page under the header, but i am satisfied of the menu fix.
I linked the page but here is code of the top nav/header and div.
Summary: I want menu open over the div and image shows behind the menu dropdown. I can do dropdown menu like pushing down the div, but that is not what i want.
CSS
header {
background-color: rgba(0,0,0,0.7);
width: 100%;
height: 100px;
}
.topnav {
overflow: hidden;
background-color: rgba(0,0,0,0.7);
position: relative;
}
.topnav #myLinks {
display: none;
}
.topnav a {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 20px;
display: block;
height: 60px;
}
.topnav2 a {
text-align: center;
}
.topnav a.icon {
display: block;
position: absolute;
right: 0;
top: 0;
height: 90px;
width: 90px;
}
.topnav2 a:hover {
background-color: rgba(0,0,0,0.4);
color: #ff6000;
}
TOPNAV
<h2 class="black">OSKARI ALAJÄRVI</h2><p class="light">Portfolio</p>
<div class="topnav2" id="myLinks">
Home
Blog
Contact
</div>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="hamburger_bars" onclick="myFunction2(this)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</i>
</a>
</div>
DIV
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-sm pt-5 pb-5">
<div class="etusivun_teksti" data-aos="fade-up">
<?php if (have_posts()) : while(have_posts()) : the_post();?>
<?php the_content();?>
<?php endwhile; endif;?>
</div>
</div>
<div class="col-sm etusivun_kuva"></div>
</div>
</div>
</div>

Answer 1

.topnav2{
position:relative;
z-index:1;
}
Add this to your css. Hope this works