How do I change text color on the mobile version but not on the Desktop version?

I have a web site that I would like to change the name/title that on the mobile version overlaps the dark image, I want to change that to white (on mobile only)  What is the custom css I need to put in on that page?

https://turtle-salmon.squarespace.com/home-copy

Thanks in advance for your help!

Try adding this to your Custom CSS:

@media only screen and (max-width:767px) {
  section[data-section-id="63d9594f960efc62c50788a8"] {
    .sqs-block-horizontalrule hr, h1, h3 {
      color:#fff !important;
    }
  }
}
    

Let me know if that works!

Ziggy - I have made this officially the home page now so the link is.

JoanJohnsonDrewes.com  

I need it for the mobile version, could you update that information for me and send that to me again.  Thanks

Did the CSS I shared not work?