How to make the header image responsive?

Hello everyone. I am using X2 version 1.6.9. to create a website.
Under theme options > header > header title > header title logo I have uploaded a large header image. The header title position is set to full-width.

Now my question is, how can I make the header responsive? I know a bit about CSS but hardly anything about PHP, which this theme seems to be made with for the most part.

Something like this in the style sheet doesn’t work.

.header {
    max-width: 100%;
    height: auto;
}

I’m probably approaching this very noobishly (does it have something to do with header.php?) so any help would be greatly appreciated!