* {
	font-family: "Times New Roman";
	background-color: white;
	color: black;
}
body {
	padding-bottom: 31vh;
	height: 100vh;
	width: 100vw;
}
a {
	color: gray;
}
a:hover {
	text-decoration: none;
}

p {
	max-width: 60ch;
}

.boxcontainer {
	display: flex;
	flex-direction: row;
	gap: 1em;
	width: 70vw;
}

.boxcontainer2 {
	display: flex;
	flex-direction: column;
	gap: 1em;
	flex-basis: fit-content;
	height: 70vh;
}

.mainbox {
	width: 55%;
	/*	height: calc(100vh - 20vh); */
	padding: 1em;
	border: 1px dashed grey;
}

.sidebox {
	/*	display: flex;
	flex-direction: column; */
	border: 1px dashed grey;
	padding: 1em;
	min-width: 40%;
	max-width: 40%;
	height: 100%;
}

#artwork img {
	cursor: zoom-in;
	max-width: 100%;
}

.center {
	display: flex;

	align-items: center;
	width: 100vw;
}

iframe.directory {
	border: 0px;
	max-width: 95%;
	scrollbar-width: 0;
	height: 80%;
}

@media screen and (max-width: 800px) {
	.boxcontainer {
		flex-direction: column;
		gap: 1em;
		width: 100vw;
	}
}

@media screen and (max-width: 1600px) {
	.boxcontainer {
		width: 100vw;
		height: 100vw;
	}
}