@font-face{font-family:wf_SegoeUI;src:url(/fonts/segoe/latest.eot?#iefix) format('embedded-opentype'),url(/fonts/segoe/latest.woff) format('woff'),url(/fonts/segoe/latest.ttf) format('truetype'),local('Segoe UI'),local('Segoe'),local('Segoe WP'),url(/fonts/segoe/latest.svg#web) format('svg');font-weight:400;font-style:normal}@font-face{font-family:'Tulpen One';font-style:normal;font-weight:400;src:local('Tulpen One'),local('TulpenOne-Regular'),url(dFa6ZfeC474skLgesc0Cajo6_Q.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:normal;font-weight:300;src:local('Roboto Light'),local('Roboto-Light'),url(KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}body{background:#fff;font:14px wf_SegoeUI,"Segoe UI",Segoe,"Segoe WP","Lucida Grande","Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.5;text-align:left;margin:0;width:100%;clear:both;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;overflow:hidden}.no-flick{transform:translate3d(0,0,0)}.centered-text{text-align:center}.clear{clear:both}.underline{text-decoration:underline}.untouchable{touch-action:none}a{color:#0596d4}a:focus,a:hover{color:#0596d4}button:focus{outline:0!important}.btn{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border:0;color:#fff;background-color:#a0a0a0;font-size:15px}.btn:hover{background-color:#bbb;color:#fff}.btn:focus{background-color:#0596d4;color:#fff;outline:0}.left-el{float:left}.right-el{float:right}.left-aligned{text-align:left}.verticalhelper{display:inline-block;height:100%;vertical-align:middle}.btn-toolbar{position:relative;height:32px;min-width:32px;border-radius:5px;background-color:#656565}.btn-toolbar:focus{background-color:#333;color:#fff;outline:0}.btn-toolbar[disabled]{background-color:transparent}.btn-toolbar[disabled]:active,.btn-toolbar[disabled]:hover{background-color:transparent;color:#fff}.btn-down{background-color:#0596d4;color:#fff}.btn-up:hover{background-color:#0596d4;color:#fff}.btn-down:focus{background-color:#0596d4;color:#fff;outline:0}.dropdown-toggle.btn-default:hover{background-color:#0596d4;color:#fff}.dropdown-toggle.btn-default:focus{background-color:#333}.open .dropdown-toggle.btn-default{background-color:#0596d4;color:#fff}.dropdown-menu{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;background:#cfcfcf;min-width:0}.dropdown-menu li a{padding-left:10px;color:#333}.dropdown-menu li a:hover{background-color:#0596d4;color:#fff}.dropdown-menu li a[disabled]:hover{background-color:transparent!important;color:#333!important;cursor:not-allowed}.dropdown-menu img{vertical-align:top;margin-top:2px}.dropdown-menu u{margin-left:8px;text-decoration:none}.form-control{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0}.foreground-panel{z-index:2;background-color:#e5e5e5;border-radius:5px;overflow:hidden;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1)}.login-background{position:absolute;margin:0;width:100%;height:100%;background:#e5e5e5}.login-form{position:absolute;top:50%;left:50%;width:350px;padding:34px 24px 24px 24px;transform:translate(-50%,-50%);color:#333;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1);background-color:#fff;border-radius:10px;display:flex;flex-direction:column}.login-banner{height:72px;background-repeat:no-repeat;background-position:center;background-image:url(../img/white/logo_login.png)}.login-welcome{text-align:center;color:#000;margin-bottom:30px}.login-button{margin-top:20px;border-radius:5px;width:100%;height:50px;font-size:18px}.login-status{overflow:auto;font-size:12px;background-color:#d20e0e;height:32px;display:flex;justify-content:center;align-items:center}.login-android-text{font-size:12px;display:flex;flex-flow:column;text-align:center}.login-text{overflow:auto;font-size:12px}.login-browser{display:grid;grid-template-columns:32px 1fr 32px 1fr;grid-template-rows:minmax(0,1fr);column-gap:5px;align-items:center}.login-browser-icon{width:32px;height:32px}.login-privacy{margin-top:20px}.login-apple-section{display:flex;flex-direction:column;margin-bottom:30px}.login-apple-title{color:#0596d4}.btn-square{background-color:#0596d4;color:#fff}.meeting-container{padding:3px}.meeting-bar{position:absolute;left:0;right:0;margin:0 auto;width:532px;height:48px;background-color:#fff;border-radius:6px;z-index:20;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1)}.nav-bar-show{top:3px}.nav-bar-hide{top:-51px}.meeting-logo{display:inline;float:left;background-image:url(../img/white/3cx_logo.png);background-repeat:no-repeat;background-position:center;background-size:contain;width:90px;height:34px;margin-top:7px;margin-left:5px;cursor:pointer}.customer-logo{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto}.meeting-bar-button{position:relative;float:left;height:48px;width:48px;background-color:transparent;border-radius:5px;border:0;padding:0;cursor:pointer;justify-content:center}.icon-centered{position:absolute;left:0;top:0;right:0;bottom:0;margin:auto}.icon-clickable{cursor:pointer!important}.meeting-bar-spacer{display:inline;float:left;height:48px;width:5px;border-radius:5px;border:0;padding:0}.meeting-bar-logout-button{background-color:red}.toolbar{height:34px;margin-top:16px}.toolbar-left{margin-left:10px;position:absolute;left:0}.toolbar-right{margin-right:10px;position:absolute;right:0}.toolbar-left-el{display:inline;float:left;margin-right:10px}.toolbar-right-el{display:inline;float:right;margin-left:10px}.btn-stop-sharing{background-color:#0596d4;color:#fff;margin-right:5px}.sharing-content{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-10}.column-container{padding:3px}.column-content{background-color:rgba(127,127,127,.4);border-radius:5px}.overlay-column{background-color:#fff;border:0;box-shadow:none}.column-handle-bar{position:absolute;bottom:0;left:0;right:0;height:16px}.column-handle{position:absolute;top:0;bottom:0;margin:auto;left:-2px;z-index:20;width:11px;height:24px;background:top left no-repeat;cursor:pointer}.column-handle-right{background-image:url(../img/white/arrowright.png)}.column-handle-left{background-image:url(../img/white/arrowleft.png);left:-11px}.column-bar{position:absolute;top:0;left:0;right:0;height:48px;border-radius:5px;display:flex;justify-content:space-between;text-align:center}.column-top{position:absolute;padding:0;left:0;top:0;right:0;height:40%;border-radius:5px 5px 0 0}.column-header{height:48px;padding:0;padding-left:4px;font-size:14px;border-radius:5px 5px 0 0}.column-title{float:left;color:#000;font-weight:700}.attendee-container{position:absolute;padding:0;left:8px;top:48px;right:8px;bottom:16px;color:#000;border-radius:5px;background-color:#e5e5e5}.attendee-meeting-add{float:left;font-size:11px;padding-left:3px;padding-top:2px}.attendee-meeting-add a{color:#0596d4;font-weight:700}.attendee-counter{font-size:14px;padding-top:0;float:left;margin-left:2px;font-weight:700}.attendee-duration{font-size:12px;padding-top:0;float:right;font-weight:400;margin-right:6px;padding-top:2px}.attendee-meeting-info{float:right;font-size:11px;padding-right:4px;padding-top:3px}.attendee-meeting-info a{color:#0596d4}.attendee-search-container{position:absolute;top:24px;height:24px;left:0;right:0}.attendee-search-container ::-webkit-input-placeholder{color:#000;opacity:.4}.attendee-search-container ::-moz-placeholder{color:#000;opacity:.4}.attendee-search{background-color:#fff;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1);border-radius:4px;height:24px;position:absolute;left:5px;right:5px}.attendee-search-text{border-style:none;border-width:0;width:190px;background-color:transparent;padding-left:3px;font-size:12px}.attendee-search-text textarea:focus,input:focus{outline:0}.search-clear-button{float:right;height:16px;width:16px;padding:0;cursor:pointer;background-color:Transparent;background-repeat:no-repeat;border:none;margin-top:4px}.attendee-scroll-container{overflow:hidden;position:absolute;left:5px;top:54px;bottom:5px;right:5px;border-radius:5px;min-height:20px}.attendee-scroll{overflow:auto;position:absolute;left:0;top:0;right:0;bottom:0}.attendee-grid{table-layout:fixed;color:#fff;border-collapse:collapse;width:100%;font-size:12px}.attendee-grid-row{width:100%;height:50px;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1);border-radius:2px;background-color:#fff;margin-bottom:3px;display:grid;grid-template-columns:minmax(0,1fr) min-content}.attendee-name{padding-left:5px;padding-right:10px;padding-bottom:0}.attendee-name-text-container{color:#000;font-size:13px;font-weight:700;padding-left:5px;display:flex;align-items:center}.attendee-property-container{width:175px;display:flex;align-items:center}.grow:hover{cursor:pointer;background-color:#f1f8fb}.grow:focus{cursor:pointer;background-color:#f1f8fb}.attendee-property{width:20px;position:relative}.attendee-button{background-color:#0596d4;color:#fff;outline:0;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border:0;float:right;margin-right:5px}.attendee-button:hover{background-color:#007baf}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#77787c}::-webkit-scrollbar-thumb:hover{background:#bbb}@keyframes rc-beat{to{transform:scale(1.1) perspective(1px)}}.attendee-remotecontrol-container{position:relative;height:27px;width:27px;border-radius:50%;background-color:#0596d4;transform-origin:center;cursor:pointer}.attendee-remotecontrol-container:hover{background-color:#0078ab}.chat-panel{position:absolute;left:8px;right:8px;top:40%;bottom:5px;background-color:#e5e5e5;border-radius:5px}.chat-content{position:absolute;padding:0;padding-bottom:10px;margin:0;left:5px;top:24px;right:5px;bottom:120px;color:#333;background-color:#fff;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1);overflow:auto;border-radius:5px 5px 5px 5px;min-height:20px}.chat-content p{padding:0;line-height:90%;margin:0}.chat-item-from{font-size:13px;font-weight:700;float:left;color:#333;margin-top:0}.cursor-hover{cursor:pointer}.chat-item-time{font-size:10px;float:right;color:#333;margin-top:2px;margin-right:2px}.chat-item-chat{margin:0 5px 0 5px}.chat-text{font-style:normal;font-size:12px;vertical-align:middle;word-wrap:break-word}.chat-item-feedback{margin:0 5px 0 5px}.chat-message{position:absolute;left:5px;right:5px;bottom:54px;height:60px;margin:0;padding:0;box-shadow:0 2px 2px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.1)}.chat-message textarea{resize:none;width:100%;height:100%;margin:0;padding:5px;border-radius:5px;border-style:none}.chat-message textarea:focus{outline:0}.chat-bar{position:absolute;left:0;right:0;bottom:0;height:48px;margin:0;padding:0;border-radius:5px}.chat-bar-button{position:relative;height:48px;width:48px;background-color:transparent;border:0;padding:0;cursor:pointer;border-radius:5px}.chat-popover{background-color:#454d67;color:#fff;border-color:#0596d4;border-width:1px;border-radius:0;margin-left:-33px!important;font-size:12px}.chat-popover .popover-content{padding-left:6px;padding-right:0}.chat-popover-container{width:240px}.chat-popover-top{height:36px}.chat-popover-bottom{height:16px}.chat-popover-left{float:left}.chat-popover-right{float:right;margin-top:-3px}.chat-popover-name{overflow:hidden;white-space:nowrap;width:140px}.chat-popover-role{float:left;padding-top:3px;padding-bottom:1px;padding-left:8px;padding-right:4px;font-size:11px;font-weight:700;font-family:Ebrima;text-align:left;background-color:#286bb2;width:140px}.chat-popover-kick{margin-left:6px;float:left;height:20px;padding-top:1px;padding-bottom:1px;padding-left:8px;padding-right:4px;font-size:11px;font-weight:700;font-family:Ebrima;background-color:red;width:90px}.chat-popover-caret{width:16px;height:16px;float:right;background-repeat:no-repeat;background-position:center;background-size:contain;background-image:url(../img/white/caret.png)}.chat-popover-role .caret{float:right;margin-top:8px}.chat-popover-icon{width:42px;height:32px;background-repeat:no-repeat;background-position:center;background-size:contain}.chat-popover.popover.left>.arrow{right:-16px}.chat-popover .arrow:after{border-left-color:#0596d4!important}.chat-popover-property{width:24px;height:24px;text-align:center}.chat-popover-property-selected-inactive{background-color:#0596d4}.chat-popover-property-selected-active{background-color:#0f0}.silhouette-background{background-image:url(../img/white/silhouette.png);background-repeat:no-repeat;background-position:center;background-size:contain}.videogrid-table{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;overflow:hidden;z-index:-10}.videogrid-cell{float:left;overflow:hidden}.videogrid-bar-container{position:relative;top:-24px;height:19px;width:100%}.videogrid-bar{position:absolute;left:0;bottom:0;height:19px;width:100%}.videogrid-overlay{position:absolute;left:0;bottom:0;height:19px;width:100%;background-color:#111;opacity:.5}.overlay-name{float:left;font-size:12px;color:#ccc;margin:0;margin-right:10px;margin-left:5px}.button-snapshot{z-index:5;float:left;margin-right:5px;margin-top:2px}.button-scale{z-index:5;float:left;margin-right:5px;margin-top:2px}.videotile{width:100%;height:100%}.videopreview-container{padding:3px;z-index:5}.videopreview-cell{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;overflow:hidden;z-index:-10}.videopreview-tile{width:100%;height:100%;object-fit:cover;transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg)}.button-snapshot-preview{position:absolute;right:26px;top:5px;z-index:5}.animate-panel{-webkit-transition:all ease .3s;transition:all ease .3s}.whiteboard-main{position:absolute;left:0;top:0;right:0;bottom:0;padding:0;margin:0}.whiteboard-box{position:absolute;left:0;right:0;top:0;bottom:0;padding:0;margin:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) min-content;row-gap:5px}.whiteboard-toolbar-container{height:44px;padding:0;z-index:10;text-align:center}.whiteboard-toolbar{display:inline-block;height:44px;padding:0;padding-left:10px;padding-top:6px;border-radius:5px;background-color:#bcbcbc}.whiteboard-toolbar input{width:50px;margin-top:3px}.whiteboard-toolbar span{color:#fff}.render-pdf-container{position:absolute;left:0;top:0;right:0;bottom:0;border:0;margin:0;padding:0;overflow:auto;box-sizing:border-box}.render-pdf-container::-webkit-scrollbar{width:0}.render-pdf-container::-webkit-scrollbar-thumb{background:#77787c}.render-pdf-container::-webkit-scrollbar-thumb:hover{background:#bbb}.render-pdf-background{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#fff;margin:auto;display:none"
}

.render-pdf-canvas{
    position: absolute;
}

.render-draw-canvas{
    position: absolute;
    z-index:10;
    touch-action: none;
    box-sizing: border-box;
}

.render-draw-canvas:focus{
    outline: none !important;
    border:4px solid #0596d4;
}

.render-text-edit{
    position: absolute;
    padding: 0;
    z-index:11;
    background: transparent ;
    left: 0;
    top: 0;
    width: 200px;
    height: 200px;
    resize: none;
    font-size: 16px;
    font-family: "Droid sans", sans-serif;
    line-height: 1.3;
    font-weight: normal;
    outline:none;
    font-style: normal;
    overflow: hidden;
    display: block;
    border:1px solid #0596d4;
}

.render-text-edit::placeholder{
    color: #000 !important;
}

.modal-head {
padding: 15px 15px 0 15px;
border-bottom: 1px solid #cfcfcf;
}

.modal-foot {
padding: 15px 15px 5px 15px;
height: 58px;
text-align: right;
border-top: 1px solid #cfcfcf;
}

.center-modal {
    top: 15%;
}

.break-words{
    word-wrap: break-word;
}

.confirm-bar{
    position: relative;
    height: 25px;
    width: 100%;
    left: 0;
    top: 0;
    background-color: #0596d4;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.confirm-icon{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 2px;
}

.modal-confirm-foot {
padding: 15px 15px 15px 15px;
height: 58px;
text-align: right;
}

.modal-documents {
  padding: 0 15px 0 15px;
}

.modal-documents ul {
  padding: 0;
}

.modal-documents li {
  margin: 0;
  list-style: none;
}

.modal-documents li a {
  background-color: transparent;
  display: block;
  text-decoration: none;
  padding: 2px;
}

.document-list {
    height: 250px;
    overflow-y: auto;
}

.document-list li {
    overflow: hidden;
}

.document-list a {
    white-space: nowrap
}

.document-list li a {
  color: #333;
}

.document-list li a:hover {
  background-color: #0596d4;
  color: #fff;
}

.document-list li a:focus {
  outline: none;
}

.document-list-item-even {
  background-color: #eee;
}

.document-list .document-list-item-selected {
  background-color: #0596d4;
}

.document-list .document-list-item-selected a {
  color: #fff;
}

.upload-box {
  border: 1px solid #ddd;
  padding-left: 8px;
}

.upload-list {
  margin-top: 24px;
}

.upload-list li {
  padding: 8px;
  margin-bottom: 8px;
}

.upload-progressbar, .upload-progressbar-error {
  width: 440px;
  float: left;
}

.upload-progressbar .progress-bar {
  background-color: #0596d4;
}

.upload-progressbar-error .progress-bar {
  background-color: red;
}

.upload-button {
  height: 20px;
  padding-top: 0;
  line-height: 20px;
  font-size: 11px;
  float: left;
  margin-left: 8px;
  width: 70px;
}

.upload-progress-container {
  margin-top: 4px;
}

.upload-progress-container .progress {
  margin-bottom: 0;
}

.upload-converterlink {
  padding-top: 8px;
}

.upload-list {
  max-height: 74px;
  overflow-y: auto;
}

.doc-delete-button{
    background-color: #0596d4;
}

.doc-share-button {
    background-color: #0596d4;
}

.webview-dialog .modal-dialog {
    width: 685px;
    height: 360px;
}

.webview-container {
    background-color: #fff;
    width: 660px;
    height: 360px;
}

.webview-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: hidden;
    margin: 5px 5px 5px 5px;
}

