.step-actions {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
          flex-direction: column-reverse;
  -webkit-box-align: center;
          align-items: center;
  margin: auto 0 4.7rem;
  position: relative;
  text-align: center;
  flex-shrink: 0;
}

  @media (min-width: 1024px) {.step-actions {
    display: block;

    margin: auto 0 7.1vh
}
  }

  @media (max-height: 850px) {.step-actions {
    display: -webkit-box;
    display: flex
}
  }

  .step-actions__buttons {
    z-index: 5;

    opacity: 0;
    -webkit-transition: opacity 0.8s 1s cubic-bezier(0.86, 0, 0.07, 1);
    transition: opacity 0.8s 1s cubic-bezier(0.86, 0, 0.07, 1);
  }

  .new-lifeline--editor.filled .step-actions__buttons {
      opacity: 1;
    }

  .step-actions__error {
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;

    margin-bottom: 1.4rem;

    font-size: 1.5rem;
    line-height: 1.2em;
    text-align: center;
    color: var(--bright-red);

    opacity: 0;
    pointer-events: none;
    -webkit-transition: 0.6s var(--transition-ease--out-quintic);
    transition: 0.6s var(--transition-ease--out-quintic);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
  }

  @media (min-width: 1024px) {

  .step-actions__error {
      position: absolute;
      top: 0;
      left: 0;

      width: auto;

      -webkit-transform: translateY(-80%);

              transform: translateY(-80%)
  }
    }

  @media (max-height: 850px) {

  .step-actions__error {
      position: static;
      min-height: 3.8rem
  }
    }

  .step-actions__error--visible {
      opacity: 1;
      pointer-events: all;
      margin-left: 1rem;
      margin-right: 1rem;
    }

  @media (min-width: 1024px) {

  .step-actions__error--visible {
        -webkit-transform: translateY(-100%) translateY(-1.4rem);
                transform: translateY(-100%) translateY(-1.4rem)
    }
      }

  @media (max-height: 850px) {

  .step-actions__error--visible {
        -webkit-transform: translateY(-1.4rem);
                transform: translateY(-1.4rem)
    }
      }

.new-lifeline-progress {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-pack: center;
          justify-content: center;

  width: 100%;
  margin: auto 0 0;

  font-size: 1.1rem;
  line-height: 1.18em;

  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;

  background: white;
  color: var(--smalt);

  -webkit-transform: translateY(100%);

          transform: translateY(100%);
  -webkit-transition: -webkit-transform 0.6s var(--transition-ease--out-quintic);
  transition: -webkit-transform 0.6s var(--transition-ease--out-quintic);
  transition: transform 0.6s var(--transition-ease--out-quintic);
  transition: transform 0.6s var(--transition-ease--out-quintic), -webkit-transform 0.6s var(--transition-ease--out-quintic);
}

  @media (min-width: 1024px) {.new-lifeline-progress {
    width: calc(100% - 2 * 8rem);
    min-width: 40rem;
    margin: auto auto 7.1vh;
    padding: 0;

    font-size: 1.5rem;

    position: static;
    background: transparent;
    -webkit-transform: none;
            transform: none;
    -webkit-transition: none;
    transition: none
}
  }

  @media (min-width: 1600px) {.new-lifeline-progress {
    width: calc(100% - 2 * 10rem)
}
  }

  .new-lifeline-progress--visible {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  .new-lifeline-progress-enter {
    opacity: 0;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }

  .new-lifeline-progress-enter-active {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
      -webkit-transition: opacity 1s 1s, -webkit-transform 1s 1s;
      transition: opacity 1s 1s, -webkit-transform 1s 1s;
      transition: opacity 1s 1s, transform 1s 1s;
      transition: opacity 1s 1s, transform 1s 1s, -webkit-transform 1s 1s;
    }

  .new-lifeline-progress-exit {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  .new-lifeline-progress-exit-active {
      opacity: 0;
      -webkit-transform: translateY(100%);
              transform: translateY(100%);
      -webkit-transition: opacity 1s 1s, -webkit-transform 1s 1s;
      transition: opacity 1s 1s, -webkit-transform 1s 1s;
      transition: opacity 1s 1s, transform 1s 1s;
      transition: opacity 1s 1s, transform 1s 1s, -webkit-transform 1s 1s;
    }

  .new-lifeline-progress__step {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;

    -webkit-box-flex: 1;

            flex-grow: 1;
    padding: 2rem 0;

    position: relative;

    text-align: center;
  }

  .new-lifeline-progress__step + .new-lifeline-progress__step {
      border-left: 1px solid #b3c3e0;
    }

  @media (min-width: 1024px) {

  .new-lifeline-progress__step {
      -webkit-box-flex: 0;
              flex-grow: 0;
      width: 25%;

      display: inline;
      /*margin-right: 1.9rem;*/
      padding: 0;

      position: static;

      text-align: center
  }

      .new-lifeline-progress__step + .new-lifeline-progress__step {
        border: none;
      }

      .new-lifeline-progress__step:last-child {
        margin-right: 0;
      }
    }

  @media (min-width: 1024px) {

  .new-lifeline-progress__bar-container {
      margin-top: 2.2rem;
      background: var(--lighter-gray);
      width: 100%;
      height: 0.1rem;
      position: relative
  }

      .new-lifeline-progress__bar-container::after {
        content: '';
        display: block;
        position: absolute;
        width: 0.1rem;
        height: 0.7rem;
        top: -0.3rem;
        right: 0;
        bottom: 0;
        background: var(--smalt);
      }

      li:nth-child(4) .new-lifeline-progress__bar-container::after {
        display: none;
      }
    }

  .new-lifeline-progress__bar {
    width: 100%;
    height: 0.6rem;

    position: absolute;
    bottom: 0;
    left: 0;

    background: #fa5a80;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;

    -webkit-transition: -webkit-transform 0.6s var(--transition-ease--out-quintic);

    transition: -webkit-transform 0.6s var(--transition-ease--out-quintic);

    transition: transform 0.6s var(--transition-ease--out-quintic);

    transition: transform 0.6s var(--transition-ease--out-quintic), -webkit-transform 0.6s var(--transition-ease--out-quintic);
  }

  @media (min-width: 1024px) {

  .new-lifeline-progress__bar {
      height: 0.1rem;
      background: #a6a5a5
  }

      .active .new-lifeline-progress__bar + .new-lifeline-progress__bar__cursor {
        content: '';
        position: absolute;
        top: -0.9rem;
        height: 1.9rem;
        width: 0.1rem;
        z-index: 1;
        background: #fa5a80;
        -webkit-transition: left 0.6s var(--transition-ease--out-quintic);
        transition: left 0.6s var(--transition-ease--out-quintic);
      }
    }

  .new-lifeline-progress__count {
    display: none;
  }

  @media (min-width: 1024px) {

  .new-lifeline-progress__count {
      display: block;
      margin-top: 1.1rem;
      color: var(--smalt);
      font-family: Aeonik
  }
    }

  @media (min-width: 768px) {

  .new-lifeline-progress__count {
      font-size: 1.3rem
  }

      @media (min-height: 747px) {

  .new-lifeline-progress__count {
        font-size: 1.4rem
  }
      }

      @media (min-height: 899px) {

  .new-lifeline-progress__count {
        font-size: 1.6rem
  }
      }
    }

  .new-lifeline-progress__step-label {
    opacity: 0.7;
    -webkit-transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }

  @media (min-width: 768px) {

  .new-lifeline-progress__step-label {
      font-size: 1.3rem
  }

      @media (min-height: 747px) {

  .new-lifeline-progress__step-label {
        font-size: 1.4rem
  }
      }

      @media (min-height: 899px) {

  .new-lifeline-progress__step-label {
        font-size: 1.5rem
  }
      }
    }

  @media (min-width: 1024px) {

  .new-lifeline-progress__step-label {
      opacity: 0.3
  }
    }

  .new-lifeline-progress__step.active .new-lifeline-progress__step-label {
      opacity: 1;
    }

  /* **jc** */

  .new-lifeline-progress__link {
    opacity: 0.7;
    -webkit-transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    cursor: pointer;
  }

  @media (min-width: 768px) {

  .new-lifeline-progress__link {
      font-size: 1.3rem
  }

      @media (min-height: 747px) {

  .new-lifeline-progress__link {
        font-size: 1.4rem
  }
      }

      @media (min-height: 899px) {

  .new-lifeline-progress__link {
        font-size: 1.5rem
  }
      }
    }

  @media (min-width: 1024px) {

  .new-lifeline-progress__link {
      opacity: 0.3
  }
      .new-lifeline-progress__link:hover,
      .new-lifeline-progress__link:focus {
        opacity: 1;
      }
    }

  .new-lifeline-progress__loading-screen {
    opacity: 0.8;
  }

  .new-lifeline-progress__substeps {
    display: none;
  }

  @media (min-width: 1024px) {

  .new-lifeline-progress__substeps {
      margin-top: 13px
  }

      .new-lifeline-progress__step.active .new-lifeline-progress__substeps {
        display: -webkit-box;
        display: flex;
      }

      .new-lifeline-progress__substeps li {
        border: 1px solid var(--smalt);
        width: 6px;
        height: 6px;
        border-radius: 3px;
        margin-right: 4px;
      }

        .new-lifeline-progress__substeps li:last-child {
          margin-right: 0;
        }

        .new-lifeline-progress__substeps li.active {
          background: var(--smalt);
        }
    }

.editor-container {
  width: 100%;
  max-width: none;
  margin: 0 auto;
}
  /*padding: 0 2rem;*/
  @media (min-width: 768px) {.editor-container {
    max-width: var(--editor-container-max-width)
}
  }
  .editor-container--small {
    --editor-container-max-width: 42%;
  }
  .editor-container--medium {
    --editor-container-max-width: 54%;
  }
  .editor-container--large {
    --editor-container-max-width: 80%;
  }
  .editor-container--xlarge {
    --editor-container-max-width: 91%;
  }
  .editor-container--center {
    text-align: center;
  }

.step {
  -webkit-box-flex: 1;
          flex-grow: 1;
  flex-shrink: 0;

  display: -webkit-box;

  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  -webkit-box-pack: justify;
          justify-content: space-between;

  padding: 2.4rem 2rem 6.4rem;

  position: relative;
  z-index: 1;
}

  @media (min-width: 768px) {.step {
    padding: 3vh 0 0 /* **jc** */
}
  }

  .step__inner {
    margin-top: auto;
    margin-bottom: auto;
    padding: 0;
  }

  @media (min-width: 768px) {

  .step__inner {
      padding-bottom: 3vh /* **jc** */
  }
    }

  .step__title {
    margin: 0;
    font-size: 1.6rem;
    line-height: 1.37em;
  }

.switcher {
  display: -webkit-inline-box;
  display: inline-flex;

  margin: 1.6rem 0 0;
  padding: 0.3rem;

  position: relative;

  background: var(--white);
  border-radius: 2.6rem;
}

  @media (min-width: 768px) {.switcher {
    margin-top: 2.5rem
}
  }

  .switcher__choice {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;

    padding: 1.2rem 1.9rem;
    border-radius: 20rem;

    color: var(--smalt);
    font-size: 1.4rem;
    line-height: 1.21em;

    position: relative;
    z-index: 1;

    cursor: pointer;

    -webkit-transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
  }

  @media (min-width: 768px) {

  .switcher__choice {
      font-size: 1.7rem;
      line-height: 1.23em
  }
    }

  .switcher__choice + .switcher__choice {
      margin-left: 0.3rem;
    }

  .switcher__choice--active {
      color: var(--white);
    }

  .switcher__lavalamp {
    width: 3.8rem;

    margin: 0.3rem 0;
    padding: 1.2rem 1.9rem;

    border-radius: 20rem;

    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 0;

    background: var(--smalt);
    -webkit-transform: translate(0);
            transform: translate(0);
    opacity: 0;

    -webkit-transition: 1s var(--transition-ease--out-quintic);

    transition: 1s var(--transition-ease--out-quintic);
    -webkit-transition-property: width, opacity, -webkit-transform;
    transition-property: width, opacity, -webkit-transform;
    transition-property: transform, width, opacity;
    transition-property: transform, width, opacity, -webkit-transform;
  }

  @media (min-width: 375px) {

  .switcher__lavalamp {
      width: 5.6rem;
      padding: 1.2rem 2.8rem
  }
    }

  @media (min-width: 768px) {

  .switcher__lavalamp {
      width: 5.2rem;
      padding: 1.3rem 2.6rem;

      font-size: 1.7rem;
      line-height: 1.23em
  }
    }

.remembering-armed-forces {
  padding-bottom: 3rem;
  z-index: 6;
}

  @media (min-width: 768px) {.remembering-armed-forces {
    padding-bottom: 0
}
  }

  .remembering-armed-forces .select--arrow {
    top: 50%;
  }

  .remembering-armed-forces .input__bottom {
    position: absolute;
    top: 100%;
  }

  .remembering-armed-forces .select--autocomplete-box {
    top: 100%;
  }

  .remembering-armed-forces .switcher {
    margin-top: 5rem;
  }

  .remembering-armed-forces .question {
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }

  .remembering-armed-forces .svg--military-badge--wrapper {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
            align-items: center;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    font-family: var(--font-heading);
    font-size: 2.5rem;
    color: transparent;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 0;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
  }

  @media (min-width: 768px) {

  .remembering-armed-forces .svg--military-badge--wrapper {
      margin-top: 0.2rem;
      -webkit-box-pack: center;
              justify-content: center
  }
    }

  @media (min-width: 1441px) {

  .remembering-armed-forces .svg--military-badge--wrapper {
      font-size: 3rem;
      margin-top: 0.5rem
  }
    }

  .remembering-armed-forces .svg--military-badge {
    width: 4.2rem;
    height: 4.2rem;
    margin-right: 1.9rem;
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    flex-shrink: 0;
  }

  .remembering-armed-forces input {
    padding-bottom: 1.4rem;
  }

  .remembering-armed-forces .remembering-armed-forces__with-value input {
      padding-left: 6.1rem;
    }

  .remembering-armed-forces--military-selector {
    position: absolute;
    top: 0;
    left: 50%;

    -webkit-transform: translate(-50%, 50%);

            transform: translate(-50%, 50%);
    -webkit-transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    padding: 0 2rem;
  }

  @media (min-width: 768px) {

  .remembering-armed-forces--military-selector {
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%)
  }
    }

  @media (min-width: 1024px) {

  .remembering-armed-forces--military-selector {
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);

      padding: 0
  }
    }

  .remembering-armed-forces--military-selector--active {
      -webkit-transform: translate(-50%, 10%);
              transform: translate(-50%, 10%);
    }

  @media (min-height: 700px) {

  .remembering-armed-forces--military-selector--active {
        -webkit-transform: translate(-50%, 20%);
                transform: translate(-50%, 20%)
    }
      }

  @media (min-width: 768px) {

  .remembering-armed-forces--military-selector--active {
        -webkit-transform: translate(-50%, -100%);
                transform: translate(-50%, -100%)
    }
      }

  @media (min-width: 1024px) {

  .remembering-armed-forces--military-selector--active {
        -webkit-transform: translate(-50%, -100%);
                transform: translate(-50%, -100%)
    }
      }

  .remembering-armed-forces--forces-select-container {
    margin-top: 30vh;

    -webkit-transition: opacity 0.6s var(--transition-ease--out-quintic),
      -webkit-transform 0.8s var(--transition-ease--out-quintic);

    transition: opacity 0.6s var(--transition-ease--out-quintic),
      -webkit-transform 0.8s var(--transition-ease--out-quintic);

    transition: opacity 0.6s var(--transition-ease--out-quintic),
      transform 0.8s var(--transition-ease--out-quintic);

    transition: opacity 0.6s var(--transition-ease--out-quintic),
      transform 0.8s var(--transition-ease--out-quintic),
      -webkit-transform 0.8s var(--transition-ease--out-quintic);

    -webkit-animation: forces-slide-in-select 0.6s forwards;

            animation: forces-slide-in-select 0.6s forwards;
  }

  @media (min-height: 700px) {

  .remembering-armed-forces--forces-select-container {
      margin-top: 25vh
  }
    }

