/* SEN */
@font-face {
 font-family: MyCustomFont;
 src: url("ProduceProClientEOT.eot"); /* EOT file for IE */
 src: url("ProduceProClientEOT.eot?#iefix") format('embedded-opentype'), 
      url("ProduceProClientTTF.ttf") format('truetype'); /* CSS3 browsers */
 font-weight: normal;
 font-style: normal;
}

#retrybutton,
#retryend {
  width: 100%;
  padding: 5px;
  margin: 5px 0;
}
.ui-dialog.ui-widget {
  font-size: .9em;
}
.no-close .ui-dialog-titlebar-close {
  display: none
}
#popup {
  display:flex;
  flex-flow: column nowrap;
  justify-content: space-around;
  align-items: center;
}
#popup-browse {
  display: flex;
  flex-flow: column-reverse;
  justify-content: flex-end;
}
#popup-browse .new {
  color: green;
}
#popup-browse .new:before {
  content: "NEW";
  background-color: green;
  color: white;
  border: 1px solid white;
  font-size: .5em;
  padding: 2px 5px;
  margin-right: 5px;
}

.shell-disabled {
  filter: grayscale(100%);
  filter: blur(5px);
}

#rows-input {
  margin: 10px auto;
}

i, b, span { /* Prevent keyboard delays on buttons */
  -ms-touch-action: none !important;
  touch-action: none !important;
}

#vt100 a { 
  text-decoration:      none;
  color:                inherit;
}

#vt100 a:hover { 
  text-decoration:      underline;
}

#vt100 #reconnect, #vt100 #writeToFile{
  position:             absolute;
  z-index:              2;
}

#vt100 #reconnect input { 
  padding:              1ex;
  font-weight:          bold;
  font-size:            x-large;
}

#vt100 #cursize {
  background:           #EEEEEE;
  border:               1px solid black;
  font-family:          sans-serif;
  font-size:            large;
  font-weight:          bold;
  padding:              1ex;
  position:             absolute;
  z-index:              2;
}

#vt100 pre { 
  margin:               0px;
}

#vt100 pre pre {
  overflow:             hidden;
}

#vt100 #scrollable {
  overflow-x:           hidden;
  overflow-y:           scroll;
  position:             relative;
  padding:              1px;
  cursor:		pointer; /* SEN */
}

/* SEN */
#vt100 div#scrollable pre#console div {
  line-height: 19px;
  height: 19px;
}

/* SEN */
#vt100 #console, #vt100 #alt_console, #vt100 #cursor, #vt100 #lineheight { 
  font-family:      MyCustomFont, "DejaVu Sans Mono", "Everson Mono", FreeMono, "Andale Mono", "Lucida Console", monospace;
  font-size: 16px;
}

#vt100 #lineheight { 
  position:             absolute;
  visibility:           hidden;
}

#vt100 #cursor {
  position:             absolute;
  left:                 0px;
  top:                  0px;
  overflow:             hidden;
  z-index:              1;
}

#vt100 #cursor.bright {
  background-color: #00e600; /* SEN */
  color:                white;
}

#vt100 #cursor.dim {
  visibility:           hidden;
}

#vt100 #cursor.inactive {
  border:           1px solid #00e600; /* SEN */
  margin:               -1px;
}

#vt100 #padding { 
  visibility:           hidden;
  width:                1px;
  height:               0px;
  overflow:             hidden;
}

#vt100 .hidden {
  position:             absolute;
  top:                  -10000px;
  left:                 -10000px;
  width:                0px;
  height:               0px;
}

#vt100 #menu { 
  overflow:             visible;
  position:             absolute;
  z-index:              3;
}

#vt100 #menu .popup {
  background-color:     #EEEEEE;
  border:               1px solid black;
  font-family:          sans-serif;
  position:             absolute;
}

#vt100 #menu .popup ul { 
  list-style-type:      none;
  padding:              0px;
  margin:               0px;
  min-width:            10em;
}

#vt100 #menu .popup li { 
  padding:              3px 0.5ex 3px 0.5ex;
}

#vt100 #menu .popup li.hover {
  background-color:     #444444;
  color:                white;
}

