body {
  font-family: sans-serif;
  font-size: 1.5em;
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
}

.main {
  height: 100vh;
  width: 100vh;
  min-width: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.frame {
  height: 96%;
  width: 96%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.rack {
  height: 73%;
  width: 96%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: saddlebrown;
}

.poem {
  color: white;
  height: 23%;
  width: 96%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.line {
  height: 15%;
  display: flex;
  flex-direction: row;
  margin: 1%;
}

.rowFrame {
  height: 32%;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.row {
  height: 90%;
  width: 94%;
  background-color: chocolate;
  display: flex;
  flex-direction: row;
}

.space {
  height: 100%;
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.arriving {
  transition: color 1.5s ease-in;
  color: saddlebrown;
}

.jar {
  height: 90%;
  width: 60%;
  border-radius: 1vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.lid {
  min-height: 10%;
  width: 100%;
  background-color: black;
  margin: 0 0 10% 0;
  border-radius: 0.5vh 0.5vh 0 0;
}

.label {
  min-height: 30%;
  width: 100%;
  background-color: white;
  font-size: 70%;
}

.content {
  height: 30%;
  width: 100%;
  border-radius: 0 0 1vh 1vh;
}