@-webkit-keyframes forces-slide-in-select {
  0% {
    -webkit-transform: translateY(5rem);
            transform: translateY(5rem);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes forces-slide-in-select {
  0% {
    -webkit-transform: translateY(5rem);
            transform: translateY(5rem);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

.remembering-birth-and-death-dates {
  padding-bottom: 4.6rem;
  z-index: 1;
}

  @media (min-width: 768px) {.remembering-birth-and-death-dates {
    padding-bottom: 0
}
  }

  .remembering-birth-and-death-dates .step-actions {
    z-index: 0;
  }

  .remembering-birth-and-death-dates .birth-date__wrapper {
    z-index: 50;
    position: relative;
  }

  .remembering-birth-and-death-dates .death-date__wrapper {
    z-index: 40;
    position: relative;
  }

  .remembering-birth-and-death-dates .death-date,
  .remembering-birth-and-death-dates .birth-date {
    position: relative;
  }

  .remembering-birth-and-death-dates .birth-date {
    z-index: 3;
  }

  .remembering-birth-and-death-dates .death-date {
    margin-top: 8vh;
    z-index: 2;
  }

  .remembering-birth-and-death-dates .summary {
    margin-top: 8vh;
  }

  /* **jc** */

  .remembering-birth-and-death-dates .summary__show {
      -webkit-transition: opacity var(--transition-duration--fast)
        var(--transition-ease--out-quintic) 0.4s;
      transition: opacity var(--transition-duration--fast)
        var(--transition-ease--out-quintic) 0.4s;
      opacity: 1 !important;
      visibility: visible !important;
      -webkit-transition-delay: 0s;
              transition-delay: 0s;
    }

  /*opacity: 1 !important;
    visibility: visible !important; */

  .remembering-birth-and-death-dates .summary__hidden {
      -webkit-transition: opacity var(--transition-duration--fast)
        var(--transition-ease--out-quintic) 0.4s;
      transition: opacity var(--transition-duration--fast)
        var(--transition-ease--out-quintic) 0.4s;
      opacity: 0 !important;
      visibility: hidden !important;
      -webkit-transition-delay: 0s;
              transition-delay: 0s;
    }

  /* gsap sets opacity 0 and visibility hidden inline */

  @media (max-height: 768px) {

  .remembering-birth-and-death-dates .summary .question-heading {
        font-size: 1.5rem
    }
      }

  .remembering-birth-and-death-dates .age-death {
    font-family: var(--font-heading);
    font-size: 5rem;
  }

  @media (max-height: 768px) {

  .remembering-birth-and-death-dates .age-death {
      font-size: 4rem
  }
    }

  @media (min-width: 768px) {

  .remembering-birth-and-death-dates .birth-and-death__editor-container {
      -webkit-transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic)
  }

      .remembering-birth-and-death-dates .birth-and-death__editor-container--ranslated {
        -webkit-transform: translateY(calc((22px + 5rem + 8vh + 4vh) / 2));
                transform: translateY(calc((22px + 5rem + 8vh + 4vh) / 2));
        -webkit-transition-delay: 0.3s;
                transition-delay: 0.3s;
      }
    }

  .remembering-birth-and-death-dates .input .input__field::-webkit-input-placeholder {
        -webkit-transition-property: color, opacity;
        transition-property: color, opacity;
      }

  .remembering-birth-and-death-dates .input .input__field::-moz-placeholder {
        -webkit-transition-property: color, opacity;
        transition-property: color, opacity;
      }

  .remembering-birth-and-death-dates .input .input__field:-ms-input-placeholder {
        -webkit-transition-property: color, opacity;
        transition-property: color, opacity;
      }

  .remembering-birth-and-death-dates .input .input__field::-ms-input-placeholder {
        -webkit-transition-property: color, opacity;
        transition-property: color, opacity;
      }

  .remembering-birth-and-death-dates .input .input__field::placeholder {
        -webkit-transition-property: color, opacity;
        transition-property: color, opacity;
      }

  .remembering-birth-and-death-dates .input--wrong .input__field {
        color: var(--bright-red);
      }

  .remembering-birth-and-death-dates .input--wrong .input__field::-webkit-input-placeholder {
          opacity: 1;
        }

  .remembering-birth-and-death-dates .input--wrong .input__field::-moz-placeholder {
          opacity: 1;
        }

  .remembering-birth-and-death-dates .input--wrong .input__field:-ms-input-placeholder {
          opacity: 1;
        }

  .remembering-birth-and-death-dates .input--wrong .input__field::-ms-input-placeholder {
          opacity: 1;
        }

  .remembering-birth-and-death-dates .input--wrong .input__field::placeholder {
          opacity: 1;
        }

  .remembering-birth-and-death-dates .input__bottom__error {
      display: none;
    }

@media (max-width: 768px) {
    .remembering-birth-and-death-town .select--autocomplete-box {
      top: calc(100% - 5rem);
    }
  }
  .remembering-birth-and-death-town .question-town--compact .input__bottom {
      position: absolute;
      top: calc(100% + 4rem);
    }
  .remembering-birth-and-death-town .question-town--compact .select--autocomplete-box {
      top: 100%;
    }
  @media (min-width: 768px) {
  .remembering-birth-and-death-town .input__bottom {
      position: absolute;
      top: calc(100% + 4rem);
      left: 0
  }

      .remembering-birth-and-death-town .input__bottom .input__bottom__error {
        margin-top: 0;
      }
    }
  @media (min-width: 768px) {
    .remembering-birth-and-death-town .select--autocomplete-box {
      top: 100%;
    }
  }
  .remembering-birth-and-death-town .question-town--askforhelp-hidden .input__bottom {
      top: 100%;
    }
  @media (min-width: 768px) {
  .remembering-birth-and-death-town .question-town--askforhelp-hidden .input__bottom {
        top: calc(100% + 2rem)
    }
      }
  .remembering-birth-and-death-town .question-town--askforhelp-hidden .select--autocomplete-box {
      top: 100%;
    }
  @media (min-width: 768px) {
  .remembering-birth-and-death-town .input {
      text-align: left
  }
    }
  .remembering-birth-and-death-town .input:last-of-type {
    margin-right: 0;
  }
  .remembering-birth-and-death-town .question-town {
    margin: 0 auto;
    -webkit-transition: max-width var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: max-width var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }
  .remembering-birth-and-death-town .question-town--compact {
      max-width: 40.7rem;
    }
  .remembering-birth-and-death-town .question-town__inputs {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      margin: 0 -1rem;
    }
  @media (min-width: 768px) {
  .remembering-birth-and-death-town .question-town__inputs {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
                flex-direction: row
    }
      }
  .remembering-birth-and-death-town .question-town__inputs > .select,
      .remembering-birth-and-death-town .question-town__inputs > .autocomplete {
        -webkit-box-flex: 1;
                flex-grow: 1;
        margin: 0 1rem;
      }
  .remembering-birth-and-death-town .question-town__inputs > .autocomplete .input {
          width: 100%;
        }
  .remembering-birth-and-death-town .ask-for-help-cta {
    margin-top: 1.4rem;
  }
  .remembering-birth-and-death-town .question + .question {
    margin-top: 8rem;
  }
  @media (min-width: 768px) {
  .remembering-birth-and-death-town .question + .question {
      margin-top: 14vh
  }
    }

.place-tag {
  padding: 1.3rem;
  margin: 0.65rem;

  border-radius: 2.6rem;
  background: var(--white);

  color: var(--smalt);
  font-size: 1.4rem;
  font-family: var(--font-heading);

  cursor: pointer;
}

  .place-tag--remove {
    width: 1.2rem;
    height: 1.2rem;

    display: inline-block;

    margin-right: 1rem;

    background: url(https://www.memories.com/assets/images/cross-smalt--46bda60ae83456f98d4a96562b2ee5e9.svg);
    background-size: contain;
    background-position: center;
  }

.places-list {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: center;
          justify-content: center;

  margin-top: 6rem;
}

  @media (min-width: 768px) {.places-list {
    margin-top: 2.5rem
}

    .places-list:first-of-type {
      margin: 4vh 10vw 0;
    }
  }

.remembering-places-lived {

  padding-bottom: 0;
}
  /* .input,
  .select {
    display: inline-flex;
    width: calc(33.333% - 1.333rem);
    margin-right: 2rem;
    text-align: left;

    .input {
      width: auto;
      margin-right: 0;
    }
  } */
  .remembering-places-lived .select--autocomplete-box {
    top: 100%;
  }
  @media (min-width: 768px) {
  .remembering-places-lived .step__title {
      width: 34.9rem;
      margin: 0 auto
  }
    }
  @media (min-width: 768px) {
  .remembering-places-lived .step__inner .editor-container {
        margin-top: 4vh
    }
      }
  .remembering-places-lived .button {
    z-index: 0;
  }
  @media (min-width: 768px) {
  .remembering-places-lived .button {
      margin-top: 0
  }
    }
  .remembering-places-lived .button.add-new-place {
      margin: 4.8rem 0;
    }
  .remembering-places-lived .button--places {
      margin-bottom: 4.8rem;
      margin-top: 4.8rem;
    }
  @media (min-width: 768px) {
  .remembering-places-lived .button--places {
        margin-bottom: 0
    }
      }
  .remembering-places-lived__actions__wrapper {
      margin-bottom: 4.8rem;
    }
  .remembering-places-lived__actions__wrapper .step-actions__error.remembering-places-lived__error {
        position: static;
        -webkit-transform: none;
                transform: none;

        display: inline-block;
      }
  .remembering-places-lived .input:last-of-type {
    margin-right: 0;
  }
  .remembering-places-lived .question {
    position: relative;
    z-index: 1;
  }
  .remembering-places-lived .question-town {
    margin: 4.8rem auto 3rem;
    -webkit-transition: max-width var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: max-width var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }
  @media (min-width: 768px) and (min-height: 780px) {
  .remembering-places-lived .question-town {
      margin: 0 auto 5rem
  }
    }
  .remembering-places-lived .question-town .place-specification .input__label {
      font-size: 16px;
    }
  .remembering-places-lived .ask-for-help-cta {
    margin-top: 1.4rem;
  }
  .remembering-places-lived .question + .question {
    margin-top: 8rem;
  }
  @media (min-width: 768px) {
  .remembering-places-lived .question + .question {
      margin-top: 14vh
  }
    }
  .remembering-places-lived .input__bottom {
    /*position: absolute; **jc** */
    top: 100%;
  }

.content-editable--text {
    border: 1px solid var(--white);
    padding: 2rem 2.6rem;
    margin: 4rem 0 4rem;
    font-family: var(--font-heading);
    font-size: 2rem;
    line-height: 1.3em;
    text-align: left;
    outline: none;
    height: 25rem;
    white-space: pre-wrap;
    overflow: auto;

    -webkit-transition: border-color 0.6s var(--transition-ease--out-quintic);

    transition: border-color 0.6s var(--transition-ease--out-quintic);
  }

    @media (min-width: 768px) {.content-editable--text {
      font-size: 2.5rem;
      padding: 2rem 3rem
  }
    }

    .content-editable--text p {
      margin: 0;
    }

    .content-editable--text--pre-text {
    }

    .content-editable--text--placeholder {
      color: var(--white);
      opacity: 0.5;
    }
  .content-editable--error .content-editable--text {
      border-color: var(--bright-red);
    }
  .content-editable--counter {
    position: absolute;
    top: calc(100% + 1.6rem);
    left: 0;

    width: 100%;

    font-size: 14px;

    display: -webkit-box;

    display: flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: justify;
            justify-content: space-between;
  }
  .content-editable--counter .input__bottom__error {
      margin-top: 0;
    }

.remembering-eol-context {
  padding-bottom: 0;
}

  .remembering-eol-context .textarea {
    margin-bottom: 2rem;
  }

  .remembering-eol-context .editor-container {
    position: relative;
  }

  .new-lifeline--editor--remembering .remembering-eol-context__error.step-actions__error {
    position: relative;
  }

  @media (min-width: 768px) {

  .new-lifeline--editor--remembering .remembering-eol-context__error.step-actions__error {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      left: 0;
      -webkit-transform: none;
              transform: none
  }
    }

.words-list-input .autocomplete:nth-child(1) .input__fake-placeholder {
        -webkit-transition-delay: 0.1s;
                transition-delay: 0.1s;
      }
    .words-list-input .autocomplete:nth-child(2) .input__fake-placeholder {
        -webkit-transition-delay: 0.2s;
                transition-delay: 0.2s;
      }
    .words-list-input .autocomplete:nth-child(3) .input__fake-placeholder {
        -webkit-transition-delay: 0.3s;
                transition-delay: 0.3s;
      }
    .words-list-input .autocomplete:nth-child(4) .input__bottom, .words-list-input .autocomplete:nth-child(5) .input__bottom {
        margin-bottom: 1rem; /* **jc** */
      }
  .words-list-input.hide-placeholders .input__fake-placeholder {
      opacity: 0;
    }
  .words-list-input .button {
    margin-top: 6rem;
  }
  @media (min-width: 768px) {
  .words-list-input .button {
      margin-top: 5rem
  }
    }
  .words-list-input .autocomplete {
    margin-top: 1.5rem;
  }
  /*.autocomplete + .autocomplete {
    margin-top: 1.5rem;
  }*/
  .words-list-input .input {
    margin-top: 2.2rem;
  }
  @media (min-width: 768px) {
  .words-list-input .input {
      margin-top: 1.6rem
  }
    }

@media (min-width: 768px) {.remembering-fun-descriptions .step__inner {
      padding-bottom: 2rem
  }
    }
    .remembering-fun-descriptions .step__inner .words-list-input .button {
        margin-top: 1rem;
      }

.remembering-general-info {
  padding-bottom: 4.6rem;
  z-index: 1;
}

  @media (min-width: 768px) {.remembering-general-info {
    padding-bottom: 0
}
  }

  .remembering-general-info .sex {
    text-align: center;
  }

  .remembering-general-info .name {
    margin-top: 4.2rem;
  }

  @media (min-width: 768px) {

  .remembering-general-info .name {
      max-width: var(--editor-container-max-width);
      margin-top: 8vh
  }
    }

  .remembering-general-info .name .input {
      width: 100%;
    }

  .remembering-general-info .name .input + .input {
        margin-top: 1rem;
      }

  @media (min-width: 768px) {

  .remembering-general-info .name .input {
        width: calc(50% - 1rem)
    }

        .remembering-general-info .name .input + .input {
          margin-top: 0;
        }

        .remembering-general-info .name .input:first-of-type {
          margin-right: 1rem;
        }

        .remembering-general-info .name .input:last-of-type {
          margin-left: 1rem;
        }
      }

  .remembering-general-info .general-info-field {
    margin-top: 3rem;
  }

  @media (min-height: 780px) {

  .remembering-general-info .general-info-field {
      margin-top: 3rem
  }
    }

  .remembering-general-info .general-info-field .input__label {
      font-size: 1.4rem;
    }

  .remembering-general-info .general-info-field input {
      padding-top: 1.8rem;
      padding-bottom: 0.6rem;
    }

  @media (min-width: 768px) and (min-height: 780px) {

  .remembering-general-info .general-info-field input {
        padding-top: 2.8rem;
        padding-bottom: 1.6rem
    }
      }

  .remembering-general-info .relationship {
    margin-top: 1rem;
  }

  @media (min-width: 768px) {

  .remembering-general-info .relationship {
      margin-top: 8vh
  }
    }

  @media (max-height: 850px) {

  .remembering-general-info .relationship {
      margin-top: 5vh
  }
    }

  .remembering-general-info .select--autocomplete-box {
      max-height: 8vh;
    }

  .remembering-general-info__mode-section--enter, .remembering-general-info__mode-selected-section--enter {
      opacity: 0 !important;
      -webkit-transition: opacity 0.8s cubic-bezier(0.86, 0, 0.07, 1);
      transition: opacity 0.8s cubic-bezier(0.86, 0, 0.07, 1);
    }

  .remembering-general-info__mode-section--enter-active, .remembering-general-info__mode-selected-section--enter-active {
        opacity: 1 !important;
      }

  .remembering-general-info__mode-section--exit, .remembering-general-info__mode-selected-section--exit {
      opacity: 1 !important;
      -webkit-transition: opacity 0.8s cubic-bezier(0.86, 0, 0.07, 1);
      transition: opacity 0.8s cubic-bezier(0.86, 0, 0.07, 1);
    }

  .remembering-general-info__mode-section--exit-active, .remembering-general-info__mode-selected-section--exit-active {
        opacity: 0 !important;
      }

  .remembering-general-info__mode-section {
    text-align: center;
  }

  .remembering-general-info__mode-section > * {
      -webkit-animation: mode-selection-fade-in 0.8s 1s cubic-bezier(0.86, 0, 0.07, 1)
        both;
              animation: mode-selection-fade-in 0.8s 1s cubic-bezier(0.86, 0, 0.07, 1)
        both;
    }

  .remembering-general-info__mode-buttons {
    margin-top: 2.7rem;
  }

@-webkit-keyframes mode-selection-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes mode-selection-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.remembering-main-adjectives {
  padding-bottom: 4.6rem;
}

  @media (min-width: 768px) {.remembering-main-adjectives {
    padding-bottom: 0
}
  }

  .remembering-main-adjectives .words-list-input {
    margin-top: 3.7rem;
  }

  @media (min-width: 768px) {

  .remembering-main-adjectives .words-list-input {
      margin-top: 0
  }
    }

.remembering-main-photo .editor-container {
    position: relative;
  }
  .remembering-main-photo .image-upload--wrapper {
    margin-top: 5rem;
  }
  .remembering-main-photo .ask-for-help-cta {
    width: 100%;
    max-width: 28rem;
    margin: 1.2rem auto 0;
  }
  @media (min-width: 768px) {
  .remembering-main-photo .ask-for-help-cta {
      max-width: 32rem
  }
    }
  @media (min-width: 1024px) {
  .remembering-main-photo .ask-for-help-cta {
      max-width: 38rem
  }
    }
  .remembering-main-photo .image-upload {
    -webkit-transition: opacity var(--transition-duration--fast),
      border var(--transition-duration--instant);
    transition: opacity var(--transition-duration--fast),
      border var(--transition-duration--instant);
    border: 1px solid transparent;
  }
  .remembering-main-photo .image-upload--preview {
      pointer-events: none;
    }
  .remembering-main-photo .image-upload--preview--cropping {
        pointer-events: auto;
      }
  .remembering-main-photo .image-upload--with-preview .image-upload--upload {
        pointer-events: none;
      }
  .new-lifeline--editor--showing-main-error .remembering-main-photo .image-upload {
      border-color: red;
    }

.remembering-eol-context-decision .question-heading {
    margin-bottom: 4rem;
  }
  .remembering-eol-context-decision .button + .button {
    margin-top: 1rem;
  }

.remembering-ethical-will {
  padding-bottom: 0;
}

.simple-image-upload input {
    display: none;
  }
  .simple-image-upload__add-photo {
    margin: 0 auto;
  }
  .simple-image-upload__add-photo.button--success > .svg,
      .simple-image-upload__add-photo.button--success > span {
        opacity: 0;
        z-index: 1;
      }
  .simple-image-upload__add-photo.button--success > .svg {
        -webkit-transition: none;
        transition: none;
      }
  .simple-image-upload__add-photo--active.simple-image-upload__add-photo.button--success .button__loading {
        opacity: 0;
      }
  .simple-image-upload__add-photo--active.simple-image-upload__add-photo.button--success > .svg,
      .simple-image-upload__add-photo--active.simple-image-upload__add-photo.button--success > span {
        opacity: 1;
        -webkit-transition: var(--transition-duration--fast)
          var(--transition-ease--out-quintic);
        transition: var(--transition-duration--fast)
          var(--transition-ease--out-quintic);
      }
  .simple-image-upload__add-photo--adding {
      width: 17.9rem !important;
    }
  .simple-image-upload__add-photo--adding span.svg {
        -webkit-transition: none;
        transition: none;
        opacity: 0 !important;
      }
  .simple-image-upload__add-photo--adding .button__loading {
        opacity: 1;
      }
  .simple-image-upload--detail {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;

    font-size: 1.5rem;

    margin: 0;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  @media (min-height: 900px) {
  .simple-image-upload--detail {
      margin: 1.1rem 0 4rem
  }
    }
  .simple-image-upload--detail img {
      width: 3.6rem;
      height: 3.6rem;
      -o-object-fit: cover;
         object-fit: cover;
    }
  .simple-image-upload--detail span {
      margin-left: 1.5rem;
    }
  .simple-image-upload--detail a {
      margin-left: auto;
    }
  .simple-image-upload--error {
    display: -webkit-box;
    display: flex;

    margin-top: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    color: var(--bright-red);
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
  .simple-image-upload--error .svg--cross {
      width: 1.3rem;
      height: 1.3rem;

      display: inline-block;

      margin-right: 0.8rem;
    }
  .simple-image-upload--error .svg--cross path {
        stroke: var(--bright-red);
      }

.picture-preview {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-align: center;
          align-items: center;

  padding: 1.6rem 0;
}

  .picture-preview__image {
    flex-shrink: 0;

    width: 4.6rem;
    height: 4.4rem;

    background: var(--gallery) no-repeat center / cover;
  }

  .picture-preview__info {
    -webkit-box-flex: 1;
            flex-grow: 1;

    display: -webkit-box;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-align: start;
            align-items: flex-start;

    margin-left: 1.2rem;
  }

  .picture-preview__name,
  .picture-preview__action {
    font-weight: normal;
    font-size: 1.3rem;
    line-height: 1.23em;
    text-align: left;
  }

  .picture-preview__name {
    color: var(--black);
  }

  .picture-preview__action {
    margin-top: 0.8rem;
    padding: 0;

    color: var(--smalt);
    text-decoration: underline;
  }

.relationships-editor {
  display: inline-block;
  width: 17rem;

  padding: 1.2rem 3rem;

  position: absolute;
  top: 0%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);

  background: var(--white);
  color: var(--smalt);
  border-radius: 2.6rem;

  -webkit-transition: var(--transition-duration--normal)
    var(--transition-ease--out-quintic);

  transition: var(--transition-duration--normal)
    var(--transition-ease--out-quintic);
  -webkit-transition-property: top, margin-top, width, border-radius;
  transition-property: top, margin-top, width, border-radius;

  cursor: pointer;
}

  @media (min-width: 768px) {.relationships-editor {
    width: 18.6rem;
    padding: 1.8rem 3rem
}
  }

  @media (min-width: 768px) {

  .relationships-editor .select--arrow {
      top: 4.9rem
  }
    }

  .relationships-editor .select--autocomplete-box {
    top: 5.4rem;
  }

  @media (min-width: 768px) {

  .relationships-editor .select--autocomplete-box {
      top: 6.9rem
  }
    }

  @media (min-width: 1441px) {

  .relationships-editor .select--autocomplete-box {
      top: 6.9rem
  }
    }

  .relationships-editor__wrapper {
    flex-shrink: 0;

    width: 100%;
    height: 4.3rem;
    margin: 3.2rem 0;

    position: relative;
    z-index: 200;
  }

  @media (min-width: 768px) {

  .relationships-editor__wrapper {
      height: 5.6rem
  }
    }

  .relationships-editor__underneath-close-target {
    width: 100%;
    height: 100%;

    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
  }

  .relationships-editor__label-wrapper {
    padding-right: 3.2rem;
    -webkit-transition: padding var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: padding var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    text-align: center;
  }

  .relationships-editor__cross {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0.6rem;
    right: 0.8rem;
    z-index: 2;

    background: var(--lifeline-relationships);
    border-radius: 50%;

    -webkit-transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }

  @media (min-width: 768px) {

  .relationships-editor__cross {
      top: 1.2rem;
      right: 1.2rem
  }
    }

  .relationships-editor__cross::before,
    .relationships-editor__cross::after {
      content: '';
      display: block;

      width: 37.5%;
      height: 1px;

      position: absolute;
      top: 50%;
      left: 50%;

      background: var(--white);

      -webkit-transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
    }

  .relationships-editor__cross::before {
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
    }

  .relationships-editor__cross::after {
      -webkit-transform: translate(-50%, -50%) rotate(-90deg);
              transform: translate(-50%, -50%) rotate(-90deg);
    }

  .relationships-editor__cross:focus {
      -webkit-transform: scale(1.1);
              transform: scale(1.1);
    }

  .relationships-editor__label {
    -webkit-transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    opacity: 1;

    font-family: 'GT Sectra Display';
    font-size: 1.5rem;
    line-height: 1.23em;
  }

  @media (min-width: 768px) {

  .relationships-editor__label {
      font-size: 1.7rem
  }
    }

  .relationships-editor--confirmation .relationships-editor__label {
      opacity: 0;
      pointer-events: none;
    }

  .relationships-editor__label-section {
    -webkit-transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: opacity var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    opacity: 1;

    font-family: 'GT Sectra Display';
    font-size: 2rem;
    line-height: 1.23em;
    margin-bottom: 2rem;
  }

  @media (min-width: 768px) {

  .relationships-editor__label-section {
      font-size: 2.3rem;
      margin-bottom: 3.5rem
  }
    }

  .relationships-editor--confirmation .relationships-editor__label-section {
      opacity: 0;
      pointer-events: none;
    }

  .relationships-editor__content {
    display: block;
    margin-top: 0;
    height: 0;

    overflow: hidden;

    -webkit-transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    -webkit-transition-property: margin-top, height, opacity;
    transition-property: margin-top, height, opacity;

    opacity: 0;
    pointer-events: none;
  }

  .relationships-editor__content--visible {
      opacity: 1;
      pointer-events: auto;
    }

  .relationships-editor__content .relationships-editor__content-row,
    .relationships-editor__content .relationships-editor__content-row-quote,
    .relationships-editor__content > .relationships-editor__add-button__wrapper {
      opacity: 0;
    }

  .relationships-editor__content .relationships-editor__content-row,
    .relationships-editor__content .relationships-editor__content-row-quote,
    .relationships-editor__content > .relationships-editor__add-button__wrapper {
      -webkit-transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
    }

  .relationships-editor__content-row {
    text-align: left;
  }

  @media (min-width: 768px) {

  .relationships-editor__content-row {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-align: start;
              align-items: flex-start
  }
    }

  .relationships-editor__content-row--memory-request .relationships-editor__label-section, .relationships-editor__content-row--quotes .relationships-editor__label-section, .relationships-editor__content-row--info .relationships-editor__label-section {
        display: block;
      }

  .relationships-editor__content-row--memory-request-label {
      margin-top: 2rem;
    }

  @media (min-width: 768px) {

  .relationships-editor__content-row--memory-request-label {
        margin-top: 0
    }
      }

  .relationships-editor__content-row--memory-request-ctas {
      margin: 3.5rem 0;
      width: 100%;
    }

  @media (min-width: 768px) {

  .relationships-editor__content-row--quote-label {
        margin-bottom: 3.4rem
    }
      }

  @media (min-width: 768px) {

  .relationships-editor__content-row-quote {
      width: 100%
  }
    }

  .relationships-editor .input {
    text-align: left;
  }

  .relationships-editor .input__field {
    padding: 0.6rem 0;

    -webkit-transition: border-bottom 0.1s step-end;

    transition: border-bottom 0.1s step-end;
  }

  .relationships-editor .input__field::-webkit-input-placeholder {
      text-transform: initial;
    }

  .relationships-editor .input__field::-moz-placeholder {
      text-transform: initial;
    }

  .relationships-editor .input__field:-ms-input-placeholder {
      text-transform: initial;
    }

  .relationships-editor .input__field::-ms-input-placeholder {
      text-transform: initial;
    }

  .relationships-editor .input__field::placeholder {
      text-transform: initial;
    }

  .relationships-editor .input__field__suggestion::-webkit-input-placeholder {
      text-transform: capitalize;
    }

  .relationships-editor .input__field__suggestion::-moz-placeholder {
      text-transform: capitalize;
    }

  .relationships-editor .input__field__suggestion:-ms-input-placeholder {
      text-transform: capitalize;
    }

  .relationships-editor .input__field__suggestion::-ms-input-placeholder {
      text-transform: capitalize;
    }

  .relationships-editor .input__field__suggestion::placeholder {
      text-transform: capitalize;
    }

  .relationships-editor .input__field:focus {
      border-bottom-color: var(--smalt);
    }

  .relationships-editor .input__bottom__error {
    -webkit-transition-delay: 0.1s;
            transition-delay: 0.1s;
  }

  .relationships-editor__field-label {
    font-size: 1.4rem;
    line-height: 1.18em;
    color: var(--black);
    text-align: left;
  }

  .relationships-editor__field-label--disabled {
      opacity: 0.4;
    }

  .relationships-editor__first-name-field,
  .relationships-editor__last-name-field,
  .relationships-editor__relationship-field,
  .relationships-editor__relationship-group-field,
  .relationships-editor__picture-field,
  .relationships-editor__default-picture-field {
    -webkit-box-flex: 1;
            flex-grow: 1;
    flex-basis: 0;
    margin-top: 0;
  }

  @media (min-width: 768px) {

  .relationships-editor__first-name-field,
  .relationships-editor__relationship-field,
  .relationships-editor__picture-field {
      margin-right: 1rem
  }
    }

  @media (min-width: 768px) {

  .relationships-editor__last-name-field,
  .relationships-editor__relationship-group-field,
  .relationships-editor__default-picture-field {
      margin-left: 1rem
  }
    }

  .relationships-editor__default-picture-field {
    margin-top: 2rem;
  }

  @media (min-width: 768px) {

  .relationships-editor__default-picture-field {
      margin-top: 0
  }
    }

  .relationships-editor__default-picture-field .default-picture-selector {
      display: -webkit-box;
      display: flex; /* **jc** */
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row; /* **jc** */
      -webkit-box-align: center;
              align-items: center; /* **jc** */
      -webkit-box-pack: start;
              justify-content: flex-start; /* **jc** */
    }

  .relationships-editor__picture-field .simple-image-upload {
      padding: 1.6rem 0 0;
      display: -webkit-box;
      display: flex; /* **jc** */
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column; /* **jc** */
      -webkit-box-align: start;
              align-items: flex-start; /* **jc** */
      -webkit-box-pack: center;
              justify-content: center;
    }

  /* **jc** */

  .relationships-editor__picture-field .simple-image-upload .button {
        margin: 0;
      }

  .relationships-editor__back-button,
  .relationships-editor__add-button {
    margin-top: 1em;
  }

  @media (min-width: 768px) {

  .relationships-editor__back-button,
  .relationships-editor__add-button {
      margin-top: 0
  }
    }

  .relationships-editor__back-button:hover, .relationships-editor__add-button:hover {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      box-shadow: none;
    }

  .relationships-editor__add-button__wrapper {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      -webkit-box-align: center;
              align-items: center;

      margin-top: 2.2rem;
    }

  @media (min-width: 768px) {

  .relationships-editor__add-button__wrapper {
        display: block
    }
      }

  .relationships-editor__add-button__error-message {
      opacity: 0;
      position: relative;
      top: -1.1em;

      margin: 0 0 0.5rem;

      font-size: 1.5rem;
      line-height: 1.2em;
      text-align: center;
      color: var(--bright-red);

      -webkit-transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
    }

  .relationships-editor__add-button__error-message--visible {
        opacity: 1;
      }

  @media (min-width: 768px) {

  .relationships-editor__add-button__error-message {
        /* display: none; */
    }
      }

  .relationships-editor__remove-button {
    font-weight: normal;
    font-size: 1.3rem;
    line-height: 1.23em;
    color: var(--bright-red);
    text-decoration: underline;
  }

  .relationships-editor:not(.relationships-editor--open) .input__bottom__error {
      visibility: hidden;
    }

  .relationships-editor:not(.relationships-editor--open) .input__field {
      border-color: var(--smalt);
    }

  .relationships-editor--open {
    width: 100%;
    border-radius: 0;

    cursor: default;
  }

  .relationships-editor--open .relationships-editor__label-wrapper {
      padding-right: 0;
      text-align: left;
    }

  .relationships-editor--open .relationships-editor__cross {
      cursor: pointer;
    }

  .relationships-editor--open .relationships-editor__cross::before {
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
                transform: translate(-50%, -50%) rotate(45deg);
      }

  .relationships-editor--open .relationships-editor__cross::after {
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);
                transform: translate(-50%, -50%) rotate(-45deg);
      }

  .relationships-editor--open .relationships-editor__content {
      margin-top: 4rem;
    }

  .relationships-editor--open .relationships-editor__content .relationships-editor__content-row,
      .relationships-editor--open .relationships-editor__content .relationships-editor__content-row-quote,
      .relationships-editor--open .relationships-editor__content > .relationships-editor__add-button__wrapper {
        opacity: 1;
      }

  .relationships-editor--open .relationships-editor__content .relationships-editor__content-row:nth-child(1), .relationships-editor--open .relationships-editor__content .relationships-editor__content-row-quote:nth-child(1), .relationships-editor--open .relationships-editor__content > .relationships-editor__add-button__wrapper:nth-child(1) {
          -webkit-transition-delay: 0.3s;
                  transition-delay: 0.3s;
        }

  .relationships-editor--open .relationships-editor__content .relationships-editor__content-row:nth-child(2), .relationships-editor--open .relationships-editor__content .relationships-editor__content-row-quote:nth-child(2), .relationships-editor--open .relationships-editor__content > .relationships-editor__add-button__wrapper:nth-child(2) {
          -webkit-transition-delay: 0.4s;
                  transition-delay: 0.4s;
        }

  .relationships-editor--open .relationships-editor__content .relationships-editor__content-row:nth-child(3), .relationships-editor--open .relationships-editor__content .relationships-editor__content-row-quote:nth-child(3), .relationships-editor--open .relationships-editor__content > .relationships-editor__add-button__wrapper:nth-child(3) {
          -webkit-transition-delay: 0.5s;
                  transition-delay: 0.5s;
        }

  .relationships-editor--open .relationships-editor__content .relationships-editor__content-row:nth-child(4), .relationships-editor--open .relationships-editor__content .relationships-editor__content-row-quote:nth-child(4), .relationships-editor--open .relationships-editor__content > .relationships-editor__add-button__wrapper:nth-child(4) {
          -webkit-transition-delay: 0.6s;
                  transition-delay: 0.6s;
        }

  /* 🦵 */

  .relationships-editor__body-part {
    width: 100%;
    padding: 0 0 3rem;
  }

  @media (min-width: 768px) {

  .relationships-editor__body-part {
      width: 50%;
      padding: 0 2rem
  }
    }

  .relationships-editor__body-part:last-child {
      padding: 0 0 1.3rem;
    }

  @media (min-width: 768px) {

  .relationships-editor__body-part:last-child {
        padding: 0 0 0 2rem
    }
      }

  .relationships-editor__body-part .editable-quote__actions {
      -webkit-box-pack: end;
              justify-content: flex-end;
    }

  @media (min-width: 768px) {

  .relationships-editor__body-part .editable-quote__actions {
        -webkit-box-pack: start;
                justify-content: flex-start
    }
      }

.memory-request__buttons {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: start;
            justify-content: flex-start;
  }

    @media (min-width: 768px) {.memory-request__buttons {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-pack: center;
              justify-content: center
  }
    }

    @media (min-width: 1024px) {.memory-request__buttons {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column
  }
    }

    @media (min-width: 1355px) {.memory-request__buttons {
      -webkit-box-pack: start;
              justify-content: flex-start;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row
  }
    }

    @media (min-width: 768px) {

    .memory-request__buttons button {
        margin: 0
    }
      }
  .memory-request__buttons-separator {
    margin: 1.5rem 0;
  }
  @media (min-width: 768px) {
  .memory-request__buttons-separator {
      margin: 0 1.5rem
  }
    }
  @media (min-width: 1024px) {
  .memory-request__buttons-separator {
      margin: 1.5rem 0
  }
    }
  @media (min-width: 1355px) {
  .memory-request__buttons-separator {
      margin: 0 1.5rem
  }
    }
  .memory-request__request-pending {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
            justify-content: space-between;
  }
  .memory-request__request-pending__copy {
      margin-right: 5.3rem;
    }
  .memory-request__request-pending span {
      width: 35rem;
      height: 2rem;

      background: var(--scooter);

      display: -webkit-box;

      display: flex;
      align-self: flex-start;
      -webkit-box-align: center;
              align-items: center;
      -webkit-box-pack: center;
              justify-content: center;

      font-size: 1.1rem;
      line-height: 1.3rem;
      text-align: center;
      text-transform: uppercase;
      color: var(--white);
      border-radius: 20px;
    }
  @media (min-width: 768px) {
  .memory-request__request-pending span {
        width: 14rem;
        height: 2.5rem;
    }
      }

.relationship-tag {
  font-size: 1.4rem;
  font-family: var(--font-heading);

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;

  border-top: 1px solid rgba(255, 255, 255, 0.5);
}

  .relationship-tag:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  }

  .relationship-tag--open {
  }

  .relationship-tag--dragging,
  .relationship-tag--drag-preview {
    cursor: move;
  }

  .relationship-tag--drag-preview {
    border: none;
  }

  .relationship-tag--drag-preview:last-child {
      border: none;
    }

  .relationship-tag__head {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    -webkit-box-align: center;
            align-items: center;

    padding: 0.7rem 0;

    font-family: var(--font-paragraph);
    color: var(--white);
    line-height: 1.2;

    -webkit-transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1);

    transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transition-property: color, background-color, opacity, -webkit-transform;
    transition-property: color, background-color, opacity, -webkit-transform;
    transition-property: color, background-color, opacity, transform;
    transition-property: color, background-color, opacity, transform, -webkit-transform;
  }

  .relationship-tag--open .relationship-tag__head {
      background: rgba(255, 255, 255, 0.1);
    }

  .relationship-tag--drag-preview .relationship-tag__head {
      background: var(--white);
      color: var(--lifeline-relationships);
      -webkit-transform: scale(0.95) rotate(0deg);
              transform: scale(0.95) rotate(0deg); /* **jc** */
    }

  .relationship-tag__handle {
    display: block;
    padding: 1rem;

    cursor: pointer;
  }

  .relationship-tag--no-drag .relationship-tag__handle {
      display: none;
    }

  .relationship-tag--dragging .relationship-tag__handle {
      width: 100%;
      padding: 0 1rem;
      opacity: 0.5;
    }

  .relationship-tag__handle::before {
      content: '';
      display: block;
      width: 0.8rem;
      height: 1.4rem;

      background: url(https://www.memories.com/assets/images/drag-handle--dd4bc226c632cb8994808dc693fb6423.svg) center /
        contain;
    }

  .relationship-tag--dragging .relationship-tag__handle::before {
        width: 100%;
        height: 4rem;

        background: none;
        border: 1px dashed currentColor;
        border-radius: 0.4rem;
      }

  .relationship-tag__index {
    width: 2.4rem;
    padding: 0 0.2rem 0 1rem;

    font-weight: 500;
    font-size: 15px;
    line-height: 1;
    text-align: center;
  }

  .relationship-tag--dragging .relationship-tag__index {
      display: none;
    }

  .relationship-tag__picture {
    flex-shrink: 0;

    width: 4.2rem;
    height: 4.2rem;
    margin: 0 1.4rem 0 0.6rem;

    border-radius: 50%;

    background: var(--gallery) no-repeat center / cover;
  }

  @media (min-width: 768px) {

  .relationship-tag__picture {
      margin: 0 1.4rem 0 1.2rem
  }
    }

  .relationship-tag--dragging .relationship-tag__picture {
      display: none;
    }

  .relationship-tag__info {
    -webkit-box-flex: 1;
            flex-grow: 1;
    flex-basis: 0;
    overflow: hidden;
  }

  @media (min-width: 768px) {

  .relationship-tag__info {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-align: center;
              align-items: center;
      -webkit-box-pack: end;
              justify-content: flex-end
  }
    }

  .relationship-tag--dragging .relationship-tag__info {
      display: none;
    }

  .relationship-tag__help .text {
      display: none;
    }

  .relationship-tag__help .icon {
      display: -webkit-inline-box;
      display: inline-flex;
    }

  @media (min-width: 768px) {

  .relationship-tag__help {
      display: block;

      min-width: 12rem;
      text-align: right
  }

      .relationship-tag__help .text {
        display: inline;
      }
      .relationship-tag__help .icon {
        display: none;
      }
    }

  @media (min-width: 1024px) and (max-width: 1199px) {

  .relationship-tag__help {
      display: block;

      width: 8rem;
      min-width: 8rem
  }

      .relationship-tag__help .text {
        display: none;
      }
      .relationship-tag__help .icon {
        display: -webkit-inline-box;
        display: inline-flex;
      }
    }

  .relationship-tag--dragging .relationship-tag__help {
      display: none;
    }

  .relationship-tag__name,
  .relationship-tag__relationship {
    line-height: 1.2;
    text-align: left;
  }

  @media (min-width: 768px) {

  .relationship-tag__name,
  .relationship-tag__relationship {
      width: calc(50% - 0.8rem);
      white-space: nowrap
  }
    }

  .relationship-tag__name {
    font-weight: 500;
    font-size: 1.5rem;

    overflow: hidden;
    text-overflow: ellipsis;
  }

  .relationship-tag__relationship {
    font-size: 1.4rem;
  }

  @media (min-width: 768px) {

  .relationship-tag__relationship {
      margin-left: 3.2rem;

      font-size: 1.5rem
  }
    }

  .relationship-tag__actions .text {
      display: none;
    }

  .relationship-tag__actions .icon {
      display: -webkit-inline-box;
      display: inline-flex;
    }

  @media (min-width: 768px) {

  .relationship-tag__actions {
      display: block;

      min-width: 12rem;
      text-align: right
  }

      .relationship-tag__actions .text {
        display: inline;
      }
      .relationship-tag__actions .icon {
        display: none;
      }
    }

  @media (min-width: 1024px) and (max-width: 1199px) {

  .relationship-tag__actions {
      display: block;

      width: 8rem;
      min-width: 8rem
  }

      .relationship-tag__actions .text {
        display: none;
      }
      .relationship-tag__actions .icon {
        display: -webkit-inline-box;
        display: inline-flex;
      }
    }

  .relationship-tag--dragging .relationship-tag__actions {
      display: none;
    }

  .relationship-tag__toggle {
    width: 4rem;
    height: 4rem;
    padding: 1rem;

    position: relative;
  }

  .relationship-tag__toggle::before,
    .relationship-tag__toggle::after {
      content: '';
      display: block;
      height: 1px;
      width: 2rem;

      background: currentColor;

      position: absolute;
      top: 50%;
      left: 50%;

      -webkit-transform: translateX(-50%);

              transform: translateX(-50%);
    }

  .relationship-tag__toggle::before {
      -webkit-transform: translateX(-50%) rotate(-90deg);
              transform: translateX(-50%) rotate(-90deg);

      -webkit-transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1);

      transition: 1.2s cubic-bezier(0.23, 1, 0.32, 1);
      -webkit-transition-property: opacity, -webkit-transform;
      transition-property: opacity, -webkit-transform;
      transition-property: transform, opacity;
      transition-property: transform, opacity, -webkit-transform;
    }

  .relationship-tag--open .relationship-tag__toggle::before {
        -webkit-transform: translateX(-50%) rotate(-90deg) scaleX(0.75);
                transform: translateX(-50%) rotate(-90deg) scaleX(0.75);
        opacity: 0;
      }

  .relationship-tag--dragging .relationship-tag__toggle {
      display: none;
    }

  .relationship-tag__action-icon {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;
    width: 32px;
    height: 32px;
    background-color: white;
    border-radius: 16px;
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
  }

  .relationship-tag__action-icon:hover {
      background-color: rgba(255, 255, 255, 0.5);
    }

  .relationship-tag__action {
    padding: 0.1rem 0.5rem;

    font-size: 1.2rem;
    font-weight: normal;

    /* text-decoration: underline; */
    border-bottom: 1px solid transparent;
    -webkit-transition: border-color var(--transition-duration--fast);
    transition: border-color var(--transition-duration--fast);
  }

  @media (min-width: 768px) {

  .relationship-tag__action {
      padding: 0.1rem 0rem;
      margin: 0 0.4rem;
      font-size: 1.5rem
  }

      .relationship-tag__action:hover,
      .relationship-tag__action:active,
      .relationship-tag__action:focus {
        opacity: 0.7;
      }
    }

  @media (min-width: 1200px) {

  .relationship-tag__action {
      /* padding: 0.1rem 0.6rem; */
      padding: 0.1rem 0rem;
      margin: 0 0.9rem
  }

      .relationship-tag__action:hover,
      .relationship-tag__action:active,
      .relationship-tag__action:focus {
        border-bottom: 1px solid #fff;
      }
    }

  .relationship-tag__action--request {
    }

  .relationship-tag__action--request-sent {
      display: -webkit-inline-box;
      display: inline-flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-align: center;
              align-items: center;

      opacity: 0.6;
      text-decoration: none;
      cursor: default;
      pointer-events: none;
    }

  .relationship-tag__action--edit {
    }

  .relationship-tag__action--remove {
    }

  .relationship-tag__action span {
      vertical-align: middle;
    }

  .relationship-tag__action-checkmark {
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    margin-right: 1rem;

    vertical-align: middle;
  }

  .relationship-tag__action-checkmark svg {
      display: block;
    }

  .relationship-tag__action-checkmark svg path {
        stroke: white;
      }

  .relationship-tag__body {
    display: none;
    padding: 1.7rem 0 2.8rem;
  }

  @media (min-width: 768px) {

  .relationship-tag__body {
      padding-top: 2.8rem
  }
    }

  .relationship-tag--open-enter .relationship-tag__body {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      -webkit-box-align: start;
              align-items: flex-start;
      flex-wrap: wrap;

      max-height: 0;
      padding: 0;

      -webkit-transition: max-height 0.4s cubic-bezier(0.86, 0, 0.07, 1),
        padding 0.4s cubic-bezier(0.86, 0, 0.07, 1);

      transition: max-height 0.4s cubic-bezier(0.86, 0, 0.07, 1),
        padding 0.4s cubic-bezier(0.86, 0, 0.07, 1);
      overflow: hidden;
    }

  @media (min-width: 768px) {

  .relationship-tag--open-enter .relationship-tag__body {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
                flex-direction: row
    }
      }

  .relationship-tag--open .relationship-tag__body {
      max-height: 1000px;
      padding: 1.7rem 0 2.8rem;
    }

  @media (min-width: 768px) {

  .relationship-tag--open .relationship-tag__body {
        padding-top: 2.8rem
    }
      }

  .relationship-tag__body-actions {
    display: block;
    width: 100%;
    margin-bottom: 4.5rem;
    text-align: right;
  }

  @media (min-width: 768px) {

  .relationship-tag__body-actions {
      display: none
  }
    }

  /* 🦵 */

  .relationship-tag__body-part {
    width: 100%;
    padding: 0 0 3rem;
  }

  @media (min-width: 768px) {

  .relationship-tag__body-part {
      width: 50%;
      padding: 0 2rem
  }
    }

  .relationship-tag__body-part:last-child {
      padding: 0 0 1.3rem;
    }

  @media (min-width: 768px) {

  .relationship-tag__body-part:last-child {
        padding: 0 0 0 2rem
    }
      }

  .relationship-tag__body-part .editable-quote__actions {
      -webkit-box-pack: end;
              justify-content: flex-end;
    }

  @media (min-width: 768px) {

  .relationship-tag__body-part .editable-quote__actions {
        -webkit-box-pack: start;
                justify-content: flex-start
    }
      }

.relationships-list + .relationships-list {
    margin-top: 6rem;
  }

    @media (min-width: 768px) {.relationships-list + .relationships-list {
      margin-top: 2.5rem
  }
    }
  .relationships-list__heading {
    margin-bottom: 0.7rem;

    font-weight: normal;
    font-size: 1.8rem;
    line-height: 1.2em;
    color: var(--white);
    text-align: left;
  }
  .relationships-list__drop-area {
    height: 5.6rem;
  }

.relationships-lists {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;

  flex-shrink: 1;

  width: 100%;
  margin-top: auto; /* **jc** */
  margin-left: 0; /* **jc** */
  margin-right: 0; /* **jc** */
  margin-bottom: 5rem; /* **jc** */
  position: relative;
  overflow: hidden;

  opacity: 0;
  pointer-events: none;

  -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

  transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
}

  .relationships-lists--visible {
    opacity: 1;
    pointer-events: auto;
  }

  .relationships-lists::before,
  .relationships-lists::after {
    content: '';
    display: block;
    width: 100%;
    height: 10rem;
    min-height: 10rem;

    position: absolute;
    left: 0;
    z-index: 100;

    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-transition: opacity 0.2s ease-out;

    transition: opacity 0.2s ease-out;
    opacity: 0;
  }

  .relationships-lists::before {
    top: 0;

    background: -webkit-gradient(
      linear,
      left top, left bottom,
      from(var(--lifeline-relationships)),
      to(rgba(48, 179, 197, 0))
    );

    background: linear-gradient(
      to bottom,
      var(--lifeline-relationships) 0%,
      rgba(48, 179, 197, 0) 100%
    );
  }

  .relationships-lists::after {
    bottom: 0;

    background: -webkit-gradient(
      linear,
      left top, left bottom,
      from(rgba(48, 179, 197, 0)),
      to(var(--lifeline-relationships))
    );

    background: linear-gradient(
      to bottom,
      rgba(48, 179, 197, 0) 0%,
      var(--lifeline-relationships) 100%
    );
  }

  .relationships-lists--scrollable-up::before,
  .relationships-lists--scrollable-down::after {
    opacity: 1;
  }

  .relationships-lists__inner {
    height: 100%;
    overflow: auto;
  }

.relationships-connections {
  max-height: calc(100% - 52px - 7.1vh);
  z-index: 2;
  /* **jc**
  + .step-actions {
    z-index: 1;
    display: block;

    .step-actions__error {
      position: absolute;
    }
  }*/
}

  .relationships-connections .step__inner {
    display: -webkit-box;
    display: flex;

    flex-shrink: 0;
    -webkit-box-flex: 1;
            flex-grow: 1;
    height: auto;

    position: relative;
  }

  @media (min-width: 768px) {

  .relationships-connections .step__inner {
      flex-shrink: 1;
      flex-basis: 0px
      /* height: 0;
      min-height: 0; */
  }
    }

  @media (min-width: 1024px) {

  .relationships-connections .step__inner {
      flex-shrink: 1;
      flex-basis: 0px;
      height: 0;
      min-height: 0
  }
    }

  .relationships-connections .step__inner > .editor-container {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      -webkit-box-align: center;
              align-items: center;

      /* height: 100%; */
    }

.relationship-photo {
  -webkit-box-flex: 1;
          flex-grow: 1;
  flex-basis: calc(33.33% - 1.2rem);
  padding: 1.7rem 0.6rem;

  position: relative;

  -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

  transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
}

  @media (min-width: 768px) {.relationship-photo {
    flex-basis: 0;
    padding: 0.6rem
}
  }

  .relationship-photo::before,
  .relationship-photo::after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 1px;

    background: var(--white);

    position: absolute;
    top: 50%;
    left: 50%;

    -webkit-transform: translateX(-50%);

            transform: translateX(-50%);

    -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

    transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    opacity: 0;
    pointer-events: none;
  }

  .relationship-photo::after {
    -webkit-transform: translateX(-50%) rotate(-90deg);
            transform: translateX(-50%) rotate(-90deg);
  }

  .relationship-photo--selected {
  }

  .relationship-photo--active::before,
    .relationship-photo--active::after {
      opacity: 1;
    }

  .relationship-photo--loading::before,
    .relationship-photo--loading::after {
      opacity: 0;
    }

  .relationship-photo--empty {
  }

  .relationship-photo--disabled {
    opacity: 0.5;
    pointer-events: none;
  }

  .relationship-photo--choosable-as-fav {
    cursor: pointer;
    opacity: 0.4;
  }

  .relationship-photo__inner {
    width: 100%;
    height: 0;
    padding-bottom: 100%;

    position: relative;

    border: 1px dashed var(--white);

    -webkit-transition: border-color 1.2s cubic-bezier(0.23, 1, 0.32, 1);

    transition: border-color 1.2s cubic-bezier(0.23, 1, 0.32, 1);
  }

  .relationship-photo__inner::after {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      box-sizing: border-box;

      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      z-index: 2;

      border: 0.5rem solid var(--smalt);

      -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

      transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

      opacity: 0;
      pointer-events: none;
    }

  .relationship-photo--selected .relationship-photo__inner {
      border: none;
      background: rgba(255, 255, 255, 0.4);
    }

  .relationship-photo--choosable-as-fav .relationship-photo__inner,
    .relationship-photo--active .relationship-photo__inner {
      cursor: pointer;
    }

  .relationship-photo--favourite .relationship-photo__inner::after {
        opacity: 1;
      }

  .relationship-photo__input {
    display: none;
  }

  .relationship-photo__image {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 2;

    opacity: 1;
    -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

    -o-object-fit: cover;

       object-fit: cover;
  }

  .relationship-photo__image--loading {
      opacity: 0;
    }

  .relationship-photo__remove-button {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;
    width: 100%;
    padding: 0;
    margin-top: 0.6rem;

    position: absolute;
    top: 100%;
    left: 0;

    background: none;
    outline: none;
    border: none;

    font-weight: normal;
    font-size: 1.1rem;
    line-height: 1.3rem;
    -webkit-text-decoration-line: underline;
            text-decoration-line: underline;

    color: var(--white);

    opacity: 0;
    pointer-events: none;

    -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

    transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
  }

  .relationship-photo__remove-button--visible {
      pointer-events: auto;
      opacity: 1;
    }

  .relationship-photo .loading-shape {
    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;

    -webkit-transform: none;

            transform: none;
  }

  .relationship-photo .loading-shape.hidden {
      -webkit-transition: none;
      transition: none;
    }

  .relationship-photo .loading-shape .svg {
      display: block;
      width: 66%;
      height: 66%;

      position: absolute;
      top: 50%;
      left: 50%;

      -webkit-transform: translate(-50%, -50%);

              transform: translate(-50%, -50%);
    }

  .relationship-photo .loading-shape .svg svg {
        width: 100%;
        height: 100%;
      }

.relationship-group-photos {
  margin-top: 6rem;
}

  .relationship-group-photos__label {
    font-size: 1.8rem;
    line-height: 1.22em;
    text-align: center;
  }

  .relationship-group-photos__error {
    /* **jc** */
    display: -webkit-box;
    display: flex;

    margin-top: 2rem;
    font-size: 1.5rem;
    line-height: 1.5em;
    -webkit-box-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
            justify-content: center;
    color: var(--bright-red);
  }

  .relationship-group-photos__error .svg--cross {
      width: 1.3rem;
      height: 1.3rem;

      display: inline-block;

      margin-right: 0.8rem;
      margin-bottom: 0.5rem;
    }

  .relationship-group-photos__error .svg--cross path {
        stroke: var(--bright-red);
      }

  .relationship-group-photos__items {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    flex-wrap: wrap;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: start;
            justify-content: flex-start;

    position: relative;

    margin: 0.5rem -0.6rem 0;
  }

  @media (min-width: 768px) {

  .relationship-group-photos__items {
      flex-wrap: nowrap
  }
    }

  .relationship-group-photos__full-label {
    display: none;
  }

  @media (min-width: 768px) {

  .relationship-group-photos__full-label {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-align: center;
              align-items: center;

      position: absolute;
      bottom: calc(100% + 0.7rem);
      right: 0.6rem;

      -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

      transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);

      pointer-events: none;
      opacity: 0;

      font-size: 1.1rem;
      line-height: 1.18em;
      text-align: right
  }

      .relationship-group-photos__full-label::before {
        content: '';
        display: block;
        width: 1.3rem;
        height: 1.3rem;
        margin-right: 0.4rem;

        background: url(https://www.memories.com/assets/images/check-white--2e64e504c6890d8730107721d0e9f351.svg)
          no-repeat center / contain;
      }

      .relationship-group-photos__full-label--visible {
        opacity: 1;
        pointer-events: auto;
      }
    }

.relationship-groups-photos {
}

@media (min-width: 768px) {.relationships-loved-ones-photo {
    padding-top: 6vh
}
  }
  @media (min-width: 1024px) {.relationships-loved-ones-photo {
    padding-top: 9vh
}
  }
  .relationships-loved-ones-photo .memories-editor-display {
    margin-bottom: 6rem;
  }
  .relationships-loved-ones-photo .editor-container {
    position: relative;
  }
  .relationships-loved-ones-photo__image-upload-wrapper {
    -webkit-transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }
  .relationships-loved-ones-photo__image-upload-wrapper--translated {
      -webkit-transform: translateY(-2.4rem);
              transform: translateY(-2.4rem);
      -webkit-transition-delay: 0.3s;
              transition-delay: 0.3s;
    }
  @media (min-width: 768px) {
  .relationships-loved-ones-photo__image-upload-wrapper {
      -webkit-transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic)
  }

      .relationships-loved-ones-photo__image-upload-wrapper--translated {
        -webkit-transform: translateY(calc(-1 * ((7rem + 8vh) / 2)));
                transform: translateY(calc(-1 * ((7rem + 8vh) / 2)));
        -webkit-transition-delay: 0.3s;
                transition-delay: 0.3s;
      }
    }

