diff --git a/dockerfile b/dockerfile
index 63003cd..b1af6ba 100644
--- a/dockerfile
+++ b/dockerfile
@@ -7,7 +7,7 @@ RUN npm install
 COPY . ./
 RUN npm run build
 
-FROM nginx:alpine-slim
+FROM georgjung/nginx-brotli:mainline-alpine
 RUN rm -f /etc/nginx/nginx.conf
 COPY ./nginx.conf /etc/nginx/nginx.conf
 COPY --from=build /app/build /usr/share/nginx/html
diff --git a/nginx.conf b/nginx.conf
index e0f7712..12058cd 100644
--- a/nginx.conf
+++ b/nginx.conf
@@ -1,3 +1,5 @@
+load_module modules/ngx_http_brotli_static_module.so;
+
 user  nginx;
 worker_processes  auto;
 
@@ -44,6 +46,7 @@ http {
             root /usr/share/nginx/html;
             index index.html;
             gzip_static on;
+            brotli_static on;
             error_page 500 502 503 504 /50x.html;
             try_files $uri $uri.html $uri/ =404;
             add_header Cache-Control "public, no-transform, max-age=1209600";
diff --git a/src/app.css b/src/app.css
index 7663de0..e403cbd 100644
--- a/src/app.css
+++ b/src/app.css
@@ -28,7 +28,8 @@
 
 @font-face {
   font-family: 'ubuntu';
-  src: url('/font/ubuntumono/ubuntumono-regular.woff2') format('woff2'), url('/font/ubuntumono/ubuntumono-refular.woff') format('woff'), url('/font/ubuntumono/ubuntumono-regular.ttf') format('truetype');
+  src: url('/font/ubuntumono/ubuntumono-regular.woff2') format('woff2'), url('/font/ubuntumono/ubuntumono-regular.woff') format('woff'),
+    url('/font/ubuntumono/ubuntumono-regular.ttf') format('truetype');
   font-weight: 400;
   font-style: normal;
 }
diff --git a/src/lib/ldb/staff/table/table-generator.svelte b/src/lib/ldb/staff/table/table-generator.svelte
index 561c346..4c91c9b 100644
--- a/src/lib/ldb/staff/table/table-generator.svelte
+++ b/src/lib/ldb/staff/table/table-generator.svelte
@@ -150,72 +150,78 @@
     click(rid, uid, tid);
   }
 </script>
+
 <p class="smallScreen">Your display is too small to view this data</p>
-  <table>
-    <tr>
-      <th class="id">ID</th>
-      <th class="from">From</th>
-      <th class="to">To</th>
-      <th class="plat">Plat</th>
-      <th class="time">Sch</th>
-      <th class="time">Exp</th>
-      <th class="time">Sch</th>
-      <th class="time">Exp</th>
-    </tr>
-    <tr>
-      <th class="other" colspan="4" />
-      <th class="timepair" colspan="2">Arrival</th>
-      <th class="timepair" colspan="2">Departure</th>
-    </tr>
-    {#each services as service}
-      {#await generateServiceData(service)}
-        <tr><td colspan="8">Loading Service Data...</td></tr>
-      {:then serviceData}
-        <tr
-          class="dataRow"
-          on:click={(event) => detail(event, service.rid, service.uid, service.trainid)}
-          on:keypress={(event) => detail(event, service.rid, service.uid, service.trainid)}
+<table>
+  <tr>
+    <th class="id">ID</th>
+    <th class="from">From</th>
+    <th class="to">To</th>
+    <th class="plat">Plat</th>
+    <th class="time">Sch</th>
+    <th class="time">Exp</th>
+    <th class="time">Sch</th>
+    <th class="time">Exp</th>
+  </tr>
+  <tr>
+    <th class="other" colspan="4" />
+    <th class="timepair" colspan="2">Arrival</th>
+    <th class="timepair" colspan="2">Departure</th>
+  </tr>
+  {#each services as service}
+    {#await generateServiceData(service)}
+      <tr><td colspan="8">Loading Service Data...</td></tr>
+    {:then serviceData}
+      <tr
+        class="dataRow"
+        on:click={(event) => detail(event, service.rid, service.uid, service.trainid)}
+        on:keypress={(event) => detail(event, service.rid, service.uid, service.trainid)}
+      >
+        <td class="id">{service.trainid}</td>
+        <td class="from {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.from}</td>
+        <td class="to {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.to}</td>
+        <td class="plat {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'} {serviceData.platformHidden && 'nonPass'}"
+          >{serviceData.platform.number || '-'}</td
         >
-          <td class="id">{service.trainid}</td>
-          <td class="from {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.from}</td>
-          <td class="to {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.to}</td>
-          <td class="plat {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'} {serviceData.platformHidden && 'nonPass'}">{serviceData.platform.number || '-'}</td>
-          <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schArr}</td>
-          <td class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateArr && 'late'} {serviceData.isArrDelayed && 'late'} {serviceData.isCancelled && 'canc'} {serviceData.isEarlyArr && 'early'}"
-            >{serviceData.isArrDelayed ? 'LATE' : serviceData.expArr}</td
-          >
-          <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schDep}</td>
-          <td
-            class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateDep && 'late'} {serviceData.isDepDelayed && 'late'}
+        <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schArr}</td>
+        <td
+          class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateArr && 'late'} {serviceData.isArrDelayed && 'late'} {serviceData.isCancelled &&
+            'canc'} {serviceData.isEarlyArr && 'early'}">{serviceData.isArrDelayed ? 'LATE' : serviceData.expArr}</td
+        >
+        <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schDep}</td>
+        <td
+          class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateDep && 'late'} {serviceData.isDepDelayed && 'late'}
                  {serviceData.isCancelled && 'canc'} {serviceData.isEarlyDep && 'early'}">{serviceData.isDepDelayed ? 'LATE' : serviceData.expDep}</td
