.highlight{
    font-size: rem-calc(14px);
    padding: 0;
    background-color: lighten($secondary-color, 8%);
    font-family: 'Source Code Pro', 'Consolas', Monaco, monospace;
    overflow: auto;
    margin-bottom: rem-calc(16px);
    pre{
        tab-size: 4;
        white-space: pre;
        font-family: inherit;
        counter-reset: line-numbering;
        border: solid 1px #d9d9d9;
        border-radius: 0;
        background: #fff;
        padding: rem-calc(3px);
        line-height: 23px;
        overflow-x: auto;
        word-break: inherit;
        word-wrap: inherit;
        a {
            &::before {
                content: counter(line-numbering);
                counter-increment: line-numbering;
                padding-right: 1em; /* space after numbers */
                width: 25px;
                text-align: right;
                opacity: 0.7;
                display: inline-block;
                color: #aaa;
                background: #eee;
                margin-right: 16px;
                padding: 2px 10px;
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
            }
            &:first-of-type::before {
                padding-top: 10px;
            }
            &:last-of-type::before {
                padding-bottom: 10px;
            }
            &:only-of-type::before {
                padding: 10px;
            }
        }
    }
}