Additional CSS on top menu?

HI, I've been able to reconstruct a header/menu from another site almost perfectly using your DU Header plugin and the CSS you provided in my previous thread from the other day. I am now trying to target the search form text and close icon that appear when you click on the search icon, since they are too high up to be visible now, but not having much luck with that, and I also think my selectors for the menu itself and the submenu could be more precise, even though they are working...

This is my CSS so far:

.free-header-menu .fullwidth-menu-nav > ul > li > a {
padding: 10px 0 0 25px !important;
}
.free-search-icon {
font-size: 18px;
}
.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li ul.sub-menu {
width: 160px;
padding-top: 6px !important;
}
.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li ul {
margin: 6px 0 0 -40px !important;
padding: 0 0 0 0 !important;
}
.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li ul.sub-menu a {
text-align: center;
padding: 3px 0 0 0;
margin: 0;
}
.et_pb_fullwidth_menu_0.et_pb_fullwidth_menu .fullwidth-menu-nav li ul.sub-menu a:hover {
color: #3e007f;
}

Is there a simple way to force the search form text down to the same level as the menu itself? Thanks again for your help.

 

Thanks, that worked great for the search area. But I was trying to limit the size of the top nav so that the THE WILLOW SCHOOL logo could be much closer to the top, which is why I had the height of that top menu section set to 16px. I guess that was causing the issue with the search form input. Is there a better way to limit the height of the entire header, maybe have the THE WILLOW SCHOOL logo intrude into the top menu section area, since the top menu will only be those two items, the user menu and the search icon?

Attached is what it looks like now (now.png) using your CSS, which has fixed the search form input, and what I would ideally want it to look like with the logo and overall height (trying.jpg). I wish I could just do a specially section with two columns and pout the logo image in one column that spans two rows (see "wish.png" attached), and then put two menus to the right, BUT Divi has no "regular' menu as opposed to fullscreen so that's not possible ;-( Again, thank you for your help.

 

Wow, that's what I get for not reading the docs ;-) So the text module is already float left, this means I can add two menus each set to float right and that should do the trick! I will see if I can get this to work without having to bother you again ;-) Really appreciate the info and the quick responses.