html
{
  height:100%;
}
body
{
  font-family: arial,sans;
  margin:0px;
  height:100%;
  background-color:#333333;
}
div.cams
{
  display:none;
  height:calc(60% - 30px);
  height:-webkit-calc(60% - 30px);
  height:-moz-calc(60% - 30px);
  height:-o-calc(60% - 30px);
  height:-ms-calc(60% - 30px);
  width:100%;
  background-color:#707070;
  float:top;
}
video
{
  margin-bottom:-5px;
}
div#videoplayer
{
  height:100%;
  width:22%;
  display:none;
  position:relative;
}
div#videoplayer>button
{
  font-size:8px;
  padding:0px;
  position:absolute;
  top:0px;
  right:0px;
}
iframe#videoplayerframe
{
  border-width:0px;
  margin:0px;
  // For some reason, at least on firefox, iframes have a little bump below them, so we take 4 pixels off to avoid that
  height:calc(100% - 4px);
  height:-webkit-calc(100% - 4px);
  height:-moz-calc(100% - 4px);
  height:-o-calc(100% - 4px);
  height:-ms-calc(100% - 4px);
  width:100%;
}
div#chat
{
  display:inline-block;
  height:calc(100% - 30px);
  height:-webkit-calc(100% - 30px);
  height:-moz-calc(100% - 30px);
  height:-o-calc(100% - 30px);
  height:-ms-calc(100% - 30px);
  width:85%;
  background-color:#e0e0e0;
  float:left;
}
div#tabs
{
  display:block;
  width:100%;
  height:30px;
  background-color:#7070a0;
}
div.tab>button
{
  font-size:8px;
  padding:0px;
  margin-left:6px;
  margin-right:-4px;
  float:top;
  position:relative;
  top:-4px;
}
div.tab
{
  display:inline-block;
  height:25px;
  padding-left:6px;
  padding-right:6px;
  padding-top:4px;
  border-top-style:solid;
  border-left-style:solid;
  border-right-style:solid;
  border-width:1px;
  border-color:#505050;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  background-color:#a0a0a0;
  cursor:default;
}
div.tabfocus
{
  background-color:#c0c0c0;
}
div.tabactivity
{
  background-color:#ffa000;
}
div.chatbox
{
  display:inline-block;
  width:100%;
  height:calc(100% - 30px);
  height:-webkit-calc(100% - 30px);
  height:-moz-calc(100% - 30px);
  height:-o-calc(100% - 30px);
  height:-ms-calc(100% - 30px);
  overflow:auto;
}
div.userlist
{
  display:inline-block;
  height:calc(100% - 30px);
  height:-webkit-calc(100% - 30px);
  height:-moz-calc(100% - 30px);
  height:-o-calc(100% - 30px);
  height:-ms-calc(100% - 30px);
  width:15%;
  background-color:#c0c0c0;
  float:right;
  overflow:auto;
}
div.input
{
  display:inline-block;
  height:30px;
  width:100%;
  background-color:#a0a0a0;
  float:bottom;
}
input#message
{
  width:calc(100% - 70px);
  width:-webkit-calc(100% - 70px);
  width:-moz-calc(100% - 70px);
  width:-o-calc(100% - 70px);
  width:-ms-calc(100% - 70px);
  height:22px;
}
input#send
{
  width:55px;
}
div#usermenu
{
  position:absolute;
  display:none;
  border-style:solid;
  border-width:1px;
  border-color:#000000;
  background-color:#707070;
  padding-top:2px;
  padding-bottom:2px;
}
div.usermenuoption
{
  display:block;
  cursor:default;
  padding-left:20px;
  padding-right:20px;
  white-space:nowrap;
}
div.usermenuoption:hover
{
  background-color:#909090;
}
pre
{
  display:inline-block;
  margin:0px;
}
div.cambox
{
  display:inline-block;
  position:relative;
  height:100%;
  background-color:#262626;
}
div.cambox>span
{
  position:absolute;
  top:calc(50% - 0.5em);
  top:-webkit-calc(50% - 0.5em);
  top:-moz-calc(50% - 0.5em);
  top:-o-calc(50% - 0.5em);
  top:-ms-calc(50% - 0.5em);
  left:0px;
  display:none;
  text-align:center;
  width:100%;
  color:#e0e0e0;
}
div.cambox:hover>span
{
  display:inline-block;
}
div.cambox:hover>video
{
  opacity:0.3;
}
div.fullscreen
{
  display:none; /* Start hidden */
  position:absolute;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  background-color:rgba(0, 0, 0, 0.8);
  text-align:center;
  color:#c0c0c0;
}
div.fullscreen>*
{
  display:inline-block;
  vertical-align:middle;
}
button.fullscreenclose
{
  position:absolute;
  right:0px;
  top:0px;
  border-style:none;
  border-width:0px;
  background-color:rgba(0,0,0,0);
  color:#c0c0c0;
  font-size:50px;
}
div.centerhelper
{
  display:inline-block;
  vertical-align:middle;
  height:100%;
}
div#loggedout
{
  padding-bottom:10px;
}
div#loggedin
{
  display:none;
  padding-bottom:10px;
}
button#registerchannel
{
  display:none; /* Start hidden */
}
button#managemods_button
{
  display:none; /* Start hidden */
}
div#modmanagerlist
{
  display:block;
}
div.modlistitem /* TODO: Rename to something more general for fullscreen panel lists? */
{
  text-align:left;
  padding:8px;
  border-style:solid;
  border-width:1px;
  border-color:#c0c0c0;
}
div.modlistitem>button
{
  float:right;
}
button#banlist_button
{
  display:none; /* Start hidden */
}
button#setchanpass_button
{
  display:none; /* Start hidden */
}
button#deregisterchannel_button
{
  display:none; /* Start hidden */
}
span.modindicator
{
  cursor:default;
  color:#00ff00;
  text-shadow:0px 0px 1px #000000;
  -moz-text-shadow:0px 0px 1px #000000;
  -webkit-text-shadow:0px 0px 1px #000000;
  -ms-text-shadow:0px 0px 1px #000000;
  -o-text-shadow:0px 0px 1px #000000;
}
div.arrowsection>a
{
  text-decoration:none;
  color:#000000;
}
div#options_open
{
  display:none; /* Start hidden */
}