.memories-editor-display--wrapper {
  margin: 0 -2rem;

  position: relative;
}

  @media (min-width: 768px) {.memories-editor-display--wrapper {
    margin: 0
}
  }

  .memories-editor-display--wrapper--gradient {
    position: relative;
  }

  .memories-editor-display--wrapper .memories-editor-display--gradient {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    pointer-events: none;
    background-image: -webkit-gradient(
      linear,
      left top, right top,
      from(rgba(48, 179, 197, 1)),
      color-stop(10%, rgba(48, 179, 197, 0)),
      color-stop(90%, rgba(48, 179, 197, 0)),
      to(rgba(48, 179, 197, 1))
    );
    background-image: linear-gradient(
      to right,
      rgba(48, 179, 197, 1),
      rgba(48, 179, 197, 0) 10%,
      rgba(48, 179, 197, 0) 90%,
      rgba(48, 179, 197, 1)
    );
    opacity: 0;
    -webkit-transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
    transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1);
  }

  .memories-editor-display--wrapper .memories-editor-display--gradient__left__visible {
      opacity: 1;
    }

  @media (min-width: 768px) {

  .memories-editor-display--wrapper .memories-editor-display--gradient {
      width: 100%;
      left: 0%
  }
    }

  .memories-editor-display--wrapper .memories-editor-display--gradient__right {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    pointer-events: none;
    background-image: -webkit-gradient(
      linear,
      left top, right top,
      from(rgba(48, 179, 197, 0)),
      color-stop(10%, rgba(48, 179, 197, 0)),
      color-stop(90%, rgba(48, 179, 197, 0)),
      to(rgba(48, 179, 197, 1))
    );
    background-image: linear-gradient(
      to right,
      rgba(48, 179, 197, 0),
      rgba(48, 179, 197, 0) 10%,
      rgba(48, 179, 197, 0) 90%,
      rgba(48, 179, 197, 1)
    );
    opacity: 0;
    -webkit-transition: opacity 1.6s;
    transition: opacity 1.6s;
  }

  .memories-editor-display--wrapper .memories-editor-display--gradient__right__visible {
      opacity: 1;
    }

