.top {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap; }
  @media only screen and (max-width: 500px) {
    .top {
      flex-wrap: wrap; } }

@media only screen and (max-width: 500px) {
  .years {
    margin-bottom: 3rem; } }

.year {
  display: inline-block;
  font-weight: 900;
  font-size: 27px;
  line-height: 32px;
  letter-spacing: 0.01em;
  color: #E6E9ED; }

.left,
.right {
  display: flex;
  align-items: flex-end;
  max-width: 210px; }

.chartdiv1,
.chartdiv2 {
  height: 200px;
  min-width: 200px; }

.subchart1,
.subchart2 {
  position: relative;
  left: -140px;
  height: 130px;
  min-width: 50%;
  margin-left: 1rem;
  margin-bottom: .5rem; }

.legenddiv {
  margin-top: 1rem; }

.chartdiv3 {
  height: 300px; }

.bottom h2 {
  color: #57a0d7;
  font-size: 1.75rem; }