diff --git a/assets/imgs/b31.png b/assets/imgs/b31.png
new file mode 100644
index 0000000..7b2889e
Binary files /dev/null and b/assets/imgs/b31.png differ
diff --git a/assets/imgs/b32.png b/assets/imgs/b32.png
new file mode 100644
index 0000000..70ae315
Binary files /dev/null and b/assets/imgs/b32.png differ
diff --git a/assets/imgs/b33.png b/assets/imgs/b33.png
new file mode 100644
index 0000000..5ba093e
Binary files /dev/null and b/assets/imgs/b33.png differ
diff --git a/assets/imgs/bg01.jpg b/assets/imgs/bg01.jpg
new file mode 100644
index 0000000..7c8ffa0
Binary files /dev/null and b/assets/imgs/bg01.jpg differ
diff --git a/assets/js/Board.js b/assets/js/Board.js
index 5ddbb45..09f7853 100644
--- a/assets/js/Board.js
+++ b/assets/js/Board.js
@@ -8,7 +8,9 @@ class Board {
         this.y = ctx.canvas.height / 2 - 48;
 
         this.w = this.ctx.canvas.width;
-        this.h = this.ctx.canvas.height
+        this.h = this.ctx.canvas.height;
+
+        this.img = resources.get('bg01');
     }
 
     run() {
@@ -45,7 +47,8 @@ class Board {
     loop() {
         if (this.stop) return;
 
-        this.ctx.clearRect(0, 0, this.w, this.h);
+        // this.ctx.clearRect(0, 0, this.w, this.h);
+        this.ctx.drawImage(this.img, 0, 0);
         this.update();
         this.requestID = requestAnimationFrame( ()=>this.loop() );
     }
diff --git a/assets/js/Bricks.js b/assets/js/Bricks.js
index 8c380ff..4936c5b 100644
--- a/assets/js/Bricks.js
+++ b/assets/js/Bricks.js
@@ -7,15 +7,16 @@ class Brick {
         this.vspace = 2;
         this.hspace = 2;
 
-        this.w = (360 / 8) - this.hspace;
-        this.h = (20) - this.vspace;
-        this.x = (this.w + this.hspace) * column;
+        this.w = (32) - this.hspace;
+        this.h = (32) - this.vspace;
+        this.x = 2 + (this.w + this.hspace) * column;
         this.y = 80 + (this.h + this.vspace) * row;
 
+        this.img = [];
         switch (type) {
-            case 2: this.lives = 2; break;
-            case 3: this.lives = 3; break;
-            default: this.lives = 1; break;
+            case 2: this.lives = 2; this.img = [ resources.get('b31'),resources.get('b32') ]; break;
+            case 3: this.lives = 3; this.img = [ resources.get('b31'),resources.get('b32'), resources.get('b33') ]; break;
+            default: this.lives = 1; this.img = [ resources.get('b31') ]; break;
         }
     }
 
@@ -28,16 +29,13 @@ class Brick {
 
         switch (this.lives) {
             case 1:
-                ctx.fillStyle = 'blue';
-                ctx.fillRect(this.x + 1, this.y, this.w, this.h);
+                ctx.drawImage(this.img[0], this.x + 1, this.y);
                 break;
             case 2:
-                ctx.fillStyle = 'orange';
-                ctx.fillRect(this.x + 1, this.y, this.w, this.h);
+                ctx.drawImage(this.img[1], this.x + 1, this.y);
                 break;
             case 3:
-                ctx.fillStyle = 'red';
-                ctx.fillRect(this.x + 1, this.y, this.w, this.h);
+                ctx.drawImage(this.img[2], this.x + 1, this.y);
                 break;
         }
         return true;
diff --git a/assets/js/Keyboard.js b/assets/js/Keyboard.js
index a813bc8..799bb49 100644
--- a/assets/js/Keyboard.js
+++ b/assets/js/Keyboard.js
@@ -5,6 +5,11 @@ class Keyboard {
 
         window.addEventListener('keydown', e => this.onKeydown(e));
         window.addEventListener('keyup', e => this.onKeyup(e));
+
+        window.addEventListener('touchstart', e => this.onTouchStart(e));
+        window.addEventListener('touchmove', e => this.onTouchMove(e));
+        window.addEventListener('touchend', e => this.onTouchEnd(e));
+
     }
 
     setKeydown(fn) {
@@ -21,4 +26,47 @@ class Keyboard {
     onKeyup(event) {
         delete this._pressed[event.code];
     }
+
+
+    onTouchStart(e) {
+        var touchobj = e.changedTouches[0] // reference first touch point (ie: first finger)
+        this.touchX = parseInt(touchobj.clientX) // get x position of touch point relative to left edge of browser
+        this.touchY = parseInt(touchobj.clientY) // get x position of touch point relative to left edge of browser
+        window.dispatchEvent(new KeyboardEvent('keydown',{'code':'Space'}));
+        window.dispatchEvent(new KeyboardEvent('keydown',{'code':'KeyN'}));
+        e.preventDefault()
+    }
+    onTouchMove(e) {
+        var touchobj = e.changedTouches[0] // reference first touch point for this event
+        var dist = parseInt(touchobj.clientX) - this.touchX
+        if (dist>0) {
+            delete this._pressed['ArrowLeft'];
+            this._pressed['ArrowRight'] = true;
+        } else if (dist<0) {
+            delete this._pressed['ArrowRight'];
+            this._pressed['ArrowLeft'] = true;
+        } else {
+            delete this._pressed['ArrowLeft'];
+            delete this._pressed['ArrowRight'];
+        }
+
+        dist = parseInt(touchobj.clientY) - this.touchY
+        if (dist>0) {
+            delete this._pressed['ArrowUp'];
+            this._pressed['ArrowDown'] = true;
+        } else if (dist<0) {
+            delete this._pressed['ArrowDown'];
+            this._pressed['ArrowUp'] = true;
+        } else {
+            delete this._pressed['ArrowUp'];
+            delete this._pressed['ArrowDown'];
+        }
+
+        e.preventDefault()
+    }
+    onTouchEnd(e) {
+        this._pressed = {}; 
+    }
+
+   
 }
\ No newline at end of file
diff --git a/assets/js/Levels.js b/assets/js/Levels.js
index 14dba20..6c41ca1 100644
--- a/assets/js/Levels.js
+++ b/assets/js/Levels.js
@@ -4,28 +4,28 @@ class Levels {
         switch (+lvl) {
             case 1:
                 map = [].concat(
-                                this.row(0, [1, 0, 1, 0, 0, 1, 0, 1]),
-                                this.row(1, [1, 1, 1, 1, 1, 1, 1, 1]),
-                                this.row(3, [0, 1, 1, 1, 1, 1, 1, 0]),
-                                this.row(4, [1, 1, 1, 1, 1, 1, 1, 1])
+                                this.row(0, [0, 0, 1, 0, 1, 0, 0, 1, 0, 1]),
+                                this.row(1, [0, 0, 1, 1, 1, 1, 1, 1, 1, 1]),
+                                this.row(3, [0, 0, 0, 1, 1, 1, 1, 1, 1, 0]),
+                                this.row(4, [0, 0, 1, 1, 1, 1, 1, 1, 1, 1])
                                 );
                 break;
             case 2:
                 map = [].concat(
-                                this.row(0, [3, 3, 3, 0, 3, 3, 0, 0]),
-                                this.row(1, [0, 0, 3, 0, 3, 0, 3, 0]),
-                                this.row(2, [0, 0, 3, 0, 3, 0, 3, 0]),
-                                this.row(3, [3, 0, 3, 0, 3, 0, 3, 0]),
-                                this.row(4, [0, 3, 3, 0, 3, 3, 0, 0])
+                                this.row(0, [0, 0, 3, 3, 3, 0, 3, 3, 0, 0]),
+                                this.row(1, [0, 0, 0, 0, 3, 0, 3, 0, 3, 0]),
+                                this.row(2, [0, 0, 0, 0, 3, 0, 3, 0, 3, 0]),
+                                this.row(3, [0, 0, 3, 0, 3, 0, 3, 0, 3, 0]),
+                                this.row(4, [0, 0, 0, 3, 3, 0, 3, 3, 0, 0])
                                 );
                 break;
             default:
                 map = [].concat(
-                                this.row(0, [1, 3, 1, 3, 1, 3, 1, 3]),
-                                this.row(1, [3, 1, 3, 1, 3, 1, 3, 1]),
-                                this.row(2, [1, 3, 1, 3, 1, 3, 1, 3]),
-                                this.row(3, [3, 1, 3, 1, 3, 1, 3, 1]),
-                                this.row(4, [1, 3, 1, 3, 1, 3, 1, 3])
+                                this.row(0, [2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2]),
+                                this.row(1, [2, 3, 1, 3, 1, 3, 1, 3, 1, 3, 2]),
+                                this.row(2, [2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2]),
+                                this.row(3, [2, 3, 1, 3, 1, 3, 1, 3, 1, 3, 2]),
+                                this.row(4, [2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2])
                                 );
                 break;
         }
diff --git a/assets/js/Resources.js b/assets/js/Resources.js
index 1e45302..63b6124 100644
--- a/assets/js/Resources.js
+++ b/assets/js/Resources.js
@@ -4,12 +4,16 @@ class Resources {
         this.loading = 0;
         this.resources = {};
 
+        this.load('bg01', 'jpg');
         this.load('ball');
         this.load('bar');
+        this.load('b31');
+        this.load('b32');
+        this.load('b33');
     }
 
 
-    load(res) {
+    load(res, ext='png') {
         let _this = this;
         this.total++;
         this.loading++;
@@ -17,7 +21,7 @@ class Resources {
         this.resources[res].onload = function () {
             _this.loading--;
         }
-        this.resources[res].src = 'assets/imgs/' + res + '.png';
+        this.resources[res].src = 'assets/imgs/' + res + '.'+ext;
     }
 
     get(res) {