/* ----------------------------- */
/* ==Misc (skip links, hyphens)  */
/* ----------------------------- */

/* styling skip links */
.#{$kna-namespace}skip-links {
  position: absolute;

  & a {
    position: absolute;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0.5em;
    background: black;
    color: white;
    text-decoration: none;

    &:focus {
      position: static;
      overflow: visible;
      clip: auto;
    }
  }
}

// hyphens on tiny screens
@include media('<=tiny-screen') {
  /* you shall not pass */
  div,
  textarea,
  table,
  td,
  th,
  code,
  pre,
  samp {
    word-wrap: break-word;
    hyphens: auto;
  }
}

// use .no-wrapping to disallow hyphens on small screens
@include media('<=tiny-screen') {
  .no-wrapping {
    word-wrap: normal;
    hyphens: manual;
  }
}