Home page logo not appearing on mobile

Site URL: https://petalumaartscenter.squarespace.com/

Site password: pac

I replaced the home page logo with an alternate image and now I the logo on the home page does not show up at all. 

Anyone know what's going on?

This is the code I put in the home page header to replace the logo:

<style>
 
  .header-title-logo img {
    visibility: hidden;
}
.header-display-desktop .header-title-logo a::before {
    content: "";
    background-image: url(https://static1.squarespace.com/static/66c6495e2b6d0959e53eb16c/t/66f31748ff46a409e9648581/1727207240670/PAC_logo_white.png);
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: absolute;
    top: 0;
    left: 0;
}

.header-display-desktop .header-title-logo {
    position: relative;
}
 
  }
</style>

7 hours ago, 2birds said:

Site URL: https://petalumaartscenter.squarespace.com/

Site password: pac

I replaced the home page logo with an alternate image and now I the logo on the home page does not show up at all. 

Anyone know what's going on?

This is the code I put in the home page header to replace the logo:

<style>
 
  .header-title-logo img {
    visibility: hidden;
}
.header-display-desktop .header-title-logo a::before {
    content: "";
    background-image: url(https://static1.squarespace.com/static/66c6495e2b6d0959e53eb16c/t/66f31748ff46a409e9648581/1727207240670/PAC_logo_white.png);
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: absolute;
    top: 0;
    left: 0;
}

.header-display-desktop .header-title-logo {
    position: relative;
}
 
  }
</style>

 

 

Replace your code with the code bellow.

<style>
  .header-title-logo img {
    visibility: hidden;
  }
  .header-title-logo a::before {
    content: "";
    background-image: url(https://static1.squarespace.com/static/66c6495e2b6d0959e53eb16c/t/66f31748ff46a409e9648581/1727207240670/PAC_logo_white.png);
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: absolute;
    top: 0;
    left: 0;
  }
  .header-display-desktop .header-title-logo {
    position: relative;
  }
</style>

@Web_Solutions

Thank you for the response! Worked great!