diff --git a/docker/schwarzesbrett/src/routes/index.svelte b/docker/schwarzesbrett/src/routes/index.svelte
index df3a7a7..cb4b238 100644
--- a/docker/schwarzesbrett/src/routes/index.svelte
+++ b/docker/schwarzesbrett/src/routes/index.svelte
@@ -1,12 +1,17 @@
 <script lang="ts">
   import * as api from "$lib/api";
 
-  let fetchData = api.fetchData();
+  // let fetchData = api.fetchData();
+  let fetchData = [api.fetchData()];
   let listingIndex = 0;
 
   function updateListingIndex(amount: number): void {
     if (listingIndex == amount - 2) {
-      fetchData = api.fetchData();
+      fetchData.shift();
+      fetchData.push(api.fetchData());
+    }
+    if (fetchData.length == 0) {
+      fetchData.push(api.fetchData());
     }
 
     if (listingIndex >= amount - 1) {
@@ -30,63 +35,59 @@
   }
 </script>
 
-{#await fetchData}
-  <p>Loading...</p>
-{:then data}
-  <div class="brett center-box">
-    <div class="center">
-      {#if data.listings[listingIndex].type == api.ListingType.IMAGE}
-        <img
-          class="dynamic-size"
+<div class="brett center-box">
+  {#await fetchData[0]}
+    <p>Loading...</p>
+  {:then data}
+    {#if data.listings[listingIndex].type == api.ListingType.IMAGE}
+      <img
+        class="center dynamic-size"
+        src={api.generateContentURL(data.listings[listingIndex].content)}
+        alt={data.listings[listingIndex].name}
+        on:load={() =>
+          handleTime(
+            data.listings[listingIndex].time || 10,
+            data.listings.length
+          )}
+      />
+    {:else if data.listings[listingIndex].type == api.ListingType.VIDEO}
+      <video
+        class="center dynamic-size"
+        autoplay
+        playsinline
+        on:load={() =>
+          handleVideoLoad(
+            data.listings[listingIndex].time,
+            data.listings.length
+          )}
+        on:ended={() => updateListingIndex(data.listings.length)}
+      >
+        <source
           src={api.generateContentURL(data.listings[listingIndex].content)}
-          alt={data.listings[listingIndex].name}
-          width="100%"
-          on:load={() =>
-            handleTime(
-              data.listings[listingIndex].time || 10,
-              data.listings.length
-            )}
         />
-      {:else if data.listings[listingIndex].type == api.ListingType.VIDEO}
-        <video
-          class="dynamic-size"
-          autoplay
-          playsinline
-          on:load={() =>
-            handleVideoLoad(
-              data.listings[listingIndex].time,
-              data.listings.length
-            )}
-          on:ended={() => updateListingIndex(data.listings.length)}
-        >
-          <source
-            src={api.generateContentURL(data.listings[listingIndex].content)}
-          />
-          <track kind="captions" />
-          <b class="error">Videos are not supported!</b>
-        </video>
-      {/if}
-    </div>
+        <track kind="captions" />
+        <b class="error">Videos are not supported!</b>
+      </video>
+    {/if}
+  {:catch error}
+    <p><b class="error">An error occured! {error}</b></p>
+  {/await}
 
-    <div class="banner">
-      <div class="banner-wrapper">
-        <span class="banner-pre">Powered by </span>
-        <a class="banner-name" href="https://dergrimm.net" target="_blank">
-          <code>Dominic Grimm &lt;dominic@dergrimm.net&gt;</code>
-        </a>
-      </div>
+  <div class="banner">
+    <div class="banner-wrapper">
+      <span class="banner-pre">Powered by </span>
+      <a class="banner-name" href="https://dergrimm.net" target="_blank">
+        <code>Dominic Grimm &lt;dominic@dergrimm.net&gt;</code>
+      </a>
     </div>
   </div>
-{:catch error}
-  <p><b class="error">An error occured! {error}</b></p>
-{/await}
+</div>
 
 <style lang="scss">
   .brett {
     cursor: none;
-    width: 100vw;
-    height: 100vh;
     background-color: black;
+    color: white;
 
     * {
       pointer-events: none;
@@ -111,19 +112,16 @@
   }
 
   .banner-pre {
-    // opacity: 30%;
     font-size: large;
   }
 
   .banner-name {
-    // opacity: 70%;
     font-size: x-large;
     color: blue;
     text-decoration: underline;
   }
 
   .center-box {
-    width: 100%;
     height: 100vh;
     display: flex;
     justify-content: center;
@@ -135,7 +133,8 @@
   }
 
   .dynamic-size {
-    max-height: 100vh;
-    width: auto;
+    max-width: 100%;
+    max-height: 100%;
+    object-fit: contain;
   }
 </style>