.webview-iframe {
    position: absolute;
    left: 0;
    top:0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    border: 0;
}


@-webkit-keyframes warning-fade-in {
  0   { display: block; opacity: 0; }
  100% { display: block; opacity: 1; }
}

@keyframes warning-fade-in {
  0   { display: block; opacity: 0; }
  100% { display: block; opacity: 1; }
}

.device-warning-background-show {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.75);
    z-index: 999;
    font-size: 16px;
    color: #fff;
    animation:warning-fade-in ease .5s;
}

.device-warning-content {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 500px;
    height: 300px;
    transform: translate(-50%, -50%);
    background-color: #292a2d;
    color: #fff;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-auto-rows: min-content;
    row-gap: 40px;
    justify-items: center;
    padding: 40px;
    text-align: center;
    border-radius: 10px;

}

.device-warning-title {
    font-size: 16px;
    font-weight: bold;
}

.device-warning-msg {
    font-size: 16px;
}

.close-cross {
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 5;
}

.login-alert {
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
    float: left;
}

.color-dark-gray {
    color: #333;
}

.color-dark-gray path {
    fill: #333;
}

.theme-icon path {
    fill: #656565;
}

.theme-icon-gray path {
    fill: #656565;
}

.theme-icon-blue path {
    fill: #0596d4;
    z-index: 5;
}

