// ------------------------------
// Programs: Views

// About: styling for specific views.

// ------------------------------
// #PROGRAM LISTS
// ------------------------------
.program-list {
  list-style-type: none;
  padding-left: 0;

  .program-details {
    .name {
      font-size: 2rem;
    }

    .status {
      @include float(right);
    }

    .category {
      color: palette(grayscale, base);
    }
  }
}

.app-header {
  @include clearfix();
  border-bottom: 1px solid palette(grayscale, base);
  margin-bottom: 20px;
}

.course-container {
  .subtitle {
    color: palette(grayscale, base);
  }
}

.run-container {
  position: relative;
  margin: {
    bottom: 20px;
  };

  &:before {
    content: '';
    width: 5px;
    height: calc( 100% + 1px );
    background: palette(grayscale, base);
    position: absolute;
    top: 0;
    left: 0;
  }
}

.course-container {
  margin: {
    bottom: 20px;
  };
}