Transparency problem using position fixed in css

I'm trying to create a menu that does not move independent of the user's scrolling on the page using position fixed .

But I'm having a problem with transparency, whenever the menu finds other content, it's transparent.

Before I used a menu with position absolute , and the menu did not appear to have transparency. I researched google tried some things but I could not solve it, I got to opacity: 100% but also did not solve.

Follow the css code from my menu, and images showing what happens. Does anyone know how to solve this problem?

div#menu
{
    width: 100%;
    background-color: rgba(60,60,65,1);
    box-shadow: 0px 0px 10px rgba(0,0,0,.5);
    position: fixed;
    top: 0px;
    left: 0px;
}
div#menu ul
{
    text-align: left;
}
div#menu li
{
    display: inline-block;
    padding: 0px 0px 0px 0px;
    margin: 0px 25px 0px 25px;
}
div#menu a
{
    font-family: Arial, sans-serif;
    font-size: 16pt;
    text-decoration: none;
    color: white;
}
div#menu a:hover
{
    color: rgba(50,50,255,1);
    text-decoration: underline;
}