diff --git a/server/src/airtable-interface.js b/server/src/airtable-interface.js
index 606d6310..8256c8fd 100644
--- a/server/src/airtable-interface.js
+++ b/server/src/airtable-interface.js
@@ -12,7 +12,7 @@ const logUpdates = false;
 // Starting with syncing Matches
 
 // const tables = ["Matches", "Teams", "Themes", "Events", "Players", "Player Relationships"];
-const tables = ["Event Series", "News", "Matches", "Teams", "Themes", "Events", "Players", "Socials", "Accolades", "Player Relationships", "Broadcasts", "Brackets", "Live Guests", "Headlines"];
+const tables = ["Event Series", "News", "Matches", "Teams", "Themes", "Events", "Players", "Socials", "Accolades", "Player Relationships", "Broadcasts", "Brackets", "Live Guests", "Headlines", "Clients"];
 
 function deAirtable(obj) {
     const data = {};
@@ -43,6 +43,7 @@ async function getAllTableData(tableName, options = {}) {
 
 function customUpdater(tableName, item) {
     if (tableName === "Broadcasts" && item.key && item.active) Cache.set(`broadcast-${item.key}`, item);
+    if (tableName === "Clients" && item.key) Cache.set(`client-${item.key}`, item);
     if (tableName === "Events" && item.subdomain) Cache.set(`event-${item.subdomain}`, item);
 }
 
diff --git a/website/src/apps/BroadcastApp.vue b/website/src/apps/BroadcastApp.vue
index 3080c317..44dee09b 100644
--- a/website/src/apps/BroadcastApp.vue
+++ b/website/src/apps/BroadcastApp.vue
@@ -12,10 +12,10 @@ import { ReactiveArray, ReactiveRoot, ReactiveThing } from "@/utils/reactive";
 
 export default {
     name: "BroadcastApp",
-    props: ["id", "title", "top"],
+    props: ["id", "title", "top", "code"],
     computed: {
         broadcast() {
-            return ReactiveRoot(`broadcast-${this.id}`, {
+            return ReactiveRoot(this.id || `broadcast-${this.code}`, {
                 event: ReactiveThing("event", {
                     theme: ReactiveThing("theme")
                 }),
diff --git a/website/src/apps/ClientApp.vue b/website/src/apps/ClientApp.vue
new file mode 100644
index 00000000..44c5759a
--- /dev/null
+++ b/website/src/apps/ClientApp.vue
@@ -0,0 +1,27 @@
+<template>
+    <BroadcastApp v-if="broadcastID" :id="broadcastID" />
+</template>
+
+<script>
+import BroadcastApp from "@/apps/BroadcastApp";
+import { ReactiveRoot, ReactiveThing } from "@/utils/reactive";
+export default {
+    name: "ClientApp",
+    components: { BroadcastApp },
+    props: ["client"],
+    computed: {
+        _client() {
+            return ReactiveRoot(`client-${this.client}`, {
+                broadcast: ReactiveThing("broadcast")
+            });
+        },
+        broadcastID() {
+            return this._client?.broadcast?.id;
+        }
+    }
+};
+</script>
+
+<style scoped>
+
+</style>
diff --git a/website/src/router/broadcast.js b/website/src/router/broadcast.js
new file mode 100644
index 00000000..9da5a585
--- /dev/null
+++ b/website/src/router/broadcast.js
@@ -0,0 +1,26 @@
+import IngameOverlay from "@/components/broadcast/IngameOverlay";
+import BreakOverlay from "@/components/broadcast/BreakOverlay";
+import BracketOverlay from "@/components/broadcast/BracketOverlay";
+import ScheduleOverlay from "@/components/broadcast/ScheduleOverlay";
+import StandingsOverlay from "@/components/broadcast/StandingsOverlay";
+import RosterOverlay from "@/components/broadcast/RosterOverlay";
+import EventThumbnailCreator from "@/components/broadcast/EventThumbnailCreator";
+import DraftOverlay from "@/components/broadcast/DraftOverlay";
+import DeskOverlay from "@/components/broadcast/DeskOverlay";
+import CustomOverlay from "@/components/broadcast/CustomOverlay";
+import InfoOverlay from "@/components/broadcast/InfoOverlay";
+
+export default [
+    { path: "ingame", component: IngameOverlay },
+    { path: "break", component: BreakOverlay },
+    { path: "bracket", component: BracketOverlay, props: route => ({ bracketKey: route.query.key, extended: !!route.query.extended, scale: route.query.scale }) },
+    { path: "schedule", component: ScheduleOverlay },
+    { path: "standings", component: StandingsOverlay },
+    { path: "roster", redirect: "rosters" },
+    { path: "rosters", component: RosterOverlay },
+    { path: "thumbnail", component: EventThumbnailCreator },
+    { path: "draft", component: DraftOverlay },
+    { path: "casters", component: DeskOverlay, props: route => ({ group: "casters" }) },
+    { path: "custom", component: CustomOverlay },
+    { path: "info", component: InfoOverlay }
+];
diff --git a/website/src/router/index.js b/website/src/router/index.js
index 20323315..3ec3016a 100644
--- a/website/src/router/index.js
+++ b/website/src/router/index.js
@@ -17,26 +17,16 @@ import TeamMain from "@/views/sub-views/TeamMain";
 import TeamMatches from "@/views/sub-views/TeamMatches";
 import PlayerPlayedMatches from "@/views/sub-views/PlayerPlayedMatches";
 import Match from "@/views/Match";
-import IngameOverlay from "@/components/broadcast/IngameOverlay";
-import BreakOverlay from "@/components/broadcast/BreakOverlay";
-import ScheduleOverlay from "@/components/broadcast/ScheduleOverlay";
-import StandingsOverlay from "@/components/broadcast/StandingsOverlay";
-import CustomOverlay from "@/components/broadcast/CustomOverlay";
-import RosterOverlay from "@/components/broadcast/RosterOverlay";
-import EventThumbnailCreator from "@/components/broadcast/EventThumbnailCreator";
 import EventMain from "@/views/sub-views/EventMain";
 import EventRosters from "@/views/sub-views/EventRosters";
 import EventBrackets from "@/views/sub-views/EventBrackets";
 import TeamTheme from "@/views/sub-views/TeamTheme";
 import EventSchedule from "@/views/sub-views/EventSchedule";
 import EventScenarios from "@/components/website/EventScenarios";
-import BracketOverlay from "@/components/broadcast/BracketOverlay";
-import DraftOverlay from "@/components/broadcast/DraftOverlay";
 import EventDraft from "@/views/sub-views/EventDraft";
 import TeamDetails from "@/views/sub-views/TeamDetails";
-import DeskOverlay from "@/components/broadcast/DeskOverlay";
-import InfoOverlay from "@/components/broadcast/InfoOverlay";
-// import EventScenarios2 from "@/components/website/EventScenarios2";
+import BroadcastRoutes from "@/router/broadcast";
+import ClientApp from "@/apps/ClientApp";
 
 Vue.use(VueRouter);
 
@@ -106,23 +96,16 @@ const routes = [
         ]
     },
     {
-        path: "/broadcast/:broadcastID",
+        path: "/broadcast/:broadcastCode",
         component: OverlayApp,
-        props: route => ({ id: route.params.broadcastID, title: route.query.title, top: route.query.top }),
-        children: [
-            { path: "ingame", component: IngameOverlay },
-            { path: "break", component: BreakOverlay },
-            { path: "bracket", component: BracketOverlay, props: route => ({ bracketKey: route.query.key, extended: !!route.query.extended, scale: route.query.scale }) },
-            { path: "schedule", component: ScheduleOverlay },
-            { path: "standings", component: StandingsOverlay },
-            { path: "roster", redirect: "rosters" },
-            { path: "rosters", component: RosterOverlay },
-            { path: "thumbnail", component: EventThumbnailCreator },
-            { path: "draft", component: DraftOverlay },
-            { path: "casters", component: DeskOverlay, props: route => ({ group: "casters" }) },
-            { path: "custom", component: CustomOverlay },
-            { path: "info", component: InfoOverlay }
-        ]
+        props: route => ({ code: route.params.broadcastCode, title: route.query.title, top: route.query.top }),
+        children: BroadcastRoutes
+    },
+    {
+        path: "/client/:clientID",
+        component: ClientApp,
+        props: route => ({ client: route.params.clientID }),
+        children: BroadcastRoutes
     }
 ];