diff --git a/src/app/components/floating-column/manage-account/my-account/list-editor/list-account/list-account.component.scss b/src/app/components/floating-column/manage-account/my-account/list-editor/list-account/list-account.component.scss
index 9a629cbf..440a13c8 100644
--- a/src/app/components/floating-column/manage-account/my-account/list-editor/list-account/list-account.component.scss
+++ b/src/app/components/floating-column/manage-account/my-account/list-editor/list-account/list-account.component.scss
@@ -34,7 +34,7 @@
             &--remove {
                 color: $font-link-primary;
                 &:hover{
-                    color: color(font-link-primary-lighter-40);
+                    color: var(--font-link-primary-lighter-40);
                 }
             }
         }
diff --git a/src/app/components/floating-column/manage-account/my-account/list-editor/list-editor.component.scss b/src/app/components/floating-column/manage-account/my-account/list-editor/list-editor.component.scss
index 7bb4c2af..d9f06648 100644
--- a/src/app/components/floating-column/manage-account/my-account/list-editor/list-editor.component.scss
+++ b/src/app/components/floating-column/manage-account/my-account/list-editor/list-editor.component.scss
@@ -9,7 +9,7 @@
 
     &__search {
         color: #fff;
-        background-color: color(color-primary-darker-4);
+        background-color: var(--color-primary-darker-4);
         border: 2px solid var(--color-primary);
         width: calc(100%);
         padding: 3px 5px;
diff --git a/src/app/components/floating-column/manage-account/my-account/my-account.component.scss b/src/app/components/floating-column/manage-account/my-account/my-account.component.scss
index ee513b59..5064a8c9 100644
--- a/src/app/components/floating-column/manage-account/my-account/my-account.component.scss
+++ b/src/app/components/floating-column/manage-account/my-account/my-account.component.scss
@@ -30,7 +30,7 @@ $button-width: $list-width/2;
         color: #fff;
 
         &:hover {
-            background-color: color(color-primary-lighter-15);
+            background-color: var(--color-primary-lighter-15);
         }
     }
 
@@ -62,13 +62,13 @@ $button-width: $list-width/2;
 
         &--disabled {
             cursor: default;
-            background-color: color(color-primary-darker-4);
+            background-color: var(--color-primary-darker-4);
 
             width: calc(100% - #{$button-width} - 1px);
             //outline: 1px solid greenyellow;
 
             &:hover {
-                background-color: color(color-primary-darker-4);
+                background-color: var(--color-primary-darker-4);
             }
         }
 
@@ -91,13 +91,13 @@ $button-width: $list-width/2;
 
         &--disabled {
             cursor: default;
-            background-color: color(color-primary-darker-4);
+            background-color: var(--color-primary-darker-4);
 
             width: calc(100% - #{$button-width} * 3 - 3px);
             //outline: 1px solid greenyellow;
 
             &:hover {
-                background-color: color(color-primary-darker-4);
+                background-color: var(--color-primary-darker-4);
             }
         }
 
@@ -112,13 +112,13 @@ $button-width: $list-width/2;
 
             &:hover {
                 color: #fff;
-                background-color: color(color-primary-lighter-15);
+                background-color: var(--color-primary-lighter-15);
             }
         }
 
         &--new-list-title {
             color: #fff;
-            background-color: color(color-primary-darker-4);
+            background-color: var(--color-primary-darker-4);
             border: 2px solid var(--color-primary);
             width: calc(100% - #{$list-width}/2 - 1px);
             padding: 3px 5px;
diff --git a/src/app/components/stream/stream-edition/stream-edition.component.scss b/src/app/components/stream/stream-edition/stream-edition.component.scss
index 0c79f33a..c905fabf 100644
--- a/src/app/components/stream/stream-edition/stream-edition.component.scss
+++ b/src/app/components/stream/stream-edition/stream-edition.component.scss
@@ -51,7 +51,7 @@
         }
 
         &:hover {
-            color: color(font-color-primary-darker-20);
+            color: var(--font-color-primary-darker-20);
         }
     }
 }
