Dropdown CSS Issues

Hi folks,

A client asked me to get his site up to par so that he doesn’t need 1,000 widgets to make it operational. I’ve been working on the following site here on my test server: https://tinyurl.com/cokd8bb

I have managed to get the sidebars widgetized and the menu working, but I am having a problem with the menu dropdowns. Not sure if I missed something in the functions.php file but I don’t think I did. From what I remember you could make dropdowns straight from CSS.

Currently Sample Page 1 should have a dropdown underneath called Submenu 1. There is also a Contact Us page but it doesn’t appear when a dropdown is added from the Appearance > Menus panel. Right now it should appear to the right of Sample Page 1.

I want to make the dropdowns work with CSS but can’t seem to figure it out. Currently we have the following CSS, but no dice on the dropdowns working:

div.menu ul {
    list-style-type: none;
    margin:10px 0 0 0;
}

div.menu ul li {
    display: inline;
    background: url(images/pipe_nav.png) 0 0 no-repeat;
    margin: 0;
    height: 20px;
}

div.menu ul li.first-item {
    background: none;
}

div.menu ul li a {
    padding: 12px 15px 9px 20px;
    font-size: 85%;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
    color: #fff;
}

div.menu ul li#current a {
    background-color: #000;
}

div.menu ul li a:hover {
   text-decoration: underline;
}

div.menu ul li#current a:hover {
   text-decoration: none;
}