svg {
  background: white;
}
.cm-span_symbol {
  font-weight: bold;
  color: rgba( 31,118,180,1);
  background: rgba( 31,118,180,0.1);
}
.cm-span_text {
  background: rgba( 31,118,180,0.1);
}
.cm-entity_id {
  color: #ff7f0e;
  font-weight: bold;
}
.cm-sentence-2 {
  background: yellow;
}
.cm-start_directives {
  color: brown;
  font-weight: bold;
}
.cm-directive {
  font-style: italic;
  color: #666;
}
.cm-entity_symbol {
  color: #ff7f0e;
}

.error_gutter {
  width: 12px;
}

#editor {
  flex: 1;
}
.CodeMirror {
  flex: 1;
  height: 500px;
  line-height: normal;
}
svg {
  margin: 0;
  border-left: 2px solid gray;
  background: #EEE;
  white-space: pre-wrap;
  overflow-y: scroll;
  
  height: 500px;
  flex: 1;
}

body {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  
  -ms-flex-flow: row;
  -webkit-flex-flow: row;
  flex-flow: row;
}

.sentence_highlight {
  /*background: rgba(255,255,0,0.15);*/
}

.title {
  font-family: sans-serif;
  font-size: 14px;
  font-weight: bold;
}

.node circle {
  stroke-width: 2;
}

.link {
  fill: none;
  stroke: #CCC;
  stroke-width: 4px;  
  marker-end: url(#end-arrow);
}
#end-arrow {
  fill: #CCC;
}

.label {
  font-family: monospace;
  font-size: 12px;
  text-anchor: middle;
  fill: #333;
  stroke: none;
  font-weight: bold;
  text-shadow: -1px -1px #EEE, -1px 1px #EEE, 1px 1px #EEE, 1px -1px #EEE, -1px 0 #EEE, 0 1px #EEE, 1px 0 #EEE, 0 -1px #EEE;
  pointer-events: none;
}
a.valid .label {
  pointer-events: all;
}
a.valid:hover .label {
  text-decoration: underline;
}

.link_label {
  font-family: sans-serif;
  font-size: 9px;
  text-anchor: middle;
  fill: #AAA;
  stroke: none;
  text-shadow: -1px -1px #EEE, -1px 1px #EEE, 1px 1px #EEE, 1px -1px #EEE, -1px 0 #EEE, 0 1px #EEE, 1px 0 #EEE, 0 -1px #EEE;
  pointer-events: none;
}

.ne_link {
  cursor: pointer;
  text-decoration: underline;
}
.content.node {
  fill: white;
  stroke: #777;
}
.span.node {
  fill: #B9DBF3;
  stroke: #1f77b4;
}
.span.node .label {
  fill: #1f77b4;
}
.entity.node {
  fill: #FFD7B3;
  stroke: #ff7f0e;
}
.entity.node .label {
  fill: #ff7f0e;
}
.external.node {
  fill: #EEE;
  stroke: #999;
}