article.recipe {
  margin-bottom: 1.5rem;

  img {
    margin: 0 0 1.5rem;
  }

  .field--name-field-recipe-ingredients {
    margin: 1.5rem 0;
    padding-top: 1rem;

    @media (width >= 600px) {
      margin: 0 1rem 0 0;
    }

    .field__label {
      font-size: 1.4rem;
      padding-bottom: 1rem;
    }

    .field__items {
      margin-left: 1rem;
    }

    .field__item {
      display: list-item;
      list-style-type: disc;
    }
  }

  .field--name-field-nutrition-element {
    border: 1px solid var(--il-blue);
    background-color: var(--ems-lt-grey);
    padding: 1.5rem;

    .field__label {
      font-size: 1.4rem;
      padding-bottom: .5rem;
      border-bottom: solid 2px var(--il-blue);
    }

    .field__items {
      border-bottom: solid 2px var(--il-blue);
      padding: .5rem 0;
    }
  }

  .field--name-field-recipe-steps {
    margin: 0 0 1.5rem;
    padding-top: 1rem;

    .field__label {
      font-size: 1.4rem;
      padding-bottom: 1rem;
    }

    .field__item {
      display: list-item;
      list-style-type: decimal;
      margin: 0 0 1rem 1rem;
    }
  }

  .field--name-field-servings-per-recipe, .field--name-field-serving-size, .field--name-field-cook, .field--name-field-prep {
    padding-bottom: 1rem;

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

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

  .field--name-field-recipe-note {
    .field__label {
      float: left;
      padding-right: .5rem;
    }

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

  }

  .field--name-field-servings-per-recipe, .field--name-field-cook, .field--name-field-prep, .field--name-field-serving-size {
    font-size: 1.4rem;
  }

  .field--name-field-menu-category {
    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;

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

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

  .social-sharing-buttons {
    justify-content: start;
    fill: var(--il-blue);
  }
}

article.recipe.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%;
  }
}

#nutrition-facts-block {
  display: none;
  position: relative;
  top: 10px;
  width: 270px;
}

@media print {
  article.recipe {
    .nutrition-facts {
      #show {
        display: none;
      }
    }

    #nutrition-facts-block {
      display: block !important;
      top: auto;
      width: auto;
      font-size: 1rem;

      .field__label {
        font-size: 1rem;
        padding: 0;
      }

      .field--name-field-nutrition-element {
        padding: 1rem;

        .field__items {
          padding: 0;
          line-height: 1.5rem;
        }
      }
    }

    .divider-print {
      border-bottom: solid 1px #000;
      margin-bottom: 1rem;
      padding-bottom: 1rem;
    }

    .field--name-field-servings-per-recipe,
    .field--name-field-serving-size {
      font-size: 1rem;
    }

    .field--name-field-menu-category {
      display: none;
    }

    .social-sharing-buttons {
      display: none;
    }

    .field--name-field-recipe-ingredients,
    .field--name-field-recipe-steps,
    .field--name-field-recipe-note {
      font-size: 1rem;
      line-height: 1.5rem;

      p {
        font-size: 1rem;
        line-height: 1.5rem;
      }
    }

    .field--name-field-section {
      display: none;
    }
  }
}