body {
	background-image: url(../img/biejing.jpg) !important;
	background-size: 100% 100%;
	background-attachment: fixed;
	-webkit-text-size-adjust: 100% !important;
	background: rgba(0, 0, 0, .3);
}

/* 主体div */
.container {
	min-width: 100vw;
}

.title {
	color: white;
	font-weight: bold;
	font-size: 6.5vw;
}

.tit1 {
	color: white;
	font-weight: bold;
	font-size: 4.5vw;
	/* padding-top: 2.5vh; */
	/* padding-bottom: 1vh; */
	margin-top: 6.5vh;
}

/* 蓝色边框 start */
.hwx_div {
	border-radius: 15px;
	border: 1px #0174f5 solid;
	padding: 2px;
	box-sizing: border-box;
	/* margin-left: 1.6vw; */
	/* margin-right: 1.7vw; */
	margin-bottom: 10px;
}

.hwx_div_li {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border: 2px solid #016ae0;
	border-radius: 15px;
	background: rgba(0, 0, 0, .3);
}

/* 蓝色边框 end */

/* 天气情况div */
.div_1 {
	height: 30vh;
	/* margin-right: .1vw; */
}

/*仪表盘div*/
.div_2 {
	height: 32vh;
}

/*按钮状态div*/
.div_3 {
	height: 28vh;
}

/*视频监控div*/
.div_4 {
	height: 40vh;
}

/*蚕龄div*/
.div_5 {
	height: 35vh;
}

/*温湿度曲线*/
.div_6,
.div_7,
.div_8 {
	height: 32vh;
}

/* 每个div边框title  img 背景*/
.div_img_bg {
	height: 5vh;
}

/* 每个div边框title 字 */
.div_title {
	position: absolute;
	left: 0%;
	right: 0%;
	width: 100%;
	/*padding: auto;*/
	top: 8%;
	color: #FFFFFF;
	font-size: 5vw;
	font-weight: bold;
	/*border: 1px solid red;*/
}

/* 右上角div 里面仪表上面的 name */
.yb_name {
	color: #FFFFFF;
	font-size: 5vw;
	font-weight: bold;
	letter-spacing: .3vw;
}

/* 仪表盘外围div高度 */
#wd_container,
#sd_container {
	height: 20vh;
}

/*3D按钮 css*/
/*黄色*/
button.btn-warning.dim {
	box-shadow: inset 0px 0px 0px #f79d3c, 0px 5px 0px 0px #f78000, 0px 10px 5px #999999;
	line-height: 0.8;
}

button.btn-warning.dim:active {
	box-shadow: inset 0px 0px 0px #f79d3c, 0px 2px 0px 0px #f79d3c, 0px 5px 3px #999999;
	line-height: 0.8;
}

/*红色*/
button.btn-danger.dim {
	box-shadow: inset 0px 0px 0px #ea394c, 0px 5px 0px 0px #ea0019, 0px 10px 5px #999999;
	line-height: 0.8;
}

button.btn-danger.dim:active {
	box-shadow: inset 0px 0px 0px #ea394c, 0px 2px 0px 0px #ea394c, 0px 5px 3px #999999;
	line-height: 0.8;
}

.btn2 {
	font-size: 2vw;

}

.div_rim {
	background: url(../img/2.gif) no-repeat;
	background-size: 100% 100%;
	margin-bottom: 10px;
}

.div_rim_title {
	color: #FFFFFF;
	font-size: 5vw;
	font-weight: bold;
	margin-top: 8%;
}

.weather {
	position: relative;
	margin: 0 25px;
	height: 94%;
	padding: 3% 0;
	/* top: 20px; */
	/* margin-top: 18%; */
}
#he-icon{
	height: 30px;
	width: 30px;
	display: block;
	margin: 15px auto;
}
.info{
	display: flex;
}
.he-plugin-title{
	color: #fff;
	font-size: 20px;
	display: block;
}
.temperature,.humidity{
	/* line-height: 30px; */
}
.heison{
	color: #fff;
	font-size: 40px;
}
.heison2{
	color: #fff;
	font-size: 20px;
	display: block;
	margin: 10px 0;
}
.he-plugin-jin{
	color: #fff;
	flex: 1;
	text-align: center;
	font-size: 15px;
	padding:0 5px;
}
.he-plugin-ming{
	color: #fff;
	flex: 1;
	text-align: center;
	font-size: 15px;
	padding:0 5px;
}
.he-plugin-hou{
	color: #fff;
	flex: 1;
	text-align: center;
	font-size: 15px;
	padding:0 5px;
}
.he-plugin-standard{
	color: #fff;
	font-size: 15px;
	margin-bottom: 5px;
	text-align: center;
}
#he-plugin-zhi{
	text-align: center;
	color: #fff;
	font-size: 15px;
	margin-top: 10px;
}
.tianqi{
	margin-top: 10px;
	border-left: 3px solid #FFFFFF;
	border-radius: 1.5px;
	padding-left: 10px;
}
.dushu{
	font-size: 18px;
	margin-top: 5px;
}
.div_rim_2 {
	background: url(../img/3.gif) no-repeat;
	background-size: 100% 100%;
	margin-bottom: 10px;
}

.div_rim_3 {
	background: url(../img/4.gif) no-repeat;
	background-size: 100% 100%;
	margin-bottom: 10px;
}

.div_rim_4 {
	background: url(../img/4.png) no-repeat;
	background-size: 100% 100%;
	margin-bottom: 10px;
}

.div_rim_5 {
	background: url(../img/5.gif) no-repeat;
	background-size: 100% 100%;
	margin-bottom: 10px;
}

.div_rim_div {
	height: 42vh;
}

.div_rim_button {
	border-radius: 0.8vw;
	background-color: #5cb85c;
	font-size: 4vw;
	color: #fff;
	border: white;
	position: relative;
	left: 5%;
}

#he-plugin-standard {
	/* margin: 0 auto !important; */
}

.div_10 {
	height: 35vh;
}

.shuzi {
	height: 10vh !important;
}

.pull-img {
	width: 4vh;
	height: 4vh;
}

.sheding1 {
	font-family: microsoft yahei;
	font-size: 5.5vw;
	color: #FF69B4;
	flex: 1;
	text-align: left;
}

.sheding2 {
	font-family: microsoft yahei;
	font-size: 5.5vw;
	color: #00FFFF;
	flex: 1;
	text-align: right;
}

.caozuo,
.dushu {
	display: flex;
}

.caozuo2 {
	flex: 1;
	text-align: center;
	padding: 10px 0;
}

.title_div {
	position: fixed;
	width: 100%;
	z-index: 9999;
	padding: 10px 0;
	background: url(../img/first_title.png) no-repeat;
	background-size: 100% 100%;
	color: white;
	font-weight: bold;
	font-size: 4.5vw;
	text-align: center;
}
.container { width: 80%; margin: auto; }
.panel { margin-bottom: 20px; padding: 20px; border: 1px solid #ccc; border-radius: 5px; }
.status { color: white; padding: 5px; border-radius: 5px; }
.op { background-color: red; }
.cl { background-color: green; }
.off { background-color: grey; }