Appearance sub-items in top bar menu

I don’t know how to explain my problem as accurate as possible and use the right technical words to make you understand what I mean. But here’s the description of my problem.

I made a menu with sub-items that I want to put in the top bar. Now the sub-items are listed below each other. Here’s a screenshot of what I mean: https://www.screencast.com/t/i8lx4Z9MPu

That looks very ugly and makes my page unnecessary long.

I tested it once again with a menu with only one sub-item and it still happens: https://www.screencast.com/t/TtYpxeeRht

However, what I want is that the sub-items are hidden just like in the primary menu section https://www.screencast.com/t/VQAuHg5Ma0L

I basically want to have exactly the same CSS code as the primary bar for the top bar but I don’t really know how to do that. My knowledge in CSS is quite basic. I do know how to change colors of divs and font-size but this is a challenge for me.

Is there anybody who can help me and tell me what I can put in the CSS editor (or what I can change in the theme CSS) to solve my problem? Or if there are any other solutions, let me know.

The page I need help with: [log in to see the link]