/* style for home page and manual. */

@import url(//fonts.googleapis.com/css?family=Open+Sans:400,600&subset=latin&effect=smoothing);

.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -o-user-select: none;
   user-select: none;
   cursor: default;
}

#notebox {
  width:50%;
  margin:auto;
  text-align:center;
  background-color: #ffcccc;
  padding: 10px;
  margin: 20px;
}

.redacted {
/*  background-color: #ffcccc; */
  background-color: #cccccc;
}
@keyframes pulse  {
  0% {
    -webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
    filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
  }
  100% {
    -webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, 0));
    filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, 0));
  }
}

rect.span_HIGHLIGHT {
  stroke-width: 1.75px !important;
  stroke: #000000;
  animation: pulse  2s infinite;
  stroke-dashoffset: 2;

}





.infolabel {
  font-weight: bold;  
  display: inline-block;
  width: 10em;
}

.h1.subtitle {
  font-size: 15px;
  color: gray;
}

div.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#header {
  padding: 10px 15px;
  margin-bottom: 2em;
  padding-left: 3em;
  font-size: 120%;
}
#menulogo {
  padding-top: 0.5em;
  padding-right: 1em;
  float: right;  
}
#header span a {
  text-decoration: none; /* no underline in menu */
}
#header > span, #header > a {
  margin-right: 10px;
}

.bigbutton {
  font-size: 20px !important;
  padding: 10px 15px !important;
}

#header > .logo {
  font-size: 1.2em;
  margin-top: -10px;
  margin-bottom: -10px;
  text-shadow: #000 0 0 3px;
}

#main {
  width:960px;
  padding-left: 2em;
  padding-right: 2em;
}
#content {
  margin: 15px;
}

#manual-main {
  max-width:960px;
  padding-left: 2em;
  padding-right: 2em;
  padding-bottom: 5em;
}

#footer {
  font-size: 10px;
  color: gray;
  border-top: 1px solid lightgray;
  margin-top: 5em;
  margin-bottom: 5em;  
  clear: both;
}

.footer-text {
  float: left;
}

.footer-logo {
  float: right;
}

.footer-logo img {
  margin: 0;
  -moz-box-shadow: 0px 0px 0px #fff;
  -webkit-box-shadow: 0px 0px 0px #fff;
  box-shadow: 0px 0px 0px #fff;
}

#titleblock {
  height: 100px;
}

#downloadblock {
  float: right;
  width: 300px;
  margin: 1em;
}

.image {
  margin-left: 2em;    
}

.image .caption { 
  font-size: 85%;
  font-family: sans-serif;
  text-align: center;
}

#browsersupport {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.annotation_wrapper { 
  margin-left: 2em;
  border: 1px solid;
  border-color: rgb(136, 136, 136);
  background-color: rgb(207, 226, 243);
}

.annotation_wrapper td {
  padding: 1em;
}

.annotation_table {
  border: none;
}

.annotation_table th {
  padding: 0em;
  font-family: monospace;
  font-size: 13px;
}

.annotation_table td {
  padding: 0;
  font-family: monospace;
  font-size: 13px;
}

td.support-ok {
  background-color: lightgreen;
}

td.support-partial {
  background-color: #F0F0B0;
}

td.support-no {
  background-color: #FF9090;
}

.rounded {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.logo {
  font-family: 'Astloch', serif;
  font-style: normal;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0em;
  word-spacing: 0em;
  line-height: 1.2;

  font-weight: bold;
}

@font-face {
  font-family: 'Liberation Sans';
  font-style: normal;
  font-weight: normal;
  src: local('Liberation Sans'), local('Liberation-Sans'), url('../Brat/fonts/Liberation_Sans-Regular.svg') format('truetype');
  font-display: swap;

}
@font-face {
  font-family: 'Astloch';
  font-style: normal;
  font-weight: bold;
  src: local('Astloch Bold'), local('Astloch-Bold'), url('../Brat/fonts/Astloch-Bold.ttf') format('truetype');
  font-display: swap;
}
@font-face {
  font-family: 'PT Sans Caption';
  font-style: normal;
  font-weight: normal;
  src: local('PT Sans Caption'), local('PTSans-Caption'), url('../Brat/fonts/PT_Sans-Caption-Web-Regular.svg') format('truetype');
  font-display: swap;
}

#svg {
  margin: 34px auto 100px;
  padding-top: 15px;
}
.center_wrapper {
  display: table;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.center_wrapper > div {
  display: table-cell;
  vertical-align: middle;
}
.center_wrapper > div > div {
  /* match jQuery UI .ui-widget-content color */
  color: #2e6e9e;
  margin-left: auto;
  margin-right: auto;
  width: 30em;
  font-size: 12px;
  font-family: 'Liberation Sans', Verdana, Arial, Helvetica, sans-serif;
}
.center_wrapper > div > div h1 {
  text-align: center;
  font-size: 14px;
}
#no_svg_wrapper {
  display: none;
}

.hasSVG  svg {
  width: 100%;
  height: 1px;
  border: 1px solid #7fa2ff;
  /*font-size: 15px;*/
   font-size: 12px;
}
.hasSVG svg.reselect {
  border: 1px solid #ff3333;
}


.hasSVG path {
  pointer-events: none;
}

