.whatson-list {
  padding: 6em 10em;
  display: grid;
  grid-gap: 6em;

  &.whatson-single {
    padding-top: 10em;
  }

  @media all and (max-width: 768px) {
    padding: 4em var(--padding--side);
    grid-gap: 4em;

    &.whatson-single {
      padding-top: 6em;
    }
  }
}

.whatson-item {
  text-align: left;
  margin-bottom: 2em;
  .whatson-img {
    padding: 0;
    box-shadow: -0.5em -0.5em;
    border-radius: var(--border-radius);
    transition: var(--transition--ease) all 0.6s;
    width: 100%;
    display: inline-block;

    img {
      transform: scale(1.05);
      transition: var(--transition--ease) all 0.6s;
    }
  }
  .whatson-text {
    display: grid;
    grid-template-columns: 1fr 3fr;
    padding: 0;
    align-items: flex-start;

    h3 {
      margin-bottom: 0.4em;
    }
    .p-sml {
      max-width: 80%;
      @media all and (max-width: 768px) {
        max-width: 100%;
      }
    }

    @media all and (max-width: 768px) {
      grid-template-columns: 1fr;
      grid-gap: 1em;
    }
  }

  .allstores {
    margin-top: 1em;
  }

  &:hover {
    .whatson-img {
      box-shadow: 0 0;
    }
    img {
      transform: scale(1);
    }
  }

  @media all and (max-width: 768px) {
    margin-bottom: 0.5em;
  }
}
.location-list-wrapper {
  padding: 3em 0;

  @media all and (max-width: 768px) {
    padding: 1em 0;
  }
}