.memories-editor-display {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  flex-wrap: nowrap;
  justify-items: flex-start;
  overflow: auto;
  margin: 2.8rem -2rem 1rem;
  padding: 2rem 0 3rem;
  -webkit-transition: var(--transition-duration--normal)
    var(--transition-ease--out-quintic) 0.3s;
  transition: var(--transition-duration--normal)
    var(--transition-ease--out-quintic) 0.3s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
}

@media (min-width: 768px) {

.memories-editor-display {
    display: grid;
    grid-template-columns: repeat(var(--memories-display-items), 1fr);
    grid-column-gap: 0.9rem;
    justify-items: normal;
    margin: 4.8rem 0 2rem;
    padding: 0;
    overflow: visible;
    -webkit-transition-property: opacity;
    transition-property: opacity
}
  }

@media (min-width: 769px) and (min-height: 900px) {

.memories-editor-display {
    margin: 5.4rem 0 2rem
}
  }

@media (min-width: 769px) and (min-height: 980px) {

.memories-editor-display {
    margin: 5.4rem 0 7rem
}
  }

@media (min-width: 1024px) {

.memories-editor-display {
    grid-column-gap: 1.5rem
}
  }

.memories-editor-display--ul-wrapper {
    padding: 0 2rem;
    overflow: hidden;
  }

@media (min-width: 768px) {

.memories-editor-display--ul-wrapper {
      padding: 0;
      margin-left: 0%
  }
    }

@media (min-width: 768px) {

.memories-editor-display--ul-wrapper--photo,
    .memories-editor-display--ul-wrapper--gradient {
        margin-left: 2.5rem
    }
      }

.memories-editor-display.memories-editor-display__infinite {
    overflow-y: visible;
    overflow-x: visible;
    margin-top: 0;
    padding-top: 2rem;
    display: -webkit-box;
    display: flex;
    -webkit-transition: -webkit-transform var(--transition-duration--normal);
    transition: -webkit-transform var(--transition-duration--normal);
    transition: transform var(--transition-duration--normal);
    transition: transform var(--transition-duration--normal), -webkit-transform var(--transition-duration--normal);
    -webkit-transform: translateX(calc(var(--ul-slider-constant) * (11.4rem + 1.5rem)));
            transform: translateX(calc(var(--ul-slider-constant) * (11.4rem + 1.5rem)));
  }

@media (min-width: 768px) {

.memories-editor-display.memories-editor-display__infinite {
      -webkit-transform: translateX(
        calc(
          var(--ul-slider-constant) *
            ((90% - (2.5rem * 0)) / var(--memories-display-items))
        )
      );
              transform: translateX(
        calc(
          var(--ul-slider-constant) *
            ((90% - (2.5rem * 0)) / var(--memories-display-items))
        )
      )
  }
    }

.memories-editor-display.memories-editor-display__infinite .memories-editor-display--item--wrapper {
      margin-right: 1.5rem;
      margin-left: 0;
    }

@media (min-width: 768px) {

.memories-editor-display.memories-editor-display__infinite .memories-editor-display--item--wrapper {
        width: calc(
          (90% - (2.5rem * var(--memories-display-items))) /
            var(--memories-display-items)
        );
        margin-right: 2.5rem
    }
      }

.memories-editor-display.memories-editor-display__infinite.memories-editor-display--photos,
    .memories-editor-display.memories-editor-display__infinite.memories-editor-display--grad {
      -webkit-transform: translateX(
        calc(var(--ul-slider-constant) * (6.4rem + 1.5rem))
      );
              transform: translateX(
        calc(var(--ul-slider-constant) * (6.4rem + 1.5rem))
      );
    }

@media (min-width: 768px) {

.memories-editor-display.memories-editor-display__infinite.memories-editor-display--photos .memories-editor-display--item--wrapper, .memories-editor-display.memories-editor-display__infinite.memories-editor-display--grad .memories-editor-display--item--wrapper {
          width: calc(
            (100% - (2.5rem * var(--memories-display-items))) /
              var(--memories-display-items)
          )
      }
        }

.memories-editor-display.memories-editor-display__infinite.p-e--none > * {
      pointer-events: none;
    }

.memories-editor-display.hide {
    opacity: 0;
    pointer-events: none;
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
  }

@media (min-width: 768px) {

.memories-editor-display.hide {
      margin-top: 4.8rem;
      margin-bottom: 2rem
  }
    }

@media (min-width: 769px) and (min-height: 900px) {

.memories-editor-display.hide {
      margin-top: 5.4rem;
      margin-bottom: 2rem
  }
    }

