diff --git a/public/blockstart/demos/square.html b/public/blockstart/demos/square.html
index 2db28ac..35d9204 100644
--- a/public/blockstart/demos/square.html
+++ b/public/blockstart/demos/square.html
@@ -9,21 +9,152 @@
   <link rel="stylesheet" href="/blockstart/blockstart.css">
 
 <style>
+h1 {
+  font-size: 2.5em;
+}
 </style>
-
 </head>
 
 <body>
-  <block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
-    <a href="/blockstart/">blockstart.css</a>
-    <div class="horizontal" style="--spacing: end;">
-      <a href="/blockstart/#about">About</a>  &nbsp;|&nbsp;
-      <a href="/blockstart/#docs">Docs</a>  &nbsp;|&nbsp;
-      <a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
-      <a href="/blockstart/blockstart.css">Download</a>
-    </div>
+  <block class="horizontal pad">
+    <h4>square</h4>
+    <h4 class="no-flex" style="align-self: end;">S | =</h4>
+  </block>
+
+  <block class="pad sized center" style="--w: 80vw; --pad: 2rem;">
+    <h1>Flexible business solutions that work for you.</h1>
+    <block class="horizontal" style="--spacing: start;">
+      <button class="no-flex pad border">get started</button>
+      <button class="no-flex pad border">contact sales</button>
+    </block>
+  </block>
+
+  <hr>
+  <shape style="--w: 100%; --h: 400px;">
+    <h1>Image</h1>
+  </shape>
+
+  <hr>
+  <content class="center sized" style="--w: 80vw;">
+    <block class="sized" style="--h: 300px;">
+      <h1 class="center">Tools that connect every side of your business.</h1>
+    </block>
+
+
+    <block class="border" style="--border-radius: 10px;">
+      <top class="pad" style="--pad: 1.5rem;">
+        <h3>Commerce</h3>
+        <blurb>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</blurb>
+
+        <a href="#">See commerce solutions</a>
+
+        <hr>
+        <block class="horizontal" style="--spacing: start">
+        <button class="no-flex">Point of sale</button>
+        <button class="no-flex">Online store</button>
+        <button class="no-flex">Payments</button>
+        </block>
+      </top>
+      <bottom>
+        <shape style="--w: 80vw; --h: 300px;">
+          <h1>Ipad</h1>
+        </shape>
+      </bottom>
+    </block>
+  </content>
+
+
+  <block class="sized center" style="--h: 300px; --w: 80vw;">
+    <h1 class="center">Solution sets for every business type and size.</h1>
+  </block>
+
+  <hr>
+
+  <grid style="font-size: 1.5em; --cols: 1fr; --rows: 1fr 1fr 1fr 1fr">
+    <block class="horizontal pad" style="--pad: 1.5rem; border-bottom: 1px solid var(--value5);">
+      <h4>Retail</h4>
+      <span class="no-flex">+</span>
+    </block>
+    <block class="horizontal pad" style="--pad: 1.5rem; border-bottom: 1px solid var(--value5);">
+      <h4>Food & beverage</h4>
+      <span class="no-flex">+</span>
+    </block>
+    <block class="horizontal pad" style="--pad: 1.5rem; border-bottom: 1px solid var(--value5);">
+      <h4>Professional services</h4>
+      <span class="no-flex">+</span>
+    </block>
+    <block class="horizontal pad" style="--pad: 1.5rem; border-bottom: 1px solid var(--value5);">
+      <h4>Large businesses</h4>
+      <span class="no-flex">+</span>
+    </block>
+  </grid>
+
+  <hr>
+  <block class="sized" style="--w: 80vw; --h: 300px;">
+    <h1 class="center">Meet the new Square Stand.</h1>
+  </block>
+
+  <shape style="--w: 100%; --h: 500px; --value: 5;">
+    <h1>Square Stand</h1>
+  </shape>
+
+  <hr>
+  <block class="center sized" style="--spacing: start; --w: 80vw; --h: 300px">
+    <h3>Tofu single-origin coffee cray offal gastropub hoodie edison bulb fam flannel pug tumblr celiac.</h3>
+
+    <div>$149 or blah blah</div>
+
+    <a href="#">Explore Square Stand -&gt;</a>
+  </block>
+
+  <hr>
+  <content class="solid">
+    <block class="center sized" style="--w: 80vw; --h: 200px;">
+      <h1>Resources to keep you moving forward.</h1>
+      <div>Tofu single-origin coffee cray offal gastropub hoodie edison bulb fam flannel pug tumblr celiac.</div>
+      <a href="">Visit our fill resource hub</a>
+    </block>
+
+    <shape class="center border" style="--w: 80vw; --h: 450px; --border-radius: 10px;">
+    <h1>Person</h1>
+    </shape>
+
+    <hr>
+    <block class="center sized" style="--w: 80vw; --h: 200px;">
+      <h3>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</h3>
+      <div>Tofu single-origin coffee cray offal gastropub hoodie edison bulb fam flannel pug tumblr celiac.</div>
+      <a href="">Visit our fill resource hub</a>
+    </block>
+
+    <shape class="center border" style="--w: 80vw; --h: 450px; --border-radius: 10px;">
+    <h1>Person</h1>
+    </shape>
+    <hr>
+  </content>
+
+
+  <block class="center sized pad" style="--w: 80vw;">
+    <h1>Get real support.</h1>
+
+    <hr>
+    <block class="solid border pad">
+      <h4>Flexitarian Vice Poutine Synth</h4>
+      <div>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</div>
+      <a href="">Contact sales</a>
+    </block>
+    <hr>
+    <block class="solid border pad">
+      <h4>Flexitarian Vice Poutine Synth</h4>
+      <div>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</div>
+      <a href="">Contact sales</a>
+    </block>
+  </block>
+
+
+  <hr>
+  <block class="sized solid center-text" style="--value: 0; --text: 9; --h: 500px;">
+    <h1>Footer</h1>
   </block>
 
-<h1>Coming soon...</h1>
 </body>
 </html>
