.ntrn__sub {
  @include list_reset();

  &--level1 {
    @include respond-to-up($ntrn_breakpoint) {
      display: flex;
      flex-wrap: wrap;
      background: $desktop_panel-bg;
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      visibility: hidden;
      opacity: 0;
      padding: $desktop_panel-padding;
      overflow: hidden;
      height: auto;
      box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
    }

    &.ntrn__sub--active {
      @include respond-to-up($ntrn_breakpoint) {
        opacity: 1;
        visibility: visible;
      }
    }

    .ntrn__cols .ntrn__col {
      > .ntrn__item {
        margin: $desktop_panel-level2-margin;

        &:last-child {
          border:none;
          margin: 0;
          padding: 0;
        }

        > .ntrn__link {
          text-transform: uppercase;
          font-size: $desktop_panel-level2-title-font-size;
          font-weight: 600;
        }
      }
    }

    .ntrn__item--width & {
      width: auto !important;

      @include respond-to-up($ntrn_breakpoint) {
        left: auto;
      }
    }

    .ntrn__item--full & {
      width: 100% !important;

      @include respond-to-up($ntrn_breakpoint) {
        width: 100% !important;
        left: 0 !important;
      }
    }
  }

  &--level2 {
    @include list_reset();

    .ntrn__link {
      @include respond-to-up($ntrn_breakpoint) {
        font-weight: normal;
        font-size: $desktop_panel-level2-font-size;
        padding: 2px 0;
      }
    }
  }

  &--level3 {
    @include respond-to-up($ntrn_breakpoint) {
      margin: $desktop_panel-level3-margin;
    }

    .ntrn__link {
      @include respond-to-up($ntrn_breakpoint) {
        font-size: $desktop_panel-level3-font-size;
      }
    }
  }

  .ntrn--resized & {
    transition: none !important;
  }
}
