/**
 * Litterae
 */
html, body, #overflow-hidden {
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
iframe {
  margin: 0;
  border: 0 none !important;
  padding: 0;
}
#title {
  width: 100%;
  height: 50px;
  background: url(Title.png);
}
#title a {
  float: right;
  margin: -34px 25px 17px 0;
  line-height: 18px;
  color: white;
}
#logo {
  width: 150px;
  height: 50px;
  background: url(Logo150x50.png);
}
#container {
  position: absolute;
  top: 50px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  background: #EEE;
}

/**
 * DevMark
 */
.devmark {
  position: absolute;
  top: 70px;
  right: 15px;
  font-size: 10px;
}
.devmark1, .devmark3 {
  color: gray;
}
a.devmark2 {
  color: #A5303E!important;
}

/**
 * Profile
 */
.profile {
  position: absolute;
  top: 25px;
  width: 330px;
  background: white;
  -webkit-box-shadow: 1.4142px 1.4142px 4px #777;
  -moz-box-shadow: 1.4142px 1.4142px 4px #777;
  -ie-box-shadow: 1.4142px 1.4142px 4px #777;
  box-shadow: 1.4142px 1.4142px 4px #777;
  z-index: 3;
}
.profile.centered {
  right: 50%;
  margin-right: -165px;
}
.profileLine {
  margin: 8px;
  width: 314px;
  height: 29px;
}
.profileLineAbsolute {
  position: absolute;
  bottom: 9px;
  right: 9px;
  height: 29px;
}
.floatCenter {
  margin: 0 auto;
}
.floatLeft {
  float: left;
}
.floatRight {
  float: right;
}

/**
 * Field
 */
.field,
.fieldLabel,
.fieldBox {
  display: block;
  font-size: 16px;
  overflow: hidden;
}
.field {
  position: relative;
  margin: 1px;
  border: 1px solid #CCC;
  padding: 0;
  width: 310px;
  height: 25px;
  background-color: white;
}
.field.width2 {
  width: 160px;
}
.field.width3 {
  width: 180px;
}
.field.focused {
  outline: 1px solid blue;
}
.fieldLabel,
.fieldBox {
  margin: 0;
  border: 0 none;
  padding: 3px 3px 2px;
  width: 304px;
  height: 20px;
  line-height: 20px;
}
.field.width2 .fieldLabel,
.field.width2 .fieldBox {
  width: 154px;
}
.field.width3 .fieldLabel,
.field.width3 .fieldBox {
  width: 174px;
}
.fieldLabel {
  color: #CCC;
}
.fieldBox {
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background: transparent;
}
.field.focused .fieldLabel {
  background: #FFE;
}

/**
 * Tabs and Chromes
 */
