html, body {
  background-color: #f8f8f8;
  color: #18191B;
}

.hero:before {
  display: block;
  background-color: #c00;
  mix-blend-mode: multiply;
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateX(50%) skew(-40deg);
}

.text-red {
  color: #c00;
}

.stat-container {
  border: 1px solid #efefef;
  padding: 1.5rem;
  border-radius: 0.75rem;
}

.section-header:after {
  display: block;
  content: '';
  width: 4rem;
  background-color: #c00;
  height: 4px;
  margin: 1rem auto;
}

.game-panel {
  border: 1px solid #efefef;
  background-color: #c00;
  padding: 1.5rem 0;
  transform: skew(-45deg);
  margin: 2rem 0;
}

#game-panel-container:nth-child(2) .game-panel {
  margin-top: 0;
}

#game-panel-container .game-panel:last-child {
  margin-bottom: 0;
}

/* #game-panel-container:nth-child(2) .game-panel {
  margin-top: 0;
}

#game-panel-container:last-child .game-panel {
  margin-bottom: 0;
} */

.game-panel div {
  transform: skew(45deg);
}

footer {
  background-color: #18191B;
}