body {
  padding-bottom: 5%;
  font-family: 'Lexend Deca', sans-serif;
}

icon {
  display:inline-block;
}

li {
  margin: 10px 0;
}

/* mobile default (below min-width) */
.row {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0;
}
.row .column {
  display: block;
  flex: 1 1 auto;
  width: 90%;
}

/* 20rem trigger */
@media (min-width: 20.0rem) {
  .row.break-20 {
    flex-direction: row;
    align-items: flex-start;
    margin: 0 -.5rem;
    width: calc(100% + 1rem);
  }

  .row.break-20 .column {
    width: 100%;
    margin-bottom: inherit;
    padding: 0 .5rem;
  }
}

/* 32rem trigger */
@media (min-width: 32.0rem) {
  .row.break-32 {
    flex-direction: row;
    align-items: flex-start;
    margin: 0 -.5rem;
    width: calc(100% + 1rem);
  }
  .row.break-32 .column {
    width: 100%;
    margin-bottom: inherit;
    padding: 0 .5rem;
  }
}