* {
	box-sizing: border-box;
}

body {
	background-image: url('https://sicksadlibrary.neocities.org/images/backgrounds/library_bg.jpg');
	background-attachment: fixed;
	background-size: cover;
	margin: 0;
	background-position: center;
	cursor: url("https://sicksadlibrary.neocities.org/images/75.png"), auto;
}

body a:hover, body a:focus {
  cursor: pointer;
}

#container {
	width: 75%;
	margin: auto;
	display: flex;
}

/* Fonts */
@font-face {
	font-family: 'Cordata PPC-400';
	src: url('https://sicksadlibrary.neocities.org/fonts/Cordata_PPC-400.ttf') format('truetype');
}

@font-face {
	font-family: 'Euro PC';
	src: url('https://sicksadlibrary.neocities.org/fonts/EuroPC_CGA-2y.ttf') format('truetype');
}

@font-face {
	font-family: 'MByte PC230 Mono';
	src: url('https://sicksadlibrary.neocities.org/fonts/MBytePC230_Mono.ttf') format('truetype');
}

/* Side Navbar */
.box {
	width: calc(25% - 10px);
	background-color: #819A88;
	height: fit-content;
	max-height: 80vh;
	margin-top: 50px;
	margin-left: 0;
	margin-bottom: 5px;
	overflow-y: scroll;
	scrollbar-color: #317957 #E1DCE0;
	display: relative;
	float: left;
	/*border*/
  	border: 16px solid transparent;
    padding: 10px;
    border-image: url('https://sicksadlibrary.neocities.org/images/borders/vines2.png') 16 round;
    overflow: auto;
}

/* Dotted Border Inner Box */

.dot_box {
	background-color: rgb(0, 0, 0%);
	border-left: 1px dashed #003E23;
	border-right: 1px dashed #003E23;
	width: 90%;
	margin: auto;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-top: 5px;
}

/* Main boxes */
.main_box {
	background-color: #819A88;
	width: 95%;
	height: fit-content;
	max-height: 70vh;
	margin-top: 20px;
	margin-bottom: 10px;
	margin: auto;
	overflow-y: scroll;
	border: 16px solid transparent;
    padding: 10px;
    border-image: url('https://sicksadlibrary.neocities.org/images/borders/vines2.png') 16 round;
}

/* Text */

p {
	font-family: "Cordata PPC-400";
	color: #00271A;
	font-size: 18px;
	text-align: left;
}

p2 {
	font-family: "Euro PC";
	font-size: 18px;
	text-decoration: underline;
	text-decoration-style: solid;
	text-align: center;
	color: #E1DCE0;
}

p3 {
	font-family: "Euro PC";
	font-size: 18px;
	color: #00271A;
}

h1 {
	font-family: "Euro PC";
	font-size: 50px;
	text-align: right;
	color: #E1DCE0;
	background-color: #317957;
}

h2 {
	font-family: "Euro PC";
	font-size: 34px;
	text-align: left;
	color: #E1DCE0;
	margin-top: 10px;
	margin-bottom: 10px;
}

h3 {
	font-family: "Euro PC";
	font-size: 18px;
	text-align: left;
	color: #E1DCE0;
}

dl, ul {
	font-family: "MByte PC230 Mono";
	font-size: 20px;
	color: #00271A;
	margin: 10px;
}

dl a, ul a, p a {
	font-family: "Cordata PPC-400";
	text-decoration: underline;
	text-decoration-style: solid;
	background-color: #317957;
	color: #E1DCE0;
	font-size: 18px;
}

dl a:hover, ul a:hover, p a:hover {
	background-color: #918D3E;
}

dd {
	border-left: 1px dashed #003E23;
	padding-left: 10px;
}

li {
	list-style-type: '❧ ';
}

/* Scroll Button */
.scroll_button {
				background-color: #317957;
				width: 90%;
				padding: 3px;
				margin: auto;
				margin-top: 8px;
				margin-bottom: 2px;
				text-align: center;
			}

.scroll_button:hover {
	background-color: #918D3E;
}

/* Buttons */

.button {
	margin-left: 10px;
	margin-top: 10px;
}

/* Footer */

footer {
	background-color: #317957;
	width: 100%;
	height: 40px;
	color: #E1DCE0;
	margin-top: 50px;
	position: fixed;
	font-family: "MByte PC230 Mono";
	font-size: 18px;
	padding: 10px;
	bottom: 0;
}

footer a {
	color: #E1DCE0;
}

.right {
	float: right;
}

.left {
	float: left;
}