diff --git a/src/StyleWrapper/EEAColorscheme.js b/src/StyleWrapper/EEAColorscheme.js
index 0ceb427..e5e62b7 100644
--- a/src/StyleWrapper/EEAColorscheme.js
+++ b/src/StyleWrapper/EEAColorscheme.js
@@ -25,10 +25,12 @@ const updatedEEAColorcheme = [
   '#f7a600',
   '#b94b19',
   '#8d4107',
+  '#000000',
   '#6f6f6e',
   '#929291',
   '#bcbcbc',
   '#e3e3e3',
+  '#ffffff',
 ];
 
 export default updatedEEAColorcheme;
diff --git a/src/Widgets/SimpleColorPicker.jsx b/src/Widgets/SimpleColorPicker.jsx
index 0c81d91..3c37518 100644
--- a/src/Widgets/SimpleColorPicker.jsx
+++ b/src/Widgets/SimpleColorPicker.jsx
@@ -20,7 +20,7 @@ export default (props) => {
         <Button.Group>
           <Button
             style={{ backgroundColor: value }}
-            onClick={() => setShowPicker(true)}
+            onClick={() => setShowPicker(!showPicker)}
             size="huge"
             title="Pick color"
           >
diff --git a/src/styles.less b/src/styles.less
index d6ee3bd..e3359c0 100644
--- a/src/styles.less
+++ b/src/styles.less
@@ -173,6 +173,7 @@
   .color-picker {
     position: absolute !important;
     top: 0 !important;
-    transform: translateY(-100%);
+    transform: translateY(45%);
+    z-index: 2;
   }
 }