.sr-only {
  display: block;
  position: absolute;
  top: auto;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

body {
  background: #77d;
  color: #fff;
  font-size: 12pt;
  line-height: 1em;
}

a {
  color: #ccc;
}

#startUi {
  display: block;
  padding: 4em;
}

#chatUi {
  display: none;
}

#messages {
  width: 55%;
  height: 35em;
  border: 4px double white;
  background: black;
  color: #0E0;
  padding: 1%;
  overflow: auto;
}

#inputContainer {
  margin: 5px 4px;
  width: 57%;
}

#input {
  width: 100%;
  height: 2em;
  font-size: 110%;
}

.pending {
  opacity: .7;
  color: #f00;
}

.message > time, .message > .nick {
  display: inline-block;
  margin: 0 .5em;
}

.message > time:before {
  content: '[';
}

.message > time:after {
  content: ']';
}

.message > .nick:before {
  content: '<';
}

.message > .nick:after {
  content: '>';
}