Fix mobile styles on homepage

server/files/stylesheets/semantic.css

@@ -1608,7 +1608,7 @@ body.progress.animated .ui.progress .bar {
 }
 @media only screen and (max-width : 320px) {
   #example .advertisement {
-    max-width: 290px;
+    max-width: 260px;
   }
   #example .example {
     max-width: 290px;
@@ -1616,6 +1616,25 @@ body.progress.animated .ui.progress .bar {
 }
 
 @media only screen and (max-width : 600px) {
+  #example.index .introduction {
+    margin: 4rem 0rem;
+  }
+  #example.index .masthead.segment h1 {
+    font-size: 2.25em;
+  }
+  #example.index .email.stripe .input {
+    width: auto;
+  }
+  #example.index .following .secondary.menu {
+    display: none;
+  }
+  #example.index .email.stripe .submit.button {
+    margin-top: 0.5em;
+  }
+
+  #example .solid, #example .stripe {
+    padding: 4em 0em;
+  }
   #example .page > .footer {
     padding: 2em 0em;
   }
@@ -1638,6 +1657,17 @@ body.progress.animated .ui.progress .bar {
     opacity: 1;
   }
 }
+
+@media only screen and (min-width : 600px) {
+
+  #example.index .main.menu {
+    display: none;
+  }
+
+
+}
+
+
 @media only screen and (min-width : 600px) and (max-width : 998px) {
   #example .container {
     width: auto;
@@ -1816,7 +1846,7 @@ body.progress.animated .ui.progress .bar {
     font-size: 1em !important;
   }
   #example .inverted.advertisement .carbonad {
-    height: 109px;
+    height: 144px;
   }
   #example .inverted.advertisement .carbonad-img {
     margin-top: 0px;

server/layouts/default.html.eco

@@ -263,7 +263,6 @@
       </div>
     </div>
   </div>
-    <% if @document.title isnt 'Introduction': %>
     <div class="ui fixed inverted main menu">
     <div class="container">
       <a class="launch item"><i class="content icon"></i></a>
@@ -321,7 +320,6 @@
       </div>
     </div>
   </div>
-  <% end %>
 
   <div class="ui black huge launch right attached fixed button">
     <i class="content icon"></i>

src/definitions/collections/grid.less

@@ -1069,7 +1069,9 @@
     padding-left: @stackableGutterWidth !important;
     padding-right: @stackableGutterWidth !important;
   }
-
+  .ui[class*="equal height"].stackable.page.grid {
+    width: 100%;
+  }
 
   /* Remove pointers from vertical menus */
   .ui.stackable.grid .vertical.pointing.menu .item:after {

src/definitions/globals/site.less

@@ -9,7 +9,6 @@
  *
  */
 
-
 /*******************************
             Theme
 *******************************/

src/themes/packages/default/globals/site.variables

@@ -65,7 +65,7 @@
 @fontSize            : 14px;
 @textColor           : rgba(0, 0, 0, 0.8);
 
-@pageMinWidth        : (320px - (@fontSize * 2));
+@pageMinWidth        : (320px - (@fontSize * 3));
 
 @headerMargin        : 1em 0em 1rem;
 @paragraphMargin     : 0em 0em 1em;