/* <pre class="prettyprint linenums"> */
pre.syntax,
pre.example {
	position: relative;
	margin: 40px 0 30px;
	padding: 9.5px 9.5px 9.5px 48px;
	background: #1b1b1b;
	border: 1px solid #333;
	white-space: pre-line;
	color: #fff;
}

pre.syntax:before {
    content: 'Syntax:';
    display: block;
    position: absolute;
    top: -20px;
    left: 0;
    width: 100%;
    color: #555;
    font-family: 'Helvetica', 'Helvetica Neue', serif;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

pre.syntax.output:before {
    content: 'Output:';
}

pre.example {
	margin: 20px 0;
}

/* PrettyPrint Container */
pre.prettyprint.linenums {
	margin-bottom: 30px;
	background-color: #353535;
	border: 1px solid #383838;
	box-shadow: 0 40px 25px -30px #111;
	white-space: pre-wrap;
}

/* PrettyPrint Line Numbers */
.prettyprint .linenums {
	background-color: #111;
}

/* PrettyPrint Ordered List */
ol.linenums {
	margin: 0 0 0 40px;
	padding: 10px 0;
	background: transparent;
}

/* PrettyPrint List Item */
ol.linenums li {
	margin-bottom: 0;
	padding-left: 15px;
	list-style-type: decimal;
	color: #aaa;
	line-height: 25px;
}

ol.linenums li::marker {
	font-size: 12px;
}

/* PrettyPrint Spans */
.prettyprint li.L1,
.prettyprint li.L3,
.prettyprint li.L5,
.prettyprint li.L7,
.prettyprint li.L9 {
	background: transparent;
}

/* Comment */
.prettyprint .com {
	color: #8c8c8c;
	font-style: italic;
}

/*   */
.prettyprint .lit {
	color: #195f91;
}

/* Punctuation, Open, Close */
.prettyprint .pun,
.prettyprint .opn,
.prettyprint .clo {
	color: #93a1a1;
}

/* Function */
.prettyprint .fun {
	color: #dc322f;
}

/* String and  */
.prettyprint .str,
.prettyprint .atv {
	color: #dd1144;
}

/* Keyword, Line Numbers and Tags */
.prettyprint .kwd,
.prettyprint .linenums .tag {
	color: #3A87B2;
}

/* ,  , Decimals and Varibles */
.prettyprint .typ,
.prettyprint .atn,
.prettyprint .dec,
.prettyprint .var {
	color: teal;
}

/* Tags and  */
.prettyprint .tag,
.prettyprint .pln {
	color: #c8c8c8;
}

/*////////////////////////////////////
/// BEGIN: Pretty Print CSS
////////////////////////////////////*/
.prettyprint.css .lit {
    color: #ffb500;
}

/* Punctuation, Open, Close */
.prettyprint.css .pun,
.prettyprint.css .opn,
.prettyprint.css .clo {
	color: #fff;
}

/* Tags and  */
.prettyprint.css .tag,
.prettyprint.css .pln {
	color: #429aff;
}

.prettyprint.css .pun + .pln {
	color: #f52e6b;
}


/*////////////////////////////////////
/// BEGIN: Media Queries
////////////////////////////////////*/

/* BEGIN: Mobile */
@media screen and (max-width: 768px) {

	pre.prettyprint.linenums {
		overflow: hidden;
		overflow-x: scroll;
	}
}
/* FIN */