The problem with the transparency of the header and footer. on ios

1

Hello.
The problem with the transparency of the header and footer.
Decided with a header
was (transparency works on android):

<div class="navbar no-border">
      <div class="navbar-bg" style="background: rgba(48,58,68,0)"></div>
      <div class="navbar-inner">
        <div class="left">
          <a href="#" data-panel=".panel-left" class="link icon-only panel-open" style="font-weight: bold">
            <i class="f7-icons" style="color: black; font-size: 35px">list_bullet</i>
          </a>
        </div>
        <div class="title"></div>
      </div>
    </div>

For some reason this code doesn’t work on ios.
Corrected for:

<div class="navbar no-border">
      <div class="navbar-bg" style="opacity: 0.1"></div>
      <div class="navbar-inner">
        <div class="left">
          <a href="#" data-panel=".panel-left" class="link icon-only panel-open" style="font-weight: bold">
            <i class="f7-icons" style="color: black; font-size: 35px">list_bullet</i>
          </a>
        </div>
        <div class="title"></div>
      </div>
    </div>

It works.

But it doesn’t work with footer.
How to make the footer transparent?

This code works on android but doesn’t work on ios:

 <div class="toolbar no-border tabbar tabbar-labels toolbar-bottom d_footer" style="font-family: Jura">
      <div class="toolbar-inner">
        <a href="#tab-1" class="tab-link tab-link-active">
          <i class="f7-icons">house</i>
          <span class="tabbar-label">Home</span>
        </a>
...

css:
.d_footer {
background: rgba(48,58,68,0);
}

Android:

03_andr
03_andr1080×2340 194 KB

ios:

футер 2
футер 2640×1136 265 KB

Please let me know the solution, thanks in advance.