.container,
.header-nav {
  max-width: 575px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.error-container {
  max-width: 500px;
}

.row {
  display: flex;
  flex-wrap: wrap;
}

.column-full,
.column-half {
  width: 100%;
}

@media screen and (max-width: 550px) {
  .favorite-list {
    columns: 1;
  }

  .favorite-list > li {
    width: 100%;
  }
}

@media screen and (min-width: 550px) {
  .favorite-list > li {
    width: calc(95% / 2);
  }
}

@media screen and (min-width: 768px) {
  .container,
  .header-nav {
    max-width: 900px;
  }

  .column-full,
  .column-half {
    padding: 0 0.75rem;
  }

  .column-half {
    width: 50%;
  }

  .favorite-list > li {
    width: calc(95% / 3);
  }
}
