.jsonview {
  font-family: monospace;
  font-size: 1.1em;
  white-space: pre-wrap;

  .prop {
    font-weight: bold;
  }

  .null {
    color: red;
  }

  .bool {
    color: blue;
  }

  .num {
    color: blue;
  }

  .string {
    color: green;
    white-space: pre-wrap;

    &.multiline {
      display: inline-block;
      vertical-align: text-top;
    }
  }

  .collapser {
    position: absolute;
    left: -1em;
    cursor: pointer;
  }

  .collapsible {
    transition: height 1.2s;
    transition: width 1.2s;
  }

  .collapsible.collapsed {
    height: .8em;
    width: 1em;
    display: inline-block;
    overflow: hidden;
    margin: 0;
  }

  .collapsible.collapsed:before {
    content: "…";
    width: 1em;
    margin-left: .2em;
  }

  .collapser.collapsed {
    transform: rotate(0deg);
  }

  .q {
    display: inline-block;
    width: 0px;
    color: transparent;
  }

  li {
    position: relative;
  }

  ul {
    list-style: none;
    margin: 0 0 0 2em;
    padding: 0;
  }

  h1 {
    font-size: 1.2em;
  }
}