Cookie Fehler

Ausweis ohne Pfeile und Bedarfsausweis Nachricht überarbeitet.
Update Makefile
2024-11-20 12:24:04 +11:00 · 2024-11-20 12:15:19 +11:00 · 2024-11-14 15:23:18 +11:00 · 2024-11-14 15:08:07 +11:00 · 2024-11-14 15:05:25 +11:00 · 2024-11-13 13:29:44 +11:00
111 changed files with 2102940 additions and 632 deletions
--- a/.github/workflows/dev-pipeline.yml
+++ b/.github/workflows/dev-pipeline.yml
@@ -23,4 +23,4 @@ jobs:
            git clean -f -d
            git pull origin main
            git status
-            bash build.sh
+            make prod
--- a/.gitignore
+++ b/.gitignore
@@ -4,6 +4,9 @@ dist/
 # generated types
 .astro/

+# log files
+logs/
+
 # dependencies
 node_modules/

--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,6 +1,16 @@
+
+
 {
 	"i18n-ally.localesPaths": [
 		"public/locales"
 	],
-	"typescript.tsdk": "node_modules/typescript/lib"
+	"typescript.tsdk": "node_modules/typescript/lib",
+	"css.lint.unknownAtRules": "ignore",
+	"scss.lint.unknownAtRules": "ignore",
+	"less.lint.unknownAtRules": "ignore"
+}
+	"workbench.colorCustomizations": {
+		"minimap.background": "#00000000",
+		"scrollbar.shadow": "#00000000"
+	}
 }
--- a/GEG24_Wohngebaeude_ohne_pfeile.pdf
+++ b/GEG24_Wohngebaeude_ohne_pfeile.pdf
--- a/GEG_2024_Gesetzestext.pdf
+++ b/GEG_2024_Gesetzestext.pdf
--- a/Kontrollsystem-GEG-2023-V1_0.ts
+++ b/Kontrollsystem-GEG-2023-V1_0.ts
--- a/Kontrollsystem-GEG-2023-V1_0_zod.ts
+++ b/Kontrollsystem-GEG-2023-V1_0_zod.ts
--- a/Kontrollsystem-GEG-2023_V1.schema.json
+++ b/Kontrollsystem-GEG-2023_V1.schema.json
--- a/Kontrollsystem-GEG-2024_V1.schema.json
+++ b/Kontrollsystem-GEG-2024_V1.schema.json
--- a/54
+++ b/54
@@ -0,0 +1,54 @@
+.PHONY: dev database api online-energieausweis all prod bun-install-database bun-install-api
+
+online-energieausweis:
+	bun run dev
+
+dev: online-energieausweis api database
+
+database:
+	$(MAKE) -C ../database dev
+
+bun-install-database:
+	cd ../database
+	bun link
+	bun install
+
+bun-install-api: bun-install-database
+	cd ../api
+	bun install
+	bun link @ibcornelsen/database
+
+api:
+	$(MAKE) -C ../api dev
+
+all:
+	mkdir -p ~/logs
+	bun run dev 2>&1 | tee ~/logs/`date '+%d-%m-%Y_%H:%M:%S'`.log
+
+prod: bun-install-api bun-install-database
+	bun install
+	bun pm trust @ibcornelsen/database
+	mkdir -p ~/logs
+	mkdir -p ~/persistent/online-energieausweis
+	
+# Wir müssen sichergehen, dass der Database Container läuft, sonst können wir ihn nicht linken.
+	@if [ ! $$(docker ps | grep database | wc -l) -gt 0 ]; then \
+		cd ../database; \
+		$(MAKE) prod; \
+		cd ../online-energieausweis; \
+	fi
+	
+# Auch die API sollte bereits laufen
+	@if [ $$(pm2 pid api) -eq "0" ]; then \
+		cd ../api; \
+		$(MAKE) prod; \
+		cd ../online-energieausweis; \
+	fi
+
+	- rm -f ~/online-energieausweis/.env;
+	- touch ~/online-energieausweis/.env;
+	- echo "PRIVATE_KEY=$(cat /etc/letsencrypt/live/ibcornelsen.de/privkey.pem | base64 | tr -d '\n')" >> ~/online-energieausweis/.env;
+	- echo "CERTIFICATE=$(cat /etc/letsencrypt/live/ibcornelsen.de/fullchain.pem | base64 | tr -d '\n')" >> ~/online-energieausweis/.env;
+
+	- pm2 delete online-energieausweis
+	pm2 start --name "online-energieausweis" --log ~/logs/`date '+%d-%m-%Y_%H:%M:%S'`.log --time  bun -- astro dev
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -1,15 +1,12 @@
 import { defineConfig } from "astro/config";
 import svelte from "@astrojs/svelte";
 // import astroI18next from "astro-i18next";
-
 import tailwind from "@astrojs/tailwind";
-
-// https://astro.build/config
 import node from "@astrojs/node";
-
-// https://astro.build/config
 import mdx from "@astrojs/mdx";

