

.tools-screen-layer {
  flex: 1;
  align-self: center;
  text-align: center;
  font-size: var(--fs-small);
  position: relative;
  cursor: pointer;
}
.tools-screen-layer .anticon {
  padding-right: 5px;
}
.tools-screen-layer .defualt-fullscreen-icon {
  position: relative;
  top: 1px;
  font-size: 16px;
}

.picture-tools {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);
}
.picture-tools.actions-change-rotate {
  bottom: 150px;
}
.picture-tools > div {
  width: 30px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  cursor: pointer;
}
.picture-tools > div.disabled {
  cursor: not-allowed;
  color: #999;
}
.picture-tools > div.disabled .anticon {
  color: #999;
}
.picture-actions {
  position: absolute;
  top: 8px;
  right: 8px;
}
.picture-actions > div {
  width: 28px;
  height: 28px;
  line-height: 28px;
  background: #fff;
  float: left;
  text-align: center;
  margin-left: 4px;
  cursor: pointer;
}
.picture-actions .tools-screen-layer .anticon {
  padding-right: 0;
}

.select-rect-menu-layout {
  position: absolute;
  font-size: var(--fs-small);
  width: 105px;
  overflow: hidden;
}
.select-rect-menu-layout .menu-action-item {
  padding: 4px 10px;
  background: #ffffff;
  margin-bottom: 4px;
  border-radius: 15px;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
  color: rgba(0, 0, 0, 0.65);
  white-space: nowrap;
}
.select-rect-menu-layout .menu-action-item .anticon {
  padding-right: 2px;
  font-size: 16px;
  color: #89b;
}
.select-rect-menu-layout .menu-action-item:hover {
  background: #ffaa00;
  color: #fff;
  cursor: pointer;
}
.select-rect-menu-layout .menu-action-item:hover .anticon {
  color: #fff;
}
.select-rect-menu-layout .menu-action-item:last-child {
  margin-bottom: 0;
}

.select-rect-layout {
  box-shadow: 0 0 0 9999em rgba(0, 0, 0, 0.4);
  border: 1px solid;
  border-image-source: url('data:image/gif;base64,R0lGODlhCgAKAJECAAAAAP///////wAAACH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OEI5RDc5MTFDNkE2MTFFM0JCMDZEODI2QTI4MzJBOTIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OEI5RDc5MTBDNkE2MTFFM0JCMDZEODI2QTI4MzJBOTIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuZGlkOjAyODAxMTc0MDcyMDY4MTE4MDgzQzNDMjA5MzREQ0ZDIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAyODAxMTc0MDcyMDY4MTE4MDgzQzNDMjA5MzREQ0ZDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEBQoAAgAsAAAAAAoACgAAAhWEERkn7W3ei7KlagMWF/dKgYeyGAUAIfkEBQoAAgAsAAAAAAoACgAAAg+UYwLJ7RnQm7QmsCyVKhUAIfkEBQoAAgAsAAAAAAoACgAAAhCUYgLJHdiinNSAVfOEKoUCACH5BAUKAAIALAAAAAAKAAoAAAIRVISAdusPo3RAzYtjaMIaUQAAIfkEBQoAAgAsAAAAAAoACgAAAg+MDiem7Q8bSLFaG5il6xQAIfkEBQoAAgAsAAAAAAoACgAAAg+UYRLJ7QnQm7SmsCyVKhUAIfkEBQoAAgAsAAAAAAoACgAAAhCUYBLJDdiinNSEVfOEKoECACH5BAUKAAIALAAAAAAKAAoAAAIRFISBdusPo3RBzYsjaMIaUQAAOw==');
  border-image-repeat: repeat;
  border-image-slice: 1;
  position: absolute;
}

.rect-item-face-wrapper .rect-item {
  border-color: rgba(255, 95, 87, 0.6);
}
.rect-item-face-wrapper .rect-item .border-top-decorator::before {
  border-top-color: #ff5f57;
  border-left-color: #ff5f57;
}
.rect-item-face-wrapper .rect-item .border-top-decorator::after {
  border-top-color: #ff5f57;
  border-right-color: #ff5f57;
}
.rect-item-face-wrapper .rect-item .border-bottom-decorator::before {
  border-bottom-color: #ff5f57;
  border-left-color: #ff5f57;
}
.rect-item-face-wrapper .rect-item .border-bottom-decorator::after {
  border-bottom-color: #ff5f57;
  border-right-color: #ff5f57;
}
.rect-item-face-wrapper .rect-item:hover {
  border-color: #ff5f57;
  box-shadow: inset 0 0 24px 0 rgba(255, 95, 87, 0.4);
}
.rect-item-face-wrapper .rect-info-list-wrapper .data-type .data-tag {
  border: 1px solid #FF5F57;
  background: rgba(255, 95, 87, 0.6);
}
.rect-item-body-wrapper .rect-item {
  border-color: rgba(255, 187, 34, 0.6);
}
.rect-item-body-wrapper .rect-item .border-top-decorator::before {
  border-top-color: #ffbb22;
  border-left-color: #ffbb22;
}
.rect-item-body-wrapper .rect-item .border-top-decorator::after {
  border-top-color: #ffbb22;
  border-right-color: #ffbb22;
}
.rect-item-body-wrapper .rect-item .border-bottom-decorator::before {
  border-bottom-color: #ffbb22;
  border-left-color: #ffbb22;
}
.rect-item-body-wrapper .rect-item .border-bottom-decorator::after {
  border-bottom-color: #ffbb22;
  border-right-color: #ffbb22;
}
.rect-item-body-wrapper .rect-item:hover {
  border-color: #ffbb22;
  box-shadow: inset 0 0 24px 0 rgba(255, 187, 34, 0.4);
}
.rect-item-body-wrapper .rect-info-list-wrapper .data-type .data-tag {
  border: 1px solid #FFBB22;
  background: rgba(255, 187, 34, 0.6);
}
.rect-item-vehicle-wrapper .rect-item {
  border-color: rgba(68, 170, 255, 0.6);
}
.rect-item-vehicle-wrapper .rect-item .border-top-decorator::before {
  border-top-color: #44aaff;
  border-left-color: #44aaff;
}
.rect-item-vehicle-wrapper .rect-item .border-top-decorator::after {
  border-top-color: #44aaff;
  border-right-color: #44aaff;
}
.rect-item-vehicle-wrapper .rect-item .border-bottom-decorator::before {
  border-bottom-color: #44aaff;
  border-left-color: #44aaff;
}
.rect-item-vehicle-wrapper .rect-item .border-bottom-decorator::after {
  border-bottom-color: #44aaff;
  border-right-color: #44aaff;
}
.rect-item-vehicle-wrapper .rect-item:hover {
  border-color: #44aaff;
  box-shadow: inset 0 0 24px 0 rgba(68, 170, 255, 0.4);
}
.rect-item-vehicle-wrapper .rect-info-list-wrapper .data-type .data-tag {
  border: 1px solid #44AAFF;
  background: rgba(68, 170, 255, 0.6);
}
.rect-item-nonVehicle-wrapper .rect-item {
  border-color: rgba(80, 233, 178, 0.6);
}
.rect-item-nonVehicle-wrapper .rect-item .border-top-decorator::before {
  border-top-color: #50e9b2;
  border-left-color: #50e9b2;
}
.rect-item-nonVehicle-wrapper .rect-item .border-top-decorator::after {
  border-top-color: #50e9b2;
  border-right-color: #50e9b2;
}
.rect-item-nonVehicle-wrapper .rect-item .border-bottom-decorator::before {
  border-bottom-color: #50e9b2;
  border-left-color: #50e9b2;
}
.rect-item-nonVehicle-wrapper .rect-item .border-bottom-decorator::after {
  border-bottom-color: #50e9b2;
  border-right-color: #50e9b2;
}
.rect-item-nonVehicle-wrapper .rect-item:hover {
  border-color: #50e9b2;
  box-shadow: inset 0 0 24px 0 rgba(80, 233, 178, 0.4);
}
.rect-item-nonVehicle-wrapper .rect-info-list-wrapper .data-type .data-tag {
  border: 1px solid #50E9B2;
  background: rgba(80, 233, 178, 0.6);
}
.rect-item-thing-wrapper .rect-item {
  border-color: rgba(185, 70, 210, 0.6);
}
.rect-item-thing-wrapper .rect-item .border-top-decorator::before {
  border-top-color: #b946d2;
  border-left-color: #b946d2;
}
.rect-item-thing-wrapper .rect-item .border-top-decorator::after {
  border-top-color: #b946d2;
  border-right-color: #b946d2;
}
.rect-item-thing-wrapper .rect-item .border-bottom-decorator::before {
  border-bottom-color: #b946d2;
  border-left-color: #b946d2;
}
.rect-item-thing-wrapper .rect-item .border-bottom-decorator::after {
  border-bottom-color: #b946d2;
  border-right-color: #b946d2;
}
.rect-item-thing-wrapper .rect-item:hover {
  border-color: #b946d2;
  box-shadow: inset 0 0 24px 0 rgba(185, 70, 210, 0.4);
}
.rect-item-thing-wrapper .rect-info-list-wrapper .data-type .data-tag {
  border: 1px solid #b946d2;
  background: rgba(185, 70, 210, 0.6);
}
.rect-item {
  position: absolute;
  border-width: 1px;
  border-style: solid;
  cursor: pointer;
}
.rect-item .border-top-decorator,
.rect-item .border-bottom-decorator {
  position: absolute;
  pointer-events: none;
  width: 100%;
}
.rect-item .border-top-decorator::before,
.rect-item .border-bottom-decorator::before,
.rect-item .border-top-decorator::after,
.rect-item .border-bottom-decorator::after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border: 2px solid transparent;
}
.rect-item .border-top-decorator::before,
.rect-item .border-bottom-decorator::before {
  float: left;
  margin-left: -1px;
}
.rect-item .border-top-decorator::after,
.rect-item .border-bottom-decorator::after {
  float: right;
  margin-right: -1px;
}
.rect-item .border-top-decorator {
  top: 0;
}
.rect-item .border-top-decorator::before,
.rect-item .border-top-decorator::after {
  margin-top: -1px;
}
.rect-item .border-bottom-decorator {
  bottom: 0;
}
.rect-item .border-bottom-decorator::before,
.rect-item .border-bottom-decorator::after {
  margin-bottom: -1px;
}
.rect-item:hover + .rect-info-list-wrapper {
  display: block;
}
.rect-info-list-wrapper {
  display: none;
  background: rgba(16, 21, 36, 0.8);
  position: absolute;
  z-index: 11;
  border: 1px solid transparent;
  padding-top: 5px;
  /*高低质量*/
}
.rect-info-list-wrapper .data-type {
  padding: 0 5px;
  color: #fff;
}
.rect-info-list-wrapper .data-type .data-tag {
  padding: 4px;
  font-size: 12px;
  margin-right: 4px;
}
.rect-info-list-wrapper .data-type .data-tag .anticon {
  margin-right: 4px;
  color: #fff;
}
.rect-info-list-wrapper .rect-card-corner {
  position: absolute;
  top: -9px;
  left: -1px;
}
.rect-info-list-wrapper .rect-info-arrow {
  position: absolute;
  display: block;
  background: transparent;
  border-style: solid;
  border-width: 4px;
  border-color: rgba(16, 21, 36, 0.8);
  transform: rotate(45deg);
  left: -4px;
  top: 6px;
}
.rect-info-list-wrapper .rect-info-list {
  height: 100%;
  border-radius: 2px;
  padding: 3px 10px;
}
.rect-info-list-wrapper .rect-info-list .info-item {
  padding: 3px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 18px;
  font-size: var(--fs-small);
  color: #fff;
}
.rect-info-list-wrapper .rect-info-list .info-item .anticon {
  position: relative;
  top: 1px;
  cursor: default;
  font-size: 16px;
  color: #fff;
  padding-right: 4px;
}
.rect-info-list-wrapper .rect-info-list .info-item .item-label {
  margin: 0 4px;
}

.picture-view-layout {
  position: relative;
  overflow: hidden;
  user-select: none;
  min-height: 300px;
}
.picture-view-layout .scale-draw-area-canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
.picture-view-layout .picture-move-layout > div {
  width: 100%;
  height: 100%;
  transition: all 0.3s;
  overflow: hidden;
}



.lm-between-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.info-box-layout {
  width: 100%;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
}
.info-box-layout .info-box-title-wrapper {
  background-color: var(--content-info-box-title-bg);
  border: 1px solid var(--content-info-box-title-bd);
  border-bottom: none;
  height: var(--content-info-box-title-height);
  line-height: var(--content-info-box-title-height);
  min-height: max-content;
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-weight: 700;
}
.info-box-layout .info-box-content-wrapper {
  background-color: var(--content-info-box-bg);
  border: 1px solid var(--content-info-box-bd-color);
  flex: 1;
}

.capture-img-view-layout {
  margin: 0 !important;
  height: 100%;
}
.capture-img-view-layout .capture-bar-layout {
  padding: 10px 0;
  height: 48px;
  line-height: 28px;
  text-align: center;
  width: 100%;
  position: relative;
}
.capture-img-view-layout .capture-bar-layout .ant-btn {
  margin-left: 8px;
  font-size: var(--fs);
}
.capture-img-view-layout .capture-bar-layout .ant-btn i {
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  font-size: 16px;
  color: #89b;
  position: relative;
  top: 1px;
}
.capture-img-view-layout .capture-bar-layout .ant-btn:hover i,
.capture-img-view-layout .capture-bar-layout .ant-btn:focus i {
  color: var(--primary);
}
.capture-img-view-layout .capture-bar-layout .rect-switch-box {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 8px;
  width: 200px;
  height: 100px;
}
.capture-img-view-layout .capture-bar-layout .rect-switch {
  position: unset;
  font-size: var(--fs);
  color: var(--text-dark);
}
.capture-img-view-layout .capture-bar-layout .rect-switch .ant-switch {
  margin-right: 8px;
  top: -1px;
}

.two-column-layout-container {
  width: 100%;
  height: 100%;
  position: relative;
  color: var(--content-two-column-box-color);
}
.two-column-layout-container .two-column-aside {
  transition: width 0.1s ease-in;
  width: var(--sider-size);
  height: 100%;
  z-index: 9;
  position: absolute;
  left: 0;
  top: 0;
}
.two-column-layout-container .two-column-aside .two-colum-left-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.two-column-layout-container .two-column-aside .two-colum-left-content {
  width: var(--sider-size);
  height: 100%;
  background-color: var(--content-two-column-box-left-bg);
}
.two-column-layout-container .two-column-aside .left-aside-slider-btn {
  position: absolute;
  width: 16px;
  height: 20px;
  right: -16px;
  top: 50%;
  margin-top: -8px;
  font-size: var(--fs-large);
  cursor: pointer;
  background-color: red;
}
.two-column-layout-container .two-column-aside .left-aside-slider-btn .anticon {
  background: var(--content-two-column-box-left-bg);
  vertical-align: unset;
  position: relative;
  z-index: 3;
}
.two-column-layout-container .two-column-aside .left-aside-slider-btn:before,
.two-column-layout-container .two-column-aside .left-aside-slider-btn:after {
  content: '';
  width: 100%;
  height: 100%;
  z-index: 2;
  background-color: var(--content-two-column-box-left-bg);
  position: absolute;
}
.two-column-layout-container .two-column-aside .left-aside-slider-btn:before {
  left: 0;
  bottom: -10px;
  transform: skewY(-20deg);
}
.two-column-layout-container .two-column-aside .left-aside-slider-btn:after {
  right: 0;
  top: -10px;
  transform: skewY(20deg);
}
.two-column-layout-container .two-column-aside.hide-left-aside {
  width: 0;
}
.two-column-layout-container .two-column-aside.hide-left-aside + .two-column-content {
  padding-left: 0;
}
.two-column-layout-container .two-column-content {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding-left: var(--sider-size);
  background-color: var(--content-two-column-box-right-bg);
  transition: padding-left 0.3s ease-in-out;
  box-sizing: border-box;
}

.content-bar-box {
  background-color: var(--content-tools-box-bg);
  align-items: center;
  padding: 0 24px;
}
.content-bar-box .mid-bar-content {
  flex: 1;
  overflow: hidden;
  text-align: center;
}
.content-bar-box .right-bar-content {
  text-align: right;
}

.card-mode-box .anticon {
  font-size: 16px;
}
.card-mode-box button.ant-btn {
  color: var(--icon);
}
.card-mode-box .ant-btn.select-mode-active {
  border-color: var(--primary);
  color: var(--primary);
}

.list-box-layout {
  width: 100%;
  background-color: var(--content-list-box-bg);
}
.list-box-layout .list-box-title-wrapper {
  background-color: var(--content-list-box-title-bg);
  border: 1px solid var(--content-list-box-title-bd);
  border-bottom: none;
  min-height: max-content;
  height: var(--content-list-box-title-height);
  line-height: var(--content-list-box-title-height);
  display: flex;
  align-items: center;
}
.list-box-layout .list-box-content-wrapper {
  border: 1px solid var(--content-list-box-bd-color);
}

.single-column-layout-container {
  width: 100%;
  height: 100%;
  background-color: var(--content-box-bg);
}
.single-column-layout-container .single-column-content {
  margin: 0 auto;
  height: 100%;
}

