.hobbies {
  @extend %main-content;
  padding: 70px 80px;
}

.hobbies__text {
  @extend %main-text;
}

.hobbies__title {
  margin: 0;
}

.hobbies__table {
  display: table;
  margin: 0 auto 30px;
}

.table__row {
  display: table-row;
}

.table__cell {
  display: table-cell;
  border: 1px solid $white;
  padding: 50px;
  font: {
    size: 1.5rem;
    weight: bold;
  }
  cursor: pointer;
  text-align: center;
  transition: 1s border;

  &:hover {
    color: $yellow;
    border: 1px solid $yellow;
  }
}

.hobbies {
  @extend %main-content;
  padding: 65px;
}

.hobbies__text {
  @extend %main-text;
}

.hobbies__title {
  margin: 0;
}

.hobbies__table {
  display: table;
  margin: 0 auto 30px;
}

.table__row {
  display: table-row;
}

.table__cell {
  display: table-cell;
  border: 1px solid $white;
  padding: 50px 40px;
  font: {
    size: 1.5rem;
    weight: bold;
  }
  cursor: pointer;
  text-align: center;
  transition: 1s border;

  &:hover {
    color: $yellow;
    border: 1px solid $yellow;
  }
}

.js-chosen {
  background-color: $orange;
}

Add background color when you click on hobby
Add background color when you click on hobby

related #9
