display mobile only image for home page 'Index-page-image'

I am trying to find a bit a code that would allow my Mojave template to display one image in the header banner image space on desktop and a different image for mobile.

@alxfyv (taggin you because Ive tried a few of your suggestions that have worked for others but not myself)

I was able to display a different banner image on mobile with the following code: 

@media only screen and (max-width: 640px) {
       #page-url {
              background-image:url('instertimageurlhere');
         }
    }