body, input, button {
	width: auto;
	font-size: xx-large;
	background-color: black;
	color: white;
	font-family: "Courier New", Courier, monospace;
	scrollbar-color: rgba(255,255,255,40%) rgba(255,255,255,30%);
	scrollbar-width: thin;
}

body {
	margin: 0;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	width: 100vw;
}

.header {
	box-sizing: border-box;
	background: rgba(0,0,0,30%);
	/*max-width: 100%;*/
	overflow: none;
	align-items: center;
	display: flex;
	justify-content: space-between;
	height: 10vw;
}

.main, .archive_links {
	padding: 0px 30px 0px;
}

.main {
	flex-shrink: 1;
	min-width: 0px;
	max-width: 50em;
}

.archive_links {
	min-width: 50%;
	flex-shrink: 0;
	display: none;
	margin-bottom: 30px;
	flex-direction: column;
}

.archive_links a {
	display: block;
	padding: 30px;
	background: rgba(255,255,255,30%);
	color: white;
	text-decoration: none;
}

.archive_links a:hover {
	background: rgba(255,255,255,70%);
}

input, button {
	border: 2px solid white;
	padding: 0px 5px 0px;
	background: transparent;
	margin: 30px 0px 30px;
}

.content {
	flex: 1;
	display: flex;
	overflow-y: auto;
	position: absolute;
	top: 10vw;
	left: 0px;
	bottom: 0px;
	width: 100%;
	justify-content: center;
}

.scrollbox {
	padding: 30px 0px 30px;
	display: flex;
	flex-direction: column;
	min-height: min-content;
	/*max-width: 100%;*/
}

a {
	color: royalblue;
}

.sentences {
	color: black;
}

 #wordinput {
	color: black;
	background-color: white;
	display: flex;
	flex-wrap: wrap;
	width: inherit;
}

#sidebar_button {
	margin: 30px;
	border: none;
}


input, .send_button {
	border: none;
	font-size: 2em;
	margin: 10px;
}

.word_input_area {
	border: 2px solid white;
	display: inline-flex;
	margin: 30px 0px;
	width: 100%;
}

table {
	font-size: inherit;
}