pre > code.language-python {
  background-image: url("obrazy/py.png");
  background-repeat: no-repeat;
  background-position: bottom 2px right 2px;
}

pre > code.language-html {
  background-image: url("obrazy/htmlplus.png");
  background-repeat: no-repeat;
  background-position: bottom 2px right 2px;
}

pre > code.language-css {
  background-image: url("obrazy/css.png");
  background-repeat: no-repeat;
  background-position: bottom 2px right 2px;
}

pre > code.language-php {
  background-image: url("obrazy/php.png");
  background-repeat: no-repeat;
  background-position: bottom 2px right 2px;
}

pre > code.language-javascript {
  background-image: url("obrazy/js.png");
  background-repeat: no-repeat;
  background-position: bottom 2px right 2px;
}

pre.out {
  background-image: url("obrazy/ready.png");
  background-repeat: no-repeat;
  background-position: bottom 7px right 5px;
}

pre.in {
  position: relative;
}

pre.in button {
  color: #adb5bd;
  box-sizing: border-box;
  transition: 0.2s ease-out;
  cursor: pointer;
  user-select: none;
  background: rgba(0, 0, 0, 0.05);
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 0 0.15rem;
  padding: 5px 10px;
  font-size: 0.8em;
  position: absolute;
  top: 0;
  right: 0;
}

#komunikaty {
  position: fixed; top: 0; right: 0; width: 100px; height: 20px; text-align: right; color: green;
}

pre.in button:onclick {
  color: black;
}

pre code.hljs{display:block;overflow-x:auto;padding:0.2em;}
code.hljs{padding:3px 5px}

@media (prefers-color-scheme: dark) {

.markdown-body .highlight pre,
.markdown-body pre {
  background-color: #05090eaa;
  /* width: 655px; */
}

.markdown-body code {
  background-color: #05090eaa;
}

pre.out {color: #aaa; font-size: 100%; border-left: 7px solid #05090e00; padding: 5px; margin-left: 50px;}
pre.in {font-size: 110%; border-left: 7px solid #454555aa; padding: 5px;}

pre.in button {
  color: #adb5bd;
  background: rgba(255, 255, 255, 0.05);
}

.hljs {
  background: #333;
  color: #fff;
}

.hljs-doctag,
.hljs-meta-keyword,
.hljs-name,
.hljs-strong {
  font-weight: bold;
}

.hljs-tag .hljs-name {
  color: #ccc;
}

.hljs-code,
.hljs-emphasis {
  font-style: italic;
}

.hljs-section,
.hljs-tag {
  color: #62c8f3;
}

.hljs-selector-class,
.hljs-selector-id,
.hljs-template-variable,
.hljs-variable {
  color: #ade5fc;
}

.hljs-meta-string,
.hljs-string {
  color: #a2fca2;
}

.hljs-attr,
.hljs-quote,
.hljs-selector-attr {
  color: #7bd694;
}

.hljs-tag .hljs-attr {
  color: inherit;
}

.hljs-attribute,
.hljs-title,
.hljs-type {
  color: #ffa;
}

.hljs-number,
.hljs-symbol {
/*  color: #d36363; */
  color: #f39393;
}

.hljs-bullet,
.hljs-template-tag {
  color: #b8d8a2;
}

.hljs-built_in,
.hljs-keyword,
.hljs-literal,
.hljs-selector-tag {
  color: #fcb080;
}

.hljs-code,
.hljs-comment,
.hljs-formula {
  color: #888;
}

.hljs-link,
.hljs-selector-pseudo,
.hljs-regexp {
  color: #c6b4f0;
}

.hljs-meta {
  color: #fc9b9b;
}

.hljs-deletion {
  background: #fc9b9b;
  color: #333;
}

.hljs-addition {
  background: #a2fca2;
  color: #333;
}

/* Purposely ignored */
.hljs-operator,
.hljs-params,
.hljs-property,
.hljs-punctuation {}

.hljs-subst {
  color: #fff;
}

/* This applies only if HTML auto-merging plugin is enabled by user (#2889) */
.hljs a {
  color: inherit;
}

.hljs a:focus,
.hljs a:hover {
  color: inherit;
  text-decoration: underline;
}

.hljs mark {
  background: #555;
  color: inherit;
}


}


@media (prefers-color-scheme: light) {

.markdown-body {
  background-color: #eeeef0;
}

.markdown-body .highlight pre,
.markdown-body pre {
  background-color: #f5f5f5cc;
}

.markdown-body code {
  background-color: #f5f5f5cc;
}

pre.out {color: #351; font-size: 100%; border-left: 7px solid #f5f5f500; padding: 5px; margin-left: 50px;}
pre.in {font-size: 110%; border-left: 7px solid #dddde0cc; padding: 5px; }

pre.in button {
  color: #333;
  background: rgba(100, 100, 100, 0.07);
}

.hljs {
  color: #3e5915;
  background: #f6f5b2;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-literal {
  color: #005599;
  font-weight:bold;
}

.hljs-subst {
  color: #3e5915;
}

.hljs-string,
.hljs-title,
.hljs-section,
.hljs-type,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute,
.hljs-built_in,
.hljs-addition,
.hljs-variable,
.hljs-template-tag,
.hljs-template-variable,
.hljs-link {
  color: #2c009f;
}

.hljs-comment,
.hljs-quote,
.hljs-deletion,
.hljs-meta {
  color: #e60415;
}

.hljs-comment {
  color: #999;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-doctag,
.hljs-title,
.hljs-section,
.hljs-type,
.hljs-name,
.hljs-selector-id,
.hljs-strong {
  font-weight: bold;
}

.hljs-emphasis {
  font-style: italic;
}

}