diff --git a/_config.ts b/_config.ts
index 6afc087..2a7edae 100644
--- a/_config.ts
+++ b/_config.ts
@@ -13,6 +13,10 @@ site.loadAssets([
   ".svg",
   ".pdf",
   ".woff2",
+  ".woff",
+  ".ttf",
+  ".otf",
+  ".js",
 ]);
 
 site.filter("title", (value = '') => value + (value ? " | " : "") + "MiOM");
diff --git a/_data/people.yml b/_data/people.yml
index 1350bc4..587e8b3 100644
--- a/_data/people.yml
+++ b/_data/people.yml
@@ -1,7 +1,25 @@
-- name: Benjamin Bädorf
-  role: Software Engineer
+- name: Alexander von Dombois
   pronouns: he/him
-  contact:
+  role: Product Design
+  contactOptions:
+    - name: MAIL
+      value: avd@miom.space
+    - name: INSTA
+      value: '@alexandervondombois'
+    - name: WEB
+      value: alexandervondombois.de
+
+- name: Helena Geisler
+  pronouns: she/her
+  role: Visual artist
+  contactOptions:
+    - name: MAIL
+      value: hsg@miom.space
+
+- name: Benjamin Bädorf
+  pronouns: he/him
+  role: Software Engineer
+  contactOptions:
     - name: MAIL
       value: byb@miom.space
     - name: GIT
@@ -14,9 +32,9 @@
       value: benjaminbaedorf.eu
 
 - name: Jhonas Wernery
-  role: System Engineer
   pronouns: he/him
-  contact:
+  role: System Engineer
+  contactOptions:
     - name: MAIL
       value: jfw@miom.space
     - name: GIT
diff --git a/_data/thingsWeAre.yml b/_data/thingsWeAre.yml
index 19ddfad..814fbe9 100644
--- a/_data/thingsWeAre.yml
+++ b/_data/thingsWeAre.yml
@@ -1,9 +1,9 @@
-- 'an Off'
-- 'a Creative'
-- 'a Coworking'
-- 'an Art'
-- 'a Tech'
-- 'a Meeting'
-- 'a Gallery'
-- 'an Event'
-- 'a People'
+- 'an off'
+- 'a creative'
+- 'a coworking'
+- 'an art'
+- 'a tech'
+- 'a meeting'
+- 'a gallery'
+- 'an event'
+- 'a people'
diff --git a/_includes/citations.njk b/_includes/citations.njk
deleted file mode 100644
index 4ed2241..0000000
--- a/_includes/citations.njk
+++ /dev/null
@@ -1,7 +0,0 @@
-<ol class="citation-list">
-  {% for citation in citations %}
-    <li>
-      <cite class="citation">{{ citation | md | safe }}</cite>
-    </li>
-  {% endfor %}
-</ol>
diff --git a/_includes/downloads.njk b/_includes/downloads.njk
deleted file mode 100644
index 3251863..0000000
--- a/_includes/downloads.njk
+++ /dev/null
@@ -1,18 +0,0 @@
-<section class="downloads">
-  <ul class="downloads-list">
-    {% for download in downloads %}
-      <li class="download">
-        <div class="download-name">{{ download.name | safe }}</div>
-        <a
-          href="{{ download.location }}"
-          class="download-link download-link_pdf"
-          download
-        >PDF</a>
-        <a
-          href="{{ download.web }}"
-          class="download-link"
-        >Web</a>
-      </li>
-    {% endfor %}
-  </ul>
-</section>
diff --git a/_includes/event-day.njk b/_includes/event-day.njk
deleted file mode 100644
index fdddec1..0000000
--- a/_includes/event-day.njk
+++ /dev/null
@@ -1,11 +0,0 @@
-<details class="event-day">
-  <summary class="event-day-heading">
-    {{ eventDay.heading }}
-  </summary>
-
-  {% if eventDay.events %}
-    {% for event in eventDay.events %}
-      {% include "event.njk" %}
-    {% endfor %}
-  {% endif %}
-</details>
diff --git a/_includes/event.njk b/_includes/event.njk
deleted file mode 100644
index cd53161..0000000
--- a/_includes/event.njk
+++ /dev/null
@@ -1,41 +0,0 @@
-<article class="event">
-  <p class="event-time">{{ event.time }}</p>
-
-  <h1 class="event-title">{{ event.title | safe }}</h1>
-
-  <p class="event-details">{{ event.details | safe }}</p>
-
-  <div class="event-description">{{ event.description | md | safe }}</div>
-
-  <address class="event-location">
-    {% if event.organiser %}
-      {{ event.organiser }}<br><br>
-    {% endif %}
-    
-    {{ event.location.name }}
-    {% if event.location.place %} <br>{{ event.location.place }} {% endif %}
-    {% if event.location.address %} <br>{{ event.location.address }} {% endif %}
-    {% if event.location.city %} <br>{{ event.location.city }} {% endif %}
-  </address>
-
-  {% if event.people %}
-    <div class="event-people">
-      <h5>Ansprechpartner:</h5>
-      <ul class="event-people-list">
-        {% for person in event.people %}
-          <li>
-            {% if person.name %}
-              {{ person.name }}
-            {% endif %}
-            {% if person.email %}
-              <br><a href="mailto:{{ person.email }}" class="event-people-link">{{ person.email }}</a>
-            {% endif %}
-            {% if person.tel %}
-              <br><a href="tel:{{ person.tel }}" class="event-people-link">{{ person.tel }}</a>
-            {% endif %}
-          </li>
-        {% endfor %}
-      </ul>
-    </div>
-  {% endif %}
-</article>
diff --git a/_includes/footer.njk b/_includes/footer.njk
index fe1bd21..d37bb5b 100644
--- a/_includes/footer.njk
+++ b/_includes/footer.njk
@@ -1,9 +1,9 @@
-<footer class="footer">
+<footer class="mi-footer mi-content">
   <nav>
