body {
	display: flex;
    justify-content: center;
    align-items: center;
	width: 100%;
	height: 100vh;
	margin: 0;
	background-color: black;
}

#mainframe {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 1000px;
	height: 1000px;
	background-color: red;
}

#topframe {
	height: 25%;
	width: 100%;
	background-color: green;
}

#botframe {
	height: 75%;
	width: 100%;
	background-color: blue;
}

#titles {
	display: flex;
	flex-direction: row;
	gap: 10px;
	justify-content: space-evenly;
	align-items: center;
	height: 100px;
	width: 100%;
	background-color: yellow;
}

#titles p {
	font-weight: 800;
	font-size: 20px;
	width: 120px;
	text-align: center;
}

#boxes {
	display: flex;
	flex-direction: row;
	gap: 10px;
	justify-content: space-evenly;
	align-items: center;
	height: 120px;
	width: 100%;
}

.box {
	height: 120px;
	width: 120px;
	background-color: orange;
}