---
---

// Center iframes and images within posts
iframe,
img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}

// Image captions
img + em {
	display: block;
	text-align: center;
}

---
---

/* Variables */

// Fonts

$sans-serif: ui-sans-serif, sans-serif;
$monospace: ui-monospace, monospace;
$serif: ui-serif, serif;

// Colors

$link-color: #0366d6;
$body-text-color: #222;

// For iPhone safe areas
$safe-area:
	env(safe-area-inset-top),
	env(safe-area-inset-right),
	env(safe-area-inset-bottom),
	env(safe-area-inset-left);

/* Images */

// Center iframes and images within posts
iframe,
img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}

// Image captions
img + em {
	display: block;
	text-align: center;
}


// Base Styling
html {
	color: $body-text-color;
	font-family: $sans-serif;
	font-size: 1em;
	line-height: 1.61803399rem; // The "Golden Ratio"
	background-color: #fff;
	height: 100%;
}

code,
pre {
	font-family: $monospace;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: $serif;
}

/* Links */

a {
	&:any-link {
		color: $link-color;
		text-decoration: none;
	}

	&:hover {
		border-bottom: 1px solid $link-color;
	}
}

Tweak some styling of fonts and colors
Tweak some styling of fonts and colors
