Slide out menu on all viewports? And a little more.

Hey!

1) You can try to show the menu with this css code:

.show_mobile_menu #mobile-advanced {
display: block;
}

#advanced_menu_toggle, #advanced_menu_hide {
display: block !important;
}

#top #wrap_all #avia-menu{ display: none; }

2) I suggest to add a custom class to the textbox which surrounds the title_h1 element (see http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ ) and then use text-align:center; to center align the headline text.

3) You can use a media query to change the font size for smaller screens. Use it like:

@media only screen and (max-width: 767px){
.title_h1{ font-size: 10px; }
}

You can change the font size value and the screen size (767px).

4) Did you try to set the pattern image as section background image?

Regards,
Peter

Hey!

1) Yes, it’s the default mobile menu styling. If you want to customize it I suggest to hire a freelancer who can change the styling of the “desktop” version of the menu based on you requirements.

2) You can apply a custom class to the section: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then use this class to add a pattern image as background. I.e. use the class “avia-custom-background” and into the quick css fields insert:

#top .avia-custom-background{ background-image: url(https://mywebsite.com/pattern.png); }

instead of http://mywebsite.com/pattern.png insert the url to the pattern/png image. You can also add multiple images http://www.css3.info/preview/multiple-backgrounds/ if necessary.

Best regards,
Peter