﻿@charset 'UTF-8';

/* For unicode in vim, set the encoding and write a byte-order mark:
 * :set fileencoding=utf8
 * :set bomb
 */
@import url('https://fonts.googleapis.com/css?family=Voces');
@import url('https://fonts.googleapis.com/css?family=Brawler');

/* Other fonts good with Voces: Faustina, Rasa */

body {
	font-family: 'Voces', sans-serif;
	margin: 0;
}

header {
	position: relative;
	left: -.5rem;
	max-width: 34rem;
	margin: 1rem auto;
}

header img {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	height: 10rem;
}

header h1 {
	box-sizing: border-box;
	text-align: right;
	width: 100%;
	padding-top: 4rem;
	padding-left: 11rem;
	padding-right: 1.5rem;
	margin: 0;
}

header .nav {
	display: flex;
	height: 3rem;
}

header .nav .spacer {
	width: 5rem;
}

header .nav ul {
	border: red 2px solid;
	display: block;
	flex-grow: 1;
	list-style-type: none;
	padding: .4em 1.5em;
	margin: 0;
	height: 3rem;
	background-color: rgb(24,33,42);
	border-radius: 2rem;
	border: .4rem solid rgb(28, 118, 178);
	padding: .4rem 2rem 0 0;
	box-sizing: border-box;
	text-align: right;
}

header .nav ul li {
	display: inline-block;
	margin: 0;
	padding: 0;
	color: rgb(213,230,240);
}

header .nav ul li + li:before {
	content: '•';
	margin: 0 1em;
}

header .nav ul li a {
	font-weight: bold;
}

a {
	color: inherit;
	text-decoration: inherit;
}

body header h2 {
	margin: 1rem auto;
	text-align: center;
}

main {
	position: relative;
	max-width: 32em;
	margin: 1rem auto;
}

article h1 {
	margin: 0;
	text-align: left;
	font-size: 2rem;
	font-family: 'Voces';
}

body.post article h3.date {
	text-align: left;
	margin: 0;
}

article {
	margin: 2rem 0 2rem;
	font-family: 'Brawler';
	font-size: 100%;
}

article h3 {
	position: relative;
	width: 100%;
	margin: 1em 0 .3em 0;
	font-family: 'Voces', sans-serif;
	font-size: 1.6rem;
}

article span.date {
	display: block;
	height: 2.16rem;
	padding-top: .65rem;
	width: 6em;
	float: right;
	font-size: .85rem;
	color: #555;
}

article h3.date {
	text-align: center;
	color: #555;
	margin: 0 0 1em 0;
	font-size: 120%;
}

article p {
	margin: .5em 0 1em 0;
	color: #222;
}

article a {
	color: rgb(28, 118, 178);
}
