.node {
  position: relative;
}

.node--unpublished {
  background-color: #fff4f4;
}

.node__submitted {
  margin: 1em 0;
}

.teaser-list .node--view-mode-teaser {
  padding-bottom: 30px;
  border-bottom: 1px #060606 solid;
  margin-bottom: 30px;
}
.teaser-list .views-row:last-child .node--view-mode-teaser,
.teaser-list > .field__items > .field__item:last-child .node--view-mode-teaser {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.paragraph--view-mode-full .teaser-list + .more-link {
  margin-top: 30px;
  padding-top: 6px;
  border-top: 1px #060606 solid;
}


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

.section-backlink {
  margin-top: 30px;
  margin-bottom: 30px;
}

.node--view-mode-full .component--type-related-links .field + .field {
  margin-top: 10px;
}

  .node--view-mode-full .component--type-related-links .field__label {
    font-weight: normal;
    font-style: italic;
  }

.node--view-mode-full .component--type-related-links .field + .field--name-field-tags {
  margin-top: 16px;
}
  .node--view-mode-full .field--name-field-tags .field__item {
    display: inline;
  }
  .node--view-mode-full .field--name-field-tags .field__item + .field__item {
    margin-left: 0.5em;
  }
    .node--view-mode-full .field--name-field-tags a {
      display: inline-block;
      background: #dedede;
      padding: 2px 8px;
      border-radius: 4px;
    }

/**********************
 * VIEW MODE: TEASER
 **********************/

.node--view-mode-teaser {
  display: flex;
  flex-direction: column;
  width: 100%;
}

  .node--view-mode-teaser h3 {
    order: 2;
    font-family: roboto, sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 1.4;
    margin: 0;
  }
  @media (min-width: 768px) {
    .node--view-mode-teaser h3 {
      font-size: 20px;
    }
  }

  .node--view-mode-teaser .field--type-datetime {
    order: 1;
    font-size: 16px;
    line-height: 18px;
    text-transform: uppercase;
    margin-bottom: 8px;
  }

/******************************
 * VIEW MODE: CARD
 *****************************/

.node--view-mode-card {
  /* If cards are laid out in a grid, ensure card are equal width. */
  width: 100%;
}

  .node--view-mode-card .type-icon {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background-color: rgba(1,157,224,0.6); /* #019de0 */
    padding: 16px;
    margin: 0 auto 20px;
    order: 2;
  }
  .node--view-mode-card:hover .type-icon,
  .node--view-mode-card:focus .type-icon {
    background-color: rgba(1,157,224,1);
  }

    .node--view-mode-card .type-icon img {
      width: 46px;
      height: 46px;
    }

/**************************
* VIEW MODE: CARD with COLORS
 ************************/

.content--color-blue .node--view-mode-card .type-icon {
  background-color: rgba(1,157,224,0.8); /* #0f369b */
}
.content--color-blue .node--view-mode-card:hover .type-icon,
.content--color-blue .node--view-mode-card:focus .type-icon {
  background-color: rgba(1,157,224,1);
}

.content--color-bluedark .node--view-mode-card .type-icon {
  background-color: rgba(15,54,155,0.8); /* #0f369b */
}
.content--color-bluedark .node--view-mode-card:hover .type-icon,
.content--color-bluedark .node--view-mode-card:focus .type-icon {
  background-color: rgba(15,54,155,1);
}

.content--color-orange .node--view-mode-card .type-icon {
  background-color: rgba(235,63,33,0.8); /* #eb3f21 */
}
.content--color-orange .node--view-mode-card:hover .type-icon,
.content--color-orange .node--view-mode-card:focus .type-icon {
  background-color: rgba(235,63,33,1);
}

.content--color-purple .node--view-mode-card .type-icon {
  background-color: rgba(111,43,228,0.8); /* #6f2be4 */
}
.content--color-purple .node--view-mode-card:hover .type-icon,
.content--color-purple .node--view-mode-card:focus .type-icon {
  background-color: rgba(111,43,228,1);
}


/******************************
 * VIEW MODE: FEATURED
 *****************************/

.node--view-mode-featured {
  width: 100%;
  padding-left: 20px;
  border-left: 2px #060606 solid;
}

  .node--view-mode-featured h2 {
    text-align: left;
    display: inline-block;
    text-transform: uppercase;
    font-size: 18px;
    line-height: 1.1;
    font-weight: 900;
    background-color: #68d2f2;
    padding: 4px 8px;
    margin-bottom: 12px;
    letter-spacing: 2px;
  }
  @media (min-width: 768px) {
    .node--view-mode-featured h2 {
      font-size: 20px;
    }
  }

  .node--view-mode-featured h3 {
    font-weight: 700;
    font-size: 30px;
    line-height: 1;
    margin-bottom: 30px;
    position: relative;
  }
  @media (min-width: 768px) {
    .node--view-mode-featured h3 {
       font-size: 50px;
    }
  }


  .node--view-mode-featured h3:before {
    content: '';
    width: 20px;
    height: 20px;
    position: absolute;
    left: -21px;
    top: 14px;
    background: url(../../images/arrow-right-black.svg) left center no-repeat;
  }

  .node--view-mode-featured .node__content {
    margin-bottom: 50px;
  }

  .node--view-mode-featured .more-link {
    text-align: left;
  }

/************************
 * VIEW MODE: SEARCH CARD
 ***********************/

.node--view-mode-search-card {
  width: 100%;
  padding: 0 0 15px 0;
  display: flex;
  flex-direction: column;
  position: relative;
}

  .node--view-mode-search-card .resource-type {
    order: 1;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 900;
    line-height: 18px;
    letter-spacing: 2px;
    margin-bottom: 10px;
  }
    .node--view-mode-search-card .type-icon {
      line-height: 0;
      margin-bottom: 12px;
    }
      .node--view-mode-search-card .type-icon img {
        width: auto;
        height: 44px;
        line-height: 1;
      }

  .node--view-mode-search-card h3 {
    order: 2;
    font-family: roboto,sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 6px;
  }

  .node--view-mode-search-card .field--name-field-resource-date {
    margin-top: 4px;
    font-size: 20px;
    line-height: 24px;
    color: #585656;
    order: 3;
  }

  .node--view-mode-search-card .field--name-field-resource-issues {
    margin-top: 6px;
    font-size: 15px;
    line-height: 18px;
    text-transform: uppercase;
    color: #585656;
    order: 4;
  }
    .node--view-mode-search-card .field--name-field-resource-issues .field__item {
      display: inline;
    }