a.skipnav {
  color: $color-black;
  left: 0;
  padding: 1rem 1.5rem;
  position: absolute;
  top: -4.2rem;
  transition: all 0.2s ease-in-out;
  z-index: 8000;
  max-width: none;
  outline-offset: 0;

  &:focus {
    @include media-breakpoint-up(sm) {
      background-color: $color-white;
      left: 0;
      outline: $focus-outline;
      position: absolute;
      top: 0;
      transition: all 0.2s ease-in-out;
      padding: 1rem calc((#{$grid-gutter-width} / 2) / 2);
      margin-top: calc(#{map-get($spacers, 4)} - 1px);
      margin-left: calc((#{$grid-gutter-width} / 2) / 2);
    }
  }
}

#main-content:focus{
  outline: $focus-outline;
}