diff --git a/app/views/shared/logged_in/xmpp_chat.html.erb b/app/views/shared/logged_in/xmpp_chat.html.erb
index fa0b05a..6047797 100644
--- a/app/views/shared/logged_in/xmpp_chat.html.erb
+++ b/app/views/shared/logged_in/xmpp_chat.html.erb
@@ -12,6 +12,13 @@
       var $presence = '<%= current_user.last_chat_status %>';
     </script>
 
+
+  <div id="chat-label" class="opened">
+    <span><%= _('Chat') %></span>
+    <br clear="both" />
+    <div class="icon-big-chat"></div>
+  </div>
+
   <div id='chat'>
     <div id='buddy-list'>
       <div class='toolbar'>
diff --git a/public/designs/icons/tango/mod/64x64/apps/internet-group-chat.png b/public/designs/icons/tango/mod/64x64/apps/internet-group-chat.png
new file mode 100644
index 0000000..c9983e4
Binary files /dev/null and b/public/designs/icons/tango/mod/64x64/apps/internet-group-chat.png differ
diff --git a/public/designs/icons/tango/style.css b/public/designs/icons/tango/style.css
index fa15e5f..b5d920d 100644
--- a/public/designs/icons/tango/style.css
+++ b/public/designs/icons/tango/style.css
@@ -92,6 +92,7 @@
 .icon-media-next   { background-image: url(Tango/16x16/actions/media-skip-forward.png) }
 .icon-lock	       { background-image: url(Tango/16x16/actions/lock.png) }
 .icon-chat         { background-image: url(Tango/16x16/apps/internet-group-chat.png); background-repeat: no-repeat }
+.icon-big-chat     { background-image: url(mod/64x64/apps/internet-group-chat.png); background-repeat: no-repeat }
 .icon-reply        { background-image: url(Tango/16x16/actions/mail-reply-sender.png) }
 .icon-newforum     { background-image: url(Tango/16x16/apps/internet-group-chat.png) }
 .icon-forum        { background-image: url(Tango/16x16/apps/system-users.png) }
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index 16487e1..f206c69 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -567,14 +567,11 @@ function display_notice(message) {
    setTimeout(function() { $noticeBox.fadeOut('fast'); }, 5000);
 }
 
-function open_chat_window(self_link, anchor) {
+function toggle_chat_window(self_link, anchor) {
    if(jQuery('#conversations .conversation').length == 0) jQuery('.buddies a').first().click();
-   if(anchor) {
-      jQuery('#chat').show('fast');
-      jQuery("#chat" ).trigger('opengroup', anchor);
-   } else {
-      jQuery('#chat').toggle('fast');
-   }
+   jQuery('#chat').toggleClass('opened');
+   jQuery('#chat-label').toggleClass('opened');
+   if(anchor) jQuery("#chat" ).trigger('opengroup', anchor);
    return false;
 }
 
@@ -1089,7 +1086,7 @@ function notifyMe(title, options) {
     });
   }
   return notification;
-  // At last, if the user already denied any notification, and you 
+  // At last, if the user already denied any notification, and you
   // want to be respectful there is no need to bother them any more.
 }
 
diff --git a/public/javascripts/chat.js b/public/javascripts/chat.js
index d9e758f..bde7bb3 100644
--- a/public/javascripts/chat.js
+++ b/public/javascripts/chat.js
@@ -771,4 +771,8 @@ jQuery(function($) {
   $('#chat .buddies a').live('click', function(){
     $('#chat .search').val('').change();
   });
+
+  $('#chat-label').click(function(){
+    toggle_chat_window(this);
+  });
 });
diff --git a/public/stylesheets/chat.css b/public/stylesheets/chat.css
index 4239df1..16d2159 100644
--- a/public/stylesheets/chat.css
+++ b/public/stylesheets/chat.css
@@ -1,13 +1,18 @@
 #chat {
-  width: 350px;
+  width: 0;
   height: 100%;
-  display: none;
   position: fixed;
   right: 0;
   top: 0;
   z-index: 900;
   background-color: #FFF;
   box-shadow: -3px 0px 5px #888;
+  transition: width 0.3s ease-in;
+}
+
+#chat.opened {
+  width: 350px;
+  transition: width 0.3s ease-in;
 }
 
 #chat-window {
@@ -19,7 +24,7 @@
   background-color: #f9f9f9;
   top: 0;
   right: 0;
-  width: 65px;
+  width: 0;
   bottom: 100px;
   position: absolute;
   border-left: 1px solid #DCE4E7;
@@ -28,6 +33,11 @@
   transition: width 0.3s ease-in;
 }
 
+#chat.opened #buddy-list {
+  width: 65px;
+  transition: width 0.3s ease-in;
+}
+
 #chat #buddy-list:hover {
   width: 190px;
   transition: width 0.3s ease-in;
@@ -467,3 +477,56 @@ div.occupants > a.up {
   background-image: linear-gradient(to left, #E3E3E3 25%, #BABDB6 100%, #FFFFFF 100%);
   xbackground-color: #BABDB6;
 }
+
+#chat-label {
+  width: 20px;
+  height: 80px;
+  background-color: #2E3436;
+  position: fixed;
+  top: 20%;
+  right: 350px;
+  cursor: pointer;
+  text-align: center;
+  z-index: 7;
+  transition: background-color 0.2s linear, right 0.3s ease-in, width 0.3s ease-in;
+  border-top-left-radius: 10px;
+  border-bottom-left-radius: 10px;
+}
+
+#chat-label.opened {
+  right: 0;
+  width: 100px;
+  transition: background-color 0.2s linear, right 0.3s ease-in, width 0.3s ease-in;
+}
+
+#chat-label.opened:hover {
+  background-color: #888A85;
+  transition: background-color 0.2s linear, right 0.3s ease-in, width 0.3s ease-in;
+}
+
+#chat-label:hover {
+  background-color: #888A85;
+  transition: background-color 0.2s linear, right 0.3s ease-in;
+  transition: background-color 0.2s linear, right 0.3s ease-in, width 0.3s ease-in;
+}
+
+#chat-label span {
+  color: white;
+  font-size: 18px;
+  line-height: 24px;
+  display: none;
+}
+
+#chat-label.opened span {
+  display: inline;
+}
+
+#chat-label div {
+  width: 64px;
+  height: 64px;
+  display: none;
+}
+
+#chat-label.opened div {
+  display: inline-block;
+}
--
libgit2 0.21.2