mobile styles init and font size

client/assets/styles/menu.less

@@ -181,3 +181,46 @@ section {
         }
     }
 }
+
+@media (max-width: 800px) {
+    section {
+        grid-template-columns: 1fr;
+
+        .list {
+            grid-template-columns: 1fr 1fr;
+        }
+
+        .news {
+            display: none;
+        }
+    }
+
+    .demo {
+        grid-template-columns: 1fr;
+        grid-template-areas:
+            "vinfo"
+            "vcons"
+            "game";
+
+
+        .construct-list .instance-construct:not(:first-child) {
+            display: none;
+        }
+
+        .game-demo {
+            grid-template-columns: 1fr;
+        }
+    }
+
+    .menu .team {
+        grid-template-columns: 1fr;
+
+        .construct {
+            height: 10em;
+        }
+    }
+
+    .account {
+        grid-template-columns: 1fr;
+    }
+}

client/assets/styles/styles.less

@@ -6,7 +6,7 @@ html, body, #mnml {
     background-color: black;
     font-family: 'Jura';
     color: whitesmoke;
-    font-size: 12pt;
+    font-size: 14pt;
 
     user-select: none;
     -moz-user-select: none;
@@ -26,7 +26,7 @@ html, body, #mnml {
 
 @media (min-width: 1921px) {
     html, body, #mnml {
-        font-size: 14pt;
+        font-size: 16pt;
     }
 }
 

client/assets/styles/styles.mobile.css

@@ -1,6 +1,6 @@
 @media (max-width: 800px) {
     #mnml {
-        font-size: 10pt;
+        font-size: 14pt;
         padding: 1em 0 0 0;
         grid-template-columns: 1fr;
         grid-template-rows: 1fr min-content;
@@ -44,10 +44,10 @@
         display: none;
     }
 
-    header {
+/*    header {
         display: none;
     }
-
+*/
     main {
         overflow-x: hidden;
         padding: 0 0.5em;

client/index.js

@@ -1,8 +1,8 @@
 require('./assets/styles/styles.less');
+require('./assets/styles/account.less');
 require('./assets/styles/menu.less');
 require('./assets/styles/nav.less');
 require('./assets/styles/footer.less');
-require('./assets/styles/account.less');
 require('./assets/styles/controls.less');
 require('./assets/styles/instance.less');
 require('./assets/styles/vbox.less');

client/src/components/demo.jsx

@@ -168,7 +168,7 @@ function Demo(args) {
     };
 
     return (
-        <section class='demo news'>
+        <section class='demo news bottom'>
             {vboxDemo()}
             {vboxConstructs()}
             {gameDemo()}