diff --git a/assets/css/bobastyle.css b/assets/css/bobastyle.css
index 056d2b0..5c4dddf 100644
--- a/assets/css/bobastyle.css
+++ b/assets/css/bobastyle.css
@@ -45,6 +45,41 @@
 
 
 
+/* Subsection formatting */
+.section {
+  margin-bottom: 40px;
+  transition: transform .2s;
+  background-color: #222;
+  border-radius: 5px;
+  padding: 1px 25px;
+}
+
+.section:hover {
+  transform: scale(1.025);
+}
+
+.section-title {
+  margin: 10px 0;
+}
+
+.section-anchor {
+  color: inherit;
+}
+
+.section-anchor:hover {
+  text-decoration: none;
+}
+
+.section-description {
+  margin-bottom: 5px;
+}
+
+.view-section {
+  margin-top: 5px;
+}
+
+
+
 /* Header formatting (website title and article section headers) */
 .top {
   margin: 20px;
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 7413a52..293f342 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -10,6 +10,31 @@
     </span>
 </h1>
 
+<div class="sections">
+    {{ range .Sections }}
+
+    <a class="section-anchor" href="{{ .Permalink }}">
+        <div class="section">
+                <h2 class="section-title">
+                    {{ with .Params.icon }}{{ partial "icon.html" . }}{{ end }}
+                    {{ .Title | markdownify }}
+                </h2>
+
+                <div class="section-description">
+                    {{ if .Description }}
+                    <p>
+                        {{ .Description | markdownify }}
+                    </p>
+                    {{ else }}
+                    {{ .Summary }}
+                    {{ end }}
+                </div>
+        </div>
+    </a>
+
+    {{ end }}
+</div>
+
 <div class="posts">
     {{ range .Paginator.Pages }}
         {{ .Render "summary" }}