title: Transparent areas around rounded corners blocking hovering
body: <p>I have something set up that looks a little like this:</p>
  
  <p><a href="http://jsfiddle.net/NhAuJ/" rel="nofollow">http://jsfiddle.net/NhAuJ/</a></p>
  
  <p>The problem is when you hover near the corners of the circle you cannot hover over the background because the div is a square and blocking it. I want the circle div in the middle to be clickable (I'm going to put some things in it) so i dont want to block the cursor from interacting with it using pointer events. </p>
  
  <p>Any ideas how to fix this kind of issue?</p>