My CSS worked fine with first level of the menu. No issues at all. Since I started trying to add drop-down/sub-menus, I have had all sorts of issues.

The best I can manage is having the menu drop down below the main menu like I want it to, but the sub-menu appears inline rather than a vertical list. Also the menu and submenu block appears to be extending higher then I want it to. I have the height set as inherit on everything inside the navigation container, but still I am getting this weird extension of the LI divider. You can see what I mean if you rollover the home menu link in codepen. I have been racking my brain about this for too long and really could use a fresh set of eyes looking at it cause I have tried so many different tweaks to my code now that I am lost. (Note: I got the framework for this drop-down menu from Son of Suckerfish. It's the only framework I could get to work at least this far.)

Image:
http://technobytes.us/testing/screen-01.jpg

Code:
http://codepen.io/anon/pen/zsIqr