diff --git a/src/_colors.scss b/src/_colors.scss
--- a/src/_colors.scss
+++ b/src/_colors.scss
@@ -9,82 +9,210 @@
 // warning, it's innocuous and can be defeated by using "" + $var
 /*
 widget text/foreground color */
-@define-color theme_fg_color #{"" + w_color(text)};
+@define-color theme_fg_color #{"" + internal_w_color(text)}; // KCM'd
 
 /*
 text color for entries, views and content in general */
-@define-color theme_text_color #{"" +v_color(text)};
+@define-color theme_text_color #{"" + internal_v_color(text)}; // KCM'd
 
 /*
 widget base background color */
-@define-color theme_bg_color #{"" +w_color(normal)};
+@define-color theme_bg_color #{"" + internal_w_color(normal)}; // KCM'd
 
 /*
 text widgets and the like base background color */
-@define-color theme_base_color #{"" +v_color(normal)};
+@define-color theme_base_color #{"" + internal_v_color(normal)}; // KCM'd
+
+/*
+view hover decoation color*/
+@define-color theme_view_hover_decoration_color #{"" + internal_v_color(hover)}; // KCM'd
+
+/*
+background color of hovering selected widgets*/
+@define-color theme_hovering_selected_bg_color #{"" + internal_s_color(hover)}; // KCM'd
 
 /*
 base background color of selections */
-@define-color theme_selected_bg_color #{"" +s_color(normal)};
+@define-color theme_selected_bg_color #{"" + internal_s_color(normal)}; // KCM'd
 
 /*
 text/foreground color of selections */
-@define-color theme_selected_fg_color #{"" +s_color(text)};
+@define-color theme_selected_fg_color #{"" + internal_s_color(text)}; // KCM'd
+
+/*
+decoration color of views */
+@define-color theme_view_active_decoration_color #{"" + internal_v_color(active)}; // KCM'd
+
+/*
+base background color of insensitive selections */
+@define-color insensitive_selected_bg_color #{"" + internal_insensitive(internal_s_color(normal))};
 
 /*
 base background color of insensitive widgets */
-@define-color insensitive_bg_color #{"" +insensitive(w_color(normal))};
+@define-color insensitive_bg_color #{"" + internal_insensitive(internal_w_color(normal))};
 
 /*
 text foreground color of insensitive widgets */
-@define-color insensitive_fg_color #{"" +insensitive(w_color(text))};
+@define-color insensitive_fg_color #{"" + internal_insensitive(internal_w_color(text))};
 
 /*
 insensitive text widgets and the like base background color */
-@define-color insensitive_base_color #{"" +insensitive(v_color(text))};
+@define-color insensitive_base_color #{"" + internal_insensitive(internal_v_color(text))};
+
+/*
+insensitive text widgets and the like base foreground color */
+@define-color insensitive_base_fg_color #{"" + internal_insensitive(internal_v_color(normal))};
+
+/*
+insensitive selected text widgets and the like base background color */
+@define-color insensitive_selected_fg_color #{"" + internal_insensitive(internal_s_color(text))};
 
 /*
 widget text/foreground color on backdrop windows */
-@define-color theme_unfocused_fg_color #{"" +backdrop(w_color(text))};
+@define-color theme_unfocused_fg_color #{"" + internal_backdrop(internal_w_color(text))};
 
 /*
 text color for entries, views and content in general on backdrop windows */
-@define-color theme_unfocused_text_color #{"" +backdrop(v_color(text))};
+@define-color theme_unfocused_text_color #{"" + internal_backdrop(internal_v_color(text))};
 
 /*
 widget base background color on backdrop windows */
-@define-color theme_unfocused_bg_color #{"" +backdrop(w_color(normal))};
+@define-color theme_unfocused_bg_color #{"" + internal_backdrop(internal_w_color(normal))};
 
 /*
 text widgets and the like base background color on backdrop windows */
-@define-color theme_unfocused_base_color #{"" +backdrop(v_color(normal))};
+@define-color theme_unfocused_base_color #{"" + internal_backdrop(internal_v_color(normal))};
+
+/*
+base background color of selections on backdrop windows, alt */
+@define-color theme_unfocused_selected_bg_color_alt #{"" + internal_backdrop(internal_s_color(normal))};
 
 /*
 base background color of selections on backdrop windows */
-@define-color theme_unfocused_selected_bg_color #{"" +backdrop(s_color(backdrop))};
+@define-color theme_unfocused_selected_bg_color #{"" + internal_backdrop(internal_s_color(backdrop))};
 
 /*
 text/foreground color of selections on backdrop windows */
-@define-color theme_unfocused_selected_fg_color #{"" + backdrop(s_color(text))};
+@define-color theme_unfocused_selected_fg_color #{"" + internal_backdrop(internal_s_color(text))};
+
+/*
+base background color of insensitive selections on backdrop windows */
+@define-color insensitive_unfocused_selected_bg_color #{"" + internal_backdrop(internal_insensitive(internal_s_color(normal)))};
+
+/*
+text foreground color of insensitive widgets on backdrop windows*/
+@define-color insensitive_unfocused_fg_color #{"" + internal_backdrop(internal_insensitive(internal_w_color(text)))};
+
+/*
+backdground color of insensitive widgets on backdrop windows*/
+@define-color insensitive_unfocused_bg_color #{"" + internal_backdrop(internal_insensitive(internal_w_color(normal)))};
+
+/*
+text foreground color of insensitive selected widgets on backdrop windows*/
+@define-color insensitive_unfocused_selected_fg_color #{"" + internal_backdrop(internal_insensitive(internal_s_color(text)))};
+
+/*
+view text foreground color of insensitive widgets on backdrop windows */
+@define-color theme_unfocused_view_text_color #{"" + internal_backdrop(internal_insensitive(internal_v_color(text)))};
+
+/*
+insensitive view background color on backdrop windows */
+@define-color theme_unfocused_view_bg_color #{"" + internal_backdrop(internal_insensitive(internal_v_color(normal)))};
 
 /*
 widgets main borders color */
 @define-color borders #{"" +$border_color};
 
 /*
 widgets main borders color on backdrop windows */
-@define-color unfocused_borders #{"" +backdrop($border_color)};
+@define-color unfocused_borders #{"" + internal_backdrop($border_color)};
 
 /*
 widgets main borders color insensitive */
-@define-color insensitive_borders #{"" +insensitive($border_color)};
+@define-color insensitive_borders #{"" + internal_insensitive($border_color)};
+
+/*
+widgets main borders color insensitive backdrop */
+@define-color unfocused_insensitive_borders #{"" + internal_backdrop(internal_insensitive($border_color))};
+
+/*
+*
+* Button Colors
+*
+*/
+@define-color theme_button_background_normal #{"" + internal_b_color(normal)};
+@define-color theme_button_decoration_hover  #{"" + internal_b_color(hover)};
+@define-color theme_button_decoration_focus  #{"" + internal_b_color(active)};
+@define-color theme_button_foreground_normal #{"" + internal_b_color(text)};
+@define-color theme_button_foreground_active #{"" + internal_b_color(active-text)};
+
+@define-color theme_button_background_insensitive        #{"" + internal_insensitive(internal_b_color(normal))};
+@define-color theme_button_decoration_hover_insensitive  #{"" + internal_insensitive(internal_b_color(hover))};
+@define-color theme_button_decoration_focus_insensitive  #{"" + internal_insensitive(internal_b_color(active))};
+@define-color theme_button_foreground_insensitive        #{"" + internal_insensitive(internal_b_color(text))};
+@define-color theme_button_foreground_active_insensitive #{"" + internal_insensitive(internal_b_color(active-text))};
+
+@define-color theme_button_background_backdrop        #{"" + internal_backdrop(internal_b_color(normal))};
+@define-color theme_button_decoration_hover_backdrop  #{"" + internal_backdrop(internal_b_color(hover))};
+@define-color theme_button_decoration_focus_backdrop  #{"" + internal_backdrop(internal_b_color(active))};
+@define-color theme_button_foreground_backdrop        #{"" + internal_backdrop(internal_b_color(text))};
+@define-color theme_button_foreground_active_backdrop #{"" + internal_backdrop(internal_b_color(active-text))};
+
+@define-color theme_button_background_backdrop_insensitive        #{"" + internal_insensitive(internal_backdrop(internal_b_color(normal)))};
+@define-color theme_button_decoration_hover_backdrop_insensitive  #{"" + internal_insensitive(internal_backdrop(internal_b_color(hover)))};
+@define-color theme_button_decoration_focus_backdrop_insensitive  #{"" + internal_insensitive(internal_backdrop(internal_b_color(active)))};
+@define-color theme_button_foreground_backdrop_insensitive        #{"" + internal_insensitive(internal_backdrop(internal_b_color(text)))};
+@define-color theme_button_foreground_active_backdrop_insensitive #{"" + internal_insensitive(internal_backdrop(internal_b_color(active-text)))};
+
 /*
 these are pretty self explicative */
-@define-color warning_color #{"" +$warning_color};
-@define-color error_color #{"" +$error_color};
-@define-color success_color #{"" +$success_color};
+@define-color warning_color #{"" + $warning_color};
+@define-color error_color   #{"" + $error_color};
+@define-color success_color #{"" + $success_color};
+
+@define-color warning_color_backdrop #{"" + internal_backdrop($warning_color)};
+@define-color error_color_backdrop   #{"" + internal_backdrop($error_color)};
+@define-color success_color_backdrop #{"" + internal_backdrop($success_color)};
+
+@define-color warning_color_insensitive #{"" + internal_insensitive($warning_color)};
+@define-color error_color_insensitive   #{"" + internal_insensitive($error_color)};
+@define-color success_color_insensitive #{"" + internal_insensitive($success_color)};
+
+@define-color warning_color_insensitive_backdrop #{"" + internal_insensitive(internal_backdrop($warning_color))};
+@define-color error_color_insensitive_backdrop   #{"" + internal_insensitive(internal_backdrop($error_color))};
+@define-color success_color_insensitive_backdrop #{"" + internal_insensitive(internal_backdrop($success_color))};
+
+@define-color link_color #{"" + $link_color};
+@define-color link_visited_color #{"" + $link_visited_color};
+
+/*
+*
+* Titlebar Colors
+*
+*/
+@define-color theme_titlebar_background          #{"" + internal_t_color(background)};
+@define-color theme_titlebar_foreground          #{"" + internal_t_color(text)};
+@define-color theme_titlebar_background_light    #{"" + internal_t_color(background-light)};
+@define-color theme_titlebar_foreground_backdrop #{"" + internal_t_color(backdrop-text)};
+@define-color theme_titlebar_background_backdrop #{"" + internal_t_color(backdrop-background)};
+
+@define-color theme_titlebar_foreground_insensitive #{"" + internal_insensitive(internal_t_color(text))};
+
+@define-color theme_titlebar_foreground_insensitive_backdrop #{"" + internal_insensitive(internal_t_color(backdrop-text))};
+
+/*
+* Tooltips
+*/
+@define-color tooltip_text #{"" + internal_tooltip(text)};
+@define-color tooltip_background #{"" + internal_tooltip(background)};
+@define-color tooltip_border #{"" + internal_tooltip(border)};
+
+/*
+* Misc
+*/
+@define-color print_paper_backdrop #{"" internal_backdrop(white)};
 
-//@define-color destructive_color #{$destructive_color}
+//@!define-color destructive_color #{$destructive_color}
 
 //WM
 
@@ -95,23 +223,23 @@
 // /*
 // these colors are exported for the window manager and shouldn't be used in applications,
 // read if you used those and something break with a version upgrade you're on your own... */
-// @define-color wm_title #{$titlebar_fg_color};
-// @define-color wm_unfocused_title #{$backdrop_fg_color};
-// @define-color wm_highlight #{"" + $_wm_highlight};
-// @define-color wm_borders_edge #{"" + $borders_edge};
+// @!define-color wm_title #{$titlebar_fg_color};
+// @!define-color wm_unfocused_title #{$backdrop_fg_color};
+// @!define-color wm_highlight #{"" + $_wm_highlight};
+// @!define-color wm_borders_edge #{"" + $borders_edge};
 //
-// @define-color wm_bg_a #{$titlebar_bg_color};
-// @define-color wm_bg_b #{$titlebar_bg_color};
+// @!define-color wm_bg_a #{$titlebar_bg_color};
+// @!define-color wm_bg_b #{$titlebar_bg_color};
 //
-// @define-color wm_shadow alpha(black, 0.35);
-// @define-color wm_border alpha(black, 0.18);
+// @!define-color wm_shadow alpha(black, 0.35);
+// @!define-color wm_border alpha(black, 0.18);
 //
-// @define-color wm_button_hover_color_a shade(#{$bg_color}, 1.3);
-// @define-color wm_button_hover_color_b #{$bg_color};
-// @define-color wm_button_active_color_a shade(#{$bg_color}, 0.85);
-// @define-color wm_button_active_color_b shade(#{$bg_color}, 0.89);
-// @define-color wm_button_active_color_c shade(#{$bg_color}, 0.9);
+// @!define-color wm_button_hover_color_a shade(#{$bg_color}, 1.3);
+// @!define-color wm_button_hover_color_b #{$bg_color};
+// @!define-color wm_button_active_color_a shade(#{$bg_color}, 0.85);
+// @!define-color wm_button_active_color_b shade(#{$bg_color}, 0.89);
+// @!define-color wm_button_active_color_c shade(#{$bg_color}, 0.9);
 
 //FIXME this is really an API
 
-@define-color content_view_bg #{"" + v_color(normal)};
+@define-color content_view_bg #{"" + internal_v_color(normal)};
diff --git a/src/_functions.scss b/src/_functions.scss
--- a/src/_functions.scss
+++ b/src/_functions.scss
@@ -1,12 +1,33 @@
 @charset "UTF-8";
 
+// GTK functions
+
+// escape string entirely
+@function gtk ($str) {
+  @return unquote($str);
+}
+
+// alpha function
+@function gtkalpha($c,$a) {
+  @return unquote("alpha(#{$c},#{$a})");
+}
+
+// shade function
+@function gtkshade($c, $a) {
+  @return unquote("shade(#{$c},#{$a})");
+}
+
+// mix function
+@function gtkmix($c1, $c2, $m) {
+  @return unquote("mix(#{$c1},#{$c2},#{$m})");
+}
+
 //
 // Theme color functions
 //
 
-
 // Button Color
