@media (max-width: 860px) and (min-height: 500px){
  .demo-header{
    font-size:12px;
    padding:0.5em 0;
  }
}
@media (max-height: 500px){
  .demo-header{
    font-size:10px;
    padding:0.3em 0;
  }
}
@media (max-width: 750px){
  .demo-header #title-container{
    display:none;
  }
  #tools{
    margin-inline-start:auto;
  }
}
.b-remote-drag:after,
.b-remote-resize-left:after,
.b-remote-resize-right:after{
  display:block;
  font-size:0.8em;
  content:attr(data-user-name);
  position:absolute;
  text-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);
  font-weight:bold;
  clip-path:none;
  background:none;
}

.b-remote-drag:after{
  left:50%;
  top:58%;
  transform:translateX(-50%);
}

.b-remote-resize-right:after{
  right:1.8em;
  transform:translateY(-50%);
  top:50%;
}

.b-remote-resize-left:after{
  left:1.8em;
  transform:translateY(-50%);
  top:50%;
}

.b-remote-drag:before,
.b-remote-resize-left:before,
.b-remote-resize-right:before{
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  display:block;
  width:1em;
  height:1em;
  position:absolute;
  color:#fff;
  transform:translateX(-50%);
  text-shadow:1px 1px 2px rgba(0, 0, 0, 0.4);
}

.b-remote-drag:before{
  content:"\f25a";
  left:50%;
  top:20%;
}

.b-remote-resize-left:before{
  content:"\f07e";
  left:2px;
  transform:translateY(-50%);
  top:50%;
}

.b-remote-resize-right:before{
  content:"\f07e";
  right:2px;
  transform:translateY(-50%);
  top:50%;
}

.b-remote-resize-left,
.b-remote-resize-right,
.b-remote-drag{
  outline:2px solid rgba(135, 206, 235, 0.4);
  outline-offset:3px;
}

#ws-online-container{
  display:flex !important;
  align-items:center;
  gap:0.5em;
}

.b-text-content.b-content-element{
  flex-flow:row nowrap;
}

