update mobile example to use Zoom control. update build config file

examples/style.mobile.css

@@ -1,31 +1,33 @@
-div.olControlZoomPanel {
-    height: 108px;
-    width: 36px;
+div.olControlZoom {
     position: absolute;
-    top: 20px;
-    left: 20px;
+    top: 8px;
+    left: 8px;
 }
-div.olControlZoomPanel div {
-    width: 36px;
-    height: 36px;
-    background-image: url(img/mobile-zoombar.png);
-    left: 0;
+div.olControlZoom a {
+    display: block;
+    margin: 1px;
+    padding: 0;
+    color: white;
+    font-size: 26px;
+    font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;    
+    font-weight: bold;
+    text-decoration: none;
+    text-align: center;
+    height: 32px;
+    width:32px;
+    line-height: 24px;
+    background: #666666; /* fallback for IE - IE6 requires background shorthand*/
+    background: rgba(0, 0, 0, 0.3);
+    filter: alpha(opacity=60);
 }
-div.olControlZoomPanel .olControlZoomInItemInactive {
-    top: 0;
-    background-position: 0 0;
+div.olControlZoom a:hover {
+    background: #444444; /* fallback for IE */
+    background: rgba(0, 0, 0, 0.5);
+    filter: alpha(opacity=80);
 }
-div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
-    top: 36px;
-    background-position: 0 -36px;
+a.olControlZoomIn {
+    border-radius: 4px 4px 0 0;
 }
-div.olControlZoomPanel .olControlZoomOutItemInactive {
-    top: 72px;
-    background-position: 0 -72px;
-}
-.olTileImage {
-    -webkit-transition: opacity 0.2s linear;
-    -moz-transition: opacity 0.2s linear;
-    -o-transition: opacity 0.2s linear;
-    transition: opacity 0.2s linear;
+a.olControlZoomOut {
+    border-radius: 0 0 4px 4px;
 }