.theme-icon-red path {
    fill: #d20e0e;
    z-index: 5;
}

.theme-icon-nice-navy path {
    fill: #001f3f;
}

.theme-icon-nice-blue path {
    fill: #0596d4;
}

.theme-icon-nice-aqua path {
    fill: #7fdbff;
}

.theme-icon-nice-teal path {
    fill: #39cccc;
}

.theme-icon-nice-olive path {
    fill: #3d9970;
}

.theme-icon-nice-green path {
    fill: #2ecc40;
}

.theme-icon-nice-lime path {
    fill: #01ff70;
}

.theme-icon-nice-yellow {
    color: #ffdc00;
}

.theme-icon-nice-yellow path {
    fill: #ffdc00;
}

.theme-icon-nice-orange path {
    fill: #ff851b;
}

.theme-icon-nice-red path {
    fill: #ff4136;
}

.theme-icon-nice-maroon path {
    fill: #85144b;
}

.theme-icon-nice-fuchsia path {
    fill: #f012be;
}

.theme-icon-nice-purple path {
    fill: #b10dc9;
}

.theme-icon-nice-black path {
    fill: #111;
}

.theme-icon-nice-gray path {
    fill: #aaa;
}

.theme-icon-nice-silver path {
    fill: #ddd;
}


.theme-icon-nice-navy {
    color: #001f3f;
}

.theme-icon-nice-blue {
    color: #0596d4;
}

.theme-icon-nice-aqua {
    color: #7fdbff;
}

.theme-icon-nice-teal {
    color: #39cccc;
}

.theme-icon-nice-olive {
    color: #3d9970;
}

.theme-icon-nice-green {
    color: #2ecc40;
}

.theme-icon-nice-lime {
    color: #01ff70;
}

.theme-icon-nice-yellow {
    color: #ffdc00;
}

.theme-icon-nice-orange {
    color: #ff851b;
}

.theme-icon-nice-red {
    color: #ff4136;
}

.theme-icon-nice-maroon {
    color: #85144b;
}

.theme-icon-nice-fuchsia {
    color: #f012be;
}

.theme-icon-nice-purple {
    color: #b10dc9;
}

.theme-icon-nice-black {
    color: #111;
}

.theme-icon-nice-gray{
    color: #aaa;
}

.theme-icon-nice-silver {
    color: #ddd;
}

.theme-icon-nice-white {
    color: #fff;
}

.nav-icon path{
    fill: #656565;
}

.nav-icon:hover path{
    fill: #505050;
}

button:disabled .nav-icon path{
    fill: #7f7f7f;
}

.nav-icon-off path{
    fill: #d20e0e;
}

.nav-icon-off:hover path{
    fill: #b60d0d;
}

button:disabled .nav-icon-off path{
    fill: #910a0a;
}

.nav-icon-active path{
    fill: #0596d4;
}

.nav-icon-active:hover path{
    fill: #0078ab;
}

button:disabled .nav-icon-active path{
    fill: #006088;
}

.nav-icon-wait path{
    fill: #ffd247;
}

.nav-icon-wait:hover path{
    fill: #fec205;
}

button:disabled .nav-icon-wait path{
    fill: #ce9c00;
}

.blink {
    animation: blinker 1s cubic-bezier(.5, 0, 1, 1) infinite alternate;
}

@keyframes blinker {
from { opacity: 1; }
to { opacity: .4; }
}

.nav-handle-container {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 20;
    width: 24px;
    height: 11px;
    bottom: 0;
}

.nav-handle {
    position: absolute;
    margin-left: -3px;
    width: 24px;
    height: 11px;
    background: top left no-repeat;
    cursor: pointer;
    opacity: .6;
}

div.nav-handle:hover {
    opacity: 1;
}

.nav-handle-down {
  background-image: url('../img/white/arrowdown.png');
  top: 9px;
}

.nav-handle-up {
  background-image: url('../img/white/arrowup.png');
  bottom: -4px;
}

.wb-tool-menu {
    display: inline;
    float: left;
}

.wb-menu {
    width: 40px;
    z-index: 1000;
}


.wb-tool-sep{
    display: inline;
    float: left;
    height: 25px;
    width: 1px;
    border: 0;
    border-left: 1px solid #e5e5e5;
    padding: 0;
    margin-top: 4px;
    margin-right: 13px;
}

.wb-doc-empty {
    background-image: url("../img/#fff/wb-doc-empty.png");
    background-repeat: no-repeat;
    background-size: 100%;
    width: 128px;
    height: 128px;
    margin: 0;
    padding: 0;
}

.wb-doc-empty-dot {
    background-image: url("../img/#fff/wb-doc-empty-dot.png");
    background-repeat: no-repeat;
    background-size: 100%;
    width: 128px;
    height: 128px;
    margin: 0;
    padding: 0;
}

.wb-doc-empty-btn {
    padding: 1px;
}

.wb-draw-warning {
    font-size: 10px;
}

.toastr-notification{
    position: absolute;
    top: 20px;
    min-width: 320px;
    z-index: 11;
    border-radius: 4px;
    cursor: default;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
}

.toastr-notification-empty{
    height: 60px;
    min-width: 0;
}

.toastr-notification-title{
    height: 60px;
}

.toastr-notification-content{
    padding: 10px 20px;
}

.toastr-notification-content-fixed-width{
    width: 320px;
}

