diff --git a/rhodecode/public/css/contextbar.css b/rhodecode/public/css/contextbar.css
--- a/rhodecode/public/css/contextbar.css
+++ b/rhodecode/public/css/contextbar.css
@@ -7,8 +7,8 @@
 #quick .search { background-image: url("../images/icons/search_16.png"); }
 #quick .admin { background-image: url("../images/icons/cog_edit.png"); }
 
-#context-bar button.follow { background-image: url("../images/icons/heart.png"); }
-#context-bar button.following { background-image: url("../images/icons/heart_delete.png"); }
+#context-bar a.follow { background-image: url("../images/icons/heart.png"); }
+#context-bar a.following { background-image: url("../images/icons/heart_delete.png"); }
 #context-bar a.fork { background-image: url("../images/icons/arrow_divide.png"); }
 #context-bar a.summary { background-image: url("../images/icons/clipboard_16.png"); }
 #context-bar a.changelogs { background-image: url("../images/icons/time.png"); }
@@ -47,14 +47,12 @@
 
 #header #header-inner #quick a,
 #content #context-bar,
-#content #context-bar a,
-#content #context-bar button {
+#content #context-bar a {
     color: #FFFFFF;
 }
 
 #header #header-inner #quick a:hover,
-#content #context-bar a:hover,
-#content #context-bar button:hover {
+#content #context-bar a:hover {
     text-decoration: none;
 }
 
@@ -170,7 +168,6 @@ ul#context-actions {
     border-left: 1px solid rgba(255,255,255,0.1);
 }
 
-#context-actions button,
 #context-actions a {
     display: block;
     cursor: pointer;
@@ -216,7 +213,7 @@ ul#context-actions {
     border-radius: 0 4px 4px 0;
 }
 
-#content  #context-actions .icon {
+#content #context-actions .icon {
     margin: auto;
     margin-bottom: 5px;
     display: block;
@@ -224,25 +221,11 @@ ul#context-actions {
     float: none;
 }
 
-#content  #context-actions button.follow,
-#content  #context-actions button.following {
-    width: auto;
-    float: none;
-}
-
-#content  #context-actions button .show-following,
-#content  #context-actions button .show-follow {
+#content #context-pages .follow .show-following,
+#content #context-pages .following .show-follow {
     display: none;
 }
 
-#content #context-bar #context-actions button.follow .show-follow {
-    display: block;
-}
-
-#content #context-bar #context-actions button.following .show-following {
-    display: block;
-}
-
 #context-state {
     background-color: #336699;
     border-top: 1px solid #517da8;
diff --git a/rhodecode/public/css/style.css b/rhodecode/public/css/style.css
--- a/rhodecode/public/css/style.css
+++ b/rhodecode/public/css/style.css
@@ -3174,26 +3174,6 @@ table.code-browser .submodule-dir {
     z-index: 9050;
 }
 
-.follow {
-    background: url("../images/icons/heart_add.png") no-repeat scroll 3px;
-    height: 16px;
-    width: 20px;
-    cursor: pointer;
-    display: block;
-    float: right;
-    margin-top: 2px;
-}
-
-.following {
-    background: url("../images/icons/heart_delete.png") no-repeat scroll 3px;
-    height: 16px;
-    width: 20px;
-    cursor: pointer;
-    display: block;
-    float: right;
-    margin-top: 2px;
-}
-
 .reposize {
     background: url("../images/icons/server.png") no-repeat scroll 3px;
     height: 16px;
diff --git a/rhodecode/templates/base/base.html b/rhodecode/templates/base/base.html
--- a/rhodecode/templates/base/base.html
+++ b/rhodecode/templates/base/base.html
@@ -87,7 +87,7 @@
           if c.repository_following:
               return h.literal('following')
           else:
-            return h.literal('follow')
+              return h.literal('follow')
   %>
   <%
     def is_current(selected):
@@ -103,24 +103,6 @@
         &raquo;
         ${h.repo_link(c.rhodecode_db_repo.groups_and_repo)}
       </div>
-      ## TODO: this check feels wrong, it would be better to have a check for permissions
-      ## also it feels like a job for the controller
-      %if c.rhodecode_user.username != 'default':
-        <ul id="context-actions" class="horizontal-list">
-          <li>
-           <button class="${follow_class()}" onclick="javascript:toggleFollowingRepo(this,${c.rhodecode_db_repo.repo_id},'${str(h.get_token())}');">
-            <!--span class="icon show-follow follow"></span>
-            <span class="icon show-following following"></span-->
-            <span class="show-follow">${_('Follow')}</span>
-            <span class="show-following">${_('Unfollow')}</span>
-          </button>
-          </li>
-          <li><a href="${h.url('repo_fork_home',repo_name=c.repo_name)}" class="fork">${_('Fork')}</a></li>
-          %if h.is_hg(c.rhodecode_repo):
-          <li><a href="${h.url('pullrequest_home',repo_name=c.repo_name)}" class="pull-request">${_('Create Pull Request')}</a></li>
-          %endif
-        </ul>
-      %endif
     </div>
     <div id="context-state">
       <ul id="context-pages" class="horizontal-list">
@@ -156,6 +138,20 @@
                   <li>${h.link_to(_('Lock'), h.url('toggle_locking',repo_name=c.repo_name),class_='locking_add')}</li>
                 %endif
               %endif
+		      ## TODO: this check feels wrong, it would be better to have a check for permissions
+		      ## also it feels like a job for the controller
+		      %if c.rhodecode_user.username != 'default':
+		          <li>
+		           <a class="${follow_class()}" onclick="javascript:toggleFollowingRepo(this,${c.rhodecode_db_repo.repo_id},'${str(h.get_token())}');">
+		            <span class="show-follow">${_('Follow')}</span>
+		            <span class="show-following">${_('Unfollow')}</span>
+		          </a>
+		          </li>
+		          <li><a href="${h.url('repo_fork_home',repo_name=c.repo_name)}" class="fork">${_('Fork')}</a></li>
+		          %if h.is_hg(c.rhodecode_repo):
+		          <li><a href="${h.url('pullrequest_home',repo_name=c.repo_name)}" class="pull-request">${_('Create Pull Request')}</a></li>
+		          %endif
+		      %endif
              </ul>
         </li>
         <li ${is_current('showpullrequest')}>