learning2bgr8 on "[Theme: Hueman] Responive header image not working properly for mibile viewing"

Hello,

I'm having an issue with being able to switch my header logo when viewing mobile. With the previous version of Hueman, my custom CSS code in the child's theme worked fine like this:

-------------------------------------------------

@media only screen and (max-width: 420px) {
.site-title a img {
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: url(http://www.mywebsite.com/mobile-logo.png) no-repeat;
width: 300px; /* Width of new image */
height: 88px; /* Height of new image */
padding-left: 300px; /* Equal to width of new image */
margin: 0 auto; /* Center it */}
}
-------------------------------------------

But now with the new Hueman Theme, when I look at the mobile version of my site, both header logos are seen on top of each other.

Is there an updated CSS code that I can use in other to cancel out one header image but retain the other for mobile viewing?