article.excercise {
  margin-bottom: 2rem;

  img {
    margin: 0 0 2rem;
  }

  .field--name-field-equipment,
  .field--name-field-duration,
  .field--name-field-ability-level {
    font-size: 1.4rem;
    padding-bottom: .25rem;

    .field__label {
      float: left;
      padding-right: .5rem;
    }

    .field__label::after {
      content: ":";
    }
  }

  .field--name-field-equipment {
    display: flex;
  }

  .field--name-field-video {
    margin-bottom: 2rem;
  }

  .field--name-field-excercise-type {
    .field__items {
      display: flex;
      flex-wrap: wrap;

      @media (width >= 600px) {
        flex-wrap: nowrap;
      }
    }

    .taxonomy-term {
      background-color: var(--ems-yellow);
      padding: 1em;
      margin: 1em 1em 0 0;
      border-radius: .5rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 104px;
      height: 168px;

      .content {
        color: var(--il-blue);
      }

      a {
        color: var(--il-blue);
        text-decoration: none;

        .field--name-field-icon {
          margin: 0 0 .5rem;
        }
      }

      .field--name-name {
        text-align: center;
        font-weight: 600;
        line-height: 1.45rem;
      }
    }
  }
}

article.excercise.teaser {
  .content {
    position: relative;
  }

  .text-overlay {
    position: absolute;
    z-index: 999;
    bottom: 0%;
    background-color: rgb(2 9 51 / 80%);
    width: 100%;
    color: white;
    font-weight: 600;
    padding: 1em;
    text-align: center;

    a {
      color: white;
      text-decoration: none;
    }

    span {
      &:hover{
        color: var(--ems-yellow);
        text-decoration: underline;
      }
    }
  }

  img {
    margin: 0;
    width: 100%;
  }
}

@media print {
  article.excercise {
    .col-md-8 {
      @include make-col(5);
    }
  }
}