Hello Emil, Esmi,
Thanks for your replies. I have tried various different ways to get the menu to work in the way I expected, but I couldn't solve the issue so I have rolled back to my previous code. In 'Responsive Theme Options > Custom CSS Styles' I have the following code:
.menu {margin-top: 90px; background: url(http://www.jollyjosephs.co.uk/bluebutt.jpg) repeat-x top left;}
.menu a {height: 28px; border: none; line-height: 28px;}
.menu .current_page_item a {background: url(http://www.jollyjosephs.co.uk/ojbutt.jpg) repeat-x top left;}
Ideally, I would like the menu to span the full width of the page (like the header image above it which I have set as a custom body section background) but I don't know how to do this. I don't fully understand how I have a menu at all when there aren't any set up in Appearance > Menus but as I am unlikely to need a page that doesn't automatically appear in the menu bar I am happy with that.