@mixin highlighted-navigation($color) {

a, span {
  color: $color;
  opacity: 0.8;
  transition: opacity 200ms ease-in-out;

  &:hover {
    opacity: 1;
  }
}

}

.Vlt-sidenav {

flex: 0 0 300px;
width: 300px;

&__collapse__close {
  position: absolute;
  right: 20px;
}

&--collapsed .Vlt-badge {
  font-size: 0px;
  left: 20px;
  top: 20px;
  right: 0px;
  width: 20px;
  height: 20px;
}

}

.Vlt-sidemenu–flat {

.Vlt-sidemenu__link {
  padding: 4px 10px;
}

li {
  a {
    font-weight: 900;
  }

  li {
    a {
      font-weight: 600;
    }

    li {
      a {
        font-weight: 400;
      }
    }
  }
}

}

.Vlt-sidemenu__title + ul > li {

margin-left: 0 !important;

}

@media #{$M-plus} {

.Vlt-sidenav {
  height: calc(100vh - 150px);
}

}

.navigation–documentation {

.navigation-item--api-reference a {
  color: $purple;
}

.navigation-item--ncco-reference a {
  color: $orange;

  .navigation-item--ncco-reference a {
    color: $orange;
  }
}

}

#Vlt-sidenav-mobile-trigger {

display: inline-block;

svg {
  height: 24px;
  width: 24px;
  fill: #131415;
}

@media #{$M-plus} {
  display: none;
}

}

.Nxd-tutorial {

border-right: 1px solid silver;

}

.Nxd-tutorial-sidenav {

background: $white;

a {
  color: black;
}
padding: 0px;

li li {
  margin-left: 10px !important;
}

}

.Nxd-sidenav {

@media #{'only screen and (min-width: #{$small-screen} ) and (max-width: #{$big-screen})'} {
  margin-top: 250px;
}
@media #{$S-only} {
  margin-top: 0px;
}

}

.Nxd-sidenav-badge {

position: absolute;
top: 14px;
right: 35px;
z-index: 1;

}

li.navigation-item {

position: relative;

}