diff --git a/_includes/footer.njk b/_includes/footer.njk
index 0786d35..5501661 100644
--- a/_includes/footer.njk
+++ b/_includes/footer.njk
@@ -1,7 +1,7 @@
 <footer>
 	<p>{% if metadata.copyrightNotice %}<span class="copyright-notice">{{ metadata.copyrightNotice }}</span>{% endif %}
 
-	{% if metadata.webrings %}
+	{% if metadata.webrings %}<br>
 	{% for webring in metadata.webrings %}
 	<span class="webring">
 	{% if webring.previousURL %}<a href="{{ webring.previousURL  }}">←</a>{% endif %}
diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk
index ba0ac71..7f6bb44 100644
--- a/_includes/layouts/base.njk
+++ b/_includes/layouts/base.njk
@@ -5,7 +5,6 @@
 		{#- Bundle CSS #}
 		{%- css %}{% include "public/css/index.css" %}{% endcss %}
 		{%- css %}{% include "public/css/webfonts/webfonts.css" %}{% endcss %}
-		{%- css %}{% include "public/css/dropcap.css" %}{% endcss %}
 		<style>{% getBundle "css" %}</style>
 		{% include "structuredData.njk" %}
     {% include "umami.html" %}
@@ -13,7 +12,9 @@
 	<body>
 		{% include "header.njk" %}
 		<main id="skip">
-			{{ content | safe }}
+			<section>
+				{{ content | safe }}
+			</section>
 		</main>
 		{% include "footer.njk" %}
 	</body>
diff --git a/_includes/layouts/links.njk b/_includes/layouts/links.njk
index 5cf0adc..ca6ce64 100644
--- a/_includes/layouts/links.njk
+++ b/_includes/layouts/links.njk
@@ -2,13 +2,16 @@
 layout: layouts/baseBareBones.njk
 hideNav: please
 ---
-{%- css %}{% include "public/css/links.css" %}{% endcss %}
-<img class="profilePic" src="{{ metadata.author.profilePic }}">
-<h1 class="socialTitle">Nathan Upchurch</h1>
-<p class="page-block nodropcap">Here's where you can find me on the internet:</p>
-
-<ul class="socialLinks">
-	{% for link in metadata.socialLinks %}
-	<a class="icon-button" {% if link.customAttribute %} {{ link.customAttribute | safe }} {% endif %} href="{{ link.linkURL }}"><li><img src="{{ link.iconURL }}" />{{ link.linkDisplay }}</li></a>
-	{% endfor %}
-</ul>
+{%- css %}{% include "public/css/me.css" %}{% endcss %}
+<div class="links-container">
+	<img class="profilePic" src="{{ metadata.author.profilePic }}">
+	<h1 class="socialTitle">Nathan Upchurch</h1>
+	<p class="page-block nodropcap">Here's where you can find me on the internet:</p>
+	<div class="socialLinks">
+		{% for link in metadata.socialLinks %}
+		<a class="link-button" {% if link.customAttribute %} {{ link.customAttribute | safe }} {% endif %} href="{{ link.linkURL }}">
+			<button type="button"><img src="{{ link.iconURL }}" />{{ link.linkDisplay }}</button>
+		</a>
+		{% endfor %}
+	</div>
+</div>
diff --git a/_includes/layouts/post.njk b/_includes/layouts/post.njk
index 3f0c42b..14cb1bf 100644
--- a/_includes/layouts/post.njk
+++ b/_includes/layouts/post.njk
@@ -23,7 +23,7 @@ layout: layouts/base.njk
 	<ul>
 		{%- for tag in tags | filterTagList %}
 		{%- set tagUrl %}/tags/{{ tag | slugify }}/{% endset %}
-		<li><a href="{{ tagUrl }}" class="post-tag">{{ tag }}</a></li>
+		<li><a href="{{ tagUrl }}" class="post-tag">{{ tag }}&nbsp;</a></li>
 		{%- endfor %}
 	</ul>
 </div>
@@ -31,5 +31,4 @@ layout: layouts/base.njk
 {{ content | safe }}
 </article>
 {% include "mastodonComments.njk" %}
-<h2>Read Next</h2>
 {% include "nextLast.njk" %}
diff --git a/_includes/mastodonComments.njk b/_includes/mastodonComments.njk
index 5cb75ec..f28061d 100644
--- a/_includes/mastodonComments.njk
+++ b/_includes/mastodonComments.njk
@@ -1,12 +1,16 @@
 {% if mastodon_id %}
-<section id="comment-section">
+<section class="" id="comment-section">
 	<h2>Comments</h2>
 	<div class="comment-ingress"></div>
 	<div id="comments" data-id="{{ mastodon_id }}">
 		<p>Loading comments...</p>
 	</div>
 	<div class="continue-discussion">
-		<a class="big-link" href="https://{{ metadata.mastodonHost }}/@{{ metadata.mastodonUser }}/{{ mastodon_id }}">Comment by replying to this post on Mastodon &#187;</a>
+		<a class="link-button" href="https://{{ metadata.mastodonHost }}/@{{ metadata.mastodonUser }}/{{ mastodon_id }}">
+			<button type="button">
+				Comment by replying to this post on Mastodon &#187;
+			</button>
+		</a>
 </section>
 
 <template id="comment-template">
diff --git a/_includes/nav.njk b/_includes/nav.njk
index 6c32415..e678085 100644
--- a/_includes/nav.njk
+++ b/_includes/nav.njk
@@ -2,7 +2,9 @@
 	<h2 class="visually-hidden">Top level navigation menu</h2>
 	<ul class="nav">
 	{%- for entry in collections.all | eleventyNavigation %}
-		<a class="nav-item" href="{{ entry.url }}"{% if entry.url == page.url %} aria-current="page"{% endif %}><li {% if entry.url == page.url %} data-currentpage="true"{% endif %}>{{ entry.title }}</li></a>
+		<a class="nav-item" href="{{ entry.url }}"{% if entry.url == page.url %} aria-current="page" data-currentpage="true"{% endif %}>
+			<li>{{ entry.title }}</li>
+		</a>
 	{%- endfor %}
 		<a class="nav-item" href="/feed/feed.xml">
 			<li class="subscribe">
diff --git a/_includes/nextLast.njk b/_includes/nextLast.njk
index 103fd79..10ec29a 100644
--- a/_includes/nextLast.njk
+++ b/_includes/nextLast.njk
@@ -3,41 +3,46 @@
 {%- set nextPost = collections.posts | getNextCollectionItem %}
 {%- if nextPost or previousPost %}
 <section class="links-nextprev">
-	{%- if previousPost %}
-	<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
-		<a href="{{ previousPost.url }}" class="postlist-link">
-			<div class="post-image-container">
-				<img class="post-image" {% if previousPost.data.imageURL %} src="{{ previousPost.data.imageURL }}" alt="{{ previousPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
-			</div>
-		</a>
-		<div class="post-copy">
+<h2>Read Next</h2>
+	<div class="postlist-item-container">
+		{%- if previousPost %}
+		<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
 			<a href="{{ previousPost.url }}" class="postlist-link">
-				<h3>
-					{% if previousPost.data.title %}<span>Previous Article:</span><br>{{ previousPost.data.title }}{% else %}<code>{{ previousPost.url }}</code>{% endif %}
-				</h3>
+				<div class="post-image-container">
+					<img class="post-image" {% if previousPost.data.imageURL %} src="{{ previousPost.data.imageURL }}" alt="{{ previousPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
+				</div>
 			</a>
-			<time class="postlist-date" datetime="{{ previousPost.date | htmlDateString }}">{{ previousPost.date | readableDate("LLLL yyyy") }}</time>
-			{% if previousPost.data.synopsis %}<p>{{ previousPost.data.synopsis | truncate(150) | safe }}</p>{% else %}{{ previousPost.content | truncate(150) | safe }}{% endif %}
-		</div>
-</article>
-
-	{% endif %}
-	{%- if nextPost %}
-	<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
-		<a href="{{ nextPost.url }}" class="postlist-link">
-			<div class="post-image-container">
-				<img class="post-image" {% if nextPost.data.imageURL %} src="{{ nextPost.data.imageURL }}" alt="{{ nextPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
+			<div class="post-copy">
+				<a href="{{ previousPost.url }}" class="postlist-link">
+					<p>Previous Article:</p>
+					<h3>
+						{% if previousPost.data.title %}{{ previousPost.data.title }}{% else %}<code>{{ previousPost.url }}</code>{% endif %}
+					</h3>
+				</a>
+				<time class="postlist-date" datetime="{{ previousPost.date | htmlDateString }}">{{ previousPost.date | readableDate("LLLL yyyy") }}</time>
+				{% if previousPost.data.synopsis %}<p>{{ previousPost.data.synopsis | truncate(105) | safe }}</p>{% else %}{{ previousPost.content | truncate(105) | safe }}{% endif %}
 			</div>
-		</a>
-		<div class="post-copy">
+	</article>
+
+		{% endif %}
+		{%- if nextPost %}
+		<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
 			<a href="{{ nextPost.url }}" class="postlist-link">
-				<h3>
-					{% if nextPost.data.title %}<span>Next Article:</span><br>{{ nextPost.data.title }}{% else %}<code>{{ nextPost.url }}</code>{% endif %}
-				</h3>
+				<div class="post-image-container">
+					<img class="post-image" {% if nextPost.data.imageURL %} src="{{ nextPost.data.imageURL }}" alt="{{ nextPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
+				</div>
 			</a>
-			<time class="postlist-date" datetime="{{ nextPost.date | htmlDateString }}">{{ nextPost.date | readableDate("LLLL yyyy") }}</time>
-			{% if nextPost.data.synopsis %}<p>{{ nextPost.data.synopsis | truncate(150) | safe }}</p>{% else %}{{ nextPost.content | truncate(150) | safe }}{% endif %}
-		</div>
+			<div class="post-copy">
+				<a href="{{ nextPost.url }}" class="postlist-link">
+					<p>Next Article:</p>
+					<h3>
+						{% if nextPost.data.title %}{{ nextPost.data.title }}{% else %}<code>{{ nextPost.url }}</code>{% endif %}
+					</h3>
+				</a>
+				<time class="postlist-date" datetime="{{ nextPost.date | htmlDateString }}">{{ nextPost.date | readableDate("LLLL yyyy") }}</time>
+				{% if nextPost.data.synopsis %}<p>{{ nextPost.data.synopsis | truncate(105) | safe }}</p>{% else %}{{ nextPost.content | truncate(105) | safe }}{% endif %}
+			</div>
+	</div>
 </section>
 	{% endif %}
 
diff --git a/_includes/postslist.njk b/_includes/postslist.njk
index a101256..069c287 100644
--- a/_includes/postslist.njk
+++ b/_includes/postslist.njk
@@ -15,7 +15,7 @@
 				</h3>
 			</a>
 			<time class="postlist-date" datetime="{{ post.date | htmlDateString }}">{{ post.date | readableDate("LLLL yyyy") }}</time>
-			{% if post.data.synopsis %}<p>{{ post.data.synopsis | truncate(150) | safe }}</p>{% else %}{{ post.content | truncate(150) | safe }}{% endif %}
+			{% if post.data.synopsis %}<p>{{ post.data.synopsis | truncate(105) | safe }}</p>{% else %}{{ post.content | truncate(105) | safe }}{% endif %}
 		</div>
 	</article>
 	{% endfor %}
diff --git a/content/about/index.md b/content/about/index.md
index b73b826..5f81ff2 100644
--- a/content/about/index.md
+++ b/content/about/index.md
@@ -4,12 +4,20 @@ eleventyNavigation:
   key: About
   order: 3
 ---
-# Who am I, Anyway?
-## About Nathan Upchurch and the Website He Made.
-I'm a prolific vegan home cook, classical trombonist, a <abbr title="Free/Libre Open Source Software">FLOSS</abbr> enthusiast, daily GNU/Linux user and unabashed <a href="https://kde.org/">KDE</a> stan, speaker of subpar elementary Spanish, incense appreciator, writer, electronics hobbyist, designer, programmer, music producer, print lover, and human with too many interests and too little time.
+<article>
+<h1>About me and this website I’ve built.</h1>
+<h2>All about Nathan</h2>
+<p>I'm a prolific vegan home cook, classical trombonist, a <abbr title="Free/Libre Open Source Software">FLOSS</abbr> enthusiast, daily GNU/Linux user and unabashed <a href="https://kde.org/">KDE</a> stan, speaker of subpar elementary Spanish, incense appreciator, writer, electronics hobbyist, designer, programmer, music producer, print lover, and human with too many interests and too little time.
 
-This is my personal website and blog, a little corner of the internet where I can talk about whatever I like without worrying about maintaining a 'personal brand,' or constraining subject matter to those topics which might help advance my career or establish me as a 'thought leader' should I choose to write about them. I'm here to express myself as a human and have fun writing about topics I enjoy. If you'd like to learn more about my professional accomplishments and work, I'll link my professional website here soon.
+This is my personal website and blog, a little corner of the internet where I can talk about whatever I like without worrying about maintaining a ‘personal brand’, or constraining subject matter to those topics which might help advance my career or establish me as a ‘thought leader’. I'm here to express myself as a human and have fun writing about topics I enjoy. If you'd like to learn more about my professional accomplishments and work, I'll link my professional website here soon.</p>
 
-If you would like to say something nice, ask a question, or simply follow me on the fediverse, <a href="../me">here's where you can find me</a>.
+<h2>About this website</h2>
+<p>This website is made with <a href="https://www.11ty.dev/">the 11ty static site generator</a>, free and open source variable typefaces <a href="https://www.gent.media/manrope">Manrope</a> and <a href="https://fraunces.undercase.xyz/">Fraunces</a>, along with plain-old HTML, CSS, and some vanilla JavaScript for the web components that I built to handle comments. I used the handy calculators on <a href="https://utopia.fyi">utopia.fyi</a> to help me implement fluid typography and spacing.
 
-This website is made with <a href="https://www.11ty.dev/">11ty</a>, <a href="https://www.gent.media/manrope">Manrope</a>, <a href="https://github.com/clauseggers/Playfair">Playfair Display</a>, and plain-old HTML & CSS. I don't collect any of your personal information, full-stop. All webfonts, icons, and images are hosted locally (these things can sometimes be used to <a href="https://www.firstpost.com/world/how-google-uses-fonts-to-track-what-users-do-online-and-sell-data-to-advertisers-12496552.html">track people across the internet</a>). I use <a href="https://umami.is/">umami</a>, an open source, privacy-respecting analytics tool, to see how many people visit this website. Miss when the internet was fun? Find more interesting personal blogs at <a href="https://blogroll.org">blogroll.org</a>, or <a href="https://ooh.directory/">ooh.directory</a>.
+I don't collect any of your personal information, full-stop. All webfonts, icons, and images are hosted locally (these things can sometimes be used to <a href="https://www.firstpost.com/world/how-google-uses-fonts-to-track-what-users-do-online-and-sell-data-to-advertisers-12496552.html">track people across the internet</a> otherwise). I use <a href="https://umami.is/">umami</a>, an open source, privacy-respecting analytics tool, to see how many people visit this website.
+
+Miss when the internet was fun? Find more interesting personal blogs at <a href="https://blogroll.org">blogroll.org</a>, or <a href="https://ooh.directory/">ooh.directory</a>.</p>
+
+<h2>Contact Me</h2>
+<p>If you would like to say something nice, ask a question, or simply follow me on the fediverse, <a href="../me">here's where you can find me</a>.</p>
+</article>
diff --git a/content/index.njk b/content/index.njk
index b612c50..f1dea53 100644
--- a/content/index.njk
+++ b/content/index.njk
@@ -13,5 +13,9 @@ numberOfLatestPostsToShow: 5
 
 {% set morePosts = postsCount - numberOfLatestPostsToShow %}
 {% if morePosts > 0 %}
-<a class="big-link" href="/blog/">See {{ morePosts }} more post{% if morePosts != 1 %}s{% endif %} in the blog &#187;</a>
+<a class="link-button" href="/blog/">
+	<button type="button">
+		See {{ morePosts }} more post{% if morePosts != 1 %}s{% endif %} in the blog
+	</button>
+</a>
 {% endif %}
diff --git a/content/now.njk b/content/now.njk
index fe08179..8b577e3 100644
--- a/content/now.njk
+++ b/content/now.njk
@@ -10,12 +10,13 @@ numberOfLatestPostsToShow: 4
 {% set postslist = collections.now | head(-1 * numberOfLatestPostsToShow) %}
 {% set postslistCounter = postsCount %}
 {% set morePosts = postsCount - numberOfLatestPostsToShow %}
-
-<h1>Now: What's Been Going on Lately?</h1>
+<article>
+<h1>Now: What’s Been Going on Lately?</h1>
 {% set now = collections.now | last %}
 <h2>{{ now.data.title }}</h2>
 {{ now.content | safe }}
-<p><br>Updated: {{ now.date | readableDate }} | <a href="https://nownownow.com/about">What is a now page?</a></p>
+<p class="metadata">Updated: {{ now.date | readableDate }} |&nbsp;<a href="https://nownownow.com/about">What is a now page?</a></p>
+</article>
 
 {% if postsCount > 1 %}
 <h2>Previous Entries:</h2>
diff --git a/content/tags.njk b/content/tags.njk
index c14461c..16cd7e0 100644
--- a/content/tags.njk
+++ b/content/tags.njk
@@ -41,5 +41,8 @@ permalink: "/tags/{{ tag | slugify }}/"
 
 {% set postslist = collections[ tag ] %}
 {% include "postslist.njk" %}
-
-<p class="nodropcap">See <a href="/tags/">all tags</a>.</p>
+<a class="link-button" href="/tags/">
+	<button type="button">
+		See all tags
+	</button>
+</a>
diff --git a/public/css/dropcap.css b/public/css/dropcap.css
deleted file mode 100644
index 7723a5a..0000000
--- a/public/css/dropcap.css
+++ /dev/null
@@ -1,18 +0,0 @@
-main > article > p:not(.nodropcap):first-of-type:first-letter {
-	float: left;
-	font-size: 4rem;
-	padding: .5rem .5rem .5rem .5rem;
-	color: var(--contrast-color);
-	border: solid 2px var(--contrast-color);
-	font-family: var(--font-family-headline);
-	font-weight: 700;
-	margin: .25rem .5rem 0 0;
-	border-radius: .2em;
-	border-top-left-radius: 0;
-}
-
-@media(max-width: 556px) {
-	main > p:not(.nodropcap):first-of-type:first-letter {
-		font-size: 3rem;
-	}
-}
diff --git a/public/css/index.css b/public/css/index.css
index ca20f74..bd07f7f 100644
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -1,12 +1,49 @@
+@keyframes slide-in-blurred-bottom {
+	0% {
+		filter: blur(20px);
+		opacity: 0;
+	}
+	100% {
+		filter: blur(0);
+		opacity: 1;
+	}
+}
+
+
 /* Defaults */
 :root {
-	--font-family-headline: 'Playfair Display';
-	--font-family: Manrope;
+	--font-family: "Fraunces", serif;
+	--font-family-headline: "Fraunces", serif;
+	--font-family-ui: "Manrope", sans-serif;
+	--font-variation-default: "opsz" 18, "wght" 310, "SOFT" 40, "WONK" 0;
+	--font-variation-ui: "wght" 500;
 	--font-family-monospace: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace;
+	--meta-font-size: var(--step--1);
+	--meta-font-style: italic;
+	--meta-font-variation-settings: "opsz" 12, "wght" 310, "SOFT" 40, "WONK" 0;
+	--ui-letter-spacing: var(--space-3xs);
 }
 
+/*
+ Font Axes, Fraunces:
+ --------------------
+ opsz: 9-144 		(Optical Size)
+ wght: 100-900 	(Weight)
+ SOFT: 0-100		(Soften)
+ WONK: 0-1			(Wonk)
+
+
+ Font Axes, Manrope:
+ --------------------
+ wght: 200-900	(Weight)
+
+*/
+
 /* Design Tokens */
 :root {
+	/* Animations */
+	--slide-in-blurred-bottom: slide-in-blurred-bottom 0.75s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
+
 	/* Colors */
 	--color-gray-20: #e0e0e0;
 	--color-gray-90: #333333;
@@ -19,6 +56,48 @@
 	--text-color-link: var(--text-color);
 	--text-color-tag: var(--contrast-color);
 
+	/* Font Size Scaling Tokens - https://utopia.fyi/ */
+	--step--2: clamp(0.7813rem, 0.7747rem + 0.0326vi, 0.8rem);
+	--step--1: clamp(0.9375rem, 0.9158rem + 0.1087vi, 1rem);
+	--step-0: clamp(1.125rem, 1.0815rem + 0.2174vi, 1.25rem);
+	--step-1: clamp(1.35rem, 1.2761rem + 0.3696vi, 1.5625rem);
+	--step-2: clamp(1.62rem, 1.5041rem + 0.5793vi, 1.9531rem);
+	--step-3: clamp(1.944rem, 1.771rem + 0.8651vi, 2.4414rem);
+	--step-4: clamp(2.3328rem, 2.0827rem + 1.2504vi, 3.0518rem);
+	--step-5: clamp(2.7994rem, 2.4462rem + 1.7658vi, 3.8147rem);
+	--step-6: clamp(3.3592rem, 2.8691rem + 2.4507vi, 4.7684rem);
+	--step-7: clamp(4.0311rem, 3.36rem + 3.3555vi, 5.9605rem);
+	--step-8: clamp(4.8373rem, 3.9283rem + 4.5448vi, 7.4506rem);
+
+	/* Space Scaling Tokens - https://utopia.fyi/ */
+	--space-3xs: clamp(0.3125rem, 0.3125rem + 0vi, 0.3125rem);
+	--space-2xs: clamp(0.5625rem, 0.5408rem + 0.1087vi, 0.625rem);
+	--space-xs: clamp(0.875rem, 0.8533rem + 0.1087vi, 0.9375rem);
+	--space-s: clamp(1.125rem, 1.0815rem + 0.2174vi, 1.25rem);
+	--space-m: clamp(1.6875rem, 1.6223rem + 0.3261vi, 1.875rem);
+	--space-l: clamp(2.25rem, 2.163rem + 0.4348vi, 2.5rem);
+	--space-xl: clamp(3.375rem, 3.2446rem + 0.6522vi, 3.75rem);
+	--space-2xl: clamp(4.5rem, 4.3261rem + 0.8696vi, 5rem);
+	--space-3xl: clamp(6.75rem, 6.4891rem + 1.3043vi, 7.5rem);
+
+	/* One-up pairs - https://utopia.fyi/ */
+	--space-3xs-2xs: clamp(0.3125rem, 0.2038rem + 0.5435vi, 0.625rem);
+	--space-2xs-xs: clamp(0.5625rem, 0.4321rem + 0.6522vi, 0.9375rem);
+	--space-xs-s: clamp(0.875rem, 0.7446rem + 0.6522vi, 1.25rem);
+	--space-s-m: clamp(1.125rem, 0.8641rem + 1.3043vi, 1.875rem);
+	--space-m-l: clamp(1.6875rem, 1.4049rem + 1.413vi, 2.5rem);
+	--space-l-xl: clamp(2.25rem, 1.7283rem + 2.6087vi, 3.75rem);
+	--space-xl-2xl: clamp(3.375rem, 2.8098rem + 2.8261vi, 5rem);
+	--space-2xl-3xl: clamp(4.5rem, 3.4565rem + 5.2174vi, 7.5rem);
+
+	/* Custom pairs - https://utopia.fyi/ */
+	--space-s-l: clamp(1.125rem, 0.6467rem + 2.3913vi, 2.5rem);
+
+	/* Fluid Grid Tokens - https://utopia.fyi/ */
+	--grid-max-width: 43.75rem;
+	--grid-gutter: var(--space-s-l, clamp(1.125rem, -0.0329rem + 5.7895vw, 2.5rem));
+	--grid-columns: 12;
+
 	/* Change <img> SVG color with filter */
 	--logo-filter: brightness(0) saturate(100%) invert(16%) sepia(0%) saturate(1024%) hue-rotate(177deg) brightness(99%) contrast(88%);
 	--icon-filter: none;
@@ -26,43 +105,21 @@
 	/* Corners */
 	--border-radius: .3rem;
 
-	/* Space & Size */
-	--syntax-tab-size: 2;
-	--half-gap: .5rem;
-	--single-gap: 1rem;
-	--double-gap: 2rem;
-	--triple-gap: 3rem;
-	--quad-gap: 4rem;
-
 	/* Transitions */
 	--transition-normal: all .3s;
 
-	/* Font Sizes */
-	--font-xxl: 3.75rem;
-	--font-xl: 2rem;
-	--font-l: 1.5rem;
-	--font-n: 1rem;
-	--font-s: .85rem;
-	--font-xs: .65rem;
-
-	/* Font Weights */
-	--weight-extraheavy: 700;
-	--weight-heavy: 500;
-	--weight-normal: 300;
-
 	/* Links */
 	--link-decoration-thickness: .1rem;
 
 	/* Borders */
 	--border-nav: 1px solid var(--text-color);
-	--border-nav-currentpage: 20px solid var(--contrast-color);
-	--border-nav-hover: 20px solid var(--text-color);
-	--border-thin: 1px solid var(--color-gray-20);
+	--border-nav-currentpage: var(--space-xs-s) solid var(--contrast-color);
+	--border-nav-hover: var(--space-xs-s) solid var(--text-color);
 
 	/* Shadow */
 	--box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
 
-	/* Components */
+	/* Web Component Tokens */
 	--wc-card-background-color: var(--card-color);
 	--wc-card-border-radius: var(--border-radius);
 	--wc-card-box-shadow: var(--box-shadow);
@@ -88,25 +145,14 @@
 		--logo-filter: none;
 		--icon-filter: brightness(0) saturate(100%) invert(9%) sepia(76%) saturate(340%) hue-rotate(168deg) brightness(95%) contrast(94%);
 	}
-}
-
-@media(max-width: 556px) {
-	:root {
-		/* Borders */
-		--border-nav-currentpage: 15px solid var(--contrast-color);
-
-		/* Font Sizes */
-		--font-xxl: 2.25rem;
-		--font-xl: 1.5rem;
-		--font-l: 1.5rem;
-		--font-n: 1rem;
+	.socialLinks a li img {
+		filter: auto;
 	}
 }
 
 /* Global stylesheet */
 * {
 	box-sizing: border-box;
-	line-height: calc(1em + 0.5rem);
 }
 
 html,
@@ -114,18 +160,48 @@ body {
 	background-color: var(--background-color);
 	color: var(--text-color);
 	font-family: var(--font-family);
-	font-size: 13px;
+	font-variation-settings: var(--font-variation-default);
 	font-variant-Ligatures: normal;
-	font-weight: var(--weight-normal);
 	margin: 0 auto;
 	padding: 0;
 }
 html {
+	font-size: 13px;
 	overflow-y: scroll;
 }
 body {
-	max-width: 40em;
+	animation: var(--slide-in-blurred-bottom);
+	font-size: var(--step-0);
+	margin-inline: auto;
+	max-width: var(--grid-max-width);
+	padding-inline: var(--grid-gutter);
+	padding-top: var(--space-m);
+	padding-bottom: var(--space-m);
 }
+button, .nav-item {
+	font-family: var(--font-family-ui);
+}
+header, footer, main {
+	display: grid;
+	gap: var(--grid-gutter);
+	grid-template-columns: repeat(var(--grid-columns), 1fr);
+}
+nav {
+	grid-column: 2 / span 12;
+}
+section {
+	display: grid;
+	grid-column: 1 / span 12;
+}
+.page-block {
+	grid-column: 1 / span 12;
+	font-size: var(--step-1);
+	margin: 0;
+	padding-bottom:  var(--space-xl);
+	padding-top: var(--space-l);
+	line-height: calc(var(--step-1) * 0.5 + var(--step-1));
+}
+
 a {
 	text-decoration-color: var(--contrast-color);
 	text-decoration-thickness: var(--link-decoration-thickness);
@@ -142,85 +218,115 @@ a {
 	width: 1px;
 }
 footer {
-	margin-top: var(--triple-gap);
-	padding: var(--single-gap);
-}
-footer .copyright-notice {
-	padding-right: var(--single-gap);
+	padding: var(--space-xl) 0 var(--space-m) 0;
 }
 footer .webring {
-	display: inline-block;
-	padding-right: var(--single-gap);
+	display: inline;
+	padding-right: var(--space-xs);
 }
 footer p {
-	font-size: var(--font-s);
+	font-size: var(--step-0);
+	grid-column: 1 / span 12;
 }
 h1, h2, h3 {
 	color: var(--text-color);
+	grid-column: 1 / span 12;
+	margin: 0;
+	width: 100%;
 }
 h1 {
 	font-family: var(--font-family-headline);
-	font-weight: var(--weight-extraheavy);
-	font-size: var(--font-xxl);
+	font-variation-settings: "opsz" 100, "wght" 500, "SOFT" 10, "WONK" 1;
+	font-size: var(--step-6);
 	font-style: normal;
-	margin-top: var(--triple-gap);
-	margin-bottom: 0;
+	line-height: calc(var(--step-6) * 0.25 + var(--step-6));
 }
 h2 {
-	font-size: var(--font-xl);
-	font-weight: var(--weight-extraheavy);
-	margin: var(--quad-gap) auto 0 auto;
+	font-size: var(--step-3);
+	font-variation-settings: "opsz" 50, "wght" 300, "SOFT" 60, "WONK" 1;
+	padding-bottom: var(--space-l);
+	padding-top: var(--space-xl);
 }
 h3 {
-	font-size: var(--font-l);
-}
-hr {
-	border-top: var(--border-thin);
+	font-size: var(--step-2);
 }
+
 .logo {
 	filter: var(--logo-filter);
 }
-main {		--border-nav-currentpage: 15px solid var(--contrast-color);
-
-	padding: var(--single-gap);
+main {
+	display: grid;
+	grid-column: 1 / 12;
+	padding-top: var(--space-3xl);
 }
 main > p > img, main > p > a > img {
 	width: 100%;
-	padding-top: var(--double-gap);
+	padding-top: var(--space-l);
+}
+.post > p {
+	margin: 0;
+	padding-bottom: var(--space-s);
 }
 p:last-child {
 	margin-bottom: 0;
 }
 p, li {
-	font-size: var(--font-n);
+	font-size: var(--step-0);
+	line-height: calc(var(--step-0) * 0.5 + var(--step-0));
 }
 figure {
 	margin: 0;
-	padding: var(--single-gap) 0 0 0;
+	padding: var(--space-m) 0 var(--space-m) 0;
 	width: 100%;
 }
 figure > a > img {
+	border-radius: 1em;
+	border-top-left-radius: 0;
 	padding: 0;
 	width: 100%;
-	box-shadow: .75em .75em 0 0 var(--contrast-color);
+	box-shadow: var(--space-2xs) var(--space-2xs) 0 0 var(--contrast-color);
 }
-figcaption {
+
+html.barebones, body.barebones {
+	background-color: var(--background-color);
 	text-align: center;
-	padding-top: var(--single-gap);
 }
-.page-block {
-	margin-bottom: var(--triple-gap);
+
+figcaption {
+	font-size: var(--meta-font-size);
+	font-style: var(--meta-font-style);
+	font-variation-settings: var(--meta-font-variation-settings);
+	padding-top: var(--space-s);
+	text-align: center;
 }
-.big-link {
-	width: 100%;
-	padding: var(--half-gap);
-	border: var(--border-nav);
+button {
+	background-color: var(--contrast-color);
+	border: none;
 	border-radius: var(--border-radius);
-	margin: var(--single-gap) auto var(--single-gap) auto;
+	color: var(--background-color);
+	font-size: var(--step--2);
+	font-variation-settings: var(--font-variation-ui);
+	letter-spacing: var(--ui-letter-spacing);
+	margin: var(--space-xl) 0 0 0;
+	padding: var(--space-2xs) var(--space-xs);
+	text-transform: uppercase;
 	transition: var(--transition-normal);
 }
-.big-link:hover {
-	border-color: var(--contrast-color);
+button > img {
+	max-width: 1em;
+	margin-right: .5em;
+	filter: var(--icon-filter);
+}
+a.link-button {
+	align-items: start;
+	display: flex;
+	grid-column: 1 / span 12;
+	text-align: center;
+	text-decoration: none;
+}
+button:hover {
+	background-color: var(--color-gray-90);
+	cursor: pointer;
 }
 a[href]:not(.icon-button) {
 	color: var(--text-color-link);
@@ -233,9 +339,8 @@ a[href]:active:not(.icon-button) {
 	color: var(--contrast-color);
 }
 .links-nextprev {
-	list-style: none;
-	padding: 0 0 var(--single-gap) 0;
-	margin-top: var(--single-gap);
+	padding: 0 0 var(--space-m) 0;
+	margin-top: var(--space-m);
 }
 
 table {
@@ -247,23 +352,26 @@ table th {
 }
 
 /* Comments */
-.comment-ingress {
-	margin-bottom: var(--double-gap);
+#comments {
+	grid-column: 1 / span 12;
 }
-#comment-section h2 {
-	margin: var(--quad-gap) auto 0 auto;
+.continue-discussion {
+	grid-column: 1 / span 12;
+}
+.continue-discussion button {
+	margin-top: var(--space-xs);
 }
 wc-comment::part(author-link) {
-	font-size: var(--font-n);
-	font-weight: var(--weight-extraheavy);
+	font-size: var(--step-0);
 	text-decoration: none;
 }
 wc-comment::part(main) {
-	margin-bottom: var(--double-gap);
+	margin-bottom: var(--space-l);
 }
 wc-comment::part(publish-date) {
-	font-weight: var(--weight-heavy);
-	font-size: var(--font-s);
+	font-size: var(--meta-font-size);
+	font-style: var(--meta-font-style);
+	font-variation-settings: var(--font-variation-settings);
 	margin-top: -.25rem;
 }
 
@@ -290,26 +398,28 @@ code {
 	word-break: break-all;
 }
 
+/* Dropcap */
+
+main > section > article > p:not(.nodropcap):first-of-type:first-letter {
+	float: left;
+	font-size: var(--step-6);
+	padding: .5rem .5rem .5rem .5rem;
+	color: var(--contrast-color);
+	border: solid 2px var(--contrast-color);
+	font-family: var(--font-family-headline);
+	font-variation-settings: "opsz" 144, "wght" 500, "SOFT" 10, "WONK" 0;
+	margin: .5rem .7rem 0 0;
+	border-radius: .2em;
+	border-top-left-radius: 0;
+}
+
 /* Header */
-header {
-	align-items: end;
-	display: flex;
-	flex-wrap: wrap;
-	gap: 1em .5em;
-	padding: 1em;
+header .home-link {
+	display: grid;
+	grid-column: 1 / 1;
 }
-.home-link {
-	align-items: end;
-	display: flex;
-	font-size: var(--font-n);
-	font-weight: var(--weight-extraheavy);
-	margin-right: var(--double-gap);
-}
-.home-link:link:not(:hover) {
-	text-decoration: none;
-}
-.home-link img {
-	width: 3rem;
+.logo {
+	width: var(--space-l-xl);
 }
 
 /* Nav */
@@ -321,38 +431,42 @@ header {
 nav ul {
 	align-items: end;
 	display: flex;
-	justify-content: space-between;
-	width: 20rem;
+	justify-content: flex-end;
+	gap: var(--space-xs-s);
+	flex-flow: row wrap;
 }
 .nav-icon {
 	fill: var(--color-gray-90);
-	height: .8rem;
+	height: var(--space-2xs);
 	margin-right: .25rem;
-	padding-bottom: .3rem;
 	transition: var(--transition-normal);
-	width: var(--single-gap);
+	width: var(--space-2xs);
 }
 .nav-item {
 	display: inline-block;
 	text-decoration: none;
+	border-top: var(--border-nav);
 }
 .nav-item li {
-	align-items: end;
-	border-top: var(--border-nav);
+	align-items: baseline;
 	color: var(--text-color);
 	display: flex;
-	font-size: var(--font-xs);
-	font-weight: var(--weight-heavy);
-	height: 2.8rem;
-	margin-right: .5em;
+	font-size: var(--step--2);
+	font-variation-settings: var(--font-variation-ui);
+	height: var(--space-l-xl);
 	margin-bottom: 0;
+	padding-top: var(--space-m);
 	text-transform: uppercase;
 	transition: var(--transition-normal);
-	letter-spacing: .15rem;
+	letter-spacing: var(--ui-letter-spacing);
 }
-.nav-item li:hover {
+.nav-item:hover {
 	border-top: var(--border-nav-hover);
 }
+/* Compensate for increased border thickness on hover of a.nav-item */
+.nav-item:hover li {
+	margin-top: calc(var(--space-xs-s) * -1);
+}
 .nav-item a[href]:visited {
 	color: var(--text-color);
 }
@@ -365,27 +479,28 @@ nav ul {
 	color: var(--text-color);
 	text-decoration: none;
 }
-.nav-item li[data-currentpage="true"] {
+.nav-item[data-currentpage="true"] {
 	border-top: var(--border-nav-currentpage);
 	color: var(--contrast-color);
 }
-.nav a[href][aria-current="page"] {
-	color: var(--text-color);
+.nav-item[data-currentpage="true"] li {
+	margin-top: calc(var(--space-xs-s) * -1);
+}
+.nav a[href][aria-current="page"] li {
+	color: var(--contrast-color);
 }
 .subscribe:hover {
 	color: var(--text-color);
 }
 
 /* Posts list */
-.postlist h2 {
-	margin-bottom: var(--double-gap);
-}
 .postlist h3 {
 	margin-top: 0;
 }
 .postlist-item-container {
 	display: flex;
 	flex-flow: column nowrap;
+	gap: var(--space-xl);
 }
 .postlist-item {
 	align-items: flex-start;
@@ -395,47 +510,59 @@ nav ul {
 	display: flex;
 	flex-flow: row nowrap;
 	justify-content: flex-start;
-	margin-bottom: var(--double-gap);
-	padding: var(--single-gap) 1.1rem var(--single-gap) 1.1rem;
+	padding: var(--space-m) 1.1rem var(--space-m) 1.1rem;
 	width: 100%;
 }
+
+
+.postlist, .links-nextprev {
+	container: postlist / inline-size;
+ }
+
 .post-image-container {
 	border-radius: var(--border-radius);
-	margin-right: var(--single-gap);
+	box-shadow: var(--box-shadow);
+	margin-left: calc(var(--space-l) * -1);
 	max-height: 15rem;
 	overflow: hidden;
 }
+
 .postlist-date,
 .postlist-item:before {
 	color: var(--color-gray-90);
-	font-size: var(--font-s); /* 13px /16 */
+	font-size: var(--step--1); /* 13px /16 */
 }
 .postlist-date {
 	word-spacing: -0.5px;
 }
 .postlist-link {
-	font-size: var(--font-xl); /* 19px /16 */
-	font-weight: var(--weight-extraheavy);
+	font-size: var(--step-5); /* 19px /16 */
 	padding-right: .5em;
  	text-decoration: none;
 }
 .postlist-link h3 {
-		font-size: var(--font-l);
+		font-size: var(--step-2);
 		margin-bottom: 0;
 }
-.postlist-item-active .postlist-link {
-	font-weight: var(--weight-extraheavy);
+.postlist-link p {
+	background-color: var(--color-gray-90);
+	border-radius: 100px;
+	color: var(--background-color);
+	font-family: var(--font-family-ui);
+	font-size: var(--step--2);
+	font-variation-settings: var(--font-variation-ui);
+	letter-spacing: var(--space-3xs);
+	margin-top: calc(var(--space-3xs) * -1);
+	padding-left: var(--space-xs);
+	padding-right: var(--space-xs);
+	text-transform: uppercase;
+	width: max-content;
 }
 .post-copy {
 	display: flex;
 	flex-flow: column wrap;
 }
-.post-copy a h3 span {
-	font-size: var(--font-s);
-	font-weight: var(--weight-normal);
-	text-transform: uppercase;
-	letter-spacing: .15rem;
-}
+
 .post-image {
 	width: 15rem;
 	height: 15rem;
@@ -443,10 +570,33 @@ nav ul {
 	object-position: 50% 50%;
 }
 
+@container postlist (max-width: 500px) {
+	.postlist-item {
+		flex-flow: column wrap;
+	}
+	.post-image-container {
+		margin-left: 0;
+		margin-top: calc(var(--space-l) * -1);
+		width: 100%;
+	}
+	.post-image-container img.post-image {
+		width: calc(100cqw - var(--space-m));
+	}
+	.postlist-link {
+		padding: 0;
+	}
+	.postlist-link h3 {
+		padding-top: var(--space-m);
+	}
+	.postlist-link p {
+		margin-top: var(--space-xs);
+	}
+}
+
 /* Tags */
 a.post-tag {
 	color: var(--text-color-tag);
-	padding-right: var(--half-gap);
+	padding-right: var(--space-5xs);
 	text-decoration: none;
 }
 a.post-tag:before {
@@ -462,7 +612,7 @@ a.post-tag:hover {
 	fill: var(--rss-orange);
 	height: 3.5rem;
 	transition: var(--transition-normal);
-	width: var(--double-gap);
+	width: var(--space-l);
 }
 .taglist {
 	display: flex;
@@ -474,28 +624,29 @@ a.post-tag:hover {
 	margin: 0em .5em 1.25em 0em;
 }
 .taglist li a {
-	font-size: var(--font-l);
+	font-size: var(--step-2);
 }
+
 .postlist-item > .post-tag {
 	align-self: center;
 }
 
 /* Article / Post */
 .post h2 {
-	font-size: var(--font-l);
+	font-size: var(--step-2);
 }
 
 /* Post Metadata */
 .post-metadata {
-	margin-bottom: var(--double-gap);
-	margin-top: var(--single-gap);
-	padding: 0 0 0 .4rem;
+	padding: var(--space-m) 0 var(--space-l) 0;
 }
-.post-metadata p, .post-metadata ul, .post-metadata ul li, .post-metadata time {
+.post-metadata p, .post-metadata ul, .post-metadata ul li, time, .metadata {
 	display: flex;
 	flex-flow: row wrap;
-	font-size: var(--font-s);
-	font-weight: var(--weight-heavy);
+	font-size: var(--meta-font-size);
+	font-style: var(--meta-font-style);
+	font-variation-settings: var(--meta-font-variatoin-settings);
+	line-height: calc(var(--step--1) * 0.5 + var(--step--1));
 	list-style: none;
 	margin: 0;
 	padding-left: 0em;
@@ -524,110 +675,22 @@ a[href].header-anchor:focus,
 	color: #aaa;
 }
 h2 + .header-anchor {
-	font-size: var(--font-l);
+	font-size: var(--step-2);
 }
 
-/* Mobile Styles */
-@media(max-width: 556px) {
-	body {
-		padding: 0rem 1.25rem 0rem 1.25rem;
-	}
-	figcaption {
-		font-size: var(--font-n);
-	}
-	h1 {
-		font-size: var(--font-xxl);
-		margin-top: var(--single-gap);
-		padding-top: 0;
-	}
-	h2, .postlist h2, main h2 {
-		font-size: var(--font-xl);
-		margin-bottom: var(--single-gap);
-	}
-	h3, .post-copy a h3 {
-		font-size: 1.25rem;
-	}
-
-	/* Header */
-	header {
-		padding: 0rem var(--half-gap) var(--single-gap) var(--half-gap);
-		margin-bottom: 0;
-	}
-	.home-link {
-		max-width: 1rem;
-		margin-top: var(--single-gap);
-	}
-
-	/* Footer */
-	footer .webring {
-		display: block;
-	}
-
-	/* Nav */
-	.nav {
-		flex-flow: row wrap;
-	}
-	.nav-item {
-		margin-right: var(--half-gap);
-	}
-	.nav-item li {
-		height: 2rem;
-	}
-	.nav-item li:hover {
-		border-top: 2px solid var(--contrast-color);
-	}
-	nav ul {
-		align-items: end;
-		display: flex;
-		flex-flow: row nowrap;
-		justify-content: auto;
-		width: auto;
-	}
-
-	/* Posts List */
-	.postlist {
-		padding-top: 0;
-	}
-	.postlist-item {
-		flex-flow: column wrap;
-		width: 100%
-	}
-	.postlist-link {
-		width: 100%;
-		padding: 0;
-	}
-	.post-image {
-		width: 100%;
-		min-width: 100%;
-	}
-	.post-image-container {
-		margin-right: 0;
-		max-height: 10em;
-		width: 100%;
-	}
-	.post-metadata {
-		margin-bottom: var(--single-gap);
-	}
-
-	p, p.nodropcap, .post-copy p {
-		font-size: var(--font-n);
-		margin-top: var(--single-gap);
-	}
-	.post-metadata time, time.postlist-date {
-		font-size: var(--font-s);
-	}
-	.post-tag, a.post-tag {
-		font-size: var(--font-xs);
-	}
-	.tag-feed-icon {
-		height: 2rem;
-		transition: var(--transition-normal);
-		width: var(--single-gap);
-	}
-	.taglist {
-		flex-flow: column nowrap;
-	}
-	.taglist li a {
-		font-size: var(--font-n);
-	}
+/* Components */
+article.post {
+	grid-column: 1 / span 12;
+}
+
+/* Utilities */
+.grid-container {
+	max-width: var(--grid-max-width);
+	padding-inline: var(--grid-gutter);
+	margin-inline: auto;
+}
+.grid {
+	display: grid;
+	gap: var(--grid-gutter);
+	grid-template-columns: repeat(var(--grid-columns), 1fr);
 }
diff --git a/public/css/links.css b/public/css/links.css
deleted file mode 100644
index 60194b8..0000000
--- a/public/css/links.css
+++ /dev/null
@@ -1,77 +0,0 @@
-html.barebones, body.barebones {
-	background-color: var(--background-color);
-	text-align: center;
-}
-
-h1.socialTitle {
-	padding-top: 0;
-	margin-top: 0;
-	font-size: 2.5em;
-}
-
-img.profilePic {
-	max-width: 10em;
-	border-radius: 50%;
-	border: solid 5px var(--text-color);
-}
-
-p.page-block.nodropcap {
-	margin-top: 0;
-}
-
-ul.socialLinks {
-	padding-left: 0;
-	display: flex;
-	flex-flow: column nowrap;
-	align-items: center;
-}
-
-.socialLinks a {
-	background-color: var(--color-gray-90);
-	border-radius: var(--corner-radius);
-	padding: .5em;
-	margin-bottom: 1em;
-	list-style-type: none;
-	transition: var(--transition-normal);
-	width: 20em;
-	display: flex;
-	flex-flow: row nowrap;
-	align-items: center;
-	justify-content: center;
-	text-decoration: none;
-	color: var(--background-color);
-}
-
-.socialLinks a:hover {
-	background-color: var(--contrast-color);
-	transform: scale(1.05, 1.05);
-}
-
-.socialLinks a li img {
-	max-width: 1em;
-	margin-right: .5em;
-	filter: var(--icon-filter);
-}
-}
-
-li.iconButton {
-	color: var(--background-color);
-}
-
-@media(max-width: 556px) {
-	.socialLinks a {
-		width: 90vw;
-		height: 3rem;
-		display: flex;
-		flex-flow: row nowrap;
-		align-items: center;
-		justify-content: center;
-	}
-
-}
-
-@media (prefers-color-scheme: dark) {
-	.socialLinks a li img {
-		filter: auto;
-	}
-}
diff --git a/public/css/me.css b/public/css/me.css
new file mode 100644
index 0000000..25a7773
--- /dev/null
+++ b/public/css/me.css
@@ -0,0 +1,29 @@
+/* /Me */
+
+.links-container {
+	grid-column: 1 / span 12;
+	padding: 0 var(--space-3xl);
+}
+
+.socialLinks a button {
+	width: 100%;
+	margin: 0 0 var(--space-s) 0;
+}
+
+h1.socialTitle {
+	padding: 0;
+	margin: 0;
+	font-size: var(--step-4);
+}
+
+.links-container p {
+	font-size: var(--step-0);
+	line-height: calc(var(--step-0) * 0.5 + var(--step-0));
+	padding-top: var(--space-3xs);
+}
+
+img.profilePic {
+	max-width: var(--space-3xl);
+	border-radius: 50%;
+	border: solid 2px var(--text-color);
+}
diff --git a/public/css/webfonts/Fraunces-Italic[SOFT,WONK,opsz,wght].woff2 b/public/css/webfonts/Fraunces-Italic[SOFT,WONK,opsz,wght].woff2
new file mode 100644
index 0000000..b30562d
Binary files /dev/null and b/public/css/webfonts/Fraunces-Italic[SOFT,WONK,opsz,wght].woff2 differ
diff --git a/public/css/webfonts/Fraunces[SOFT,WONK,opsz,wght].woff2 b/public/css/webfonts/Fraunces[SOFT,WONK,opsz,wght].woff2
new file mode 100644
index 0000000..f0ec0d0
Binary files /dev/null and b/public/css/webfonts/Fraunces[SOFT,WONK,opsz,wght].woff2 differ
diff --git a/public/css/webfonts/Manrope[wght].woff2 b/public/css/webfonts/Manrope[wght].woff2
new file mode 100644
index 0000000..4d677aa
Binary files /dev/null and b/public/css/webfonts/Manrope[wght].woff2 differ
diff --git a/public/css/webfonts/manrope-bold-latin-ext.woff b/public/css/webfonts/manrope-bold-latin-ext.woff
deleted file mode 100644
index a5b9eae..0000000
Binary files a/public/css/webfonts/manrope-bold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-bold-latin-ext.woff2 b/public/css/webfonts/manrope-bold-latin-ext.woff2
deleted file mode 100644
index 6f9922a..0000000
Binary files a/public/css/webfonts/manrope-bold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-bold-latin.woff b/public/css/webfonts/manrope-bold-latin.woff
deleted file mode 100644
index 8cf1070..0000000
Binary files a/public/css/webfonts/manrope-bold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-bold-latin.woff2 b/public/css/webfonts/manrope-bold-latin.woff2
deleted file mode 100644
index 1554f29..0000000
Binary files a/public/css/webfonts/manrope-bold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-extrabold-latin-ext.woff b/public/css/webfonts/manrope-extrabold-latin-ext.woff
deleted file mode 100644
index c027e65..0000000
Binary files a/public/css/webfonts/manrope-extrabold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-extrabold-latin-ext.woff2 b/public/css/webfonts/manrope-extrabold-latin-ext.woff2
deleted file mode 100644
index 26e0458..0000000
Binary files a/public/css/webfonts/manrope-extrabold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-extrabold-latin.woff b/public/css/webfonts/manrope-extrabold-latin.woff
deleted file mode 100644
index cf3677c..0000000
Binary files a/public/css/webfonts/manrope-extrabold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-extrabold-latin.woff2 b/public/css/webfonts/manrope-extrabold-latin.woff2
deleted file mode 100644
index 7d4f677..0000000
Binary files a/public/css/webfonts/manrope-extrabold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-extralight-latin-ext.woff b/public/css/webfonts/manrope-extralight-latin-ext.woff
deleted file mode 100644
index b779652..0000000
Binary files a/public/css/webfonts/manrope-extralight-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-extralight-latin-ext.woff2 b/public/css/webfonts/manrope-extralight-latin-ext.woff2
deleted file mode 100644
index 1f905ac..0000000
Binary files a/public/css/webfonts/manrope-extralight-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-extralight-latin.woff b/public/css/webfonts/manrope-extralight-latin.woff
deleted file mode 100644
index 914b545..0000000
Binary files a/public/css/webfonts/manrope-extralight-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-extralight-latin.woff2 b/public/css/webfonts/manrope-extralight-latin.woff2
deleted file mode 100644
index 24e55d3..0000000
Binary files a/public/css/webfonts/manrope-extralight-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-light-latin-ext.woff b/public/css/webfonts/manrope-light-latin-ext.woff
deleted file mode 100644
index dffde6d..0000000
Binary files a/public/css/webfonts/manrope-light-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-light-latin-ext.woff2 b/public/css/webfonts/manrope-light-latin-ext.woff2
deleted file mode 100644
index ef452f0..0000000
Binary files a/public/css/webfonts/manrope-light-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-light-latin.woff b/public/css/webfonts/manrope-light-latin.woff
deleted file mode 100644
index 72d63f1..0000000
Binary files a/public/css/webfonts/manrope-light-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-light-latin.woff2 b/public/css/webfonts/manrope-light-latin.woff2
deleted file mode 100644
index c2b637c..0000000
Binary files a/public/css/webfonts/manrope-light-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-medium-latin-ext.woff b/public/css/webfonts/manrope-medium-latin-ext.woff
deleted file mode 100644
index 1064047..0000000
Binary files a/public/css/webfonts/manrope-medium-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-medium-latin-ext.woff2 b/public/css/webfonts/manrope-medium-latin-ext.woff2
deleted file mode 100644
index b9c6193..0000000
Binary files a/public/css/webfonts/manrope-medium-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-medium-latin.woff b/public/css/webfonts/manrope-medium-latin.woff
deleted file mode 100644
index a9013e0..0000000
Binary files a/public/css/webfonts/manrope-medium-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-medium-latin.woff2 b/public/css/webfonts/manrope-medium-latin.woff2
deleted file mode 100644
index 2ca24af..0000000
Binary files a/public/css/webfonts/manrope-medium-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-regular-latin-ext.woff b/public/css/webfonts/manrope-regular-latin-ext.woff
deleted file mode 100644
index 0620c5f..0000000
Binary files a/public/css/webfonts/manrope-regular-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-regular-latin-ext.woff2 b/public/css/webfonts/manrope-regular-latin-ext.woff2
deleted file mode 100644
index 2a3682c..0000000
Binary files a/public/css/webfonts/manrope-regular-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-regular-latin.woff b/public/css/webfonts/manrope-regular-latin.woff
deleted file mode 100644
index df8eda9..0000000
Binary files a/public/css/webfonts/manrope-regular-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-regular-latin.woff2 b/public/css/webfonts/manrope-regular-latin.woff2
deleted file mode 100644
index ecbe114..0000000
Binary files a/public/css/webfonts/manrope-regular-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-semibold-latin-ext.woff b/public/css/webfonts/manrope-semibold-latin-ext.woff
deleted file mode 100644
index 91e1d59..0000000
Binary files a/public/css/webfonts/manrope-semibold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-semibold-latin-ext.woff2 b/public/css/webfonts/manrope-semibold-latin-ext.woff2
deleted file mode 100644
index 2186b4a..0000000
Binary files a/public/css/webfonts/manrope-semibold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/manrope-semibold-latin.woff b/public/css/webfonts/manrope-semibold-latin.woff
deleted file mode 100644
index db2a48c..0000000
Binary files a/public/css/webfonts/manrope-semibold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/manrope-semibold-latin.woff2 b/public/css/webfonts/manrope-semibold-latin.woff2
deleted file mode 100644
index 85bae63..0000000
Binary files a/public/css/webfonts/manrope-semibold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-italic-latin-ext.woff b/public/css/webfonts/playfair-display-black-italic-latin-ext.woff
deleted file mode 100644
index 2c4883c..0000000
Binary files a/public/css/webfonts/playfair-display-black-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-black-italic-latin-ext.woff2
deleted file mode 100644
index fd06ea9..0000000
Binary files a/public/css/webfonts/playfair-display-black-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-italic-latin.woff b/public/css/webfonts/playfair-display-black-italic-latin.woff
deleted file mode 100644
index 8c56594..0000000
Binary files a/public/css/webfonts/playfair-display-black-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-italic-latin.woff2 b/public/css/webfonts/playfair-display-black-italic-latin.woff2
deleted file mode 100644
index 3798ada..0000000
Binary files a/public/css/webfonts/playfair-display-black-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-latin-ext.woff b/public/css/webfonts/playfair-display-black-latin-ext.woff
deleted file mode 100644
index e4d4104..0000000
Binary files a/public/css/webfonts/playfair-display-black-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-latin-ext.woff2 b/public/css/webfonts/playfair-display-black-latin-ext.woff2
deleted file mode 100644
index e3c1ccd..0000000
Binary files a/public/css/webfonts/playfair-display-black-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-latin.woff b/public/css/webfonts/playfair-display-black-latin.woff
deleted file mode 100644
index c4b257e..0000000
Binary files a/public/css/webfonts/playfair-display-black-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-black-latin.woff2 b/public/css/webfonts/playfair-display-black-latin.woff2
deleted file mode 100644
index 61f1403..0000000
Binary files a/public/css/webfonts/playfair-display-black-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff b/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff
deleted file mode 100644
index b619fbe..0000000
Binary files a/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff2
deleted file mode 100644
index 6cc72dc..0000000
Binary files a/public/css/webfonts/playfair-display-bold-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-italic-latin.woff b/public/css/webfonts/playfair-display-bold-italic-latin.woff
deleted file mode 100644
index d925906..0000000
Binary files a/public/css/webfonts/playfair-display-bold-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-italic-latin.woff2 b/public/css/webfonts/playfair-display-bold-italic-latin.woff2
deleted file mode 100644
index 36b138b..0000000
Binary files a/public/css/webfonts/playfair-display-bold-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-latin-ext.woff b/public/css/webfonts/playfair-display-bold-latin-ext.woff
deleted file mode 100644
index 719615f..0000000
Binary files a/public/css/webfonts/playfair-display-bold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-latin-ext.woff2 b/public/css/webfonts/playfair-display-bold-latin-ext.woff2
deleted file mode 100644
index 5e9c206..0000000
Binary files a/public/css/webfonts/playfair-display-bold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-latin.woff b/public/css/webfonts/playfair-display-bold-latin.woff
deleted file mode 100644
index a81ca13..0000000
Binary files a/public/css/webfonts/playfair-display-bold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-bold-latin.woff2 b/public/css/webfonts/playfair-display-bold-latin.woff2
deleted file mode 100644
index 4ffcda1..0000000
Binary files a/public/css/webfonts/playfair-display-bold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff b/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff
deleted file mode 100644
index 89c35b3..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff2
deleted file mode 100644
index a1a7053..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-italic-latin.woff b/public/css/webfonts/playfair-display-extrabold-italic-latin.woff
deleted file mode 100644
index 5a9c6ba..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-italic-latin.woff2 b/public/css/webfonts/playfair-display-extrabold-italic-latin.woff2
deleted file mode 100644
index 853bd2f..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-latin-ext.woff b/public/css/webfonts/playfair-display-extrabold-latin-ext.woff
deleted file mode 100644
index 9908375..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-latin-ext.woff2 b/public/css/webfonts/playfair-display-extrabold-latin-ext.woff2
deleted file mode 100644
index 7aca28a..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-latin.woff b/public/css/webfonts/playfair-display-extrabold-latin.woff
deleted file mode 100644
index 51018da..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-extrabold-latin.woff2 b/public/css/webfonts/playfair-display-extrabold-latin.woff2
deleted file mode 100644
index 7257b11..0000000
Binary files a/public/css/webfonts/playfair-display-extrabold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-italic-latin-ext.woff b/public/css/webfonts/playfair-display-italic-latin-ext.woff
deleted file mode 100644
index f4e2820..0000000
Binary files a/public/css/webfonts/playfair-display-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-italic-latin-ext.woff2
deleted file mode 100644
index 88fdbba..0000000
Binary files a/public/css/webfonts/playfair-display-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-italic-latin.woff b/public/css/webfonts/playfair-display-italic-latin.woff
deleted file mode 100644
index 7d640f2..0000000
Binary files a/public/css/webfonts/playfair-display-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-italic-latin.woff2 b/public/css/webfonts/playfair-display-italic-latin.woff2
deleted file mode 100644
index 51f05dc..0000000
Binary files a/public/css/webfonts/playfair-display-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff b/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff
deleted file mode 100644
index 1d94c6a..0000000
Binary files a/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff2
deleted file mode 100644
index 75cfd8a..0000000
Binary files a/public/css/webfonts/playfair-display-medium-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-italic-latin.woff b/public/css/webfonts/playfair-display-medium-italic-latin.woff
deleted file mode 100644
index 7e0981f..0000000
Binary files a/public/css/webfonts/playfair-display-medium-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-italic-latin.woff2 b/public/css/webfonts/playfair-display-medium-italic-latin.woff2
deleted file mode 100644
index 0d1a15e..0000000
Binary files a/public/css/webfonts/playfair-display-medium-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-latin-ext.woff b/public/css/webfonts/playfair-display-medium-latin-ext.woff
deleted file mode 100644
index 878c82e..0000000
Binary files a/public/css/webfonts/playfair-display-medium-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-latin-ext.woff2 b/public/css/webfonts/playfair-display-medium-latin-ext.woff2
deleted file mode 100644
index d9ea532..0000000
Binary files a/public/css/webfonts/playfair-display-medium-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-latin.woff b/public/css/webfonts/playfair-display-medium-latin.woff
deleted file mode 100644
index 1531f2b..0000000
Binary files a/public/css/webfonts/playfair-display-medium-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-medium-latin.woff2 b/public/css/webfonts/playfair-display-medium-latin.woff2
deleted file mode 100644
index 853e03e..0000000
Binary files a/public/css/webfonts/playfair-display-medium-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-regular-latin-ext.woff b/public/css/webfonts/playfair-display-regular-latin-ext.woff
deleted file mode 100644
index 721e6dc..0000000
Binary files a/public/css/webfonts/playfair-display-regular-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-regular-latin-ext.woff2 b/public/css/webfonts/playfair-display-regular-latin-ext.woff2
deleted file mode 100644
index fd4f248..0000000
Binary files a/public/css/webfonts/playfair-display-regular-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-regular-latin.woff b/public/css/webfonts/playfair-display-regular-latin.woff
deleted file mode 100644
index eb00d14..0000000
Binary files a/public/css/webfonts/playfair-display-regular-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-regular-latin.woff2 b/public/css/webfonts/playfair-display-regular-latin.woff2
deleted file mode 100644
index f7d127d..0000000
Binary files a/public/css/webfonts/playfair-display-regular-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff b/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff
deleted file mode 100644
index a3c2eb0..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff2 b/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff2
deleted file mode 100644
index 422137d..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-italic-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-italic-latin.woff b/public/css/webfonts/playfair-display-semibold-italic-latin.woff
deleted file mode 100644
index dbd6e89..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-italic-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-italic-latin.woff2 b/public/css/webfonts/playfair-display-semibold-italic-latin.woff2
deleted file mode 100644
index 53de633..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-italic-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-latin-ext.woff b/public/css/webfonts/playfair-display-semibold-latin-ext.woff
deleted file mode 100644
index 34781f7..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-latin-ext.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-latin-ext.woff2 b/public/css/webfonts/playfair-display-semibold-latin-ext.woff2
deleted file mode 100644
index 0072113..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-latin-ext.woff2 and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-latin.woff b/public/css/webfonts/playfair-display-semibold-latin.woff
deleted file mode 100644
index 8915134..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-latin.woff and /dev/null differ
diff --git a/public/css/webfonts/playfair-display-semibold-latin.woff2 b/public/css/webfonts/playfair-display-semibold-latin.woff2
deleted file mode 100644
index add9062..0000000
Binary files a/public/css/webfonts/playfair-display-semibold-latin.woff2 and /dev/null differ
diff --git a/public/css/webfonts/webfonts.css b/public/css/webfonts/webfonts.css
index a238418..981a581 100644
--- a/public/css/webfonts/webfonts.css
+++ b/public/css/webfonts/webfonts.css
@@ -1,417 +1,19 @@
-/* manrope-extralight-latin */
 @font-face {
 	font-family: Manrope;
 	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraLight"), local("Manrope-ExtraLight"), url(/css/webfonts/manrope-extralight-latin.woff2) format("woff2"), url(/css/webfonts/manrope-extralight-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
+	font-weight: 200 900;
+	src: url(/css/webfonts/Manrope[wght].woff2) format("woff2");
 }
-/* manrope-extralight-latin-ext */
 @font-face {
-	font-family: Manrope;
+	font-family: Fraunces;
 	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraLight"), local("Manrope-ExtraLight"), url(/css/webfonts/manrope-extralight-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-extralight-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
+	font-weight: 100 900;
+	src: url(/css/webfonts/Fraunces[SOFT,WONK,opsz,wght].woff2) format("woff2");
 }
-/* manrope-light-latin */
 @font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 300;
-	src: local("Manrope Light"), local("Manrope-Light"), url(/css/webfonts/manrope-light-latin.woff2) format("woff2"), url(/css/webfonts/manrope-light-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-light-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 300;
-	src: local("Manrope Light"), local("Manrope-Light"), url(/css/webfonts/manrope-light-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-light-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-bold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Manrope Bold"), local("Manrope-Bold"), url(/css/webfonts/manrope-bold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-bold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-bold-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Manrope Bold"), local("Manrope-Bold"), url(/css/webfonts/manrope-bold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-bold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-extrabold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraBold"), local("Manrope-ExtraBold"), url(/css/webfonts/manrope-extrabold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-extrabold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-extrabold-latin-ext *//* manrope-extralight-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraLight"), local("Manrope-ExtraLight"), url(/css/webfonts/manrope-extralight-latin.woff2) format("woff2"), url(/css/webfonts/manrope-extralight-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-extralight-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraLight"), local("Manrope-ExtraLight"), url(/css/webfonts/manrope-extralight-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-extralight-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-light-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 300;
-	src: local("Manrope Light"), local("Manrope-Light"), url(/css/webfonts/manrope-light-latin.woff2) format("woff2"), url(/css/webfonts/manrope-light-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-light-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 300;
-	src: local("Manrope Light"), local("Manrope-Light"), url(/css/webfonts/manrope-light-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-light-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-bold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Manrope Bold"), local("Manrope-Bold"), url(/css/webfonts/manrope-bold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-bold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-bold-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Manrope Bold"), local("Manrope-Bold"), url(/css/webfonts/manrope-bold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-bold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-extrabold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraBold"), local("Manrope-ExtraBold"), url(/css/webfonts/manrope-extrabold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-extrabold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-extrabold-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraBold"), local("Manrope-ExtraBold"), url(/css/webfonts/manrope-extrabold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-extrabold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-medium-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Manrope Medium"), local("Manrope-Medium"), url(/css/webfonts/manrope-medium-latin.woff2) format("woff2"), url(/css/webfonts/manrope-medium-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-medium-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Manrope Medium"), local("Manrope-Medium"), url(/css/webfonts/manrope-medium-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-medium-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-regular-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope Regular"), local("Manrope-Regular"), url(/css/webfonts/manrope-regular-latin.woff2) format("woff2"), url(/css/webfonts/manrope-regular-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-regular-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope Regular"), local("Manrope-Regular"), url(/css/webfonts/manrope-regular-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-regular-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-semibold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope SemiBold"), local("Manrope-SemiBold"), url(/css/webfonts/manrope-semibold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-semibold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-semibold-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope SemiBold"), local("Manrope-SemiBold"), url(/css/webfonts/manrope-semibold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-semibold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
+	font-family: Fraunces;
+	font-style: italic;
+	font-weight: 100 900;
+	src: url(/css/webfonts/Fraunces-Italic[SOFT,WONK,opsz,wght].woff2) format("woff2");
 }
 
-
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope ExtraBold"), local("Manrope-ExtraBold"), url(/css/webfonts/manrope-extrabold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-extrabold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-medium-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Manrope Medium"), local("Manrope-Medium"), url(/css/webfonts/manrope-medium-latin.woff2) format("woff2"), url(/css/webfonts/manrope-medium-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-medium-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Manrope Medium"), local("Manrope-Medium"), url(/css/webfonts/manrope-medium-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-medium-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-regular-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope Regular"), local("Manrope-Regular"), url(/css/webfonts/manrope-regular-latin.woff2) format("woff2"), url(/css/webfonts/manrope-regular-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-regular-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope Regular"), local("Manrope-Regular"), url(/css/webfonts/manrope-regular-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-regular-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* manrope-semibold-latin */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope SemiBold"), local("Manrope-SemiBold"), url(/css/webfonts/manrope-semibold-latin.woff2) format("woff2"), url(/css/webfonts/manrope-semibold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* manrope-semibold-latin-ext */
-@font-face {
-	font-family: Manrope;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Manrope SemiBold"), local("Manrope-SemiBold"), url(/css/webfonts/manrope-semibold-latin-ext.woff2) format("woff2"), url(/css/webfonts/manrope-semibold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-black-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 900;
-	src: local("Playfair Display Black"), local("PlayfairDisplay-Black"), url(/css/webfonts/playfair-display-black-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-black-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-black-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 900;
-	src: local("Playfair Display Black"), local("PlayfairDisplay-Black"), url(/css/webfonts/playfair-display-black-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-black-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-black-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 900;
-	src: local("Playfair Display Black Italic"), local("PlayfairDisplay-BlackItalic"), url(/css/webfonts/playfair-display-black-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-black-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-black-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 900;
-	src: local("Playfair Display Black Italic"), local("PlayfairDisplay-BlackItalic"), url(/css/webfonts/playfair-display-black-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-black-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-bold-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Playfair Display Bold"), local("PlayfairDisplay-Bold"), url(/css/webfonts/playfair-display-bold-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-bold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-bold-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 700;
-	src: local("Playfair Display Bold"), local("PlayfairDisplay-Bold"), url(/css/webfonts/playfair-display-bold-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-bold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-bold-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 700;
-	src: local("Playfair Display Bold Italic"), local("PlayfairDisplay-BoldItalic"), url(/css/webfonts/playfair-display-bold-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-bold-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-bold-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 700;
-	src: local("Playfair Display Bold Italic"), local("PlayfairDisplay-BoldItalic"), url(/css/webfonts/playfair-display-bold-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-bold-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-extrabold-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display ExtraBold"), local("PlayfairDisplay-ExtraBold"), url(/css/webfonts/playfair-display-extrabold-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-extrabold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-extrabold-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display ExtraBold"), local("PlayfairDisplay-ExtraBold"), url(/css/webfonts/playfair-display-extrabold-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-extrabold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-extrabold-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display ExtraBold Italic"), local("PlayfairDisplay-ExtraBoldItalic"), url(/css/webfonts/playfair-display-extrabold-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-extrabold-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-extrabold-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display ExtraBold Italic"), local("PlayfairDisplay-ExtraBoldItalic"), url(/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-extrabold-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display Italic"), local("PlayfairDisplay-Italic"), url(/css/webfonts/playfair-display-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display Italic"), local("PlayfairDisplay-Italic"), url(/css/webfonts/playfair-display-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-medium-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Playfair Display Medium"), local("PlayfairDisplay-Medium"), url(/css/webfonts/playfair-display-medium-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-medium-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-medium-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 500;
-	src: local("Playfair Display Medium"), local("PlayfairDisplay-Medium"), url(/css/webfonts/playfair-display-medium-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-medium-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-medium-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 500;
-	src: local("Playfair Display Medium Italic"), local("PlayfairDisplay-MediumItalic"), url(/css/webfonts/playfair-display-medium-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-medium-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-medium-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 500;
-	src: local("Playfair Display Medium Italic"), local("PlayfairDisplay-MediumItalic"), url(/css/webfonts/playfair-display-medium-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-medium-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-regular-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display Regular"), local("PlayfairDisplay-Regular"), url(/css/webfonts/playfair-display-regular-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-regular-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-regular-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display Regular"), local("PlayfairDisplay-Regular"), url(/css/webfonts/playfair-display-regular-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-regular-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-semibold-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display SemiBold"), local("PlayfairDisplay-SemiBold"), url(/css/webfonts/playfair-display-semibold-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-semibold-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-semibold-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: normal;
-	font-weight: 400;
-	src: local("Playfair Display SemiBold"), local("PlayfairDisplay-SemiBold"), url(/css/webfonts/playfair-display-semibold-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-semibold-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
-/* playfair-display-semibold-italic-latin */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display SemiBold Italic"), local("PlayfairDisplay-SemiBoldItalic"), url(/css/webfonts/playfair-display-semibold-italic-latin.woff2) format("woff2"), url(/css/webfonts/playfair-display-semibold-italic-latin.woff) format("woff");
-	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;
-}
-/* playfair-display-semibold-italic-latin-ext */
-@font-face {
-	font-family: Playfair Display;
-	font-style: italic;
-	font-weight: 400;
-	src: local("Playfair Display SemiBold Italic"), local("PlayfairDisplay-SemiBoldItalic"), url(/css/webfonts/playfair-display-semibold-italic-latin-ext.woff2) format("woff2"), url(/css/webfonts/playfair-display-semibold-italic-latin-ext.woff) format("woff");
-	unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+20A0-20CF,U+2C60-2C7F,U+A720-A7FF;
-}
diff --git a/public/js/main.js b/public/js/main.js
index 9b2097c..36285ba 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -1,4 +1,3 @@
 import './webComponents/card.js';
 import './webComponents/profilePic.js';
-import './webComponents/speechBubble.js';
 import './webComponents/comment.js';
diff --git a/public/xsl/basic.xsl b/public/xsl/basic.xsl
index 2ec6c2e..a58bb71 100644
--- a/public/xsl/basic.xsl
+++ b/public/xsl/basic.xsl
@@ -14,47 +14,48 @@
     </head>
     <body>
 			<main>
-				<p>
-					<i>This is an RSS feed. Subscribe by copying the URL from the address bar into your newsreader. Don't have a newsreader? <a href="../about-feeds/">Learn more and get started</a>. It’s free.</i>
-				</p><hr />
 				<h1>RSS Feed Preview</h1>
-				<p class="nodropcap page-block">Here's the sort of thing you'll see in your newsreader when you subscribe. Done here? <a href="../">Go back to nathanupchurch.com</a></p>
+				<p class="nodropcap page-block">This is an RSS feed. Subscribe by copying the URL from the address bar into your newsreader. Don't have a newsreader? <a href="../about-feeds/">Learn more and get started</a>. It’s free. Below is a preview of what you'll see in your newsreader when you subscribe. Done here? <a href="../">Go back to nathanupchurch.com</a></p>
 				<h2>Latest posts</h2>
-				<xsl:for-each select="/atom:feed/atom:entry">
-					<article class="postlist-item">
-						<a class="postlist-link">
-							<xsl:attribute name="href">
-								<xsl:value-of select="atom:link/@href"/>
-							</xsl:attribute>
-							<div class="post-image-container">
-								<img class="post-image">
-									<xsl:attribute name="src">
-										<xsl:value-of select="atom:image/atom:url" />
+				<section class="postlist">
+					<div class="postlist-item-container">
+						<xsl:for-each select="/atom:feed/atom:entry">
+							<article class="postlist-item">
+								<a class="postlist-link">
+									<xsl:attribute name="href">
+										<xsl:value-of select="atom:link/@href"/>
 									</xsl:attribute>
-								</img>
-							</div>
-						</a>
-						<div class="post-copy">
-							<a class="postlist-link">
-								<xsl:attribute name="href">
-									<xsl:value-of select="atom:link/@href"/>
-								</xsl:attribute>
-								<h3>
-									<xsl:value-of select="atom:title"/>
-								</h3>
-							</a>
-							<time class="postlist-date">
-								<xsl:attribute name="datetime">
-									<xsl:value-of select="substring(atom:updated, 0, 11)" />
-								</xsl:attribute>
-								<xsl:value-of select="substring(atom:updated, 0, 11)" />
-							</time>
-							<p>
-								<xsl:value-of select="atom:description" />
-							</p>
-						</div>
-					</article>
-				</xsl:for-each>
+									<div class="post-image-container">
+										<img class="post-image">
+											<xsl:attribute name="src">
+												<xsl:value-of select="atom:image/atom:url" />
+											</xsl:attribute>
+										</img>
+									</div>
+								</a>
+								<div class="post-copy">
+									<a class="postlist-link">
+										<xsl:attribute name="href">
+											<xsl:value-of select="atom:link/@href"/>
+										</xsl:attribute>
+										<h3>
+											<xsl:value-of select="atom:title"/>
+										</h3>
+									</a>
+									<time class="postlist-date">
+										<xsl:attribute name="datetime">
+											<xsl:value-of select="substring(atom:updated, 0, 11)" />
+										</xsl:attribute>
+										<xsl:value-of select="substring(atom:updated, 0, 11)" />
+									</time>
+									<p>
+										<xsl:value-of select="atom:description" />
+									</p>
+								</div>
+							</article>
+						</xsl:for-each>
+					</div>
+				</section>
 			</main>
     </body>
     </html>
