Logo overlaps menu

Hey TheProductionHouseEvents!

You can add this on your custom.css or Quick CSS:

@media only screen and (min-width: 768px) and (max-width: 989px) {
.main_menu ul:first-child > li > a {
padding: 0 10px !important;
font-size: 12px;
}
}

The menu is not visible on your page so I have to guess. Please try it.

Cheers!
Ismael

Hi!

1) Please add following code to Quick CSS in Enfold theme options under Styling tab

.main_menu ul:first-child > li > a { padding: 0 5px; }

This will decrease the padding between menu items.
Or, you can apply Devin’s first code in here https://kriesi.at/support/topic/top-menu-with-the-social-icons-bigger/#post-134332
That will change the width to switch to mobile menu
2&3) See these errors in console http://i.imgur.com/m3jaanp.jpg I would suggest you to re-install the theme

Cheers!
Yigit

Hey!

I’m not sure why the code I provided doesn’t work but it is the same with Yigit’s. Anyway, you can add this to adjust the menu when the screen is less than 768px in width:

@media only screen and (max-width: 768px) {
.main_menu ul:first-child > li > a {
padding: 0 5px !important;
font-size: 10px;
}
}

Regards,
Ismael

Hey!

Please try adding following code to Quick CSS

@media only screen and (max-width: 767px) {
.responsive .logo { height: 110px; }}

That should do it

Regards,
Yigit