Why is there a gray background behind my logo on Debut theme?

[SethN1]

Hi, for some reason, I have a gray background behind my logo, which does not seem to happen on the checkout page. I have the following code in theme.css, however, it does not seem to work. At first, it worked only on mobile, however, for some reason it no longer works.

.site-header__logo-image {
    display: initial !important;

The background looks different on mobile and desktop:

Desktop:

Mobile:

How could I fix this? Thank you in advance.

[Nick_Marketing]

Try adding this rule to the bottom of the theme.css file

.site-header__logo-image {
background: #fff !important;
}

[SethN1]

It sadly did not work.

[diego_ezfy]

@SethN1 , do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

.site-header__logo-image,
.site-header__logo-image *{
    background: white !important;
}

Kind regards,
Diego

[Zworthkey]

Hii, @SethN1
Can you provide me your store URL ,
i can see your problem and give you a proper solution.
Thank You.

[LitExtension]

Please follow the steps:

• Step 1: Go to Online store > Themes > Actions > Edit code.
• Step 2: Go to Assets > theme.css and paste this at the bottom of the file:
  .site-header__logo-image img{
  background: #fff !important;
  }

[SethN1]

UVTeeth.com

[Zworthkey]

@SethN1
Remove background of your logo.

[SethN1]

It shows that it has a transparent background:

[SethN1]

Hi,

@diego_ezfy

@LitExtension

For some reason, both of your solutions, only on mobile, moved the gray bar downwards, however, did not remove it:

For desktop, it seems to have stayed the same:

I appreciate the help though, thank you.

[LitExtension]

Please change code:
.site-header__logo-image,
.site-header__logo-image img{
background: #fff !important;
}
it will work fine.