.hljs-comment,.hljs-quote{color:#969896}.hljs-variable,.hljs-template-variable,.hljs-tag,.hljs-name,.hljs-selector-id,.hljs-selector-class,.hljs-regexp,.hljs-deletion{color:#cc6666}.hljs-number,.hljs-built_in,.hljs-builtin-name,.hljs-literal,.hljs-type,.hljs-params,.hljs-meta,.hljs-link{color:#de935f}.hljs-attribute{color:#f0c674}.hljs-string,.hljs-symbol,.hljs-bullet,.hljs-addition{color:#b5bd68}.hljs-title,.hljs-section{color:#81a2be}.hljs-keyword,.hljs-selector-tag{color:#b294bb}.hljs{display:block;overflow-x:auto;background:#1d1f21;color:#c5c8c6;padding:0.5em}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold}
.code-frame
{
    line-height:20px;
    font-size:12px;
    font-family:"Fira Mono", Menlo, Monaco, "Lucida Console", "Courier New", Courier, monospace;
    box-shadow: 0 2px 6px 1px rgba(0,0,0,.25);
    display:block;
    border-radius:4px;
    background-color:transparent;
    text-align:left;
    overflow: hidden;
}
.code-frame .code-frame-bar
{
    width: 100%;
    height: 35px;
    background: #f7f7f7;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: start;
    -webkit-box-pack: start;
    justify-content: start;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
}
.code-frame .code-frame-bar>div
{
    background: #333;
    position: relative;
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 10px;
    font-size: 0;
    font-weight: 700;
    border-radius: 10px;
}
.code-frame .code-frame-bar>div:first-child
{
    border: 1px solid #ff795d;
    margin-left: 18px;
    background: #ff795d;
}
.code-frame .code-frame-bar>div:nth-child(2)
{
    border: 1px solid #f8e71c;
    background: #f8e71c;
}
.code-frame .code-frame-bar>div:nth-child(3)
{
    background: #44bfa3;
    border: 1px solid #44bfa3;
}
.code-frame pre
{
    background-color:#1d1f21;
    padding:20px;
    height:100%;
}
