* {
  box-sizing: border-box;
}

body {
  font: 14px Calibri;
  padding: 0.5em;
}

h2 {
  font: bold 17px Calibri;
  color: #369;
}

h3 {
  font: bold 14px Calibri;
}

.parm {
  border-bottom: 2px solid #666;
}

div[contenteditable] {
  background: lightyellow;
  border: 1px solid #ddd;
  padding: 0 0.2em;
}

textarea {
  width: 100%;
  margin-bottom: 1em;
  display: none;
}

#Data td {
  vertical-align: top;
}

.original {
  color: red;
  background: yellow;
}

.new {
  color: green;
  background: yellow;
}

.selected {
  background: #dfd;
}

table.compare a {
  color: inherit;
}

table.compare td:nth-child(1) {
  color: #369;
  font-weight: bold;
}

#Data th:nth-child(1) {
  width: 10em;
}

table.compare {
  min-width: 2000px;
}

table.compare td {
  width: 600px;
  color: #777;
}

table.compare td:nth-child(2), table.compare td:nth-child(3) {
  width: 300px;
}

table.compare tr > *:nth-child(1) {
  width: 0;
}

#Data a {
  word-break: break-all;
}

div.original, div.original *,
div.new, div.new * {
  display: inline;
}

#Data th:nth-child(n+6),
#Data td:nth-child(n+6) {
  display: none;
}

div.critical {
  color: #369;
  width: calc(100% + 0.6em);
  transform: translatex(-0.3em);
  background: #eee;
  padding: 0.5em;
  vertical-align: bottom;
}

#Data tr > *:nth-child(2n) {
  border-left: 1px solid black;
}

table.compare div {
  display: none;
}

table.compare tr.critical div {
  display: block;
}

header {
  position: fixed;
  background: #444;
  width: 100%;
  padding: 0.3em;
  z-index: 2;
  top: 0;
}

#Data {
  margin-top: 2.2em;
}

