diff --git a/src/lib/viewport/content-sidebar.svelte b/src/lib/viewport/content-sidebar.svelte
index 076512a..f0ef98d 100644
--- a/src/lib/viewport/content-sidebar.svelte
+++ b/src/lib/viewport/content-sidebar.svelte
@@ -14,33 +14,31 @@
     } = $props();
 </script>
 
-<div class="banner-container">
+<div class="container">
     <Banner2 content={bannerContent}/>
-</div>
 
-<div class="content">
-
-    <div class="main">
-        <ScrollTopButton />
-        {@render children()}
-    </div>
-    <div class="side">
-        <TableOfContents type="side" />
+    <div class="content">
+        <div class="main">
+            <ScrollTopButton />
+            {@render children()}
+        </div>
+        <div class="side">
+            <TableOfContents type="side" />
+        </div>
     </div>
 </div>
 
 <style>
-    .banner-container {
+    .container {
         width: var(--page-width);
         margin: 0 auto;
+        padding: 0 24px;
+        box-sizing: border-box;
     }
 
     .content {
-        max-width: var(--page-width);
-        margin: 0 auto;
         display: flex;
         flex-direction: row;
-        padding: 0 24px;
     }
     .side {
         width: fit-content;
diff --git a/src/routes/blog/[year]/[date]/+page.svelte b/src/routes/blog/[year]/[date]/+page.svelte
index caa8473..4251584 100644
--- a/src/routes/blog/[year]/[date]/+page.svelte
+++ b/src/routes/blog/[year]/[date]/+page.svelte
@@ -1,7 +1,5 @@
 <script>
-    import Banner2 from "$lib/banner2.svelte";
-    import Content from "$lib/viewport/content.svelte";
-    import TableOfContents from "$lib/components/table-of-contents.svelte";
+    import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
 
 	export let data;
 </script>
@@ -12,7 +10,7 @@
     <meta name="DCTERMS.created" content="{data.date}T{data.time}">
 </svelte:head>
 
-<Content bannerContent={{
+<ContentSidebar bannerContent={{
     title: data.title,
     subtitle: data.subtitle,
     date: data.date,
@@ -22,8 +20,6 @@
     tags: data.tags,
 }}>
 
-    <!-- <TableOfContents /> -->
-
     <svelte:component this={data.content} />
 
-</Content>
\ No newline at end of file
+</ContentSidebar>
\ No newline at end of file
diff --git a/src/routes/feed/+page.svelte b/src/routes/feed/+page.svelte
index e091865..af903a1 100644
--- a/src/routes/feed/+page.svelte
+++ b/src/routes/feed/+page.svelte
@@ -1,8 +1,6 @@
 <script lang="ts">
-    import Content from "$lib/viewport/content.svelte";
-    import Banner2 from "$lib/banner2.svelte";
-    import TableOfContents from "$lib/components/table-of-contents.svelte";
     import ImageRow from "$lib/media/image-row.svelte";
+    import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
 
     export let data;
 </script>
@@ -31,7 +29,7 @@
     </div>
 {/snippet}
 
-<Content bannerContent={{
+<ContentSidebar bannerContent={{
     title: "Creative Feed",
     banner: "banner.webp",
     bannerAlt: "A blue screen with the text 'how do you do art ? 1. face your fears 2. become your heroes'. The 'art' looks to have been edited in. The music artist Porter Robinson is standing in the bottom right corner.",
@@ -42,8 +40,6 @@
 
     <p>This page is intended to be a contrasting companion to the <a href="/projects"><code>projects</code> page</a>; I'll use this page for smaller things that don't fit the dedicated-page-format.</p>
 
-    <!-- <TableOfContents /> -->
-
     {@render pageButtons(data.currentPage)}
     
     {#each data.feedPosts as post}
@@ -61,7 +57,7 @@
 
     {@render pageButtons(data.currentPage)}
 
-</Content>
+</ContentSidebar>
 
 <style>
     .page-button-container {
diff --git a/src/routes/projects/[category]/[id]/+page.svelte b/src/routes/projects/[category]/[id]/+page.svelte
index ea5de09..e2ed864 100644
--- a/src/routes/projects/[category]/[id]/+page.svelte
+++ b/src/routes/projects/[category]/[id]/+page.svelte
@@ -1,8 +1,5 @@
 <script>
-    import Banner2 from "$lib/banner2.svelte";
     import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
-    import Content from "$lib/viewport/content.svelte";
-    // import TableOfContents from "$lib/components/table-of-contents.svelte";
 
 	export let data;
 </script>
@@ -22,8 +19,6 @@
     bannerAlt: data.projectDetails.bannerAlt,
 }}>
 
-    <!-- <TableOfContents /> -->
-
     {#if data.projectDetails.links.length > 0}
         <div class="link-button-container">
             {#each data.projectDetails.links as l}
diff --git a/src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte b/src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte
index 0bdefd0..faa1215 100644
--- a/src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte
+++ b/src/routes/projects/projectn5/devlog/[year]/[date]/+page.svelte
@@ -1,7 +1,5 @@
 <script>
-    import Banner2 from "$lib/banner2.svelte";
-    import Content from "$lib/viewport/content.svelte";
-    import TableOfContents from "$lib/components/table-of-contents.svelte";
+    import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
 
 	export let data;
 </script>
@@ -12,7 +10,7 @@
     <meta name="DCTERMS.created" content="{data.date}">
 </svelte:head>
 
-<Content bannerContent={{
+<ContentSidebar bannerContent={{
     title: data.title,
     subtitle: "Homesick Devlog",
     date: data.date,
@@ -20,8 +18,6 @@
     bannerAlt: data.bannerAlt,
 }}>
 
-    <!-- <TableOfContents /> -->
-
     <svelte:component this={data.content} />
 
-</Content>
\ No newline at end of file
+</ContentSidebar>
\ No newline at end of file