diff --git a/static/css/main.css b/static/css/main.css
index d3c7f988..1eb14d86 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -8,770 +8,793 @@
  * == Global ==
  */
 
-html, body {
-	margin: 0;
-	padding: 0;
-	background: #F4F4F4;
-	color: #242424;
-	font-family: "Route159", serif;
-}
+ html, body {
+ 	margin: 0;
+ 	padding: 0;
+ 	background: #F4F4F4;
+ 	color: #242424;
+ 	font-family: "Route159", serif;
+ }
 
-a, a:visited {
-	color: #7765E3;
-	text-decoration: none;
-	outline: none;
-}
+ a, a:visited {
+ 	color: #7765E3;
+ 	text-decoration: none;
+ 	outline: none;
+ }
 
-small {
-	margin-left: 1em;
-	color: rgba(36, 36, 36, 0.6);
-	font-size: 0.75em;
-	word-wrap: break-word;
-	word-break: break-all;
-}
+ small {
+ 	margin-left: 1em;
+ 	color: rgba(36, 36, 36, 0.6);
+ 	font-size: 0.75em;
+ 	word-wrap: break-word;
+ 	word-break: break-all;
+ }
 
-.center {
-	text-align: center;
-	font-weight: bold;
-	opacity: 0.6;
-	padding: 5em;
-}
+ .center {
+ 	text-align: center;
+ 	font-weight: bold;
+ 	opacity: 0.6;
+ 	padding: 5em;
+ }
 
-.spaced {
-	margin: 4rem 0;
-}
+ .spaced {
+ 	margin: 4rem 0;
+ }
 
-.banner {
-	background: #DADADA;
-	padding-top: 2em;
-	padding-bottom: 1em;
-	margin: 3em 0px;
-}
+ .banner {
+ 	background: #DADADA;
+ 	padding-top: 2em;
+ 	padding-bottom: 1em;
+ 	margin: 3em 0px;
+ }
 
 /*
  * == Header ==
  */
 
-header {
-	background: #ECECEC;
-}
-header #content {
-	display: flex;
-	align-content: center;
-	justify-content: space-between;
-}
+ header {
+ 	background: #ECECEC;
+ }
+ header #content {
+ 	display: flex;
+ 	align-content: center;
+ 	justify-content: space-between;
+ }
 
-header nav#menu {
-	position: relative;
-	display: none;
-	transform: skewX(-15deg);
-	left: -1em;
-	padding: 1em 1em 1em 2em;
-	background: #7765E3;
-	align-self: flex-start;
-}
-header nav#menu a {
-	transform: skewX(15deg);
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	width: 1.4em;
-	height: 1.4em;
-	margin: 0;
-	padding: 0;
-	color: #ECECEC;
-	font-size: 1.33em;
-}
+ header nav#menu {
+ 	position: relative;
+ 	display: none;
+ 	transform: skewX(-15deg);
+ 	left: -1em;
+ 	padding: 1em 1em 1em 2em;
+ 	background: #7765E3;
+ 	align-self: flex-start;
+ }
+ header nav#menu a {
+ 	transform: skewX(15deg);
+ 	display: flex;
+ 	flex-direction: column;
+ 	align-items: center;
+ 	justify-content: center;
+ 	width: 1.4em;
+ 	height: 1.4em;
+ 	margin: 0;
+ 	padding: 0;
+ 	color: #ECECEC;
+ 	font-size: 1.33em;
+ }
 
-header nav {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-}
-header nav hr {
-	height: 100%;
-	width: 0.2em;
-	background: #7765E3;
-	border: none;
-	transform: skewX(-15deg);
-}
-header nav a {
-	display: block;
-	margin: 0 2em;
-	font-size: 1em;
-}
-header nav a.title {
-	margin: 0;
-	padding: 0.5em 2em;
-	font-size: 1.75em;
-	text-align: center;
-}
-header nav i {
-	font-size: 1.2em;
-}
+ header nav {
+ 	display: flex;
+ 	flex-direction: row;
+ 	align-items: center;
+ }
+ header nav hr {
+ 	height: 100%;
+ 	width: 0.2em;
+ 	background: #7765E3;
+ 	border: none;
+ 	transform: skewX(-15deg);
+ }
+ header nav a {
+ 	display: flex;
+ 	align-items: center;
+ 	position: relative;
+ 	align-self: stretch;
+ 	margin: 0;
+ 	padding: 0 2em;
+ 	font-size: 1em;
+ }
+ header nav a.title {
+ 	margin: 0;
+ 	padding: 0.5em 2em;
+ 	font-size: 1.75em;
+ 	text-align: center;
+ }
+ header nav a i { font-size: 1.2em; }
+
+ /* Only enable label animations on normal screens. */
+ @media screen and (min-width: 900px) {
+ 	header nav a i {
+ 		transition: all 0.2s ease;
+ 		margin: 0;
+ 	}
+
+ 	header nav a:hover i { margin-bottom: 0.75em; }
+
+ 	header nav a .mobile-label {
+ 		transition: all 0.2s ease;
+ 		display: block;
+ 		position: absolute;
+ 		left: 50%;
+ 		transform: translate(-50%, 0);
+ 		opacity: 0;
+ 		font-size: 0.9em;
+ 		white-space: nowrap;
+ 	}
+ 	header nav a:hover .mobile-label {
+ 		opacity: 1;
+ 		transform: translate(-50%, 80%);
+ 	}
+ 	header nav a img + .mobile-label { display: none; }
+ }
 
 /*
  * == Main ==
  */
 