.pane {
  position: absolute!important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.pane:focus {
  outline: 0px none;
}
.tabLine {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  height: 90px;
}
.chrome {
  position: absolute;
  top: 100px;
  left: 10px;
  bottom: 10px;
  right: 10px;
  background: white;
  overflow: auto;
  -webkit-box-shadow: 1.4142px 1.4142px 5px #777;
  -moz-box-shadow: 1.4142px 1.4142px 5px #777;
  -ie-box-shadow: 1.4142px 1.4142px 5px #777;
  box-shadow: 1.4142px 1.4142px 5px #777;
}
.tab {
  position: relative;
  float: left;
  margin-right: 10px;
  width: 225px;
  height: 90px;
  background: white;
  -webkit-box-shadow: 0 1px 4px #AAAAAA;
  -moz-box-shadow: 0 1px 4px #AAAAAA;
  -ie-box-shadow: 0 1px 4px #AAAAAA;
  box-shadow: 0 1px 4px #AAAAAA;
}
.tab.selected {
  -webkit-box-shadow: 1.4142px 1.4142px 5px #777;
  -moz-box-shadow: 1.4142px 1.4142px 5px #777;
  -ie-box-shadow: 1.4142px 1.4142px 5px #777;
  box-shadow: 1.4142px 1.4142px 5px #777;
}
.tab.selected .tabConnection {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 225px;
  height: 3px;
  background: white;
  z-index: 1;
}

/**
 * Icons
 */
.debug {
  position: fixed;
  top: 0;
  left: 0;
  max-width: 500px;
  max-height: 80px;
  background-color: #FFFFDD;
  overflow: auto;
}
.folder {
  position: relative;
}
.dot {
  position: relative;
  margin: 5px;
  width: 225px;
  height: 90px;
  float: left;
}
.dot.targeted {
  background-color: #FFFFDD;
}
.card {
  position: absolute;
}
.tab.selected .card {
  z-index: 2;
}
.card:focus {
  outline: 0px none;
}
.card.dragged {
  position: fixed;
  -webkit-box-shadow: 1.4142px 1.4142px 4px #777;
  -moz-box-shadow: 1.4142px 1.4142px 4px #777;
  -ie-box-shadow: 1.4142px 1.4142px 4px #777;
  box-shadow: 1.4142px 1.4142px 4px #777;
  z-index: 4;
  cursor: pointer;
  cursor: move;
}
.icon {
  width: 225px;
  height: 90px;
  white-space: pre-wrap; /* css-3 */
  white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
  cursor: pointer;
}
.icon:hover, .card.dragged .icon {
  background-color: #EEE;
  outline: 1px solid #CCC;
}
.iconImage {
  float: left;
  width: 75px;
  height: 90px;
}
.iconImage.user0 {
  background-image: url(entity-icons/User0Icon75x90.png);
}
.iconImage.user1 {
  background-image: url(entity-icons/User1Icon75x90.png);
}
.iconImage.user2 {
  background-image: url(entity-icons/User2Icon75x90.png);
}
.iconImage.user3 {
  background-image: url(entity-icons/FileManagerIcon75x90.png);
}
.iconImage.text {
  background-image: url(entity-icons/TextIcon75x90.png);
}
.iconImage.textAnnotation {
  background-image: url(entity-icons/TextAnnotationIcon75x90.png);
}
.iconImage.process {
  background-image: url(entity-icons/ProcessIcon75x90.png);
}
.iconImage.processAnnotation {
  background-image: url(entity-icons/ProcessAnnotationIcon75x90.png);
}
.iconImage.corpus {
  background-image: url(entity-icons/CorpusIcon75x90.png);
}
.iconImage.empty.corpus {
  background-image: url(entity-icons/EmptyCorpusIcon75x90.png);
}
.iconImage.system {
  background-image: url(entity-icons/SystemIcon75x90.png);
}
.iconName {
  padding: 10px 5px 0px 80px;
  width: 140px;
  min-height: 15px;
  max-height: 30px;
  line-height: 15px;
  font-size: 11px;
}
.iconAuthorName {
  padding: 5px 5px 0px 80px;
  width: 140px;
  height: 15px;
  line-height: 15px;
  font-size: 11px;
}

/**
 * Button
 */
.button {
  display: inline-block;
  margin: 1px;
  padding: 1px;
  cursor: pointer;
}
.button:focus {
  outline: 1px solid blue;
}
.button.disabled {
  color: gray;
}
.buttonV {
  margin: -1px 0;
  width: 120px;
  height: 25px;
  border-width: 1px 0;
}
.buttonH {
  margin: 0 -1px;
  width: 120px;
  height: 25px;
  border-width: 0 1px;
}
.buttonV, .buttonH {
  border-style: solid;
  border-color: #CCC;	
}
.buttonV:hover, .buttonH:hover {
  border-color: black;
}
.button.disabled .buttonV:hover,
.button.disabled .buttonH:hover {
  border-color: #CCC;
}
.buttonT {
  width: 120px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  font-size: 16px;
  background-image: url(Button5x50.png);
}
.button.pressed .buttonT,
.button.toggled .buttonT {
  background-position: 0 0;
}
.button .buttonT,
.button.pressed.toggled .buttonT {
  background-position: 0 25px;
}

.button.width1 .buttonV,
.button.width1 .buttonH,
.button.width1 .buttonT {
  width: 60px;
}

.button.width2 .buttonV,
.button.width2 .buttonH,
.button.width2 .buttonT {
  width: 120px;
}

.button.width3 .buttonV,
.button.width3 .buttonH,
.button.width3 .buttonT {
  width: 180px;
}

.button.width4 .buttonV,
.button.width4 .buttonH,
.button.width4 .buttonT {
  width: 240px;
}

/**
 * Status
 */
.statusLocation {
  position:absolute;
  bottom: 0px;
  width: 100%;
  background: #DDDDCC;
}
#status {
  padding: 10px;
}
.line {
  display: block;
}

