Custom image in background

I am trying to add a custom image to my website header, but am having no results when I attempt to add the below code:

/* Custom CSS code for header background image */
.header {
  background-image: url(https://static1.squarespace.com/static/63f5edffdc92952d50fcfc25/t/64afb9dde1e5fe459bdc6f6e/1689237982133/Header-panel.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

My site address is - https://www.chrismatekole.com/

Can anyone help and advise on why this might not be working? I'm also hoping to apply the code to the footer, therefore if anyone can help with this also, it will be much appreciated!

Thanks 😊

What is password?