Transparent Navigation Bar on Homepage

I would like just the homepage of our site to have a transparent header, and to make the navigation text white. I would also like to change the color of the logo at the top left to white if possible, all just on the homepage.

The website is https://mlpc.org!

58 minutes ago, Aaron_jag said:

The website is https://mlpc.org!

Hi, try adding this to custom css. You'll have to create a file of your logo where it's white, upload it, then update the code below with the link.

#collection-660ed69adfb20b1a470e3ea0 {
  .header-nav-wrapper a {
    color:#fffff;
  }
  .header-title {
    background-image:url('IMAGE URL HERE');
    background-size: contain;
  } 
  .header-title img{
    opacity:0
  } 
}

1 hour ago, Aaron_jag said:

The website is https://mlpc.org!

Hi, sorry, forgot about the transparent part, here's an updated code:

#collection-660ed69adfb20b1a470e3ea0 {
  .header-background-solid {
    background-color:transparent!important;
  }
  .header-nav-wrapper a {
    color:#fffff;
  }
  .header-title {
    background-image:url('IMAGE URL HERE');
    background-size: contain;
  } 
  .header-title img {
    opacity:0;
  } 
}

The custom code did not work. Any other thoughts?

On 4/9/2024 at 7:23 AM, Aaron_jag said:

The custom code did not work. Any other thoughts?

You can use this CSS code

body.homepage .header-background-solid {
    background-color: transparent !important;
}
body.homepage div.header-nav-item>a {
    color: #fff !important;
}

This code did not work either. Is there anything else I need to do on squarespace to ensure it works?

On 4/16/2024 at 3:21 AM, Aaron_jag said:

This code did not work either. Is there anything else I need to do on squarespace to ensure it works?

Maybe you added code to wrong position. You can move my code to top of CSS box and don't edit anything.

If it still doesn't work, you can send all current code in CSS box, I can check easier