/**
	Styles applied to all pages.
*/

/**
	Global styles
*/

html {
	overflow: auto;
}

body {
	position: absolute;
	top: 10px;
	left: 10px;
	bottom: 10px;
	right: 10px;
	padding: 5px;
	overflow-y: scroll;
	overflow-x: hidden;
	transition: all 0.3s ease-in-out;
	font-family: Roboto, "Helvetica Neue", sans-serif;
	color: rgb(34, 34, 38);
}

hr {
	border-width: 0;
	border-top: 1px solid rgb(34, 34, 38);
}

a {
	color: #90CAF9;
}

a:visited {
	color: rgb(34, 34, 38);
}

img.shade {
	max-width: 100%;
	-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
	margin-bottom: 1%;
}

/**
	Main layout styles
*/

.root-container {
	position: relative;
	width: 100%;
	max-width: 640px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

.content-divider.top {
	margin: 12px 0 32px 0;
}

.content-divider.mid {
	margin: 32px 0 32px 0;
}

.content-divider.bottom {
	margin: 32px 0 12px 0;
}

/**
	Post list styles
*/

.post-list-type {
	font-weight: bold;
}

.post-list-item:not(:last-child) {
	margin-bottom: 12px;
}

.post-list-date {
	font-weight: bold;
	min-width: 120px
}

.post-list-categories {
	font-size: small;
	justify-content: right;
}

.post-list-archives-link {
	font-size: small;
	margin: 24px 0 0 24px;
}

.post-list-pagination-container {
	font-size: small;
	margin: 24px 0 0 24px;
}

/**
	Post styles
*/

.post-heading {
	align-items: center;
}

.post-metadata {
	margin-left: 24px;
	font-size: small;
	line-height: 2;
}

.post-metadata-list {
	flex-wrap: wrap;
}

.post-metadata-list>a {
	margin-left: 12px;
}

/**
	Header styles
*/

.header-container {
	align-items: end;
}

.header-subtitle {
	margin-left: 10px;
}

/**
	Footer styles
*/

.footer-container {
	font-size: small;
	display: flex;
	align-items: center;
	align-content: center;
}

.hexo-generated {
	align-self: end;
}

.hexo-icon {
	margin-left: 3px;
	fill: #0e83cd;
}

.footer-icon {
	display: flex;
	align-items: center;
}

.footer-icon.right {
	margin-left: 10px;
}

/**
	Multi-purpose styles
*/

blockquote {
	padding-left: 20px;
	border-left: 3px solid gray;
}

.icon {
	text-decoration: none;
}

.heading {
	font-size: larger;
	margin: 0 0 24px 24px;
}

.spacer {
	flex: 1 1 auto;
}

.row {
	display: flex;
	flex-direction: row;
}

.column {
	display: flex;
	flex-direction: column;
}

.fade-up-in {
	animation: fadeUpIn 0.7s;
}

@keyframes fadeUpIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}