html{width:100%;height:100%}*{font-family:Roboto,sans-serif;box-sizing:border-box}:root{--container-height:700px;--controls-container-height:115px}.main-container{width:900px;height:var(--container-height);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.controls-container{height:var(--controls-container-height);padding-top:15px;box-sizing:border-box}.video-container{height:calc(var(--container-height) - var(--controls-container-height));padding:20px}.video-container video{height:100%;width:100%}.btn{border:1px solid #ccc;background-color:#fff;outline:none;padding:10px 20px;border-radius:4px;margin:0;font-size:16px;text-transform:uppercase;cursor:pointer;text-decoration:none}.btn-disabled,.btn:disabled{color:#ccc}.btn+.btn{margin-left:10px}.btn-group{margin-top:15px}.alert-message,.btn-group,.switch-group{text-align:center}.alert-message{color:#fff;background-color:#ff1744;width:100%;position:absolute;top:0;left:0;height:50px;font-size:18px;line-height:50px;display:none}#webcam{position:absolute;height:120px;right:40px;bottom:40px;opacity:0}#video-merge-area{position:fixed;z-index:1;top:0;left:0;width:0;height:0;overflow:hidden;opacity:0}