.centeredPrompt {
  /**
   * Lay out the children of this container with
   * flexbox.
   */
  display: flex;

  /**
   * Rotate the main axis so that the children
   * are laid out vertically, the same as in the
   * above "Side bar" example.
   */
  flex-direction: column;

  /**
   * Instead of pushing the children apart, as in
   * previous examples, we will group them together
   * in the center of their container.
   */
  justify-content: center;

  /**
   * Align the children in the center, along
   * the main axis. Because the direction is
   * "column" this has a similar effect as setting
   * text-align: center.
   */
  align-items: center;

  min-height: 300px;
  padding: 10px;
}

  .centeredPrompt__item + .centeredPrompt__item {
    margin-top: 5px;
  }

    .centeredPromptIcon {
      font-size: 60px;
      line-height: 0;
    }

    .centeredPromptLabel {
      color: #86969C;
      font-size: 30px;
      font-weight: 700;
      text-align: center;
    }

    .centeredPromptDetails {
      color: #86969C;
      font-size: 16px;
      margin-bottom: 10px;
      text-align: center;
    }

.icon {
  color: #BCD2DA;
}