-    <ul class="footer-links">
-      <li><a href="/impressum" class="footer-link">Impressum</a></li>
-      <li><a href="/datenschutz" class="footer-link">Datenschutz</a></li>
-      <li><a href="/impressum/barrierefreiheit" class="footer-link">Barrierefreiheit</a></li>
+    <ul class="mi-footer--links">
+      <li><a href="/imprint" class="mi-footer--link">Imprint</a></li>
+      <li><a href="/dataprivacy" class="mi-footer--link">Dataprivacy</a></li>
+      <li><a href="/accessibility" class="mi-footer--link">Accessibility</a></li>
     </ul>
   </nav>
 </footer>
diff --git a/_includes/hero.njk b/_includes/hero.njk
deleted file mode 100644
index f7b4db6..0000000
--- a/_includes/hero.njk
+++ /dev/null
@@ -1,10 +0,0 @@
-<header class="mi-header mi-header_hero">
-  <h1 class="mi-header--headline">
-    MiOM 202 is
-    <div class="mi-header--things-we-are">
-      {% for thingWeAre in thingsWeAre %}
-        <span class="mi-header--thing-we-are">{{ thingWeAre }}</span>
-      {% endfor %}
-    </div>space
-  </h1>
-</header>
diff --git a/_includes/layouts/default.njk b/_includes/layouts/default.njk
index 76b2b15..9a46413 100644
--- a/_includes/layouts/default.njk
+++ b/_includes/layouts/default.njk
@@ -12,7 +12,6 @@
     <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0">
 
     <link rel="stylesheet" type="text/css" href="/styles.css{{ cssCacheBust }}" media="all" />
-    <link rel="stylesheet" type="text/css" href="/header.css{{ cssCacheBust }}" media="all" />
 
     {% if extraStylesheets %}
       {% for extraStylesheet in extraStylesheets %}
@@ -20,19 +19,23 @@
       {% endfor %}
     {% endif %}
   </head>
-  <body class="page">
-    {% block header %}
-      {% include "header.njk" %}
-    {% endblock %}
+  <body class="mi-page">
+    <h1 class="mi-page--we-are mi-page--title mi-page--title_side"><span class="mi-logo">MiOM 202</span> is</h1>
+    <p class="mi-things-we-are mi-page--title mi-content">
+      {% for thingWeAre in thingsWeAre %}
+        <span class="mi-things-we-are--thing">
+          {{ thingWeAre }}<span class="mi-things-we-are--space">space</span>
+        </span>
+      {% endfor %}
+    </p>
 
