3 files changed, 36 insertions, 29 deletions
diff --git a/ui/app/css/itcss/settings/index.scss b/ui/app/css/itcss/settings/index.scss
index 446546d0c..58a7ca7b7 100644
--- a/ui/app/css/itcss/settings/index.scss
+++ b/ui/app/css/itcss/settings/index.scss
@@ -1,2 +1,3 @@
 @import './variables.scss';
+
 @import './typography.scss';
diff --git a/ui/app/css/itcss/settings/typography.scss b/ui/app/css/itcss/settings/typography.scss
index 2afaa26e1..e18a1979d 100644
--- a/ui/app/css/itcss/settings/typography.scss
+++ b/ui/app/css/itcss/settings/typography.scss
@@ -1,42 +1,43 @@
-@import url(https://fonts.googleapis.com/css?family=Roboto:300,500);
-@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);
+@import url('https://fonts.googleapis.com/css?family=Roboto:300,500');
+
+@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css');
 
 @font-face {
   font-family: 'Montserrat Regular';
-    src: url('/fonts/Montserrat/Montserrat-Regular.woff') format('woff');
-    src: url('/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
-  font-weight: normal;
+  src: url('/fonts/Montserrat/Montserrat-Regular.woff') format('woff');
+  src: url('/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
+  font-weight: 400;
   font-style: normal;
   font-size: 'small';
 }
 
 @font-face {
   font-family: 'Montserrat Bold';
-    src: url('/fonts/Montserrat/Montserrat-Bold.woff') format('woff');
-    src: url('/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
-  font-weight: normal;
+  src: url('/fonts/Montserrat/Montserrat-Bold.woff') format('woff');
+  src: url('/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
+  font-weight: 400;
   font-style: normal;
 }
 
 @font-face {
   font-family: 'Montserrat Light';
-    src: url('/fonts/Montserrat/Montserrat-Light.woff') format('woff');
-    src: url('/fonts/Montserrat/Montserrat-Light.ttf') format('truetype');
-  font-weight: normal;
+  src: url('/fonts/Montserrat/Montserrat-Light.woff') format('woff');
+  src: url('/fonts/Montserrat/Montserrat-Light.ttf') format('truetype');
+  font-weight: 400;
   font-style: normal;
 }
 
 @font-face {
   font-family: 'Montserrat UltraLight';
-    src: url('/fonts/Montserrat/Montserrat-UltraLight.woff') format('woff');
-    src: url('/fonts/Montserrat/Montserrat-UltraLight.ttf') format('truetype');
-  font-weight: normal;
+  src: url('/fonts/Montserrat/Montserrat-UltraLight.woff') format('woff');
+  src: url('/fonts/Montserrat/Montserrat-UltraLight.ttf') format('truetype');
+  font-weight: 400;
   font-style: normal;
 }
 
 @font-face {
   font-family: 'DIN OT';
-    src: url('/fonts/DIN_OT/DINOT-2.otf') format('opentype');
-  font-weight: normal;
+  src: url('/fonts/DIN_OT/DINOT-2.otf') format('opentype');
+  font-weight: 400;
   font-style: normal;
 }
diff --git a/ui/app/css/itcss/settings/variables.scss b/ui/app/css/itcss/settings/variables.scss
index f47b7c889..829c3d591 100644
--- a/ui/app/css/itcss/settings/variables.scss
+++ b/ui/app/css/itcss/settings/variables.scss
@@ -2,23 +2,28 @@
   Variables
  */
 
-
+// Base Colors
+$white: #fff;
+$black: #000;
+$orange: #ffa500;
+$red: #f00;
 
 /*
   Colors
  */
-$white-linen: #FAF6F0; // formerly 'faint orange (textfield shades)'
-$rajah: #F5C26D; // formerly 'light orange (button shades)'
-$buttercup: #F5A623; // formerly 'dark orange (text)'
-$tundora: #4A4A4A; // formerly 'borders/font/any gray'
-$gallery: #EFEFEF;
-$alabaster: #F7F7F7;
-$shark: #22232C;
-$wild-sand: #F6F6F6;
-$white: #FFFFFF;
-$dusty-gray: #9B9B9B;
-$alto: #DEDEDE;
-$alabaster: #FAFAFA;
+$white-linen: #faf6f0; // formerly 'faint orange (textfield shades)'
+$rajah: #f5c26d; // formerly 'light orange (button shades)'
+$buttercup: #f5a623; // formerly 'dark orange (text)'
+$tundora: #4a4a4a; // formerly 'borders/font/any gray'
+$gallery: #efefef;
+$alabaster: #f7f7f7;
+$shark: #22232c;
+$wild-sand: #f6f6f6;
+$white: #fff;
+$dusty-gray: #9b9b9b;
+$alto: #dedede;
+$alabaster: #fafafa;
+$silver-chalice: #aeaeae;
 
 /*
   Z-Indicies