welcome to mnml

client/assets/styles/styles.less

@@ -74,6 +74,10 @@ figure {
     text-align: center;
 }
 
+p {
+    margin-bottom: 1em;
+}
+
 #mnml {
     display: grid;
     grid-template-columns: minmax(min-content, 1fr) 8fr 1fr;
@@ -189,11 +193,28 @@ button[disabled] {
     LOGIN
 */
 
-.login {
-    width: 50%;
-    display: flex;
-    flex-flow: column;
-    margin-bottom: 2em;
+.welcome {
+    .highlight {
+        color: black;
+        background: @white;
+        border: 1px solid @white;
+    }
+
+    .login {
+        width: 50%;
+        display: flex;
+        flex-flow: column;
+        margin-bottom: 2em;
+    }
+
+    .options {
+        width: 50%;
+        display: flex;
+        flex-flow: row;
+        button {
+            flex: 1;
+        }
+    }
 
     h2 {
         margin-bottom: 0.5em;

client/assets/styles/styles.mobile.css

@@ -53,10 +53,19 @@
         padding: 0 0.5em;
     }
 
-    .login {
+    .welcome .login {
         width: 100%;
     }
 
+    .welcome .options {
+        width: 100%;
+        flex-flow: row wrap;
+    }
+
+    .welcome .options button {
+        flex: 1 0 50%;
+    }
+
     .timer-container {
         margin: 0.5em 0 0 0;
     }