Home page banner cropping on mobile

Site URL: http://soliloquizing.com/

Hello,

I have a home page banner (currently a gif) on my site that crops on mobile. Any way to fix this? 

The site is http://soliloquizing.com/ and I'm attaching some images.

Thanks! 

Add to Design > Custom CSS

/* Mobile-Resize top banner image */
@media screen and (max-width:640px) {
body.homepage img.js-page-banner-image {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
body.homepage .page-banner-wrapper.page-banner-has-image {
    height: 125px !Important;
}
}

6 hours ago, tuanphan said:

Add to Design > Custom CSS

/* Mobile-Resize top banner image */
@media screen and (max-width:640px) {
body.homepage img.js-page-banner-image {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
body.homepage .page-banner-wrapper.page-banner-has-image {
    height: 125px !Important;
}
}

 

Worked -- thank you!