diff --git a/middleware.ts b/middleware.ts
index 62239265..32f1f558 100644
--- a/middleware.ts
+++ b/middleware.ts
@@ -51,7 +51,8 @@ const i18nMiddleware = (req: NextRequest) => {
   if (
     req.nextUrl.pathname.indexOf('icon') > -1 ||
     req.nextUrl.pathname.indexOf('chrome') > -1 ||
-    req.nextUrl.pathname.indexOf('api') > -1
+    req.nextUrl.pathname.indexOf('api') > -1 ||
+    req.nextUrl.pathname.indexOf('static') > -1
   ) {
     return NextResponse.next()
   }
diff --git a/prisma/seed/data/themes.json b/prisma/seed/data/themes.json
index 32459b9e..2e0d5c25 100644
--- a/prisma/seed/data/themes.json
+++ b/prisma/seed/data/themes.json
@@ -9,6 +9,17 @@
     "button_color": "#38383a",
     "background_color": "white"
   },
+  {
+    "name": "Zeitgeisty",
+    "shadow_color": "rgba(56,56.58, 0.9)",
+    "border": "3px solid #38383a",
+    "box_shadow": "none",
+    "border_radius": "0px",
+    "text_color": "#38383a",
+    "button_color": "#38383a",
+    "background_color": "white",
+    "fontFamily": "Albertsthal Typewriter"
+  },
   {
     "name": "Funky",
     "shadow_color": "rgba(237, 130, 222, 0.9)",
diff --git a/public/static/fonts/AlbertsthalTypewriter.ttf b/public/static/fonts/AlbertsthalTypewriter.ttf
new file mode 100644
index 00000000..29793cd0
Binary files /dev/null and b/public/static/fonts/AlbertsthalTypewriter.ttf differ
diff --git a/src/components/Viewer/ContentTypes/TitleContent.tsx b/src/components/Viewer/ContentTypes/TitleContent.tsx
index bfb33435..77d5c83f 100644
--- a/src/components/Viewer/ContentTypes/TitleContent.tsx
+++ b/src/components/Viewer/ContentTypes/TitleContent.tsx
@@ -8,5 +8,11 @@ interface TitleContentProps extends React.HTMLAttributes<HTMLFormElement> {
 }
 
 export function TitleContent({ content }: TitleContentProps) {
-  return <div>{content.content && <h1>{content.content}</h1>}</div>
+  return (
+    <div>
+      {content.content && (
+        <h1 className="enable-theme-font">{content.content}</h1>
+      )}
+    </div>
+  )
 }
diff --git a/src/components/Viewer/StoryOverviewContols.tsx b/src/components/Viewer/StoryOverviewContols.tsx
index 085c09a4..b5b249ea 100644
--- a/src/components/Viewer/StoryOverviewContols.tsx
+++ b/src/components/Viewer/StoryOverviewContols.tsx
@@ -124,7 +124,7 @@ export function StoryOverviewControls({ slug, page, story, tags }: Props) {
         {story && (
           <div className="flex max-w-fit flex-col">
             <div className="bg-gray flex flex-row gap-2">
-              <h3 className="max-w-[500px]">{story?.name}</h3>
+              <h3 className="enable-theme-font max-w-[500px]">{story?.name}</h3>
             </div>
 
             {page == 'start' && (
diff --git a/src/helper/applyTheme.tsx b/src/helper/applyTheme.tsx
index 017efc72..f40c257b 100644
--- a/src/helper/applyTheme.tsx
+++ b/src/helper/applyTheme.tsx
@@ -35,6 +35,12 @@ export function applyTheme(theme: any) {
             theme[key],
           )
           break
+        case 'fontFamily':
+          document.documentElement.style.setProperty(
+            '--font-family',
+            theme[key],
+          )
+          break
       }
     })
   }
diff --git a/src/styles/elements.scss b/src/styles/elements.scss
index fd056745..4de5f4b8 100644
--- a/src/styles/elements.scss
+++ b/src/styles/elements.scss
@@ -53,6 +53,10 @@ html {
   box-shadow: var(--boxshadow);
   color: var(--text-color);
   background-color: var(--background-color);
+
+  .enable-theme-font {
+    font-family: var(--font-family);
+  }
 }
 
 .re-basic-box-no-shadow {
diff --git a/src/styles/typo.scss b/src/styles/typo.scss
index ad321569..7a02090d 100644
--- a/src/styles/typo.scss
+++ b/src/styles/typo.scss
@@ -19,3 +19,8 @@ p {
   line-height: 1.5rem; // text-base
   color: var(--text-color);
 }
+
+@font-face {
+  font-family: 'Albertsthal Typewriter';
+  src: url('/static/fonts/AlbertsthalTypewriter.ttf') format('truetype');
+}