.marker-layout-high {
  animation: fade 600ms infinite;
  -webkit-animation: fade 600ms infinite;
}
.marker-layout-alarm img {
  width: 100%;
  height: 100%;
}
@keyframes fade {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fade {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}
.marker-cricle-layout-final {
  background: #2299ff !important;
}
.mark-begin-or-end {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.mark-begin-or-end-car {
  width: 35px;
  height: 35px;
  border-radius: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: fade 600ms infinite;
  -webkit-animation: fade 600ms infinite;
}
.marker-layout-high-move {
  animation: fade 600ms infinite;
  -webkit-animation: fade 600ms infinite;
  width: 24px;
  height: 24px;
  border-radius: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: red;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
}
.marker-layout-high-move img {
  width: 16px;
  height: 16px;
}
.marker-cricle-layout-policeman,
.marker-cricle-layout-car {
  width: 35px;
  height: 35px;
  font-size: 1rem;
}
.marker-cricle-layout-policeman img,
.marker-cricle-layout-car img {
  width: 100%;
  height: 100%;
}
.device-point {
  font-size: 0.5rem;
  white-space: nowrap;
  color: #fff;
  display: inline-block;
  padding: 2px 5px;
  transform: translateX(calc(18px - 50%));
}
.marker-cricle-layout-policeman .device-point {
  background: #908BE6;
}
.marker-cricle-layout-car .device-point {
  background: #54BEFF;
}
.marker-layout-direction {
  height: 35px;
  width: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.marker-layout-direction .marker-direction {
  height: 50px;
  width: 50px;
  position: absolute;
  border-radius: 0  100px 0 0;
}
.marker-layout-direction .marker-cricle-layout {
  z-index: 999;
}
.marker-direction-112901 {
  transform: translateX(50%) rotate(45deg);
}
.marker-direction-112902 {
  transform: translateX(-50%) rotate(-135deg);
}
.marker-direction-112903 {
  transform: translateY(50%) rotate(135deg);
}
.marker-direction-112904 {
  transform: translateY(-50%) rotate(-45deg);
}
.marker-direction-112905 {
  transform: rotate(90deg) translateY(-50%) translateX(50%);
}
.marker-direction-112906 {
  transform: translateY(-50%) translateX(50%);
}
.marker-direction-112907 {
  transform: rotate(-180deg) translateY(-50%) translateX(50%);
}
.marker-direction-112908 {
  transform: translateY(-50%) translateX(-50%) rotate(-90deg);
}

div .online-device {
  font-size: 16px;
  color: #17bc84;
}
div .offline-device {
  font-size: 16px;
  color: #a7aebc;
}

.lm-c-search-input input.ant-input {
  font-weight: normal;
}
.lm-c-search-input .ant-input-prefix > i,
.lm-c-search-input .ant-input-suffix > i {
  color: var(--icon);
  font-size: 16px;
}
.lm-c-search-input.c-search-12 input {
  height: 28px;
  font-size: var(--fs-small);
  padding: 7px 11px;
}
.lm-c-search-input.c-search-14 input {
  height: 32px;
  font-size: var(--fs-default);
  padding: 8px 13px;
}

.lm-c-label-value-layout {
  display: inline-flex;
}
.lm-c-label-value-layout span:first-child {
  white-space: nowrap;
  padding-right: 4px;
}
.lm-c-label-value-layout span:last-child {
  flex: 1;
}
.lm-c-label-value-layout span:last-child.no-wrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.leaflet-wrapper-layout {
  width: 100%;
  height: 100%;
}
.leaflet-wrapper-layout .leaflet-map-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}
.leaflet-wrapper-layout .map-select-cursor .leaflet-container {
  cursor: crosshair !important;
}
.leaflet-wrapper-layout .map-select-cursor .leaflet-container * {
  cursor: crosshair !important;
}
.leaflet-wrapper-layout .leaflet-container {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}
.leaflet-wrapper-layout .leaflet-div-icon {
  background: transparent;
  border: none;
}
.leaflet-wrapper-layout .marker-layout {
  width: 35px;
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.leaflet-wrapper-layout .addict-place-marker-layout {
  width: 30px;
  height: 30px;
}
.leaflet-wrapper-layout .addict-place-marker-layout img {
  width: 100%;
  height: 100%;
}
.leaflet-wrapper-layout .distance-layout-index {
  width: 68px;
  height: 18px;
  font-size: var(--fs-small);
  line-height: 16px;
  text-align: center;
  border: 1px solid #6696d8;
  border-radius: 9px;
  color: #fff;
  background: #189ddb;
}
.leaflet-wrapper-layout .marker-center-layout {
  text-align: center;
  width: 32px;
  height: 42px;
  margin-top: -10px;
}
.leaflet-wrapper-layout .marker-center-layout > div {
  width: 100%;
  height: 100%;
  padding-top: 6px;
}
.leaflet-wrapper-layout .marker-center-layout .onLine {
  background: url('/micro-apps/micro-dep-librarys/images/map/Place_icon_OnLine_Normal.svg') no-repeat;
}
.leaflet-wrapper-layout .marker-center-layout .onLine:hover {
  background: url('/micro-apps/micro-dep-librarys/images/map/Place_icon_OnLine_Hover.svg') no-repeat;
}
.leaflet-wrapper-layout .marker-center-layout .outLine {
  background: url('/micro-apps/micro-dep-librarys/images/map/Place_icon_OutLine_Normal.svg') no-repeat;
}
.leaflet-wrapper-layout .marker-center-layout .outLine:hover {
  background: url(/micro-apps/micro-dep-librarys/images/map/Place_icon_OutLine_Hover.svg) no-repeat;
}
.leaflet-wrapper-layout .single-device-hover {
  height: max-content;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.leaflet-wrapper-layout .single-device-hover .marker-title {
  white-space: nowrap;
}
.leaflet-wrapper-layout .marker-cricle-layout {
  width: 24px;
  height: 24px;
  border-radius: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
}
.leaflet-wrapper-layout .marker-cricle-layout img {
  width: 16px;
  height: 16px;
}
.leaflet-wrapper-layout .marker-interest-layout {
  width: 30px;
  height: 30px;
  border-radius: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
}
.leaflet-wrapper-layout .marker-interest-layout img {
  width: 20px;
  height: 20px;
}
.leaflet-wrapper-layout .map-sigle-device-popup {
  pointer-events: none;
}
.leaflet-wrapper-layout .marker-popup-layout {
  z-index: 99;
}
.leaflet-wrapper-layout .marker-popup-layout .leaflet-popup-content-wrapper {
  border-radius: unset;
  box-shadow: none;
  background: transparent;
}
.leaflet-wrapper-layout .marker-popup-layout .leaflet-popup-content {
  margin: 6px 10px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
  width: 200px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .task-img {
  width: 194px;
  height: 156px;
  background-color: white;
  box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.1);
  padding: 3px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .task-img img {
  width: 187px;
  height: 143px;
  display: block;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .marker-title {
  background: #fff;
  padding: 5px 10px;
  width: max-content;
  position: relative;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .marker-icon {
  position: absolute;
  top: 42px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .jump-group {
  padding-top: 42px;
  width: max-content;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .jump-group .anticon {
  pointer-events: all;
  width: 30px;
  height: 30px;
  border-radius: 15px;
  background: #fff;
  padding-top: 7px;
  font-size: 16px;
  margin-right: 5px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
  color: #189ddb;
  transition: all 0.3s;
  cursor: pointer;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .jump-group .anticon:hover {
  background: #189ddb;
  color: #fff;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-single-content .jump-group .anticon:last-child {
  margin-right: 0;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content {
  background: #fff;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  position: relative;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-layout {
  overflow: auto;
  height: 180px;
  width: 300px;
  padding: 10px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-search-input {
  padding: 10px 10px 0 10px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item {
  height: 24px;
  line-height: 24px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  padding: 0 5px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item .mutiple-item-title {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item .mutiple-item-title .anticon {
  padding-right: 4px;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item .mutiple-jump-item {
  width: 0;
  overflow: hidden;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item .mutiple-jump-item .anticon {
  width: 20px;
  height: 20px;
  line-height: 24px;
  background: transparent;
  border: none;
  font-size: 16px;
  margin: 0;
  margin-left: 5px;
  color: #8899bb;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item .mutiple-jump-item .anticon:hover {
  color: #189ddb;
  border: none;
  background: transparent;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item:hover {
  background: #eee;
}
.leaflet-wrapper-layout .marker-popup-layout .marker-popup-mutiple-content .mutiple-device-item:hover .mutiple-jump-item {
  width: auto;
}
.leaflet-wrapper-layout .marker-popup-layout .leaflet-popup-tip {
  display: none;
}
.marker-popup-image .leaflet-popup-content-wrapper {
  border-radius: unset;
  background: transparent;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
  margin: 0;
  padding: 0;
}
.marker-popup-image .leaflet-popup-content-wrapper .leaflet-popup-content {
  box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.1);
  margin: 0;
  padding: 0;
}
.marker-popup-image .leaflet-popup-tip-container {
  display: none;
}
.marker-popup-layout.camera-video-popup-layout {
  background: #000;
  height: 480px;
  z-index: 100;
}
.marker-popup-layout.camera-video-popup-layout .leaflet-popup-content-wrapper {
  height: 100%;
  padding: 0;
}
.marker-popup-layout.camera-video-popup-layout .leaflet-popup-content-wrapper .leaflet-popup-content {
  margin: 0;
  height: 100%;
}
.marker-popup-layout.camera-video-popup-layout .leaflet-popup-content-wrapper .leaflet-popup-content > div {
  height: 100%;
}
.marker-popup-layout.camera-video-popup-layout .leaflet-popup-tip {
  display: block !important;
  background-color: #000;
  box-shadow: unset;
}
.camera-video-popup-layouts {
  background: #fff;
  height: auto !important;
  z-index: 10;
  padding: 0px;
}
.camera-video-popup-layouts .leaflet-popup-content-wrapper {
  height: 100%;
  padding: 0;
}
.camera-video-popup-layouts .leaflet-popup-content-wrapper .leaflet-popup-content {
  margin: 0;
  width: auto !important;
  height: 100%;
}
.camera-video-popup-layouts .leaflet-popup-content-wrapper .leaflet-popup-content > div {
  height: 100%;
}
.marker-layout-index {
  width: 24px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: url('/micro-apps/micro-dep-librarys/images/map/person-map-icon.svg') no-repeat;
  background-size: 24px 32px;
  color: #fff;
  padding-bottom: 8px;
  font-size: var(--fs);
  font-weight: bold;
}
.marker-layout-index.marker-layout-place-center {
  background: url('/micro-apps/micro-dep-librarys/images/map/place-center.svg') no-repeat;
  background-size: 24px 32px;
}
.marker-layout-index.marker-layout-point-yellow {
  background: url('/micro-apps/micro-dep-librarys/images/Place_icon_OnLine_Normal.svg') no-repeat;
  background-size: 24px 32px;
}
.points-new-exist-place .img-box {
  cursor: pointer;
  background: #eee;
  width: 100px;
  height: 134px;
  position: relative;
}
.points-new-exist-place .img-box img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 100% !important;
  max-height: 100% !important;
}
.trajectory-popup-layout .leaflet-popup-content-wrapper {
  background: #fff !important;
}
.trajectory-popup-layout .leaflet-popup-content {
  margin: 5px !important;
}
.trajectory-popup-layout .trajectory-popup-layout-content {
  width: 100%;
  height: 100px;
  background-color: var(--bg-lv2) !important;
  overflow: hidden;
  display: flex;
  justify-content: center;
  position: relative;
}
.trajectory-popup-layout .trajectory-popup-layout-content img {
  max-width: 100%;
  margin: 0 auto;
  max-height: 100px;
  height: initial;
  z-index: 9;
  object-fit: contain;
}
.place-feq-marker-layer {
  width: 27px;
  height: 37px;
}
.place-feq-marker-layer .feq-place-icon {
  height: 100%;
  background: url(/micro-apps/micro-dep-librarys/images/place/Place_Avatar_Normal.svg) no-repeat center center;
  background-size: 100%;
}
.place-feq-marker-layer .feq-place-icon:hover {
  background-image: url(/micro-apps/micro-dep-librarys/images/place/Place_Avatar_Hover.svg);
}
.map-arrow-base {
  position: absolute;
  content: '';
  width: 10px;
  height: 10px;
  padding: 1px;
  background: #fff;
  left: 50%;
  margin-left: -4px;
  transform: rotate(45deg);
}
.arrow-map-layout {
  background: #fff;
}
.arrow-map-layout:after {
  position: absolute;
  content: '';
  width: 10px;
  height: 10px;
  padding: 1px;
  background: #fff;
  left: 50%;
  margin-left: -4px;
  transform: rotate(45deg);
  bottom: -5px;
}
.arrow-map-layout.has-icon-group:after {
  position: absolute;
  content: '';
  width: 10px;
  height: 10px;
  padding: 1px;
  background: #fff;
  left: 50%;
  margin-left: -4px;
  transform: rotate(45deg);
  bottom: 22px;
}
.map-loop-tools-item {
  width: 206px;
  display: flex;
  height: 36px;
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 99;
  text-align: center;
  background-color: #fff;
  color: #62708b;
  font-size: 14px;
}
.map-loop-tools-item .map-loop-left {
  width: 60%;
  line-height: 36px;
  cursor: pointer;
}
.map-loop-tools-item .map-loop-right {
  width: 40%;
  line-height: 30px;
  border-left: 1px solid #dbe1ea;
}
.map-loop-tools {
  width: 284px;
  display: flex;
  height: 36px;
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 99;
  text-align: center;
  background-color: #fff;
  color: #62708b;
  font-size: 12px;
  cursor: pointer;
}
.map-loop-tools .tools-left {
  width: 40%;
  line-height: 36px;
  border-right: 1px solid #dbe1ea;
}
.map-loop-tools .tools-right {
  width: 20%;
  line-height: 36px;
}
.ulList {
  position: absolute;
  top: 63px;
  right: 103px;
  z-index: 99;
  background-color: #fff;
  width: 127px;
  height: 121px;
  font-size: 12px;
  display: block;
  padding: 13px;
}
.ulList .liList {
  height: 25%;
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.noshow {
  display: none;
}
.show {
  display: block;
}
.map-icon {
  margin-right: 10px;
}
.lm-tl-judgement-marker-layout-index {
  width: 28px;
  height: 40px;
}
.lm-tl-judgement-marker-layout-index img {
  width: 100%;
  height: 100%;
}

.tools-resource-layer {
  user-select: none;
  width: 100px;
  font-size: var(--fs-small);
  position: absolute;
  right: 10px;
  top: 10px;
  background: #fff;
  padding: 10px;
  box-shadow: 2px 4px 10px 0 rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  z-index: 2;
  cursor: pointer;
  flex: 1;
  text-align: center;
  align-self: center;
}
.tools-resource-layer .anticon {
  color: #8899bb;
  font-size: 16px;
  position: relative;
  top: 2px;
}
.tools-resource-layer .anticon:first-child {
  padding-right: 5px;
}
.tools-resource-layer:hover .anticon {
  color: #8899bb;
}
.tools-resource-layer:hover:hover {
  color: #189ddb;
}
.tools-resource-layer:hover:hover .anticon {
  color: #189ddb;
}
.resource-popup-layout .ant-popover-inner-content {
  padding: 0;
}
.resource-popup-layout .map-type-popup-layout {
  width: 296px;
  user-select: none;
  font-size: #189ddb;
  padding: 12px;
  box-shadow: 1px 2px 8px 0 rgba(0, 0, 0, 0.2);
}
.resource-popup-layout .map-type-popup-layout .type-part {
  margin: 10px 0;
}
.resource-popup-layout .map-type-popup-layout .type-part:first-child {
  margin-top: 0;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-name {
  padding: 5px 0;
  border-bottom: 1px solid #eaedf1;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding-top: 10px;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item {
  width: 68px;
  padding: 0 10px 10px;
  text-align: center;
  cursor: pointer;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item .lable-text {
  color: #6696d8;
  padding-top: 4px;
  display: block;
  width: 100%;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item .icon {
  display: inline-block;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-align: center;
  border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  overflow: hidden;
  border-color: #B1B6BE;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item .icon .anticon {
  font-size: 16px;
  top: 0;
  padding-right: 0;
  color: #8899bb;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item.active .icon {
  background: #189ddb;
}
.resource-popup-layout .map-type-popup-layout .type-part .type-content .type-item.active .icon .anticon {
  color: #fff;
}
.resource-popup-layout .map-type-popup-layout .type-part:last-child .type-content .type-item {
  padding-bottom: 0;
}

.map-reset-tool {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 3;
  padding: 5px 0;
  background: #ffffff;
}
.map-reset-tool .map-reset,
.map-reset-tool .map-zoom {
  background: #ffffff;
}
.map-reset-tool .map-zoom {
  margin-bottom: 0;
}
.map-reset-tool .map-tool-icon {
  width: 30px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #8899bb;
  cursor: pointer;
}
.map-reset-tool .map-tool-icon:hover {
  color: #189ddb;
}
.map-rest-tools-popup .ant-popover-inner-content {
  padding: 4px 8px;
  font-size: var(--fs-small);
}

.leaflet-pane.leaflet-marker-pane .marker-cluster span {
  display: block;
  width: fit-content;
  min-width: 30px;
}
.map-select-layout .device-list-layout {
  width: 300px;
  height: calc(100% - 76px - 20px);
  z-index: 4;
  position: absolute;
  background: #fff;
  top: 76px;
  right: 20px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}
.map-select-layout .device-list-layout .device-item {
  cursor: auto;
}
.map-select-layout .map-search-pio {
  position: absolute;
  left: 20px;
  top: 20px;
  z-index: 99;
  width: 200px;
}
.map-select-draw-tools {
  position: absolute;
  right: 20px;
  top: 20px;
  height: 36px;
  line-height: 36px;
  background: #fff;
  width: 300px;
  cursor: auto;
  z-index: 2;
}
.map-select-draw-tools .tools-layout {
  width: 100%;
  height: 100%;
  box-shadow: 2px 4px 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  display: flex;
  align-items: center;
}
.map-select-draw-tools .tools-layout > div {
  flex: 1;
  align-self: center;
  text-align: center;
  font-size: var(--fs-small);
  position: relative;
  height: 100%;
  cursor: pointer;
}
.map-select-draw-tools .tools-layout > div .anticon {
  padding-right: 5px;
  color: #8899bb;
}
.map-select-draw-tools .tools-layout > div:hover {
  color: #189ddb;
}
.map-select-draw-tools .tools-layout > div:hover .anticon {
  color: #189ddb;
}
.map-select-draw-tools .tools-layout > div:before {
  content: '';
  position: absolute;
  width: 1px;
  height: 90%;
  top: 5%;
  left: 0;
  background-image: #dbe1ea;
}
.map-select-draw-tools .tools-layout > div:first-child:before {
  content: none;
}
.map-select-draw-tools .tools-layout .draw-way {
  display: flex;
  justify-content: space-between;
}
.map-select-draw-operations {
  position: absolute;
  right: 20px;
  top: 20px;
  height: 44px;
  line-height: 44px;
  z-index: 2;
  display: flex;
  justify-content: space-around;
  box-shadow: 1px 1px 30px rgba(0, 0, 0, 0.2);
}
.map-select-draw-operations .popover-switch {
  padding: 0 13px;
  background: #ffffff;
  box-shadow: 2px 4px 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  text-align: center;
  font-size: var(--fs-small);
  display: flex;
  justify-content: center;
  align-items: center;
}
.map-select-draw-operations .popover-switch span {
  padding-right: 10px;
}
.map-select-draw-operations .tools-layout-operations {
  width: 460px;
  height: 100%;
  border-radius: 3px;
  display: flex;
  align-items: center;
  background: #fff;
  padding: 0 10px;
}
.map-select-draw-operations .tools-layout-operations > div {
  flex: auto;
  align-self: center;
  text-align: center;
  font-size: var(--fs-small);
  position: relative;
  height: 100%;
  cursor: pointer;
}
.map-select-draw-operations .tools-layout-operations > div .anticon {
  padding-right: 5px;
  color: #8899bb;
}
.map-select-draw-operations .tools-layout-operations > div:hover {
  color: #189ddb;
}
.map-select-draw-operations .tools-layout-operations > div:hover .anticon {
  color: #189ddb;
}
.map-select-draw-operations .tools-layout-operations > div:before {
  content: '';
  position: absolute;
  width: 1px;
  height: 90%;
  top: 5%;
  left: 0;
  background-image: #dbe1ea;
}
.map-select-draw-operations .tools-layout-operations > div:first-child:before {
  content: none;
}
.map-select-draw-operations .tools-layout-operations .last-tools-draw {
  margin-right: 10px;
}
.map-select-draw-operations .tools-layout-operations .draw-way {
  display: flex;
  justify-content: space-between;
}
.map-select-draw-operations .tools-layout-switch {
  width: 100px;
  text-align: center;
  height: 100%;
  background: #fff;
  box-shadow: 2px 4px 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  cursor: pointer;
}
.video-map-device-list-layout {
  width: 300px;
  height: 60%;
  position: absolute;
  background: #fff;
  top: 76px;
  right: 20px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
  z-index: 4;
}
.video-map-device-list-layout .device-list-layout {
  position: unset;
  width: 100%;
  height: calc(100% - 48px);
  box-shadow: none;
  border: none;
  border-bottom: 1px solid #dbe1ea;
}
.video-map-device-list-layout .s-link-tools {
  height: 48px;
}
.map-layout-checkbox-list {
  width: 126px;
}
.map-layout-checkbox-list p {
  margin-bottom: 0;
  padding: 6px 0;
  line-height: var(--fs-small);
  font-size: var(--fs-small);
  display: flex;
  align-items: center;
}
.map-layout-checkbox-list p > span {
  flex: 1;
  padding: 0 9px;
}

.lm-c-device-list-wrapper .list-item label .clear-item {
  display: none;
  cursor: pointer;
  font-size: var(--fs);
}
.lm-c-device-list-wrapper .list-item:hover .clear-item {
  display: inline-block;
}
.lm-c-device-list-wrapper .list-item .an-device-task {
  width: 250px;
  display: flex;
}
.lm-c-device-list-wrapper .list-item .an-device-task .an-device-task-operate {
  margin-right: 8px;
}
.lm-c-device-list-wrapper .list-item .an-device-task .an-device-task-operate .operateitem {
  margin-right: 14px;
  font-size: 14px;
}
.lm-c-device-list-wrapper .list-item .an-device-task .an-device-task-chose {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  margin-left: 46px;
}
.lm-c-device-list-wrapper .list-item .an-device-task .an-device-task-chose .operate-item {
  margin-right: 22px;
}

.lm-c-simple-list-layout {
  width: 100%;
  height: 100%;
}

.lm-c-normol-box {
  width: 100%;
  height: 100%;
}

.lm-c-tree-title-part {
  font-size: var(--fs-small);
  height: 42px;
  padding: 0 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.lm-c-tree-title-part .title-text {
  padding-right: 10px;
}
.lm-c-tree-title-part span:last-child {
  cursor: pointer;
}
.lm-c-tree-title-part .input-keword {
  flex: 1 1;
  height: 28px;
  position: relative;
  top: -1px;
}
.lm-c-tree-title-part .input-keword input {
  font-size: var(--fs-small);
}

.high-level {
  color: var(--primary-dark);
}

.lm-c-check-list-wrapper {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
  cursor: auto;
  border: 1px solid var(--bd-color);
  /*列表项*/
}
.lm-c-check-list-wrapper .lm-c-tree-title-part {
  border-bottom: 1px solid var(--bd-color);
  background-color: var(--form-bg-light);
}
.lm-c-check-list-wrapper .lm-c-check-list-filter-view {
  width: 100%;
  padding: 0 12px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.lm-c-check-list-wrapper .lm-c-check-list-filter-view > div {
  margin-top: 8px;
  width: 49%;
}
.lm-c-check-list-wrapper .list-checkall {
  height: 42px;
  line-height: 42px;
  padding: 0 18px;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--fs);
}
.lm-c-check-list-wrapper .list-checkall .anticon {
  font-size: 16px;
  cursor: pointer;
  color: var(--icon);
}
.lm-c-check-list-wrapper .list-checkall:after {
  position: absolute;
  content: '';
  left: 18px;
  bottom: 0;
  width: calc(100% - 32px);
  background-color: var(--bd-color);
  height: 1px;
}
.lm-c-check-list-wrapper .lm-c-base-list-layout {
  flex: 1;
  overflow: hidden;
}
.lm-c-check-list-wrapper .lm-c-virtual-layout {
  width: calc(100% - 5px);
  margin-right: 5px;
}
.lm-c-check-list-wrapper .list-item {
  cursor: pointer;
  height: 30px;
  line-height: 30px;
  color: var(--color);
  font-size: var(--fs-small);
  padding: 0 10px;
  /*有check-box*/
}
.lm-c-check-list-wrapper .list-item > label {
  margin: 0px;
  width: 100%;
  display: flex;
}
.lm-c-check-list-wrapper .list-item .item-info {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  font-size: var(--fs-small);
}
.lm-c-check-list-wrapper .list-item .item-info > .anticon {
  font-size: 16px;
  margin: 0 4px;
  position: relative;
  top: 2px;
}
.lm-c-check-list-wrapper .list-item:hover > label,
.lm-c-check-list-wrapper .list-item.list-item-active > label {
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
}
.lm-c-check-list-wrapper .list-item.has-check-box {
  padding: 0 10px;
}
.lm-c-check-list-wrapper .list-item.has-check-box label {
  padding: 0 4px;
}
.lm-c-check-list-wrapper .drag-up {
  -webkit-animation: dragup ease 0.2s 1;
  animation: dragup ease 0.2s 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.lm-c-check-list-wrapper .drag-down {
  -webkit-animation: dragdown ease 0.2s 1;
  animation: dragdown ease 0.2s 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes dragup {
  from {
    margin-top: 0px;
  }
  to {
    margin-top: 30px;
  }
}
@keyframes dragdown {
  from {
    margin-bottom: 0px;
  }
  to {
    margin-bottom: 30px;
  }
}
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
  background-color: transparent;
}

.map-trajectory-tools {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  height: 30px;
  padding: 0 10px;
  display: flex;
  align-items: center;
}
.map-trajectory-tools > div.tool-item {
  line-height: 30px;
  height: 100%;
  padding: 0 10px;
  cursor: pointer;
  user-select: none;
  font-size: var(--fs-small);
}
.map-trajectory-tools > div.tool-item.next-btn {
  margin-left: 12px;
}
.map-trajectory-tools > div.tool-item i {
  position: relative;
  top: 1px;
  padding-right: 4px;
  color: #8899bb;
  font-size: 16px;
}
.map-trajectory-tools > div.tool-item:hover i {
  color: #ffaa00;
}
.map-trajectory-tools > div.tool-item .ant-switch {
  height: 22px;
  width: 34px;
  margin: -3px 4px 0 0;
  min-width: auto;
}
.map-trajectory-tools > div.tool-item .ant-switch::after {
  width: 14px;
  height: 14px;
  top: 0px;
}

.lm-t-c-image-card {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: var(--image-card-bg);
}

.lm-tl-map-select-device-and-place .map-reset-tool {
  left: 10px;
  right: auto;
}
.lm-tl-map-select-device-and-place .device-place-box-container {
  height: 90%;
  position: absolute;
  z-index: 3;
  width: 600px;
  right: 20px;
  top: 60px;
  background-color: #fff;
  display: flex;
  flex-direction: row;
}
.lm-tl-map-select-device-and-place .device-place-box-container .place-and-devices-selected-box {
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.lm-tl-map-select-device-and-place .device-place-box-container .place-and-devices-selected-box > div {
  flex: 1;
  overflow: hidden;
}
.lm-tl-map-select-device-and-place .device-place-box-container .place-and-devices-selected-box > div.tl-device-list {
  margin-top: 10px;
}
.lm-tl-map-select-device-and-place .device-place-box-container .selectd-right-box {
  flex: 1;
  height: 100%;
  overflow: hidden;
}

.lm-base-tree-component {
  padding: 10px 0;
  user-select: none;
}
.lm-base-tree-component .ant-tree-switcher {
  position: relative;
  top: -2px;
  left: 8px;
  z-index: 2;
  margin-right: 5px;
}
.lm-base-tree-component .ant-tree-title {
  font-size: var(--fs-small);
  flex: 1 1;
}
.lm-base-tree-component .ant-tree-treenode {
  width: 100%;
  white-space: nowrap;
  font-size: var(--fs-small);
  min-width: max-content;
  position: relative;
  display: inline-flex;
  width: calc(100% - 32px);
  padding-top: 4px;
}
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper {
  font-size: var(--fs-small);
  min-width: max-content;
  position: relative;
  display: inline-flex;
  width: calc(100% - 32px);
}
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected {
  background: transparent;
  color: var(--primary);
  position: relative;
}
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover:after,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected:after {
  content: '';
  width: calc(100% - 24px);
  bottom: 0;
  left: 12px;
  position: absolute;
  border-bottom: 1px solid var(--primary);
}
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover .ant-tree-switcher,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected .ant-tree-switcher,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover .ant-tree-iconEle,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected .ant-tree-iconEle {
  color: var(--primary);
}
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover .ant-tree-switcher .anticon,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected .ant-tree-switcher .anticon,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper:hover .ant-tree-iconEle .anticon,
.lm-base-tree-component .ant-tree-treenode span.ant-tree-node-content-wrapper.ant-tree-node-selected .ant-tree-iconEle .anticon {
  color: var(--primary);
}
.lm-base-tree-component .ant-tree-treenode-switcher-open,
.lm-base-tree-component .ant-tree-treenode-switcher-close {
  padding-bottom: 0;
}
.lm-base-tree-component .ant-tree-treenode-switcher-open .ant-tree-switcher,
.lm-base-tree-component .ant-tree-treenode-switcher-close .ant-tree-switcher,
.lm-base-tree-component .ant-tree-treenode-switcher-open .ant-tree-iconEle,
.lm-base-tree-component .ant-tree-treenode-switcher-close .ant-tree-iconEle {
  color: var(--icon);
}
.lm-base-tree-component .ant-tree-treenode-switcher-open .ant-tree-iconEle,
.lm-base-tree-component .ant-tree-treenode-switcher-close .ant-tree-iconEle {
  position: relative;
  top: 0px;
}
.lm-base-tree-component .ant-tree-treenode-switcher-open:first-child,
.lm-base-tree-component .ant-tree-treenode-switcher-close:first-child {
  padding-top: 0;
}
.lm-base-tree-component .ant-tree-treenode-switcher-open:last-child,
.lm-base-tree-component .ant-tree-treenode-switcher-close:last-child {
  padding-bottom: 0;
}

.lm-c-place-tree {
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--bd-color);
}
.lm-c-place-tree .lm-c-tree-title-part {
  border-bottom: 1px solid var(--bd-color);
  background-color: var(--form-bg-light);
}
.lm-c-place-tree > .lm-base-tree-component {
  flex: 1;
  overflow: auto;
}
.lm-c-place-tree .ant-tree {
  height: 100%;
  overflow: auto;
}
.lm-c-place-tree .anticon {
  font-size: var(--fs);
}
.lm-c-place-tree .ant-tree-title {
  font-size: var(--fs-small);
  flex: 1;
}
.lm-c-place-tree .ant-tree-title > span {
  min-width: 100%;
  display: inline-flex;
  justify-content: space-between;
}
.lm-c-place-tree .tree-node-suffix {
  padding: 0 10px;
}
.lm-c-place-tree .tree-node-suffix i {
  font-style: normal;
}
.lm-c-place-tree .tree-node-suffix .online-count {
  color: var(--success-light);
}

.lm-c-simple-list-layout {
  width: 100%;
  height: 100%;
}
.List-Non-Vir {
  height: 100%;
  overflow-y: auto;
}

.lm-c-base-list-wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--bd-color);
  /*列表项*/
}
.lm-c-base-list-wrapper .lm-c-tree-title-part {
  border-bottom: 1px solid var(--bd-color);
  background-color: var(--form-bg-light);
}
.lm-c-base-list-wrapper .list-checkall {
  height: 42px;
  line-height: 42px;
  padding: 0 18px;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--fs);
}
.lm-c-base-list-wrapper .list-checkall .anticon {
  font-size: 16px;
  cursor: pointer;
  color: var(--icon);
}
.lm-c-base-list-wrapper .list-checkall:after {
  position: absolute;
  content: '';
  left: 18px;
  bottom: 0;
  width: calc(100% - 32px);
  height: 1px;
  background-color: var(--bd-color);
}
.lm-c-base-list-wrapper .lm-c-base-list-layout {
  flex: 1;
  overflow: hidden;
}
.lm-c-base-list-wrapper .lm-c-virtual-layout {
  width: calc(100% - 5px);
  margin-right: 5px;
}
.lm-c-base-list-wrapper .list-item {
  cursor: pointer;
  height: 30px;
  line-height: 30px;
  font-size: var(--fs-small);
  padding: 0 10px;
  /*有check-box*/
}
.lm-c-base-list-wrapper .list-item > label {
  margin: 0px;
  width: 100%;
  display: flex;
}
.lm-c-base-list-wrapper .list-item .item-info {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  font-size: var(--fs-small);
}
.lm-c-base-list-wrapper .list-item .item-info > .anticon {
  font-size: 16px;
  margin: 0 4px;
  position: relative;
  top: 2px;
}
.lm-c-base-list-wrapper .list-item:hover > label,
.lm-c-base-list-wrapper .list-item.list-item-active > label {
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
}
.lm-c-base-list-wrapper .list-item.has-check-box {
  padding: 0 10px;
}
.lm-c-base-list-wrapper .list-item.has-check-box label {
  padding: 0 4px;
}
.lm-c-base-list-wrapper .drag-up {
  -webkit-animation: dragup ease 0.2s 1;
  animation: dragup ease 0.2s 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.lm-c-base-list-wrapper .drag-down {
  -webkit-animation: dragdown ease 0.2s 1;
  animation: dragdown ease 0.2s 1;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes dragup {
  from {
    margin-top: 0px;
  }
  to {
    margin-top: 30px;
  }
}
@keyframes dragdown {
  from {
    margin-bottom: 0px;
  }
  to {
    margin-bottom: 30px;
  }
}

.lm-c-device-and-place-list-wrapper .list-item label .clear-item {
  display: none;
  cursor: pointer;
  font-size: var(--fs-default);
}
.lm-c-device-and-place-list-wrapper .list-item:hover .clear-item {
  display: inline-block;
}
.lm-c-device-and-place-list-wrapper .list-item .an-device-task {
  width: 250px;
  display: flex;
}
.lm-c-device-and-place-list-wrapper .list-item .an-device-task .an-device-task-operate {
  margin-right: 8px;
}
.lm-c-device-and-place-list-wrapper .list-item .an-device-task .an-device-task-operate .operateitem {
  margin-right: 14px;
  font-size: 14px;
}
.lm-c-device-and-place-list-wrapper .list-item .an-device-task .an-device-task-chose {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  margin-left: 46px;
}
.lm-c-device-and-place-list-wrapper .list-item .an-device-task .an-device-task-chose .operate-item {
  margin-right: 22px;
}

.icon-span {
  font-size: var(--fs-small);
  cursor: pointer;
}
.icon-span > .anticon {
  font-size: 16px;
  color: var(--icon);
}
.icon-span:hover .anticon,
.icon-span:hover span {
  color: var(--primary-dark);
}
.icon-span.disabled {
  color: #ddd !important;
  cursor: not-allowed;
}
.icon-span.disabled:hover .anticon,
.icon-span.disabled:hover span {
  cursor: not-allowed;
  color: #ddd !important;
}
.icon-span.icon-span-vertical {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.icon-span.icon-span-vertical > .anticon {
  margin-bottom: 6px;
}
.icon-span.icon-span-horizontal > .anticon {
  margin-right: 4px;
}

.abnormal-group-trajectory-map {
  padding-top: 76px;
}
.abnormal-group-trajectory-map .map-avatar-aid {
  position: absolute;
  left: 0;
  top: 0;
  height: 76px;
  display: flex;
  align-items: center;
  padding: 0 10px;
}
.abnormal-group-trajectory-map .map-avatar-aid .map-avatar-aid-item {
  position: relative;
  cursor: pointer;
}
.abnormal-group-trajectory-map .map-avatar-aid .map-avatar-aid-item .anticon {
  position: absolute;
  font-size: var(--fs-small);
  width: 16px;
  height: 16px;
  right: 4px;
  top: 0;
  background-color: #999;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #fff;
  color: #fff;
}
.abnormal-group-trajectory-map .map-avatar-aid .map-avatar-aid-item .anticon.select-aid-item {
  background-color: var(--primary);
}
.abnormal-group-trajectory-map .map-avatar-aid span {
  width: 44px;
  height: 44px;
  display: inline-block;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 10px;
}
.abnormal-group-trajectory-map .map-avatar-aid span img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.abnormal-group-trajectory-map .map-avatar-content {
  width: 70px;
  height: 70px;
  padding: 2px;
  border-radius: 50%;
  border-width: 1px;
  background-color: #fff;
  border-style: solid;
  position: relative;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
}
.abnormal-group-trajectory-map .map-avatar-content:after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  width: 0;
  height: 0;
  border-width: 6px;
  margin-left: -6px;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
}
.abnormal-group-trajectory-map .map-avatar-content .bd {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
}
.abnormal-group-trajectory-map .map-avatar-content .bd img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@font-face {
  font-family: "lm-player-iconfont";
  src: url('data:font/woff2;charset=utf-8;base64, ') format('woff2');
}
.lm-player-iconfont {
  font-family: "lm-player-iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.lm-player-M_Device_jiazaishibai:before {
  content: "\e6de";
}
.lm-player-M_Bar_CloudAuto:before {
  content: "\e6c9";
}
.lm-player-S_Box_VideoCloud:before {
  content: "\e6ca";
}
.lm-player-S_Bar_LatLongYes:before {
  content: "\e792";
}
.lm-player-S_Device_kuaijin:before {
  content: "\e6c7";
}
.lm-player-S_Device_shezhi:before {
  content: "\e6c8";
}
.lm-player-S_View_Playerpley:before {
  content: "\e827";
}
.lm-player-S_View_RotateRight:before {
  content: "\e828";
}
.lm-player-S_View_ScreenSizeFull:before {
  content: "\e82d";
}
.lm-player-S_View_SoundMiddle:before {
  content: "\e835";
}
.lm-player-S_Edit_LoadDown:before {
  content: "\e7b6";
}
.lm-player-S_Edit_Reset:before {
  content: "\e7c3";
}
.lm-player-S_View_SearchBox:before {
  content: "\e833";
}
.lm-player-S_View_PlayerPlay1:before {
  content: "\e6b7";
}
.lm-player-YesorNo_No_Dark:before {
  content: "\e6dd";
}
.lm-player-Refresh_Main:before {
  content: "\e687";
}
.lm-player-SearchBox:before {
  content: "\e706";
}
.lm-player-ZoomIn_Main:before {
  content: "\e663";
}
.lm-player-ZoomDefault_Main:before {
  content: "\e664";
}
.lm-player-ZoomOut_Main:before {
  content: "\e665";
}
.lm-player-PrevFast:before {
  content: "\e71f";
}
.lm-player-NextFast_Light:before {
  content: "\e720";
}
.lm-player-volume-close:before {
  content: "\e602";
}
.lm-player-volume-normal-fuben:before {
  content: "\e604";
}
.lm-player-volume-max:before {
  content: "\e605";
}
.lm-player-ExitFull_Main:before {
  content: "\e68e";
}
.lm-player-Full_Main:before {
  content: "\e690";
}
.lm-player-Loading:before {
  content: "\e65d";
}
.lm-player-Pause_Main:before {
  content: "\e652";
}
.lm-player-Play_Main:before {
  content: "\e654";
}
.lm-player-PlaySource:before {
  content: "\e6cd";
}

.slider-layout {
  width: 100%;
  height: 100%;
  user-select: none;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.slider-layout .slider-content {
  width: 100%;
  height: 2px;
  position: relative;
  transition: height 0.2s;
  cursor: pointer;
  overflow: hidden;
}
.slider-layout .slider-other-content {
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: height 0.2s;
  cursor: pointer;
  z-index: 9;
  pointer-events: none;
}
.slider-layout .slider-max-line {
  width: 100%;
  height: 100%;
  background-color: #000;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  border-radius: 4px;
}
.slider-layout .slider-visibel-line {
  position: absolute;
  background: rgba(255, 170, 0, 0.5);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 3;
  cursor: pointer;
  border-radius: 4px;
}
.slider-layout .slider-current-line {
  position: absolute;
  background-color: #ffaa00;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 3;
  border-radius: 4px;
}
.slider-layout .drag-change-icon {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-left: -3px;
  border: 1px solid #fff;
  background-color: #ffaa00;
  top: -3px;
  pointer-events: all;
  box-sizing: content-box;
}
.slider-layout:hover .slider-content,
.slider-layout:hover .slider-other-content {
  height: 4px;
}
.slider-layout:hover .drag-change-icon {
  width: 10px;
  height: 10px;
  top: -4px;
  margin-left: -5px;
}
.lm-player-slide-tips {
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  left: 0;
  top: -26px;
  transform: translate(-50%, -100%);
  font-size: 12px;
  color: #fff;
  border-radius: 4px;
  z-index: 6;
  padding: 2px 4px;
  white-space: nowrap;
  z-index: 99;
}

.contraller-bar-layout {
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(29, 33, 53, 0.8);
  height: 28px;
  width: 100%;
  display: flex;
  align-items: center;
  z-index: 10;
  justify-content: space-between;
  opacity: 1;
  transition: opacity 0.3s;
}
.contraller-bar-layout .contraller-left-bar {
  display: flex;
  align-items: center;
}
.contraller-bar-layout .count-down-view {
  color: #fff;
  margin-left: 16px;
  width: 56px !important;
}
.contraller-bar-layout .wave-box {
  width: 200px;
  height: 28px;
  position: absolute;
  left: 50%;
  transform: translate(-100px, 0px);
  top: -28px;
}
.contraller-bar-layout .wave-box .wave-middle-line {
  position: absolute;
  width: 100%;
  height: 2px;
  background: #244769;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.contraller-bar-layout .wave-box .wave-item {
  background: linear-gradient(to bottom, #42E1F2, #5487FF);
  position: absolute;
  top: 4px;
  height: 20px;
  transition: all;
}
.contraller-bar-layout .wave-box .wave-item.animation1 {
  animation: audio-visualizer-animation1 1.5s linear infinite;
}
.contraller-bar-layout .wave-box .wave-item.animation2 {
  animation: audio-visualizer-animation2 1.5s linear infinite;
}
.contraller-bar-layout .wave-box .wave-item.animation3 {
  animation: audio-visualizer-animation3 1.5s linear infinite;
}
.contraller-bar-layout .wave-box .wave-item.animation4 {
  animation: audio-visualizer-animation4 1.5s linear infinite;
}
@keyframes audio-visualizer-animation1 {
  0% {
    transform: scaleY(0);
  }
  50% {
    transform: scaleY(1);
  }
  100% {
    transform: scaleY(0);
  }
}
@keyframes audio-visualizer-animation2 {
  0% {
    transform: scaleY(0.5);
  }
  25% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.5);
  }
  75% {
    transform: scaleY(0);
  }
  100% {
    transform: scaleY(0.5);
  }
}
@keyframes audio-visualizer-animation3 {
  0% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0);
  }
  100% {
    transform: scaleY(1);
  }
}
@keyframes audio-visualizer-animation4 {
  0% {
    transform: scaleY(0.5);
  }
  25% {
    transform: scaleY(0);
  }
  50% {
    transform: scaleY(0.5);
  }
  75% {
    transform: scaleY(1);
  }
  100% {
    transform: scaleY(0.5);
  }
}
.contraller-bar-layout.hide-contraller-bar {
  opacity: 0;
}
.contraller-bar-layout .contraller-bar-item {
  float: left;
  display: flex;
  width: 28px;
  height: 28px;
  justify-content: center;
  align-items: center;
}
.contraller-bar-layout .contraller-bar-item .lm-player-iconfont,
.contraller-bar-layout .contraller-bar-item .anticon {
  color: #fff;
  cursor: pointer;
  font-size: 16px;
}
.contraller-bar-layout .contraller-bar-item .lm-player-iconfont:hover,
.contraller-bar-layout .contraller-bar-item .anticon:hover {
  color: var(--primary);
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume {
  display: inline-block;
  position: relative;
  transition: all 0.3s;
  white-space: nowrap;
  overflow: hidden;
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume .volume-slider-layout {
  width: 100px;
  height: 28px;
  position: absolute;
  left: 32px;
  top: 0;
  opacity: 0;
  transition: opacity 0.3s;
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume .volume-slider-layout .slider-max-line {
  background-color: #5b7eac;
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume .lm-player-iconfont {
  line-height: 28px;
  width: 28px;
  display: inline-block;
  text-align: center;
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume.contraller-bar-hover-volume {
  width: 148px;
}
.contraller-bar-layout .contraller-bar-item.contraller-bar-volume.contraller-bar-hover-volume .volume-slider-layout {
  opacity: 1;
}
.contraller-bar-layout .contraller-bar-item.fl-menu {
  text-align: center;
  font-size: 12px;
  width: auto;
  position: relative;
  min-height: 25px;
  line-height: 28px;
  height: 28px;
  padding-right: 5px;
}
.contraller-bar-layout .contraller-bar-item.fl-menu:hover .fl-menu-level {
  display: block;
}
.contraller-bar-layout .contraller-bar-item.fl-menu ul {
  position: absolute;
  display: none;
  margin: 0;
  padding: 0;
  background-color: #333;
  -webkit-box-shadow: 0px -2px 6px 1px #222;
  box-shadow: 0px -2px 6px 1px #222;
}
.contraller-bar-layout .contraller-bar-item.fl-menu li {
  font-size: 13px;
  list-style: none;
  text-align: right;
}
.contraller-bar-layout .contraller-bar-item.fl-menu .fl-menu-main {
  color: #fff;
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
  cursor: unset;
  width: auto;
  min-width: 45px;
  padding: 0 2px;
  display: inline-block;
}
.contraller-bar-layout .contraller-bar-item.fl-menu .fl-menu-level {
  z-index: 5;
  left: auto;
  right: 0px;
  top: auto;
  bottom: 28px;
}
.contraller-bar-layout .contraller-bar-item.fl-menu .fl-menu-level-1 {
  position: relative;
  width: 62px;
  padding: 0 10px;
  display: block;
  text-align: center;
  float: right;
  color: white;
  word-break: break-all;
}
.contraller-bar-layout .contraller-bar-item.fl-menu .fl-menu-level-1:hover {
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
  cursor: pointer;
}
.contraller-bar-layout .contraller-bar-item.fl-menu .fl-menu-level-1:active {
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc {
  text-align: center;
  font-size: 12px;
  width: auto;
  position: relative;
  min-height: 25px;
  line-height: 28px;
  height: 28px;
  padding-right: 5px;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc ul {
  position: absolute;
  margin: 0;
  padding: 0;
  background-color: #333;
  -webkit-box-shadow: 0px -2px 6px 1px #222;
  box-shadow: 0px -2px 6px 1px #222;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc li {
  font-size: 13px;
  list-style: none;
  text-align: right;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc .fl-menu-hc-main {
  color: #fff;
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
  cursor: pointer;
  width: auto;
  min-width: 45px;
  padding: 0 2px;
  display: inline-block;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc .fl-menu-hc-level {
  z-index: 5;
  left: auto;
  right: 0px;
  top: auto;
  bottom: 28px;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc .fl-menu-hc-level-1 {
  position: relative;
  width: 62px;
  padding: 0 10px;
  display: block;
  text-align: center;
  float: right;
  color: white;
  word-break: break-all;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc .fl-menu-hc-level-1:hover {
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
  cursor: pointer;
}
.contraller-bar-layout .contraller-bar-item.fl-menu-hc .fl-menu-hc-level-1:active {
  background-image: linear-gradient(-180deg, #37415f, #333 98%);
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container {
  position: absolute;
  margin: 0;
  padding: 5px;
  background-color: #333;
  -webkit-box-shadow: 0px -2px 6px 1px #222;
  box-shadow: 0px -2px 6px 1px #222;
  width: 320px;
  z-index: 5;
  left: auto;
  right: 30px;
  top: auto;
  bottom: 28px;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container .ant-slider {
  width: 68%;
  position: absolute;
  left: 55px;
  top: 3px;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container .colorPicker-reset {
  float: right;
  cursor: pointer;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container .colorPicker-reset:hover {
  color: #ffaa00;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container .hue-horizontal .ant-slider-rail,
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container .hue-horizontal .ant-slider-track {
  background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container span {
  color: #fff;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container span:last-child {
  position: absolute;
  right: 8px;
}
.contraller-bar-layout .contraller-bar-item.colorPicker .colorPicker-container-control {
  position: relative;
  padding: 8px;
  clear: both;
}
.contraller-scale-layout {
  position: absolute;
  right: 10px;
  bottom: 60px;
  opacity: 1;
  z-index: 3;
  transition: opacity 0.3s;
}
.contraller-scale-layout.hide-contraller-bar {
  opacity: 0;
}
.contraller-scale-layout .contraller-bar-item {
  display: block;
  cursor: pointer;
}
.contraller-scale-layout .contraller-bar-item:hover .lm-player-iconfont {
  color: var(--primary);
}
.colorPicker-container .ant-slider {
  box-sizing: border-box;
  color: rgba(0, 0, 0, 0.85);
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5715;
  list-style: none;
  font-feature-settings: "tnum";
  position: relative;
  height: 12px;
  margin: 10px 6px;
  padding: 4px 0;
  cursor: pointer;
  touch-action: none;
}
.colorPicker-container .ant-slider-rail,
.colorPicker-container .ant-slider-track {
  position: absolute;
  height: 4px;
  border-radius: 2px;
  transition: background-color 0.3s;
}
.colorPicker-container .ant-slider-rail {
  width: 100%;
  background-color: #f5f5f5;
}
.colorPicker-container .ant-slider-track {
  background-color: #91d5ff;
}
.colorPicker-container .ant-slider:hover .ant-slider-track {
  background-color: #69c0ff;
}
.colorPicker-container .ant-slider-step {
  position: absolute;
  width: 100%;
  height: 4px;
  background: 0 0;
}
.colorPicker-container .ant-slider-handle {
  position: absolute;
  width: 14px;
  height: 14px;
  margin-top: -5px;
  background-color: #fff;
  border: 2px solid #91d5ff;
  border-radius: 50%;
  box-shadow: 0;
  cursor: pointer;
  transition: border-color 0.3s, box-shadow 0.6s, transform 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}
.colorPicker-container .ant-slider-mark {
  position: absolute;
  top: 14px;
  left: 0;
  width: 100%;
  font-size: 14px;
}

.lm-player-message-mask {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  background: transparent;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: all 0.5s;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  pointer-events: none;
}
.lm-player-message-mask.lm-player-mask-loading-animation {
  opacity: 1;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}
.lm-player-message-mask .lm-player-loading-icon {
  position: relative;
  font-size: 48px;
  z-index: -1;
  visibility: hidden;
}
.lm-player-message-mask .lm-player-loading-icon.lm-player-loading-animation {
  visibility: visible;
  z-index: 9;
  animation: loadingAnimation 1s linear infinite;
}
.lm-player-message-mask .lm-player-loading-icon.lm-player-loadfail {
  visibility: visible;
  z-index: 9;
}
.lm-player-message-mask .lm-player-message {
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  padding: 10px;
}
.lm-player-message-mask .lm-player-message .install-link {
  color: var(--primary);
}
.lm-player-message-mask .lm-player-message .install-link:hover {
  text-decoration: underline;
}
.lm-player-message-mask .refresh-action {
  background: none !important;
  color: var(--primary);
  width: 30px;
  border-radius: 16px;
  margin: 0px !important;
  padding: 5px 0px !important;
  pointer-events: auto;
  cursor: pointer;
}
.lm-player-message-mask .refresh-action:hover {
  text-decoration: underline !important;
}
@keyframes loadingAnimation {
  form {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.video-time-line-layout {
  position: absolute;
  left: 0;
  bottom: 33px;
  width: calc(100% - 10px);
  margin-left: 5px;
  height: 20px;
  background: rgba(29, 33, 53, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  z-index: 9;
  opacity: 1;
  transition: opacity 0.3s;
}
.video-time-line-layout.hide-time-line {
  opacity: 0;
}
.video-time-line-layout .time-line-box {
  flex: 1;
}
.video-time-line-layout .time-line-action-item {
  width: 32px;
  text-align: center;
  font-size: 16px;
}
.video-time-line-layout .time-line-action-item:hover {
  color: #ffaa00;
  cursor: pointer;
}
.video-time-line-layout .history-time-line-item {
  background: #5b7eac;
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  z-index: 2;
}
.video-time-line-layout .history-time-line-item.history-time-line-disabled {
  background: #000;
  z-index: 4;
}

.lm-player-container {
  width: 100%;
  height: 100%;
  position: relative;
  background: #000;
  box-sizing: border-box;
}
.lm-player-container .lm-player-iconfont {
  color: #fff;
}
.lm-player-container .player-mask-layout {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.lm-player-container .player-mask-layout > video {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: #000;
}
.lm-player-container.ocean-error .lm-c-video-title {
  display: none;
}
.lm-player-container.ocean-error:hover .lm-c-video-title {
  display: flex;
}

.lm-base-title-wrapper.lm-c-between-box {
  width: 100%;
  border-bottom: 1px solid var(--bd-color);
  padding: 6px 0;
  margin-bottom: 8px;
}
.lm-base-title-wrapper.lm-c-between-box .title-container {
  font-size: var(--fs-default);
  color: var(--text);
}
.lm-base-title-wrapper.lm-c-between-box .title-container .icon-title {
  margin-right: 4px;
  font-size: 16px;
  color: var(--icon);
}
.lm-base-title-wrapper.lm-c-between-box .title-container .anticon {
  color: var(--icon);
  position: relative;
  top: 1px;
  font-size: 16px;
  margin-right: 4px;
}

.lm-filter-range-picker-wrapper {
  width: 100%;
}
.lm-filter-range-picker-wrapper .lm-between-box {
  width: 100%;
  border-bottom: 1px solid var(--bd-color);
  padding: 6px 0;
  margin-bottom: 8px;
}
.lm-filter-range-picker-wrapper .lm-between-box .anticon {
  color: var(--icon);
  position: relative;
  top: 1px;
  font-size: 16px;
  margin-right: 4px;
}
.lm-filter-range-picker-wrapper .ant-calendar-picker {
  width: 100% !important;
  margin-bottom: 8px;
}
.lm-filter-range-picker-wrapper .ant-calendar-picker .ant-calendar-picker-input {
  font-size: var(--fs);
}
.lm-filter-range-picker-wrapper .ant-picker-range {
  margin-bottom: 8px;
}
.lm-filter-range-picker-wrapper .ant-picker-range .ant-picker-input > input {
  font-size: var(--fs);
}
.lm-filter-range-picker-wrapper .ant-picker-range .ant-picker-suffix > span {
  color: var(--icon);
}
.lm-filter-range-picker-wrapper .fast-set-wrapper {
  display: flex;
  margin-bottom: 5px;
}
.lm-filter-range-picker-wrapper .fast-set-wrapper span {
  min-width: 54px;
  height: 26px;
  line-height: 25px;
  border: 1px solid var(--bd-color);
  font-size: var(--fs);
  color: inherit;
  padding: 0 8px;
  margin-right: 5px;
  cursor: pointer;
}
.lm-filter-range-picker-wrapper .fast-set-wrapper span:hover {
  color: var(--primary);
  border-color: var(--primary);
}
.lm-range-picke-drop .ant-tag {
  border-radius: unset;
  cursor: pointer;
}
.lm-range-picke-drop .ant-tag.ant-tag-blue {
  border-color: var(--primary);
  background-color: #fff;
  color: var(--primary);
}

.lm-modal-container.ant-modal {
  padding-bottom: 0;
  color: inherit;
}
.lm-modal-container.ant-modal .ant-modal-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: var(--form-redius);
  overflow: hidden;
  background-color: transparent;
}
.lm-modal-container.ant-modal .ant-modal-close .ant-modal-close-x {
  width: 48px;
  height: 47px;
  line-height: 48px;
}
.lm-modal-container.ant-modal .ant-modal-header {
  padding: 12px 24px;
  padding-right: 56px;
  background: var(--modal-title-bg);
  border-bottom-color: var(--modal-divider-color);
  border-radius: 0;
  color: inherit;
}
.lm-modal-container.ant-modal .ant-modal-header .ant-modal-title {
  color: inherit;
  font-size: var(--fs-large);
}
.lm-modal-container.ant-modal .ant-modal-close {
  color: inherit;
}
.lm-modal-container.ant-modal .ant-modal-body {
  background: var(--modal-content-bg);
  flex: 1;
  overflow: hidden;
}
.lm-modal-container.ant-modal .ant-modal-footer {
  padding: 12px 24px;
  border-radius: 0;
  background: var(--modal-footer-bg);
  border-top-color: var(--modal-divider-color);
}

.lm-c-palyer-network-speed-view {
  position: absolute;
  border-radius: 0px 12px 12px 0px;
  background: rgba(29, 33, 53, 0.8);
  top: 40px;
  color: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  display: inline-flex;
  padding: 2px 8px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 78px;
}

.lm-player-container {
  overflow: hidden;
}
.lm-player-container.lm-player-hide-bar .camera-control-layer {
  opacity: 0;
  z-index: -2;
}
.lm-player-container .playview-box-control-left,
.lm-player-container .playview-box-control-right,
.lm-player-container .playview-box-control-up,
.lm-player-container .playview-box-control-down {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  transform-style: preserve-3d;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lm-player-container .playview-box-control-left .anticon,
.lm-player-container .playview-box-control-right .anticon,
.lm-player-container .playview-box-control-up .anticon,
.lm-player-container .playview-box-control-down .anticon {
  opacity: 0;
  pointer-events: none;
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.lm-player-container .playview-box-control-left::after,
.lm-player-container .playview-box-control-right::after,
.lm-player-container .playview-box-control-up::after,
.lm-player-container .playview-box-control-down::after,
.lm-player-container .playview-box-control-left::before,
.lm-player-container .playview-box-control-right::before,
.lm-player-container .playview-box-control-up::before,
.lm-player-container .playview-box-control-down::before {
  position: absolute;
  width: 200px;
  height: 200px;
  content: " ";
  display: block;
}
.lm-player-container .playview-box-control-left:hover .anticon,
.lm-player-container .playview-box-control-right:hover .anticon,
.lm-player-container .playview-box-control-up:hover .anticon,
.lm-player-container .playview-box-control-down:hover .anticon {
  opacity: 1;
}
.lm-player-container .playview-box-control-left {
  width: 100px;
  height: calc(100% - 200px);
  top: 100px;
  left: 0;
}
.lm-player-container .playview-box-control-left::after {
  top: 0;
  right: 0;
  transform-origin: 100% 0;
  transform: rotate(45deg);
}
.lm-player-container .playview-box-control-left::before {
  bottom: 0;
  right: 0;
  transform-origin: 100% 100%;
  transform: rotate(-45deg);
}
.lm-player-container .playview-box-control-up {
  width: calc(100% - 200px);
  height: 100px;
  top: 0;
  left: 100px;
}
.lm-player-container .playview-box-control-up .anticon {
  transform: rotate(90deg);
}
.lm-player-container .playview-box-control-up::after {
  bottom: 0;
  left: 0;
  transform-origin: 0 100%;
  transform: rotate(-45deg);
}
.lm-player-container .playview-box-control-up::before {
  bottom: 0;
  right: 0;
  transform-origin: 100% 100%;
  transform: rotate(45deg);
}
.lm-player-container .playview-box-control-right {
  width: 100px;
  height: calc(100% - 200px);
  top: 100px;
  right: 0;
}
.lm-player-container .playview-box-control-right .anticon {
  transform: rotate(180deg);
}
.lm-player-container .playview-box-control-right::after {
  top: 0;
  left: 0;
  transform-origin: 0 0;
  transform: rotate(-45deg);
}
.lm-player-container .playview-box-control-right::before {
  bottom: 0;
  left: 0;
  transform-origin: 0 100%;
  transform: rotate(45deg);
}
.lm-player-container .playview-box-control-down {
  width: calc(100% - 200px);
  height: 100px;
  bottom: 0;
  left: 100px;
}
.lm-player-container .playview-box-control-down .anticon {
  transform: rotate(270deg);
}
.lm-player-container .playview-box-control-down::after {
  top: 0;
  left: 0;
  transform-origin: 0 0;
  transform: rotate(45deg);
}
.lm-player-container .playview-box-control-down::before {
  top: 0;
  right: 0;
  transform-origin: 100% 0;
  transform: rotate(-45deg);
}
.lm-player-container .camera-control-layer {
  cursor: default;
  width: 160px;
  height: 58px;
  position: absolute;
  bottom: 38px;
  left: 0px;
  opacity: 1;
  z-index: 10;
  transition: all 0.3s;
}
.lm-player-container .camera-control-layer .layout-content {
  cursor: default;
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 40px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.lm-player-container .camera-control-layer .ptz-btn {
  position: absolute;
  width: 36px;
  height: 24px;
  bottom: 0;
  left: 0;
  cursor: pointer;
  background: rgba(29, 33, 53, 0.8);
  border-radius: 0 100px 100px 0;
}
.lm-player-container .camera-control-layer .ptz-btn .ptz-status-icon {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 4px;
  left: 8px;
  z-index: 9;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9CYXIvT3Blbl9XaGl0ZTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDMgQzMuNTUyMjg0NzUsMyA0LDMuNDQ3NzE1MjUgNCw0IEw0LDEyIEwxMiwxMiBDMTIuNTUyMjg0NywxMiAxMywxMi40NDc3MTUzIDEzLDEzIEMxMywxMy41NTIyODQ3IDEyLjU1MjI4NDcsMTQgMTIsMTQgTDIsMTQgTDIsNCBDMiwzLjQ0NzcxNTI1IDIuNDQ3NzE1MjUsMyAzLDMgWiBNNyw0IEM3LjU1MjI4NDc1LDQgOCw0LjQ0NzcxNTI1IDgsNSBMOCw4IEwxMSw4IEMxMS41NTIyODQ3LDggMTIsOC40NDc3MTUyNSAxMiw5IEMxMiw5LjU1MjI4NDc1IDExLjU1MjI4NDcsMTAgMTEsMTAgTDYsMTAgTDYsNSBDNiw0LjQ0NzcxNTI1IDYuNDQ3NzE1MjUsNCA3LDQgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPg0KICAgICAgICA8ZmlsdGVyIHg9Ii02OC4yJSIgeT0iLTY4LjIlIiB3aWR0aD0iMjM2LjQlIiBoZWlnaHQ9IjIzNi40JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTIiPg0KICAgICAgICAgICAgPGZlT2Zmc2V0IGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4NCiAgICAgICAgICAgIDxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIj48L2ZlR2F1c3NpYW5CbHVyPg0KICAgICAgICAgICAgPGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMDE5NjA3ODQzMSAgIDAgMCAwIDAgMC4wMzUyOTQxMTc2ICAgMCAwIDAgMCAwLjI3MDU4ODIzNSAgMCAwIDAgMC41IDAiIHR5cGU9Im1hdHJpeCIgaW49InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD4NCiAgICAgICAgPC9maWx0ZXI+DQogICAgPC9kZWZzPg0KICAgIDxnIGlkPSIxNi9CYXIvT3Blbl9XaGl0ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtNSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNy41MDAwMDAsIDguNTAwMDAwKSBzY2FsZSgtMSwgLTEpIHRyYW5zbGF0ZSgtNy41MDAwMDAsIC04LjUwMDAwMCkgIj4NCiAgICAgICAgICAgIDx1c2UgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMSIgZmlsdGVyPSJ1cmwoI2ZpbHRlci0yKSIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+DQogICAgICAgICAgICA8dXNlIGZpbGw9IiNGRkZGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+DQogICAgICAgIDwvZz4NCiAgICA8L2c+DQo8L3N2Zz4=') no-repeat center;
}
.lm-player-container .camera-control-layer .ptz-btn.open .ptz-status-icon {
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9CYXIvSGlkZV9XaGl0ZTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwYXRoIGQ9Ik00LDIgQzQuNTUyMjg0NzUsMiA1LDIuNDQ3NzE1MjUgNSwzIEw1LDExIEwxMywxMSBDMTMuNTUyMjg0NywxMSAxNCwxMS40NDc3MTUzIDE0LDEyIEMxNCwxMi41NTIyODQ3IDEzLjU1MjI4NDcsMTMgMTMsMTMgTDMsMTMgTDMsMyBDMywyLjQ0NzcxNTI1IDMuNDQ3NzE1MjUsMiA0LDIgWiBNOCwzIEM4LjU1MjI4NDc1LDMgOSwzLjQ0NzcxNTI1IDksNCBMOSw3IEwxMiw3IEMxMi41NTIyODQ3LDcgMTMsNy40NDc3MTUyNSAxMyw4IEMxMyw4LjU1MjI4NDc1IDEyLjU1MjI4NDcsOSAxMiw5IEw3LDkgTDcsNCBDNywzLjQ0NzcxNTI1IDcuNDQ3NzE1MjUsMyA4LDMgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPg0KICAgICAgICA8ZmlsdGVyIHg9Ii02OC4yJSIgeT0iLTY4LjIlIiB3aWR0aD0iMjM2LjQlIiBoZWlnaHQ9IjIzNi40JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTIiPg0KICAgICAgICAgICAgPGZlT2Zmc2V0IGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4NCiAgICAgICAgICAgIDxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIj48L2ZlR2F1c3NpYW5CbHVyPg0KICAgICAgICAgICAgPGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMDE5NjA3ODQzMSAgIDAgMCAwIDAgMC4wMzUyOTQxMTc2ICAgMCAwIDAgMCAwLjI3MDU4ODIzNSAgMCAwIDAgMC41IDAiIHR5cGU9Im1hdHJpeCIgaW49InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD4NCiAgICAgICAgPC9maWx0ZXI+DQogICAgPC9kZWZzPg0KICAgIDxnIGlkPSIxNi9CYXIvSGlkZV9XaGl0ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtNSI+DQogICAgICAgICAgICA8dXNlIGZpbGw9ImJsYWNrIiBmaWxsLW9wYWNpdHk9IjEiIGZpbHRlcj0idXJsKCNmaWx0ZXItMikiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPg0KICAgICAgICAgICAgPHVzZSBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPg0KICAgICAgICA8L2c+DQogICAgPC9nPg0KPC9zdmc+');
}
.lm-player-container .camera-control-layer .box-zoom,
.lm-player-container .camera-control-layer .box-focus {
  width: 64px;
  height: 24px;
  background: rgba(29, 33, 53, 0.8);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lm-player-container .camera-control-layer .box-zoom > span,
.lm-player-container .camera-control-layer .box-focus > span {
  color: #8899bb;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
}
.lm-player-container .camera-control-layer .box-zoom > span .anticon,
.lm-player-container .camera-control-layer .box-focus > span .anticon {
  width: 16px;
  height: 16px;
  font-size: 16px;
  text-align: center;
  line-height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.lm-player-container .camera-control-layer .box-zoom .zoomin:hover,
.lm-player-container .camera-control-layer .box-focus .zoomin:hover,
.lm-player-container .camera-control-layer .box-zoom .zoomout:hover,
.lm-player-container .camera-control-layer .box-focus .zoomout:hover,
.lm-player-container .camera-control-layer .box-zoom .focusin:hover,
.lm-player-container .camera-control-layer .box-focus .focusin:hover,
.lm-player-container .camera-control-layer .box-zoom .focusout:hover,
.lm-player-container .camera-control-layer .box-focus .focusout:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 100%;
}
.lm-player-container .camera-control-layer .box-zoom .focusauto:hover,
.lm-player-container .camera-control-layer .box-focus .focusauto:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 80%;
}
.lm-player-container .camera-control-layer .box-zoom .box-label,
.lm-player-container .camera-control-layer .box-focus .box-label {
  cursor: default;
}
.lm-player-container .camera-control-layer .box-zoom.disabled,
.lm-player-container .camera-control-layer .box-focus.disabled {
  opacity: 0.6;
  pointer-events: none;
}
.lm-player-container .camera-control-layer .box-zoom.disabled > span,
.lm-player-container .camera-control-layer .box-focus.disabled > span {
  cursor: default;
}
.lm-player-container .camera-control-layer .box-focus {
  width: 90px;
  left: 80px;
}
.lm-player-container .camera-control-layer .box-focus .focusauto {
  width: 30px;
  height: 24px;
  margin-left: 2px;
  opacity: 0.7;
  background-image: linear-gradient(194deg, #464c8b 0%, #0b1532 99%);
  box-shadow: 0 2px 4px 0 #2b3551;
  border-radius: 0 16px 16px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lm-player-container .camera-control-layer .box-focus .focusauto .anticon {
  font-size: 16px;
}
.lm-player-container .camera-control-layer .box-speed {
  width: 100%;
  height: 24px;
  margin-top: 8px;
  background: rgba(29, 33, 53, 0.8);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.lm-player-container .camera-control-layer .box-speed .ant-slider {
  margin: 8px 10px 0 4px;
  flex: 1;
  top: 1px;
}
.lm-player-container .camera-control-layer .box-speed .ant-slider .ant-slider-rail {
  height: 2px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.4);
}
.lm-player-container .camera-control-layer .box-speed .ant-slider .ant-slider-track {
  height: 2px;
  border-radius: 2px;
  position: relative;
  top: 0px;
  background: #2cd0d0;
}
.lm-player-container .camera-control-layer .box-speed .ant-slider .ant-slider-handle {
  height: 10px;
  width: 10px;
  border: 2px solid #ffffff;
  position: relative;
  top: -2px;
  border-radius: 50%;
  background: #ffffff;
  cursor: pointer;
}
.lm-player-container .camera-control-layer .box-speed .cloudapp-slider {
  margin: 8px 10px 0 4px;
  flex: 1;
  top: 1px;
}
.lm-player-container .camera-control-layer .box-speed .cloudapp-slider .cloudapp-slider-rail {
  height: 2px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.4);
}
.lm-player-container .camera-control-layer .box-speed .cloudapp-slider .cloudapp-slider-track {
  height: 2px;
  border-radius: 2px;
  position: relative;
  top: -2px;
  background: #2cd0d0;
}
.lm-player-container .camera-control-layer .box-speed .cloudapp-slider .cloudapp-slider-handle {
  height: 10px;
  width: 10px;
  border: 2px solid #ffffff;
  position: relative;
  top: -5px;
  border-radius: 50%;
  background: #ffffff;
  cursor: pointer;
}
.lm-player-container .camera-control-layer .box-speed .box-speed-icon {
  width: 16px;
  height: 16px;
  margin: 0 4px 0 8px;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9WaWRlby9TcGVlZDwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxnIGlkPSIxNi9WaWRlby9TcGVlZCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik03LjgxNDM4MDMxLDcuNTExMzcxODEgQzcuMDczNTM2ODEsNy42MDI4MDQ0NCA2LjUsOC4yMzQ0MjM4NyA2LjUsOSBDNi41LDkuODI4NDI3MTIgNy4xNzE1NzI4OCwxMC41IDgsMTAuNSBDOC43NjU1NzYxMywxMC41IDkuMzk3MTk1NTYsOS45MjY0NjMxOSA5LjQ4ODYyODE5LDkuMTg1NjE5NjkgTDEyLDUgTDcuODE0MzgwMzEsNy41MTEzNzE4MSBaIE0zLjEwMTAxNzI2LDE0IEMxLjgwNDQ2NzIxLDEyLjcyOTQ4MyAxLDEwLjk1ODY4ODIgMSw5IEMxLDUuMTM0MDA2NzUgNC4xMzQwMDY3NSwyIDgsMiBDMTEuODY1OTkzMiwyIDE1LDUuMTM0MDA2NzUgMTUsOSBDMTUsMTAuOTU4Njg4MiAxNC4xOTU1MzI4LDEyLjcyOTQ4MyAxMi44OTg5ODI3LDE0IEwzLjEwMTAxNzI2LDE0IFogTTUuNSwxMiBDNS4yMjM4NTc2MywxMiA1LDEyLjIyMzg1NzYgNSwxMi41IEM1LDEyLjc3NjE0MjQgNS4yMjM4NTc2MywxMyA1LjUsMTMgTDEwLjUsMTMgQzEwLjc3NjE0MjQsMTMgMTEsMTIuNzc2MTQyNCAxMSwxMi41IEMxMSwxMi4yMjM4NTc2IDEwLjc3NjE0MjQsMTIgMTAuNSwxMiBMNS41LDEyIFoiIGlkPSJDb21iaW5lZC1TaGFwZSIgZmlsbD0iI0ZGRkZGRiI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .camera-control-layer .camera-control-wrapper {
  overflow: hidden;
  position: absolute;
  margin: auto;
  left: 9%;
  bottom: 110%;
  width: 128px;
  height: 128px;
  border-radius: 50%;
}
.lm-player-container .camera-control-layer .camera-control-wrapper li {
  position: absolute;
  font-size: 15px;
  width: 65px;
  height: 46px;
  transform-origin: 100% 100%;
  overflow: hidden;
  left: -1%;
  top: 14%;
  background: rgba(29, 33, 53, 0.8);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(1) {
  transform: rotate(67.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(2) {
  transform: rotate(112.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(3) {
  transform: rotate(157.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(4) {
  transform: rotate(202.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(5) {
  transform: rotate(247.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(6) {
  transform: rotate(292.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(7) {
  transform: rotate(337.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(8) {
  transform: rotate(382.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li:nth-child(9) {
  transform: rotate(427.5deg) skew(45deg);
}
.lm-player-container .camera-control-layer .camera-control-wrapper li .control-item {
  display: block;
  font-size: 18px;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 32px;
  position: absolute;
  bottom: 1px;
  right: 8px;
  transform: skew(-45deg) rotate(-67deg);
  cursor: pointer;
}
.lm-player-container .camera-control-layer .camera-control-wrapper li .control-item:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 80%;
}
.lm-player-container .camera-control-layer .camera-control-wrapper li .control-item:hover span {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9CbHVlPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2L1Bob3RvL0dyZXlfQmx1ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDUuMDY2MTE1NyBDMy41LDQuNTY2MTE1NyA3LDcuMDY2MTE1NyA4LDcuMDY2MTE1NyBDOSw3LjA2NjExNTcgMTIuNSw0LjU2NjExNTcgMTMsNS4wNjYxMTU3IEMxMy41LDUuNTY2MTE1NyA5LDEwLjA2NjExNTcgOCwxMC4wNjYxMTU3IEM3LDEwLjA2NjExNTcgMi41LDUuNTY2MTE1NyAzLDUuMDY2MTE1NyBaIiBpZD0iUmVjdGFuZ2xlLTEyIiBmaWxsPSIjRkZGRkZGIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4LjAwMDAwMCwgNy41MzMwNTgpIHNjYWxlKDEsIC0xKSB0cmFuc2xhdGUoLTguMDAwMDAwLCAtNy41MzMwNTgpICI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .camera-control-layer .camera-control-wrapper li .control-item span {
  pointer-events: none;
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9BcnJvdzwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxnIGlkPSIxNi9QaG90by9HcmV5X0Fycm93IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPHBhdGggZD0iTTMsNS4wNjYxMTU3IEMzLjUsNC41NjYxMTU3IDcsNy4wNjYxMTU3IDgsNy4wNjYxMTU3IEM5LDcuMDY2MTE1NyAxMi41LDQuNTY2MTE1NyAxMyw1LjA2NjExNTcgQzEzLjUsNS41NjYxMTU3IDksMTAuMDY2MTE1NyA4LDEwLjA2NjExNTcgQzcsMTAuMDY2MTE1NyAyLjUsNS41NjYxMTU3IDMsNS4wNjYxMTU3IFoiIGlkPSJSZWN0YW5nbGUtMTIiIGZpbGw9IiM3QkQ5RkYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDguMDAwMDAwLCA3LjUzMzA1OCkgc2NhbGUoMSwgLTEpIHRyYW5zbGF0ZSgtOC4wMDAwMDAsIC03LjUzMzA1OCkgIj48L3BhdGg+DQogICAgPC9nPg0KPC9zdmc+') no-repeat center / cover;
  background-size: 12px;
}
.lm-player-container .camera-control-layer .camera-control-wrapper li.active .control-item span {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9CbHVlPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2L1Bob3RvL0dyZXlfQmx1ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDUuMDY2MTE1NyBDMy41LDQuNTY2MTE1NyA3LDcuMDY2MTE1NyA4LDcuMDY2MTE1NyBDOSw3LjA2NjExNTcgMTIuNSw0LjU2NjExNTcgMTMsNS4wNjYxMTU3IEMxMy41LDUuNTY2MTE1NyA5LDEwLjA2NjExNTcgOCwxMC4wNjYxMTU3IEM3LDEwLjA2NjExNTcgMi41LDUuNTY2MTE1NyAzLDUuMDY2MTE1NyBaIiBpZD0iUmVjdGFuZ2xlLTEyIiBmaWxsPSIjRkZGRkZGIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4LjAwMDAwMCwgNy41MzMwNTgpIHNjYWxlKDEsIC0xKSB0cmFuc2xhdGUoLTguMDAwMDAwLCAtNy41MzMwNTgpICI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .camera-control-layer .camera-control-wrapper .center-layer {
  width: 42px;
  height: 42px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background: #37415f url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjIycHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDIyIDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNnB4L1ZpZGVvL0Nsb3VkPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2cHgvVmlkZW8vQ2xvdWQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPg0KICAgICAgICA8cGF0aCBkPSJNMTQuNDczMzE5MywxMC45MTU3NjY4IEMxNC4zMzQ2ODA5LDExLjc0MzUwMTcgMTMuNjE0MzQxNSwxMi4zNzQ5Mjg5IDEyLjc0NzQyMDcsMTIuMzc0OTI4OSBDMTEuOTMyMzM3NCwxMi4zNzQ5Mjg5IDExLjI0NjgyOTgsMTEuODE2NzU2MyAxMS4wNTI1MzgyLDExLjA2MjA1MTEgQzExLjAzNDE2ODcsMTEuMDYyMDc1MSAxMS4wMTU3OTk4LDExLjA2MjA4NzEgMTAuOTk3NDMxNiwxMS4wNjIwODcxIEM1LjU2MTk2NTYxLDExLjA2MjA4NzEgMC4wNTk5OTk5OTg3LDEwLjAxMDM0MzcgMC4wNTk5OTk5OTg3LDcuOTk5NjA2MjUgQzAuMDU5OTk5OTk4Nyw2LjkxODk4ODAxIDEuNjU1OTkwMDIsNi4xMTgzNjgwMSAzLjk3MDM1MDU2LDUuNjA2NDk2MjEgQzMuODYzNjAxMjMsNS45MTYyNDQyNyAzLjc3OTYwMTc1LDYuMjMzODY3MjkgMy43MTU3MjcxNSw2LjU1OTM2NTI1IEMxLjkzNTk4ODI3LDYuOTk2ODYyNTIgMC45MzQ5OTQ1Myw3LjU0OTg1OTA2IDAuOTM0OTk0NTMsNy45OTk2MDYyNSBDMC45MzQ5OTQ1Myw4Ljg5MjEwMDY3IDQuODU0OTcwMDMsMTAuMTg3MDkyNiAxMC45OTc0MzE2LDEwLjE4NzA5MjYgQzExLjAxNTg4NjgsMTAuMTg3MDkyNiAxMS4wMzQzMjE5LDEwLjE4NzA4MDkgMTEuMDUyNzM2OSwxMC4xODcwNTc2IEMxMS4yNDcyOTY4LDkuNDMyNzQzMjggMTEuOTMyNjE1LDguODc0OTUwNzggMTIuNzQ3NDIwNyw4Ljg3NDk1MDc4IEMxMy41MTAzOTI0LDguODc0OTUwNzggMTQuMTU5ODI3Myw5LjM2NDAzMjQ3IDE0LjM5OTEwODUsMTAuMDQ1NTc5IEMxOC41NDk2NjQ1LDkuNjg1NzQ1NTcgMjEuMDU5ODY4Nyw4LjcxMzgwMzgyIDIxLjA1OTg2ODcsNy45OTk2MDYyNSBDMjEuMDU5ODY4Nyw3LjU0OTg1OTA2IDIwLjA1ODg3NSw2Ljk5Njg2MjUyIDE4LjI4MDAxMTEsNi41NTkzNjUyNSBDMTguMjE1MjYxNSw2LjIzMzg2NzI5IDE4LjEzMTI2MjEsNS45MTYyNDQyNyAxOC4wMjUzODc3LDUuNjA2NDk2MjEgQzIwLjMzODg3MzMsNi4xMTgzNjgwMSAyMS45MzQ4NjMzLDYuOTE4OTg4MDEgMjEuOTM0ODYzMyw3Ljk5OTYwNjI1IEMyMS45MzQ4NjMzLDkuNTc1OTU4MDYgMTguNTUzMzMxNywxMC41NjI5MDgxIDE0LjQ3MzMxOTMsMTAuOTE1NzY2OCBaIE0xNC44MjgxNTY2LDExLjMxNTM5OCBDMTUuNjc3Nzc2MywxMS4yMzQwMjM1IDE2LjUyOTE0NiwxMS4xMTc2NDkzIDE3LjM0NDY0MDksMTAuOTY5Nzc1MiBDMTYuMjI2Mzk3OSwxMy4zNDg4ODUzIDEzLjgxNTc4OCwxNSAxMS4wMTMxODA1LDE1IEM4LjIwOTY5Nzk5LDE1IDUuNzk3MzM4MDcsMTMuMzQ3MTM1MyA0LjY3OTk3MDA2LDEwLjk2NzE1MDIgQzYuNjk3NzA3NDQsMTEuMzM0NjQ3OSA4Ljk1ODY5MzMxLDExLjQ4NTE0NyAxMC43NTk0MzIxLDExLjQ5NzM5NjkgQzExLjA5NzE3OTksMTIuMjcwMDE3MSAxMS44NjcxNzUxLDEyLjgxMjUxMzcgMTIuNzYzMTY5NSwxMi44MTI1MTM3IEMxMy43MjY1Mzg1LDEyLjgxMjUxMzcgMTQuNTM2NzgzNSwxMi4xODI1MTc2IDE0LjgyODE1NjYsMTEuMzE1Mzk4IFogTTEwLjc0NzE4MzIsOS43NDY0NDUzMyBDNy44NjMyMDEyMyw5LjcyOTgyMDQ0IDUuNjQ5NDY1MDYsOS40Mjk2OTczMSA0LjA4OTM0OTgyLDkuMDc2MTk5NTIgQzQuMDM0MjI1MTYsOC43MjQ0NTE3MiAzLjk5NzQ3NTM5LDguMzY2NTc4OTYgMy45OTc0NzUzOSw3Ljk5OTk1NjI1IEMzLjk5NzQ3NTM5LDQuMTMzMzU1NDIgNy4xMzE3MDU4LDEgMTAuOTk3NDMxNiwxIEMxNC44NjQwMzI1LDEgMTcuOTk3Mzg3OSw0LjEzMzM1NTQyIDE3Ljk5NzM4NzksNy45OTk5NTYyNSBDMTcuOTk3Mzg3OSw4LjM2Mzk1Mzk4IDE3Ljk2MTUxMzEsOC43MTgzMjY3NiAxNy45MDgxMzg0LDkuMDY3NDQ5NTggQzE3LjAzMTM5MzksOS4yNzA0NDgzMSAxNS45NTYwMjU2LDkuNDU1MDcyMTYgMTQuNjU3NTMzOCw5LjU4MDE5NjM3IEMxNC4yODQ3ODYxLDguOTAyOTUwNjEgMTMuNTczNDE1NSw4LjQzNzQ1MzUyIDEyLjc0NzQyMDcsOC40Mzc0NTM1MiBDMTEuODU0MDUxMyw4LjQzNzQ1MzUyIDExLjA4NjY4MTEsOC45NzczMjUxNCAxMC43NDcxODMyLDkuNzQ2NDQ1MzMgWiIgaWQ9IkZpbGwtOCIgZmlsbD0iI0ZGRkZGRiI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 70% 70%;
}

.custom-slider-container {
  -webkit-user-drag: none;
}
.custom-slider-container.ant-slider-vertical {
  height: 100%;
}
.custom-slider-container.ant-slider-vertical:hover {
  height: 100%;
}
.custom-slider-container.ant-slider-vertical > div {
  height: 100%;
}
.custom-slider-container.ant-slider-vertical > div .ant-slider-track {
  bottom: 0;
}
.custom-slider-container.audio-change-item .ant-slider-handle {
  margin-left: -3px;
}
.custom-slider-container.audio-change-item.ant-slider,
.custom-slider-container.audio-change-item.ant-slider:hover {
  padding: 0px !important;
}
.custom-slider-container.audio-change-item.ant-slider > div,
.custom-slider-container.audio-change-item.ant-slider:hover > div {
  padding-left: 4px;
}
.custom-slider-container.audio-change-item.ant-slider .ant-slider-rail,
.custom-slider-container.audio-change-item.ant-slider:hover .ant-slider-rail {
  height: 100%;
}

.lm-player-container.lm-player-hide-bar .function-control-layer {
  opacity: 0;
  z-index: -2;
}
.lm-player-container .function-control-layer {
  cursor: default;
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 30px;
  right: 0;
  opacity: 1;
  z-index: 10;
  transition: all 0.3s;
}
.lm-player-container .function-control-layer .layout-content {
  cursor: default;
  /* width: 100%; */
  position: absolute;
  /* bottom: 0; */
  /* left: 40px; */
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 310px;
  height: 100%;
  right: -310px;
  background: #1A2233;
  bottom: -30px;
  padding: 10px;
}
.lm-player-container .function-control-layer .layout-content .header {
  text-align: right;
}
.lm-player-container .function-control-layer .layout-content .header .icon-close {
  font-size: 16px;
  color: #fff;
  cursor: pointer;
}
.lm-player-container .function-control-layer .layout-content .module-box {
  height: 225px;
  background: #252F41;
  padding: 5px;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box {
  height: 180px;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box .function-tools {
  width: 56px;
  height: 100%;
  background: #293448;
  border: 1px solid #445780;
  float: right;
  margin: 0 25px 0 0;
  border-radius: 40px 40px 40px 40px;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  text-align: center;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box .function-tools .btn {
  font-size: 12px;
  font-weight: 400;
  color: #B5BBC7;
  line-height: 17px;
  cursor: pointer;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box .function-tools .btn:hover {
  font-size: 14px;
  font-weight: 800;
  color: #2CD0D0;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box .function-tools .active {
  font-size: 14px;
  font-weight: 800;
  color: #2CD0D0;
}
.lm-player-container .function-control-layer .layout-content .module-box .top-box .function-tools .add-btn {
  font-size: 22px !important;
}
.lm-player-container .function-control-layer .layout-content .switch-box {
  width: 100%;
  height: 50px;
  line-height: 50px;
  background: rgba(37, 47, 65, 0.4);
  margin-top: 10px;
  border-radius: 2px;
}
.lm-player-container .function-control-layer .layout-content .switch-box:hover {
  background: #252F41;
  border-radius: 2px;
}
.lm-player-container .function-control-layer .layout-content .switch-box:hover .icon-box {
  background: rgba(30, 203, 206, 0.29);
  border: 1px solid #16B1BD;
}
.lm-player-container .function-control-layer .layout-content .switch-box .icon-box {
  position: absolute;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-block;
  margin: 7px 0 0 10px;
  FONT-VARIANT: JIS78;
  color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(37, 47, 65, 0.4);
  text-align: center;
  background: #131926;
  line-height: 35px;
}
.lm-player-container .function-control-layer .layout-content .switch-box .icon-box .icon {
  font-size: 16px;
}
.lm-player-container .function-control-layer .layout-content .switch-box .tip-txt {
  display: inline-block;
  font-size: 14px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.8);
  line-height: 20px;
  margin-left: 50px;
}
.lm-player-container .function-control-layer .layout-content .switch-box .btn {
  display: inline-block;
  font-size: 12px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.3);
  float: right;
  margin-right: 17px;
}
.lm-player-container .function-control-layer .layout-content .switch-box .btn .ant-switch-checked {
  background-color: #1ECBCE;
}
.lm-player-container .function-control-layer .ptz-btn {
  position: absolute;
  width: 30px;
  height: 24px;
  bottom: 0;
  right: 0;
  cursor: pointer;
  background: rgba(29, 33, 53, 0.8);
  border-radius: 100px 0 0 100px;
}
.lm-player-container .function-control-layer .ptz-btn .ptz-status-icon {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 4px;
  left: 8px;
  z-index: 9;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9CYXIvT3Blbl9XaGl0ZTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDMgQzMuNTUyMjg0NzUsMyA0LDMuNDQ3NzE1MjUgNCw0IEw0LDEyIEwxMiwxMiBDMTIuNTUyMjg0NywxMiAxMywxMi40NDc3MTUzIDEzLDEzIEMxMywxMy41NTIyODQ3IDEyLjU1MjI4NDcsMTQgMTIsMTQgTDIsMTQgTDIsNCBDMiwzLjQ0NzcxNTI1IDIuNDQ3NzE1MjUsMyAzLDMgWiBNNyw0IEM3LjU1MjI4NDc1LDQgOCw0LjQ0NzcxNTI1IDgsNSBMOCw4IEwxMSw4IEMxMS41NTIyODQ3LDggMTIsOC40NDc3MTUyNSAxMiw5IEMxMiw5LjU1MjI4NDc1IDExLjU1MjI4NDcsMTAgMTEsMTAgTDYsMTAgTDYsNSBDNiw0LjQ0NzcxNTI1IDYuNDQ3NzE1MjUsNCA3LDQgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPg0KICAgICAgICA8ZmlsdGVyIHg9Ii02OC4yJSIgeT0iLTY4LjIlIiB3aWR0aD0iMjM2LjQlIiBoZWlnaHQ9IjIzNi40JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTIiPg0KICAgICAgICAgICAgPGZlT2Zmc2V0IGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4NCiAgICAgICAgICAgIDxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIj48L2ZlR2F1c3NpYW5CbHVyPg0KICAgICAgICAgICAgPGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMDE5NjA3ODQzMSAgIDAgMCAwIDAgMC4wMzUyOTQxMTc2ICAgMCAwIDAgMCAwLjI3MDU4ODIzNSAgMCAwIDAgMC41IDAiIHR5cGU9Im1hdHJpeCIgaW49InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD4NCiAgICAgICAgPC9maWx0ZXI+DQogICAgPC9kZWZzPg0KICAgIDxnIGlkPSIxNi9CYXIvT3Blbl9XaGl0ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtNSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNy41MDAwMDAsIDguNTAwMDAwKSBzY2FsZSgtMSwgLTEpIHRyYW5zbGF0ZSgtNy41MDAwMDAsIC04LjUwMDAwMCkgIj4NCiAgICAgICAgICAgIDx1c2UgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMSIgZmlsdGVyPSJ1cmwoI2ZpbHRlci0yKSIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+DQogICAgICAgICAgICA8dXNlIGZpbGw9IiNGRkZGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+DQogICAgICAgIDwvZz4NCiAgICA8L2c+DQo8L3N2Zz4=') no-repeat center;
}
.lm-player-container .function-control-layer .ptz-btn.open .ptz-status-icon {
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9CYXIvSGlkZV9XaGl0ZTwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+DQogICAgICAgIDxwYXRoIGQ9Ik00LDIgQzQuNTUyMjg0NzUsMiA1LDIuNDQ3NzE1MjUgNSwzIEw1LDExIEwxMywxMSBDMTMuNTUyMjg0NywxMSAxNCwxMS40NDc3MTUzIDE0LDEyIEMxNCwxMi41NTIyODQ3IDEzLjU1MjI4NDcsMTMgMTMsMTMgTDMsMTMgTDMsMyBDMywyLjQ0NzcxNTI1IDMuNDQ3NzE1MjUsMiA0LDIgWiBNOCwzIEM4LjU1MjI4NDc1LDMgOSwzLjQ0NzcxNTI1IDksNCBMOSw3IEwxMiw3IEMxMi41NTIyODQ3LDcgMTMsNy40NDc3MTUyNSAxMyw4IEMxMyw4LjU1MjI4NDc1IDEyLjU1MjI4NDcsOSAxMiw5IEw3LDkgTDcsNCBDNywzLjQ0NzcxNTI1IDcuNDQ3NzE1MjUsMyA4LDMgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPg0KICAgICAgICA8ZmlsdGVyIHg9Ii02OC4yJSIgeT0iLTY4LjIlIiB3aWR0aD0iMjM2LjQlIiBoZWlnaHQ9IjIzNi40JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTIiPg0KICAgICAgICAgICAgPGZlT2Zmc2V0IGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4NCiAgICAgICAgICAgIDxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIj48L2ZlR2F1c3NpYW5CbHVyPg0KICAgICAgICAgICAgPGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMDE5NjA3ODQzMSAgIDAgMCAwIDAgMC4wMzUyOTQxMTc2ICAgMCAwIDAgMCAwLjI3MDU4ODIzNSAgMCAwIDAgMC41IDAiIHR5cGU9Im1hdHJpeCIgaW49InNoYWRvd0JsdXJPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD4NCiAgICAgICAgPC9maWx0ZXI+DQogICAgPC9kZWZzPg0KICAgIDxnIGlkPSIxNi9CYXIvSGlkZV9XaGl0ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtNSI+DQogICAgICAgICAgICA8dXNlIGZpbGw9ImJsYWNrIiBmaWxsLW9wYWNpdHk9IjEiIGZpbHRlcj0idXJsKCNmaWx0ZXItMikiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPg0KICAgICAgICAgICAgPHVzZSBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPg0KICAgICAgICA8L2c+DQogICAgPC9nPg0KPC9zdmc+');
}
.lm-player-container .function-control-layer .box-zoom,
.lm-player-container .function-control-layer .box-focus {
  width: 64px;
  height: 24px;
  background: rgba(29, 33, 53, 0.8);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lm-player-container .function-control-layer .box-zoom > span,
.lm-player-container .function-control-layer .box-focus > span {
  color: #8899bb;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
}
.lm-player-container .function-control-layer .box-zoom > span .anticon,
.lm-player-container .function-control-layer .box-focus > span .anticon {
  width: 16px;
  height: 16px;
  font-size: 16px;
  text-align: center;
  line-height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.lm-player-container .function-control-layer .box-zoom .zoomin:hover,
.lm-player-container .function-control-layer .box-focus .zoomin:hover,
.lm-player-container .function-control-layer .box-zoom .zoomout:hover,
.lm-player-container .function-control-layer .box-focus .zoomout:hover,
.lm-player-container .function-control-layer .box-zoom .focusin:hover,
.lm-player-container .function-control-layer .box-focus .focusin:hover,
.lm-player-container .function-control-layer .box-zoom .focusout:hover,
.lm-player-container .function-control-layer .box-focus .focusout:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 100%;
}
.lm-player-container .function-control-layer .box-zoom .focusauto:hover,
.lm-player-container .function-control-layer .box-focus .focusauto:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 80%;
}
.lm-player-container .function-control-layer .box-zoom .box-label,
.lm-player-container .function-control-layer .box-focus .box-label {
  cursor: default;
}
.lm-player-container .function-control-layer .box-zoom.disabled,
.lm-player-container .function-control-layer .box-focus.disabled {
  opacity: 0.6;
  pointer-events: none;
}
.lm-player-container .function-control-layer .box-zoom.disabled > span,
.lm-player-container .function-control-layer .box-focus.disabled > span {
  cursor: default;
}
.lm-player-container .function-control-layer .box-focus {
  width: 90px;
  left: 80px;
}
.lm-player-container .function-control-layer .box-focus .focusauto {
  width: 30px;
  height: 24px;
  margin-left: 2px;
  opacity: 0.7;
  background-image: linear-gradient(194deg, #464c8b 0%, #0b1532 99%);
  box-shadow: 0 2px 4px 0 #2b3551;
  border-radius: 0 16px 16px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lm-player-container .function-control-layer .box-focus .focusauto .anticon {
  font-size: 16px;
}
.lm-player-container .function-control-layer .box-speed {
  width: 100%;
  height: 24px;
  margin-top: 8px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.lm-player-container .function-control-layer .box-speed .tip {
  font-size: 12px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 24px;
  padding-left: 10px;
}
.lm-player-container .function-control-layer .box-speed .tip-icon {
  color: #FFFFFF;
}
.lm-player-container .function-control-layer .box-speed .ant-slider {
  margin: 8px 10px 0 4px;
  flex: 1;
  top: 1px;
}
.lm-player-container .function-control-layer .box-speed .ant-slider .ant-slider-rail {
  height: 2px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.4);
}
.lm-player-container .function-control-layer .box-speed .ant-slider .ant-slider-track {
  height: 2px;
  border-radius: 2px;
  position: relative;
  top: -2px;
  background: #2cd0d0;
}
.lm-player-container .function-control-layer .box-speed .ant-slider .ant-slider-handle {
  height: 10px;
  width: 10px;
  border: 2px solid #ffffff;
  position: relative;
  top: -7px;
  border-radius: 50%;
  background: #ffffff;
  cursor: pointer;
}
.lm-player-container .function-control-layer .box-speed .box-speed-icon {
  width: 16px;
  height: 16px;
  margin: 0 4px 0 8px;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNi9WaWRlby9TcGVlZDwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxnIGlkPSIxNi9WaWRlby9TcGVlZCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik03LjgxNDM4MDMxLDcuNTExMzcxODEgQzcuMDczNTM2ODEsNy42MDI4MDQ0NCA2LjUsOC4yMzQ0MjM4NyA2LjUsOSBDNi41LDkuODI4NDI3MTIgNy4xNzE1NzI4OCwxMC41IDgsMTAuNSBDOC43NjU1NzYxMywxMC41IDkuMzk3MTk1NTYsOS45MjY0NjMxOSA5LjQ4ODYyODE5LDkuMTg1NjE5NjkgTDEyLDUgTDcuODE0MzgwMzEsNy41MTEzNzE4MSBaIE0zLjEwMTAxNzI2LDE0IEMxLjgwNDQ2NzIxLDEyLjcyOTQ4MyAxLDEwLjk1ODY4ODIgMSw5IEMxLDUuMTM0MDA2NzUgNC4xMzQwMDY3NSwyIDgsMiBDMTEuODY1OTkzMiwyIDE1LDUuMTM0MDA2NzUgMTUsOSBDMTUsMTAuOTU4Njg4MiAxNC4xOTU1MzI4LDEyLjcyOTQ4MyAxMi44OTg5ODI3LDE0IEwzLjEwMTAxNzI2LDE0IFogTTUuNSwxMiBDNS4yMjM4NTc2MywxMiA1LDEyLjIyMzg1NzYgNSwxMi41IEM1LDEyLjc3NjE0MjQgNS4yMjM4NTc2MywxMyA1LjUsMTMgTDEwLjUsMTMgQzEwLjc3NjE0MjQsMTMgMTEsMTIuNzc2MTQyNCAxMSwxMi41IEMxMSwxMi4yMjM4NTc2IDEwLjc3NjE0MjQsMTIgMTAuNSwxMiBMNS41LDEyIFoiIGlkPSJDb21iaW5lZC1TaGFwZSIgZmlsbD0iI0ZGRkZGRiI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .function-control-layer .camera-control-wrapper {
  overflow: hidden;
  position: absolute;
  margin: auto;
  left: 19px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: #293448;
  margin-top: 10px;
}
.lm-player-container .function-control-layer .camera-control-wrapper li {
  position: absolute;
  font-size: 15px;
  width: 88px;
  height: 62px;
  transform-origin: 100% 100%;
  overflow: hidden;
  left: -1%;
  top: 14%;
  /* background: rgba(29, 33, 53, 0.8); */
  background: #293448;
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(1) {
  transform: rotate(67.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(2) {
  transform: rotate(112.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(3) {
  transform: rotate(157.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(4) {
  transform: rotate(202.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(5) {
  transform: rotate(247.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(6) {
  transform: rotate(292.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(7) {
  transform: rotate(337.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(8) {
  transform: rotate(382.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li:nth-child(9) {
  transform: rotate(427.5deg) skew(45deg);
}
.lm-player-container .function-control-layer .camera-control-wrapper li .control-item {
  display: block;
  font-size: 18px;
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  position: absolute;
  bottom: 1px;
  right: 8px;
  transform: skew(-45deg) rotate(-67deg);
  cursor: pointer;
}
.lm-player-container .function-control-layer .camera-control-wrapper li .control-item:hover {
  border-radius: 50%;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCIgdmlld0JveD0iMCAwIDM2IDM2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+Tm93X0xpZ2h0PC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz4NCiAgICAgICAgPHJhZGlhbEdyYWRpZW50IGN4PSI1MCUiIGN5PSI1MCUiIGZ4PSI1MCUiIGZ5PSI1MCUiIHI9IjUwJSIgaWQ9InJhZGlhbEdyYWRpZW50LTEiPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgb2Zmc2V0PSIwJSI+PC9zdG9wPg0KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzc4RDlGRiIgc3RvcC1vcGFjaXR5PSIwIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4NCiAgICAgICAgPC9yYWRpYWxHcmFkaWVudD4NCiAgICA8L2RlZnM+DQogICAgPGcgaWQ9IjJf5LqR54Of55uR5o6nIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPGcgaWQ9IjJfVmlkZW9fMV9Ob3dfQ2xvdWRPcGVuIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM2LjAwMDAwMCwgLTg1Ni4wMDAwMDApIiBmaWxsPSJ1cmwoI3JhZGlhbEdyYWRpZW50LTEpIj4NCiAgICAgICAgICAgIDxnIGlkPSJDbG91ZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzkuMDAwMDAwLCA3NTYuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgPGcgaWQ9IkJ0biIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzAuMDAwMDAwLCAwLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJOb3dfTGlnaHQiIGN4PSI4NSIgY3k9IjExOCIgcj0iMTgiPjwvY2lyY2xlPg0KICAgICAgICAgICAgICAgIDwvZz4NCiAgICAgICAgICAgIDwvZz4NCiAgICAgICAgPC9nPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 80%;
}
.lm-player-container .function-control-layer .camera-control-wrapper li .control-item:hover span {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9CbHVlPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2L1Bob3RvL0dyZXlfQmx1ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDUuMDY2MTE1NyBDMy41LDQuNTY2MTE1NyA3LDcuMDY2MTE1NyA4LDcuMDY2MTE1NyBDOSw3LjA2NjExNTcgMTIuNSw0LjU2NjExNTcgMTMsNS4wNjYxMTU3IEMxMy41LDUuNTY2MTE1NyA5LDEwLjA2NjExNTcgOCwxMC4wNjYxMTU3IEM3LDEwLjA2NjExNTcgMi41LDUuNTY2MTE1NyAzLDUuMDY2MTE1NyBaIiBpZD0iUmVjdGFuZ2xlLTEyIiBmaWxsPSIjRkZGRkZGIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4LjAwMDAwMCwgNy41MzMwNTgpIHNjYWxlKDEsIC0xKSB0cmFuc2xhdGUoLTguMDAwMDAwLCAtNy41MzMwNTgpICI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .function-control-layer .camera-control-wrapper li .control-item span {
  pointer-events: none;
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9BcnJvdzwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxnIGlkPSIxNi9QaG90by9HcmV5X0Fycm93IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICAgICAgPHBhdGggZD0iTTMsNS4wNjYxMTU3IEMzLjUsNC41NjYxMTU3IDcsNy4wNjYxMTU3IDgsNy4wNjYxMTU3IEM5LDcuMDY2MTE1NyAxMi41LDQuNTY2MTE1NyAxMyw1LjA2NjExNTcgQzEzLjUsNS41NjYxMTU3IDksMTAuMDY2MTE1NyA4LDEwLjA2NjExNTcgQzcsMTAuMDY2MTE1NyAyLjUsNS41NjYxMTU3IDMsNS4wNjYxMTU3IFoiIGlkPSJSZWN0YW5nbGUtMTIiIGZpbGw9IiM3QkQ5RkYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDguMDAwMDAwLCA3LjUzMzA1OCkgc2NhbGUoMSwgLTEpIHRyYW5zbGF0ZSgtOC4wMDAwMDAsIC03LjUzMzA1OCkgIj48L3BhdGg+DQogICAgPC9nPg0KPC9zdmc+') no-repeat center / cover;
  background-size: 12px;
}
.lm-player-container .function-control-layer .camera-control-wrapper li.active .control-item span {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDE2IDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTEgKDU3NDYyKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8dGl0bGU+MTYvUGhvdG8vR3JleV9CbHVlPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2L1Bob3RvL0dyZXlfQmx1ZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgICAgIDxwYXRoIGQ9Ik0zLDUuMDY2MTE1NyBDMy41LDQuNTY2MTE1NyA3LDcuMDY2MTE1NyA4LDcuMDY2MTE1NyBDOSw3LjA2NjExNTcgMTIuNSw0LjU2NjExNTcgMTMsNS4wNjYxMTU3IEMxMy41LDUuNTY2MTE1NyA5LDEwLjA2NjExNTcgOCwxMC4wNjYxMTU3IEM3LDEwLjA2NjExNTcgMi41LDUuNTY2MTE1NyAzLDUuMDY2MTE1NyBaIiBpZD0iUmVjdGFuZ2xlLTEyIiBmaWxsPSIjRkZGRkZGIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4LjAwMDAwMCwgNy41MzMwNTgpIHNjYWxlKDEsIC0xKSB0cmFuc2xhdGUoLTguMDAwMDAwLCAtNy41MzMwNTgpICI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / cover;
}
.lm-player-container .function-control-layer .camera-control-wrapper .center-layer {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  z-index: 99;
  background: #37415f url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjIycHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDIyIDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNnB4L1ZpZGVvL0Nsb3VkPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2cHgvVmlkZW8vQ2xvdWQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPg0KICAgICAgICA8cGF0aCBkPSJNMTQuNDczMzE5MywxMC45MTU3NjY4IEMxNC4zMzQ2ODA5LDExLjc0MzUwMTcgMTMuNjE0MzQxNSwxMi4zNzQ5Mjg5IDEyLjc0NzQyMDcsMTIuMzc0OTI4OSBDMTEuOTMyMzM3NCwxMi4zNzQ5Mjg5IDExLjI0NjgyOTgsMTEuODE2NzU2MyAxMS4wNTI1MzgyLDExLjA2MjA1MTEgQzExLjAzNDE2ODcsMTEuMDYyMDc1MSAxMS4wMTU3OTk4LDExLjA2MjA4NzEgMTAuOTk3NDMxNiwxMS4wNjIwODcxIEM1LjU2MTk2NTYxLDExLjA2MjA4NzEgMC4wNTk5OTk5OTg3LDEwLjAxMDM0MzcgMC4wNTk5OTk5OTg3LDcuOTk5NjA2MjUgQzAuMDU5OTk5OTk4Nyw2LjkxODk4ODAxIDEuNjU1OTkwMDIsNi4xMTgzNjgwMSAzLjk3MDM1MDU2LDUuNjA2NDk2MjEgQzMuODYzNjAxMjMsNS45MTYyNDQyNyAzLjc3OTYwMTc1LDYuMjMzODY3MjkgMy43MTU3MjcxNSw2LjU1OTM2NTI1IEMxLjkzNTk4ODI3LDYuOTk2ODYyNTIgMC45MzQ5OTQ1Myw3LjU0OTg1OTA2IDAuOTM0OTk0NTMsNy45OTk2MDYyNSBDMC45MzQ5OTQ1Myw4Ljg5MjEwMDY3IDQuODU0OTcwMDMsMTAuMTg3MDkyNiAxMC45OTc0MzE2LDEwLjE4NzA5MjYgQzExLjAxNTg4NjgsMTAuMTg3MDkyNiAxMS4wMzQzMjE5LDEwLjE4NzA4MDkgMTEuMDUyNzM2OSwxMC4xODcwNTc2IEMxMS4yNDcyOTY4LDkuNDMyNzQzMjggMTEuOTMyNjE1LDguODc0OTUwNzggMTIuNzQ3NDIwNyw4Ljg3NDk1MDc4IEMxMy41MTAzOTI0LDguODc0OTUwNzggMTQuMTU5ODI3Myw5LjM2NDAzMjQ3IDE0LjM5OTEwODUsMTAuMDQ1NTc5IEMxOC41NDk2NjQ1LDkuNjg1NzQ1NTcgMjEuMDU5ODY4Nyw4LjcxMzgwMzgyIDIxLjA1OTg2ODcsNy45OTk2MDYyNSBDMjEuMDU5ODY4Nyw3LjU0OTg1OTA2IDIwLjA1ODg3NSw2Ljk5Njg2MjUyIDE4LjI4MDAxMTEsNi41NTkzNjUyNSBDMTguMjE1MjYxNSw2LjIzMzg2NzI5IDE4LjEzMTI2MjEsNS45MTYyNDQyNyAxOC4wMjUzODc3LDUuNjA2NDk2MjEgQzIwLjMzODg3MzMsNi4xMTgzNjgwMSAyMS45MzQ4NjMzLDYuOTE4OTg4MDEgMjEuOTM0ODYzMyw3Ljk5OTYwNjI1IEMyMS45MzQ4NjMzLDkuNTc1OTU4MDYgMTguNTUzMzMxNywxMC41NjI5MDgxIDE0LjQ3MzMxOTMsMTAuOTE1NzY2OCBaIE0xNC44MjgxNTY2LDExLjMxNTM5OCBDMTUuNjc3Nzc2MywxMS4yMzQwMjM1IDE2LjUyOTE0NiwxMS4xMTc2NDkzIDE3LjM0NDY0MDksMTAuOTY5Nzc1MiBDMTYuMjI2Mzk3OSwxMy4zNDg4ODUzIDEzLjgxNTc4OCwxNSAxMS4wMTMxODA1LDE1IEM4LjIwOTY5Nzk5LDE1IDUuNzk3MzM4MDcsMTMuMzQ3MTM1MyA0LjY3OTk3MDA2LDEwLjk2NzE1MDIgQzYuNjk3NzA3NDQsMTEuMzM0NjQ3OSA4Ljk1ODY5MzMxLDExLjQ4NTE0NyAxMC43NTk0MzIxLDExLjQ5NzM5NjkgQzExLjA5NzE3OTksMTIuMjcwMDE3MSAxMS44NjcxNzUxLDEyLjgxMjUxMzcgMTIuNzYzMTY5NSwxMi44MTI1MTM3IEMxMy43MjY1Mzg1LDEyLjgxMjUxMzcgMTQuNTM2NzgzNSwxMi4xODI1MTc2IDE0LjgyODE1NjYsMTEuMzE1Mzk4IFogTTEwLjc0NzE4MzIsOS43NDY0NDUzMyBDNy44NjMyMDEyMyw5LjcyOTgyMDQ0IDUuNjQ5NDY1MDYsOS40Mjk2OTczMSA0LjA4OTM0OTgyLDkuMDc2MTk5NTIgQzQuMDM0MjI1MTYsOC43MjQ0NTE3MiAzLjk5NzQ3NTM5LDguMzY2NTc4OTYgMy45OTc0NzUzOSw3Ljk5OTk1NjI1IEMzLjk5NzQ3NTM5LDQuMTMzMzU1NDIgNy4xMzE3MDU4LDEgMTAuOTk3NDMxNiwxIEMxNC44NjQwMzI1LDEgMTcuOTk3Mzg3OSw0LjEzMzM1NTQyIDE3Ljk5NzM4NzksNy45OTk5NTYyNSBDMTcuOTk3Mzg3OSw4LjM2Mzk1Mzk4IDE3Ljk2MTUxMzEsOC43MTgzMjY3NiAxNy45MDgxMzg0LDkuMDY3NDQ5NTggQzE3LjAzMTM5MzksOS4yNzA0NDgzMSAxNS45NTYwMjU2LDkuNDU1MDcyMTYgMTQuNjU3NTMzOCw5LjU4MDE5NjM3IEMxNC4yODQ3ODYxLDguOTAyOTUwNjEgMTMuNTczNDE1NSw4LjQzNzQ1MzUyIDEyLjc0NzQyMDcsOC40Mzc0NTM1MiBDMTEuODU0MDUxMyw4LjQzNzQ1MzUyIDExLjA4NjY4MTEsOC45NzczMjUxNCAxMC43NDcxODMyLDkuNzQ2NDQ1MzMgWiIgaWQ9IkZpbGwtOCIgZmlsbD0iI0ZGRkZGRiI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 70% 70%;
}
.lm-player-container .function-control-layer .camera-control-wrapper .focusing-layer {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  z-index: 99;
  background: #37415f url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjIycHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDIyIDE2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNTAuMiAoNTUwNDcpIC0gaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoIC0tPg0KICAgIDx0aXRsZT4xNnB4L1ZpZGVvL0Nsb3VkPC90aXRsZT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPGcgaWQ9IjE2cHgvVmlkZW8vQ2xvdWQiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPg0KICAgICAgICA8cGF0aCBkPSJNMTQuNDczMzE5MywxMC45MTU3NjY4IEMxNC4zMzQ2ODA5LDExLjc0MzUwMTcgMTMuNjE0MzQxNSwxMi4zNzQ5Mjg5IDEyLjc0NzQyMDcsMTIuMzc0OTI4OSBDMTEuOTMyMzM3NCwxMi4zNzQ5Mjg5IDExLjI0NjgyOTgsMTEuODE2NzU2MyAxMS4wNTI1MzgyLDExLjA2MjA1MTEgQzExLjAzNDE2ODcsMTEuMDYyMDc1MSAxMS4wMTU3OTk4LDExLjA2MjA4NzEgMTAuOTk3NDMxNiwxMS4wNjIwODcxIEM1LjU2MTk2NTYxLDExLjA2MjA4NzEgMC4wNTk5OTk5OTg3LDEwLjAxMDM0MzcgMC4wNTk5OTk5OTg3LDcuOTk5NjA2MjUgQzAuMDU5OTk5OTk4Nyw2LjkxODk4ODAxIDEuNjU1OTkwMDIsNi4xMTgzNjgwMSAzLjk3MDM1MDU2LDUuNjA2NDk2MjEgQzMuODYzNjAxMjMsNS45MTYyNDQyNyAzLjc3OTYwMTc1LDYuMjMzODY3MjkgMy43MTU3MjcxNSw2LjU1OTM2NTI1IEMxLjkzNTk4ODI3LDYuOTk2ODYyNTIgMC45MzQ5OTQ1Myw3LjU0OTg1OTA2IDAuOTM0OTk0NTMsNy45OTk2MDYyNSBDMC45MzQ5OTQ1Myw4Ljg5MjEwMDY3IDQuODU0OTcwMDMsMTAuMTg3MDkyNiAxMC45OTc0MzE2LDEwLjE4NzA5MjYgQzExLjAxNTg4NjgsMTAuMTg3MDkyNiAxMS4wMzQzMjE5LDEwLjE4NzA4MDkgMTEuMDUyNzM2OSwxMC4xODcwNTc2IEMxMS4yNDcyOTY4LDkuNDMyNzQzMjggMTEuOTMyNjE1LDguODc0OTUwNzggMTIuNzQ3NDIwNyw4Ljg3NDk1MDc4IEMxMy41MTAzOTI0LDguODc0OTUwNzggMTQuMTU5ODI3Myw5LjM2NDAzMjQ3IDE0LjM5OTEwODUsMTAuMDQ1NTc5IEMxOC41NDk2NjQ1LDkuNjg1NzQ1NTcgMjEuMDU5ODY4Nyw4LjcxMzgwMzgyIDIxLjA1OTg2ODcsNy45OTk2MDYyNSBDMjEuMDU5ODY4Nyw3LjU0OTg1OTA2IDIwLjA1ODg3NSw2Ljk5Njg2MjUyIDE4LjI4MDAxMTEsNi41NTkzNjUyNSBDMTguMjE1MjYxNSw2LjIzMzg2NzI5IDE4LjEzMTI2MjEsNS45MTYyNDQyNyAxOC4wMjUzODc3LDUuNjA2NDk2MjEgQzIwLjMzODg3MzMsNi4xMTgzNjgwMSAyMS45MzQ4NjMzLDYuOTE4OTg4MDEgMjEuOTM0ODYzMyw3Ljk5OTYwNjI1IEMyMS45MzQ4NjMzLDkuNTc1OTU4MDYgMTguNTUzMzMxNywxMC41NjI5MDgxIDE0LjQ3MzMxOTMsMTAuOTE1NzY2OCBaIE0xNC44MjgxNTY2LDExLjMxNTM5OCBDMTUuNjc3Nzc2MywxMS4yMzQwMjM1IDE2LjUyOTE0NiwxMS4xMTc2NDkzIDE3LjM0NDY0MDksMTAuOTY5Nzc1MiBDMTYuMjI2Mzk3OSwxMy4zNDg4ODUzIDEzLjgxNTc4OCwxNSAxMS4wMTMxODA1LDE1IEM4LjIwOTY5Nzk5LDE1IDUuNzk3MzM4MDcsMTMuMzQ3MTM1MyA0LjY3OTk3MDA2LDEwLjk2NzE1MDIgQzYuNjk3NzA3NDQsMTEuMzM0NjQ3OSA4Ljk1ODY5MzMxLDExLjQ4NTE0NyAxMC43NTk0MzIxLDExLjQ5NzM5NjkgQzExLjA5NzE3OTksMTIuMjcwMDE3MSAxMS44NjcxNzUxLDEyLjgxMjUxMzcgMTIuNzYzMTY5NSwxMi44MTI1MTM3IEMxMy43MjY1Mzg1LDEyLjgxMjUxMzcgMTQuNTM2NzgzNSwxMi4xODI1MTc2IDE0LjgyODE1NjYsMTEuMzE1Mzk4IFogTTEwLjc0NzE4MzIsOS43NDY0NDUzMyBDNy44NjMyMDEyMyw5LjcyOTgyMDQ0IDUuNjQ5NDY1MDYsOS40Mjk2OTczMSA0LjA4OTM0OTgyLDkuMDc2MTk5NTIgQzQuMDM0MjI1MTYsOC43MjQ0NTE3MiAzLjk5NzQ3NTM5LDguMzY2NTc4OTYgMy45OTc0NzUzOSw3Ljk5OTk1NjI1IEMzLjk5NzQ3NTM5LDQuMTMzMzU1NDIgNy4xMzE3MDU4LDEgMTAuOTk3NDMxNiwxIEMxNC44NjQwMzI1LDEgMTcuOTk3Mzg3OSw0LjEzMzM1NTQyIDE3Ljk5NzM4NzksNy45OTk5NTYyNSBDMTcuOTk3Mzg3OSw4LjM2Mzk1Mzk4IDE3Ljk2MTUxMzEsOC43MTgzMjY3NiAxNy45MDgxMzg0LDkuMDY3NDQ5NTggQzE3LjAzMTM5MzksOS4yNzA0NDgzMSAxNS45NTYwMjU2LDkuNDU1MDcyMTYgMTQuNjU3NTMzOCw5LjU4MDE5NjM3IEMxNC4yODQ3ODYxLDguOTAyOTUwNjEgMTMuNTczNDE1NSw4LjQzNzQ1MzUyIDEyLjc0NzQyMDcsOC40Mzc0NTM1MiBDMTEuODU0MDUxMyw4LjQzNzQ1MzUyIDExLjA4NjY4MTEsOC45NzczMjUxNCAxMC43NDcxODMyLDkuNzQ2NDQ1MzMgWiIgaWQ9IkZpbGwtOCIgZmlsbD0iI0ZGRkZGRiI+PC9wYXRoPg0KICAgIDwvZz4NCjwvc3ZnPg==') no-repeat center / 70% 70%;
  cursor: pointer;
}
.lm-player-container .function-control-layer .camera-control-wrapper .focusing-layer:hover {
  background: #1ECBCE url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAGXElEQVRoQ+2aeahVVRTGf1+DTTZq8yRpQjSroEVQNmdlcxQ0mFRUZpbmUCE2FzaJRUFGYhMVRWnaYIOVEUWTkdpMUTbP89yKz/aV2/Pee/Z57973R7jg8dSzz17722utbw1H8T8RtRpHRKwGbCTp7Vbq6gwg9wCHAj0kfdAqMJ0B5DmgPzBA0vPLgBTcwDKL1LugiNgc2AvY1EGe4mMd4BFgAfAx8DIwV9KfzXK1plgkIrYAjgUOBnbIPNzXwCzAZPCApMh8r+ayDgGJiHWB8cApwIpJw/fAQ8DCdPu2wM/ABslCmwF7AltXncgWGiPp8faCaTeQiBgBXASsDvwF3AbcAcyR9EfRgSKiJ3AIcEZyQ7/yMDBU0idF77d9XhpIRKwE3AgclzabAZwjyRYoLRGxMjDcewBrAx/ZRSW9WGazUkCSK/ngA4AfHBeSppdR2IAkugN3AwOBX4Ahkvz3LMkGkizxZALxHjBY0vwsLZmLImIFYDJwKmBG20fSEzmvlwEyLbmTQThLf56joD1rIuJi4DzAzNZf0jtF+2QBSYE9KbnTzs22RNtDRoTPdW8ig9eBPpJ+bQSmEEiKi3cTOzkImxITRTecqmbXadsAYyVN7CgQ+6xZZYakg4oO0MznEbE74NzyLdBTkl2tpjS0SMrYbwDLAdu1l2I7Ai4inFz3Ba6UNLq9QCYA5wPTJA0pc6CI6AMclTL4qsAi4FHgLkm/5e4VETum2uwrYH1JTr5LSZFFXkm1k2lwdo7yiFgFuBRw5q+1vwvH4yW9lLOf10SEk+1WwK6Sni4FJFWx7wOunbpnlh0G4eZpW8AsczPggP0S8M3aQn7mHHGEpPtzwETEZcA44BpJI8sCORGYklzBByiUiDBF2xK+dR/U1LlEIsKFpXPEGOALu50k/24oEbET8CwwX5IvIt+1IuLCVNlOkOQ/FylzTLg+sv+b9/8Dog0gU/jg3NiLiDWA7+wdktYsC8TWsFVOknRTBhDzvFnleknDGq2PiC2Bt4AfgW6Sfs/Y32s9kekq6ae26xcHY0o+LkE2qVpgZe7s9pf0YIYiN0mDUiHpkr7Igo6bbkDvnFFRRBi4z2QCqgB3u3C5pFkVIF7wZh2WGSjJxWLRweYAuwH7SXJfUbTe+nqbFSW9mrF+HrB9jXXXSRq+hB4jwp3bhlULL3D1CRwt6c4MRbcCx7jYk2T6rSsR0TX5vBOtGdE5ogj4Z8B6KTk601vMfvOcW+rmkYi4CjDVjZJ0dYYiN1p2z9eAvo3oOiLcGt9gN5FkkigC4fLe7uRk2KVWf98IyCiXBcAkSWdlKHPn6CTnXnyipLG13okIu5PX2SoH2L8z9u4BuH1YJMnTmaWkERB3am5qFkhyBVooEdE3JUDfoDvJsyuBnNzJrndFAjFV0tDCTf8lo0pOmy7Jk5pSQHwY+6WZq5ckl/KFEhFW5J7eExaL/d8/vVLx6X+b6qGDJFNqoUTETLNnGkz43XwgXhkRt6R51WhJdrMsST2Mb/6wdPuV90yd43PcqfJCsqSzfxePlOpVAkVFo7Ovs/CHie8bdmltUUaElXvyuLj6zWGnGnucC1ySxkzuT2pKERA/d9lhZvEAzbfcaRIRnqzYpV2i1K18faCcVncP4DHgm2QVZ+ROkYi4FjgdmCnpwEZKC4GkWHGmdnJ09t67mcPneoeLiMPTnOtvZ3RJrqjrSi4QZ/wXgI2dyCSd1kqTpK7wmRRbZjdbpqFkAUlW6Qe4O3Pz5OAz+3Rogl7rZAmE6dafJKZIOrkIRFaMVG8SEUcCtwPOMfelSnepkjpHcR0QdieXOWY5x+WgnM60NJBkGQe/Z7JOlB6ZjsgdazaIB7OTBx3uY+wl7oWG5YJoF5AExlnaJYgHAhaTgSfyLrWzJSU7f1ZwXWaKdVE4UpJnaaUkO0ba7po+B/gQ/hywVnru9tYJ1D8LJXlwsUTSkNrNmz/0eNjn3/6sYHFcjCtip3ro2g2ksmFE2MUM5oTU8VXrcvxUvliZ+Vx/Ves0tT7l2Vm9MU+uWToMpArQ8sAu6ab9MdSNmt2lWtwIfZoGbh4FOdEVTlFywDQNSC1laRYwN820PPac3QrKtu6WArGCiFj2Px9yXKqypjMsYtdy7PQrM+8tA6KzXMudnePjzHqT9LKHrrW+5RZpxiFz9vgHwq5dUVAl3l8AAAAASUVORK5CYII=') no-repeat center / 70% 70%;
}
.lm-player-container .function-control-layer .camera-control-wrapper .center-circle {
  width: 90px;
  height: 90px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background: rgba(29, 33, 53, 0.8);
}
.ant-popover-inner .ant-popover-inner-content .tip-content {
  margin: -13px -17px -26px -16px;
  width: 290px;
  background: #1A2233;
  box-shadow: 0px 5px 20px 0px rgb(0 0 0%);
  display: block;
  padding: 10px;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-title-box {
  font-size: 14px;
  font-weight: bold;
  color: #16B1BD;
  line-height: 20px;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-box .icon-dianji {
  display: inline-block;
  width: 25px;
  height: 25px;
  background: url(/micro-apps/micro-dep-librarys/images/player/dianji.png) no-repeat;
  margin-left: 5px;
  background-size: cover;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-box .icon-huakuang {
  display: inline-block;
  width: 25px;
  height: 25px;
  background: url(/micro-apps/micro-dep-librarys/images/player/huakuang.png) no-repeat;
  margin-left: 5px;
  background-size: cover;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-box .icon-tuozhuai {
  display: inline-block;
  width: 25px;
  height: 25px;
  background: url(/micro-apps/micro-dep-librarys/images/player/tuozhuai.png) no-repeat;
  margin-left: 5px;
  background-size: cover;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-box .fun-txt {
  font-size: 12px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.6);
  position: absolute;
  margin-left: 5px;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .tip-box .remark-txt {
  font-size: 12px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.9);
  display: inline-block;
  width: 190px;
  float: right;
}
.ant-popover-inner .ant-popover-inner-content .tip-content .remark-txt {
  font-size: 12px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.9);
  line-height: 17px;
}

.playview-box {
  position: relative;
  overflow: visible;
  background: #000000;
  width: 100%;
  height: 100%;
}
.playview-box .playview-box-postion {
  position: absolute !important;
  z-index: 999;
  width: 801px;
  height: 480px;
  left: calc(50% - 400px);
  top: calc(50% - 240px);
  margin: 0 -1px;
}
.playview-box .play-Box-msg {
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
}
.playview-box .play-Box-msg .bpx-player-volume-hint {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: hsla(0, 0%, 100%, 0.8);
  border-radius: 4px;
  color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 20px;
  height: 48px;
  line-height: 48px;
  left: 50%;
  min-width: 84px;
  padding: 8px;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: opacity 0.3s;
  z-index: 77;
  opacity: 0;
}
.playview-box .play-Box-msg .bpx-player-volume-hint.volumeShow {
  opacity: 1;
}
.playview-box .play-Box-msg .bpx-player-volume-hint .lm-player-iconfont {
  color: #000;
  font-size: 24px;
  line-height: 32px;
  height: 32px;
  display: flex;
  align-items: center;
}
.playview-box .play-Box-msg .volume-box {
  position: absolute;
}
.playview-box img {
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  left: 0;
  width: 100%;
  height: 100%;
  right: 0;
}
.playview-box .bpx-player-animation {
  z-index: 111;
  display: none;
  overflow: hidden;
  background-color: red;
  border-radius: 5px;
  animation: moveAnimation 1.5s 1 alternate cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.playview-box .bpx-player-animation-mask {
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  left: 0;
  width: 100%;
  height: 100%;
  right: 0;
  display: flex;
  z-index: 11111;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.7);
}
.playview-box .bpx-player-animation-mask .bpx-player-animation-mask-text {
  color: #fff;
  text-align: center;
}
.playview-box .bpx-player-animation-mask i,
.playview-box .bpx-player-animation-mask span {
  color: #127aff;
}
.playview-box .bpx-player-animation-mask i {
  margin-right: 5px;
}
.playview-box .lm-player-container.active {
  position: initial;
}
.lm-c-player-component {
  height: 100%;
  user-select: none;
}
.lm-c-player-component .player-marke {
  pointer-events: none;
}
.lm-c-player-component .lm-c-video-title {
  background-color: rgba(29, 33, 53, 0.8);
  color: #fff;
  position: absolute;
  height: 28px;
  line-height: 28px;
  width: 100%;
  padding: 0 10px;
  top: 0;
  left: 0;
  display: flex;
  z-index: 99;
  opacity: 1;
  transition: opacity 0.3s;
}
.lm-c-player-component .lm-c-video-title .contraller-bar-item {
  display: inline-block;
  line-height: 28px;
  width: 28px;
}
.lm-c-player-component .lm-c-video-title.hide-video-title {
  opacity: 0;
}
.lm-c-player-component .lm-c-video-title.hide-novideo-title {
  display: none;
}
.lm-c-player-component .lm-c-video-title span:first-child {
  flex: 1;
  overflow: hidden;
}
.lm-c-player-component .lm-c-video-title span .anticon {
  font-size: 16px;
  cursor: pointer;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-status {
  font-size: var(--fs-small);
  color: rgba(255, 255, 255, 0.8);
  width: auto !important;
  min-width: 40px;
  padding: 0 2px;
  background-image: linear-gradient(-180deg, #476792, #454790 98%);
  cursor: pointer;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-status.video-status-active {
  color: #fff;
  background-image: linear-gradient(-180deg, #5b7eac, #5a5ca6 98%);
  cursor: unset;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-loop-active {
  width: max-content;
  color: #189ddb;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.controller-item {
  color: #fff;
  font-size: var(--fs);
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.controller-item:hover .anticon {
  color: #fa0;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.speed-item {
  color: #fff;
  min-width: 38px;
  font-size: var(--fs-samll);
}
.lm-c-player-component .pick-history-timer-layout {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 99;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lm-c-player-component .pick-history-timer {
  flex: 1;
  color: #fff;
  background-color: rgba(29, 33, 53, 0.8);
  padding: 34px 20px 10px 20px;
  position: relative;
  max-width: 450px;
}
.lm-c-player-component .pick-history-timer input {
  color: rgba(0, 0, 0, 0.85);
}
.lm-c-player-component .pick-history-timer .timer-tools {
  text-align: right;
}
.lm-c-player-component .pick-history-timer .timer-tools .tools-item {
  display: inline-block;
  margin-left: 10px;
  cursor: pointer;
}
.lm-c-player-component .pick-history-timer .timer-tools .tools-item:hover {
  color: #189ddb;
}
.lm-c-player-component .pick-history-timer .close-pick-btn {
  position: absolute;
  right: 5px;
  top: 5px;
  font-size: 16px;
  cursor: pointer;
}
.lm-c-player-component.video-fill video {
  object-fit: fill;
}
.lm-c-player-component.video-contain {
  position: relative;
}
.lm-c-player-component.video-contain video {
  object-fit: contain;
}
.lm-c-player-component.front-video .video-time-line-layout {
  display: none !important;
}
.video-speed-popover {
  width: 60px;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.video-speed-popover .ant-popover-inner {
  background: transparent;
}
.video-speed-popover .ant-popover-inner-content {
  background: transparent;
  padding: 0;
}
.video-speed-popover .ant-popover-arrow {
  display: none;
}
.video-speed-popover span {
  display: block;
  color: #fff;
  text-align: center;
  font-size: 12px;
  padding: 2px 0;
  cursor: pointer;
}
.video-speed-popover span:hover {
  color: #ff8800;
  background: rgba(0, 0, 0, 0.6);
}
.video-device-popover {
  width: 360px;
  border-radius: 3px;
  font-size: 12px;
}
.video-device-popover .ant-popover-inner {
  background: #fff;
}
.video-device-popover .ant-popover-inner-content {
  background: #fff;
  padding: 0;
  padding-bottom: 8px;
}
.video-device-popover .device-popup-header {
  overflow: hidden;
  border-bottom: 1px solid #ddd;
  padding: 5px;
  margin-bottom: 5px;
}
.video-device-popover .device-popup-header .title {
  padding: 0 5px;
}
.video-device-popover .device-popup-header .close {
  padding: 0 10px;
}
.video-device-popover .device-popup-title {
  padding: 5px;
  background-color: rgba(218, 225, 236);
  padding-left: 32px;
  display: flex;
  margin-bottom: 5px;
}
.video-device-popover .device-popup-title span {
  flex: 1;
}
.video-device-popover .device-popup-title__td {
  padding-left: 26px;
}
.video-device-popover .device-popup-group ul li {
  padding-bottom: 5px;
  padding-left: 32px;
}
.video-device-popover .device-popup-group .sub-item li {
  display: flex;
  padding-left: 56px;
}
.video-device-popover .device-popup-group .sub-item li span {
  flex: 1;
}
.video-device-popover .fl {
  float: left;
}
.video-device-popover .fr {
  float: right;
}
.video-device-popover .ovh {
  overflow: hidden;
}
.video-device-popover .tc {
  text-align: center;
}
.video-device-popover .success {
  color: #0fc484;
}
.video-device-popover .dot {
  width: 14px;
  height: 14px;
  font: 12px/18px Arial;
  border-radius: 7px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}
.video-device-popover .dot:before {
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 6px;
  display: inline-block;
  margin: 1px 0 0 1px;
}
.video-device-popover .dot-success:after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  position: absolute;
  top: 50%;
  margin: -2px 0 0 -2px;
  background: #0fc484;
}
.video-device-popover .dot-warning:after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  position: absolute;
  top: 50%;
  margin: -2px 0 0 -2px;
  background: #fa0;
}
.video-device-popover .dot-error:after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  position: absolute;
  top: 50%;
  margin: -2px 0 0 -2px;
  background: #ff6161;
}
.collection-page-pic-detail-modal .modal-content {
  height: 100% !important;
}
.collection-page-pic-detail-modal .capture-img-view-layout {
  height: 100%;
}
.collection-page-pic-detail-modal .capture-img-view-layout > .info-box-content-wrapper .capture-picture-view-wrapper {
  height: calc(100% - 48px);
}
.video-status-set-tips {
  font-size: 12px;
}
.video-status-set-tips div {
  cursor: pointer;
  line-height: 20px;
}
.video-status-set-tips div:hover {
  color: #189ddb;
}
.playview-box .lm-player-container .contraller-bar-layout {
  z-index: 60;
}
.playview-box .lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-downmenu {
  background: #000;
}
@keyframes moveAnimation {
  0% {
    transform: translate(0, 0) scale(1);
  }
  100% {
    transform: translate(var(--distance-x), var(--distance-y)) scale(0);
  }
}


.loop-video-layout {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  height: 100%;
  width: 100%;
}
.loop-video-layout .selectScreen {
  border: 3px solid #189ddb;
  padding: 0 !important;
}

.lm-c-player-component {
  height: 100%;
  user-select: none;
}
.lm-c-player-component .lm-c-video-title {
  background-color: rgba(29, 33, 53, 0.8);
  color: #fff;
  position: absolute;
  height: 28px;
  line-height: 28px;
  width: 100%;
  padding: 0 10px;
  top: 0;
  left: 0;
  display: flex;
  z-index: 99;
  opacity: 1;
  transition: opacity 0.3s;
}
.lm-c-player-component .lm-c-video-title.hide-video-title {
  opacity: 0;
}
.lm-c-player-component .lm-c-video-title.hide-novideo-title {
  display: none;
}
.lm-c-player-component .lm-c-video-title span:first-child {
  flex: 1;
  overflow: hidden;
}
.lm-c-player-component .lm-c-video-title span .anticon {
  font-size: 16px;
  cursor: pointer;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-status {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  width: 40px;
  background-image: linear-gradient(-180deg, #476792, #454790 98%);
  cursor: pointer;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-status.video-status-active {
  color: #fff;
  background-image: linear-gradient(-180deg, #5b7eac, #5a5ca6 98%);
  cursor: unset;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.video-loop-active {
  width: max-content;
  color: #189ddb;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip {
  text-align: center;
  font-size: 12px;
  width: auto;
  position: relative;
  min-height: 25px;
  line-height: 28px;
  height: 28px;
  padding-right: 5px;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip:hover .play-mode-tooltip-downmenu {
  display: block;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-active {
  color: #fff;
  background-image: linear-gradient(-180deg, #5b7eac, #5a5ca6 98%);
  cursor: unset;
  min-width: 45px;
  padding: 0 2px;
  display: inline-block;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-downmenu {
  z-index: 5;
  position: absolute;
  left: 0;
  right: auto;
  top: auto;
  bottom: 28px;
  margin: 0;
  padding: 0;
  display: none;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-downmenu .play-mode-tooltip-downmenu__item {
  font-size: 12px;
  color: #fff;
  cursor: pointer;
  text-align: left;
  line-height: 20px;
  padding-left: 8px;
  padding-bottom: 5px;
  min-width: 60px;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-downmenu .play-mode-tooltip-downmenu__item:last-child {
  padding-bottom: 8px;
}
.lm-c-player-component .contraller-bar-layout .contraller-bar-item.play-mode-tooltip .play-mode-tooltip-downmenu .play-mode-tooltip-downmenu__item:hover {
  color: #189ddb;
}
.lm-c-player-component .pick-history-timer-layout {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 99;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lm-c-player-component .pick-history-timer {
  flex: 1;
  color: #fff;
  background-color: rgba(29, 33, 53, 0.8);
  padding: 34px 20px 10px 20px;
  position: relative;
  max-width: 450px;
}
.lm-c-player-component .pick-history-timer .timer-tools {
  text-align: right;
}
.lm-c-player-component .pick-history-timer .timer-tools .tools-item {
  display: inline-block;
  margin-left: 10px;
  cursor: pointer;
}
.lm-c-player-component .pick-history-timer .timer-tools .tools-item:hover {
  color: #189ddb;
}
.lm-c-player-component .pick-history-timer .close-pick-btn {
  position: absolute;
  right: 5px;
  top: 5px;
  font-size: 16px;
  cursor: pointer;
}
.voice-intercom-tip .ant-tooltip-inner {
  width: 112px;
  padding: 8px 12px;
  border-radius: 6px;
  background: #0a1527;
}
.voice-intercom-tip .ant-tooltip-inner .voice-intercom-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 100%;
}
.voice-intercom-tip .ant-tooltip-inner .voice-intercom-content .voice-intercom-top {
  width: 66px;
  height: 66px;
  border: 3px solid #319bff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  overflow: hidden;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  /* 140% */
}
.voice-intercom-tip .ant-tooltip-inner .voice-intercom-content .voice-intercom-top .anticon {
  font-size: 24px;
  color: #319bff;
}
.voice-intercom-tip .ant-tooltip-inner .voice-intercom-content button {
  border-radius: 4px;
}

.lm-c-detail-picture-map {
  width: 100%;
  height: 100%;
  position: relative;
  margin-bottom: 0 !important;
}
.lm-c-detail-picture-map .detail-header {
  height: 66px;
  line-height: 66px;
  text-align: center;
}
.lm-c-detail-picture-map .detail-header .ant-radio-button {
  width: 92px;
}
.lm-c-detail-picture-map .detail-header .anticon {
  margin-right: 4px;
}
.lm-c-detail-picture-map .detail-header .collect-btn {
  float: right;
  margin-top: 17px;
}
.lm-c-detail-picture-map .collection-icon {
  position: absolute;
  top: 16px;
  right: 22px;
  font-size: 16px;
  color: var(--icon);
  cursor: pointer;
}
.lm-c-detail-picture-map .collection-icon.active {
  color: var(--primary);
}
.lm-c-detail-picture-map .detail-content {
  flex: 1;
  overflow: hidden;
  position: relative;
}
.lm-c-detail-picture-map .detail-content .detail-content-part-video .playview-box {
  height: calc(100% - 45px);
}
.lm-c-detail-picture-map .detail-content.mut-player {
  height: fit-content;
}
.lm-c-detail-picture-map .detail-content.mut-player .detail-content-part.detail-hide-part {
  display: none;
}
.lm-c-detail-picture-map .detail-content.mut-player .detail-content-part.detail-content-part-video {
  position: unset;
  display: flex;
  align-items: center;
  height: fit-content;
  flex-wrap: wrap;
}
.lm-c-detail-picture-map .detail-content.mut-player .detail-content-part.detail-content-part-video .playview-box {
  width: 50%;
  height: fit-content;
}
.lm-c-detail-picture-map .detail-content.mut-player .detail-content-part.detail-content-part-map {
  position: unset;
  height: 600px;
}
.lm-c-detail-picture-map .detail-content.mut-player .fotter-btn {
  margin-top: 5px;
}
.lm-c-detail-picture-map .detail-content .fotter-btn {
  width: 100%;
  text-align: center;
  padding-bottom: 5px;
  position: relative;
  z-index: 3;
}
.lm-c-detail-picture-map .detail-content .fotter-btn .ant-select-selector {
  border-color: var(--primary) !important;
  background-color: var(--primary) !important;
  color: #fff !important;
}
.lm-c-detail-picture-map .detail-content .fotter-btn .ant-select-arrow {
  color: #fff !important;
}
.lm-c-detail-picture-map .detail-content .fotter-btn .ant-btn-sm {
  z-index: 2;
}
.lm-c-detail-picture-map .detail-content .detail-content-part {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease-in;
}
.lm-c-detail-picture-map .detail-content .detail-content-part .capture-img-view-layout {
  margin-bottom: 0;
}
.lm-c-detail-picture-map .detail-content .detail-content-part.detail-content-part-map {
  position: absolute;
  left: 0;
  top: 0;
}
.lm-c-detail-picture-map .detail-content .detail-content-part.detail-content-part-video {
  position: absolute;
  left: 0;
  top: 0;
}
.lm-c-detail-picture-map .detail-content .detail-content-part.detail-content-part-video .contraller-left-bar .contraller-bar-item:first-child {
  display: none;
}
.lm-c-detail-picture-map .detail-content .detail-content-part.detail-show-part {
  z-index: 1;
  opacity: 1;
}
.lm-c-detail-picture-map .detail-content .detail-content-part.detail-hide-part {
  z-index: -1;
  opacity: 0;
}
