Add image block and prevent the image from cropping ( its a logo)

Hi there

I hope someone can help me out with an issue:) 

I need to add a logo to my page and in various places across the site (not in the header) I have been adding it as an image block but unfortunately on some screen sizes this logo crops is there anyway to stop it cropping and just display at the same size across all screen sizes. I have tried a gallery image instead but cant resize it to be small enough.

I have attached a screenshot of the homepage to illustrate the issue any ideas would be much appreciated:)

I also have the same issue with the. logo in the footer (screenshot added) 

Thanks in advance

Will

https://green-aardvark-exdh.squarespace.com/

Thats amazing thank you solved my problem perfectly:)