html{
	height: 100%;
}

body{
	background-color: #252525;
	margin: 0px;
	height: 100%;
	font-family: Raleway, sans-serif;
	color: #F0E7D5;
	padding-left: calc(100vw - 100%);
}

#header{
	--header-height: 200px;
	min-height: var(--header-height);
	font-size: 48pt;
	text-align: center;
	line-height: var(--header-height);
}

#header, h1, h2, h3, h4, h5{
	color: #E8E8E8;
}

a #header, h1, h2, h3, h4, h5{
	color: #FFEE99;
}

@media (max-height: 600px), (max-width: 800px) {
	#header{
		--header-height: 100px;
		font-size: 36pt;
	}
}

#nav{
	--nav-height: 32px;
	height: var(--nav-height);
	font-size: 16pt;
	text-align: center;
	line-height: var(--nav-height);
}
#nav a{
	text-decoration: none;
	border-left: 1px solid grey;
	padding-left: 5px;
}
#nav :first-child{
	border-left: none;
	padding-left: 0px;
}

#content{
	--content-width: 800px;
	--content-padding: 32px;
	--content-margin: 8px;
	max-width: var(--content-width);
	margin: auto;
}

img{
	max-width: 100%;
	margin: auto;
}

ul{
	list-style: none;
	padding: 0;
}

li{
	background-color: #2F2f2F;
	padding: var(--content-padding);
	margin: var(--content-margin);
	border-radius: 5px;
}

a{
	color: #FFCC00;
}

a:visited{
	color: #F0C000;
}

a.postLink{
	text-decoration-line: none;
}

.postTitle{
	margin-top: 0px;
	margin-bottom: 2px;
}
.postDate{
	font-size: 0.7em;
}