body {
  background-color: #fffacd;
}
#main {
  margin:0 auto;
  display:flex;
  flex-direction: column;
  width:98vw;
  max-width: 150vmin;
}
#left, #right {
  display:flex;
  justify-content:flex-start;
  align-items: center;
  flex-direction: column;
}
#top, #bottom {
  width:100%;
  display:flex;
  justify-content: space-around;
}
#canvasses {
  display:grid;
}
#canvas2, #canvas3 {
  grid-row-start: 1;
  grid-column-start: 1;
}
#canvas1, #canvas2, #canvas3 {
  border:1px solid;
  margin:2vmin;
}
.button {
  cursor: pointer;
  font-size: 3vmin;
  font-family: sans-serif;
  padding:3vmin 0;
  background-color: beige;
  border:.5vmin solid brown;
  border-radius: 50%;
  text-align: center;
  width:10vmin;
}
.wide {
  width:25vmin;
}
#next {
  visibility:hidden;
  background-color: lime;
}
#kount, #angle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width:8vmin;
  margin-top:-3vmin;
}
#kount {
  margin-left: 3vmin;
}
#kount img, #angle img {
  height:6vmin;
}
#a1,#a2,#a3,#a4,#a5,#a6,#a7,#a8,#kount img, #angle img {
  cursor:pointer;
}
#nk, #na {
  font-size:6.5vmin;
  color:blue;
}
#buttons1, #buttons2 {
  width:100%;
  display:flex;
  justify-content: space-around;
}
#buttons1 {
  margin:1vmin 0 .5vmin 0;
}
#buttons2 {
  margin:.5vmin 0 2vmin 0;
}
#count, #cycles {
  font-size:3vmin;
  font-style: italic;
  margin-top:-1vmin;
}
#bottom_right {
  display:flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  width:55vmin;
}
#head2 {
	display:flex;
  justify-content: space-around;
	align-items: center;
  width:100%;
  padding:1vmin 0;
  border:3px solid #eca;
  background-color: #fec;
}
#head2 img {
	width:6vmin;
}
#head2 #title img {
	width:auto;
	max-height:4vmin;
}
#title {
  font-size:2.2vmin;
  display:flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}
@media (orientation:portrait) {
}