\ No newline at end of file
diff --git a/src/app/themes/theme.service.ts b/src/app/themes/theme.service.ts
index d16296af..4bb5fdf0 100644
--- a/src/app/themes/theme.service.ts
+++ b/src/app/themes/theme.service.ts
@@ -26,7 +26,7 @@ export class ThemeService {
 
     setTheme(theme: Theme){
         this.setActiveTheme(theme);
-        this.activeTheme.next(theme.type);
+        this.activeTheme.next(theme.theme_type);
     }
 
     // isDarkTheme(): boolean {
diff --git a/src/sass/_buttons.scss b/src/sass/_buttons.scss
index 15ceae03..4522462a 100644
--- a/src/sass/_buttons.scss
+++ b/src/sass/_buttons.scss
@@ -63,10 +63,10 @@
 
     &--disabled {
         cursor: default;
-        background-color: color(color-primary-darker-4);
+        background-color: var(--color-primary-darker-4);
 
         &:hover {
-            background-color: color(color-primary-darker-4);
+            background-color: var(--color-primary-darker-4);
         }
     }
 
@@ -81,7 +81,7 @@
         color: #fff;
 
         &:hover {
-            background-color: color(color-primary-lighter-15);
+            background-color: var(--color-primary-lighter-15);
         }
     }
 
diff --git a/src/sass/_commons.scss b/src/sass/_commons.scss
index bf6a2233..6b7c89fa 100644
--- a/src/sass/_commons.scss
+++ b/src/sass/_commons.scss
@@ -26,6 +26,7 @@
 
 .flexcroll {
     scrollbar-color:  $scrollbar-color-thumb #0f111a;
+    scrollbar-color: #090b10 #0f111a;
     scrollbar-width: thin;
 
     scrollbar-face-color: $scrollbar-color;
diff --git a/src/sass/_variables.scss b/src/sass/_variables.scss
index a38ac8e2..c855de8a 100644
--- a/src/sass/_variables.scss
+++ b/src/sass/_variables.scss
@@ -1,13 +1,14 @@
 :root {
     --font-color-primary: #e8eaf3;
     //--font-color-secondary: #fff;
-    --font-color-secondary-value: #fff;
-    --font-color-secondary: hsl(from var(--font-color-secondary-value) h s calc(l - 25%));
+    --font-color-secondary-value: #fff;    
     --font-link-primary: #595c67;
     --font-link-primary-hover: #8f93a2;
     --color-primary: #141824;
     --color-secondary: #090b10;
 
+    --font-color-secondary: hsl(from var(--font-color-secondary-value) h s calc(l - 25%));
+
     --color-primary-lighter-5: hsl(from var(var(--color-primary)) h s calc(l + 5%));
     --color-primary-lighter-15: hsl(from var(var(--color-primary)) h s calc(l + 15%));
     --color-primary-lighter-20: hsl(from var(var(--color-primary)) h s calc(l + 20%));
@@ -18,17 +19,13 @@
     --font-link-primary-lighter-40: hsl(from var(--font-link-primary-lighter-40) h s calc(l + 40%));
 }
 
-@function color($color-name) {
-    @return var(--#{$color-name});
-}
-
 $font-color-primary: var(--font-color-primary); // #e8eaf3;
 //$font-color-secondary: darken(var(--font-color-secondary), 25) ;// darken(#fff, 25);
 //$font-color-secondary: hsl(from var(--font-color-secondary) h s calc(l - 25%));
-$font-color-secondary: color(font-color-secondary); 
+$font-color-secondary: var(--font-color-secondary); 
 
-$font-link-primary: color(font-link-primary); // #595c67;
-$font-link-primary-hover: color(font-link-primary-hover);// #8f93a2;
+$font-link-primary: var(--font-link-primary); // #595c67;
+$font-link-primary-hover: var(--font-link-primary-hover);// #8f93a2;
 //$color-primary: var(var(--color-primary)); // #141824;
 //$color-secondary: var(--color-secondary); // #090b10;
 
@@ -72,7 +69,7 @@ $button-color: darken(white, 30);
 $button-color-hover: white;
 $button-background-color: var(--color-primary);
 //$button-background-color-hover: lighten($color-primary, 20);
-$button-background-color-hover: color(color-primary-lighter-20);
+$button-background-color-hover: var(--color-primary-lighter-20);
 $button-border-color: #303957;
 
 
@@ -114,7 +111,7 @@ $autosuggest-entry-color-hover: #e2e2e2;
 $autosuggest-entry-handle-color-hover: #ffffff;
 
 $scrollbar-color: #08090d;
-$scrollbar-color-thumb: color(color-primary-lighter-5);
+$scrollbar-color-thumb: var(--color-primary-lighter-5);
 
 $poll-editor-background: #3e455f;
 $poll-editor-background: #32384d;