4 files changed, 38 insertions, 8 deletions
diff --git a/ui/app/css/itcss/components/menu.scss b/ui/app/css/itcss/components/menu.scss
index 6409ad545..7d71ea799 100644
--- a/ui/app/css/itcss/components/menu.scss
+++ b/ui/app/css/itcss/components/menu.scss
@@ -8,7 +8,7 @@
   &__item {
     padding: 18px;
     display: flex;
-    flex-flow: row nowrap;
+    flex-flow: row wrap;
     align-items: center;
     position: relative;
     z-index: 201;
@@ -39,6 +39,11 @@
       font-size: 16px;
       line-height: 21px;
     }
+
+    &__subtext {
+      font-size: 12px;
+      padding: 5px 0px 0px 30px;
+    }
   }
 
   &__divider {
diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss
index da90b7910..4275ffe92 100644
--- a/ui/app/css/itcss/components/network.scss
+++ b/ui/app/css/itcss/components/network.scss
@@ -8,9 +8,9 @@
 }
 
 .network-component.pointer {
-  border: 2px solid $silver;
+  border: 2px solid $Grey-200;
   border-radius: 82px;
-  padding: 7px 3px;
+  padding: 6px 3px;
   flex: 0 0 auto;
   display: flex;
 
@@ -47,11 +47,15 @@
   align-items: center;
   font-size: .6em;
 
-  .fa-caret-down {
-    line-height: 15px;
-    font-size: 12px;
-    padding: 0 4px;
-    flex: 0 0 auto;
+  &__down-arrow {
+    height: 8px;
+    width: 12px;
+    display: block;
+    background-image: url(/images/icons/caret-down.svg);
+    background-repeat: no-repeat;
+    background-size: contain;
+    background-position: center;
+    margin: 0 8px;
   }
 
   .fa-question-circle {
@@ -65,12 +69,14 @@
   padding: 0 4px;
   font-family: Roboto;
   font-size: 12px;
+  line-height: 14px;
   flex: 1 1 auto;
   color: $tundora;
   font-weight: 500;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
+  height: 16px;
 }
 
 .dropdown-menu-item .fa.delete {
diff --git a/ui/app/css/itcss/components/new-account.scss b/ui/app/css/itcss/components/new-account.scss
index 7bfa2d443..b3aae8eec 100644
--- a/ui/app/css/itcss/components/new-account.scss
+++ b/ui/app/css/itcss/components/new-account.scss
@@ -143,6 +143,7 @@
     flex-flow: column;
     align-items: center;
     margin-top: 29px;
+    width: 100%;
   }
 
   &__buttons {
diff --git a/ui/app/css/itcss/settings/variables.scss b/ui/app/css/itcss/settings/variables.scss
index f7003b1f4..c02be0d98 100644
--- a/ui/app/css/itcss/settings/variables.scss
+++ b/ui/app/css/itcss/settings/variables.scss
@@ -99,7 +99,11 @@ $Blue-500: #037DD6;
 $Blue-600: #0260a4;
 
 $Grey-000: #f2f3f4;
+$Grey-100: #D6D9DC;
+$Grey-200: #bbc0c5;
+$Grey-400: #848c96;
 $Grey-500: #6A737D;
+$Grey-800: #24272a;
 
 $Red-000: #fcf2f3;
 $Red-500: #D73A49;
@@ -109,3 +113,17 @@ $Orange-000: #fef5ef;
 $Orange-500: #F66A0A;
 
 
+/*
+  Spacing Variables
+*/
+$no-spacing: 0px;
+$xxs-spacing: 4px;
+$xs-spacing: 8px;
+$s-spacing: 16px;
+$base-spacing: 24px;
+$medium-spacing: 32px;
+$large-spacing: 40px;
+$xlarge-spacing: 48px;
+$xxlarge-spacing: 64px;
+
+