O, the actual problem is within image itself and how it is implemented. To make it "responsive" on all screens it is set to "cover" in background-size. It makes image to fit into given box, but when something doesn't fit, it is cropped out. This way if image is portrait cropped - it will be cute on right and left when viewed on vertical device, but it will look fine on horizontal device.
This way of image implementation works great to the point when all image content is important (in your case), it is also the only way to have responsive images that fills given box size. Also logo should not be a part of the image - it should be placed separately as template logo so it always displays.
In your case I would suggest to create custom css overrides and use media queries for different screen sizes and orientations which loads different image.