/* ==========================================================================
   Disclosure PrismJS Styles
   ========================================================================== */

/*
 * Code blocks
 * --------------------------------------------------------------------------
 */

.content pre[class*="language-"] {
    display: block;

    box-sizing: border-box;

    width: 100%;
    max-width: 100%;

    margin: 30px 0;

    padding: 20px;

    overflow-x: auto;
    overflow-y: hidden;

    background: #272822;

    border: 0;
    border-radius: 5px;

    color: #f8f8f2;

    font-family:
        Consolas,
        Monaco,
        "Andale Mono",
        "Ubuntu Mono",
        monospace;

    font-size: 0.9em;
    line-height: 1.6;

    text-align: left;

    white-space: pre;

    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}


/*
 * Code inside code blocks
 * --------------------------------------------------------------------------
 */

.content pre[class*="language-"] code[class*="language-"] {
    display: block;

    padding: 0;
    margin: 0;

    background: transparent;

    color: #f8f8f2;

    font-family:
        Consolas,
        Monaco,
        "Andale Mono",
        "Ubuntu Mono",
        monospace;

    font-size: 1em;
    line-height: 1.6;

    text-align: left;

    white-space: pre;
}


/*
 * Inline code
 * --------------------------------------------------------------------------
 */

.content :not(pre) > code[class*="language-"],
.content :not(pre) > code {
    padding: 2px 5px;

    background: #272822;

    border-radius: 3px;

    color: #f8f8f2;

    font-family:
        Consolas,
        Monaco,
        "Andale Mono",
        "Ubuntu Mono",
        monospace;

    font-size: 0.9em;
}


/*
 * Prism token colours
 * --------------------------------------------------------------------------
 */

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: #8292a2;
}

.token.punctuation {
    color: #f8f8f2;
}

.token.namespace {
    opacity: 0.7;
}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
    color: #f92672;
}

.token.boolean,
.token.number {
    color: #ae81ff;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
    color: #a6e22e;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
    color: #f8f8f2;
}

.token.atrule,
.token.attr-value,
.token.keyword {
    color: #66d9ef;
}

.token.function,
.token.class-name {
    color: #e6db74;
}

.token.regex,
.token.important,
.token.variable {
    color: #fd971f;
}

.token.important,
.token.bold {
    font-weight: bold;
}

.token.italic {
    font-style: italic;
}


/*
 * Mobile
 * --------------------------------------------------------------------------
 */

@media (max-width: 950px) {

    .content pre[class*="language-"] {
        width: 100%;

        padding: 15px;

        font-size: 0.85em;
    }

}