diff --git a/templates/web/prod/index.html.twig b/templates/web/prod/index.html.twig
index 93f3bd7410..763833cb62 100644
--- a/templates/web/prod/index.html.twig
+++ b/templates/web/prod/index.html.twig
@@ -185,6 +185,7 @@
         <div id="idFrameC" class="PNB" style="right:auto;width:{{ w1 ~ '%' }}">
             <div class="PNB wrapper">
                 <div class="tabs ui-tabs">
+                    <div id="retractableButton"></div>
                     <ul class="icon-menu ui-tabs-nav ui-helper-reset">
                         {% if GV_thesaurus %}
                         <li class="proposals_WZ">
@@ -199,11 +200,6 @@
                             </a>
                         </li>
                         {% endif %}
-                        <li style="float:right;">
-                            <a href="#" class="escamote">
-                                <img src="/skins/icons/workzoneEscamote.png" title="{{ 'Close the WorkZone' | trans }}"/>
-                            </a>
-                        </li>
                         <li class="ui-tabs-selected ui-corner-top">
                             <a href="#baskets" class="WZbasketTab">
                                 <div id="basket_menu_trigger">&#9660;</div>
diff --git a/www/skins/icons/workzoneEscamote_on.png b/www/skins/icons/workzoneEscamote_on.png
new file mode 100644
index 0000000000..b3c697139a
Binary files /dev/null and b/www/skins/icons/workzoneEscamote_on.png differ
diff --git a/www/skins/prod/000000/prodcolor.css b/www/skins/prod/000000/prodcolor.css
index 3636c4710e..f4481c1bfc 100644
--- a/www/skins/prod/000000/prodcolor.css
+++ b/www/skins/prod/000000/prodcolor.css
@@ -216,6 +216,22 @@ span.ww_winTitle {
     top: 0 !important;
 }
 
+
+#idFrameC #retractableButton {
+    cursor: pointer;
+    width: 70px;
+    height: 70px;
+    float: right;
+    text-align: center;
+    line-height: 70px;
+    margin-bottom: -20px;
+    background: url("/skins/icons/workzoneEscamote.png") 30px 30px no-repeat;
+}
+
+#idFrameC.closed #retractableButton {
+    background: url("/skins/icons/workzoneEscamote_on.png") 30px 30px no-repeat;
+}
+
 #idFrameC .wrapper {
     background-color: #3b3b3b;
     right: 10px;
diff --git a/www/skins/prod/jquery.main-prod.js b/www/skins/prod/jquery.main-prod.js
index f400b12c79..7a075c9c94 100644
--- a/www/skins/prod/jquery.main-prod.js
+++ b/www/skins/prod/jquery.main-prod.js
@@ -1152,9 +1152,46 @@ $(document).ready(function () {
         }
     });
 
-    $('#idFrameC .escamote').bind('click', function (event) {
+    $('#idFrameC .ui-tabs-nav li').on('click', function (event) {
+        if($('#idFrameC').attr('data-status') == 'closed'){
+            $('#idFrameC').width(300);
+            $('#rightFrame').css('left', 300);
+            $('#rightFrame').width($(window).width()-300);
+            $('#baskets, #proposals, #thesaurus_tab').hide();
+            $('.ui-resizable-handle, #basket_menu_trigger').show();
+            var IDname = $(this).attr('aria-controls');
+            $('#'+IDname).show();
+        }
+
+        $('#idFrameC').attr('data-status', 'open');
+        $('.WZbasketTab').css('background-position', '9px 16px');
+        $('#idFrameC').removeClass('closed');
+    });
+
+    $('#idFrameC #retractableButton').bind('click', function (event) {
+        
+        if($('#idFrameC').attr('data-status') != 'closed'){
+            $('#idFrameC').width(80);
+            $('#rightFrame').css('left', 80);
+            $('#rightFrame').width($(window).width()-80);
+            $('#idFrameC').attr('data-status', 'closed');
+            $('#baskets, #proposals, #thesaurus_tab, .ui-resizable-handle, #basket_menu_trigger').hide();
+            $('#idFrameC .ui-tabs-nav li').removeClass('ui-state-active');
+            $('.WZbasketTab').css('background-position', '15px 16px');
+            $('#idFrameC').addClass('closed');
+        }else{
+            $('#idFrameC').width(300);
+            $('#rightFrame').css('left', 300);
+            $('#rightFrame').width($(window).width()-300);
+            $('#idFrameC').attr('data-status', 'open');
+            $('.ui-resizable-handle, #basket_menu_trigger').show();
+            $('.WZbasketTab').css('background-position', '9px 16px');
+            $('#idFrameC').removeClass('closed');
+        }
+        
+
         event.stopImmediatePropagation();
-        p4.WorkZone.close();
+        //p4.WorkZone.close();
         return false;
     });