.fly-out {
  position: relative;

  a {
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
  }
}

.fly-out__toggle {
  cursor: pointer;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
}

.fly-out__content {
  display: none;
  position: absolute;
  left: 0;

  &.is-centered {
    width: auto;
  }

  &.on-right-edge {
    left: auto;
    right: 0;
  }
}

.fly-out.is-open .fly-out__content {
  z-index: $z-index-fly-outs;
  display: block;
}