-body > main > * {
-	padding: 0 20%;
-}
+ body > main > * {
+ 	padding: 0 20%;
+ }
 
-main h1 {
-	font-family: "Route159";
-	font-size: 2.5em;
-	font-weight: 300;
-}
-main h1.article {
-	max-width: 40rem;
-	margin: 1em auto 0.5em;
-	font-family: "Playfair Display", serif;
-	font-size: 2.5em;
-	font-weight: normal;
-}
+ main h1 {
+ 	font-family: "Route159";
+ 	font-size: 2.5em;
+ 	font-weight: 300;
+ }
+ main h1.article {
+ 	max-width: 40rem;
+ 	margin: 1em auto 0.5em;
+ 	font-family: "Playfair Display", serif;
+ 	font-size: 2.5em;
+ 	font-weight: normal;
+ }
 
-main h2 {
-	font-family: "Route159";
-	font-size: 1.75em;
-	font-weight: 300;
-}
+ main h2 {
+ 	font-family: "Route159";
+ 	font-size: 1.75em;
+ 	font-weight: 300;
+ }
 
 /*
  * == Article ==
  */
 
-/* Author */
+ /* Author */
 
-main .article-info {
-	max-width: 40rem;
-	margin: 0 auto 3em;
-	font-size: 0.95em;
-	font-weight: 400;
-}
-main .article-info .author { font-weight: 600; }
-main .article-info .author a { font-weight: 600; }
+ main .article-info {
+ 	max-width: 40rem;
+ 	margin: 0 auto 3em;
+ 	font-size: 0.95em;
+ 	font-weight: 400;
+ }
+ main .article-info .author { font-weight: 600; }
+ main .article-info .author a { font-weight: 600; }
 
-/* Article */
+ /* Article */
 
-main article {
-	max-width: 40rem;
-	margin: 2.5em auto;
-	font-family: "Lora", serif;
-	font-size: 1.2em;
-	line-height: 1.7em;
-}
+ main article {
+ 	max-width: 40rem;
+ 	margin: 2.5em auto;
+ 	font-family: "Lora", serif;
+ 	font-size: 1.2em;
+ 	line-height: 1.7em;
+ }
 
-article img {
-	max-width: 100%;
-}
+ article img {
+ 	max-width: 100%;
+ }
 
-/* Article.Meta */
+ /* Article.Meta */
 
-main .article-meta, main .article-meta button {
-	padding: 0;
-	font-size: 1.1em;
-	margin-top: 10%;
-}
-main .article-meta > * { margin: 0 20%; }
+ main .article-meta, main .article-meta button {
+ 	padding: 0;
+ 	font-size: 1.1em;
+ 	margin-top: 10%;
+ }
+ main .article-meta > * { margin: 0 20%; }
 
-main .article-meta > p {
-	margin: 2em 20%;
-	font-size: 0.9em;
-}
+ main .article-meta > p {
+ 	margin: 2em 20%;
+ 	font-size: 0.9em;
+ }
 
-/* ~ Likes ~ */
+ /* ~ Likes ~ */
 
-main .article-meta .likes p,
-main .article-meta .reshares p { display: inline-block; margin: 0; }
+ main .article-meta .likes p,
+ main .article-meta .reshares p { display: inline-block; margin: 0; }
 
-/* Like / Reshare button */
+ /* Like / Reshare button */
 
