Как подключить мое подменю ближе к моему главному меню?

Question

Я работаю над проектом для клиента, и они хотели, чтобы их логотип и меню были на двух разных строках и сосредоточены на странице. Я изменил кодировку css, чтобы это произошло, однако теперь, когда я помещаю курсор в меню «Модели», подменю примерно на 100 пикселей ниже, чем должно быть. Я пробовал все, что мог придумать, чтобы попытаться выяснить, что заставляет его упасть так далеко, и я бросаю полотенце и нажимаю на доски объявлений.

Это SUPERFISH меню, но пришло как пакет для WordPress шаблона, который я купил ....

я описал контейнер заголовка (оранжевый), общая навигация контейнер (красный) и навигационную обертку (зеленый).

http://maulesite.juvamarketing.com/

HTML КОД

<div class="navigation-wrapper"><div class="gdl-current-menu" ></div><div id="main-superfish-wrapper" class="menu-wrapper"><ul id="menu-menu-2" class="sf-menu">  
<li id="menu-item-148" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://mauleairinc.com/maule-air-technical-manuals-and-documents/"><i class="gdl-menu-icon icon-wrench" ></i><span class="gdl-des-prepend"><span class="gdl-label">Support</span></span></a> 
    <ul class="sub-menu"> 
     <li id="menu-item-277" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/flight-manuals/"><span class="gdl-sub-label">Flight Manuals</span></a></li> 
     <li id="menu-item-276" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/maintenance-manuals/"><span class="gdl-sub-label">Maintenance Manuals</span></a></li> 
     <li id="menu-item-278" class="menu-item menu-item-type-custom menu-item-object-custom"><a href="http://mauleairinc.com/pdf/modification_kit_index.pdf"><span class="gdl-sub-label">Mod Kid Index</span></a></li> 
     <li id="menu-item-274" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/service-bulletins/"><span class="gdl-sub-label">Service Bulletins</span></a></li> 
     <li id="menu-item-273" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/service-letters/"><span class="gdl-sub-label">Service Letters</span></a></li> 
     <li id="menu-item-272" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/supplements/"><span class="gdl-sub-label">Supplements</span></a></li> 
     <li id="menu-item-275" class="menu-item menu-item-type-post_type menu-item-object-page"><a href="http://mauleairinc.com/rel-oel/"><span class="gdl-sub-label">REL &#038; OEL</span></a></li> 
    </ul> 
    </li> 
</ul></div><div class="clear"></div> 

style.css ->

/*--- navigation ---*/ 
/* div.gdl-navigation-wrapper{ position: relative; float: right; } */ 
div.gdl-navigation-wrapper{ position: relative; text-align: center !important; height: 45px; 
border: 2px solid red; /* Added for debugging purposes */ 
} 

div.gdl-current-menu { position: absolute; top: 0px; bottom: 0px; } 
div.navigation-wrapper{ display: inline-block; font-family: HelveticaNeue, "Helvetica Neue", Arial, Helvetica, sans-serif; height: 55px; 
    border: 2px solid green; /* Added for debugging purposes */ 
} 

div.responsive-menu-wrapper{ margin: 0px 10px; } 
div.responsive-menu-wrapper select{ width: 100%; height: 25px; } 

superfish.css

#main-superfish-wrapper ul li span.gdl-label{ font-size: 15px; line-height: 1.3; display: block; } 
#main-superfish-wrapper ul li span.gdl-description{ padding-left: 1px; font-size: 12px; display: block; } 
#main-superfish-wrapper .gdl-menu-icon{ float: left; font-size: 14px; line-height: 16px; margin-right: 7px; } 
#main-superfish-wrapper .gdl-des-prepend { float: left; } 

ul.sf-menu, .sf-menu * { margin: 0, auto; padding: 0; list-style: none; } 
ul.sf-menu { line-height: 1; } 
ul.sf-menu li { float: left; position: relative; } 
ul.sf-menu li:hover { visibility: inherit; } /* fixes IE7 'sticky bug' */ 
ul.sf-menu li a { padding: 0px 20px; line-height: 24px; text-decoration:none; display: block; position: relative; } 

/*--- sub menu ---*/ 
ul.sf-menu li:hover ul, 
ul.sf-menu li.sfHover ul { left: 0; z-index: 101; top: 46px; } /* top: 46px */ 
ul.sf-menu li ul{ padding-top: -100px; } 
ul.sf-menu li ul li:first-child{ padding-top: 5px; 
    -webkit-border-radius: 3px 3px 0px 0px; 
    -moz-border-radius: 3px 3px 0px 0px; 
    border-radius: 3px 3px 0px 0px; 
    } 
ul.sf-menu li ul li:last-child{ padding-bottom: 5px; 
    -webkit-border-radius: 0px 0px 3px 3px; 
    -moz-border-radius: 0px 0px 3px 3px; 
    border-radius: 0px 0px 3px 3px; } 
ul.sf-menu ul li a{ padding: 5px 0px; margin: 0px 15px; border-top-width: 1px; border-top-style: solid; } 
ul.sf-menu ul li:first-child > a{ border-top-width: 0px; } 
ul.sf-menu li ul ul{ padding-top: 0; } 


ul.sf-menu ul { text-align: left; } 
ul.sf-menu ul { position: absolute; top: 100%; width: 10em; }/* left offset of submenus need to match (see below) */ 
ul.sf-menu ul li { width: 100%; padding: 0px 0px; } 

ul.sf-menu li:hover li ul, 
ul.sf-menu li.sfHover li ul, 
ul.sf-menu li li:hover li ul, 
ul.sf-menu li li.sfHover li ul{ top: 100% } 

ul.sf-menu li li:hover ul, 
ul.sf-menu li li.sfHover ul, 
ul.sf-menu li li li:hover ul, 
ul.sf-menu li li li.sfHover ul { left: 10em; top: -1px; } /* match ul width */ 

ul.sf-menu li li:last-child{ border: 0px; } 
ul.sf-menu li li a{ height: auto; background: none !important; } 

Answer 1

Это где изменение должно произойти:

<ul class="sub-menu" style="float: none;width: 14.5em; display: none; top: 150px;"> 

Поскольку код является встроенным, я предполагаю, что он создается с помощью Javascript где-то. Можете ли вы разместить JS-код, связанный с выпадающим меню?