/* "basic" font */
.hasSVG
.span text {
  /*  font-size: 10.5px; */
  font-size: 10px;
  text-anchor: middle;
  font-family: 'PT Sans Caption', sans-serif;
  pointer-events: none;
}

/* this should likely match span font */
.span_type_label {
  font-size: 11px;
  font-family: 'PT Sans Caption', sans-serif;
}
/* this should likely match arc font */
.arc_type_label {
  font-size: 11px;
  font-family: 'PT Sans Caption', sans-serif;
}
.attribute_type_label .ui-button-text {
  font-size: 11px;
  font-family: 'PT Sans Caption', sans-serif;
}

.span rect {
  stroke-width: 0.75;
}

.glyph {
  fill: #444444;
  font-family: sans-serif;
  font-weight: bold;
}


.attribute_warning {
  stroke: red;
}

.span rect.False_positive {
  stroke: #ff4141;
  stroke-width: 2;
}

.shadow_True_positive {
  fill: #00ff00;
}

.shadow_False_positive {
  fill: #ff4141;
}

#commentpopup.comment_False_positive {
  background-color: #ff4141;
}

.span rect.False_negative {
  stroke: #c20000;
  fill: #ffffff;
  stroke-width: 2;
}

.shadow_False_negative {
  fill: #c20000;
}

#commentpopup.comment_False_negative {
  background-color: #c20000;
}

.span rect.AnnotationError {
  stroke-width: 1;
}

.shadow_AnnotationError {
  fill: #ff0000;
}

#commentpopup.comment_AnnotationError {
  background-color: #ff7777;
}

.span rect.AnnotationWarning {
  stroke-width: 1;
}

.shadow_AnnotationWarning {
  fill: #ff8800;
}

#commentpopup.comment_AnnotationWarning {
  background-color: #ff9900;
}

.shadow_AnnotatorNotes {
  /* fill: #00cc00; */
  fill: #3ab7ee;
}
#commentpopup.comment_AnnotatorNotes {
  /* background-color: #00cc00; */
  /* background-color: #DAF7DC; */
  background-color: #d7e7ee;
}

.shadow_Normalized {
  /* fill: #00cc00; */
  fill: #3aee37;
}
#commentpopup.comment_Normalized {
  /* background-color: #00cc00; */
  /* background-color: #DAF7DC; */
  background-color: #d7eee7;
}
rect.Normalized {
  stroke-width: 1.5;
}

.shadow_AnnotationIncomplete {
  fill: #aaaaaa;
}
.span rect.AnnotationIncomplete {
  stroke: #002200;
  stroke-width: 0.5;
  fill: #ffffff;
}
#commentpopup.comment_AnnotationIncomplete {
  background-color: #ffff77;
}

.shadow_AnnotationUnconfirmed {
  fill: #eeeeee;
}
.span rect.AnnotationUnconfirmed {
  stroke: #002200;
  stroke-width: 0.5;
  opacity : 0.5;
}
#commentpopup.comment_AnnotationUnconfirmed {
  background-color: #ddddff;
}

.span rect.True_positive {
  /* stroke: #007700; */
}

rect.shadow_EditHighlight {
  fill: #ffff99;
}
.shadow_EditHighlight_arc {
  stroke: #ffff99;
}

.span path {
  fill: none;
}

.span path.curly {
  /* 'stroke' def here blocks 'stroke' set in JS..? */
  /* stroke: grey; */
  stroke-width: 0.5;
}

.span path.boxcross {
  stroke: black;
  opacity: 0.5;
}

.arcs path {
  stroke: #989898;
  fill: none;
  stroke-width: 1;
}

.arcs .highlight path {
  stroke: #000000;
  stroke-width: 1.5;
  opacity: 1;
}
.arcs .highlight text {
  stroke: black;
  fill: black;
  stroke-width: 0.5;
}
.span.highlight rect {
  stroke-width: 2px;
}
.span rect.reselect {
  stroke-width: 2px;
}
.span rect.reselectTarget {
  stroke-width: 2px;
}
.arcs .reselect path {
  stroke-width: 2px;
  stroke: #ff0000 !important;
}
.arcs .reselect text {
  fill: #ff0000 !important;
}

.span rect.badTarget {
  stroke: #f00;
}

.arcs text {
  font-size: 9px;
  text-anchor: middle;
  font-family: 'PT Sans Caption', sans-serif;
  /* dominant-baseline: central; */
  cursor: default;
}

.background0 {
  stroke: none;
  fill: #ffffff;
}

.background1 {
  stroke: none;
  fill: #dde3ed;
}

.backgroundHighlight {
  stroke: none;
  fill: #ffff99;
}

.sentnum text {
  fill: #999999;
  text-anchor: end;
}

.sentnum path {
  stroke: #999999;
  stroke-width: 1px;
}

.span_cue {
  fill: #eeeeee !important;
}

.drag_stroke {
  stroke: black;
}
.drag_fill {
  fill: black;
}


.dialog {
  display: none;
}
#span_free_div, #arc_free_div {
  float: left;
}


.backdrop-no-scroll ion-content {
  --overflow: hidden;
}
.backdrop-no-scroll ion-backdrop+* ion-content {
  --overflow: visible;
}