-/* Note gzip compression means that it is okay to embed twice */
-/* http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique */
-.background-image-svg(@svg, @fallback) {
+/*
+ * SVG support using a transparent gradient to guarantee cross-browser
+ * compatibility (browsers able to understand gradient syntax support also SVG).
+ * http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique
+ *
+ * We use gzip compression, which means that it is okay to embed twice.
+ *
+ * We do not embed the fallback image on the assumption that the gain for old browsers
+ * is not worth the harm done to modern ones.
+ */
+.background-image-svg(@svg, @fallback) when (embeddable(@svg)) {
+ background-image: url(@fallback);
+ /* We don't need the !ie hack because this old IE uses the fallback already */
+ background-image: -webkit-linear-gradient(transparent, transparent), embed(@svg);
+ background-image: linear-gradient(transparent, transparent), embed(@svg);
+}
+
+.background-image-svg(@svg, @fallback) when not (embeddable(@svg)) {