Different Logo for Mobile

[thejeffklein]

Hi
Im Trying to use a different logo on mobile than desktop for my site http://fiveelementaustin.com/. ive looked at similar topics and none of the code listed is helping me solve the problem
ive added:

@media screen and (max-width: 767px) {
.x-brand.img {
background: url(http://fiveelementaustin.com/wp-content/uploads/2018/08/MOBILELOGO.png);
background-repeat: no-repeat;
display: block !important;
background-size: contain;
min-height: 150px;
}
.x-brand img {
display: none;
}
}

but still shows normal logo

[paul.r]

Hi,

Thanks for writing in!

Upon checking I can see you are using PRO Header. That code will only work with x native header.

For PRO, you can add two image element. Set one to be visible only in dfesktop and the other one to be visible only in mobile.

Thanks

[thejeffklein]

That worked, thank you!

[christian]

You’re welcome. Glad we could help.