/* PrismJS 1.29.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+json&plugins=toolbar+copy-to-clipboard */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
[data-color-scheme=default] {
--color-text: #000000;
--color-text-shadow: 0 1px #eee;
--color-bg: #fcfdfd;
--color-comm: #708090;
--color-punct: #555;
--color-tag: #705;
--color-number: #905;
--color-string: #5f7700;
--color-variable: #bb1d00;
--color-operator: #5c4223;
--color-operator-bg: hsla(0, 0%, 100%, .5);
--color-atrule: #0083bb;
--color-function: #D82D50;
--color-keyword: #0083bb;
--color-regex: #bb1d00;
--color-border: 0px solid #ccc;
--color-border-sh: 0 1px 2px rgba(0,0,0,0.25), 0 0 10px rgba(0,0,0,0.1) inset;
--color-bar-thumb: #ccc;
--color-bar-track: #f9fafa; 
 }

[data-color-scheme=dark] {
--color-text: #ffffff;
--color-text-shadow: 0 1px rgba(55, 55, 55, 0.3);
--color-bg: #272A35;
--color-comm: #8c9ba9;
--color-punct: #f8f8f2;
--color-tag: #f92672;
--color-number: #ae81ff;
--color-string: #a6e22e;
--color-variable: #f8f8f2;
--color-operator: #f8f8f2;
--color-operator-bg: transparent;
--color-atrule: #e6db74;
--color-function: #e6db74;
--color-keyword: #66d9ef;
--color-regex: #fd971f;
--color-border: .3em solid hsl(0, 0%, 33%);
--color-border-sh: 1px 1px .5em black inset;
--color-bar-thumb: #ddd;
--color-bar-track: #555; 
 }


code[class*="language-"],
pre[class*="language-"] {
	color: var(--color-text);
	background: none;
	text-shadow: var(--color-text-shadow);
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	font-size: 1em;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

@media print {code[class*="language-"],pre[class*="language-"] {text-shadow: none;}}

/* Code blocks */
pre[class*="language-"] {
	padding: 1em 2em;
	margin: .5em 0;
	overflow: auto;
	border-radius: 0.7em;
	border: var(--color-border); box-shadow: var(--color-border-sh);
        scrollbar-width: thin;
        scrollbar-color: var(--color-bar-thumb) var(--color-bar-track);
/*        max-height:30em; */
}

pre[class*="language-"]::-webkit-scrollbar {height:.2rem;width:.2rem}
pre[class*="language-"]::-webkit-scrollbar-track {background:var(--color-bar-track);}
pre[class*="language-"]::-webkit-scrollbar-thumb {background-color:var(--color-bar-thumb);border-radius: 20px;}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {background: var(--color-bg);}

/* Inline code */
:not(pre) > code[class*="language-"] {padding: .1em;border-radius: .3em;white-space: normal;}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {color: var(--color-comm);}

.token.punctuation {color: var(--color-punct);}

.token.namespace {opacity: .7;}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {color: var(--color-tag);}

.token.boolean,
.token.number {color: var(--color-number);}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {color: var(--color-string);}

.token.variable {color: var(--color-variable);}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {color: var(--color-operator);background: var(--color-operator-bg);}

.token.atrule,
.token.attr-value {color: var(--color-atrule);}

.token.function,
.token.class-name {color: var(--color-function);}

.token.keyword {color: var(--color-keyword);}

.token.regex,
.token.important {color: var(--color-regex);}

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

.token.entity {cursor: help;}

div.code-toolbar {position: relative;}

div.code-toolbar > .toolbar {
	position: absolute;
	z-index: 10;
	top: .3em;
	right: 1em;
	transition: opacity 0.3s ease-in-out;
	opacity: 0;
}

div.code-toolbar:hover > .toolbar {opacity: 1;}

/* Separate line b/c rules are thrown out if selector is invalid.
   IE11 and old Edge versions don't support :focus-within. */
div.code-toolbar:focus-within > .toolbar {opacity: 1;}

div.code-toolbar > .toolbar > .toolbar-item {display: inline-block;}

div.code-toolbar > .toolbar > .toolbar-item > a {cursor: pointer;}

div.code-toolbar > .toolbar > .toolbar-item > button {
	background: none;
	border: 0;
	color: inherit;
	font: inherit;
	line-height: normal;
	overflow: visible;
	padding: 0;
	-webkit-user-select: none; /* for button */
	-moz-user-select: none;
	-ms-user-select: none;
}

div.code-toolbar > .toolbar > .toolbar-item > a,
div.code-toolbar > .toolbar > .toolbar-item > button,
div.code-toolbar > .toolbar > .toolbar-item > span {
	color: #bbb;
	font-size: .8em;
	padding: 0 .5em;
	background: #f5f2f0;
	background: rgba(224, 224, 224, 0.2);
	box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
	border-radius: .5em;
}

div.code-toolbar > .toolbar > .toolbar-item > a:hover,
div.code-toolbar > .toolbar > .toolbar-item > a:focus,
div.code-toolbar > .toolbar > .toolbar-item > button:hover,
div.code-toolbar > .toolbar > .toolbar-item > button:focus,
div.code-toolbar > .toolbar > .toolbar-item > span:hover,
div.code-toolbar > .toolbar > .toolbar-item > span:focus {
/*	color: inherit;*/
	text-decoration: none;
}
