_breadcrumb.scss

.header-large--wrap ~ .\--breadcrumb-container {
  //display: none !imp
  margin-top: 0;
}

.\--breadcrumb-container {
  height: 48px;
  min-height: 48px;
  width: 100%;
  border-bottom: $border;
  padding: 0 $unit*2;
  //margin-top:$header-height;
  display: flex;
  align-items: center;
  justify-content: space-between;
  //position: fixed;
  background: white;
  top: 80px;
  z-index: 999;
  &.after {
    top: 399px !important;
    position: static;
  }
  &.affix{
    position: fixed;
    top: 80px;
      & ~ main section.\--page-body{
        padding-top:68px;
      }
  }
  .\--fork {
    a {
      padding-top: $unit/2;
      display: flex;
      div.icon {
        width: 20px;
        margin-right: 2px;
        margin-top: -2px;
        svg {
          max-width: 100%;
          path {
            fill: currentColor;
          }
        }
      }
    }
  }
  .fixed {
    position: fixed;
  }
  .\--wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .toggle-sidebar {
    display: none;
    //display: flex;
    @include handheld {
      align-self: stretch;
      align-items: center;
      display: flex;
      color: currentColor !important;
      &::before {
        display: none !important;

      }
      &.on {
        .show {
          display: none;
        }
        .hide {
          display: block;
        }
        div.icon {
          transform: rotate(360deg);
        }
      }
      span {
        display: block;
        margin-left: $unit/2;
      }
      .show {

      }
      .hide {
        display: none;
      }
      div.icon {
        transition: 0.2s all ease-in-out;
        margin-bottom: -3px;
        //margin-right:;
        transform: rotate(180deg);
        transform-origin: 50% 40%;
      }
    }
  }
  .\--breadcrumb-list {
    display: flex;
    @include handheld {
      display: none;
    }
    li {
      padding: 0 $unit*2;
      text-transform: capitalize;

      &:first-of-type {
        padding-left: 0;
      }
      //font-weight:300 !important;
      font-size: 1rem;
      display: flex;
      align-items: center;
      &:hover {
        div.icon svg path {
          fill: $bblue;
          opacity: 1;
        }
      }
      div.icon {
        width: 18px;
        margin-bottom: -4px;
        margin-right: $unit/2;
        svg {
          max-width: 100%;
          path {
            opacity: 0.2;

            fill: currentColor;
          }
        }
      }
      border-right: $border;

      &:last-of-type {
        border-right: 0;
        span {
          font-weight: 700;
          //color: $bblue;
          opacity: 0.3;
        }

      }
      .\--current {
        font-weight: 700;
        //color: $bblue;
        opacity: 0.4;
        span{
          opacity:1;
        }
        &:hover {
          opacity: 1;
        }
      }

    }
  }
}