From ad60f16042e561bf129bbfc489a5f901d7c35cc0 Mon Sep 17 00:00:00 2001
From: EliverLara <eliverlara@gmail.com>
Date: Sat, 27 Oct 2018 14:25:22 -0500
Subject: [PATCH] Renew gnome-shell theme

---
 gnome-shell/_colors.scss            |  18 +-
 gnome-shell/_common.scss            | 117 ++++-----
 gnome-shell/_drawing.scss           |  29 ++-
 gnome-shell/assets/close-window.svg |  31 ++-
 gnome-shell/gnome-shell.css         | 362 +++++++++++++++-------------
 5 files changed, 305 insertions(+), 252 deletions(-)

diff --git a/gnome-shell/_colors.scss b/gnome-shell/_colors.scss
index f682ba5..5a1b113 100644
--- a/gnome-shell/_colors.scss
+++ b/gnome-shell/_colors.scss
@@ -1,20 +1,24 @@
 $base_color:#202127;
-$bg_color: transparentize( #101013, 0.07);
-$gray: lighten(#101013, 15%);
-$fg_color: lighten( #31363D, 40%);
+$bg_color:#101013; //252b2f
+$main_dark: darken($bg_color, 5%);
+$gray: lighten($bg_color, 7%);
+$fg_color: lighten( #31363D, 40%);;
 $dracula: #101013;
-$topbar_color: lighten( #31363D, 35%);
+$topbar_color:  lighten($fg_color, 40%);
 
 $lime: #71f79f;
 $red: #ed254e;
 $purple: #d400dc;
 $cyan: #00e8c6;
 $yellow: #fadd00;
+$orange: #F79F79;
+$g1: #eee90a;
+$g2: #f7b922;
 
 $selected_fg_color: #f7f7f7;
-$selected_bg_color:#f7b922;
+$selected_bg_color: #f7b922;
 $selected_borders_color: darken($selected_bg_color, 10%);
-$borders_color: transparentize($gray, 0.7);
+$borders_color: darken(#1d2021, 3%);
 $borders_edge: transparentize(white, 0.9);
 $link_color: #13b1d5;
 $link_visited_color: transparentize($link_color,0.5);
@@ -22,7 +26,7 @@ $top_hilight: $borders_edge;
 $top_highlight: transparentize(white, 0.9);
 $bottom_highlight: transparentize(black, 0.9);
 
-$warning_color: darken(#ffb86c,10%);
+$warning_color: darken($orange,10%);
 $error_color: darken( $red,5%);
 $success_color: darken($cyan,10%);
 $destructive_color: darken( #c72240,10%);
diff --git a/gnome-shell/_common.scss b/gnome-shell/_common.scss
index 3678681..f5aeb3f 100644
--- a/gnome-shell/_common.scss
+++ b/gnome-shell/_common.scss
@@ -3,16 +3,15 @@ $corner-radius: 2px;
 
 /* GLOBALS */
 $font-size: 10;
-$font-family: "SFNS Display",Ubuntu, Cantarell, Sans-Serif;
+$font-family: Roboto,Ubuntu, Cantarell, Sans-Serif;
 $_bubble_bg_color: $osd_bg_color;
 $_bubble_fg_color: $fg_color;
 $_bubble_borders_color: $fg_color;
 $_bubble_transparent: transparentize($osd_bg_color, 0.17);
-$topbar_bg_color: transparentize(darken($dracula,10%),0.35);
+$topbar_bg_color: transparentize($dracula,0.35);
 
 stage {
   font-family: $font-family;
-  font-weight: 400;
   @include fontsize($font-size);
   color: $fg_color;
 }
@@ -22,7 +21,7 @@ stage {
 /* Buttons */
 .button {
   @include button(normal);
-  border-radius: 2px;
+  border-radius: 4px;
   border-width: 0;
   padding: 4px 32px;
   &:focus { @include button(focus); }
@@ -35,11 +34,12 @@ stage {
 
 .modal-dialog-linked-button {
   padding: 10px;
-  border: none;
+  border: 1px solid $borders_color;
   color: $fg_color;
-  background-color: transparent;
+  background: $main_dark;
   text-shadow: none;
   icon-shadow: none;
+  box-shadow: none;
   &:insensitive { @include button(insensitive); }
   &:active {
     @include button(active);
@@ -52,7 +52,6 @@ stage {
   }
   &:hover {
     @include button(hover);
-    background: transparent;
   }
 
   &:first-child { border-radius: 0px 0px 0px 2px; }
@@ -114,12 +113,12 @@ StScrollBar {
 
 .slider {
   height: 1em;
-  color: $selected_fg_color;
+  color: darken($selected_fg_color, 25%);
   border-color: black;
-  -slider-height: 0.3em;
+  -slider-height: 0.1em;
   -slider-background-color: $gray; //background of the trough
   -slider-border-color: black; //trough border color
-  -slider-active-background-color: $selected_bg_color; //active trough fill
+  -slider-active-background-color: $lime; //active trough fill
   -slider-active-border-color: $lime; //active trough border
   -slider-border-width: 0;
   -slider-handle-radius: 6px;
@@ -227,10 +226,11 @@ StScrollBar {
   spacing: 42px;
   border: none;
   & .modal-dialog-linked-button:last-child {
-    color: $error_color;
-    &:focus{
-      color: $error_color;
-      border: 1px solid  transparentize($error_color, 0.7);
+    @include gradient();
+    color: #fff;
+    &:hover, &:focus {
+      background: darken($error_color, 3%);
+      color: #fff;
     }
   }
 }
@@ -504,7 +504,8 @@ StScrollBar {
   background-color: transparent;
   .popup-menu-arrow { } //defined globally in the TOP BAR
   .popup-sub-menu {
-    background-color:  transparentize(darken($bg_color,20%), 0.8);
+   
+    background-color:  transparentize(darken($main_dark,57%), 0.8);
     box-shadow: $depth6;
   }
 
@@ -515,7 +516,8 @@ StScrollBar {
     &:ltr { padding: .4em 1.75em .4em 0em; }
     &:rtl { padding: .4em 0em .4em 1.75em; }
     &:checked {
-      background-color: transparentize($selected_bg_color,0.1);
+      @include gradient();
+     // background-color: transparentize($selected_bg_color,0.1);
       color: $selected_fg_color;
       box-shadow: inset 0 1px 0px lighten($borders_color,5%);
       font-weight: bold;
@@ -549,7 +551,7 @@ StScrollBar {
   }
   .popup-menu-boxpointer,
   .candidate-popup-boxpointer {
-    -arrow-border-radius: 3px;
+    -arrow-border-radius: 7px;
     -arrow-background-color: $bg_color;
     -arrow-border-width: 1px;
     -arrow-border-color: $borders_color;
@@ -591,8 +593,9 @@ StScrollBar {
   .level {
     height: 0.4em;
     border-radius: 0.3em;
-    background-color: transparentize($gray,0.5);
+    background-color: transparentize(darken($main_dark,15%),0.5);
     color: $osd_fg_color;
+    border: 1px solid $borders_color;
   }
   .level-bar {
     background-color: $selected_bg_color;
@@ -797,23 +800,23 @@ StScrollBar {
     &:hover {
       background: lighten($topbar_bg_color, 10%);
       color: lighten($topbar_color, 10%);
-      text-shadow: 0px 0px 8px rgba(0, 0, 0, 1);
-
-      .system-status-icon,
-      .app-menu-icon > StIcon,
-      .popup-menu-arrow {
-        icon-shadow: 0px 0px 8px rgba(0, 0, 0, 1);
-      }
+      transition-duration: 200ms;
     }
 
     &:active, &:overview, &:focus, &:checked {
       // Trick due to St limitations. It needs a background to draw
       // a box-shadow
-      background: lighten($topbar_bg_color, 10%);
-      box-shadow: inset 0 -2px 0px lighten($selected_bg_color,5%);
-      color: lighten($topbar_color,10%);
-
-      & > .system-status-icon { icon-shadow: black 0 2px 2px; }
+      box-shadow: none;
+      @include gradient();
+      color: $selected_fg_color;
+      text-shadow: 0px 0px 2px rgba(92, 92, 92, 0.9);
+      transition-duration: 200ms;
+      .system-status-icon,
+      .app-menu-icon > StIcon,
+      .popup-menu-arrow {
+        icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9);
+      }
+      & > .system-status-icon { icon-shadow: red 0 2px 2px; }
     }
 
     .system-status-icon { icon-size: 1.09em; padding: 0 5px; }
@@ -838,7 +841,7 @@ StScrollBar {
   .screencast-indicator { color: $warning_color; }
 
   &.solid {
-    background-color: darken($dracula,1%);
+    background-color: $dracula;
     /* transition from transparent to solid */
     transition-duration: 300ms;
 
@@ -874,9 +877,11 @@ StScrollBar {
     .datemenu-displays-box { spacing: 1em; }
 
     .datemenu-calendar-column {
-      border: 0 solid $borders_color;
+      border: 0 solid transparent;
       &:ltr { border-left-width: 1px; }
       &:rtl { border-right-width: 1px; }
+      background: darken($bg_color, 0.7%);
+     //@include gradient();
     }
 
     .datemenu-today-button,
@@ -919,7 +924,7 @@ StScrollBar {
     .weather-header,
     .events-section-title,
     .message-list-section-title {
-      color: lighten($fg_color,2%);
+      color: darken($fg_color, 10%);
       font-weight: bold;
     }
 
@@ -965,12 +970,12 @@ StScrollBar {
       border-radius: 1.4em;
       &:hover,&:focus { background-color: lighten($bg_color,5%); }
       &:active,&:selected {
-        color: lighten($selected_fg_color,5%);
+        color: $selected_fg_color;
         background-color: $selected_bg_color;
         border-color: transparent; //avoid jumparound due to today
       }
       &.calendar-day-heading {  //day of week heading
-        color: darken($fg_color,4%);
+        color: darken($fg_color, 10%);
         margin-top: 1em;
         font-size: 70%;
       }
@@ -1017,18 +1022,15 @@ StScrollBar {
         width: 31.5em;
         .message-title{
           color: darken($fg_color,5%);
-          
         }
         .message-content{
-        
+          
         }
       }
 
         .message-list-clear-button.button {
-          background-color: transparent;
-          border: 1px solid $borders_color;
-          box-shadow: none;
-          &:hover,&:focus { background-color: lighten($bg_color,5%); }
+          @include button(normal);
+          &:hover,&:focus { @include button(hover); }
           margin: 1.5em 1.5em 0;
         }
 
@@ -1058,7 +1060,8 @@ StScrollBar {
 
         .message {
           &:hover,&:focus { 
-            background-color: lighten($bg_color,2%);
+            background-color: darken($bg_color, 1%);
+            //@include gradient();
             box-shadow: 3px 0px 0px 0px $selected_bg_color inset;
            }
           border-radius: 1px;
@@ -1156,16 +1159,20 @@ StScrollBar {
     color: $fg_color;
    
     border-radius: 32px; /* wish we could do 50% */
-    border: 1px solid transparent;
-    background: transparent;
+    border: 1px solid $borders_color;
+    background: darken($bg_color, 3%);
     padding: 13px;
 
     &:hover, &:focus {
-      //border: 1px solid $selected_bg_color;
+      border: 1px solid $selected_bg_color;
       color: $selected_bg_color;
       background: transparent;
     }
-    &:active { background-color: darken($selected_bg_color, 10%); color: $selected_fg_color;}
+    &:active {
+       background-color: darken($selected_bg_color, 10%);
+       color: $selected_fg_color; 
+       border: 1px solid darken($selected_bg_color, 10%);
+      }
 
     & > StIcon { icon-size: 16px; }
   }
@@ -1269,7 +1276,7 @@ StScrollBar {
   }
   .window-caption {
     spacing: 20px;
-    color: $fg_color;
+    color: $topbar_color;
     background-color: transparentize($osd_bg_color,.3);
     border-radius: 2px;
     padding: 4px 8px;
@@ -1278,8 +1285,8 @@ StScrollBar {
   //search entry
   .search-entry {
     width: 320px;
-    padding: 7px 9px;
-    border-radius: 2px;
+    padding: 9px;
+    border-radius: 100px;
     border: none;
     color: $fg_color;
     background-color: transparentize($bg_color, 0.4);
@@ -1335,7 +1342,7 @@ StScrollBar {
     color: $topbar_color;
     background-color: $topbar_bg_color;
     padding: 6px 0;
-    border: 1px solid rgba(128, 128, 128, 0.2);
+    border: 1px solid $borders_color;
     border-left: 0px;
     border-radius: 0px 5px 5px 0px;
 
@@ -1364,7 +1371,7 @@ StScrollBar {
     border-radius: 7px;
     padding: 4px 12px;
     color: $topbar_color;
-    background-color: transparentize($topbar_bg_color,0.01);
+    background-color: $topbar_bg_color;
     text-align: center;
     -x-offset: 8px;
   }
@@ -1442,7 +1449,7 @@ StScrollBar {
     width: 4px; height: 4px;
     background-color: $selected_bg_color;
     border-radius: 10px !important;
-    box-shadow: 0px 0px 5px 4px transparentize($selected_bg_color, 0.2);
+    box-shadow: 0px 0px 5px 4px transparentize($selected_bg_color,0.2);
     margin-bottom: 0px;
   }
 
@@ -1691,15 +1698,13 @@ StScrollBar {
   .keyboard-row { spacing: 15px; }
 
   .keyboard-key {
-    @include button(normal);
-    background: $base_color;
+   @include button(normal);
+    background-color: $base_color;
     min-height: 2em;
     min-width: 2em;
     font-size: 14pt;
     font-weight: bold;
     border-radius: 5px;
-    border: 1px solid $borders-color;
-    color: white;
     &:focus { @include button(focus); }
     &:hover,&:checked { @include button(hover); }
     &:active { @include button(active);}
diff --git a/gnome-shell/_drawing.scss b/gnome-shell/_drawing.scss
index 81f6f03..70a90f0 100644
--- a/gnome-shell/_drawing.scss
+++ b/gnome-shell/_drawing.scss
@@ -56,7 +56,7 @@
 //
 
   @if $t==normal {
-    background-color: transparentize($gray, 0.5);
+    background-color: $gray;
     border-color: $borders_color;
  
     @include _shadows($depth);
@@ -149,11 +149,12 @@
   //
 
     color: $fg_color;
-    background-color: darken($bg_color,5%);
-    box-shadow: $depth4;
-    border: none;
+    background-color: $main_dark;
+    box-shadow: none;
+    border: 1px solid $borders_color;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
+    border: 1px solid $borders_color;
   }
   @if $t==focus {
   //
@@ -162,11 +163,11 @@
     $_bg: if($c!=$osd_bg_color, transparentize($c, 0.5),
                           $osd_bg_color);
 
-    color: $osd_fg_color;
+    color: $selected_bg_color;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
-    box-shadow: $depth5;
-    border: 1px solid  transparentize($selected_bg_color, 0.7);
+    box-shadow: none;
+    border: 1px solid $borders_color;
   }
 
   @else if $t==hover {
@@ -174,12 +175,11 @@
   // active osd button
   //
     $_bg: if($c!=$osd_bg_color, transparentize($c, 0.3),
-                            lighten($osd_bg_color,10%));
+                            lighten($main_dark, 2%));
 
     color: $selected_bg_color;
     background-color: $_bg;
-    box-shadow: $depth5;
-    border: none;
+    border: 1px solid $borders_color;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
 
@@ -195,8 +195,7 @@
     // This should be none, but it's creating some issues with borders, so to
     // workaround it for now, use inset wich goes through a different code path.
     // see https://bugzilla.gnome.org/show_bug.cgi?id=752934
-    box-shadow: $depth5;
-    border: none;
+    border: 1px solid $borders_color;
     text-shadow: none;
     icon-shadow: none;
   }
@@ -228,3 +227,9 @@
     icon-shadow: none;
   }
 }
+
+@mixin gradient($c1: $g1, $c2: $g2, $dir: horizontal) {
+  background-gradient-start: $c1;
+  background-gradient-end: $c2;
+  background-gradient-direction: $dir;
+}
\ No newline at end of file
diff --git a/gnome-shell/assets/close-window.svg b/gnome-shell/assets/close-window.svg
index cf0a13b..442ce2a 100644
--- a/gnome-shell/assets/close-window.svg
+++ b/gnome-shell/assets/close-window.svg
@@ -7,6 +7,7 @@
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
    xmlns:svg="http://www.w3.org/2000/svg"
    xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    version="1.0"
@@ -26,6 +27,14 @@
          rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
            rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title /></cc:Work></rdf:RDF></metadata><defs
      id="defs2397"><linearGradient
+       inkscape:collect="always"
+       id="linearGradient844"><stop
+         style="stop-color:#eee90a;stop-opacity:1"
+         offset="0"
+         id="stop840" /><stop
+         style="stop-color:#f7b922;stop-opacity:1"
+         offset="1"
+         id="stop842" /></linearGradient><linearGradient
        id="linearGradient3173"><stop
          style="stop-color:#c4c4c4;stop-opacity:1;"
          offset="0"
@@ -38,7 +47,15 @@
        inkscape:vp_y="0 : 1000 : 0"
        inkscape:vp_z="16 : 8 : 1"
        inkscape:persp3d-origin="8 : 5.3333333 : 1"
-       id="perspective2401" /></defs><sodipodi:namedview
+       id="perspective2401" /><linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient844"
+       id="linearGradient846"
+       x1="0.7272726"
+       y1="11.636364"
+       x2="22.545454"
+       y2="11.636364"
+       gradientUnits="userSpaceOnUse" /></defs><sodipodi:namedview
      inkscape:window-height="713"
      inkscape:window-width="1366"
      inkscape:pageshadow="2"
@@ -51,9 +68,9 @@
      pagecolor="#000000"
      id="base"
      showgrid="true"
-     inkscape:zoom="67.500002"
-     inkscape:cx="9.2108146"
-     inkscape:cy="16.069558"
+     inkscape:zoom="8.898926"
+     inkscape:cx="-8.6470183"
+     inkscape:cy="19.955159"
      inkscape:window-x="0"
      inkscape:window-y="25"
      inkscape:current-layer="Foreground"
@@ -72,11 +89,15 @@
      clip-rule="evenodd"
      d="m 0.7272726,11.636364 c 0,-6.0245464 4.8845457,-10.90909163 10.9090924,-10.90909163 6.024543,0 10.909089,4.88454523 10.909089,10.90909163 0,6.024546 -4.884546,10.909091 -10.909089,10.909091 -6.0245467,0 -10.9090924,-4.884545 -10.9090924,-10.909093 z"
      id="path2394-32"
-     style="color:#000000;fill:#f7b922;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.4545455;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+     style="color:#000000;fill:url(#linearGradient846);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.4545455;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
      sodipodi:nodetypes="csssc"
      inkscape:connector-curvature="0" /><g
      id="g3172-6"
      transform="translate(4.7533483,2.8238929)" /><path
+     style="color:#000000;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;fill:#1a1e21;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.30909085;marker:none;enable-background:accumulate"
+     d="m 11.636363,1.8181816 c -5.4220897,0 -9.8181798,4.3960904 -9.8181798,9.8181824 0,5.422093 4.3960901,9.818181 9.8181798,9.818181 5.422089,0 9.818182,-4.396091 9.818182,-9.818181 0,-5.422092 -4.396093,-9.8181824 -9.818182,-9.8181824 z"
+     id="path2394-32-3"
+     inkscape:connector-curvature="0" /><path
      d="m 8.9519832,7.2814498 2.6448998,2.6676769 2.68113,-2.6676769 c 1.118427,-0.9273761 2.760725,0.5779314 1.666643,1.6810017 l -2.644896,2.6676785 2.608666,2.631133 c 1.305091,1.315814 -0.493499,2.86379 -1.666647,1.681003 L 11.59688,13.274588 8.9519805,15.942266 C 7.9249237,16.97776 6.2096464,15.345788 7.285332,14.261263 L 9.9302312,11.63013 7.285332,8.9624515 C 6.1503592,7.8181541 7.8408705,6.1612084 8.9519832,7.2814498 z"
      inkscape:connector-curvature="0"
      id="path27279-0-5"
diff --git a/gnome-shell/gnome-shell.css b/gnome-shell/gnome-shell.css
index 6269208..1b5ee69 100644
--- a/gnome-shell/gnome-shell.css
+++ b/gnome-shell/gnome-shell.css
@@ -3,8 +3,7 @@
 *****************/
 /* GLOBALS */
 stage {
-  font-family: "SFNS Display", Ubuntu, Cantarell, Sans-Serif;
-  font-weight: 400;
+  font-family: Roboto, Ubuntu, Cantarell, Sans-Serif;
   font-size: 10pt;
   color: #929ba8; }
 
@@ -12,83 +11,80 @@ stage {
 /* Buttons */
 .button {
   color: #929ba8;
-  background-color: rgba(4, 4, 5, 0.93);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
-  border: none;
+  background-color: #040405;
+  box-shadow: none;
+  border: 1px solid #161819;
   text-shadow: 0 1px black;
   icon-shadow: 0 1px black;
-  border-radius: 2px;
+  border: 1px solid #161819;
+  border-radius: 4px;
   border-width: 0;
   padding: 4px 32px; }
   .button:focus {
-    color: #929ba8;
+    color: #f7b922;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: 1px solid rgba(247, 185, 34, 0.3); }
+    box-shadow: none;
+    border: 1px solid #161819; }
   .button:insensitive {
-    color: rgba(86, 90, 99, 0.965);
-    background-color: rgba(32, 33, 37, 0.597);
+    color: #51565d;
+    background-color: rgba(30, 31, 35, 0.66);
     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
     border: none;
     text-shadow: none;
     icon-shadow: none; }
   .button:active {
     color: #f7b922;
-    background-color: rgba(16, 16, 19, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: rgba(16, 16, 19, 0.95);
+    border: 1px solid #161819;
     text-shadow: none;
     icon-shadow: none; }
   .button:hover {
     color: #f7b922;
-    background-color: rgba(39, 39, 47, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: #09090b;
+    border: 1px solid #161819;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black; }
 
 .modal-dialog-linked-button {
   padding: 10px;
-  border: none;
+  border: 1px solid #161819;
   color: #929ba8;
-  background-color: transparent;
+  background: #040405;
   text-shadow: none;
-  icon-shadow: none; }
+  icon-shadow: none;
+  box-shadow: none; }
   .modal-dialog-linked-button:insensitive {
-    color: rgba(86, 90, 99, 0.965);
-    background-color: rgba(32, 33, 37, 0.597);
+    color: #51565d;
+    background-color: rgba(30, 31, 35, 0.66);
     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
     border: none;
     text-shadow: none;
     icon-shadow: none; }
   .modal-dialog-linked-button:active {
     color: #f7b922;
-    background-color: rgba(16, 16, 19, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: rgba(16, 16, 19, 0.95);
+    border: 1px solid #161819;
     text-shadow: none;
     icon-shadow: none; }
   .modal-dialog-linked-button:focus {
-    color: #929ba8;
+    color: #f7b922;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: 1px solid rgba(247, 185, 34, 0.3); }
+    box-shadow: none;
+    border: 1px solid #161819; }
     .modal-dialog-linked-button:focus:hover {
-      color: #929ba8;
+      color: #f7b922;
       text-shadow: 0 1px black;
       icon-shadow: 0 1px black;
-      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-      border: 1px solid rgba(247, 185, 34, 0.3); }
+      box-shadow: none;
+      border: 1px solid #161819; }
   .modal-dialog-linked-button:hover {
     color: #f7b922;
-    background-color: rgba(39, 39, 47, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: #09090b;
+    border: 1px solid #161819;
     text-shadow: 0 1px black;
-    icon-shadow: 0 1px black;
-    background: transparent; }
+    icon-shadow: 0 1px black; }
   .modal-dialog-linked-button:first-child {
     border-radius: 0px 0px 0px 2px; }
   .modal-dialog-linked-button:last-child {
@@ -98,8 +94,8 @@ stage {
 
 /* Entries */
 StEntry {
-  background-color: rgba(51, 51, 61, 0.5);
-  border-color: rgba(51, 51, 61, 0.3);
+  background-color: #202026;
+  border-color: #161819;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22);
   border-radius: 2px;
   padding: 4px;
@@ -110,11 +106,11 @@ StEntry {
   StEntry:focus {
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); }
   StEntry:insensitive {
-    color: rgba(86, 90, 99, 0.965);
+    color: #51565d;
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); }
   StEntry StIcon.capslock-warning {
     icon-size: 16px;
-    warning-color: #ff9f39;
+    warning-color: #f47d49;
     padding: 0 4px; }
 
 /* Scrollbars */
@@ -134,22 +130,22 @@ StScrollBar {
     background-color: transparent; }
   StScrollBar StButton#vhandle, StScrollBar StButton#hhandle {
     border-radius: 8px;
-    background-color: rgba(45, 47, 52, 0.944);
+    background-color: #2a2c31;
     margin: 3px; }
     StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
-      background-color: rgba(123, 130, 141, 0.986); }
+      background-color: #787f8a; }
     StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
       background-color: #f7b922; }
 
 /* Slider */
 .slider {
   height: 1em;
-  color: #f7f7f7;
+  color: #b7b7b7;
   border-color: black;
-  -slider-height: 0.3em;
-  -slider-background-color: #33333d;
+  -slider-height: 0.1em;
+  -slider-background-color: #202026;
   -slider-border-color: black;
-  -slider-active-background-color: #f7b922;
+  -slider-active-background-color: #71f79f;
   -slider-active-border-color: #71f79f;
   -slider-border-width: 0;
   -slider-handle-radius: 6px; }
@@ -208,7 +204,7 @@ StScrollBar {
   border: none;
   border-radius: 2px;
   color: #929ba8;
-  background-color: rgba(4, 4, 5, 0.88);
+  background-color: rgba(4, 4, 5, 0.95);
   box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.2); }
   .modal-dialog .modal-dialog-content-box {
     padding: 24px; }
@@ -256,10 +252,13 @@ StScrollBar {
   spacing: 42px;
   border: none; }
   .end-session-dialog .modal-dialog-linked-button:last-child {
-    color: #e6133e; }
-    .end-session-dialog .modal-dialog-linked-button:last-child:focus {
-      color: #e6133e;
-      border: 1px solid rgba(230, 19, 62, 0.3); }
+    background-gradient-start: #eee90a;
+    background-gradient-end: #f7b922;
+    background-gradient-direction: horizontal;
+    color: #fff; }
+    .end-session-dialog .modal-dialog-linked-button:last-child:hover, .end-session-dialog .modal-dialog-linked-button:last-child:focus {
+      background: #d7123a;
+      color: #fff; }
 
 .end-session-dialog-list {
   padding-top: 20px; }
@@ -277,7 +276,7 @@ StScrollBar {
 
 .end-session-dialog-warning {
   width: 28em;
-  color: #ff9f39;
+  color: #f47d49;
   padding-top: 6px; }
   .end-session-dialog-warning:rtl {
     text-align: right; }
@@ -414,7 +413,7 @@ StScrollBar {
     padding-right: 10px; }
 
 .polkit-dialog-user-root-label {
-  color: #ff9f39; }
+  color: #f47d49; }
 
 .polkit-dialog-user-icon {
   border-radius: 3px;
@@ -484,7 +483,7 @@ StScrollBar {
   min-width: 15em;
   background-color: transparent; }
   .popup-menu .popup-sub-menu {
-    background-color: rgba(0, 0, 0, 0.13);
+    background-color: rgba(0, 0, 0, 0.2);
     box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.2); }
   .popup-menu .popup-menu-content {
     padding: 1em 0em; }
@@ -495,9 +494,11 @@ StScrollBar {
     .popup-menu .popup-menu-item:rtl {
       padding: .4em 0em .4em 1.75em; }
     .popup-menu .popup-menu-item:checked {
-      background-color: rgba(247, 185, 34, 0.9);
+      background-gradient-start: #eee90a;
+      background-gradient-end: #f7b922;
+      background-gradient-direction: horizontal;
       color: #f7f7f7;
-      box-shadow: inset 0 1px 0px rgba(63, 63, 74, 0.3);
+      box-shadow: inset 0 1px 0px #222526;
       font-weight: bold; }
       .popup-menu .popup-menu-item:checked:hover {
         background-color: rgba(247, 185, 34, 0.9);
@@ -524,10 +525,10 @@ StScrollBar {
 
 .popup-menu-boxpointer,
 .candidate-popup-boxpointer {
-  -arrow-border-radius: 3px;
-  -arrow-background-color: rgba(16, 16, 19, 0.93);
+  -arrow-border-radius: 7px;
+  -arrow-background-color: #101013;
   -arrow-border-width: 1px;
-  -arrow-border-color: rgba(51, 51, 61, 0.3);
+  -arrow-border-color: #161819;
   -arrow-base: 24px;
   -arrow-rise: 11px;
   -arrow-box-shadow: 0 1px 3px black; }
@@ -561,8 +562,9 @@ StScrollBar {
   .osd-window .level {
     height: 0.4em;
     border-radius: 0.3em;
-    background-color: rgba(51, 51, 61, 0.5);
-    color: #929ba8; }
+    background-color: rgba(0, 0, 0, 0.5);
+    color: #929ba8;
+    border: 1px solid #161819; }
   .osd-window .level-bar {
     background-color: #f7b922;
     border-radius: 0.3em; }
@@ -593,7 +595,7 @@ StScrollBar {
 
 .switcher-list .item-box:outlined {
   padding: 6px;
-  border: 2px solid rgba(28, 28, 33, 0.3); }
+  border: 2px solid black; }
 
 .switcher-list .item-box:selected {
   background-color: #f7b922;
@@ -608,7 +610,7 @@ StScrollBar {
 
 .switcher-list .separator {
   width: 1px;
-  background: rgba(51, 51, 61, 0.3); }
+  background: #161819; }
 
 .switcher-arrow {
   border-color: rgba(0, 0, 0, 0);
@@ -652,14 +654,14 @@ StScrollBar {
 .ws-switcher-box {
   height: 50px;
   border: 1px solid rgba(146, 155, 168, 0.1);
-  background: rgba(0, 0, 0, 0.88);
+  background: rgba(0, 0, 0, 0.95);
   border-radius: 8px; }
 
 .osd-window,
 .resize-popup,
 .switcher-list, .workspace-switcher-container {
   color: #929ba8;
-  background-color: rgba(16, 16, 19, 0.88);
+  background-color: rgba(16, 16, 19, 0.95);
   border: none;
   border-radius: 2px;
   padding: 12px; }
@@ -681,7 +683,7 @@ StScrollBar {
 /* TOP BAR */
 #panel {
   background-gradient-direction: none;
-  background-color: rgba(0, 0, 0, 0.65);
+  background-color: rgba(16, 16, 19, 0.65);
   /* transition from solid to transparent */
   transition-duration: 500ms;
   font-weight: bold;
@@ -706,7 +708,7 @@ StScrollBar {
     -natural-hpadding: 12px;
     -minimum-hpadding: 6px;
     font-weight: bold;
-    color: #848e9c;
+    color: white;
     text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9);
     transition-duration: 100ms; }
     #panel .panel-button .app-menu-icon {
@@ -718,19 +720,29 @@ StScrollBar {
     #panel .panel-button .popup-menu-arrow {
       icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); }
     #panel .panel-button:hover {
-      background: rgba(26, 26, 26, 0.65);
-      color: #a0a8b3;
-      text-shadow: 0px 0px 8px black; }
-      #panel .panel-button:hover .system-status-icon,
-      #panel .panel-button:hover .app-menu-icon > StIcon,
-      #panel .panel-button:hover .popup-menu-arrow {
-        icon-shadow: 0px 0px 8px black; }
+      background: rgba(39, 39, 47, 0.65);
+      color: white;
+      transition-duration: 200ms; }
     #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
-      background: rgba(26, 26, 26, 0.65);
-      box-shadow: inset 0 -2px 0px #f8c13b;
-      color: #a0a8b3; }
+      box-shadow: none;
+      background-gradient-start: #eee90a;
+      background-gradient-end: #f7b922;
+      background-gradient-direction: horizontal;
+      color: #f7f7f7;
+      text-shadow: 0px 0px 2px rgba(92, 92, 92, 0.9);
+      transition-duration: 200ms; }
+      #panel .panel-button:active .system-status-icon,
+      #panel .panel-button:active .app-menu-icon > StIcon,
+      #panel .panel-button:active .popup-menu-arrow, #panel .panel-button:overview .system-status-icon,
+      #panel .panel-button:overview .app-menu-icon > StIcon,
+      #panel .panel-button:overview .popup-menu-arrow, #panel .panel-button:focus .system-status-icon,
+      #panel .panel-button:focus .app-menu-icon > StIcon,
+      #panel .panel-button:focus .popup-menu-arrow, #panel .panel-button:checked .system-status-icon,
+      #panel .panel-button:checked .app-menu-icon > StIcon,
+      #panel .panel-button:checked .popup-menu-arrow {
+        icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); }
       #panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon {
-        icon-shadow: black 0 2px 2px; }
+        icon-shadow: red 0 2px 2px; }
     #panel .panel-button .system-status-icon {
       icon-size: 1.09em;
       padding: 0 5px; }
@@ -752,9 +764,9 @@ StScrollBar {
   #panel .power-status.panel-status-indicators-box {
     spacing: 0; }
   #panel .screencast-indicator {
-    color: #ff9f39; }
+    color: #f47d49; }
   #panel.solid {
-    background-color: #0e0e10;
+    background-color: #101013;
     /* transition from transparent to solid */
     transition-duration: 300ms; }
     #panel.solid .panel-corner {
@@ -786,7 +798,8 @@ StScrollBar {
   spacing: 1em; }
 
 .datemenu-calendar-column {
-  border: 0 solid rgba(51, 51, 61, 0.3); }
+  border: 0 solid transparent;
+  background: #0e0e11; }
   .datemenu-calendar-column:ltr {
     border-left-width: 1px; }
   .datemenu-calendar-column:rtl {
@@ -815,7 +828,7 @@ StScrollBar {
 .events-section-title:focus,
 .message-list-section-title:hover,
 .message-list-section-title:focus {
-  background-color: rgba(28, 28, 33, 0.93); }
+  background-color: #1c1c21; }
 
 .datemenu-today-button:active,
 .world-clocks-button:active,
@@ -832,7 +845,7 @@ StScrollBar {
 .weather-header,
 .events-section-title,
 .message-list-section-title {
-  color: #98a0ac;
+  color: #768191;
   font-weight: bold; }
 
 .world-clocks-grid {
@@ -854,7 +867,7 @@ StScrollBar {
   .pager-button:hover, .pager-button:focus {
     background-color: rgba(146, 155, 168, 0.05); }
   .pager-button:active {
-    background-color: rgba(16, 16, 19, 0); }
+    background-color: rgba(16, 16, 19, 0.05); }
 
 .calendar-change-month-back {
   background-image: url("assets/calendar-arrow-left.svg"); }
@@ -875,13 +888,13 @@ StScrollBar {
   margin: 2px;
   border-radius: 1.4em; }
   .calendar-day-base:hover, .calendar-day-base:focus {
-    background-color: rgba(28, 28, 33, 0.93); }
+    background-color: #1c1c21; }
   .calendar-day-base:active, .calendar-day-base:selected {
-    color: white;
+    color: #f7f7f7;
     background-color: #f7b922;
     border-color: transparent; }
   .calendar-day-base.calendar-day-heading {
-    color: #87919f;
+    color: #768191;
     margin-top: 1em;
     font-size: 70%; }
 
@@ -895,11 +908,11 @@ StScrollBar {
   border-left-width: 1px; }
 
 .calendar-nonwork-day {
-  color: rgba(86, 90, 99, 0.965); }
+  color: #51565d; }
 
 .calendar-today {
   font-weight: bold;
-  border: 1px solid rgba(51, 51, 61, 0); }
+  border: 1px solid rgba(22, 24, 25, 0.5); }
 
 .calendar-day-with-events {
   color: #afb5be;
@@ -907,7 +920,7 @@ StScrollBar {
   background-image: url("assets/calendar-today.svg"); }
 
 .calendar-other-month-day {
-  color: rgba(86, 90, 99, 0.965);
+  color: #51565d;
   opacity: 0.5; }
 
 .calendar-week-number {
@@ -919,7 +932,7 @@ StScrollBar {
   padding: 0.5em 0 0;
   margin: 6px;
   background-color: rgba(146, 155, 168, 0.3);
-  color: rgba(16, 16, 19, 0.93); }
+  color: #101013; }
 
 /* Message list */
 .message-list {
@@ -928,12 +941,20 @@ StScrollBar {
     color: #848e9c; }
 
 .message-list-clear-button.button {
-  background-color: transparent;
-  border: 1px solid rgba(51, 51, 61, 0.3);
+  color: #929ba8;
+  background-color: #040405;
   box-shadow: none;
+  border: 1px solid #161819;
+  text-shadow: 0 1px black;
+  icon-shadow: 0 1px black;
+  border: 1px solid #161819;
   margin: 1.5em 1.5em 0; }
   .message-list-clear-button.button:hover, .message-list-clear-button.button:focus {
-    background-color: rgba(28, 28, 33, 0.93); }
+    color: #f7b922;
+    background-color: #09090b;
+    border: 1px solid #161819;
+    text-shadow: 0 1px black;
+    icon-shadow: 0 1px black; }
 
 .message-list-sections {
   spacing: 1em; }
@@ -958,7 +979,7 @@ StScrollBar {
   border-radius: 1px;
   background: transparent; }
   .message:hover, .message:focus {
-    background-color: rgba(21, 21, 25, 0.93);
+    background-color: #0e0e10;
     box-shadow: 3px 0px 0px 0px #f7b922 inset; }
 
 .message-icon-bin {
@@ -1004,9 +1025,9 @@ StScrollBar {
 .media-message-cover-icon {
   icon-size: 48px !important; }
   .media-message-cover-icon.fallback {
-    color: rgba(39, 39, 47, 0.93);
-    background-color: rgba(16, 16, 19, 0.93);
-    border: 2px solid rgba(16, 16, 19, 0.93);
+    color: #27272f;
+    background-color: #101013;
+    border: 2px solid #101013;
     border-radius: 2px;
     icon-size: 16px;
     padding: 8px; }
@@ -1034,15 +1055,17 @@ StScrollBar {
   color: #929ba8;
   border-radius: 32px;
   /* wish we could do 50% */
-  border: 1px solid transparent;
-  background: transparent;
+  border: 1px solid #161819;
+  background: #09090b;
   padding: 13px; }
   .system-menu-action:hover, .system-menu-action:focus {
+    border: 1px solid #f7b922;
     color: #f7b922;
     background: transparent; }
   .system-menu-action:active {
     background-color: #dea008;
-    color: #f7f7f7; }
+    color: #f7f7f7;
+    border: 1px solid #dea008; }
   .system-menu-action > StIcon {
     icon-size: 16px; }
 
@@ -1100,14 +1123,14 @@ StScrollBar {
   icon-size: 32px; }
 
 .nm-dialog-scroll-view {
-  border: 2px solid rgba(51, 51, 61, 0.3); }
+  border: 2px solid #161819; }
 
 .nm-dialog-header {
   font-weight: bold; }
 
 .nm-dialog-item {
   font-size: 110%;
-  border-bottom: 1px solid rgba(51, 51, 61, 0.3);
+  border-bottom: 1px solid #161819;
   padding: 12px;
   spacing: 20px; }
 
@@ -1148,30 +1171,30 @@ StScrollBar {
 
 .window-caption {
   spacing: 20px;
-  color: #929ba8;
-  background-color: rgba(16, 16, 19, 0.58);
+  color: white;
+  background-color: rgba(16, 16, 19, 0.65);
   border-radius: 2px;
   padding: 4px 8px; }
 
 .search-entry {
   width: 320px;
-  padding: 7px 9px;
-  border-radius: 2px;
+  padding: 9px;
+  border-radius: 100px;
   border: none;
   color: #929ba8;
-  background-color: rgba(16, 16, 19, 0.53);
+  background-color: rgba(16, 16, 19, 0.6);
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); }
   .search-entry:focus {
     border-width: 0;
     color: #929ba8;
-    background-color: rgba(16, 16, 19, 0.73);
+    background-color: rgba(16, 16, 19, 0.8);
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.3); }
   .search-entry .search-entry-icon {
     icon-size: 1em;
     padding: 0 4px;
     color: rgba(146, 155, 168, 0.7); }
   .search-entry:hover, .search-entry:focus {
-    background-color: rgba(16, 16, 19, 0.73); }
+    background-color: rgba(16, 16, 19, 0.8); }
     .search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon {
       color: #929ba8; }
 
@@ -1200,15 +1223,15 @@ StScrollBar {
   spacing: 30px; }
 
 .list-search-result-title {
-  color: #929ba8;
+  color: white;
   spacing: 12px; }
 
 .list-search-result-description {
-  color: rgba(175, 181, 190, 0.5); }
+  color: rgba(255, 255, 255, 0.5); }
 
 .list-search-provider-details {
   width: 150px;
-  color: #929ba8;
+  color: white;
   margin-top: 0.24em; }
 
 .list-search-provider-content {
@@ -1220,10 +1243,10 @@ StScrollBar {
 /* DASHBOARD */
 #dash {
   font-size: 9pt;
-  color: #848e9c;
-  background-color: rgba(0, 0, 0, 0.65);
+  color: white;
+  background-color: rgba(16, 16, 19, 0.65);
   padding: 6px 0;
-  border: 1px solid rgba(128, 128, 128, 0.2);
+  border: 1px solid #161819;
   border-left: 0px;
   border-radius: 0px 5px 5px 0px; }
   #dash:rtl {
@@ -1242,8 +1265,8 @@ StScrollBar {
 .dash-label {
   border-radius: 7px;
   padding: 4px 12px;
-  color: #848e9c;
-  background-color: rgba(0, 0, 0, 0.64);
+  color: white;
+  background-color: rgba(16, 16, 19, 0.65);
   text-align: center;
   -x-offset: 8px; }
 
@@ -1268,9 +1291,8 @@ StScrollBar {
   padding: 4px 32px; }
   .app-view-control:checked {
     color: #f7b922;
-    background-color: rgba(16, 16, 19, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: rgba(16, 16, 19, 0.95);
+    border: 1px solid #161819;
     text-shadow: none;
     icon-shadow: none; }
   .app-view-control:first-child {
@@ -1282,13 +1304,13 @@ StScrollBar {
 .search-provider-icon:active, .search-provider-icon:checked,
 .list-search-result:active,
 .list-search-result:checked {
-  background-color: rgba(0, 0, 0, 0.78); }
+  background-color: rgba(0, 0, 0, 0.85); }
 
 .search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover,
 .list-search-result:focus,
 .list-search-result:selected,
 .list-search-result:hover {
-  background-color: rgba(16, 16, 19, 0.23);
+  background-color: rgba(16, 16, 19, 0.3);
   transition-duration: 200ms; }
 
 .app-well-app,
@@ -1304,7 +1326,7 @@ StScrollBar {
   .show-apps:checked .overview-icon,
   .grid-search-result:active .overview-icon,
   .grid-search-result:checked .overview-icon {
-    background-color: rgba(0, 0, 0, 0.78);
+    background-color: rgba(0, 0, 0, 0.85);
     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.3);
     color: #929ba8; }
   .app-well-app:hover .overview-icon,
@@ -1319,7 +1341,7 @@ StScrollBar {
   .grid-search-result:hover .overview-icon,
   .grid-search-result:focus .overview-icon,
   .grid-search-result:selected .overview-icon {
-    background-color: rgba(16, 16, 19, 0.43);
+    background-color: rgba(16, 16, 19, 0.5);
     transition-duration: 0ms;
     border-image: none;
     background-image: none; }
@@ -1346,10 +1368,10 @@ StScrollBar {
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.22); }
 
 .app-well-app.app-folder > .overview-icon {
-  background-color: rgba(16, 16, 19, 0.28); }
+  background-color: rgba(16, 16, 19, 0.35); }
 
 .show-apps .show-apps-icon {
-  color: #848e9c; }
+  color: white; }
 
 .show-apps:checked .show-apps-icon,
 .show-apps:focus .show-apps-icon {
@@ -1358,13 +1380,13 @@ StScrollBar {
 
 .app-folder-popup {
   -arrow-border-radius: 8px;
-  -arrow-background-color: rgba(16, 16, 19, 0.43);
+  -arrow-background-color: rgba(16, 16, 19, 0.5);
   -arrow-base: 24px;
   -arrow-rise: 11px; }
 
 .app-folder-popup-bin {
   padding: 5px;
-  background: rgba(16, 16, 19, 0.43); }
+  background: rgba(16, 16, 19, 0.5); }
 
 .app-folder-icon {
   padding: 5px;
@@ -1432,14 +1454,14 @@ StScrollBar {
   width: 34em;
   margin: 5px;
   border-radius: 3px;
-  color: #848e9c;
-  background-color: rgba(16, 16, 19, 0.93);
-  border: 1px solid rgba(51, 51, 61, 0.3);
+  color: white;
+  background-color: #101013;
+  border: 1px solid #161819;
   box-shadow: 0 1px 4px black; }
   .notification-banner:hover {
-    background-color: rgba(16, 16, 19, 0.89); }
+    background-color: rgba(16, 16, 19, 0.96); }
   .notification-banner:focus {
-    background-color: rgba(16, 16, 19, 0.89); }
+    background-color: rgba(16, 16, 19, 0.96); }
   .notification-banner .notification-icon {
     padding: 5px; }
   .notification-banner .notification-content {
@@ -1448,18 +1470,18 @@ StScrollBar {
   .notification-banner .secondary-icon {
     icon-size: 1.09em; }
   .notification-banner .notification-actions {
-    background-color: rgba(11, 11, 13, 0.93);
+    background-color: #0b0b0d;
     padding-top: 2px;
     spacing: 1px; }
   .notification-banner .notification-button {
     padding: 4px 4px 5px;
-    background-color: rgba(16, 16, 19, 0.83); }
+    background-color: rgba(16, 16, 19, 0.9); }
     .notification-banner .notification-button:first-child {
       border-radius: 0 0 0 3px; }
     .notification-banner .notification-button:last-child {
       border-radius: 0 0 3px 0; }
     .notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus {
-      background-color: rgba(11, 11, 13, 0.93);
+      background-color: #0b0b0d;
       color: #f7b922; }
 
 .summary-source-counter {
@@ -1532,7 +1554,7 @@ StScrollBar {
   spacing: 8px;
   border-radius: 4px; }
   .hotplug-resident-mount:hover {
-    background-color: rgba(16, 16, 19, 0.23); }
+    background-color: rgba(16, 16, 19, 0.3); }
 
 .hotplug-resident-mount-label {
   color: inherit;
@@ -1558,7 +1580,7 @@ StScrollBar {
 
 /* On-screen Keyboard */
 #keyboard {
-  background-color: rgba(16, 16, 19, 0.58); }
+  background-color: rgba(16, 16, 19, 0.65); }
 
 .keyboard-layout {
   spacing: 10px;
@@ -1569,41 +1591,38 @@ StScrollBar {
 
 .keyboard-key {
   color: #929ba8;
-  background-color: rgba(4, 4, 5, 0.93);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
-  border: none;
+  background-color: #040405;
+  box-shadow: none;
+  border: 1px solid #161819;
   text-shadow: 0 1px black;
   icon-shadow: 0 1px black;
-  background: #202127;
+  border: 1px solid #161819;
+  background-color: #202127;
   min-height: 2em;
   min-width: 2em;
   font-size: 14pt;
   font-weight: bold;
-  border-radius: 5px;
-  border: 1px solid rgba(51, 51, 61, 0.3);
-  color: white; }
+  border-radius: 5px; }
   .keyboard-key:focus {
-    color: #929ba8;
+    color: #f7b922;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black;
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: 1px solid rgba(247, 185, 34, 0.3); }
+    box-shadow: none;
+    border: 1px solid #161819; }
   .keyboard-key:hover, .keyboard-key:checked {
     color: #f7b922;
-    background-color: rgba(39, 39, 47, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: #09090b;
+    border: 1px solid #161819;
     text-shadow: 0 1px black;
     icon-shadow: 0 1px black; }
   .keyboard-key:active {
     color: #f7b922;
-    background-color: rgba(16, 16, 19, 0.88);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-    border: none;
+    background-color: rgba(16, 16, 19, 0.95);
+    border: 1px solid #161819;
     text-shadow: none;
     icon-shadow: none; }
   .keyboard-key:grayed {
-    background-color: rgba(16, 16, 19, 0.88);
+    background-color: rgba(16, 16, 19, 0.95);
     color: #929ba8;
     border-color: rgba(0, 0, 0, 0.7); }
 
@@ -1611,7 +1630,7 @@ StScrollBar {
   color: white;
   padding: 5px;
   -arrow-border-radius: 10px;
-  -arrow-background-color: rgba(16, 16, 19, 0.58);
+  -arrow-background-color: rgba(16, 16, 19, 0.65);
   -arrow-border-width: 2px;
   -arrow-border-color: #929ba8;
   -arrow-base: 20px;
@@ -1676,28 +1695,27 @@ StScrollBar {
     padding: 3px 18px; }
     .login-dialog .modal-dialog-button:default {
       color: #929ba8;
-      background-color: rgba(4, 4, 5, 0.93);
-      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
-      border: none;
+      background-color: #040405;
+      box-shadow: none;
+      border: 1px solid #161819;
       text-shadow: 0 1px black;
-      icon-shadow: 0 1px black; }
+      icon-shadow: 0 1px black;
+      border: 1px solid #161819; }
       .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus {
         color: #f7b922;
         background-color: rgba(247, 185, 34, 0.7);
-        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-        border: none;
+        border: 1px solid #161819;
         text-shadow: 0 1px black;
         icon-shadow: 0 1px black; }
       .login-dialog .modal-dialog-button:default:active {
         color: #f7b922;
         background-color: #f7b922;
-        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 2px 3px rgba(0, 0, 0, 0.3);
-        border: none;
+        border: 1px solid #161819;
         text-shadow: none;
         icon-shadow: none; }
       .login-dialog .modal-dialog-button:default:insensitive {
-        color: rgba(86, 90, 99, 0.965);
-        background-color: rgba(32, 33, 37, 0.597);
+        color: #51565d;
+        background-color: rgba(30, 31, 35, 0.66);
         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 2px 3px rgba(0, 0, 0, 0.22);
         border: none;
         text-shadow: none;
@@ -1713,7 +1731,7 @@ StScrollBar {
   spacing: 5px; }
 
 .login-dialog-message-warning {
-  color: #ff9f39; }
+  color: #f47d49; }
 
 .login-dialog-message-hint {
   padding-top: 0;
@@ -1833,7 +1851,7 @@ StScrollBar {
   .screen-shield-notifications-container .screen-shield-notification-source {
     padding: 12px 6px;
     border: 1px solid #929ba8;
-    background-color: rgba(16, 16, 19, 0.38);
+    background-color: rgba(16, 16, 19, 0.45);
     color: #929ba8;
     border-radius: 4px; }
   .screen-shield-notifications-container .notification {
@@ -1847,7 +1865,7 @@ StScrollBar {
   padding: 0px 0px 0px 12px; }
 
 #panel.lock-screen {
-  background-color: rgba(16, 16, 19, 0.38); }
+  background-color: rgba(16, 16, 19, 0.45); }
 
 .screen-shield-background {
   background: black;
@@ -1858,9 +1876,9 @@ StScrollBar {
   background-repeat: repeat; }
 
 #screenShieldNotifications StButton#vhandle, #screenShieldNotifications StButton#hhandle {
-  background-color: rgba(16, 16, 19, 0.23); }
+  background-color: rgba(16, 16, 19, 0.3); }
   #screenShieldNotifications StButton#vhandle:hover, #screenShieldNotifications StButton#vhandle:focus, #screenShieldNotifications StButton#hhandle:hover, #screenShieldNotifications StButton#hhandle:focus {
-    background-color: rgba(16, 16, 19, 0.43); }
+    background-color: rgba(16, 16, 19, 0.5); }
   #screenShieldNotifications StButton#vhandle:active, #screenShieldNotifications StButton#hhandle:active {
     background-color: rgba(247, 185, 34, 0.5); }