+import { fileURLToPath } from "url";
+
 // https://astro.build/config 
 export default defineConfig({
  integrations: [svelte(), tailwind(), mdx()],
@@ -18,6 +15,19 @@ export default defineConfig({
  vite: {
    optimizeDeps: {
      exclude: ["@ibcornelsen/api", "@ibcornelsen/database"]
+    },
+    resolve: {
+      alias: {
+        "#": fileURLToPath(new URL("./src", import.meta.url))
+      }
+    },
+		ssr: {
+			noExternal: ["@pdfme/generator", "@pdfme/common", "@pdfme/schemas"]
+		},
+    build: {
+      commonjsOptions: {
+        transformMixedEsModules: false
+      }
    }
  },
  adapter: node({
--- a/build.sh
+++ b/build.sh
@@ -14,32 +14,24 @@ DB_PORT=5432
 # ausgeführt zu werden. Außerdem würde es nicht wirklich Sinn ergeben, wenn das
 # Build Skript sich die Änderungen am build Skript holen würde...
 # Wir müssen alle lokalen Pakete verlinken
+
+# --------------------------------- Database --------------------------------- #
+
 cd ../database
 bun link
-cd ../api
-bun link
-cd ../ui
-bun link
-cd ../database
 bun install
+
+# ------------------------------------ API ----------------------------------- #
+
 cd ../api
 bun install
-cd ../ui
-bun install
+bun link @ibcornelsen/database
+
+# ------------------------------------ APP ----------------------------------- #
+
 cd ../$APP_NAME
-
-
-# Als erstes linken wir das package mit bun, damit wir z.B. in online-energieausweis darauf zugreifen können.
-bun link
-# Dann installieren wir noch einmal alle dependencies, das ist besonders wichtig
-# falls wir lokal verlinkte Projekte haben, sonst werden die nicht in unser
-# docker image übernommen
 bun install
-
-# Dann stoppen wir unser altes docker image und bauen es neu.
-docker stop $APP_NAME
-docker rm $APP_NAME
-docker build -t $APP_NAME .
+bun link @ibcornelsen/database

 # Jeder unserer Applikationen hat ein Verzeichnis in dem alle Dateien dauerhaft,
 # Versionsunabhängig gespeichert werden. Dieses legen wir hier an, falls es noch
@@ -48,16 +40,32 @@ PERSISTENT_DIR="${HOME}/persistent/${APP_NAME}";
 mkdir -p $PERSISTENT_DIR;

 # TODO: Wir legen hier die .env Datei an, die die SSL Zertifikate enthält.
-# rm -f ~/$APP_NAME/.env;
-# touch ~/$APP_NAME/.env;
-# echo "PRIVATE_KEY=$(cat /etc/letsencrypt/live/ibcornelsen.de/privkey.pem | base64 | tr -d '\n')" >> ~/$APP_NAME/.env;
-# echo "CERTIFICATE=$(cat /etc/letsencrypt/live/ibcornelsen.de/fullchain.pem | base64 | tr -d '\n')" >> ~/$APP_NAME/.env;
+rm -f ~/$APP_NAME/.env;
+touch ~/$APP_NAME/.env;
+echo "PRIVATE_KEY=$(cat /etc/letsencrypt/live/ibcornelsen.de/privkey.pem | base64 | tr -d '\n')" >> ~/$APP_NAME/.env;
+echo "CERTIFICATE=$(cat /etc/letsencrypt/live/ibcornelsen.de/fullchain.pem | base64 | tr -d '\n')" >> ~/$APP_NAME/.env;
+
+# Wir müssen sichergehen, dass der Database Container läuft, sonst können wir ihn nicht linken.
+if [ ! $((docker ps | grep $DB_CONTAINER_NAME) | wc -l) -gt 0 ]; then
+	cd ../database;
+	bash build.sh;
+	cd ../$APP_NAME;
+fi
+
+# Auch die API sollte bereits laufen
+if [ $(pm2 pid api) -eq "0" ]; then
+	cd ../api;
+	make prod;
+	cd ../$APP_NAME;
+fi

 # Jetzt wo wir alle Vorbereitungen getroffen haben, starten wir das Docker Image und linken es mit der Datenbank.
-docker run -d --name $APP_NAME --link $DB_CONTAINER_NAME \
-	-v "${PERSISTENT_DIR}:/persistent" \
-	-v "./node_modules/@ibcornelsen/database:/${APP_NAME}/node_modules/@ibcornelsen/database" \
-	-v "./node_modules/@ibcornelsen/api:/${APP_NAME}/node_modules/@ibcornelsen/api" \
-	-v "./node_modules/@ibcornelsen/ui:/${APP_NAME}/node_modules/@ibcornelsen/ui" \
-	-p "${APP_PORT}:3000" \
-	$APP_NAME;
+# docker run -d --name $APP_NAME --link $DB_CONTAINER_NAME \
+# 	-v "${PERSISTENT_DIR}:/persistent" \
+# 	-v "./node_modules/@ibcornelsen/database:/${APP_NAME}/node_modules/@ibcornelsen/database" \
+# 	-v "./node_modules/@ibcornelsen/api:/${APP_NAME}/node_modules/@ibcornelsen/api" \
+# 	-v "./node_modules/@ibcornelsen/ui:/${APP_NAME}/node_modules/@ibcornelsen/ui" \
+# 	-p "${APP_PORT}:3000" \
+# 	$APP_NAME;
+
+make prod
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -20,7 +20,7 @@ services:
    extends:
      file: ../api/docker-compose.yml
      service: ibcornelsen-api
-  ibcornelsen-database:
+  database:
    extends:
      file: ../database/docker-compose.yml
-      service: ibcornelsen-database
+      service: database
--- a/package.json
+++ b/package.json
@@ -5,8 +5,8 @@
  "type": "module",
  "scripts": {
    "dev": "bun astro dev",
-    "build": "bun --bun astro build",
-    "preview": "bun --bun astro preview",
+    "build": "bun astro build",
+    "preview": "bun astro preview",
    "astro": "astro",
    "test:e2e": "cypress run",
    "test:unit": "bun test",
@@ -17,71 +17,60 @@
  },
  "private": true,
  "dependencies": {
-    "@astrojs/mdx": "^2.1.1",
-    "@astrojs/node": "^5.1.4",
+    "@astrojs/mdx": "^3.1.9",
+    "@astrojs/node": "^8.3.4",
    "@astrojs/svelte": "^2.2.0",
    "@astrojs/tailwind": "^3.1.3",
    "@ibcornelsen/api": "link:@ibcornelsen/api",
    "@ibcornelsen/database": "link:@ibcornelsen/database",
    "@ibcornelsen/ui": "^0.0.2",
    "@mollie/api-client": "^3.7.0",
-    "@pdfme/common": "^3.2.3",
-    "@pdfme/generator": "^3.2.3",
-    "@pdfme/ui": "^3.2.3",
-    "@trpc/client": "^10.45.0",
-    "@trpc/server": "^10.45.0",
-    "astro": "^2.5.1",
+    "@pdfme/common": "^5.1.7",
+    "@pdfme/generator": "^5.1.7",
+    "@pdfme/ui": "^5.1.7",
+    "@trpc/client": "^10.45.2",
+    "@trpc/server": "^10.45.2",
+    "astro": "^4.16.10",
    "astro-i18next": "1.0.0-beta.21",
-    "astro-spa": "^1.3.9",
    "body-scroll-lock": "^4.0.0-beta.0",
    "buffer": "^6.0.3",
-    "bun": "^1.0.2",
-    "cookiejs": "^2.1.2",
+    "bun": "^1.1.34",
    "csvtojson": "^2.0.10",
-    "esbuild": "^0.18.17",
-    "express": "^4.18.2",
-    "flag-icons": "^6.9.2",
-    "fontkit": "^2.0.2",
-    "i18next": "^23.4.1",
-    "i18next-fs-backend": "^2.1.5",
-    "i18next-http-backend": "^2.2.1",
-    "jimp": "^0.22.8",
+    "express": "^4.21.1",
+    "flag-icons": "^6.15.0",
+    "fontkit": "^2.0.4",
+    "i18next": "^23.16.5",
+    "i18next-fs-backend": "^2.3.2",
+    "i18next-http-backend": "^2.6.2",
    "js-cookie": "^3.0.5",
-    "jwt-simple": "^0.5.6",
-    "katex": "^0.16.7",
-    "knex": "^2.4.2",
-    "moment": "^2.29.4",
-    "moment-timezone": "^0.5.45",
-    "pg": "^8.11.0",
+    "js-interpolate": "^1.0.1",
+    "katex": "^0.16.11",
+    "moment": "^2.30.1",
+    "moment-timezone": "^0.5.46",
    "radix-svelte-icons": "^1.0.0",
-    "remark-frontmatter": "^5.0.0",
-    "sass": "^1.62.1",
-    "svelte": "^3.59.1",
+    "sass": "^1.80.6",
+    "svelte": "^3.59.2",
    "svelte-dialogs": "^1.2.2",
-    "svelte-katex": "^0.1.2",
-    "svelte-preprocess": "^5.0.3",
-    "svelte-ripple-action": "^1.0.5",
-    "svelte-tabs": "^1.1.0",
-    "tailwindcss": "^3.3.2",
+    "svelte-preprocess": "^5.1.4",
+    "svelte-ripple-action": "^1.0.6",
+    "tailwindcss": "^3.4.14",
    "trpc-openapi": "^1.2.0",
-    "uuid": "^9.0.0",
-    "uuid-validate": "^0.0.3",
-    "vite-tsconfig-paths": "^4.2.0",
-    "zod": "^3.22.4"
+    "uuid": "^9.0.1",
+    "zod": "^3.23.8"
  },
  "devDependencies": {
-    "@faker-js/faker": "^8.3.1",
-    "@tailwindcss/typography": "^0.5.10",
+    "@faker-js/faker": "^8.4.1",
+    "@tailwindcss/typography": "^0.5.15",
    "@types/body-scroll-lock": "^3.1.2",
-    "@types/fontkit": "^2.0.6",
+    "@types/fontkit": "^2.0.7",
    "@types/js-cookie": "^3.0.6",
-    "@types/uuid": "^9.0.1",
-    "@typescript-eslint/eslint-plugin": "^5.59.6",
-    "@typescript-eslint/parser": "^5.59.6",
-    "bun-types": "^1.0.22",
-    "cypress": "^13.6.2",
+    "@types/uuid": "^9.0.8",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "bun-types": "^1.1.34",
+    "cypress": "^13.15.2",
    "cypress-file-upload": "^5.0.8",
-    "daisyui": "^4.6.0",
+    "daisyui": "^4.12.14",
    "eslint": "~8.15.0",
    "eslint-config-prettier": "8.1.0",
    "prettier": "^2.8.8",
--- a/public/fonts/Antique
+++ b/public/fonts/Antique
--- a/Compact.woff2Zone.Identifier
+++ b/Compact.woff2Zone.Identifier
--- a/public/fonts/Antique-Olive-Std-Compact_3864.ttf
+++ b/public/fonts/Antique-Olive-Std-Compact_3864.ttf
--- a/public/fonts/Antique-Olive-Std-Compact_3864.ttfZone.Identifier
+++ b/public/fonts/Antique-Olive-Std-Compact_3864.ttfZone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\antique-olive-std.zip
--- a/public/fonts/HeronSans-Light.woff2
+++ b/public/fonts/HeronSans-Light.woff2
--- a/public/fonts/HeronSans-Light.woff2Zone.Identifier
+++ b/public/fonts/HeronSans-Light.woff2Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/fonts/HeronSans-Regular.eot
+++ b/public/fonts/HeronSans-Regular.eot
--- a/public/fonts/HeronSans-Regular.eotZone.Identifier
+++ b/public/fonts/HeronSans-Regular.eotZone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/fonts/HeronSans-Regular.ttf
+++ b/public/fonts/HeronSans-Regular.ttf
--- a/public/fonts/HeronSans-Regular.ttfZone.Identifier
+++ b/public/fonts/HeronSans-Regular.ttfZone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/fonts/HeronSans-Regular.woff
+++ b/public/fonts/HeronSans-Regular.woff
--- a/public/fonts/HeronSans-Regular.woff2
+++ b/public/fonts/HeronSans-Regular.woff2
--- a/public/fonts/HeronSans-Regular.woff2Zone.Identifier
+++ b/public/fonts/HeronSans-Regular.woff2Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/fonts/HeronSans-Regular.woffZone.Identifier
+++ b/public/fonts/HeronSans-Regular.woffZone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/fonts/HeronSansCond-SemiBold.woff2
+++ b/public/fonts/HeronSansCond-SemiBold.woff2
--- a/public/fonts/HeronSansCond-SemiBold.woff2Zone.Identifier
+++ b/public/fonts/HeronSansCond-SemiBold.woff2Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=C:\Users\all\Downloads\font (1).zip
--- a/public/images/header/UMBE_IBC-logo.ai
+++ b/public/images/header/UMBE_IBC-logo.ai
--- a/public/images/header/UMBE_IBC-logo.svg
+++ b/public/images/header/UMBE_IBC-logo.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="uuid-47fa9869-0485-4cc8-baa7-a95e76b06552" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520.36 163.25">
+  <defs>
+    <style>
+      .uuid-92c00f1f-4426-4074-bca2-c6271f6d612c {
+        fill: #878787;
+      }
+
+      .uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7 {
+        fill: #445096;
+      }
+    </style>
+  </defs>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m19.04,143.74H4.66V62.52h14.38v81.22Z"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m85.78,127.21c0,4.79-1.27,8.69-3.8,11.71-2.74,3.15-6.43,4.72-11.09,4.72h-36.45v-14.38h3.59v-52.37h-3.59v-14.38h36.45c4.65,0,8.35,1.58,11.09,4.72,2.53,3.01,3.8,6.91,3.8,11.71v10.99c0,5.96-1.82,10.3-5.44,13.04,3.63,3.01,5.44,7.43,5.44,13.25v10.99Zm-14.38-36.04v-9.34c0-3.22-1.71-4.83-5.13-4.83h-13.86v19h14.07c3.29,0,4.93-1.61,4.93-4.83Zm0,33.37v-9.24c0-1.44-.46-2.62-1.39-3.54s-2.11-1.39-3.54-1.39h-14.07v19h13.86c3.42,0,5.13-1.61,5.13-4.83Z"/>
+  <path class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" d="m180.38,82.09h-16.06c-3.68,0-6.59,1.23-8.64,3.66-2.03,2.4-3.06,5.46-3.06,9.1v36.14c0,3.64,1.03,6.7,3.06,9.1,2.06,2.43,4.96,3.66,8.64,3.66h16.06c3.68,0,6.58-1.23,8.64-3.66,2.03-2.4,3.06-5.49,3.06-9.19v-35.95c0-3.7-1.03-6.8-3.06-9.19-2.06-2.43-4.97-3.66-8.64-3.66Zm-.23,14.95v31.74c0,2.09-.99,3.02-3.21,3.02h-9.08c-2.29,0-3.31-.93-3.31-3.02v-31.74c0-2.09,1.02-3.02,3.31-3.02h9.08c2.22,0,3.21.93,3.21,3.02Z"/>
+  <path class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" d="m238.17,115.66c2.28-2.15,3.44-5.07,3.44-8.67v-12.24c0-3.38-.91-6.24-2.71-8.5-2.15-2.76-5.28-4.16-9.28-4.16h-27.48v61.65h11.93v-24.86h5.84l9.18,24.86h12.78l-9.42-25.19c2.22-.47,4.14-1.44,5.71-2.89Zm-8.49-18.42v6.41c0,2.29-.93,3.31-3.02,3.31h-12.58v-12.92h12.58c2.09,0,3.02.99,3.02,3.21Z"/>
+  <polygon class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" points="279.2 115 262.79 82.09 251.67 82.09 251.67 143.74 263.6 143.74 263.6 110.73 280.1 143.74 291.13 143.74 291.13 82.09 279.2 82.09 279.2 115"/>
+  <polygon class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" points="302.42 143.74 338.21 143.74 338.21 131.81 314.35 131.81 314.35 118.88 331.18 118.88 331.18 106.95 314.35 106.95 314.35 94.02 338.21 94.02 338.21 82.09 302.42 82.09 302.42 143.74"/>
+  <polygon class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" points="358.97 82.09 347.04 82.09 347.04 143.74 380.37 143.74 380.37 131.81 358.97 131.81 358.97 82.09"/>
+  <path class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" d="m414.23,82.09h-15.78c-3.68,0-6.63,1.3-8.78,3.85-1.94,2.27-2.92,5.23-2.92,8.81v10.04c0,6.66,3.56,10.97,10.63,12.84l13.93,2.77c2.03.51,2.98,1.84,2.98,4.19v3.82c0,2.32-1.14,3.4-3.59,3.4h-8.6c-2.32,0-3.4-1.17-3.4-3.69v-.79l-11.93,2.98v.48c0,3.9,1.07,7.06,3.17,9.4,2.12,2.35,5.06,3.55,8.73,3.55h15.01c8.34,0,12.56-4.39,12.56-13.04v-8.13c0-4.02-.92-7.14-2.72-9.28-1.61-1.94-4.23-3.36-7.81-4.23l-14.28-2.76c-1.86-.56-2.72-1.74-2.72-3.72v-5.35c0-2.22,1.05-3.21,3.4-3.21h8.32c2.65,0,3.88,1.2,3.88,3.79v.79l11.93-2.98v-.48c0-3.56-.91-6.55-2.71-8.88-2.09-2.76-5.21-4.16-9.28-4.16Z"/>
+  <polygon class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" points="436.27 143.74 472.06 143.74 472.06 131.81 448.2 131.81 448.2 118.88 465.03 118.88 465.03 106.95 448.2 106.95 448.2 94.02 472.06 94.02 472.06 82.09 436.27 82.09 436.27 143.74"/>
+  <polygon class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" points="508.42 82.09 508.42 115 492.02 82.09 480.89 82.09 480.89 143.74 492.82 143.74 492.82 110.73 509.33 143.74 520.36 143.74 520.36 82.09 508.42 82.09"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m19.04,76.89v-14.38h3.68v14.38h-3.68Z"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m.98,76.89v-14.38h3.68v14.38H.98Z"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m19.04,143.74v-14.38h3.68v14.38h-3.68Z"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m.98,143.74v-14.38h3.68v14.38H.98Z"/>
+  <path class="uuid-92c00f1f-4426-4074-bca2-c6271f6d612c" d="m125.96,129.36h-11.81c-3.56,0-5.34-1.64-5.34-4.93v-43.14c0-3.29,1.78-4.93,5.34-4.93h11.81c3.63,0,5.44,1.92,5.44,5.75h13.06c.01-7.39-.04-12.68-2.74-15.66-2.71-2.98-6.42-4.47-11.14-4.47h-21.05c-5.07,0-8.93,1.71-11.6,5.13-2.33,2.88-3.49,6.61-3.49,11.19v49.09c0,4.59,1.16,8.32,3.49,11.19,2.67,3.42,6.54,5.13,11.6,5.13h21.05c4.72,0,8.44-1.49,11.14-4.47,2.7-2.98,2.75-8.27,2.74-15.66h-13.06c0,3.83-1.81,5.75-5.44,5.75Z"/>
+  <polygon class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" points="91.86 13.59 72.72 0 53.59 13.59 .98 51.58 20.12 51.58 72.72 13.59 125.33 51.58 144.46 51.58 91.86 13.59"/>
+  <path class="uuid-3ec9ac84-c90e-408d-a733-809f91ec0ac7" d="m0,163.25v-9.33h520.36v9.33H0Z"/>
+</svg>
--- a/public/images/header/UMBE_logo-big.svg
+++ b/public/images/header/UMBE_logo-big.svg
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="uuid-de1e7f63-0c42-470b-9cfb-9abb297e0f12" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 397.06 123.91">
+  <defs>
+    <style>
+      .uuid-57d3d2d7-df3c-47fe-8d1b-3ad7a5cb5fac {
+        fill: #3d46a3;
+      }
+
+      .uuid-57d3d2d7-df3c-47fe-8d1b-3ad7a5cb5fac, .uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd {
+        fill-rule: evenodd;
+      }
+
+      .uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd {
+        fill: #848b91;
+      }
+
+      .uuid-437b8d44-715a-4bf2-8481-68132d40d3d1 {
+        fill: #3b459d;
+      }
+    </style>
+  </defs>
+  <g id="uuid-82d1ab86-69f5-424d-b90e-8bdf256bee5f" data-name="g5671">
+    <path id="uuid-cd6aa3b9-6f05-490c-8ef2-3571588b94a7" data-name="path5677" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m99.93,93.22c3.87.98,7.67,1.93,11.49,2.9-.04,3.86-.82,7.4-3.68,10.17-2.28,2.21-5.11,3.09-8.21,3.1-5.91.03-11.81,0-17.72.01-7,.01-11.01-5.12-11.63-10.69-.09-.84-.12-1.69-.12-2.54,0-13.17-.03-26.35,0-39.53,0-3.58,1.08-6.81,3.6-9.45,2.13-2.23,4.84-3.17,7.85-3.19,6.05-.05,12.09-.08,18.13,0,7.76.11,10.93,5.38,11.61,10.8.1.82.13,1.65.2,2.54-3.85,1-7.66,1.99-11.53,2.99-.04-.35-.08-.63-.11-.92-.19-2.18-1.57-3.6-3.76-3.8-.82-.08-1.65-.08-2.48-.09-2.47-.01-4.94-.01-7.41,0-.49,0-.99.03-1.47.13-2.07.4-3.09,1.74-3.11,4.11-.02,1.48,0,3.78,0,3.78,0,.37,0,.97,0,1.33v28.55c0,3.1,3.75,4.22,3.75,4.22.35.1.94.19,1.31.19h8.7c2.79,0,4.23-1.3,4.52-4.08.01-.15.05-.31.09-.53"/>
+    <path id="uuid-b7a5e321-3bac-4878-8e16-b5a91ac6964f" data-name="path5679" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m211.34,64.04c0-.37.3-.67.67-.67h6.75c.37,0,.67.3.67.67v44.72c0,.37-.3.67-.67.67h-.27c-2.05,0-4.11,0-6.16,0-.34,0-.52-.08-.68-.4-3.19-6.37-6.4-12.73-9.6-19.09-1.09-2.17-2.18-4.34-3.28-6.5l-.06-.12c-.13-.21-.24-.08-.24.29v25.13c0,.37-.3.67-.67.67h-6.76c-.37,0-.67-.3-.67-.67v-44.72c0-.37.3-.67.67-.67h.52c1.96,0,3.91.01,5.87-.01.44,0,.66.14.85.53,4.22,8.42,8.45,16.83,12.68,25.24.09.17.18.34.38.49v-25.54Z"/>
+    <path id="uuid-14d91d42-52e1-4383-912b-718d5552121d" data-name="path5681" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m397.06,108.76c0,.37-.3.67-.67.67,0,0-3.92,0-6.19-.02-.17,0-.39-.22-.49-.39-1.31-2.57-2.6-5.14-3.9-7.71-2.99-5.94-5.99-11.88-8.98-17.82l-.07-.13c-.13-.22-.25-.1-.25.27v25.09c0,.37-.3.67-.67.67h-6.77c-.37,0-.67-.3-.67-.67v-44.71c0-.37.29-.67.64-.67,2.13,0,4.26.01,6.4-.01.47,0,.69.15.89.56,4.25,8.49,8.52,16.97,12.78,25.45l.04.09c.1.18.17.03.17-.34v-25.03c0-.37.3-.67.67-.67h6.37c.37,0,.67.3.67.67v44.71Z"/>
+    <path id="uuid-5673c601-d2a1-4ccc-9646-350f9c0c153c" data-name="path5683" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m162.87,81.63c0,.37.19.68.41.7h.17c3.14,0,6.28,0,9.42,0,1.76,0,2.81-1.02,2.84-2.78.02-1.76.03-3.52,0-5.27-.03-1.87-.99-2.78-2.86-2.79-3.14,0-8.75,0-8.75,0h-.95c-.15,0-.28.3-.28.67v9.48Zm-.02,8.83v18.26c0,.37-.3.67-.67.67h-6.77c-.37,0-.67-.3-.67-.67v-45.32c.1-.02.21-.06.33-.06,6.81,0,13.63,0,20.44,0,5.36,0,8.25,4.29,8.33,8.38.07,3.67.06,7.35,0,11.02-.06,3.49-2.61,6.54-6.05,7.37-.3.07-.61.13-.99.22,2.36,6.38,6.83,18.45,6.83,18.45.13.34-.07.62-.44.62h-8.05c-.49-1.31-.99-2.63-1.48-3.96-1.81-4.84-3.61-9.69-5.43-14.52-.07-.19-.32-.44-.48-.45-1.6-.03-3.19-.02-4.89-.02"/>
+    <path id="uuid-53215661-af4c-482b-aabe-0c99430e6b10" data-name="path5685" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m140.12,87.07v-12.52c0-2.14-.93-3.07-3.08-3.07-2.19,0-4.39,0-6.58,0-2.31,0-3.25.94-3.26,3.23,0,7.8,0,15.6,0,23.41,0,.3,0,.6.05.89.19,1.27.91,2.01,2.18,2.23.33.06.67.09,1,.09,2.18,0,4.35,0,6.52,0,2.22,0,3.15-.93,3.16-3.13v-11.13Zm-21.01-.68c0-4.72,0-9.44,0-14.16,0-1.62.32-3.18,1.07-4.63,1.42-2.7,3.68-4.17,6.71-4.23,4.52-.08,9.05-.11,13.57,0,4.15.11,7.01,2.88,7.6,7.08.1.68.15,1.38.15,2.07,0,9.3,0,18.6,0,27.91,0,1.62-.28,3.18-1,4.65-1.36,2.78-3.65,4.25-6.7,4.31-4.56.09-9.12.07-13.69,0-3.85-.05-6.91-2.9-7.54-6.9-.12-.72-.17-1.45-.17-2.18-.01-4.64,0-9.28,0-13.92"/>
+    <path id="uuid-937e127c-2f65-47a9-a395-3fa2a236bc9d" data-name="path5687" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m318.19,74.78c-.02-.2-.03-.35-.04-.51-.21-1.69-1.23-2.72-2.94-2.75-2.43-.06-4.86-.05-7.29,0-1.59.04-2.49.91-2.58,2.51-.08,1.61-.08,3.24,0,4.85.09,1.6,1.12,2.64,2.69,2.93,3.51.67,7.02,1.31,10.52,2.03,2.2.46,4.22,1.31,5.73,3.09,1.16,1.36,1.82,2.97,1.87,4.71.1,3.55.28,7.13-.05,10.64-.45,4.66-3.4,7.07-8.11,7.13-4.15.04-8.29.02-12.44.01-4.49-.01-7.62-2.77-8.22-7.23-.08-.57-.08-1.14-.14-1.71-.03-.33.12-.45.41-.52,2.52-.63,5.05-1.26,7.66-1.92.03.2.07.38.08.57.18,1.71.95,2.61,2.66,2.67,2.54.09,5.1.07,7.64-.03,1.55-.06,2.44-1.06,2.52-2.62.06-1.3.06-2.61,0-3.91-.09-1.67-1.11-2.73-2.85-3.07-3.25-.64-6.51-1.25-9.76-1.93-2.47-.51-4.7-1.49-6.39-3.46-1.38-1.61-1.94-3.51-1.96-5.58-.03-2.92-.06-5.85,0-8.77.08-3.4,1.49-6.09,4.54-7.77,1.09-.6,2.31-.8,3.55-.8,4.27-.01,8.54-.02,12.8,0,2.22.01,4.2.68,5.75,2.36,1.73,1.88,2.43,4.16,2.46,6.68,0,.16-.2.43-.35.48-2.5.66-5,1.28-7.51,1.92-.05.01-.12,0-.24-.01"/>
+    <path id="uuid-e21f2cfb-411b-47e9-92a5-77307d1bfbcb" data-name="path5689" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m332.82,64.04c0-.37.3-.67.67-.67h27.74c.37,0,.67.3.67.67v6.78c0,.37-.3.67-.67.67h-19.6c-.37,0-.67.3-.67.67v9.51c0,.37.3.67.67.67h11.43c.37,0,.67.3.67.67v6.79c0,.37-.3.67-.67.67h-11.42c-.37,0-.67.3-.67.67v9.55c0,.37.3.67.67.67h19.6c.37,0,.67.3.67.67v6.74c0,.37-.3.67-.67.67h-27.74c-.37,0-.67-.3-.67-.67v-44.69Z"/>
+    <path id="uuid-bb067a0a-0347-44e8-8866-09b23461da83" data-name="path5691" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m225.99,64.04c0-.37.3-.67.67-.67h27.74c.37,0,.67.3.67.67v6.77c0,.37-.3.67-.67.67h-19.63c-.37,0-.67.3-.67.67v9.53c0,.37.3.67.67.67h11.45c.37,0,.67.3.67.67v6.77c0,.37-.3.67-.67.67h-11.44c-.37,0-.67.3-.67.67v9.55c0,.37.3.67.67.67h19.63c.37,0,.67.3.67.67v6.75c0,.37-.3.67-.67.67h-27.74c-.37,0-.67-.3-.67-.67v-44.69Z"/>
+    <path id="uuid-bcbd012e-62b7-41a4-ac44-152f7811e7ac" data-name="path5693" class="uuid-d0147991-ce0b-4fcb-96a0-249b70e67fbd" d="m262.25,109.4c-.37,0-.67-.3-.67-.67v-44.69c0-.37.3-.67.67-.67h6.75c.37,0,.67.3.67.67v36.62c0,.37.3.67.67.67h19.66c.37,0,.67.3.67.67v6.73c0,.37-.3.67-.67.67h-27.75Z"/>
+    <path id="uuid-7c380c1e-6c63-46da-a6e6-562299827e44" data-name="path5695" class="uuid-57d3d2d7-df3c-47fe-8d1b-3ad7a5cb5fac" d="m35.62,70.1c0,.37.3.67.67.67h10.47c.31,0,.61,0,.92-.03,2.07-.18,3.35-1.55,3.4-3.74.05-2.62.05-5.24,0-7.87-.03-2.01-1.07-3.22-2.95-3.6-.44-.09-.88-.14-1.33-.14-3.46-.01-6.91,0-10.38,0-.27,0-.53.02-.8.03v14.67Zm.01,27.11c0,.37.16.69.36.72h.16c3.68,0,7.36.03,11.04,0,2.45-.02,3.86-1.47,3.89-3.95.03-2.48.02-4.96,0-7.44-.01-2.77-1.42-4.16-4.19-4.17-3.46,0-9.7,0-9.7,0h-1.11c-.25,0-.45.3-.45.67v14.18Zm-14.49,12.16v-10.83c0-.37.3-.67.67-.67h1.49c.37,0,.67-.3.67-.67v-41.21c0-.37-.3-.67-.67-.67h-1.47c-.37,0-.67-.3-.67-.67v-10.31c0-.37.3-.67.67-.67h.31c9.51,0,19.03,0,28.54,0,7.85,0,11.41,5.3,11.81,10.93.32,4.58.19,9.2.02,13.79-.12,3.2-1.57,5.89-4.3,8.12.37.26.72.45.99.72,2.5,2.6,3.42,5.85,3.47,9.34.06,3.93.11,7.87-.16,11.79-.3,4.18-2.07,7.67-5.95,9.77-1.52.83-3.18,1.25-4.9,1.26-10.07.03-20.15.02-30.21.02-.08,0-.16-.03-.29-.06"/>
+    <path id="uuid-0d8d7c4b-cae8-4bbd-9433-4cfb06ef99b2" data-name="path5697" class="uuid-57d3d2d7-df3c-47fe-8d1b-3ad7a5cb5fac" d="m11.78,108.73c0,.37-.3.67-.67.67H.99c-.37,0-.67-.3-.67-.67V44.42c0-.37.3-.67.67-.67h10.13c.37,0,.67.3.67.67v64.31Z"/>
+    <path id="uuid-0c4facb8-29f9-41ca-a997-e50d301bb8a6" data-name="path5707" class="uuid-57d3d2d7-df3c-47fe-8d1b-3ad7a5cb5fac" d="m395.33,117.25c.76,0,1.38.3,1.38.67v5.33c0,.37-.62.67-1.38.67H1.55c-.76,0-1.38-.3-1.38-.67v-5.33c0-.37.62-.67,1.38-.67h393.78Z"/>
+    <path id="uuid-e70966d7-5260-4673-943b-995e2f50ff74" data-name="path5713" class="uuid-437b8d44-715a-4bf2-8481-68132d40d3d1" d="m50.17.41c-.5,0-1.03.21-1.58.58C32.8,11.81,17.01,22.61,1.17,33.36c-1,.68-1.31,1.36-.96,2.5h12.71c11.93-8.13,23.88-16.25,35.79-24.42,1.1-.76,2.01-.74,3.08-.04,12.53,8.17,25.05,16.31,37.58,24.46h13.08c.3-1.05.17-1.76-.83-2.42C84.96,22.63,68.36,11.8,51.71.95c-.54-.35-1.04-.55-1.54-.54"/>
+  </g>
+</svg>
--- a/public/images/pattern.png
+++ b/public/images/pattern.png
--- a/public/images/right-sidebar/UMBE_gewerbe-1.svg
+++ b/public/images/right-sidebar/UMBE_gewerbe-1.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 272 112">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #445096;
+      }
+
+      .cls-1, .cls-2, .cls-3 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #c6c6c6;
+      }
+
+      .cls-4 {
+        display: none;
+      }
+
+      .cls-3 {
+        fill: #ff7d26;
+      }
+    </style>
+  </defs>
+  <g id="Ebene_1" data-name="Ebene 1">
+    <g class="cls-4">
+      <path class="cls-1" d="M63.1,66L104.8,11.6l52.2,63.6s72.2,24.3,98.8-11.4l-26.6-38.8-27.2-4.4V0h-19.8v39.7h-7.1v-22.8L102.5,4l-39.4,62Z"/>
+      <polygon class="cls-1" points="73.5 39.1 92.7 14.2 48.4 14.2 11.1 72.9 50 19.2 73.5 39.1"/>
+      <g>
+        <rect class="cls-2" x="91.5" y="35.3" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="104.3" y="35.3" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="91.5" y="49.5" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="104.3" y="49.5" width="11.3" height="12.7"/>
+      </g>
+      <g>
+        <rect class="cls-2" x="41.9" y="35.4" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="49" y="35.4" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="41.9" y="45.3" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="49" y="45.3" width="5.7" height="8.5"/>
+      </g>
+    </g>
+    <path class="cls-3" d="M273,66c-1.3,6-4.1,11.6-7.5,16.7-3.5,5.1-7.8,9.7-12.7,13.5-4.9,3.9-10.4,6.9-16.2,9.3-5.8,2.3-11.8,3.9-17.9,5-12.3,2-24.7,1.6-36.9-.2-12.1-1.8-24-5-35.4-9.3,11.9,2.6,23.8,4.9,35.8,6,6,.5,12,.9,18,.8,6,0,11.9-.5,17.8-1.5,11.7-1.9,23.1-5.9,32.8-12.8,4.8-3.4,9.2-7.5,13-12.1,3.8-4.6,7-9.8,9.2-15.5Z"/>
+    <path class="cls-3" d="M1,87.9c5-3.1,10.5-5.6,16-7.8,5.6-2.2,11.3-3.9,17.1-5.4,11.6-2.9,23.6-4.6,35.6-5,12-.4,24.1.3,36.1,2.2,6,.9,11.9,2.2,17.7,3.6,2.9.7,5.9,1.5,8.7,2.4,2.8.8,5.6,1.6,8.4,2.4,5.6,1.6,11.2,3.1,16.8,4.4,5.6,1.4,11.3,2.6,16.9,3.7,11.3,2.1,22.7,3.5,34,3.3,11.3-.2,22.5-2.1,32.5-7.4,2.5-1.3,4.9-2.8,7.2-4.4,2.3-1.7,4.4-3.6,6.6-5.5,4.2-4,7.8-8.6,11.2-13.5-2.2,5.5-5.1,10.7-8.8,15.6-3.6,4.8-8.1,9.1-13.2,12.6-5.1,3.5-10.8,6.1-16.7,8-5.9,1.9-12,3-18.1,3.5-12.2,1.1-24.4.1-36.3-1.6-11.9-1.8-23.6-4.6-35-7.8-2.9-.8-5.8-1.7-8.6-2.5-2.8-.9-5.5-1.6-8.3-2.4-5.5-1.5-11.1-2.8-16.8-3.8-11.3-2.2-22.7-3.5-34.2-3.9-11.5-.4-23.1,0-34.6,1.6-5.8.7-11.5,1.7-17.2,3-2.9.6-5.7,1.3-8.5,2.1-2.8.8-5.6,1.6-8.4,2.6Z"/>
+  </g>
+  <g id="Ebene_3" data-name="Ebene 3">
+    <path class="cls-1" d="M107.8,67.6V.1l-32.3,11v54.6c10.8-.3,21.6.4,32.3,1.9Z"/>
+    <path class="cls-1" d="M251.4,67.4c0-6.7,0-45.9,0-45.9l-26.8-6.8v67.1s12.9-.9,26.1-12.8.7-1,.7-1.6Z"/>
+    <g>
+      <polygon class="cls-1" points="111.7 9 111.7 .8 221.3 21.7 221.3 28.4 111.7 9"/>
+      <polygon class="cls-1" points="112.3 23.6 112.3 14.7 221.3 32.1 221.3 38 112.3 23.6"/>
+      <polygon class="cls-1" points="112.3 37.8 112.3 28.9 221.3 40.9 221.3 46.8 112.3 37.8"/>
+      <polygon class="cls-1" points="112.3 52.1 112.3 43.2 221.3 50.2 221.3 56.1 112.3 52.1"/>
+      <polygon class="cls-1" points="112.3 65.4 112.3 56.6 221.3 59.2 221.3 65.1 112.3 65.4"/>
+      <path class="cls-1" d="M126.5,71.3c2.8.7,5.7,1.5,8.4,2.3,1.1.3,2.2.6,3.3.9l83.1.6v-5.9l-109-.7h0c4.8.8,9.6,1.7,14.3,2.8Z"/>
+    </g>
+    <g>
+      <polygon class="cls-1" points="20.1 50.4 20 44.6 72.8 21 72.8 40.6 20.1 50.4"/>
+      <polygon class="cls-1" points="72.8 55.9 20.3 61.7 20.2 54 72.8 45 72.8 55.9"/>
+      <path class="cls-1" d="M52.6,67.9c6.7-1.1,13.4-1.8,20.2-2.1v-5.2l-52.4,4.4.2,7.9,32.1-4.9Z"/>
+    </g>
+  </g>
+</svg>
--- a/public/images/right-sidebar/UMBE_gewerbegebaeude-weiss.svg
+++ b/public/images/right-sidebar/UMBE_gewerbegebaeude-weiss.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 271 111.86">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #fff;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #ff7d26;
+      }
+    </style>
+  </defs>
+  <g id="Wellen">
+    <path class="cls-2" d="M271,66.01c-1.29,5.97-4.05,11.58-7.44,16.72-3.45,5.11-7.71,9.7-12.58,13.54-4.84,3.88-10.32,6.93-16.02,9.32-5.73,2.35-11.73,3.94-17.8,4.98-12.17,1.95-24.54,1.59-36.56-.24-12.04-1.81-23.79-5.03-35.08-9.32,11.79,2.6,23.6,4.87,35.49,6.03,5.94.54,11.89.93,17.82.81,5.93-.06,11.84-.48,17.66-1.48,11.62-1.85,22.92-5.93,32.54-12.75,4.79-3.42,9.17-7.47,12.89-12.12,3.73-4.64,6.91-9.81,9.09-15.48Z"/>
+    <path class="cls-2" d="M0,87.93c5.04-3.14,10.5-5.58,16.05-7.75,5.56-2.17,11.29-3.9,17.08-5.42,11.63-2.86,23.59-4.58,35.64-5,12.04-.44,24.14.34,36.07,2.2,5.97.92,11.88,2.16,17.74,3.6,2.92.72,5.86,1.55,8.71,2.38,2.85.83,5.61,1.64,8.41,2.4,5.59,1.59,11.21,3.07,16.84,4.41,5.62,1.39,11.28,2.59,16.93,3.66,11.31,2.11,22.72,3.52,34.02,3.34,11.25-.23,22.53-2.12,32.47-7.4,2.49-1.29,4.9-2.77,7.2-4.44,2.3-1.67,4.45-3.55,6.55-5.53,4.16-3.99,7.81-8.6,11.16-13.48-2.24,5.48-5.15,10.75-8.81,15.56-3.65,4.83-8.15,9.1-13.22,12.64-5.12,3.47-10.81,6.13-16.72,8.01-5.91,1.89-12.03,2.97-18.13,3.53-12.24,1.1-24.42.14-36.31-1.64-11.9-1.82-23.57-4.56-35.04-7.76-2.87-.81-5.75-1.67-8.55-2.51-2.79-.85-5.52-1.61-8.31-2.36-5.54-1.51-11.15-2.75-16.78-3.85-11.27-2.16-22.72-3.47-34.23-3.89-11.51-.39-23.1.02-34.61,1.56-5.77.69-11.5,1.73-17.22,2.97-2.86.62-5.7,1.32-8.52,2.12-2.84.76-5.65,1.64-8.43,2.64Z"/>
+  </g>
+  <g id="Gewerbegebaeude">
+    <path class="cls-1" d="M102.42,67.26V.5l-34.28,10.84v54.01c11.44-.32,22.93.35,34.28,1.92Z"/>
+    <path class="cls-1" d="M254.81,65.15c-.02-6.59,0-45.44,0-45.44l-24.88-6.69v66.43s11.96-.84,24.22-12.71c.42-.41.66-.99.65-1.6Z"/>
+    <g>
+      <polygon class="cls-1" points="106.6 9.32 106.6 1.15 226.66 21.84 226.66 28.55 106.6 9.32"/>
+      <polygon class="cls-1" points="107.23 23.77 107.23 14.97 226.66 32.2 226.66 38.05 107.23 23.77"/>
+      <polygon class="cls-1" points="107.23 37.83 107.23 29.04 226.66 40.86 226.66 46.71 107.23 37.83"/>
+      <polygon class="cls-1" points="107.23 51.97 107.23 43.18 226.66 50.12 226.66 55.97 107.23 51.97"/>
+      <polygon class="cls-1" points="107.23 65.17 107.23 56.38 226.66 59.01 226.66 64.86 107.23 65.17"/>
+      <path class="cls-1" d="M122.76,70.93c3.1.69,6.21,1.48,9.24,2.28,1.2.32,2.39.63,3.57.94l91.08.55v-5.86l-119.43-.7h-.09c5.22.81,10.49,1.66,15.63,2.79Z"/>
+    </g>
+    <g>
+      <polygon class="cls-1" points="9.35 50.25 9.23 44.5 65.3 21.2 65.3 40.63 9.35 50.25"/>
+      <polygon class="cls-1" points="65.3 55.68 9.61 61.46 9.44 53.85 65.3 44.92 65.3 55.68"/>
+      <path class="cls-1" d="M43.86,67.57c7.08-1.11,14.25-1.82,21.44-2.12v-5.15l-55.63,4.35.17,7.82,34.02-4.9Z"/>
+    </g>
+  </g>
+</svg>
--- a/public/images/right-sidebar/UMBE_gewerbegebaeude.svg
+++ b/public/images/right-sidebar/UMBE_gewerbegebaeude.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 271 111.86">
+  <defs>
+    <style>
+      .uuid-31b37071-25c8-4180-bba8-979a017d54db {
+        fill: #fff;
+      }
+
+      .uuid-17f03b4e-e1d1-4987-9bff-ade6fe52d6f9 {
+        fill: #ff7d26;
+      }
+
+      .uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8 {
+        fill: #445096;
+      }
+    </style>
+  </defs>
+  <g id="uuid-9fbd4d12-41cf-439b-ac20-79a8a6d86a8c" data-name="Wellen">
+    <path class="uuid-17f03b4e-e1d1-4987-9bff-ade6fe52d6f9" d="m271,66.01c-1.29,5.97-4.05,11.58-7.44,16.72-3.45,5.11-7.71,9.7-12.58,13.54-4.84,3.88-10.32,6.93-16.02,9.32-5.73,2.35-11.73,3.94-17.8,4.98-12.17,1.95-24.54,1.59-36.56-.24-12.04-1.81-23.79-5.03-35.08-9.32,11.79,2.6,23.6,4.87,35.49,6.03,5.94.54,11.89.93,17.82.81,5.93-.06,11.84-.48,17.66-1.48,11.62-1.85,22.92-5.93,32.54-12.75,4.79-3.42,9.17-7.47,12.89-12.12,3.73-4.64,6.91-9.81,9.09-15.48Z"/>
+    <path class="uuid-17f03b4e-e1d1-4987-9bff-ade6fe52d6f9" d="m0,87.93c5.04-3.14,10.5-5.58,16.05-7.75,5.56-2.17,11.29-3.9,17.08-5.42,11.63-2.86,23.59-4.58,35.64-5,12.04-.44,24.14.34,36.07,2.2,5.97.92,11.88,2.16,17.74,3.6,2.92.72,5.86,1.55,8.71,2.38,2.85.83,5.61,1.64,8.41,2.4,5.59,1.59,11.21,3.07,16.84,4.41,5.62,1.39,11.28,2.59,16.93,3.66,11.31,2.11,22.72,3.52,34.02,3.34,11.25-.23,22.53-2.12,32.47-7.4,2.49-1.29,4.9-2.77,7.2-4.44,2.3-1.67,4.45-3.55,6.55-5.53,4.16-3.99,7.81-8.6,11.16-13.48-2.24,5.48-5.15,10.75-8.81,15.56-3.65,4.83-8.15,9.1-13.22,12.64-5.12,3.47-10.81,6.13-16.72,8.01-5.91,1.89-12.03,2.97-18.13,3.53-12.24,1.1-24.42.14-36.31-1.64-11.9-1.82-23.57-4.56-35.04-7.76-2.87-.81-5.75-1.67-8.55-2.51-2.79-.85-5.52-1.61-8.31-2.36-5.54-1.51-11.15-2.75-16.78-3.85-11.27-2.16-22.72-3.47-34.23-3.89-11.51-.39-23.1.02-34.61,1.56-5.77.69-11.5,1.73-17.22,2.97-2.86.62-5.7,1.32-8.52,2.12-2.84.76-5.65,1.64-8.43,2.64Z"/>
+  </g>
+  <g id="uuid-7329def7-567e-4920-b714-6e743891010b" data-name="Wohngebaeude">
+    <g>
+      <path class="uuid-31b37071-25c8-4180-bba8-979a017d54db" d="m62.1,66.01L103.83,11.59l52.17,63.63s72.22,24.35,98.81-11.35l-26.6-38.82-27.22-4.45V0h-19.83v39.66h-7.08v-22.76L101.52,4.02l-39.42,61.99Z"/>
+      <polygon class="uuid-31b37071-25c8-4180-bba8-979a017d54db" points="72.53 39.06 91.66 14.16 47.37 14.16 10.07 72.88 49 19.22 72.53 39.06"/>
+      <g>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="90.51" y="35.34" width="11.33" height="12.75"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="103.26" y="35.34" width="11.33" height="12.75"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="90.51" y="49.51" width="11.33" height="12.75"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="103.26" y="49.51" width="11.33" height="12.75"/>
+      </g>
+      <g>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="40.93" y="35.41" width="5.67" height="8.5"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="48.02" y="35.41" width="5.67" height="8.5"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="40.93" y="45.33" width="5.67" height="8.5"/>
+        <rect class="uuid-31b37071-25c8-4180-bba8-979a017d54db" x="48.02" y="45.33" width="5.67" height="8.5"/>
+      </g>
+    </g>
+  </g>
+  <g id="uuid-a8b79e96-2fac-427e-b8b7-d3d0001eccc1" data-name="Gewerbegebaeude">
+    <path class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" d="m102.42,67.26V.5l-34.28,10.84v54.01c11.44-.32,22.93.35,34.28,1.92Z"/>
+    <path class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" d="m254.81,65.15c-.02-6.59,0-45.44,0-45.44l-24.88-6.69v66.43s11.96-.84,24.22-12.71c.42-.41.66-.99.65-1.6Z"/>
+    <g>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="106.6 9.32 106.6 1.15 226.66 21.84 226.66 28.55 106.6 9.32"/>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="107.23 23.77 107.23 14.97 226.66 32.2 226.66 38.05 107.23 23.77"/>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="107.23 37.83 107.23 29.04 226.66 40.86 226.66 46.71 107.23 37.83"/>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="107.23 51.97 107.23 43.18 226.66 50.12 226.66 55.97 107.23 51.97"/>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="107.23 65.17 107.23 56.38 226.66 59.01 226.66 64.86 107.23 65.17"/>
+      <path class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" d="m122.76,70.93c3.1.69,6.21,1.48,9.24,2.28,1.2.32,2.39.63,3.57.94l91.08.55v-5.86l-119.43-.7h-.09c5.22.81,10.49,1.66,15.63,2.79Z"/>
+    </g>
+    <g>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="9.35 50.25 9.23 44.5 65.3 21.2 65.3 40.63 9.35 50.25"/>
+      <polygon class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" points="65.3 55.68 9.61 61.46 9.44 53.85 65.3 44.92 65.3 55.68"/>
+      <path class="uuid-1b543e95-de20-49f9-9fdf-25ce4db04fd8" d="m43.86,67.57c7.08-1.11,14.25-1.82,21.44-2.12v-5.15l-55.63,4.35.17,7.82,34.02-4.9Z"/>
+    </g>
+  </g>
+</svg>
--- a/public/images/right-sidebar/UMBE_telefon-1.svg
+++ b/public/images/right-sidebar/UMBE_telefon-1.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="uuid-30bfcab6-bf04-4c4b-b8c9-a63fbc68588a" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 98.11 100.64">
+  <image width="100" height="104" transform="translate(0 -.91)" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABoCAYAAAAHIFUvAAAG9ElEQVR4nO2da4hVVRTHx0dTvsjUHgZF2YdKpSyEyrGsBGsKsaaXZg8zIrKMXpSYpJ8Uow9RqdWXJgyDCCojykgwew0k9DbIrCl6Z1a2psYeTv/F3jMcz9zXOXevs/a+sz/8EGfunL3X+s29c84+a6/T1NPT0xTxB/UJ9ELLJh4GVoJPwd+gJ1C+B0+DlmCFYPJzwB4PkumaR0FzUEIw4VbwnwfJk2J9MEIw2ZHgRw+SJk1bKEIWCyXgT/BbTiTm0xGKkBcFgn8DDK5jTjcJSTkkBCEfCwS+GywFt+XgdvC6kJDJIQjpFAreR6ZEIX4RhXhGsEI6GwBqGCGa83EYV3sU4hFRiGdEIZ4x4IXg544C55NZNa7pAiwKcSwErx0BbgUflQj+vVoTEIXUKQSvGQoWkbkRVOm8nxcKJ0QhQkLwvUHgMrCjiogkme5FRCE1CsHXZ4BtGUT0wnchB0UhjoTg/8eDF3KISDI6CqlTCP49FDwC/q1TBjM8CqlDCFgCfncggtmpFFdDCXHJ8ijEHyE7wYgopPZJTwC/CMngj7yTFGMLRwgmdjC4H+wVktEFztCSEYwQMlfYXNHxk+DH1M9gqqaMIIRgMueRTIVJku3gOG0ZXgvBJCaCl4VFMBvBKG0R3grB4OPAGnJzYVcJrgnmGqzCl0eCEIJBm8GdJFeSmeQHcLZ28r0VggHbwOcFiGA2gyO0E2/jPgiMBuPBMZZnS8z5TPs6ZoiYEBz8VJIrvyz1EbWiUkAFSRgCbgaf5IzjH7AJTHcmBAc70r419xUkg0+XZ3nwjuCP5Zcc/oItqksIDjAc3EfmAqwIEcxr/AugLcPGv1rgXd93IZtlIsPAPWT+mBYloptMVboXZ1FkVhm6BeLcmEkIfmAm+LJAEUwHmKQtIZWHWUKx7qlZCF68jIrdA9hl3xW5N90ICrlWKu6qQsgUFawr+F3BHKud+Ao5uUgo5r21CHlIQUaPZEIdCDlaKO53KgrBC27UkOG7EJsbiX2RV5cVgm9OJpkziUYRwtdf3ziMmbs+9J1FpgcbDN7VkhGCEJsnXiZ5rs5Y/yBzwrTfqkN6oIWaMkIRknq3XAAWZGA+OAcMK3XM5MF5SeDrKESXpJBrtGWEJIRMWxD+jeez0fYMPAFWgZnVhLytLSMUIWQa5rjo0bIVjO8nBF88QVtEKEIwx7PIbT8v7g82Mi1kibaIEISQWb3Iew+kEivSQt7UFhGIkJOF4t7RJ4TMLUhvWuppJ72KkCuE4t6XFDJdW0JAQq6UjpsHuUVbQkBCWoTi/jYp5GFtCQEJ4XLYaptN87AmKWSTtoRQhFgpVzmOeRcl6gV4gA+0JYQkxEq5i9xUZX5HqeJwPniRRQsNIcRK4brlB8lcbb+fAW5qwPXOXOHZrx6ZD1xkOU/DCJGiSVtAyELI3D/iJfgpGZhEFTqURiH5RBxIpliwnjMuboQwOwqpXwZXbr7lMOZ700KKqs1tFCFrBeI+NylEcs9fQwnB/MaQqVx3HfcrSSHbtSUEJKRVKO6upJBXtSUEJGSBdNxxLSubkNlCcXcnhVyvLSEgIXzNIXEStDUpZKq2hFCEWCnPCMR9SVLIAWQegKIuIxAhvOU7S5vBajyWPH7vIPV2bRswQmy+xpKpr6rnFJjLiHjj6H67w3oHmK8tIiQhCTG8xW0amX0jtXIhOIXK7CTuPTAvB/yqLSM0IRIkba/SlhGSEDIPwrwDbADPZ+RxMi1vh1YSwn+sSj33IgrpL2Oeo1x9SKlmz+mBlkYhVWW4fhBmJxhTTggXzUmUSjaEEDI3pCT6uawuKcQOyne01G7raie9ihCpi+gvygqxA88lpfsk2kmvImSudNyVBpd64mXIQuapCbET4OXmQguxtZNeJR+nCcX9VU1C7CRmkNttwCEL4T5ZEvswH6hZiJ0IX6M8OdCF2Fxc7Dhm/mUfl0lIYjLcpm7LQBZi83AD+MtBvJ+BE5PHzjuh08FTJLBsr53sDDngvifLybSo3ZKiVHnuNvu9zTZ3vOu5OX3ceifFW4O5+eVaa3vACKmSl/YSsam0iR1l3z2Xk3lwV7Xnl++OQgSF5Jh4ZxTiuRDKvpTtI6VOjYMV0qhEISXgVQdeze73tysKKV7IejDWjsvL6NeRm2uJKCQH3KmiX1EBmTPBKERByMIy43NzaOlHagQlRPqpO71cWmEORRUJ1vRYcW0hEh0+S7GuzPjTChqfKbuv0CchiwtKBlcYtqbGPpxKP4tdgo5ac6IthNfCXHRmqwW+Jc2dRO8m05ZvV4HvjrYghFgprstqfCPTM93VhVgpc8g8+1w7ea7h3vn9lti9F2KlcGnmSjI9CL1pqJYD3rvO3apb8uRBXUQkCvGa/wG2XdzngACtIgAAAABJRU5ErkJggg=="/>
+</svg>
--- a/public/images/right-sidebar/UMBE_user-icon.svg
+++ b/public/images/right-sidebar/UMBE_user-icon.svg
--- a/public/images/right-sidebar/UMBE_wohngebaeude-weiss.svg
+++ b/public/images/right-sidebar/UMBE_wohngebaeude-weiss.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 271 111.86">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #fff;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #ff7d26;
+      }
+    </style>
+  </defs>
+  <g id="Wellen">
+    <path class="cls-2" d="M271,66.01c-1.29,5.97-4.05,11.58-7.44,16.72-3.45,5.11-7.71,9.7-12.58,13.54-4.84,3.88-10.32,6.93-16.02,9.32-5.73,2.35-11.73,3.94-17.8,4.98-12.17,1.95-24.54,1.59-36.56-.24-12.04-1.81-23.79-5.03-35.08-9.32,11.79,2.6,23.6,4.87,35.49,6.03,5.94.54,11.89.93,17.82.81,5.93-.06,11.84-.48,17.66-1.48,11.62-1.85,22.92-5.93,32.54-12.75,4.79-3.42,9.17-7.47,12.89-12.12,3.73-4.64,6.91-9.81,9.09-15.48Z"/>
+    <path class="cls-2" d="M0,87.93c5.04-3.14,10.5-5.58,16.05-7.75,5.56-2.17,11.29-3.9,17.08-5.42,11.63-2.86,23.59-4.58,35.64-5,12.04-.44,24.14.34,36.07,2.2,5.97.92,11.88,2.16,17.74,3.6,2.92.72,5.86,1.55,8.71,2.38,2.85.83,5.61,1.64,8.41,2.4,5.59,1.59,11.21,3.07,16.84,4.41,5.62,1.39,11.28,2.59,16.93,3.66,11.31,2.11,22.72,3.52,34.02,3.34,11.25-.23,22.53-2.12,32.47-7.4,2.49-1.29,4.9-2.77,7.2-4.44,2.3-1.67,4.45-3.55,6.55-5.53,4.16-3.99,7.81-8.6,11.16-13.48-2.24,5.48-5.15,10.75-8.81,15.56-3.65,4.83-8.15,9.1-13.22,12.64-5.12,3.47-10.81,6.13-16.72,8.01-5.91,1.89-12.03,2.97-18.13,3.53-12.24,1.1-24.42.14-36.31-1.64-11.9-1.82-23.57-4.56-35.04-7.76-2.87-.81-5.75-1.67-8.55-2.51-2.79-.85-5.52-1.61-8.31-2.36-5.54-1.51-11.15-2.75-16.78-3.85-11.27-2.16-22.72-3.47-34.23-3.89-11.51-.39-23.1.02-34.61,1.56-5.77.69-11.5,1.73-17.22,2.97-2.86.62-5.7,1.32-8.52,2.12-2.84.76-5.65,1.64-8.43,2.64Z"/>
+  </g>
+  <g id="Wohngebaeude">
+    <g>
+      <path class="cls-1" d="M62.1,66.01L103.83,11.59l52.17,63.63s72.22,24.35,98.81-11.35l-26.6-38.82-27.22-4.45V0h-19.83v39.66h-7.08v-22.76L101.52,4.02l-39.42,61.99Z"/>
+      <polygon class="cls-1" points="72.53 39.06 91.66 14.16 47.37 14.16 10.07 72.88 49 19.22 72.53 39.06"/>
+      <g>
+        <rect class="cls-1" x="90.51" y="35.34" width="11.33" height="12.75"/>
+        <rect class="cls-1" x="103.26" y="35.34" width="11.33" height="12.75"/>
+        <rect class="cls-1" x="90.51" y="49.51" width="11.33" height="12.75"/>
+        <rect class="cls-1" x="103.26" y="49.51" width="11.33" height="12.75"/>
+      </g>
+      <g>
+        <rect class="cls-1" x="40.93" y="35.41" width="5.67" height="8.5"/>
+        <rect class="cls-1" x="48.02" y="35.41" width="5.67" height="8.5"/>
+        <rect class="cls-1" x="40.93" y="45.33" width="5.67" height="8.5"/>
+        <rect class="cls-1" x="48.02" y="45.33" width="5.67" height="8.5"/>
+      </g>
+    </g>
+  </g>
+</svg>
--- a/public/images/right-sidebar/UMBE_wohngebaeude.svg
+++ b/public/images/right-sidebar/UMBE_wohngebaeude.svg
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 272 112">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #445096;
+      }
+
+      .cls-1, .cls-2, .cls-3 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #c6c6c6;
+      }
+
+      .cls-4 {
+        display: none;
+      }
+
+      .cls-3 {
+        fill: #ff7d26;
+      }
+    </style>
+  </defs>
+  <g id="Ebene_4" data-name="Ebene 4">
+    <path class="cls-3" d="M272,66c-1.3,6-4,11.6-7.4,16.7-3.4,5.1-7.7,9.7-12.6,13.5-4.8,3.9-10.3,6.9-16,9.3-5.7,2.3-11.7,3.9-17.8,5-12.2,2-24.5,1.6-36.6-.2-12-1.8-23.8-5-35.1-9.3,11.8,2.6,23.6,4.9,35.5,6,5.9.5,11.9.9,17.8.8,5.9,0,11.8-.5,17.7-1.5,11.6-1.9,22.9-5.9,32.5-12.8,4.8-3.4,9.2-7.5,12.9-12.1,3.7-4.6,6.9-9.8,9.1-15.5Z"/>
+    <path class="cls-3" d="M1,87.9c5-3.1,10.5-5.6,16-7.8,5.6-2.2,11.3-3.9,17.1-5.4,11.6-2.9,23.6-4.6,35.6-5,12-.4,24.1.3,36.1,2.2,6,.9,11.9,2.2,17.7,3.6,2.9.7,5.9,1.5,8.7,2.4,2.8.8,5.6,1.6,8.4,2.4,5.6,1.6,11.2,3.1,16.8,4.4,5.6,1.4,11.3,2.6,16.9,3.7,11.3,2.1,22.7,3.5,34,3.3,11.3-.2,22.5-2.1,32.5-7.4,2.5-1.3,4.9-2.8,7.2-4.4,2.3-1.7,4.4-3.6,6.6-5.5,4.2-4,7.8-8.6,11.2-13.5-2.2,5.5-5.1,10.7-8.8,15.6-3.6,4.8-8.1,9.1-13.2,12.6-5.1,3.5-10.8,6.1-16.7,8-5.9,1.9-12,3-18.1,3.5-12.2,1.1-24.4.1-36.3-1.6-11.9-1.8-23.6-4.6-35-7.8-2.9-.8-5.8-1.7-8.6-2.5-2.8-.9-5.5-1.6-8.3-2.4-5.5-1.5-11.1-2.8-16.8-3.8-11.3-2.2-22.7-3.5-34.2-3.9-11.5-.4-23.1,0-34.6,1.6-5.8.7-11.5,1.7-17.2,3-2.9.6-5.7,1.3-8.5,2.1-2.8.8-5.6,1.6-8.4,2.6Z"/>
+  </g>
+  <g id="Ebene_1" data-name="Ebene 1">
+    <g>
+      <path class="cls-1" d="M63.1,66L104.8,11.6l52.2,63.6s72.2,24.3,98.8-11.4l-26.6-38.8-27.2-4.4V0h-19.8v39.7h-7.1v-22.8L102.5,4l-39.4,62Z"/>
+      <polygon class="cls-1" points="73.5 39.1 92.7 14.2 48.4 14.2 11.1 72.9 50 19.2 73.5 39.1"/>
+      <g>
+        <rect class="cls-2" x="91.5" y="35.3" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="104.3" y="35.3" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="91.5" y="49.5" width="11.3" height="12.7"/>
+        <rect class="cls-2" x="104.3" y="49.5" width="11.3" height="12.7"/>
+      </g>
+      <g>
+        <rect class="cls-2" x="41.9" y="35.4" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="49" y="35.4" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="41.9" y="45.3" width="5.7" height="8.5"/>
+        <rect class="cls-2" x="49" y="45.3" width="5.7" height="8.5"/>
+      </g>
+    </g>
+  </g>
+  <g id="Ebene_3" data-name="Ebene 3" class="cls-4">
+    <path class="cls-1" d="M103.4,67.3V.5l-34.3,10.8v54c11.4-.3,22.9.4,34.3,1.9Z"/>
+    <path class="cls-1" d="M255.8,65.2c0-6.6,0-45.4,0-45.4l-24.9-6.7v66.4s12-.8,24.2-12.7c.4-.4.7-1,.7-1.6Z"/>
+    <g>
+      <polygon class="cls-1" points="107.6 9.3 107.6 1.2 227.7 21.8 227.7 28.5 107.6 9.3"/>
+      <polygon class="cls-1" points="108.2 23.8 108.2 15 227.7 32.2 227.7 38 108.2 23.8"/>
+      <polygon class="cls-1" points="108.2 37.8 108.2 29 227.7 40.9 227.7 46.7 108.2 37.8"/>
+      <polygon class="cls-1" points="108.2 52 108.2 43.2 227.7 50.1 227.7 56 108.2 52"/>
+      <polygon class="cls-1" points="108.2 65.2 108.2 56.4 227.7 59 227.7 64.9 108.2 65.2"/>
+      <path class="cls-1" d="M123.8,70.9c3.1.7,6.2,1.5,9.2,2.3,1.2.3,2.4.6,3.6.9l91.1.5v-5.9l-119.4-.7h0c5.2.8,10.5,1.7,15.6,2.8Z"/>
+    </g>
+    <g>
+      <polygon class="cls-1" points="10.3 50.2 10.2 44.5 66.3 21.2 66.3 40.6 10.3 50.2"/>
+      <polygon class="cls-1" points="66.3 55.7 10.6 61.5 10.4 53.8 66.3 44.9 66.3 55.7"/>
+      <path class="cls-1" d="M44.9,67.6c7.1-1.1,14.2-1.8,21.4-2.1v-5.2l-55.6,4.3.2,7.8,34-4.9Z"/>
+    </g>
+  </g>
+</svg>
--- a/public/images/right-sidebar/UMBE_wohnhaus-1.svg
+++ b/public/images/right-sidebar/UMBE_wohnhaus-1.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 272 112">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #445096;
+      }
+
+      .cls-1, .cls-2, .cls-3 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #c6c6c6;
+      }
+
+      .cls-3 {
+        fill: #ff7d26;
+      }
+    </style>
+  </defs>
+  <g>
+    <path class="cls-1" d="M62.1,66.01L103.83,11.59l52.17,63.63s72.22,24.35,98.81-11.35l-26.6-38.82-27.22-4.45V0h-19.83v39.66h-7.08v-22.76L101.52,4.02l-39.42,61.99Z"/>
+    <polygon class="cls-1" points="72.53 39.06 91.66 14.16 47.37 14.16 10.07 72.88 49 19.22 72.53 39.06"/>
+    <g>
+      <rect class="cls-2" x="90.51" y="35.34" width="11.33" height="12.75"/>
+      <rect class="cls-2" x="103.26" y="35.34" width="11.33" height="12.75"/>
+      <rect class="cls-2" x="90.51" y="49.51" width="11.33" height="12.75"/>
+      <rect class="cls-2" x="103.26" y="49.51" width="11.33" height="12.75"/>
+    </g>
+    <g>
+      <rect class="cls-2" x="40.93" y="35.41" width="5.67" height="8.5"/>
+      <rect class="cls-2" x="48.02" y="35.41" width="5.67" height="8.5"/>
+      <rect class="cls-2" x="40.93" y="45.33" width="5.67" height="8.5"/>
+      <rect class="cls-2" x="48.02" y="45.33" width="5.67" height="8.5"/>
+    </g>
+  </g>
+  <path class="cls-3" d="M272,66.01c-1.3,5.97-4.08,11.58-7.49,16.72-3.48,5.11-7.77,9.7-12.68,13.54-4.88,3.88-10.4,6.93-16.15,9.32-5.78,2.35-11.83,3.94-17.94,4.98-12.27,1.95-24.74,1.59-36.85-.24-12.13-1.81-23.98-5.03-35.36-9.32,11.89,2.6,23.79,4.87,35.77,6.03,5.99.54,11.98.93,17.96.81,5.98-.06,11.94-.48,17.8-1.48,11.71-1.85,23.11-5.93,32.8-12.75,4.83-3.42,9.24-7.47,12.99-12.12,3.76-4.64,6.97-9.81,9.16-15.48Z"/>
+  <path class="cls-3" d="M0,87.93c5.04-3.14,10.5-5.58,16.05-7.75,5.56-2.17,11.29-3.9,17.08-5.42,11.63-2.86,23.59-4.58,35.64-5,12.04-.44,24.14.34,36.07,2.2,5.97.92,11.88,2.16,17.74,3.6,2.92.72,5.86,1.55,8.71,2.38,2.85.83,5.61,1.64,8.41,2.4,5.59,1.59,11.21,3.07,16.84,4.41,5.62,1.39,11.28,2.59,16.93,3.66,11.31,2.11,22.72,3.52,34.02,3.34,11.25-.23,22.53-2.12,32.47-7.4,2.49-1.29,4.9-2.77,7.2-4.44,2.3-1.67,4.45-3.55,6.55-5.53,4.16-3.99,7.81-8.6,11.16-13.48-2.24,5.48-5.15,10.75-8.81,15.56-3.65,4.83-8.15,9.1-13.22,12.64-5.12,3.47-10.81,6.13-16.72,8.01-5.91,1.89-12.03,2.97-18.13,3.53-12.24,1.1-24.42.14-36.31-1.64-11.9-1.82-23.57-4.56-35.04-7.76-2.87-.81-5.75-1.67-8.55-2.51-2.79-.85-5.52-1.61-8.31-2.36-5.54-1.51-11.15-2.75-16.78-3.85-11.27-2.16-22.72-3.47-34.23-3.89-11.51-.39-23.1.02-34.61,1.56-5.77.69-11.5,1.73-17.22,2.97-2.86.62-5.7,1.32-8.52,2.12-2.84.76-5.65,1.64-8.43,2.64Z"/>
+</svg>
--- a/public/images/right-sidebar/icon_wohnhaus_01.ai
+++ b/public/images/right-sidebar/icon_wohnhaus_01.ai
--- a/public/images/right-sidebar/promo-boxes.ai
+++ b/public/images/right-sidebar/promo-boxes.ai
--- a/public/images/right-sidebar/user-icon.psd
+++ b/public/images/right-sidebar/user-icon.psd
--- a/src/client/lib/UMBE_card_navigation.js
+++ b/src/client/lib/UMBE_card_navigation.js
--- a/src/client/lib/validateAccessToken.ts
+++ b/src/client/lib/validateAccessToken.ts
@@ -1,6 +1,6 @@
 import Cookies from "js-cookie";
