diff --git a/src/static/css/iframe_editor.css b/src/static/css/iframe_editor.css
index 2974e5c7d..d06c83217 100644
--- a/src/static/css/iframe_editor.css
+++ b/src/static/css/iframe_editor.css
@@ -92,7 +92,7 @@ body.doesWrap:not(.noprewrap) > div {
 }
 #sidedivinner {
   text-align: right;
-  opacity: .7;
+  opacity: .9;
 }
 #sidediv:not(.sidedivdelayed) { /* before sidediv get initialized, hide text */
   color: transparent;
@@ -132,7 +132,7 @@ body.doesWrap:not(.noprewrap) > div {
 ::-moz-selection {
   background: #acf;
 }
-a {
+#innerdocbody a {
   cursor: pointer !important;
   white-space:pre-wrap;
 }
diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index 7e8efccdb..102e04d70 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -14,10 +14,15 @@
 
 html {
   font-size: 14px;
-  font-family: Cantarell, Roboto, "Open Sans", "Helvetica Neue", Arial, sans-serif;
   line-height: 20px;
   color: #3e3e3e;
 }
+
+html,
+#sidedivinner > div:before {
+  font-family: Cantarell, Roboto, "Open Sans", "Helvetica Neue", Arial, sans-serif;
+}
+
 .clear {
   clear: both
 }
diff --git a/src/static/css/pad/chat.css b/src/static/css/pad/chat.css
index 4d1321dc8..0b9e611f1 100644
--- a/src/static/css/pad/chat.css
+++ b/src/static/css/pad/chat.css
@@ -42,6 +42,7 @@
 }
 #titlebar #titlelabel {
   margin: 4px 0 0 4px;
+  display: inline;
 }
 #titlebar .stick-to-screen-btn,
 #titlebar .hide-reduce-btn {
@@ -106,6 +107,7 @@
 #chaticon #chatcounter {
   font-size: .8rem;
   vertical-align: middle;
+  margin-left: 5px;
 }
 
 /* -- LOAD MESSAGES -- */
diff --git a/src/static/css/pad/popup_users.css b/src/static/css/pad/popup_users.css
index 5c5067c5f..01a57d4fa 100644
--- a/src/static/css/pad/popup_users.css
+++ b/src/static/css/pad/popup_users.css
@@ -115,7 +115,9 @@ input#myusernameedit:not(.editable) {
 /* ------------------- */
 /* --- OTHER USERS --- */
 /* ------------------- */
-
+#otheruserstable {
+  display: none;
+}
 #otheruserstable td {
   height: 26px;
   padding: 0 2px;
diff --git a/src/static/css/timeslider.css b/src/static/css/timeslider.css
index b254145df..f0f713f16 100644
--- a/src/static/css/timeslider.css
+++ b/src/static/css/timeslider.css
@@ -71,7 +71,7 @@
 #timeslider-slider .star {
   cursor: pointer;
   position: absolute;
-  top: -6px
+  top: -8px
 }
 #timeslider-slider .star:before{
   font-family: fontawesome-etherpad;
diff --git a/src/static/js/farbtastic.js b/src/static/js/farbtastic.js
index ca322f1b0..acabea49d 100644
--- a/src/static/js/farbtastic.js
+++ b/src/static/js/farbtastic.js
@@ -1,4 +1,5 @@
 // Farbtastic 2.0 alpha