/**
 * Window
 */
 .window {
   overflow: hidden;
   height: 100%;
 }
 .windowFrame {
   position:absolute;
   top:0;
   right:190px;
   bottom:0;
   left:0;
   overflow:auto;
 }
 .windowFrame.full {
   right: 0;
 }
 .windowFunctions {
   position: absolute;
   top: 0;
   right: 0;
   padding: 3px;
   width: 190px;
   height: 100%;
   overflow: visible;
   background-color: #F0E8E9;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -ie-box-sizing: border-box;
   -o-box-sizing: border-box;
   box-sizing: border-box;
 }
 .windowFunctionsSpacer {
   width: 184px;
   height: 15px;
 }
 
 /**
  * Contexts
  */
.contexts {
  font: 11px 'Courier New';
  white-space: pre;
}
.context {
  border-bottom: 1px solid #DDD;
  cursor: pointer;
  padding: 3px 8px;
}
.context:hover {
  background: #FFFFEE;
}
.contextFocus {
  font-weight: bold;
}
.contextFocus,
.contextTile {
  display: inline;
}

/**
 * Puller
 */
.pullerArea {
  position: absolute;
  bottom: -35px;
  right: 50%;
  margin-right: -65px;
  width: 130px;
  height: 0;
  overflow: hidden;
}
.puller {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 130px;
  height: 35px;
  background-image: url(Puller.png);
  cursor: pointer;
}
.puller:hover {
  background-position: 0 -35px;
}
.puller.disabled {
  background-position: 0 -70px;
}
.puller.pulled {
  background-position: 0 -105px;
}
.puller.pulled:hover {
  background-position: 0 -140px;
}
.puller.pulled.disabled {
  background-position: 0 -175px;
}

/**
 * Process
 */
.inline {
  display: inline;
}
.red {
  color: red;
  font: 11px 'Courier New', mono;
}
.blue {
  color: blue;
}
.black {
  font: 11px 'Courier New', mono;
}

/**
 * Show
 */