#vt100 #menu .popup li.disabled {
  color:                #AAAAAA;
}

#vt100 #menu .popup hr { 
  margin:               0.5ex 0px 0.5ex 0px;
}

#vt100 #menu img { 
  margin-right:         0.5ex;
  width:                1ex;
  height:               1ex;
}

#vt100 #scrollable.inverted { color:            #ffffff;
                              background-color: #000000; }

#vt100 #kbd_button{ 
  float:                left;
  position:             fixed;
  z-index:              999;
  visibility:           hidden;
  margin-right:		0px; /* SEN */
}

#vt100 #keyboard {
  z-index:              3;
  position:             absolute;
}

#vt100 #keyboard #slider {
width: 95%;
top: -25px;
position: absolute;
}

#vt100 #keyboard .box {
  font-family:          sans-serif;
  background-color:     #cccccc;
  padding:              .3em;
  float:                left;
  position:             absolute;
  border-radius:        10px;
  -moz-border-radius:   10px;
  box-shadow:           4px 4px 6px #222222;
  -webkit-box-shadow:   4px 4px 6px #222222;
  /* Don't set the -moz-box-shadow. It doesn't properly scale when CSS
   * transforms are in effect. Once Firefox supports box-shadow, it should
   * automatically do the right thing. Until then, leave shadows disabled
   * for Firefox.
   */
  opacity:              0.55;
  -moz-opacity:         0.55;
  filter:               alpha(opacity=55);
  white-space: nowrap;
}

#vt100 #keyboard .box * {
  vertical-align:       top;
  display:              inline-block;
}

#vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
  font-style:           normal;
  font-weight:          bold;
  border-radius:        3px;
  -moz-border-radius:   3px;
  background-color:     #555555;
  color:                #eeeeee;
  box-shadow:           2px 2px 3px #222222;
  -webkit-box-shadow:   2px 2px 3px #222222;
  height:               2.1ex;
  display:              inline-block;
  text-align:           center;
  text-decoration:      none;
}

#vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: calc(100vw / 200);
    margin-right: calc(100vw / 200);
    padding-top: 9px;
    padding-bottom: 9px;
    padding-left: calc(100vw / 100);
    padding-right: calc(100vw / 100);
    font-size: 16pt;
  }

@media (max-width: 700px) {
  #vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
    font-size: 13pt;
    padding-left: calc(100vw / 150);
    padding-right: calc(100vw / 150);
  }
  #vt100 #keyboard b, #vt100 #keyboard s {
    min-width: 0ex;
    width: 2ex;
  }
  #vt100 #keyboard u.to-hide {
    display: none !important;
  }
}

@media (max-width: 400px) {
  #vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
    font-size: 11pt;
  }
}
  /*
#vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
  margin: 2px;
  padding: 9px;
  font-size: 16pt;
}

@media (max-width: 700px) {
  #vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
    margin: 2px;
    padding: 5px;
    font-size: 14pt;
  }
  #vt100 #keyboard b, #vt100 #keyboard s {
    min-width: 1ex;
  }
}

@media (max-width: 580px) {
  #vt100 #keyboard b, #vt100 #keyboard i, #vt100 #keyboard s, #vt100 #keyboard u {
    margin: calc(100vw / 30);
    padding-left: calc(100vw / 20);
    padding-right: calc(100vw / 20);
    font-size: calc(100vw / 5);
  }
  #vt100 #keyboard b, #vt100 #keyboard s {
    min-width: 1ex;
  }
}
*/
#vt100 #keyboard b, #vt100 #keyboard s {
  min-width: 2ex;
}

#vt100 #keyboard u, #vt100 #keyboard s {
  visibility:           hidden;
}

#vt100 #keyboard .shifted { 
  display:              none;
}

#vt100 #keyboard .selected {
  color:                #888888;
  background-color:     #eeeeee;
  box-shadow:           0px 0px 3px #222222;
  -webkit-box-shadow:   0px 0px 3px #222222;
  position:             relative;
  top:                  1px;
  left:                 1px;
}