-main .article-meta .actions {
-	display: flex;
-	flex-direction: row;
-	justify-content: space-around;
-}
+ main .article-meta .actions {
+ 	display: flex;
+ 	flex-direction: row;
+ 	justify-content: space-around;
+ }
 
-main .article-meta .likes,
-main .article-meta .reshares {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	padding: 0.5em 0;
-}
+ main .article-meta .likes,
+ main .article-meta .reshares {
+ 	display: flex;
+ 	flex-direction: column;
+ 	align-items: center;
+ 	padding: 0.5em 0;
+ }
 
-main .article-meta .likes > p,
-main .article-meta .reshares > p {
-	font-size: 1.5em;
-}
+ main .article-meta .likes > p,
+ main .article-meta .reshares > p {
+ 	font-size: 1.5em;
+ }
 
-main .article-meta .likes button,
-main .article-meta .reshares button {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	margin: 0;
-	padding: 0;
-	background: none;
-	color: #242424;
-	border: none;
-}
+ main .article-meta .likes button,
+ main .article-meta .reshares button {
+ 	display: flex;
+ 	flex-direction: column;
+ 	align-items: center;
+ 	justify-content: center;
+ 	margin: 0;
+ 	padding: 0;
+ 	background: none;
+ 	color: #242424;
+ 	border: none;
+ }
 
