How to get this div above the another div?

I can't get this div above another div that I have in bootstrap. Basically I have two divs within another div. One of the div's has an image in it and the other has text.

Ive tried many things like changing the margin using css but it doesnt work for some reason.

<div id="header" class="position-relative overflow-hidden p-3 p-md-5 m-md-3 text-center bg-dark">
        <div>
            <img id="andro" class="img-fluid">
        </div>
        <div id="mainP" class="bg-dark mx-auto mx-auto center-block">
          Text in here
        </div>
    </div>

so I want the div "mainP" to be above the div "andro" but i dont know why it wont when i try to change the margin and the z-index using CSS.