Background customization on mobile

Hi !

For the personalization of my coming soon page, I would like to use a different background image on mobile :
So I customized the CSS with the following code:

body { background-repeat: no-repeat;
background-image:url(‘http://146.88.234.198/~grondin/wp-content/uploads/2019/11/Page_ComingSoonVRespHD.jpg’) }
@media only screen and (min-width: 400px) {
body { background-image: url(‘http://146.88.234.198/~grondin/wp-content/uploads/2020/02/lou.jpg’); }
}

But it doesn’t work because I feel like the background image takes over anyway. Is it possible to act on this (or, failing that, to allow the image to be responsive while keeping its full width)?

Thank you in advance,
Maxence

The page I need help with: [log in to see the link]