[Resolved] Menu

I think the logo will be easier to manage if cropped but I’ll leave that up to you.

The logo is too large for mobile so perhaps wrap the rule like this:

@media (min-width: 1024px) {
	.site-header .site-branding img {
		max-height: 172px;
	}
}

So remove the rule you have now and use this instead. Your logo will then drop to max-height: 91px under 1024px.

Then in Custom CSS, the media query I inserted there, it’s up to 768px, change that to min-width: 1024px instead.

Hi, give it a try now.

For notes:

/* Top bar */
.resp #top-bar .top-bar-text {
	text-align: center;
	width: 100%;
}
	
@media (min-width: 1024px) {
	/* Logo max height */
	.site-header .site-branding img {
		max-height: 172px;
	}
	/* Logo row height */
	.site-header .site-branding-container {
		height: 175px;
	}
	/* Menu row height */
	.site-header .container, .main-navigation .menu-search {
		height: 40px;
	}
	#main-slider.overlap {
		margin-top: -40px; /* Negative value of whatever you've set above */
	}
	.main-navigation div>ul>li>a, .main-navigation .menu-search .search-icon:before {
		height: 40px;
		line-height: 40px;
	}
	.main-navigation ul ul {
		top: 37px; /* Minus three of whatever you've set above */
	}
}