body,
h1,
ul,
li,
p,
button {
  margin: 0px;
  padding: 0px;
}

ul {
  list-style: none;
}

body {
  display: grid;
  justify-content: center;
  padding-top: 100px;
  background-color: rgb(253, 246, 238);
}

.title {
  text-align: center;
  border-bottom: 4px solid rgb(134, 81, 62);
  border-radius: 4px;
  font-size: 4em;
  color: rgb(124, 60, 7);
}

section {
  border: 4px solid rgb(134, 81, 62);
  border-radius: 6px;
  width: 40em;
  background-color: rgb(240, 226, 209);
  padding-top: 50px;
}

.main {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  padding: 50px;
  gap: 5px;
}

.main-btn {
  display: flex;
  grid-column: 3 / 4;
  gap: 5px;
}

input {
  grid-column: 1/3;
  background-color: rgb(186, 247, 252);
  border: 2px solid rgb(201, 201, 201);
  border-radius: 4px;
  padding: 8px;
  text-justify: center;
}

button,
.main-btn input {
  padding: 10px;
  width: 100px;
  background-color: rgb(243, 200, 148);
  border: 2px solid rgb(134, 81, 62);
}

#item-list {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  list-style: circle;
  padding: 25px;
  border-bottom: 2px solid rgb(134, 81, 62);
  color: rgb(87, 49, 0);
  background-color: rgb(245, 245, 178);
  font-size: 2em;
}

.remove {
  display: inline-block;
  grid-column: 2;
  grid-row: 1;
}

.done {
  display: inline-block;
  grid-column: 3;
  grid-row: 1;
}