-          >
-        </tr>
-        <tr>
-          <td class="tableTxt" colspan="8">
-            {service.operator} {#if service.isCharter}charter{/if}
-            {#if serviceData.length} | {serviceData.length} carriages{/if}
-            {#if service.delayReason}
-              <br />
-              <Reason type={'delay'} code={service.delayReason} />
-            {/if}
-            {#if service.cancelReason}
-              <br />
-              <Reason type={'cancel'} code={service.cancelReason} />
-            {/if}
-          </td>
-        </tr>
-      {:catch}
-        <tr>
-          <td colspan="8">Unable to display service</td>
-        </tr>
-      {/await}
-    {/each}
-  </table>
+        >
+      </tr>
+      <tr>
+        <td class="tableTxt" colspan="8">
+          {service.operator}
+          {#if service.isCharter}charter{/if}
+          {#if serviceData.length} | {serviceData.length} carriages{/if}
+          {#if service.delayReason}
+            <br />
+            <Reason type={'delay'} code={service.delayReason} />
+          {/if}
+          {#if service.cancelReason}
+            <br />
+            <Reason type={'cancel'} code={service.cancelReason} />
+          {/if}
+        </td>
+      </tr>
+    {:catch}
+      <tr>
+        <td colspan="8">Unable to display service</td>
+      </tr>
+    {/await}
+  {/each}
+</table>
 
 <style>
   table {
     table-layout: fixed;
     width: 100%;
+    max-width: 875px;
     margin: 0px;
     padding: 0px;
     color: white;
@@ -261,10 +267,12 @@
     text-align: left;
   }
 
-  td.to, th.to {
+  td.to,
+  th.to {
     text-align: right;
   }
-  td.from, th.from {
+  td.from,
+  th.from {
     text-align: left;
   }
   td.time {
@@ -280,27 +288,52 @@
   }
 
   /* Handle small screens */
-  .smallScreen {display: none; margin: 20px;}
+  .smallScreen {
+    display: none;
+    margin: 20px;
+  }
   @media screen and (max-width: 335px) {
-    th {font-size: 10px;}
-    .dataRow {font-size: 12px;}
-    td.time {font-size: 12px;}
-    .tableTxt{font-size:10px;}
+    th {
+      font-size: 10px;
+    }
+    .dataRow {
+      font-size: 12px;
+    }
+    td.time {
+      font-size: 12px;
+    }
+    .tableTxt {
+      font-size: 10px;
+    }
   }
   @media screen and (max-width: 279px) {
-    table {display: none;}
-    .smallScreen {display: block;}
+    table {
+      display: none;
+    }
+    .smallScreen {
+      display: block;
+    }
   }
 
   /* Handle Large Screens */
   @media screen and (min-width: 375px) {
-    .dataRow{font-size: 18px;}
-    td.time{font-size:16px;}
+    .dataRow {
+      font-size: 18px;
+    }
+    td.time {
+      font-size: 16px;
+    }
   }
   @media screen and (min-width: 450px) {
-    .dataRow{font-size:20px;}
-    td.time{font-size:19px;}
-    .tableTxt{font-size:13px;}
+    .dataRow {
+      font-size: 20px;
+    }
+    td.time {
+      font-size: 19px;
+    }
+    .tableTxt {
+      font-size: 13px;
+    }
   }
 
   /* Conditional Classes */
diff --git a/src/lib/ldb/staff/train-detail.svelte b/src/lib/ldb/staff/train-detail.svelte
index a2a2bd7..08803f9 100644
--- a/src/lib/ldb/staff/train-detail.svelte
+++ b/src/lib/ldb/staff/train-detail.svelte
@@ -108,24 +108,24 @@
         <br />
         Times in <span class="estimate">yellow</span> are estimated times
       </p>
-        {#if train.GetServiceDetailsResult.delayReason}
-          <p class="reason late">
-              <Reason type="delay" code={train.GetServiceDetailsResult.delayReason} />
-          </p>
-        {/if}
-        {#if train.GetServiceDetailsResult.cancelReason}
-          <p class="reason canc">
-              <Reason type="cancel" code={train.GetServiceDetailsResult.cancelReason} />
-          </p>
-        {/if}
-        <table id="detailTable">
+      {#if train.GetServiceDetailsResult.delayReason}
+        <p class="reason late">
+          <Reason type="delay" code={train.GetServiceDetailsResult.delayReason} />
+        </p>
+      {/if}
+      {#if train.GetServiceDetailsResult.cancelReason}
+        <p class="reason canc">
+          <Reason type="cancel" code={train.GetServiceDetailsResult.cancelReason} />
+        </p>
+      {/if}
+      <table id="detailTable">
         <tr>
           <th class="tableLocation">Loc.</th>
           <th class="tablePlatform">Pl.</th>
           <th class="tableTime">Sch</th>
-          <th class="tableTime">Est/<br>Act</th>
+          <th class="tableTime">Est/<br />Act</th>
           <th class="tableTime">Sch</th>
-          <th class="tableTime">Est/<br>Act</th>
+          <th class="tableTime">Est/<br />Act</th>
           <th class="tableDelay" />
         </tr>
         <tr>
@@ -209,17 +209,23 @@
     margin-right: 0px;
     padding: 0px;
     color: white;
-    font-family: ubuntu,monospace;
+    font-family: ubuntu, monospace;
     font-size: 16px;
   }
   @media screen and (max-width: 338px) {
-    #detailTable{font-size: 14px}
+    #detailTable {
+      font-size: 14px;
+    }
   }
   @media screen and (max-width: 301px) {
-    #detailTable{font-size: 12px}
+    #detailTable {
+      font-size: 12px;
+    }
   }
   @media screen and (min-width: 469px) {
-    #detailTable{font-size: 20px}
+    #detailTable {
+      font-size: 20px;
+    }
   }
   .tableLocation {
     width: 18%;
diff --git a/src/lib/stores/version.js b/src/lib/stores/version.js
index dcd84e2..a2a813c 100644
--- a/src/lib/stores/version.js
+++ b/src/lib/stores/version.js
@@ -1,3 +1,3 @@
 export const version = '2023.7.1';
-export const versionTag = 'beta.2';
+export const versionTag = 'beta.3';
 export const showWelcome = true;
diff --git a/src/routes/more/reg/+page.svelte b/src/routes/more/reg/+page.svelte
index a9b19f4..898b602 100644
--- a/src/routes/more/reg/+page.svelte
+++ b/src/routes/more/reg/+page.svelte
@@ -83,7 +83,10 @@
   <p>There was an error processing your request.</p>
   <p>Check that the email you entered was correct or try again later.</p>
 {:else if state == 'reg'}
-  <p>You are already registered for OwlBoard.  If you've recently logged out or updated, you may need to refresh this page to register as old data could still be stored in your browser.</p>
+  <p>
+    You are already registered for OwlBoard. If you've recently logged out or updated, you may need to refresh this page to register as old data could still be stored in your
+    browser.
+  </p>
 {/if}
 <Nav />
 
diff --git a/static/sw.js b/static/sw.js
index 7588cdf..dd43d0c 100644
--- a/static/sw.js
+++ b/static/sw.js
@@ -2,15 +2,16 @@
 // This should then enable the new /service-worker.js to be installed
 
 self.addEventListener('activate', function (e) {
-  console.log(`Unregistering service worker`)
-  self.registration.unregister()
+  console.log(`Unregistering service worker`);
+  self.registration
+    .unregister()
     .then(function () {
       return self.clients.matchAll();
     })
     .then(function (clients) {
-      clients.forEach(client => {
-        console.log(`Navigating ${client.url}`)
-        client.navigate(client.url)
-      })
+      clients.forEach((client) => {
+        console.log(`Navigating ${client.url}`);
+        client.navigate(client.url);
+      });
     });
-});
\ No newline at end of file
+});