.show {
  padding: 10px;
}
.showBlocks {
  height: 100%;
}
.showBlock {
  position: relative;
  height: 100%;
  width: 100%;
  background-color: white;
  overflow: hidden;
}
.screenBlock {
  position: absolute;
  top: 0;
  right: 210px;
  bottom: 0;
  left: 0;
  height: 100%;
  padding: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ie-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: scroll;
  white-space: pre-wrap;
  font-family: 'Courier New', mono;
}
.replayBlockTimer {
  position: absolute;
  top: 4px;
  right: 4px;
  color: blue;
}
.candidateBlock {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding-bottom: 68px;
  width: 210px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.candidateLabel {
  padding: 5px 5px 0;
}
.candidateField {
  padding: 0 5px 5px;
}
.candidateControls {
  position: fixed;
  bottom: 12px;
  padding: 5px;
  opacity: 0.3;
}
.candidateControls:hover {
  opacity: 1.0;
}
.textContent {
  font: 11px 'Courier New', mono;
  white-space: pre-wrap;
}
.processContent {
  font: 11px 'Arial', sans-serif;
}
.selectedText {
  background-color: #CCCCFF;
}
.blinkCursor {
  display: inline-block;
  margin-left: -4px;
  margin-right: -4px;
  width: 8px;
  text-align: center;
  /* text-decoration: blink; */
  font-weight: bold;
  color: red;
}
.replayControls {
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -181px;
  opacity: 0.3;
}
.replayControls:hover {
  opacity: 1.0;
}
.badReplayError {
  position: absolute;
  top: 2px;
  right: 227px;
  padding: 4px 7px;
  background-color: #CC0000;
  color: white!important;
  font-weight: bold;
  cursor: pointer;
}
.badReplayError:hover {
  text-decoration: underline;
}
.chunk {
  border-top: 1px solid #CCC;
  line-height: 17px;
  min-height: 17px;
  max-height: 51px;
  overflow: hidden;
  cursor: pointer;
}
.chunk:hover {
  background-color: #EEE;
}
.chunk.selected {
  background-color: #CCF;
}
.chunk.selected:hover {
  background-color: #AAE;
}
.gwt-PopupPanelGlass {
  z-index: 5;
}
.gwt-DialogBox {
  z-index: 6;
}

/**
 * Process Units
 */
.processUnit {
  padding: 5px;
}
.processUnitDeleteLine {
  float: right;
}
.processUnitLine {
  position: relative;
  border-bottom: 1px solid black;
}
.processUnitName {
  position: absolute;
  border: 0 none;
  padding: 5px;
  width: 200px;
  height: 100%;
  background-color: black;
  color: white;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ie-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  resize: none;
  font-family: Arial Unicode MS, Arial, sans-serif;
  font-size: small;
}
div.processUnitName {
  user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
}
.processUnitName:focus {
  outline: 1px solid blue;
}
.processUnitSegment {
  margin-left: 200px;
  border-width: 1px 1px 0 0;
  border-style: solid;
  border-color: black;
  padding: 2px 4px;
  min-height: 15px;
  max-height: 45px;
  line-height: 15px;
  overflow: hidden;
}
.processUnitTag {
  position: relative;
  display: inline-block;
  margin: 1px;
  border: 1px solid #CCAA55;
  padding: 0 1px;
  height: 25px;
  line-height: 25px;
  font-size: 16px;
  background-color: #FFCC66;
}
.processUnitTagName {
  display: inline-block;
  padding: 0 29px 0 4px;
}
.processUnitTagDeleteButton {
  position: absolute;
  display: block;
  top: 2px;
  right: 2px;
  margin: 0;
  border: 1px solid #CCAA55;
  padding: 0 0 2px;
  width: 21px;
  height: 21px;
  line-height: 17px;
  background-color: white;
  color: black;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ie-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
.processUnitTagDeleteButton:hover,
.processUnitTagDeleteButton:focus {
  background-color: #FFD;
}
.applyTagsBlock,
.countTagsBlock {
  overflow: auto;
}
.linearFormTime {
  display: inline-block;
  padding: 0 5px;
  width: 90px;
  text-align: right;
  color: gray;
}
.linearFormTime:after {
  content: ":";
  color: gray;
}
/**
 * Graph
 */
.graph {
  padding: 10px 10px 0 10px;
}
.graphVariable {
  padding-top: 10px;
  height: 35px;
}
.graphVariableName {
  float: left;
  margin-top: -10px;
  border-right: 1px solid black;
  padding: 14px 10px 1px;
  width: 179px;
  height: 30px;
  text-align: right;
  line-height: 15px;
  font-size: 11px;
}
.graphVariableBar {
  position: relative;
  margin: 0 0 10px 200px;
  height: 25px;
}
.graphVariableBarFill {
  border: 1px solid #CCAA55;
  padding-right: 4px;
  height: 25px;
  text-align: right;
  line-height: 25px;
  font-size: 16px;
  background-color: #FFCC66;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ie-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  color: #BB9944;
}
table.stats {
  table-layout: fixed;
  border-spacing: 0;
  border-collapse: separate;
  empty-cell: show;

  margin: 20px auto;
  border-top: 1px solid black;
  border-left: 1px solid black;
  width: 560px;
}
table.stats th,
table.stats td {
  margin: 0;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  padding: 3px;
  text-align: center;
}
table.stats thead th {
  background-color: black;
  color: white;
}
.processUnitTags {
  display: inline;
}
.processUnitAddTagLine .field.width2 {
  display: inline-block;
  margin-bottom: -7px;
}
/**
 * Error and Warning Messages
 */
.message {
  display: block;
  position: absolute;
  margin: -27px 0 0;
  padding: 3px 10px 2px;
  height: 20px;
  color: white;
  -webkit-box-shadow: 2px 2px 6px #777;
  -moz-box-shadow: 2px 2px 6px #777;
  -ie-box-shadow: 2px 2px 6px #777;
  box-shadow: 2px 2px 6px #777;
  z-index: 7;
  white-space: pre;
}
.profile .message {
  margin: -37px 0 0;
}
.message.width3 {
  left: 190px;
}
.message.width3.left {
  left: inherit;
  right: 190px;
}
.message.width5 {
  left: 325px;
}
.message.width5.left {
  left: inherit;
  right: 325px;
}
.message.error {
  background-color: red;
}
.message.warning {
  background-color: #CC0000;
}
.message.success {
  background-color: #00AA00;
}
