.goals {
  padding-bottom: 6em; }
  .goals h2 {
    margin-left: 25%; }
  .goals > div {
    max-width: 50%;
    margin-left: calc(25% + (4 * var(--step-5))); }
  .goals mark {
    background-color: transparent;
    font-size: calc(var(--step-8) * 1.5);
    position: relative;
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    margin-left: 33.3%;
    margin-top: 0.5em;
    margin-bottom: 0;
    display: block; }
  .goals .goal {
    color: #C9C9C9;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1; }
  @media screen and (max-width: 1024px) {
    .goals h2 {
      margin-left: calc(25% - 4em); }
    .goals > div {
      margin-left: auto;
      margin-right: auto; } }
  @media screen and (max-width: 768px) {
    .goals mark {
      max-width: -webkit-max-content;
      max-width: -moz-max-content;
      max-width: max-content;
      margin-left: auto;
      margin-right: auto; } }
  @media screen and (max-width: 600px) {
    .goals h2 {
      margin-left: 0;
      padding: 0 1rem; }
    .goals > div {
      max-width: 100%;
      padding: 0 1em; } }
  @media screen and (max-width: 375px) {
    .goals mark {
      font-size: var(--step-7); } }