Body width container in first time flow is consistent with app bar.

2 files changed, 30 insertions, 1 deletions

diff --git a/mascara/src/app/first-time/index.css b/mascara/src/app/first-time/index.css
index 4314efbe6..4f2400222 100644
--- a/mascara/src/app/first-time/index.css
+++ b/mascara/src/app/first-time/index.css
@@ -4,6 +4,8 @@
   width: 100vw;
   background-color: #FFF;
   overflow: auto;
+  display: flex;
+  justify-content: center;
 }
 
 .alpha-warning {
@@ -23,7 +25,6 @@
   display: flex;
   flex-flow: column;
   margin-top: 70px;
-  margin-right: 10vw;
   width: 35vw;
   max-width: 550px;
 }
@@ -48,6 +49,10 @@
   max-width: 35rem;
 }
 
+.create-password {
+  margin: 67px 0 50px 0px;
+}
+
 .import-account {
   max-width: initial;
 }
diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss
index 73faebe8b..ecf5e1036 100644
--- a/ui/app/css/itcss/components/newui-sections.scss
+++ b/ui/app/css/itcss/components/newui-sections.scss
@@ -290,3 +290,27 @@ $wallet-view-bg: $alabaster;
 .token-balance__amount {
   padding-right: 6px;
 }
+
+
+// first time
+.first-view-main {
+  display: flex;
+  flex-direction: row-reverse;
+  justify-content: space-between;
+
+  @media screen and (max-width: 575px) {
+    height: 100%;
+  }
+
+  @media screen and (min-width: 576px) {
+    width: 85vw;
+  }
+
+  @media screen and (min-width: 769px) {
+    width: 80vw;
+  }
+
+  @media screen and (min-width: 1281px) {
+    width: 62vw;
+  }
+}
\ No newline at end of file