.toastr-notification-close-cross{
    background-image: url("../img/#fff/notification_close.png");
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 1px;
    top: 1px;
    z-index: 5;
    cursor: pointer;
}

.toastr-notification-img {
    margin-left: 15px;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 32px;
    height: 32px;
}

.toastr-notification-title-text {
    display: inline-block;
    color: white;
    font-size: 18px;
    cursor: default;
    line-height: 60px;
    margin-left: 15px;
    margin-right: 15px;
}

.toastr-notification-text {
        color: white;
        font-size: 14px;
        cursor: default;
}

.toastr-notification-idle{
    left: -1000px;
}

.toastr-notification-error{
    background-color: rgba(255,0,0,.9);
    left: 20px;
}

.toastr-notification-error-img{
    background-image: url("../img/#fff/notification_error.png");
}

.toastr-notification-warning{
    background-color: rgba(255,153,0,.9);
    left: 20px;
}

.toastr-notification-warning-img{
    background-image: url("../img/#fff/notification_warn.png");
}

.toastr-notification-info{
    background-color: rgba(0,128,0,.9);
    left: 20px;
}

.toastr-notification-info-img{
    background-image: url("../img/#fff/notification_info.png");
}

.toastr-notification-notice{
    background-color: rgba(1, 151, 214,.9);
    left: 20px;
}

.toastr-notification-notice-img{
    background-image: url("../img/#fff/notification_notice.png");
}

.toastr-notification-none{
    background-color: rgba(30, 30, 30, .9);
    left: 20px;
}

.invite-header{
    height: 68px;
}

