.meLearningBoxMenu-item {
  &__inner {
    margin: 1rem 1.5rem 1rem;
    padding: 0;
    padding-bottom: 1rem;
    background-color: @menu-item;
    color: @menu-item-inverted;
    border-radius: @item-border-radius;
    -webkit-box-shadow: 0px 3px 10px 1px fade(#111, 15%);
    -moz-box-shadow: 0px 3px 10px 1px fade(#111, 15%);
    box-shadow: 0px 3px 10px 1px fade(#111, 15%);
  }

  &__details {
    padding: 1rem;
    position: relative;
  }

  &__image-container {
    margin-bottom: @menu-item-image-margin;
    img {
      border-radius: 5px 5px 0 0;
    }
  }

  &__title {
    margin-bottom: @menu-item-title-margin;
    .menu-item-title;
    color: @heading-color;
  }

  &__body {
    margin-bottom: 2rem;
    .menu-item-body;
  }

  &__body a {
    .link-text;
  }

  &__duration {
    margin-bottom: @menu-item-duration-margin;
    .menu-item-body;
  }

  &__progress {
    margin-bottom: @menu-item-progress-margin;
  }

  .meLearningBoxMenu-item__button-container {
    position: absolute;
    bottom: 1rem;
    right: 2rem;
  }

  &__button {
    background-color: @menu-item-btn-color;
    color: @menu-item-btn-color-inverted;
    padding: 0.5rem 3rem;

    .no-touch &:not(.is-disabled):not(.is-locked):hover {
      background-color: @menu-item-btn-color-hover;
      color: @menu-item-btn-color-inverted-hover;
      .transition(background-color @duration ease-in, color @duration ease-in;);
    }
  }

  &.has-img-zoom &__image-container {
    .img-zoom();
  }
}
.meLearningBoxMenu-item__inner {
    border-radius: 20px;
}

img.menu-item__image.meLearningBoxMenu-item__image {
    border-radius: 20px 20px 0 0;
}
