Change to different banner image on mobile site

Site URL: https://moor-beer-live-beer.squarespace.com/

Hi, I'm using the Horizon template, I have a banner image (gif) under the navigation that is a landscapeish image that works perfectly.  On mobile, most of it is cut off.  Ideally I'd like to use a different image on the mobile site that's designed as more of a square image.

I have a post on this for 7.1... For Horizon in 7.0, you'd just want to swap out the section:nth-of-type(x) with the #index-section-URL-slug. 

https://christyprice.com/squarespace-tips-tricks/show-different-banner-mobile-desktop