/*
==========================
global styles
==========================
*/

:root {
	--piano_width: 90vw;
	--piano_color: rgb(41, 45, 52);
	--num_of_keyContainers: 0;
	--button-off: #616161ba;
	--blue-button-lit: #00b3ffaa;
	--green-button-lit: #20d54aaa;
	--white-button-lit: #f4f4f4e0;
	--red-button-lit: #d82828c8;
	--control-text: #d8d8d8;
}

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: Arial, Helvetica, sans-serif;
}

body {
	width: 100%;
	/* height: 100vh; */
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 50px auto 50px auto;
}