-import { API_ACCESS_TOKEN_COOKIE_NAME, API_REFRESH_TOKEN_COOKIE_NAME, API_UID_COOKIE_NAME } from "../../lib/constants";
-import { client } from "src/trpc";
+import { API_ACCESS_TOKEN_COOKIE_NAME, API_REFRESH_TOKEN_COOKIE_NAME, API_UID_COOKIE_NAME } from "#lib/constants.js";
+import { client } from "../../trpc.js";
 import moment from "moment";


--- a/src/components/AusweisPruefenBox.svelte
+++ b/src/components/AusweisPruefenBox.svelte
@@ -5,7 +5,7 @@
 	VerbrauchsausweisWohnenClient,
 	} from "./Ausweis/types.js";
 	import AusweisPruefenTooltip from "./AusweisPruefenTooltip.svelte";
-	import { addNotification } from "./NotificationProvider/shared";
+	import { addNotification } from "./NotificationProvider/shared.js";
 	import { CheckCircled, CrossCircled, Image } from "radix-svelte-icons";
 	import ChevronDown from "radix-svelte-icons/src/lib/icons/ChevronDown.svelte";
 	
@@ -158,13 +158,13 @@
 			if (gebaeude_aufnahme_allgemein.solarsystem_warmwasser) {
 				// Wenn Warmwasser Anteil unbekannt und Solarsystem
 				verbrauchWWGesamt_1 =
-					calculations?.energetische_nutzfläche +
+					calculations?.energetischeNutzflaeche +
 					" m² x 12 kWh/m² x 3 Jahre";
 				solarsystemWarmwasser = "Solarsystem Warmwasser";
 			} else {
 				// Wenn Warmwasser Anteil unbekannt und **kein** Solarsystem
 				verbrauchWWGesamt_1 =
-					calculations?.energetische_nutzfläche +
+					calculations?.energetischeNutzflaeche +
 					" m² x 20 kWh/m² x 3 Jahre";
 				solarsystemWarmwasser = "kein Solarsystem Warmwasser";
 			}
