.view-more-card {
    padding: 30px;
    transition: all 0.5s ease-in-out, margin 1s ease-in-out;
    margin-bottom: 0;
  }

  .view-more-card:not(.expanded) {
      gap: 0;
  }

  .view-more-card .card-extra {
    opacity: 0;
    height: 0;

    position: fixed;
    bottom: 0px;
    right: 0px;
  }

  .view-more-card.expanded {
    margin-bottom: 4rem;
  }

  .view-more-card.expanded > .card-extra {
    display:block;
    opacity:1;
    height: auto;
    max-width: 100%;

    position: inherit;
    bottom: inherit;
    right: inherit;
  }

  .toggle-view-more-card-btn {
    cursor: pointer;
  }

  .view-more-card > div:first-child .toggle-view-more-card-btn:last-child,
  .view-more-card.expanded > div:first-child .toggle-view-more-card-btn:first-child {
    display: none
  }

  .view-more-card > div:first-child .toggle-view-more-card-btn:first-child,
  .view-more-card.expanded > div:first-child .toggle-view-more-card-btn:last-child {
    display: block
  }

  .view-more-card:hover:not(.expanded)  {
    background-color: white !important;
  }


@media screen and (max-width: 769px) {
  .view-more-card > div {
    flex-wrap: wrap;
  }

  .view-more-card a {
    word-break: break-all;
  }
}