How to centre the site-title when browser is resized

Hello, just trying to centre the site-title when the site is viewed on a mobile device or the browser is resized to less than max-width:768px.

I assume this would be done in the @media (max-width:768px) section of the stylesheet, and have tried all sorts of things (too numerous to list them all) like –

@media (max-width:768px) {
    .site-title {text-align:center;}
}

I am using a child theme, and other adjustments that I’ve made have worked, but I can’t seem to target the site-title h1 to centre it. Any help would be appreciated, thanks!