.block {
  /* width: 1em; */
  /* height: 1em; */
  width: 1ch;
  height: 1ch;
  background-color: #00ffff;

  border-radius: 50%;
}

.block:hover {
  background-color: rgb(208, 255, 0);
}

.block-target {
  width: 1ch;
  height: 1ch;
  background-color: #ff0000;
  border-radius: 2px;
}

.block-target:hover {
  background-color: bisque;
}

.block-clicked {
  background-color: steelblue;
}

.header-label{
  /* width: 3em; */
  text-align: center;
}

.header-content{
  width: 3em;
  text-align: start;
}

button{
  /* height: 3em; */
  width: 5em;
  margin: 0 .5em 0 .5em;
}

body {
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  /* font-family: 'Courier New', Courier, monospace; */
}

main {
  min-height: 88vh;
}

.flex-direction-column {
  flex-direction: column;
}

.content {
  align-self: center;
  width: max-content;

  display: grid;
  grid-template-columns: repeat(40, 1fr);
  grid-gap: 1px;
  align-items: center;

  /* background-color: rgb(0, 0, 0); */
  /* border: 1px solid #000 ; */
}

.header {
  /* margin-top: 100px; */
  /* text-align: center; */
  display: flex;
  /* flex-direction: row;
  align-items: center; */
  justify-content: center;
}

.header-box {
  display: flex;
  align-items: flex-end;
}