Hi Josef,

In general logo used in offcanas is taken from Mobile logo. Yes, it can be overriden by Custom CSS.

In your case you can also use Dark header for Mobile view then white logo can fit both.

If you decided to use dark logo for Mobile and Offcanvas menu, maybe consider using this custom CSS

@media (max-width: 680px) {
#sp-header, #sp-header.header-sticky {
  background-color: #555;
  top: 58px !important;}
    .burger-icon > span { background-color: #eee;}
    }

and in Template Options - Basic - Logo - Mobile view - set logo height: 60px

After

Hello Paul,

I misunderstood something, because it's not running yet.

Hello Paul,

I misunderstood something, because it's not running yet.

small correction

background-color: #555 !important;

Update only that part.

and if you want to use it also for tablet instead of 680px value - use 860px - here:

@media (max-width: 860px) {

it's a problem with my untrained English.

I don't want to change the colour but use a different logo.

For the logo in the desktop version I want Logo1.jpg.

In Off-Canvas and mobile I would like to use Logo2.jpg.

Now you have this way (iPad preview) on Mobile & Tablet

Hello Paul,

that's nice, but when I see it in the desktop version, it's a dark logo on a dark background and therefore meaningless.

That's why it's described in more detail again. In the main menu on the white background the logo with the black font (example-logo1.jpg).

When I click on the off-canvas (hamburger) menu, the logo with the white font should be displayed ((example-logo2.jpg).

Ok, in that case: DELETE all above today CSS code from your site and use only a NEW one:

@media (max-width: 860px) {
#sp-header, #sp-header.header-sticky {
  background-color: #fff;}
    #sp-logo .logo-image-phone {
  display: none !important;}
  #sp-logo .logo-image {
  display: block !important;}
    .offcanvas-active .burger-icon > span  {
  background-color: #ccc;}
}

there is not running :-(

I delete all entries and paste your code in custom.css

Test your site using 2nd browser or use Incognito mode.

Hello Paul,

I always test with at least 2 browsers, but usually with all 4 on my system. In this case, I also test with 2 browsers on a computer that has never accessed this website and is not in the same country.

The result is: the code is inserted but the display does not work. Feel free to check for yourself.

thanks for your support

Orginally I set "860px" becuase we talked about mobile view, not all views ;)

You're welcome. Have a nice day.