.parent{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(5, 1fr);
}

.header{
  grid-area: 1 / 1 / 2 / 6;
  border: 1px solid black;
  background-color: lightblue;
}

.sidebar{
  grid-area: 2 / 1 / 6 / 2;
  border: 1px solid black;
  background-color: lightgrey;
}

.about{
  grid-area: 2 / 2 / 6 / 6;
  border: 1px solid black;
  background-color: lightgreen;
}

#describeBox{
  border: 1px solid black;
  background: skyblue;
}

th, td {
  text-align: left;
  padding: 16px;
}

tr:nth-child(even) {
  background-color: #f2f2f2;
}

.chart-wrap {
  width: 650px;
  height: 600px;
  font-family: sans-serif;
}

.title {
  text-align: center;
}

.grid {
  width:100%;
  height:100%;
  display:flex;
  flex-direction:row;
  justify-content:center;
  border-bottom:2px solid #aaa;
  background:repeating-linear-gradient(0deg, transparent, transparent 19.5%,fadeout(#aaa, 30%) 20%);
}

.bar {
  background-color:#aaa;
  width:45px;
  height:var(--bar-value);
  align-self:flex-end;
  margin:0 auto;
  border-radius:3px 3px 0 0;
  position: relative;
}

.grid.horizontal {
  flex-direction: column;
  border-bottom: none;
  border-left: 2px solid #aaa;
  background: repeating-linear-gradient(90deg, transparent, transparent gradient(90deg, transparent, transparent 19.5%, fadeout(#aaa, 30%) 20%);
}