#side-menu {
	z-index: 9999;
	position: fixed;
	width: 380px;
	max-width: 100%;
	font-size: 0.9em;
	height: 100vh;
	padding: 20px;
	overflow: auto;
	background-color: #111;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: transform 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000), background-color 0.25s, height 0s 0s;
}
#side-menu > * {
	transition: opacity 0.2s linear;
}
#side-menu.expanded {
	border-bottom: 50px solid #111; /* add bottom spacing to make up for mobile tab bar */
}
#side-menu.collapsed {
	transform: translateX(calc(-100% + 80px));
	background-color: transparent;
	transition: transform 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000), background-color 0.25s, height 0s 0.3s;
}
#side-menu.hidden {
	transform: translateX(-100%);
}
#side-menu + .chapter-container .explode-wrapper .wp-caption-text,
#side-menu + div {
	transition: margin 0.25s;
}

#side-menu.collapsed > * {
	opacity: 0;
}
#side-menu.collapsed > footer,
#side-menu.collapsed > .burger-button {
	opacity: 1 !important;
}
#side-menu a:hover {
	color: #25a37d !important;
}
#side-menu > hr, #side-menu > footer p {
	margin: 0;
}
#side-menu header h1 {
	font-size: 1.8em;
	max-width: 50%;
}
#side-menu header h2 {
	font-size: 1.5em;
	text-align: left;
	color: #4A4A4A;
}
#side-menu h1 > a {
	color: white;
}
#side-menu > hr {
	margin-bottom: 1.5em;
	max-width: 80px;
	border-width: 1px;
}
#side-menu > nav {
	margin-bottom: 2em;
}
#side-menu > nav a {
	color: white;
	font-size: 0.85em;
}
#side-menu > p {
	font-size: 1.1em;
	color: #80807e;
}
#side-menu footer {
	text-align: right;
}
#side-menu .burger-button {
	position: absolute;
	top: 20px;
	right: 10px;
	padding-left: 15px;
	padding-right: 15px;
	width: 60px;
	height: 50px;
	background-color: #111 !important;
	transform: scale(0.6, 0.7);
	transition: transform 0.2s;
}
@media (max-width: 539px) {
	#side-menu.collapsed {
		height: 70px !important;
	}
}
@media (min-width: 540px) {
	#side-menu {
		font-size: 1em;
		padding: 40px;
		border-bottom: 0px none transparent !important;
	}
	#side-menu.collapsed {
		background-color: #111;
	}
	#side-menu.collapsed + .chapter-container .chapter-nav-buttons a.prev,
	#side-menu.collapsed + div {
		margin-left: 80px !important;
	}
	#side-menu.expanded + .chapter-container .chapter-nav-buttons a.prev,
	#side-menu.expanded + div {
		margin-left: 380px !important;
		margin-right: auto !important;
	}
	#side-menu.collapsed + .chapter-container .chapter-nav-buttons a.prev.title {
		right: calc(100% - 169px);
	}
	#side-menu.expanded + .chapter-container .chapter-nav-buttons a.prev.title {
		right: calc(100% - 469px);
	}
	#side-menu + .chapter-container .explode-wrapper .wp-caption-text {
		margin-right: 0;
		transform: translateX(2.7em);
	}
	#side-menu.collapsed + .chapter-container .explode-wrapper .wp-caption-text {
		margin-left: calc(50% - ((100vw - 80px) / 2));
		width: calc(100vw - 80px - 3em);
	}
	#side-menu.expanded + .chapter-container .explode-wrapper .wp-caption-text {
		margin-left: calc(50% - ((100vw - 380px) / 2));
		width: calc(100vw - 380px - 3em);
	}
	.blog #side-menu + .wrap {
		padding-left: 26px;
	}
}
#side-menu.collapsed .burger-button {
	transform: scale(1);
}
#side-menu.collapsed .burger-button:hover .burger,
#side-menu:not(.collapsed) .burger {
	box-shadow: 0 9px 0 1px gray, 0 17px 0 1px gray, 0 25px 0 1px gray
}
#side-menu.collapsed .burger,
#side-menu:not(.collapsed) .burger-button:hover .burger {
	box-shadow: 0 9px 0 1px white, 0 17px 0 1px white, 0 25px 0 1px white
}

#side-menu + .tome-cover-wrap #tome-cover {
	visibility: hidden;
}

#side-menu .cover-link {
	margin: 0;
	background-image: none;
	border: 2px solid gray;
	padding: 8px;
	border-radius: 50%;
	line-height: 20px;
	position: static;
	display: inline-block;
}
#side-menu.collapsed .cover-link {
	position: absolute;
	bottom: 20px;
	right: 20px;
	left: auto;
}
body:not(.home) #side-menu .cover-link {
	display: none;
}
.cover-link > svg {
	pointer-events: none;
}
.cover-link .prev {
	display: none;
}
.cover-link .next {
	stroke: gray;
	fill: none;
}
#side-menu .cover-link:hover {
	border-color: white;
}
#side-menu .cover-link:hover .next {
	stroke: white;
}

#side-menu #menu-main > li {
	position: relative;
}
#side-menu .accordion--content:not(.accordion--init) {
	width: calc(100% - 1.25em); /* remove margin left from absolute width */
}