diff --git a/assets/style.css b/assets/style.css
index 1a70d90..a03763e 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -58,6 +58,8 @@ html, body, #__nuxt {
     display: flex;
     align-items: center;
     background-color: #f3f3f3;
+    font-size: 0.95rem;
+    height: 2rem;
 }
 .resource:hover > .grid-element {
     background-color: #dbdbdb;
@@ -68,4 +70,4 @@ html, body, #__nuxt {
 }
 .even > .grid-element {
     background-color: rgb(233, 233, 233);
-}
+}
\ No newline at end of file
diff --git a/assets/transparent_logo.png b/assets/transparent_logo.png
index f508012..7eecb51 100644
Binary files a/assets/transparent_logo.png and b/assets/transparent_logo.png differ
diff --git a/classes/ConfigMap.ts b/classes/ConfigMap.ts
index 7ca7294..3846057 100644
--- a/classes/ConfigMap.ts
+++ b/classes/ConfigMap.ts
@@ -1,9 +1,10 @@
 import type { Metadata } from "./Metadata";
+import type { HasMetadata } from "./repo/ResourceRepo";
 
-export class ConfigMap
+export class ConfigMap implements HasMetadata
 {
     constructor (
         public metadata: Metadata,
-        public data: Record<string, string>
+        public data?: Record<string, string>
     ) {}
 }
\ No newline at end of file
diff --git a/classes/Node.ts b/classes/Node.ts
index 37898ad..fe1e118 100644
--- a/classes/Node.ts
+++ b/classes/Node.ts
@@ -1,5 +1,5 @@
 import type { Metadata } from "./Metadata";
