I actually was able to figure this out a little while back. I think what worked for me was changing the max-height of the different CSS elements in the header.
So for example I changed:
.site-header {
min-width: 300px;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
To
.site-header {
min-width: 300px;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
max-height:70px !important;
}
I also added this CSS to the Menus section
.header-cart
{
padding:30px 20px !important;
}
.site-header .search-block
{
padding: 0px !important;
max-height:70px !important;
margin:0px !important;
}
.menu-search
{
padding: 30px 0px !important;
max-height:70px !important;
margin:0px !important;
}
.fa-search
{
padding: 0px !important;
max-height:70px !important;
margin:0px !important;
}
.site-header .search-field
{
padding: 0px !important;
max-height:70px !important;
margin:0px !important;
color: #ffffff !important;
width:100% !important;
}
and in
.main-navigation ul ul
I changed top: 143px; to top: 70px; and removed display:none;
And removed display:none; from .main-navigation ul ul ul
I hope this helps you, or anyone else who might stumble onto this question.