html,
body {
	display: flex;
	flex-direction: column;
}

html {
	min-height: 100%;
}

body {
	flex: 1 1 auto;
}

/**
 * Text
 * -----------------------------------------------------------------------------
 */

p,
a,
h1,
h2,
li {
	font-family:
		// Fancy stuff
		"IBM Plex Sans",
		"Fira Sans",

		// Apple
		-apple-system,
		BlinkMacSystemFont,
		"San Francisco",
		"Apple Color Emoji",

		// Android
		"Roboto Regular",
		Roboto,
		"Droid Sans",
		"Noto Sans Symbols",

		// Windows
		"Segoe UI",
		"Segoe UI Emoji",
		"Segoe UI Symbol",

		// Linux
		Oxygen-Sans,
		Ubuntu,
		Cantarell,
		Arimo,
		"DejaVu Sans",

		// Fallbacks
		"Helvetica Neue",
		Helvetica,
		ui-sans-serif,
		sans-serif;

	cursor: default;
	user-select: none;
}

a {
	text-decoration: none;
}

sup {
	vertical-align: 0.25rem;
}

/**
 * Transitions
 * -----------------------------------------------------------------------------
 */

div {
	transition: border-color 200ms, background-color 200ms;
}

p,
a,
.svg-inline--fa {
	transition: color 200ms;
}

.fade-enter,
.fade-leave-to {
	opacity: 0;
}

.fade-leave,
.fade-enter-to {
	opacity: 1;
}

.fade-enter-active { transition: opacity 200ms; }
.fade-leave-active { transition: opacity 100ms; }
