<nav class="navigation" data-action="navigation">
<ul id="ui-id-4" class="ui-menu ui-widget ui-widget-content ui-corner-all" role="menu" tabindex="0" aria-activedescendant="ui-id-5">
    <li class="level0 nav-1 first level-top parent ui-menu-item" role="presentation">
        <a href="http://blabla.com/index.php/catalog/category/view/fermin/id/7/" class="level-top ui-corner-all" aria-haspopup="true" id="ui-id-5" tabindex="-1" role="menuitem">
            <span class="ui-menu-icon ui-icon ui-icon-carat-1-e"></span>
            <span>FEMME</span>
        </a>
        <ul class="level0 submenu ui-menu ui-widget ui-widget-content ui-corner-all" role="menu" aria-expanded="false" style="display: none; top: 52.5469px; left: 178px;" aria-hidden="true">
            <li class="level1 nav-1-1 first last parent ui-menu-item" role="presentation">
                <a href="http://blabla.com/index.php/fermin/temps.html" aria-haspopup="true" id="ui-id-10" class="ui-corner-all" tabindex="-1" role="menuitem">
                    <span>TEMPS 2017</span>
                </a>
            </li>
        </ul>
    </li>
</ul>
</nav>

.navigation {
    z-index: 3;
}
.navigation .level0 > .level-top {
    box-sizing: content-box;
    position: relative;
    z-index: 5;
}
.level0.level-top > .level0.submenu {
    position: absolute;
    left: 0px !important;
}
.navigation .level0 .submenu {
    background: #fff;
    border: 1px solid #09468C;
    display: none;
    z-index: 1
}
.navigation .level0 > .level-top:hover,
.navigation .level0 > .level-top.ui-state-focus {
   border: 1px solid #2f67a3;
   border-bottom: 3px solid #fff;
}
.navigation .level0.parent:hover > .submenu {
    display: flex
}