H1 in caps on mobile

Hello,

I tried removing the caps on H1 using the advanced styling page, but it didn’t work, so I added the following in the style sheet of my child theme:

h1 { 
  text-transform: none !important;
font-weight:normal !important;  
letter-spacing: 1px !important;
}

This has worked on my desktop, but not on mobile. I tried adding something like the following to apply it to mobile:

@media only screen and (max-width:767px){
h1 { 
  text-transform: none !important;
font-weight:normal !important;  
letter-spacing: 1px !important;
}
}

But it didn’t work either.

Do you know how I can apply this change on mobile as well?

Thanks!