@media (min-width: 769px) and (min-height: 980px) {

.memories-editor-display.hide {
      margin-top: 5.4rem;
      margin-bottom: 7rem
  }
    }

.memories-editor-display::after,
  .memories-editor-display::before {
    content: '';
    flex-shrink: 0;
    display: block;
    width: 2rem;
  }

@media (min-width: 768px) {

.memories-editor-display::after,
  .memories-editor-display::before {
      display: none
  }
    }

.memories-editor-display--item--wrapper {
    flex-shrink: 0;
    width: 11.4rem;
    padding: 0.8rem 1rem;
    position: relative;
    border: 1px dashed white;
  }

@media (min-width: 768px) {

.memories-editor-display--item--wrapper {
      padding: 0.4rem 0.6rem
  }
    }

@media (min-width: 1024px) {

.memories-editor-display--item--wrapper {
      padding: 0.8rem 1rem
  }
    }

.memories-editor-display--item--wrapper--filled {
      border: none;
    }

.memories-editor-display--photos .memories-editor-display--item--wrapper {
      width: 6.4rem;
      padding: 0;
    }

@media (min-width: 768px) {

.memories-editor-display--photos .memories-editor-display--item--wrapper {
        width: auto
    }
      }

.memories-editor-display--item--wrapper + .memories-editor-display--item--wrapper {
      margin-left: 1rem;
    }

@media (min-width: 768px) {

.memories-editor-display--item--wrapper + .memories-editor-display--item--wrapper {
        margin-left: 0
    }
      }

.memories-editor-display--item {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;

    max-width: 100%;
    min-height: 3.6em;

    font-family: var(--font-heading);
    font-size: 1.4rem;
    color: var(--smalt);
    text-align: left;
    word-break: break-word;
    line-height: 1.2em;

    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    overflow: hidden;

    cursor: pointer;
  }

/* **jc** */

@media (min-width: 768px) {

.memories-editor-display--item {
      font-size: 1.2rem
  }
    }

@media (min-width: 1024px) {

.memories-editor-display--item {
      font-size: 1.4rem
  }
    }

.memories-editor-display--photos .memories-editor-display--item {
      height: 0;
      padding: 0 0 100%;
      margin: 0;
    }

.memories-editor-display--photos .memories-editor-display--item--wrapper {
        position: relative;
      }

.memories-editor-display--photos .memories-editor-display--item--wrapper--filled {
          border: none;
        }

.memories-editor-display--photos .memories-editor-display--item.contents {
        border: 0;
        border-color: transparent;
      }

.memories-editor-display--text .memories-editor-display--item.contents {
        background: transparent;
      }

.memories-editor-display--item.editing {
      margin-top: 0;
    }

.memories-editor-display--text .memories-editor-display--item {
      overflow: hidden;
      max-height: 100%;
    }

.memories-editor-display--item--wrapper {
      text-overflow: ellipsis;
    }

.memories-editor-display--item--actions {
      display: -webkit-box;
      display: flex;
      -webkit-box-pack: justify;
              justify-content: space-between;

      padding-bottom: 0.7rem;
      font-size: 1.1rem;

      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      -webkit-transform: translateY(-100%);
              transform: translateY(-100%);
    }

.memories-editor-display--item--author {
      position: absolute;
      bottom: -0.7rem;
      left: 0;
      -webkit-transform: translateY(100%);
              transform: translateY(100%);

      font-size: 1.1rem;
    }

.memories-editor-display--item--edit {
      padding: 0;

      text-decoration: none;
      cursor: pointer;
    }

.memories-editor-display--item--edit:focus {
        text-decoration: underline;
      }

.memories-editor-display--item--remove {
      display: inline-block;
      width: 1.2rem;
      height: 1.2rem;

      background: url(https://www.memories.com/assets/images/cross-white--7f424bc7dadfe5c56521f57716b49d89.svg);
      background-size: contain;
      background-position: center;

      cursor: pointer;

      -webkit-transition: -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1);

      transition: -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1);

      transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);

      transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1);
    }

.memories-editor-display--item--remove:focus {
        -webkit-transform: scale(1.2);
                transform: scale(1.2);
      }

.memories-editor-display--text .memories-editor-display--item--wrapper--filled {
      background: var(--white);
    }

.memories-collection {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;

  position: relative;
  z-index: 1;
  height: 100%;
}

  .memories-collection .textarea {
    padding: 1rem 0;
    margin: 0 0 1.1rem;
  }

  @media (min-width: 768px) {

  .memories-collection .textarea {
      padding: 0
  }
    }

  @media (min-height: 900px) {

  .memories-collection .textarea {
      margin: 0 0 1.7rem
  }
    }

  .memories-collection .textarea textarea {
      font-size: 1.8rem;
      min-height: 11.8rem;
      max-height: 18rem;
    }

  @media (min-height: 900px) {

  .memories-collection .textarea textarea {
        font-size: 2rem;
        min-height: 18.1rem;
        max-height: 21rem
    }
      }

  @media (min-width: 768px) {

  .memories-collection__max-reached p {
        width: 29.7rem;
        margin: 16.6rem auto 0;
        font-size: 1.7rem;
        line-height: 2rem
    }
      }

  .memories-collection .memories-editor-display {
    margin-top: 0;
  }

  .memories-collection--actions {
    text-align: right;
  }

  .memories-collection--actions .button {
      margin: 0;
      font-size: 1.2rem;
    }

  .memories-collection__textarea-and-actions-wrapper {
    -webkit-transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
  }

  .memories-collection .memories-collection-popup .textarea textarea {
        min-height: 11.6rem;
      }

  @media (min-height: 900px) {

  .memories-collection .memories-collection-popup .textarea textarea {
          min-height: 21rem
      }
        }

  @media (min-width: 768px) {

  .memories-collection__editable-quote {
      margin-top: auto;
      margin-bottom: auto
  }
    }

  .memories-collection__editable-quote .simple-textarea__inner {
      padding: 2.3rem 3.1rem 3.8rem;
    }

  .memories-collection__editable-quote .simple-textarea__input {
      min-height: 14.6rem;

      font-family: var(--font-heading);
      font-weight: normal;
      font-size: 2rem;
      line-height: 1.4em;

      color: var(--smalt);
    }

  @media (min-width: 768px) {

  .memories-collection__editable-quote .simple-textarea__input {
        min-height: 15.4rem
    }
      }

  .memories-collection__editable-quote .simple-textarea__chars-countdown {
      padding: 1.9rem 1.7rem;
    }

  .memories-collection__editable-quote .editable-quote__actions {
      margin-top: 2rem;
      margin-left: 0;
      margin-right: 0;
      -webkit-box-pack: end;
              justify-content: flex-end;
    }

  .memories-collection__editable-quote .editable-quote__action {
      padding: 0.8rem 3.5rem;

      background: var(--smalt);
      border-radius: 3.2rem;
      color: white;
      font-size: 1.3rem;
      line-height: 1.6rem;
      text-decoration: none;
    }

  /* **jc** */

  .memories-collection__editable-quote .editable-quote__action--edit,
      .memories-collection__editable-quote .editable-quote__action--save {
        margin-right: 1rem;
      }

  .memories-collection__editable-quote .editable-quote__action--remove,
      .memories-collection__editable-quote .editable-quote__action--cancel {
        border-color: var(--smalt);
        border-width: 1px;
        border-style: solid;
        background: var(--relationships);
        color: var(--smalt);
        margin-right: 1rem;
      }

.relationships-memories {
  height: 63rem; /* **jc** */
  padding-bottom: 0;
}

  @media (min-width: 768px) {
    @media (min-height: 800px) {.relationships-memories {
      padding-bottom: 4.8rem
}
    }
  }

  @media (max-height: 899px) {.relationships-memories {
    padding-top: 5.3rem
}
  }

  .relationships-memories .step__inner {
    -webkit-box-flex: 1;
            flex-grow: 1;
    position: relative;
  }

  @media (min-height: 700px) {

  .relationships-memories .step__inner {
      margin-top: 3.4rem
  }
    }

  @media (min-width: 768px) {

  .relationships-memories .step__inner {
      padding-bottom: 0;
      position: unset;
      -webkit-box-flex: unset;
              flex-grow: unset;
      height: 100%
  }

      @media (min-height: 800px) {

  .relationships-memories .step__inner {
        margin-bottom: 3.4rem
  }
      }
    }

  .relationships-memories .step__inner .editor-container {
      height: 100%;
      position: absolute;
      width: 100%;
    }

  /* max-width: unset; */

  @media (min-width: 768px) {

  .relationships-memories .step__inner .editor-container {
        position: relative
    }
      }

  .relationships-memories--text {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, calc(-100% - 6rem));
            transform: translate(-50%, calc(-100% - 6rem));
    margin: 0;
    -webkit-transition-delay: 0.4s;
            transition-delay: 0.4s;
    -webkit-transition-duration: var(--transition-duration--fast);
            transition-duration: var(--transition-duration--fast);
    -webkit-transition-property: opacity;
    transition-property: opacity;
    width: 100%;
  }

  @media (min-width: 768px) {

  .relationships-memories--text {
      white-space: nowrap;
      -webkit-transform: translate(-50%, calc(-100% - 8rem));
              transform: translate(-50%, calc(-100% - 8rem))
  }
    }

  .relationships-memories--text__translated {
      -webkit-transform: translate(-50%, calc(-100% + 2rem));
              transform: translate(-50%, calc(-100% + 2rem));
    }

  @media (min-width: 768px) {

  .relationships-memories--text__translated {
        -webkit-transform: translate(-50%, calc(0% - 8rem));
                transform: translate(-50%, calc(0% - 8rem))
    }
      }

  .relationships-memories--text__hidden {
      -webkit-transition-delay: unset;
              transition-delay: unset;
      opacity: 0;
      z-index: 0;
    }

  .relationships-memories--text .tooltip::after {
        white-space: normal;
      }

  .relationships-memories .ask-for-help-cta {
    -webkit-transition-delay: 0.4s;
            transition-delay: 0.4s;
    -webkit-transition-duration: var(--transition-duration--fast);
            transition-duration: var(--transition-duration--fast);
    -webkit-transition-property: opacity;
    transition-property: opacity;
    opacity: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, 100%);
            transform: translate(-50%, 100%);
    width: 100%;
    z-index: 2;
    margin-top: 0;
  }

  @media (min-width: 768px) {

  .relationships-memories .ask-for-help-cta {
      -webkit-transform: translate(-50%, calc(50% + 3.4rem));
              transform: translate(-50%, calc(50% + 3.4rem))
  }
    }

  .relationships-memories .ask-for-help-cta__translated {
      -webkit-transform: translate(-50%, calc(100% + 8rem));
              transform: translate(-50%, calc(100% + 8rem));
    }

  @media (min-width: 768px) {

  .relationships-memories .ask-for-help-cta__translated {
        -webkit-transform: translate(-50%, calc(130% + 3.4rem));
                transform: translate(-50%, calc(130% + 3.4rem))
    }
      }

  .relationships-memories .ask-for-help-cta__hidden {
      -webkit-transition-delay: unset;
              transition-delay: unset;
      opacity: 0;
      z-index: 0;
    }

  .relationships-memories .ask-for-help-cta .span--size-large {
      display: none;
    }

  .relationships-memories .ask-for-help-cta--button {
      margin-top: 0;
    }

  .relationships-memories .ask-for-help-cta--button .button {
      margin-top: 0;
    }

  .relationships-memories .ask-for-help-cta .tooltip::after {
        left: auto;
        right: 2rem;
      }

  @media (min-width: 768px) {

  .relationships-memories .ask-for-help-cta .tooltip::after {
          left: 2rem;
          right: auto
      }
        }

.memory-template {
  min-height: 11rem;
  padding: 1.3rem 1.8rem 4rem;

  background: var(--white);

  position: relative;

  font-family: var(--font-heading);
  font-size: 1.6rem;
  line-height: 1.25em;
  text-align: left;
  color: var(--smalt);
}

  @media (min-width: 768px) {.memory-template {
    padding: 1.6rem 2.2rem 5.3rem;
    font-size: 1.7rem
}
  }

  @media (min-height: 768px) {.memory-template {
    font-size: 1.5rem;
    line-height: 18px
}
  }

  @media (min-height: 900px) {.memory-template {
    font-size: 1.7rem;
    line-height: 21px
}
  }

  @media (min-height: 980px) {
  }

  .memory-template .svg--round-plus::before {
    display: block;
    content: 'choose';

    position: absolute;
    /* width is set to fix blurry text bug */
    width: 100px;
    top: calc(50% - 0.3rem);
    -webkit-transform: translate(calc(-100% - 8px), -50%);
            transform: translate(calc(-100% - 8px), -50%);
    font-family: var(--font-paragraph);
    text-align: right;
    -webkit-font-smoothing: antialiased;
    text-transform: capitalize;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity var(--transition-duration--fast);
    transition: opacity var(--transition-duration--fast);
    line-height: 1.6rem;
  }

  .memory-template--plus {
    width: 2.7rem;
    height: 2.7rem;
    padding-top: 1rem;
    margin: auto 0 0 auto;
    cursor: pointer;

    position: absolute;
    right: 0.9rem;
    bottom: 0.5rem;
    box-sizing: content-box;
  }

  .memory-template--plus svg {
      width: 100%;
      height: 100%;
      display: block;
    }

  @media (min-width: 768px) {

  .memory-template--plus {
      right: 1rem;
      bottom: 0.9rem
  }
    }

  @media (min-width: 769px) and (max-height: 900px) {

  .memory-template--plus {
      padding-top: 0;
      right: 0.7rem;
      bottom: 0.3rem
  }
    }

  @media (min-width: 769px) and (max-height: 980px) {

  .memory-template--plus {
      padding-top: 0
  }
    }

  .memory-template--wrapper {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;

    width: 100%;
    height: 100%;

    overflow: hidden;
  }

.memory-templates {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(1, 1fr);

  -webkit-transition: margin-top var(--transition-duration--normal)
    var(--transition-ease--out-quintic);

  transition: margin-top var(--transition-duration--normal)
    var(--transition-ease--out-quintic);
  width: calc(100vw - 4rem);
  overflow-x: auto;
}

  @media (min-width: 768px) {.memory-templates {
    grid-template-rows: repeat(1, 1fr);
    grid-gap: 1.7rem;
    width: 100%;
    overflow: hidden
}
  }

  .memory-templates__translated {

    -webkit-transition-delay: 0.3s;

            transition-delay: 0.3s;
  }

  @media (min-width: 768px) {

  .memory-templates__translated {
      margin-bottom: 0;
  }
    }

  @media (min-width: 768px) and (min-height: 800px) {

  .memory-templates__translated {
      margin-bottom: 4rem;
  }
    }

  @media (min-width: 768px) and (min-height: 940px) {

  .memory-templates__translated {
      margin-bottom: 10rem;
  }
    }