@@ -181,7 +181,7 @@
 			ausweis.keller_beheizt +
 			" ) in m²";
 			table3Z1 = gebaeude_aufnahme_allgemein.flaeche;
-			table3Z2 = calculations?.energetische_nutzfläche;
+			table3Z2 = calculations?.energetischeNutzflaeche;

 	
 		tooltip4Z1 =
@@ -261,7 +261,7 @@
 	
 	
 		tooltip8Z1 =
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			" m² x 6 kWh/m² x 3 Jahre >> Kühlungszuschlag in kWh";
 		tooltip8Z2 = "";
 		table8Z1 = calculations?.kuehlungsZuschlag;
@@ -277,7 +277,7 @@
 			" + " +
 			calculations?.energieVerbrauchHeizungBereinigt_2 +
 			") / (3 * " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			") >> Durchschnittsverbrauch Heizung in kWh";
 		table9Z1 =
 			calculations?.faktorDurchschnittsEnergieVerbrauchHeizungBereinigt;
@@ -288,7 +288,7 @@
 				"faktorDurchschnittsEnergieVerbrauchHeizungBereinigt"
 			] +
 			" x " +
-			calculations.leerstand +
+			calculations?.leerstand +
 			" x (" +
 			calculations.energieVerbrauchHeizungBereinigt_1 +
 			" + " +
@@ -304,21 +304,13 @@
 		table10Z1 = calculations?.leerstandsZuschlagHeizung;
 		table10Z2 = calculations?.leerstandsZuschlagWarmwasser;

-		tooltip11Z1 =
-			"(" +
-			calculations?.energieVerbrauchHeizungBereinigt_1 +
-			" + " +
-			calculations?.energieVerbrauchWarmwasser_1 +
-			") / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
-			")  Endenergieverbrauch 1 in kWh/m²a";
 		tooltip11Z2 =
 			"(" +
 			calculations?.energieVerbrauchHeizungBereinigt_2 +
 			" + " +
 			calculations?.energieVerbrauchWarmwasser_2 +
 			") / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			")  Endenergieverbrauch 2 in kWh/m²a";
 		table11Z1 = calculations?.endEnergieVerbrauch_1;
 		table11Z2 = calculations?.endEnergieVerbrauch_2;
@@ -333,7 +325,7 @@
 			" x " +
 			calculations?.primaerfaktorww +
 			")) / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			")  Primärenergieverbrauch 1 in kWh/m²a";
 		tooltip12Z2 =
 			"((" +
@@ -345,7 +337,7 @@
 			" x " +
 			calculations?.primaerfaktorww_1 +
 			")) / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			") Primärenergieverbrauch 2 in kWh/m²a";
 		table12Z1 = calculations?.primaerEnergieVerbrauch_1;
 		table12Z2 = calculations?.primaerEnergieVerbrauch_2;
