diff --git a/Resources/Private/Layouts/Page/BlogSidebar.html b/Resources/Private/Layouts/Page/BlogSidebar.html
index 8e98c1e..d23da4b 100644
--- a/Resources/Private/Layouts/Page/BlogSidebar.html
+++ b/Resources/Private/Layouts/Page/BlogSidebar.html
@@ -8,13 +8,13 @@
             <h1>{data.title}</h1>
         </header>
 
-        <section>
-            {f:render(section: 'Content', arguments: _all) -> f:spaceless()}
-        </section>
-
         <aside>
             {f:render(section: 'Aside', arguments: _all) -> f:spaceless()}
         </aside>
+
+        <section>
+            {f:render(section: 'Content', arguments: _all) -> f:spaceless()}
+        </section>
     </main>
 
     {f:render(partial: 'Footer', arguments: _all)}
diff --git a/Resources/Private/Partials/TopicList.html b/Resources/Private/Partials/TopicList.html
index 45f39e2..19027ba 100644
--- a/Resources/Private/Partials/TopicList.html
+++ b/Resources/Private/Partials/TopicList.html
@@ -1,7 +1,7 @@
 <html xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
     data-namespace-typo3-fluid="true">
     <nav>
-        <h1>{headline}</h1>
+        <h3>{headline}</h3>
         <ul>
             <f:for each="{topics}" as="topic">
                 <f:if condition="{topic.data.title}">
diff --git a/Resources/Private/Sass/Frontend/layout/_content.scss b/Resources/Private/Sass/Frontend/layout/_content.scss
index 32141f9..aede6fd 100644
--- a/Resources/Private/Sass/Frontend/layout/_content.scss
+++ b/Resources/Private/Sass/Frontend/layout/_content.scss
@@ -7,23 +7,30 @@ body > main {
 
     & > header {
         @extend .col-12;
+        @extend .order-xl-1;
         margin-bottom: $spacer * 2;
     }
 
-    & > section {
-        @extend .col-xl-8;
-        @extend .col-12;
-    }
-
     & > aside {
         @extend .col-xl-4;
         @extend .col-12;
+        @extend .order-xl-3;
 
         nav ul {
             list-style: none;
             padding-left: 0;
         }
     }
+
+    & > section {
+        @extend .col-xl-8;
+        @extend .col-12;
+        @extend .order-xl-2;
+    }
+
+    & article > aside {
+        margin-bottom: $spacer * 2;
+    }
 }
 
 aside,
@@ -77,21 +84,15 @@ main article h1 {
     padding-top: 0;
 }
 
-aside {
-    h1 {
-        font-size: 1.5em;
-    }
-
-    nav {
-        h1 {
-            font-size: 1.25em;
-        }
+aside,
+nav {
+    details > summary > h2 {
+        display: inline;
     }
 }
 
 @media (max-width: 1439px) {
     body > main > aside {
-        margin-top: $spacer * 4;
         padding-bottom: 0;
 
         h1, h2, h3, h4, h5, h6 {
@@ -116,6 +117,7 @@ aside {
         }
     }
 }
+
 @media (max-width: 768px) {
     body > main > aside {
         nav li {
diff --git a/Resources/Private/Sass/Frontend/layout/page/_content.scss b/Resources/Private/Sass/Frontend/layout/page/_content.scss
index aba93d7..24258a8 100644
--- a/Resources/Private/Sass/Frontend/layout/page/_content.scss
+++ b/Resources/Private/Sass/Frontend/layout/page/_content.scss
@@ -2,6 +2,7 @@ body.LayoutContent {
     article {
         @extend .row;
         @extend .col-12;
+        @extend .order-xl-2;
 
         & > header {
             @extend .col-12;
diff --git a/Resources/Private/Templates/Page/BlogPost.html b/Resources/Private/Templates/Page/BlogPost.html
index c1594fa..cd07340 100644
--- a/Resources/Private/Templates/Page/BlogPost.html
+++ b/Resources/Private/Templates/Page/BlogPost.html
@@ -46,29 +46,33 @@
 
     <f:section name="Aside">
         <nav>
-            <h1>Table of Content</h1>
-            <ol>
-                <li>
-                    <a href="#introduction">Introduction</a>
-                </li>
-                <f:for each="{pageContent}" as="contentEntry">
-                    <f:if condition="{contentEntry.data.header}">
+            <details open>
+                <summary>
+                    <h2>Table of Content</h2>
+                </summary>
+                <ol>
+                    <li>
+                        <a href="#introduction">Introduction</a>
+                    </li>
+                    <f:for each="{pageContent}" as="contentEntry">
+                        <f:if condition="{contentEntry.data.header}">
+                            <li>
+                                <a href="#{contentEntry.data.header -> f:format.id()}">{contentEntry.data.header}</a>
+                            </li>
+                        </f:if>
+                    </f:for>
+                    <f:if condition="{acknowledgements}">
                         <li>
-                            <a href="#{contentEntry.data.header -> f:format.id()}">{contentEntry.data.header}</a>
+                            <a href="#acknowledgements">Acknowledgements</a>
                         </li>
                     </f:if>
-                </f:for>
-                <f:if condition="{acknowledgements}">
-                    <li>
-                        <a href="#acknowledgements">Acknowledgements</a>
-                    </li>
-                </f:if>
-                <f:if condition="{furtherReading}">
-                    <li>
-                        <a href="#furtherReading">Further reading</a>
-                    </li>
-                </f:if>
-            </ol>
+                    <f:if condition="{furtherReading}">
+                        <li>
+                            <a href="#furtherReading">Further reading</a>
+                        </li>
+                    </f:if>
+                </ol>
+            </details>
         </nav>
     </f:section>
 </html>
diff --git a/Resources/Private/Templates/Page/Default.html b/Resources/Private/Templates/Page/Default.html
index 8fb4889..1e734ad 100644
--- a/Resources/Private/Templates/Page/Default.html
+++ b/Resources/Private/Templates/Page/Default.html
@@ -8,16 +8,20 @@
     </f:section>
 
     <f:section name="Aside">
-        <h1>Blog Posts by</h1>
+        <details open>
+            <summary>
+                <h2>Blog Posts by</h2>
+            </summary>
 
-        {f:render(partial: 'TopicList', arguments: {
-            headline: 'Compatibility with TYPO3',
-            topics: allTypo3Compatible
-        })}
+            {f:render(partial: 'TopicList', arguments: {
+                headline: 'Compatibility with TYPO3',
+                topics: allTypo3Compatible
+            })}
 
-        {f:render(partial: 'TopicList', arguments: {
-            headline: 'Topic',
-            topics: allTopics
-        })}
+            {f:render(partial: 'TopicList', arguments: {
+                headline: 'Topic',
+                topics: allTopics
+            })}
+        </details>
     </f:section>
 </html>
