How to remove or modify a div tag using css when the div tag is not associated with any class or id

Hi I have the following html code and this is part of the html

<div class=”template-page-wrapper”>
<div class=”templemo-content-wrapper”>
<div class=”templatemo-content”>
<div class=”templatemo-panels”>
<div id=”dPopupBG” class=”popup_BG”></div>
<div style=”height:100px;”><div>
<div id=”MainContent” class=”msg” style=”display: none;”>
<div class=”error display” style=”display:none”><span></span></div>
<div id=”MainDocContent” class=”flex”>
(and Here page content having more html details)
</div>
</div>
</div>
</div>
</div>

There is a more space between the header line and the MainDocContent. When I focus using inspect on the empty space then the inspect element is highlighted to below tag

<div style=”height:100px;”><div>

I tried the below css to adjust the height in the css file but the height is not getting modified

#dPopupBG+div{height:80px}

I am trying to find the solution and learn in the process.