.main {
	width: 1024;
	text-align: center;
	margin-inline: auto;
	border: 1px solid black;
	border-radius: 25px;
	padding: 20px;
	display: grid;
	grid-template-columns: 3fr 1fr;
	margin-inline: auto;
}

.menu {
	border: 1px solid black;
	height: 480px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

.menuitem {
	width: 90px;
	height: 90px;
	text-align: center;
	font-size: 10pt;
	border: 1px solid black;
}

.button {
	width: 180;
	height: 20px;
	text-align: center;
	font-size: 10pt;
	border: 1px solid black;
	grid-column-end: span 2;
}

#canvas {
	background-color: white;
	border: 1px solid black;
}

#Black {
    background-color: #000000;
}

#Blue {
    background-color: #0000AA;
}

#Green {
    background-color: #00AA00;
}

#Cyan {
    background-color: #00AAAA;
}

#Red {
    background-color: #AA0000;
}

#Magenta {
    background-color: #AA00AA;
}

#Brown {
    background-color: #AA5500;
}

#LightGray {
    background-color: #AAAAAA;
}

#DarkGray {
    background-color: #555555;
}

#BrightBlue {
    background-color: #5555FF;
}

#BrightGreen {
    background-color: #55FF55;
}

#BrightCyan {
    background-color: #55FFFF;
}

#BrightRed {
    background-color: #FF5555;
}

#BrightMagenta {
    background-color: #FF55FF;
}

#Yellow {
    background-color: #FFFF55;
}

#White {
    background-color: #FFFFFF;
}