/************************
 * VIEW MODE: FULL
 ***********************/

.node--type-resource.node--view-mode-full {}

  .node--type-resource.node--view-mode-full .field--name-field-resource-date {
    margin-top:28px;
    font-weight: 700;
  }


/************************
 * VIEW MODE: CARD
 * Note that these use node--style-resource class,
 * because both Resource and Microsite nodes use the same style.
 ***********************/

.node--style-resource.node--view-mode-card {
  background-color: #ebebeb;
  padding: 20px 30px 30px;
  display: flex;
  flex-direction: column;
  text-align: center;
  position: relative;
}

  .node--style-resource.node--view-mode-card .field--name-field-resource-type {
    text-align: center;
    text-transform: uppercase;
    font-family: roboto, sans-serif;
    font-weight: 900;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 2px;
    margin-bottom: 10px;
    color: #060606;
    order: 2;
  }
  @media (min-width: 768px) {
    .node--style-resource.node--view-mode-card .field--name-field-resource-type {
      font-size: 15px;
    }
  }

  .node--style-resource.node--view-mode-card h3 {
    font-family: roboto, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.1;
    margin: 0;
    color: #060606;
    order: 3;
  }
  @media (min-width: 768px) {
    .node--style-resource.node--view-mode-card h3 {
      font-size: 20px;
    }
  }

    .node--style-resource.node--view-mode-card h3 a {
      color: #060606;
    }


/************************
 * VIEW MODE: FEATURED
 * Note that these use node--style-resource class,
 * because both Resource and Microsite nodes use the same style.
 ***********************/

.node--style-resource.node--view-mode-featured {}

  .node--style-resource.node--view-mode-featured h3 {
    margin-bottom: 20px;
  }

  .node--style-resource.node--view-mode-featured .node__content {
    padding-bottom: 20px;
    margin-bottom: 0;
  }

  .node--style-resource.node--view-mode-featured .taxonomy-term--type-resource-types {}

    .node--style-resource.node--view-mode-featured .taxonomy-term--type-resource-types img {
      height: 40px;
      margin-right: 5px;
      vertical-align: middle;
      display: inline;
    }

    .node--style-resource.node--view-mode-featured .taxonomy-term--type-resource-types .taxonomy-term--name {
      vertical-align: middle;
    }