html, body{ margin:0px; height:100%; color: #424242; font-family:'Helvetica Neue', Helvetica, sans-serif; font-weight: 400; background: #000000; overflow-x: hidden; } #chatspace, #contactlist { display:none; position:absolute; float: right; top: 0px; bottom: 0px; right: 0px; width: 20%; max-width: 200px; overflow: hidden; /* background-color:#dfebf1;*/ background-color:#FFFFFF; border-left:1px solid #424242; z-index: 5; } #chatspace { background-color:#FFF; border-left:1px solid #424242; } #chatconversation { visibility: hidden; position: relative; top: 5px; padding: 5px; text-align: left; line-height: 20px; font-size: 10pt; width: 100%; height: 95%; overflow-y: scroll; overflow-x: hidden; word-wrap: break-word; } .localuser { color: #087dba; } .errorMessage { color: red; } .remoteuser { color: #424242; } #usermsg { visibility:hidden; position: relative; width: 100%; height: 5%; padding: 5px; max-height:150px; min-height:50px; border: 0px none; border-top: 1px solid #cccccc; background: #FFFFFF; box-shadow: none; border-radius:0; font-size: 10pt; overflow: hidden; } #usermsg:hover { border: 0px none; border-top: 1px solid #cccccc; box-shadow: none; } #nickname { position: absolute; text-align: center; color: #9d9d9d; font-size: 18; top: 100px; left: 5px; right: 5px; width: 95%; } #nickinput { margin-top: 20px; font-size: 14; } #settings { display:none; } #nowebrtc { display:none; } #settingsButton { visibility: hidden; } .toolbar_span { display: inline-block; position: relative; } .button { display: inline-block; position: relative; color: #FFFFFF; top: 0px; padding: 10px 0px; width: 38px; cursor: pointer; font-size: 11pt; text-align: center; text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.6); z-index: 1; } .toolbar_span>span { display: inline-block; position: absolute; font-size: 7pt; color: #ffffff; text-align:center; cursor: pointer; } #chatButton { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } /*#ffde00*/ #chatButton.active { -webkit-text-shadow: -1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; -moz-text-shadow: 1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; text-shadow: -1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; } #recordButton { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } /*#ffde00*/ #recordButton.active { -webkit-text-shadow: -1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; -moz-text-shadow: 1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; text-shadow: -1px 0 10px #00ccff, 0 1px 10px #00ccff, 1px 0 10px #00ccff, 0 -1px 10px #00ccff; } a.button:hover, a.bottomToolbarButton:hover { top: 0px; cursor: pointer; background: rgba(255, 255, 255, 0.1); border-radius: 6px; background-clip: padding-box; -webkit-border-radius: 6px; -webkit-background-clip: padding-box; } .no-fa-video-camera, .fa-microphone-slash { color: #636363; } .header_button_separator { display: inline-block; position:relative; top: 5; width: 1px; height: 20px; background: #373737; } .bottom_button_separator { display: inline-block; position: relative; left: 5; width: 20px; height: 1px; background: #373737; } input[type='text'], input[type='password'], textarea { display: inline-block; font-size: 14px; padding: 5px; background: #f3f3f3; border-radius: 3px; font-weight: 100; line-height: 20px; height: 40px; color: #333; text-align: left; border:1px solid #ACD8F0; outline: none; /* removes the default outline */ resize: none; /* prevents the user-resizing, adjust to taste */ } input[type='text'], input[type='password'], textarea:focus { box-shadow: inset 0 0 3px 2px #ACD8F0; /* provides a more style-able replacement to the outline */ } textarea { overflow: hidden; word-wrap: break-word; resize: horizontal; } button.no-icon { padding: 0 1em; } button { border: none; height: 35px; padding: 0 1em 0 2em; position: relative; border-radius: 3px; font-weight: bold; color: #fff; line-height: 35px; background: #2c8ad2; } button, input, select, textarea { margin: 0; vertical-align: baseline; } button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } form { display: block; } #downloadlog { position: absolute; bottom: 5; left: 5; overflow: visible; z-index: 100; color: rgba(255,255,255,.50); } #bottomToolbar { display:block; position: absolute; right: 0; margin-right: 5px; bottom: 40px; width: 29px; border-radius: 6px; color: #FFF; border: 1px solid rgba(256, 256, 256, 0.2); background: rgba(0,0,0,0.8); z-index: 6; /*+1 from #remoteVideos*/ } .bottomToolbarButton { display: inline-block; position: relative; color: #FFFFFF; top: 0; padding-top: 6px; margin: 2px; width: 25px; height: 20px; cursor: pointer; font-size: 10pt; text-align: center; text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7); z-index: 1; } .active { color: #00ccff; } .bottomToolbar_span>span { display: inline-block; position: absolute; font-size: 7pt; color: #ffffff; text-align: center; cursor: pointer; } .glow { text-shadow: 0px 0px 30px #06a5df, 0px 0px 10px #06a5df, 0px 0px 5px #06a5df,0px 0px 3px #06a5df; } .watermark { display: block; position: absolute; top: 15; width: 186px; height: 74px; background-size: contain; background-repeat: no-repeat; z-index: 2; } .leftwatermark { display: none; left: 15; background-image:url(../images/watermark.png); background-position: center left; } .rightwatermark { display: none; right: 15; background-position: center right; } .poweredby { display: none; position: absolute; left: 25; bottom: 7; font-size: 11pt; color: rgba(255,255,255,.50); text-decoration: none; z-index: 100; }