It’s not giving you a background at all – because it’s throwing an error (a simple validation would show you). The opacity property should be separate from the background (ie place a semi-colon after background value).
Note however, that using opacity will affect not only the background but everything in #navi as well (text, etc). To accomplish your goal use an rgba or hsla value for the background property.
You need to change background: #111111 opacity: 0.5;
to background: rgba(17,17,17,0.5);
I recommend making the background a semi-transparent png image for a fallback for browsers that don’t support RGBa/HSLa.