.vss-Breadcrumb--container {
  overflow: hidden;
  display: flex;
  align-items: center; }
  .vss-Breadcrumb--container .vss-Breadcrumb--resizeGroup {
    flex-grow: 1;
    overflow: hidden; }

.vss-Breadcrumb.ms-Breadcrumb {
  margin: 4px 0; }

.vss-Breadcrumb li.ms-Breadcrumb-listItem {
  margin-left: 2px; }
  .vss-Breadcrumb li.ms-Breadcrumb-listItem:first-of-type {
    margin-left: 0; }

.vss-Breadcrumb .vss-Breadcrumb--light {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55)); }

.vss-Breadcrumb .vss-Breadcrumb--divider-container {
  display: flex;
  align-items: center;
  align-self: stretch; }

.vss-Breadcrumb .vss-Breadcrumb--item-dropdown {
  font-size: 12px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55)); }

.vss-Breadcrumb .vss-Breadcrumb--divider {
  width: 20px;
  height: 24px;
  text-align: center; }
  .vss-Breadcrumb .vss-Breadcrumb--divider.vss-Breadcrumb--divider-link:hover {
    background-color: rgba( 244, 244, 244 ,  1 );
    background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 ); }
  .vss-Breadcrumb .vss-Breadcrumb--divider .vss-Breadcrumb--item-dropdown {
    font-size: 12px;
    color: rgba(0, 0, 0, .55);
    color: var(--text-secondary-color,rgba(0, 0, 0, .55)); }
  .vss-Breadcrumb .vss-Breadcrumb--divider .vss-Breadcrumb--forward-slash {
    font-size: 16px; }
  .vss-Breadcrumb .vss-Breadcrumb--divider.vss-Breadcrumb--divider-light {
    color: rgba(0, 0, 0, .55);
    color: var(--text-secondary-color,rgba(0, 0, 0, .55)); }
  .vss-Breadcrumb .vss-Breadcrumb--divider.vss-Breadcrumb--divider-extra-padding {
    padding: 0px 8px; }

.vss-Breadcrumb .vss-Breadcrumb--item {
  display: inline-flex;
  align-items: center;
  align-self: stretch; }
  .vss-Breadcrumb .vss-Breadcrumb--item.vss-Breadcrumb--item-min-height {
    min-height: 30px; }
  .vss-Breadcrumb .vss-Breadcrumb--item a {
    text-decoration: none; }
  .vss-Breadcrumb .vss-Breadcrumb--item a:hover {
    text-decoration: none; }
  .vss-Breadcrumb .vss-Breadcrumb--item.no-click button {
    cursor: default; }
    .vss-Breadcrumb .vss-Breadcrumb--item.no-click button:hover {
      background-color: transparent; }
    .vss-Breadcrumb .vss-Breadcrumb--item.no-click button span.ms-Breadcrumb-item {
      cursor: default; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--hiddenElement {
    display: none; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemContainer {
    display: flex;
    align-items: center;
    border-radius: 2px; }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemContainer span.ms-Breadcrumb-item {
      cursor: pointer; }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemContainer:hover {
      background-color: rgba(0, 0, 0, 0.04);
      background-color: var(--palette-black-alpha-4,rgba(0, 0, 0, 0.04)); }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemContainer:active {
      background-color: rgba(0, 0, 0, 0.20);
      background-color: var(--palette-black-alpha-20,rgba(0, 0, 0, 0.20)); }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemContainer .vss-Icon {
      color: rgba(0, 0, 0, .9);
      color: var(--text-primary-color,rgba(0, 0, 0, .9)); }
  .vss-Breadcrumb .vss-Breadcrumb--item .ellipsis-text {
    overflow: hidden;
    text-overflow: ellipsis; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemText {
    font-size: 18px;
    font-weight: 400; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--itemText-small {
    font-size: 14px;
    font-weight: 400;
    padding: 4px 8px; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--item-leftIcon {
    font-size: 18px;
    margin-right: 4px;
    margin-left: 8px;
    /* If the icon is an image, then must set a width */ }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--item-leftIcon div.ms-Image {
      height: 18px;
      width: 18px; }
  .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--item-dropdown-with-picker {
    margin-top: 4px;
    margin-right: 8px; }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--item-dropdown-with-picker:hover {
      background-color: rgba( 244, 244, 244 ,  1 );
      background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 ); }
    .vss-Breadcrumb .vss-Breadcrumb--item .vss-Breadcrumb--item-dropdown-with-picker:active {
      background-color: rgba( 200, 200, 200 ,  1 );
      background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 ); }

.vss-PickList.picker-dropdown {
  min-width: 220px;
  min-height: 36px;
  justify-content: center; }
  .vss-PickList.picker-dropdown .vss-PickList--searchSection {
    padding-top: 8px; }
  .vss-PickList.picker-dropdown .vss-PickList--items {
    max-height: 270px; }

/**
 * Internal breadcrumb styles come from Office Fabric breadcrumb styles
 */
.internal-breadcrumb--list {
  white-space: nowrap;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: stretch; }

.internal-breadcrumb--listItem {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  position: relative;
  align-items: center; }

.internal-breadcrumb--overflow {
  position: relative;
  display: flex;
  align-items: center; }

.vss-Breadcrumb .internal-breadcrumb--overflowButton {
  position: relative;
  font-size: 16px;
  font-weight: 400;
  box-sizing: border-box;
  display: inline-block;
  text-align: center;
  vertical-align: top;
  padding: 0px 4px;
  width: 32px;
  height: 24px;
  cursor: pointer;
  background-color: transparent;
  border-color: transparent;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55)); }
  .vss-Breadcrumb .internal-breadcrumb--overflowButton:hover, .vss-Breadcrumb .internal-breadcrumb--overflowButton:active {
    background-color: rgba(0, 0, 0, 0.06);
    background-color: var(--palette-black-alpha-6,rgba(0, 0, 0, 0.06)); }

.internal-breadcrumb--item {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  padding: 0 8px;
  max-width: 160px; }
