.x-app-description-header {
  @include make-col-ready();
  @include make-col(12);

  &-row { @include make-row(); }

  &-container { 
    @include make-col-ready();
    @include make-col(12);

    display: flex;
  }

  &-icon {
    display: flex;
    flex: 0 0 3rem; 
    margin-right: 1.5rem;
  }

  &-content {
    display: flex;
    flex: 1;
    flex-wrap: wrap;

    @include media-breakpoint-up(sm) {
      flex-wrap: nowrap;
    }
  }

  &-info { 
    display: flex;
    flex: 1 1 100%; 
    flex-wrap: wrap; 
    align-items: center; 
    margin-top: 0.5rem;

    @include media-breakpoint-up(sm) {
      margin-top: 0;
    }
  }

  &-title {
    flex: 1 1 100%;
    
    * {
      margin-bottom: 0;
    }
  }

  &-subtitle {
    flex: 1 1 100%;
    color: theme-color("grey");
  }

  &-action { 
    display: flex;
    flex: 1 1 100%; 
    margin-top: 1rem;
    margin-bottom: 1rem;
    align-items: center;

    @include media-breakpoint-up(sm) {
      flex: 0;
      margin-top: 0;
      margin-bottom: 0;
    }
  }
}