+// edited by Sebastian Castro <sebastian.castro@protonmail.com> on 2020-04-06
 (function ($) {
 
 var __debug = false;
@@ -304,19 +305,17 @@ $._farbtastic = function (container, options) {
    */
   fb.drawMarkers = function () {
     // Determine marker dimensions
-    var sz = options.width, lw = Math.ceil(fb.markerSize / 4), r = fb.markerSize - lw + 1;
+    var sz = options.width;
     var angle = fb.hsl[0] * 6.28,
         x1 =  Math.sin(angle) * fb.radius,
         y1 = -Math.cos(angle) * fb.radius,
         x2 = 2 * fb.square * (.5 - fb.hsl[1]),
-        y2 = 2 * fb.square * (.5 - fb.hsl[2]),
-        c1 = fb.invert ? '#fff' : '#000',
-        c2 = fb.invert ? '#000' : '#fff';
+        y2 = 2 * fb.square * (.5 - fb.hsl[2]);
     var circles = [
-      { x: x1, y: y1, r: r,             c: '#000', lw: lw + 1 },
-      { x: x1, y: y1, r: fb.markerSize, c: '#fff', lw: lw },
-      { x: x2, y: y2, r: r,             c: c2,     lw: lw + 1 },
-      { x: x2, y: y2, r: fb.markerSize, c: c1,     lw: lw },
+      { x: x1, y: y1, r: fb.markerSize + 1, c: 'rgb(0,0,0,.4)', lw: 2 },
+      { x: x1, y: y1, r: fb.markerSize, c: '#fff', lw: 2 },
+      { x: x2, y: y2, r: fb.markerSize + 1, c: 'rgb(0,0,0,.4)', lw: 2 },
+      { x: x2, y: y2, r: fb.markerSize, c: '#fff',     lw: 2 },
     ];
 
     // Update the overlay canvas.
diff --git a/src/static/js/pad_userlist.js b/src/static/js/pad_userlist.js
index 6383212cf..02e6add58 100644
--- a/src/static/js/pad_userlist.js
+++ b/src/static/js/pad_userlist.js
@@ -207,6 +207,7 @@ var paduserlist = (function()
         tr = $(getRowHtml(domId, getEmptyRowHtml(getAnimationHeight(ANIMATION_START)), authorId));
       }
       handleRowNode(tr, data);
+      $("table#otheruserstable").show();
       if (position == 0)
       {
         $("table#otheruserstable").prepend(tr);
@@ -263,6 +264,9 @@ var paduserlist = (function()
           scheduleAnimation();
         }
       }
+      if (rowsPresent.length === 0) {
+        $("table#otheruserstable").hide();
+      }
     }
 
     // newPosition is position after the row has been removed
diff --git a/src/static/skins/colibris/pad.css b/src/static/skins/colibris/pad.css
index 6e9990389..1a49a73ca 100644
--- a/src/static/skins/colibris/pad.css
+++ b/src/static/skins/colibris/pad.css
@@ -78,16 +78,20 @@ p[data-l10n-id="ep_comments_page.comment"],
 #slider-btn-container button {
   border-color: #64d29b;
 }
+
+h2 {
+  opacity: .9 !important; /* make it a bit less agressive */
+}
 /* PRIMARY-COLOR VARIANT */
 .toolbar ul li a.selected,
 .toolbar ul li a.pressed,
 .toolbar ul li select:active {
-  background-color: #f0faf6 !important;
+  background-color: #f0faf6 !important; /* primary light */
 }
 .toolbar ul li a.selected .buttonicon,
 .toolbar ul li a.pressed .buttonicon,
 .toolbar ul li select:active {
-  color: #5abb89;
+  color: #5abb89; /* primary a bit darker */
 }
 
 /* BACKGROUND COLOR */
@@ -96,4 +100,6 @@ p[data-l10n-id="ep_comments_page.comment"],
 }
 
 /* FONT */
-body { font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }
+body,
+#sidedivinner > div:before
+{ font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }
diff --git a/src/static/skins/colibris/src/components/gritter.css b/src/static/skins/colibris/src/components/gritter.css
index a564e6eaf..b2c2cd112 100644
--- a/src/static/skins/colibris/src/components/gritter.css
+++ b/src/static/skins/colibris/src/components/gritter.css
@@ -1,11 +1,14 @@
-.gritter-item {
-  margin-bottom: 10px;
-}
 .gritter-item .popup-content {
   color: white;
+  margin-bottom: 10px;
   box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
 }
-
+.gritter-item p {
+  margin: 0;
+}
+.gritter-item .gritter-title {
+  margin-bottom: 20px;
+}
 .gritter-item .gritter-close {
   margin-left: 10px;
   margin-right: -5px;
diff --git a/src/static/skins/colibris/src/components/popup.css b/src/static/skins/colibris/src/components/popup.css
index 1a63e45f6..107aaf31a 100644
--- a/src/static/skins/colibris/src/components/popup.css
+++ b/src/static/skins/colibris/src/components/popup.css
@@ -12,11 +12,13 @@
 }
 
 .popup h1 {
-  margin-bottom: 15px;
+  margin-bottom: 20px;
+  font-size: 1.6rem;
 }
 
 .popup h2 {
   margin-bottom: 15px;
+  margin-top: 20px;
 }
 
 .popup p {
diff --git a/src/static/skins/colibris/src/components/sidediv.css b/src/static/skins/colibris/src/components/sidediv.css
index d0b254e8a..698975772 100644
--- a/src/static/skins/colibris/src/components/sidediv.css
+++ b/src/static/skins/colibris/src/components/sidediv.css
@@ -6,7 +6,7 @@
 #sidedivinner>div:before {
   font-size: 13px;
   padding-right: 18px !important;
-  color: #6a6a6b;
+  color: #818188;
   text-transform: uppercase;
   font-size: 11px !important;
   font-weight: bold;
@@ -22,7 +22,7 @@
 #sidedivinner>div {
   line-height: 24px;
   font-size: 10px !important;
-  color: #7b7878;
+  color: #b2aaaa;
 }
 
 #sidedivinner.authorColors>div, #sidedivinner.authorColors>div.primary-none, #sidedivinner>div {
diff --git a/src/static/skins/colibris/src/components/toolbar.css b/src/static/skins/colibris/src/components/toolbar.css
index b9a86b814..0c220a3bc 100644
--- a/src/static/skins/colibris/src/components/toolbar.css
+++ b/src/static/skins/colibris/src/components/toolbar.css
@@ -2,6 +2,7 @@
   background-color: white;
   border-bottom: 1px solid #d2d2d2;
   padding: 0;
+  color: #5f6368;
 }
 
 .toolbar ul {
@@ -15,16 +16,18 @@
 .toolbar ul li {
   margin: 5px 1px;
 }
+.toolbar ul li a, .toolbar .buttonicon {
+  color: inherit;
+}
 
 .toolbar .buttonicon {
   background-color: transparent;
   font-size: 15px;
-  color: #5f6368;
 }
-.buttonicon-insertorderedlist,
-.buttonicon-insertunorderedlist,
-.buttonicon-indent,
-.buttonicon-outdent {
+.buttonicon-insertorderedlist:before,
+.buttonicon-insertunorderedlist:before,
+.buttonicon-indent:before,
+.buttonicon-outdent:before {
   font-size: 16px !important;
 }
 
@@ -75,7 +78,6 @@
   border-radius: 3px;
   width: auto;
   font-weight: bold;
-  color: #6d7075;
   font-size: 14px;
 }
 
@@ -96,6 +98,7 @@
 }
 .toolbar .menu_right li {
   margin-left: 8px;
+  opacity: .9;
 }
 
 .toolbar.cropped .menu_left {
@@ -114,10 +117,6 @@
     background: none;
     display: block;
   }