.invite-button{
    border: none;
    text-align: center;
    text-decoration: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.invite-button:hover{
    background-color: #eee;
}

.invite-button:active{
    background-color: #e5e5e5;
}


.invite-body {
        /* padding: 15px 15px 0 15px; */
    /* height: 300px; */
}

.invite-body label{
    font-weight: normal;
}

.invite-info{
            /* background-color: #0074d9; */
    width: 100%;
    /* border-bottom: solid 1px #ddd; */
    margin-bottom: 35px;
    /* height: 129px; */
    /* padding: 0 0 1px 0; */
}

.invite-info-row{
    width: 100%;
    margin-bottom: 20px;
    border-bottom: #ddd 1px solid;
}

.invite-info-openlink{
    display: grid;
    grid-template-columns: minmax(0,1fr) min-content;
    grid-template-rows: minmax(0,1fr);
    column-gap: 5px;
}

.invite-copy-link-button:hover{
    background-color: #eee;
}

.invite-copy-link-button:active{
    background-color: #e5e5e5;
}

.invite-copy-link-img{
    background-image: url(../img/white/invite_openlink.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.invite-info-copy{
    background-image: url(../img/white/invite_copy_info.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.invite-info-dialout{
    background-image: url(../img/white/invite_dialout.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.invite-info-dialin-number{
    position: relative;
    display: table-cell;
    width: 65%;
}

.invite-info-dialin-confid{
    width: 20%;
    display: table-cell;
    padding-left: 20px;
}

.invite-info-label{
    margin-bottom: 0;
    font-weight: bold !important;
}

.invite-info-input{
    border: 0;
    outline: 0;
    width: 100%;
}

.invite-edit{
    width: 100%;
    height: 50px;
}

.invite-input-field {
    float: left;
    margin-right: 10px;
    width: 200px;
}

.invite-add-button {
    float: left;
    padding: 0;
    width: 148px;
    height: 28px;
    margin-top: 21px;
}

.invite-label{
    display: block;
    margin-bottom: 0;
    width: 100%;
}

.invite-input{
    display: block;
    width: 100%;
}

.invite-input:focus{
    outline: none;
}

.invite-list-item-even {
  background-color: #fff !important;
}

.invite-participant-delete{
    background-image: url('../img/white/trash.png');
    background-repeat:no-repeat;
    background-position: center;
    vertical-align: middle;
    cursor: pointer;
}

.invite-table-container{
    margin-top: 4px;
    padding: 6px;
}

.invite-scroll{
    overflow: auto;
    height: 90px;
}

.invite-grid {
    table-layout: fixed;
    color: #333;
    border-collapse: collapse;
    font-size: 12px;
    width: 100%;
}

.invite-row{
    height: 30px;
    background-color: #eee;
}

.invite-name{
    width: 442px;
    overflow: hidden;
    white-space: nowrap;
}

.invite-moderator{
    width: 74px;
    text-align: center;
}

.invite-trash{
    text-align: center;
}

.invite-scroll-placeholder{
    width: 16px;
}

.invite-input-error {
    box-shadow: 0 0 2px 2px red;
    border-color: transparent;
}

.invite-footer {
    height: 60px;
}

.invite-footer-left {
    overflow: auto;
    width: 445px;
    height: 40px;
    margin-left: 15px;
    text-align: left;
}

.invite-footer-right{
        bottom: 10px;
}

.invite-error{
    color: red;
    word-wrap:break-word;
}

.wrap-words{
    word-wrap:break-word;
}


.polling-content {
    background-color: #f0f3f4;
    padding-top: 50px;
}

.polling-header{
    position: absolute;
    width: 100%;
    height: 90px;
    border-bottom-style: solid;
    border-width: 1px;
    border-color: #cfdadd;
    padding: 10px 30px 15px 30px;
}

.polling-header-left {
    position: absolute;
    right: 246px;
    left: 10px;
    max-width: 335px;
}

.polling-header-left p{
    margin: 0;
    margin-bottom: 2px;
}

.polling-header-right{
    position: absolute;
    right: 10px;
    margin-top: 10px;
}

.polling-header-label {
    display: inline-block;
    font-weight: bold;
}

.polling-scroll {
    position: absolute;
    overflow-y: auto;
     width: 100%;
    top: 90px;
    bottom: 0;
}

.polling-question-list{
    list-style-type: none;
    padding: 0;
}

.polling-question-item{
    background-color: #fff;
    margin-top: 25px;
    border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    border-color: #cfdadd;
    margin-left: 25px;
    margin-right: 25px;
    padding: 15px;
}

.polling-answers-separator{
    left: 0;
    right: 0;
    height: 3px;
    width: 80%;
    margin: auto;
    margin-top: 25px;
    background-color: #0596d4;
}

.polling-answers{
    margin: 25px 0;
}

.polling-answer{
    margin-bottom: 30px;
}

.polling-question-text{
    text-align: justify;
    margin: 10px;
}

.polling-answer-check{
    float: left;
}

.polling-answer-text {
    text-align: justify;
    margin: 10px;
}

.polling-label{
    font-size: 16px;
    font-weight: bold;
    margin-top: 0;
    display: block;
    margin-bottom: 4px;
    width: 100%;
}

.polling-label-question{
    font-size: 16px;
    font-weight: bold;
    margin-top: 0;
    display: block;
    margin-bottom: 4px;
    display: inline-block;
}

.progress-bar-polling {
    background-color: #0596d4;
}

.polling .progress {
    background-color:#57b9e2;
    margin-left: 10px;
}

.polling .progress span {
    padding: 0 4px;
}

.polling-stats-progress{
    vertical-align: top;
    display: inline-block;
    margin-left: 4px;
    width:200px;
    height: 20px;
}

.polling-stats-header-progress {
    position: absolute;
    vertical-align: top;
    display: inline-block;
    margin-left: 4px;
    max-width: 200px;
    left: 154px;
    height: 20px;
    right: 10px;
}

.polling-stats-counter{
    display: inline-block;
    margin-left: 4px;
}

.polling-edit-header {
    height: 120px;
}

.polling-edit-header-grid {
    table-layout: fixed;
    border-collapse: collapse;
    width: 100%;
}

.polling-edit-options{
    margin-top: 10px;
}

.polling-edit-options span{
    margin-left: 1px;
}


.polling-edit-options input {
    position: relative;
    top: 1px;
  }

.polling-edit-option{
    margin-left: 8px !important;
}

.polling-edit-option-group{
    margin-left: 16px !important;
}

.polling-edit-duration{
    width:60px;
}

.polling-edit-header-buttons{
    width: 210px;
    text-align: right;
}

.polling-edit-header-button{
    margin-left: 10px;
}

.polling-edit-input{
    width: 100%;
    resize: none;
}

.polling-edit-scroll {
    top: 120px;
}

.polling-edit-item-footer{
    margin-left: 40px;
}

.polling-edit-delete{
    background-image: url('../img/white/trash.png');
    background-repeat:no-repeat;
    background-position: center;
    vertical-align: middle;
    cursor: pointer;
}

.polling-edit-move-up{
    background-image: url('../img/white/move-up.png');
    background-repeat:no-repeat;
    background-position: center;
    vertical-align: middle;
    cursor: pointer;
}

.polling-edit-move-down{
    background-image: url('../img/white/move-down.png');
    background-repeat:no-repeat;
    background-position: center;
    vertical-align: middle;
    cursor: pointer;
}

.polling-edit-add-question{
    margin-top: 15px;
    margin-left: 26px;
    margin-right: 25px;
    margin-bottom: 15px;
}

.polling-snap-header{
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-auto-rows: min-content;
    row-gap: 5px;
    border-bottom-style: solid;
    border-width: 1px;
    border-color: #cfdadd;
    padding: 10px 30px 15px 30px;
    height: 200px;
}

.polling-snap-progress{
    display: flex;
}

.polling-snap-stats-header-progress {
    width:200px;
}

.polling-snap-header-check{
    margin-top: 4px;
}

.polling-snap-header-check input{
    vertical-align: middle;
    margin-top: 5px;
}

.polling-snap-header-share-organizer{
    display:inline;
}

.polling-snap-header-share-part{
    text-align: center;
}

.polling-snap-status {
    margin-bottom: 10px;
}

.polling-snap-scroll {
    position: absolute;
    overflow-y: auto;
    width: 100%;
    top: 200px;
    bottom: 0;
}

.polling-chrono{
    background-image: url('../img/white/polling_chrono.png');
    background-repeat:no-repeat;
    background-position: center;
    margin-top: -5px;
    margin-right: 5px;
    width: 16px;
    height: 16px;

}

.polling-chrono-enabled {
    cursor: pointer;
    }

.polling-snap-timer-disabled {
    cursor: default;
}

.polling-snap-report-btn{
    min-width: 116px;
}

.polling-snap-header-check span{
    margin-left: 2px;
    vertical-align: middle
}

.polling-snap-header-share-participant{
    font-weight:bold;
    margin-right: 20px;
    margin-bottom: 5px;
}

.polling-share-popover{
    font-size: 14px;
}

.polling-snap-answer-list{
    padding: 0 0 0 15px;
}

.polling-snap-question-progress{
    vertical-align: top;
    display: inline-block;
    width: 200px;
    height: 20px;
}

.polling-snap-answer-progress{
    vertical-align: top;
    display: inline-block;
    width: 200px;
    height: 20px;
}

.polling-answer-stats-counter-total{
    position: absolute;
    display: inline-block;
    width:40px;
    right: 0;
    margin-left: 4px;
}

.polling-answer-pagination-footer{
    width: 100%;
    height: 33px;
}


.reconnect-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 200;
}

.reconnect-overlay {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #333;
    z-index: 201;
    opacity: .8;
}

.reconnect-box {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 300px;
    height: 200px;
    margin: auto;
    z-index: 202;
    background: #fff;
    border-radius: 10px;
}

.reconnect-text{
    position: absolute;
    top: 130px;
    width: 100%;
    color: #000;
    font-size: 22px;
    text-align: center;
}

.reconnect-label{
    display: inline;
}

.reconnect-dots{
    display: inline-block;
    width: 0;
    margin-left: -4px;
    text-align: left;
}

.heart {
	animation: beat 2s infinite alternate;
	transform-origin: center;
}

/* Heart beat animation */
@keyframes beat{
	to { transform: scale(.95); }
}
.gear {
    background-image: url("../img/#fff/gear.gif");
    background-repeat: no-repeat;
    position: absolute;
    width: 48px;
    height: 48px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.fadein {
    animation: fadein 2s;
}

.fadeout {
    animation: fadeout 2s;
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}

@keyframes fadeout {
    from {
        opacity:1;
    }
    to {
        opacity:0;
    }
}


.settings-box {
    position: absolute;
    left: 0;
    top: 20%;
    right: 0;
    /* bottom: 0; */
    width: 900px;
    height: 515px;
    margin: auto;
    z-index: 202;
    background-color: #e5e5e5;
    border-radius: 10px;
    overflow:hidden;
}

.settings-nav {
    position: absolute;
    left: 0;
    top: 0;
    bottom:0;
    width: 150px;
    border-right: solid #9e9e9e 1px;
}

.settings-nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.settings-nav li {
    height: 48px;
    line-height: 48px;
    padding-left: 20px;
    cursor: pointer;
    color: #000;
}

.settings-nav li:hover {
    background: #c1c1c1;
}

.settings-nav li:active {
    background: #c1c1c1;
}

.settings-nav-selected {
    background: #c1c1c1;
}

.settings-header {
    position: absolute;
    left: 150px;
    right: 0;
    top: 0;
    height: 48px;
    padding-left: 10px;
    padding-top: 12px;
    font-size: 14px;
    background-color: #c1c1c1;
    color: #000;
}

.settings-content{
    position: absolute;
    left: 150px;
    top: 48px;
    bottom: 0;
    right: 0;
    padding: 20px 20px;
    color: #000;
    font-size: 12px;
    overflow: auto;
}

.settings-close{
    background-image: url(../img/white/notification_close.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 5px;
    top: 12px;
    z-index: 202;
    cursor: pointer;
}

.close-cross{
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 202;
    cursor: pointer;
}

.info-webrtc-container{
    position: absolute;
    bottom: 90px;
    left: 10px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-webrtc-img{
    float: left;
    background-image: url(../img/white/webrtc_logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 80px;
    height: 96px;
    margin: 0;
    padding: 0;
    margin-right: 10px;
}

.info-webrtc-text{
    font-weight: bold;
    float: left;
    width: 270px;
    text-align: center;
}

.info-opus-container{
    position: absolute;
    bottom: 5px;
    left: 10px;
    padding: 0;
}

.info-opus-img{
    float: left;
    background-image: url(../img/white/opus.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 80px;
    height: 46px;
    margin: 0;
    padding: 0;
    margin-right: 10px;
}

.info-opus-text{
    font-weight: bold;
    float: left;
    width: 270px;
    text-align: center;
}

.info-field {
    color: #0596d4;
    margin-left: 8px;
}

.info-link {
    width: 576px;
    border: 0;
    background: #c1c1c1;
    outline: 0;
    margin-bottom: 16px;
}

.info-version {
    position: absolute;
    bottom: 24px;
    right: 24px;
    padding: 0;
    font-size: 11px;
}

.audio-threshold-wrapper {
    display: inline-block;
    width: 16px;
    height: 150px;
    padding: 0;
}

.audio-threshold-wrapper input {
    width: 150px;
    height: 16px;
    margin: 0;
    /* transform-origin: 75px 75px;
    transform: rotate(-90deg); */
  }

input[type=range].setting-range {
    -webkit-appearance: none;
    -moz-appearance: none;
    margin: 0 0;
    width: 101%;
    border-radius: 5px;
}

input[type=range].setting-range:focus {
    outline: none;
}

input[type=range].setting-range::-webkit-slider-runnable-track {
    width: 101%;
    height: 22px;
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0 0 1px rgba(13, 13, 13, 0);
    background: transparent;
    color: transparent;
    overflow: visible;
    border-radius: 0;
    border: 0 solid #000101;
}

input[type=range].setting-range::-webkit-slider-thumb {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(13, 13, 13, 0);
    border: 0 solid rgba(0,0,0, 0);
    height: 26px;
    width: 10px;
    border-radius: 0;
    background: rgba(127,127,127, .93);
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-top: -2px;
}

input[type=range].setting-range::-moz-range-track {
    width: 101%;
    height: 22px;
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0 0 1px rgba(13, 13, 13, 0);
    background: transparent;
    border-radius: 0;
    border: 0 solid #000101;
}

input[type=range].setting-range::-moz-range-thumb {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(13, 13, 13, 0);
    border: 0 solid rgba(0,0,0, 0);
    height: 26px;
    width: 10px;
    border-radius: 0;
    background: rgba(127,127,127, .93);
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-top: -2px;
}

.setting-range-tick-container{
    width: 100%;
    height: 20px;
}

.setting-range-tick-ticks{
    width: 100%;
    height: 3px;
    margin-top: 2px;
    margin-left: 1px;
}

.setting-range-tick-labels{
    width: 100%;
    height: 15px;
}

.setting-range-tick-label{
    height: 15px;
}

.setting-range-tick-border{
    height: 3px;
}

.setting-range-tick-left{
    text-align: left;
}

.setting-range-tick-center{
    text-align: center;
}

.setting-range-tick-right{
    text-align: right;
}

.setting-range-tick-border-left{
    text-align: left;
    border-left: 1px solid;
}

.setting-range-tick-border-right{
    border-left: 1px solid;
    border-right: 1px solid;
}

.settings-multimedia{
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-auto-rows: min-content;
    row-gap: 10px;
}

.settings-multimedia-header{
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.settings-multimedia-title{
    margin-left: 10px;
    color: #0596d4;
}

.settings-multimedia-advanced{
    display: flex;
    justify-content: center;
    align-items: center;
}

.settings-device{
    margin-left: 20px;
    margin-right: 20px;
}

.settings-device-label{
    display: block;
    margin-bottom: 4px;
}

.settings-device-select-wrapper{
    background: url('../img/white/caret.png') no-repeat 98% 50%;
    background-color: #0596d4;
    overflow: hidden;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
}

.settings-device-select-wrapper select {
    background: transparent;
    border: none;
    padding-left: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-right: 25px;
    width: 100%;
    color: #fff;
    outline:0px;
    -webkit-appearance: none;
    -moz-appearance: none;
 }

 .settings-device-select-wrapper select:focus{
    outline: none;
}

.settings-device-select-wrapper select option{
    color: #000;
}


.settings-device-select-nodevice{
    background-color: #c1c1c1;
    overflow: hidden;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
    padding: 3px 6px 3px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flags-container label {
    line-height:20px;
    font-weight:normal;
    display:block;
}

.flags-container span.label-text {display:inline;}

.flags-container input[type=checkbox] {
    height:13px;
    width:13px;
    padding:0;
    margin-top:5px;
    float:left;
    margin-left:0;
    margin-right:4px;
}

.rec-header{
    margin-bottom: 20px;
}

.rec-res-container{
    display: flex;
    justify-content: space-between;
    text-align: center;
}

.rec-res-btn{
    width: 180px;
    height: 96px;
    border-width: 1px;
    border-style: solid;
    border-color: #000;
    cursor: pointer;
    display: inline-block;
}

.rec-res-btn-active{
    border-color: #0596d4;
    border-width: 5px;
}

.rec-res-btn-main{
    height: 70px;
    vertical-align: middle;
    line-height: 80px;
    font-size: 28px;
    font-weight: bold;
}

.rec-res-btn-main-active{
    height: 66px;
    line-height: 74px;
}

.rec-res-btn-footer{
    font-weight: bold;
    padding-left: 6px;
    padding-right: 6px;
}

.rec-res-btn-footer-active{
    padding-left: 2px;
    padding-right: 2px;
}

.rec-res-img{
    background-repeat: no-repeat;
    background-size: 100%;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
}

.rec-notes{
    font-size: 12px;
    margin-top: 20px;
    font-weight: bold;
}

.rcc-connect {
    background-image: url("../img/#fff/rcc_connect.gif");
    background-repeat: no-repeat;
    width: 32px;
    height: 32px;
    margin-top: -1px;
}

.stats-content{
    position: absolute;
    top: 10px;
    left: 15px;
    right: 15px;
}

.stat-graph-container{
    margin-bottom: 20px;
}

.stat-title{
    color: #0596d4;
    font-weight: bold;
    font-size: 14px;
}

.stat-separator{
    clear: both;
}

.stat-footer{
    margin-top: 10px;
}

.table-like {
    display: table;
    width: 550px;
}
.table-like-row {
    display: table-row;
}

.table-like-cell {
    display: table-cell;
}


.stat-graph-canvas{
    float: left;
}

.stat-graph-legend{
    width: 400px;
    overflow: hidden;
    float: left;
    padding-left: 10px;
}

.stat-graph-color1{
    color:#0074d9;
}

.stat-graph-color2{
    color:#3d9970;
}

.stat-graph-color3{
    color: #ff4136;
}

.stat-graph-color4{
    color:#b10dc9;
}

.stat-graph-color5{
    color:#ff851b;
}

.stat-graph-color6{
    color:#39cccc;
}

.stat-graph-color7{
    color:#85144b;
}

.stat-graph-color8{
    color:#ffdc00;
}

.stat-graph-legend label {
    line-height:20px;
    font-weight:normal;
    display:block;
}

.stat-graph-legend span.label-text {display:inline;}

.stat-graph-legend input[type=checkbox] {
    height:13px;
    width:13px;
    padding:0;
    margin-top:5px;
    float:left;
    margin-left:0;
    margin-right:4px;
}

.content-centered{
    text-align: center;
}

.video-mirror{
    transform: rotateY(180deg);
}

.settings-refresh-devices{
    background-image: url(../img/white/refresh.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.br-meter-title{
    text-align: center;
    color:#7fdbff;
    font-family: "Tulpen One", cursive;
    font-size: 46px;
    margin-top: 50px;
}

.br-meter-container{
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    text-align: center;
}

.br-meter{
    float: left;
    width: 50%;
    height: 100%;
}

.br-meter-left{
    border-right: solid #333 1px
}

.br-meter-legend-container{
    height: 60px;
    width: 100%;
    line-height: 24px;
    margin-top: 10px;
    font-size: 13px;
    text-align: left;
    padding: 0 6px;
    position: relative;
}

.br-meter-legend-flags{
    position: absolute;
    bottom: 0;
    left: 10px;
}

.br-meter-legend-container ul{

    list-style: none;
}

.br-meter-legend{
    display: inline-block;
}
.br-meter-legend li{
    list-style: none;
}

.stat-bottom{
    margin-top: -6px;
    height: 32px;
    line-height: 32px;
    text-align: center;
}

.stat-kind{
    text-decoration: none !important;
    font-size: 14px;
    font-weight:bold;
    cursor: pointer;
    color: #0596d4;
}

.arc-animated{
    transition: all 4s ease;
}

.glow{
    filter: url(#blur-filter);
}

.br-dot {
    height: 8px;
    width: 16px;
    border-radius: 1px;
    display: inline-block;
    margin-right: 6px;
  }

.br-dot-indicator {
    background-color: #7fdbff;
  }

.br-dot-crit {
    background-color: #ff1744;
  }

.br-dot-warn {
    background-color: #ff851b;
  }

  .br-dot-ok {
    background-color: #3d9970;
  }

  .br-dot-unit {
    background-color: #86879d;
  }


.chart-wrap {
  width: 100%;
  padding: 10px;
  border: 1px solid #eee;
  font-family: 'Open Sans', sans-serif;
  color: #4e555f;
  font-size: 12px;
  height: 200px;
overflow: auto;
}

.chart-title{
    color: #4cb8c4;
    font-family: 'Tulpen One';
    font-style: normal;
    font-weight: 400;
    font-size: 26px;
    margin-bottom: 5px;
}

.chart-wrap .chart-row {
  position: relative;
  height: 20px;
  margin-bottom: 5px;
}
.chart-wrap .bar-wrap {
  position: relative;
  background: #d7dbde;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.chart-wrap .bar-wrap .bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: #4cb8c4;
  transition: all 1s;
}

.chart-wrap .label {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 70px;
  text-align: left;
  line-height: 20px;
  font-weight: bold;
  z-index: 10;
  color: #4e555f;
  overflow: hidden;
}
.chart-wrap .number {
  position: absolute;
  top: 0;
  right: 0;
  padding-right: 2px;
  line-height: 20px;
  font-weight: bold;
  text-align: right;
  z-index: 10;
}

.audio-level-meter {
    height: 26px;
    width: 26px;
    -webkit-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    align-items: center;
    box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    color: #64ffda;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

@keyframes swing {
    0 {
        -webkit-transform: scaleY(.9);
        transform: scaleY(.9)
    }

    50% {
        -webkit-transform: scaleY(1.1);
        transform: scaleY(1.1)
    }

    to {
        -webkit-transform: scaleY(.9);
        transform: scaleY(.9)
    }
}

@-webkit-keyframes swing {
    0 {
        -webkit-transform: scaleY(.9);
        transform: scaleY(.9)
    }

    50% {
        -webkit-transform: scaleY(1.1);
        transform: scaleY(1.1)
    }

    to {
        -webkit-transform: scaleY(.9);
        transform: scaleY(.9)
    }
}

.audio-level-bar {
    -webkit-transition: height 75ms linear;
    transition: height 75ms linear;
    -webkit-animation: swing .6s linear 0s infinite;
    animation: swing .6s linear 0s infinite;
    background-color: #64ffda;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    height: 4px;
    width: 4px
}

.audio-level-bar-2 {
    -webkit-animation-delay: .2s;
    animation-delay: .2s;
    margin-left: 2px;
    margin-right: 2px
}

.audio-level-bar-3 {
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

/* level-0 */
.audio-level-meter.audio-level-0 .audio-level-bar {
    -webkit-animation-name: none;
    animation-name: none
}

/* level-1 */
.audio-level-meter.audio-level-1 .audio-level-bar-1,.audio-level-meter.audio-level-1 .audio-level-bar-3 {
    height: 6px
}

.audio-level-meter.audio-level-1 .audio-level-bar-2 {
    height: 10px
}

/* level-2 */
.audio-level-meter.audio-level-2 .audio-level-bar-1,.audio-level-meter.audio-level-2 .audio-level-bar-3 {
    height: 7px
}

.audio-level-meter.audio-level-2 .audio-level-bar-2 {
    height: 13px
}

/* level-3 */
.audio-level-meter.audio-level-3 .audio-level-bar-1,.audio-level-meter.audio-level-3 .audio-level-bar-3 {
    height: 7px
}

.audio-level-meter.audio-level-3 .audio-level-bar-2,.audio-level-meter.audio-level-4 .audio-level-bar-2 {
    height: 16px
}

/* level-4 */
.audio-level-meter.audio-level-4 .audio-level-bar-1,.audio-level-meter.audio-level-4 .audio-level-bar-3 {
    height: 10px
}

.audio-level-meter.audio-level-4 .audio-level-bar-2 {
    height: 16px
}

.hint-help{
    background-image: url(../img/white/hint-help.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    padding: 0;
    float: right;
}

.hint-help-tooltip .tooltip-inner{
    max-width: 200px;
    word-wrap:break-word;
    white-space: normal;
}

.dialer-container{
    position: absolute;
    top: 31px;
    width: 268px;
    background-color: transparent;
    z-index: 10000;
    padding: 0;
    border-radius: 5px;
}

.dialer-handler{
    position: absolute;
    bottom: 0;
    left: 0;
    height: 26px;
    width: 18px;
    cursor: pointer;
    background-color: #0596d4;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    display: flex;
}

.dialer-wrapper{
    background-color: white;
    padding: 10px 10px 0 10px;
    float: right;
    width: 250px;
    border-radius: 5px;
    position: relative;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
}

.dialer-keyboard{
    width: 180px;
    height: 220px;
    display: table;
    left: 0;
    right: 0;
    margin: auto;
    border-bottom: 1px solid #ddd;
}

.dialer-status{
    height: 24px;
    line-height: 24px;
}

.dialer-cell{
    display:table-cell;
    position: relative;
}

.dialer-header-button{
    border: none;
    text-align: center;
    text-decoration: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    margin-left: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dialer-header-button:hover{
    background-color: #eee;
}

.dialer-header-button:active{
    background-color: #e5e5e5;
}

.dialer-button-call{
    border: none;
    text-align: center;
    text-decoration: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    margin: auto;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #3d9970;
}
.dialer-button-call:hover{
    background-color: #378a65;
}

.dialer-button-call:active{
    background-color: #317159;
}

.dialer-button{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;

    color: #000;
    border: none;
    text-align: center;
    text-decoration: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    cursor: pointer;
}

.dialer-button:hover{
    background-color: #eee;
}

.dialer-button:active{
    background-color: #e5e5e5;
}

.dialer-number{
    font-size: 16px;
    height: 20px;
    margin-top: 4px;
}

.dialer-chars{
    font-size: 10px;
}

.dialer-label{
    font-weight: bold;
    margin-bottom: 0;
    display: block;
}

.dialer-top-buttons{
    position: absolute;
    left: 5px;
    top: 5px;
    z-index: 10;
}

.dialer-button-close{
    position: absolute;
    right: 0;
    top:0px;
}

.dialer-top{
    width: 100%;
    height: 30px;
}

.dialer-destination{
    position: relative;
    width: 100%;
    border-bottom: #ddd 1px solid;
    position: relative;
}

.dialer-destination-input{
    border: 0;
    outline: 0;
    width: 85%;
    display: block;
}

.dialer-button-img-call{
    background-image: url(../img/white/dialer_call.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.dialer-button-img-close{
    background-image: url(../img/white/dialer_close.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.dialer-button-img-keyb{
    background-image: url(../img/white/dialer_keyb.png);
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.dialer-backspace-button{
    position: absolute;
    right: 0;
    bottom: -2px;
}

.dialer-backspace-img{
    background-image: url(../img/white/backspace.png);
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.dialer-status-img {
    background-repeat: no-repeat;
    background-size: 100%;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    display: inline-block;
}

.dialer-status-text {
    display: inline-block;
}

.dialer-status-terminated-img{
    background-image: url("../img/#fff/dialer_status_terminated.png");
}

.dialer-status-established-img{
    background-image: url("../img/#fff/dialer_status_established.png");
}

.dialer-status-ringing-img{
    background-image: url("../img/#fff/dialer_status_ringing.png");
}

.net-icon-container {
    display:flex;
    flex-direction: column;
    align-items: center;
}

.net-icon {
    border: none;
    text-align: center;
    text-decoration: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border-style: solid;
    border-width: 2px;
    border-color: #3d9970;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    overflow: hidden;
    padding-top: 4px;
    transition:all ease .3s;
    display: inline-block;
    margin-bottom: 5px;
}

.net-icon-ok{
    border-color: #3d9970;
}

.net-icon-ok path{
    fill: #3d9970;
}

.net-icon-crit{
    border-color: #b70f0f;
    background-color: #9e9b9b;
}

.net-icon-crit path{
    fill: #b70f0f;
}

.net-icon-warn {
    border-color: #f1d600;
    background-color: #31708f;
}

.net-icon-warn path{
    fill: #f1d600;
}


.icon {
    display: inline-flex;
    align-self: center;
}

.icon svg, .icon img {
    height: 1.25em;
    width: 1.25em;
}

.icon.baseline svg, .icon img {
    top: .25em;
    position: relative;
}


.net_toastr_container{
    position: absolute;
    left: 0;
    right: 0;
    width: 600px;
    margin: auto;
    border-radius: 5px;
    z-index: 50;
    color: #000;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size: 18px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    background-color: rgba(229,229,229,.7);
}

.net_toastr_content{
    display: grid;
    grid-template-columns: 100px 1fr 100px;
    grid-template-rows: minmax(0,1fr);
    justify-content: center;
    align-items: center;
}


.net_toastr_container span{
    margin-left: 30px;
    margin-right: 30px;
}

.net_toastr_container p{
    text-align: center;
    margin: 0;
}

.net_toastr_bar{
    position: absolute;
    height: 20px;
    right: 0;
    top: -22px;
}

.net_toastr_bar div{
    float: right;
    margin-left: 4px;
    height: 20px;
    line-height: 18px;
    border-radius: 5px;
    font-size: 12px;
    background-color: #fff;
    color: #000;
    padding: 0 8px;
    cursor: pointer;
}

.net_toastr_audio_only{
    margin-top: 5px;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.net_toastr_audio_only span{
    margin: 0;
    margin-left: 4px;
    font-weight: normal;
}

.net_toastr_handle_container {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 20;
    width: 24px;
    height: 11px;
    top: 0;
}

.net_toastr_handle {
    position: absolute;
    width: 24px;
    height: 11px;
    background: top left no-repeat;
    cursor: pointer;
    opacity: .6;
}

div.net_toastr_handle:hover {
    opacity: 1;
}

.net_toastr_handle_down {
  background-image: url('../img/gray/arrowdown.png');
}

.net_toastr_handle_up {
  background-image: url('../img/gray/arrowup.png');
}

.net_toastr_br {
    text-align: center;
    font-size: 14px;
}

.remote-screen-container{
    position: relative;
    height: 250px;
}

.remote-screen{
    position: absolute;
    background-color: #e0e0e0;
    cursor:pointer;
    border-radius: 5px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    color: #333;

}

.remote-screen p{
    font-size: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.remote-screen:hover{
    background-color: #d0d0d0;
}

.remote-screen-selected{
    background-color: #0596d4;
    color: #fff;
}

.remote-screen-selected:hover{
    background-color: #0487be;
}

.is-dragover {
    background-color: #0596d4;
    outline: 1px dashed #fff;
    outline-offset: -4px;
}

.chat-item-link{
    margin: 0 5px 0 5px;
}

.link-text a{
    color: red;
}

.link-content {
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #d9d9d9;
    border-radius: 5px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    padding: 0 5px;
    cursor: pointer;
    overflow: hidden;
}

.link-content:hover {
    background-color: #cecece;
}

.link-icon {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #36425b;
    top: 50%;
    transform: translate(0, -50%);
}

.link-text {
    position: absolute;
    height: 50px;
    line-height: 50px;
    white-space: nowrap;
    text-overflow: ellipsis;
    right: 10px;
    left: 50px;
    overflow: hidden;
}

.privacy-content{
    position: absolute;
    left: 10px;
    right: 10px;
    top: 10px;
    bottom: 10px;
}

.privacy-iframe{
    border-style: none;
    width: 100%;
    height: 100%;
}

.login-privacy-frame{
    position: absolute;
    max-width: 600px;
    max-height: 800px;
    width: 80%;
    height: 80%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius: 10px;
    z-index: 2;
    color: #333;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    background-color: #f9f9f9;
    overflow: auto;
}

.login-privacy-banner {
    height: 72px;
    background-repeat:no-repeat;
    background-position: center;
    background-image:url('../img/white/logo_login.png');
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    margin: auto;
}

.login-privacy-content{
    position: absolute;
    left: 30px;
    right: 30px;
    top: 130px;
    bottom: 80px;
}

.login-privacy-bar{
    position: absolute;
    height: 50px;
    left: 30px;
    right: 30px;
    bottom: 10px;
}


.login-privacy-button {
    border-radius: 5px;
    width: 150px;
    height: 40px;
    font-size: 18px;
}

.login-privacy-url, .login-privacy-url:focus{
    float: right;
    color: #333;
    font-size: 10px;
    text-decoration: none;
}

.login-privacy-url:hover{
    color: #0596d4;;
}

.login-new-container{
    position: absolute;
    max-width: 700px;
    width: 80%;
    height: min-content;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    z-index: 2;
    overflow: auto;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    background-color: #fff;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-auto-rows: min-content;
    color: #333;
    padding: 20px 20px;
    animation: fadein 1s;
}

.login-new-join-bar{
    height: min-content;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-auto-rows: min-content;
    color: #333;
    animation: fadein 1s;
}

.login-new-status{
    display: grid;
    grid-template-columns: minmax(0,1fr) min-content;
    grid-template-rows: minmax(0,1fr);
    column-gap: 10px;
}

.login-new-banner-text{
    padding: 8px;
    box-sizing: border-box;
}

.login-new-banner {
    height: 72px;
    width: 152px;
    background-repeat: no-repeat;
    background-position: right;
    cursor: pointer;
    margin-right: -5px;
    background-image: url(../img/white/logo_login.png);
}

.login-new-item{
    display: grid;
    grid-template-columns: 32px minmax(0,1fr);
    grid-template-rows: minmax(0,1fr);
    row-gap: 5px;
    justify-items: center;
}

.login-new-item-description{
    width: 100%;
}

.login-new-bar{
    display: flex;
    justify-content: center;
}

.login-new-button {
    border-radius: 5px;
    width: 250px;
    height: 50px;
    font-size: 18px;
}

.login-new-preview{
    height: 300px;
    margin-bottom: 15px;
    border-radius: 10px;
    overflow: hidden;
    background-color: #c1c1c1;
    position: relative;
}

.device-checker-video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.login-new-audio-level{
    position: absolute;
    z-index: 10;
    bottom: 0;
    left: 10px;
}

.login-new-overlay-bar{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    padding: 0 15px;
    z-index: 500;
    display: grid;
    grid-template-rows: minmax(0,1fr);
    grid-template-columns: min-content min-content;
    column-gap: 15px;
    justify-content: center;
}

.login-new-overlay-settings{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 60px;
    height: 100%;
    z-index: 500;
    padding-bottom: 15px;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

.login-new-overlay-button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid #fff;
    background-color: #11141d;
    box-shadow: 0 6px 10px 0 #000;
    padding: 0;
}

.login-new-overlay-button-red{
    border-color: #d20e0e;
}

.login-new-overlay-button-red path{
    fill: #d20e0e;
}

.login-new-overlay-button-nodevice{
    border: 2px solid #656565;
}

.login-new-overlay-button-nodevice path{
    fill: #656565;
}

.login-new-overlay-dialog{
    animation: fadein .5s;
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: minmax(0,1fr);
    row-gap: 10px;
}

.login-new-dialog-caption{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.login-new-dialog-icon path{
    fill: #656565;
}


.login-new-dialog-bar{
    justify-self: right;
    display: flex;
}

.login-new-dialog-button{
    border-radius: 5px;
    justify-self: right;
    padding: 4px 10px;
    margin-left: 5px;
}

.login-new-dialog-nodevice{
    background-color: #c1c1c1;
    overflow: hidden;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
    padding: 3px 6px 3px 10px;
}

.login-new-privacy{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.login-new-privacy-link, .login-new-privacy-link:focus {
    color: #333;
    font-size: 10px;
}

.login-new-open-title{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px;
}

.login-new-open-caption{
    margin-bottom: 0;
}

.login-new-open-input, .login-new-open-input:focus {
    width: 100%;
    border-radius: 5px;
    outline: none;
    border: solid 1px #0596d4;
    -webkit-appearance: none;
    font-size: 25px;
    -moz-appearance: none;
    padding: 4px 10px;
    margin-bottom: 50px;
}

.login-new-open-button{
    justify-self: right;
}

.presenter-screen-dialog{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 600px;
    height: 400px;
    border-radius: 10px;
    z-index: 2;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-template-columns: minmax(0,1fr);
    padding: 60px 40px;
    row-gap: 10px;
    justify-items: center;
    align-content: end;
    animation:warning-fade-in ease .5s;

    box-shadow: 0 2px 2px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .1);
    background-color: #fff;
    color: #333;
}

.presenter-screen-dialog-button {
    border-radius: 5px;
}

.blink-permission path{
    animation: blinkingPermission 2s infinite;
}

@keyframes blinkingPermission{
	0{ fill: #656565; }
	49%{ fill: #656565; }
	50%{ fill: #d20e0e; }
	100%{ fill: #d20e0e; }
}
.slide-up{
    animation: slide-up .5s ease;
}

@keyframes slide-up {
    0 {
        opacity: 0;
        transform: translateY(20px) scale(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.tile-grid{
    overflow: hidden;
    box-sizing: border-box;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.tile-grid-side{
    overflow: hidden;
    box-sizing: border-box;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    align-content: start;
}

.tile {
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    padding: 3px;
}

.tile-container{
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tile-wrapper{
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 5px;
}

.tile-video {
    position: absolute;
    width: 100%;
    height: 100%;
}

.tile-bar{
    position: absolute;
    width: 100%;
    left:0;
    bottom: 0;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    color: #ccc;
    background-color: rgba(1,1,1,.5);
    z-index: 1;
    box-sizing: border-box;
    padding-left: 4px;
    display: grid;
    grid-template-rows: minmax(0,1fr);
    grid-template-columns: min-content min-content minmax(0,1fr);
    align-items: center;
}

.tile-level{
    margin-right: 2px;
}

.tile-button {
    width: 28px;
    height: 28px;
    border: 2px solid #fff;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    border-radius: 50%;
    margin-right: 8px;
    cursor: default;
}

.text-too-long{
    overflow: hidden !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    width: 100%;
    cursor: default;
}

.container-fit{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.container-fill{
    position: relative;
    width: 100%;
    height: 100%;
}


.board-content{
    background-color: rgba(0,0,0,.4);
    border-radius: 5px;
    overflow: hidden;
}

.whiteboard{
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: minmax(0,1fr) min-content;
    row-gap: 5px;
    padding: 5px;}