diff --git a/games/card-suarez.json b/games/card-suarez.json
index 2cf8b4d..a0033ca 100644
--- a/games/card-suarez.json
+++ b/games/card-suarez.json
@@ -48,8 +48,8 @@
                         "video": {
                             "type": "YoutubeVideo",
                             "videoid": "3zKoUda-WVA",                            
-                            "autoplay": "1",
-                            "allowfullscreen": "true",
+                            "autoplay": true,
+                            "allowfullscreen": true,
                             "maxWidth": "90%",
                             "minWidth": "50%",
                             "maxHeight": "90%",
diff --git a/games/prueba.json b/games/prueba.json
index 370b130..e0b958e 100644
--- a/games/prueba.json
+++ b/games/prueba.json
@@ -79,7 +79,8 @@
             },
             "/btn1": {
                 "body_1": {
-                    "alpha": 0,
+                    "autoplay": true,
+                    "alpha": 1,
                     "position": {
                         "my": "middle center",
                         "at": "middle center",
@@ -158,9 +159,23 @@
                 }
             },
             "body_1": {
-                "class": "big-block",
-                "fillStyle": "#700"
-            },
+                "type": "YoutubeVideo",
+                "videoid": "3zKoUda-WVA",                            
+                "autoplay": false,
+                "allowfullscreen": true,
+                "maxWidth": "90%",
+                "minWidth": "50%",
+                "maxHeight": "90%",
+                "minHeight": "50%",
+                "width": "800",
+                "height": "600",
+                "aspectRatio": "1.778",
+                "alpha": 0,
+                "tween": {
+                    "time": 250,
+                    "ease": "Quad.easeOut"
+                }
+           },
             "body_2": {
                 "class": "big-block",
                 "fillStyle": "#770"
diff --git a/games/treens.json b/games/treens.json
index 32d5361..28861db 100644
--- a/games/treens.json
+++ b/games/treens.json
@@ -1,22 +1,185 @@
 {
-    "preload": {
-        "background":"images/Luis-Suarez-uruguay-best-striker.jpg"
+    "class": {
+        "big-block": {
+            "type": "BitmapData",
+            "width": "50%",
+            "height": "50%",
+            "alpha": 0,
+            "tween": {
+                "time": 250,
+                "ease": "Quad.easeOut"
+            }
+        },
+        "block": {
+            "type": "BitmapData",
+            "width": "50",
+            "height": "20"
+        }
     },
-    "scenes": {
-        "card": {
-            "autostart": true,
-            "children": {                
-                "background": {
-                    "type": "Sprite",                            
-                    "width": "50%",
-                    "height": "50%",
-                    "texture": "background",                    
+    "scene": {
+        "autostart": true,
+        "sections": {
+            "/": {
+                "btn_1": {
                     "position": {
                         "my": "top left",
                         "at": "top left",
                         "of": "parent"
                     }
+                },
+                "btn_2": {
+                    "position": {
+                        "my": "top left",
+                        "at": "top right",
+                        "of": "parent.btn_1"
+                    }
+                },
+                "btn_3": {
+                    "position": {
+                        "my": "top left",
+                        "at": "top right",
+                        "of": "parent.btn_2"
+                    }
+                },
+                "btn_4": {
+                    "position": {
+                        "my": "top left",
+                        "at": "top right",
+                        "of": "parent.btn_3"
+                    }
+                },
+                "body_1": {
+                    "position": {
+                        "my": "middle left",
+                        "at": "middle right",
+                        "of": "parent"
+                    }
+                },
+                "body_2": {
+                    "position": {
+                        "my": "middle left",
+                        "at": "middle right",
+                        "of": "parent"
+                    }
+                },
+                "body_3": {
+                    "position": {
+                        "my": "middle left",
+                        "at": "middle right",
+                        "of": "parent"
+                    }
+                },
+                "body_4": {
+                    "position": {
+                        "my": "middle left",
+                        "at": "middle right",
+                        "of": "parent"
+                    }
+                }
+            },
+            "/btn1": {
+                "body_1": {                    
+                    "position": {
+                        "my": "middle center",
+                        "at": "middle center",
+                        "of": "parent"
+                    }
+                }
+            },
+            "/btn2": {
+                "body_2": {
+                    "alpha": 1,
+                    "position": {
+                        "my": "middle center",
+                        "at": "middle center",
+                        "of": "parent"
+                    }
+                }
+            },
+            "/btn3": {
+                "body_3": {
+                    "alpha": 1,
+                    "position": {
+                        "my": "middle center",
+                        "at": "middle center",
+                        "of": "parent"
+                    }
+                }
+            },
+            "/btn4": {
+                "body_4": {
+                    "alpha": 1,
+                    "position": {
+                        "my": "middle center",
+                        "at": "middle center",
+                        "of": "parent"
+                    }
+                }
+            }
+        },
+        "children_": {
+            "body_1": {
+                "class": "big-block",
+                "fillStyle": "#700"
+            }
+        },
+        "children": {
+            "btn_1": {
+                "class": "block",
+                "fillStyle": "#F00",
+                "onInputDown": {
+                    "handler": "scene-enter-section",
+                    "params": "/btn1"
+                }
+            },
+            "btn_2": {
+                "class": "block",
+                "fillStyle": "#FF0",
+                "onInputDown": {
+                    "handler": "scene-enter-section",
+                    "params": "/btn2"
+                }
+            },
+            "btn_3": {
+                "class": "block",
+                "fillStyle": "#F0F",
+                "onInputDown": {
+                    "handler": "scene-enter-section",
+                    "params": "/btn3"
+                }
+            },
+            "btn_4": {
+                "class": "block",
+                "fillStyle": "#0F0",
+                "onInputDown": {
+                    "handler": "scene-enter-section",
+                    "params": "/btn4"
                 }
+            },
+            "body_1": {
+                "type": "YoutubeVideo",
+                "videoid": "3zKoUda-WVA",                            
+                "autoplay": false,
+                "allowfullscreen": true,
+                "maxWidth": "90%",
+                "minWidth": "50%",
+                "maxHeight": "90%",
+                "minHeight": "50%",
+                "width": "800",
+                "height": "600",
+                "aspectRatio": "1.778"
+            },
+            "body_2": {
+                "class": "big-block",
+                "fillStyle": "#770"
+            },
+            "body_3": {
+                "class": "big-block",
+                "fillStyle": "#707"
+            },
+            "body_4": {
+                "class": "big-block",
+                "fillStyle": "#070"
             }
         }
     }
diff --git a/index.html b/index.html
index 7c0dd68..99e0cb9 100644
--- a/index.html
+++ b/index.html
@@ -17,7 +17,7 @@
         <script src="app.js"></script>
     </head>
     <style>
-        body, html { margin: 0px; background-color: cornflowerblue; }
+        body, html { overflow: hidden; margin: 0px; background-color: cornflowerblue; }
     </style>
     <body>
     </body>
diff --git a/lib/jwebkit.js b/lib/jwebkit.js
index c732581..37dd6c9 100644
--- a/lib/jwebkit.js
+++ b/lib/jwebkit.js
@@ -975,6 +975,12 @@ BaseStrategy.prototype._tq_id = function (node, new_id) {
         var reg = new RegExp("(?:^|\\s)" + classname +  "(?!\\S)");
         return !!node.className.match(reg);
     },
+    _tq_get_css: function (node, key) {
+        return node.style[key]
+    },
+    _tq_set_css: function (node, key, value) {
+        return node.style[key] = value;        
+    },
     _tq_get_attr: function (node, key) {
         console.assert(this._tq_accepts(node), node);        
         console.assert(typeof key == "string", arguments);
@@ -982,7 +988,7 @@ BaseStrategy.prototype._tq_id = function (node, new_id) {
     },
     _tq_set_attr: function (node, key, value) {
         console.assert(this._tq_accepts(node), node);        
-        console.assert(typeof key == "string", arguments);        
+        console.assert(typeof key == "string", arguments);
         return node.setAttribute(key, value);
     },
     _tq_map_attr: function (node) {
@@ -1074,9 +1080,6 @@ BaseStrategy.prototype._tq_id = function (node, new_id) {
     },
     _tq_offset: function (node, new_value) {
         if (new_value) {
-            if (typeof new_value == "number") {
-                new_value = new_value + "px";
-            }            
             node.style.width= new_value;
             return this;
         }
@@ -1084,19 +1087,13 @@ BaseStrategy.prototype._tq_id = function (node, new_id) {
     },
     _tq_width: function (node, new_value) {
         if (new_value) {
-            if (typeof new_value == "number") {
-                new_value = new_value + "px";
-            }            
             node.style.width= new_value;
             return this;
         }
         return node.offsetWidth();
     },
-    _tq_height: function (node, new_value) {        
+    _tq_height: function (node, new_value) {
         if (new_value) {
-            if (typeof new_value == "number") {
-                new_value = new_value + "px";
-            }             
             node.style.height = new_value;
             return this;
         }
@@ -1185,6 +1182,29 @@ BaseStrategy.prototype._tq_id = function (node, new_id) {
     hasClass: function (classname) {
         return this._tq_strategy._tq_has_class(this[0], classname);
     },
+    css: function (key, val) {
+        if (arguments.length == 1) {
+            if (typeof key == "object") {
+                for (var i in key) {
+                    this.css(i, key[i]);
+                }
+                return this;            
+            }
+
+            if (typeof key == "string") {
+                if (this.length == 0) return null;
+                return self._tq_strategy._tq_set_css(this[0], key, val);          
+            }
+        }
+        
+        if (arguments.length == 2 && typeof key == "string") {
+            return this.each(function (element,index,self) {
+                self._tq_strategy._tq_set_css(element, key, val);
+            });
+        }
+        
+        return this;
+    },
     attr: function (key, value) {
         
         if (arguments.length == 1 && typeof key == "string") {
diff --git a/src/dom_wrapper.js b/src/dom_wrapper.js
index f8f2465..588ef8d 100644
--- a/src/dom_wrapper.js
+++ b/src/dom_wrapper.js
@@ -16,7 +16,7 @@ LightSaber.DOM_Wrapper.prototype = jwk.extend(Object.create(LightSaber.DisplayOb
             this._last_parent_y != this.parent.y ||
             this._last_self_x != this.x ||
             this._last_self_y != this.y
-           ) {            
+           ) {
             this._last_parent_x = this.parent.x;
             this._last_parent_y = this.parent.y;
             this._last_self_x = this.x;
@@ -52,6 +52,15 @@ LightSaber.DOM_Wrapper.prototype = jwk.extend(Object.create(LightSaber.DisplayOb
                 "rotate(" + this.angle + "deg) translate("+(-x)+"%,"+(-y)+"%)";                             
             this._$element[0].style.transform = t;        
         }
+        
+        if (this._last_alpha != this.alpha ||
+            this._last_alpha != this.alpha        
+           ) {
+            this._last_alpha = this.alpha;
+            this._$element.css("opacity", this.alpha);            
+        }
+
+        
     },
     resize: function (){
         LightSaber.DisplayObject.prototype.resize.call(this);
diff --git a/src/lightsaber.js b/src/lightsaber.js
index 9e69b0a..ce89dee 100644
--- a/src/lightsaber.js
+++ b/src/lightsaber.js
@@ -57,7 +57,7 @@ LightSaber.prototype = {
                     saber.enter_section(target.spec[event_name].params);
                     break;
             }
-        }        
+        }
     },
     extend_spec: function (spec) {
         var self = this;