-@function b_color($c: normal) {
+@function internal_b_color($c: normal) {
   @if $c == normal {
     @return $ButtonBackgroundNormal;
   }
@@ -25,7 +46,7 @@
 }
 
 // Selection Color
-@function s_color($c: normal) {
+@function internal_s_color($c: normal) {
   @if $c == normal {
     @return $SelectionBackgroundNormal;
   }
@@ -41,7 +62,7 @@
 }
 
 // View Color
-@function v_color($c: normal) {
+@function internal_v_color($c: normal) {
   @if $c == normal {
     @return $ViewBackgroundNormal;
   }
@@ -57,7 +78,7 @@
 }
 
 // Window Color
-@function w_color($c: normal) {
+@function internal_w_color($c: normal) {
   @if $c == normal {
     @return $WindowBackgroundNormal;
   }
@@ -67,7 +88,7 @@
 }
 
 // Titlebar color
-@function t_color($c: text) {
+@function internal_t_color($c: text) {
   @if $c == text {
     @return $WMactiveForeground;
   }
@@ -85,7 +106,7 @@
   }
 }
 
-@function tooltip($c: text) {
+@function internal_tooltip($c: text) {
   @if $c == text {
     @return $TooltipForegroundNormal;
   }
@@ -97,7 +118,7 @@
   }
 }
 
-@function button_gradient($c, $state: normal) {
+@function internal_button_gradient($c, $state: normal) {
   @if $state == normal {
     @return linear-gradient(to bottom, change-color($c, $lightness: min(lightness($c)*1.01,100%)), change-color($c, $lightness:min(lightness($c)/1.03,100%)));
   }
@@ -107,17 +128,23 @@
 }
 
 $border_color: mix($WindowBackgroundNormal,$WindowForegroundNormal, 75%);
-$menu_color: w_color(normal);
+$menu_color: internal_w_color(normal);
 $link_color: $ViewForegroundLink;
 $link_visited_color: $ViewForegroundVisited;
 
 $warning_color: $ViewForegroundNeutral;
 $error_color: $ViewForegroundNegative;
 $success_color: $ViewForegroundPositive;
 $destructive_color: $error_color;
 
-$trough_color: mix(w_color(normal),w_color(text),70%);
-$scrollbar_color: mix($trough_color,v_color(text),50%);
+$trough_color:                      gtkmix(gtk("@theme_bg_color"),gtk("@theme_fg_color"),0.7);
+$trough_color_backdrop:             gtkmix(gtk("@theme_unfocused_bg_color"),gtk("@theme_unfocused_fg_color"),0.7);
+$trough_color_insensitive:          gtkmix(gtk("@insensitive_bg_color"),gtk("@insensitive_fg_color"),0.7);
+$trough_color_backdrop_insensitive: gtkmix(gtk("@insensitive_unfocused_bg_color"),gtk("@insensitive_unfocused_fg_color"),0.7);
+
+$scrollbar_color: gtkmix($trough_color,gtk("@theme_text_color"),0.5);
+$scrollbar_color_backdrop: gtkmix($trough_color_backdrop,gtk("@theme_unfocused_text_color"),0.5);
+
 //
 // Color effects
 //
@@ -155,57 +182,57 @@
 
 $r: 3px; // standard radius
 
-@function insensitive($c) {
-  @return Color(Intensity(Contrast($c, Disabled), Disabled), Disabled);
+@function internal_insensitive($c) {
+  @return internal_Color(internal_Intensity(internal_Contrast($c, Disabled), Disabled), Disabled);
 }
 
-@function backdrop($c) {
+@function internal_backdrop($c) {
   @if $InactiveEnable == true {
-    @return Color(Intensity(Contrast($c, Inactive), Inactive), Inactive);
+    @return internal_Color(internal_Intensity(internal_Contrast($c, Inactive), Inactive), Inactive);
   }
   @else {
     @return $c;
   }
 }
 
-@function Contrast($c, $state) {
+@function internal_Contrast($c, $state) {
 
   @if map-get($ContrastEffect, $state) == 0 {
     @return $c;
   }
 
   @if map-get($ContrastEffect, $state) == 1 {
-    @if lightness(w_color()) > lightness(w_color(text)) {
-      @if lightness($c) < lightness(w_color()) or ($c == t_color(text) and lightness(t_color(background)) <= lightness(t_color(text))) {
+    @if lightness(internal_w_color()) > lightness(internal_w_color(text)) {
+      @if lightness($c) < lightness(internal_w_color()) or ($c == internal_t_color(text) and lightness(internal_t_color(background)) <= lightness(internal_t_color(text))) {
         @return transparentize($c, map-get($ContrastAmount, $state));
       }
       @else { @return $c; }
     }
-    @if lightness(w_color()) <= lightness(w_color(text)) {
-      @if lightness($c) > lightness(w_color()) or ($c == t_color(text) and lightness(t_color(background)) > lightness(t_color(text))) {
+    @if lightness(internal_w_color()) <= lightness(internal_w_color(text)) {
+      @if lightness($c) > lightness(internal_w_color()) or ($c == internal_t_color(text) and lightness(internal_t_color(background)) > lightness(internal_t_color(text))) {
         @return transparentize($c, map-get($ContrastAmount, $state));
       }
       @else { @return $c; }
     }
   }
 
   @if map-get($ContrastEffect, $state) == 2 {
-    @if lightness(w_color()) > lightness(w_color(text)) {  // don't know what a reasonable lightness treshhold is for Contrast
-      @if lightness($c) < lightness(w_color()) or ($c == t_color(text) and lightness(t_color(background)) <= lightness(t_color(text))) {
+    @if lightness(internal_w_color()) > lightness(internal_w_color(text)) {  // don't know what a reasonable lightness treshhold is for Contrast
+      @if lightness($c) < lightness(internal_w_color()) or ($c == internal_t_color(text) and lightness(internal_t_color(background)) <= lightness(internal_t_color(text))) {
         @return transparentize($c, map-get($ContrastAmount, $state));
       }
       @else { @return $c; }
     }
-    @if lightness(w_color()) <= lightness(w_color(text)) {
-      @if lightness($c) > lightness(w_color()) or ($c == t_color(text) and lightness(t_color(background)) > lightness(t_color(text))){
+    @if lightness(internal_w_color()) <= lightness(internal_w_color(text)) {
+      @if lightness($c) > lightness(internal_w_color()) or ($c == internal_t_color(text) and lightness(internal_t_color(background)) > lightness(internal_t_color(text))){
         @return transparentize($c, map-get($ContrastAmount, $state));
       }
       @else { @return $c; }
     }
   }
 }
 
-@function Color($c, $state) {
+@function internal_Color($c, $state) {
 
   @if map-get($ColorEffect, $state) ==0 {
     @return $c;
@@ -225,7 +252,7 @@
   }
 }
 
-@function Intensity($c, $state) {
+@function internal_Intensity($c, $state) {
 
   @if map-get($IntensityEffect, $state) == 0 {
     @return $c;
@@ -253,7 +280,7 @@
   }
 }
 
-@function alpha2solid($c,$background) {
+@function internal_alpha2solid($c,$background) {
   $amount:alpha($c);
   $c:rgb(red($c),green($c),blue($c));
   @return mix($c,$background,$amount);
diff --git a/src/build_theme.sh b/src/build_theme.sh
--- a/src/build_theme.sh
+++ b/src/build_theme.sh
@@ -3,7 +3,7 @@
 
 # Usage: create_folders <target-directory>
 create_folders () {
-  for j in gtk-2.0 gtk-3.18 gtk-3.20; do
+  for j in gtk-2.0 gtk-3.0; do
     if ! [ -d "$1/$j" ]; then
         mkdir -p "$1/$j"
     fi
@@ -28,7 +28,7 @@
   fi
   echo "Installing into ${THEME_INSTALL_TARGET}"
   mkdir -p "${THEME_INSTALL_TARGET}"
-  for dir in assets gtk-2.0 gtk-3.18 gtk-3.20; do
+  for dir in assets gtk-2.0 gtk-3.0; do
     if [ -d "${THEME_INSTALL_TARGET}/$dir" ]; then
       rm -rf "${THEME_INSTALL_TARGET:?}/$dir"
     fi
@@ -44,8 +44,7 @@
   cp -R gtk2/* "${THEME_BUILD_DIR}/gtk-2.0/"
   python3 render_assets.py -c "$1" -a "${THEME_BUILD_DIR}/assets" \
     -g "${THEME_BUILD_DIR}/gtk-2.0" -G "${THEME_BUILD_DIR}" -b "$4"
-  build_sass gtk318/gtk.scss "${THEME_BUILD_DIR}/gtk-3.18/gtk.css" "${THEME_BUILD_DIR}"
-  build_sass gtk320/gtk.scss "${THEME_BUILD_DIR}/gtk-3.20/gtk.css" "${THEME_BUILD_DIR}"
+  build_sass gtk3/gtk.scss "${THEME_BUILD_DIR}/gtk-3.0/gtk.css" "${THEME_BUILD_DIR}"
   rm -f "${THEME_BUILD_DIR}/_global.scss"
   install_theme "${THEME_BUILD_DIR}" "$2" "$3"
 }
@@ -108,4 +107,4 @@
   fi
 fi
 
-render_theme "${COLOR_SCHEME}" "${THEME_NAME}" "${INSTALL_TARGET}" "${COLOR_SCHEME_ROOT}/Breeze.colors"
+render_theme "${COLOR_SCHEME}" "${THEME_NAME}" "${INSTALL_TARGET}" "${COLOR_SCHEME_ROOT}/Breeze.colors"
\ No newline at end of file
diff --git a/src/gtk-dark-3.18.css b/src/gtk-dark-3.18.css
deleted file mode 100644
--- a/src/gtk-dark-3.18.css
+++ /dev/null
@@ -1 +0,0 @@
-@import url("../../Breeze-Dark/gtk-3.18/gtk.css");
diff --git a/src/gtk-dark-3.20.css b/src/gtk-dark-3.20.css
deleted file mode 100644
--- a/src/gtk-dark-3.20.css
+++ /dev/null
@@ -1 +0,0 @@
-@import url("../../Breeze-Dark/gtk-3.20/gtk.css");
diff --git a/src/gtk-dark.css b/src/gtk-dark.css
new file mode 100644
--- /dev/null
+++ b/src/gtk-dark.css
@@ -0,0 +1 @@
+@import url("../../Breeze-Dark/gtk-3.0/gtk.css");
diff --git a/src/gtk318/gtk.scss b/src/gtk3/gtk.scss
rename from src/gtk318/gtk.scss
rename to src/gtk3/gtk.scss
--- a/src/gtk318/gtk.scss
+++ b/src/gtk3/gtk.scss
@@ -1,5 +1,7 @@
 @charset "UTF-8";
 
+$new-highlight: false;
+
 @import 'global';
 @import '../functions';
 @import '../colors';
diff --git a/src/gtk320/widgets/_app_notifications.scss b/src/gtk3/widgets/_app_notifications.scss
rename from src/gtk320/widgets/_app_notifications.scss
rename to src/gtk3/widgets/_app_notifications.scss
--- a/src/gtk320/widgets/_app_notifications.scss
+++ b/src/gtk3/widgets/_app_notifications.scss
@@ -19,11 +19,11 @@
       text-shadow: none;
       &:hover {
         @extend %undecorated_button;
-        color: b_color(hover);
+        color: gtk("@theme_button_decoration_hover");
       }
       &:active {
         @extend %undecorated_button;
-        color: b_color(active);
+        color: gtk("@theme_button_decoration_focus");
       }
       &:backdrop,
       &:disabled,
diff --git a/src/gtk320/widgets/_base.scss b/src/gtk3/widgets/_base.scss
rename from src/gtk320/widgets/_base.scss
rename to src/gtk3/widgets/_base.scss
--- a/src/gtk320/widgets/_base.scss
+++ b/src/gtk3/widgets/_base.scss
@@ -1,15 +1,11 @@
 @charset "UTF-8";
 
-@function gtkalpha($c,$a) {
-  @return unquote("alpha(#{$c},#{$a})");
-}
-
 $ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
 
 * {
   padding: 0;
   -GtkToolButton-icon-spacing: 4;
-  -GtkTextView-error-underline-color: $error_color;
+  -GtkTextView-error-underline-color: gtk("@error_color");
 
   // The size for scrollbars. The slider is 2px smaller, but we keep it
   // up so that the whole area is sensitive to button presses for the
@@ -40,14 +36,14 @@
  ***************/
 
 .background {
-  color: w_color(text);
-  background-color: w_color(normal);
+  color: gtk("@theme_fg_color");
+  background-color: gtk("@theme_bg_color");
 
   &:backdrop {
     text-shadow: none;
     -gtk-icon-shadow: none;
-    color: backdrop(w_color(text));
-    background-color: backdrop(w_color(normal));
+    color: gtk("@theme_unfocused_fg_color");
+    background-color: gtk("@theme_unfocused_bg_color");
   }
 }
 
@@ -63,38 +59,38 @@
 }
 
 .gtkstyle-fallback {
-  background-color: w_color(normal);
-  color: w_color(text);
+  background-color: gtk("@theme_bg_color");
+  color: gtk("@theme_fg_color");
   &:hover {
-    background-color: lighten(w_color(normal), 10%);
-    color: w_color(text);
+    background-color: gtkshade("@theme_bg_color", 1.1);
+    color: gtk("@theme_fg_color");
   }
   &:active {
-    background-color: darken(w_color(normal), 10%);
-    color: w_color(text);
+    background-color: gtkshade("@theme_bg_color", 0.9);
+    color: gtk("@theme_fg_color");
   }
   &:disabled {
-    background-color: insensitive(w_color(normal));
-    color: insensitive(w_color(text));
+    background-color: gtk("@insensitive_fg_color");
+    color: gtk("@insensitive_fg_color");
   }
   &:selected {
-    background-color: s_color(normal);
-    color: s_color(text);
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_selected_fg_color");
   }
 }
 
 %view,
 .view {
-  color: v_color(text);
-  background-color: v_color(normal);
+  color: gtk("@theme_text_color");
+  background-color: gtk("@theme_base_color");
 
   &:backdrop {
-    color: backdrop(v_color(text));
-    background-color: backdrop(v_color(normal));
+    color: gtk("@theme_unfocused_text_color");
+    background-color: gtk("@theme_unfocused_base_color");
   }
   
   &:disabled {
-    color: insensitive(v_color(text));
+    color: gtk("@insensitive_base_color");
   }
 
   &:selected {
@@ -115,11 +111,13 @@
 }
 
 textview border {
-  background-color: v_color(normal);
-  background-image: image($border_color); // HACK: the border node just draws background so,
+  background-color: gtk("@theme_base_color");
+  background-image: image(gtk("@borders")); // HACK: the border node just draws background so,
   background-repeat: no-repeat;                        // using a background-image to draw the border
 
-  &:backdrop { background-color: backdrop(v_color(normal)); }
+  &:backdrop { 
+    background-color: gtk("@theme_unfocused_base_color"); 
+  }
 
   &.bottom {
     background-size: 100% 1px;
@@ -144,11 +142,11 @@
 
 .rubberband,
 rubberband {
-  border: 1px solid s_color(normal);
-  background-color: transparentize(s_color(normal),0.8);
+  border: 1px solid gtk("@theme_selected_bg_color");
+  background-color: gtkalpha("@theme_selected_bg_color", 0.8);
   &:backdrop {
-    border-color: backdrop(s_color(normal));
-    background-color: backdrop(transparentize(s_color(normal),0.8));
+    border-color: gtk("@theme_unfocused_selected_bg_color");
+    background-color: gtkalpha("@theme_unfocused_selected_bg_color", 0.8);
   }
 }
 
@@ -169,23 +167,27 @@
 
 label {
   &.separator {
-    color: w_color(text);
+    color: gtk("@theme_fg_color");
     @extend .dim-label;
-    &:backdrop { color: backdrop(w_color(text)); }
+    &:backdrop { 
+      color: gtk("@theme_unfocused_fg_color");
+    }
   }
 
   selection {
-    background-color: s_color(normal);
-    color: s_color(text)
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_selected_fg_color");
   }
   &:disabled {
-    color: insensitive(w_color(text));
+    color: gtk("@insensitive_fg_color");
     selection { @extend %selected_items:disabled; }
 
-    &:backdrop { color: backdrop(insensitive(w_color(text))); }
+    &:backdrop { 
+      color: gtk("@insensitive_unfocused_fg_color")
+    }
   }
   &:backdrop {
-    color:backdrop(w_color(text));
+    color: gtk("@theme_unfocused_text_color");
 
     selction {@extend %selected_items:backdrop;}
   }
@@ -198,65 +200,69 @@
 
 assistant {
   .sidebar {
-    background-color: v_color(text);
-    border-top: 1px solid $border_color;
+    background-color: gtk("@theme_text_color");
+    border-top: 1px solid gtk("@borders");
 
     &:backdrop {
-      background-color: backdrop(v_color(text));
-      border-color: backdrop($border_color);
+      background-color: gtk("@theme_unfocused_text_color");
+      border-color: gtk("@unfocused_borders");
     }
   }
   &.csd .sidebar { border-top-style: none; }
   .sidebar label {
     padding: 6px 12px;
   }
   .sidebar label.highlight {
-    background-color: mix(v_color(normal), v_color(text), 80%);
+    background-color: gtkmix("@theme_base_color", "@theme_text_color", 0.8);
   }
 }
 
 %osd, 
 .osd {
-  color: w_color(text);
-  border: 1px solid $border_color;
-  background-color: transparentize(w_color(normal),0.2);
+  color: gtk("@theme_fg_color");
+  border: 1px solid gtk("@borders");
+  background-color: gtkalpha("@theme_bg_color",0.8);
   background-clip: padding-box;
   box-shadow: none;
   text-shadow: none;
   -gtk-icon-shadow: none;
   &:backdrop {
-    color: backdrop(w_color(text));
-    background-color: backdrop(transparentize(w_color(normal),0.2));
+    color: gtk("@theme_unfocused_text_color");
+    background-color: gtkalpha("@theme_unfocused_bg_color", 0.8);
     -gtk-icon-shadow: none;
   }
 }
 
 %selected_items {
-  background-color: s_color(normal);
-  color: s_color(text);
+  background-color: gtk("@theme_selected_bg_color");
+  color: gtk("@theme_selected_fg_color");
   &:hover {
-    background-color: s_color(hover);
-    color: w_color(text);
+    background-color: gtk("@theme_hovering_selected_bg_color");
+    color: gtk("@theme_fg_color");
   }
   &:backdrop {
-    background-color: backdrop(s_color(backdrop));
-    color: backdrop(v_color(normal));
+    background-color: gtk("@theme_unfocused_selected_bg_color");
+    color: gtk("@theme_unfocused_base_color");
   }
 }
 
 %selected_items {
-  background-color: s_color(normal);
+  background-color: gtk("@theme_selected_bg_color");
   border-radius: 0px;
 
   @at-root %nobg_selected_items, & {
-    color: s_color(text);
+    color: gtk("@theme_selected_fg_color");
 
-    &:disabled { color: insensitive(s_color(text)); }
+    &:disabled { 
+      color: gtk("@insensitive_selected_fg_color");
+    }
 
     &:backdrop {
-      color: backdrop(s_color(text));
+      color: gtk("@theme_unfocused_selected_fg_color");
 
-      &:disabled { color: backdrop(insensitive(s_color(text))); }
+      &:disabled { 
+        color: gtk("@insensitive_unfocused_selected_fg_color");
+      }
     }
   }
 }
diff --git a/src/gtk320/widgets/_button.scss b/src/gtk3/widgets/_button.scss
rename from src/gtk320/widgets/_button.scss
rename to src/gtk3/widgets/_button.scss
--- a/src/gtk320/widgets/_button.scss
+++ b/src/gtk3/widgets/_button.scss
@@ -3,7 +3,8 @@
 
 // buttons
 
-@mixin button($t, $c:b_color(normal), $tc:b_color(text)) {
+@mixin button($t) {
+// $c:gtk("@theme_button_background_normal"), $tc:gtk("@theme_button_foreground_normal")
 //
 // Button drawing function
 //
@@ -27,110 +28,105 @@
     text-shadow: none;
     -gtk-icon-shadow: none;
 
-    color: $tc;
-    border-color: if($c!=b_color(normal), $c, $border_color);
-    background-image: button_gradient($c, normal);
+    color: gtk("@theme_button_foreground_normal");
+    border-color: gtk("@borders");
+    background-color: gtk("@theme_button_background_normal");
   }
 
   @else if $t==hover {
   //
   // hovered button
   //
-    color: $tc;
-    border-color: if($c!=b_color(normal), $c, b_color(hover));
+    color: gtk("@theme_button_foreground_normal");
+    border-color: gtk("@theme_button_decoration_hover");
   }
 
   @else if $t==active {
   //
   // pushed button
   //
-    color: if($tc==b_color(text),b_color(active-text), $tc);
-    border-color: if($c!=b_color(normal), $c, b_color(active));
-    background-image: if($c!=b_color(normal), button_gradient($c, active),
-                                          button_gradient(b_color(active),active));
+    color: gtk("@theme_button_foreground_active");
+    border-color: gtk("@theme_button_decoration_focus");
+    background-color: gtk("@theme_button_decoration_focus");
   }
 
   @else if $t==active-hover {
   //
   //
   //
-    color: $tc;
-    border-color: if($c!=b_color(normal), transparentize($c, 0.5), b_color(hover));
-    background-image: if($c!=b_color(normal), button_gradient(transparentize($c, 0.5),active),
-                                        button_gradient(b_color(hover),active));
+    color: gtk("@theme_button_foreground_normal");
+    border-color: gtk("@theme_button_decoration_hover");
+    background-color: gtk("@theme_button_decoration_hover");
   }
 
   @else if $t==insensitive {
   //
   // insensitive button
   //
-    color: if($tc!=b_color(text),insensitive($tc),insensitive(b_color(text)));
-    border-color: if($c!=b_color(normal), insensitive($c), insensitive($border_color));
-    background-image: if($c!=b_color(normal), button_gradient(insensitive($c), normal),
-                                          button_gradient(insensitive(b_color(normal)), normal));
+    color: gtk("@theme_button_foreground_insensitive");
+    border-color: gtk("@insensitive_borders");
+    background-color: gtk("@theme_button_background_insensitive");
+
     > .label { color: inherit; }
   }
 
   @else if $t==insensitive-active {
   //
   // insensitive pushed button
   //
-    color: if($tc!=b_color(text), insensitive($tc), insensitive(b_color(active-text)));
-    border-color: insensitive(b_color(active));
-    background-image: if($c!=b_color(normal), button_gradient(insensitive($c), active),
-                                          button_gradient(insensitive(b_color(active)),active));
+    color: gtk("@theme_button_foreground_active_insensitive");
+    border-color: gtk("@theme_button_decoration_focus_insensitive");
+    background-color: gtk("@theme_button_decoration_focus_insensitive");
     > .label { color: inherit; }
   }
 
   @else if $t==backdrop {
   //
   // backdrop button
   //
-    color: backdrop($tc);
-    border-color: backdrop($border_color);
-    background-image: button_gradient(backdrop($c), normal);
+    color: gtk("@theme_button_foreground_backdrop");
+    border-color: gtk("@unfocused_borders");
+    background-color: gtk("@theme_button_background_backdrop");
   }
 
   @else if $t==backdrop-active {
   //
   // backdrop pushed button
   //
-    color: if($tc!=b_color(text), backdrop($tc), backdrop(b_color(active-text)));
-    border-color: if($c!=b_color(normal), backdrop($c), backdrop(b_color(active)));
-    background-image: if($c!=b_color(normal), button_gradient(backdrop($c), active),
-                                          button_gradient(backdrop(b_color(active)),active));
+    color: gtk("@theme_button_foreground_active_backdrop");
+    border-color: gtk("@theme_button_decoration_focus_backdrop");
+    background-color: gtk("@theme_button_decoration_focus_backdrop");
   }
 
   @else if $t==backdrop-insensitive {
   //
   // backdrop insensitive button
   //
-    color: backdrop(insensitive($tc));
-    border-color: if($c!=b_color(normal), backdrop(insensitive($c)), backdrop(insensitive($border_color)));
-    background-image: button_gradient(backdrop(insensitive($c)));
+    color: gtk("@theme_button_foreground_backdrop_insensitive");
+    border-color: gtk("@unfocused_insensitive_borders");
+    background-color: gtk("@theme_button_background_backdrop_insensitive");
     > .label { color: inherit; }
   }
 
   @else if $t==backdrop-insensitive-active {
   //
   // backdrop insensitive pushed button
   //
-    color: if($c!=b_color(normal), backdrop(insensitive($tc)), backdrop(insensitive(b_color(active-text))));
-    border-color: if($c!=b_color(normal), backdrop(insensitive($c)), backdrop(insensitive(b_color(active))));
-    background-image: if($c!=b_color(normal), button_gradient(backdrop(insensitive($c)), active),
-                                          button_gradient(backdrop(insensitive(b_color(active))),active));
+    color: gtk("@theme_button_foreground_active_backdrop_insensitive");
+    border-color: gtk("@theme_button_decoration_focus_backdrop_insensitive");
+    background-color: gtk("@theme_button_decoration_focus_backdrop_insensitive");
     > .label { color: inherit; }
   }
 
   @else if $t==undecorated {
   //
   // reset
   //
-    border-color: transparentize(white,1);  //FIXME needed?
+    border-color: transparent;
     background-color: transparent;
     background-image: none;
 	  box-shadow:none;
-    color: $tc;
+    color: gtk("@theme_button_foreground_normal");
 
     text-shadow: none;
     -gtk-icon-shadow: none;
@@ -142,7 +138,7 @@
  ***********/
 
 // stuff for .needs-attention
-$_dot_color: b_color(active);
+$_dot_color: gtk("@theme_button_decoration_focus");
 @keyframes needs_attention {
   from {
     background-image: -gtk-gradient(radial,
@@ -155,7 +151,7 @@
     background-image: -gtk-gradient(radial,
                                     center center, 0,
                                     center center, 0.5,
-                                    to(s_color(normal)),
+                                    to(gtk("@theme_selected_bg_color")),
                                     to(transparent));
   }
 }
@@ -182,7 +178,7 @@
         transition-duration: 500ms;
         &:active { transition: $_button_transition; }
       }
-      &:checked { background-color: $border_color;}
+      &:checked { background-color: gtk("@borders");}
     }
     &:hover {
       @include button(hover);
@@ -211,15 +207,15 @@
     &.flat:backdrop {
       -gtk-icon-effect: none;
       @include button(undecorated);
-      color: backdrop(b_color(text));
+      color: gtk("@theme_button_foreground_backdrop");
     }
     &.flat:disabled {
       @include button(undecorated);
-      color: insensitive(b_color(text));
+      color: gtk("@theme_button_foreground_insensitive");
     }
     &.flat:backdrop:disabled {
       @include button(undecorated);
-      color: backdrop(insensitive(b_color(text)));
+      color: gtk("@theme_button_foreground_backdrop_insensitive");
     }
     &:disabled {
       @include button(insensitive);
@@ -273,49 +269,69 @@
 
   @at-root %button_selected, & {
     row:selected & {
-      border-color: s_color(normal);
+      border-color: gtk("@theme_selected_bg_color");
 
       &.flat:not(:active):not(:checked):not(:hover):not(disabled) {
-        color: s_color(text);
+        color: gtk("@theme_selected_fg_color");
         border-color: transparent;
 
-        &:backdrop { color: backdrop(s_color(text)); }
+        &:backdrop { 
+          color: gtk("@theme_unfocused_selected_fg_color");
+        }
       }
     }
   }
 
   // Suggested and Destructive Action buttons
-  @each $b_type, $button_color in (suggested-action, b_color(active)),
-                              (destructive-action, $error_color) {
+  @each $b_type, $button_color in (suggested-action, gtk("@theme_button_decoration_focus")),
+                              (destructive-action, gtk("@error_color")) {
     &.#{$b_type},
     &.#{$b_type}.osd & {
-      @include button(normal, $button_color, b_color(active-text));
+      @include button(normal);
+      background-color: $button_color;
+      color: gtk("@theme_button_foreground_active");
       &.flat {
         @include button(undecorated);
         color: $button_color;
       }
-      &:hover { @include button(hover, $button_color, white); }  //FIXME no hardcoded colors
-      &:active, &:checked { @include button(active, $button_color, white); }
+      &:hover { 
+        @include button(hover); 
+        color: white; //! FIXME - No hardcoded colors.
+        background-color: $button_color;
+      }
+      &:active, &:checked { 
+        @include button(active); 
+        background-color: $button_color;
+        color: white;
+      }
       &:backdrop, &.flat:backdrop {
-        @include button(backdrop, $button_color, white);
+        @include button(backdrop);
+        background-color: $button_color;
+        color: white;
         &:active, &:checked {
-          @include button(backdrop-active, $button_color, white);
+          @include button(backdrop-active);
+          background-color: $button_color;
+          color: white;
         }
         &:disabled {
           @include button(backdrop-insensitive);
           &:active, &:checked {
-            @include button(backdrop-insensitive-active, $button_color, white);
+            @include button(backdrop-insensitive-active);
+            background-color: $button_color;
+            color: white;
           }
         }
       }
       &.flat:backdrop, &.flat:disabled, &.flat:backdrop:disabled {
         @include button(undecorated);
-        color: transparentize($button_color, 0.2);
+        color: gtkalpha($button_color, 0.8);
       }
       &:disabled {
         @include button(insensitive);
         &:active, &:checked {
-          @include button(insensitive-active, $button_color, white);
+          @include button(insensitive-active);
+          background-color: $button_color;
+          color: white;
         }
       }
     }
@@ -422,7 +438,7 @@
 
 %needs_attention {
   animation: needs_attention 150ms ease-in;
-  $_dot_shadow: b_color(text);
+  $_dot_shadow: gtk("@theme_button_foreground_normal");
   $_dot_shadow_r: 0.5;
   background-image: -gtk-gradient(radial,
                                   center center, 0,
diff --git a/src/gtk3/widgets/_calendar.scss b/src/gtk3/widgets/_calendar.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_calendar.scss
@@ -0,0 +1,66 @@
+@charset "UTF-8";
+
+/************
+ * Calendar *
+ ***********/
+calendar {
+  color: gtk("@theme_text_color");
+  border: 1px solid gtk("@borders");
+  background-color: gtk("@theme_base_color");
+  &:selected {
+    background-color: gtk("@borders");
+  }
+  &:disabled {
+    color: gtk("@insensitive_base_color");
+  }
+
+  &.header {
+    border: 1px solid gtk("@borders");
+    border-radius: 0;
+    color: gtk("@theme_text_color");
+
+    &:backdrop {
+      color: gtk("@theme_unfocused_text_color");
+      border-color: gtk("@unfocused_borders");
+    }
+    
+    &:disabled {
+      color: gtk("@insensitive_base_color");
+    }
+  }
+
+  &.button {
+    @extend %undecorated_button;
+    color: gtk("@theme_button_foreground_normal");
+
+    &:hover {
+      @extend %undecorated_button;
+      color: gtk("@theme_button_decoration_hover");
+    }
+    &:active {
+      @extend %undecorated_button;
+      color: gtk("@theme_button_decoration_focus");
+    }
+    &:backdrop {
+      @extend %undecorated_button;
+      color: gtk("@theme_button_foreground_backdrop");
+    }
+  }
+
+  &:indeterminate,
+  &.highlight {
+    color: gtkalpha(gtk("@theme_text_color"),0.5);
+  }
+
+  &:indeterminate:backdrop,
+  &.highlight:backdrop {
+    color:gtkalpha(gtk("@theme_unfocused_text_color"),0.5);
+  }
+
+
+  &:backdrop {
+    color: gtk("@theme_unfocused_text_color");
+    border-color: gtk("@unfocused_borders");
+    background-color: gtk("@theme_unfocused_base_color");
+  }
+}
diff --git a/src/gtk3/widgets/_checkboxes.scss b/src/gtk3/widgets/_checkboxes.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_checkboxes.scss
@@ -0,0 +1,108 @@
+@charset "UTF-8";
+
+/*************************
+ * Check and Radio items *
+ *************************/
+@each $s,
+$as in ('', '-unchecked'),
+(':hover', '-unchecked-hover'),
+(':active', '-unchecked-active'),
+(':backdrop', '-unchecked-backdrop'),
+(':checked', '-checked-active'),
+(':checked:hover', '-checked-hover'),
+(':checked:active', '-checked-active'),
+(':backdrop:checked', '-checked-backdrop') {
+  .view.content-view.check#{$s}:not(list) {
+    -gtk-icon-shadow: none;
+    -gtk-icon-source: -gtk-scaled(url("../assets/check-selectionmode#{$as}.png"), url("../assets/check-selectionmode#{$as}@2.png"));
+    background-color: transparent;
+  }
+}
+
+checkbutton.text-button,
+radiobutton.text-button {
+  // this is for a nice focus on check and radios text
+  padding: 2px 0;
+  outline-offset: 0;
+
+  label:not(:only-child) {
+    &:first-child {
+      margin-left: 4px;
+    }
+
+    &:last-child {
+      margin-right: 4px;
+    }
+  }
+
+  &:active check, &:active radio {
+    -gtk-icon-transform: translate(1px,1px);
+  }
+}
+
+@each $a in ('check', 'radio') {
+
+  #{$a} {
+    margin: 0 4px;
+
+    &:only-child {
+      margin: 0;
+    }
+
+    min-height: 18px;
+    min-width: 18px;
+    //border: none;
+    animation: none;
+    background-color: transparent;
+    -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked.png"), url("../assets/#{$a}-unchecked@2.png"));
+
+    @each $s,
+    $as in ('hover', '-hover'),
+    ('active', '-active'),
+    ('disabled', '-insensitive'),
+    ('backdrop', '-backdrop'),
+    ('backdrop:disabled', '-backdrop-insensitive') {
+      &:#{$s} {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked#{$as}.png"), url("../assets/#{$a}-unchecked#{$as}@2.png"));
+      }
+
+      &:checked {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked-active.png"), url("../assets/#{$a}-checked-active@2.png"));
+
+        &:#{$s} {
+          -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked#{$as}.png"), url("../assets/#{$a}-checked#{$as}@2.png"));
+        }
+      }
+
+      &:indeterminate {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed-active.png"), url("../assets/#{$a}-mixed-active@2.png"));
+
+        &:#{$s} {
+          -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed#{$as}.png"), url("../assets/#{$a}-mixed#{$as}@2.png"));
+        }
+      }
+    }
+
+    menu menuitem & {
+      margin: 0; // this is a workaround for a menu check/radio size allocation issue
+      min-height: 18px;
+      min-width: 18px;
+      background-color: transparent;
+      box-shadow: none;
+      -gtk-icon-shadow: none;
+      animation: none;
+
+      &:hover {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked.png"), url("../assets/#{$a}-unchecked@2.png"));
+      }
+
+      &:checked:hover {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked-active.png"), url("../assets/#{$a}-checked-active@2.png"));
+      }
+
+      &:indeterminate:hover {
+        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed-active.png"), url("../assets/#{$a}-mixed-active@2.png"));
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/gtk320/widgets/_color_chooser.scss b/src/gtk3/widgets/_color_chooser.scss
rename from src/gtk320/widgets/_color_chooser.scss
rename to src/gtk3/widgets/_color_chooser.scss
--- a/src/gtk320/widgets/_color_chooser.scss
+++ b/src/gtk3/widgets/_color_chooser.scss
@@ -9,7 +9,7 @@
   :selected & {
     box-shadow: none;
     &.overlay, &.overlay:hover {
-      border-color: s_color(text);
+      border-color: gtk("@theme_selected_fg_color");
     }
   }
 
@@ -70,8 +70,10 @@
   // border color
   overlay,
   overlay:selected {
-    border: 1px solid $border_color;
-    &:hover { border-color: b_color(hover); }
+    border: 1px solid gtk("@borders");
+    &:hover { 
+      border-color: gtk("@theme_button_decoration_hover");
+    }
   }
 
   // make the add color button looks like, well, a button
diff --git a/src/gtk3/widgets/_dialogs.scss b/src/gtk3/widgets/_dialogs.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_dialogs.scss
@@ -0,0 +1,50 @@
+@charset "UTF-8";
+
+/***********
+ * Dialogs *
+ ***********/
+
+// .message-dialog .dialog-action-area .button {
+//   //padding: 8px;
+// }
+
+messagedialog { // Message Dialog styling
+
+    &.background { 
+      background-color: gtk("@theme_bg_color");
+    }
+    &:backdrop { 
+      background-color: gtk("@theme_unfocused_bg_color");
+    }
+  .titlebar {
+    min-height: 32px;
+    background-color: transparent;
+    background-image: linear-gradient(to bottom, gtkshade("@theme_titlebar_background", 1.2117647),gtk("@theme_titlebar_background"));
+    box-shadow: none;
+  }
+  .dialog-action-area {
+    padding: 8px;
+  }
+  button { margin: 2px; }
+}
+
+filechooser {
+  .search-bar {
+    background-color: gtk("@theme_bg_color");
+    border-color: gtk("@theme_bg_color");
+    box-shadow: none;
+    &:backdrop {
+      background-color: gtk("@theme_unfocused_bg_color");
+      border-color: gtk("@theme_unfocused_bg_color");
+      color: gtk("@theme_unfocused_text_color");
+    }
+  }
+  .dialog-action-box {
+    border-top: 1px solid gtk("@borders");
+    &:backdrop { border-top-color: gtk("@unfocused_borders"); }
+  }
+  #pathbarbox {
+    background-color: gtk("@theme_bg_color");
+    border-bottom: 1px solid gtk("@borders");
+  }
+}
diff --git a/src/gtk320/widgets/_entry.scss b/src/gtk3/widgets/_entry.scss
rename from src/gtk320/widgets/_entry.scss
rename to src/gtk3/widgets/_entry.scss
--- a/src/gtk320/widgets/_entry.scss
+++ b/src/gtk3/widgets/_entry.scss
@@ -1,6 +1,6 @@
 @charset "UTF-8";
 
-@mixin entry($t, $fc:v_color(active)) {
+@mixin entry($t, $fc:gtk("@theme_view_active_decoration_color")) {
 //
 // Entries drawing function
 //
@@ -13,32 +13,32 @@
 // normal, focus, insensitive, backdrop, backdrop-insensitive, osd, osd-focus, osd-backdrop;
 //
   @if $t==normal {
-    color: v_color(text);
-    border-color: $border_color;
-    background-color: v_color(normal);
+    color: gtk("@theme_text_color");
+    border-color: gtk("@borders");
+    background-color: gtk("@theme_base_color");
     box-shadow: none;
   }
 
   @if $t==focus {
     border-color: $fc;
   }
 
   @if $t==insensitive {
-    color: insensitive(v_color(text));
-    border-color: insensitive($border_color);
-    background-color: insensitive(v_color(normal));
+    color: gtk("@insensitive_base_color");
+    border-color: gtk("@insensitive_borders");
+    background-color: gtk("@insensitive_base_fg_color");
   }
 
   @if $t==backdrop {
-    color: backdrop(v_color(text));
-    border-color: backdrop($border_color);
-    background-color: backdrop(v_color(normal));
+    color: gtk("@theme_unfocused_text_color");
+    border-color: gtk("@unfocused_borders");
+    background-color: gtk("@theme_unfocused_base_color");
   }
 
   @if $t==backdrop-insensitive {
-    color: backdrop(insensitive(v_color(text)));
-    border-color: backdrop(insensitive($border_color));
-    background-color: backdrop(insensitive(v_color(normal)));
+    color: gtk("@theme_unfocused_view_text_color");
+    border-color: gtk("@unfocused_insensitive_borders");
+    background-color: gtk("@theme_unfocused_view_bg_color");
   }
 }
 
@@ -82,30 +82,36 @@
 
       selection { &:focus, & { @extend %selected_items; }}
 
-      @each $e_type, $e_color in (error, $error_color),
-                                 (warning, $warning_color) {
+      @each $e_type, $e_color in (error, gtk("@error_color")),
+                                 (warning, gtk("@warning_color")) {
         &.#{$e_type} {
           color: $e_color;
           border-color: $e_color;
-          background-color: transparentize($e_color, 0.5);
+          background-color: gtkalpha($e_color, 0.5);
           &:focus {
             @include entry(focus, $e_color);
-            background-color: transparentize($e_color, 0.5);
+            background-color: gtkalpha($e_color, 0.5);
           }
           &:selected, &:selected:focus { background-color: $e_color; }
           &:backdrop {
-            color: backdrop($e_color);
-            border-color: backdrop($e_color);
-            background-color: backdrop(transparentize($e_color, 0.5));
+            @if $e_color == gtk("@error_color") {
+              color: gtk("@error_color_backdrop");
+              border-color: gtk("@error_color_backdrop");
+              background-color: gtkalpha("@error_color_backdrop", 0.5);
+            } @else if $e_color == gtk("@warning_color") {
+              color: gtk("@warning_color_backdrop");
+              border-color: gtk("@warning_color_backdrop");
+              background-color: gtkalpha("@warning_color_backdrop", 0.5);
+            }
           }
         }
       }
 
       image { // entry icons colors
-        color: mix(w_color(text),v_color(text), 80%);
-        &:hover { color: b_color(hover); }
-        &:active { color: b_color(active); }
-        &:backdrop { color: backdrop(mix(w_color(text), v_color(text), 80%)); }
+        color: gtkmix(gtk("@theme_fg_color"),gtk("@theme_text_color"), 0.8);
+        &:hover { color: gtk("@theme_button_decoration_hover"); }
+        &:active { color: gtk("@theme_button_decoration_focus"); }
+        &:backdrop { color: gtkmix(gtk("@theme_unfocused_fg_color"), gtk("@theme_unfocused_fg_color"), 0.8); }
       }
     //   FIXME
     //   &:drop(active) {
@@ -120,28 +126,28 @@
     margin: 1px;
     border-radius: 0;
     border-width: 0 0 2px;
-    border-color: s_color(normal);
+    border-color: gtk("@theme_selected_bg_color");
     border-style: solid;
     background-image: none;
     background-color: transparent;
     box-shadow: none;
     &:backdrop {
       background-color: transparent;
-      border-color: backdrop(s_color(backdrop));
+      border-color: gtk("@theme_unfocused_selected_bg_color");
     }
   }
 }
 
 treeview acceleditor > label {
-    background-color: s_color(normal);
+    background-color: gtk("@theme_selected_bg_color");
 }
 
 treeview entry {
   &.flat, & {
     border-radius: 0;
     background-image: none;
-    background-color: v_color(normal);
+    background-color: gtk("@theme_base_color");
 
-    &:focus { border-color: v_color(active); }
+    &:focus { border-color: gtk("@theme_view_active_decoration_color"); }
   }
 }
diff --git a/src/gtk320/widgets/_headerbar.scss b/src/gtk3/widgets/_headerbar.scss
rename from src/gtk320/widgets/_headerbar.scss
rename to src/gtk3/widgets/_headerbar.scss
--- a/src/gtk320/widgets/_headerbar.scss
+++ b/src/gtk3/widgets/_headerbar.scss
@@ -11,47 +11,52 @@
   border-width: 0px 0px 1px 0px;
   border-radius: 3px 3px 0px 0px;
   border-style: solid;
-  border-color: $border_color;
-  color: t_color(text);
+  border-color: gtk("@borders");
+  color: gtk("@theme_titlebar_foreground");
   background-image: none;
-  background-color: t_color(background);
+  background-color: gtk("@theme_titlebar_background");
   &:backdrop {
     border-color: transparent;
     background-image: none;
-    background-color: t_color(backdrop-background);
-    color: t_color(backdrop-text);
+    background-color: gtk("@theme_titlebar_background_backdrop");
+    color: gtk("@theme_titlebar_foreground_backdrop");
     box-shadow: none;
   }
   label {
     font-weight: normal;
-    &:backdrop { color: t_color(backdrop-text); }
+    &:backdrop { color: gtk("@theme_titlebar_foreground_backdrop"); }
   }
   .path-bar button {
-    color: t_color(text);
+    color: gtk("@theme_titlebar_foreground");
     font-weight: normal;
-    &:backdrop { color: t_color(backdrop-text)}
+    &:backdrop { 
+      color: gtk("@theme_titlebar_foreground_backdrop");
+    }
     }
   button {
     transition: none;
-    @include button(undecorated, $tc: t_color(text));
+    @include button(undecorated);
+    color: gtk("@theme_titlebar_foreground");
 
     &.flat {
-      @include button(undecorated,$tc: t_color(text));
+      @include button(undecorated);
+      color: gtk("@theme_titlebar_foreground");
     }
     &:hover {
-      @include button(hover, $tc: t_color(text));
-      &:backdrop { border-color: t_color(backdrop-background); }
+      @include button(hover);
+      color: gtk("@theme_titlebar_foreground");
+      &:backdrop { border-color: gtk("@theme_titlebar_background_backdrop"); }
     }
     &:active, &:checked {
       @include button(active);
       &:hover {
   	  @include button(active-hover);
       }
       &:backdrop {
         background-image: none;
-        background-color: t_color(backdrop-background);
-        border-color: t_color(backdrop-background);
-        color: t_color(backdrop-text);
+        background-color: gtk("@theme_titlebar_background_backdrop");
+        border-color: gtk("@theme_titlebar_background_backdrop");
+        color: gtk("@theme_titlebar_foreground_backdrop");
       }
     }
 
@@ -62,25 +67,25 @@
     &:backdrop {
       border-color: transparent;
       background-image: none;
-      background-color: t_color(backdrop-background);
-      color: t_color(backdrop-text);
+      background-color: gtk("@theme_titlebar_background_backdrop");
+      color: gtk("@theme_titlebar_foreground_backdrop");
       }
 
     &.flat:backdrop, &.flat:backdrop:disabled, &:disabled:backdrop {
       background-image: none;
-      background-color: t_color(backdrop-background);
-      color: t_color(backdrop-text);
+      background-color: gtk("@theme_titlebar_background_backdrop");
+      color: gtk("@theme_titlebar_foreground_backdrop");
       border-color: transparent;
       }
     &.flat:disabled {
       @extend %undecorated_button;;
-      color: insensitive(t_color(text));
+      color: gtk("@theme_titlebar_foreground_insensitive");
       }
     &:disabled {
       background-color: transparent;
       background-image: none;
       border-color: transparent;
-      color: insensitive(t_color(text));
+      color: gtk("@theme_titlebar_foreground_insensitive");
       &:active, &:checked {
         @include button(insensitive-active);
       }
@@ -90,14 +95,18 @@
   .title {
     font-weight: normal;
     padding: 0px 12px;
-    &:backdrop { color: t_color(backdrop-text)}
+    &:backdrop { 
+      color: gtk("@theme_titlebar_foreground_backdrop");
+    }
   }
 
   .subtitle {
     font-size: smaller;
     padding: 0 12px;
     @extend .dim-label;
-    &:backdrop { color: t_color(backdrop-text)}
+    &:backdrop { 
+      color: gtk("@theme_titlebar_foreground_backdrop");
+    }
   }
 
   separator {
@@ -147,25 +156,25 @@
 
 %suggested-action {
   background-image: none;
-  background-color: b_color(active);
+  background-color: gtk("@theme_button_decoration_focus");
   &:hover {
-    background-color: b_color(hover);
-    color: b_color(text)
+    background-color: gtk("@theme_button_decoration_hover");
+    color: gtk("@theme_button_foreground_normal");
     }
   &:disabled {
     background-color: transparent;
     background-image: none;
-    color: insensitive(t_color(text));
+    color: gtk("@theme_titlebar_foreground_insensitive");
     &:active, &:checked {
       @include button(insensitive-active);
       }
     }
   &:backdrop {
-    background-color: t_color(backdrop-background);
+    background-color: gtk("@theme_titlebar_background_backdrop");
     border-color: transparent;
-    color: t_color(backdrop-text);
+    color: gtk("@theme_titlebar_foreground_backdrop");
     &:disabled {
-      color: insensitive(t_color(backdrop-text));
+      color: gtk("@theme_titlebar_foreground_insensitive_backdrop");
     }
   }
 }
diff --git a/src/gtk3/widgets/_infobar.scss b/src/gtk3/widgets/_infobar.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_infobar.scss
@@ -0,0 +1,70 @@
+@charset "UTF-8";
+
+/**************
+ * GtkInfoBar *
+ **************/
+infobar {
+  border-style: none;
+  border-bottom: 1px solid gtk("@borders");
+  background-color: gtk("@theme_bg_color");
+  background-image: none;
+  &:backdrop {
+    border-bottom: 1px solid gtk("@unfocused_borders");
+  }
+}
+
+.info,
+.question,
+.warning,
+.error {
+  background-color: gtk("@theme_bg_color");
+  background-image: none;
+  color: gtk("@warning_color");
+  text-shadow: none;
+  &:backdrop {
+    background-color: gtk("@theme_unfocused_bg_color");
+    color: gtk("@warning_color_backdrop");
+  }
+  button {
+    box-shadow: none;
+    background-image:none;
+    background-color: gtkalpha("@warning_color", 0.5);
+    border-color: gtkalpha("@warning_color", 0.5);
+    color: gtk("@theme_button_foreground_normal");
+    &:hover {
+      background-color: gtkalpha("@warning_color", 0.25);
+      border-color: gtk("@warning_color");
+    }
+    &:active, &:checked {
+      background-color: gtk("@warning_color");
+      color: gtk("@theme_bg_color");
+      border-color: gtk("@warning_color");
+    }
+    &:disabled {
+      background-color: gtkalpha("@warning_color_insensitive", 0.5);
+      border-color: gtkalpha("@warning_color_insensitive", 0.5);
+      color: gtk("@theme_button_foreground_insensitive");
+    }
+    &:backdrop {
+      background-color: gtkalpha("@warning_color_backdrop", 0.5);
+      border-color: gtkalpha("@warning_color_backdrop", 0.5);
+      color: gtk("@theme_button_foreground_backdrop");
+      &:active, &:checked {
+        background-color: gtk("@warning_color_backdrop");
+        color: gtk("@theme_unfocused_bg_color");
+        border-color: gtk("@warning_color_backdrop");
+      }
+      &:disabled {
+        background-color: gtkalpha("@warning_color_insensitive_backdrop", 0.5);
+        border-color: gtkalpha("@warning_color_insensitive_backdrop", 0.5);
+        color: gtk("@theme_button_foreground_backdrop_insensitive");
+      }
+      &:disabled:active,
+      &:disabled:checked {
+        background-color: gtk("@warning_color_insensitive_backdrop");
+        color: gtk("@insensitive_unfocused_bg_color");
+        border-color: gtk("@warning_color_insensitive_backdrop");
+      }
+    }
+  }
+}
diff --git a/src/gtk3/widgets/_link.scss b/src/gtk3/widgets/_link.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_link.scss
@@ -0,0 +1,57 @@
+@charset "UTF-8";
+
+/*********
+ * Links *
+ *********/
+%link,
+*:link {
+  color: gtk("@link_color");
+  &:visited {
+    color: gtk("@link_visited_color");
+    *:selected & { 
+      color: gtkmix(gtk("@theme_selected_fg_color"), gtk("@theme_selected_bg_color"), 0.6); 
+    }
+  }
+  &:hover {
+    color: gtkshade("@link_color", 1.1);
+    *:selected & { 
+      color: gtkmix(gtk("@theme_selected_fg_color"), gtk("@theme_selected_bg_color"), 0.9);
+    }
+  }
+  &:active {
+    color: gtk("@link_color");
+    *:selected & {
+      color: gtkmix(gtk("@theme_selected_fg_color"), gtk("@theme_selected_bg_color"), 0.8); 
+    }
+  }
+  &:backdrop, &:backdrop:hover, &:backdrop:hover:selected {
+    color: gtk("@theme_unfocused_selected_bg_color");
+  }
+  @at-root %link_selected,
+  &:selected, *:selected & {
+    color: gtkmix("@theme_selected_fg_color", "@theme_selected_bg_color", 0.8);
+  }
+}
+
+button:link,
+button:visited {
+  @extend %undecorated_button;
+
+  @extend *:link;
+
+  text-shadow: none;
+
+  &:hover,
+  &:active,
+  &:checked {
+    @extend %undecorated_button;
+
+    text-shadow: none;
+  }
+
+  > label {
+    @extend %link;
+
+    text-decoration-line: underline;
+  }
+}
diff --git a/src/gtk3/widgets/_lists.scss b/src/gtk3/widgets/_lists.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_lists.scss
@@ -0,0 +1,69 @@
+@charset "UTF-8";
+
+/*********
+ * Lists *
+ *********/
+
+@mixin list-item-highlight {
+  @if $new-highlight {
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_button_foreground_active");
+    border-top: 1px solid gtk("@theme_button_decoration_focus");
+    border-bottom: 1px solid gtk("@theme_button_decoration_focus");
+    border-radius: 0px;
+  } @else {
+    background-color: gtk("@theme_selected_bg_color");
+  }
+}
+
+list {
+  background-color: gtk("@theme_bg_color");
+  color: gtk("@theme_fg_color");
+  border-width: 0px;
+  &:backdrop {
+    background-color: gtk("@theme_unfocused_bg_color");
+    color: gtk("@theme_unfocused_fg_color");
+  }
+  row { padding: 2px; }
+}
+
+row {
+  transition: all 150ms $ease-out-quad;
+
+  &:hover { transition: none; }
+
+  &.activatable {
+    @if $new-highlight {
+      border: 1px solid transparent;
+    }
+
+    &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
+
+    &:hover { 
+      @include list-item-highlight();
+    }
+
+    &:active {
+      box-shadow: none;
+      @include list-item-highlight();
+    }
+
+    &:selected {
+      &:active {
+        box-shadow: none;
+        @include list-item-highlight();
+      }
+
+      &.has-open-popup,
+      &:hover {
+        @include list-item-highlight();
+      }
+
+      &:backdrop { 
+        background-color: gtk("@theme_unfocused_selected_bg_color_alt");
+      }
+    }
+  }
+
+  &:selected { @extend %selected_items; }
+}
\ No newline at end of file
diff --git a/src/gtk3/widgets/_menus.scss b/src/gtk3/widgets/_menus.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_menus.scss
@@ -0,0 +1,328 @@
+@charset "UTF-8";
+
+@mixin item-highlight {
+  @if $new-highlight {
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_button_foreground_active");
+    border: 1px solid gtk("@theme_button_decoration_focus");
+  } @else {
+    background-color: gtk("@theme_button_decoration_focus");
+    color: gtk("@theme_button_foreground_active")
+  }
+  border-radius: 3px;
+}
+
+/*********
+ * Menus *
+ *********/
+
+menubar,
+.menubar {
+  -GtkWidget-window-dragging: true;
+  padding: 0px;
+  box-shadow: none;
+  border-style: none;
+  background-color: gtk("@theme_bg_color");
+
+  &:backdrop {
+    background-color: gtk("@theme_unfocused_bg_color");
+  }
+
+  >menuitem {
+    min-height: 16px;
+    padding: 4px 6px;
+    border-bottom: 3px solid transparent;
+
+    &:hover {
+      //Seems like it :hover even with keyboard focus
+      background-color: gtkalpha(gtk("@theme_button_decoration_focus"), 0.3);
+      color: gtk("@theme_button_foreground_active");
+      border-bottom: 3px solid gtk("@theme_button_decoration_focus");
+    }
+
+    &:disabled {
+      color: gtk("@insensitive_fg_color");
+      box-shadow: none;
+
+      &:backdrop {
+        background-color: gtk("@theme_unfocused_bg_color");
+        color: gtk("@insensitive_unfocused_fg_color");
+      }
+    }
+
+    &:backdrop {
+      background-color: gtk("@theme_unfocused_bg_color");
+      color: gtk("@theme_unfocused_fg_color");
+    }
+  }
+}
+
+menu,
+.menu {
+  padding: 0px;
+  background-color: gtk("@theme_bg_color");
+  border: 0px solid transparent;
+  // FIXME workaround for libreoffice gtk3, should be a border
+  //border: 1px solid $border_color; // adds borders in a non composited env
+  box-shadow: inset 0px 0px 0px 1px gtk("@borders");
+
+  border-radius: $r;
+
+  .csd & {
+    //background-color: transparent;
+    border: 0px solid;
+    border-radius: $r;
+    //box-shadow: 0px 0px 0px 1px $border_color, 2px 2px 2px 1px rgba(0, 0, 0, 0.1);
+  }
+
+  // axes borders in a composited env
+  separator {
+    color: gtk("@borders");
+  }
+
+  menuitem {
+    text-shadow: none;
+    min-height: 16px;
+    min-width: 40px;
+    padding: 4px 4px;
+
+    @if $new-highlight{ 
+      border: 1px solid transparent;
+      margin: 4px;
+    }
+
+    &:hover {
+      @include item-highlight();
+    }
+
+    &:disabled {
+      color: gtk("@insensitive_fg_color");
+
+      &:backdrop {
+        color: gtk("@insensitive_unfocused_fg_color");
+      }
+    }
+
+    &:backdrop,
+    &:backdrop:hover {
+      color: gtk("@theme_unfocused_fg_color");
+      background-color: gtk("@theme_unfocused_bg_color");
+    }
+
+    // submenu indicators
+    arrow {
+      min-height: 16px;
+      min-width: 16px;
+
+      &:dir(ltr) {
+        -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
+        margin-left: 10px;
+      }
+
+      &:dir(rtl) {
+        -gtk-icon-source: -gtk-icontheme('pan-start-symbolic');
+        margin-right: 10px;
+      }
+    }
+  }
+
+  // overflow arrows
+  >arrow {
+    @include button(undecorated);
+
+    min-height: 16px;
+    min-width: 16px;
+    padding: 4px;
+    background-color: transparent;
+    border-radius: 0;
+
+    &.top {
+      margin-top: -6px;
+      border: none;
+      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
+    }
+
+    &.bottom {
+      margin-bottom: -6px;
+      border: none;
+      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
+    }
+
+    &:hover {
+      color: gtk("@theme_button_decoration_hover");
+    }
+
+    &:active {
+      color: gtk("@theme_button_decoration_focus");
+    }
+
+    &:backdrop {
+      background-color: gtk("@insensitive_bg_color");
+    }
+
+    &:disabled {
+      color: transparent;
+      background-color: transparent;
+      border-color: transparent;
+    }
+  }
+}
+
+menuitem {
+  accelerator {
+    color: gtkalpha(currentColor, 0.55);
+  }
+
+  check,
+  radio {
+    min-height: 18px;
+    min-width: 18px;
+
+    &:dir(ltr) {
+      margin-right: 6px;
+    }
+
+    &:dir(rtl) {
+      margin-left: 6px;
+    }
+  }
+  &:active check, &:active radio {
+    -gtk-icon-transform: translate(1px,1px);
+  }
+}
+
+/***************
+ * Popovers   *
+ ***************/
+/* menu buttons */
+modelbutton.flat,
+.menuitem.button.flat {
+  min-height: 16px;
+  padding: 4px 8px;
+  margin: 3px;
+
+  @extend %undecorated_button;
+  color: gtk("@theme_fg_color");
+
+  border: 1px solid transparent;
+  
+  &:hover {
+    @include item-highlight();
+  }
+
+  &:selected {
+    background-color: gtk("@theme_button_decoration_focus");
+    color: gtk("@theme_button_foreground_active");
+  }
+
+  &:backdrop,
+  &:backdrop:hover {
+    @extend %undecorated_button;
+    color: gtk("@theme_unfocused_fg_color");
+  }
+
+  check:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/check-unchecked.png"), url("../assets/check-unchecked@2.png"));
+  }
+
+  radio:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/radio-unchecked.png"), url("../assets/radio-unchecked@2.png"));
+  }
+
+  check:checked:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/check-checked-active.png"), url("../assets/check-checked-active@2.png"));
+  }
+
+  radio:checked:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/radio-checked-active.png"), url("../assets/radio-checked-active@2.png"));
+  }
+
+  check:indeterminate:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/check-mixed.png"), url("../assets/check-mixed@2.png"));
+  }
+
+  radio:indeterminate:hover {
+    -gtk-icon-source: -gtk-scaled(url("../assets/radio-mixed.png"), url("../assets/radio-mixed@2.png"));
+  }
+
+  // FIXME: remove the following when the checks/radios rewrite lands
+  check:last-child,
+  radio:last-child {
+    margin-right: 0px;
+  }
+
+  check:first-child,
+  radio:first-child {
+    margin-left: 0px;
+  }
+
+  &:active check, &:active radio {
+    -gtk-icon-transform: translate(1px,1px);
+  }
+}
+
+modelbutton.flat arrow {
+  background: none;
+
+  &:hover {
+    background: none;
+  }
+
+  &.left {
+    -gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
+  }
+
+  &.right {
+    -gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
+  }
+}
+
+popover.background {
+  padding: 0px;
+  border: 1px solid gtk("@borders");
+  border-radius: 3px;
+  background-color: gtk("@theme_bg_color");
+
+  box-shadow: 0 2px 3px transparentize(black, 0.1);
+
+  &:backdrop {
+    box-shadow: none;
+  }
+
+  >list,
+  >.view,
+  >toolbar {
+    border-style: none;
+    background-color: transparent;
+  }
+
+  .csd &,
+  & {
+
+    &.touch-selection,
+    &.magnifier {
+      @extend %osd;
+
+      border: 1px solid gtk("@borders");
+
+      button {
+        @extend %button
+      }
+
+      ;
+    }
+
+    &.osd {
+      @extend %osd;
+    }
+  }
+
+  checkbutton,
+  radiobutton {
+    @extend modelbutton.flat;
+  }
+}
+
+GtkVolumeButton.button {
+  padding: 5px;
+}
\ No newline at end of file
diff --git a/src/gtk320/widgets/_misc.scss b/src/gtk3/widgets/_misc.scss
rename from src/gtk320/widgets/_misc.scss
rename to src/gtk3/widgets/_misc.scss
--- a/src/gtk320/widgets/_misc.scss
+++ b/src/gtk3/widgets/_misc.scss
@@ -9,15 +9,15 @@
 *****************/
 printdialog {
  paper {
-   color: w_color(text);
-   border: 1px solid $border_color;
+   color: gtk("@theme_fg_color");
+   border: 1px solid gtk("@borders");
    background: white;
    padding: 0;
 
    &:backdrop {
-     color: backdrop(w_color(text));
-     border-color: backdrop($border_color);
-     background: backdrop(white);
+     color: gtk("@theme_unfocused_fg_color");
+     border-color: gtk("@unfocused_borders");
+     background: gtk("@print_paper_backdrop");
    }
  }
 
@@ -33,18 +33,18 @@
   margin: 0;
   padding: 0;
   border-radius: 0;
-  border: 1px solid $border_color;
+  border: 1px solid gtk("@borders");
 
   &.flat { border-style: none; }
 
-  &:backdrop { border-color: backdrop($border_color); }
+  &:backdrop { border-color: gtk("@unfocused_borders"); }
 }
 
 actionbar > revealer >  box {
   padding: 6px;
-  border-top: 1px solid $border_color;
+  border-top: 1px solid gtk("@borders");
 
-  &:backdrop { border-color: backdrop($border_color); }
+  &:backdrop { border-color: gtk("@unfocused_borders"); }
 }
 
 scrolledwindow {
@@ -61,7 +61,7 @@
 
 //vbox and hbox separators
 separator {
-  background: $border_color;
+  background: gtk("@borders");
   min-width: 1px;
   min-height: 1px;
 }
@@ -76,7 +76,7 @@
     min-height: 16px;
     -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
     &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic');}
-    &:hover { color: lighten(w_color(text),30%); } //only lightens the arrow
+    &:hover { color: gtkshade(gtk("@theme_fg_color"),1.3); } //only lightens the arrow
     &:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
   }
 }
@@ -93,24 +93,24 @@
     border-style: none; // just to be sure
     background-color: transparent;
     // workaround, using background istead of a border since the border will get rendered twice (?)
-    background-image: image($border_color);
+    background-image: image(gtk("@borders"));
     background-size: 1px 1px;
 
     //&:selected { background-image: image($selected_bg_color); } // FIXME is this needed?
 
-    &:backdrop { background-image: image(backdrop($border_color)); }
+    &:backdrop { background-image: image(gtk("@unfocused_borders")); }
 
     &.wide {
       min-width: 5px;
       min-height: 5px;
-      background-color: w_color(normal);
-      background-image: image($border_color), image($border_color);
+      background-color: gtk("@theme_bg_color");
+      background-image: image(gtk("@borders")), image(gtk("@borders"));
       background-size: 1px 1px, 1px 1px;
 
       &:backdrop {
-        background-color: backdrop(w_color(normal));
-        background-image: image(backdrop($border_color)),
-                          image(backdrop($border_color));
+        background-color: gtk("@theme_unfocused_bg_color");
+        background-image: image(gtk("@unfocused_borders")),
+                          image(gtk("@unfocused_borders"));
       }
     }
   }
diff --git a/src/gtk320/widgets/_notebook.scss b/src/gtk3/widgets/_notebook.scss
rename from src/gtk320/widgets/_notebook.scss
rename to src/gtk3/widgets/_notebook.scss
--- a/src/gtk320/widgets/_notebook.scss
+++ b/src/gtk3/widgets/_notebook.scss
@@ -11,33 +11,33 @@
    &.frame {
      border: none;
      padding: 0px;
-     box-shadow: inset 0px 0px 0px 1px $border_color;
+     box-shadow: inset 0px 0px 0px 1px gtk("@borders");
    }
 
    > header {
      padding: 0px;
      border: none;
-     background-color: w_color(normal);
-     //box-shadow: inset 0 -1px $border_color;
+     background-color: gtk("@theme_bg_color");
+     //box-shadow: inset 0 -1px gtk("@borders");
 
      &.top {
-       box-shadow: inset 0 -1px $border_color; // border
-       &:backdrop { box-shadow: inset 0 -1px backdrop($border_color); }
+       box-shadow: inset 0 -1px gtk("@borders"); // border
+       &:backdrop { box-shadow: inset 0 -1px gtk("@unfocused_borders"); }
      }
      &.bottom {
-       box-shadow: inset 0 1px $border_color;
-       &:backdrop { box-shadow: inset 0 1px backdrop($border_color); }
+       box-shadow: inset 0 1px gtk("@borders");
+       &:backdrop { box-shadow: inset 0 1px gtk("@unfocused_borders"); }
      }
      &.right {
-       box-shadow: inset 1px 0 $border_color;
-       &:backdrop { box-shadow: inset 1px 0 backdrop($border_color); }
+       box-shadow: inset 1px 0 gtk("@borders");
+       &:backdrop { box-shadow: inset 1px 0 gtk("@unfocused_borders"); }
      }
      &.left {
-       box-shadow: inset -1px 0 $border_color;
-       &:backdrop { box-shadow: inset -1px 0 backdrop($border_color); }
+       box-shadow: inset -1px 0 gtk("@borders");
+       &:backdrop { box-shadow: inset -1px 0 gtk("@unfocused_borders"); }
      }
      &:backdrop {
-       background-color: backdrop(w_color(normal));
+       background-color: gtk("@theme_unfocused_bg_color");
      }
 
      tabs {
@@ -53,22 +53,22 @@
         > tabs {
           > tab {
             padding: 4px 6px;
-            border: 1px solid transparentize(w_color(text), 0.8);
-            background-color: transparentize(w_color(text), 0.8);
+            border: 1px solid gtkalpha("@theme_fg_color", 0.2);
+            background-color: gtkalpha("@theme_fg_color", 0.2);
             border-radius: #{$_radius};
             border-#{$_border}-color: transparent;
             &:hover, &.prelight-page {
-              background-color: transparentize(s_color(normal), 0.8);
-              border-color: transparentize(s_color(normal), 0.8);
+              background-color: gtkalpha("@theme_selected_bg_color", 0.2);
+              border-color:     gtkalpha("@theme_selected_bg_color", 0.2);
             }
             &:checked {
-              border-color: $border_color;
-              border-#{$_border}-color: $menu_color;
-              background-color: $menu_color;
+              border-color: gtk("@borders");
+              border-#{$_border}-color: gtk("@theme_bg_color");
+              background-color: gtk("@theme_bg_color");
               &:backdrop {
-                border-color: backdrop($border_color);
-                border-#{$_border}-color: backdrop($menu_color);
-                background-color: backdrop($menu_color);
+                border-color: gtk("@unfocused_borders");
+                border-#{$_border}-color: gtk("@theme_unfocused_bg_color");
+                background-color: gtk("@theme_unfocused_bg_color");
               }
             }
           }
@@ -87,26 +87,26 @@
             border-width: 3px;
             border-style: solid;
             border-color: transparent;
-            background-color: w_color(normal);
+            background-color: gtk("@theme_bg_color");
             background-clip: padding-box;
             border-#{$_border}-width: 1px;
-            border-#{$_border}-color: $border_color;
-            box-shadow: inset #{$_shadow1} w_color(normal);
+            border-#{$_border}-color: gtk("@borders");
+            box-shadow: inset #{$_shadow1} gtk("@theme_bg_color");
               &:hover, &.prelight-page {
-                box-shadow: inset 0px -3px 0px 0px transparentize(s_color(normal),0.8), inset $_shadow1 w_color(normal);
+                box-shadow: inset 0px -3px 0px 0px gtkalpha("@theme_selected_bg_color",0.2), inset $_shadow1 gtk("@theme_bg_color");
               }
               &:checked {
-                box-shadow: inset 0px -3px 0px 0px s_color(normal), inset $_shadow1 w_color(normal);
+                box-shadow: inset 0px -3px 0px 0px gtk("@theme_selected_bg_color"), inset $_shadow1 gtk("@theme_bg_color");
                 &:backdrop {
-                  background-color: backdrop(w_color(normal));
+                  background-color: gtk("@theme_unfocused_bg_color");
                   border-color: transparent;
-                  border-#{$_border}-color: backdrop($border_color);
+                  border-#{$_border}-color: gtk("@unfocused_borders");
                   box-shadow:none;
                 }
               }
               &:backdrop {
-                background-color: backdrop(w_color(normal));
-                border-#{$_border}-color: backdrop($border_color);
+                background-color: gtk("@theme_unfocused_bg_color");
+                border-#{$_border}-color: gtk("@unfocused_borders");
                 box-shadow:none;
               }
             }
@@ -193,26 +193,26 @@
      min-height: 12px;
      border: 0px solid;
      border-radius: 50%;
-     color: w_color(normal);
-     background-color: $border_color;
+     color: gtk("@theme_bg_color");
+     background-color: gtk("@borders");
      background-image: none;
      &:hover {
       background-color: $error_color;
     }
     &:active { background-color: $error_color;}
 
     &:backdrop { 
-      background-color: backdrop($border_color);
-      color: backdrop(w_color(normal));
+      background-color: gtk("@unfocused_borders");
+      color: gtk("@theme_unfocused_bg_color");
     }
    }
  }
 
 
   > stack:not(:only-child) { // the :not(:only-child) is for "hidden" notebooks
      background-color: transparent;
      border-style: solid;
-     border-color: $border_color;
+     border-color: gtk("@borders");
      border-width: 0px;
    }
 }
diff --git a/src/gtk320/widgets/_overshoot.scss b/src/gtk3/widgets/_overshoot.scss
rename from src/gtk320/widgets/_overshoot.scss
rename to src/gtk3/widgets/_overshoot.scss
--- a/src/gtk320/widgets/_overshoot.scss
+++ b/src/gtk3/widgets/_overshoot.scss
@@ -1,6 +1,6 @@
 @charset "UTF-8";
 
-@mixin overshoot($p, $t:normal, $c:w_color(text)) {
+@mixin overshoot($p, $t:normal, $c:gtk("@theme_fg_color")) {
 //
 // overshoot
 //
@@ -42,24 +42,24 @@
   $_small_gradient_color: $c;
   $_big_gradient_color: $c;
 
-  @if $c==w_color(text) {
-    $_small_gradient_color: darken($border_color, 10%);
-    $_big_gradient_color: w_color(text);
+  @if $c==gtk("@theme_fg_color") {
+    $_small_gradient_color: gtkshade("@borders", 0.9);
+    $_big_gradient_color: gtk("@theme_fg_color");
 
-    @if $t==backdrop { $_small_gradient_color: backdrop($border_color); }
+    @if $t==backdrop { $_small_gradient_color: gtk("@unfocused_borders"); }
   }
 
   $_small_gradient: -gtk-gradient(radial,
                                   $_position, 0,
                                   $_position, 0.5,
                                   to($_small_gradient_color),
-                                  to(transparentize($_small_gradient_color, 1)));
+                                  to(gtkalpha($_small_gradient_color, 0)));
 
   $_big_gradient: -gtk-gradient(radial,
                                 $_position, 0,
                                 $_position, 0.6,
-                                from(transparentize($_big_gradient_color, 0.93)),
-                                to(transparentize($_big_gradient_color, 1)));
+                                from(gtkalpha($_big_gradient_color, 0.07)),
+                                to(gtkalpha($_big_gradient_color, 0)));
 
   @if $t==normal {
     background-image: $_small_gradient, $_big_gradient;
diff --git a/src/gtk320/widgets/_pathbar.scss b/src/gtk3/widgets/_pathbar.scss
rename from src/gtk320/widgets/_pathbar.scss
rename to src/gtk3/widgets/_pathbar.scss
--- a/src/gtk320/widgets/_pathbar.scss
+++ b/src/gtk3/widgets/_pathbar.scss
@@ -4,17 +4,17 @@
  * Pathbars *
  ************/
 .path-bar {
-  background-color: w_color(normal);
-  border-bottom: 1px solid $border_color;
+  background-color: gtk("@theme_bg_color");
+  border-bottom: 1px solid gtk("@borders");
 }
 
 .path-bar button {
   @include button(undecorated);
   padding: 4px 8px;
-  color: w_color(text);
-  &:hover {border-color: b_color(hover); }
+  color: gtk("@theme_fg_color");
+  &:hover {border-color: gtk("@theme_button_decoration_hover"); }
   &:active, &:checked {
-    background-color: $border_color;
+    background-color: gtk("@borders");
     font-weight: normal;
     }
   &.text-button, &.image-button, & {
diff --git a/src/gtk3/widgets/_progressbar.scss b/src/gtk3/widgets/_progressbar.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_progressbar.scss
@@ -0,0 +1,145 @@
+@charset "UTF-8";
+
+/*****************
+ * Progress bars *
+ *****************/
+progressbar {
+ // sizing
+ &.horizontal {
+   trough,
+   progress { min-height: 6px; }
+ }
+
+ &.vertical {
+   trough,
+   progress { min-width: 6px; }
+ }
+
+ // FIXME: insensitive state missing and some other state should be set probably
+ font-size: smaller;
+ color: gtkalpha(gtk("@theme_button_foreground_normal"), 0.3);
+
+ trough {
+   border: 0px solid transparent;
+   border-radius: $r;
+   background-color: gtkalpha(gtk("@theme_button_foreground_normal"),0.3);
+  }
+
+ &:backdrop trough { background-color: gtkalpha("@theme_button_foreground_backdrop",0.3); } // looks like states are not passed to the trough component here
+
+ progress {
+   background-color: gtk("@theme_selected_bg_color");
+   border: 0px solid transparent;
+   border-radius: 3px;
+   box-shadow: none; //needed for clipping
+ }
+
+ &:backdrop progress { 
+   background-color: gtk("@theme_unfocused_selected_bg_color_alt");
+  } // states not passed here as well
+
+ &.osd { // progressbar.osd used for epiphany page loading progress
+   background-color: transparent;
+ }
+}
+
+treeview.view {
+  &.progressbar {
+    border: 0px solid transparent;
+    border-radius: $r;
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_selected_fg_color");
+    background-image: none;
+    &:selected {
+      &:focus, & {
+        background-color: gtkalpha(gtk("@theme_selected_bg_color"),0.25);
+      }
+    }
+  }
+  &.trough {
+    background-color: $trough_color;
+    &:selected {
+      &:focus, & {
+        background-color: gtkalpha("@theme_selected_fg_color",0.3);
+      }
+    }
+  }
+}
+
+/*************
+ * Level Bar *
+ *************/
+levelbar {
+ block {
+   min-width: 32px;
+   min-height: 6px;
+ }
+
+ &.vertical block {
+   min-width: 6px;
+   min-height: 32px;
+ }
+
+ trough {
+   border: 1px solid;
+   padding: 2px;
+   border-radius: 3px;
+   @include entry(normal);
+
+   &:backdrop { @include entry(backdrop); }
+ }
+
+ &.horizontal.discrete block { margin: 0 1px; }
+
+ &.vertical.discrete block { margin: 1px 0; }
+
+ block:not(.empty) {
+   border: 1px solid gtk("@theme_selected_bg_color");
+   background-color: gtk("@theme_selected_bg_color");
+   box-shadow: none;
+   border-radius: 1px;
+
+   &:backdrop {
+     border-color:     gtk("@theme_unfocused_selected_bg_color_alt");
+     background-color: gtk("@theme_unfocused_selected_bg_color_alt");
+   }
+ }
+
+ block {
+   &.low {
+     border-color:     gtk("@warning_color");
+     background-color: gtk("@warning_color");
+     &:backdrop {
+       background-color: gtk("@warning_color_backdrop");
+       border-color:     gtk("@warning_color_backdrop");
+     }
+   }
+
+   &.high {
+     border-color:     gtk("@success_color");
+     background-color: gtk("@success_color");
+     &:backdrop {
+       background-color: gtk("@success_color_backdrop");
+       border-color:     gtk("@success_color_backdrop");
+     }
+   }
+
+   &.full {
+    border-color:     gtk("@success_color");
+    background-color: gtk("@success_color");
+    &:backdrop {
+      background-color: gtk("@success_color_backdrop");
+      border-color:     gtk("@success_color_backdrop");
+    }
+   }
+
+   &.empty {
+     background-color: gtkalpha(gtk("@theme_button_foreground_normal"),0.3);
+     border-color: transparent;
+     box-shadow: none;
+     &:backdrop { 
+       background-color: gtkalpha("@theme_button_foreground_insensitive",0.3); 
+      }
+   }
+ }
+}
diff --git a/src/gtk3/widgets/_scale.scss b/src/gtk3/widgets/_scale.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_scale.scss
@@ -0,0 +1,99 @@
+@charset "UTF-8";
+
+/************
+ * GtkScale *
+ ************/
+scale {
+
+  &.fine-tune {
+    &.trough {
+      margin: 8px;
+      border-radius: $r;
+    }
+  }
+
+  slider {
+    min-width: 18px;
+    min-height: 18px;
+    background-color: gtk("@theme_button_background_normal");
+    border: 1px solid gtk("@borders");
+    border-radius: 50%;
+    box-shadow: none;
+    margin: -9px;
+    &:hover {
+      border-style: solid;
+  	  border-width: 2px;
+      border-color: gtk("@theme_button_decoration_hover");
+      border-radius: 50%; // needed for double marks scales
+      &:backdrop {
+        background-color: gtk("@theme_button_background_backdrop");
+        border-color: gtk("@theme_button_decoration_hover_insensitive");
+      }
+    }
+    &:disabled {
+      border-style: solid; // needed for double marks scales or they'll get
+      border-radius: 50%;  // overridden
+      background-color: gtkalpha("@theme_button_background_insensitive", 100.0);
+      opacity: 1.0;
+      border-color: gtk("@insensitive_borders");
+      &:backdrop {
+        background-color: gtkalpha("@theme_button_background_backdrop_insensitive", 100.0);
+        border-color: gtk("@unfocused_insensitive_borders");
+      }
+    }
+    &:active {
+      border: 2px solid gtk("@theme_button_decoration_focus");
+      &:backdrop {
+        background-color: gtk("@theme_button_background_normal");
+        border-color: gtk("@theme_button_decoration_focus_backdrop");
+      }
+    }
+    &:backdrop {
+      background-color: gtk("@theme_button_background_backdrop");
+      border-color: gtk("@unfocused_borders");
+    }
+  }
+  trough {
+    min-width: 6px;
+    min-height: 6px;
+    margin: 9px;
+    border: 0px solid;
+    border-radius: $r;
+    background-color: $trough_color;
+    box-shadow: none;
+
+    &:disabled, &.vertical:disabled {
+      border-color: $trough_color_insensitive;
+      background-color: $trough_color_insensitive;
+      box-shadow: none;
+      &:backdrop {
+        background-color: $trough_color_backdrop_insensitive;
+        border-color: $trough_color_backdrop_insensitive;
+      }
+    }
+    &:backdrop {
+      background-color: $trough_color_backdrop;
+      border-color: $trough_color_backdrop;
+    }
+  }
+  highlight {
+    border: 0px solid;
+    border-radius: 3px;
+    background-color: gtk("@theme_selected_bg_color");
+    border-color:     gtk("@theme_selected_bg_color");
+    &.vertical {
+      background-color: gtk("@theme_selected_bg_color");
+      border-color:     gtk("@theme_selected_bg_color");
+    }
+    &:disabled { 
+      background-color: gtk("@insensitive_selected_bg_color");
+    }
+    &:backdrop {
+      background-color: gtk("@theme_unfocused_selected_bg_color");
+      border-color:     gtk("@theme_unfocused_selected_bg_color");
+      &:disabled {
+        background-color: gtk("@insensitive_unfocused_selected_bg_color");
+      }
+    }
+  }
+}
diff --git a/src/gtk320/widgets/_scrollbar.scss b/src/gtk3/widgets/_scrollbar.scss
rename from src/gtk320/widgets/_scrollbar.scss
rename to src/gtk3/widgets/_scrollbar.scss
--- a/src/gtk320/widgets/_scrollbar.scss
+++ b/src/gtk3/widgets/_scrollbar.scss
@@ -9,9 +9,9 @@
   -GtkScrollbar-has-backward-stepper: false;
   -GtkScrollbar-has-forward-stepper: false;
 
-  background-color: w_color(normal);
+  background-color: gtk("@theme_bg_color");
   border-width: 0px 0px;
-  border-color: w_color(normal);
+  border-color: gtk("@theme_bg_color");
   margin: 5px;
 
   button {
@@ -28,26 +28,28 @@
 	&:hover {
     border: none;
     background-image: none;
-    background-color: w_color(normal);
+    background-color: gtk("@theme_bg_color");
                color: transparent;
 		}
   &:active,
   &:active:hover {
     border: none;
     background-image: none;
-    background-color: w_color(normal);
+    background-color: gtk("@theme_bg_color");
     color: transparent;
   }
 	&:disabled {
     border: none;
-    background-color: w_color(normal);
+    background-color: gtk("@theme_bg_color");
     background-image: none;
     color: transparent;
     }
   &:backdrop {
     @extend %undecorated_button;
-    color: backdrop(b_color(text));
-    &:disabled {color: backdrop(insensitive(b_color(text)));}
+    color: gtk("@theme_button_foreground_backdrop");
+    &:disabled {
+      color: gtk("@theme_button_foreground_backdrop_insensitive");
+    }
     @extend %undecorated_button;
         }
 	}
@@ -80,12 +82,12 @@
   
   &:hover {
     trough {
-      background-color: backdrop($trough_color);
+      background-color: $trough_color_backdrop;
       min-width: 6px;
     }
     slider {
         min-width: 6px;
-       background-color: b_color(hover);
+       background-color: gtk("@theme_button_decoration_hover");
     }
   }
 
@@ -100,12 +102,12 @@
 
   &.horizontal:hover {
     &.horizontal trough {
-      background-color: backdrop($trough_color);
+      background-color: $trough_color_backdrop;
       min-height: 6px;
     }
     &.horizontal slider {
         min-height: 6px;
-        background-color: b_color(hover);
+        background-color: gtk("@theme_button_decoration_hover");
     }
   }
   
@@ -116,13 +118,13 @@
     min-height: 30px;
     border-radius: 8px;
     background-clip: padding-box;
-    background-color: transparentize($scrollbar_color, 0.2);
+    background-color: gtkalpha($scrollbar_color_backdrop, 0.2);
     &:backdrop { 
-        background-color: backdrop($scrollbar_color); 
+        background-color: $scrollbar_color_backdrop; 
     }
     &:hover {
         min-width: 6px;
-       background-color: b_color(hover);
+       background-color: gtk("@theme_button_decoration_hover");
 
     }
   }
@@ -132,13 +134,13 @@
     min-height: 3px;
     border-radius: 8px;
     background-clip: padding-box;
-    background-color: transparentize($scrollbar_color, 0.2);
+    background-color: gtkalpha($scrollbar_color_backdrop, 0.2);
     &:backdrop { 
-        background-color: backdrop($scrollbar_color); 
+        background-color: $scrollbar_color_backdrop; 
     }
     &:hover {
         min-height: 6px;
-        background-color: b_color(hover);
+        background-color: gtk("@theme_button_decoration_hover");
         
     }
 
diff --git a/src/gtk3/widgets/_sidebar.scss b/src/gtk3/widgets/_sidebar.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_sidebar.scss
@@ -0,0 +1,224 @@
+@charset "UTF-8";
+
+/***********
+ * Sidebar *
+ ***********/
+
+@mixin selected-item-highlight {
+  @if $new-highlight {
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_button_foreground_active");
+    border-right: 3px solid gtk("@theme_button_decoration_focus");
+    border-top: 0;
+    border-bottom: 0;
+    border-left: 0;
+    border-radius: 0px;
+  }
+}
+@mixin selected-item-highlight-rtl {
+  @if $new-highlight {
+    background-color: gtk("@theme_selected_bg_color");
+    color: gtk("@theme_button_foreground_active");
+    border-left: 3px solid gtk("@theme_button_decoration_focus");
+    border-top: 0;
+    border-bottom: 0;
+    border-right: 0;
+    border-radius: 0px;
+  }
+}
+
+.sidebar {
+  border: none;
+  background-color: gtk("@theme_bg_color");
+  &:selected {
+    @extend %selected_items;
+  }
+  &:backdrop { 
+    background-color: gtk("@theme_unfocused_bg_color");
+  }
+  row {
+    transition: all 150ms $ease-out-quad;
+  
+    &:hover { transition: none; }
+  
+    &.activatable {
+      border: 0;
+      &:dir(ltr) {
+        border-right: 3px solid transparent;
+      }
+      &:dir(rtl) {
+        border-left: 3px solid transparent;
+      }
+      
+      &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
+  
+      &:hover:dir(ltr) { 
+        @include selected-item-highlight();
+      }
+      &:hover:dir(rtl) {
+        @include selected-item-highlight-rtl();
+      }
+  
+      &:active:dir(ltr) {
+        @include selected-item-highlight();
+      }
+      &:active:dir(rtl) {
+        @include selected-item-highlight-rtl();
+      }
+  
+      &:selected {
+        &:dir(ltr) {
+          @include selected-item-highlight();
+        }
+        &:dir(rtl) {
+          @include selected-item-highlight-rtl();
+        }
+
+        &:active {
+          &:dir(ltr) {
+            @include selected-item-highlight();
+          }
+          &:dir(rtl) {
+            @include selected-item-highlight-rtl();
+          }
+        }
+  
+        &.has-open-popup,
+        &:hover {
+          &:dir(ltr) {
+            @include selected-item-highlight();
+          }
+          &:dir(rtl) {
+            @include selected-item-highlight-rtl();
+          }
+        }
+  
+        &:backdrop { 
+          background-color: gtk("@theme_unfocused_selected_bg_color_alt");
+        }
+      }
+    }
+  
+    &:selected { @extend %selected_items; }
+  }
+}
+
+// Places sidebar is a special case, since the view here have to look like chrome not content, so we override text color
+placessidebar {
+  > viewport.frame { border-style: none; }
+
+  row {
+    // Needs overriding of the GtkListBoxRow padding
+    min-height: 36px;
+    padding: 0px;
+
+    // Using margins/padding directly in the SidebarRow
+    // will make the animation of the new bookmark row jump
+    > revealer { padding: 0 14px; }
+
+    &:selected { 
+      color: gtk("@theme_selected_fg_color");
+    }
+
+    &:disabled { 
+      color: gtk("@insensitive_fg_color");
+    }
+
+    &:backdrop {
+      color: gtk("@theme_unfocused_fg_color");
+
+      &:selected { 
+        color: gtk("@theme_unfocused_selected_bg_color_alt");
+      }
+
+      &:disabled { 
+        color: gtk("@insensitive_unfocused_fg_color");
+      }
+    }
+
+    image.sidebar-icon {
+
+      &:dir(ltr) { padding-right: 8px; }
+      &:dir(rtl) { padding-left: 8px; }
+    }
+
+    label.sidebar-label {
+      &:dir(ltr) { padding-right: 2px; }
+      &:dir(rtl) { padding-left: 2px; }
+    }
+
+    @at-root button.sidebar-button {
+      @extend %button_basic.flat;
+
+      @extend %undecorated_button;
+
+      min-height: 26px;
+      min-width: 26px;
+      margin-top: 3px;
+      margin-bottom: 3px;
+      padding: 0;
+
+    }
+
+    // in the sidebar case it makes no sense to click the selected row
+    &:selected:active { box-shadow: none; }
+
+    &.sidebar-placeholder-row {
+      padding: 0 8px;
+      min-height: 2px;
+      background-image: none;
+      background-clip: content-box;
+    }
+
+    &.sidebar-new-bookmark-row { 
+      color: gtk("@theme_selected_bg_color");
+    }
+
+    // &:drop(active):not(:disabled) {
+    //   color: $drop_target_color;
+    //   box-shadow: inset 0 1px $drop_target_color,
+    //               inset 0 -1px $drop_target_color;
+    //
+    //   &:selected {
+    //     color: $selected_fg_color;
+    //     background-color: $drop_target_color;
+    //   }
+    // }
+  }
+}
+
+placesview {
+  .server-list-button > image {
+    transition: 200ms $ease-out-quad;
+    -gtk-icon-transform: rotate(0turn);
+  }
+
+  .server-list-button:checked > image {
+    transition: 200ms $ease-out-quad;
+    -gtk-icon-transform: rotate(-0.5turn);
+  }
+
+  row.activatable:hover { background-color: transparent; }
+
+  // this selects the "connect to server" label
+  > actionbar > revealer > box > label {
+    padding-left: 8px;
+    padding-right: 8px;
+  }
+}
+
+stacksidebar {
+  &.sidebar {
+    row {
+      padding: 10px 4px;
+      > label {
+        padding-left: 6px;
+        padding-right: 6px;
+      }
+      &.needs-attention > .label {
+        @extend %needs_attention;
+        background-size: 6px 6px, 0 0;
+      }
+    }
+  }
+}
diff --git a/src/gtk320/widgets/_spinbutton.scss b/src/gtk3/widgets/_spinbutton.scss
rename from src/gtk320/widgets/_spinbutton.scss
rename to src/gtk3/widgets/_spinbutton.scss
--- a/src/gtk320/widgets/_spinbutton.scss
+++ b/src/gtk3/widgets/_spinbutton.scss
@@ -30,32 +30,32 @@
        margin: 0;
        padding-bottom: 0;
        padding-top: 0;
-       color: v_color(text);
+       color: gtk("@theme_text_color");
        background-image: none;
        background-color: transparent;
        border-style: none;
        box-shadow: none;
 
        &:hover {
-         color: v_color(hover);
+         color: gtk("@theme_view_hover_decoration_color");
        }
 
        &:disabled {
-         color: insensitive(v_color(text));
+         color: gtk("@insensitive_base_color");
        }
 
        &:active {
-         color: v_color(active);
+         color: gtk("@theme_view_active_decoration_color");
          box-shadow: none;
        }
 
        &:backdrop {
-         color: backdrop(v_color(text));
+         color: gtk("@theme_unfocused_text_color");
          background-color: transparent;
        }
 
        &:backdrop:disabled {
-         color: backdrop(insensitive(v_color(text)));
+         color: gtk("@theme_unfocused_view_text_color");
          background-color: transparent;
          border-style: none; // It is needed or it gets overridden
        }
@@ -74,9 +74,9 @@
 
      // FIXME: this should not be set at all, but otherwise it gets the wrong
      // color
-     &:disabled { color: insensitive(v_color(text)); }
+     &:disabled { color: gtk("@insensitive_base_color"); }
 
-     &:backdrop:disabled { color: backdrop(insensitive(v_color(text))); }
+     &:backdrop:disabled { color: gtk("@theme_unfocused_view_text_color"); }
 
      &:drop(active) {
        border-color: transparent;
@@ -88,18 +88,18 @@
        min-height: 26px;
        min-width: 26px;
        border-style: none solid none solid;
-       border-color: $border_color;
+       border-color: gtk("@borders");
        padding: 0;
        border-radius: 0;
        &:disabled {
-        color: insensitive(v_color(text));
-        background-color: insensitive(v_color(normal));
-        border-color: insensitive($border_color);
+        color: gtk("@insensitive_base_color");
+        background-color: gtk("@insensitive_base_fg_color");
+        border-color: gtk("@insensitive_borders");
         }
        &:backdrop:disabled {
-         color: backdrop(insensitive(v_color(text)));
-         background-color: backdrop(insensitive(v_color(normal)));
-         border-color: backdrop(insensitive($border_color));
+         color: gtk("@theme_unfocused_view_text_color");
+         background-color: gtk("@theme_unfocused_view_bg_color");
+         border-color: gtk("@unfocused_insensitive_borders");
         }
      }
 
@@ -109,20 +109,20 @@
        padding: 0;
        box-shadow: none;
        background-image: none;
-       background-color: v_color(normal);
-       color: v_color(text);
-       border-color: $border_color;
-       &:hover { color: v_color(hover);}
-       &:active { color: v_color(active);}
+       background-color: gtk("@theme_base_color");
+       color: gtk("@theme_base_color");
+       border-color: gtk("@borders");
+       &:hover { color: gtk("@theme_view_hover_decoration_color");}
+       &:active { color: gtk("@theme_view_active_decoration_color");}
        &:disabled {
-        color: insensitive(v_color(text));
-        background-color: insensitive(v_color(normal));
-        border-color: insensitive($border_color);
+        color: gtk("@insensitive_base_color");
+        background-color: gtk("@insensitive_base_fg_color");
+        border-color: gtk("@insensitive_borders");
         }
        &:backdrop:disabled {
-         color: backdrop(insensitive(v_color(text)));
-         background-color: backdrop(insensitive(v_color(normal)));
-         border-color: backdrop(insensitive($border_color));
+         color: gtk("@theme_unfocused_view_text_color");
+         background-color: gtk("@theme_unfocused_view_bg_color");
+         border-color: gtk("@unfocused_insensitive_borders");
         }
 
        &.up {
diff --git a/src/gtk3/widgets/_switch.scss b/src/gtk3/widgets/_switch.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_switch.scss
@@ -0,0 +1,54 @@
+@charset "UTF-8";
+
+/**********
+ * Switch *
+ **********/
+
+switch {
+ margin: 2px;
+ font-weight: bold;
+ font-size: smaller;
+ min-width: 48px;
+ min-height: 24px;
+ border: 0px solid;
+ border-radius: 12px;
+ color: transparent;
+ background-color: gtkalpha("@theme_button_foreground_normal",0.3);
+ text-shadow: none;
+
+ &:checked {
+   background-color: gtk("@theme_selected_bg_color");
+ }
+
+ &:backdrop {
+   background-color: gtkalpha("@theme_button_foreground_backdrop", 0.3);
+   text-shadow: none;
+
+   &:checked {
+     background-color: gtk("@theme_unfocused_selected_bg_color_alt");
+   }
+ }
+
+ slider {
+   min-width: 22px;
+   min-height: 22px;
+   border: 1px solid;
+   border-radius: 11px;
+   background-color: gtk("@theme_bg_color");
+   border-color: gtk("@borders");
+ }
+
+ &:hover slider { border-color: gtk("@theme_button_decoration_hover"); }
+
+ &:disabled slider {
+   background-color: gtk("@insensitive_bg_color");
+ }
+
+ &:backdrop {
+   slider {
+     background-color: gtk("@theme_unfocused_bg_color");
+   }
+
+   &:disabled slider { background-color: gtk("@insensitive_unfocused_bg_color"); }
+ }
+}
diff --git a/src/gtk320/widgets/_toolbar.scss b/src/gtk3/widgets/_toolbar.scss
rename from src/gtk320/widgets/_toolbar.scss
rename to src/gtk3/widgets/_toolbar.scss
--- a/src/gtk320/widgets/_toolbar.scss
+++ b/src/gtk3/widgets/_toolbar.scss
@@ -6,13 +6,13 @@
  %toolbar {
   -GtkWidget-window-dragging: true;
   padding: 4px;
-  background-color: w_color(normal);
+  background-color: gtk("@theme_bg_color");
 }
 toolbar {
   @extend %toolbar;
   padding: 4px 3px 3px 4px;
   &:backdrop {
-    background-color: backdrop(w_color(normal));
+    background-color: gtk("@theme_unfocused_bg_color");
     box-shadow: none;
   }
   button {
@@ -35,10 +35,10 @@
     padding: 13px;
     border: none;
     border-radius: $r;
-    background-color: w_color(normal);
+    background-color: gtk("@theme_bg_color");
     &:backdrop {
-      border-color: backdrop($border_color);
-      background-color: backdrop(w_color(normal));
+      border-color: gtk("@unfocused_borders");
+      background-color: gtk("@theme_unfocused_bg_color");
       box-shadow: none;
     }
     &.left,
@@ -66,7 +66,7 @@
 
 %inset-bar {
   border-style: solid;
-  border-color: $border_color;
+  border-color: gtk("@borders");
   text-shadow: none;
-  background-color: w_color(normal);
+  background-color: gtk("@theme_bg_color");
 }
diff --git a/src/gtk320/widgets/_tooltips.scss b/src/gtk3/widgets/_tooltips.scss
rename from src/gtk320/widgets/_tooltips.scss
rename to src/gtk3/widgets/_tooltips.scss
--- a/src/gtk320/widgets/_tooltips.scss
+++ b/src/gtk3/widgets/_tooltips.scss
@@ -8,16 +8,16 @@
   &.background {
     // background-color needs to be set this way otherwise it gets drawn twice
     // see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
-    background-color: tooltip(background);
+    background-color: gtk("@tooltip_background");
     background-clip: padding-box;
   }
 
-  color: tooltip(text);
+  color: gtk("@tooltip_text");
   padding: 4px; /* not working */
   border-radius: $r;
   box-shadow: none; // otherwise it gets inherited by windowframe.csd
   text-shadow: none;
-  border: 1px solid tooltip(border);
+  border: 1px solid gtk("@tooltip_border");
   &.window-frame.csd {
     background-color: transparent;
     box-shadow: none;
@@ -28,5 +28,5 @@
 tooltip * { //Yeah this is ugly
   padding: 0px;
   background-color: transparent;
-  color: tooltip(text); // just to be sure
+  color: gtk("@tooltip_text"); // just to be sure
 }
diff --git a/src/gtk3/widgets/_treeview.scss b/src/gtk3/widgets/_treeview.scss
new file mode 100644
--- /dev/null
+++ b/src/gtk3/widgets/_treeview.scss
@@ -0,0 +1,169 @@
+@charset "UTF-8";
+
+@mixin item-highlight-middle {
+  @if $new-highlight {
+    background-color: gtkalpha(gtk("@theme_button_decoration_focus"), 0.3);
+    color: gtk("@theme_button_foreground_active");
+    border: 1px solid gtk("@theme_button_decoration_focus");
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0px;
+  } @else {
+    background-color: gtk("@theme_selected_bg_color");
+    border-left-color: gtk("@theme_selected_fg_color");
+    border-top-color: gtk("@theme_selected_fg_color");
+  }
+}
+
+@mixin item-highlight-middle-backdrop {
+  @if $new-highlight {
+    background-color: gtkalpha(gtk("@theme_button_decoration_focus_backdrop"), 0.3);
+    color: gtk("@theme_button_foreground_active_backdrop");
+    border: 1px solid gtk("@theme_button_decoration_focus_backdrop");
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0px;
+  } @else {
+    background-color: gtk("@theme_unfocused_selected_bg_color");
+    border-left-color: gtk("@theme_unfocused_selected_fg_color");
+    border-top-color: gtk("@theme_unfocused_selected_fg_color");
+  }
+}
+
+/**************
+ * Tree Views *
+ **************/
+treeview.view {
+  -GtkTreeView-grid-line-width: 0;
+  -GtkTreeView-grid-line-pattern: '';
+  -GtkTreeView-tree-line-width: 1;
+  -GtkTreeView-tree-line-pattern: '';
+  -GtkTreeView-expander-size: 16;
+
+  border-left-color: gtk("@borders"); // this is actually the tree lines color,
+  border-top-color: transparent;                    // while this is the grid lines color, better then nothing
+
+  rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props
+
+  &:selected { border-radius: 0; } // rest border radius in lists
+
+  &:hover {
+    @include item-highlight-middle();
+  }
+
+  &:selected  {
+    @include item-highlight-middle();
+  }
+  
+  &:backdrop:selected {
+    @include item-highlight-middle-backdrop();
+  }
+
+  &:disabled {
+    color: gtk("@insensitive_borders");
+    &:selected {
+      color: gtk("@insensitive_selected_fg_color");
+      &:backdrop { color: gtk("@insensitive_unfocused_selected_fg_color"); }
+    }
+    &:backdrop { color: gtk("@unfocused_insensitive_borders"); }
+  }
+  &.separator {
+    min-height: 2px;
+    color: gtk("@borders");
+  }
+  &.separator:backdrop {
+    color: gtk("@unfocused_borders");
+  }
+
+  &:backdrop {
+    border-left-color: gtk("@unfocused_borders");
+  }
+
+  &:drop(active) {
+    border-style: solid none;
+    border-width: 1px;
+    border-color: gtk("@theme_button_decoration_hover");
+  }
+
+  &.expander {
+    // GtkTreeView uses the larger of the expander’s min-width and min-height
+    min-width: 16px;
+    min-height: 16px;
+    -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
+    color: gtk("@theme_base_color");
+    &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); };
+    &:hover { color: gtk("@theme_button_decoration_hover"); }
+    &:selected { color: gtk("@theme_selected_fg_color"); }
+    &:checked {
+       -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
+      &:selected { color: gtk("@theme_selected_fg_color"); }
+      &:backdrop { color: gtk("@theme_unfocused_base_color"); }
+    }
+    &:backdrop { color: gtk("@theme_unfocused_base_color"); }
+  }
+  header {
+    button {
+      @extend %column_header_button;
+      color: gtk("@theme_button_foreground_normal");
+      background-color: gtk("@theme_button_background_normal");
+      text-shadow: none;
+      box-shadow: none;
+      &:hover {
+        @extend %column_header_button;
+        color: gtk("@theme_button_foreground_normal");
+        background-color: gtkalpha("@theme_button_decoration_hover", 0.5);
+        box-shadow: none;
+        transition: none; //I shouldn't need this
+      }
+      &:active {
+        @extend %column_header_button;
+        color: gtk("@theme_button_foreground_normal");
+        background-color: gtkalpha("@theme_button_decoration_hover", 0.5);
+        transition: none; //I shouldn't need this
+      }
+    }
+    button:last-child { &:backdrop, & { border-right-style: none; }}
+    }
+    button.dnd,
+    header.button.dnd { // for treeview-like derive widgets
+      &:active, &:selected, &:hover, & {
+        padding: 0 6px;
+        color: gtk("@theme_selected_fg_color");
+        background-image: none;
+        background-color: gtk("@theme_selected_bg_color");
+        border-style: none;
+        border-radius: 0;
+        box-shadow: none;
+        text-shadow: none;
+        transition: none;
+      }
+    }
+}
+
+%column_header_button {
+  padding: 6px;
+  border-style: none solid solid none;
+  border-radius: 0;
+  background-image: none;
+  border-color: gtk("@borders");
+  text-shadow: none;
+  &:disabled {
+    border-color: gtk("@insensitive_borders");
+    color: gtk("@theme_button_foreground_insensitive");
+    background-color: gtk("@theme_button_background_insensitive");
+    background-image: none;
+  }
+  &:backdrop {
+    border-color: gtk("@unfocused_borders");
+    border-style: none solid solid none;
+    color: gtk("@theme_button_foreground_backdrop");
+    background-image: none;
+    background-color: gtk("@theme_button_background_backdrop");
+    &:disabled {
+      border-color: gtk("@unfocused_insensitive_borders");
+      background-image: none;
+      background-color: gtk("@theme_button_background_backdrop_insensitive");
+      color: gtk("@theme_button_foreground_backdrop_insensitive");
+    }
+  }
+}
diff --git a/src/gtk320/widgets/_window_decorations.scss b/src/gtk3/widgets/_window_decorations.scss
rename from src/gtk320/widgets/_window_decorations.scss
rename to src/gtk3/widgets/_window_decorations.scss
--- a/src/gtk320/widgets/_window_decorations.scss
+++ b/src/gtk3/widgets/_window_decorations.scss
@@ -44,7 +44,7 @@
     margin: 0;
     padding: 1px;
     border: none;
-    background-color: t_color(background-light);
+    background-color: gtk("@theme_titlebar_background_light");
     box-shadow: none;
   }
 }
diff --git a/src/gtk318/widgets/_app_notifications.scss b/src/gtk318/widgets/_app_notifications.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_app_notifications.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-@charset "UTF-8";
-
-/*********************
- * App Notifications *
- *********************/
-
-.app-notification,
-.app-notification.frame {
-  @extend %osd;
-  padding: 10px;
-  border-top-width: 0px;
-  border-radius: 0px 0px 3px 3px;
-  &:backdrop { background-image: none; }
-  .button {
-    @include button(normal);
-    &.flat {
-      @extend %undecorated_button;
-      icon-shadow: none;
-      text-shadow: none;
-      &:hover {
-        @extend %undecorated_button;
-        color: b_color(hover);
-      }
-      &:active {
-        @extend %undecorated_button;
-        color: b_color(active);
-      }
-      &:backdrop,
-      &:insensitive,
-      &:backdrop:insensitive { @extend %undecorated_button; }
-    }
-    &:hover { @include button(hover); }
-    &:active,
-    &:checked,
-    &:backdrop:active,
-    &:backdrop:checked {
-      @include button(active);
-    }
-    &:insensitive,
-    &:backdrop:insensitive {
-      @include button(insensitive);
-    }
-    &:backdrop { @include button(backdrop); }
-  }
-}
diff --git a/src/gtk318/widgets/_base.scss b/src/gtk318/widgets/_base.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_base.scss
+++ /dev/null
@@ -1,210 +0,0 @@
-@charset "UTF-8";
-
-@function gtkalpha($c,$a) {
-  @return unquote("alpha(#{$c},#{$a})");
-}
-
-$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
-
-* {
-  padding: 0;
-  -GtkToolButton-icon-spacing: 4;
-  -GtkTextView-error-underline-color: $error_color;
-
-  -GtkButton-child-displacement-x: 0;
-  -GtkButton-child-displacement-y: 0;
-
-  -GtkCheckButton-indicator-size: 18;
-  -GtkCheckMenuItem-indicator-size: 18;
-
-  // The size for scrollbars. The slider is 2px smaller, but we keep it
-  // up so that the whole area is sensitive to button presses for the
-  // slider. The stepper button is larger in both directions, the slider
-  // only in the width
-
-  -GtkScrolledWindow-scrollbar-spacing: 0;
-  -GtkScrolledWindow-scrollbars-within-bevel: 1;
-
-  -GtkToolItemGroup-expander-size: 11;
-  -GtkExpander-expander-size: 16;
-  -GtkTreeView-expander-size: 11;
-
-  -GtkTreeView-horizontal-separator: 4;
-
-  -GtkMenu-horizontal-padding: 0;
-  -GtkMenu-vertical-padding: 0;
-
-  -GtkWidget-link-color: $link_color;
-  -GtkWidget-visited-link-color: $link_visited_color;
-
-  -GtkWidget-focus-padding: 2;    // FIXME: do we still need these?
-  -GtkWidget-focus-line-width: 1; //
-
-  -GtkWidget-text-handle-width: 20;
-  -GtkWidget-text-handle-height: 20;
-
-  -GtkDialog-button-spacing: 4;
-  -GtkDialog-action-area-border: 0;
-
-  -GtkStatusbar-shadow-type: none;
-
-  outline-width: 0px;
-}
-
-
-/***************
- * Base States *
- ***************/
-
-.background {
-  color: w_color(text);
-  background-color: w_color(normal);
-
-  &:backdrop {
-    text-shadow: none;
-    icon-shadow: none;
-    color: backdrop(w_color(text));
-    background-color: backdrop(w_color(normal));
-  }
-}
-
-/*
-   These wildcard seems unavoidable, need to investigate.
-   Wildcards are bad and troublesome, use them with care,
-   or better, just don't.
-   Everytime a wildcard is used a kitten dies, painfully.
-*/
-
-*:insensitive {
-  -gtk-image-effect: dim;
-}
-
-.gtkstyle-fallback {
-  background-color: w_color(normal);
-  color: w_color(text);
-  &:prelight {
-    background-color: lighten(w_color(normal), 10%);
-    color: w_color(text);
-  }
-  &:active {
-    background-color: darken(w_color(normal), 10%);
-    color: w_color(text);
-  }
-  &:insensitive {
-    background-color: insensitive(w_color(normal));
-    color: insensitive(w_color(text));
-  }
-  &:selected {
-    background-color: s_color(normal);
-    color: s_color(text);
-  }
-}
-
-.view {
-  color: v_color(text);
-  background-color: v_color(normal);
-
-  &:backdrop {
-    color: backdrop(v_color(text));
-    background-color: backdrop(v_color(normal));
-  }
-
-  &:selected {
-    border-radius: $r;
-    @extend %selected_items;
-  }
-  
-  &:insensitive {
-    color: insensitive(v_color(text));
-  }
-}
-
-.rubberband {
-  border: 1px solid s_color(normal);
-  background-color: transparentize(s_color(normal),0.8);
-  &:backdrop {
-    border-color: backdrop(s_color(normal));
-    background-color: backdrop(transparentize(s_color(normal),0.8));
-  }
-}
-
-.label {
-  &.separator {
-    color: w_color(text);
-    @extend .dim-label;
-    &:backdrop { color: backdrop(w_color(text)); }
-  }
-  &:selected,
-  &:selected:focus,
-  &:selected:hover {
-    @extend %selected_items;
-  }
-  &:insensitive {
-    color: insensitive(w_color(text));
-    &:backdrop { color: backdrop(insensitive(w_color(text))); }
-  }
-}
-
-.dim-label {
-  opacity: 0.5;
-  text-shadow: none;
-}
-
-GtkAssistant {
-  .sidebar {
-    background-color: v_color(text);
-    border-top: 1px solid $border_color;
-    &:dir(ltr) { border-right: 1px solid $border_color; }
-    &:dir(rtl) { border-left: 1px solid $border_color; }
-    &:backdrop {
-      background-color: backdrop(v_color(text));
-      border-color: backdrop($border_color);
-    }
-  }
-  &.csd .sidebar { border-top-style: none; }
-  .sidebar .label {
-    padding: 6px 12px;
-  }
-  .sidebar .label.highlight {
-    background-color: mix(v_color(normal), v_color(text), 80%);
-  }
-}
-
-GtkTextView { // This will get overridden by .view, needed by gedit line numbers
-  background-color: mix(w_color(normal), v_color(normal), 50%);
-  &:backdrop { background-color: backdrop(mix(w_color(normal), v_color(normal), 50%)); }
-	&:insensitive {
-    color: insensitive(v_color(text));
-  }
-}
-
-.grid-child {
-  padding: 3px;
-  border-radius: $r;
-  &:selected {
-    @extend %selected_items;
-  }
-}
-
-%osd, .osd {
-  color: w_color(text);
-  border: 1px solid w_color(normal);
-  background-color: transparentize(w_color(normal),0.2);
-  background-clip: padding-box;
-  box-shadow: none;
-  text-shadow: none;
-  icon-shadow: none;
-  &:backdrop {
-    color: backdrop(w_color(text));
-    background-color: backdrop(transparentize(w_color(normal),0.2));
-  }
-}
-
-%selected_items {
-  background-color: s_color(normal);
-  color: s_color(text);
-  &:backdrop {
-    background-color: backdrop(s_color(backdrop));
-    color: backdrop(v_color(normal));
-  }
-}
diff --git a/src/gtk318/widgets/_button.scss b/src/gtk318/widgets/_button.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_button.scss
+++ /dev/null
@@ -1,461 +0,0 @@
-@charset "UTF-8";
-
-
-// buttons
-
-@mixin button($t, $c:b_color(normal), $tc:b_color(text)) {
-//
-// Button drawing function
-//
-// $t:    button type,
-// $c:    base button color for colored* types
-// $tc:   optional text color for colored* types
-// $edge: set to none to not draw the bottom edge or specify a color to not
-//        use the default one
-//
-// possible $t values:
-// normal, hover, active, insensitive, insensitive-active,
-// backdrop, backdrop-active, backdrop-insensitive, backdrop-insensitive-active,
-// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
-//
-
-  @if $t==normal {
-  //
-  // normal button
-  //
-    box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-    text-shadow: none;
-    icon-shadow: none;
-
-    color: $tc;
-    border-color: if($c!=b_color(normal), $c, $border_color);
-    background-image: button_gradient($c, normal);
-  }
-
-  @else if $t==hover {
-  //
-  // hovered button
-  //
-    color: $tc;
-    border-color: if($c!=b_color(normal), $c, b_color(hover));
-  }
-
-  @else if $t==active {
-  //
-  // pushed button
-  //
-    color: if($tc==b_color(text),b_color(active-text), $tc);
-    border-color: if($c!=b_color(normal), $c, b_color(active));
-    background-image: if($c!=b_color(normal), button_gradient($c, active),
-                                          button_gradient(b_color(active),active));
-  }
-
-  @else if $t==active-hover {
-  //
-  //
-  //
-    color: $tc;
-    border-color: if($c!=b_color(normal), transparentize($c, 0.5), b_color(hover));
-    background-image: if($c!=b_color(normal), button_gradient(transparentize($c, 0.5),active),
-                                        button_gradient(b_color(hover),active));
-  }
-
-  @else if $t==insensitive {
-  //
-  // insensitive button
-  //
-    color: if($tc!=b_color(text),insensitive($tc),insensitive(b_color(text)));
-    border-color: if($c!=b_color(normal), insensitive($c), insensitive($border_color));
-    background-image: if($c!=b_color(normal), button_gradient(insensitive($c), normal),
-                                          button_gradient(insensitive(b_color(normal)), normal));
-    > .label { color: inherit; }
-  }
-
-  @else if $t==insensitive-active {
-  //
-  // insensitive pushed button
-  //
-    color: if($tc!=b_color(text), insensitive($tc), insensitive(b_color(active-text)));
-    border-color: insensitive(b_color(active));
-    background-image: if($c!=b_color(normal), button_gradient(insensitive($c), active),
-                                          button_gradient(insensitive(b_color(active)),active));
-    > .label { color: inherit; }
-  }
-
-  @else if $t==backdrop {
-  //
-  // backdrop button
-  //
-    color: backdrop($tc);
-    border-color: backdrop($border_color);
-    background-image: button_gradient(backdrop($c), normal);
-  }
-
-  @else if $t==backdrop-active {
-  //
-  // backdrop pushed button
-  //
-    color: if($tc!=b_color(text), backdrop($tc), backdrop(b_color(active-text)));
-    border-color: if($c!=b_color(normal), backdrop($c), backdrop(b_color(active)));
-    background-image: if($c!=b_color(normal), button_gradient(backdrop($c), active),
-                                          button_gradient(backdrop(b_color(active)),active));
-  }
-
-  @else if $t==backdrop-insensitive {
-  //
-  // backdrop insensitive button
-  //
-    color: backdrop(insensitive($tc));
-    border-color: if($c!=b_color(normal), backdrop(insensitive($c)), backdrop(insensitive($border_color)));
-    background-image: button_gradient(backdrop(insensitive($c)));
-    > .label { color: inherit; }
-  }
-
-  @else if $t==backdrop-insensitive-active {
-  //
-  // backdrop insensitive pushed button
-  //
-    color: if($c!=b_color(normal), backdrop(insensitive($tc)), backdrop(insensitive(b_color(active-text))));
-    border-color: if($c!=b_color(normal), backdrop(insensitive($c)), backdrop(insensitive(b_color(active))));
-    background-image: if($c!=b_color(normal), button_gradient(backdrop(insensitive($c)), active),
-                                          button_gradient(backdrop(insensitive(b_color(active))),active));
-    > .label { color: inherit; }
-  }
-
-  @else if $t==undecorated {
-  //
-  // reset
-  //
-    border-color: transparentize(white,1);  //FIXME needed?
-    background-color: transparent;
-    background-image: none;
-	  box-shadow:none;
-    color: $tc;
-
-    text-shadow: none;
-    icon-shadow: none;
-  }
-}
-
-/***********
- * Buttons *
- ***********/
-
-// stuff for .needs-attention
-$_dot_color: b_color(active);
-@keyframes needs_attention {
-  from {
-    background-image: -gtk-gradient(radial,
-                                    center center, 0,
-                                    center center, 0.01,
-                                    to($_dot_color),
-                                    to(transparent));
-  }
-  to {
-    background-image: -gtk-gradient(radial,
-                                    center center, 0,
-                                    center center, 0.5,
-                                    to(s_color(normal)),
-                                    to(transparent));
-  }
-}
-
-%buttons {
-
-    $_button_transition: all 200ms $ease-out-quad;
-
-    border: 1px solid;
-    border-radius: $r;
-    padding: 6px;
-    background-clip: border-box;
-    transition: $_button_transition;
-    @include button(normal);
-    &.flat {
-      @include button(undecorated);
-      // to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
-      // to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
-      // it won't fade out when the pointer leave the button allocation area. To make the transition more evident
-      // in this case the duration is increased.
-      transition: none;
-      &:hover {
-        transition: $_button_transition;
-        transition-duration: 500ms;
-        &:active { transition: $_button_transition; }
-      }
-      &:checked { background-color: $border_color;}
-    }
-    &:hover {
-      @include button(hover);
-      -gtk-image-effect: highlight;  // Do we want this?
-    }
-    &:active, &:checked {
-      @include button(active);
-      transition-duration: 50ms;
-      &:hover {
-  	  @include button(active-hover);
-        }
-    }
-   &:backdrop {
-     @include button(backdrop);
-     -gtk-image-effect: none;
-     &:active, &:checked {
-       @include button(backdrop-active);
-     }
-     &:insensitive {
-       @include button(backdrop-insensitive);
-     }
-     &:insensitive:active, &:insensitive:checked {
-       @include button(backdrop-insensitive-active);
-     }
-   }
-    &.flat:backdrop {
-      -gtk-image-effect: none;
-      @include button(undecorated);
-      color: backdrop(b_color(text));
-    }
-    &.flat:insensitive {
-      @include button(undecorated);
-      color: insensitive(b_color(text));
-    }
-    &.flat:backdrop:insensitive {
-      @include button(undecorated);
-      color: backdrop(insensitive(b_color(text)));
-    }
-    &:insensitive {
-      @include button(insensitive);
-      &:active, &:checked {
-        @include button(insensitive-active);
-      }
-    }
-}
-
-.button {
-  @extend %buttons;
-  &.osd {
-    @extend %buttons;
-  }
-  //overlay / OSD style
-  .osd & {
-    @extend %buttons;
-  }
-
-  // Suggested and Destructive Action buttons
-  @each $b_type, $button_color in (suggested-action, b_color(active)),
-                              (destructive-action, $error_color) {
-    &.#{$b_type},
-    &.#{$b_type}.osd & {
-      @include button(normal, $button_color, b_color(active-text));
-      &.flat {
-        @include button(undecorated);
-        color: $button_color;
-      }
-      &:hover { @include button(hover, $button_color, white); }  //FIXME no hardcoded colors
-      &:active, &:checked { @include button(active, $button_color, white); }
-      &:backdrop, &.flat:backdrop {
-        @include button(backdrop, $button_color, white);
-        &:active, &:checked {
-          @include button(backdrop-active, $button_color, white);
-        }
-        &:insensitive {
-          @include button(backdrop-insensitive);
-          &:active, &:checked {
-            @include button(backdrop-insensitive-active, $button_color, white);
-          }
-        }
-      }
-      &.flat:backdrop, &.flat:insensitive, &.flat:backdrop:insensitive {
-        @include button(undecorated);
-        color: transparentize($button_color, 0.2);
-      }
-      &:insensitive {
-        @include button(insensitive);
-        &:active, &:checked {
-          @include button(insensitive-active, $button_color, white);
-        }
-      }
-    }
-  }
-
-  &.image-button { padding: 6px; }
-
-  &.text-button {
-    padding: 6px
-  }
-
-  &.text-button.image-button {
-    // those buttons needs uneven horizontal padding, we want the icon side
-    // to have the image-button padding, while the text side the text-button
-    // one, so we're adding the missing padding to the label depending on
-    // its position inside the button
-    padding: 6px; // same as .button
-    .label:first-child { padding-left: 8px; }
-    .label:last-child { padding-right: 8px; }
-  }
-
-  .stack-switcher > & {
-    // to position the needs attention dot, padding is added to the button
-    // child, a label needs just lateral padding while an icon needs vertical
-    // padding added too.
-    > .label {
-      padding-left: 6px;  // label padding
-      padding-right: 6px; //
-    }
-    > GtkImage {
-      padding-left: 6px;   // image padding
-      padding-right: 6px;  //
-      padding-top: 3px;    //
-      padding-bottom: 3px; //
-    }
-    &.text-button {
-      padding: 6px; // needed or it will get overridden
-    }
-    &.image-button {
-      // we want image buttons to have a 1:1 aspect ratio, so compensation
-      // of the padding added to the GtkImage is needed
-      padding: 3px 0px;
-    }
-    &.needs-attention > .label,
-    &.needs-attention > GtkImage { @extend %needs_attention; }
-    &.needs-attention:active > .label,
-    &.needs-attention:active > GtkImage,
-    &.needs-attention:checked > .label,
-    &.needs-attention:checked > GtkImage {
-      animation: none;
-      background-image: none;
-    }
-  }
-
-  //inline-toolbar buttons
-  .inline-toolbar &, .inline-toolbar &:backdrop {
-    border-radius: $r;
-    border-width: 1px;
-    @extend %linked;
-  }
-
-  .primary-toolbar & { icon-shadow: none; }
-
-  .linked > &,
-  .linked > &:hover,
-  .linked > &:active,
-  .linked > &:checked,
-  .linked > &:backdrop { @extend %linked; }
-
-  .linked.vertical > &,
-  .linked.vertical > &:hover,
-  .linked.vertical > &:active,
-  .linked.vertical > &:checked,
-  .linked.vertical > &:backdrop { @extend %linked_vertical; }
-}
-
-/**************
- * ComboBoxes *
- **************/
-GtkComboBox {
-  > .button { padding: 5px 4px; } // Otherwise combos
-                                                       // are bigger then
-                                                       // buttons
-  -GtkComboBox-arrow-scaling: 0.5;
-  -GtkComboBox-shadow-type: none;
-
-//  box-shadow: 0 1px $borders_edge;
-
-
-  &:insensitive {
-    color: insensitive(b_color(text));
-    text-shadow: none;
-    icon-shadow: none;
-  }
-  &:backdrop {
-    color: backdrop(b_color(text));
-    text-shadow: none;
-    icon-shadow: none;
-  }
-  &:backdrop:insensitive {
-    color: backdrop(insensitive(b_color(text)));
-  }
-  .menuitem { text-shadow: none; }
-  .separator.vertical {
-    // always disable separators
-    -GtkWidget-wide-separators: true;
-  }
-  &.combobox-entry .entry { @extend %linked; }
-  &.combobox-entry .button, &.combobox-entry .button:backdrop {
-    // It is needed to specify the backdrop button or it gets overridden
-    @extend %linked;
-  }
-}
-
-%needs_attention {
-  animation: needs_attention 150ms ease-in;
-  $_dot_shadow: b_color(text);
-  $_dot_shadow_r: 0.5;
-  background-image: -gtk-gradient(radial,
-                                  center center, 0,
-                                  center center, 0.5,
-                                  to($_dot_color),
-                                  to(transparent)),
-                    -gtk-gradient(radial,
-                                  center center, 0,
-                                  center center, $_dot_shadow_r,
-                                  to($_dot_shadow),
-                                  to(transparent));
-  background-size: 6px 6px, 6px 6px;
-  background-repeat: no-repeat;
-  background-position: right 3px, right 4px;
-  &:backdrop {background-size: 6px 6px, 0 0;}
-  &:dir(rtl) {
-    background-position: left 3px, left 4px;
-  }
-}
-
-%linked_middle {
-  border-radius: $r;
-  &:dir(rtl) {
-    border-radius: $r; // needed when including %linked_middle:dir(rtl)
-  }
-}
-
-%linked {
-  @extend %linked_middle;
-  &:first-child {
-    border-radius: $r;
-    border-style: solid;
-  }
-  &:last-child {
-    border-radius: $r;
-    &:dir(rtl) { }
-  }
-  &:only-child {
-    border-radius: $r;
-    border-style: solid;
-  }
-}
-
-%linked_vertical_middle {
-  border-style: solid;
-  border-radius: $r;
-}
-
-%linked_vertical{
-  @extend %linked_vertical_middle;
-  &:first-child {
-    border-radius: $r;
-  }
-  &:last-child {
-    border-radius: $r;
-    border-style: solid;
-  }
-  &:only-child {
-    border-radius: $r;
-    border-style: solid;
-  }
-}
-
-%undecorated_button {
-  border-color: transparent;
-  background-color: transparent;
-  background-image: none;
-  box-shadow:none;
-  text-shadow: none;
-  icon-shadow: none;
-}
diff --git a/src/gtk318/widgets/_calendar.scss b/src/gtk318/widgets/_calendar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_calendar.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@charset "UTF-8";
-
-/************
- * Calendar *
- ***********/
-GtkCalendar {
-  color: v_color(text);
-  border: 1px solid $border_color;
-  background-color: v_color(normal);
-  &:selected {
-    background-color: $border_color;
-  }
-	&:insensitive {
-    color: insensitive(v_color(text));
-	}
-
-  &.header {
-    border: 1px solid $border_color;
-    border-radius: 0;
-    color: v_color(text);
-
-    &:backdrop {
-      color: backdrop(v_color(text));
-      border-color: backdrop($border_color);
-    }
-    
-    &:insensitive {
-      color: insensitive(v_color(text));
-    }
-  }
-
-  &.button {
-    @extend %undecorated_button;
-    color: b_color(text);
-
-    &:hover {
-      @extend %undecorated_button;
-      color: b_color(hover);
-    }
-    &:active {
-      @extend %undecorated_button;
-      color: b_color(active);
-    }
-    &:backdrop {
-      @extend %undecorated_button;
-      color: backdrop(b_color(text));
-    }
-  }
-
-  &:inconsistent,
-  &.highlight {
-    color: transparentize(v_color(text),0.5);
-  }
-
-  &:inconsistent:backdrop,
-  &.highlight:backdrop {
-    color: backdrop(transparentize(v_color(text),0.5));
-  }
-
-
-  &:backdrop {
-    color: backdrop(v_color(text));
-    border-color: backdrop($border_color);
-    background-color: backdrop(v_color(normal));
-  }
-}
diff --git a/src/gtk318/widgets/_checkboxes.scss b/src/gtk318/widgets/_checkboxes.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_checkboxes.scss
+++ /dev/null
@@ -1,85 +0,0 @@
-@charset "UTF-8";
-
-/*************************
- * Check and Radio items *
- *************************/
-
-// draw regular check and radio items using our PNG assets
-// all assets are rendered from assets.svg. never add pngs directly
-
-@each $w,$a in ('check', 'check'),
-               ('radio','radio') {
-
-  //standard checks and radios
-  @each $s,$as in ('','-unchecked'),
-                  (':hover', '-unchecked-hover'),
-                  (':active', '-unchecked-active'),
-                  (':insensitive','-unchecked-insensitive'),
-                  (':backdrop', '-unchecked-backdrop'),
-                  (':backdrop:insensitive', '-unchecked-backdrop-insensitive'),
-                  (':inconsistent', '-mixed-active'),
-                  (':inconsistent:hover', '-mixed-hover'),
-                  (':inconsistent:selected', '-mixed-active'),
-                  (':inconsistent:backdrop', '-mixed-backdrop'),
-                  (':inconsistent:insensitive', '-mixed-insensitive'),
-                  (':inconsistent:insensitive:backdrop', '-mixed-backdrop-insensitive'),
-                  (':checked', '-checked-active'),
-                  (':checked:insensitive','-checked-insensitive'),
-                  (':checked:hover', '-checked-hover'),
-                  (':checked:active', '-checked-active'),
-                  (':backdrop:checked', '-checked-backdrop'),
-                  (':backdrop:checked:insensitive', '-checked-backdrop-insensitive') {
-    .#{$w}#{$s} {
-      -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}#{$as}.png"), url("../assets/#{$a}#{$as}@2.png"));
-      icon-shadow: none;
-    }
-  }
-  @each $ms, $ma in ('', '-unchecked'),
-                    (':active', '-checked-active'),
-                    (':checked', '-checked-active'),
-                    (':inconsistent','-mixed-active') {
-
-    .menu .menuitem.#{$w}#{$ms},
-    .popover .button.flat.#{$w}#{$ms} {
-        &:hover {
-        -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}#{$ma}.png"), url("../assets/#{$a}#{$ma}@2.png"));
-      }
-    }
-  }
-}
-
-//treeview and list-rows
-.view.check, .view.radio,
-.list-row .check, list-row .radio {
-  icon-shadow: none;
-  &:selected, &:hover { icon-shadow: none; }
-}
-
-//selection-mode
-@each $s,$as in ('','-unchecked'),
-                  (':hover', '-unchecked-hover'),
-                  (':active', '-unchecked-active'),
-                  (':backdrop', '-unchecked-backdrop'),
-                  (':checked', '-checked-active'),
-                  (':checked:hover', '-checked-hover'),
-                  (':checked:active', '-checked-active'),
-                  (':backdrop:checked', '-checked-backdrop') {
-  .view.content-view.check#{$s} {
-    icon-shadow: none;
-    -gtk-icon-source: -gtk-scaled(url("../assets/check-selectionmode#{$as}.png"),
-                                    url("../assets/check-selectionmode#{$as}@2.png"));
-    background-color: transparent;
-  }
-}
-
-GtkCheckButton.text-button, GtkRadioButton.text-button {
-  // this is for a nice focus on check and radios text
-  padding: 1px 2px 4px;
-  outline-offset: 0;
-  &:insensitive,
-  &:insensitive:active,
-  &:insensitive:inconsistent {
-    color: insensitive(b_color(text));
-    &:backdrop { color: backdrop(insensitive(b_color(text))); }
-  }
-}
diff --git a/src/gtk318/widgets/_color_chooser.scss b/src/gtk318/widgets/_color_chooser.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_color_chooser.scss
+++ /dev/null
@@ -1,98 +0,0 @@
-@charset "UTF-8";
-
-/*****************
- * Color Chooser *
- *****************/
-
-GtkColorSwatch {
-// take care of colorswatches on selected elements
-  :selected & {
-    box-shadow: none;
-    &.overlay, &.overlay:hover {
-      border-color: s_color(text);
-    }
-  }
-
-  &:selected { box-shadow: none; }
-
-  &.top,
-  &.bottom,
-  &.left, &:first-child:not(.overlay):not(.top),
-  &.right, &:last-child:not(.overlay):not(.bottom),
-  &:only-child:not(.overlay),
-  &.top > .overlay,
-  &.bottom > .overlay,
-  &:first-child:not(.top) > .overlay,
-  &:last-child:not(.bottom) > .overlay,
-  &:only-child > .overlay { border-radius: $r; }
-
-  // hover effect
-  &:hover,
-  &:hover:selected {
-    background-image: linear-gradient(135deg, transparentize(white, 0.3),
-                                              transparentize(white, 1) 50%);
-    box-shadow: inset 0 1px transparentize(white, 0.6);
-    &.color-dark { // swatches with colors with luminosity lower than 50% get the color-dark class
-      background-image: linear-gradient(135deg, transparentize(white, 0.5),
-                                                transparentize(white, 1) 50%);
-    }
-  }
-  &:backdrop,
-  &:backdrop:selected
-  &.color-dark:backdrop,
-  &.color-dark:backdrop:selected {
-    background-image: none;
-    box-shadow: none;
-  }
-
-  // no hover effect for the colorswatch in the color editor
-  GtkColorEditor & {
-    border-radius: $r; // same radius as the entry
-    &:hover {
-      background-image: none;
-      box-shadow: none;
-    }
-    &:backdrop { box-shadow: none; }
-  }
-
-  // indicator and keynav outline colors
-  &.color-dark {
-    color: white;
-    outline-color: transparentize(black, 0.7);
-    &:backdrop { color: transparentize(white, 0.7); }
-  }
-  &.color-light {
-    color: black;
-    outline-color: transparentize(white, 0.5);
-    &:backdrop { color: transparentize(black, 0.7); }
-  }
-
-  // border color
-  &.overlay,
-  &.overlay:selected {
-    border: 1px solid $border_color;
-    &:hover { border-color: b_color(hover); }
-  }
-
-  // make the add color button looks like, well, a button
-  &#add-color-button {
-    border-style: solid; // the borders are drawn by the overlay for standard colorswatches to have them semi
-    border-width: 1px;   // translucent on the colored background, here it's not necessary so they need to be set
-    @include button(normal);
-    &:hover { @include button(hover); }
-    &:backdrop { @include button(backdrop); }
-    .overlay { @include button(undecorated); } // reset the overlay to not cover the button style underneat
-  }
-}
-
-GtkColorButton.button {
-  padding: 5px; // Uniform padding on the GtkColorButton
-
-  GtkColorSwatch:first-child:last-child { // :first-child:last-child for a specificity bump, it gets overridden by the
-                                          // colorpicker style, otherwise
-    border-radius: 0;
-    box-shadow: none;
-    &:insensitive,
-    &:backdrop { box-shadow: none; }
-  }
-}
diff --git a/src/gtk318/widgets/_dialogs.scss b/src/gtk318/widgets/_dialogs.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_dialogs.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-@charset "UTF-8";
-
-/***********
- * Dialogs *
- ***********/
-
-// .message-dialog .dialog-action-area .button {
-//   //padding: 8px;
-// }
-
-.message-dialog { // Message Dialog styling
-  -GtkDialog-button-spacing: 8;
-  -GtkDialog-action-area-border: 8;
-    &.background { background-color: w_color(normal); }
-    &:backdrop { background-color: backdrop(w_color(normal))}
-  .titlebar {
-    box-shadow: none;
-  }
-}
-
-GtkFileChooserDialog {
-  .search-bar {
-    background-color: w_color(normal);
-    border-color: w_color(normal);
-    box-shadow: none;
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-      border-color: backdrop(w_color(normal));
-      color: backdrop(w_color(text));
-    }
-  }
-  .dialog-action-box {
-    border-top: 1px solid $border_color;
-    &:backdrop { border-top-color: backdrop($border_color); }
-  }
-}
diff --git a/src/gtk318/widgets/_entry.scss b/src/gtk318/widgets/_entry.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_entry.scss
+++ /dev/null
@@ -1,119 +0,0 @@
-@charset "UTF-8";
-
-@mixin entry($t, $fc:v_color(active)) {
-//
-// Entries drawing function
-//
-// $t: entry type
-// $fc: focus color
-// $edge: set to none to not draw the bottom edge or specify a color to not
-//        use the default one
-//
-// possible $t values:
-// normal, focus, insensitive, backdrop, backdrop-insensitive, osd, osd-focus, osd-backdrop;
-//
-  @if $t==normal {
-    color: v_color(text);
-    border-color: $border_color;
-    background-color: v_color(normal);
-    box-shadow: none;
-  }
-
-  @if $t==focus {
-    border-color: $fc;
-  }
-
-  @if $t==insensitive {
-    color: insensitive(v_color(text));
-    border-color: insensitive($border_color);
-    background-color: insensitive(v_color(normal));
-  }
-
-  @if $t==backdrop {
-    color: backdrop(v_color(text));
-    border-color: backdrop($border_color);
-    background-color: backdrop(v_color(normal));
-  }
-
-  @if $t==backdrop-insensitive {
-    color: backdrop(insensitive(v_color(text)));
-    border-color: backdrop(insensitive($border_color));
-    background-color: backdrop(insensitive(v_color(normal)));
-  }
-}
-
-/****************
- * Text Entries *
- ****************/
-
-.entry {
-  border: 1px solid;
-  padding: 5px 8px 5px;
-
-  &.image { // icons inside the entry
-    &.left { padding-left: 0; }
-    &.right { padding-right: 0; }
-  }
-
-  border-radius: $r;
-  transition: all 200ms $ease-out-quad;
-  @include entry(normal);
-
-  &.flat, &.flat:focus {
-    padding: 2px;
-    @include entry(normal);
-    border: none;
-    border-radius: 0;
-  }
-
-  &:focus { @include entry(focus); }
-  &:insensitive { @include entry(insensitive); }
-  &:backdrop { @include entry(backdrop); }
-  &:backdrop:insensitive { @include entry(backdrop-insensitive); }
-
-  &:selected,
-  &:selected:focus {
-    @extend %selected_items;
-  }
-
-  &.progressbar {
-    margin: 1px;
-    border-radius: 0;
-    border-width: 0 0 2px;
-    border-color: s_color(normal);
-    border-style: solid;
-    background-image: none;
-    background-color: transparent;
-    box-shadow: none;
-    &:backdrop {
-      background-color: transparent;
-      border-color: backdrop(s_color(backdrop));
-    }
-  }
-
-  @each $e_type, $e_color in (error, $error_color),
-                             (warning, $warning_color) {
-    &.#{$e_type} {
-      color: $e_color;
-      border-color: $e_color;
-      background-color: transparentize($e_color, 0.5);
-      &:focus {
-        @include entry(focus, $e_color);
-        background-color: transparentize($e_color, 0.5);
-      }
-      &:selected, &:selected:focus { background-color: $e_color; }
-      &:backdrop {
-        color: backdrop($e_color);
-        border-color: backdrop($e_color);
-        background-color: backdrop(transparentize($e_color, 0.5));
-      }
-    }
-  }
-
-  &.image { // entry icons colors
-    color: mix(w_color(text),v_color(text), 80%);
-    &:hover { color: b_color(hover); }
-    &:active { color: b_color(active); }
-    &:backdrop { color: backdrop(mix(w_color(text), v_color(text), 80%)); }
-  }
-}
diff --git a/src/gtk318/widgets/_headerbar.scss b/src/gtk318/widgets/_headerbar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_headerbar.scss
+++ /dev/null
@@ -1,159 +0,0 @@
-@charset "UTF-8";
-
-/***************
- * Header bars *
- ***************/
-
-.titlebar,
-.header-bar {
-  transition: none;
-  padding: 4px 6px;
-  border-width: 0px 0px 1px 0px;
-  border-radius: 3px 3px 0px 0px;
-  border-style: solid;
-  border-color: $border_color;
-  color: t_color(text);
-  background-image: linear-gradient(to bottom,t_color(background-light),t_color(background));
-  &:backdrop {
-    border-color: transparent;
-    background-image: none;
-    background-color: t_color(backdrop-background);
-    color: t_color(backdrop-text);
-    box-shadow: none;
-  }
-.path-bar .button {
-  color: t_color(text);
-  }
-.button {
-  transition: none;
-  @include button(undecorated, $tc: t_color(text));
-
-  &.flat {
-    @include button(undecorated,$tc: t_color(text));
-  }
-  &:hover {
-    @include button(hover, $tc: t_color(text));
-    &:backdrop { border-color: t_color(backdrop-background); }
-  }
-  &:active, &:checked {
-    @include button(active);
-    &:hover {
-	  @include button(active-hover);
-    }
-    &:backdrop {
-      background-image: none;
-      background-color: t_color(backdrop-background);
-      border-color: t_color(backdrop-background);
-      color: t_color(backdrop-text);
-    }
-  }
-
-  &.suggested-action {
-    @extend %suggested-action;
-  }
-
-  &:backdrop {
-    background-color: t_color(backdrop-background);
-    color: t_color(backdrop-text);
-    }
-
-  &.flat:backdrop, &.flat:backdrop:insensitive, &:insensitive:backdrop {
-    background-image: none;
-    background-color: t_color(backdrop-background);
-    color: t_color(backdrop-text);
-    border-color: transparent;
-    }
-  &.flat:insensitive {
-    @extend %undecorated_button;;
-    color: insensitive(t_color(text));
-    }
-  &:insensitive {
-    background-color: transparent;
-    background-image: none;
-    color: insensitive(t_color(text));
-    &:active, &:checked {
-      @include button(insensitive-active);
-    }
-  }
-}
-
-  .title {
-    font-weight: normal;
-    padding: 0px 12px;
-  }
-
-  .subtitle {
-    font-size: smaller;
-    padding: 0 12px;
-    @extend .dim-label;
-  }
-
-  .header-bar-separator,
-  & > GtkBox > .separator.vertical {
-    -GtkWidget-wide-separators: true;
-    -GtkWidget-separator-width: 1px;
-    border-width: 0px;
-    background-color: t_color(background);
-    border-color: t_color(background);
-    &:backdrop {
-      background-color: t_color(backdrop-background);
-      border-color: t_color(backdrop-background);
-    }
-  }
-  &.selection-mode {
-
-    @extend .info;
-
-    &.suggested-action {
-      @extend %suggested-action;
-    }
-
-    .subtitle:link { @extend *:link:selected;  }
-
-    .selection-menu {
-      padding-left: 10px;
-      padding-right: 10px;
-
-      GtkArrow { -GtkArrow-arrow-scaling: 1; }
-
-      .arrow {
-        -gtk-icon-source: -gtk-icontheme('arrow-down');
-        icon-shadow: none;
-      }
-    }
-  }
-
-  .tiled &, .maximized & {
-    border-radius: 0; // squared corners when the window is max'd or tiled
-  }
-
-  &.default-decoration {
-    padding: 4px;
-    .button { padding: 5px; }
-  }
-}
-
-%suggested-action {
-  background-image: none;
-  background-color: b_color(active);
-  &:hover {
-    background-color: b_color(hover);
-    color: b_color(text)
-    }
-  &:insensitive {
-    background-color: transparent;
-    background-image: none;
-    color: insensitive(t_color(text));
-    &:active, &:checked {
-      @include button(insensitive-active);
-      }
-    }
-  &:backdrop {
-    background-color: t_color(backdrop-background);
-    border-color: transparent;
-    color: t_color(backdrop-text);
-    &:insensitive {
-      color: insensitive(t_color(backdrop-text));
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_infobar.scss b/src/gtk318/widgets/_infobar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_infobar.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-@charset "UTF-8";
-
-/**************
- * GtkInfoBar *
- **************/
-GtkInfoBar {
-  border-style: none;
-  border-bottom: 1px solid $border_color;
-  background-color: w_color(normal);
-  background-image: none;
-  &:backdrop {border-bottom: 1px solid backdrop($border_color);}
-}
-
-.info,
-.question,
-.warning,
-.error {
-  background-color: w_color(normal);
-  background-image: none;
-  color: $warning_color;
-  text-shadow: none;
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-    color: backdrop($warning_color);
-  }
-  .button {
-    box-shadow: none;
-    background-image:none;
-    background-color: transparentize($warning_color, 0.5);
-    border-color: transparentize($warning_color, 0.5);
-    color: b_color(text);
-    &:hover {
-      background-color: transparentize($warning_color, 0.75);
-      border-color: $warning_color;
-    }
-    &:active, &:checked {
-      background-image: button_gradient($warning_color);
-      color: w_color(normal);
-      border-color: $warning_color;
-    }
-    &:insensitive {
-      background-color: insensitive(transparentize($warning_color, 0.5));
-      border-color: insensitive(transparentize($warning_color, 0.5));
-      color: insensitive(b_color(text));
-    }
-    &:backdrop {
-      background-color: backdrop(transparentize($warning_color, 0.5));
-      border-color: backdrop(transparentize($warning_color, 0.5));
-      color: backdrop(b_color(text));
-      &:active, &:checked {
-        background-image: button_gradient(backdrop($warning_color));
-        color: backdrop(w_color(normal));
-        border-color: backdrop($warning_color);
-      }
-      &:insensitive {
-        background-color: backdrop(insensitive(transparentize($warning_color, 0.5)));
-        border-color: backdrop(insensitive(transparentize($warning_color, 0.5)));
-        color: backdrop(insensitive(b_color(text)));
-      }
-      &:insensitive:active,
-      &:insensitive:checked {
-        background-image: button_gradient(backdrop(insensitive($warning_color)));
-        color: backdrop(insensitive(w_color(normal)));
-        border-color: backdrop(insensitive($warning_color));
-      }
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_link.scss b/src/gtk318/widgets/_link.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_link.scss
+++ /dev/null
@@ -1,42 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Links *
- *********/
-
-*:link {
-  color: $link_color;
-  &:visited {
-    color: $link_visited_color;
-    *:selected & { color: mix(s_color(text), s_color(normal), 60%); }
-  }
-  &:hover {
-    color: lighten($link_color,10%);
-    *:selected & { color: mix(s_color(text), s_color(normal), 90%); }
-  }
-  &:active {
-    color: $link_color;
-    *:selected & { color: mix(s_color(text), s_color(normal), 80%); }
-  }
-  &:backdrop, &:backdrop:hover, &:backdrop:hover:selected {
-    color: backdrop(s_color(backdrop));
-  }
-  &:selected, *:selected & {
-    color: mix(s_color(text), s_color(normal), 80%);
-  }
-}
-
-.button:link, .button:visited {
-  @extend %undecorated_button;
-  @extend *:link;
-  text-shadow: none;
-  &:hover, &:active, &:checked {
-    @extend %undecorated_button;
-    text-shadow: none;
-  }
-  &:backdrop {
-    @extend %undecorated_button; //This shouldn't be needed but avoids
-                                 //a weird transition which for some reason
-                                 //makes borders blink on hover
-  }
-}
diff --git a/src/gtk318/widgets/_lists.scss b/src/gtk318/widgets/_lists.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_lists.scss
+++ /dev/null
@@ -1,106 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Lists *
- *********/
-
-.list, .list-row {
-  background-color: w_color(normal);
-  color: w_color(text);
-  border-width: 0px;
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-    color: backdrop(w_color(text));
-  }
-}
-
-.list-row,
-.grid-child {
-  padding: 0px 2px;
-  border-style: solid;
-  border-width: 0px;
-  border-color: w_color(normal);
-}
-
-.list-row.button,
-.list-row.button:backdrop,
-.list-row.button:backdrop:active,
-.list-row.button:backdrop:checked,
-.list-row.button:backdrop:insensitive,
-.list-row.button:backdrop:insensitive:active,
-.list-row.button:backdrop:insensitive:checked,
-.list-row.button:insensitive:active,
-.list-row.button:insensitive:checked {
-  // reset button inherited stuff
-  @extend %undecorated_button;
-  background-color: transparentize(v_color(normal),1); // for the transition
-  border-style: none; // I need no borders here
-  border-radius: 0;   // and no rounded corners
-  box-shadow: none;   // and no box-shadow
-
-}
-
-.list-row.button {
-  background-color: w_color(normal);
-  &:hover {
-    background-color: transparentize(b_color(hover), 0.75);
-  }
-  &:active {
-    background-color: s_color(normal);
-    box-shadow: none;
-  }
-  &:selected {
-    &:active { box-shadow: none; }
-    background-color: s_color(normal);
-    &:hover {
-      @include button(active-hover);
-    }
-    &:backdrop {
-      background-color: backdrop(s_color(backdrop));
-    }
-  }
-  &:backdrop { background-color: backdrop(w_color(normal));}
-}
-
-.list-row:selected {
-  @extend %selected_items;
-  .button {
-    @include button(normal);
-      &.flat {
-      @include button(undecorated);
-    }
-    &:hover {
-      @include button(hover);
-    }
-    &:active, &:checked {
-      @include button(active);
-    }
-    &:backdrop, &.flat:backdrop {
-      @include button(backdrop);
-      &:active, &:checked {
-        @include button(backdrop-active);
-      }
-      &:insensitive {
-        @include button(backdrop-insensitive);
-        &:active, &:checked {
-          @include button(backdrop-insensitive-active);
-        }
-      }
-    }
-    &.flat:backdrop {
-      background-color: backdrop(w_color(normal));
-      color: backdrop(w_color(text));
-      border-color: transparent;
-    }
-    &:insensitive {
-      @include button(insensitive);
-      &:active, &:checked { @include button(insensitive-active); }
-    }
-  }
-}
-
-// transition
-.list-row, list-row.button {
-  transition: all 300ms $ease-out-quad;
-  &:hover { transition: none; }
-}
diff --git a/src/gtk318/widgets/_menus.scss b/src/gtk318/widgets/_menus.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_menus.scss
+++ /dev/null
@@ -1,160 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Menus *
- *********/
- /* menu buttons */
- .menuitem.button.flat {
-   @extend %undecorated_button;
-   color: w_color(text);
-   &:hover { background-color: b_color(hover); }
-   &:selected {
-     background-color: b_color(active);
-     color: b_color(active-text)
-   }
-   &:backdrop, &:backdrop:hover {
-     @extend %undecorated_button;
-     color: backdrop(w_color(text));
-   }
- }
-
-.menubar {
-  -GtkWidget-window-dragging: true;
-  padding: 0px;
-  box-shadow: none;
-  background-color: w_color(normal);
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-  }
-  & > .menuitem {
-    padding: 6px 8px;
-    &:hover { //Seems like it :hover even with keyboard focus
-      background-color: b_color(active);
-      color: b_color(active-text);
-    }
-    &:insensitive {
-      color: insensitive(w_color(text));
-      box-shadow: none;
-      &:backdrop {
-        background-color: backdrop(w_color(normal));
-        color: backdrop(insensitive(w_color(text)));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-      color: backdrop(w_color(text));
-    }
-  }
-}
-
-.menu {
-  padding: 0px;
-  background-color: $menu_color;
-  border: 1px solid $border_color; // adds borders in a non composited env
-  border-radius: $r;
-  .csd & { border: 1px solid $border_color; }  // axes borders in a composited env
-  .separator {color: $border_color;}
-  .menuitem {
-	text-shadow: none;
-    padding: 4px 4px;
-    &:hover {
-      color: b_color(active-text);
-      background-color: b_color(active);
-    }
-    &:insensitive {
-      color: insensitive(w_color(text));
-      &:backdrop { color: backdrop(insensitive(w_color(text))); }
-    }
-    &:backdrop, &:backdrop:hover {
-      color: backdrop(w_color(text));
-      background-color: backdrop(w_color(normal));
-    }
-    //submenu indicators
-    &.arrow { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');}
-    &.arrow:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
-  }
-}
-
-.menuitem .accelerator { color: gtkalpha(currentColor,0.5); }
-/***************
- * Popovers   *
- ***************/
-
-.popover {
-  margin: 10px;
-  padding: 0px;
-  border: 1px solid $border_color;
-  border-radius: 3px;
-  background-color: $menu_color;
-
-  box-shadow: 0 2px 3px transparentize(black, 0.2);
-
-  &:backdrop {
-    box-shadow: none;
-  }
-
-  > .list,
-  > .view,
-  > .toolbar,
-  &.osd > .toolbar {
-    border-style: none;
-    background-color: transparent;
-  }
-  .button.flat {
-    border-radius: 0px;
-	  color: w_color(text);
-    .label { padding: 4px 0px; }
-    &:hover,
-    &:checked:hover {
-      background-image: none;
-      background-color: b_color(active);
-    	color: b_color(active-text);
-      transition: none;
-    }
-
-    &:backdrop {
-      background-color: transparent;
-    	color: backdrop(w_color(text));
-    }
-  }
-
-  &.osd { @extend %osd; }
-
-}
-
-//touch selection handlebars for the Popover.osd above
-.entry.cursor-handle,
-.cursor-handle {
-  background-color: transparent;
-  background-image: none;
-  box-shadow: none;
-  border-style: none;
-  &.top { -gtk-icon-source: -gtk-icontheme('selection-start-symbolic'); }
-  &.bottom { -gtk-icon-source: -gtk-icontheme('selection-end-symbolic'); }
-}
-
-.scale-popup .button,
-.scale-popup .button.flat { // +/- buttons on GtkVolumeButton popup
-  @extend %undecorated_button;
-  background-color: transparent;
-  padding: 5px;
-  color: w_color(text);
-  &:hover {
-    @extend %undecorated_button;
-    color: b_color(hover);
-  }
-  &:active {
-    color: b_color(active);
-  }
-  &:insensitive {
-    color: insensitive(w_color(text));
-  }
-  &:backdrop {
-    color: backdrop(w_color(text));
-    &:insensitive {
-      color: backdrop(insensitive(w_color(text)));
-    }
-  }
-}
-
-GtkVolumeButton.button { padding: 5px; }
diff --git a/src/gtk318/widgets/_misc.scss b/src/gtk318/widgets/_misc.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_misc.scss
+++ /dev/null
@@ -1,112 +0,0 @@
-@charset "UTF-8";
-
-/********
- * Misc *
- ********/
-
-/**********
-* Frames *
-**********/
-.frame {
- border: 1px solid $border_color;
- &.flat { border-style: none; }
- padding: 0;
- &.action-bar {
-   padding: 6px;
-   border-width: 1px 0 0;
-   &:backdrop {border-color: backdrop($border_color);}
- }
- &:backdrop {border-color: backdrop($border_color);}
-}
-
-GtkScrolledWindow {
- GtkViewport.frame { // avoid double borders when viewport inside
-                     // scrolled window
-   border-style: none;
- }
-}
-
-//vbox and hbox separators
-.separator {
- // always disable separators
- //-GtkWidget-wide-separators: true;
- color: transparent;
-&.vertical {
-  color: $border_color;
-  &:backdrop { color: backdrop($border_color); }
-  }
- // Font and File button separators
- GtkFileChooserButton &.vertical,
- GtkFontButton &.vertical {
-   // always disable separators
-   -GtkWidget-wide-separators: true;
- }
-}
-
-/*************
-* Expanders *
-*************/
-
-.expander {
- -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
- &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl'); }
- &:hover { color: lighten(w_color(text),30%); } //only lightens the arrow
- &:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
-}
-
-/*********
-* Paned *
-*********/
-
-GtkPaned { // this is for the standard paned separator
-
- -GtkPaned-handle-size: 1; // sets separator width
-
- -gtk-icon-source: none; // removes handle decoration
- margin: 0 8px 8px 0; // drag area of the separator, not a real margin
- &:dir(rtl) {
-   margin-right: 0;
-   margin-left: 8px;
- }
- .pane-separator {
-   background-color: $border_color;
-   &:backdrop {
-     background-color: backdrop($border_color);
-   }
- }
-}
-
-GtkPaned.wide { // this is for the paned with wide separator
- -GtkPaned-handle-size: 5; // wider separator here
- margin: 0; // no need of the invisible drag area so, reset margin
- .pane-separator {
-   background-color: transparent;
-   border-style: none;
-   // border-color: $borders_color;
-   // border-width: 1px;
- }
- &.vertical .pane-separator { border-style: none;}
- .pane-separator:backdrop { border-color: transparent; }
-}
-
-/*********************
-* Spinner Animation *
-*********************/
-
-@keyframes spin {
- to { -gtk-icon-transform: rotate(1turn); }
-}
-
-.spinner {
- background-image: none;
- background-color: blue;
- opacity: 0; // non spinning spinner makes no sense
- -gtk-icon-source: -gtk-icontheme('process-working-symbolic');
- &:active {
-   opacity: 1;
-   animation: spin 1s linear infinite;
-   &:insensitive {
-     opacity: 0.5;
-   }
- }
-}
diff --git a/src/gtk318/widgets/_notebook.scss b/src/gtk318/widgets/_notebook.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_notebook.scss
+++ /dev/null
@@ -1,193 +0,0 @@
-@charset "UTF-8";
-
-/*****************
- * Notebooks and *
- * Tabs          *
- *****************/
-
-.notebook {
-  // Through me you go to the grief wracked city;
-  // Through me you go to everlasting pain;
-  // Through me you go a pass among lost souls.
-  // ...
-  // Abandon all hope — Ye Who Enter Here
-
-  -GtkNotebook-initial-gap: 0;
-  -GtkNotebook-arrow-spacing: 5;
-  -GtkNotebook-tab-curvature: 0;
-  -GtkNotebook-tab-overlap: 1;
-  -GtkNotebook-has-tab-gap: false;
-  -GtkWidget-focus-padding: 0;
-  -GtkWidget-focus-line-width: 0;
-  transition: all 200ms $ease-out-quad;
-  background-color: $menu_color;
-  &:backdrop {background-color: backdrop($menu_color)}
-
-  &.frame {
-    border: 1px solid $border_color;
-    // FIXME doesn't work
-    &.top { border-top-width: 0; }
-    &.bottom { border-bottom-width: 0; }
-    &.right { border-right-width: 0; }
-    &.left { border-left-width: 0; }
-    &:backdrop { border-color: backdrop($border_color); }
-  }
-  &.header {
-    background-color: w_color(normal);
-    padding-top: 4px;
-
-    //this is the shading of the header behind the tabs
-    &.frame {
-      border-style: none;
-    }
-    &.top {
-      box-shadow: inset 0 -1px $border_color; // border
-      &:backdrop { box-shadow: inset 0 -1px backdrop($border_color); }
-    }
-    &.bottom {
-      box-shadow: inset 0 1px $border_color;
-      &:backdrop { box-shadow: inset 0 1px backdrop($border_color); }
-    }
-    &.right {
-      box-shadow: inset 1px 0 $border_color;
-      &:backdrop { box-shadow: inset 1px 0 backdrop($border_color); }
-    }
-    &.left {
-      box-shadow: inset -1px 0 $border_color;
-      &:backdrop { box-shadow: inset -1px 0 backdrop($border_color); }
-    }
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-    }
-  }
-
-  tab {
-    border: 1px solid transparentize(w_color(text), 0.8);
-    background-color: transparentize(w_color(text), 0.8);
-    background-clip: padding-box;
-    &:backdrop {background-color: backdrop(transparentize(w_color(text), 0.8));}
-    //FIXME: we get double border in some cases, not considering the broken
-    //notebook content frame...
-    padding: 8px;
-    &.reorderable-page {
-		    background-color: w_color(normal);
-      &.top, &.bottom {
-        padding-left: 12px;  // for a nicer close button
-        padding-right: 6px; // placement
-        padding-bottom: 8px;
-      }
-    }
-
-    @each $_tab, $_border, $_radius in  (top,bottom,3px 3px 0px 0px),
-                                        (bottom,top,0px 0px 3px 3px),
-                                        (left,right, 3px 0px 0px 3px),
-                                        (right,left, 0px 3px 3px 0px) {
-      &.#{$_tab} {
-        border-radius: #{$_radius};
-        border-#{$_border}-color: transparent;
-        &:active, &.active-page {
-          border-color: $border_color;
-          border-#{$_border}-color: $menu_color;
-          background-color: $menu_color;
-          &:backdrop {
-            border-color: backdrop($border_color);
-            border-#{$_border}-color: backdrop($menu_color);
-            background-color: backdrop($menu_color);
-          }
-        }
-      }
-    }
-
-    //here's the interesting stuff
-    &:hover, &.prelight-page {
-      background-color: transparentize(s_color(normal), 0.8);
-      border-color: transparentize(s_color(normal), 0.8);
-    }
-
-    @each $_tab, $_border, $_shadow1 in (top, right, -3px 0px 0px 0px),
-                             (bottom, right, -3px 0px 0px 0px),
-                             (left, bottom, 0px -3px 0px 0px),
-                             (right, bottom, 0px -3px 0px 0px) {
-      &.reorderable-page.#{$_tab} {
-      border-width: 3px;
-      border-style: solid;
-      border-color: transparent;
-      background-color: w_color(normal);
-      background-clip: padding-box;
-      border-#{$_border}-width: 1px;
-      border-#{$_border}-color: $border_color;
-      box-shadow: inset #{$_shadow1} w_color(normal);
-        &:hover, &.prelight-page {
-          box-shadow: inset 0px -3px 0px 0px transparentize(s_color(normal),0.8), inset $_shadow1 w_color(normal);
-        }
-        &:active, &.active-page {
-          box-shadow: inset 0px -3px 0px 0px s_color(normal), inset $_shadow1 w_color(normal);
-          &:backdrop {
-            background-color: backdrop(w_color(normal));
-            border-color: transparent;
-		        border-#{$_border}-color: backdrop($border_color);
-            box-shadow:none;
-          }
-        }
-        &:backdrop {
-			    background-color: backdrop(w_color(normal));
-		      border-#{$_border}-color: backdrop($border_color);
-          box-shadow:none;
-        }
-      }
-    }
-    .label { //tab text
-      padding: 0 2px; // needed for a nicer focus ring
-      color: w_color(text);
-      &:backdrop { color: backdrop(w_color(text)); }
-      &:insensitive { color: insensitive(w_color(text)); }
-    }
-    .button { //tab close button
-      padding: 0px;
-      border: 1px solid transparent;
-      border-radius: 50%;
-      background-image: none;
-      background-color: $border_color;
-      box-shadow: none;
-      icon-shadow: none;
-      transition: none;
-      color: w_color(normal);
-      &:hover {
-        background-color:  $error_color;
-        border-color: transparent;
-        background-image: none;
-        box-shadow: none;
-      }
-      &:active {
-        color: w_color(normal);
-        border-color: transparent;
-        background-image: none;
-        box-shadow: none;
-      }
-      &:backdrop {
-        color: backdrop(w_color(normal));
-        background-color: backdrop($border_color);
-      }
-      & > GtkImage {
-        padding: 0px;
-      }
-    }
-    .button .active-page, .button.active-page { //not working
-		background-color: $error_color;
-    }
-  }
-  &.arrow {
-    color: w_color(text);
-    &:hover { color: b_color(hover); }
-    &:active { color: b_color(active); }
-    &:insensitive {
-      color: insensitive(w_color(text));
-    }
-    &:backdrop {
-      color: backdrop(w_color(text));
-      &:insensitive {
-        color: backdrop(insensitive(w_color(text)));
-      }
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_overshoot.scss b/src/gtk318/widgets/_overshoot.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_overshoot.scss
+++ /dev/null
@@ -1,111 +0,0 @@
-@charset "UTF-8";
-
-@mixin overshoot($p, $t:normal, $c:w_color(text)) {
-//
-// overshoot
-//
-// $p: position
-// $t: type
-// $c: base color
-//
-// possible $p values:
-// top, bottom, right, left
-//
-// possible $t values:
-// normal, backdrop
-//
-
-  $_small_gradient_length: 5%;
-  $_big_gradient_length: 100%;
-
-  $_position: center top;
-  $_small_gradient_size: 100% $_small_gradient_length;
-  $_big_gradient_size: 100% $_big_gradient_length;
-
-  @if $p==bottom {
-    $_position: center bottom;
-    $_linear_gradient_direction: to top;
-  }
-
-  @else if $p==right {
-    $_position: right center;
-    $_small_gradient_size: $_small_gradient_length 100%;
-    $_big_gradient_size: $_big_gradient_length 100%;
-  }
-
-  @else if $p==left {
-    $_position: left center;
-    $_small_gradient_size: $_small_gradient_length 100%;
-    $_big_gradient_size: $_big_gradient_length 100%;
-  }
-
-  $_small_gradient_color: $c;
-  $_big_gradient_color: $c;
-
-  @if $c==w_color(text) {
-    $_small_gradient_color: darken($border_color, 10%);
-    $_big_gradient_color: w_color(text);
-
-    @if $t==backdrop { $_small_gradient_color: backdrop($border_color); }
-  }
-
-  $_small_gradient: -gtk-gradient(radial,
-                                  $_position, 0,
-                                  $_position, 0.5,
-                                  to($_small_gradient_color),
-                                  to(transparentize($_small_gradient_color, 1)));
-
-  $_big_gradient: -gtk-gradient(radial,
-                                $_position, 0,
-                                $_position, 0.6,
-                                from(transparentize($_big_gradient_color, 0.93)),
-                                to(transparentize($_big_gradient_color, 1)));
-
-  @if $t==normal {
-    background-image: $_small_gradient, $_big_gradient;
-    background-size: $_small_gradient_size, $_big_gradient_size;
-  }
-
-  @else if $t==backdrop {
-    background-image: $_small_gradient;
-    background-size: $_small_gradient_size;
-  }
-
-  background-repeat: no-repeat;
-  background-position: $_position;
-
-  background-color: transparent; // reset some properties to be sure to not inherit them somehow
-  border: none;                  //
-  box-shadow: none;              //
-}
-
-/* Decouple the font of context menus from their entry/textview */
-.touch-selection,
-.context-menu {
-  font: initial;
-}
-
-.monospace {
-  font: Monospace;
-}
-
-// This is used by GtkScrolledWindow, when content is touch-dragged past boundaries.
-// This draws a box on top of the content, the size changes programmatically.
-.overshoot {
-  &.top {
-    @include overshoot(top);
-    &:backdrop { @include overshoot(top, backdrop); }
-  }
-  &.bottom {
-    @include overshoot(bottom);
-    &:backdrop { @include overshoot(bottom, backdrop); }
-  }
-  &.left {
-    @include overshoot(left);
-    &:backdrop { @include overshoot(left, backdrop); }
-  }
-  &.right {
-    @include overshoot(right);
-    &:backdrop { @include overshoot(right, backdrop); }
-  }
-}
diff --git a/src/gtk318/widgets/_pathbar.scss b/src/gtk318/widgets/_pathbar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_pathbar.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-@charset "UTF-8";
-
-/************
- * Pathbars *
- ************/
-
-.path-bar .button {
-  @include button(undecorated);
-  padding: 4px 8px;
-  color: w_color(text);
-  &:hover {border-color: b_color(hover); }
-  &:active, &:checked {
-    background-color: $border_color;
-    }
-  &:first-child { padding-left: 8px; }
-  &:last-child { padding-right: 8px; }
-  &:only-child {
-    padding-left: 12px;
-    padding-right: 12px;
-  }
-
-  // the following is for spacing the icon and the label inside the home button
-  .label:last-child { padding-left: 2px; }
-  .label:first-child { padding-right: 2px; }
-  .label:only-child { padding-right: 0; padding-left: 0; }
-  GtkImage { padding-top: 1px; }
-}
diff --git a/src/gtk318/widgets/_progressbar.scss b/src/gtk318/widgets/_progressbar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_progressbar.scss
+++ /dev/null
@@ -1,144 +0,0 @@
-@charset "UTF-8";
-
-/*****************
- * Progress bars *
- *****************/
-
-GtkProgressBar {
-  padding: 0;
-  font-size: smaller;
-  color: transparentize(b_color(text),0.7);
-  box-shadow: none;                           // here ot it gets
-  &:backdrop { color: backdrop(transparentize(b_color(text),0.7))}                                          // clipped
-
-  &.osd {
-    -GtkProgressBar-xspacing: 0;
-    -GtkProgressBar-yspacing: 0;
-    -GtkProgressBar-min-horizontal-bar-height: 3;
-  }
-  &.trough {  // background
-    border: 1px solid transparent;
-    border-radius: $r;
-    background-color: transparentize(b_color(text),0.7);
-    &.osd {
-      border: 1px solid transparent;
-      border-radius: $r;
-      background-color: transparentize(b_color(text),0.7);
-      &:backdrop {
-        background-color: backdrop(transparentize(b_color(text),0.7));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(transparentize(b_color(text),0.7));
-    }
-  }
-}
-
-// moving bit
-.progressbar {
-  background-color: s_color(normal);
-  border: 1px solid s_color(normal);
-  border-radius: 0px;
-  box-shadow: none; //needed for clipping
-  &.left {
-    border-top-left-radius: $r;
-    border-bottom-left-radius: $r;
-  }
-  &.right {
-    border-top-right-radius: $r;
-    border-bottom-right-radius: $r;
-  }
-  &.left.right {
-    box-shadow: none;
-  }
-  &.vertical {
-
-    &.bottom {
-      border-bottom-left-radius: $r;
-      border-bottom-right-radius: $r;
-      box-shadow: none;
-    }
-    &.top {
-      border-top-left-radius: $r;
-      border-top-right-radius: $r;
-    }
-  }
-
-  &.osd {
-    background-image: none;
-    background-color: s_color(normal);
-    border: 1px solid s_color(normal);
-    border-radius: $r;
-    &:backdrop {
-      background-color: backdrop(s_color(backdrop));
-      border-color: backdrop(s_color(backdrop));
-    }
-  }
-  &:backdrop {
-    background-color: backdrop(s_color(backdrop));
-    border-color: backdrop(s_color(backdrop));
-  }
-}
-
-/*************
- * Level Bar *
- *************/
-
-.level-bar.vertical {
-  -GtkLevelBar-min-block-width: 6;
-  -GtkLevelBar-min-block-height: 34;
-}
-
-.level-bar {
-  box-shadow: none; // needs to be set here to avoid clipping
-  -GtkLevelBar-min-block-width: 34;
-  -GtkLevelBar-min-block-height: 6;
-  &.vertical {
-    -GtkLevelBar-min-block-width: 6;
-    -GtkLevelBar-min-block-height: 34;
-  }
-  &.trough {
-    border: 1px solid transparent;
-    padding: 3px;
-    border-radius: $r;
-    background-color: transparent;;
-  }
-  &.fill-block {
-    // FIXME: it would be nice to set make fill blocks bigger, but we'd need
-    // :nth-child working on discrete indicators
-    border: 1px solid s_color(normal);
-    background-color: s_color(normal);
-    box-shadow: none;
-    border-radius: $r;
-
-    &.indicator-discrete {
-      &.horizontal { margin: 0 1px; }
-      &.vertical { margin: 1px 0; }
-    }
-    &.level-high {
-      border-color: $success_color;
-      background-color: $success_color;
-      &:backdrop {
-        background-color: backdrop($success_color);
-        border-color: backdrop($success_color);
-      }
-    }
-    &.level-low {
-      border-color: $warning_color;
-      background-color: $warning_color;
-      &:backdrop {
-        background-color: backdrop($warning_color);
-        border-color: backdrop($warning_color);
-      };
-    }
-    &.empty-fill-block {
-      background-color: transparentize(b_color(text),0.7);
-      border-color: transparent;
-      box-shadow: none;
-    }
-    &:backdrop {
-      border-color: backdrop(s_color(backdrop));
-      background-color: backdrop(s_color(backdrop));
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_scale.scss b/src/gtk318/widgets/_scale.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_scale.scss
+++ /dev/null
@@ -1,89 +0,0 @@
-@charset "UTF-8";
-
-/************
- * GtkScale *
- ************/
-.scale,
-.scale.scale-has-marks-above.scale-has-marks-below,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below {
-  -GtkScale-slider-length: 18;
-  -GtkRange-slider-width: 18;
-  -GtkRange-trough-border: 2;
-
-  &.fine-tune {
-    &.trough {
-      margin: 8px;
-      border-radius: $r;
-    }
-  }
-
-  &.slider {
-    background-color: b_color(normal);
-    border: 1px solid $border_color;
-    border-radius: 50%;
-    box-shadow: none;
-    &:hover {
-      border-style: solid;
-  	  border-width: 2px;
-      border-color: b_color(hover);
-      border-radius: 50%; // needed for double marks scales
-      &:backdrop {
-        background-color: backdrop(b_color(normal));
-        border-color: backdrop(b_color(hover));
-      }
-    }
-    &:insensitive {
-      border-style: solid; // needed for double marks scales or they'll get
-      border-radius: 50%;  // overridden
-      background-color: insensitive(b_color(normal));
-      border-color: insensitive($border_color);
-      &:backdrop {
-        background-color: backdrop(insensitive(b_color(normal)));
-        border-color: backdrop(insensitive($border_color));
-      }
-    }
-    &:active {
-      border: 2px solid b_color(active);
-      &:backdrop {
-        background-color: backdrop(b_color(normal));
-        border-color: backdrop(b_color(active));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(b_color(normal));
-      border-color: backdrop($border_color);
-    }
-  }
-  &.trough {
-    margin: 9px;
-    border: 1px solid transparentize(b_color(text),0.7);
-    border-radius: $r;
-    background-color: transparentize(b_color(text),0.7);
-    box-shadow: none;
-    &.highlight {
-      background-color: s_color(normal);
-      border-color: s_color(normal);
-      &.vertical {
-        background-color: s_color(normal);
-        border-color: s_color(normal);
-      }
-      &:backdrop {
-        background-color: backdrop(s_color(backdrop));
-        border-color: backdrop(s_color(backdrop));
-      }
-    }
-    &:insensitive, &.vertical:insensitive {
-      border-color: mix(insensitive(b_color(text)), w_color(normal), 70%);
-      background-color: mix(insensitive(b_color(text)), w_color(normal), 70%);
-      box-shadow: none;
-      &:backdrop {
-        background-color: mix(backdrop(insensitive(b_color(text))), w_color(normal), 70%);
-        border-color: mix(backdrop(insensitive(b_color(text))), w_color(normal), 70%);
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(transparentize(b_color(text),0.7));
-      border-color: backdrop(transparentize(b_color(text),0.7));
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_scrollbar.scss b/src/gtk318/widgets/_scrollbar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_scrollbar.scss
+++ /dev/null
@@ -1,93 +0,0 @@
-@charset "UTF-8";
-
-@mixin _border($name, $width: 1px 1px 2px 1px, $image-width: 2 2 3 2 / 2px 2px 3px 2px) {
-  border-image: -gtk-scaled(url("../assets/#{$name}.png"),url("../assets/#{$name}@2.png")) $image-width stretch;
-  border-width: $width;
-  border-style: solid;
-  border-color: transparent;
-}
-
-$scrollbar_color: transparentize(v_color(text),0.5);
-$trough_color: transparentize(w_color(text),0.7);
-
-/**************
- * Scrollbars *
- **************/
-
-.scrollbar {
-  -GtkRange-trough-border: 0;
-  -GtkScrollbar-has-backward-stepper: false;
-  -GtkScrollbar-has-forward-stepper: false;
-  -GtkRange-slider-width: 10px;
-  -GtkScrollbar-min-slider-length: 64;
-  -GtkRange-stepper-spacing: 0;
-  -GtkRange-trough-under-steppers: 1;
-
-  .button {
-	@extend %undecorated_button;
-  color: b_color(text);
-	&:hover {
-    @extend %undecorated_button;
-		color: b_color(hover);
-		}
-	&:insensitive { color: insensitive(b_color(text)); }
-  &:backdrop {
-    @extend %undecorated_button;
-    color: backdrop(b_color(text));
-    &:insensitive {color: backdrop(insensitive(b_color(text)));}
-    @extend %undecorated_button;
-    }
-	}
-
-  // Overlay Scrollbars
-  &.dragging,                                                             // if this isn't set, the scrollbars don't update their size correctly
-  &.hovering { opacity: 0.9910; }                                          // probably a gtk bug
-  &.overlay-indicator:not(.dragging):not(.hovering) { opacity: 0.999; }     //
-
-
-  &.overlay-indicator:not(.dragging):not(.hovering) {
-   -GtkRange-slider-width: 10px;
-   -GtkScrollbar-has-backward-stepper: false;
-   -GtkScrollbar-has-forward-stepper: false;
-
-    .slider {
-      margin: 2px;
-      border: 5px solid transparent;
-      border-radius: 8px;
-      background-color: $scrollbar_color;
-      &:backdrop { background-color: backdrop($scrollbar_color); }
-    }
-
-    .trough {
-      border: none;
-      background: none;
-    }
-  }
-
-  &.trough {
-		margin: 2px;
-    border: 5px solid transparent;
-  	border-radius: 8px;
-	background-color: transparent;
-  	&:backdrop { background-color: backdrop($trough_color); }
-  }
-  &.slider {
-    margin: 2px;
-  	border: 5px solid transparent;
-  	border-radius: 8px;
-  	background-color: $scrollbar_color;
-  	&:hover { background-color: b_color(hover); }
-  	&:active { background-color: b_color(active);}
-  	&:insensitive { background-color: insensitive($scrollbar_color); }
-		&:backdrop { background-color: backdrop($trough_color); }
-  	&:backdrop:insensitive { background-color: backdrop(insensitive($scrollbar_color)); }
-  }
-}
-
-
-.scrollbars-junction,
-.scrollbars-junction.frame { // the small square between two scrollbars
-  border-color: transparent;
-  background-color: transparent;
-  border-image: none;
-}
diff --git a/src/gtk318/widgets/_sidebar.scss b/src/gtk318/widgets/_sidebar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_sidebar.scss
+++ /dev/null
@@ -1,74 +0,0 @@
-@charset "UTF-8";
-
-/***********
- * Sidebar *
- ***********/
-
-.sidebar,
-.sidebar .view {
-  border: none;
-  background-color: w_color(normal);
-  &:selected {
-    @extend %selected_items;
-  }
-  &:backdrop { background-color: backdrop(w_color(normal))}
-}
-
-GtkSidebarRow {
-  // Needs overriding of the GtkListBoxRow padding
-  &.list-row {
-    padding: 0px;
-  }
-  // Using margins/padding directly in the SidebarRow
-  // will make the animation of the new bookmark row jump
-  .sidebar-revealer {
-    padding: 4px 14px 4px 12px;
-  }
-  .sidebar-icon {
-    
-    &:dir(ltr) { padding-right: 8px; }
-    &:dir(rtl) { padding-left: 8px; }
-  }
-  .sidebar-label {
-    &:dir(ltr) { padding-right: 2px; }
-    &:dir(rtl) { padding-left: 2px; }
-  }
-}
-
-// Places sidebar is a special case, since the view here have to look like chrome not content, so we override text color
-GtkPlacesSidebar.sidebar .view {
-//  color: w_color(text);
-//  background-color: transparent;
-  &:insensitive { color: insensitive(w_color(text)); }
-  &:backdrop {
-    color: backdrop(w_color(text));
-    &:insensitive { color: backdrop(insensitive(w_color(text))); }
-  }
-  &:selected { @extend %selected_items; }
-  .separator,
-  .separator:backdrop { @extend .separator; }
-  .image { // icons color
-    color: w_color(text);
-    &:selected {
-        color: s_color(text);
-        &:backdrop { color: backdrop(w_color(text)); }
-    }
-    &:insensitive { color: insensitive(w_color(text)); }
-    &:backdrop {
-      color: backdrop(w_color(text));
-      &:insensitive { color: backdrop(insensitive(w_color(text))); }
-    }
-  }
-}
-
-.sidebar-item {
-  padding: 10px 4px;
-  > .label {
-    padding-left: 6px;
-    padding-right: 6px;
-  }
-  &.needs-attention > .label {
-    @extend %needs_attention;
-    background-size: 6px 6px, 0 0;
-  }
-}
diff --git a/src/gtk318/widgets/_spinbutton.scss b/src/gtk318/widgets/_spinbutton.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_spinbutton.scss
+++ /dev/null
@@ -1,127 +0,0 @@
-@charset "UTF-8";
-
-/*****************
- * GtkSpinButton *
- *****************/
-
-.spinbutton {
-  .button {
-    @extend %spinbutton;
-  }
-  .osd & {
-    .button {
-      @extend %spinbutton;
-      &:last-child { border-radius: 0 3px 3px 0; }
-      &:dir(rtl):first-child { border-radius: 3px 0 0 3px; }
-    }
-  }
-  &.vertical, &.vertical:dir(rtl) { //FIXME: try using linking templates for vertically linked stuff
-    .button {
-      padding-top: 5px;    //  Same vertical padding as image-buttons
-      padding-bottom: 5px; //
-      &:first-child {
-        @extend %top_button;
-        @include button(normal);
-        &:active {
-          @extend %top_button;
-          @include button(active);
-        }
-        &:hover {
-          @extend %top_button;
-          @include button(hover);
-        }
-        &:insensitive {
-          @extend %top_button;
-          @include button(insensitive);
-        }
-        &:backdrop {
-          @extend %top_button;
-          @include button(backdrop);
-        }
-      }
-      &:last-child {
-        @extend %bottom_button;
-        @include button(normal);
-        &:active {
-          @extend %bottom_button;
-          @include button(active);
-        }
-        &:hover {
-          @extend %bottom_button;
-          @include button(hover);
-        }
-        &:insensitive {
-          @extend %bottom_button;
-          @include button(insensitive);
-        }
-        &:backdrop {
-          @extend %bottom_button;
-          @include button(backdrop);
-        }
-      }
-      &:backdrop:insensitive {
-        @include button(backdrop-insensitive);
-      }
-    }
-    &.entry {
-      // we should remove the bottom edge hilight here, but seems
-      // like buttons are on top of it so it doesn't show up
-      border-radius: 0px;
-      padding-left: 0px;
-      padding-right: 0px;
-      &:insensitive { background-color: insensitive(v_color(normal));}
-    }
-  }
-  GtkTreeView & {
-    &.entry, &.entry:focus {
-      padding: 1px;
-      border-width: 1px 0;
-      border-color: v_color(active);
-      border-radius: 0;
-      box-shadow: none;
-
-    }
-  }
-}
-
-%spinbutton {
-  background-image: none;
-  background-color: transparent;
-  border-style: none none none solid;
-  border-color: transparentize($border_color, 0.7);
-  color: b_color(text);
-  border-radius: 0;
-  box-shadow: none;
-  &:dir(rtl) { border-style: none solid none none; }
-  &:hover {
-    color: b_color(hover);
-  }
-  &:insensitive {
-    color: insensitive(b_color(text));
-    border-color: insensitive(transparentize($border_color, 0.7));
-  }
-  &:active {
-    color: b_color(active);
-  }
-  &:backdrop {
-    color: backdrop(b_color(text));
-    border-color: backdrop(transparentize($border_color, 0.7));
-    background-color: transparent;
-  }
-  &:backdrop:insensitive {
-    background-image: none;
-    color: backdrop(insensitive(b_color(text)));
-    border-style: none none none solid; // It is needed or it gets overridden
-    border-color: backdrop(insensitive(transparentize($border_color, 0.7)));
-    &:dir(rtl) { border-style: none solid none none; }
-  }
-}
-
-%top_button {
-  border-radius: 3px 3px 0 0;
-  border-style: solid solid none solid;
-}
-%bottom_button {
-  border-radius: 0 0 3px 3px;
-  border-style: none solid solid solid;
-}
diff --git a/src/gtk318/widgets/_switch.scss b/src/gtk318/widgets/_switch.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_switch.scss
+++ /dev/null
@@ -1,69 +0,0 @@
-@charset "UTF-8";
-
-/**********
- * Switch *
- **********/
-
-GtkSwitch {
-  -GtkSwitch-slider-width: 24px;
-  -GtkSwitch-slider-height: 24px;
-  font-weight: bold;
-  font-size: smaller;
-  outline-offset: 0px;
-  color: transparent;
-  box-shadow: none; // needs to be set here
-                                                    // otherwise it gets
-                                                    // clipped
-  &.trough {
-    // similar to the .scale
-    border: 0px solid;
-    border-radius: 12px;
-    background-image: none;
-    background-color: transparentize(b_color(text),0.7);
-    text-shadow: none;
-    &:active {
-      background-color: s_color(normal);
-      box-shadow: none;
-      text-shadow: none;
-    }
-    &:backdrop {
-      background-color: backdrop(transparentize(b_color(text),0.7));
-    }
-
-  }
-
-  &.slider {
-    border: 1px solid;
-    border-radius: 11px;
-    background-color: w_color(normal);
-    border-color: $border_color;
-    &:hover {
-      box-shadow: none;
-      border-color: b_color(hover);
-      background-color: w_color(normal);
-    }
-    &:active {
-    border-color: b_color(active);
-      &:hover { border-color: b_color(hover)}
-    }
-    &:insensitive { background-color: insensitive(w_color(normal)); }
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-      &:insensitive {
-        background-color: backdrop(insensitive(w_color(normal)));
-      }
-    }
-  }
-  .header-bar & {
-    &.trough {
-      &:backdrop {
-        background-color:transparent;
-      }
-    }
-    &.slider {
-      &:backdrop {
-        background-color: t_color(backdrop-text);
-      }
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_toolbar.scss b/src/gtk318/widgets/_toolbar.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_toolbar.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-@charset "UTF-8";
-
-/************
- * Toolbars *
- ************/
-.toolbar,
-.primary-toolbar {
-  -GtkWidget-window-dragging: true;
-  padding: 4px;
-  background-color: w_color(normal);
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-    box-shadow: none;
-  }
-  .osd &, &.osd {
-    padding: 13px;
-    border: none;
-    border-radius: $r;
-    background-color: w_color(normal);
-    &:backdrop {
-      border-color: backdrop($border_color);
-      background-color: backdrop(w_color(normal));
-      box-shadow: none;
-    }
-  }
-}
-
-//searchbar, location-bar & inline-toolbar
-.inline-toolbar {
-  @extend .toolbar;
-  @extend %inset-bar;
-  border-width: 0px 0px 1px 0px;
-  padding: 3px;
-  border-radius: 0;
-}
-.search-bar, .location-bar {
-  @extend .toolbar;
-  @extend %inset-bar;
-  border-width: 0px 0px 1px 0px;
-  padding: 3px;
-}
-
-%inset-bar {
-  border-style: solid;
-  border-color: $border_color;
-  text-shadow: none;
-  background-color: w_color(normal);
-}
diff --git a/src/gtk318/widgets/_tooltips.scss b/src/gtk318/widgets/_tooltips.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_tooltips.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-@charset "UTF-8";
-
-/************
- * Tooltips *
- ************/
-
-.tooltip {
-  &.background {
-    // background-color needs to be set this way otherwise it gets drawn twice
-    // see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
-    background-color: tooltip(background);
-    background-clip: padding-box;
-  }
-
-  color: tooltip(text);
-  padding: 4px; /* not working */
-  border-radius: 5px;
-  box-shadow: none; // otherwise it gets inherited by windowframe.csd
-  text-shadow: none;
-  border: 1px solid tooltip(border);
-  &.window-frame.csd {
-    background-color: transparent;
-  }
-}
-
-.tooltip * { //Yeah this is ugly
-  padding: 4px;
-  background-color: transparent;
-  color: inherit; // just to be sure
-}
diff --git a/src/gtk318/widgets/_treeview.scss b/src/gtk318/widgets/_treeview.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_treeview.scss
+++ /dev/null
@@ -1,138 +0,0 @@
-@charset "UTF-8";
-
-
-
-/**************
- * Tree Views *
- **************/
-GtkTreeView.view {
-  -GtkTreeView-grid-line-width: 0;
-  -GtkTreeView-grid-line-pattern: '';
-  -GtkTreeView-tree-line-width: 1;
-  -GtkTreeView-tree-line-pattern: '';
-  -GtkTreeView-expander-size: 16;
-
-  border-left-color: $border_color; // this is actually the tree lines color,
-  border-top-color: transparent;                    // while this is the grid lines color, better then nothing
-
-  &:selected { border-radius: 0; } // rest border radius in lists
-
-  &:selected  {
-    background-color: s_color(normal);
-    border-left-color: s_color(text);
-    border-top-color: s_color(text); // doesn't work unfortunatelly
-  }
-  &:backdrop:selected {
-    background-color: backdrop(s_color(backdrop));
-    border-left-color: backdrop(s_color(text));
-    border-top-color: backdrop(s_color(text));
-  }
-
-  &:insensitive {
-    color: insensitive($border_color);
-    &:selected {
-      color: insensitive(s_color(text));
-      &:backdrop { color: backdrop(insensitive(s_color(text))); }
-    }
-    &:backdrop { color: backdrop(insensitive($border_color)); }
-  }
-  &.separator {
-    color: $border_color;
-  }
-  &.separator:backdrop {
-    color: backdrop($border_color);
-  }
-
-  &:backdrop {
-    border-left-color: backdrop($border_color);
-  }
-
-  &.dnd {
-    border-style: solid none;
-    border-width: 1px;
-    border-color: b_color(hover);
-  }
-
-  &.expander {
-    -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-    color: v_color(text);
-    &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl');}
-    &:hover { color: b_color(hover); }
-    &:selected { color: s_color(text); }
-    &:checked {
-       -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
-      &:selected { color: s_color(text); }
-      &:backdrop { color: backdrop(v_color(normal)); }
-    }
-    &:backdrop { color: backdrop(v_color(text)); }
-  }
-}
-
-column-header {
-  .button {
-    @extend %column_header_button;
-    color: b_color(text);
-    background-color: b_color(normal);
-    text-shadow: none;
-    box-shadow: none;
-    &:hover {
-      @extend %column_header_button;
-      color: b_color(text);
-      background-color: transparentize(b_color(hover), 0.5);
-      box-shadow: none;
-      transition: none; //I shouldn't need this
-    }
-    &:active {
-      @extend %column_header_button;
-      color: b_color(text);
-      background-color: transparentize(b_color(hover), 0.5);
-      transition: none; //I shouldn't need this
-    }
-    &.dnd {
-      @extend column-header.button.dnd;
-    }
-  }
-  &:last-child .button,
-  &:last-child .button:backdrop, // set :backdrop too or the border will be visibile there
-  &:last-child.button,
-  &:last-child.button:backdrop { //treeview-like derived widgets in Banshee and Evolution
-    border-right-style: none;
-  }
-}
-
-column-header.button.dnd { // for treeview-like derive widgets
-  transition: none;
-  color: s_color(normal);
-  box-shadow: none;
-  &:active { @extend column-header.button.dnd; }
-  &:selected { @extend column-header.button.dnd; }
-  &:hover { @extend column-header.button.dnd; }
-}
-
-%column_header_button {
-  padding: 6px;
-  border-style: none solid solid none;
-  border-radius: 0;
-  background-image: none;
-  border-color: $border_color;
-  text-shadow: none;
-  &:insensitive {
-    border-color: insensitive($border_color);
-    color: insensitive(b_color(text));
-    background-color: insensitive(b_color(normal));
-    background-image: none;
-  }
-  &:backdrop {
-    border-color: backdrop($border_color);
-    border-style: none solid solid none;
-    color: backdrop(b_color(text));
-    background-image: none;
-    background-color: backdrop(b_color(normal));
-    &:insensitive {
-      border-color: backdrop(insensitive($border_color));
-      background-image: none;
-      background-color: backdrop(insensitive(b_color(normal)));
-      color: backdrop(insensitive(b_color(text)));
-    }
-  }
-}
diff --git a/src/gtk318/widgets/_window_decorations.scss b/src/gtk318/widgets/_window_decorations.scss
deleted file mode 100644
--- a/src/gtk318/widgets/_window_decorations.scss
+++ /dev/null
@@ -1,176 +0,0 @@
-@charset "UTF-8";
-
-/**********************
- * Window Decorations *
- *********************/
-
-.window-frame {
-
-  //border: 1px solid transparent;
-  border-radius: $r;
-  box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.5);
-
-  // FIXME rationalize window-frame shadows
-
-  /* this is used for the resize cursor area */
-  margin: 10px;
-
-  &:backdrop {
-    box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.5);
-  }
-  &.tiled {
-    border-radius: 0;
-  }
-  &.popup {
-    border-radius: $r;
-    box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.1)
-  }
-  // server-side decorations as used by mutter
-  &.ssd {
-	  box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.1);
-  }
-  &.csd {
-    border-radius: $r;
-    &.popup {
-      box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.1)
-    }
-    &.tooltip {
-      box-shadow: none;
-    }
-    &.message-dialog {
-      box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.5)
-    }
-  }
-  &.solid-csd {
-    border-radius: 0;
-    margin: 0px;
-    background-color: t_color(background-light);
-    border: none;
-    box-shadow: none;
-  }
-}
-
-// Window Close button
-.header-bar .button.titlebutton,
-.titlebar .button.titlebutton {
-  @extend %undecorated_button;
-  padding: 0px;
-  &:hover,
-  &:active,
-  &:checked,
-  &:backdrop,
-  &:active:hover { @extend %undecorated_button; transition: none;}
-
-  &.close {
-    padding: 1px;
-    color: transparent;
-    border-image: none;
-    box-shadow: none;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-image: -gtk-scaled(url('../assets/titlebutton-close.png'),url('../assets/titlebutton-close@2.png'));
-  }
-  &.close:hover {
-    border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-close-hover.png'),url('../assets/titlebutton-close-hover@2.png'));
-  }
-  &.close:active {
-    border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-close-active.png'),url('../assets/titlebutton-close-active@2.png'));
-  }
-  &.close:backdrop {
-    border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-close-backdrop.png'),url('../assets/titlebutton-close-backdrop@2.png'));
-  }
-
-  &.maximize {
-    padding: 1px;
-    color: transparent;
-    border-image: none;
-    box-shadow: none;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-image: -gtk-scaled(url('../assets/titlebutton-maximize.png'),url('../assets/titlebutton-maximize@2.png'));
-  }
-  &.maximize:hover {
-  	border-color: transparent;
-    background-color: transparent;
-  	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-hover.png'),url('../assets/titlebutton-maximize-hover@2.png'));
-	}
-  &.maximize:active {
-  	border-color: transparent;
-    background-color: transparent;
-  	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-active.png'),url('../assets/titlebutton-maximize-active@2.png'));
-	}
-  &.maximize:backdrop {
-  	border-color: transparent;
-    background-color: transparent;
-  	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-backdrop.png'),url('../assets/titlebutton-maximize-backdrop@2.png'));
-	}
-
-  &.minimize {
-    padding: 1px;
-    color: transparent;
-    border-image: none;
-    box-shadow: none;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-image: -gtk-scaled(url('../assets/titlebutton-minimize.png'),url('../assets/titlebutton-minimize@2.png'));
-  }
-  &.minimize:hover {
-	  border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-minimize-hover.png'),url('../assets/titlebutton-minimize-hover@2.png'));
-  }
-  &.minimize:active {
-	  border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-minimize-active.png'),url('../assets/titlebutton-minimize-active@2.png'));
-  }
-  &.minimize:backdrop {
-	  border-color: transparent;
-    background-color: transparent;
-    background-image: -gtk-scaled(url('../assets/titlebutton-minimize-backdrop.png'),url('../assets/titlebutton-minimize-backdrop@2.png'));
-  }
-}
-
-.header-bar,
-.titlebar {
-  .maximized & {
-    .button.titlebutton {
-      &.maximize {
-        padding: 1px;
-        color: transparent;
-        border-image: none;
-        box-shadow: none;
-        background-position: center;
-        background-repeat: no-repeat;
-        background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized.png'),url('../assets/titlebutton-maximize-maximized@2.png'));
-      }
-      &.maximize:hover {
-      	border-color: transparent;
-        background-color: transparent;
-      	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-hover.png'),url('../assets/titlebutton-maximize-maximized-hover@2.png'));
-    	}
-      &.maximize:active {
-      	border-color: transparent;
-        background-color: transparent;
-      	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-active.png'),url('../assets/titlebutton-maximize-maximized-active@2.png'));
-    	}
-      &.maximize:backdrop {
-      	border-color: transparent;
-        background-color: transparent;
-      	background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-backdrop.png'),url('../assets/titlebutton-maximize-maximized-backdrop@2.png'));
-    	}
-    }
-  }
-}
-
-.header-bar.selection-mode .button.titlebutton,
-.titlebar.selection-mode .button.titlebutton {
-  text-shadow: none;
-  &:backdrop { icon-shadow: none; }
-}
diff --git a/src/gtk320/gtk.scss b/src/gtk320/gtk.scss
deleted file mode 100644
--- a/src/gtk320/gtk.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-@charset "UTF-8";
-
-@import 'global';
-@import '../functions';
-@import '../colors';
-
-@import "widgets/base";
-@import "widgets/button";
-@import "widgets/entry";
-@import "widgets/app_notifications";
-@import "widgets/calendar";
-@import "widgets/checkboxes";
-@import "widgets/color_chooser";
-@import "widgets/dialogs";
-@import "widgets/headerbar";
-@import "widgets/infobar";
-@import "widgets/link";
-@import "widgets/lists";
-@import "widgets/menus";
-@import "widgets/misc";
-@import "widgets/notebook";
-@import "widgets/overshoot";
-@import "widgets/pathbar";
-@import "widgets/progressbar";
-@import "widgets/scale";
-@import "widgets/scrollbar";
-@import "widgets/sidebar";
-@import "widgets/spinbutton";
-@import "widgets/switch";
-@import "widgets/toolbar";
-@import "widgets/tooltips";
-@import "widgets/treeview";
-@import "widgets/window_decorations";
diff --git a/src/gtk320/widgets/_calendar.scss b/src/gtk320/widgets/_calendar.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_calendar.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@charset "UTF-8";
-
-/************
- * Calendar *
- ***********/
-calendar {
-  color: v_color(text);
-  border: 1px solid $border_color;
-  background-color: v_color(normal);
-  &:selected {
-    background-color: $border_color;
-  }
-  &:disabled {
-    color: insensitive(v_color(text));
-  }
-
-  &.header {
-    border: 1px solid $border_color;
-    border-radius: 0;
-    color: v_color(text);
-
-    &:backdrop {
-      color: backdrop(v_color(text));
-      border-color: backdrop($border_color);
-    }
-    
-    &:disabled {
-      color: insensitive(v_color(text));
-    }
-  }
-
-  &.button {
-    @extend %undecorated_button;
-    color: b_color(text);
-
-    &:hover {
-      @extend %undecorated_button;
-      color: b_color(hover);
-    }
-    &:active {
-      @extend %undecorated_button;
-      color: b_color(active);
-    }
-    &:backdrop {
-      @extend %undecorated_button;
-      color: backdrop(b_color(text));
-    }
-  }
-
-  &:indeterminate,
-  &.highlight {
-    color: transparentize(v_color(text),0.5);
-  }
-
-  &:indeterminate:backdrop,
-  &.highlight:backdrop {
-    color: backdrop(transparentize(v_color(text),0.5));
-  }
-
-
-  &:backdrop {
-    color: backdrop(v_color(text));
-    border-color: backdrop($border_color);
-    background-color: backdrop(v_color(normal));
-  }
-}
diff --git a/src/gtk320/widgets/_checkboxes.scss b/src/gtk320/widgets/_checkboxes.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_checkboxes.scss
+++ /dev/null
@@ -1,81 +0,0 @@
-@charset "UTF-8";
-
-/*************************
- * Check and Radio items *
- *************************/
-@each $s,$as in ('','-unchecked'),
-                 (':hover', '-unchecked-hover'),
-                 (':active', '-unchecked-active'),
-                 (':backdrop', '-unchecked-backdrop'),
-                 (':checked', '-checked-active'),
-                 (':checked:hover', '-checked-hover'),
-                 (':checked:active', '-checked-active'),
-                 (':backdrop:checked', '-checked-backdrop') {
- .view.content-view.check#{$s}:not(list) {
-   -gtk-icon-shadow: none;
-   -gtk-icon-source: -gtk-scaled(url("../assets/check-selectionmode#{$as}.png"), url("../assets/check-selectionmode#{$as}@2.png"));
-   background-color: transparent;
- }
-}
-
-checkbutton.text-button, radiobutton.text-button {
- // this is for a nice focus on check and radios text
- padding: 2px 0;
- outline-offset: 0;
-
- label:not(:only-child) {
-   &:first-child { margin-left: 4px; }
-   &:last-child { margin-right: 4px; }
- }
-}
-
-@each $a in ('check','radio') {
-
-  #{$a} {
-   margin: 0 4px;
-
-   &:only-child { margin: 0; }
-
-   min-height: 18px;
-   min-width: 18px;
-   //border: none;
-   animation: none;
-   background-color: transparent;
-   -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked.png"), url("../assets/#{$a}-unchecked@2.png"));
-
-   @each $s,$as in ('hover','-hover'),
-                    ('active','-active'),
-                    ('disabled','-insensitive'),
-                    ('backdrop','-backdrop'),
-                    ('backdrop:disabled','-backdrop-insensitive') {
-    &:#{$s} { -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked#{$as}.png"), url("../assets/#{$a}-unchecked#{$as}@2.png")); }
-    &:checked {
-      -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked-active.png"), url("../assets/#{$a}-checked-active@2.png"));
-      &:#{$s} { -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked#{$as}.png"), url("../assets/#{$a}-checked#{$as}@2.png")); }
-    }
-    &:indeterminate {
-      -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed-active.png"), url("../assets/#{$a}-mixed-active@2.png"));
-      &:#{$s} { -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed#{$as}.png"), url("../assets/#{$a}-mixed#{$as}@2.png")); }
-    }
-  }
-  
-   menu menuitem & {
-     margin: 0; // this is a workaround for a menu check/radio size allocation issue
-     min-height: 18px;
-     min-width: 18px;
-     background-color: transparent;
-     box-shadow: none;
-     -gtk-icon-shadow: none;
-     animation: none;
-     &:hover {
-       -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-unchecked.png"), url("../assets/#{$a}-unchecked@2.png"));
-     }
-     &:checked:hover {
-       -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-checked-active.png"), url("../assets/#{$a}-checked-active@2.png"));
-     }
-     &:indeterminate:hover {
-       -gtk-icon-source: -gtk-scaled(url("../assets/#{$a}-mixed-active.png"), url("../assets/#{$a}-mixed-active@2.png"));
-     }
-   }
-  }
-}
diff --git a/src/gtk320/widgets/_dialogs.scss b/src/gtk320/widgets/_dialogs.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_dialogs.scss
+++ /dev/null
@@ -1,46 +0,0 @@
-@charset "UTF-8";
-
-/***********
- * Dialogs *
- ***********/
-
-// .message-dialog .dialog-action-area .button {
-//   //padding: 8px;
-// }
-
-messagedialog { // Message Dialog styling
-
-    &.background { background-color: w_color(normal); }
-    &:backdrop { background-color: backdrop(w_color(normal))}
-  .titlebar {
-    min-height: 32px;
-    background-color: transparent;
-    background-image: linear-gradient(to bottom,change-color(t_color(background),$lightness: min(lightness(t_color(background))*1.2,100%)),t_color(background));
-    box-shadow: none;
-  }
-  .dialog-action-area {
-    padding: 8px;
-  }
-  button { margin: 2px; }
-}
-
-filechooser {
-  .search-bar {
-    background-color: w_color(normal);
-    border-color: w_color(normal);
-    box-shadow: none;
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-      border-color: backdrop(w_color(normal));
-      color: backdrop(w_color(text));
-    }
-  }
-  .dialog-action-box {
-    border-top: 1px solid $border_color;
-    &:backdrop { border-top-color: backdrop($border_color); }
-  }
-  #pathbarbox {
-    background-color: w_color(normal);
-    border-bottom: 1px solid $border_color;
-  }
-}
diff --git a/src/gtk320/widgets/_infobar.scss b/src/gtk320/widgets/_infobar.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_infobar.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-@charset "UTF-8";
-
-/**************
- * GtkInfoBar *
- **************/
-infobar {
-  border-style: none;
-  border-bottom: 1px solid $border_color;
-  background-color: w_color(normal);
-  background-image: none;
-  &:backdrop {border-bottom: 1px solid backdrop($border_color);}
-}
-
-.info,
-.question,
-.warning,
-.error {
-  background-color: w_color(normal);
-  background-image: none;
-  color: $warning_color;
-  text-shadow: none;
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-    color: backdrop($warning_color);
-  }
-  button {
-    box-shadow: none;
-    background-image:none;
-    background-color: transparentize($warning_color, 0.5);
-    border-color: transparentize($warning_color, 0.5);
-    color: b_color(text);
-    &:hover {
-      background-color: transparentize($warning_color, 0.75);
-      border-color: $warning_color;
-    }
-    &:active, &:checked {
-      background-image: button_gradient($warning_color);
-      color: w_color(normal);
-      border-color: $warning_color;
-    }
-    &:disabled {
-      background-color: insensitive(transparentize($warning_color, 0.5));
-      border-color: insensitive(transparentize($warning_color, 0.5));
-      color: insensitive(b_color(text));
-    }
-    &:backdrop {
-      background-color: backdrop(transparentize($warning_color, 0.5));
-      border-color: backdrop(transparentize($warning_color, 0.5));
-      color: backdrop(b_color(text));
-      &:active, &:checked {
-        background-image: button_gradient(backdrop($warning_color));
-        color: backdrop(w_color(normal));
-        border-color: backdrop($warning_color);
-      }
-      &:disabled {
-        background-color: backdrop(insensitive(transparentize($warning_color, 0.5)));
-        border-color: backdrop(insensitive(transparentize($warning_color, 0.5)));
-        color: backdrop(insensitive(b_color(text)));
-      }
-      &:disabled:active,
-      &:disabled:checked {
-        background-image: button_gradient(backdrop(insensitive($warning_color)));
-        color: backdrop(insensitive(w_color(normal)));
-        border-color: backdrop(insensitive($warning_color));
-      }
-    }
-  }
-}
diff --git a/src/gtk320/widgets/_link.scss b/src/gtk320/widgets/_link.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_link.scss
+++ /dev/null
@@ -1,51 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Links *
- *********/
-%link,
-*:link {
-  color: $link_color;
-  &:visited {
-    color: $link_visited_color;
-    *:selected & { color: mix(s_color(text), s_color(normal), 60%); }
-  }
-  &:hover {
-    color: lighten($link_color,10%);
-    *:selected & { color: mix(s_color(text), s_color(normal), 90%); }
-  }
-  &:active {
-    color: $link_color;
-    *:selected & { color: mix(s_color(text), s_color(normal), 80%); }
-  }
-  &:backdrop, &:backdrop:hover, &:backdrop:hover:selected {
-    color: backdrop(s_color(backdrop));
-  }
-  @at-root %link_selected,
-  &:selected, *:selected & {
-    color: mix(s_color(text), s_color(normal), 80%);
-  }
-}
-
-button:link,
-button:visited {
-  @extend %undecorated_button;
-
-  @extend *:link;
-
-  text-shadow: none;
-
-  &:hover,
-  &:active,
-  &:checked {
-    @extend %undecorated_button;
-
-    text-shadow: none;
-  }
-
-  > label {
-    @extend %link;
-
-    text-decoration-line: underline;
-  }
-}
diff --git a/src/gtk320/widgets/_lists.scss b/src/gtk320/widgets/_lists.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_lists.scss
+++ /dev/null
@@ -1,50 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Lists *
- *********/
-
-list {
-  background-color: w_color(normal);
-  color: w_color(text);
-  border-width: 0px;
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-    color: backdrop(w_color(text));
-  }
-  row { padding: 2px; }
-}
-
-row {
-  transition: all 150ms $ease-out-quad;
-
-  &:hover { transition: none; }
-
-  &.activatable {
-    &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
-
-    &:hover { background-color: transparentize(s_color(normal), 0.5); }
-
-    &:active {
-      box-shadow: none;
-      background-color: s_color(normal);
-    }
-
-    &:selected {
-      &:active {
-        box-shadow: none;
-        background-color: s_color(normal);
-      }
-
-      &.has-open-popup,
-      &:hover {
-        color: w_color(text);
-        background-color: s_color(hover);
-      }
-
-      &:backdrop { background-color: backdrop(s_color(normal)); }
-    }
-  }
-
-  &:selected { @extend %selected_items; }
-}
diff --git a/src/gtk320/widgets/_menus.scss b/src/gtk320/widgets/_menus.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_menus.scss
+++ /dev/null
@@ -1,253 +0,0 @@
-@charset "UTF-8";
-
-/*********
- * Menus *
- *********/
-
-
-menubar,
-.menubar {
-  -GtkWidget-window-dragging: true;
-  padding: 0px;
-  box-shadow: none;
-  border-style: none;
-  background-color: w_color(normal);
-  &:backdrop {
-    background-color: backdrop(w_color(normal));
-  }
-  > menuitem {
-    min-height: 16px;
-    padding: 4px 6px;
-    &:hover { //Seems like it :hover even with keyboard focus
-      background-color: b_color(active);
-      color: b_color(active-text);
-    }
-    &:disabled {
-      color: insensitive(w_color(text));
-      box-shadow: none;
-      &:backdrop {
-        background-color: backdrop(w_color(normal));
-        color: backdrop(insensitive(w_color(text)));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(w_color(normal));
-      color: backdrop(w_color(text));
-    }
-  }
-}
-
-menu,
-.menu {
-  padding: 0px;
-  background-color: $menu_color;
-  border: 0px solid transparent;
-  // FIXME workaround for libreoffice gtk3, should be a border
-  //border: 1px solid $border_color; // adds borders in a non composited env
-  box-shadow: inset 0px 0px 0px 1px $border_color;
-
-  border-radius: $r;
-  .csd & {
-    //background-color: transparent;
-    border: 0px solid;
-    border-radius: $r;
-    //box-shadow: 0px 0px 0px 1px $border_color, 2px 2px 2px 1px rgba(0, 0, 0, 0.1);
-  }  // axes borders in a composited env
-  separator {
-    color: $border_color;
-    margin-top: 3px;
-    margin-bottom: 3px;
-  }
-  menuitem {
-	  text-shadow: none;
-    min-height: 16px;
-    min-width: 40px;
-    padding: 4px 4px;
-    &:hover {
-      color: b_color(active-text);
-      background-color: b_color(active);
-    }
-    &:disabled {
-      color: insensitive(w_color(text));
-      &:backdrop { color: backdrop(insensitive(w_color(text))); }
-    }
-    &:backdrop, &:backdrop:hover {
-      color: backdrop(w_color(text));
-      background-color: backdrop(w_color(normal));
-    }
-    // submenu indicators
-    arrow {
-      min-height: 16px;
-      min-width: 16px;
-
-      &:dir(ltr) {
-        -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-        margin-left: 10px;
-      }
-
-      &:dir(rtl) {
-        -gtk-icon-source:-gtk-icontheme('pan-start-symbolic');
-        margin-right: 10px;
-      }
-    }
-  }
-  // overflow arrows
-  > arrow {
-    @include button(undecorated);
-
-    min-height: 16px;
-    min-width: 16px;
-    padding: 4px;
-    background-color: transparent;
-    border-radius: 0;
-
-    &.top {
-      margin-top: -6px;
-      border: none;
-      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
-    }
-
-    &.bottom {
-      margin-bottom: -6px;
-      border: none;
-      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
-    }
-
-    &:hover { color: b_color(hover); }
-    &:active { color: b_color(active)}
-
-    &:backdrop { background-color: backdrop($menu_color); }
-
-    &:disabled {
-      color: transparent;
-      background-color: transparent;
-      border-color: transparent ;
-    }
-  }
-}
-
-menuitem {
-  accelerator { color: gtkalpha(currentColor,0.55); }
-  check,
-  radio {
-    min-height: 18px;
-    min-width: 18px;
-
-    &:dir(ltr) { margin-right: 6px; }
-    &:dir(rtl) { margin-left: 6px; }
-  }
-}
-/***************
- * Popovers   *
- ***************/
-/* menu buttons */
-modelbutton.flat,
-.menuitem.button.flat {
- min-height: 16px;
- padding: 4px 8px;
-
- @extend %undecorated_button;
- color: w_color(text);
- &:hover {
-    background-color: b_color(active);
-    color: b_color(active-text)
-  }
- &:selected {
-    background-color: b_color(active);
-    color: b_color(active-text)
-  }
- &:backdrop, &:backdrop:hover {
-    @extend %undecorated_button;
-    color: backdrop(w_color(text));
-  }
-  check:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-unchecked.png"), url("../assets/check-unchecked@2.png"));}
-  radio:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-unchecked.png"), url("../assets/radio-unchecked@2.png"));}
-
-  check:checked:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-checked-active.png"), url("../assets/check-checked-active@2.png"));}
-  radio:checked:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-checked-active.png"), url("../assets/radio-checked-active@2.png"));}
-
-  check:indeterminate:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-mixed.png"), url("../assets/check-mixed@2.png"));}
-  radio:indeterminate:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-mixed.png"), url("../assets/radio-mixed@2.png"));}
-
-  // FIXME: remove the following when the checks/radios rewrite lands
-  check:last-child,
-  radio:last-child { margin-right: 0px; }
-
-  check:first-child,
-  radio:first-child { margin-left: 0px; }
-}
-
-modelbutton.flat arrow {
-  background: none;
-
-  &:hover { background: none; }
-
-  &.left { -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
-
-  &.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
-}
-
-popover.background {
-  padding: 0px;
-  border: 1px solid $border_color;
-  border-radius: 3px;
-  background-color: w_color(normal);
-
-  box-shadow: 0 2px 3px transparentize(black, 0.1);
-
-  &:backdrop {
-    box-shadow: none;
-  }
-  
-  > list,
-  > .view,
-  > toolbar {
-    border-style: none;
-    background-color: transparent;
-  }
-  .csd &, & {
-    &.touch-selection,
-    &.magnifier {
-      @extend %osd;
-
-      border: 1px solid $border_color;
-
-      button { @extend %button };
-    }
-
-    &.osd { @extend %osd; }
-  }
-
-  separator { margin: 3px; }
-
-  list separator { margin: 0px; }
-
-  checkbutton,
-  radiobutton { @extend modelbutton.flat; }
-}
-
-// .scale-popup .button,
-// .scale-popup .button.flat { // +/- buttons on GtkVolumeButton popup
-//   @extend %undecorated_button;
-//   background-color: transparent;
-//   padding: 5px;
-//   color: w_color(text);
-//   &:hover {
-//     @extend %undecorated_button;
-//     color: b_color(hover);
-//   }
-//   &:active {
-//     color: b_color(active);
-//   }
-//   &:insensitive {
-//     color: insensitive(w_color(text));
-//   }
-//   &:backdrop {
-//     color: backdrop(w_color(text));
-//     &:insensitive {
-//       color: backdrop(insensitive(w_color(text)));
-//     }
-//   }
-// }
-
-GtkVolumeButton.button { padding: 5px; }
diff --git a/src/gtk320/widgets/_progressbar.scss b/src/gtk320/widgets/_progressbar.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_progressbar.scss
+++ /dev/null
@@ -1,141 +0,0 @@
-@charset "UTF-8";
-
-/*****************
- * Progress bars *
- *****************/
-progressbar {
- // sizing
- &.horizontal {
-   trough,
-   progress { min-height: 6px; }
- }
-
- &.vertical {
-   trough,
-   progress { min-width: 6px; }
- }
-
- // FIXME: insensitive state missing and some other state should be set probably
- font-size: smaller;
- color: transparentize(b_color(text), 0.7);
-
- trough {
-   border: 0px solid transparent;
-   border-radius: $r;
-   background-color: transparentize(b_color(text),0.7);
-  }
-
- &:backdrop trough { background-color: backdrop(transparentize(b_color(text),0.7)); } // looks like states are not passed to the trough component here
-
- progress {
-   background-color: s_color(normal);
-   border: 0px solid transparent;
-   border-radius: 3px;
-   box-shadow: none; //needed for clipping
- }
-
- &:backdrop progress { background-color: backdrop(s_color(normal)); } // states not passed here as well
-
- &.osd { // progressbar.osd used for epiphany page loading progress
-   background-color: transparent;
- }
-}
-
-treeview.view {
-  &.progressbar {
-    border: 0px solid transparent;
-    border-radius: $r;
-    background-color: s_color(normal);
-    color: s_color(text);
-    background-image: none;
-    &:selected {
-      &:focus, & {
-        background-color: transparentize(s_color(text),0.75);
-      }
-    }
-  }
-  &.trough {
-    background-color: $trough_color;
-    &:selected {
-      &:focus, & {
-        background-color: transparentize(s_color(text),0.7);
-      }
-    }
-  }
-}
-
-/*************
- * Level Bar *
- *************/
-levelbar {
- block {
-   min-width: 32px;
-   min-height: 6px;
- }
-
- &.vertical block {
-   min-width: 6px;
-   min-height: 32px;
- }
-
- trough {
-   border: 1px solid;
-   padding: 2px;
-   border-radius: 3px;
-   @include entry(normal);
-
-   &:backdrop { @include entry(backdrop); }
- }
-
- &.horizontal.discrete block { margin: 0 1px; }
-
- &.vertical.discrete block { margin: 1px 0; }
-
- block:not(.empty) {
-   border: 1px solid s_color(normal);
-   background-color: s_color(normal);
-   box-shadow: none;
-   border-radius: 1px;
-
-   &:backdrop {
-     border-color: backdrop(s_color(normal));
-     background-color: backdrop(s_color(normal));
-   }
- }
-
- block {
-   &.low {
-     border-color: $warning_color;
-     background-color: $warning_color;
-     &:backdrop {
-       background-color: backdrop($warning_color);
-       border-color: backdrop($warning_color);
-     }
-   }
-
-   &.high {
-     border-color: $success_color;
-     background-color: $success_color;
-     &:backdrop {
-       background-color: backdrop($success_color);
-       border-color: backdrop($success_color);
-     }
-   }
-
-   &.full {
-     border-color: $success_color;
-     background-color: $success_color;
-     &:backdrop {
-       background-color: backdrop($success_color);
-       border-color: backdrop($success_color);
-     }
-   }
-
-   &.empty {
-     background-color: transparentize(b_color(text),0.7);
-     border-color: transparent;
-     box-shadow: none;
-     &:backdrop { background-color: backdrop(transparentize(b_color(text),0.7)); }
-   }
- }
-}
diff --git a/src/gtk320/widgets/_scale.scss b/src/gtk320/widgets/_scale.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_scale.scss
+++ /dev/null
@@ -1,94 +0,0 @@
-@charset "UTF-8";
-
-/************
- * GtkScale *
- ************/
-scale {
-
-  &.fine-tune {
-    &.trough {
-      margin: 8px;
-      border-radius: $r;
-    }
-  }
-
-  slider {
-    min-width: 18px;
-    min-height: 18px;
-    background-color: b_color(normal);
-    border: 1px solid $border_color;
-    border-radius: 50%;
-    box-shadow: none;
-    margin: -9px;
-    &:hover {
-      border-style: solid;
-  	  border-width: 2px;
-      border-color: b_color(hover);
-      border-radius: 50%; // needed for double marks scales
-      &:backdrop {
-        background-color: backdrop(b_color(normal));
-        border-color: backdrop(b_color(hover));
-      }
-    }
-    &:disabled {
-      border-style: solid; // needed for double marks scales or they'll get
-      border-radius: 50%;  // overridden
-      background-color: alpha2solid(insensitive(b_color(normal)),w_color(normal));
-      border-color: insensitive($border_color);
-      &:backdrop {
-        background-color: alpha2solid(backdrop(insensitive(b_color(normal))),w_color(normal));
-        border-color: backdrop(insensitive($border_color));
-      }
-    }
-    &:active {
-      border: 2px solid b_color(active);
-      &:backdrop {
-        background-color: backdrop(b_color(normal));
-        border-color: backdrop(b_color(active));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop(b_color(normal));
-      border-color: backdrop($border_color);
-    }
-  }
-  trough {
-    min-width: 6px;
-    min-height: 6px;
-    margin: 9px;
-    border: 0px solid;
-    border-radius: $r;
-    background-color: $trough_color;
-    box-shadow: none;
-
-    &:disabled, &.vertical:disabled {
-      border-color: insensitive($trough_color);
-      background-color: insensitive($trough_color);
-      box-shadow: none;
-      &:backdrop {
-        background-color: backdrop(insensitive($trough_color));
-        border-color: backdrop(insensitive($trough_color));
-      }
-    }
-    &:backdrop {
-      background-color: backdrop($trough_color);
-      border-color: backdrop($trough_color);
-    }
-  }
-  highlight {
-    border: 0px solid;
-    border-radius: 3px;
-    background-color: s_color(normal);
-    border-color: s_color(normal);
-    &.vertical {
-      background-color: s_color(normal);
-      border-color: s_color(normal);
-    }
-    &:disabled { background-color: insensitive(s_color(normal));}
-    &:backdrop {
-      background-color: backdrop(s_color(backdrop));
-      border-color: backdrop(s_color(backdrop));
-      &:disabled {background-color: backdrop(insensitive(s_color(normal)));}
-    }
-  }
-}
diff --git a/src/gtk320/widgets/_sidebar.scss b/src/gtk320/widgets/_sidebar.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_sidebar.scss
+++ /dev/null
@@ -1,124 +0,0 @@
-@charset "UTF-8";
-
-/***********
- * Sidebar *
- ***********/
-
-.sidebar {
-  border: none;
-  background-color: w_color(normal);
-  &:selected {
-    @extend %selected_items;
-  }
-  &:backdrop { background-color: backdrop(w_color(normal))}
-}
-
-// Places sidebar is a special case, since the view here have to look like chrome not content, so we override text color
-placessidebar {
-  > viewport.frame { border-style: none; }
-
-  row {
-    // Needs overriding of the GtkListBoxRow padding
-    min-height: 36px;
-    padding: 0px;
-
-    // Using margins/padding directly in the SidebarRow
-    // will make the animation of the new bookmark row jump
-    > revealer { padding: 0 14px; }
-
-    &:selected { color: s_color(text); }
-
-    &:disabled { color: insensitive(w_color(text)); }
-
-    &:backdrop {
-      color: backdrop(w_color(text));
-
-      &:selected { color: backdrop(s_color(normal)); }
-
-      &:disabled { color: backdrop(insensitive(w_color(text))); }
-    }
-
-    image.sidebar-icon {
-
-      &:dir(ltr) { padding-right: 8px; }
-      &:dir(rtl) { padding-left: 8px; }
-    }
-
-    label.sidebar-label {
-      &:dir(ltr) { padding-right: 2px; }
-      &:dir(rtl) { padding-left: 2px; }
-    }
-
-    @at-root button.sidebar-button {
-      @extend %button_basic.flat;
-
-      @extend %undecorated_button;
-
-      min-height: 26px;
-      min-width: 26px;
-      margin-top: 3px;
-      margin-bottom: 3px;
-      padding: 0;
-
-    }
-
-    // in the sidebar case it makes no sense to click the selected row
-    &:selected:active { box-shadow: none; }
-
-    &.sidebar-placeholder-row {
-      padding: 0 8px;
-      min-height: 2px;
-      background-image: none;
-      background-clip: content-box;
-    }
-
-    &.sidebar-new-bookmark-row { color: s_color(normal); }
-
-    // &:drop(active):not(:disabled) {
-    //   color: $drop_target_color;
-    //   box-shadow: inset 0 1px $drop_target_color,
-    //               inset 0 -1px $drop_target_color;
-    //
-    //   &:selected {
-    //     color: $selected_fg_color;
-    //     background-color: $drop_target_color;
-    //   }
-    // }
-  }
-}
-
-placesview {
-  .server-list-button > image {
-    transition: 200ms $ease-out-quad;
-    -gtk-icon-transform: rotate(0turn);
-  }
-
-  .server-list-button:checked > image {
-    transition: 200ms $ease-out-quad;
-    -gtk-icon-transform: rotate(-0.5turn);
-  }
-
-  row.activatable:hover { background-color: transparent; }
-
-  // this selects the "connect to server" label
-  > actionbar > revealer > box > label {
-    padding-left: 8px;
-    padding-right: 8px;
-  }
-}
-
-stacksidebar {
-  &.sidebar {
-    row {
-      padding: 10px 4px;
-      > label {
-        padding-left: 6px;
-        padding-right: 6px;
-      }
-      &.needs-attention > .label {
-        @extend %needs_attention;
-        background-size: 6px 6px, 0 0;
-      }
-    }
-  }
-}
diff --git a/src/gtk320/widgets/_switch.scss b/src/gtk320/widgets/_switch.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_switch.scss
+++ /dev/null
@@ -1,54 +0,0 @@
-@charset "UTF-8";
-
-/**********
- * Switch *
- **********/
-
-switch {
- margin: 2px;
- font-weight: bold;
- font-size: smaller;
- min-width: 48px;
- min-height: 24px;
- border: 0px solid;
- border-radius: 12px;
- color: transparent;
- background-color: transparentize(b_color(text),0.7);
- text-shadow: none;
-
- &:checked {
-   background-color: s_color(normal);
- }
-
- &:backdrop {
-   background-color: backdrop(transparentize(b_color(text),0.7));
-   text-shadow: none;
-
-   &:checked {
-     background-color: backdrop(s_color(normal));
-   }
- }
-
- slider {
-   min-width: 22px;
-   min-height: 22px;
-   border: 1px solid;
-   border-radius: 11px;
-   background-color: w_color(normal);
-   border-color: $border_color;
- }
-
- &:hover slider { border-color: b_color(hover); }
-
- &:disabled slider {
-   background-color:insensitive(w_color(normal));
- }
-
- &:backdrop {
-   slider {
-     background-color: backdrop(w_color(normal));
-   }
-
-   &:disabled slider { background-color: backdrop(insensitive(w_color(normal))); }
- }
-}
diff --git a/src/gtk320/widgets/_treeview.scss b/src/gtk320/widgets/_treeview.scss
deleted file mode 100644
--- a/src/gtk320/widgets/_treeview.scss
+++ /dev/null
@@ -1,140 +0,0 @@
-@charset "UTF-8";
-
-
-
-/**************
- * Tree Views *
- **************/
-treeview.view {
-  -GtkTreeView-grid-line-width: 0;
-  -GtkTreeView-grid-line-pattern: '';
-  -GtkTreeView-tree-line-width: 1;
-  -GtkTreeView-tree-line-pattern: '';
-  -GtkTreeView-expander-size: 16;
-
-  border-left-color: $border_color; // this is actually the tree lines color,
-  border-top-color: transparent;                    // while this is the grid lines color, better then nothing
-
-  rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props
-
-  &:selected { border-radius: 0; } // rest border radius in lists
-
-  &:selected  {
-    background-color: s_color(normal);
-    border-left-color: s_color(text);
-    border-top-color: s_color(text); // doesn't work unfortunatelly
-  }
-  &:backdrop:selected {
-    background-color: backdrop(s_color(backdrop));
-    border-left-color: backdrop(s_color(text));
-    border-top-color: backdrop(s_color(text));
-  }
-
-  &:disabled {
-    color: insensitive($border_color);
-    &:selected {
-      color: insensitive(s_color(text));
-      &:backdrop { color: backdrop(insensitive(s_color(text))); }
-    }
-    &:backdrop { color: backdrop(insensitive($border_color)); }
-  }
-  &.separator {
-    min-height: 2px;
-    color: $border_color;
-  }
-  &.separator:backdrop {
-    color: backdrop($border_color);
-  }
-
-  &:backdrop {
-    border-left-color: backdrop($border_color);
-  }
-
-  &:drop(active) {
-    border-style: solid none;
-    border-width: 1px;
-    border-color: b_color(hover);
-  }
-
-  &.expander {
-    // GtkTreeView uses the larger of the expander’s min-width and min-height
-    min-width: 16px;
-    min-height: 16px;
-    -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
-    color: v_color(text);
-    &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); };
-    &:hover { color: b_color(hover); }
-    &:selected { color: s_color(text); }
-    &:checked {
-       -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
-      &:selected { color: s_color(text); }
-      &:backdrop { color: backdrop(v_color(normal)); }
-    }
-    &:backdrop { color: backdrop(v_color(normal)); }
-  }
-  header {
-    button {
-      @extend %column_header_button;
-      color: b_color(text);
-      background-color: b_color(normal);
-      text-shadow: none;
-      box-shadow: none;
-      &:hover {
-        @extend %column_header_button;
-        color: b_color(text);
-        background-color: transparentize(b_color(hover), 0.5);
-        box-shadow: none;
-        transition: none; //I shouldn't need this
-      }
-      &:active {
-        @extend %column_header_button;
-        color: b_color(text);
-        background-color: transparentize(b_color(hover), 0.5);
-        transition: none; //I shouldn't need this
-      }
-    }
-    button:last-child { &:backdrop, & { border-right-style: none; }}
-    }
-    button.dnd,
-    header.button.dnd { // for treeview-like derive widgets
-      &:active, &:selected, &:hover, & {
-        padding: 0 6px;
-        color: s_color(text);
-        background-image: none;
-        background-color: s_color(normal);
-        border-style: none;
-        border-radius: 0;
-        box-shadow: none;
-        text-shadow: none;
-        transition: none;
-      }
-    }
-}
-
-%column_header_button {
-  padding: 6px;
-  border-style: none solid solid none;
-  border-radius: 0;
-  background-image: none;
-  border-color: $border_color;
-  text-shadow: none;
-  &:disabled {
-    border-color: insensitive($border_color);
-    color: insensitive(b_color(text));
-    background-color: insensitive(b_color(normal));
-    background-image: none;
-  }
-  &:backdrop {
-    border-color: backdrop($border_color);
-    border-style: none solid solid none;
-    color: backdrop(b_color(text));
-    background-image: none;
-    background-color: backdrop(b_color(normal));
-    &:disabled {
-      border-color: backdrop(insensitive($border_color));
-      background-image: none;
-      background-color: backdrop(insensitive(b_color(normal)));
-      color: backdrop(insensitive(b_color(text)));
-    }
-  }
-}