@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");

body {
  font-family: "Inter";
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Noto Serif", serif;
  margin: 0;
}

.main {
  position: relative;
  top: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 75%;
  margin: auto;
}

.headers {
  gap: 8px;
  display: flex;
  flex-flow: column;
  align-items: center;
  margin-bottom: 8px;
}

table,
th,
td {
  border: 1px solid;
  padding: 8px;
}

th {
  background-color: darkgray;
}

.done {
  background-color: rgb(183, 250, 183);
  color: rgb(3, 76, 3);
  font-weight: 800;
}

.doing {
  background-color: rgb(250, 224, 183);
  color: rgb(76, 41, 3);
  font-weight: 800;
}

.caution{
  background-color: rgb(255 243 204 / 48%);
    color: #ffa500;
}

.NA {
  color: lightgrey;
  text-align: center;
}