CSS for transparent title box

Hi, there
I’m a newbie to CSS, and I’m trying to get the black background box hosting the title and slogan of my page to appear transparent. I have added the following code under Additional CSS:

.site-branding {
opacity: 0.8;
}

and pressed ‘Publish’, but it does not do anything. I have cleared the cache and switched browsers, checked on the phone version, but the background is still solid.

Any tips or advice would be much appreciated!

Best regards,
wd