[Resolved] Header Logo wrong proportions on mobile

Hi,

I’ve added a logo for the mobile view, but when I check the website on Safari or Chrome (iOS), the logo is compressed horizontally and doesn’t have the right proportions. It adjusts itself automatically if I rotate the phone in landscape mode, or randomly if I scroll back to the top of the page. The problem does not appear in the preview of the WP Customizer.

Any tip on how I can fix this?

I added the following CSS code to adjust the height of the logo and make it bigger than the default size, then I though perhaps it’s causing a conflict so I got rid of it:

.navigation-branding img, 
.site-logo.mobile-header-logo img {
    height: 50px;
}

.site-logo.mobile-header-logo img {
    padding: 5px;
}

Is it because the logo proprtions are wrong to start with?

The website is: mirrorlesscomparison.com

Thanks

Mat