Initial stab at accordian header on applications page

styles/atat.scss

@@ -12,6 +12,7 @@
 @import 'elements/buttons';
 @import 'elements/panels';
 @import 'elements/block_lists';
+@import 'elements/accordians';
 @import 'elements/tables';
 @import 'elements/sidenav';
 @import 'elements/action_group';

styles/components/_portfolio_layout.scss

@@ -111,6 +111,12 @@
       }
     }
   }
+
+  .application-list {
+    .application-list-item {
+      box-shadow: 0 4px 8px 1px rgba(230,230,230,0.5);
+    }
+  }
 }
 
 .portfolio-funding {

styles/core/_variables.scss

@@ -83,7 +83,7 @@ $color-green-lighter:        #94bfa2;
 $color-green-lightest:       #e7f4e4;
 
 $color-cool-blue:            #205493;
-$color-cool-blue-light:      #4773aa;
+$color-cool-blue-light:      #4190e2;
 $color-cool-blue-lighter:    #8ba6ca;
 $color-cool-blue-lightest:   #dce4ef;
 

styles/elements/_accordians.scss

@@ -0,0 +1,102 @@
+.accordian {
+  @include block-list;
+
+  .icon-link {
+    margin: -$gap 0;
+  }
+
+  .icon-link,
+  .label {
+    &:first-child {
+      margin-left: -$gap;
+    }
+
+    &:last-child {
+      margin-right: -$gap;
+    }
+
+  }
+}
+
+.accordian__header {
+  @include block-list-header;
+  border-top: 3px solid $color-blue;
+}
+
+.accordian__title {
+  @include block-list__title;
+  color: $color-blue;
+  @include h3;
+}
+
+.accordian__description {
+  @include block-list__description;
+  font-style: italic;
+  font-size: $small-font-size;
+  color: $color-gray;
+}
+
+.accordian__actions {
+  margin-top: $gap;
+  display: flex;
+  flex-direction: row;
+
+  .icon-link {
+    font-size: $small-font-size;
+  }
+
+  .counter {
+    background-color: $color-cool-blue-light;
+    color: $color-white;
+    border-radius: 2px;
+    padding: $gap / 2 $gap;
+    margin-left: $gap;
+  }
+
+  .separator {
+    border: 1px solid $color-gray-medium;
+    opacity: 0.75;
+  }
+}
+
+.accordian__item {
+  @include block-list-item;
+
+  &.accordian__item--selectable {
+    > div {
+      display: flex;
+      flex-direction: row-reverse;
+
+      @include ie-only {
+        width: 100%;
+      }
+
+      > label {
+        @include block-list-selectable-label;
+      }
+    }
+
+    > label {
+      @include block-list-selectable-label;
+    }
+
+    input:checked {
+      + label {
+        color: $color-primary;
+      }
+    }
+
+    @include ie-only {
+      dl {
+        width: 100%;
+        padding-left: $gap*4;
+      }
+    }
+
+  }
+}
+
+.accordian__footer {
+  @include block-list__footer;
+  border-top: 0;
+}