I’ve managed to change the main title to a logo on my website. However, there is a small grey border around the logo that I can’t seem to get rid of. I’ve tried editing the .toppagebar settings in the msw.css but I can’t seem to change it. I’ve changed the line <div class="toppagebar hidden-sm hidden-md hidden-lg push"> to <div class="toppagebar"> in the header.tpl.php file. That removes the border but it affects the layout. Is there any other changes I need to be making>
Also, is there a way to change the greeny blue navigation bar on mobile devices? I’ve changed it on the desktop version but again, can’t seem to find the correct settings to change it in mobile devices. I’d like to change it to black or dark grey.
Here is what its showing:-

All colours are in the stylesheets. The best way to find a colour is to:

1) use a colour captcha tool to get the exact hex code
2) search in the css files for the hex code

You can add your own styles based on whatever html is wrapping them. You`ll need to look at the html page source code for that. Add them to ‘msw.css’ at the bottom, or ‘mobile.css’ for mobiles. Anything in ‘msw.css’ overwrites any defaults in the main ‘bootstrap.css’ file (some of the colours may be here), ‘mobile.css’ will overwrite everything else, but just for small devices.

Other useful tools to find the exact code that is creating any styles is:

a) firebug
b) in chrome based browsers, right click and ‘Inspect’
c) in mozilla based browsers, right click and ‘Inspect Element’

Good luck.