$kss-markdown-headings-color: $cowabunga;


.kss-markdown {
  overflow-y: auto;
  overflow-x: hidden;
  max-width: 800px;

  ul,
  ol,
  dl,
  dd,
  blockquote,
  hr,
  table,
  form,
  fieldset,
  figure,
  pre,
  address,
  a,
  p,
  h1, h2, h3, h4, h5, h6 {
    margin: 0;
    color: $black;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }

  a {
    color: $blue;
    font-size: rem(16px);
    text-decoration: none;
  }

  a:hover,
  a:focus {
    color: lighten($blue, 15%);
    outline: 0;
  }

  h1,
  h2 {
    color: $kss-markdown-headings-color;
    font-weight: 700;
  }

  h2 { margin-top: rem(48px); }

  h3,
  h4,
  h5,
  h6 {
    margin-top: rem(24px);
    color: $kss-markdown-headings-color;
    font-weight: 700;
  }

  h1 { font-size: rem(32px); }
  h2 { font-size: rem(30px); }
  h3 { font-size: rem(22px); }
  h4 { font-size: rem(20px); }
  h5 { font-size: rem(18px); }
  h6 { font-size: rem(16px); }

  ol,
  ul,
  p {
    margin-bottom: rem(24px);
    font-size: rem(16px);
  }

  ol,
  ul {
    padding-left: 40px;
    list-style-position: outside;
    font-size: rem(16px);
  }

  ol { list-style-type: decimal; }

  ul { list-style-type: circle; }

  img,
  video,
  audio,
  embed,
  object {
    max-width: 100%;
    display: block;
  }

  audio,
  canvas,
  img,
  video { vertical-align: middle; }

  hr {
    display: block;
    box-sizing: border-box;
    height: 1px;
    margin-top: rem(23px);
    margin-bottom: rem(24px);
    border: 0;
    border-top: 1px solid $gray;
    padding: 0;
  }

  pre,
  pre[class*=language-] {
    overflow: auto;
    border: 1px solid $gray;
    padding: 1em;
    background: #F5F5F5;
  }

  code {
    padding: 2px 5px;
    background: #F5F5F5;
  }
}