.toolbar{height:84px;transition:all .3s;position:absolute;bottom:15px;left:50%;overflow:hidden;transform:translate(-50%)}.toolbar.close{width:60px;height:24px;bottom:0}.toolbar.close>.container>.toggleToolbarBox>.toggleToolbarBtn>img{transform:rotate(0)}.toolbar>.container{text-align:center;background:#141414;border-radius:6px;gap:8px;margin:24px auto 0;padding:6px;transition:all .4s;display:flex;position:relative;box-shadow:0 2px 8px 4px #00000040,0 0 0 1px #00000026}.toolbar>.container>.toggleToolbarBox{text-align:center;margin:0 auto;position:absolute;top:0%;left:50%;transform:translate(-50%,-100%)}.toolbar>.container>.toggleToolbarBox>.toggleToolbarBtn{cursor:pointer;background:#141414;border-radius:7px 7px 0 0;width:60px;height:24px}.toolbar>.container>.toggleToolbarBox>.toggleToolbarBtn>img{width:100%;max-width:100%;height:100%;max-height:100%;padding:5px;transition:all .2s ease-in;display:inline-block;transform:rotate(180deg)}.toolbar>.container>.toolbarBtn{cursor:pointer;border-radius:3px;width:48px;height:48px;padding:11.5px}.toolbar>.container>.toolbarBtn:hover{background:#fff3}.toolbar>.container>.toolbarBtn:disabled,.toolbar>.container>.toolbarBtn[disabled]{cursor:not-allowed;background:0 0}.toolbar>.container>.toolbarBtn>img{width:100%;min-width:100%;height:100%;min-height:100%}
.viscaBox{background-color:#b5b5b5;border:1px solid #353535;border-radius:5px;grid-template-columns:auto auto;gap:1px}.viscaBox>div{background-color:#141414}.viscaBox>div.cameraBox{grid-area:1/1/span 1/span 2;gap:8px;padding:8px;display:flex}.viscaBox>div.directionBox>button.left:after,.viscaBox>div.directionBox>button.down:after,.viscaBox>div.directionBox>button.right:after,.viscaBox>div.directionBox>button.up:after{content:"";border-bottom:12px solid #fff;border-left:6px solid #0000;border-right:6px solid #0000;width:0;height:0;position:absolute;top:50%;left:50%}.viscaBox>div.directionBox{grid-template-areas:".up.""left reset right"".down.";display:grid}.viscaBox>div.directionBox>button{border-radius:5%;width:40px;padding-bottom:40px;position:relative}.viscaBox>div.directionBox>button:hover{background-color:#7d7d7d}.viscaBox>div.directionBox>button.up{grid-area:up}.viscaBox>div.directionBox>button.up:after{transform:translate(-50%,-50%)rotate(0)}.viscaBox>div.directionBox>button.right{grid-area:right}.viscaBox>div.directionBox>button.right:after{transform:translate(-50%,-50%)rotate(90deg)}.viscaBox>div.directionBox>button.down{grid-area:down}.viscaBox>div.directionBox>button.down:after{transform:translate(-50%,-50%)rotate(180deg)}.viscaBox>div.directionBox>button.left{grid-area:left}.viscaBox>div.directionBox>button.left:after{transform:translate(-50%,-50%)rotate(270deg)}.viscaBox>div.directionBox>button.reset{grid-area:reset}.viscaBox>div.directionBox>button.reset:after{content:"";background:url(/images/Icons_center.svg) 50% no-repeat;width:14px;height:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.viscaBox>div.distanceBox{flex-direction:column;justify-content:space-around;align-items:center;height:100%;display:flex}.viscaBox>div.distanceBox>button{border-radius:5%;width:40px;padding-bottom:40px;position:relative}.viscaBox>div.distanceBox>button:hover{background-color:#7d7d7d}.viscaBox>div.distanceBox>button:after{content:"";width:26px;height:26px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.viscaBox>div.distanceBox>button.zoomIn:after{background:url(/images/Icons_Plus.svg) 50% no-repeat}.viscaBox>div.distanceBox>button.zoomOut:after{background:url(/images/Icons_Minus.svg) 50% no-repeat}
.toolbar-container{z-index:1;background:#000;border-radius:0 6px 6px 0;flex-direction:column;width:80px;padding:10px 24px 10px 6px;transition-duration:.5s;display:flex;position:absolute;top:50%;left:-54px;transform:translateY(-50%)}.show-menu-icon{z-index:2;cursor:pointer;width:24px;transition-duration:.5s;position:absolute;top:50%;right:0;transform:translateY(-50%)}.show-menu-icon.active{transform:rotate(180deg)translateY(50%)}.toolbar-btn{cursor:pointer;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.toolbar-btn:hover{background-color:#424446}.toolbar-btn.hide{display:none!important}.toolbar-btn img{width:25px}.toolbar-btn.bg-red{color:#fff;background:red}.toolbar-btn.active{background:#e23143}.toolbar-btn.active:hover{background:#a51726}.toolbar-btn:disabled{cursor:not-allowed;background-color:#c2c2c2!important}
