.breadcrumb {
  padding-top: 16px;
  padding-bottom: 16px;
  margin-bottom: 0;
  color: #5E5E5E;
}

.breadcrumb__content ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 5px;
}

.breadcrumb__content ul li a {
  color: #0070B9;
  font-weight: 700;
}

.breadcrumb__content ul li a:hover {
  text-decoration: underline;
  text-underline-offset: 6px;
}

.breadcrumb__content .breadcrumb-item + .breadcrumb-item::before {
  padding-right: var(--bs-breadcrumb-item-padding-x);
  color: var(--bs-breadcrumb-divider-color);
  content: var(--bs-breadcrumb-divider, "|");
}

@media (max-width: 580px) {
  .breadcrumb__content ul{
    flex-wrap: wrap;
  }
  .breadcrumb__content ul li {
    display: none; /* Hide all li elements by default */
  }

  .breadcrumb__content ul li::before {
    content: "..."!important;
  }

  .breadcrumb__content ul li:nth-last-child(-n+2) {
      display: list-item; /* Display the last two li elements */
  }
  .breadcrumb__content ul li:last-child::before {
    display: initial;
    content: "|"!important;
  }
  .breadcrumb__content ul li:first-child::before {
    display: none!important;
  }
}