ul.json-dict,
ol.json-array {
  list-style-type: none;
  margin: 4px 0 !important;
  border-left: 1px dotted #ccc;
  padding-left: 1.5em;
  animation: fadeIn 500ms;
  -webkit-animation: fadeIn 500ms;
  -moz-animation: fadeIn 500ms;
  -o-animation: fadeIn 500ms;
  -ms-animation: fadeIn 500ms;
}
ul.json-dict li {
  margin: 4px 0;
}
.json-string {
  color: #000
}

.on + .json-string {
  color: #0b7500 !important;
  opacity: 1;
}
.on + .json-array .json-string {
  color: #0b7500 !important;
  opacity: 1;
}

.off + .json-string {
  color: #000 !important;
  opacity: 0.6;
}
.off + .json-array .json-string {
  color: #000 !important;
  opacity: 0.6;
}

.json-literal {
  color: #1a01cc;
  font-weight: bold
}

a.json-toggle {
  position: relative;
  color: inherit;
  text-decoration: none
}

a.json-toggle:focus {
  outline: 0
}

a.json-toggle:before {
  content: " ";
  position: absolute;
  display: inline-block;
  width: 1em;
  left: -1.2em;
  top: 0.1em;
  font-size: 1.1em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8 11.25C7.58579 11.25 7.25 11.5858 7.25 12C7.25 12.4142 7.58579 12.75 8 12.75L8 11.25ZM16 12.75C16.4142 12.75 16.75 12.4142 16.75 12C16.75 11.5858 16.4142 11.25 16 11.25L16 12.75ZM8 12.75L16 12.75L16 11.25L8 11.25L8 12.75ZM8 4.75H16V3.25H8V4.75ZM19.25 8V16H20.75V8H19.25ZM16 19.25H8V20.75H16V19.25ZM4.75 16V8H3.25V16H4.75ZM8 19.25C6.20507 19.25 4.75 17.7949 4.75 16H3.25C3.25 18.6234 5.37665 20.75 8 20.75V19.25ZM19.25 16C19.25 17.7949 17.7949 19.25 16 19.25V20.75C18.6234 20.75 20.75 18.6234 20.75 16H19.25ZM16 4.75C17.7949 4.75 19.25 6.20507 19.25 8H20.75C20.75 5.37665 18.6234 3.25 16 3.25V4.75ZM8 3.25C5.37665 3.25 3.25 5.37665 3.25 8H4.75C4.75 6.20507 6.20507 4.75 8 4.75V3.25Z' fill='%23001A72'/%3E%3C/svg%3E");
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: initial;
}


a.json-toggle.collapsed:before {
  left: -1.2em;
  top: 0.1em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12.75 8C12.75 7.58579 12.4142 7.25 12 7.25C11.5858 7.25 11.25 7.58579 11.25 8H12.75ZM11.25 16C11.25 16.4142 11.5858 16.75 12 16.75C12.4142 16.75 12.75 16.4142 12.75 16H11.25ZM8 11.25C7.58579 11.25 7.25 11.5858 7.25 12C7.25 12.4142 7.58579 12.75 8 12.75L8 11.25ZM16 12.75C16.4142 12.75 16.75 12.4142 16.75 12C16.75 11.5858 16.4142 11.25 16 11.25L16 12.75ZM11.25 8V16H12.75V8H11.25ZM8 12.75L16 12.75L16 11.25L8 11.25L8 12.75ZM8 4.75H16V3.25H8V4.75ZM19.25 8V16H20.75V8H19.25ZM16 19.25H8V20.75H16V19.25ZM4.75 16V8H3.25V16H4.75ZM8 19.25C6.20507 19.25 4.75 17.7949 4.75 16H3.25C3.25 18.6234 5.37665 20.75 8 20.75V19.25ZM19.25 16C19.25 17.7949 17.7949 19.25 16 19.25V20.75C18.6234 20.75 20.75 18.6234 20.75 16H19.25ZM16 4.75C17.7949 4.75 19.25 6.20507 19.25 8H20.75C20.75 5.37665 18.6234 3.25 16 3.25V4.75ZM8 3.25C5.37665 3.25 3.25 5.37665 3.25 8H4.75C4.75 6.20507 6.20507 4.75 8 4.75V3.25Z' fill='%23001A72'/%3E%3C/svg%3E");
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: initial;
}

a.json-placeholder {
  color: #aaa;
  padding: 0 1em;
  text-decoration: none
}

a.json-placeholder:hover {
  text-decoration: underline
}

.pick-path {
  color: #111;
  cursor: pointer;
  font-family: 'Segoe UI', Arial, sans-serif, ui-monospace;
  max-height: 15px;
  display: -webkit-inline-box;
}

.pick-path.on:after {
    content: '    ';
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23fff' stroke='%23fff' stroke-width='3'/%3E%3Crect x='5' y='6' width='14' height='13' fill='%23fff'/%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z' fill='%23219653'/%3E%3C/svg%3E%0A");
    background-size: 18px;
    background-position: center;
    background-repeat: no-repeat;
    /*content: '\2705'; '\2611'  '☑';*/
    /*filter: hue-rotate(75deg);*/
    /*font-size: 0.75em;
    font-weight: 400;
    top: 1px;
    position: relative;  
    margin: 0 2px 0 0;
    padding: 0;*/
}

.pick-path.off:after {
    content: '    ';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='512px' height='512px' viewBox='0 0 512 512'%3E%3Cpath d='M96 448Q82 448 73 439 64 430 64 416L64 96Q64 82 73 73 82 64 96 64L416 64Q430 64 439 73 448 82 448 96L448 416Q448 430 439 439 430 448 416 448L96 448ZM400 400L400 112 112 112 112 400 400 400Z'/%3E%3C/svg%3E");
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    opacity:0.7;
    /*content: '\2610'; /*'☐';*/
    /*font-size: 1em;
    font-weight: 400;
    top: 2px;
    position: relative;
    margin: 0 3px 0 1px;
    padding: 0 1px 0 0;*/
}

.pick-path:hover {
  color: #808080
}
.json-tree {
  padding: 10px 30px;
  width: 100%;
}