.inspiration-destination {
  margin: $margin-normal 0;
  width: 100%;
  color: inherit;
  overflow: hidden;
  padding: $margin-half;

  .top {
    width: 100%;
    text-align: center;
    margin-bottom: $margin-normal;

    .pictogram {
      vertical-align: bottom;
    }
  }
}

.stacked-cards-overflow {
  overflow-y: hidden;
}

.stacked-cards {
  position: relative;

  .card {
    width: 100%;
  }

  * {
    user-select: none;
  }

  .no-transition {
    transition: none;
  }

  &.init {
    opacity: 0;
  }

  &--animatable {
    transition: all 400ms ease;
  }

  .stacked-cards-container > *,
  .stacked-cards-overlay {
    position: absolute;
    will-change: transform, opacity;
    top: 0;
  }

  .stacked-cards-overlay {
    width: 100%;
    background-color: rgba($color-white, .7);
    align-items: center;
    display: flex;
    justify-content: center;
    left: 0;
    opacity: 0;
    top: 0;
    height: 100%;
    pointer-events: none;

    .pictogram {
      width: 50%;
      height: 50%;
    }

    > div {
      width: 100%;
      height: 100%;
      align-items: center;
      display: flex;
      justify-content: center;
    }
  }

  &-origin-bottom {
    transform-origin: bottom;
  }

  &-origin-top {
    transform-origin: top;
  }

  &-bottom,
  &-top,
  &-none {
    background: $color-white;
    height: 100%;
  }

  .stacked-cards-container > :nth-child(1) {
    position: relative;
    display: block;
  }
}
