I have two images in my footer.php, they are hard coded and shall stay that way:

    <img src="<?php bloginfo('template_directory')?>/img/logo.png" height="30"> is an  
    <a href="https://www.#.com" target="_blank" ><img src="<?php bloginfo('template_directory')?>/img/logob.png" height="30">

on the woocommerce pages, these two logos show really big(original size). It seems that my 30px are being overwritten by:

.woocommerce img, .woocommerce-page img {
    height: auto;
    max-width: 100%;
}

I have tried to change this in my custom.css

.woocommerce img, .woocommerce-page img {
    height: 30px;
    max-width: 100%;
}

But then all the other woocommerce images shrink. Any idea how to fix this?