menu behavior

Hi guys :slight_smile:

I’m trying to customize this beautiful template, and so far i managed to customize the menu like this:

visible menu itens:

.main-navigation {
        opacity: 1;
	visibility: visible;

nav-expander hidden:

#nav-expander, #nav-expander:hover {
    visibility: hidden;

Now i have a problem…

How can i have the original appearance (menu itens hidden and nav-expander visible) on mobile version only?

Could you guys give me a hand?

Thanks :slight_smile:

GOod evening

You can use media queries to isolate css codes for different screen sizes:

I’ll take a good look.
Thanks Noda!

You are welcome, let me know if you need anything else :slight_smile: