changed div's for span's, added -webkit- -moz- -o- prefixes

I propose a change from `div`s to `span`s in order to being able to include picture inside paragraphs. Not just a matter of semantics, but some browsers will refuse to insert a `div` inside a `p` and will move the node outside.
 
Also, it took me some minutes to see that I needed to add an additional `-webkit-min-device-pixel-ratio` for each data-media, which is cumbersome since we are already using javascript to fill the gaps. I just added the following into the script:
```
if( media && media.indexOf("min-device-pixel-ratio") > -1 ) {
	var webkitmedia = media.replace("min-device-pixel-ratio", "-webkit-min-device-pixel-ratio");
	var mozmedia = media.replace("min-device-pixel-ratio", "-moz-min-device-pixel-ratio");
	var omedia = media.replace("min-device-pixel-ratio", "-o-min-device-pixel-ratio");
	media = webkitmedia +","+ mozmedia +","+ omedia +","+ media;
}
```