.three-d-nav-group {
  display: grid;
  width: 150px;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
}

.three-d-nav-group > a { width: auto; }

.three-d-nav-toggle {
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  color: currentColor;
  cursor: pointer;
  place-items: center;
}

.three-d-nav-toggle::before {
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 160ms ease;
}

.three-d-nav-group.is-open .three-d-nav-toggle::before {
  transform: rotate(225deg) translate(-2px, -2px);
}

.three-d-nav-group > .three-d-project-links,
.three-d-nav-group > .project-three-d-links,
.three-d-nav-group > .td-three-d-project-links {
  display: none !important;
  grid-column: 1 / -1;
}

.three-d-nav-group.is-open > .three-d-project-links,
.three-d-nav-group.is-open > .project-three-d-links,
.three-d-nav-group.is-open > .td-three-d-project-links {
  display: flex !important;
}

@media (min-width: 721px) {
  .three-d-nav-group.is-open > .three-d-project-links,
  .three-d-nav-group.is-open > .project-three-d-links,
  .three-d-nav-group.is-open > .td-three-d-project-links {
    margin-top: 12px !important;
  }
}

@media (max-width: 720px) {
  .category-nav .three-d-nav-group { width: auto; }
}