code,
pre {
  @include font-size-small;
  font: {
    weight: $font-weight-regular;
    family: $font-family-code;
  }
  white-space: pre-wrap;
  background: rgba($color-background-shade, .175);
  color: $color-text-strong;
  @include border-radius(4px);
  border: 1px solid #ebebeb;
  @include box-sizing(border-box);
}

code {
  padding: .25em;
  line-height: 0;
}

pre {
  @include trailer;
  @include rhythm(.5, .5, .5, .5);
  @include bleed(1em);
  display: block;
  overflow-y: auto;
  margin: auto 0 25px;
  word: {
    break: break-all;
    wrap: break-word;
  }

  // Account for some code outputs that place code tags in pre tags
  code {
    @extend %reset-padding;
    background: none;
    font-size: inherit;
    line-height: inherit;
  }
  &.highlight .err {
    background: #fcc;
  }
}