@@ -356,13 +348,13 @@
 			" + " +
 			calculations?.leerstandsZuschlagWarmwasser +
 			") / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			") Endenergieverbrauch Leerstand in kWh/m²a";
 		tooltip13Z2 =
 			"(" +
 			calculations?.kuehlungsZuschlag +
 			") / (3 Jahre x " +
-			calculations?.energetische_nutzfläche +
+			calculations?.energetischeNutzflaeche +
 			") Endenergieverbrauch Kühlung in kWh/m²a";
 		table13Z1 = calculations?.endEnergieVerbrauchLeerstandsZuschlag;
 		table13Z2 = calculations?.endEnergieVerbrauchKuehlungsZuschlag;
@@ -509,7 +501,7 @@
 							<span>{ausweis.faktorKeller} x {gebaeude_aufnahme_allgemein.flaeche}m² Energetische Nutzfläche (Keller {gebaeude_aufnahme_allgemein.keller}) in m²</span>
 						</div>
 						<span>{gebaeude_aufnahme_allgemein.flaeche}</span>
-						<span><strong>{calculations?.energetische_nutzfläche}</strong></span>
+						<span><strong>{calculations?.energetischeNutzflaeche}</strong></span>
 					</AusweisPruefenTooltip>
 					</td
 				>
@@ -604,7 +596,7 @@
 					>
 					<AusweisPruefenTooltip>
 						<div slot="tooltip">
-							<span>{tooltip11Z1}</span>
+							<span>({calculations?.energieVerbrauchHeizungBereinigt_1} + {calculations?.energieVerbrauchWarmwasser_1}) / (3 Jahre x {calculations?.energetischeNutzflaeche}) Endenergieverbrauch 1 in kWh/m²a</span>
 							<br>
 							<span>{tooltip11Z2}</span>
 						</div>
@@ -748,7 +740,7 @@
 				<td title="Ausweis ausstellen" class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisAusstellen('{gebaeude_aufnahme_allgemein.uid}')}>A</button
+						on:click={() => ausweisAusstellen(gebaeude_aufnahme_allgemein.uid)}>A</button
 					></td
 				>
 				<td
@@ -756,7 +748,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisAusstellenPost('{gebaeude_aufnahme_allgemein.uid}')}>P</button
+						on:click={() => ausweisAusstellenPost(gebaeude_aufnahme_allgemein.uid)}>P</button
 					></td
 				>
 				<td
@@ -764,7 +756,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => ausweisnichtAusstellen('{gebaeude_aufnahme_allgemein.uid}')}>N</button
+						on:click={() => ausweisnichtAusstellen(gebaeude_aufnahme_allgemein.uid)}>N</button
 					></td
 				>
 				<td
@@ -772,7 +764,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => bestellBestaetigung('{gebaeude_aufnahme_allgemein.uid}')}>B</button
+						on:click={() => bestellBestaetigung(gebaeude_aufnahme_allgemein.uid)}>B</button
 					></td
 				>
 				<td
@@ -780,7 +772,7 @@
 					class="w-4 p-1"
 					><button
 						class="btn btn-xs btn-ghost"
-						on:click={() => erinnern('{gebaeude_aufnahme_allgemein.uid}')}
+						on:click={() => erinnern(gebaeude_aufnahme_allgemein.uid)}
 						>E</button
 					></td
 				>
@@ -793,12 +785,16 @@
 						href="/energieausweis-erstellen/gespeichert?id={gebaeude_aufnahme_allgemein.uid}">F</a
 					></td
 				>
