diff --git a/template/app/History.js b/template/app/History.js
index 295ed432ae8a4f02e03dce57f7af6c11f8ab5d16..1ec07746348f34b8a1ee7a134f8697d795c728ef 100644
--- a/template/app/History.js
+++ b/template/app/History.js
@@ -71,9 +71,9 @@ Ext.define("Docs.History", {
         if (cls) {
             // When class already in history remove it and add again.
             // This way the most recently visited items will always be at the top.
-            var oldIndex = this.store.find('cls', cls);
-            if (oldIndex) {
-                this.store.removeAt(oldIndex);
+            var oldItem = this.store.findRecord('cls', cls);
+            if (oldItem) {
+                this.store.remove(oldItem);
             }
 
             // Add new item at the beginning
diff --git a/template/app/controller/Classes.js b/template/app/controller/Classes.js
index bc92fa2ae6f6b533ecb4b44cc7051b6e2dfe957f..523984f7065c2ebcf3e28ed136e71f94ed3f7c11 100644
--- a/template/app/controller/Classes.js
+++ b/template/app/controller/Classes.js
@@ -168,8 +168,14 @@ Ext.define('Docs.controller.Classes', {
 
         if (clsName) {
             if (e.getTarget(".fav")) {
-                Docs.Favorites.add(clsName);
-                Ext.get(e.getTarget(".fav")).addCls("show");
+                var favEl = Ext.get(e.getTarget(".fav"));
+                if (favEl.hasCls('show')) {
+                    Docs.Favorites.remove(clsName);
+                    favEl.removeCls("show");                    
+                } else {                    
+                    Docs.Favorites.add(clsName);
+                    favEl.addCls("show");
+                }
             }
             else {
                 this.loadClass(clsName);
diff --git a/template/app/view/tree/Favorites.js b/template/app/view/tree/Favorites.js
index e928ffdbdeaa635c70c1e2fa7e030496a491cf72..8a4c3efd22c668b861e4ca290c0d30da2c5c4385 100644
--- a/template/app/view/tree/Favorites.js
+++ b/template/app/view/tree/Favorites.js
@@ -52,7 +52,8 @@ Ext.define('Docs.view.tree.Favorites', {
 
         var p = this.getEl().getXY();
         this.hoverMenu.getEl().setStyle({
-            left: "35px",
+            left: "20px",
+            width: "220px",
             top: (p[1]+23)+"px"
         });
     },
diff --git a/template/app/view/tree/History.js b/template/app/view/tree/History.js
index 2a15b9bb4a943965a4257c2e906c4ef0999eb2ef..7a8ed3b52c1d2284c0b0f5408e8f096967bf08f2 100644
--- a/template/app/view/tree/History.js
+++ b/template/app/view/tree/History.js
@@ -52,7 +52,8 @@ Ext.define('Docs.view.tree.History', {
 
         var p = this.getEl().getXY();
         this.hoverMenu.getEl().setStyle({
-            left: "35px",
+            left: "20px",
+            width: "220px",
             top: (p[1]+23)+"px"
         });
     },
diff --git a/template/index_production.html b/template/index_production.html
index f6390c05850fed47efcef66c7a0fbaf4b26eeb63..7e2789f3cb35e82386328b186ac28e1258361d65 100644
--- a/template/index_production.html
+++ b/template/index_production.html
@@ -21,6 +21,7 @@
   <script type="text/javascript" src="prettify/prettify.js"></script>
 
   <script type="text/javascript" src="app.js"></script>
+  <script type="text/javascript" src="app/Favorites.js"></script>
   <script type="text/javascript" src="app/History.js"></script>
 
   <script type="text/javascript" src="output/tree.js"></script>
diff --git a/template/resources/sass/viewport.scss b/template/resources/sass/viewport.scss
index fbc5838d091372f72eb0a47f164e59ab31d70d4c..96e86b75b988d7ea78c7f4e7d596300a4177ae1f 100644
--- a/template/resources/sass/viewport.scss
+++ b/template/resources/sass/viewport.scss
@@ -328,7 +328,6 @@ a:hover {
       height: 15px;
       position: absolute;
       right: 3px;
-      z-index: 20;
       top: 0;
       &.show {
         background: url(../images/favorite.png) no-repeat -2px -1px; } }
@@ -661,13 +660,13 @@ a:hover {
     display: block;
     .item {
       position: relative;
-      padding: 2px 30px 2px 0; }
-    a {
-      display: inline;
-      padding: 0; }
-    a.close {
-      position: absolute;
-      right: 0; } }
+      padding: 2px 0 2px 0; 
+	    a.close {
+	      position: absolute;
+				width: auto;
+				padding: 3px 0 0 0;
+	      right: 0; top: 0; } }
+}
 
 #favoritesBtn,#historyBtn {
   padding-left: 22px;