@charset "utf-8";
.box-bg {
	background-color: #F5F5F5;
}
.main-top {
	width: 100%;
	height: 200px;
	background-size: cover;
	background-color: #3684D3;
	padding: 15px;
	background-repeat: no-repeat;
}
.project-select {
	width: 200px;
	margin: 10px 0 30px;
}
.weather-data {
	color: #FFFFFF;
}

.box1 {
  height: 110px;
  position: relative;
  width: 960px;
  padding: 10px;
  background: #F5F5F5;
}
.box1-item {
  width: 180px;
  height: 90px;
  background-color: #FFFFFF;
  border: 1px solid #E9E9E9;
  display: inline-block;
  margin-left: 10px;
  float: left;
  padding: 10px 20px;
}
.box1-item:first-child {
  margin-left: 0;
}
.box1-item .dot {
	width: 9px;
  height: 9px;
  border-radius: 100%;
  display: inline-block;
  margin-right: 5px;
}
.color1 {background-color: #FEC03D;}
.color2 {background-color: #58A3F7;}
.color3 {background-color: #52CFF9;}
.color4 {background-color: #4BCED0;}
.color5 {background-color: #FB6278;}

.box2 {background-color: #FFFFFF;padding: 10px;}
.box2-title {overflow: hidden;}
.box2-title p {float: left;font-weight: bold;font-size: 13px;}
.box2-title a {float: right;line-height: 20px;}
.box2-data {text-align: center;margin-top: 10px;}
.box2-data img {width: 25px;height: 25px;}
.box2-data h4 {font-size: 14px;color: #000000;}
.box2-data h5 {font-size: 12px;}
.box2-data h6 {color: #929292;margin-top: 5px;}
.box2-data-num {border-left: 1px solid #D4D4D4;}
.color-error {color: #EC2A1B !important;}
.color-warning {color: #F79A23 !important;}

.box3 {background-color: #FFFFFF;margin-top: 10px;}
.box3-title {padding: 10px;}
.box3-title p {font-weight: bold;font-size: 13px;}
.box3-data {text-align: center;padding-left: 10px;}
.box3-data dl {border: 1px solid #D4D4D4;margin: 0 10px 10px 0;border-radius: 2px;padding: 6px 0;}
.box3-data h3 {font-size: 16px;}
.box3-data h5 {font-weight: bold;font-size: 15px;}

.echarts-box {height: 300px;margin-left: 15px;}
