How to reposition menu bar below header?

Question

I am editing a Wordpress theme and would like to reposition the menu just below the image of header, however, how to do this in CSS?

The site is not yet hosted on the web. I am modifying the theme before installing everything. The code for the menu bar are these:

/**************************** MENU***************************/

/*menu topo*/
.menu-topo {width: 100%; height: 50px; background: #B0D6C9; -webkit-box-shadow: inset 0 -2px 5px rgba(0,0,0,.05); box-shadow: inset 0 -2px 5px rgba(0,0,0,.05);}

/*navegacao de topo*/
nav.navegacao ul {float: left; margin: 0; padding: 0; list-style: none;}

/*lista de menu*/
nav.navegacao ul li {position: relative; display: inline-block; margin: 0;     padding:0;  color: #fff;}
nav.navegacao ul li a {color: #fff; line-height: 50px; text-decoration: none; padding: 0 14px; text-transform: uppercase; font-weight: bold;}

/*quando o item menu está ativo ou no hover*/
nav.navegacao ul li:hover,
nav.navegacao ul li.current-menu-item, 
nav.navegacao ul li.current_page_parent {background: rgba(255, 255, 255, 0.57);}

nav.navegacao ul li:hover a,
nav.navegacao ul li.current-menu-item a, 
nav.navegacao ul li.current_page_parent a {color: #85C3AE; }

nav.navegacao ul li:hover:after,
nav.navegacao ul li.current-menu-item:after, 
nav.navegacao ul li.current_page_parent:after {color: #fff; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; margin-left: -5px; vertical-align: middle; content: " "; border-right: 5px solid transparent; border-bottom: 5px solid; border-left: 5px solid transparent;}

/*menu responsivo*/
.menu-responsivo {width: 100%; margin: 8px auto 0; 
 display: none; /*determina que será invisivel de inicio*/
}

The theme is called temabase_mLuv1.1 It is not a free theme available in Wordpress, but has been made available to download on this site.

Answer 1

This theme - temabase_mLuv1.1, seems to be a custom theme, that someone created "for himself" and who did not list it as available in Wordpress repositories or platforms for sale of Wordpress Themes, which made his search a little more complicated than normal, but after a few laps, I managed to find that theme.

But both the link of the theme you added as a reference in the comments for download of this theme, as its own code itself, appear to be different from what you mentioned previously in the comments, hence the reason for my research of this theme as I mentioned above.

All right, assuming the theme be this, below this menu code you sent:

<!-- menu-topo --> 
<div class="menu-topo">
    ...
</div>
<!-- fim menu-topo -->

You’ll find a code like this:

<!-- cabeçalho do blog -->
<div class="cabecalho">
    ...
</div>
<!-- fim cabeçalho do blog -->

What you have to do here is change the order of these scripts, namely the move all bit of code from - <div class="cabecalho"> by the end of the closure of this tag - <div>, before, that is to top the code - <div class="menu-topo"> ... </div>

In other words, the code HTML now meets this way:
http://jsfiddle.net/vago08gk/

And you’ll have to change their order so they stay that way:
http://jsfiddle.net/bjb1epdm/

Note: The code within the <div class="cabecalho"> in this example is in full HTML, but in the code of your theme must have a function in PHP, to generate and make available an image as header when you upload the same path Dashboard of your Wordpress. Do not copy this code of this example and Coles there in your theme or that function will cease to function, instead cut and glue even the code of your theme as explained above.