/* Syntax highlighting for JSON objects */
.json-view {
  font-size: 13px;
  font-family: monospace;
}
.json-indent {
  list-style-type: none;
  margin: 0 0 0 1px;
  border-left: 1px dotted #ccc;
  padding-left: 2em;
}

.collapsed > .json-indent {
  display: none;
}

li > .json-placeholder, div > .json-placeholder {
  display: none;
}
li.collapsed > .json-placeholder, div.collapsed > .json-placeholder {
  display: inline;
}


.json-string {
  color: #0B7500;
}
.json-literal {
  color: #1A01CC;
  font-weight: bold;
}

/* Toggle button */
a.json-toggle {
  position: relative;
  color: inherit;
  text-decoration: none;
}
a.json-toggle:focus {
  outline: none;
}
a.json-toggle:before {
  color: #aaa;
  content: "\25BC"; /* down arrow */
  position: absolute;
  display: inline-block;
  left: -1.0em;
}
.collapsed > a.json-toggle:before {
  transform: rotate(-90deg); /* Use rotated down arrow, prevents right arrow appearing smaller than down arrow in some browsers */
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}

/* Collapsable placeholder links */
a.json-placeholder {
  color: #aaa;
  padding: 0 1em;
  text-decoration: none;
}
a.json-placeholder:hover {
  text-decoration: underline;
}

/* Show scroll menu */
.json-view-panel .x-panel-body {
  overflow-y: auto;
}

/*Fix make it look like a editor grid panel: */
/*TO fix for other panels just remove .json-view-panel */
.x-panel.json-view-panel .x-panel-mc .x-panel-body {
    border: 1px solid;
    background:white;
    border-color: #d0d0d0;
}