.markdown {
    &:focus {
        outline: none;
    }
    p:first-of-type {
        margin-top: 0;
    }
    &.text-small {
        p, li {
            @extend .text-small;
        }
    }
    &.text-x-small {
        p, li {
            @extend .text-x-small;
        }
    }
    ul {
        list-style-type: initial;
        padding-left: 1rem;
    }
    li {
        padding-bottom: 0.5rem;
    }
    a,
    a:visited {
        color: inherit;
    }
    img {
        display: block;
        margin: 1rem auto;
    }
    p {
        margin: 1rem 0;
        line-height: 1.2rem;
    }
    hr {
        border-width: 1px 0 0 0;
    }
    h1, h2, h3, h4, h5, h6 {
        font-weight: 900;
        margin-bottom: 1rem;
        margin-top: 3rem;

        &:first-of-type {
            margin-top: 0;
        }
    }
    h1 {
        @extend .text-x-large;
    }
    h2 {
        @extend .text-large;
    }
    h3 {
        @extend .text-x-medium;
    }
    h4 {
        @extend .text-medium;
    }
    h5 {
        @extend .text-small;
    }
    h6 {
        @extend .text-x-small;
    }

    pre {
        @include border-radius(3px);
        @extend .background-githubGray;
        padding: 1rem;
        overflow: auto;
        line-height: 1.45;
        font-size: 1.1rem;
    }

    code {
        @include border-radius(3px);
        @extend .background-githubGray;
        padding: 0.2rem;
    }
}