-    <main class="page-main">
+    <main class="mi-main mi-content">
       {% if article %}
         {{ article | md | safe }}
       {% endif %}
 
-      {% block special %}{% endblock %}
+      {% include "people.njk" %}
     </main>
-
     {% include "footer.njk" %}
   </body>
 </html>
diff --git a/_includes/layouts/homepage.njk b/_includes/layouts/homepage.njk
deleted file mode 100644
index 8f98f09..0000000
--- a/_includes/layouts/homepage.njk
+++ /dev/null
@@ -1,18 +0,0 @@
----
-themeColor: #FFFFFF
-language: en
-cssCacheBust: ''
-
-header: null
-article: null
----
-
-{% extends "layouts/default.njk" %}
-
-{% block header %}
-  {% include "hero.njk" %}
-{% endblock %}
-
-{% block special %}
-  {% include "people.njk" %}
-{% endblock %}
diff --git a/_includes/media.njk b/_includes/media.njk
deleted file mode 100644
index 5edc834..0000000
--- a/_includes/media.njk
+++ /dev/null
@@ -1,19 +0,0 @@
-<section
-  id="media"
-  class="media"
->
-  {% for medium in media %}
-    <h2>{{ medium.title }}</h2>
-
-    <figure class="media-iframe-parent">
-      <iframe
-        class="media-iframe"
-        src="https://www.youtube.com/embed/{{ medium.id }}"
-        title="YouTube video player"
-        frameborder="0"
-        allow="autoplay; clipboard-write; encrypted-media; picture-in-picture"
-        allowfullscreen
-      ></iframe>
-    </figure>
-  {% endfor %}
-</section>
diff --git a/_includes/navigation.njk b/_includes/navigation.njk
deleted file mode 100644
index e3d78a8..0000000
--- a/_includes/navigation.njk
+++ /dev/null
@@ -1,43 +0,0 @@
-<nav
-  id="navigation"
-  class="navigation"
->
-  <a href="/" class="logo navigation-link">
-    <img
-      class="logo-image"
-      src="/img/logo-60jahre.png"
-      alt="Unser Logo"
-    />
-  </a>
-
-  <button
-    type="button"
-    id="navigation-toggle"
-    class="navigation-toggle"
-    aria-label="Navigation Öffnen und Schliessen"
-  >
-    <span class="navigation-toggle-line"></span>
-    <span class="navigation-toggle-line"></span>
-    <span class="navigation-toggle-line"></span>
-  </button>
-
-  <script>
-    const navToggle = document.getElementById("navigation-toggle");
-    const nav = document.getElementById("navigation");
-    navToggle.addEventListener("click", function () {
-      nav.classList.toggle("navigation_open");
-    });
-  </script>
-
-  <ul class="menu">
-    <li class="menu-item">
-      <a href="/veranstaltungen" class="navigation-link">Veranstaltungen</a>
-    </li>
-    <li class="menu-item">
-      <a href="/medien" class="navigation-link">Medien</a>
-    </li>
-    <li class="menu-item">
-      <a href="/unterricht" class="navigation-link">Bildung</a>
-    </li>
-  </ul>
-</nav>
diff --git a/_includes/people.njk b/_includes/people.njk
index 883b774..5eac012 100644
--- a/_includes/people.njk
+++ b/_includes/people.njk
@@ -1,5 +1,18 @@
-<ol class="mi-people">
+<ul class="mi-people">
   {% for person in people %}
-    <li></li>
+    <li class="mi-person">
+      <h1 class="mi-person--name">{{ person.name }} ({{ person.pronouns }})</h1>
+      <p class="mi-person--role">{{ person.role }}</p>
+      <details>
+        <summary class="mi-person--contact-toggle">Contact</summary>
+        <ul class="mi-person--contact-options">
+          {% for contactOption in person.contactOptions %}
+            <li class="mi-person--contact-option">
+              <span class="mi-person--contact-option-name">{{ contactOption.name }}:</span> {{ contactOption.value }}
+            </li>
+          {% endfor %}
+        </ul>
+      </details>
+    </li>
   {% endfor %}
