Alpha bug in footer

[Throwaway123131414]

Hi, I was playing around with my website and I was trying to make a semi-transparent footer

This is the code I used for the footer

<footer class="footer galaxy-footer">
  <div class="content has-text-centered">
    <p>
    <script src="js/copyright.js">
    </script>© 2018-2020, <strong>Company.</strong>
    </p>
  </div>
</footer>

And this is my css

.galaxy-footer {
    background-color: rgba(25, 25, 25, .5);
    color: var(--white);	// #ffffff
}

.galaxy-footer strong {
    color: var(--white);
}

The other classes are Bulma's classes and they seems not to be the issues

What I get is an half transparent footer and a grey bar, which is the part that is not displayed when the page loads because the content pushes the footer down

Is this a known issue or did I forget something?