title: Hot spot over responsive image
body: <p>I have to set some hotspots over a reponsive image.</p>
  
  <p>The indispensable requirement is that after a certain height the background image
  will be "cropped" on top (using: background-position: 0 bottom).</p>
  
  <p>In this example hotspots are ok until the image width is less than window width.</p>
  
  <p>How can I preserve the correct positioning?</p>
  
  <p><a href="http://codepen.io/anon/pen/Femng" rel="nofollow">CodePen</a></p>