-</ol>
+</ul>
diff --git a/build.sh b/build.sh
index eff1358..de4d716 100755
--- a/build.sh
+++ b/build.sh
@@ -1,7 +1,4 @@
 #!/usr/bin/env bash
 
 lume
-cp -r ./img ./_site/
-cp -r ./unterricht/docs ./_site/unterricht/
 cp -r ./fonts ./_site/
-cp favicon.png ./_site/
diff --git a/fonts/vertikal/.DS_Store b/fonts/vertikal/.DS_Store
new file mode 100644
index 0000000..47f078e
Binary files /dev/null and b/fonts/vertikal/.DS_Store differ
diff --git a/fonts/vertikal/Vertikal-Info.pdf b/fonts/vertikal/Vertikal-Info.pdf
new file mode 100644
index 0000000..429f80b
Binary files /dev/null and b/fonts/vertikal/Vertikal-Info.pdf differ
diff --git a/fonts/vertikal/vertikal-bold.eot b/fonts/vertikal/vertikal-bold.eot
new file mode 100644
index 0000000..848424b
Binary files /dev/null and b/fonts/vertikal/vertikal-bold.eot differ
diff --git a/fonts/vertikal/vertikal-bold.otf b/fonts/vertikal/vertikal-bold.otf
new file mode 100644
index 0000000..875948d
Binary files /dev/null and b/fonts/vertikal/vertikal-bold.otf differ
diff --git a/fonts/vertikal/vertikal-bold.ttf b/fonts/vertikal/vertikal-bold.ttf
new file mode 100644
index 0000000..2a70333
Binary files /dev/null and b/fonts/vertikal/vertikal-bold.ttf differ
diff --git a/fonts/vertikal/vertikal-bold.woff b/fonts/vertikal/vertikal-bold.woff
new file mode 100644
index 0000000..89b6a63
Binary files /dev/null and b/fonts/vertikal/vertikal-bold.woff differ
diff --git a/fonts/vertikal/vertikal-bold.woff2 b/fonts/vertikal/vertikal-bold.woff2
new file mode 100644
index 0000000..21c4d7d
Binary files /dev/null and b/fonts/vertikal/vertikal-bold.woff2 differ
diff --git a/header.css b/header.css
deleted file mode 100644
index 6b8b504..0000000
--- a/header.css
+++ /dev/null
@@ -1,32 +0,0 @@
-.mi-header {
-  padding: 0 5vw;
-  --slide: 28vh;
-}
-
-.mi-header--headline {
-  font-weight: 900;
-  margin: 0;
-  margin-top: var(--slide);
-  font-size: 5vw;
-  display: flex;
-  flex-wrap: nowrap;
-  justify-content: flex-end;
-  align-items: flex-start;
-}
-
-.mi-header--things-we-are {
-  padding: 0 3vh;
-  margin: 0 3vh;
-  background: black;
-  color: white;
-  display: inline-block;
-  position: relative;
-  top: calc(-1 * var(--slide));
-}
-
-.mi-header--thing-we-are {
-  display: block;
-  position: relative;
-  left: 0;
-  top: 0;
-}
diff --git a/index.yml b/index.yml
index ae0175d..83ff752 100644
--- a/index.yml
+++ b/index.yml
@@ -1 +1 @@
-layout: layouts/homepage.njk
+layout: layouts/default.njk
diff --git a/styles.css b/styles.css
index bdfb058..9d90e60 100644
--- a/styles.css
+++ b/styles.css
@@ -1,23 +1,195 @@
-/*
-@import url('https://fonts.googleapis.com/css2?&family=Raleway:wght@900&display=swap');
-*/
+@import url('https://fonts.googleapis.com/css2?&family=Raleway:wght@900;400;100&display=swap');
 
 * {
   box-sizing: border-box;
 }
 
 html {
-  /*
-  font-family: 'Dosis', sans-serif;
-  */
   font-family: 'Raleway', sans-serif;
+
+  font-size: 7.3vw;
+  line-height: 150%;
 }
 
