Background gif is cutting off on mobile

Site URL: https://www.kriswraight.com/

I implemented a GIF as a background as a landing page before people enter the site. On the desktop it's fine but on mobile the background gif image gets cutoff. Is there specific code that I have to implement to ensure it fits in the screen on mobile.?

Hi. Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
body.homepage article section:first-child {
    min-height: 15vh !important;
    height: 30vh;
}
}