body {
position: absolute;
top: 0;
left: 0;
border: 0;
overflow: hidden; /*  Disable scrollbars */
display: block;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0;
}
canvas {
resize: both;
overflow: auto;
width:80%;
border: 2px solid black;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
image-rendering: crisp-edges;
display: block;
}
 @media screen and (orientation:landscape) {
	canvas {
	resize: both;
	overflow: auto;
	width:75%;
	border: 2px solid black;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	image-rendering: crisp-edges;
	display: block;
	}
 }
 
 @media screen and (orientation:portrait) {
	canvas {
	resize: both;
	overflow: auto;
	width: 90%;
	border: 2px solid black;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	image-rendering: crisp-edges;
	display: block;
	}
 }

.dropdown {
position: relative;
display: inline-block;
}
.vertical-buttons {
vertical-align:top;
align-items: center;
}
.canvas-with-buttons{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-evenly;
width: 90%
}

.mid-buttons{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-evenly;
}

.play-pause-buttons{
	width: 20px;
	height: 20px;
	vertical-align: top;
	text-align: center;
	padding: 0px;
}

.mid-controls{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

.button {
display: none;
}
@media only screen and (max-height: 812px) {
.button {
  text-align: center;
  padding: 0px;
  width: 35px;
  height: 35px;
  display: block;
  vertical-align:top;
  display: flex;
  justify-content: center;
  align-items: center;
  margin:auto;
  touch-action: manipulation;
  display:block;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

}
