Glow Round an Image on Hover

Question

I've got an image that has a transparent background to it. I want to make it glow round the edges of the image instead of round the back. Up to now I've been able to do this on square and circle images, using the following method.

HTML

<div style='background-image:url(http://findicons.com/icon/download/163444/gtalk_cloud/60/png)'></div>

CSS

div { 
    background-position: 50% 50%;
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}  

div:hover {  
  -webkit-box-shadow:0 0 60px orange; 
    -moz-box-shadow: 0 0 60px orange; 
    box-shadow:0 0 60px orange;
}

But this obviously only draws a square or circle glow (for the circle I add a border-raduis) and now I want the glow to be round the edges of the image. I imagine some sort of path would have to be drawn, maybe using canvas?

Here is an example JSFiddle

If anyone is kind enough to help, please do not waste time doing the whole path round the cloud as it is not an image I will be using.