diff --git a/css/main.css b/css/main.css
index 2df55a44..76b3d699 100755
--- a/css/main.css
+++ b/css/main.css
@@ -275,30 +275,11 @@
 .media-info .mono-stereo div {
     position: absolute;
     height: 12px;
-    /* background-image: MONOSTER.BMP via Javascript */
-}
-
-.media-info .mono-stereo #mono {
     width: 29px;
-    background-position: -29px -12px;
-}
-.media-info .mono-stereo #mono.selected {
-    background-position: -29px 0;
-}
-.stop .media-info .mono-stereo #mono.selected {
-    background-position: -29px -12px;
 }
 
 .media-info .mono-stereo #stereo {
     left: 27px;
-    width: 29px;
-    background-position: 0 -12px;
-}
-.media-info .mono-stereo #stereo.selected {
-    background-position: 0 0;
-}
-.stop .media-info .mono-stereo #stereo.selected {
-    background-position: 0 -12px;
 }
 
 #volume {
diff --git a/js/skin-sprites.js b/js/skin-sprites.js
index f3f6c9bf..dffc2a22 100644
--- a/js/skin-sprites.js
+++ b/js/skin-sprites.js
@@ -5,6 +5,15 @@ var SKIN_SPRITES = [
             { selectors: ["#main-window"], x: 0, y: 0, width: 275, height: 116}
         ]
     },
+    {
+        img: "MONOSTER",
+        sprites: [
+            { selectors: [".media-info #stereo", ".stop .media-info #stereo.selected"], x: 0, y: 12, width: 29, height: 12},
+            { selectors: [".media-info #stereo.selected"], x: 0, y: 0, width: 29, height: 12},
+            { selectors: [".media-info #mono", ".stop .media-info #mono.selected"], x: 29, y: 12, width: 29, height: 12},
+            { selectors: [".media-info #mono.selected"], x: 29, y: 0, width: 29, height: 12},
+        ]
+    },
     {
         img: "NUMBERS",
         sprites: [
diff --git a/js/skin.js b/js/skin.js
index 9b7a24b7..1ecd8af1 100644
--- a/js/skin.js
+++ b/js/skin.js
@@ -8,7 +8,6 @@ SkinManager = {
     },
 
     _skinImages: {
-        ".media-info .mono-stereo div": "MONOSTER.BMP",
         "#volume": "VOLUME.BMP",
         "#volume::-webkit-slider-thumb": "VOLUME.BMP",
         "#volume::-moz-range-thumb": "VOLUME.BMP",