html, body, body * { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

body { background-color: #ffffea; color: #000008; padding: 0; margin: 0; }
h1,h2,h3,h4,h5,h6 {text-transform: none;font-variant: small-caps;margin: 0; padding: 0;}
p { max-width: 50em; }
li { max-width: 40em; }

a:link { color: #810; }
a:visited { color: #810; }
a:active { color: #e21; }
a:hover { color: #333; opacity: 85%; }
a { text-decoration: none; border-color: white; font-weight: bold;}

header {
	color: #ffe;
	background-color: rgba(0,0,0,0.3);
	padding: 1em;
}
header h1 { text-align: center; width: 100%; }

section.cont h1 { font-size: 150%; }
section.cont h2 { font-size: 125%; }
section.cont h3 { font-size: 115%; }

nav { align: center; width: 100%; text-align: center;  display: flex; flex-direction: row; }
nav > a { background-color: rgba(0,0,0,0.25); flex: 1; display: block; margin: 0.1em; font-size: 1.5rem; padding: 0.5em; }
nav > a:hover { }

blockquote { background-color: rgba(0,0,0,0.05); width: auto; }
code { background-color: rgba(128,128,128,0.15); }

.subscribe-button img {
	height: 1em;
}

.blog-entry-list {
	list-style-type: none;
	padding: 1em;
}
.blog-entry-list li {
	margin: 1em 0 0.5em 1em;
	background-color: white;
	padding: 1em;
	display: inline-block;
	width: auto;
}

.cont {
	padding: 1em;
}

.icon-row  {
	list-style-type: none;
	padding: 1em;
	background-color: rgba(0,0,0,0.25);
}
.icon-row .icon img {
	width: 2em; height: 2em;
	padding: 0;
}
:target {
   background-color: #fff;
   border: 1px solid black;
   font-size: 110%;
   font-weight: bold;
   padding: 0.5em 0.25em;
}

@media screen and (max-width:768px) {
	.tc {
		display: block;
		width: 100%;
	}
	.tc .ph {
		width: 40%;
		margin: 0 0 0.5em 0;
	}
	.tc .iau {
		width: 100%;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	.subscribe-button {
		float: none;
		margin: 0 0 1.5em 0;
	}
}