-
-  .toolbar ul li[data-key=showusers] {
-    margin-left: -5px !important;
-  }
 }
 
 @media (max-width: 720px) {
diff --git a/src/static/skins/colibris/src/components/users.css b/src/static/skins/colibris/src/components/users.css
index 199464570..23c00379d 100644
--- a/src/static/skins/colibris/src/components/users.css
+++ b/src/static/skins/colibris/src/components/users.css
@@ -1,5 +1,5 @@
 table#otheruserstable {
-  margin-top: 10px !important;
+  margin-top: 20px;
 }
 
 #otheruserstable .swatch {
@@ -16,8 +16,12 @@ table#otheruserstable {
   margin-left: 35px;
 }
 
-#myusernameedit {
+input#myusernameedit {
   min-width: 110px;
+  border: none !important;
+  border-bottom: 1px solid #ddd !important;
+  border-radius: 0;
+  padding-bottom: 5px;
 }
 
 #myswatch {
diff --git a/src/static/skins/colibris/timeslider.css b/src/static/skins/colibris/timeslider.css
index f94612800..45aa4302d 100644
--- a/src/static/skins/colibris/timeslider.css
+++ b/src/static/skins/colibris/timeslider.css
@@ -9,17 +9,24 @@
   background-color: #e4e4e4;
 }
 #slider-btn-container {
-  margin: 0 20px;
-  margin-top: -15px;
+  margin: -18px 15px 0 20px;
 }
 #slider-btn-container #playpause_button_icon {
   color: white;
   margin-right: 5px;
+  padding-top: 3px;
+  width: 45px;
+  height: 45px;
+}
+#slider-btn-container #playpause_button_icon:not(.pause) {
+
+  padding-left: 4px;
 }
 #slider-btn-container .stepper {
   border: 2px solid !important;
-  height: 25px;
-  width: 25px;
+  height: 30px;
+  width: 30px;
+  line-height: 28px;
   margin-left: 5px;
   font-size: 13px;
 }
diff --git a/src/templates/pad.html b/src/templates/pad.html
index 5b90ef861..44329e8d2 100644
--- a/src/templates/pad.html
+++ b/src/templates/pad.html
@@ -363,7 +363,7 @@
 
         <div id="chatbox">
             <div id="titlebar">
-              <span id ="titlelabel" data-l10n-id="pad.chat"></span>
+              <h1 id ="titlelabel" data-l10n-id="pad.chat"></h1>
               <a id="titlecross" class="hide-reduce-btn" onClick="chat.hide();return false;">-&nbsp;</a>
               <a id="titlesticky" class="stick-to-screen-btn" onClick="chat.stickToScreen(true);return false;" data-l10n-id="pad.chat.stick.title">█&nbsp;&nbsp;</a>
             </div>