diff --git a/_includes/header.njk b/_includes/header.njk
index 8e809ff..42567a6 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -1,6 +1,33 @@
 <header>
-  <a href="{{ "/" | locale_url }}" title="home">ESE Logo</a>
-  <nav>
-    {{ collections.mainNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
-  </nav>
+  <div class="header-container">
+    <a href="{{ "/" | locale_url }}" title="home">ESE Logo</a>
+    <nav id="mainNav">
+      {{ collections.mainNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
+    </nav>
+  </div>
 </header>
+
+{% css %}
+header {
+  position: sticky;
+  backdrop-filter: blur(5px);
+  background-color: #ffffffcc;
+  top: 0;
+  padding: 2rem 0;
+}
+.header-container {
+  max-width: 75rem;
+  margin-left: auto;
+  margin-right: auto;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+#mainNav ul {
+  margin: 0;
+  padding: 0;
+}
+#mainNav li {
+  display: inline;
+}
+{% endcss %}
diff --git a/_layouts/page.njk b/_layouts/page.njk
index 3460971..4ea16b3 100644
--- a/_layouts/page.njk
+++ b/_layouts/page.njk
@@ -9,6 +9,7 @@ eleventyComputed:
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{% if title %}{{ title }} | {% endif %}ESE {{ year }}</title>
+    <link rel="stylesheet" href="{% getBundleFileUrl "css" %}">
   </head>
   <body>
     {% include 'header.njk' %}
@@ -20,3 +21,10 @@ eleventyComputed:
     {% include 'footer.njk' %}
   </body>
 </html>
+
+{% css %}
+body {
+  font-family: sans-serif;
+  margin: 0;
+}
+{% endcss %}
