How to center logo & header widget in mobile

You could add – “background-position: center top !important;” to your #header in the 2 responsive sections of your css file. (bottom).

Also, you will need to make the logo area clickable so you can add the following –

#title-area {
float: none;
padding: 20px 0;
text-align: center;
width: 100%;
}

You may need to add !important at the end of some of the css rules.

If you don’t want to deal with the code you could try a plugin by Nick Croft that handles this automatically – http://designsbynickthegeek.com/plugins/genesis-responsive-header