-.page {
+a {
+  color: #ff006c;
+}
+
+.mi-page {
+  margin: 0;
+  column-gap: 0.666rem;
+  padding: 0;
+  padding-left: 0.666rem;
+  display: grid;
+  grid-template-columns: 14vw 1fr;
+  grid-template-rows: auto auto auto auto;
+}
+
+.mi-page--title {
+  font-weight: 100;
+}
+
+.mi-logo {
+  font-weight: 100;
+}
+
+.mi-page--title_side {
+  position: sticky;
+  margin-top: 2rem;
+  top: 2rem;
+  font-size: 0.7rem;
+  line-height: 120%;
+  align-self: start;
+}
+
+.mi-page--we-are {
+  grid-row-start: 1;
+  grid-row-end: 2;
+  grid-column-start: 1;
+  grid-column-end: 2;
+}
+
+.mi-content {
+  grid-column-start: 2;
+  grid-column-end: 3;
+  background: black;
+  color: white;
+  padding: 0.666rem;
+  margin: 0;
+}
+
+.mi-things-we-are {
+  padding: 1rem 0;
+  grid-row-start: 1;
+  grid-row-end: 2;
+  display: flex;
+  font-size: 0.7rem;
+  flex-direction: column;
+  font-weight: 100;
+  position: relative;
+}
+
+.mi-things-we-are::before {
+  display: flex;
+  justify-content: right;
+  content: 'space';
+  position: sticky;
+  top: 1.5rem;
+  left: 0;
+  right: 0;
+  padding: 0.5em 0.666rem;
+  background: white;
+  color: black;
+  z-index: 0;
+}
+
+.mi-things-we-are--space {
+  opacity: 0;
+}
+
+.mi-things-we-are--thing {
+  padding: 0.5em 0.666rem;
+  white-space: nowrap;
+  mix-blend-mode: difference;
+  z-index: 1;
+  transition-property: background, color;
+  transition-duration: 0.2s;
+  transition-timing-function: ease;
+}
+
+.mi-things-we-are--thing:first-child {
+  margin-top: -1.7rem;
+}
+
+.mi-main {
+  grid-row-start: 2;
+  grid-row-end: 3;
+}
+
+.mi-footer {
+  grid-row-start: 3;
+  grid-row-end: 4;
+  grid-column-start: 2;
+  grid-column-end: 3;
+}
+
+.mi-people {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  font-size: 0.6rem;
+  line-height: 120%;
+}
+
+.mi-person {
+  margin-top: 1em;
+}
+
+.mi-person--name {
+  margin: 0;
+  font-size: 0.8em;
+}
+
+.mi-person--role {
+  margin: 0;
+}
+
+.mi-person--contact-toggle {
+  font-size: 0.4rem;
+  font-weight: 900;
+  color: #ff006c;
+  cursor: pointer;
+}
+
+.mi-person--contact-options {
   margin: 0;
   padding: 0;
-  display: grid;
-  overflow: hidden;
+  list-style: none;
+  font-size: 0.4rem;
 }
 
+.mi-person--contact-option-name {
+  color: #ff006c;
+}
 
+.mi-footer {
+  font-size: 0.5rem;
+}
+
+.mi-footer--links {
+  display: flex;
+  flex-direction: column;
+  list-style: none;
+  padding: 0;
+  line-height: 140%;
+}
+
+@media screen and (min-width: 1400px) {
+  html {
+    font-size: 5vw;
+  }
+
+  .mi-page {
+    grid-template-columns: auto 1fr;
+    grid-template-rows: auto auto auto auto;
+  }
+
+  .mi-page--title {
+    white-space: nowrap;
+    line-height: 200%;
+  }
+
+  .mi-things-we-are {
+    padding: 1.12rem 0;
+  }
+
+  .mi-things-we-are--thing:first-child {
+    margin-top: -1.6rem;
+  }
+
+  .mi-footer--links {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+}