diff --git a/source/screens/demo/index.liquid b/source/screens/demo/index.liquid
index 2c1eafc..13c8d18 100644
--- a/source/screens/demo/index.liquid
+++ b/source/screens/demo/index.liquid
@@ -34,7 +34,7 @@ tags:
 			<h3>Overview</h3>
 		</div>
 		<nav>
-			<ul class="list_link">
+			<ul class="block list_link">
 				{% for link in collections.demoIndex %}
 					<li>
 						<a href="{{ link.page.url }}">{{ link.data.title }}</a>
@@ -42,24 +42,30 @@ tags:
 				{% endfor %}
 			</ul>
 		</nav>
-		<h3>Page</h3>
-		<ul class="list_link">
-			{% assign pagesByTitle = collections.demoPage | sort: 'data.title' %}
+		<div class="responsive">
+			<section>
+				<h3>Page</h3>
+				<ul class="block list_link">
+					{% assign pagesByTitle = collections.demoPage | sort: 'data.title' %}
 
-			{% for link in pagesByTitle %}
-				<li>
-					<a href="{{ link.page.url }}">{{ link.data.title }}</a>
-				</li>
-			{% endfor %}
-		</ul>
-		<h3>Example</h3>
-		<ul class="list_link">
-			{% for link in collections.demoExample %}
-				<li>
-					<a href="{{ link.page.url }}">{{ link.data.title }}</a>
-				</li>
-			{% endfor %}
-		</ul>
+					{% for link in pagesByTitle %}
+						<li>
+							<a href="{{ link.page.url }}">{{ link.data.title }}</a>
+						</li>
+					{% endfor %}
+				</ul>
+			</section>
+			<section>
+				<h3>Example</h3>
+				<ul class="block list_link">
+					{% for link in collections.demoExample %}
+						<li>
+							<a href="{{ link.page.url }}">{{ link.data.title }}</a>
+						</li>
+					{% endfor %}
+				</ul>
+			</section>
+		</div>
 	</div>
 </div>
 {% endblock %}
\ No newline at end of file
diff --git a/source/style/hippie-style b/source/style/hippie-style
index ddedf3b..45bb274 160000
--- a/source/style/hippie-style
+++ b/source/style/hippie-style
@@ -1 +1 @@
-Subproject commit ddedf3bbf2d6580dfeae297367fd673abaa11a96
+Subproject commit 45bb274db110db9d111207940c4e6e341da1e90c
diff --git a/source/style/modules/demo/_demo_module.scss b/source/style/modules/demo/_demo_module.scss
index 679de47..247c61b 100644
--- a/source/style/modules/demo/_demo_module.scss
+++ b/source/style/modules/demo/_demo_module.scss
@@ -281,10 +281,19 @@
 	.hello {
 		flex: 0 1 auto;
 		width: 80%;
+	}
 
-		ul {
-			padding: 1em 5em;
-			background-color: hippie.$color_darker;
+	.responsive {
+		@include hippie.forTabletPortraitUp {
+			display: flex;
+			flex-flow: row wrap;
+			align-items: stretch;
+			justify-content: space-between;
+			gap: hippie.$space_half hippie.$space_basic;
+
+			& > * {
+				flex: auto;
+			}
 		}
 	}
 }
\ No newline at end of file