JSFiddle - React, Tailwind, and code Playground

HTML

<a href="http://www.emailonacid.com">
  <span id="switcher">
    <img id="houdini" src="http://s31.postimg.org/gr7660ucb/creepy_big.jpg" alt="">
  </span>
</a>

CSS

@media only screen and (max-device-width: 489px) {
    span[id=switcher] {
      display:block;
      background-image: url('http://s31.postimg.org/s0dfb69wb/creepy_small.jpg') !important;
      background-repeat: no-repeat !important;
      background-position: center !important;
      width: 300px !important;
      height: 250px !important;
    }
    img[id=houdini] {display: none !important;}1
  }