.achievement-editor {
  width: 100%;
  /*max-width: 48.2rem;*/
  padding: 2rem 0 0;
  margin: 0 auto;

  position: relative;
  text-align: left;
  background: var(--white);
  color: var(--black);
}

  /*@media (min-height: 900px) {
    padding-bottom: 3.9rem;
  }*/

  @media (min-width: 768px) {.achievement-editor {
    padding: 1rem 0 0
}
  }

  .achievement-editor .achievement-editor__textarea-wrapper,
  .achievement-editor .date-range-type,
  .achievement-editor .achievement-editor--ranges,
  .achievement-editor .achievement-editor__save-wrapper,
  .achievement-editor .simple-image-upload--detail,
  .achievement-editor .image-upload-wrapper {
    opacity: 0;
    -webkit-transform: translateY(5rem);
            transform: translateY(5rem);
    -webkit-transition: opacity var(--transition-duration--instant)
        var(--transition-ease--out-quintic),
      -webkit-transform var(--transition-duration--instant) step-end;
    transition: opacity var(--transition-duration--instant)
        var(--transition-ease--out-quintic),
      -webkit-transform var(--transition-duration--instant) step-end;
    transition: transform var(--transition-duration--instant) step-end,
      opacity var(--transition-duration--instant)
        var(--transition-ease--out-quintic);
    transition: transform var(--transition-duration--instant) step-end,
      opacity var(--transition-duration--instant)
        var(--transition-ease--out-quintic),
      -webkit-transform var(--transition-duration--instant) step-end;
  }

  .achievement-editor--visible .achievement-editor__textarea-wrapper,
    .achievement-editor--visible .date-range-type,
    .achievement-editor--visible .achievement-editor--ranges,
    .achievement-editor--visible .achievement-editor__save-wrapper,
    .achievement-editor--visible .simple-image-upload--detail,
    .achievement-editor--visible .image-upload-wrapper {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);

      -webkit-transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic),
        -webkit-transform var(--transition-duration--normal)
          var(--transition-ease--out-quintic);

      transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic),
        -webkit-transform var(--transition-duration--normal)
          var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
          var(--transition-ease--out-quintic),
        opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
          var(--transition-ease--out-quintic),
        opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic),
        -webkit-transform var(--transition-duration--normal)
          var(--transition-ease--out-quintic);
    }

  .achievement-editor--visible .date-range-type {
      -webkit-transition-delay: 0.1s;
              transition-delay: 0.1s;
    }

  .achievement-editor--visible .achievement-editor--ranges {
      -webkit-transition-delay: 0.2s;
              transition-delay: 0.2s;
      z-index: 1;
    }

  .achievement-editor--visible .achievement-editor__save-wrapper {
      -webkit-transition-delay: 0.3s;
              transition-delay: 0.3s;
      margin-top: 3rem; /* **jc** */
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-pack: center;
              justify-content: center;
    }

  .achievement-editor--visible .simple-image-upload--detail,
    .achievement-editor--visible .image-upload-wrapper {
      -webkit-transition-delay: 0.4s;
              transition-delay: 0.4s;
    }

  .new-lifeline--editor .achievements-achievements .achievement-editor .input__bottom__error {
    background: transparent;
    color: var(--bright-red);
    margin: 0 0;
    display: none;
  }

  @media (min-width: 768px) {

  .new-lifeline--editor .achievements-achievements .achievement-editor .input__bottom__error {
      margin: 2rem 0 0
  }
    }

  @media (min-width: 1024px) {

  .new-lifeline--editor .achievements-achievements .achievement-editor .input__bottom__error {
      margin: 0;
      padding: 0
  }
    }

  .new-lifeline--editor .achievements-achievements .achievement-editor .input__bottom__error.input__bottom__error--visible {
      display: -webkit-box;
      display: flex;
    }

  @media (min-width: 1024px) {

  .new-lifeline--editor .achievements-achievements .achievement-editor .input__bottom__error.input__bottom__error--generic.input__bottom__error--visible {
          margin-top: 4rem
      }
        }

  .achievement-editor .image-upload-wrapper {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;
  }

  .achievement-editor .image-upload-wrapper .button {
      padding: 1rem 1.4rem;
    }

  .achievement-editor .simple-image-upload--detail {
    margin: 0 0 1rem;
    display: -webkit-box;
    display: flex;
  }

  @media (min-width: 768px) {

  .achievement-editor .simple-image-upload--detail {
      margin: 0 /* **jc** */
  }
    }

  @media (min-width: 1024px) {

  .achievement-editor .simple-image-upload--detail {
      margin-top: 2rem
  }
    }

  .achievement-editor .simple-image-upload--detail img {
      width: 4.5rem;
      height: 4.5rem;
    }

  @media (min-width: 768px) {

  .achievement-editor .simple-image-upload--detail img {
        width: 3.5rem;
        height: 3.5rem
    }
      }

  .achievement-editor .simple-image-upload--detail--right {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
    }

  .achievement-editor .simple-image-upload--detail--right .underline {
        margin-left: 1.5rem;
      }

  .achievement-editor .simple-image-upload--detail--right .underline::after {
          width: 4.3rem;
        }

  .achievement-editor .simple-image-upload--detail--right span {
        margin-bottom: 0.6rem;
      }

  @media (min-width: 768px) {

  .achievement-editor .simple-image-upload--detail--right span {
          margin-bottom: 0
      }
        }

  @media (min-width: 768px) {

  .achievement-editor .simple-image-upload--detail--right {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
                flex-direction: row;
        -webkit-box-pack: justify;
                justify-content: space-between;
        width: 100%
    }
      }

  .achievement-editor .button--lifeline-achievements {
    margin-top: 1rem;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: flex;
  }

  @media (min-width: 768px) {

  .achievement-editor .button--lifeline-achievements {
      margin-top: 2.2rem
  }
    }

  .achievement-editor__cross {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0.6rem;
    right: 0.6rem;
    cursor: pointer;

    background: var(--maroon-flush);
    border-radius: 50%;

    -webkit-transform: rotate(45deg);

            transform: rotate(45deg);

    -webkit-transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
  }

  @media (min-width: 768px) {

  .achievement-editor__cross {
      top: 1.4rem;
      right: 1.4rem
  }
    }

  @media (min-width: 1024px) {

  .achievement-editor__cross {
      width: 32px;
      height: 32px;
      top: 1.2rem;
      right: 1.2rem
  }
    }

  .achievement-editor__cross::before,
    .achievement-editor__cross::after {
      content: '';
      display: block;

      width: 37.5%;
      height: 1px;

      position: absolute;
      top: 50%;
      left: 50%;

      background: var(--white);

      -webkit-transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      transition: transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic), -webkit-transform var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
    }

  .achievement-editor__cross::before {
      -webkit-transform: translate(-50%, -50%) rotate(45deg);
              transform: translate(-50%, -50%) rotate(45deg);
    }

  .achievement-editor__cross::after {
      -webkit-transform: translate(-50%, -50%) rotate(-45deg);
              transform: translate(-50%, -50%) rotate(-45deg);
    }

  .achievement-editor .textarea-wrapper {
    margin-bottom: 2rem;
  }

  .achievement-editor .textarea-wrapper .textarea {
      margin-bottom: 0;
    }

  @media (min-width: 1024px) {

  .achievement-editor .textarea-wrapper .textarea {
        margin-bottom: 4rem
    }
      }

  .achievement-editor .textarea-wrapper .input__bottom {
      margin: 0;
    }

  @media (min-width: 1024px) {

  .achievement-editor .textarea-wrapper .input__bottom {
        position: absolute;
        top: calc(100% + 1rem)
    }
      }

  .achievement-editor .textarea {
    border: 0.05rem solid var(--smalt);
    margin-top: 0;
    padding: 1.7rem 1.9rem;
  }

  @media (min-height: 900px) {

  .achievement-editor .textarea {
      padding: 1.7rem 1.9rem;
      /*margin-bottom: 3.2rem;*/
      margin-bottom: 4.4rem
  }
    }

  .achievement-editor .textarea--wrong {
      border: 0.05rem solid var(--bright-red);
    }

  .achievement-editor .textarea textarea {
      min-height: 8rem;
      font-size: 2rem;
    }

  @media (min-height: 900px) {

  .achievement-editor .textarea textarea {
        min-height: 12rem
    }
      }

  .achievement-editor .input__field {
    font-size: 1.5rem;
  }

  @media (min-width: 768px) {

  .achievement-editor .input__field {
      font-size: 2.2rem
  }
    }

  .achievement-editor .date-range-type label {
      position: relative;
      display: -webkit-inline-box;
      display: inline-flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-align: center;
              align-items: center;
      min-width: 9.5rem;
      margin-bottom: 2rem;
    }

  @media (min-width: 768px) {

  .achievement-editor .date-range-type label {
        margin-bottom: 2rem /* **jc** */
    }
      }

  .achievement-editor .date-range-type label:first-child {
        margin-right: 2.8rem;
      }

  .achievement-editor .date-range-type label span {
        left: 0;
        position: absolute;
        display: -webkit-inline-box;
        display: inline-flex;
        -webkit-box-pack: center;
                justify-content: center;
        -webkit-box-align: center;
                align-items: center;
        width: 1.7rem;
        height: 1.7rem;
        border: 0.1rem solid var(--smalt);
        border-radius: 50%;
        pointer-events: none;
      }

  .achievement-editor .date-range-type label .radio {
        display: inline-block;
        opacity: 0;
        width: 1.9rem;
        height: 1.9rem;
        margin: 0 0.6rem 0 0;
        border: none;
      }

  .achievement-editor .date-range-type label .radio:checked + span::before {
            content: '';
            display: block;
            width: 1.1rem;
            height: 1.1rem;
            background: var(--smalt);
            border-radius: 50%;
          }

  .achievement-editor .date-picker .input {
      margin-top: 0;
      padding: 0;
    }

  .achievement-editor .date-picker .input input {
        line-height: 1em;
        height: calc(1em + 2.5rem);
      }

  @media (min-width: 1024px) {

  .achievement-editor .date-picker .input__bottom {
          position: absolute;
          top: 108%
      }
        }

  .achievement-editor .date-picker .select .select--arrow {
        top: 0;
        right: 0;
        bottom: 1rem;
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
        display: -webkit-box;
        display: flex;
        height: 2.8rem;
        margin-left: 1rem;
      }

  .achievement-editor .date-picker .select .select--arrow svg {
          display: block;
          margin: auto;
        }

  .achievement-editor .date-picker .select--autocomplete-box {
        position: relative;
      }

  .achievement-editor .checkbox {
    display: inline-block;
    margin: 2.2rem 0 3.4rem;
  }

  @media (max-height: 768px) {

  .achievement-editor .checkbox {
      margin: 2rem 0 2rem
  }
    }

  .achievement-editor--ranges {
    position: relative;

    display: -webkit-box;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;

    margin-bottom: 1rem;
  }

  @media (min-width: 768px) {

  .achievement-editor--ranges {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-pack: justify;
              justify-content: space-between;
      margin-bottom: 2rem
  }
    }

  @media (min-width: 1024px) {

  .achievement-editor--ranges {
      margin-bottom: 3.5rem
  }
    }

  .achievement-editor--ranges .data-label-wrapper {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
    }

  @media (min-width: 768px) {

  .achievement-editor--ranges button {
        width: 16.2rem
    }
      }

  .achievement-editor--ranges > .data-label-wrapper .date-label {
      width: 100%;
      flex-basis: calc(50% - 1rem);
    }

  @media (min-width: 768px) {

  .achievement-editor--ranges > .data-label-wrapper .date-label {
        flex-basis: calc(50% - 1rem);
        margin-bottom: 0
    }
      }

  .achievement-editor--ranges > .data-label-wrapper .date-label .date-picker {
        margin: 0;
      }

  .achievement-editor--ranges > .data-label-wrapper .date-label .date-picker .select:last-child {
          flex-basis: 72%;
        }

  .achievement-editor--ranges > .data-label-wrapper .date-label .date-picker input {
          min-width: 5.5rem;
          font-size: 2rem;
        }

  @media (min-width: 768px) {

  .achievement-editor--ranges > .data-label-wrapper .date-label .date-picker input {
            min-width: 9.5rem
        }
          }

  @media (min-width: 768px) {
        .achievement-editor--ranges > .data-label-wrapper .date-label:first-child {
          margin-right: 2rem;
        }
      }

  .achievement-editor--ranges .simple-image-upload--error {
      -webkit-box-pack: start;
              justify-content: flex-start;
    }

  @media (min-width: 768px) {

  .achievement-editor--ranges .simple-image-upload--error {
        position: absolute;
        max-width: 48rem;
        padding-top: 0.5rem;
        left: 0
    }

        .achievement-editor--error-visible .achievement-editor--ranges .simple-image-upload--error {
          top: 6rem;
        }
      }

  @media (min-width: 1024px) {
        .achievement-editor--error-visible .achievement-editor--ranges .simple-image-upload--error {
          top: 9rem;
        }
      }

@media (min-width: 1024px) {.new-lifeline--editor--achievements .step__title {
    height: 5rem
}
  }

.achievements-achievements {
  z-index: 6;
  height: 66rem;
}

/* **jc** */

.achievements-achievements .svg {
    font-size: 12px;
  }

.achievements-achievements .svg:hover::before {
      opacity: 1;
    }

.achievements-achievements--outside-ui {
    opacity: 1;
  }

.achievements-achievements--outside-ui--enter {
      opacity: 0;
    }

.achievements-achievements--outside-ui--enter-active {
      opacity: 1;
      -webkit-transition: opacity var(--transition-duration--normal) 0.3s
        var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--normal) 0.3s
        var(--transition-ease--out-quintic);
    }

.achievements-achievements--outside-ui--exit {
      opacity: 1;
    }

.achievements-achievements--outside-ui--exit-active {
      opacity: 0;
      -webkit-transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
    }

.achievements-achievements--outside-ui--exit-done {
      pointer-events: none;
      opacity: 0;
    }

.achievements-achievements--max-reached {
    margin: 7.8rem auto 1.4rem;
  }

@media (min-width: 768px) {

.achievements-achievements--max-reached {
      margin: 19.8rem auto
  }
    }

.achievements-achievements .editor-container--large {
    --editor-container-max-width: 86%;
  }

@media (min-height: 768px) {

.achievements-achievements .editor-container--large {
      --editor-container-max-width: 86%
  }
    }

.achievements-achievements .memories-editor-display {
    margin: 4rem -2rem 1.8rem;
  }

@media (min-width: 768px) {

.achievements-achievements .memories-editor-display {
      margin: 4rem 0 1.6rem
  }
    }

.achievements-achievements .memories-editor-display.hide {
      position: absolute;
    }

@media (max-width: 375px) {

.achievements-achievements .memories-editor-display.hide {
        padding: 0;
        margin: 0
    }
      }

@media (min-width: 768px) and (max-width: 1440px) {

.achievements-achievements .memories-editor-display--item--wrapper {
        width: auto
    }
      }

.achievements-achievements .max-reached-button-editor {
    opacity: 0;
    cursor: inherit;
  }

.achievements-achievements .max-reached-button-editor__button {
      opacity: 0;
      -webkit-transform: translateY(-10rem);
              transform: translateY(-10rem);
      cursor: inherit;
    }

/* **jc** */

.achievements-achievements .max-reached-button-editor__button .achievement-editor__cross,
      .achievements-achievements .max-reached-button-editor__button .achievements-achievements--add-achievement {
        cursor: inherit;
      }

.achievements-achievements .max-reached-button-editor--enter {
      opacity: 0;
      cursor: inherit;
    }

.achievements-achievements .max-reached-button-editor--enter-active {
      opacity: 1;
      -webkit-transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      cursor: pointer;
    }

.achievements-achievements .max-reached-button-editor--enter-done {
      opacity: 1;
      cursor: inherit;
    }

.achievements-achievements .max-reached-button-editor--exit {
      opacity: 1;
      cursor: pointer;
    }

.achievements-achievements .max-reached-button-editor--exit-active {
      opacity: 1;
      -webkit-transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      cursor: inherit;
    }

.achievements-achievements .max-reached-button-editor--exit-done {
      /*opacity: 0;*/ /* **jc** */
      cursor: inherit;
    }

.achievements-achievements--templates {
    margin-top: auto;
  }

@media (min-width: 1024px) and (max-height: 768px) {

.achievements-achievements--templates .memory-template {
        padding-bottom: 5.4vh
    }
      }

.achievements-achievements--add-achievement {
    position: absolute;
    top: 0;
    left: 50%;

    width: 20rem;

    font-size: 1.5rem;

    -webkit-transition: padding var(--transition-duration--normal)
        var(--transition-ease--out-quintic),
      margin-top var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

    transition: padding var(--transition-duration--normal)
        var(--transition-ease--out-quintic),
      margin-top var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

    cursor: pointer;

    -webkit-transform: translate(-50%, 0);

            transform: translate(-50%, 0);

    padding: 1.2rem 1.8rem;
  }

@media (min-width: 768px) {

.achievements-achievements--add-achievement {
      padding-left: 1.8rem;
      min-height: 5.6rem;
      width: 22.6rem;
      font-size: 1.7rem
  }
    }

@media (min-width: 1024px) {

.achievements-achievements--add-achievement {
      margin: auto
  }
    }

.achievements-achievements--add-achievement:hover {
      -webkit-transform: translate(-50%, 0);
              transform: translate(-50%, 0);
    }

.achievements-achievements--add-achievement--button--wrapper {
      position: relative;
      height: 5.6rem;

      margin: 4rem auto;
      padding: 0.8rem 1.1rem;
    }

@media (min-width: 1024px) {

.achievements-achievements--add-achievement--button--wrapper {
        margin: auto
    }
      }

.achievements-achievements--add-achievement--button--wrapper--hidden {
        position: absolute;
      }

.achievements-achievements--add-achievement .button__children-wrapper {
      width: 100%;
    }

.achievements-achievements--add-achievement .achievement-editor__cross {
      z-index: 1;
    }

.achievements-achievements--add-achievement--add-text {
      display: inline-block;
      font-family: var(--font-heading);

      padding-right: 2.4rem;

      opacity: 1;
      -webkit-transition: opacity var(--transition-duration--instant)
        var(--transition-duration--normal) var(--transition-ease--out-quintic);
      transition: opacity var(--transition-duration--instant)
        var(--transition-duration--normal) var(--transition-ease--out-quintic);

      text-align: left;
    }

@media (min-width: 1024px) {

.achievements-achievements--add-achievement--add-text {
        padding-right: 3.2rem
    }
      }

.achievements-achievements--add-achievement--open {
      /*border-radius: 0;*/

      /*width: calc(100vw - 7rem);*/
      padding: 2rem 2rem;
      margin: 0;
    }

@media (min-width: 768px) {

.achievements-achievements--add-achievement--open {
        /*width: 48rem;*/
        padding: 2.1rem 4.4rem 3.8rem
    }
      }

.achievements-achievements--add-achievement--open,
      .achievements-achievements--add-achievement--open:hover {
        /*transform: translate(calc(-50% - 1.5rem), -3rem);*/
        box-shadow: none;
      }

@media (min-width: 375px) {

.achievements-achievements--add-achievement--open,
      .achievements-achievements--add-achievement--open:hover {
          /*transform: translate(calc(-50% - 1.5rem), -3rem);*/
      }
        }

@media (min-width: 768px) {

.achievements-achievements--add-achievement--open,
      .achievements-achievements--add-achievement--open:hover {
          /*transform: translate(-50%, 0);*/
      }
        }

@media (min-width: 1024px) {

.achievements-achievements--add-achievement--open,
      .achievements-achievements--add-achievement--open:hover {
          /*transform: translate(-50%, -2rem);*/
      }
        }

/*transform: translate(calc(-50% - 1.5rem), -20rem);*/

@media (min-width: 375px) {

.achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements,
        .achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements:hover {
            /*transform: translate(calc(-50% - 1.5rem), -18rem);*/
        }
          }

@media (min-width: 768px) {

.achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements,
        .achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements:hover {
            /*transform: translate(-50%, -13rem);*/
        }
          }

@media (min-width: 1024px) {

.achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements,
        .achievements-achievements--add-achievement--open.achievements-achievements--add-achievement--has-achievements:hover {
            /*transform: translate(-50%, -15rem);*/
        }
          }

.achievements-achievements--add-achievement--open .achievement-editor__cross {
        cursor: pointer !important;
      }

.achievements-achievements--add-achievement--open .achievement-editor__cross::before {
          -webkit-transform: translate(-50%, -50%);
                  transform: translate(-50%, -50%);
        }

.achievements-achievements--add-achievement--open .achievement-editor__cross::after {
          -webkit-transform: translate(-50%, -50%) rotate(-90deg);
                  transform: translate(-50%, -50%) rotate(-90deg);
        }

.achievements-achievements--add-achievement--open .achievements-achievements--add-achievement--add-text {
        opacity: 0;
        -webkit-transition-delay: 0s;
                transition-delay: 0s;
      }

.achievements-achievements--editor-wrapper {
    height: 0;
    overflow: hidden;

    -webkit-transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);

    transition: var(--transition-duration--normal)
      var(--transition-ease--out-quintic);
    -webkit-transition-property: padding-top;
    transition-property: padding-top;
    -webkit-transition-delay: 0.2s;
            transition-delay: 0.2s;
  }

.achievements-achievements--add-achievement-label {
    margin-top: 0;
    margin-bottom: 4.8rem;

    font-size: 1.6rem;
  }

@media (min-width: 768px) {

.achievements-achievements--add-achievement-label {
      margin-bottom: 4rem
  }
    }

/* */

.achievements-achievements--editor--enter {
    }

.achievements-achievements--editor--enter-done {
    }

.achievements-achievements--editor--exit {
    }

.achievements-achievements--editor--exit-done {
    }

.achievements-achievements--contents--enter {
      opacity: 0;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s;
    }

.achievements-achievements--contents--enter-done {
      opacity: 1;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s;
    }

.achievements-achievements--contents--exit {
      opacity: 1;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s;
    }

.achievements-achievements--contents--exit-done {
      opacity: 0;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s;
    }

.achievements-achievements--contents {
    width: 100%;
  }

@media (min-width: 768px) {

.achievements-achievements--contents {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;

      -webkit-box-flex: 1;

              flex-grow: 1
  }
    }

.achievements-achievements--contents .memories-editor-display--gradient {
      background-image: -webkit-gradient(
        linear,
        left top, right top,
        from(rgba(199, 31, 109, 1)),
        color-stop(10%, rgba(199, 31, 109, 0)),
        color-stop(90%, rgba(199, 31, 109, 0)),
        to(rgba(199, 31, 109, 1))
      );
      background-image: linear-gradient(
        to right,
        rgba(199, 31, 109, 1),
        rgba(199, 31, 109, 0) 10%,
        rgba(199, 31, 109, 0) 90%,
        rgba(199, 31, 109, 1)
      );
    }

.achievements-achievements--contents .memories-editor-display--gradient__right {
      background-image: -webkit-gradient(
        linear,
        left top, right top,
        from(rgba(199, 31, 109, 0)),
        color-stop(10%, rgba(199, 31, 109, 0)),
        color-stop(90%, rgba(199, 31, 109, 0)),
        to(rgba(199, 31, 109, 1))
      );
      background-image: linear-gradient(
        to right,
        rgba(199, 31, 109, 0),
        rgba(199, 31, 109, 0) 10%,
        rgba(199, 31, 109, 0) 90%,
        rgba(199, 31, 109, 1)
      );
    }

.achievements-achievements .step__inner {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    margin-top: 0;
  }

/* **jc** */

@media (min-width: 768px) {

.achievements-achievements .step__inner {
      margin-top: 0;
      -webkit-box-flex: 1;
              flex-grow: 1
  }
    }

.achievements-achievements .step__inner > .editor-container {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: columns;
    }

@media (max-height: 700px) and (min-width: 1024px) {

.achievements-achievements .step__inner > .editor-container {
        min-height: 56rem
    }
      }

@media (min-width: 768px) {

.achievements-achievements .step__inner > .editor-container {
        -webkit-box-flex: 1;
                flex-grow: 1
    }
      }