-main .article-meta .likes > p,
-main .article-meta .likes button:hover { color: #E92F2F; }
-main .article-meta .reshares > p,
-main .article-meta .reshares button:hover { color: #7765E3; }
+ main .article-meta .likes > p,
+ main .article-meta .likes button:hover { color: #E92F2F; }
+ main .article-meta .reshares > p,
+ main .article-meta .reshares button:hover { color: #7765E3; }
 
-main .article-meta .likes button svg.feather,
-main .article-meta .reshares button i {
-	transition: background 0.1s ease-in;
-	display: flex;
-	align-items: center;
-	justify-content: center;
+ main .article-meta .likes button svg.feather,
+ main .article-meta .reshares button i {
+ 	transition: background 0.1s ease-in;
+ 	display: flex;
+ 	align-items: center;
+ 	justify-content: center;
 
-	margin: 0.5em 0;
-	width: 2.5em;
-	height: 2.5em;
+ 	margin: 0.5em 0;
+ 	width: 2.5em;
+ 	height: 2.5em;
 
-	border-radius: 50%;
-}
+ 	border-radius: 50%;
+ }
 
-main .article-meta .likes button svg.feather {
-	padding: 0.7em;
-	box-sizing: border-box;
-	color: #E92F2F;
-	fill: none;
-	border: solid #E92F2F thin;
-}
-main .article-meta .likes button:hover svg.feather {
-	background: rgba(233, 47, 47, 0.15);
-}
+ main .article-meta .likes button svg.feather {
+ 	padding: 0.7em;
+ 	box-sizing: border-box;
+ 	color: #E92F2F;
+ 	fill: none;
+ 	border: solid #E92F2F thin;
+ }
+ main .article-meta .likes button:hover svg.feather {
+ 	background: rgba(233, 47, 47, 0.15);
+ }
 
-main .article-meta .reshares button i {
-	color: #7765E3;
-	border: solid #7765E3 thin;
-	font-weight: 600;
-}
-main .article-meta .reshares button:hover i {
-	background: rgba(119, 101, 227, 0.15);
-}
+ main .article-meta .reshares button i {
+ 	color: #7765E3;
+ 	border: solid #7765E3 thin;
+ 	font-weight: 600;
+ }
+ main .article-meta .reshares button:hover i {
+ 	background: rgba(119, 101, 227, 0.15);
+ }
 
-main .article-meta .likes button.liked svg.feather { background: #E92F2F; fill: currentColor; }
-main .article-meta .likes button.liked:hover svg.feather {
-	background: rgba(233, 47, 47, 0.25);
-	color: #E92F2F;
-}
-main .article-meta .reshares button.reshared i { background: #7765E3; }
-main .article-meta .reshares button.reshared:hover i {
-	background: rgba(119, 101, 227, 0.25);
-	color: #7765E3;
-}
+ main .article-meta .likes button.liked svg.feather { background: #E92F2F; fill: currentColor; }
+ main .article-meta .likes button.liked:hover svg.feather {
+ 	background: rgba(233, 47, 47, 0.25);
+ 	color: #E92F2F;
+ }
+ main .article-meta .reshares button.reshared i { background: #7765E3; }
+ main .article-meta .reshares button.reshared:hover i {
+ 	background: rgba(119, 101, 227, 0.25);
+ 	color: #7765E3;
+ }
 
-main .article-meta .likes button.liked svg.feather,
-main .article-meta .reshares button.reshared i {
-	color: #F4F4F4;
-	font-weight: 900;
-}
+ main .article-meta .likes button.liked svg.feather,
+ main .article-meta .reshares button.reshared i {
+ 	color: #F4F4F4;
+ 	font-weight: 900;
+ }
 
-/* ~ Comments ~ */
+ /* ~ Comments ~ */
 
-main .article-meta .comments { margin: 0; }
-main .article-meta .comments > * { margin-left: 20%; margin-right: 20%; }
+ main .article-meta .comments { margin: 0; }
+ main .article-meta .comments > * { margin-left: 20%; margin-right: 20%; }
 
-.comments h2 {
-	color: #7765E3;
-	font-size: 1.5em;
-	font-weight: 600;
-}
+ .comments h2 {
+ 	color: #7765E3;
+ 	font-size: 1.5em;
+ 	font-weight: 600;
+ }
 
-/* New comment */
+ /* New comment */
 
-main .article-meta .comments form input[type="submit"]
-{ font-size: 1em; }
+ main .article-meta .comments form input[type="submit"]
+ { font-size: 1em; }
 
-/* Comment / Respond button */
+ /* Comment / Respond button */
 
-main .article-meta .comments a.button:before {
-	color: #7765E3;
-	padding: 0.5em;
-}
-main .article-meta .comments a.button {
-	display: inline-block;
-	padding: 0;
-	background: none;
-	color: #242424;
-	border: none;
-}
-main .article-meta .comments a.button:hover { color: #7765E3; }
+ main .article-meta .comments a.button:before {
+ 	color: #7765E3;
+ 	padding: 0.5em;
+ }
+ main .article-meta .comments a.button {
+ 	display: inline-block;
+ 	padding: 0;
+ 	background: none;
+ 	color: #242424;
+ 	border: none;
+ }
+ main .article-meta .comments a.button:hover { color: #7765E3; }
 
-/* Comment button only */
-main .article-meta .comments > a.button { margin-bottom: 1em; }
+ /* Comment button only */
+ main .article-meta .comments > a.button { margin-bottom: 1em; }
 
-/* == List == */
+ /* == List == */
 
-main .article-meta .comments .list {
-	display: grid;
-	margin: 0;
-	padding: 0 20%;
-	background: #ECECEC;
-}
+ main .article-meta .comments .list {
+ 	display: grid;
+ 	margin: 0;
+ 	padding: 0 20%;
+ 	background: #ECECEC;
+ }
 
-/* ~ Comment ~ */
+ /* ~ Comment ~ */
 
-.comments .list .comment {
-	padding: 2em;
-	font-size: 1em;
-}
+ .comments .list .comment {
+ 	padding: 2em;
+ 	font-size: 1em;
+ }
 
-.comments .list > .comment {
-	border: none;
-}
+ .comments .list > .comment {
+ 	border: none;
+ }
 
-.comments .list .comment .author {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	align-content: center;
-}
-.comments .list .comment .author * {
-	transition: all 0.1s ease-in;
-}
-.comments .list .comment .author .display-name {
-	color: #242424;
-}
-.comments .list .comment .author:hover .display-name { color: #7765E3; }
-.comments .list .comment .author:hover small { opacity: 1; }
+ .comments .list .comment .author {
+ 	display: flex;
+ 	flex-direction: row;
+ 	align-items: center;
+ 	align-content: center;
+ }
+ .comments .list .comment .author * {
+ 	transition: all 0.1s ease-in;
+ }
+ .comments .list .comment .author .display-name {
+ 	color: #242424;
+ }
+ .comments .list .comment .author:hover .display-name { color: #7765E3; }
+ .comments .list .comment .author:hover small { opacity: 1; }
 
-.comments .list .comment .text {
-	padding: 1.25em 0;
-	font-family: "Lora", serif;
-	font-size: 1.1em;
-	line-height: 1.4em;
-	text-align: left;
-}
+ .comments .list .comment .text {
+ 	padding: 1.25em 0;
+ 	font-family: "Lora", serif;
+ 	font-size: 1.1em;
+ 	line-height: 1.4em;
+ 	text-align: left;
+ }
 
 /*
  * == Form ==
  */
 
-label {
-	display: block;
-	margin: 2em auto 1em;
-	font-size: 1.2em;
-	max-width: 40rem;
-}
-input, textarea {
-	transition: all 0.1s ease-in;
-	display: block;
-	width: 100%;
-	max-width: 40rem;
-	margin: auto;
-	padding: 1em;
-	box-sizing: border-box;
+ label {
+ 	display: block;
+ 	margin: 2em auto 1em;
+ 	font-size: 1.2em;
+ 	max-width: 40rem;
+ }
+ input, textarea {
+ 	transition: all 0.1s ease-in;
+ 	display: block;
+ 	width: 100%;
+ 	max-width: 40rem;
+ 	margin: auto;
+ 	padding: 1em;
+ 	box-sizing: border-box;
 
-	background: #F4F4F4;
-	color: #242424;
-	border: none;
-	border: solid #DADADA thin;
-	border-radius: 0.5em;
+ 	background: #F4F4F4;
+ 	color: #242424;
+ 	border: none;
+ 	border: solid #DADADA thin;
+ 	border-radius: 0.5em;
 
-	font-size: 1.2em;
-	font-weight: 400;
-}
-form input[type="submit"] { margin: 2em auto; }
-input:focus, textarea:focus {
-	background: #FAFAFA;
-	border-color: #7765E3;
-}
+ 	font-size: 1.2em;
+ 	font-weight: 400;
+ }
+ form input[type="submit"] { margin: 2em auto; }
+ input:focus, textarea:focus {
+ 	background: #FAFAFA;
+ 	border-color: #7765E3;
+ }
 
-textarea {
+ textarea {
  	resize: vertical;
 
  	font-family: "Lora", serif;
  	font-size: 1.1em;
  	line-height: 1.5em;
-}
+ }
 
-input[type="checkbox"] {
-	display: inline;
-	margin: initial;
-	min-width: initial;
-	width: initial;
-}
+ input[type="checkbox"] {
+ 	display: inline;
+ 	margin: initial;
+ 	min-width: initial;
+ 	width: initial;
+ }
 
-/* Button & Submit */
+ /* Button & Submit */
 
-.button, input[type="submit"], button {
-	transition: all 0.1s ease-in;
-	display: inline-block;
+ .button, input[type="submit"], button {
+ 	transition: all 0.1s ease-in;
+ 	display: inline-block;
 
-	border-radius: 0.5em;
-	margin: 0.5em auto;
-	padding: 0.75em 1em;
+ 	border-radius: 0.5em;
+ 	margin: 0.5em auto;
+ 	padding: 0.75em 1em;
 
-	background: transparent;
-	color: #7765E3;
-	border: 1px solid #7765E3;
+ 	background: transparent;
+ 	color: #7765E3;
+ 	border: 1px solid #7765E3;
 
-	cursor: pointer;
-}
-input[type="submit"] { display: block; }
-.button:hover, input[type="submit"]:hover {
-	background: #7765E399;
-	color: white;
-}
+ 	cursor: pointer;
+ }
+ input[type="submit"] { display: block; }
+ .button:hover, input[type="submit"]:hover {
+ 	background: #7765E399;
+ 	color: white;
+ }
 
-/* Errors */
+ /* Errors */
 
-p.error {
-	color: #ef767a;
-	font-weight: bold;
-	max-width: 40rem;
-	margin: 1em auto;
-}
+ p.error {
+ 	color: #ef767a;
+ 	font-weight: bold;
+ 	max-width: 40rem;
+ 	margin: 1em auto;
+ }
 
 /*
  * == New post ==
  */
 
-form.new-post .title {
-	margin: 0 auto;
-	padding: 0.75em 0;
+ form.new-post .title {
+ 	margin: 0 auto;
+ 	padding: 0.75em 0;
 
-	background: none;
-	border: none;
+ 	background: none;
+ 	border: none;
 
-	font-family: "Playfair Display", serif;
-	font-size: 2em;
-	text-align: left;
-}
-form.new-post textarea {
-	min-height: 20em;
-	overflow-y: hidden;
-	resize: none;
-	box-sizing: content-box;
-}
-form.new-post input[type="submit"] {
-	background: #ECECEC;
-	color: #242424;
-	border: none;
+ 	font-family: "Playfair Display", serif;
+ 	font-size: 2em;
+ 	text-align: left;
+ }
+ form.new-post textarea {
+ 	min-height: 20em;
+ 	overflow-y: hidden;
+ 	resize: none;
+ 	box-sizing: content-box;
+ }
+ form.new-post input[type="submit"] {
+ 	background: #ECECEC;
+ 	color: #242424;
+ 	border: none;
 
-	font-family: "Playfair Display", serif;
-	font-size: 1.5em;
-}
-form.new-post input[type="submit"]:hover { background: #DADADA; }
+ 	font-family: "Playfair Display", serif;
+ 	font-size: 1.5em;
+ }
+ form.new-post input[type="submit"]:hover { background: #DADADA; }
 
 /*
  * == User ==
  */
 
-.user h1 {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	margin-bottom: 0;
-}
-.badge {
-	margin-left: 1em;
-	padding: 0.35em 1em;
+ .user h1 {
+ 	display: flex;
+ 	flex-direction: row;
+ 	align-items: center;
+ 	margin-bottom: 0;
+ }
+ .badge {
+ 	margin-left: 1em;
+ 	padding: 0.35em 1em;
 
-	background: #F4F4F4;
-	color: #7765E3;
-	border: 1px solid #7765E3;
-	border-radius: 1em;
+ 	background: #F4F4F4;
+ 	color: #7765E3;
+ 	border: 1px solid #7765E3;
+ 	border-radius: 1em;
 
-	font-size: 1rem;
-}
+ 	font-size: 1rem;
+ }
 
 /*
  * == Blog index ==
  */
 
-.cards {
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
-	padding: 0 5%;
-}
-.card {
-	flex: 1;
-	display: flex;
-	flex-direction: column;
+ .cards {
+ 	display: flex;
+ 	flex-direction: row;
+ 	flex-wrap: wrap;
+ 	padding: 0 5%;
+ }
+ .card {
+ 	flex: 1;
+ 	display: flex;
+ 	flex-direction: column;
 
-	min-width: 17.5em;
-	min-height: 17.5em;
-	margin: 1em;
-	padding: 1em;
-	box-sizing: border-box;
+ 	min-width: 17.5em;
+ 	min-height: 17.5em;
+ 	margin: 1em;
+ 	padding: 1em;
+ 	box-sizing: border-box;
 
-	background: #E3E3E3;
+ 	background: #E3E3E3;
 
-	text-overflow: ellipsis;
-}
-.list .card {
-/* TODO */
-	background: 0;
-	margin: 2em 0;
-	padding: 0;
-	min-height: 0;
-}
+ 	text-overflow: ellipsis;
+ }
+ .list .card {
+ 	/* TODO */
+ 	background: 0;
+ 	margin: 2em 0;
+ 	padding: 0;
+ 	min-height: 0;
+ }
 
-/* ~ Card content ~ */
+ /* ~ Card content ~ */
 
-/* Title */
+ /* Title */
 
-.card h3 {
-	margin: 0.75em 0;
-	font-family: "Playfair Display", serif;
-	font-size: 1.75em;
-	font-weight: normal;
-}
-.card h3 a { transition: color 0.1s ease-in; color: #242424; }
-.card h3 a:hover { color: #7765E3; }
+ .card h3 {
+ 	margin: 0.75em 0;
+ 	font-family: "Playfair Display", serif;
+ 	font-size: 1.75em;
+ 	font-weight: normal;
+ }
+ .card h3 a { transition: color 0.1s ease-in; color: #242424; }
+ .card h3 a:hover { color: #7765E3; }
 
-/* Content */
+ /* Content */
 
-.card main {
-	flex: 1;
+ .card main {
+ 	flex: 1;
 
-	font-family: "Lora", serif;
-	font-size: 1em;
-	line-height: 1.25em;
-	text-align: left;
-	overflow: hidden;
-}
+ 	font-family: "Lora", serif;
+ 	font-size: 1em;
+ 	line-height: 1.25em;
+ 	text-align: left;
+ 	overflow: hidden;
+ }
 
-/* Presentation */
-.presentation > h2, .presentation > a {
-	text-align: center;
-}
+ /* Presentation */
+ .presentation > h2, .presentation > a {
+ 	text-align: center;
+ }
 
-.presentation > a {
-	font-size: 1.2em;
-	margin: 1em;
-}
+ .presentation > a {
+ 	font-size: 1.2em;
+ 	margin: 1em;
+ }
 
-/* Stats */
-.stats {
-	display: flex;
-	justify-content: space-around;
-	margin: 2em;
-}
+ /* Stats */
+ .stats {
+ 	display: flex;
+ 	justify-content: space-around;
+ 	margin: 2em;
+ }
 
-.stats > div {
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-    align-items: center;
-}
+ .stats > div {
+ 	display: flex;
+ 	flex-direction: column;
+ 	justify-content: center;
+ 	align-items: center;
+ }
 
-.stats em {
-	text-align: center;
-	font-weight: bold;
-}
+ .stats em {
+ 	text-align: center;
+ 	font-weight: bold;
+ }
 
 /* ================= *
  *   Small Screens   *
  * ================= */
 
-.mobile-label {
-	display: none;
-}
+ @media screen and (max-width: 900px) {
+ 	header {
+ 		flex-direction: column;
+ 	}
 
-@media screen and (max-width: 900px) {
-	header {
-		flex-direction: column;
-	}
+ 	header nav#menu {
+ 		display: inline-flex;
+ 	}
 
-	header nav#menu {
-		display: inline-flex;
-	}
+ 	header #content {
+ 		display: none;
+ 		text-align: center;
+ 	}
 
-	header #content {
-		display: none;
-		text-align: center;
-	}
+ 	@keyframes menuOpening {
+ 		from {
+ 			transform: scaleX(0);
+ 			transform-origin: left;
+ 			opacity: 0;
+ 		}
 
-	@keyframes menuOpening {
-		from {
-			transform: scaleX(0);
-			transform-origin: left;
-			opacity: 0;
-		}
+ 		to {
+ 			transform: scaleX(1);
+ 			transform-origin: left;
+ 			opacity: 1;
+ 		}
+ 	}
 
-		to {
-			transform: scaleX(1);
-			transform-origin: left;
-			opacity: 1;
-		}
-	}
+ 	header:focus-within #content {
+ 		position: fixed;
+ 		display: flex;
+ 		flex-direction: column;
+ 		justify-content: flex-start;
 
-	header:focus-within #content {
-		position: fixed;
-		display: flex;
-		flex-direction: column;
-		justify-content: flex-start;
+ 		top: 0;
+ 		left: 0;
+ 		width: 100%;
+ 		height: 100%;
+ 		box-sizing: border-box;
 
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		box-sizing: border-box;
+ 		animation: 0.2s menuOpening;
+ 	}
+ 	header:focus-within #content::before {
+ 		content: "";
+ 		position: absolute;
+ 		transform: skewX(-10deg);
+ 		top: 0;
+ 		left: -20%;
+ 		width: 100%;
+ 		height: 100%;
 
-		animation: 0.2s menuOpening;
-	}
-	header:focus-within #content::before {
-		content: "";
-		position: absolute;
-		transform: skewX(-10deg);
-		top: 0;
-		left: -20%;
-		width: 100%;
-		height: 100%;
+ 		z-index: -10;
 
-		z-index: -10;
+ 		background: #7765E3;
+ 	}
+ 	header:focus-within #content > nav {
+ 		flex-direction: column;
+ 		align-items: flex-start;
+ 	}
+ 	header:focus-within #content > nav a {
+ 		display: flex;
+ 		flex-direction: row;
+ 		align-items: center;
+ 		margin: 0;
+ 		padding: 1rem 1.5rem;
+ 		color: #F4F4F4;
+ 		font-size: 1.4em;
+ 		font-weight: 300;
+ 	}
+ 	header:focus-within #content > nav a > *:first-child { width: 3rem; }
+ 	header:focus-within #content > nav a > img:first-child { height: 3rem; }
+ 	header:focus-within #content > nav a > *:last-child { margin-left: 1rem; }
+ 	header:focus-within #content > nav a.title {
+ 		font-size: 1.8em;
+ 	}
+ 	header:focus-within #content > nav hr {
+ 		display: block;
+ 		margin: 0;
+ 		width: 100%;
+ 		border: solid #F4F4F4 0.1rem;
+ 	}
+ 	header:focus-within #content > nav a .mobile-label {
+ 		display: initial;
+ 	}
 
-		background: #7765E3;
-	}
-	header:focus-within #content > nav {
-		flex-direction: column;
-		align-items: flex-start;
-	}
-	header:focus-within #content > nav a {
-		display: flex;
-		flex-direction: row;
-		align-items: center;
-		margin: 0;
-		padding: 1rem 1.5rem;
-		color: #F4F4F4;
-		font-size: 1.4em;
-		font-weight: 300;
-	}
-	header:focus-within #content > nav a > *:first-child { width: 3rem; }
-	header:focus-within #content > nav a > img:first-child { height: 3rem; }
-	header:focus-within #content > nav a > *:last-child { margin-left: 1rem; }
-	header:focus-within #content > nav a.title {
-		font-size: 1.8em;
-	}
-	header:focus-within #content > nav hr {
-		display: block;
-		margin: 0;
-		width: 100%;
-		border: solid #F4F4F4 0.1rem;
-	}
+ 	body > main > * {
+ 		padding: 0 5%;
+ 	}
+ 	main .article-meta > * { margin: 0 5%; }
 
-	body > main > * {
-		padding: 0 5%;
-	}
-	main .article-meta > * { margin: 0 5%; }
+ 	main .article-meta > p {
+ 		margin: 2em 5%;
+ 		font-size: 0.9em;
+ 	}
+ 	main .article-meta .comments > * { margin-left: 5%; margin-right: 5%; }
 
-	main .article-meta > p {
-		margin: 2em 5%;
-		font-size: 0.9em;
-	}
-	main .article-meta .comments > * { margin-left: 5%; margin-right: 5%; }
+ 	.card {
+ 		min-width: 80%;
+ 		min-height: 80%;
+ 	}
+ }
 
-	.card {
-		min-width: 80%;
-		min-height: 80%;
-    }
+ /*== Pagination ==*/
+ .pagination {
+ 	display: flex;
+ 	justify-content: space-evenly;
+ }
 
-    .mobile-label {
-        display: initial;
-    }
-}
+ .pagination > * {
+ 	padding: 2em;
+ }
 
-/*== Pagination ==*/
-.pagination {
-	display: flex;
-	justify-content: space-evenly;
-}
+ /*== Flex boxes ==*/
+ .flex {
+ 	display: flex;
+ 	flex-direction: row;
+ 	align-items: center;
+ }
 
-.pagination > * {
-	padding: 2em;
-}
+ .flex .grow {
+ 	flex: 1;
+ }
 
-/*== Flex boxes ==*/
-.flex {
-	display: flex;
-    flex-direction: row;
-    align-items: center;
-}
+ .left-icon {
+ 	align-self: center;
+ 	padding: 1em;
+ 	background: #DADADA;
+ 	border-radius: 50px;
+ 	margin: 1em;
+ 	margin-right: 2em;
+ }
 
-.flex .grow {
-	flex: 1;
-}
+ /*== Footer ==*/
+ body > footer {
+ 	display: flex;
+ 	align-content: center;
+ 	justify-content: space-between;
+ 	background: #ECECEC;
+ 	padding: 0 20%;
+ 	margin-top: 5em;
+ }
 
-.left-icon {
-	align-self: center;
-	padding: 1em;
-	background: #DADADA;
-	border-radius: 50px;
-	margin: 1em;
-	margin-right: 2em;
-}
+ body > footer * {
+ 	margin: 5em 0;
+ }
 
-/*== Footer ==*/
-body > footer {
-	display: flex;
-	align-content: center;
-	justify-content: space-between;
-	background: #ECECEC;
-	padding: 0 20%;
-	margin-top: 5em;
-}
+ /** Medias **/
 
-body > footer * {
-	margin: 5em 0;
-}
+ figure {
+ 	text-align: center;
+ 	margin: 2em;
+ 	max-width: 100%;
+ 	width: auto;
+ 	height: auto;
+ }
 
-/** Medias **/
+ figure > * {
+ 	max-width: 100%;
+ }
 
-figure {
-    text-align: center;
-    margin: 2em;
-    max-width: 100%;
-    width: auto;
-    height: auto;
-}
+ figcaption {
+ 	padding: 1em;
+ }
 
-figure > * {
-    max-width: 100%;
-}
+ .preview {
+ 	display: block;
+ 	max-width: 100px;
+ 	max-height: 100px;
+ 	width: auto;
+ 	height: auto;
+ 	margin-right: 20px;
+ }
 
-figcaption {
-    padding: 1em;
-}
+ /** Avatars **/
 
-.preview {
-    display: block;
-    max-width: 100px;
-    max-height: 100px;
-    width: auto;
-    height: auto;
-    margin-right: 20px;
-}
+ .avatar {
+ 	border-radius: 100%;
+ }
 
-/** Avatars **/
+ .avatar.small {
+ 	width: 50px;
+ 	height: 50px;
+ }
 
-.avatar {
-    border-radius: 100%;
-}
+ .avatar.medium {
+ 	width: 100px;
+ 	height: 100px;
+ 	margin: 20px;
+ }
 
-.avatar.small {
-    width: 50px;
-    height: 50px;
-}
-
-.avatar.medium {
-    width: 100px;
-    height: 100px;
-    margin: 20px;
-}
-
-.avatar.padded {
-    margin-right: 1em;
-}
+ .avatar.padded {
+ 	margin-right: 1em;
+ }