-				{@html gebaeude_aufnahme_allgemein.kontrolldatei
-					? `<td title="XML-Datei an das DiBT verschicken." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click="xmlAbschicken('{gebaeude_aufnahme_allgemein.uid}')">X</button></td>`
-					: ""}
-				{@html !gebaeude_aufnahme_allgemein.registriernummer
-					? `<td title="Registriernummer vom DiBT anfordern." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click="registriernummerAnfordern('{gebaeude_aufnahme_allgemein.uid}')">R</button></td>`
-					: ""}
+				{#if gebaeude_aufnahme_allgemein.kontrolldatei}
+					<td title="XML-Datei an das DiBT verschicken." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click={() => {
+						xmlAbschicken(gebaeude_aufnahme_allgemein.uid)
+					}}>X</button></td>
+				{/if}
+				{#if !gebaeude_aufnahme_allgemein.registriernummer}
+					<td title="Registriernummer vom DiBT anfordern." class="w-4 p-1"><button class="btn btn-xs btn-ghost" on:click={() => {
+						registriernummerAnfordern(gebaeude_aufnahme_allgemein.uid)
+					}}>R</button></td>
+				{/if}
 			</tr>
 		</tbody>
 	</table>
--- a/src/components/Dashboard/DashboardAusweis.svelte
+++ b/src/components/Dashboard/DashboardAusweis.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import {
 	VerbrauchsausweisWohnenClient,
-	} from "#components/Ausweis/types";
+	} from "#components/Ausweis/types.js";
 	import moment from "moment";
 	import { dialogs } from "svelte-dialogs";
 	import {
@@ -11,8 +11,8 @@
 		Pencil2,
 		QuestionMarkCircled,
 	} from "radix-svelte-icons";
-	import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016";
-	import { client } from "src/trpc";
+	import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016.js";
+	import { client } from "src/trpc.js";
 		
 	export let ausweis: VerbrauchsausweisWohnenClient;
 	export let progress: number;
@@ -167,7 +167,7 @@
 		{/await}
 		<div class="card-actions justify-end mt-8">
 			<a class="btn btn-primary" href="/energieausweis-erstellen/verbrauchsausweis-wohnen?uid={ausweis.uid}">Bearbeiten</a>
-			<a class="btn btn-ghost" title="PDF Herunterladen" target="_blank" href="/pdf/ansichtsausweis?ausweis_uid={ausweis.uid}">
+			<a class="btn btn-ghost" title="PDF Herunterladen" target="_blank" href="/pdf/ansichtsausweis?uid={ausweis.uid}">
 				<Download size={22} />
 			</a>
 		</div>
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -1,10 +1,10 @@
 ---
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import ThemeController from "./ThemeController.svelte";

 const valid = await validateAccessTokenServer(Astro)

-const lightTheme = Astro.cookies.get("theme").value === "light";
+const lightTheme = Astro.cookies.get("theme")?.value === "light";
 ---

 <header>
--- a/src/components/Notifications/Notification.svelte
+++ b/src/components/Notifications/Notification.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import RawNotification from "./RawNotification.svelte";
-import { Notification } from "./shared";
+import { Notification } from "./shared.js";

 	export let notification: Notification & { uid: string };
 </script>
--- a/src/components/Notifications/NotificationWrapper.svelte
+++ b/src/components/Notifications/NotificationWrapper.svelte
@@ -2,7 +2,7 @@
 	import Notification from "./Notification.svelte";
 	import RawNotificationWrapper from "./RawNotificationWrapper.svelte";

-	import { notifications } from "./shared";
+	import { notifications } from "./shared.js";
 </script>

 <RawNotificationWrapper>
--- a/src/components/Notifications/RawNotification.svelte
+++ b/src/components/Notifications/RawNotification.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { Notification, deleteNotification } from "./shared";
+	import { Notification, deleteNotification } from "./shared.js";
 	import { fly } from "svelte/transition";

 	export let notification: Partial<Notification> & { uid: string };
--- a/src/components/Notifications/index.ts
+++ b/src/components/Notifications/index.ts
@@ -0,0 +1,9 @@
+import Notification from "./Notification.svelte";
+export { Notification };
+import NotificationWrapper from "./NotificationWrapper.svelte";
+export { NotificationWrapper };
+import RawNotificationWrapper from "./RawNotificationWrapper.svelte";
+export { RawNotificationWrapper };
+import RawNotification from "./RawNotification.svelte";
+export { RawNotification };
+export * from "./shared.js";
--- a/src/components/SidebarRight.astro
+++ b/src/components/SidebarRight.astro
@@ -1,4 +1,15 @@
+---
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
+import SidebarWidgetLogin from "./SidebarWidgetLogin.svelte";
+import SidebarWidgetProfile from "./SidebarWidgetProfile.svelte"
+
+const loggedin = await validateAccessTokenServer(Astro)
+---
+
 <div class="flex flex-col gap-4">
+	{ !loggedin ? 
+		<SidebarWidgetLogin client:load></SidebarWidgetLogin> : <SidebarWidgetProfile></SidebarWidgetProfile>}
+
 	<div class="infoCard">
 		<h2 style="font-weight: bold; font-size: 1.2em; color: #3A4AB5;">
 			Rufen Sie uns an<br /> Wir sind gerne für Sie da
--- a/src/components/SidebarWidgetLogin.svelte
+++ b/src/components/SidebarWidgetLogin.svelte
@@ -0,0 +1,96 @@
+<script lang="ts">
+	import { loginClient } from "#lib/login";
+	import CrossCircled from "radix-svelte-icons/src/lib/icons/CrossCircled.svelte";
+	import { fade } from "svelte/transition";
+
+	let email: string;
+	let passwort: string;
+
+	async function login(e: SubmitEvent) {
+		console.log(e);
+		
+		e.preventDefault();
+		const response = await loginClient(email, passwort);
+
+		if (response === null) {
+			errorHidden = false;
+		} else {
+			window.location.href = "/dashboard";
+		}
+	}
+
+	let errorHidden = true;
+</script>
+
+<div
+	id="card-login"
+	class="box card hidden bg-white px-6 py-4 mb-5
+			lg:block"
+>
+	<div class="grid">
+		<div class="grid grid-cols-[2rem,1fr,1fr]">
+			<img
+				class="w-6 align-middle"
+				src="/images/right-sidebar/UMBE_user-icon.svg"
+				alt="user-icon"
+			/>
+			<h2 class="text-secondary">Kunden Login</h2>
+			<div class="justify-self-end text-secondary">
+				<a
+					class="text-lg font-bold text-box-heading leading-6 no-underline hover:text-primary"
+					href="">Kontakt</a
+				>
+				/
+				<a
+					class="text-lg font-bold text-box-heading leading-6 no-underline hover:text-primary"
+					href="">AGB</a
+				>
+			</div>
+		</div>
+		<hr class="mb-4" />
+		<form on:submit={login}>
+			<input
+				class="my-1 rounded-md px-2 py-1 ring-1 w-full"
+				type="text"
+				placeholder="nutzer@email.com"
+				name="email"
+				bind:value={email}
+				on:focus={() => (errorHidden = true)}
+				required
+			/>
+			<input
+				class="my-1 rounded-md px-2 py-1 ring-1 w-full"
+				type="password"
+				minlength="8"
+				placeholder="********"
+				name="passwort"
+				bind:value={passwort}
+				on:focus={() => (errorHidden = true)}
+				required
+			/>
+			{#if !errorHidden}
+			<div role="alert" class="alert alert-error" in:fade out:fade={{delay: 400}}>
+				<CrossCircled size={24} />
+				<span class="font-semibold">Das hat leider nicht geklappt, haben sie ihr Passwort und ihre Email Adresse richtig eingegeben?</span>
+			</div>
+			{/if}
+			<button class="my-1 rounded-md px-2 py-1 ring-1 w-full bg-secondary text-white font-bold hover:bg-primary" type="submit">Einloggen</button>
+		</form>
+
+		<div class="grid grid-cols-[1fr,1fr]">
+			<a
+				class="justify-self-start text-sm font-bold no-underline hover:text-primary"
+				href="/auth/signup">Registrieren</a
+			>
+			<a
+				class="justify-self-end text-sm font-bold no-underline hover:text-primary"
+				href="/auth/passwort-vergessen">Passwort vergessen</a
+			>
+		</div>
+
+		<div></div>
+	</div>
+</div>
+
+<style lang="scss">
+</style>
--- a/src/components/SidebarWidgetProfile.svelte
+++ b/src/components/SidebarWidgetProfile.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+</script>
+
+<div
+	id="card-login"
+	class="box card hidden bg-white px-6 py-4
+			lg:block"
+>
+<a href="/dashboard">Profil</a>
+</div>
--- a/src/components/UMBE_Footer.astro
+++ b/src/components/UMBE_Footer.astro
@@ -2,9 +2,20 @@
 const currentYear = new Date().getFullYear();
 ---

-<footer class="max-w-[1920px] w-full">
-<div class="flex flex-row justify-between px-4 items-center bg-primary py-2 mt-auto">
-	<a class="text-white font-medium text-lg" href="/impressum">Impressum und Datenschutz</a>
-	<a class="text-white font-medium text-lg" href="/">© {currentYear} IB Cornelsen Hamburg.</a>
-</div>
+<footer class="
+		
+				grid grid-cols-1 bg-primary lg:px-9 lg:py-1
+				lg:grid-cols-4 lg:px-9 lg:py-1">
+
+	<div class="
+	justify-self-center
+	md:col-end-2 md:justify-self-start md:px-4">
+		<a class=" text-white font-bold text-lg no-underline whitespace-nowrap" style="text-shadow:1px 1px 2px #222" href="/">Impressum und Datenschutz</a>
+	</div>
+	<div class="
+	justify-self-center
+	md:col-end-5 md:justify-self-end md:px-6">	
+		<a class=" text-white font-bold text-lg no-underline whitespace-nowrap" style="text-shadow:1px 1px 2px #222" href="/">© {currentYear} IB Cornelsen Hamburg</a>
+	</div>
+
 </footer>
--- a/src/components/UMBE_Header.astro
+++ b/src/components/UMBE_Header.astro
@@ -1,28 +1,50 @@
-<header class="max-w-[1920px] w-full relative">
-	<a class="hidden md:block w-full h-48 bg-base-200" href="/">
-		<img
-			src="/images/header/header-bg.jpg"
-			class="w-full h-full object-cover"
-			alt="Hintergrund - Rollen Architektenpapier"
-		/>
-			<img
-				src="/images/header/logo-big.svg"
-				class="absolute top-4 right-0 w-[464px]"
-				alt="IBCornelsen - Logo"
-			/>
-			<h2
-				class="text-secondary font-semibold text-2xl absolute top-8 right-4"
-			>
+<header class="max-w-[1920px] w-full relative bg-white
+md:bg-[url('/images/header/header-bg.jpg')] md:bg-cover md:grid md:grid-cols-2
+lg:grid lg:grid-cols-3">
+
+
+
+	<div class="
+	justify-self-center px-2 py-2
+	xs:px-6 xs:py-4
+	md:px-4 md:py-4
+	md:col-end-4 md:justify-self-end 
+	xl:my-4 xl:mr-9 xl:p-0">
+
+	
+		<a href="/">
+			<img class="
+			w-full
+			md:w-[350px]
+			lg:w-[420px]" 
+			src="/images/header/UMBE_IBC-logo.svg" alt="IBCornelsen-Logo"/>
+		</a>
+		
+		<h2 class="text-secondary font-normal absolute
+					top-1 right-2 text-[1.1rem]
+					xs:top-[1.5rem] xs:right-6 xs:text-[1.55rem]
+					
+					md:top-[1.25rem] md:right-4 md:text-[1.1rem]
+					xl:top-[1.5rem] xl:right-9 xl:text-[1.4rem]">
 					Energieausweis online erstellen
 		</h2>
-			<h2
-				class="text-primary font-semibold text-xl absolute top-16 right-4"
-			>
-				Energieausweise nach aktueller GEG
+				
+		<h2	class="text-primary font-normal absolute 
+					top-[1.6rem] right-2 text-[0.85rem]
+					xs:top-[3.3rem] xs:right-6 xs:text-[1.2rem]
+					
+					md:top-[2.5rem] md:right-4 md:text-[0.9rem]
+					xl:top-[3.15rem] xl:right-9 xl:text-[1.1rem]">
+					Energieausweise nach aktuellem GEG
 		</h2>
-	</a>
-	<div class="px-4 flex flex-row w-full md:justify-end items-center bg-primary">
-		<a
+		
+	</div>
+
+	<div class="col-start-1 col-span-3">
+		<div class="px-2 flex flex-row w-full justify-end items-center bg-primary
+					lg:h-[14px] xl:h-[18px]">
+
+			<!-- <a
 				class="header-button hidden md:block"
 				href="/energieausweis-erstellen/verbrauchsausweis-erstellen"
 				>Energieausweis erstellen</a
@@ -31,11 +53,11 @@
 				>Kontakt</a
 			>
 			<a class="header-button hidden md:block" href="/agb">AGB</a>
+				-->
 				
-			<a class="hamburger_menu"
-				><img src="/images/hamburger.png" width="22" alt="hamburger" /></a
-			>
 		</div>
+	</div>
+
 </header>

 <style>
--- a/src/components/UMBE_SidebarLeft.astro
+++ b/src/components/UMBE_SidebarLeft.astro
@@ -1,9 +1,14 @@
 ---
-import Navigation from "../components/UMBE_navcard.astro";
+import Navigation from "#components/UMBE_card-navigation.svelte";
+import Preistabelle from "#components/UMBE_card-price-info.svelte";
+
 ---

-<div class="flex flex-col gap-6 bg-slate-200 grow">
+<div class="flex flex-col grow">
+
+<Navigation client:load />
+
+<Preistabelle client:load />

-<Navigation>

 </div>
--- a/src/components/UMBE_SidebarRight.astro
+++ b/src/components/UMBE_SidebarRight.astro
@@ -1,3 +1,25 @@
-<div class="flex flex-col gap-4 bg-slate-200 grow">
+---
+import Login from "#components/SidebarWidgetLogin.svelte";
+import Contact from "#components/UMBE_card-contact.svelte";
+import Review from "#components/UMBE_card-review.svelte";
+import VApromo from "#components/UMBE_card-VA-promo.svelte";
+import VAGpromo from "#components/UMBE_card-VA-G-promo.svelte";
+import BApromo from "#components/UMBE_card-BA-promo.svelte";
+import BAGpromo from "#components/UMBE_card-BA-G-promo.svelte";
+---
+
+<div class="hidden
+            xl:flex xl:flex-col xl:grow
+            ">
+
+    <Login client:load />
+    <Contact client:load />
+    <Review client:load />
+    <VApromo client:load />
+    <VAGpromo client:load />
+    <BApromo client:load />
+    <BAGpromo client:load />
+</div>
+

 </div>
--- a/src/components/UMBE_banner-saeule.svelte
+++ b/src/components/UMBE_banner-saeule.svelte
@@ -0,0 +1,28 @@
+<div class="grid grid-cols-[1fr,1fr,1fr,1fr] gap-4" >
+
+    <div class="grid">
+        <div>
+            <img class="w-full justify-self-center p-4 bg-secondary rounded-md mb-1" src="/images/right-sidebar/UMBE_wohngebaeude-weiss.svg" alt="Wohnhaus Verbrauchsausweis"/>
+            <div class="h-[200px] bg-primary rounded-md mb-1"></div>
+        </div>   
+    </div>
+    <div class="grid">
+        <div>
+            <img class="w-full justify-self-center p-4 bg-secondary rounded-md mb-1" src="/images/right-sidebar/UMBE_wohngebaeude-weiss.svg" alt="Wohnhaus Bedarfsausweis"/>
+            <div class="h-[200px] bg-primary rounded-md mb-1"></div>
+        </div>
+    </div>
+    <div class="grid">
+        <div>
+            <img class="w-full justify-self-center p-4 bg-secondary rounded-md mb-1" src="/images/right-sidebar/UMBE_gewerbegebaeude-weiss.svg" alt="Gewerbe Verbrauchsausweis"/>
+            <div class="h-[200px] bg-primary rounded-md mb-1"></div>
+        </div>
+    </div>
+    <div class="grid">
+        <div>
+            <img class="w-full justify-self-center p-4 bg-secondary rounded-md mb-1" src="/images/right-sidebar/UMBE_gewerbegebaeude-weiss.svg" alt="Gewerbe Bedarfsausweis"/>
+            <div class="h-[200px] bg-primary rounded-md mb-1"></div>
+        </div>
+    </div>
+
+</div>
--- a/src/components/UMBE_card-BA-G-promo.svelte
+++ b/src/components/UMBE_card-BA-G-promo.svelte
@@ -0,0 +1,28 @@
+<script>
+	import { PRICES } from "#lib/constants";
+</script>
+	
+<div id ="card-BA-G-promo" 
+class="	box card hidden bg-white px-6 py-4 mb-5
+        lg:block">
+
+<div class="grid">
+
+<h2>Bedarfssausweis Gewerbe</h2>
+<hr class="mb-4">
+<img class="w-[80%] justify-self-center !min-w-[100px] mb-[1rem]" src="/images/right-sidebar/UMBE_gewerbegebaeude.svg" alt="Wohnhaus Verbrauchsausweis"/>
+
+<a href="#" id="link-BA-promo" 
+        class="	w-[90%] justify-self-center text-center text-white font-[700] bg-secondary rounded-md px-3 py-1 mt-2 no-underline text-[1rem]
+                hover:bg-primary
+        " >jetzt Bedarfssausweis erstellen</a>
+</div>
+
+<p class="promo tracking-tighter absolute top-[9.7rem] left-[2.5rem] text-[2rem] text-gray-700">ab<span class="promo pl-[0.2rem]">300</span>€</p>
+
+</div>
+
+
+<style lang="scss">
+
+</style>
--- a/src/components/UMBE_card-BA-promo.svelte
+++ b/src/components/UMBE_card-BA-promo.svelte
@@ -0,0 +1,28 @@
+<script>
+	import { PRICES } from "#lib/constants";
+</script>
+	
+<div id ="card-BA-promo" 
+class="	box card hidden bg-white px-6 py-4 mb-5
+        lg:block">
+
+<div class="grid">
+
+<h2>Bedarfssausweis Wohngebäude</h2>
+<hr class="mb-4">
+<img class="w-[80%] justify-self-center !min-w-[100px] mb-[1rem]" src="/images/right-sidebar/UMBE_wohngebaeude.svg" alt="Wohnhaus Verbrauchsausweis"/>
+
+<a href="#" id="link-BA-promo" 
+        class="	w-[90%] justify-self-center text-center text-white font-[700] bg-secondary rounded-md px-3 py-1 mt-2 no-underline text-[1rem]
+                hover:bg-primary
+        " >jetzt Bedarfssausweis erstellen</a>
+</div>
+
+<p class="promo tracking-tighter absolute top-[9.7rem] left-[2.5rem] text-[2rem] text-gray-700">ab<span class="promo pl-[0.2rem]">{PRICES.BedarfsausweisWohnen[0]}</span>€</p>
+
+</div>
+
+
+<style lang="scss">
+
+</style>
--- a/src/components/UMBE_card-VA-G-promo.svelte
+++ b/src/components/UMBE_card-VA-G-promo.svelte
@@ -0,0 +1,29 @@
+<script>
+	import { PRICES } from "#lib/constants";
+</script>
+	
+<div id ="card-VA-G-promo" 
+	class="	box card hidden bg-white px-6 py-4 mb-5
+			lg:block">
+
+	<div class="grid">
+
+	<h2>Verbrauchsausweis Gewerbe</h2>
+	<hr class="mb-4">
+	<img class="w-[80%] justify-self-center !min-w-[100px] mb-[1rem]" src="/images/right-sidebar/UMBE_gewerbegebaeude.svg" alt="Gewerbe Verbrauchsausweis"/>
+
+	<a href="#" id="link-VA-promo" 
+			class="	w-[90%] justify-self-center text-center text-white font-[700] bg-secondary rounded-md px-3 py-1 mt-2 no-underline text-[1rem]
+					hover:bg-primary
+			" >jetzt Verbrauchsausweis erstellen</a>
+	</div>
+
+	<p class="promo tracking-tighter absolute top-[9.7rem] left-[2.5rem] text-[2rem] text-gray-700">ab<span class="promo pl-2">{PRICES.VerbrauchsausweisGewerbe[0]}</span>€</p>
+
+</div>
+
+
+<style lang="scss">
+
+
+</style>
--- a/src/components/UMBE_card-VA-promo.svelte
+++ b/src/components/UMBE_card-VA-promo.svelte
@@ -0,0 +1,29 @@
+<script>
+	import { PRICES } from "#lib/constants";
+</script>
+	
+<div id ="card-VA-promo" 
+	class="	box card hidden bg-white px-6 py-4 mb-5
+			lg:block">
+
+	<div class="grid">
+
+	<h2>Verbrauchsausweis Wohngebäude</h2>
+	<hr class="mb-4">
+	<img class="w-[80%] justify-self-center !min-w-[100px] mb-[1rem]" src="/images/right-sidebar/UMBE_wohngebaeude.svg" alt="Wohnhaus Verbrauchsausweis"/>
+
+	<a href="" id="link-VA-promo" 
+			class="	w-[90%] justify-self-center text-center text-white font-[700] bg-secondary rounded-md px-3 py-1 mt-2 no-underline text-[1rem]
+					hover:bg-primary
+			" >jetzt Verbrauchsausweis erstellen</a>
+	</div>
+
+	<p class="promo tracking-tighter absolute top-[9.7rem] left-[2.5rem] text-[2rem] text-gray-700">ab<span class="promo pl-2">{PRICES.VerbrauchsausweisWohnen[0]}</span>€</p>
+
+</div>
+
+
+<style lang="scss">
+
+
+</style>
--- a/src/components/UMBE_card-contact.svelte
+++ b/src/components/UMBE_card-contact.svelte
@@ -0,0 +1,20 @@
+<div id ="card-contact" class="box card bg-white px-6 py-4 mb-5">
+	
+	<div class="grid grid-cols-[max-content,1fr]">
+		<div class="">
+		<h2>Rufen Sie uns an<br>Wir sind gerne für Sie da</h2>
+		<hr class="w-11/12"/>
+		<p>Telefonische Beratung unter</p>
+		<a class="text-lg font-bold text-box-heading" href="tel:+4940209339850">040 / 209 339 850</a>
+		</div>
+
+		<img class="w-[100px] !min-w-[100px] mt-[0px] justify-self-end" src="/images/right-sidebar/UMBE_telefon-1.svg" alt="Telefon - Rufen sie uns an."/>
+	</div>
+
+</div>
+
+
+<style lang="scss">
+
+
+</style>
--- a/src/components/UMBE_card-navigation.svelte
+++ b/src/components/UMBE_card-navigation.svelte
@@ -0,0 +1,231 @@
+<script>
+let innerWidth
+
+function dropdown(){
+
+const innerWidth = window.innerWidth;
+console.log(innerWidth);
+if(innerWidth<1024){
+   
+    const check_element     = this.lastChild;
+    
+    const rotate_list       = document.querySelectorAll(".dd-symbol-clone");
+    const rotate_element    = this.childNodes[0].children[0];
+
+    console.log(rotate_element);
+
+    var first_check = check_element.classList.contains("show-dropdown-content");
+    const nodeList = document.querySelectorAll(".dropdown-content");
+    
+    if(first_check == true){
+    check_element.classList.remove("show-dropdown-content");
+    rotate_element.classList.toggle("rotate-symbol");
+    
+    }else{
+      for (let i = 0; i < nodeList.length; i++) {
+        const element = nodeList[i];
+        element.classList.remove("show-dropdown-content");
+        
+      }
+      for (let i = 0; i < rotate_list.length; i++) {
+        const element = rotate_list[i];
+        element.classList.remove("rotate-symbol");
+      }
+
+    check_element.classList.add("show-dropdown-content");
+    rotate_element.classList.add("rotate-symbol");
+    }
+  }
+
+}
+
+function hover(){
+const innerWidth = window.innerWidth;
+console.log(innerWidth);
+if(innerWidth>1024){
+    const check_element     = this.firstChild.lastChild;
+    console.log(check_element);
+    check_element.style.visibility = "visible";
+  }
+}
+
+function hoverout(){
+const innerWidth = window.innerWidth;
+console.log(innerWidth);
+if(innerWidth>1024){
+    const check_element     = this.firstChild.lastChild;
+    console.log(check_element);
+    check_element.style.visibility = "hidden";
+  }
+}
+
+  function hamburger(){
+    const nodeList = document.querySelectorAll(".dropdown-content");
+    for (let i = 0; i < nodeList.length; i++) {
+    nodeList[i].classList.remove("show-dropdown-content");}
+    var element = document.getElementById("card-navigation");
+    element.classList.toggle("hidden");
+
+    const spans = this.children;
+    var first_check = spans[0].classList.contains("hamburger-swing-0");
+    
+    if(first_check == true){
+      for (let i = 0; i < spans.length; i++)
+      {spans[i].classList.remove("hamburger-swing-"+i);} 
+      const rotate_list     = document.querySelectorAll(".dd-symbol");
+      for (let i = 0; i < rotate_list.length; i++)
+      {rotate_list[i].classList.remove("rotate-symbol");}     
+      }else{
+      for (let i = 0; i < spans.length; i++)
+      {spans[i].classList.add("hamburger-swing-"+i);} }
+}
+</script>
+
+<svelte:window bind:innerWidth />
+
+
+<div class="hamburger_menu py-1 px-2 bg-secondary
+            xs:px-6
+            lg:hidden">
+
+              <div id="hamburger" on:click={hamburger} on:keydown={hamburger} class="cursor-pointer">
+                <span></span>
+                <span></span>
+                <span></span>
+              </div>
+</div>
+
+
+
+<nav id="card-navigation" class="card-navigation hidden box lg:block"> 
+
+  <div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
+    {#if innerWidth > 1023}
+    <a href="" class="nav-element-child xl:rounded-t-[.75rem]">Energieausweis erstellen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
+    {:else}
+    <a href="#" class="nav-element-child xl:rounded-t-[.75rem]">Energieausweis erstellen<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
+    {/if}
+    
+    <ul class="dropdown-content energieasusweis-erstellen">
+      {#if innerWidth < 1023}
+      <li><a href="">Energieausweis erstellen</a></li>
+      {/if}
+      <li><a href="">Verbrauchsausweis erstellen</a></li>
+      <li><a href="">Bedarfsausweis erstellen</a></li>
+      <li><a href="">Verbrauchsausweis Gewerbe erstellen</a></li>
+      <li><a href="">Bedarfsausweis Gewerbe erstellen</a></li>
+    </ul>
+  </div>
+
+  <div class="nav-element dropdown">
+    <div class="nav-element-child">Welcher Energieausweis?</div>
+  </div>
+
+<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
+  <a href="#" class="nav-element-child">Verbrauchsausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
+    <ul class="dropdown-content verbrauchsausweis">
+      {#if innerWidth < 1023}
+      <li><a href="">Verbrauchsausweis</a></li>
+      {/if}
+      <li><a href="">Verbrauchsausweis Wohngebäude</a></li>
+      <li><a href="">Verbrauchsausweis online erstellen</a></li>
+      <li><a href="">Häufige Fragen zum Verbrauchsausweis</a></li>
+      <li><a href="">Statistiken zum Verbrauchsausweis Wohngebäude</a></li>
+      <li><a href="">Verbrauchsausweis Gewerbe</a></li>
+      <li><a href="">Verbrauchsausweis Gewerbe online erstellen</a></li>
+      <li><a href="">Häufige Fragen zum Verbrauchsausweis Gewerbe</a></li>
+      <li><a href="">Statistiken zum Verbrauchsausweis Gewerbe</a></li>
+  </div>
+
+<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
+  <a href="#" class="nav-element-child">Bedarfsausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
+    <ul class="dropdown-content bedarfsausweis">
+      {#if innerWidth < 1023}
+      <li><a href="">Bedarfsausweis</a></li>
+      {/if}
+      <li><a href="">Bedarfsausweis Wohngebäude</a></li>
+      <li><a href="">Bedarfsausweis online erstellen</a></li>
+      <li><a href="">Häufige Fragen zum Bedarfsausweis</a></li>
+      <li><a href="">Statistiken zum Bedarfsausweis Wohngebäude</a></li>
+      <li><a href="">Bedarfsausweis Gewerbe</a></li>
+      <li><a href="">Bedarfsausweis Gewerbe online erstellen</a></li>
+      <li><a href="">Häufige Fragen zum Bedarfsausweis Gewerbe</a></li>
+      <li><a href="">Statistiken zum Bedarfsausweis Gewerbe</a></li>
+    </ul>
+</div>
+
+
+<div class="nav-element dropdown lg:dropdown-right" on:click={dropdown} on:keydown={dropdown} on:mouseover={hover} on:mouseleave={hoverout}>
+  <a href="#" class="nav-element-child">Energieausweis<span class="dd-symbol-clone">❯</span><span class="dd-symbol">❯</span></a>
+  <ul class="dropdown-content energieausweis">
+    {#if innerWidth < 1023}
+    <li><a href="">Energieausweis</a></li>
+    {/if}
+    <li class=""><a href="">Energieausweis Pflicht</a></li>
+    <li class=""><a href="">Energieausweis Kosten</a></li>
+    <li class=""><a href="">Energieausweis Haus</a></li>
+  </ul>
+</div>
+
+<div class="nav-element dropdown">
+  <div class="nav-element-child">EnEV Zusammenfassung - Archiv</div>
+</div>
+<div class="nav-element dropdown">
+  <div class="nav-element-child">Energieausweis Aussteller</div>
+</div>
+<div class="nav-element dropdown">
+  <div class="nav-element-child">Kundenbewertungen</div>
+</div>
+<div class="nav-element dropdown">
+  <div class="nav-element-child">FAQ</div>
+</div>
+<div class="nav-element dropdown">
+  <div class="nav-element-child xl:!rounded-b-xl">Für Entwickler</div>
+</div>
+
+
+</nav>
+
+
+<style>
+
+
+
+.dd-symbol::before{
+  content:'❯';
+  font-size:0.95rem;
+  position:absolute;
+  top:0px;
+  left:-7px;
+  animation-name: flim;
+  animation-duration: 2s;
+  animation-iteration-count: infinite;
+}
+
+.dd-symbol{visibility: hidden;}
+
+.dd-symbol::after{
+  content:'❯';
+  font-size:0.95rem;
+  position:absolute;
+  top:0px;
+  right:-7px;
+  animation-name: flim;
+  animation-duration: 2s;
+  animation-delay: 1s;
+  animation-iteration-count: infinite;
+}
+
+  @keyframes flim{
+  0%   {opacity: 0;}
+  16.66%  {opacity: 0.25;}
+  33.32%  {opacity: 0.5;}
+  49.98%  {opacity: 0.75;}
+  66.64% {opacity: 0.5;}
+  83.33% {opacity: 0.25;}
+  100% {opacity: 0;}
+}
+
+
+
+</style>
--- a/src/components/UMBE_card-price-info.svelte
+++ b/src/components/UMBE_card-price-info.svelte
@@ -0,0 +1,41 @@
+<script>
+	import { PRICES } from "#lib/constants";
+</script>
+
+<div 	id ="card-price-info" 
+		class="	box card hidden bg-white px-6 py-4 mt-5
+				lg:block">
+	
+<div class="grid grid-cols-[max-content]">
+		
+<h2>Was wird der Energieausweis kosten?</h2>
+<hr class="mb-4 bg-primary h-[2px]">
+<p>Verbrauchsausweis Wohngebäude</p>
+<p>ab {PRICES.VerbrauchsausweisWohnen[0]}€ inkl. MwSt.</p>
+<hr>
+<p>Bedarfsausweis Wohngebäude</p>
+<p>ab {PRICES.BedarfsausweisWohnen[0]}€ inkl. MwSt.</p>
+<hr>
+<p>Verbrauchsausweis Gewerbe</p>
+<p>ab {PRICES.VerbrauchsausweisGewerbe[0]}€ inkl. MwSt.</p>
+<hr>
+<p>Bedarfsausweis Gewerbe</p>
+<p>ab 300€ inkl. MwSt.</p>
+<hr>
+<p>GEG-Nachweis Wohngebäude</p>
+<p>ab 400€ inkl. MwSt.</p>
+<hr>
+<p>GEG-Nachweis Gewerbe</p>
+<p>ab 450€ inkl. MwSt.</p>
+<hr class="mt-2">
+
+
+
+</div>
+</div>
+
+
+<style lang="scss">
+
+
+</style>
--- a/src/components/UMBE_card-review.svelte
+++ b/src/components/UMBE_card-review.svelte
--- a/src/components/UMBE_navcard.astro
+++ b/src/components/UMBE_navcard.astro
@@ -1,100 +1,96 @@
-<script>

+<script>


 </script>


-<ul id="main-navigation">
-    <a class="nav-element-link">
-    <li class="dropdown dropdown-right dropdown-hover nav-element w-full">Energieausweis erstellen<span>❯</span>
-    </a>
+<div class="">

-    <ul tabindex="0" class="nav-list dropdown-content z-[1] w-full">
-      <li class="nav-second"><a class="nav-element-link">Verbrauchsausweis erstellen</a></li>
-      <li class="nav-second"><a class="nav-element-link">Bedarfsausweis erstellen</a></li>
-      <li class="nav-second"><a class="nav-element-link">Verbrauchsausweis Gewerbe erstellen</a></li>
-      <li class="nav-second"><a class="nav-element-link">Bedarfsausweis Gewerbe erstellen</a></li>    
+<details  class="dropdown block xl:dropdown-right">
+    <summary  class="btn rounded-none w-full justify-start">Energieausweis erstellen<span class="absolute right-[20px]">❯</span></summary>
+    <ul class="dd-cont p-2 shadow menu dropdown-content z-[1] w-full bg-base-100">
+      <li class=""><a>Verbrauchsausweis erstellen</a></li>
+      <li class=""><a>Bedarfsausweis erstellen</a></li>
+      <li class=""><a>Verbrauchsausweis Gewerbe erstellen</a></li>
+      <li class=""><a>Bedarfsausweis Gewerbe erstellen</a></li>
    </ul>
+</details>

-</li>
+<details  class="dropdown block">
+    <summary  class="btn rounded-none w-full justify-start">Welcher Energieausweis?</summary>
+</details>

-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">Welcher Energieausweis</a>
-</li>
-
-<li class="dropdown lg:dropdown-bottom xl:dropdown-right dropdown-hover nav-element w-full">
-    <a class="nav-element-link" href="">Verbrauchsausweis<span>❯</span></a>
-    <ul tabindex="0" class="nav-list dropdown-content z-[1] w-full">
-    <li class="nav-second"><a class="nav-element-link">Item 1</a></li>
-    <li class="nav-second"><a class="nav-element-link">Item 2</a></li>
+<details  class="dropdown block xl:dropdown-hover xl:dropdown-right">
+    <summary  class="btn rounded-none w-full justify-start">Verbrauchsausweis<span class="absolute right-[20px]">❯</span></summary>
+    <ul class="dd-cont p-2 shadow menu dropdown-content z-[1] w-full bg-base-100">
+      <li class=""><a>Verbrauchsausweis Wohngebäude</a></li>
+      <li class=""><a>Verbrauchsausweis online erstellen</a></li>
+      <li class=""><a>Häufige Fragen zum Verbrauchsausweis</a></li>
+      <li class=""><a>Statistiken zum Verbrauchsausweis Wohngebäude</a></li>
+      <li class=""><a>Verbrauchsausweis Gewerbe</a></li>
+      <li class=""><a>Verbrauchsausweis Gewerbe online erstellen</a></li>
+      <li class=""><a>Häufige Fragen zum Verbrauchsausweis Gewerbe</a></li>
+      <li class=""><a>Statistiken zum Verbrauchsausweis Gewerbe</a></li>
    </ul>
-</li>
-
-<li class="dropdown dropdown-right dropdown-hover nav-element w-full">
-    <a class="nav-element-link" href="">Bedarfsausweis<span>❯</span></a>
-    <ul tabindex="0" class="nav-list dropdown-content z-[1] w-full">
-    <li class="nav-second"><a class="nav-element-link">Item 1</a></li>
-    <li class="nav-second"><a class="nav-element-link">Item 2</a></li>
+</details>
+<details  class="dropdown block xl:dropdown-hover xl:dropdown-right">
+    <summary  class="btn rounded-none w-full justify-start">Bedarfsausweis<span class="absolute right-[20px]">❯</span></summary>
+    <ul class="dd-cont p-2 shadow menu dropdown-content z-[1] w-full bg-base-100">
+      <li class=""><a>Bedarfsausweis Wohngebäude</a></li>
+      <li class=""><a>Bedarfsausweis online erstellen</a></li>
+      <li class=""><a>Häufige Fragen zum Bedarfsausweis</a></li>
+      <li class=""><a>Statistiken zum Bedarfsausweis Wohngebäude</a></li>
+      <li class=""><a>Bedarfsausweis Gewerbe</a></li>
+      <li class=""><a>Bedarfsausweis Gewerbe online erstellen</a></li>
+      <li class=""><a>Häufige Fragen zum Bedarfsausweis Gewerbe</a></li>
+      <li class=""><a>Statistiken zum Bedarfsausweis Gewerbe</a></li>
    </ul>
-</li>
-
-<li class="dropdown dropdown-right dropdown-hover nav-element w-full">
-    <a class="nav-element-link" href="">Energieausweis<span>❯</span></a>
-    <ul tabindex="0" class="nav-list dropdown-content z-[1] w-full">
-    <li class="nav-second"><a class="nav-element-link">Item 1</a></li>
-    <li class="nav-second"><a class="nav-element-link">Item 2</a></li>
+</details>
+<details  class="dropdown block xl:dropdown-hover xl:dropdown-right">
+    <summary  class="btn rounded-none w-full justify-start">Energieausweis<span class="absolute right-[20px]">❯</span></summary>
+    <ul class="dd-cont p-2 shadow menu dropdown-content z-[1] w-full bg-base-100">
+      <li class=""><a>Energieausweis Pflicht</a></li>
+      <li class=""><a>Energieausweis Kosten</a></li>
+      <li class=""><a>Energieausweis Haus</a></li>
    </ul>
-</li>
+</details>
+<details  class="dropdown block">
+    <summary  class="btn rounded-none w-full justify-start">EnEV Zusammenfassung - Archiv</summary>
+</details>
+<details  class="dropdown block">
+    <summary  class="btn rounded-none w-full justify-start">Energieausweis Aussteller</summary>
+</details>
+<details  class="dropdown block">
+    <summary  class="btn rounded-none w-full justify-start">Kundenbewertungen</summary>
+</details>

-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">EnEV Zusammenfassung - Archiv</a>
-</li>
-
-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">Energieausweis Aussteller</a>
-</li>
-
-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">Kundenbewertungen</a>
-</li>
-
-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">FAQ</a>
-</li>
-
-<li class="no-dropdown nav-element w-full">
-    <a class="nav-element-link" href="">Für Entwickler</a>
-</li>

 </div>

 <style>

-#main-navigation, .nav-list{border-top: 1px solid #ccc;}
-#main-navigation li{border-bottom: 1px solid #ccc;border-left: 1px solid #ccc;border-right: 1px solid #ccc;}
-
-.nav-element{
-	@apply p-2 bg-white font-normal text-lg hover:bg-primary hover:text-white
+.dd-cont{
+    @apply !relative lg:!absolute;
+    li{
+    @apply w-max  
+    }
 }

-.nav-second{
-	@apply p-2 bg-white font-normal text-lg hover:bg-secondary hover:text-white
-}
-
-.nav-element-link{
-	@apply text-black no-underline hover:no-underline hover:text-white 
-}
-
-.nav-element-link span{
-    position:absolute;right:15px;top:0.65rem;
+summary{
+    @apply text-black !text-[1.1rem] !font-normal
    
 }
-
-.nav-element:hover > .nav-element-link, .nav-second:hover > .nav-element-link{ 
-	@apply text-white
+details:hover > summary { 
+    @apply !bg-primary !text-white
+}
+details:hover > details.dd-cont { 
+    @apply !visible
 }

-.nav-element ul{margin: -1px 0;}
+
+
+
+

 </style>
--- a/src/components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt.ts
+++ b/src/components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt.ts
@@ -1,4 +1,4 @@
-import { GebaeudeAufnahmeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types";
+import { GebaeudeAufnahmeClient, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";

 export function auditBedarfsausweisBenoetigt(ausweis: VerbrauchsausweisWohnenClient, gebaeude: GebaeudeAufnahmeClient): boolean {
 	if (ausweis.ausstellgrund == "Neubau" || ausweis.ausstellgrund == "Modernisierung") {
@@ -12,7 +12,7 @@ export function auditBedarfsausweisBenoetigt(ausweis: VerbrauchsausweisWohnenCli
 	if (gebaeude.baujahr_gebaeude && gebaeude.baujahr_gebaeude.length > 0) {
 		return (
 			(gebaeude.baujahr_gebaeude[0] < 1978 &&
-				(gebaeude.einheiten || 0) <= 4 &&
+				(gebaeude.einheiten !== null && gebaeude.einheiten <= 4) &&
 				(gebaeude.saniert == false ) &&
 				(ausweis.ausstellgrund == "Vermietung" ||
 					ausweis.ausstellgrund == "Sonstiges" ||
--- a/src/components/Verbrauchsausweis/audits/PlzNichtErkannt.ts
+++ b/src/components/Verbrauchsausweis/audits/PlzNichtErkannt.ts
@@ -8,6 +8,7 @@ export const auditPlzNichtErkannt = memoize(async (gebaeude: GebaeudeAufnahmeCli
        if (gebaeude.plz.length == 5) {
            try {
                const result = await client.v1.postleitzahlen.query({ plz: gebaeude.plz, limit: 1 });
+								
                if (result.length > 0) {
                    return false;
                }
--- a/src/cronjobs/update-dwd-test.ts
+++ b/src/cronjobs/update-dwd-test.ts
@@ -4,7 +4,7 @@ import * as fs from "fs";

 const start = moment().set("year", 2019).set("month", 8).set("date", 1);

-const end = moment().set("year", 2023).set("month", 1).set("date", 1);
+const end = moment().set("year", 2023).set("month", 2).set("date", 1);

 let current = start.clone();

@@ -65,4 +65,4 @@ do {
 	);

 	console.log(`Wrote ${year}-${month} to file.`);
-} while (current.add(1, "month").isBefore(end));
+} while (current.add(1, "month").isSameOrBefore(end));
--- a/src/env.d.ts
+++ b/src/env.d.ts
@@ -1,3 +1,4 @@
+/// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />

 /// <reference path="../.astro-i18n/generated.d.ts" />
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,6 +1,7 @@
 ---
 import i18next from "i18next";

+import "../style/UMBE_global.css";
 import "../style/global.scss";
 import "../../svelte-dialogs.config"
 import Footer from "../components/Footer.astro";
--- a/src/layouts/MinimalLayout.astro
+++ b/src/layouts/MinimalLayout.astro
@@ -38,7 +38,7 @@ const schema = JSON.stringify({
 	},
 });

-const lightTheme = Astro.cookies.get("theme").value === "light";
+const lightTheme = Astro.cookies.get("theme")?.value === "light";
 ---

 <!DOCTYPE html>
--- a/src/layouts/UMBE_Layout.astro
+++ b/src/layouts/UMBE_Layout.astro
@@ -1,12 +1,10 @@
 ---
-import i18next from "i18next";
-
 import "../style/UMBE_global.css";
 import "../../svelte-dialogs.config"
-import Footer from "../components/UMBE_Footer.astro";
-import Header from "../components/UMBE_Header.astro";
-import SidebarLeft from "../components/UMBE_SidebarLeft.astro";
-import SidebarRight from "../components/UMBE_SidebarRight.astro";
+import Footer from "#components/UMBE_Footer.astro";
+import Header from "#components/UMBE_Header.astro";
+import SidebarLeft from "#components/UMBE_SidebarLeft.astro";
+import SidebarRight from "#components/UMBE_SidebarRight.astro";
 import { NotificationWrapper } from "@ibcornelsen/ui";

 export interface Props {
@@ -19,7 +17,7 @@ const { title } = Astro.props;
 ---

 <!DOCTYPE html>
-<html lang={i18next.language}>
+<html lang="de">
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />
@@ -34,18 +32,31 @@ const { title } = Astro.props;
 	</head>

 	<body>
-		<container class="max-w-[1920px] w-full mx-auto bg-slate-600 grid  border-solid border-grey-200 border">
+		<container class="w-full max-w-[1920px]">
+		
+		
+		
 		<Header />
 		<main
-			class="lg:grid gap-6 md:p-6 lg:grid-cols-[2fr,6fr,2fr] max-w-[1920px] w-full bg-base-100"
-		>
+			class="w-full p-0
+			
+			
+			lg:grid grid-cols-[max-content,6fr] lg:gap-3 lg:p-3
+			xl:grid-cols-[2fr,6fr,2fr]  xl:py-4 xl:px-3
+			2xl:grid-cols-[2fr,6fr,2fr] 2xl:gap-5 2xl:py-4 2xl:px-9
+
+		">
+
 		<SidebarLeft />
-			<article class="w-full max-w-full bg-base-200 border border-base-300">
+		
+		<article class="box grow">
 		<slot />
 		</article>
+		
 		<SidebarRight />

 		</main>
+	
 		<Footer />
 		<NotificationWrapper client:load />
 	</container>
@@ -54,43 +65,4 @@ const { title } = Astro.props;

 <style is:global lang="scss">

-	:root {
-		@apply bg-base-100 text-base-content;
-	}
-
-	article {
-		@apply rounded-lg w-full shadow-md border;
-	}
-
-	.mainContent {
-		p, h1, h2, h3, h4, h5, h6 {
-			@apply text-base-content;
-		}
-	}
-
-	body {
-		min-height: 100vh;
-	}
-
-	.button {
-		@apply px-8 py-2 bg-secondary rounded-lg text-white font-medium hover:shadow-lg transition-all hover:underline active:bg-blue-900 text-center cursor-pointer;
-		color: #fff !important;
-	}
-
-	h3 {
-		@apply text-xl font-medium mt-6 mb-4;
-	}
-
-	input {
-		@apply py-1.5 px-4 w-full rounded-lg outline-none text-lg text-slate-700 border bg-gray-50 transition-colors;
-	}
-
-	input:hover,
-	input:focus {
-		@apply bg-gray-100;
-	}
-
-	label {
-		@apply text-base font-semibold;
-	}
 </style>
--- a/src/layouts/UserLayout.astro
+++ b/src/layouts/UserLayout.astro
@@ -5,7 +5,7 @@ import "../style/global.scss";
 import "../../svelte-dialogs.config"
 import "svelte-ripple-action/ripple.css"
 import DashboardSidebar from "../components/Dashboard/DashboardSidebar.svelte"
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import { createCaller } from "#lib/caller";

 const valid = validateAccessTokenServer(Astro)
--- a/src/lib/XML/getEmpfehlungen.ts
+++ b/src/lib/XML/getEmpfehlungen.ts
@@ -1,4 +1,4 @@
-import { VerbrauchsausweisWohnenClient } from "#components/Ausweis/types";
+import { VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
 import { Enums } from "@ibcornelsen/database/client";
 import moment from "moment";

--- a/src/lib/caller.ts
+++ b/src/lib/caller.ts
@@ -1,11 +1,11 @@
 import { appRouter, t } from "@ibcornelsen/api";
-import { API_ACCESS_TOKEN_COOKIE_NAME } from "./constants";
+import { API_ACCESS_TOKEN_COOKIE_NAME } from "./constants.js";

 export const createCaller = function (opts: any) {
 	// 1. create a caller-function for your router
 	const createCaller = t.createCallerFactory(appRouter);
 	
-	const token = Buffer.from(opts.cookies.get(API_ACCESS_TOKEN_COOKIE_NAME).value ?? "", "utf-8").toString("base64");
+	const token = Buffer.from(opts.cookies.get(API_ACCESS_TOKEN_COOKIE_NAME)?.value ?? "", "utf-8").toString("base64");
 	// 2. create a caller using your `Context`
 	return createCaller({
 		authorization: `Bearer ${token}`,
--- a/src/lib/constants.ts
+++ b/src/lib/constants.ts
@@ -8,9 +8,11 @@ export const API_UID_COOKIE_NAME = "uid";
 * Ein Objekt welches alle definierten Preise für unsere Basisprodukte enthält.
 */
 export const PRICES: Record<Enums.Ausweisart, [number, number, number]> = {
+	// per E-Mail , inkl.Beratung, offline
 	BedarfsausweisWohnen: [135, 145, 290],
 	VerbrauchsausweisWohnen: [45, 55, 180],
 	VerbrauchsausweisGewerbe: [85, 95, 360],
+	BedarfsausweisGewerbe: [300, 0, 0]
 };

 export const SERVICES: Record<Enums.Ausweisart, Record<Enums.Service, number>> = {
--- a/src/lib/faker/verbrauchsausweis-wohnen.ts
+++ b/src/lib/faker/verbrauchsausweis-wohnen.ts
@@ -10,8 +10,8 @@ export function verbrauchsausweisWohnenFaker(seed: number = 42): Verbrauchsauswe
 	const verbrauch_4 = faker.number.int({ min: 5000, max: 15000 });

 	const ausweis: VerbrauchsausweisWohnenClient = {
-		rechnungen: null,
 		gebaeude_aufnahme_allgemein: {
+			rechnungen: [],
 			baujahr_gebaeude: [faker.number.int({ min: 1960, max: 2014 })],
 			baujahr_heizung: [faker.number.int({ min: 1960, max: 2014 })],
 			baujahr_klima: [faker.number.int({ min: 1985, max: 2014 })],
@@ -84,7 +84,8 @@ export function verbrauchsausweisWohnenFaker(seed: number = 42): Verbrauchsauswe
 			zirkulation: faker.datatype.boolean(),
 			zurueckgestellt: faker.datatype.boolean(),
 			uid: faker.string.uuid(),
-			events: []
+			events: [],
+			ausstellungsdatum: faker.date.past()
 		},
 		verbrauch_1: verbrauch_1,
 		verbrauch_2: verbrauch_1 + faker.number.int({ min: -2000, max: 2000 }),
@@ -99,10 +100,7 @@ export function verbrauchsausweisWohnenFaker(seed: number = 42): Verbrauchsauswe
 		anteil_warmwasser_1: faker.number.int({ min: 0, max: 60 }),
 		anteil_warmwasser_2: faker.number.int({ min: 0, max: 60 }),
 		ausstellgrund: faker.helpers.enumValue(Enums.Ausstellgrund),
-		ausstellungsdatum: faker.date.past(),
 		einheit_2: "kWh",
-		erledigt: faker.datatype.boolean(),
-		erstellungsdatum: faker.date.past(),
 		keller_beheizt: faker.datatype.boolean(),
 		registriernummer: faker.string.uuid(),
 		startdatum: faker.date.past({ years: 3 }),
--- a/src/lib/pdf/images/verbrauch-pfeil.svg
+++ b/src/lib/pdf/images/verbrauch-pfeil.svg
@@ -0,0 +1,3 @@
+<svg width="165" height="225" viewBox="0 0 165 225" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M123.532 0H40.5V140H0L85.5 225L164.5 140H123.532V0Z" fill="#908580"/>
+</svg>
--- a/src/lib/pdf/pdfVerbrauchsausweisWohnen.ts
+++ b/src/lib/pdf/pdfVerbrauchsausweisWohnen.ts
@@ -0,0 +1,256 @@
+import { VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
+import { generate } from "@pdfme/generator";
+import VerbrauchsausweisWohnen2016Template from "../../lib/pdf/templates/GEG24_Verbrauchsausweis.json";
+import { convertAusweisData } from "#lib/AusweisData.js";
+
+/* -------------------------------- Pdf Tools ------------------------------- */
+import { variable } from "#lib/pdf/plugins/variables/index.js";
+import { text, image } from "@pdfme/schemas";
+import { Schema, Template } from "@pdfme/common";
+
+import { Moment } from "moment";
+import { endEnergieVerbrauchVerbrauchsausweis_2016 } from "#lib/Berechnungen/VerbrauchsausweisWohnen/VerbrauchsausweisWohnen_2016.js";
+import moment from "moment";
+import { getEmpfehlungen } from "#lib/XML/getEmpfehlungen.js";
+
+export async function pdfVerbrauchsausweisWohnen(ausweis: VerbrauchsausweisWohnenClient) {
+	const template = VerbrauchsausweisWohnen2016Template as Template;
+
+	const berechnungen = await endEnergieVerbrauchVerbrauchsausweis_2016(ausweis);
+	
+	let inputs: Record<string, string> = {};
+	
+	// Verbrauchszeiträume
+	const addVerbrauchszeitraum = (() => {
+		let row = 0;
+		let columnWidth = [16, 16, 80, 12, 18, 18, 18, 12];
+	
+		const getPosition = (column: number) => {
+			return {
+				position: {
+					x:
+						15 +
+						columnWidth.reduce(
+							(a, c, i) => (i >= column ? a : a + c),
+							0
+						),
+					y: 141 + row * 5,
+				},
+				height: 5,
+				width: 14,
+				type: "text",
+				fontSize: 8,
+				verticalAlign: "middle",
+			};
+		};
+	
+		return (
+			schema: Schema,
+			start: Moment,
+			end: Moment,
+			energietraeger: string,
+			primaerenergiefaktor: number,
+			energieverbrauch: number,
+			anteilWarmwasser: number,
+			klimafaktor: number
+		) => {
+			inputs[`verbrauchszeitraum_${row}_start`] = start.format("MM.YYYY");
+			inputs[`verbrauchszeitraum_${row}_end`] = end.format("MM.YYYY");
+			inputs[`verbrauchszeitraum_${row}_energietraeger`] = energietraeger;
+			inputs[`verbrauchszeitraum_${row}_primaerenergiefaktor`] =
+				primaerenergiefaktor.toString();
+			inputs[`verbrauchszeitraum_${row}_energieverbrauch`] =
+				energieverbrauch.toString();
+			inputs[`verbrauchszeitraum_${row}_anteil_warmwasser`] = Math.round(
+				anteilWarmwasser * energieverbrauch
+			).toString();
+			inputs[`verbrauchszeitraum_${row}_anteil_heizung`] = Math.round(
+				(1 - anteilWarmwasser) *
+				energieverbrauch
+			).toString();
+			inputs[`verbrauchszeitraum_${row}_klimafaktor`] =
+				klimafaktor.toString();
+	
+			schema[`verbrauchszeitraum_${row}_start`] = getPosition(0);
+			schema[`verbrauchszeitraum_${row}_end`] = getPosition(1);
+			schema[`verbrauchszeitraum_${row}_energietraeger`] = getPosition(2);
+			schema[`verbrauchszeitraum_${row}_primaerenergiefaktor`] =
+				getPosition(3);
+			schema[`verbrauchszeitraum_${row}_energieverbrauch`] = getPosition(4);
+			schema[`verbrauchszeitraum_${row}_anteil_warmwasser`] = getPosition(5);
+			schema[`verbrauchszeitraum_${row}_anteil_heizung`] = getPosition(6);
+			schema[`verbrauchszeitraum_${row}_klimafaktor`] = getPosition(7);
+	
+			row++;
+		};
+	})();
+	
+	
+	addVerbrauchszeitraum(
+		template.schemas[2],
+		moment(ausweis.startdatum),
+		moment(ausweis.startdatum).add("1", "year"),
+		ausweis.gebaeude_aufnahme_allgemein?.brennstoff_1,
+		berechnungen?.primaerfaktorww,
+		berechnungen?.verbrauch_1_kwh,
+		ausweis.anteil_warmwasser_1 / 100,
+		berechnungen?.klimafaktoren[0].klimafaktor
+	);
+	
+	addVerbrauchszeitraum(
+		template.schemas[2],
+		moment(ausweis.startdatum).add("1", "year"),
+		moment(ausweis.startdatum).add("2", "years"),
+		ausweis.gebaeude_aufnahme_allgemein?.brennstoff_1,
+		berechnungen?.primaerfaktorww,
+		berechnungen?.verbrauch_2_kwh,
+		ausweis.anteil_warmwasser_1 / 100,
+		berechnungen?.klimafaktoren[1].klimafaktor
+	);
+	
+	addVerbrauchszeitraum(
+		template.schemas[2],
+		moment(ausweis.startdatum).add("2", "years"),
+		moment(ausweis.startdatum).add("3", "years"),
+		ausweis.gebaeude_aufnahme_allgemein?.brennstoff_1,
+		berechnungen?.primaerfaktorww,
+		berechnungen?.verbrauch_3_kwh,
+		ausweis.anteil_warmwasser_1 / 100,
+		berechnungen?.klimafaktoren[2].klimafaktor
+	);
+	
+	if (ausweis.zusaetzliche_heizquelle) {
+		addVerbrauchszeitraum(
+		template.schemas[2],
+			moment(ausweis.startdatum),
+			moment(ausweis.startdatum).add("1", "year"),
+			ausweis.gebaeude_aufnahme_allgemein?.brennstoff_2,
+			berechnungen?.primaerfaktorww_1,
+			berechnungen?.verbrauch_4_kwh,
+			ausweis.anteil_warmwasser_2 / 100,
+			berechnungen?.klimafaktoren[0].klimafaktor
+		);
+	
+		addVerbrauchszeitraum(
+			template.schemas[2],
+			moment(ausweis.startdatum).add("1", "year"),
+			moment(ausweis.startdatum).add("2", "years"),
+			ausweis.gebaeude_aufnahme_allgemein?.brennstoff_2,
+			berechnungen?.primaerfaktorww_1,
+			berechnungen?.verbrauch_5_kwh,
+			ausweis.anteil_warmwasser_2 / 100,
+			berechnungen?.klimafaktoren[1].klimafaktor
+		);
+	
+		addVerbrauchszeitraum(
+			template.schemas[2],
+			moment(ausweis.startdatum).add("2", "years"),
+			moment(ausweis.startdatum).add("3", "years"),
+			ausweis.gebaeude_aufnahme_allgemein?.brennstoff_2,
+			berechnungen?.primaerfaktorww_1,
+			berechnungen?.verbrauch_6_kwh,
+			ausweis.anteil_warmwasser_2 / 100,
+			berechnungen?.klimafaktoren[1].klimafaktor
+		);
+	}
+	
+	const convertedInputs = { ...convertAusweisData(ausweis), ...inputs };
+	const empfehlungen = getEmpfehlungen(ausweis);
+	
+	const addEmpfehlung = (() => {
+		let i = 0;
+		let columnWidth = [9, 25, 81, 13, 10, 17, 31];
+	
+		const getPosition = (column: number) => {
+			return {
+				position: {
+					x:
+						13 +
+						columnWidth.reduce(
+							(a, c, i) => (i >= column ? a : a + c),
+							0
+						),
+					y: 94 + i * 15,
+				},
+				height: 15,
+				width: columnWidth[column],
+				type: "text",
+				fontSize: 8,
+				verticalAlign: "middle",
+			};
+		};
+	
+		return (empfehlung: ReturnType<typeof getEmpfehlungen>[0]) => {
+			template.schemas[3][`empfehlung_${i}_nr`] = getPosition(0)
+			template.schemas[3][`empfehlung_${i}_bauteil`] = getPosition(1)
+			template.schemas[3][`empfehlung_${i}_beschreibung`] = getPosition(2)
+			template.schemas[3][`empfehlung_${i}_amortisationszeit`] = getPosition(5)
+			template.schemas[3][`empfehlung_${i}_kosten`] = getPosition(6)
+	
+			convertedInputs[`empfehlung_${i}_nr`] = (i + 1).toString();
+			convertedInputs[`empfehlung_${i}_bauteil`] = empfehlung.anlagenteil;
+			convertedInputs[`empfehlung_${i}_beschreibung`] = empfehlung.description;
+			convertedInputs[`empfehlung_${i}_amortisationszeit`] = "";
+			convertedInputs[`empfehlung_${i}_kosten`] = "";
+	
+			i++;
+		}
+	})()
+	
+	
+	for (const empfehlung of empfehlungen) {
+		addEmpfehlung(empfehlung);
+	}
+	
+
+	// Fügt den Header mit Registriernummer und GEG Datum hinzu.
+	const addHeader = (page: number, includeRegistriernummer = true) => {
+		if (includeRegistriernummer) {
+			template.schemas[page]["ausweis.registriernummer"] = {
+				position: { x: 153, y: 37 },
+				height: 5,
+				width: 35,
+				type: "text",
+				fontSize: 8,
+				verticalAlign: "middle",
+			};
+		}
+
+		template.schemas[page]["geg_datum"] = {
+			position: { x: 108, y: 21.7 },
+			height: 5,
+			width: 25,
+			type: "text",
+			fontSize: 8,
+			verticalAlign: "middle",
+		};
+	}
+
+	for (let i = 0; i < template.schemas.length; i++) {
+		if (i == template.schemas.length - 1) {
+			// Die letzte Seite ist nur ein Anhang mit Erläuterungen, darauf ist keine Registriernummer vermerkt.
+			addHeader(i, false);
+		} else {
+			addHeader(i);
+		}
+	}
+
+	convertedInputs["ausweis.registriernummer"] = "1231234";
+	convertedInputs["geg_datum"] = "01.01.2024";
+	
+	
+	const pdf = await generate({
+		template,
+		plugins: { text, image, variable: { ...variable, pdf: variable.pdf.bind(convertedInputs), ui: variable.ui.bind(convertedInputs) } },
+		inputs: [convertedInputs],
+		options: {
+			author: "IB Cornelsen",
+			creationDate: new Date(),
+			creator: "IB Cornelsen",
+			language: "de",
+			title: "Verbrauchsausweis Wohnen GEG 2024",
+		},
+	});
+
+	return pdf;
+}
--- a/src/modules/Ausweise/VerbrauchsausweisWohnenModule.svelte
+++ b/src/modules/Ausweise/VerbrauchsausweisWohnenModule.svelte
@@ -9,25 +9,25 @@
 	import ZipSearch from "#components/PlzSuche.svelte";
 	import moment from "moment";
 	import BilderZusatzsysteme from "#components/Ausweis/BilderZusatzsysteme.svelte";
-	import { RawNotificationWrapper, RawNotification, notifications } from "@ibcornelsen/ui";
-	import { auditHeizungGebaeudeBaujahr } from "#components/Verbrauchsausweis/audits/HeizungGebaeudeBaujahr";
-	import { auditHeizungJuengerDreiJahre } from "#components/Verbrauchsausweis/audits/HeizungJuengerDreiJahre";
-	import { auditZeitraumAktuell } from "#components/Verbrauchsausweis/audits/ZeitraumAktuell";
-	import { auditKlimaFaktoren } from "#components/Verbrauchsausweis/audits/KlimaFaktoren";
-	import { auditWohnFlaeche } from "#components/Verbrauchsausweis/audits/WohnFlaeche";
-	import { auditWarmWasser } from "#components/Verbrauchsausweis/audits/WarmWasser";
-	import { auditLeerStand } from "#components/Verbrauchsausweis/audits/LeerStand";
-	import { auditPlzNichtErkannt } from "#components/Verbrauchsausweis/audits/PlzNichtErkannt";
-	import { AuditType, hidden } from "#components/Verbrauchsausweis/audits/hidden";
-	import { auditBedarfsausweisBenoetigt } from "#components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt";
-	import { auditVerbrauchAbweichung } from "#components/Verbrauchsausweis/audits/VerbrauchAbweichung";
-	import { auditEndEnergie } from "#components/Verbrauchsausweis/audits/EndEnergie";
-	import { auditWohnflaecheGroesserGesamtflaeche } from "#components/Verbrauchsausweis/audits/WohnflaecheGroesserGesamtflaeche";
+	import { RawNotificationWrapper, RawNotification, notifications } from "#components/Notifications/index.js";
+	import { auditHeizungGebaeudeBaujahr } from "#components/Verbrauchsausweis/audits/HeizungGebaeudeBaujahr.js";
+	import { auditHeizungJuengerDreiJahre } from "#components/Verbrauchsausweis/audits/HeizungJuengerDreiJahre.js";
+	import { auditZeitraumAktuell } from "#components/Verbrauchsausweis/audits/ZeitraumAktuell.js";
+	import { auditKlimaFaktoren } from "#components/Verbrauchsausweis/audits/KlimaFaktoren.js";
+	import { auditWohnFlaeche } from "#components/Verbrauchsausweis/audits/WohnFlaeche.js";
+	import { auditWarmWasser } from "#components/Verbrauchsausweis/audits/WarmWasser.js";
+	import { auditLeerStand } from "#components/Verbrauchsausweis/audits/LeerStand.js";
+	import { auditPlzNichtErkannt } from "#components/Verbrauchsausweis/audits/PlzNichtErkannt.js";
+	import { AuditType, hidden } from "#components/Verbrauchsausweis/audits/hidden.js";
+	import { auditBedarfsausweisBenoetigt } from "#components/Verbrauchsausweis/audits/BedarfsausweisBenoetigt.js";
+	import { auditVerbrauchAbweichung } from "#components/Verbrauchsausweis/audits/VerbrauchAbweichung.js";
+	import { auditEndEnergie } from "#components/Verbrauchsausweis/audits/EndEnergie.js";
+	import { auditWohnflaecheGroesserGesamtflaeche } from "#components/Verbrauchsausweis/audits/WohnflaecheGroesserGesamtflaeche.js";
 	import { Enums } from "@ibcornelsen/database/client"
 	import Overlay from "#components/Overlay.svelte";
 	import AusweisGespeichertModule from "./AusweisGespeichertModule.svelte";
-	import { VerbrauchsausweisWohnenClient, BenutzerClient, UploadedGebaeudeBild } from "#components/Ausweis/types";
-	import { verbrauchsausweisWohnenSpeichern } from "src/client/lib/verbrauchsausweisWohnenSpeichern";
+	import { VerbrauchsausweisWohnenClient, BenutzerClient, UploadedGebaeudeBild } from "#components/Ausweis/types.js";
+	import { verbrauchsausweisWohnenSpeichern } from "src/client/lib/verbrauchsausweisWohnenSpeichern.js";
 		
 	// TODO: Vom Server sollte ein volles Objekt kommen, dass alle Subobjekte enthält, weil es sonst zu Problemen führen kann
 	// wenn gebaeude_aufnahme_allgemein oder gebaeude_stammdaten nicht existiert...
--- a/src/pages/404.astro
+++ b/src/pages/404.astro
@@ -1,9 +1,6 @@
 ---

-import { BoxWithHeading } from "@ibcornelsen/ui";
-import Widget from "#components/Widget.svelte";
 import Layout from "#layouts/Layout.astro";
-import FeatureCard from "#components/FeatureCard.svelte";


 ---
--- a/src/pages/UMBE_test.astro
+++ b/src/pages/UMBE_test.astro
@@ -1,16 +1,18 @@
 ---
-
-
 import Layout from "#layouts/UMBE_Layout.astro";
-
+import BannerPrice from "#components/UMBE_banner-saeule.svelte";

 ---

-<Layout title="Energieausweis online erstellen - Online Energieausweis">
-	<h1>HALLO</h1>
+<Layout title="Energieausweis online erstellen - Online Energieausweis" client:load>
+	<h1>Energieausweis online erstellen</h1>
+	
+	<BannerPrice client:load />
 	


-	</div>
 </Layout>

+
+
+
--- a/src/pages/agb.mdx
+++ b/src/pages/agb.mdx
--- a/src/pages/auth/login.astro
+++ b/src/pages/auth/login.astro
@@ -1,6 +1,6 @@
 ---
 import LoginModule from "../../modules/LoginModule.svelte";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import MinimalLayout from "#layouts/MinimalLayout.astro";

 const valid = await validateAccessTokenServer(Astro)
--- a/src/pages/auth/passwort-vergessen.astro
+++ b/src/pages/auth/passwort-vergessen.astro
@@ -1,6 +1,6 @@
 ---
 import PasswortVergessenModule from "../../modules/Auth/PasswortVergessenModule.svelte";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import MinimalLayout from "#layouts/MinimalLayout.astro";

 const valid = await validateAccessTokenServer(Astro)
--- a/src/pages/auth/passwort-zuruecksetzen.astro
+++ b/src/pages/auth/passwort-zuruecksetzen.astro
@@ -1,6 +1,6 @@
 ---
 import PasswortZuruecksetzenModule from "../../modules/Auth/PasswortZuruecksetzenModule.svelte";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import MinimalLayout from "#layouts/MinimalLayout.astro";

 const valid = await validateAccessTokenServer(Astro)
--- a/src/pages/auth/signup.astro
+++ b/src/pages/auth/signup.astro
@@ -1,7 +1,7 @@
 ---
 import RegisterModule from "../../modules/RegisterModule.svelte";
 import MinimalLayout from "#layouts/MinimalLayout.astro";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";

 const valid = await validateAccessTokenServer(Astro)

--- a/src/pages/dashboard/admin/ausweise-pruefen.astro
+++ b/src/pages/dashboard/admin/ausweise-pruefen.astro
@@ -1,6 +1,6 @@
 ---
 import UserLayout from "../../../layouts/UserLayout.astro";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import DashboardAusweisePruefenModule from "#modules/Dashboard/DashboardAusweisePruefenModule.svelte";
 import { prisma } from "@ibcornelsen/database/server";
 import { createCaller } from "#lib/caller";
--- a/src/pages/dashboard/ausweise/index.astro
+++ b/src/pages/dashboard/ausweise/index.astro
@@ -2,7 +2,7 @@
 import UserLayout from "../../../layouts/UserLayout.astro";
 import DashboardAusweiseModule from "#modules/Dashboard/DashboardAusweiseModule.svelte";

-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import { createCaller } from "#lib/caller";

 const accessTokenValid = await validateAccessTokenServer(Astro);
--- a/src/pages/dashboard/einstellungen/index.astro
+++ b/src/pages/dashboard/einstellungen/index.astro
@@ -2,7 +2,7 @@
 import UserLayout from "#layouts/UserLayout.astro";
 import { createCaller } from "#lib/caller";
 import DashboardEinstellungenModule from "#modules/Dashboard/DashboardEinstellungenModule.svelte";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";

 const valid = await validateAccessTokenServer(Astro);

--- a/src/pages/dashboard/index.astro
+++ b/src/pages/dashboard/index.astro
@@ -1,7 +1,7 @@
 ---
 import { createCaller } from "#lib/caller";
 import UserLayout from "../../layouts/UserLayout.astro";
-import { validateAccessTokenServer } from "src/server/lib/validateAccessToken";
+import { validateAccessTokenServer } from "#server/lib/validateAccessToken";
 import DashboardModule from "#modules/Dashboard/DashboardModule.svelte";

 const accessTokenValid = await validateAccessTokenServer(Astro);
@@ -12,7 +12,7 @@ if (!accessTokenValid) {

 const caller = createCaller(Astro);

-const user = await caller.v1.benutzer.self();
+const user = await caller.v1.benutzer.self(undefined);
 const gebaeudeArray = await caller.v1.gebaeude.getMany({ limit: 5 });
 ---

--- a/src/pages/energieausweis-aussteller.mdx
+++ b/src/pages/energieausweis-aussteller.mdx
--- a/src/pages/enev-zusammenfassung.mdx
+++ b/src/pages/enev-zusammenfassung.mdx
--- a/src/pages/kundenbewertungen.mdx
+++ b/src/pages/kundenbewertungen.mdx
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Moritz Utcke	f600670e60	Cookie Fehler	2024-11-20 12:24:04 +11:00
Moritz Utcke	60c6785abd	Ausweis ohne Pfeile und Bedarfsausweis Nachricht überarbeitet.	2024-11-20 12:15:19 +11:00
Moritz Utcke	39c681cd51	Update Makefile	2024-11-14 15:23:18 +11:00
Moritz Utcke	a242774e8b	Workflow Update	2024-11-14 15:08:07 +11:00
Moritz Utcke	9fe5e0b8f6	Notification Wrapper auf Lokale Version gesetzt anstatt @ibcornelsen/ui, Config upgedated und Ansichtsausweis repariert.	2024-11-14 15:05:25 +11:00
Moritz Utcke	c6b31acd9c	Cookie Fehler	2024-11-13 13:29:44 +11:00
Moritz Utcke	ec309bfd7c	Update Makefile und VerbrauchsausweisWohnenModule aufgeräumt.	2024-11-13 12:25:01 +11:00
Moritz Utcke	a84d9f2c97	Update Makefile	2024-11-13 11:23:46 +11:00
Moritz Utcke	b0201c250f	mdx Seiten wieder in pages gepackt und Dependencies upgedated.	2024-11-11 12:15:01 +11:00
Moritz Utcke	754f6ab47a	Sidebar überarbeitet Layout nach den Vorgabenvon Umbe angepasst	2024-11-06 12:55:28 +11:00
Moritz Utcke	6e9857c582	Update build.sh	2024-11-06 12:31:27 +11:00
Moritz Utcke	fcd187e875	Update Makefile	2024-11-06 12:19:19 +11:00
Moritz Utcke	726c88da87	Update Makefile	2024-11-06 12:15:00 +11:00
Moritz Utcke	53fa0c12ca	build.sh verbessert	2024-11-06 12:02:57 +11:00
Moritz Utcke	592ee531ba	Merge pull request #7 from IBCornelsen/UMBE Änderungen am Design durch Umbe	2024-11-06 11:28:14 +11:00
Moritz Utcke	a36619fa07	Merge branch 'main' into UMBE	2024-11-06 11:27:20 +11:00
Moritz Utcke	2b7387c5f7	.xopp entfernt	2024-11-06 11:17:46 +11:00
Moritz Utcke	655e7e992c	Update src/trpc.ts	2024-11-04 17:30:37 +11:00
Moritz Utcke	9dd1a55940	Update src/trpc.ts	2024-11-04 17:27:38 +11:00
Moritz Utcke	5d4a2cee96	Update Makefile	2024-11-04 17:16:07 +11:00
Moritz Utcke	d9f9f1df34	Update environment api route	2024-11-04 17:13:28 +11:00
Moritz Utcke	36ceef2729	Logfiles	2024-11-04 16:48:02 +11:00
Moritz Utcke	c42046eb00	Update package.json	2024-11-04 16:29:39 +11:00
Moritz Utcke	da9ffec877	Makefile	2024-11-04 15:15:10 +11:00
Moritz Utcke	e113aa5c61	Kontrollsystem GEG Dateien	2024-09-25 17:46:09 +09:30
Moritz Utcke	e290f9e231	Network Fix Alte deps entfernt, import Pfade angepasst und das Netzwerk Problem das Umbe hatte provisorisch gelöst.	2024-08-17 12:24:22 +08:00
Robert Jagtiani	4468871552	UMBE-new	2024-05-23 18:04:20 +02:00
Moritz Utcke	766e0b125a	Update build file	2024-05-15 16:29:39 +07:00
Moritz Utcke	d1c7ce8e6f	Verbrauchsausweis Wohnen 2024 hinzugefügt	2024-05-15 16:24:23 +07:00
Robert Jagtiani	b5ed22589f	Update Template Files	2024-04-16 00:05:35 +02:00
Moritz Utcke	069bc53ce5	Merge branch 'main' of https://github.com/IBCornelsen/online-energieausweis	2024-03-26 11:05:15 +07:00
Moritz Utcke	fc9fb73872	Ansichtsausweis + Verbrauchsausweis Wohnen Test	2024-03-26 11:05:08 +07:00
Moritz Utcke	2769580d2f	Merge pull request #6 from IBCornelsen/49-plausibilittsprfung--saniert-autochec 49 Plausibilitätsprüfung / Saniert: Autocheck Dämmung abwählbar machen	2024-03-21 20:50:31 +07:00
Robert Jagtiani	0815957448	Kommentar zu den Preisen	2024-03-14 16:18:26 +01:00
UMBENOMENA	9bc5a11a89	Merge pull request #4 from IBCornelsen/main UMBE updaten	2024-03-14 16:06:40 +01:00