-import type { HasMetadata } from "./ResourceRepo";
+import type { HasMetadata } from "./repo/ResourceRepo";
 
 export class Node implements HasMetadata
 {
diff --git a/classes/Pod.ts b/classes/Pod.ts
index fcbabca..40d9334 100644
--- a/classes/Pod.ts
+++ b/classes/Pod.ts
@@ -1,7 +1,7 @@
 import dayjs from "dayjs";
 import advancedFormat from "dayjs/plugin/advancedFormat";
 import type { Metadata } from "./Metadata";
-import type { HasMetadata } from "./ResourceRepo";
+import type { HasMetadata } from "./repo/ResourceRepo";
 
 export class Pod implements HasMetadata
 {
diff --git a/classes/ResourceRepo.ts b/classes/ResourceRepo.ts
deleted file mode 100644
index c9793ce..0000000
--- a/classes/ResourceRepo.ts
+++ /dev/null
@@ -1,140 +0,0 @@
-import axios from "axios";
-import type { Metadata } from "./Metadata";
-
-export interface HasMetadata {
-  metadata: Metadata
-}
-
-export class ResourceEvent<T extends HasMetadata>
-{
-    constructor (
-        public type: string,
-        public resources: T[]
-    ) {}
-}
-
-export class ResourceRepo<T extends HasMetadata>
-{
-    private resources: Ref<T[]> = ref([]);
-    private interval: NodeJS.Timeout | undefined = undefined;
-    private websocket: WebSocket | undefined = undefined;
-
-    static init<T extends HasMetadata>()
-    {
-        return new ResourceRepo<T>();
-    }
-
-    listen(resource: string)
-    {
-        const websocket = new WebSocket(StringUtils.format("%s/watch/%s/%s", ApiConfig.getWsBase(), resource, this.getNamespace()));
-        websocket.addEventListener('open', () => {
-            console.info("Opened Websocket.");
-        })
-        websocket.addEventListener("message", (event) => {
-            const data = JSON.parse(event.data) as ResourceEvent<T>;
-            console.info(StringUtils.format("[%s] Resource", data.type));
-            switch (data.type)
-            {
-                case "INIT": 
-                {
-                    this.add(data.resources);
-                    break;
-                }
-                case "ADDED":
-                {
-                    this.add(data.resources);
-                    break;
-                }
-                case "MODIFIED":
-                {
-                    this.update(data.resources);
-                    break;
-                }
-                case "DELETED":
-                {
-                    this.delete(data.resources);
-                    break;
-                }
-            }
-        });
-        const interval = setInterval(() => {
-            console.info("[PING]");
-            websocket.send('[PING]');
-        }, 5000);
-        websocket.addEventListener("close", () => {
-            console.info("Closing websocket.");
-            clearTimeout(interval);
-        });
-        this.websocket = websocket;
-    }
-
-    private add(resources: T[])
-    {
-        this.resources.value.push(...resources);
-    }
-
-    private delete(resources: T[])
-    {
-        for (const resource of resources)
-        {
-            const index = this.resources.value.findIndex(item => item.metadata.uid === resource.metadata.uid);
-            if (index != null)
-            {
-                this.resources.value.splice(index, 1);
-            }
-        }
-    }
-
-    private update(resources: T[])
-    {
-        for (const resource of resources)
-        {
-            const index = this.resources.value.findIndex(item => item.metadata.uid === resource.metadata.uid);
-            if (index != null)
-            {
-                this.resources.value[index] = resource;
-            }
-        }
-    }
-
-    load(resourceType: string)
-    {
-        this.refresh(resourceType);
-        return this;
-    }
-
-    clear() 
-    {
-        clearTimeout(this.interval);
-        if (this.websocket != null)
-        {
-            this.websocket.close();
-        }
-    }
-
-    get()
-    {
-        return computed(() => {
-            return this.resources.value.toSorted((a, b) => a.metadata.name.localeCompare(b.metadata.name));
-        })
-    }
-
-    private refresh(resourceType: string)
-    {
-        const namespace = this.getNamespace();
-        let url = StringUtils.format("%s/resources/%s", ApiConfig.getHttpBase(), resourceType);
-        if (namespace)
-        {
-            url = StringUtils.format("%s/%s", url, namespace);
-        }
-        axios.get<T[]>(url)
-        .then((response) => {
-            this.resources.value = response.data;
-        });
-    }
-
-    private getNamespace()
-    {
-        return useRoute().params.namespace as string;
-    }
-}
\ No newline at end of file
diff --git a/classes/Secret.ts b/classes/Secret.ts
index 0e631c5..738832b 100644
--- a/classes/Secret.ts
+++ b/classes/Secret.ts
@@ -1,5 +1,5 @@
 import { Metadata } from "./Metadata";
-import type { HasMetadata } from "./ResourceRepo";
+import type { HasMetadata } from "./repo/ResourceRepo";
 
 export class Secret implements HasMetadata
 {
diff --git a/classes/Service.ts b/classes/Service.ts
index 1bf6ea6..7c1282e 100644
--- a/classes/Service.ts
+++ b/classes/Service.ts
@@ -1,5 +1,5 @@
 import type { Metadata } from "./Metadata";
-import type { HasMetadata } from "./ResourceRepo";
+import type { HasMetadata } from "./repo/ResourceRepo";
 
 export class Service implements HasMetadata
 {
diff --git a/classes/repo/AdvancedWebSocket.ts b/classes/repo/AdvancedWebSocket.ts
new file mode 100644
index 0000000..d96a2d3
--- /dev/null
+++ b/classes/repo/AdvancedWebSocket.ts
@@ -0,0 +1,24 @@
+export class AdvancedWebSocket
+{
+    constructor (
+        private websocket: WebSocket,
+        private timeout: NodeJS.Timeout
+    ) {}
+
+    static open(url: string, onMessage: (event: MessageEvent) => void, onClose: (event: CloseEvent) => void)
+    {
+        const websocket = new WebSocket(url);
+        websocket.addEventListener('message', onMessage);
+        websocket.addEventListener('close', onClose);
+        const timeout = setInterval(() => {
+            websocket.send("[PING]");
+        }, 5000);
+        return new AdvancedWebSocket(websocket, timeout);
+    }
+
+    close()
+    {
+        this.websocket.close();
+        clearTimeout(this.timeout);
+    }
+}
\ No newline at end of file
diff --git a/classes/repo/ResourceEventType.ts b/classes/repo/ResourceEventType.ts
new file mode 100644
index 0000000..7855eb6
--- /dev/null
+++ b/classes/repo/ResourceEventType.ts
@@ -0,0 +1,7 @@
+export enum ResourceEventType
+{
+    INIT = "INIT",
+    ADDED = "ADDED",
+    MODIFIED = "MODIFIED",
+    DELETED = "DELETED"
+}
\ No newline at end of file
diff --git a/classes/repo/ResourceRepo.ts b/classes/repo/ResourceRepo.ts
new file mode 100644
index 0000000..8a5e085
--- /dev/null
+++ b/classes/repo/ResourceRepo.ts
@@ -0,0 +1,149 @@
+import axios from "axios";
+import type { Metadata } from "../Metadata";
+import { ResourceEventType } from "./ResourceEventType";
+import { AdvancedWebSocket } from "./AdvancedWebSocket";
+import { WebsocketSession } from "./WebsocketSession";
+
+export interface HasMetadata {
+  metadata: Metadata
+}
+
+export class ResourceEvent<T extends HasMetadata>
+{
+    constructor (
+        public type: ResourceEventType,
+        public resources: T[]
+    ) {}
+}
+
+export class ResourceRepo<T extends HasMetadata>
+{
+    private resources: Ref<T[] | undefined> = ref(undefined);
+    private websocket?: AdvancedWebSocket;
+
+    static init<T extends HasMetadata>()
+    {
+        return new ResourceRepo<T>();
+    }
+
+    listen(resource: string)
+    {
+        WebsocketSession.get((token: string) => {
+            const webSocket = AdvancedWebSocket.open(StringUtils.format("%s/watch/%s/%s?token=%s", ApiConfig.getWsBase(), resource, this.getNamespace(), token),
+                (event) => {
+                    const data = JSON.parse(event.data) as ResourceEvent<T>;
+                    switch (data.type)
+                    {
+                        case ResourceEventType.INIT: 
+                        {
+                            this.add(data.resources);
+                            break;
+                        }
+                        case ResourceEventType.ADDED:
+                        {
+                            this.add(data.resources);
+                            break;
+                        }
+                        case ResourceEventType.MODIFIED:
+                        {
+                            this.update(data.resources);
+                            break;
+                        }
+                        case ResourceEventType.DELETED:
+                        {
+                            this.delete(data.resources);
+                            break;
+                        }
+                    }
+                }, 
+                () => { }
+            );
+            this.websocket = webSocket;
+        });
+    }
+
+    private add(resources: T[])
+    {
+        if (this.resources.value == null)
+        {
+            this.resources.value = [];
+        }
+        this.resources.value.push(...resources);
+    }
+
+    private delete(resources: T[])
+    {
+        if (this.resources.value == null)
+        {
+            this.resources.value = [];
+        }
+        for (const resource of resources)
+        {
+            const index = this.resources.value.findIndex(item => item.metadata.uid === resource.metadata.uid);
+            if (index != null)
+            {
+                this.resources.value.splice(index, 1);
+            }
+        }
+    }
+
+    private update(resources: T[])
+    {
+        if (this.resources.value == null)
+        {
+            this.resources.value = [];
+        }
+        for (const resource of resources)
+        {
+            const index = this.resources.value.findIndex(item => item.metadata.uid === resource.metadata.uid);
+            if (index != null)
+            {
+                this.resources.value[index] = resource;
+            }
+        }
+    }
+
+    load(resourceType: string)
+    {
+        this.refresh(resourceType);
+        return this;
+    }
+
+    clear() 
+    {
+        if (this.websocket)
+        {
+            this.websocket.close();
+        }
+    }
+
+    get()
+    {
+        return computed(() => {
+            if (this.resources.value)
+            {
+                return this.resources.value.toSorted((a, b) => a.metadata.name.localeCompare(b.metadata.name));
+            }
+            return undefined;
+        })
+    }
+
+    private refresh(resourceType: string)
+    {
+        const namespace = this.getNamespace();
+        let url = StringUtils.format("%s/resources/%s", ApiConfig.getHttpBase(), resourceType);
+        if (namespace)
+        {
+            url = StringUtils.format("%s/%s", url, namespace);
+        }
+        axios.get<T[]>(url)
+        .then((response) => {
+            this.resources.value = response.data;
+        });
+    }
+
+    private getNamespace()
+    {
+        return useRoute().params.namespace as string;
+    }
+}
\ No newline at end of file
diff --git a/classes/repo/WebsocketSession.ts b/classes/repo/WebsocketSession.ts
new file mode 100644
index 0000000..9b78eea
--- /dev/null
+++ b/classes/repo/WebsocketSession.ts
@@ -0,0 +1,16 @@
+import axios from "axios";
+
+export class WebsocketSession
+{
+    static get(onSucces: (token: string) => void)
+    {
+        axios.post<string>(ApiConfig.getHttpBase() + '/websocket-session', undefined, {
+            headers: {
+                Authorization: StringUtils.format("Bearer %s", requireToken())
+            }
+        })
+        .then((response) => {
+            onSucces(response.data);
+        });
+    }
+}
\ No newline at end of file
diff --git a/components/ConfigMapComponent.vue b/components/ConfigMapComponent.vue
index 9bafdd3..81307b6 100644
--- a/components/ConfigMapComponent.vue
+++ b/components/ConfigMapComponent.vue
@@ -2,16 +2,15 @@
     <div>
         <p class="grid-element">{{ configMap.metadata.name }}</p>
         <p class="grid-element">{{ configMap.metadata.namespace }}</p>
-        <p class="grid-element">{{ Object.keys(configMap.data).length }}</p>
+        <p class="grid-element"><span v-if="configMap.data">{{ Object.keys(configMap.data).length }}</span><span v-else>-</span></p>
         <div class="grid-element">
-            <ActionButton v-if="hasAnyRole(getUser(), ['admin', 'maintainer'])">delete</ActionButton>
+            <ActionButton>delete</ActionButton>
         </div>
     </div>
 </template>
 
 <script setup lang="ts">
 import type { ConfigMap } from '~/classes/ConfigMap';
-import { hasAnyRole } from '~/classes/User';
 
 defineProps<{
     configMap: ConfigMap
diff --git a/components/InspectSidebar.vue b/components/InspectSidebar.vue
index f4ed0ed..884b36d 100644
--- a/components/InspectSidebar.vue
+++ b/components/InspectSidebar.vue
@@ -1,20 +1,16 @@
 <template>
     <SidebarTemplate>
-            <div class="content-l" style="display: grid; grid-template-rows: auto 1fr; height: 100%;">
-                <h2>Kubooboo</h2>
-                <ScrollComponent>
-                    <div class="content-l">
-                        <div class="nav">
-                            <NuxtLink class="resources" v-for="[key, value] of resources" :to="getRoute(key, namespace)" :class="{ 'router-link-active': useRoute().params.resource === key }">{{ value }}</NuxtLink>
-                        </div>
-                        <div class="divider" :class="{ hide: !inNamespaceScopedResource }"></div>
-                        <div class="nav" :class="{ hide: !inNamespaceScopedResource }">
-                            <NuxtLink v-for="[key, value] in namespaces" class="namespace" :to="getRoute(resource, key)">{{ value }}</NuxtLink>
-                        </div>
-                    </div>
-                </ScrollComponent>
+        <ScrollComponent>
+            <div class="content-l">
+                <div class="nav">
+                    <NuxtLink class="resources" v-for="[key, value] of resources" :to="getRoute(key, namespace)" :class="{ 'router-link-active': useRoute().params.resource === key }">{{ value }}</NuxtLink>
+                </div>
+                <div class="divider" :class="{ hide: !inNamespaceScopedResource }"></div>
+                <div class="nav" :class="{ hide: !inNamespaceScopedResource }">
+                    <NuxtLink v-for="[key, value] in namespaces" class="namespace" :to="getRoute(resource, key)">{{ value }}</NuxtLink>
+                </div>
             </div>
-        
+        </ScrollComponent>
         <div class="left-center" v-if="user" @click="() => accountPopup.open()">
                 <UiIcon>account_circle</UiIcon>
                 <p>{{ user.username }}</p>
diff --git a/components/SidebarTemplate.vue b/components/SidebarTemplate.vue
index d4d055b..2c4ff7f 100644
--- a/components/SidebarTemplate.vue
+++ b/components/SidebarTemplate.vue
@@ -24,7 +24,7 @@
     cursor: pointer;
      white-space: nowrap;
 }
-.router-link-active {
+.resources.router-link-active, .namespace.router-link-active {
     background-color: var(--primary-color);
     color: white;
 }
diff --git a/components/TableComponent.vue b/components/TableComponent.vue
index 875943e..477261c 100644
--- a/components/TableComponent.vue
+++ b/components/TableComponent.vue
@@ -23,10 +23,4 @@ defineProps<{
     height: 100%;
     width: 100%;
 }
-</style>
-
-<style>
-.grid-element {
-    height: 2.25rem;
-}
 </style>
\ No newline at end of file
diff --git a/components/inspect/resources/ConfigMapList.vue b/components/inspect/resources/ConfigMapList.vue
index 6c74f1a..b4e2082 100644
--- a/components/inspect/resources/ConfigMapList.vue
+++ b/components/inspect/resources/ConfigMapList.vue
@@ -1,5 +1,5 @@
 <template>
-    <TableComponent :loading="configMaps == null">
+    <TableComponent :loading="configMaps == null" v-for="configMaps in [repo.get().value]">
         <div class="resource-container config-map-container">
             <div class="header">
                 <p>Name</p>
@@ -14,10 +14,15 @@
 
 <script setup lang="ts">
 import type { ConfigMap } from '~/classes/ConfigMap';
-import { ResourceRepo } from '~/classes/ResourceRepo';
-
-const configMaps = ResourceRepo.init<ConfigMap>().load('config-maps').get();
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 
+const repo = ResourceRepo.init<ConfigMap>();
+onMounted(() => {
+    repo.listen("config-maps");
+});
+onUnmounted(() => {
+    repo.clear();
+});
 </script>
 
 <style scoped>
diff --git a/components/inspect/resources/CustomResourceDefinitionList.vue b/components/inspect/resources/CustomResourceDefinitionList.vue
index aee0e51..7c6c14b 100644
--- a/components/inspect/resources/CustomResourceDefinitionList.vue
+++ b/components/inspect/resources/CustomResourceDefinitionList.vue
@@ -15,7 +15,7 @@
 
 <script setup lang="ts">
 import type { CustomResourceDefinition } from '~/classes/CustomResourceDefinition';
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 
 const customResourceDefinitions = ResourceRepo.init<CustomResourceDefinition>().load('custom-resource-definitions').get();
 </script>
diff --git a/components/inspect/resources/DeploymentList.vue b/components/inspect/resources/DeploymentList.vue
index 699f00b..0d5ff1f 100644
--- a/components/inspect/resources/DeploymentList.vue
+++ b/components/inspect/resources/DeploymentList.vue
@@ -14,7 +14,7 @@
 
 <script setup lang="ts">
 import type { Deployment } from '~/classes/Deployment';
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 import DeploymentComponent from '~/components/deployments/DeploymentComponent.vue';
 
 const deployments = ResourceRepo.init<Deployment>().load('deployments').get();
diff --git a/components/inspect/resources/IngressList.vue b/components/inspect/resources/IngressList.vue
index 60e8661..2a2d3ee 100644
--- a/components/inspect/resources/IngressList.vue
+++ b/components/inspect/resources/IngressList.vue
@@ -15,7 +15,7 @@
 
 <script setup lang="ts">
 import type { Ingress } from '~/classes/Ingress';
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 
 const ingresses = ResourceRepo.init<Ingress>().load('ingresses').get();
 </script>
diff --git a/components/inspect/resources/NodeList.vue b/components/inspect/resources/NodeList.vue
index 6efcce4..d3a109b 100644
--- a/components/inspect/resources/NodeList.vue
+++ b/components/inspect/resources/NodeList.vue
@@ -16,7 +16,7 @@
 
 <script setup lang="ts">
 import type { Node } from '~/classes/Node';
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 import NodeComponent from '~/components/NodeComponent.vue';
 
 const node = ResourceRepo.init<Node>().load('nodes').get();
diff --git a/components/inspect/resources/PodList.vue b/components/inspect/resources/PodList.vue
index b4a5f07..20d1854 100644
--- a/components/inspect/resources/PodList.vue
+++ b/components/inspect/resources/PodList.vue
@@ -17,7 +17,7 @@
 
 <script setup lang="ts">
 import type { Pod } from '~/classes/Pod';
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 import PodComponent from '~/components/pod/PodComponent.vue';
 
 const repo = ResourceRepo.init<Pod>();
diff --git a/components/inspect/resources/SecretList.vue b/components/inspect/resources/SecretList.vue
index b6ab6c0..ddfaeed 100644
--- a/components/inspect/resources/SecretList.vue
+++ b/components/inspect/resources/SecretList.vue
@@ -15,7 +15,7 @@
 </template>
 
 <script setup lang="ts">
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 import type { Secret } from '~/classes/Secret';
 import SecretComponent from '~/components/secrets/SecretComponent.vue';
 import SecretAddComponent from '~/components/secrets/SecretAddComponent.vue';
diff --git a/components/inspect/resources/ServiceList.vue b/components/inspect/resources/ServiceList.vue
index fff6f04..fd93a1c 100644
--- a/components/inspect/resources/ServiceList.vue
+++ b/components/inspect/resources/ServiceList.vue
@@ -13,7 +13,7 @@
 </template>
 
 <script setup lang="ts">
-import { ResourceRepo } from '~/classes/ResourceRepo';
+import { ResourceRepo } from '~/classes/repo/ResourceRepo';
 import type { Service } from '~/classes/Service';
 
 const services = ResourceRepo.init<Service>().load('services').get();
diff --git a/components/pod/PodComponent.vue b/components/pod/PodComponent.vue
index 7a19592..cf69e23 100644
--- a/components/pod/PodComponent.vue
+++ b/components/pod/PodComponent.vue
@@ -11,7 +11,7 @@
         <div class="grid-element action-buttons">
             <ActionButton @click="showLogPopup = true">text_snippet</ActionButton>
             <ActionButton>open_in_full</ActionButton>
-            <ActionButton @click="showDeletePopup = true" v-if="hasAnyRole(getUser(), ['admin', 'maintainer'])">delete</ActionButton>
+            <ActionButton @click="showDeletePopup = true">delete</ActionButton>
         </div>
         <PodDeletePopup v-if="showDeletePopup" :pod="pod" @close="showDeletePopup = false"></PodDeletePopup>
         <LogPopup v-if="showLogPopup" :pod="pod" @close="showLogPopup = false"></LogPopup>
@@ -22,7 +22,6 @@
 <script setup lang="ts">
 import type { Pod } from '~/classes/Pod';
 import { calcAge } from '~/classes/Pod';
-import { hasAnyRole } from '~/classes/User';
 import PodDeletePopup from './view/PodDeletePopup.vue';
 
 const props = defineProps<{
diff --git a/pages/account.vue b/pages/account.vue
index a4d1bf1..a8d6924 100644
--- a/pages/account.vue
+++ b/pages/account.vue
@@ -1,12 +1,18 @@
 <template>
     <div class="account-page">
-        <NuxtPage></NuxtPage>
         <div class="left-center footer">
-            <NuxtLink to="/account/inspect/nodes/_all">Inspect</NuxtLink>
-            <NuxtLink to="/account/monitorings/nodes">Monitorings</NuxtLink>
-            <NuxtLink to="/account/settings">Settings</NuxtLink>
-            <p class="pointer" @click="logout()">Logout</p>
+            <img class="logo" src="/assets/transparent_logo.png" alt="">
+            <div>
+                <h3>Kubooboo</h3>
+                <div class="left-center">
+                    <NuxtLink to="/account/inspect/nodes/_all">Inspect</NuxtLink>
+                    <NuxtLink to="/account/monitorings/nodes">Monitorings</NuxtLink>
+                    <NuxtLink to="/account/settings">Settings</NuxtLink>
+                    <p class="pointer" @click="logout()">Logout</p>
+                </div>
+            </div>
         </div>
+        <NuxtPage></NuxtPage>
     </div>
 </template>
 
@@ -22,10 +28,15 @@ function logout()
 .account-page {
     height: 100%;
     display: grid;
-    grid-template-rows: 1fr auto;
+    grid-template-rows: auto 1fr;
 }
 .footer {
-    background-color: rgb(235, 235, 235);
-    padding: 1rem;
+    background-color: var(--tile-color);
+    padding: 0.5rem;
+    border-bottom: 1px solid #c0d1ff;
+}
+.logo {
+    width: 2.5rem;
+    height: 2.5rem;
 }
 </style>
\ No newline at end of file