Because all of your main-sections are placed on the same place (like a layering effect), making the text very difficult to read. Therefore you should not use “position: absolute;” here in my mind. But if you simply remove it, this will make your text end up under the navbar, so you need to adjust how these (the main sections and the navbar) interact.
And add: #main-doc {margin-left: 300px;} I think it should work better for you.
You can check this page, for an interactive examples with something similar to what you might be looking for: Tryit Editor v3.7 (w3schools.com). Let me know if that makes it work for you.