pictorico header mobile appearance

If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then do the following:

1. Install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin
2. use its “CSS Code” section of the dashboard to hold your CSS modifications:
3. (put this code in)

   .site-branding {
       max-width: 70%;
   }
   
   .main-navigation.toggled .nav-menu {
       position: relative;
   }

4. Save

Alternatively use your Child Theme style.css file to hold your CSS modifications

on the top right there is a symbol of a blue box and stripes.

It is controlled in CSS via the ‘content’ property, here is the original CSS:

.menu-toggle:before {
    background-color: #0570a8;
    content: "\f419";
    display: inline-block;
    float: right;
    font-size: 24px;
    padding: 15px;
    vertical-align: middle;
}

So to change the symbol you need to add this Custom CSS:

.menu-toggle:before {
    content: "[new-symbol-code]";
}