*{
	box-sizing: border-box;
	margin: 0px;
	padding:0px;
	font-family: "Lato", sans-serif;
}

.container {
	display:flex;
	flex-direction: row;
	padding:10px;
	background: black;
	height:100%;
}

#canvas{
	width:100%;
	height:100%;
}

.sidenav {
	flex:1;
	display: flex;
	flex-direction: column;
	height:auto;
	padding: 20px;
	gap: 10px;
	border :1px solid white;
	border-radius: 5px;
	margin:0px 10px 0px 10px;
}


.main {
	flex:5;
	display:flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	height:100%;
	border :1px solid white;
	border-radius: 5px;
	margin:0px 10px 0px 10px;
	overflow-x: scroll;
}



label {
	text-decoration: none;
	font-size: 25px;
	color: #818181;
}


button {
	background-color: #4caf50; /* Green */
	border: none;
	color: white;
	padding: 15px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
}

@media screen and (max-width: 800px) {
	.container{
		flex-direction: column;
	}
	.sidenav,.main{
		margin:0px 10px 10px 10px;
	}
	
}

.disable-scrollbars::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* Chrome/Safari/Webkit */
}

.disable-scrollbars {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none;  /* IE 10+ */
}