diff --git a/baseframe/static/css/mui.css b/baseframe/static/css/mui.css
index 4a423ffe..31dc0a58 100644
--- a/baseframe/static/css/mui.css
+++ b/baseframe/static/css/mui.css
@@ -1697,7 +1697,7 @@ body {
   font-weight: 400;
   line-height: 24px;
   color: #1f2d3d;
-  background-color: #f9fafc;
+  background-color: #f9f9f9;
 }
 
 @media (min-width: 1200px) {
@@ -1706,7 +1706,7 @@ body {
   }
 }
 a {
-  color: #4a90e2;
+  color: #0f73ed;
   text-decoration: none;
 }
 a:hover,
@@ -1743,7 +1743,7 @@ strong {
 
 abbr[title] {
   cursor: help;
-  border-bottom: 1px dotted #e05f26;
+  border-bottom: 1px dotted #0f73ed;
 }
 
 h1,
@@ -1992,34 +1992,34 @@ h6 {
 
 .mui-btn--primary {
   color: #fff;
-  background-color: #e05f26;
+  background-color: #0f73ed;
 }
 .mui-btn--primary:hover,
 .mui-btn--primary:focus,
 .mui-btn--primary:active {
   color: #fff;
-  background-color: #e36f3c;
+  background-color: #2481f1;
 }
 .mui-btn--primary[disabled]:hover,
 .mui-btn--primary[disabled]:focus,
 .mui-btn--primary[disabled]:active {
   color: #fff;
-  background-color: #e05f26;
+  background-color: #0f73ed;
 }
 .mui-btn--primary.mui-btn--flat {
-  color: #e05f26;
+  color: #0f73ed;
   background-color: transparent;
 }
 .mui-btn--primary.mui-btn--flat:hover,
 .mui-btn--primary.mui-btn--flat:focus,
 .mui-btn--primary.mui-btn--flat:active {
-  color: #e05f26;
+  color: #0f73ed;
   background-color: #f2f2f2;
 }
 .mui-btn--primary.mui-btn--flat[disabled]:hover,
 .mui-btn--primary.mui-btn--flat[disabled]:focus,
 .mui-btn--primary.mui-btn--flat[disabled]:active {
-  color: #e05f26;
+  color: #0f73ed;
   background-color: transparent;
 }
 
@@ -2058,67 +2058,67 @@ h6 {
 
 .mui-btn--danger {
   color: #fff;
-  background-color: #c04b61;
+  background-color: #f04e45;
 }
 .mui-btn--danger:hover,
 .mui-btn--danger:focus,
 .mui-btn--danger:active {
   color: #fff;
-  background-color: #c75e72;
+  background-color: #f2645d;
 }
 .mui-btn--danger[disabled]:hover,
 .mui-btn--danger[disabled]:focus,
 .mui-btn--danger[disabled]:active {
   color: #fff;
-  background-color: #c04b61;
+  background-color: #f04e45;
 }
 .mui-btn--danger.mui-btn--flat {
-  color: #c04b61;
+  color: #f04e45;
   background-color: transparent;
 }
 .mui-btn--danger.mui-btn--flat:hover,
 .mui-btn--danger.mui-btn--flat:focus,
 .mui-btn--danger.mui-btn--flat:active {
-  color: #c04b61;
+  color: #f04e45;
   background-color: #f2f2f2;
 }
 .mui-btn--danger.mui-btn--flat[disabled]:hover,
 .mui-btn--danger.mui-btn--flat[disabled]:focus,
 .mui-btn--danger.mui-btn--flat[disabled]:active {
-  color: #c04b61;
+  color: #f04e45;
   background-color: transparent;
 }
 
 .mui-btn--accent {
   color: #fff;
-  background-color: #856a91;
+  background-color: #f06a5e;
 }
 .mui-btn--accent:hover,
 .mui-btn--accent:focus,
 .mui-btn--accent:active {
   color: #fff;
-  background-color: #91789c;
+  background-color: #f28075;
 }
 .mui-btn--accent[disabled]:hover,
 .mui-btn--accent[disabled]:focus,
 .mui-btn--accent[disabled]:active {
   color: #fff;
-  background-color: #856a91;
+  background-color: #f06a5e;
 }
 .mui-btn--accent.mui-btn--flat {
-  color: #856a91;
+  color: #f06a5e;
   background-color: transparent;
 }
 .mui-btn--accent.mui-btn--flat:hover,
 .mui-btn--accent.mui-btn--flat:focus,
 .mui-btn--accent.mui-btn--flat:active {
-  color: #856a91;
+  color: #f06a5e;
   background-color: #f2f2f2;
 }
 .mui-btn--accent.mui-btn--flat[disabled]:hover,
 .mui-btn--accent.mui-btn--flat[disabled]:focus,
 .mui-btn--accent.mui-btn--flat[disabled]:active {
-  color: #856a91;
+  color: #f06a5e;
   background-color: transparent;
 }
 
@@ -2474,7 +2474,7 @@ h6 {
 .mui-select:focus > select {
   height: 33px;
   margin-bottom: -1px;
-  border-color: #4a90e2;
+  border-color: #0f73ed;
   border-width: 2px;
 }
 .mui-select > select {
@@ -2507,7 +2507,7 @@ h6 {
   outline: 0;
   height: 33px;
   margin-bottom: -1px;
-  border-color: #4a90e2;
+  border-color: #0f73ed;
   border-width: 2px;
 }
 .mui-select > select:disabled {
@@ -2540,7 +2540,7 @@ h6 {
 
 .mui-select:focus > label,
 .mui-select > select:focus ~ label {
-  color: #4a90e2;
+  color: #0f73ed;
 }
 
 .mui-select__menu {
@@ -2657,10 +2657,10 @@ h6 {
   text-decoration: none;
 }
 .mui-tabs__bar > li.mui--is-active {
-  border-bottom: 2px solid #e05f26;
+  border-bottom: 2px solid #0f73ed;
 }
 .mui-tabs__bar > li.mui--is-active > a {
-  color: #e05f26;
+  color: #0f73ed;
 }
 .mui-tabs__bar.mui-tabs__bar--justified {
   display: table;
@@ -2711,7 +2711,7 @@ h6 {
 }
 .mui-textfield > input:focus ~ label,
 .mui-textfield > textarea:focus ~ label {
-  color: #4a90e2;
+  color: #0f73ed;
 }
 
 .mui-textfield--float-label > label {
@@ -2784,7 +2784,7 @@ h6 {
 }
 .mui-textfield > input:focus,
 .mui-textfield > textarea:focus {
-  border-color: #4a90e2;
+  border-color: #0f73ed;
   border-width: 2px;
 }
 .mui-textfield > input:disabled,
@@ -2854,7 +2854,7 @@ h6 {
   > textarea:not(:focus).mui--is-invalid:required[value]:not([value='']):not(.mui--is-empty):not(.mui--is-not-empty),
 .mui-textfield
   > textarea:not(:focus).mui--is-invalid:required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty) {
-  border-color: #c04b61;
+  border-color: #fcdcda;
   border-width: 2px;
 }
 
@@ -2902,7 +2902,7 @@ h6 {
 .mui-textfield.mui-textfield--float-label
   > textarea:invalid:not(:focus):required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty)
   ~ label {
-  color: #c04b61;
+  color: #fcdcda;
 }
 .mui-textfield:not(.mui-textfield--float-label)
   > input:invalid:not(:focus):not(:required)
@@ -2922,18 +2922,18 @@ h6 {
 .mui-textfield:not(.mui-textfield--float-label)
   > textarea:invalid:not(:focus):required.mui--is-not-empty
   ~ label {
-  color: #c04b61;
+  color: #fcdcda;
 }
 
 .mui-textfield.mui-textfield--float-label
   > .mui--is-invalid.mui--is-not-empty:not(:focus)
   ~ label {
-  color: #c04b61;
+  color: #fcdcda;
 }
 .mui-textfield:not(.mui-textfield--float-label)
   > .mui--is-invalid:not(:focus)
   ~ label {
-  color: #c04b61;
+  color: #fcdcda;
 }
 
 /**
@@ -3026,11 +3026,11 @@ h6 {
 }
 
 .mui--text-accent-secondary {
-  color: rgba(133, 106, 145, 0.54);
+  color: rgba(240, 106, 94, 0.54);
 }
 
 .mui--text-accent-hint {
-  color: rgba(133, 106, 145, 0.38);
+  color: rgba(240, 106, 94, 0.38);
 }
 
 .mui--text-black {
@@ -3042,15 +3042,27 @@ h6 {
 }
 
 .mui--text-danger {
-  color: #c04b61;
+  color: #f04e45;
 }
 
 .mui--text-hyperlink {
-  color: #4a90e2;
+  color: #0f73ed;
+}
+
+.mui--text-success {
+  color: #21b685;
+}
+
+.mui--text-warning {
+  color: #f0a40c;
+}
+
+.mui--text-info {
+  color: #5da9e8;
 }
 
 .mui--bg-primary {
-  background-color: #e05f26;
+  background-color: #0f73ed;
 }
 
 .mui--bg-primary-dark {
@@ -3062,7 +3074,7 @@ h6 {
 }
 
 .mui--bg-accent {
-  background-color: #856a91;
+  background-color: #f06a5e;
 }
 
 .mui--bg-accent-dark {
@@ -3074,7 +3086,7 @@ h6 {
 }
 
 .mui--bg-danger {
-  background-color: #c04b61;
+  background-color: #fcdcda;
 }
 
 .mui-list--unstyled {
@@ -3463,11 +3475,11 @@ h6 {
 }
 
 .mui--bg-primary-light {
-  background-color: #eff2f7;
+  background-color: #f9fafc;
 }
 
 .mui--bg-accent {
-  background-color: #f9fafc;
+  background-color: #f9f9f9;
 }
 
 .mui--text-display3 {
@@ -3562,11 +3574,11 @@ h6 {
 }
 
 .mui--text-success {
-  color: #53b783;
+  color: #ddf5ed;
 }
 
 .mui--text-warning {
-  color: #f0a40c;
+  color: #fdf6ea;
 }
 
 .mui--text-uppercase {
@@ -3785,7 +3797,7 @@ h6 {
 .header__nav-links {
   font-size: 14px;
   line-height: 1;
-  color: #4d5763;
+  color: #656565;
   display: inline-block;
   text-decoration: none;
   text-align: center;
@@ -3799,7 +3811,7 @@ h6 {
 }
 
 .header__nav-links-active .header__nav-links__icon {
-  color: #e05f26;
+  color: #0f73ed;
 }
 
 @media only screen and (max-device-width: 1200px) and (orientation: landscape) {
@@ -3821,7 +3833,6 @@ h6 {
   }
 }
 .header__nav-links:hover {
-  color: #4d5763;
   text-decoration: none;
 }
 
@@ -4009,6 +4020,20 @@ li p + ol {
   vertical-align: middle;
 }
 
+.mui-btn--accent,
+.mui-btn--accent:hover,
+.mui-btn--accent:active,
+.mui-btn--accent:focus {
+  background: #ffffff;
+  color: #0f73ed;
+  border: 1px solid #0f73ed;
+  box-shadow: none;
+}
+
+.mui-btn--accent.mui-btn--flat {
+  border: none !important;
+}
+
 #root {
   clear: both;
   min-height: 100%;
@@ -4098,8 +4123,8 @@ li p + ol {
 .mui-form .mui-form__error {
   color: #ffffff;
   margin: 8px 0 0;
-  background: #c04b61;
-  border: 1px solid #c04b61;
+  background: #f04e45;
+  border: 1px solid rgba(240, 78, 69, 0.2);
   padding: 8px 16px;
   position: relative;
   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14);
@@ -4115,18 +4140,18 @@ li p + ol {
   content: '';
   position: absolute;
   border: 6px solid transparent;
-  border-bottom: 6px solid #c04b61;
+  border-bottom: 6px solid #f04e45;
   top: -13px;
   left: 20px;
 }
 .mui-form .has-error .mui-textfield > input,
 .mui-form .has-error .mui-textfield > textarea {
-  border-bottom: 1px solid #c04b61;
+  border-bottom: 1px solid #f04e45;
 }
 .mui-form .has-error .mui-textfield > label,
 .mui-form .has-error label,
 .mui-form .has-error .mui-form__helptext {
-  color: #c04b61;
+  color: #f04e45;
 }
 .mui-form .alert {
   margin-bottom: 16px;
@@ -4225,16 +4250,16 @@ li p + ol {
   position: absolute;
   top: 4px;
   left: 0;
-  color: #c04b61;
+  color: #f04e45;
 }
 .mui-textfield--password .progress .progress__bar--danger {
-  background-color: #c04b61;
+  background-color: #f04e45;
 }
 .mui-textfield--password .progress .progress__bar--success {
-  background-color: #53b783;
+  background-color: #21b685;
 }
 .mui-textfield--password .progress .progress__bar--success .progress__txt {
-  color: #53b783;
+  color: #21b685;
 }
 
 .chip {
@@ -4253,12 +4278,12 @@ li p + ol {
 }
 
 .chip--bg-accent {
-  background-color: #f9fafc;
+  background-color: #f9f9f9;
   color: #1f2d3d;
 }
 
 .chip--bg-light {
-  background-color: #eff2f7;
+  background-color: #f9fafc;
   color: #1f2d3d;
 }
 
@@ -4268,7 +4293,7 @@ li p + ol {
 }
 
 .chip--bg-danger {
-  background-color: #c04b61;
+  background-color: #fcdcda;
   color: #fff;
 }
 
@@ -4292,7 +4317,7 @@ li p + ol {
 }
 .card .card__header {
   padding: 16px;
-  background: #eff2f7;
+  background: #f9fafc;
 }
 .card .card__header__title {
   width: 80%;
@@ -4303,7 +4328,7 @@ li p + ol {
 }
 .card .card__header__title__tag {
   float: right;
-  color: #53b783;
+  color: #ddf5ed;
   text-align: right;
   width: 20%;
 }
@@ -4338,9 +4363,9 @@ li p + ol {
   padding: 16px;
   border: 1px solid transparent;
   border-radius: 2px;
-  background-color: rgba(74, 144, 226, 0.1);
-  border-color: rgba(74, 144, 226, 0.2);
-  color: #4a90e2;
+  background-color: #cfefff;
+  border-color: rgba(93, 169, 232, 0.2);
+  color: #5da9e8;
 }
 .alert .alert__heading {
   margin-top: 0;
@@ -4372,39 +4397,39 @@ li p + ol {
 }
 
 .alert--success {
-  background-color: rgba(83, 183, 131, 0.1);
-  border-color: rgba(83, 183, 131, 0.2);
-  color: #53b783;
+  background-color: #ddf5ed;
+  border-color: rgba(33, 182, 133, 0.2);
+  color: #21b685;
 }
 
 .alert--success .alert__hr {
-  border-top-color: #c9e2b3;
+  border-top-color: rgba(33, 182, 133, 0.1);
 }
 
 .alert--info .alert__hr {
-  border-top-color: #a6e1ec;
+  border-top-color: rgba(93, 169, 232, 0.1);
 }
 
 .alert--warning {
-  background-color: rgba(240, 164, 12, 0.1);
+  background-color: #fdf6ea;
   border-color: rgba(240, 164, 12, 0.2);
   color: #f0a40c;
 }
 
 .alert-warning .alert__hr {
-  border-top-color: #f7e1b5;
+  border-top-color: rgba(240, 164, 12, 0.1);
 }
 
 .alert--error,
 .alert--danger {
-  background-color: rgba(192, 75, 97, 0.1);
-  border-color: rgba(192, 75, 97, 0.2);
-  color: #c04b61;
+  background-color: #fcdcda;
+  border-color: rgba(240, 78, 69, 0.2);
+  color: #f04e45;
 }
 
 .alert--error .alert__hr,
 .alert--danger .alert__hr {
-  border-top-color: #e4b9c0;
+  border-top-color: rgba(240, 78, 69, 0.1);
 }
 
 @media (min-width: 768px) {
@@ -4509,8 +4534,8 @@ li p + ol {
 }
 .tab-container .tab-container__tab.active {
   opacity: 1;
-  border-bottom: 2px solid #4a90e2;
-  color: #4a90e2;
+  border-bottom: 2px solid #0f73ed;
+  color: #0f73ed;
 }
 .tab-container .tab-container__tab a {
   color: inherit;
diff --git a/baseframe/static/img/favicon.ico b/baseframe/static/img/favicon.ico
index 30cb620b..b8d949fe 100644
Binary files a/baseframe/static/img/favicon.ico and b/baseframe/static/img/favicon.ico differ
diff --git a/baseframe/static/img/logo-large.png b/baseframe/static/img/logo-large.png
index aa54406f..36f163f1 100644
Binary files a/baseframe/static/img/logo-large.png and b/baseframe/static/img/logo-large.png differ
diff --git a/baseframe/static/img/logo.png b/baseframe/static/img/logo.png
index 0a526966..4f081858 100644
Binary files a/baseframe/static/img/logo.png and b/baseframe/static/img/logo.png differ
diff --git a/baseframe/static/img/logo@2x.png b/baseframe/static/img/logo@2x.png
index b53399b1..015f5e38 100644
Binary files a/baseframe/static/img/logo@2x.png and b/baseframe/static/img/logo@2x.png differ
diff --git a/baseframe/static/js/baseframe-material.js b/baseframe/static/js/baseframe-material.js
index 4553faaa..9aba6b9d 100644
--- a/baseframe/static/js/baseframe-material.js
+++ b/baseframe/static/js/baseframe-material.js
@@ -321,6 +321,7 @@ window.Baseframe.Forms = {
       .find('button[type="submit"]')
       .click(function (event) {
         event.preventDefault();
+        console.log('handleFormSubmit');
         $.ajax({
           url: url,
           type: 'POST',
diff --git a/baseframe/static/sass/baseframe-material/_alert.scss b/baseframe/static/sass/baseframe-material/_alert.scss
index 5a617be1..701c6ff2 100644
--- a/baseframe/static/sass/baseframe-material/_alert.scss
+++ b/baseframe/static/sass/baseframe-material/_alert.scss
@@ -2,9 +2,9 @@
   padding: $mui-grid-padding;
   border: 1px solid transparent;
   border-radius: $mui-border-radius-default;
-  background-color: transparentize($mui-info-color, 0.9);
-  border-color: transparentize($mui-info-color, 0.8);
-  color: $mui-info-color;
+  background-color: $mui-info-color;
+  border-color: transparentize($mui-text-info, 0.8);
+  color: $mui-text-info;
 
   .alert__heading {
     margin-top: 0;
@@ -42,39 +42,39 @@
 }
 
 .alert--success {
-  background-color: transparentize($mui-success-color, 0.9);
-  border-color: transparentize($mui-success-color, 0.8);
-  color: $mui-success-color;
+  background-color: $mui-success-color;
+  border-color: transparentize($mui-text-success, 0.8);
+  color: $mui-text-success;
 }
 
 .alert--success .alert__hr {
-  border-top-color: #c9e2b3;
+  border-top-color: transparentize($mui-text-success, 0.9);
 }
 
 .alert--info .alert__hr {
-  border-top-color: #a6e1ec;
+  border-top-color: transparentize($mui-text-info, 0.9);
 }
 
 .alert--warning {
-  background-color: transparentize($mui-warning-color, 0.9);
-  border-color: transparentize($mui-warning-color, 0.8);
-  color: $mui-warning-color;
+  background-color: $mui-warning-color;
+  border-color: transparentize($mui-text-warning, 0.8);
+  color: $mui-text-warning;
 }
 
 .alert-warning .alert__hr {
-  border-top-color: #f7e1b5;
+  border-top-color: transparentize($mui-text-warning, 0.9);
 }
 
 .alert--error,
 .alert--danger {
-  background-color: transparentize($mui-danger-color, 0.9);
-  border-color: transparentize($mui-danger-color, 0.8);
-  color: $mui-danger-color;
+  background-color: $mui-danger-color;
+  border-color: transparentize($mui-text-danger, 0.8);
+  color: $mui-text-danger;
 }
 
 .alert--error .alert__hr,
 .alert--danger .alert__hr {
-  border-top-color: #e4b9c0;
+  border-top-color: transparentize($mui-text-danger, 0.9);
 }
 
 @media (min-width: 768px) {
diff --git a/baseframe/static/sass/baseframe-material/_form.scss b/baseframe/static/sass/baseframe-material/_form.scss
index bafa335c..8bb702ff 100644
--- a/baseframe/static/sass/baseframe-material/_form.scss
+++ b/baseframe/static/sass/baseframe-material/_form.scss
@@ -70,8 +70,8 @@
   .mui-form__error {
     color: $mui-text-white;
     margin: $mui-grid-padding/2 0 0;
-    background: $mui-danger-color;
-    border: 1px solid $mui-text-danger;
+    background: $mui-text-danger;
+    border: 1px solid transparentize($mui-text-danger, 0.8);
     padding: $mui-grid-padding/2 $mui-grid-padding;
     position: relative;
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14);
@@ -204,15 +204,15 @@
       position: absolute;
       top: 4px;
       left: 0;
-      color: $mui-danger-color;
+      color: $mui-text-danger;
     }
     .progress__bar--danger {
-      background-color: $mui-danger-color;
+      background-color: $mui-text-danger;
     }
     .progress__bar--success {
-      background-color: $mui-success-color;
+      background-color: $mui-text-success;
       .progress__txt {
-        color: $mui-success-color;
+        color: $mui-text-success;
       }
     }
   }
diff --git a/baseframe/static/sass/baseframe-material/_layout.scss b/baseframe/static/sass/baseframe-material/_layout.scss
index 29abcd2b..e1425ecd 100644
--- a/baseframe/static/sass/baseframe-material/_layout.scss
+++ b/baseframe/static/sass/baseframe-material/_layout.scss
@@ -134,3 +134,17 @@ li p + ol {
   display: inline-block;
   vertical-align: middle;
 }
+
+.mui-btn--accent,
+.mui-btn--accent:hover,
+.mui-btn--accent:active,
+.mui-btn--accent:focus {
+  background: $mui-bg-color-primary;
+  color: $mui-primary-color;
+  border: 1px solid $mui-primary-color;
+  box-shadow: none;
+}
+
+.mui-btn--accent.mui-btn--flat {
+  border: none !important;
+}
diff --git a/baseframe/static/sass/baseframe-material/_menu.scss b/baseframe/static/sass/baseframe-material/_menu.scss
index 14ce3654..9ea30d4c 100644
--- a/baseframe/static/sass/baseframe-material/_menu.scss
+++ b/baseframe/static/sass/baseframe-material/_menu.scss
@@ -136,7 +136,7 @@
 .header__nav-links {
   font-size: 14px;
   line-height: 1;
-  color: $mui-text-light;
+  color: $mui-neutral-color;
   display: inline-block;
   text-decoration: none;
   text-align: center;
@@ -152,7 +152,7 @@
 }
 
 .header__nav-links-active .header__nav-links__icon {
-  color: #e05f26;
+  color: $mui-primary-color;
 }
 
 @media only screen and (max-device-width: 1200px) and (orientation: landscape) {
@@ -180,7 +180,6 @@
 }
 
 .header__nav-links:hover {
-  color: $mui-text-light;
   text-decoration: none;
 }
 
diff --git a/baseframe/static/sass/mui/_buttons.scss b/baseframe/static/sass/mui/_buttons.scss
index 84471a47..82ac0258 100644
--- a/baseframe/static/sass/mui/_buttons.scss
+++ b/baseframe/static/sass/mui/_buttons.scss
@@ -4,43 +4,43 @@
 
 @mixin x-btn-box-shadow-raised() {
   box-shadow: 0 0px 2px rgba(mui-color('black'), 0.12),
-              0 2px 2px rgba(mui-color('black'), 0.20);
-  
+    0 2px 2px rgba(mui-color('black'), 0.2);
+
   // IE10+
   @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
-                -1px 0px 2px rgba(mui-color('black'), 0.12),
-                0 0px 2px rgba(mui-color('black'), 0.12),
-                0 2px 2px rgba(mui-color('black'), 0.20);
+      -1px 0px 2px rgba(mui-color('black'), 0.12),
+      0 0px 2px rgba(mui-color('black'), 0.12),
+      0 2px 2px rgba(mui-color('black'), 0.2);
   }
 
   // Edge
-  @supports (-ms-ime-align:auto) {
+  @supports (-ms-ime-align: auto) {
     box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
-                -1px 0px 2px rgba(mui-color('black'), 0.12),
-                0 0px 2px rgba(mui-color('black'), 0.12),
-                0 2px 2px rgba(mui-color('black'), 0.20);
+      -1px 0px 2px rgba(mui-color('black'), 0.12),
+      0 0px 2px rgba(mui-color('black'), 0.12),
+      0 2px 2px rgba(mui-color('black'), 0.2);
   }
 }
 
 @mixin x-btn-box-shadow-active() {
   box-shadow: 0 0px 4px rgba(mui-color('black'), 0.12),
-              1px 3px 4px rgba(mui-color('black'), 0.20);
-  
+    1px 3px 4px rgba(mui-color('black'), 0.2);
+
   // IE10+
   @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
-                -1px 0px 2px rgba(mui-color('black'), 0.12),
-                0 0px 4px rgba(mui-color('black'), 0.12),
-                1px 3px 4px rgba(mui-color('black'), 0.20);
+      -1px 0px 2px rgba(mui-color('black'), 0.12),
+      0 0px 4px rgba(mui-color('black'), 0.12),
+      1px 3px 4px rgba(mui-color('black'), 0.2);
   }
 
   // Edge
-  @supports (-ms-ime-align:auto) {
+  @supports (-ms-ime-align: auto) {
     box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
-                -1px 0px 2px rgba(mui-color('black'), 0.12),
-                0 0px 4px rgba(mui-color('black'), 0.12),
-                1px 3px 4px rgba(mui-color('black'), 0.20);
+      -1px 0px 2px rgba(mui-color('black'), 0.12),
+      0 0px 4px rgba(mui-color('black'), 0.12),
+      1px 3px 4px rgba(mui-color('black'), 0.2);
   }
 }
 
@@ -49,30 +49,32 @@
 // ============================================================================
 
 .mui-btn {
-  @include mui-text("button");
+  @include mui-text('button');
 
   @include button-variant(
     $mui-btn-default-font-color,
-    $mui-btn-default-bg-color);
+    $mui-btn-default-bg-color
+  );
 
   @include button-flat-variant(
     $mui-btn-default-font-color,
-    $mui-btn-flat-bg-color-hover);
+    $mui-btn-flat-bg-color-hover
+  );
 
   transition: all 0.2s ease-in-out;
-  
+
   // Layout
   display: inline-block;
   height: $mui-btn-height;
   padding: 0 $mui-btn-padding-horizontal;
   margin: $mui-btn-margin-vertical 0;
-  
+
   // Look and feel
   border: none;
   border-radius: $mui-btn-border-radius;
   cursor: pointer;
   touch-action: manipulation;
-  background-image: none;  // reset unusual Firefox-on-Android
+  background-image: none; // reset unusual Firefox-on-Android
 
   // Typography
   text-align: center;
@@ -87,7 +89,7 @@
   // For ripples
   position: relative;
   overflow: hidden;
-  
+
   &:hover,
   &:focus,
   &:active {
@@ -100,7 +102,7 @@
   &:focus {
     @include x-btn-box-shadow-raised();
   }
-  
+
   &:active:hover {
     @include x-btn-box-shadow-active();
   }
@@ -109,7 +111,7 @@
   &.mui--is-disabled {
     cursor: $mui-cursor-disabled;
     pointer-events: none;
-    opacity: 0.60;
+    opacity: 0.6;
     box-shadow: none;
   }
 }
@@ -118,13 +120,10 @@
   margin-left: $mui-btn-spacing-horizontal;
 }
 
-
-
 // ============================================================================
 // BUTTON-TYPES
 // ============================================================================
 
-
 // ----------------------------------------------------------------------------
 // FLAT
 // ----------------------------------------------------------------------------
@@ -141,7 +140,6 @@
   }
 }
 
-
 // ----------------------------------------------------------------------------
 // RAISED
 // ----------------------------------------------------------------------------
@@ -154,7 +152,6 @@
   }
 }
 
-
 // ----------------------------------------------------------------------------
 // FLOATING-ACTION-BUTTON-(FAB)
 // ----------------------------------------------------------------------------
@@ -172,8 +169,6 @@
   z-index: 1;
 }
 
-
-
 // ============================================================================
 // BUTTON-STYLES
 // ============================================================================
@@ -181,41 +176,38 @@
 .mui-btn--primary {
   @include button-variant(
     $mui-btn-primary-font-color,
-    $mui-btn-primary-bg-color);
+    $mui-btn-primary-bg-color
+  );
   @include button-flat-variant(
     $mui-btn-primary-bg-color,
-    $mui-btn-flat-bg-color-hover);
+    $mui-btn-flat-bg-color-hover
+  );
 }
 
 .mui-btn--dark {
-  @include button-variant(
-    $mui-btn-dark-font-color,
-    $mui-btn-dark-bg-color);
+  @include button-variant($mui-btn-dark-font-color, $mui-btn-dark-bg-color);
   @include button-flat-variant(
     $mui-btn-dark-bg-color,
-    $mui-btn-flat-bg-color-hover);
+    $mui-btn-flat-bg-color-hover
+  );
 }
 
 .mui-btn--danger {
-  @include button-variant(
-    $mui-btn-danger-font-color,
-    $mui-btn-danger-bg-color);
+  @include button-variant($mui-btn-danger-font-color, $mui-btn-danger-bg-color);
   @include button-flat-variant(
     $mui-btn-danger-bg-color,
-    $mui-btn-flat-bg-color-hover);
+    $mui-btn-flat-bg-color-hover
+  );
 }
 
 .mui-btn--accent {
-  @include button-variant(
-    $mui-btn-accent-font-color,
-    $mui-btn-accent-bg-color);
+  @include button-variant($mui-btn-accent-font-color, $mui-btn-accent-bg-color);
   @include button-flat-variant(
     $mui-btn-accent-bg-color,
-    $mui-btn-flat-bg-color-hover);
+    $mui-btn-flat-bg-color-hover
+  );
 }
 
-
-
 // ============================================================================
 // BUTTON-SIZES
 // ============================================================================
diff --git a/baseframe/static/sass/mui/_custom.scss b/baseframe/static/sass/mui/_custom.scss
index e6ff68f7..f949a674 100644
--- a/baseframe/static/sass/mui/_custom.scss
+++ b/baseframe/static/sass/mui/_custom.scss
@@ -2,14 +2,13 @@
 // COLORS
 // ============================================================================
 
-$mui-primary-color: #e05f26 !default;
-
-$mui-accent-color: #856a91 !default;
-
-$mui-danger-color: #c04b61 !default;
-$mui-success-color: #53b783 !default;
-$mui-warning-color: #f0a40c !default;
-$mui-info-color: #4a90e2 !default;
+$mui-primary-color: #0f73ed !default;
+$mui-accent-color: #f06a5e !default;
+$mui-danger-color: #fcdcda !default;
+$mui-success-color: #ddf5ed !default;
+$mui-warning-color: #fdf6ea !default;
+$mui-info-color: #cfefff !default;
+$mui-neutral-color: #656565 !default;
 
 // ============================================================================
 // TEXT COLORS
@@ -18,8 +17,12 @@ $mui-info-color: #4a90e2 !default;
 $mui-text-dark: #1f2d3d !default;
 $mui-text-accent: #c0ccda !default;
 $mui-text-light: #4d5763 !default;
-$mui-text-danger: $mui-danger-color !default;
-$mui-text-hyperlink: #4a90e2 !default;
+$mui-text-danger: #f04e45 !default;
+$mui-text-hyperlink: #0f73ed !default;
+$mui-text-success: #21b685 !default;
+$mui-text-warning: #f0a40c !default;
+$mui-text-info: #5da9e8 !default;
+$mui-text-white: #ffffff !default;
 $mui-text-white: #ffffff !default;
 
 // ============================================================================
@@ -27,10 +30,11 @@ $mui-text-white: #ffffff !default;
 // ============================================================================
 
 $mui-bg-color-primary: #ffffff !default;
-$mui-bg-color-accent: #f9fafc !default;
-$mui-bg-color-light: #eff2f7 !default;
+$mui-bg-color-accent: #f9f9f9 !default;
+$mui-bg-color-light: #f9fafc !default;
 $mui-bg-color-dark: #1f2d3d !default;
 $mui-body-bg-color: $mui-bg-color-accent !default;
+$mui-btn-danger-bg-color: $mui-text-danger;
 
 $mui-base-font-color: $mui-text-dark !default;
 $mui-base-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
diff --git a/baseframe/static/sass/mui/_helpers.scss b/baseframe/static/sass/mui/_helpers.scss
index bf043010..e1859585 100644
--- a/baseframe/static/sass/mui/_helpers.scss
+++ b/baseframe/static/sass/mui/_helpers.scss
@@ -10,9 +10,6 @@
   transition: none !important;
 }
 
-
-
-
 // ============================================================================
 // USER SELECT
 // ============================================================================
@@ -20,9 +17,6 @@
   user-select: none;
 }
 
-
-
-
 // ============================================================================
 // CARET
 // ============================================================================
@@ -33,71 +27,127 @@
   height: 0;
   margin-left: 2px;
   vertical-align: middle;
-  border-top:   $mui-caret-width solid;
+  border-top: $mui-caret-width solid;
   border-right: $mui-caret-width solid transparent;
-  border-left:  $mui-caret-width solid transparent;
+  border-left: $mui-caret-width solid transparent;
 }
 
-
-
-
 // ============================================================================
 // ALIGNMENT HELPERS
 // ============================================================================
 
-.mui--text-left           { text-align: left !important; }
-.mui--text-right          { text-align: right !important; }
-.mui--text-center         { text-align: center !important; }
-.mui--text-justify        { text-align: justify !important; }
-.mui--text-nowrap         { white-space: nowrap !important; }
-
-.mui--align-baseline      { vertical-align: baseline !important; }
-.mui--align-top           { vertical-align: top !important; }
-.mui--align-middle        { vertical-align: middle !important; }
-.mui--align-bottom        { vertical-align: bottom !important; }
-
-
+.mui--text-left {
+  text-align: left !important;
+}
+.mui--text-right {
+  text-align: right !important;
+}
+.mui--text-center {
+  text-align: center !important;
+}
+.mui--text-justify {
+  text-align: justify !important;
+}
+.mui--text-nowrap {
+  white-space: nowrap !important;
+}
 
+.mui--align-baseline {
+  vertical-align: baseline !important;
+}
+.mui--align-top {
+  vertical-align: top !important;
+}
+.mui--align-middle {
+  vertical-align: middle !important;
+}
+.mui--align-bottom {
+  vertical-align: bottom !important;
+}
 
 // ============================================================================
 // TEXT COLOR HELPERS
 // ============================================================================
 
-.mui--text-dark             { color: $mui-text-dark; }
-.mui--text-dark-secondary   { color: $mui-text-dark-secondary; }
-.mui--text-dark-hint        { color: $mui-text-dark-hint; }
-
-.mui--text-light            { color: $mui-text-light; }
-.mui--text-light-secondary  { color: $mui-text-light-secondary; }
-.mui--text-light-hint       { color: $mui-text-light-hint; }
-
-.mui--text-accent           { color: $mui-text-accent; }
-.mui--text-accent-secondary { color: $mui-text-accent-secondary; }
-.mui--text-accent-hint      { color: $mui-text-accent-hint; }
-
-.mui--text-black            { color: mui-color('black'); }
-.mui--text-white            { color: mui-color('white'); }
-.mui--text-danger           { color: $mui-text-danger; }
-.mui--text-hyperlink        { color: $mui-text-hyperlink; }
+.mui--text-dark {
+  color: $mui-text-dark;
+}
+.mui--text-dark-secondary {
+  color: $mui-text-dark-secondary;
+}
+.mui--text-dark-hint {
+  color: $mui-text-dark-hint;
+}
 
+.mui--text-light {
+  color: $mui-text-light;
+}
+.mui--text-light-secondary {
+  color: $mui-text-light-secondary;
+}
+.mui--text-light-hint {
+  color: $mui-text-light-hint;
+}
 
+.mui--text-accent {
+  color: $mui-text-accent;
+}
+.mui--text-accent-secondary {
+  color: $mui-text-accent-secondary;
+}
+.mui--text-accent-hint {
+  color: $mui-text-accent-hint;
+}
 
+.mui--text-black {
+  color: mui-color('black');
+}
+.mui--text-white {
+  color: mui-color('white');
+}
+.mui--text-danger {
+  color: $mui-text-danger;
+}
+.mui--text-hyperlink {
+  color: $mui-text-hyperlink;
+}
+.mui--text-success {
+  color: $mui-text-success;
+}
+.mui--text-warning {
+  color: $mui-text-warning;
+}
+.mui--text-info {
+  color: $mui-text-info;
+}
 
 // ============================================================================
 // BACKGROUND COLORS
 // ============================================================================
 
-.mui--bg-primary       { background-color: $mui-primary-color; }
-.mui--bg-primary-dark  { background-color: $mui-primary-color-dark; }
-.mui--bg-primary-light { background-color: $mui-primary-color-light; }
-
-.mui--bg-accent        { background-color: $mui-accent-color; }
-.mui--bg-accent-dark   { background-color: $mui-accent-color-dark; }
-.mui--bg-accent-light  { background-color: $mui-accent-color-light; }
-
-.mui--bg-danger        { background-color: $mui-danger-color; }
+.mui--bg-primary {
+  background-color: $mui-primary-color;
+}
+.mui--bg-primary-dark {
+  background-color: $mui-primary-color-dark;
+}
+.mui--bg-primary-light {
+  background-color: $mui-primary-color-light;
+}
 
+.mui--bg-accent {
+  background-color: $mui-accent-color;
+}
+.mui--bg-accent-dark {
+  background-color: $mui-accent-color-dark;
+}
+.mui--bg-accent-light {
+  background-color: $mui-accent-color-light;
+}
 
+.mui--bg-danger {
+  background-color: $mui-danger-color;
+}
 
 // ============================================================================
 // LISTS
@@ -126,41 +176,35 @@
   }
 }
 
-
-
-
 // ============================================================================
 // DEPTH HELPERS
 // ============================================================================
 
 .mui--z1 {
   box-shadow: 0 1px 3px rgba(mui-color('grey'), 0.12),
-              0 1px 2px rgba(mui-color('grey'), 0.24);
+    0 1px 2px rgba(mui-color('grey'), 0.24);
 }
 
 .mui--z2 {
   box-shadow: 0 3px 6px rgba(mui-color('black'), 0.16),
-              0 3px 6px rgba(mui-color('black'), 0.23);
+    0 3px 6px rgba(mui-color('black'), 0.23);
 }
 
 .mui--z3 {
   box-shadow: 0 10px 20px rgba(mui-color('black'), 0.19),
-              0 6px 6px rgba(mui-color('black'), 0.23);
+    0 6px 6px rgba(mui-color('black'), 0.23);
 }
 
 .mui--z4 {
   box-shadow: 0 14px 28px rgba(mui-color('black'), 0.25),
-              0 10px 10px rgba(mui-color('black'), 0.22);
+    0 10px 10px rgba(mui-color('black'), 0.22);
 }
 
 .mui--z5 {
-  box-shadow: 0 19px 38px rgba(mui-color('black'), 0.30),
-              0 15px 12px rgba(mui-color('black'), 0.22);
+  box-shadow: 0 19px 38px rgba(mui-color('black'), 0.3),
+    0 15px 12px rgba(mui-color('black'), 0.22);
 }
 
-
-
-
 // ============================================================================
 // FLOAT HELPERS
 // ============================================================================
@@ -177,9 +221,6 @@
   float: left !important;
 }
 
-
-
-
 // ============================================================================
 // TOGGLE HELPERS
 // ============================================================================
@@ -208,8 +249,6 @@
   overflow-y: hidden !important;
 }
 
-
-
 // ============================================================================
 // RESPONSIVE UTILITIES
 // ============================================================================
@@ -219,10 +258,16 @@
     display: block !important;
   }
 
-  table#{$parent}  { display: table; }
-  tr#{$parent}     { display: table-row !important; }
+  table#{$parent} {
+    display: table;
+  }
+  tr#{$parent} {
+    display: table-row !important;
+  }
   th#{$parent},
-  td#{$parent}     { display: table-cell !important; }
+  td#{$parent} {
+    display: table-cell !important;
+  }
 }
 
 // [converter] $parent hack
@@ -250,78 +295,96 @@
   display: none !important;
 }
 
-
 @media (max-width: $mui-screen-xs-max) {
   @include x-responsive-visibility('.mui-visible-xs');
 
-  .mui--visible-xs-block        { display: block !important; }
-  .mui--visible-xs-inline       { display: inline !important; }
-  .mui--visible-xs-inline-block { display: inline-block !important; }
+  .mui--visible-xs-block {
+    display: block !important;
+  }
+  .mui--visible-xs-inline {
+    display: inline !important;
+  }
+  .mui--visible-xs-inline-block {
+    display: inline-block !important;
+  }
 }
 
-
 @media (min-width: $mui-screen-sm-min) and (max-width: $mui-screen-sm-max) {
   @include x-responsive-visibility('.mui-visible-sm');
 
-  .mui--visible-sm-block        { display: block !important; }
-  .mui--visible-sm-inline       { display: inline !important; }
-  .mui--visible-sm-inline-block { display: inline-block !important; }
+  .mui--visible-sm-block {
+    display: block !important;
+  }
+  .mui--visible-sm-inline {
+    display: inline !important;
+  }
+  .mui--visible-sm-inline-block {
+    display: inline-block !important;
+  }
 }
 
-
 @media (min-width: $mui-screen-md-min) and (max-width: $mui-screen-md-max) {
   @include x-responsive-visibility('.mui-visible-md');
 
-  .mui--visible-md-block        { display: block !important; }
-  .mui--visible-md-inline       { display: inline !important; }
-  .mui--visible-md-inline-block { display: inline-block !important; }
+  .mui--visible-md-block {
+    display: block !important;
+  }
+  .mui--visible-md-inline {
+    display: inline !important;
+  }
+  .mui--visible-md-inline-block {
+    display: inline-block !important;
+  }
 }
 
-
 @media (min-width: $mui-screen-lg-min) and (max-width: $mui-screen-lg-max) {
   @include x-responsive-visibility('.mui-visible-lg');
 
-  .mui--visible-lg-block        { display: block !important; }
-  .mui--visible-lg-inline       { display: inline !important; }
-  .mui--visible-lg-inline-block { display: inline-block !important; }
+  .mui--visible-lg-block {
+    display: block !important;
+  }
+  .mui--visible-lg-inline {
+    display: inline !important;
+  }
+  .mui--visible-lg-inline-block {
+    display: inline-block !important;
+  }
 }
 
-
 @media (min-width: $mui-screen-xl-min) {
   @include x-responsive-visibility('.mui-visible-xl');
 
-  .mui--visible-xl-block        { display: block !important; }
-  .mui--visible-xl-inline       { display: inline !important; }
-  .mui--visible-xl-inline-block { display: inline-block !important; }
+  .mui--visible-xl-block {
+    display: block !important;
+  }
+  .mui--visible-xl-inline {
+    display: inline !important;
+  }
+  .mui--visible-xl-inline-block {
+    display: inline-block !important;
+  }
 }
 
-
 @media (max-width: $mui-screen-xs-max) {
   @include x-responsive-invisibility('.mui--hidden-xs');
 }
 
-
 @media (min-width: $mui-screen-sm-min) and (max-width: $mui-screen-sm-max) {
   @include x-responsive-invisibility('.mui--hidden-sm');
 }
 
-
 @media (min-width: $mui-screen-md-min) and (max-width: $mui-screen-md-max) {
   @include x-responsive-invisibility('.mui--hidden-md');
 }
 
-
 @media (min-width: $mui-screen-lg-min) and (max-width: $mui-screen-lg-max) {
   @include x-responsive-invisibility('.mui--hidden-lg');
 }
 
-
 @media (min-width: $mui-screen-xl-min) {
   @include x-responsive-invisibility('.mui--hidden-xl');
 }
 
-
-
 // ============================================================================
 // SCROLL LOCK
 // ============================================================================