@charset "UTF-8";
|
@import "basic.css";
|
.container:before, .container:after,
|
.header:before, .header:after,
|
.content:before, .content:after,
|
ul:before, ul:after {
|
display: table;
|
content: " ";
|
}
|
.container:after,
|
.header:after,
|
.content:after,
|
ul:after {
|
clear: both;
|
}
|
|
.container{
|
min-width: 1200px;
|
min-height: 600px;
|
padding-left: 15px;
|
padding-right: 15px;
|
margin-right: auto;
|
margin-left: auto;
|
}
|
.left {
|
float: left;
|
}
|
.right {
|
float: right;
|
}
|
.text-center {
|
text-align: center;
|
}
|
.btn {
|
display: block;
|
padding: 8px 10px;
|
border-radius: 14px;
|
box-shadow: 4px;
|
background-color: #1044BE;
|
color: #E9E2E2;
|
text-decoration: none;
|
}
|
.btn:hover {
|
color: #DEDCDC;
|
background-color: #7D84E7
|
}
|
|
.header, .content {
|
padding: 4px 15px;
|
margin-left: -15px;
|
margin-right: -15px;
|
}
|
|
.header {
|
background-color:#F6EEEE;
|
}
|
.content {
|
width: 1200px;
|
margin: 0 auto;
|
}
|
.content .network .network-content {
|
width: 100%;
|
border-right: 1px solid #ccc;
|
overflow: hidden;
|
border: 1px solid #ccc;
|
box-shadow: -10px 12px #E4E0E0;
|
}
|
.img-list {
|
float: left;
|
margin-top: 10px;
|
text-align: center;
|
width: 33.33333%;
|
}
|
.actual-line {
|
width: 400px;
|
height: 450px;
|
background-color: #D0CBCB;
|
}
|
|
.line {
|
width: 200px;
|
}
|
.line canvas {
|
width: 200px;
|
height: 522px;
|
background-color: pink;
|
}
|
|
.master-control {
|
position: relative;
|
width: 560px;
|
height: 522px;
|
border:1px solid #ccc;
|
box-shadow: 10px 12px #E4E0E0;
|
}
|
|
.master-control .tab {
|
width: 100%;
|
}
|
.tab ul {
|
width: 100%;
|
}
|
.tab li {
|
}
|
.tab ul li{
|
float: left;
|
height: 44px;
|
background-color: #A1BCF9;
|
}
|
|
.tab li a{
|
display: block;
|
margin-top: 5px;
|
width: 60%;
|
height: 32px;
|
line-height: 32px;
|
font-size: 16px;
|
color: #F6F0F0;
|
text-decoration: none;
|
text-align: center;
|
background-color:#3439A4;
|
border-radius: 10px 12px;
|
white-space: nowrap;
|
}
|
.tab li a:hover {
|
font-size: 20px;
|
background-color: #6468AD;
|
}
|
|
.tab li.active a {
|
font-size: 20px;
|
background-color: #6468AD;
|
}
|
.ele-group-cont {
|
position: relative;
|
width: 100%;
|
height: 478px;
|
overflow: hidden;
|
}
|
.ele-group {
|
position: absolute;
|
}
|
.group-header {
|
font-size: 16px;
|
}
|
.group-header a{
|
display: block;
|
color: #FEFCFC;
|
text-decoration:none;
|
height: 30px;
|
line-height: 30px;
|
text-indent: 1.5em;
|
font-weight: bold;
|
background-color: #80ABF0
|
}
|
.group-content li {
|
float:left;
|
width: 80px;
|
height: 80px;
|
padding: 4px 6px;
|
border-right: 1px solid #ccc;
|
border-bottom:1px solid #ccc;
|
}
|
.group-content li img {
|
margin-top: 10px;
|
margin-left: 26px;
|
width: 23px;
|
height: 50px;
|
}
|
.group-content li img:hover {
|
margin-top: 5px;
|
margin-left: 24px;
|
width: 32px;
|
height: 70px;
|
}
|
.page{
|
position: fixed;
|
width: 100%;
|
top: -3000px;
|
left: 0;
|
z-index: 9999999;
|
min-width: 1200px;
|
min-height: 500px;
|
overflow:hidden;
|
background-color: #fff;
|
}
|
.page-close:before, .page-close:after {
|
display: table;
|
content: " ";
|
}
|
.page-close:after {
|
clear: both;
|
}
|
.page .page-close {
|
width: 100%;
|
}
|
.page .page-close a {
|
display: block;
|
float:right;
|
width: 36px;
|
height: 36px;
|
line-height: 36px;
|
text-align: center;
|
font-size: 18px;
|
text-decoration: none;
|
color: #000000;
|
}
|
.page .page-close a:hover {
|
background-color: #F47C7C;
|
color: #FFFFFF;
|
font-weight: bold;
|
}
|
|
.page .tab-list {
|
display: none;
|
width: 100%;
|
min-heihgt: 300px;
|
}
|
.page .tab-list.active {
|
display: block;
|
}
|
.page .thr-line {
|
position: relative;
|
}
|
.page .thr-line .time-change{
|
position: absolute;
|
top: 15px;
|
right: 15px;
|
z-index: 9999;
|
}
|
.time-change a{
|
display: block;
|
padding: 0 10px;
|
height: 30px;
|
line-height: 30px;
|
// color: #000;
|
text-decoration: none;
|
border: 1px solid #ddd;
|
}
|
.time-change a:hover {
|
background-color: #8DAFFD;
|
color: #FFFFFF;
|
}
|
.page .thr-line .break-line {
|
width: 100%;
|
height: 100%;
|
}
|
.page .thr-line .echarts {
|
width: 100%;
|
height: 100%;
|
background-color: pink;
|
}
|
|
|
.listview {
|
padding-left: 15px;
|
padding-right: 15px;
|
margin-left: auto;
|
margin-right: auto;
|
}
|
.listview ul {
|
margin-top: 15px;
|
width: 100%;
|
border-left: 1px solid #ddd;
|
border-right: 1px solid #ddd;
|
border-bottom: 1px solid #ddd;
|
background-color: #fff;
|
}
|
|
.listview a {
|
display: block;
|
padding: 12px 6px;
|
text-decoration: none;
|
text-align: center;
|
border-top: 1px solid #ddd;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow:ellipsis;
|
color: #030303;
|
}
|
.listview a:hover {
|
background-color: #8DAFFD;
|
color: #FFFFFF;
|
}
|
.listview a.active {
|
background-color: #8DAFFD;
|
color: #FFFFFF;
|
}
|
|
.ele-time .dash-board {
|
width: 100%;
|
height: 100%;
|
outline: 1px solid #ddd;
|
}
|
.ele-time .dash-board .echarts{
|
width: 100%;
|
height: 100%;
|
background-color: pink;
|
}
|
.ele-time .break-line {
|
width: 100%;
|
height: 100%;
|
}
|
.ele-time .break-line .echarts {
|
width: 100%;
|
height: 100%;
|
/* background-color: pink; */
|
}
|
|
.ele-life .tbl {
|
width: 100%;
|
}
|
.tbl table {
|
width: 100%;
|
border-collapse: collapse;
|
}
|
.tbl table th, .tbl table td {
|
padding: 8px 0;
|
text-align: center;
|
border: 1px solid #DDDDDD;
|
white-space: nowrap;
|
overflow:hidden;
|
text-overflow: ellipsis;
|
}
|
|
.tbl table th {
|
background-color: #ccc;
|
}
|
|
.tbl table tbody tr:hover {
|
background-color: #B9B7E3;
|
color: #FFFFFF;
|
}
|