html, body, h1, h2, p, ul, li {
	font-family: "Open Sans", Sans-Serif;
	font-size: 16px;

	list-style: none;
	margin: 0;
	padding: 0;
}

h1, h2 {
	font-family: "Merriweather", Sans-Serif;
}

h2 {
	color: rgb(89, 125, 206); /* blue */
	font-size: 200%;
	line-height: 1.25em;
}

a {
	color: rgb(89, 125, 206); /* blue */
}

a:hover {
	color: rgb(48, 52, 109); /* dark blue */
}

body {
	background: rgb(109, 194, 202); /* teal */
	background-image: url(./images/clouds.png);
	background-repeat: repeat-x;
	color: rgb(20, 12, 28); /* black */
	text-align: center;
}

#header {
	margin: 2em auto;
	width: 1000px;
}

#header p a {
	color: rgb(48, 52, 109); /* dark blue */
}

#header p a:hover {
	color: rgb(20, 12, 28); /* black */
}

h1 {
	margin-bottom: 1em;

	background: url(./images/mimic.png) right center no-repeat;
	height: 200px;
}

h1 a {
	background: url(./images/title.png);
	display: block;
	text-indent: -9999em;
	width: 750px;
	height: 200px;
}

#contents {
	margin: auto;
	width: 1000px;
}

.date {
	color: rgb(78, 74, 78); /* gray */
	font-size: 75%;
}

.subtitle {
	color: rgb(89, 125, 206); /* blue */
	margin-bottom: 1em;
}

h2.post {
	color: rgb(48, 52, 109); /* dark blue */
	font-size: 400%;
}

div.post {
	margin-bottom: 2em;
	text-align: left;
	min-height: 200px;

	background: rgb(222, 238, 214); /* white */
	border-radius: 4em;
	min-height: 216px;
	padding: 2em;
}

div.post img {
	border-radius: 4em;
	border: 10px solid rgb(109, 194, 202); /* teal */
	float: left;
	margin-right: 2em;
	margin-bottom: 2em;
}

div.post img:hover {
	border: 10px solid rgb(89, 125, 206); /* blue */
}

div.post .date {
	margin-bottom: 1em;
}

.post-contents {
	margin-bottom: 1em;
}

.tags {
	margin-bottom: 1em;
}

.tags li {
	display: inline;
}

.urls-header {
	margin-bottom: 1em;
}

.urls-header strong {
	color: rgb(48, 52, 109); /* dark blue */
}

.urls {
}

#nav {
	clear: both;
	margin-bottom: 1em;
	min-height: 1em;
}

#nav .prev {
	float: left;
}

#nav .next {
	float: right;
}

#footer {
	height: 300px;
}

#island {
	background: url(./images/island.png);
	margin: auto;
	position: relative;
	width: 700px;
	height: 400px;
	z-index: 2;
}

#water {
	background: rgb(89, 125, 206); /* blue */
	color: rgb(48, 52, 109); /* dark blue */
	padding-top: 160px;
	padding-bottom: 2em;
	position: relative;
	top: -146px;
	z-index: 1;
}

#water a {
	color: rgb(48, 52, 109); /* dark blue */
}

#water a:hover {
	color: rgb(109, 194, 202); /* teal */
}
