Logo not resizing for smaller screens

OHAI, can you provide me with a link to your website?

arcoho.com . try resizing the browser window

If you want it to resize responsively on small devices, try putting

@media (max-width: 767px){
#logo img{
width:100%;
height:100%;
}
}

If you don’t want it to increase the header’s height, you might want to set your logo as a CSS background-image to (part of) your header, rather than putting it with img. (Don’t worry, we can still make it resize.)

It’s up to you. ??

If you don’t want it to increase the header’s height, you might want to set your logo as a CSS background-image to (part of) your header, rather than putting it with img.

could you tell how to do that?

I only know html and some css. WordPress combines php and css which is confusing for me.

All you need to know is the output HTML and you can find that output really easily using a tool like Firebug

Here, have something fun. FUN!
https://css-tricks.com/examples/ImageReplacement/

This might be of interest, too:
https://www.css3.info/preview/background-size/

Ok…thanks Emily. How do I reduce the header’s height and at the same time make the navigation move to the centre of it’s height?

thanks Em. ??