diff --git a/css/all-jitsi.css b/css/all-jitsi.css new file mode 100644 index 000000000..95ab6009d --- /dev/null +++ b/css/all-jitsi.css @@ -0,0 +1,4935 @@ +#nowebrtc, +.right-panel { + display: none +} + +.button, +.toolbar_span>span { + text-align: center; + cursor: pointer +} + +#videospace, +.right-panel, +body, +html { + overflow-x: hidden +} + +#contacts>li, +.fa-ul, +ul.loginmenu li, +ul.popupmenu li { + list-style-type: none +} + +@font-face { + font-family: jitsi; + src: url(../fonts/jitsi.eot?94d075); + src: url(../fonts/jitsi.eot?#iefix94d075) format('embedded-opentype'), url(../fonts/jitsi.woff?94d075) format('woff'), url(../fonts/jitsi.ttf?94d075) format('truetype'), url(../fonts/jitsi.svg?94d075#jitsi) format('svg'); + font-weight: 400; + font-style: normal +} + +[class*=" icon-"], +[class^=icon-] { + font-family: jitsi; + speak: none; + font-style: normal; + font-weight: 400; + font-variant: normal; + text-transform: none; + line-height: .75em; + font-size: 1.22em; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale +} + +.icon-contactList:before { + content: "\e615" +} + +.icon-avatar:before { + content: "\e616" +} + +.icon-callRetro:before { + content: "\e611" +} + +.icon-callModern:before { + content: "\e612" +} + +.icon-recDisable:before { + content: "\e613" +} + +.icon-recEnable:before { + content: "\e614" +} + +.icon-authenticate:before { + content: "\e1ae" +} + +.icon-kick1:before { + content: "\e60f" +} + +.icon-kick:before { + content: "\e610" +} + +.icon-share-desktop:before { + content: "\e602" +} + +.icon-chat-simple:before { + content: "\e606" +} + +.icon-full-screen:before { + content: "\e60d" +} + +.icon-exit-full-screen:before { + content: "\e60e" +} + +.icon-prezi:before { + content: "\e60c" +} + +.icon-link:before { + content: "\e600" +} + +.icon-chat:before { + content: "\e601" +} + +.icon-presentation:before { + content: "\e603" +} + +.icon-security:before { + content: "\e604" +} + +.icon-share-doc:before { + content: "\e605" +} + +.icon-telephone:before { + content: "\e611" +} + +.icon-security-locked:before { + content: "\e607" +} + +.icon-camera:before { + content: "\e608" +} + +.icon-camera-disabled:before { + content: "\e609" +} + +.icon-mic-disabled:before { + content: "\e60a" +} + +.icon-microphone:before { + content: "\e60b" +} + +.icon-hangup:before { + content: "\e617" +} + +.icon-reload:before { + content: "\e618" +} + +.icon-filmstrip:before { + content: "\e619" +} + +.icon-connection:before { + line-height: normal; + content: "\e61a" +} + +.icon-settings:before { + content: "\e61b" +} + +.icon-dialPad:before { + content: "\e61c" +} + +.toast-title { + font-weight: 700 +} + +.toast-message { + -ms-word-wrap: break-word; + word-wrap: break-word +} + +.toast-message a, +.toast-message label { + color: #fff +} + +.toast-message a:hover { + color: #ccc; + text-decoration: none +} + +.toast-close-button { + position: relative; + float: right; + font-size: 20px; + font-weight: 700; + color: #fff; + -webkit-text-shadow: 0 1px 0 #fff; + text-shadow: 0 1px 0 #fff; + opacity: .8; + -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=80); + filter: alpha(opacity=80) +} + +#chatBottomButton.glowing, +#contactListButton.glowing, +#toolbar_button_chat.active, +#toolbar_button_record.active { + -webkit-text-shadow: -1px 0 10px #0cf, 0 1px 10px #0cf, 1px 0 10px #0cf, 0 -1px 10px #0cf; + -moz-text-shadow: 1px 0 10px #0cf, 0 1px 10px #0cf, 1px 0 10px #0cf, 0 -1px 10px #0cf +} + +button.toast-close-button { + padding: 0; + cursor: pointer; + background: 0 0; + border: 0; + -webkit-appearance: none +} + +.toast-top-full-width { + top: 0; + right: 0; + width: 100% +} + +.toast-bottom-full-width { + bottom: 0; + right: 0; + width: 100% +} + +.toast-top-left { + top: 12px; + left: 12px +} + +.toast-top-right { + top: 12px; + right: 12px +} + +.toast-bottom-right { + right: 12px; + bottom: 12px +} + +.toast-bottom-left { + bottom: 12px; + left: 12px +} + +#toast-container { + position: fixed; + z-index: 999999 +} + +#toast-container * { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box +} + +#toast-container>div { + margin: 0 0 6px; + padding: 15px 15px 15px 50px; + width: 300px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; + background-position: 15px center; + background-repeat: no-repeat; + -moz-box-shadow: 0 0 12px #999; + -webkit-box-shadow: 0 0 12px #999; + box-shadow: 0 0 12px #999; + color: #fff; + opacity: .8; + -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=80); + filter: alpha(opacity=80) +} + +#toast-container>:hover { + -moz-box-shadow: 0 0 12px #000; + -webkit-box-shadow: 0 0 12px #000; + box-shadow: 0 0 12px #000; + opacity: 1; + -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100); + filter: alpha(opacity=100); + cursor: pointer +} + +#toast-container>.toast-info { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=)!important +} + +#toast-container>.toast-error { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=)!important +} + +#toast-container>.toast-success { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==)!important +} + +#toast-container>.toast-warning { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=)!important +} + +#toast-container.toast-bottom-full-width>div, +#toast-container.toast-top-full-width>div { + width: 96%; + margin: auto +} + +.toast { + background-color: #030303 +} + +.toast-success { + background-color: #51a351 +} + +.toast-error { + background-color: #bd362f +} + +.toast-info { + background-color: #2f96b4 +} + +.toast-warning { + background-color: #f89406 +} + +@media all and (max-width:240px) { + #toast-container>div { + padding: 8px 8px 8px 50px; + width: 11em + } + #toast-container .toast-close-button { + right: -.2em; + top: -.2em + } +} + +@media all and (min-width:241px) and (max-width:480px) { + #toast-container>div { + padding: 8px 8px 8px 50px; + width: 18em + } + #toast-container .toast-close-button { + right: -.2em; + top: -.2em + } +} + +@media all and (min-width:481px) and (max-width:768px) { + #toast-container>div { + padding: 15px 15px 15px 50px; + width: 25em + } +} + +* { + -webkit-user-select: none; + user-select: none +} + +body, +html { + margin: 0; + height: 100%; +} + +.right-panel { + position: absolute; + float: right; + top: 0; + bottom: 0; + right: 0; + width: 200px!important; + margin-bottom: 0; + max-width: 200px; + z-index: 5 +} + +.button, +.toolbar_span, +.toolbar_span>span { + display: inline-block +} + +.toolbar_span { + position: relative +} + +.button { + position: relative; + color: #FFF; + top: 0; + padding: 10px 0; + width: 38px; +height: 38px; + text-shadow: 0 1px 0 rgba(255, 255, 255, .3), 0 -1px 0 rgba(0, 0, 0, .6); + z-index: 1 +} + +.toolbar_span>span { + position: absolute; + font-size: 7pt; + color: #fff +} + +#chatBottomButton, +#contactListButton, +#numberOfParticipants, +#toolbar_button_chat { + -webkit-transition: all .5s ease-in-out; + -moz-transition: all .5s ease-in-out; + transition: all .5s ease-in-out +} + +#chatBottomButton.glowing, +#contactListButton.glowing, +#toolbar_button_chat.active { + text-shadow: -1px 0 10px #0cf, 0 1px 10px #0cf, 1px 0 10px #0cf, 0 -1px 10px #0cf +} + +#toolbar_button_hangup { + color: red; + font-size: 1.4em +} + +#contactListButton.active #numberOfParticipants { + color: #0cf +} + +#toolbar_button_record { + -webkit-transition: all .5s ease-in-out; + -moz-transition: all .5s ease-in-out; + transition: all .5s ease-in-out +} + +#toolbar_button_record.active { + text-shadow: -1px 0 10px #0cf, 0 1px 10px #0cf, 1px 0 10px #0cf, 0 -1px 10px #0cf +} + +.fa-microphone-slash, +.no-fa-video-camera { + color: #636363 +} + +.header_button_separator { + top: 5; + width: 1px; + height: 20px +} + +.bottom_button_separator { + left: 5; + width: 20px; + height: 1px +} + +.toast-message .nickname, +button { + font-weight: 700 +} + +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; + 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; + color: rgba(255, 255, 255, .5) +} + +#feedbackButton { + bottom: 1em; + left: 1em; + position: absolute +} + +div.feedbackButton { + background-color: rgba(0, 0, 0, .5); + border-radius: 50%; + bottom: 0; + font-size: 1em; + height: 3em; + left: 0; + overflow: hidden; + position: absolute; + text-align: center; + transition: all .2s ease-in-out 0s; + width: 3em; + z-index: 100 +} + +div.feedbackButton:hover { + font-size: 1.25em; + height: 3em; + width: 3em +} + +#bottomToolbar { + display: block; + position: absolute; + right: 0; + margin-right: 5px; + bottom: 40px !important; + z-index: 6 +} + +.bottomToolbarButton, +.bottomToolbar_span>span { + display: inline-block; + text-align: center; + cursor: pointer +} + + +#remoteVideos, +#videospace, +.poweredby, +.watermark { + position: absolute +} + +.active { + color: #0cf +} + +.bottomToolbar_span>span { + position: absolute; + font-size: 7pt; + color: #fff +} + +.glow { + text-shadow: 0 0 30px #06a5df, 0 0 10px #06a5df, 0 0 5px #06a5df, 0 0 3px #06a5df +} + +.watermark { + display: block; + 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; + left: 25; + bottom: 7; + font-size: 11pt; + color: rgba(255, 255, 255, .5); + text-decoration: none; + z-index: 100 +} + +#toast-container.notification-bottom-right { + bottom: 120px; + right: 5px +} + +#toast-container.notification-bottom-right-center { + right: 205px +} + +#toast-container .toast-info { + -webkit-box-shadow: none; + box-shadow: none; + background-color: #000; + border: 1px solid #3a3a3a; + width: 220px; + padding: 10px 10px 10px 50px +} + +.toast-close-button { + right: -7px; + top: -19px +} + +.connected { + color: #228b22; + font-size: 12px +} + +.disconnected { + color: #8b0000; + font-size: 12px +} + +.lastN { + color: #a3a3a3; + font-size: 12px +} + +.toast-close-button:focus, +.toast-close-button:hover { + text-decoration: none; + cursor: pointer; + color: #fff; + opacity: 1; + -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100); + filter: alpha(opacity=100) +} + +#videospace { + display: block; + top: 0; + left: 0; + right: 0!important; + width: 100%!important +} + +#remoteVideos { + border: 1px solid transparent; + bottom: 0; + left: 0; + overflow: hidden; + padding: 18px; + right: 20px; + text-align: right; + transition: padding 2s ease 0s, height 2s ease 0s; + width: auto; + height: auto!important; + z-index: 5 +} + +#remoteVideos.hidden { + height: 0!important; + padding: 0 18px +} + +.videocontainer { + position: relative +} + +#remoteVideos .videocontainer { + display: inline-block; + background-color: #000; + background-size: contain; + border-radius: 8px; + border: 2px solid #212425; + margin-right: 3px +} + +#remoteVideos .videocontainer.videoContainerFocused, +#remoteVideos .videocontainer:hover { + cursor: hand; + transition-duration: .5s; + -webkit-transition-duration: .5s; + -webkit-animation-name: greyPulse; + -webkit-animation-duration: 2s; + -webkit-animation-iteration-count: 1; + overflow: visible!important +} + +#remoteVideos .videocontainer:hover { + box-shadow: inset 0 0 10px #FFF, 0 0 10px #FFF; + border: 2px solid #FFF +} + +#remoteVideos .videocontainer.videoContainerFocused { + box-shadow: inset 0 0 28px #006d91; + border: 2px solid #006d91 +} + +#remoteVideos .videocontainer.videoContainerFocused:hover { + box-shadow: inset 0 0 5px #FFF, 0 0 10px #FFF, inset 0 0 60px #006d91; + border: 2px solid #FFF +} + +#localVideoWrapper { + display: inline-block; + -webkit-mask-box-image: url(../images/videomask.svg); + border-radius: 4px!important; + border: 0!important +} + +#remoteVideos .videocontainer>object, +#remoteVideos .videocontainer>video { + cursor: hand; + border-radius: 4px +} + +.flipVideoX { + transform: scale(-1, 1); + -moz-transform: scale(-1, 1); + -webkit-transform: scale(-1, 1); + -o-transform: scale(-1, 1) +} + +#localVideoWrapper>object, +#localVideoWrapper>video { + cursor: hand; + border-radius: 4px!important +} + +#largeVideo, +#largeVideoContainer, +#largeVideoWrapper { + overflow: hidden; + text-align: center +} + +#largeVideo, +#largeVideoWrapper { + object-fit: cover +} + +#etherpad, +#largeVideoWrapper, +#largeVideoWrapper>object, +#largeVideoWrapper>video, +#localVideoWrapper, +#localVideoWrapper>object, +#localVideoWrapper>video, +#presentation, +.videocontainer>object, +.videocontainer>video { + position: absolute; + left: 0; + top: 0; + z-index: 1; + width: 100%; + height: 100% +} + +#etherpad, +#presentation { + text-align: center +} + +#etherpad { + z-index: 0 +} + +#toolbar_button_etherpad { + display: none +} + +#remoteVideos .videocontainer>span.focusindicator, +#remoteVideos .videocontainer>span.remotevideomenu { + display: inline-block; + position: absolute; + color: #FFF; + top: 0; + left: 0; + padding: 5px 0; + width: 25px; + font-size: 11pt; + text-shadow: 0 1px 0 rgba(255, 255, 255, .3), 0 -1px 0 rgba(0, 0, 0, .7); + border: 0; + z-index: 2; + text-align: center +} + +#remoteVideos .nick { + display: none; + position: absolute; + left: 0; + bottom: -20px; + z-index: 0; + width: 100%; + font-size: 10pt +} + +.videocontainer>input.displayname, +.videocontainer>span.displayname, +.videocontainer>span.status { + position: absolute; + color: #FFF; + background: rgba(0, 0, 0, .7); + text-align: center; + text-overflow: ellipsis; + width: 70%; + left: 15%; + z-index: 2; + border-radius: 20px; + white-space: nowrap; + padding: 5px; + overflow: hidden +} + +.videocontainer>input.displayname, +.videocontainer>span.displayname { + display: none; + height: 20%; + top: 40%; + font-size: 11pt +} + +.videocontainer>span.status { + display: inline-block; + height: 15%; + bottom: 2%; + font-size: 10pt +} + +.connection, +.connectionindicator { + width: 18px; + height: 13px; + position: absolute +} + +.connectionindicator { + display: inline-block; + top: 7px; + right: 0; + padding: 0 5px; + z-index: 3 +} + +.connection.connection_empty { + color: #8B8B8B; + overflow: hidden +} + +.connection.connection_full { + color: #FFF; + overflow: hidden +} + +.connection { + left: 0; + top: 0; + font-size: 8pt; + border: 0 +} + +.connection_info { + float: left; + padding-bottom: 5px +} + +.connection_info>table { + white-space: nowrap +} + +.connection_info, +.connection_info>table { + text-align: left; + font-size: 11px; + color: #fff +} + +#localVideoContainer>span.displayname:hover, +#localVideoContainer>span.status:hover { + cursor: text +} + +.videocontainer>span.displayname, +.videocontainer>span.status { + pointer-events: none +} + +.videocontainer>input.displayname { + height: auto +} + +#localDisplayName { + pointer-events: auto!important +} + +.videocontainer>a.displayname, +.videocontainer>a.status { + display: inline-block; + position: absolute; + color: #FFF; + bottom: 0; + right: 0; + padding: 3px 5px; + font-size: 9pt; + cursor: pointer; + z-index: 2 +} + +.videocontainer>span.audioMuted, +.videocontainer>span.videoMuted { + padding: 8px 5px; + font-size: 8pt; + text-shadow: 0 1px 0 rgba(255, 255, 255, .3), 0 -1px 0 rgba(0, 0, 0, .7); + width: 25px; + display: inline-block; + top: 0; + position: absolute; + color: #FFF; + border: 0 +} + +.videocontainer>span.audioMuted { + z-index: 3; + text-align: center +} + +.videocontainer>span.videoMuted { + right: 0; + z-index: 3 +} + +.videocontainer>span.dominantspeakerindicator { + bottom: 0; + left: 0; + width: 25px; + height: 25px; + z-index: 3; + text-align: center; + border-radius: 50%; + background: #0cf; + margin: 5px; + display: inline-block; + position: absolute; + color: #FFF; + font-size: 11pt; + border: 0 +} + +#subject, +#toolbar { + position: relative; + width: auto +} + +#speakerindicatoricon { + padding-top: 5px +} + +#reloadPresentation { + display: none; + position: absolute; + color: #FFF; + top: 0; + right: 0; + padding: 10px; + font-size: 11pt; + cursor: pointer; + background: rgba(0, 0, 0, .3); + border-radius: 5px; + background-clip: padding-box; + -webkit-border-radius: 5px; + -webkit-background-clip: padding-box; + z-index: 20 +} + +#header { + display: none; + position: absolute; + text-align: center; + top: 0; + left: 0; + right: 0; + z-index: 10; + pointer-events: none +} + +#toolbar { + display: inline-block; + margin-top: 5px; + margin-left: auto; + margin-right: auto; + pointer-events: auto +} + +#subject { + z-index: 3; + padding: 5px; + margin-left: 40%; + margin-right: 40%; + text-align: center; + background: linear-gradient(to bottom, rgba(255, 255, 255, .85), rgba(255, 255, 255, .35)); + box-shadow: 0 0 2px #000, 0 0 10px #000; + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; + display: none +} + +.audiolevel { + display: inline-block; + position: absolute; + z-index: 0; + border-radius: 10px; + pointer-events: none +} + +#activeSpeaker { + visibility: hidden; + width: 150px; + height: 150px; + margin: auto; + overflow: hidden; + position: relative +} + +#activeSpeakerAudioLevel { + position: absolute; + top: 0; + left: 0; + z-index: 1; + visibility: inherit +} + +#mixedstream { + display: none!important +} + +#activeSpeakerAvatar { + width: 100px; + height: 100px; + top: 25px; + margin: auto; + position: relative; + border-radius: 50px; + z-index: 2; + visibility: inherit +} + +.fa.fa-pull-left, +.fa.pull-left { + margin-right: .3em +} + +.userAvatar { + height: 100%; + position: absolute; + left: 35px; + border-radius: 200px +} + +.noMic, +.noVideo { + border-radius: 8px; + z-index: 1; + height: 100%; + background-repeat: no-repeat; + position: absolute; + width: 100%; + background-color: #000; + background-position: center +} + +.noMic { + background-image: url(../images/noMic.png) +} + +.noVideo { + background-image: url(../images/noVideo.png) +} + +.videoMessageFilter { + -webkit-filter: grayscale(.5) opacity(.8); + filter: grayscale(.5) opacity(.8) +} + +.videoProblemFilter { + -webkit-filter: blur(10px) grayscale(.5) opacity(.8); + filter: blur(10px) grayscale(.5) opacity(.8) +} + +#videoConnectionMessage { + display: none; + position: absolute; + width: 100%; + top: 50%; + z-index: 10000; + font-weight: 600; + font-size: 14px; + text-align: center; + color: #FFF; + opacity: .8; + text-shadow: 0 0 1px rgba(0, 0, 0, .3), 0 1px 1px rgba(0, 0, 0, .3), 1px 0 1px rgba(0, 0, 0, .3), 0 0 1px rgba(0, 0, 0, .3) +} + +.fa, +.fa-stack { + display: inline-block +} + + +/*! + * Font Awesome 4.4.0 by @davegandy - http://fontawesome.io - @fontawesome + * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) + */ + +@font-face { + font-family: FontAwesome; + src: url(../fonts/fontawesome-webfont.eot?v=4.4.0); + src: url(../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0) format('embedded-opentype'), url(../fonts/fontawesome-webfont.woff2?v=4.4.0) format('woff2'), url(../fonts/fontawesome-webfont.woff?v=4.4.0) format('woff'), url(../fonts/fontawesome-webfont.ttf?v=4.4.0) format('truetype'), url(../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular) format('svg'); + font-weight: 400; + font-style: normal +} + +.fa { + font: normal normal normal 14px/1 FontAwesome; + font-size: inherit; + text-rendering: auto; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale +} + +.fa-lg { + font-size: 1.33333333em; + line-height: .75em; + vertical-align: -15% +} + +#contacts>li>p, +.avatar, +.fa-stack { + vertical-align: middle +} + +.fa-2x { + font-size: 2em +} + +.fa-3x { + font-size: 3em +} + +.fa-4x { + font-size: 4em +} + +.fa-5x { + font-size: 5em +} + +.fa-fw { + width: 1.28571429em; + text-align: center +} + +.fa-ul { + padding-left: 0; + margin-left: 2.14285714em +} + +.fa.fa-pull-right, +.fa.pull-right { + margin-left: .3em +} + +.fa-ul>li { + position: relative +} + +.fa-li { + position: absolute; + left: -2.14285714em; + width: 2.14285714em; + top: .14285714em; + text-align: center +} + +.fa-li.fa-lg { + left: -1.85714286em +} + +.fa-border { + padding: .2em .25em .15em; + border: .08em solid #eee; + border-radius: .1em +} + +.fa-pull-left { + float: left +} + +.fa-pull-right, +.pull-right { + float: right +} + +.pull-left { + float: left +} + +.fa-spin { + -webkit-animation: fa-spin 2s infinite linear; + animation: fa-spin 2s infinite linear +} + +.fa-pulse { + -webkit-animation: fa-spin 1s infinite steps(8); + animation: fa-spin 1s infinite steps(8) +} + +@-webkit-keyframes fa-spin { + 0% { + -webkit-transform: rotate(0); + transform: rotate(0) + } + 100% { + -webkit-transform: rotate(359deg); + transform: rotate(359deg) + } +} + +@keyframes fa-spin { + 0% { + -webkit-transform: rotate(0); + transform: rotate(0) + } + 100% { + -webkit-transform: rotate(359deg); + transform: rotate(359deg) + } +} + +.fa-rotate-90 { + filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=1); + -webkit-transform: rotate(90deg); + -ms-transform: rotate(90deg); + transform: rotate(90deg) +} + +.fa-rotate-180 { + filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=2); + -webkit-transform: rotate(180deg); + -ms-transform: rotate(180deg); + transform: rotate(180deg) +} + +.fa-rotate-270 { + filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3); + -webkit-transform: rotate(270deg); + -ms-transform: rotate(270deg); + transform: rotate(270deg) +} + +.fa-flip-horizontal { + filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1); + -webkit-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + transform: scale(-1, 1) +} + +.fa-flip-vertical { + filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); + -webkit-transform: scale(1, -1); + -ms-transform: scale(1, -1); + transform: scale(1, -1) +} + +:root .fa-flip-horizontal, +:root .fa-flip-vertical, +:root .fa-rotate-180, +:root .fa-rotate-270, +:root .fa-rotate-90 { + filter: none +} + +.fa-stack { + position: relative; + width: 2em; + height: 2em; + line-height: 2em +} + +.fa-stack-1x, +.fa-stack-2x { + position: absolute; + left: 0; + width: 100%; + text-align: center +} + +.fa-stack-1x { + line-height: inherit +} + +.fa-stack-2x { + font-size: 2em +} + +.fa-inverse { + color: #fff +} + +.fa-glass:before { + content: "\f000" +} + +.fa-music:before { + content: "\f001" +} + +.fa-search:before { + content: "\f002" +} + +.fa-envelope-o:before { + content: "\f003" +} + +.fa-heart:before { + content: "\f004" +} + +.fa-star:before { + content: "\f005" +} + +.fa-star-o:before { + content: "\f006" +} + +.fa-user:before { + content: "\f007" +} + +.fa-film:before { + content: "\f008" +} + +.fa-th-large:before { + content: "\f009" +} + +.fa-th:before { + content: "\f00a" +} + +.fa-th-list:before { + content: "\f00b" +} + +.fa-check:before { + content: "\f00c" +} + +.fa-close:before, +.fa-remove:before, +.fa-times:before { + content: "\f00d" +} + +.fa-search-plus:before { + content: "\f00e" +} + +.fa-search-minus:before { + content: "\f010" +} + +.fa-power-off:before { + content: "\f011" +} + +.fa-signal:before { + content: "\f012" +} + +.fa-cog:before, +.fa-gear:before { + content: "\f013" +} + +.fa-trash-o:before { + content: "\f014" +} + +.fa-home:before { + content: "\f015" +} + +.fa-file-o:before { + content: "\f016" +} + +.fa-clock-o:before { + content: "\f017" +} + +.fa-road:before { + content: "\f018" +} + +.fa-download:before { + content: "\f019" +} + +.fa-arrow-circle-o-down:before { + content: "\f01a" +} + +.fa-arrow-circle-o-up:before { + content: "\f01b" +} + +.fa-inbox:before { + content: "\f01c" +} + +.fa-play-circle-o:before { + content: "\f01d" +} + +.fa-repeat:before, +.fa-rotate-right:before { + content: "\f01e" +} + +.fa-refresh:before { + content: "\f021" +} + +.fa-list-alt:before { + content: "\f022" +} + +.fa-lock:before { + content: "\f023" +} + +.fa-flag:before { + content: "\f024" +} + +.fa-headphones:before { + content: "\f025" +} + +.fa-volume-off:before { + content: "\f026" +} + +.fa-volume-down:before { + content: "\f027" +} + +.fa-volume-up:before { + content: "\f028" +} + +.fa-qrcode:before { + content: "\f029" +} + +.fa-barcode:before { + content: "\f02a" +} + +.fa-tag:before { + content: "\f02b" +} + +.fa-tags:before { + content: "\f02c" +} + +.fa-book:before { + content: "\f02d" +} + +.fa-bookmark:before { + content: "\f02e" +} + +.fa-print:before { + content: "\f02f" +} + +.fa-camera:before { + content: "\f030" +} + +.fa-font:before { + content: "\f031" +} + +.fa-bold:before { + content: "\f032" +} + +.fa-italic:before { + content: "\f033" +} + +.fa-text-height:before { + content: "\f034" +} + +.fa-text-width:before { + content: "\f035" +} + +.fa-align-left:before { + content: "\f036" +} + +.fa-align-center:before { + content: "\f037" +} + +.fa-align-right:before { + content: "\f038" +} + +.fa-align-justify:before { + content: "\f039" +} + +.fa-list:before { + content: "\f03a" +} + +.fa-dedent:before, +.fa-outdent:before { + content: "\f03b" +} + +.fa-indent:before { + content: "\f03c" +} + +.fa-video-camera:before { + content: "\f03d" +} + +.fa-image:before, +.fa-photo:before, +.fa-picture-o:before { + content: "\f03e" +} + +.fa-pencil:before { + content: "\f040" +} + +.fa-map-marker:before { + content: "\f041" +} + +.fa-adjust:before { + content: "\f042" +} + +.fa-tint:before { + content: "\f043" +} + +.fa-edit:before, +.fa-pencil-square-o:before { + content: "\f044" +} + +.fa-share-square-o:before { + content: "\f045" +} + +.fa-check-square-o:before { + content: "\f046" +} + +.fa-arrows:before { + content: "\f047" +} + +.fa-step-backward:before { + content: "\f048" +} + +.fa-fast-backward:before { + content: "\f049" +} + +.fa-backward:before { + content: "\f04a" +} + +.fa-play:before { + content: "\f04b" +} + +.fa-pause:before { + content: "\f04c" +} + +.fa-stop:before { + content: "\f04d" +} + +.fa-forward:before { + content: "\f04e" +} + +.fa-fast-forward:before { + content: "\f050" +} + +.fa-step-forward:before { + content: "\f051" +} + +.fa-eject:before { + content: "\f052" +} + +.fa-chevron-left:before { + content: "\f053" +} + +.fa-chevron-right:before { + content: "\f054" +} + +.fa-plus-circle:before { + content: "\f055" +} + +.fa-minus-circle:before { + content: "\f056" +} + +.fa-times-circle:before { + content: "\f057" +} + +.fa-check-circle:before { + content: "\f058" +} + +.fa-question-circle:before { + content: "\f059" +} + +.fa-info-circle:before { + content: "\f05a" +} + +.fa-crosshairs:before { + content: "\f05b" +} + +.fa-times-circle-o:before { + content: "\f05c" +} + +.fa-check-circle-o:before { + content: "\f05d" +} + +.fa-ban:before { + content: "\f05e" +} + +.fa-arrow-left:before { + content: "\f060" +} + +.fa-arrow-right:before { + content: "\f061" +} + +.fa-arrow-up:before { + content: "\f062" +} + +.fa-arrow-down:before { + content: "\f063" +} + +.fa-mail-forward:before, +.fa-share:before { + content: "\f064" +} + +.fa-expand:before { + content: "\f065" +} + +.fa-compress:before { + content: "\f066" +} + +.fa-plus:before { + content: "\f067" +} + +.fa-minus:before { + content: "\f068" +} + +.fa-asterisk:before { + content: "\f069" +} + +.fa-exclamation-circle:before { + content: "\f06a" +} + +.fa-gift:before { + content: "\f06b" +} + +.fa-leaf:before { + content: "\f06c" +} + +.fa-fire:before { + content: "\f06d" +} + +.fa-eye:before { + content: "\f06e" +} + +.fa-eye-slash:before { + content: "\f070" +} + +.fa-exclamation-triangle:before, +.fa-warning:before { + content: "\f071" +} + +.fa-plane:before { + content: "\f072" +} + +.fa-calendar:before { + content: "\f073" +} + +.fa-random:before { + content: "\f074" +} + +.fa-comment:before { + content: "\f075" +} + +.fa-magnet:before { + content: "\f076" +} + +.fa-chevron-up:before { + content: "\f077" +} + +.fa-chevron-down:before { + content: "\f078" +} + +.fa-retweet:before { + content: "\f079" +} + +.fa-shopping-cart:before { + content: "\f07a" +} + +.fa-folder:before { + content: "\f07b" +} + +.fa-folder-open:before { + content: "\f07c" +} + +.fa-arrows-v:before { + content: "\f07d" +} + +.fa-arrows-h:before { + content: "\f07e" +} + +.fa-bar-chart-o:before, +.fa-bar-chart:before { + content: "\f080" +} + +.fa-twitter-square:before { + content: "\f081" +} + +.fa-facebook-square:before { + content: "\f082" +} + +.fa-camera-retro:before { + content: "\f083" +} + +.fa-key:before { + content: "\f084" +} + +.fa-cogs:before, +.fa-gears:before { + content: "\f085" +} + +.fa-comments:before { + content: "\f086" +} + +.fa-thumbs-o-up:before { + content: "\f087" +} + +.fa-thumbs-o-down:before { + content: "\f088" +} + +.fa-star-half:before { + content: "\f089" +} + +.fa-heart-o:before { + content: "\f08a" +} + +.fa-sign-out:before { + content: "\f08b" +} + +.fa-linkedin-square:before { + content: "\f08c" +} + +.fa-thumb-tack:before { + content: "\f08d" +} + +.fa-external-link:before { + content: "\f08e" +} + +.fa-sign-in:before { + content: "\f090" +} + +.fa-trophy:before { + content: "\f091" +} + +.fa-github-square:before { + content: "\f092" +} + +.fa-upload:before { + content: "\f093" +} + +.fa-lemon-o:before { + content: "\f094" +} + +.fa-phone:before { + content: "\f095" +} + +.fa-square-o:before { + content: "\f096" +} + +.fa-bookmark-o:before { + content: "\f097" +} + +.fa-phone-square:before { + content: "\f098" +} + +.fa-twitter:before { + content: "\f099" +} + +.fa-facebook-f:before, +.fa-facebook:before { + content: "\f09a" +} + +.fa-github:before { + content: "\f09b" +} + +.fa-unlock:before { + content: "\f09c" +} + +.fa-credit-card:before { + content: "\f09d" +} + +.fa-feed:before, +.fa-rss:before { + content: "\f09e" +} + +.fa-hdd-o:before { + content: "\f0a0" +} + +.fa-bullhorn:before { + content: "\f0a1" +} + +.fa-bell:before { + content: "\f0f3" +} + +.fa-certificate:before { + content: "\f0a3" +} + +.fa-hand-o-right:before { + content: "\f0a4" +} + +.fa-hand-o-left:before { + content: "\f0a5" +} + +.fa-hand-o-up:before { + content: "\f0a6" +} + +.fa-hand-o-down:before { + content: "\f0a7" +} + +.fa-arrow-circle-left:before { + content: "\f0a8" +} + +.fa-arrow-circle-right:before { + content: "\f0a9" +} + +.fa-arrow-circle-up:before { + content: "\f0aa" +} + +.fa-arrow-circle-down:before { + content: "\f0ab" +} + +.fa-globe:before { + content: "\f0ac" +} + +.fa-wrench:before { + content: "\f0ad" +} + +.fa-tasks:before { + content: "\f0ae" +} + +.fa-filter:before { + content: "\f0b0" +} + +.fa-briefcase:before { + content: "\f0b1" +} + +.fa-arrows-alt:before { + content: "\f0b2" +} + +.fa-group:before, +.fa-users:before { + content: "\f0c0" +} + +.fa-chain:before, +.fa-link:before { + content: "\f0c1" +} + +.fa-cloud:before { + content: "\f0c2" +} + +.fa-flask:before { + content: "\f0c3" +} + +.fa-cut:before, +.fa-scissors:before { + content: "\f0c4" +} + +.fa-copy:before, +.fa-files-o:before { + content: "\f0c5" +} + +.fa-paperclip:before { + content: "\f0c6" +} + +.fa-floppy-o:before, +.fa-save:before { + content: "\f0c7" +} + +.fa-square:before { + content: "\f0c8" +} + +.fa-bars:before, +.fa-navicon:before, +.fa-reorder:before { + content: "\f0c9" +} + +.fa-list-ul:before { + content: "\f0ca" +} + +.fa-list-ol:before { + content: "\f0cb" +} + +.fa-strikethrough:before { + content: "\f0cc" +} + +.fa-underline:before { + content: "\f0cd" +} + +.fa-table:before { + content: "\f0ce" +} + +.fa-magic:before { + content: "\f0d0" +} + +.fa-truck:before { + content: "\f0d1" +} + +.fa-pinterest:before { + content: "\f0d2" +} + +.fa-pinterest-square:before { + content: "\f0d3" +} + +.fa-google-plus-square:before { + content: "\f0d4" +} + +.fa-google-plus:before { + content: "\f0d5" +} + +.fa-money:before { + content: "\f0d6" +} + +.fa-caret-down:before { + content: "\f0d7" +} + +.fa-caret-up:before { + content: "\f0d8" +} + +.fa-caret-left:before { + content: "\f0d9" +} + +.fa-caret-right:before { + content: "\f0da" +} + +.fa-columns:before { + content: "\f0db" +} + +.fa-sort:before, +.fa-unsorted:before { + content: "\f0dc" +} + +.fa-sort-desc:before, +.fa-sort-down:before { + content: "\f0dd" +} + +.fa-sort-asc:before, +.fa-sort-up:before { + content: "\f0de" +} + +.fa-envelope:before { + content: "\f0e0" +} + +.fa-linkedin:before { + content: "\f0e1" +} + +.fa-rotate-left:before, +.fa-undo:before { + content: "\f0e2" +} + +.fa-gavel:before, +.fa-legal:before { + content: "\f0e3" +} + +.fa-dashboard:before, +.fa-tachometer:before { + content: "\f0e4" +} + +.fa-comment-o:before { + content: "\f0e5" +} + +.fa-comments-o:before { + content: "\f0e6" +} + +.fa-bolt:before, +.fa-flash:before { + content: "\f0e7" +} + +.fa-sitemap:before { + content: "\f0e8" +} + +.fa-umbrella:before { + content: "\f0e9" +} + +.fa-clipboard:before, +.fa-paste:before { + content: "\f0ea" +} + +.fa-lightbulb-o:before { + content: "\f0eb" +} + +.fa-exchange:before { + content: "\f0ec" +} + +.fa-cloud-download:before { + content: "\f0ed" +} + +.fa-cloud-upload:before { + content: "\f0ee" +} + +.fa-user-md:before { + content: "\f0f0" +} + +.fa-stethoscope:before { + content: "\f0f1" +} + +.fa-suitcase:before { + content: "\f0f2" +} + +.fa-bell-o:before { + content: "\f0a2" +} + +.fa-coffee:before { + content: "\f0f4" +} + +.fa-cutlery:before { + content: "\f0f5" +} + +.fa-file-text-o:before { + content: "\f0f6" +} + +.fa-building-o:before { + content: "\f0f7" +} + +.fa-hospital-o:before { + content: "\f0f8" +} + +.fa-ambulance:before { + content: "\f0f9" +} + +.fa-medkit:before { + content: "\f0fa" +} + +.fa-fighter-jet:before { + content: "\f0fb" +} + +.fa-beer:before { + content: "\f0fc" +} + +.fa-h-square:before { + content: "\f0fd" +} + +.fa-plus-square:before { + content: "\f0fe" +} + +.fa-angle-double-left:before { + content: "\f100" +} + +.fa-angle-double-right:before { + content: "\f101" +} + +.fa-angle-double-up:before { + content: "\f102" +} + +.fa-angle-double-down:before { + content: "\f103" +} + +.fa-angle-left:before { + content: "\f104" +} + +.fa-angle-right:before { + content: "\f105" +} + +.fa-angle-up:before { + content: "\f106" +} + +.fa-angle-down:before { + content: "\f107" +} + +.fa-desktop:before { + content: "\f108" +} + +.fa-laptop:before { + content: "\f109" +} + +.fa-tablet:before { + content: "\f10a" +} + +.fa-mobile-phone:before, +.fa-mobile:before { + content: "\f10b" +} + +.fa-circle-o:before { + content: "\f10c" +} + +.fa-quote-left:before { + content: "\f10d" +} + +.fa-quote-right:before { + content: "\f10e" +} + +.fa-spinner:before { + content: "\f110" +} + +.fa-circle:before { + content: "\f111" +} + +.fa-mail-reply:before, +.fa-reply:before { + content: "\f112" +} + +.fa-github-alt:before { + content: "\f113" +} + +.fa-folder-o:before { + content: "\f114" +} + +.fa-folder-open-o:before { + content: "\f115" +} + +.fa-smile-o:before { + content: "\f118" +} + +.fa-frown-o:before { + content: "\f119" +} + +.fa-meh-o:before { + content: "\f11a" +} + +.fa-gamepad:before { + content: "\f11b" +} + +.fa-keyboard-o:before { + content: "\f11c" +} + +.fa-flag-o:before { + content: "\f11d" +} + +.fa-flag-checkered:before { + content: "\f11e" +} + +.fa-terminal:before { + content: "\f120" +} + +.fa-code:before { + content: "\f121" +} + +.fa-mail-reply-all:before, +.fa-reply-all:before { + content: "\f122" +} + +.fa-star-half-empty:before, +.fa-star-half-full:before, +.fa-star-half-o:before { + content: "\f123" +} + +.fa-location-arrow:before { + content: "\f124" +} + +.fa-crop:before { + content: "\f125" +} + +.fa-code-fork:before { + content: "\f126" +} + +.fa-chain-broken:before, +.fa-unlink:before { + content: "\f127" +} + +.fa-question:before { + content: "\f128" +} + +.fa-info:before { + content: "\f129" +} + +.fa-exclamation:before { + content: "\f12a" +} + +.fa-superscript:before { + content: "\f12b" +} + +.fa-subscript:before { + content: "\f12c" +} + +.fa-eraser:before { + content: "\f12d" +} + +.fa-puzzle-piece:before { + content: "\f12e" +} + +.fa-microphone:before { + content: "\f130" +} + +.fa-microphone-slash:before { + content: "\f131" +} + +.fa-shield:before { + content: "\f132" +} + +.fa-calendar-o:before { + content: "\f133" +} + +.fa-fire-extinguisher:before { + content: "\f134" +} + +.fa-rocket:before { + content: "\f135" +} + +.fa-maxcdn:before { + content: "\f136" +} + +.fa-chevron-circle-left:before { + content: "\f137" +} + +.fa-chevron-circle-right:before { + content: "\f138" +} + +.fa-chevron-circle-up:before { + content: "\f139" +} + +.fa-chevron-circle-down:before { + content: "\f13a" +} + +.fa-html5:before { + content: "\f13b" +} + +.fa-css3:before { + content: "\f13c" +} + +.fa-anchor:before { + content: "\f13d" +} + +.fa-unlock-alt:before { + content: "\f13e" +} + +.fa-bullseye:before { + content: "\f140" +} + +.fa-ellipsis-h:before { + content: "\f141" +} + +.fa-ellipsis-v:before { + content: "\f142" +} + +.fa-rss-square:before { + content: "\f143" +} + +.fa-play-circle:before { + content: "\f144" +} + +.fa-ticket:before { + content: "\f145" +} + +.fa-minus-square:before { + content: "\f146" +} + +.fa-minus-square-o:before { + content: "\f147" +} + +.fa-level-up:before { + content: "\f148" +} + +.fa-level-down:before { + content: "\f149" +} + +.fa-check-square:before { + content: "\f14a" +} + +.fa-pencil-square:before { + content: "\f14b" +} + +.fa-external-link-square:before { + content: "\f14c" +} + +.fa-share-square:before { + content: "\f14d" +} + +.fa-compass:before { + content: "\f14e" +} + +.fa-caret-square-o-down:before, +.fa-toggle-down:before { + content: "\f150" +} + +.fa-caret-square-o-up:before, +.fa-toggle-up:before { + content: "\f151" +} + +.fa-caret-square-o-right:before, +.fa-toggle-right:before { + content: "\f152" +} + +.fa-eur:before, +.fa-euro:before { + content: "\f153" +} + +.fa-gbp:before { + content: "\f154" +} + +.fa-dollar:before, +.fa-usd:before { + content: "\f155" +} + +.fa-inr:before, +.fa-rupee:before { + content: "\f156" +} + +.fa-cny:before, +.fa-jpy:before, +.fa-rmb:before, +.fa-yen:before { + content: "\f157" +} + +.fa-rouble:before, +.fa-rub:before, +.fa-ruble:before { + content: "\f158" +} + +.fa-krw:before, +.fa-won:before { + content: "\f159" +} + +.fa-bitcoin:before, +.fa-btc:before { + content: "\f15a" +} + +.fa-file:before { + content: "\f15b" +} + +.fa-file-text:before { + content: "\f15c" +} + +.fa-sort-alpha-asc:before { + content: "\f15d" +} + +.fa-sort-alpha-desc:before { + content: "\f15e" +} + +.fa-sort-amount-asc:before { + content: "\f160" +} + +.fa-sort-amount-desc:before { + content: "\f161" +} + +.fa-sort-numeric-asc:before { + content: "\f162" +} + +.fa-sort-numeric-desc:before { + content: "\f163" +} + +.fa-thumbs-up:before { + content: "\f164" +} + +.fa-thumbs-down:before { + content: "\f165" +} + +.fa-youtube-square:before { + content: "\f166" +} + +.fa-youtube:before { + content: "\f167" +} + +.fa-xing:before { + content: "\f168" +} + +.fa-xing-square:before { + content: "\f169" +} + +.fa-youtube-play:before { + content: "\f16a" +} + +.fa-dropbox:before { + content: "\f16b" +} + +.fa-stack-overflow:before { + content: "\f16c" +} + +.fa-instagram:before { + content: "\f16d" +} + +.fa-flickr:before { + content: "\f16e" +} + +.fa-adn:before { + content: "\f170" +} + +.fa-bitbucket:before { + content: "\f171" +} + +.fa-bitbucket-square:before { + content: "\f172" +} + +.fa-tumblr:before { + content: "\f173" +} + +.fa-tumblr-square:before { + content: "\f174" +} + +.fa-long-arrow-down:before { + content: "\f175" +} + +.fa-long-arrow-up:before { + content: "\f176" +} + +.fa-long-arrow-left:before { + content: "\f177" +} + +.fa-long-arrow-right:before { + content: "\f178" +} + +.fa-apple:before { + content: "\f179" +} + +.fa-windows:before { + content: "\f17a" +} + +.fa-android:before { + content: "\f17b" +} + +.fa-linux:before { + content: "\f17c" +} + +.fa-dribbble:before { + content: "\f17d" +} + +.fa-skype:before { + content: "\f17e" +} + +.fa-foursquare:before { + content: "\f180" +} + +.fa-trello:before { + content: "\f181" +} + +.fa-female:before { + content: "\f182" +} + +.fa-male:before { + content: "\f183" +} + +.fa-gittip:before, +.fa-gratipay:before { + content: "\f184" +} + +.fa-sun-o:before { + content: "\f185" +} + +.fa-moon-o:before { + content: "\f186" +} + +.fa-archive:before { + content: "\f187" +} + +.fa-bug:before { + content: "\f188" +} + +.fa-vk:before { + content: "\f189" +} + +.fa-weibo:before { + content: "\f18a" +} + +.fa-renren:before { + content: "\f18b" +} + +.fa-pagelines:before { + content: "\f18c" +} + +.fa-stack-exchange:before { + content: "\f18d" +} + +.fa-arrow-circle-o-right:before { + content: "\f18e" +} + +.fa-arrow-circle-o-left:before { + content: "\f190" +} + +.fa-caret-square-o-left:before, +.fa-toggle-left:before { + content: "\f191" +} + +.fa-dot-circle-o:before { + content: "\f192" +} + +.fa-wheelchair:before { + content: "\f193" +} + +.fa-vimeo-square:before { + content: "\f194" +} + +.fa-try:before, +.fa-turkish-lira:before { + content: "\f195" +} + +.fa-plus-square-o:before { + content: "\f196" +} + +.fa-space-shuttle:before { + content: "\f197" +} + +.fa-slack:before { + content: "\f198" +} + +.fa-envelope-square:before { + content: "\f199" +} + +.fa-wordpress:before { + content: "\f19a" +} + +.fa-openid:before { + content: "\f19b" +} + +.fa-bank:before, +.fa-institution:before, +.fa-university:before { + content: "\f19c" +} + +.fa-graduation-cap:before, +.fa-mortar-board:before { + content: "\f19d" +} + +.fa-yahoo:before { + content: "\f19e" +} + +.fa-google:before { + content: "\f1a0" +} + +.fa-reddit:before { + content: "\f1a1" +} + +.fa-reddit-square:before { + content: "\f1a2" +} + +.fa-stumbleupon-circle:before { + content: "\f1a3" +} + +.fa-stumbleupon:before { + content: "\f1a4" +} + +.fa-delicious:before { + content: "\f1a5" +} + +.fa-digg:before { + content: "\f1a6" +} + +.fa-pied-piper:before { + content: "\f1a7" +} + +.fa-pied-piper-alt:before { + content: "\f1a8" +} + +.fa-drupal:before { + content: "\f1a9" +} + +.fa-joomla:before { + content: "\f1aa" +} + +.fa-language:before { + content: "\f1ab" +} + +.fa-fax:before { + content: "\f1ac" +} + +.fa-building:before { + content: "\f1ad" +} + +.fa-child:before { + content: "\f1ae" +} + +.fa-paw:before { + content: "\f1b0" +} + +.fa-spoon:before { + content: "\f1b1" +} + +.fa-cube:before { + content: "\f1b2" +} + +.fa-cubes:before { + content: "\f1b3" +} + +.fa-behance:before { + content: "\f1b4" +} + +.fa-behance-square:before { + content: "\f1b5" +} + +.fa-steam:before { + content: "\f1b6" +} + +.fa-steam-square:before { + content: "\f1b7" +} + +.fa-recycle:before { + content: "\f1b8" +} + +.fa-automobile:before, +.fa-car:before { + content: "\f1b9" +} + +.fa-cab:before, +.fa-taxi:before { + content: "\f1ba" +} + +.fa-tree:before { + content: "\f1bb" +} + +.fa-spotify:before { + content: "\f1bc" +} + +.fa-deviantart:before { + content: "\f1bd" +} + +.fa-soundcloud:before { + content: "\f1be" +} + +.fa-database:before { + content: "\f1c0" +} + +.fa-file-pdf-o:before { + content: "\f1c1" +} + +.fa-file-word-o:before { + content: "\f1c2" +} + +.fa-file-excel-o:before { + content: "\f1c3" +} + +.fa-file-powerpoint-o:before { + content: "\f1c4" +} + +.fa-file-image-o:before, +.fa-file-photo-o:before, +.fa-file-picture-o:before { + content: "\f1c5" +} + +.fa-file-archive-o:before, +.fa-file-zip-o:before { + content: "\f1c6" +} + +.fa-file-audio-o:before, +.fa-file-sound-o:before { + content: "\f1c7" +} + +.fa-file-movie-o:before, +.fa-file-video-o:before { + content: "\f1c8" +} + +.fa-file-code-o:before { + content: "\f1c9" +} + +.fa-vine:before { + content: "\f1ca" +} + +.fa-codepen:before { + content: "\f1cb" +} + +.fa-jsfiddle:before { + content: "\f1cc" +} + +.fa-life-bouy:before, +.fa-life-buoy:before, +.fa-life-ring:before, +.fa-life-saver:before, +.fa-support:before { + content: "\f1cd" +} + +.fa-circle-o-notch:before { + content: "\f1ce" +} + +.fa-ra:before, +.fa-rebel:before { + content: "\f1d0" +} + +.fa-empire:before, +.fa-ge:before { + content: "\f1d1" +} + +.fa-git-square:before { + content: "\f1d2" +} + +.fa-git:before { + content: "\f1d3" +} + +.fa-hacker-news:before, +.fa-y-combinator-square:before, +.fa-yc-square:before { + content: "\f1d4" +} + +.fa-tencent-weibo:before { + content: "\f1d5" +} + +.fa-qq:before { + content: "\f1d6" +} + +.fa-wechat:before, +.fa-weixin:before { + content: "\f1d7" +} + +.fa-paper-plane:before, +.fa-send:before { + content: "\f1d8" +} + +.fa-paper-plane-o:before, +.fa-send-o:before { + content: "\f1d9" +} + +.fa-history:before { + content: "\f1da" +} + +.fa-circle-thin:before { + content: "\f1db" +} + +.fa-header:before { + content: "\f1dc" +} + +.fa-paragraph:before { + content: "\f1dd" +} + +.fa-sliders:before { + content: "\f1de" +} + +.fa-share-alt:before { + content: "\f1e0" +} + +.fa-share-alt-square:before { + content: "\f1e1" +} + +.fa-bomb:before { + content: "\f1e2" +} + +.fa-futbol-o:before, +.fa-soccer-ball-o:before { + content: "\f1e3" +} + +.fa-tty:before { + content: "\f1e4" +} + +.fa-binoculars:before { + content: "\f1e5" +} + +.fa-plug:before { + content: "\f1e6" +} + +.fa-slideshare:before { + content: "\f1e7" +} + +.fa-twitch:before { + content: "\f1e8" +} + +.fa-yelp:before { + content: "\f1e9" +} + +.fa-newspaper-o:before { + content: "\f1ea" +} + +.fa-wifi:before { + content: "\f1eb" +} + +.fa-calculator:before { + content: "\f1ec" +} + +.fa-paypal:before { + content: "\f1ed" +} + +.fa-google-wallet:before { + content: "\f1ee" +} + +.fa-cc-visa:before { + content: "\f1f0" +} + +.fa-cc-mastercard:before { + content: "\f1f1" +} + +.fa-cc-discover:before { + content: "\f1f2" +} + +.fa-cc-amex:before { + content: "\f1f3" +} + +.fa-cc-paypal:before { + content: "\f1f4" +} + +.fa-cc-stripe:before { + content: "\f1f5" +} + +.fa-bell-slash:before { + content: "\f1f6" +} + +.fa-bell-slash-o:before { + content: "\f1f7" +} + +.fa-trash:before { + content: "\f1f8" +} + +.fa-copyright:before { + content: "\f1f9" +} + +.fa-at:before { + content: "\f1fa" +} + +.fa-eyedropper:before { + content: "\f1fb" +} + +.fa-paint-brush:before { + content: "\f1fc" +} + +.fa-birthday-cake:before { + content: "\f1fd" +} + +.fa-area-chart:before { + content: "\f1fe" +} + +.fa-pie-chart:before { + content: "\f200" +} + +.fa-line-chart:before { + content: "\f201" +} + +.fa-lastfm:before { + content: "\f202" +} + +.fa-lastfm-square:before { + content: "\f203" +} + +.fa-toggle-off:before { + content: "\f204" +} + +.fa-toggle-on:before { + content: "\f205" +} + +.fa-bicycle:before { + content: "\f206" +} + +.fa-bus:before { + content: "\f207" +} + +.fa-ioxhost:before { + content: "\f208" +} + +.fa-angellist:before { + content: "\f209" +} + +.fa-cc:before { + content: "\f20a" +} + +.fa-ils:before, +.fa-shekel:before, +.fa-sheqel:before { + content: "\f20b" +} + +.fa-meanpath:before { + content: "\f20c" +} + +.fa-buysellads:before { + content: "\f20d" +} + +.fa-connectdevelop:before { + content: "\f20e" +} + +.fa-dashcube:before { + content: "\f210" +} + +.fa-forumbee:before { + content: "\f211" +} + +.fa-leanpub:before { + content: "\f212" +} + +.fa-sellsy:before { + content: "\f213" +} + +.fa-shirtsinbulk:before { + content: "\f214" +} + +.fa-simplybuilt:before { + content: "\f215" +} + +.fa-skyatlas:before { + content: "\f216" +} + +.fa-cart-plus:before { + content: "\f217" +} + +.fa-cart-arrow-down:before { + content: "\f218" +} + +.fa-diamond:before { + content: "\f219" +} + +.fa-ship:before { + content: "\f21a" +} + +.fa-user-secret:before { + content: "\f21b" +} + +.fa-motorcycle:before { + content: "\f21c" +} + +.fa-street-view:before { + content: "\f21d" +} + +.fa-heartbeat:before { + content: "\f21e" +} + +.fa-venus:before { + content: "\f221" +} + +.fa-mars:before { + content: "\f222" +} + +.fa-mercury:before { + content: "\f223" +} + +.fa-intersex:before, +.fa-transgender:before { + content: "\f224" +} + +.fa-transgender-alt:before { + content: "\f225" +} + +.fa-venus-double:before { + content: "\f226" +} + +.fa-mars-double:before { + content: "\f227" +} + +.fa-venus-mars:before { + content: "\f228" +} + +.fa-mars-stroke:before { + content: "\f229" +} + +.fa-mars-stroke-v:before { + content: "\f22a" +} + +.fa-mars-stroke-h:before { + content: "\f22b" +} + +.fa-neuter:before { + content: "\f22c" +} + +.fa-genderless:before { + content: "\f22d" +} + +.fa-facebook-official:before { + content: "\f230" +} + +.fa-pinterest-p:before { + content: "\f231" +} + +.fa-whatsapp:before { + content: "\f232" +} + +.fa-server:before { + content: "\f233" +} + +.fa-user-plus:before { + content: "\f234" +} + +.fa-user-times:before { + content: "\f235" +} + +.fa-bed:before, +.fa-hotel:before { + content: "\f236" +} + +.fa-viacoin:before { + content: "\f237" +} + +.fa-train:before { + content: "\f238" +} + +.fa-subway:before { + content: "\f239" +} + +.fa-medium:before { + content: "\f23a" +} + +.fa-y-combinator:before, +.fa-yc:before { + content: "\f23b" +} + +.fa-optin-monster:before { + content: "\f23c" +} + +.fa-opencart:before { + content: "\f23d" +} + +.fa-expeditedssl:before { + content: "\f23e" +} + +.fa-battery-4:before, +.fa-battery-full:before { + content: "\f240" +} + +.fa-battery-3:before, +.fa-battery-three-quarters:before { + content: "\f241" +} + +.fa-battery-2:before, +.fa-battery-half:before { + content: "\f242" +} + +.fa-battery-1:before, +.fa-battery-quarter:before { + content: "\f243" +} + +.fa-battery-0:before, +.fa-battery-empty:before { + content: "\f244" +} + +.fa-mouse-pointer:before { + content: "\f245" +} + +.fa-i-cursor:before { + content: "\f246" +} + +.fa-object-group:before { + content: "\f247" +} + +.fa-object-ungroup:before { + content: "\f248" +} + +.fa-sticky-note:before { + content: "\f249" +} + +.fa-sticky-note-o:before { + content: "\f24a" +} + +.fa-cc-jcb:before { + content: "\f24b" +} + +.fa-cc-diners-club:before { + content: "\f24c" +} + +.fa-clone:before { + content: "\f24d" +} + +.fa-balance-scale:before { + content: "\f24e" +} + +.fa-hourglass-o:before { + content: "\f250" +} + +.fa-hourglass-1:before, +.fa-hourglass-start:before { + content: "\f251" +} + +.fa-hourglass-2:before, +.fa-hourglass-half:before { + content: "\f252" +} + +.fa-hourglass-3:before, +.fa-hourglass-end:before { + content: "\f253" +} + +.fa-hourglass:before { + content: "\f254" +} + +.fa-hand-grab-o:before, +.fa-hand-rock-o:before { + content: "\f255" +} + +.fa-hand-paper-o:before, +.fa-hand-stop-o:before { + content: "\f256" +} + +.fa-hand-scissors-o:before { + content: "\f257" +} + +.fa-hand-lizard-o:before { + content: "\f258" +} + +.fa-hand-spock-o:before { + content: "\f259" +} + +.fa-hand-pointer-o:before { + content: "\f25a" +} + +.fa-hand-peace-o:before { + content: "\f25b" +} + +.fa-trademark:before { + content: "\f25c" +} + +.fa-registered:before { + content: "\f25d" +} + +.fa-creative-commons:before { + content: "\f25e" +} + +.fa-gg:before { + content: "\f260" +} + +.fa-gg-circle:before { + content: "\f261" +} + +.fa-tripadvisor:before { + content: "\f262" +} + +.fa-odnoklassniki:before { + content: "\f263" +} + +.fa-odnoklassniki-square:before { + content: "\f264" +} + +.fa-get-pocket:before { + content: "\f265" +} + +.fa-wikipedia-w:before { + content: "\f266" +} + +.fa-safari:before { + content: "\f267" +} + +.fa-chrome:before { + content: "\f268" +} + +.fa-firefox:before { + content: "\f269" +} + +.fa-opera:before { + content: "\f26a" +} + +.fa-internet-explorer:before { + content: "\f26b" +} + +.fa-television:before, +.fa-tv:before { + content: "\f26c" +} + +.fa-contao:before { + content: "\f26d" +} + +.fa-500px:before { + content: "\f26e" +} + +.fa-amazon:before { + content: "\f270" +} + +.fa-calendar-plus-o:before { + content: "\f271" +} + +.fa-calendar-minus-o:before { + content: "\f272" +} + +.fa-calendar-times-o:before { + content: "\f273" +} + +.fa-calendar-check-o:before { + content: "\f274" +} + +.fa-industry:before { + content: "\f275" +} + +.fa-map-pin:before { + content: "\f276" +} + +.fa-map-signs:before { + content: "\f277" +} + +.fa-map-o:before { + content: "\f278" +} + +.fa-map:before { + content: "\f279" +} + +.fa-commenting:before { + content: "\f27a" +} + +.fa-commenting-o:before { + content: "\f27b" +} + +.fa-houzz:before { + content: "\f27c" +} + +.fa-vimeo:before { + content: "\f27d" +} + +.fa-black-tie:before { + content: "\f27e" +} + +.fa-fonticons:before { + content: "\f280" +} + +/*.jqibox {display: none} hidden just for debugging - remove this line after! */ + +.jqifade { + position: absolute; + background-color: #000 +} + +div.jqi, +div.jqi .jqistate { + background-color: #fff +} + +div.jqi { + width: 400px; + position: absolute; + font-size: 11px; + text-align: left; + border: 1px solid #eee; + border-radius: 6px; + -moz-border-radius: 6px; + -webkit-border-radius: 6px; + padding: 7px +} + +div.jqi .jqiclose { + position: absolute; + top: 4px; + right: -2px; + width: 18px; + cursor: default; + color: #bbb; + font-weight: 700 +} + +div.jqi .jqititle { + padding: 5px 10px; + font-size: 16px; + line-height: 20px; + border-bottom: solid 1px #eee +} + +div.jqi .jqimessage { + padding: 10px; + line-height: 20px; + color: #444 +} + +div.jqi .jqibuttons { + text-align: right; + margin: 0 -7px -7px; + border-top: solid 1px #e4e4e4; + background-color: #f4f4f4; + border-radius: 0 0 6px 6px; + -moz-border-radius: 0 0 6px 6px; + -webkit-border-radius: 0 0 6px 6px +} + +div.jqi .jqibuttons button { + margin: 0; + padding: 5px 20px; + background-color: transparent; + border: none; + border-left: solid 1px #e4e4e4; + color: #777; + font-weight: 700; + font-size: 12px +} + +div.jqi .jqibuttons button.jqidefaultbutton { + color: #489afe +} + +div.jqi .jqibuttons button:disabled { + color: #b6b6b6!important +} + +div.jqi .jqibuttons button:focus, +div.jqi .jqibuttons button:hover { + color: #287ade; + outline: 0 +} + +.jqiwarning .jqi .jqibuttons { + background-color: #b95656 +} + +div.jqi .jqiparentstate::after { + background-color: #777; + opacity: .6; + filter: alpha(opacity=60); + content: ''; + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + border-radius: 6px; + -moz-border-radius: 6px; + -webkit-border-radius: 6px +} + +.jqi .jqiarrowbr, +.jqi .jqiarrowtr { + right: 10px +} + +div.jqi .jqisubstate { + position: absolute; + top: 0; + left: 20%; + width: 60%; + padding: 7px; + border: 1px solid #eee; + border-top: none; + border-radius: 0 0 6px 6px; + -moz-border-radius: 0 0 6px 6px; + -webkit-border-radius: 0 0 6px 6px +} + +div.jqi .jqisubstate .jqibuttons button { + padding: 10px 18px +} + +.jqi .jqiarrow { + position: absolute; + height: 0; + width: 0; + line-height: 0; + font-size: 0; + border: 10px solid transparent +} + +.jqi .jqiarrowtc, +.jqi .jqiarrowtl, +.jqi .jqiarrowtr { + top: -20px; + border-bottom-color: #fff +} + +.jqi .jqiarrowbc, +.jqi .jqiarrowbl, +.jqi .jqiarrowbr { + bottom: -20px; + border-top-color: #fff +} + +.jqi .jqiarrowtl { + left: 10px +} + +.jqi .jqiarrowtc { + left: 50%; + margin-left: -10px +} + +.jqi .jqiarrowbl { + left: 10px +} + +.jqi .jqiarrowbc { + left: 50%; + margin-left: -10px +} + +.jqi .jqiarrowlb, +.jqi .jqiarrowlm, +.jqi .jqiarrowlt { + left: -20px; + border-right-color: #fff +} + +.jqi .jqiarrowrb, +.jqi .jqiarrowrm, +.jqi .jqiarrowrt { + right: -20px; + border-left-color: #fff +} + +.jqi .jqiarrowlt { + top: 10px +} + +.jqi .jqiarrowlm { + top: 50%; + margin-top: -10px +} + +.jqi .jqiarrowlb { + bottom: 10px +} + +.jqi .jqiarrowrt { + top: 10px +} + +.jqi .jqiarrowrm { + top: 50%; + margin-top: -10px +} + +.jqi .jqiarrowrb { + bottom: 10px +} + +.jqistates { + font-size: 14px +} + +.jqistates h2 { + padding-bottom: 10px; + border-bottom: 1px solid #eee; + font-size: 18px; + line-height: 25px; + text-align: center; + color: #424242 +} + +.jqistates input { + margin: 10px 0 +} + +.jqistates input[type=text], +input[type=password] { + width: 100% +} + +.jqibuttons button { + margin-right: 5px; + float: right +} + +button.jqidefaultbutton #inviteLinkRef { + color: #2c8ad2 +} + +#inviteLinkRef { + -webkit-user-select: text; + user-select: text +} + +#notice { + position: relative; + z-index: 3; + margin-top: 6px +} + +#noticeText { + background-color: #000; + color: #fff; + padding: 3px; + border-radius: 5px +} + +ul.popupmenu { + display: none; + position: absolute; + padding: 10px; + margin: 0 0 35px; + bottom: 0; + right: 10px; + left: -5px; + width: 100px; + background-color: rgba(0, 0, 0, .9); + border: 1px solid rgba(256, 256, 256, .2); + border-radius: 8px +} + +ul.popupmenu:after { + content: url(../images/popupPointer.png); + display: block; + position: absolute; + bottom: -8px; + left: 11px +} + +ul.popupmenu li { + text-align: left +} + +ul.popupmenu li:hover { + background-color: rgba(256, 256, 256, .2); + border-radius: 6px +} + +ul.popupmenu li a { + text-decoration: none; + color: #fff; + padding: 5px; + display: inline-block; + font-size: 9pt +} + +ul.popupmenu li a i.icon-kick { + font-size: 8pt +} + +ul.popupmenu li a span { + display: inline-block; + width: 20px; + height: 16px; + text-align: center +} + +span.remotevideomenu:hover ul.popupmenu, +ul.popupmenu:hover { + display: block!important +} + +.popupmenuPadding { + height: 35px; + width: 100px; + position: absolute; + bottom: -35; + left: 0 +} + +ul.loginmenu { + display: none; + position: absolute; + margin: 0; + padding: 5px 5px 7px; + top: 45px; + left: -5px; + background-color: rgba(0, 0, 0, .9); + border: 1px solid rgba(256, 256, 256, .2); + border-radius: 8px +} + +ul.loginmenu li { + padding: 7px +} + +ul.loginmenu li.identity { + color: #fff; + font-size: 11pt; + cursor: default +} + +ul.loginmenu:after { + content: url(../images/dropdownPointer.png); + display: block; + position: absolute; + top: -7px; + left: 18px +} + +li a.authButton { + background-color: #06a5df; + border-radius: 4px; + color: #fff; + font-size: 11pt; + cursor: pointer; + padding: 3px 29px +} + +span.authentication:hover ul.loginmenu, +ul.loginmenu:hover { + display: block!important +} + +a.disabled { + color: gray!important; + pointer-events: none +} + +.jitsipopover, +.popover { + max-width: 300px; + color: #333; + background-clip: padding-box; + position: absolute +} + +.loginmenuPadding { + width: 50px; + height: 30px; + position: absolute; + top: -30px; + left: 0 +} + +.popover { + top: 0; + left: 0; + z-index: 1010; + display: none; + min-width: 100px; + padding: 1px; + text-align: left; + background-color: #fff; + border: 1px solid #ccc; + border: 1px solid rgba(0, 0, 0, .2); + border-radius: 6px; + -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2); + box-shadow: 0 5px 10px rgba(0, 0, 0, .4); + white-space: normal +} + +.popover.top { + margin-top: -10px +} + +.popover.right { + margin-left: 10px +} + +.popover.bottom { + margin-top: 10px +} + +.popover.left { + margin-left: -10px +} + +.popover-title { + margin: 0; + padding: 8px 14px; + font-size: 11pt; + font-weight: 400; + line-height: 18px; + background-color: #f7f7f7; + border-bottom: 1px solid #ebebeb; + border-radius: 5px 5px 0 0 +} + +.popover-content { + padding: 9px 14px; + font-size: 10pt; + white-space: pre-wrap; + text-align: center +} + +.popover>.arrow, +.popover>.arrow:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid +} + +.popover>.arrow { + border-width: 11px +} + +.popover>.arrow:after { + border-width: 10px; + content: "" +} + +.popover.top>.arrow { + left: 50%; + margin-left: -11px; + border-bottom-width: 0; + border-top-color: #999; + border-top-color: rgba(0, 0, 0, .25); + bottom: -11px +} + +.popover.top>.arrow:after { + content: " "; + bottom: 1px; + margin-left: -10px; + border-bottom-width: 0; + border-top-color: #fff +} + +.popover.left>.arrow:after, +.popover.right>.arrow:after { + bottom: -10px; + content: " " +} + +.popover.right>.arrow { + top: 50%; + left: -11px; + margin-top: -11px; + border-left-width: 0; + border-right-color: #999; + border-right-color: rgba(0, 0, 0, .25) +} + +.popover.right>.arrow:after { + left: 1px; + border-left-width: 0; + border-right-color: #fff +} + +.popover.bottom>.arrow { + left: 50%; + margin-left: -11px; + border-top-width: 0; + border-bottom-color: #999; + border-bottom-color: rgba(0, 0, 0, .25); + top: -11px +} + +.popover.bottom>.arrow:after { + content: " "; + top: 1px; + margin-left: -10px; + border-top-width: 0; + border-bottom-color: #fff +} + +.popover.left>.arrow { + top: 50%; + right: -11px; + margin-top: -11px; + border-right-width: 0; + border-left-color: #999; + border-left-color: rgba(0, 0, 0, .25) +} + +.popover.left>.arrow:after { + right: 1px; + border-right-width: 0; + border-left-color: #fff +} + +.jitsipopover { + top: 0; + left: 0; + z-index: 1010; + display: none; + min-width: 100px; + padding: 1px; + text-align: left; + background-color: #fff; + border: 1px solid #ccc; + border: 1px solid rgba(0, 0, 0, .2); + border-radius: 6px; + white-space: normal; + margin-top: -10px; + margin-bottom: 35px +} + +.jitsipopover.black { + background-color: rgba(0, 0, 0, .8); + color: #fff +} + +.jitsipopover-content { + padding: 9px 14px; + font-size: 10pt; + white-space: pre-wrap; + text-align: center +} + +.jitsipopover>.arrow, +.jitsipopover>.arrow:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid +} + +.jitsipopover>.arrow { + border-width: 11px 11px 0; + left: 50%; + margin-left: -11px; + border-top-color: #999; + border-top-color: rgba(0, 0, 0, .25); + bottom: -11px +} + +.jitsipopover>.arrow:after { + border-width: 10px 10px 0; + content: " "; + bottom: 1px; + margin-left: -10px; + border-top-color: #fff +} + +.jitsipopover.black>.arrow:after { + border-top-color: rgba(0, 0, 0, .8) +} + +.jitsiPopupmenuPadding { + height: 35px; + width: 100px; + position: absolute; + bottom: -35 +} + +.jitsipopover_green { + color: #4abd04 +} + +.jitsipopover_orange { + color: #ffa800 +} + +.jitsipopover_blue { + color: #06a5df +} + +.jitsipopover_showmore { + background-color: #06a5df; + color: #fff; + cursor: pointer; + border-radius: 3px; + text-align: center; + width: 90px; + height: 16px; + padding-top: 4px; + padding-left: 10px; + padding-right: 10px; + margin: 15px auto 0 +} + +#chatconversation, +#contactlist>ul#contacts { + width: 100%; + overflow-y: scroll; + overflow-x: hidden +} + +#contactlist { + background-color: #000; + cursor: default +} + +#contactlist>div.title { + text-align: left; + padding: 7px 10px; + margin: 2px; + color: #0cf; + font-size: 11pt; + border-bottom: 1px solid #676767 +} + +#contactlist>ul#contacts { + position: absolute; + top: 31px; + bottom: 0; + margin: 0; + padding: 0 +} + +#contacts>li { + text-align: left; + color: #FFF; + font-size: 10pt; + padding: 7px 10px; + margin: 2px +} + +#header_text, +#nickname, +#reload_roomname, +.feature_icon, +.feedback { + text-align: center +} + +#contacts>li>p { + display: inline-block; + margin: 0 +} + +.avatar { + padding: 0; + margin-right: 10px; + font-size: 22pt; + border-radius: 20px; + max-height: 30px; + max-width: 30px +} + +#smileysarea, +#usermsg { + bottom: 0; + max-height: 150px; + min-height: 35px; + overflow: hidden; + visibility: hidden; + position: absolute +} + +#contactlist .clickable { + cursor: pointer +} + +#chatspace { + background-color: #000; + border-left: 1px solid #424242 +} + +#chatspace * { + -webkit-user-select: text; + user-select: text +} + +#chatconversation { + visibility: hidden; + position: relative; + top: 5px; + padding: 5px; + text-align: left; + line-height: 20px; + font-size: 10pt; + height: 90%; + word-wrap: break-word +} + +.localuser { + color: #087dba +} + +.errorMessage { + color: red +} + +.remoteuser { + color: #fff +} + +#usermsg { + right: 0; + width: 83%; + height: 30px; + padding: 5px 5px 5px 0; + border: 0; + background: #3a3a3a; + color: #a7a7a7; + box-shadow: none; + border-radius: 0; + font-size: 10pt; + line-height: 30px; + resize: none +} + +#usermsg:hover { + border: 0; + box-shadow: none +} + +#nickname { + position: absolute; + color: #9d9d9d; + font-size: 18px; + top: 100px; + left: 5px; + right: 5px; + width: 95% +} + +#nickinput, +.chatmessage { + color: #a7a7a7; + background: #3a3a3a +} + +#unreadMessages { + font-size: 8px; + position: absolute; + left: 46%; + top: 27% +} + +#numberOfParticipants, +#bottomUnreadMessages { + bottom: 2px; + right: 2px; + top: auto; + position: absolute; + font-size: 8px +} + +#chatspace .username { + float: left; + padding-left: 5px; + font-weight: 700 +} + +#chatspace .timestamp { + float: right; + padding-right: 5px; + font-size: 11px +} + +#chatspace .usermessage { + padding-top: 20px; + padding-left: 5px +} + +.chatArrow { + position: absolute; + height: 15px; + left: 5px +} + +#smileys, +.smiley { + height: 26px +} + +.chatmessage { + width: 93%; + margin-left: 5%; + margin-right: auto; + border-radius: 0 5px 5px; + margin-top: 3px; + left: 5px; + overflow: hidden; + padding-bottom: 3px +} + +#smileys { + position: absolute; + bottom: 7px; + right: 5px; + background: #fff; + border-radius: 50px; + margin: auto; + cursor: pointer +} + +#smileys img { + width: 22px; + padding: 2px +} + +#smileysarea { + left: 0; + width: 17%; + min-width: 31px; + height: 40px; + padding: 0; + border: 0; + background: #3a3a3a +} + +#smileysContainer { + display: none; + position: absolute; + background: #3a3a3a; + border-bottom: 1px solid; + border-top: 1px solid; + width: 100%; + bottom: 10% +} + +#smileysContainer .smiley { + padding: 7px +} + +.smileyContainer { + width: 40px; + height: 40px; + display: inline-block +} + +.smileyContainer:hover { + background: #3e3e3e +} + +#enter_room_field, +#enter_room_form { + -webkit-appearance: none; + background-color: #FFF; + box-shadow: none +} + +#usermsg::-webkit-input-placeholder { + line-height: 30px +} + +::-webkit-scrollbar { + background: #06a5df; + width: 7px +} + +::-webkit-scrollbar-button { + display: none +} + +::-webkit-scrollbar-track { + background: #000 +} + +::-webkit-scrollbar-track-piece { + background: #000 +} + +::-webkit-scrollbar-thumb { + background: #06a5df; + border-radius: 4px +} + +#usermsg::-webkit-scrollbar-track-piece { + background: #3a3a3a +} + +a:link { + color: #b8b8b8 +} + +a:visited { + color: #fff +} + +a:hover { + color: #d5d5d5 +} + +a:active { + color: #000 +} + +#disable_welcome+label, +#disable_welcome:checked+label { + -webkit-user-select: none; + -moz-user-select: none; + font-family: Helvetica; + font-size: 16px; + color: #acacac; + font-weight: 500; + z-index: 2; + background-repeat: no-repeat +} + +#disable_welcome { + display: none +} + +.disable_welcome_position { + margin: auto; + padding-left: 39px; + padding-top: 7px; + width: 269px; + height: 31px; + display: block +} + +#disable_welcome+label { + background-image: url(../images/welcome_page/disable-welcome.png); + cursor: pointer +} + +#disable_welcome:checked+label { + background-image: url(../images/welcome_page/disable-welcome-selected.png); + cursor: pointer +} + +#enter_room_button, +#header_text { + color: #fff; + font-family: Helvetica +} + +#enter_room_form { + border-radius: 10px; + border: none; + -moz-border-radius: 10px; + -webkit-border-radius: 10px +} + +#domain_name { + float: left; + font-size: 18px; + font-weight: 500; + font-family: Helvetica; + padding-top: .74em +} + +#enter_room_field { + font-size: 15px; + border: none; + width: 228px; + font-weight: 500; + font-family: Helvetica; + float: left; + position: relative; + z-index: 2 +} + +#enter_room_button { + width: 73px; + height: 45px; + background-color: #16a8fe; + moz-border-radius: 10px; + -webkit-border-radius: 10px; + font-weight: 600; + border: none; + margin-top: 5px; + font-size: 19px; + padding-top: 6px; + outline: 0; + float: left; + position: relative; + z-index: 2 +} + +#enter_room_container { + margin: 96px auto 15px; + display: table +} + +#enter_room { + padding: 5px +} + +#welcome_page_header { + background-image: url(../images/welcome_page/pattern-header.png); + height: 290px; + width: 100%; + position: absolute +} + +#welcome_page_main * { + max-width: 100% +} + +#welcome_page_main { + background-image: url(../images/welcome_page/pattern-body.png); + width: 100%; + position: absolute; + margin-top: 290px +} + +#brand_header { + background-image: url(../images/welcome_page/header-big.png); + width: 583px; + height: 274px; + margin: -110px auto 0 +} + +#header_text { + width: 885px; + height: 100px; + font-size: 24px; + margin: 0 auto +} + +#features { + margin-top: 30px; + position: relative +} + +.feature_row { + position: relative; + width: 976px; + margin: auto +} + +.feature.holder { + margin-bottom: 30px +} + +.feature_description, +.feature_icon { + font-family: Helvetica; + color: #fff; + margin: auto +} + +.feature_icon { + background-image: url(../images/welcome_page/bubble.png); + background-repeat: no-repeat; + background-position: center; + width: 169px; + height: 169px; + font-size: 22px; + display: block; + padding: 50px 26px 0 20px +} + +.feature_description { + width: 190px; + font-size: 16px; + padding-top: 30px; + line-height: 22px; + font-weight: 200 +} + +#reload_roomname { + width: 30px; + color: #acacac; + z-index: 3; + cursor: pointer; + display: none +} + +#settingsmenu .arrow-up, +.feedback { + margin-left: auto; + margin-right: auto +} + +#settingsmenu .arrow-up { + width: 0; + height: 0; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-bottom: 5px solid #fff; + position: relative; + top: 1px +} + +#settingsmenu button { + width: 45%; + left: 26%; + padding: 0; + margin-top: 10px +} + +#settingsmenu #avatar { + width: 24%; + left: 38%; + border-radius: 25px; + position: relative +} + +.panel-title > span { + padding: 0 1em +} + +#languages_selectbox { + height: 40px +} + +#startAudioMuted, +#startVideoMuted { + width: 13px!important +} + +.startMutedLabel { + width: 94%; + float: left +} + +.feedback { + width: 450px; + display: block; + font-size: 22px +} + +.feedbackTitle { + font-size: 22px; + color: #087dba +} + +#stars { + font-size: 30px +} + +#stars>a { + padding-right: 4px +} + +.starHover { + color: #087dba +} + +.feedbackDetails textarea { + resize: vertical; + min-height: 100px +} + + +.btn a:hover, .btn a:focus { +text-decoration: none; +} + diff --git a/indexb.html b/indexb.html index 442b42433..e56daeaed 100644 --- a/indexb.html +++ b/indexb.html @@ -12,8 +12,9 @@ - - + + + @@ -49,7 +50,7 @@