style.css

#main {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#form {
  padding: 10px;
}
#command {
  height: 25px;
  width: 150px;
}
#submit {
  width: 50px;
  height: 25px;
}
#board {
  display: flex;
  flex-direction: row;
  width: 100vw;
  align-items: flex-start;
  justify-content: space-around;
}
.add {
  text-align: center;
  width: 85%;
  margin: 5px;
  padding: 10px;
  color: #54a0ff;
  border: #54a0ff dashed 2px;
}
.col {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  padding: 10px;
}
.subboard {
  margin-top: 10px;
  display: flex;
  min-width: 30vw;
  height: 100vw;
  flex-direction: column;
  align-self: stretch;
  align-items: center;
  background: #fdfdfd;
  border: solid 1px #dca3a3;
}
.label {
  text-align: center;
  width: 90%;
  margin: 5px;
  padding: 10px;
  color: #ffffff;
  border-radius: 3px;
  /* border: #54a0ff solid 2px; */
}
.label-todo {
  background: #22a6b3;
}
.label-doing {
  background: #f6e58d;
}
.label-done {
  background: #6ab04c;
}

.task {
  display: flex;
  align-items: flex-start;
  height: 30px;
  width: 100%;
}

#remove {
  display: flex;
  align-self: center;
  width: 70%;
  text-align: center;
  justify-content: center;
  background: #dca3a3;
  padding: 25px;
  color: #ffffff;
  border-radius: 10px;
}