.view_window {
	box-sizing: border-box;
	background-color: #000;
	position: relative;
	float: left;
	overflow: hidden;
}

.center{
	position: absolute; 
	left: 50%; 
	top: 50%; 
	transform: translate(-50%, -50%);
}

/* 禁止选中 */
.no-select {
	user-select: none; /* 标准语法 */
	-webkit-user-select: none; /* 针对 WebKit 内核浏览器（如 Chrome、Safari） */
	-moz-user-select: none; /* 针对 Firefox */
	-ms-user-select: none; /* 针对 IE 和 Edge */
  }

.controls .back {
	position: absolute; 
	top: 10px; 
	left: 10px;
	width: 10px;
	height: 15px;
	transform: rotate(180deg);
}

.controls .play,
.controls .pause {
    position: absolute;
    top: 50%;
    left: 50%;
	width: 50px;
	height: 50px;
    transform: translate(-50%, -50%);
}

.controls .sound {
	position: absolute; 
	bottom: 10px; 
	left: 10px;
	width: 15px;
	height: 15px;
}

.controls .full {
	position: absolute; 
	bottom: 10px; 
	right: 10px;
	width: 15px;
	height: 15px;
}

.water_canvas {
	z-index: 98;
}

.audio_wave {
	z-index: 99;
	position: absolute;
}

.draw_canvas {
	z-index: 100;
}

.user_canvas {
	z-index: 101;
}

.decrypt {
	z-index: 102; 
	background-color: black;
}

.alarm {
	z-index: 103;
	position: absolute; 
	left: 0; 
	bottom: 0;
	height: 22px; 
	color: #fff; 
	text-align: center; 
	overflow: hidden; 
	text-overflow: ellipsis; 
	white-space: nowrap; 
	font-size: 15px; 
	line-height: 1.4; 
	font-family: Arial, 'Microsoft YaHei';
}

.controls {
	z-index: 104;
	position: absolute; 
	left: 0; 
	top: 0; 
	width: 100%; 
	height: 100%; 
	display: flex; 
	justify-content: center; 
	align-items: center;
}
.loading {
	display: flex; 
    position: absolute;
    top: 50%;
    left: 50%;
	font-size: 18px;
	color: #EEE;
    transform: translate(-50%, -50%);
}
.full_screen {
	z-index: 999;
	position: fixed; 
	left: 0; 
	top: 0; 
	width: 100% !important; 
	height: 100% !important; 
}
.full_screen_diy{
	display: -webkit-box !important; 
	display: -moz-box !important; 
	display: -ms-flexbox !important; 
	display: -webkit-flex !important; 
	display: flex !important; 
	justify-content: center!important; 
	align-items: center !important; 
}
.full_rotate {
	transform: rotate(90deg); 
	transform-origin: left top; 
	left: 100%; 
	top: 0; 
}
.draw_target_info {
	position: absolute;
	border: 1px solid red;
}
.view_window_parent {
	width: 100%; 
	height: 100%; 
	position: relative; 
	overflow: hidden;
}
.view_video {
	object-fit: fill;
}
