#title {
text-align: center;
}
h1 {
white-space: nowrap;
#header {
margin-left: 2%;
#statdiv {
margin-bottom: 2pt;
#errspan {
margin-left: 1em;
.connected {
color: green;
.disconnected {
background-color: red;
font-weight: bold;
.userform {
display: inline
.userform-invisible {
display: none;
.disconnect-invisible {
.error {
color: red;
.noerror {
#main {
display: flex;
#users {
width: 5%;
border: 1px solid;
#anonymous-users {
#chatbox {
width: 100%;
#chat {
width: 20%;
margin-left: 0.3em;
height: 85vh;
#inputform {
#box {
height: 95%;
overflow: auto;
.message, message-me {
margin: 0 0.5em 0 0.5em;
.message-user {
.message-content {
line-height: 1.5;
.message-me-asterisk {
margin-right: 0.5em;
.message-me-user {
.message-me-content {
#input {
border: none;
resize: none;
overflow-y: hidden;
#input:focus {
outline: none;
#inputbutton {
background-color: white;
margin-right: 0.2em;
font-size: 1.5em;
#inputbutton:focus {
#resizer {
width: 8px;
margin-left: -8px;
z-index: 1000;
#resizer:hover {
cursor: ew-resize;
#peers {
margin-left: 1%;
margin-right: 1%;
flex-wrap: wrap;
margin-bottom: 4px;
.peer {
flex-direction: column;
margin-right: 5px;
margin-left: 5px;
margin-bottom: 10px;
max-height: 50%;
.media {
height: 400px;
margin: auto;
min-width: 4em;
.label {
height: 2em;
margin-top: 5px;
.label-fallback {
opacity: 0.5;
width: 85%;