body {
  background-color: #fff;
  color: #000;
  font-family: 'Roboto', 'Georgia';
  text-align: center; }

a {
  color: rgba(0, 0, 0, 0.7); }
  a:focus, a:hover {
    color: rgba(0, 0, 0, 0.6); }

.state-red {
  color: #e56353; }

.state-green {
  color: #add680; }

.container {
  max-width: 770px;
  padding: 48px;
  border: 1px solid red;
  margin: auto; }

.graph-title {
  font-size: 28px;
  line-height: 32px;
  text-align: center;
  color: #57a0d7;
  margin-bottom: 64px;
  margin-top: 0;
  letter-spacing: -0.04em; }
  .graph-title b {
    font-weight: 900;
    font-size: 40px; }

.wrapper {
  padding: 0;
  max-width: 700px;
  color: #4f4f4f;
  margin-left: auto;
  margin-right: auto; }

.menu {
  flex-wrap: wrap; }
  @media only screen and (max-width: 700px) {
    .menu .menu-item {
      margin: 12px; } }

.pt-m {
  padding-top: 2rem; }

.mt-m {
  margin-top: 2rem; }

.mt-xl {
  margin-top: 4rem; }

.footnote {
  color: #c4c4c4;
  font-size: 13px;
  font-weight: normal; }
  .footnote small {
    display: block;
    padding: 12px; }
  .footnote a {
    color: #57a0d7 !important;
    text-decoration: none; }

.spacer-m {
  margin-top: 48px; }

.custom-line-chart .chart-labels-value {
  align-items: flex-end; }

.custom-line-chart .value {
  display: block !important;
  position: relative; }

.custom-line-chart .chart-labels-value .long_suffix {
  display: none;
  position: absolute;
  top: 110%;
  width: 100%;
  font-size: 1rem;
  font-weight: 200; }
  @media only screen and (max-width: 500px) {
    .custom-line-chart .chart-labels-value .long_suffix {
      font-size: 12px; } }

.custom-line-chart .chart-labels-value .short_suffix {
  font-size: .85em;
  font-weight: normal; }

.custom-line-chart .chart-labels-value .value:first-child .short_suffix,
.custom-line-chart .chart-labels-value .value:last-child .short_suffix {
  display: none; }

.custom-line-chart .chart-labels-value .value:first-child .long_suffix,
.custom-line-chart .chart-labels-value .value:last-child .long_suffix {
  display: block; }