.interest-tag {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;

  padding: 0.4rem 0.3rem 0.4rem 1.8rem;
  margin: 0.4rem;

  font-size: 1.4rem;
  font-family: var(--font-heading);

  border-radius: 2.6rem;

  color: var(--smalt);
  background: var(--white);
  border: 0.1rem solid var(--white);

  -webkit-transition: color 0.3s, background-color 0.3s, border-color 0.3s;

  transition: color 0.3s, background-color 0.3s, border-color 0.3s;

  cursor: pointer;
}

  .interest-tag span {
    width: 2.7rem;
    height: 2.7rem;

    margin-left: 0.6rem;

    -webkit-transition: -webkit-transform 1s var(--transition-ease--out-quintic);

    transition: -webkit-transform 1s var(--transition-ease--out-quintic);

    transition: transform 1s var(--transition-ease--out-quintic);

    transition: transform 1s var(--transition-ease--out-quintic), -webkit-transform 1s var(--transition-ease--out-quintic);
  }

  .interest-tag span svg {
      width: 100%;
      height: 100%;
    }

  .interest-tag span svg rect,
      .interest-tag span svg path {
        -webkit-transition: stroke 0.3s, fill 0.3s;
        transition: stroke 0.3s, fill 0.3s;
      }

  .interest-tag span svg path.middle-line {
        -webkit-transform-origin: center;
                transform-origin: center;
        -webkit-transition-timing-function: var(--transition-ease--out-quintic);
                transition-timing-function: var(--transition-ease--out-quintic);
        -webkit-transition-duration: 0.6s, 1s, 1s;
                transition-duration: 0.6s, 1s, 1s;
        -webkit-transition-property: stroke, fill, -webkit-transform;
        transition-property: stroke, fill, -webkit-transform;
        transition-property: transform, stroke, fill;
        transition-property: transform, stroke, fill, -webkit-transform;
      }

  .interest-tag--base {
    -webkit-transition: 1s var(--transition-ease--out-quintic);
    transition: 1s var(--transition-ease--out-quintic);
    -webkit-transition-property: color, background-color, border-color, box-shadow;
    transition-property: color, background-color, border-color, box-shadow;
  }

  .interest-tag--base:hover {
      box-shadow: 0 6px 12px rgba(255, 255, 255, 0.4);
    }

  .interest-tag--base:hover span {
        -webkit-transform: scale(1.1) rotate(270deg);
                transform: scale(1.1) rotate(270deg);
      }

  .interest-tag--edit {
    background: transparent;
    color: var(--white);
    border-color: var(--white);
  }

  .interest-tag--edit span {
      -webkit-transform: scale(1) rotate(0deg);
              transform: scale(1) rotate(0deg);
    }

  .interest-tag--edit span rect {
        fill: var(--white) !important;
      }

  .interest-tag--edit span path {
        stroke: var(--smalt) !important;
      }

  .interest-tag--edit span path.middle-line {
        -webkit-transform: rotate(-90deg);
                transform: rotate(-90deg);
        -webkit-transition-duration: 1s;
                transition-duration: 1s;
      }

  .interest-tag--selected {
    color: var(--white);
    background: var(--smalt);
    border-color: transparent;
  }

  .interest-tag--selected span rect {
        fill: var(--white) !important;
      }

  .interest-tag--selected span path {
        stroke: var(--smalt) !important;
      }

.scale-picker {
  position: relative;
  display: inline-block;
  margin-top: 1.5rem;
  width: 100%;
  max-width: 40rem;
}

  .scale-picker--handler {
    width: 4.5rem;
    height: 4.5rem;

    display: -webkit-box;

    display: flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;

    border-radius: 100%;
    border: 2px solid var(--white);

    background-color: var(--maroon-flush);
    cursor: -webkit-grab;
    cursor: grab;

    -webkit-transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

    transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

    transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

    transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  }

  .scale-picker--handler--wrapper {
      width: 4.5rem;
      height: 4.5rem;

      position: absolute;
      top: 0;
      left: 0;

      -webkit-transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

      transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

      transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);

      transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

  .scale-picker--handler--wrapper span {
        display: -webkit-inline-box;
        display: inline-flex;
        -webkit-box-pack: center;
                justify-content: center;
        -webkit-box-align: center;
                align-items: center;
        width: 9.2rem;

        position: absolute;
        bottom: 0;

        font-size: 1.4rem;
        white-space: nowrap;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;

        -webkit-transform: translateY(calc(100% + 1.5rem)) translateX(-50%);

                transform: translateY(calc(100% + 1.5rem)) translateX(-50%);
      }

  .scale-picker--handler--wrapper span::before {
          content: '';
          display: inline-block;

          width: 1.2rem;
          height: 1.2rem;
          margin-right: 0.4rem;

          background: url(https://www.memories.com/assets/images/heart-white--4fe0db138bf5d0ac6941b5a75d522cda.svg) no-repeat
            center / contain;
        }

  .scale-picker--handler:before,
    .scale-picker--handler:after {
      content: '';

      display: inline-block;

      width: 1.1rem;
      height: 1.1rem;

      background-image: url(https://www.memories.com/assets/images/arrow-white--561933ea65936f5c11ff0b962255376d.svg);
      background-position: center;
      background-size: contain;
      background-repeat: no-repeat;
    }

  .scale-picker--handler:after {
      margin-left: 0.5rem;
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }

  .scale-picker--stops {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
            align-items: center;
    width: 100%;

    position: relative;
  }

  .scale-picker--stop {
    --stop-separator-space: 5rem;

    flex-shrink: 0;
    position: relative;

    border-radius: 100%;
    border: 0.2rem solid rgba(255, 255, 255, 0.3);

    margin-right: var(--stop-separator-space);

    cursor: pointer;
  }

  /* **jc** */

  .scale-picker--stop:before {
      content: '';

      width: var(--stop-separator-space);
      height: 1px;

      position: absolute;
      top: 50%;
      right: 0;

      display: block;

      -webkit-transform: translate(100%, -50%) translateX(0.2rem);

              transform: translate(100%, -50%) translateX(0.2rem);

      border-top: 2px solid rgba(255, 255, 255, 0.3);
      border-bottom: 2px solid rgba(255, 255, 255, 0.3);

      background-color: var(--maroon-flush);
      background-clip: content-box;
    }

  .scale-picker--stop:last-child {
      margin-right: 0;
    }

  .scale-picker--stop:last-child:before {
        display: none;
      }

  .scale-picker--stop:nth-child(even) {
      width: 3.2rem;
      height: 3.2rem;
    }

  .scale-picker--stop:nth-child(odd) {
      width: 4.5rem;
      height: 4.5rem;
    }

.interests-editor {
  margin-top: 5.8rem;
}

  @media (min-width: 1024px) {.interests-editor {
    margin: 5.8rem 0 5rem
}
  }

  .interests-editor h2 {
    font-size: 2rem;
    line-height: 1.2em;
    text-align: center;
    color: var(--white);
  }

  .interests-editor p {
    font-size: 1.4rem;
    line-height: 1.3em;
  }

  @media (min-width: 1024px) {

  .interests-editor p {
      font-size: 1.6rem
  }
    }

  .interests-editor__interests-wrapper {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
            flex-direction: column-reverse;
    margin-bottom: 2rem;
  }

  @media (min-width: 1024px) {

  .interests-editor__interests-wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      margin-bottom: 0
  }
    }

  .interests-editor__new-interests-selector {
    position: relative;
    margin-bottom: 2rem;
  }

  @media (min-width: 1024px) {

  .interests-editor__new-interests-selector {
      margin-bottom: 0
  }
    }

  .interests-editor__new-interests-selector-handle-label {
    margin-bottom: 2.2rem;

    font-size: 1.6rem;
    line-height: 1.9rem;
    text-align: center;
  }

  @media (min-width: 1024px) {

  .interests-editor__new-interests-selector-handle-label {
      display: none
  }
    }

  .interests-editor__new-interests-selector-handle {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
            justify-content: space-between;

    width: 100%;
    padding: 1.8rem 2rem;
    margin-bottom: 0;

    font-family: var(--font-heading);
    font-size: 1.8rem;
    line-height: 1.22em;
    text-align: left;

    color: rgba(255, 255, 255, 0.5);

    border: 1px solid currentColor;
  }

  @media (min-width: 1024px) {

  .interests-editor__new-interests-selector-handle {
      display: none
  }
    }

  .interests-editor__new-interests-selector-handle-arrow {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }

  .interests-editor__interests {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
            align-items: center;

    text-align: left;
  }

  @media (min-width: 1024px) {

  .interests-editor__interests--selected-interests {
        padding-bottom: 2.5rem
    }
      }

  .interests-editor__interests--selected-interests > span {
        display: none;
      }

  @media (min-width: 1024px) {

  .interests-editor__interests--selected-interests > span {
          display: block;
          margin-right: 1.6rem
      }
        }

  .interests-editor__interests--new-interests {
      width: 100%;
      padding: 1.5rem 0;
      max-height: 70vh;

      border: 1px solid rgba(255, 255, 255, 0.5);

      overflow: scroll;

      opacity: 0;
      -webkit-transform: translateY(2rem);
              transform: translateY(2rem);
      -webkit-transition: var(--transition-duration--normal)
        var(--transition-ease--out-quintic);
      transition: var(--transition-duration--normal)
        var(--transition-ease--out-quintic);

      background: var(--lifeline-interests);

      pointer-events: none;

      position: absolute;
      left: 0;
      top: 9.9rem;
      z-index: 1;
    }

  @media (min-width: 1024px) {

  .interests-editor__interests--new-interests {
        margin: 0 0 5rem;
        padding-right: 0;
        max-height: none;

        border: none;
        overflow: auto;

        pointer-events: auto;

        opacity: 1;
        -webkit-transform: none;
                transform: none;
        -webkit-transition: none;
        transition: none;

        position: static;

        background: none
    }
      }

  @media (max-width: 768px) {

  .interests-editor__interests--new-interests li {
          -webkit-box-pack: justify;
                  justify-content: space-between;

          width: 100%;
          padding: 2rem 2.2rem;
          margin: 0;

          border: none;
          border-radius: 0;
          background: none;

          font-size: 1.6rem;
          white-space: nowrap;
          text-overflow: ellipsis;
          text-align: left;

          color: var(--white);
          overflow: hidden
      }
              .interests-editor__interests--new-interests li span svg, .interests-editor__interests--new-interests li.interest-tag--edit span svg {
                overflow: visible;
              }
              .interests-editor__interests--new-interests li span rect, .interests-editor__interests--new-interests li.interest-tag--edit span rect {
                fill: none !important;
                stroke: var(--white) !important;
              }
              .interests-editor__interests--new-interests li span path, .interests-editor__interests--new-interests li.interest-tag--edit span path {
                stroke: var(--white) !important;
              }

          .interests-editor__interests--new-interests li.interest-tag--edit {
            background: rgba(255, 255, 255, 0.3);
          }
        }

  .interests-editor__new-interests-selector--active .interests-editor__new-interests-selector-handle {
      margin-bottom: 25vh;
    }

  @media (max-width: 768px) {

  .interests-editor__new-interests-selector--active .interests-editor__new-interests-selector-handle {
        margin-bottom: 70vh
    }
      }

  .interests-editor__new-interests-selector--active .interests-editor__interests--new-interests {
      pointer-events: auto;
      visibility: visible !important;
      opacity: 1 !important;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }

  .interests-editor__slider-wrapper {
    opacity: 0;
    height: 0;

    position: relative;

    -webkit-transition: opacity 1.2s var(--transition-ease--out-quintic),
      height 1.2s var(--transition-ease--out-quintic);

    transition: opacity 1.2s var(--transition-ease--out-quintic),
      height 1.2s var(--transition-ease--out-quintic);
    -webkit-transition-delay: 0s, 0.5s;
            transition-delay: 0s, 0.5s;
  }

  .interests-editor__slider-wrapper--open {
      opacity: 1;
      height: 24.3rem;

      -webkit-transition-delay: 0.5s, 0s;

              transition-delay: 0.5s, 0s;
    }

  .interests-editor__slider-wrapper--open .interests-editor__slider-wrapper-inner {
        position: static;
        pointer-events: auto;
      }

  .interests-editor__slider-wrapper-inner {
    width: 100%;
    height: auto;

    position: absolute;
    top: 0;
    left: 0;

    pointer-events: none;
  }

  .interests-editor__actions {
    margin-top: 6rem;
  }

  .interests-editor__actions button {
      min-width: 10.8rem;
    }

  @media (min-width: 1024px) {

  .interests-editor__actions button {
        min-width: none
    }
      }

.interests-interests .step__inner {
    margin-top: 0;
  }

    @media (min-width: 768px) {.interests-interests .step__inner {
      margin-top: auto
  }
    }

.interests-descriptions {
  padding-top: 3.6rem;
  padding-bottom: 10.4rem;
}

  @media (min-width: 768px) {.interests-descriptions {
    padding-top: 9vh;
    padding-bottom: 0
}
  }

  @media (min-width: 1024px) {
    .interests-descriptions .step__inner {
      margin-top: 7vh;
    }
  }

  .interests-descriptions .interests-descriptions-field {
    margin-top: 3rem;
  }

  @media (min-height: 780px) {

  .interests-descriptions .interests-descriptions-field {
      margin-top: 3rem
  }
    }

  .interests-descriptions .interests-descriptions-field .input__label {
      font-size: 1.4rem;
    }

  .interests-descriptions .interests-descriptions-field input {
      padding-top: 1.8rem;
      padding-bottom: 0.6rem;
    }

  @media (min-width: 768px) and (min-height: 780px) {

  .interests-descriptions .interests-descriptions-field input {
        padding-top: 2.8rem;
        padding-bottom: 1.6rem
    }
      }

  .interests-descriptions .interest-wrapper {
    position: relative;
  }

  .interests-descriptions .interest-wrapper .input__field {
      padding-left: 3rem;
      padding-right: 7.5rem;
      -webkit-transition: opacity 0.48s;
      transition: opacity 0.48s;
    }

  @media (min-width: 768px) {

  .interests-descriptions .interest-wrapper .input__field {
        padding-left: 10rem;
        padding-right: 10rem
    }
      }

  @media (min-width: 1441px) {

  .interests-descriptions .interest-wrapper .input__field {
        padding-left: 18rem;
        padding-right: 18rem
    }
      }

  .interests-descriptions .interest-wrapper .interest-name {
      position: absolute;
      top: 0.5rem;
      /* transform: translate(-50%, -100%); */
      font-size: 1.4rem;
      text-align: left;
      left: 0;
    }

  @media (min-width: 768px) {

  .interests-descriptions .interest-wrapper .interest-name {
        top: 3.2rem;
        font-size: 1.5rem;
        -webkit-transform: none;
                transform: none;
        width: 10rem;
        left: 0
    }
      }

  @media (min-width: 1441px) {

  .interests-descriptions .interest-wrapper .interest-name {
        width: 18rem
    }
      }

  .interests-descriptions .interest-wrapper .select--arrow {
      top: unset;
      bottom: 0.8rem;
      right: 0;
      width: 1rem;
      height: 2rem;
    }

  .interests-descriptions .interest-wrapper .select--arrow svg {
        -webkit-transform: scale(2);
                transform: scale(2);
      }

  .interests-descriptions .interest-wrapper .input {
      margin-top: 7rem;
    }

  @media (min-width: 768px) {

  .interests-descriptions .interest-wrapper .input {
        margin-top: 4.2rem
    }
      }

  .interests-descriptions .interest-wrapper .input__field {
      padding-bottom: 0.3rem;
      font-size: 2.5rem;
    }

  @media (min-width: 768px) {

  .interests-descriptions .interest-wrapper .input__field {
        font-size: 3rem
    }
      }

  /*.input__bottom {
      &__error {
        display: none;
      }
    }*/

  .interests-descriptions .interest-wrapper .select--autocomplete-box {
      max-height: unset;
    }

  .interests-descriptions .interest-wrapper .select--autocomplete-box li {
      font-family: var(--font-heading);
      text-align: center;
      font-size: 2.5rem;
      padding: 2rem 1.2rem;
      margin: 0;
    }

  @media (min-width: 768px) {

  .interests-descriptions .interest-wrapper .select--autocomplete-box li {
        font-size: 3rem
    }
      }

  .interests-descriptions .interest-wrapper .select--autocomplete-box li:hover {
        background: var(--smalt);
        color: var(--white);
      }

  .interests-descriptions .interest-wrapper .select--autocomplete-box li.highlighted {
        color: var(--white);
        background: var(--smalt);
      }

/* **jc** */
  .interests-extra-information .ask-for-help-cta {
    margin-top: 2rem;
  }
  .interests-extra-information .simple-image-upload--error {
    color: var(--white);
    border-radius: 4.8rem;
    background-color: var(--bright-red);
    padding: 1rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }
  .interests-extra-information .simple-image-upload--error .svg--cross path {
      stroke: var(--white);
    }
  .interests-extra-information .step__title .simple-image-upload,
    .interests-extra-information .step__title .interests-extra-information__uploaded-photo {
      margin-top: 4rem;
      margin-bottom: 7.6rem;
    }
  @media (min-width: 1024px) {
  .interests-extra-information .step__title .simple-image-upload,
    .interests-extra-information .step__title .interests-extra-information__uploaded-photo {
        margin-top: 3.7rem;
        margin-bottom: 4.8rem
    }
      }
  .interests-extra-information .step__inner .editor-container .question .question-heading {
          font-size: 1.6rem;
          line-height: 2.2rem;
        }
  .interests-extra-information .step__inner .editor-container .question .textarea {
          margin-bottom: 1.4rem;
        }
  .interests-extra-information .step__inner .editor-container .question .textarea .textarea__counter {
            color: var(--white);
            text-align: left;
          }
  .interests-extra-information__uploaded-photo {
    width: 100%;
    margin-top: 3.7rem;
    padding: 0.9rem;

    background: rgba(255, 255, 255, 0.2);
    color: var(--white);
  }
  .interests-extra-information__uploaded-photo-inner .picture-preview,
    .interests-extra-information__uploaded-photo-inner .picture-preview__info {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row;
      -webkit-box-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
              align-items: center;

      width: 100%;
      max-width: 52.6rem;
      margin: 0 auto;
    }
  .interests-extra-information__uploaded-photo-inner .picture-preview__image {
      width: 3.6rem;
      height: 3.6rem;
      margin-right: 1.4rem;

      -o-object-fit: cover;

         object-fit: cover;
    }
  .interests-extra-information__uploaded-photo-inner .picture-preview__name,
    .interests-extra-information__uploaded-photo-inner .picture-preview__action {
      font-size: 1.5rem;
      line-height: 1.2em;
      color: var(--white);
    }
  .interests-extra-information__uploaded-photo-inner .picture-preview__name {
      margin: 0 auto 0 0;
    }
  .interests-extra-information__uploaded-photo-inner .picture-preview__action {
      margin: 0 0 0 auto;
      -webkit-text-decoration-line: underline;
              text-decoration-line: underline;
    }

.lifeline-overview__title {
    padding: 3.2rem 2rem;

    color: var(--smalt);
    font-size: 20px;
    font-weight: var(--font-medium);
    line-height: 1.25em;
    text-align: center;
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
    opacity: 1;

    --slide-in-delay: 0.2s;

    -webkit-transition: opacity var(--transition-duration--normal)
        cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
      color var(--output-background-transition-speed)
        var(--output-background-easing),
      -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);

    transition: opacity var(--transition-duration--normal)
        cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
      color var(--output-background-transition-speed)
        var(--output-background-easing),
      -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);

    transition: opacity var(--transition-duration--normal)
        cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
      transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay),
      color var(--output-background-transition-speed)
        var(--output-background-easing);

    transition: opacity var(--transition-duration--normal)
        cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
      transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay),
      color var(--output-background-transition-speed)
        var(--output-background-easing),
      -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);

    opacity: 1;
  }

    @media (min-width: 1024px) {.lifeline-overview__title {
      width: 100%;
      max-width: 42rem;

      margin: 0 auto;
      padding: 0 2.4rem;

      position: absolute;
      top: 50%;
      left: 50%;

      -webkit-transform: translate(-50%, -50%);

              transform: translate(-50%, -50%);

      font-size: 4.2rem;
      line-height: 1.24em
  }
    }

    .lifeline-overview__title-enter {
      opacity: 0;

      -webkit-transition: none;

      transition: none;
    }

    @media (min-width: 1024px) {

    .lifeline-overview__title-enter {
        -webkit-transform: translate(-50%, calc(-50% + 5em));
                transform: translate(-50%, calc(-50% + 5em))
    }
      }

    .lifeline-overview__title-enter-active,
      .lifeline-overview__title-enter-done {
        opacity: 1;
        -webkit-transition: opacity var(--transition-duration--normal)
            cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
          color var(--output-background-transition-speed)
            var(--output-background-easing),
          -webkit-transform 0.8s var(--transition-ease--out-quintic)
            var(--slide-in-delay);
        transition: opacity var(--transition-duration--normal)
            cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
          color var(--output-background-transition-speed)
            var(--output-background-easing),
          -webkit-transform 0.8s var(--transition-ease--out-quintic)
            var(--slide-in-delay);
        transition: opacity var(--transition-duration--normal)
            cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
          transform 0.8s var(--transition-ease--out-quintic)
            var(--slide-in-delay),
          color var(--output-background-transition-speed)
            var(--output-background-easing);
        transition: opacity var(--transition-duration--normal)
            cubic-bezier(1, 1, 0.32, 0.23) var(--slide-in-delay),
          transform 0.8s var(--transition-ease--out-quintic)
            var(--slide-in-delay),
          color var(--output-background-transition-speed)
            var(--output-background-easing),
          -webkit-transform 0.8s var(--transition-ease--out-quintic)
            var(--slide-in-delay);
      }

    @media (min-width: 1024px) {

    .lifeline-overview__title-enter-active,
      .lifeline-overview__title-enter-done {
          -webkit-transform: translate(-50%, -50%);
                  transform: translate(-50%, -50%);
      }
        }

    .lifeline-overview__title-exit {
      opacity: 1;
    }

    .lifeline-overview__title-exit-active {
        opacity: 0;
        -webkit-transition: opacity 1s 0.4s;
        transition: opacity 1s 0.4s;
      }

    .lifeline-overview__title--hidden {
      -webkit-transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic) var(--slide-in-delay),
        color var(--output-background-transition-speed)
          var(--output-background-easing),
        -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);
      transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic) var(--slide-in-delay),
        color var(--output-background-transition-speed)
          var(--output-background-easing),
        -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);
      transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic) var(--slide-in-delay),
        transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay),
        color var(--output-background-transition-speed)
          var(--output-background-easing);
      transition: opacity var(--transition-duration--normal)
          var(--transition-ease--out-quintic) var(--slide-in-delay),
        transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay),
        color var(--output-background-transition-speed)
          var(--output-background-easing),
        -webkit-transform 0.8s var(--transition-ease--out-quintic) var(--slide-in-delay);

      opacity: 0;
    }

    @media (min-width: 1024px) {

    .lifeline-overview__title--hidden {
        -webkit-transform: translate(-50%, calc(-50% + 5rem));
                transform: translate(-50%, calc(-50% + 5rem))
    }
      }
  .lifeline-overview__lifeline-wrapper {
    display: none;

    width: 100%;
    height: 9.6rem;

    position: relative;
  }
  @media (min-width: 1024px) {
  .lifeline-overview__lifeline-wrapper {
      display: block;

      width: 100%;
      height: auto;

      position: absolute;
      top: calc(7.1vh + 7rem);
      bottom: calc(7.1vh + 7rem);
      left: 0;
      z-index: -1
  }
    }
  .lifeline-overview__lifeline-wrapper-enter {
      opacity: 0;
    }
  .lifeline-overview__lifeline-wrapper-enter-active {
        opacity: 1;
        -webkit-transition: opacity 1s 1s;
        transition: opacity 1s 1s;
      }
  .lifeline-overview__lifeline-wrapper-exit {
      opacity: 1;
    }
  .lifeline-overview__lifeline-wrapper-exit-active {
        opacity: 0;
        -webkit-transition: opacity 1s 1s;
        transition: opacity 1s 1s;
      }
  .lifeline-overview__utils {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }

