:root {
  --brown: rgb(68, 36, 36);
  --blueish: #4b8491;
  --grey: rgb(210, 210, 210);
}

body {
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  line-height: 1;
  background-color: var(--grey);
}

/*Container for title, description, and welcome message */
.jumbotron {
  text-align: center;
  background-color: var(--blueish);
  color: var(--brown);
  border-radius: 0;
  border-bottom: 10px solid var(--brown);
}

/* text under heading */
.lead{
  color: var(--grey);
}

/* current time */
#currentDay{
  color: var(--grey);
}

/* Each individual row */
.row {
  white-space: pre-wrap;
  height: 80px;
  background-color: #ffffff;
  color: #000000;
  border: 1px solid #000000;
}

/* Area that displays time */
.time-block{
  text-align: center;
  border-right: 1px dotted black;
  color: var(--grey);
}

/* Area that displays task */
.todo-section{
  background: transparent;
  border: none;
  resize: none;
  color: #000000;
  border-right: 1px dotted black;
  padding: 10px;
  display: flex;
}

/* Text box */
textarea{
  background-color: rgba(255, 250, 250, 0.644);
}

/* Save button */
.saveBtn {
  border-left: 1px solid black;
  background-color: rgba(255, 250, 250, 0.285);
  color: var(--grey);
}

/* add to hours that passed */
.past {
  background-color: var(--brown);
  color: var(--grey);
}

/* added to current time */
.present {
  background-color: var(--blueish);
  color: white;
}

/* added to times that haven't occurred yet */
.future {
  background-color: rgb(188, 106, 120);
  color: var(--grey);
}

.description{
  white-space: pre-wrap;
}