#vt100 .ansi0               {                            }
#vt100 .ansi1               { color:            #800000; }
#vt100 .ansi2               { color:            #008000; }
#vt100 .ansi3               { color:            #808000; }
#vt100 .ansi4               { color:            #000080; }
#vt100 .ansi5               { color:            #800080; }
#vt100 .ansi6               { color:            #008080; }
#vt100 .ansi7               { color:            #c0c0c0; }
#vt100 .ansi8               { color:            #808080; }
#vt100 .ansi9               { color:            #ff0000; }
#vt100 .ansi10              { color:            #00ff00; }
#vt100 .ansi11              { color:            #ffff00; }
#vt100 .ansi12              { color:            #0000ff; }
#vt100 .ansi13              { color:            #ff00ff; }
#vt100 .ansi14              { color:            #00ffff; }
#vt100 .ansi15              { color:            #ffffff; }

#vt100 .bgAnsi0             { background-color: #000000; }
#vt100 .bgAnsi1             { background-color: #800000; }
#vt100 .bgAnsi2             { background-color: #008000; }
#vt100 .bgAnsi3             { background-color: #808000; }
#vt100 .bgAnsi4             { background-color: #000080; }
#vt100 .bgAnsi5             { background-color: #800080; }
#vt100 .bgAnsi6             { background-color: #008080; }
#vt100 .bgAnsi7             { background-color: #c0c0c0; }
#vt100 .bgAnsi8             { background-color: #808080; }
#vt100 .bgAnsi9             { background-color: #ff0000; }
#vt100 .bgAnsi10            { background-color: #00ff00; }
#vt100 .bgAnsi11            { background-color: #ffff00; }
#vt100 .bgAnsi12            { background-color: #0000ff; }
#vt100 .bgAnsi13            { background-color: #ff00ff; }
#vt100 .bgAnsi14            { background-color: #00ffff; }
#vt100 .bgAnsi15            { background-color: #ffffff; }

span.bgAnsi0 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi1 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi2 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi3 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi4 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi5 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi6 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi7 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi8 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi9 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi10 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi11 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi12 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi13 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi14 {
  position: relative;
  vertical-align: middle;
}
span.bgAnsi15 {
  position: relative;
  vertical-align: middle;
}


span.bgAnsi0:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #000000;
    bottom: -1px;
    left: 0;
}
span.bgAnsi1:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #800000;
    bottom: -1px;
    left: 0;
}
span.bgAnsi2:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #008000;
    bottom: -1px;
    left: 0;
}
span.bgAnsi3:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #808000;
    bottom: -1px;
    left: 0;
}
span.bgAnsi4:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #000080;
    bottom: -1px;
    left: 0;
}
span.bgAnsi5:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #800080;
    bottom: -1px;
    left: 0;
}
span.bgAnsi6:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #008080;
    bottom: -1px;
    left: 0;
}
span.bgAnsi7:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #c0c0c0;
    bottom: -1px;
    left: 0;
}
span.bgAnsi8:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #808080;
    bottom: -1px;
    left: 0;
}
span.bgAnsi9:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #ff0000;
    bottom: -1px;
    left: 0;
}
span.bgAnsi10:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #00ff00;
    bottom: -1px;
    left: 0;
}
span.bgAnsi11:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #ffff00;
    bottom: -1px;
    left: 0;
}
span.bgAnsi12:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #0000ff;
    bottom: -1px;
    left: 0;
}
span.bgAnsi13:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #ff00ff;
    bottom: -1px;
    left: 0;
}

span.bgAnsi14:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #00ffff;
    bottom: -1px;
    left: 0;
}
span.bgAnsi15:before {
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 100%;
    background-color: #ffffff;
    bottom: -1px;
    left: 0;
}

@media print {
  #vt100 .scrollback {
    display:            none;
  }

  #vt100 #reconnect, #vt100 #cursor, #vt100 #menu, #vt100 #kbd_button, #vt100 #keyboard, #vt100 #writeToFile { 
    visibility:         hidden;
  }

  #vt100 #scrollable { 
    overflow:           hidden;
  }

  #vt100 #console, #vt100 #alt_console { 
    overflow:           hidden;
    width:              1000000ex;
  }
}
