Text/image wrapping on mobile

Hello, trying to use custom CSS to solve the problem of text beside images looking bad on mobile. I found this snippet in a couple of different places, but it doesn’t seem to be working with the Lovecraft theme:

@media only screen and (max-width: 767px) {
    figure.alignleft, img.alignleft, figure.alignright, img.alignright {
        float:none;
    }
}

Is there a way to make this work, or if not, is there another workaround that will accomplish the same goal?

Thanks!

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