vroom/public/css/vroom.css

#webRTCVideo {
  overflow-y: auto;
}
#webRTCVideo video {
  width: 100%;
  height: auto;
}
#webRTCVideo .selected {
  box-shadow: 0px 0px 2pt 2pt red;
}
#mainVideo{
  margin-right: auto;
  margin-left: auto;
  text-align: center;  
}
#mainVideo video {
  max-width: 100%;
  min-width: 75%;
  height: auto;
}
.previewContainer{
  margin-top: 5px;
  margin-bottom: 5px;
}
.previewContainer:nth-child(2n+1){
  clear: left;
}
.volumeBar {
  position: absolute;
  width: 5px;
  height: 0px;
  right: 0px;
  bottom: 0px;
  background-color: #12acef;
}
.muted {
  content:url(/img/mute.png) no-repeat;
  position: absolute;
  right: 20px;
  top: 10px;
}
.paused{
  content:url(/img/pause.png);
  position: absolute;
  right: 56px;
  top: 10px;
}
.displayName {
  text-align: center;
  font-weight: bold;
  border-radius: 8px;
  word-wrap: break-word;
  padding-right: 5px;
  padding-left: 5px;
  padding-top: 2px;
  padding-bottom: 2px;
}
#createRoomContainer {
  max-width: 500px;
  margin-top: 50px;
  margin-right: auto;
  margin-left: auto;
}
#chatBox {
  max-height:300px;
  resize:none;
}
#chatContainer {
  width: 600px;
}
#chatHistory{
  width: 100%;
  height: 200px;
  overflow: auto;
}
.chatMsgContainer {
  margin-right: 3px;
  margin-left: 3px;
}
.chatMsg {
  max-width: 75%;
  border-radius: 8px;
  margin-top: 2px;
  margin-bottom: 2px;
  word-wrap: break-word;
  padding-right: 5px;
  padding-left: 5px;
  padding-top: 2px;
  padding-bottom: 2px;
  white-space: pre;
}
.chatMsg a {
  color: black;
}
.chatMsgSelf {
  float: right;
}
.chatMsgOthers {
  float: left;
}
#chatMenu {
  margin-bottom: 15px;
}
@media screen and (max-width: 480px) {
  body {
    font-size: 0.8em;
  }
}
@media screen and (max-width: 768px) {
  body {
    font-size: 0.9em;
  }
}