Content div going over fixed navbar

In order to fix this you need the property z-indexdefined by W3 that specify the level of the element. Try this:

#navbar {
  background-color:#990000;
  position:fixed;  
  z-index:1; /*Add this*/
  width:100%;
  height:50px;
  text-align:center;
  vertical-align:middle;
  line-height:50px;
  top:0px;
}

If you're using Bootstrap 4, the .navbar background is clear and can be covered by some elements. Setting the z-index won't work. Use a background color, e.g., .bg-white.

<nav class="navbar fixed-top navbar-expand-sm navbar-light bg-white">