.lifeline-section-end {
  -webkit-box-flex: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  position: relative;
}

  @media (min-width: 1024px) {.lifeline-section-end {
    height: unset
}
  }

  .lifeline-section-end__inner {
    -webkit-box-flex: 1;
            flex-grow: 1;

    display: -webkit-box;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;

    width: 100%;
    height: 100%;
    padding: 3.2rem;

    position: relative;
    z-index: 2;
  }

  @media (min-width: 768px) {

  .lifeline-section-end__inner {
      padding: 8.3rem
  }
    }

  .lifeline-section-end__content {
    -webkit-box-flex: 1;
            flex-grow: 1;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    margin: 0;
    position: relative;
  }

  @media (min-width: 768px) {

  .lifeline-section-end__content {
      -webkit-box-flex: 0;
              flex-grow: 0;

      display: block;
      margin: auto 0
  }
    }

  .lifeline-section-end__content .lifeline--wrapper {
      position: absolute;
      width: 100vw;
      height: var(--page-height);
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, calc(-50% + 3.2rem));
              transform: translate(-50%, calc(-50% + 3.2rem));
      z-index: -1;
    }

  @media (min-width: 768px) {

  .lifeline-section-end__content .lifeline--wrapper {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%)
    }
      }

  .lifeline-section-end__label {
    width: 100%;
    max-width: 33rem;
    margin: 0 auto 3.2rem;

    font-size: 1.6rem;
    line-height: 1.375em;
    text-align: center;
  }

  @media (min-width: 768px) {

  .lifeline-section-end__label {
      max-width: 52rem;

      font-size: 1.8rem;
      line-height: 1.5em
  }
    }

  .lifeline-section-end__title {
    width: 100%;
    max-width: 24rem;
    margin: auto;

    font-family: var(--font-heading);
    font-size: 3.5rem;
    line-height: 1.22em;
    text-align: center;
    color: var(--smalt);
  }

  @media (min-width: 768px) {

  .lifeline-section-end__title {
      margin: 0 auto;
      max-width: 56rem;

      font-size: 5rem;
      line-height: 1.22em
  }
    }

  .lifeline-section-end__footer {
    margin-top: 3rem;
  }

  .lifeline-section-end__footer-label {
    margin-bottom: 2.4rem;

    font-size: 1.6rem;
    line-height: 1.375em;
  }

  .lifeline-section-end__footer-buttons {
    text-align: center;
  }

  .lifeline-section-end__footer-buttons .button {
      display: -webkit-box;
      display: flex;
      width: 100%;
      margin: 0;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }

  @media (min-width: 768px) {

  .lifeline-section-end__footer-buttons .button {
        display: -webkit-inline-box;
        display: inline-flex;
        width: auto;
        margin: 0 1rem;
        padding-left: 3rem;
        padding-right: 3rem
    }
      }

  .lifeline-section-end__footer-buttons .button + .button {
        margin-top: 1rem;
      }

  @media (min-width: 768px) {

  .lifeline-section-end__footer-buttons .button + .button {
          margin-top: 0
      }
        }

  .lifeline-section-end__complete-with-login {
    font-size: 1.4rem;
    color: var(--black);
    margin: 2rem 0 0.7rem 0;
  }

  .lifeline-section-end__complete-with-login__button {
      color: var(--smalt);
      text-decoration: none;
    }

.lifeline-section-start {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  position: relative;
}

.not-found .container {
    position: relative;
    display: -webkit-box;
    display: flex;
    min-height: var(--page-height);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
  }

    .not-found .container h1 {
      font-size: 6.4rem;
      line-height: 6.4rem;
    }

    @media (min-width: 1024px) {

    .not-found .container h1 {
        font-size: 12rem;
        line-height: 12rem
    }
      }

    .not-found .container p {
      text-align: center;
      padding: 3.6vh 0 5.6vh;
      margin: 0 17.4vw;
    }

    @media (min-width: 768px) {

    .not-found .container p {
        margin: 0 30.4vw;
        padding: 5.6vh 0 7.6vh
    }
      }

    @media (min-width: 1024px) {

    .not-found .container p {
        width: 32vw;
        padding: 5.714vh 0 8.16vh;
        line-height: 2.5rem
    }
      }

    .not-found .container .button--primary {
      color: var(--white);
      background: var(--scooter);
      border: none;
      -webkit-font-smoothing: antialiased;
    }

    .not-found .container .button--primary:hover {
        box-shadow: 0 6px 12px rgb(55, 191, 209, 0.6);
      }

    .not-found .container .loading-shape {
      display: block;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      z-index: 0;
    }

    .not-found .container .loading-shape .svg {
        display: block;
      }

    .not-found .container .loading-shape .svg svg {
          display: block;
          overflow: visible;
        }

    .not-found .container .loading-shape .svg svg g {
            -webkit-transform: scale(1);
                    transform: scale(1);
          }

    .not-found .container .loading-shape .svg svg g path {
              -webkit-animation: headerRotateCounterclockwise 40s linear infinite;
                      animation: headerRotateCounterclockwise 40s linear infinite;
            }

    .not-found .container .loading-shape .svg svg g:nth-child(2) path {
                -webkit-animation-duration: 40s;
                        animation-duration: 40s;
              }

    .not-found .container .loading-shape .svg svg g:nth-child(3) {
              -webkit-transition-delay: 0.2s;
                      transition-delay: 0.2s;
            }

    .not-found .container .loading-shape .svg svg g:nth-child(3) path {
                -webkit-animation-name: headerRotateClockwise;
                        animation-name: headerRotateClockwise;
                -webkit-animation-duration: 40s;
                        animation-duration: 40s;
              }

.new-lifeline {
  -webkit-box-flex: 1;
          flex-grow: 1;

  min-height: var(--page-height);
}
  @media (min-width: 1024px) {.new-lifeline {
    min-height: 100vh;
    margin-top: calc(-1 * var(--header-height))
}
  }
  .new-lifeline__wrapper {
    -webkit-box-flex: 1;
            flex-grow: 1;

    min-height: var(--page-height);

    display: -webkit-box;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    overflow: hidden;
  }
  @media (min-width: 1024px) {
  .new-lifeline__wrapper {
      min-height: 100vh
  }
    }
  @media (min-width: 1024px) {
  .new-lifeline__wrapper {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-direction: row
  }
        .new-lifeline__wrapper--enter .new-lifeline--overview {
          flex-basis: 100%;
        }

          .new-lifeline__wrapper--enter .new-lifeline--overview .lifeline-overview__title {
            opacity: 0;
          }

          .new-lifeline__wrapper--enter .new-lifeline--overview .new-lifeline-progress {
            -webkit-transform: translateY(100%);
                    transform: translateY(100%);
            opacity: 0;
          }
          .new-lifeline__wrapper--enter-active .new-lifeline--overview {
            flex-basis: 43%;
          }

            .new-lifeline__wrapper--enter-active .new-lifeline--overview .lifeline-overview__title {
              opacity: 1;
              -webkit-transition: opacity 1s cubic-bezier(0.67, 0.35, 0.32, 1);
              transition: opacity 1s cubic-bezier(0.67, 0.35, 0.32, 1);
            }

            .new-lifeline__wrapper--enter-active .new-lifeline--overview .new-lifeline-progress {
              -webkit-transform: translateY(0) !important;
                      transform: translateY(0) !important;
              opacity: 1 !important;
              -webkit-transition: opacity var(--transition-duration--fast) 0.8s,
                -webkit-transform var(--transition-duration--fast) 0.8s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
              transition: opacity var(--transition-duration--fast) 0.8s,
                -webkit-transform var(--transition-duration--fast) 0.8s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
              transition: transform var(--transition-duration--fast) 0.8s
                  cubic-bezier(0.67, 0.35, 0.32, 1),
                opacity var(--transition-duration--fast) 0.8s !important;
              transition: transform var(--transition-duration--fast) 0.8s
                  cubic-bezier(0.67, 0.35, 0.32, 1),
                opacity var(--transition-duration--fast) 0.8s,
                -webkit-transform var(--transition-duration--fast) 0.8s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
            }
        .new-lifeline__wrapper--exit .new-lifeline--overview {
          flex-basis: 43%;
        }

          .new-lifeline__wrapper--exit .new-lifeline--overview .lifeline-overview__title {
            opacity: 1;
          }

          .new-lifeline__wrapper--exit .new-lifeline--overview .new-lifeline-progress {
            -webkit-transform: translateY(0);
                    transform: translateY(0);
          }
          .new-lifeline__wrapper--exit-active .new-lifeline--overview {
            flex-basis: 100%;
          }

            .new-lifeline__wrapper--exit-active .new-lifeline--overview .lifeline-overview__title {
              opacity: 0;
              -webkit-transition: opacity 1s cubic-bezier(0.67, 0.35, 0.32, 1);
              transition: opacity 1s cubic-bezier(0.67, 0.35, 0.32, 1);
            }

            .new-lifeline__wrapper--exit-active .new-lifeline--overview .new-lifeline-progress {
              -webkit-transform: translateY(100%) !important;
                      transform: translateY(100%) !important;
              opacity: 0 !important;
              -webkit-transition: opacity var(--transition-duration--fast) 0s,
                -webkit-transform var(--transition-duration--fast) 0s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
              transition: opacity var(--transition-duration--fast) 0s,
                -webkit-transform var(--transition-duration--fast) 0s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
              transition: transform var(--transition-duration--fast) 0s
                  cubic-bezier(0.67, 0.35, 0.32, 1),
                opacity var(--transition-duration--fast) 0s !important;
              transition: transform var(--transition-duration--fast) 0s
                  cubic-bezier(0.67, 0.35, 0.32, 1),
                opacity var(--transition-duration--fast) 0s,
                -webkit-transform var(--transition-duration--fast) 0s
                  cubic-bezier(0.67, 0.35, 0.32, 1) !important;
            }
    }
  .new-lifeline--overview {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-pack: justify;
            justify-content: space-between;

    position: relative;
  }
  @media (min-width: 1024px) {
  .new-lifeline--overview {
      flex-basis: 43%;
      padding: 0;
      flex-shrink: 0;
      -webkit-transition: -webkit-flex-basis 1s cubic-bezier(0.67, 0.35, 0.32, 1);
      transition: -webkit-flex-basis 1s cubic-bezier(0.67, 0.35, 0.32, 1);
      transition: flex-basis 1s cubic-bezier(0.67, 0.35, 0.32, 1);
      transition: flex-basis 1s cubic-bezier(0.67, 0.35, 0.32, 1), -webkit-flex-basis 1s cubic-bezier(0.67, 0.35, 0.32, 1)
  }
    }
  .new-lifeline--editor {
    -webkit-box-flex: 1;
            flex-grow: 1;

    display: -webkit-box;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;

    padding-bottom: 5.2rem;

    color: var(--white);
    -webkit-transition: background-color var(--transition-duration--instant),
      background-position 1.2s var(--transition-ease--out-quintic);
    transition: background-color var(--transition-duration--instant),
      background-position 1.2s var(--transition-ease--out-quintic);

    overflow: hidden;

    position: relative;

    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: 100vw bottom;
  }
  @media (min-width: 1024px) {
  .new-lifeline--editor {
      -webkit-box-flex: 0;
              flex: 0 0 57%;
      background-position: 57vw bottom;
      padding-bottom: 0
  }
    }
  @media (min-width: 1024px) {
  .new-lifeline--editor {
      height: 100vh;
      overflow-y: scroll
  }
    }
  .new-lifeline--editor.filled {
      background-position: 0 bottom;
    }
  .new-lifeline--editor-step-wrapper {
    -webkit-box-flex: 1;
            flex-grow: 1;
    flex-shrink: 0;
  }
  .new-lifeline--editor--remembering .input__bottom__error,
    .new-lifeline--editor--remembering .step-actions__error,
    .new-lifeline--editor--relationships .input__bottom__error,
    .new-lifeline--editor--relationships .step-actions__error,
    .new-lifeline--editor--interests .input__bottom__error,
    .new-lifeline--editor--interests .step-actions__error,
    .new-lifeline--editor--achievements .input__bottom__error,
    .new-lifeline--editor--achievements .step-actions__error,
    .new-lifeline--editor--achievements .achievement-editor .input__bottom__error,
    .new-lifeline--editor--achievements .achievement-editor .step-actions__error {
      color: var(--white);
      border-radius: 4.8rem;
      background-color: var(--bright-red);
      padding: 1rem 1.2rem;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
    }
  @media (min-width: 1024px) {
  .new-lifeline--editor--remembering .input__bottom__error,
    .new-lifeline--editor--remembering .step-actions__error,
    .new-lifeline--editor--relationships .input__bottom__error,
    .new-lifeline--editor--relationships .step-actions__error,
    .new-lifeline--editor--interests .input__bottom__error,
    .new-lifeline--editor--interests .step-actions__error,
    .new-lifeline--editor--achievements .input__bottom__error,
    .new-lifeline--editor--achievements .step-actions__error,
    .new-lifeline--editor--achievements .achievement-editor .input__bottom__error,
    .new-lifeline--editor--achievements .achievement-editor .step-actions__error {
        width: auto
    }
      }
  .new-lifeline--editor--remembering .input__bottom__error .svg--cross path, .new-lifeline--editor--relationships .input__bottom__error .svg--cross path, .new-lifeline--editor--interests .input__bottom__error .svg--cross path, .new-lifeline--editor--achievements .input__bottom__error .svg--cross path, .new-lifeline--editor--achievements .achievement-editor .input__bottom__error .svg--cross path {
          stroke: var(--white) !important;
        }
  @media (min-width: 1024px) {
      .new-lifeline--editor--remembering .step-actions__error, .new-lifeline--editor--relationships .step-actions__error, .new-lifeline--editor--interests .step-actions__error, .new-lifeline--editor--achievements .step-actions__error, .new-lifeline--editor--achievements .achievement-editor .step-actions__error {
        left: 50%;
        -webkit-transform: translateY(-80%) translateX(-50%);
                transform: translateY(-80%) translateX(-50%);
      }

        .new-lifeline--editor--remembering .step-actions__error--visible, .new-lifeline--editor--relationships .step-actions__error--visible, .new-lifeline--editor--interests .step-actions__error--visible, .new-lifeline--editor--achievements .step-actions__error--visible, .new-lifeline--editor--achievements .achievement-editor .step-actions__error--visible {
          opacity: 1;
          pointer-events: all;
          -webkit-transform: translateY(-100%) translateY(-1.4rem) translateX(-50%);
                  transform: translateY(-100%) translateY(-1.4rem) translateX(-50%);
        }
    }
  @media (max-height: 850px) {
      .new-lifeline--editor--remembering .step-actions__error, .new-lifeline--editor--relationships .step-actions__error, .new-lifeline--editor--interests .step-actions__error, .new-lifeline--editor--achievements .step-actions__error, .new-lifeline--editor--achievements .achievement-editor .step-actions__error {
        left: 50%;
        -webkit-transform: translateY(1.4rem);
                transform: translateY(1.4rem);
      }

        .new-lifeline--editor--remembering .step-actions__error--visible, .new-lifeline--editor--relationships .step-actions__error--visible, .new-lifeline--editor--interests .step-actions__error--visible, .new-lifeline--editor--achievements .step-actions__error--visible, .new-lifeline--editor--achievements .achievement-editor .step-actions__error--visible {
          opacity: 1;
          pointer-events: all;
          -webkit-transform: translateY(0);
                  transform: translateY(0);
        }
    }
  @media (max-height: 850px) {
  .new-lifeline--editor--relationships .step-actions {
        display: -webkit-box;
        display: flex;
        z-index: 1
    }
      }
  .new-lifeline--editor--relationships .relationships-editor .input__bottom__error,
    .new-lifeline--editor--relationships .relationships-editor .step-actions__error,
    .new-lifeline--editor--relationships .memories-collection-popup .input__bottom__error,
    .new-lifeline--editor--relationships .memories-collection-popup .step-actions__error,
    .new-lifeline--editor--achievements .achievement-editor .input__bottom__error,
    .new-lifeline--editor--achievements .achievement-editor .step-actions__error {
      margin-top: 0;
      padding-left: 0;
      background-color: var(--white);
      color: var(--bright-red);
    }
  .new-lifeline--editor--relationships .relationships-editor .input__bottom__error .svg--cross path, .new-lifeline--editor--relationships .relationships-editor .step-actions__error .svg--cross path, .new-lifeline--editor--relationships .memories-collection-popup .input__bottom__error .svg--cross path, .new-lifeline--editor--relationships .memories-collection-popup .step-actions__error .svg--cross path, .new-lifeline--editor--achievements .achievement-editor .input__bottom__error .svg--cross path, .new-lifeline--editor--achievements .achievement-editor .step-actions__error .svg--cross path {
          stroke: var(--bright-red) !important;
        }


/*# sourceMappingURL=chunk-10--97595cd78eaa358f0c1f.css.map*/