/* common */
.container-fluid {
color: #000;
font-size: 14px;
}
.questionmark {
width: 20px;
height: 20px;
margin-left: 5px;
}
.circle-blue {
width: 10px;
height: 10px;
background-color:#00BFFF;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
display: inline;
float: left;
margin-top: 7px;
}
.circle-red {
width: 10px;
height: 10px;
background-color:red;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
display: inline;
float: left;
margin-top: 7px;
}
.circle-yellow {
width: 10px;
height: 10px;
background-color:#FCBB2B;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
display: inline;
float: left;
margin-top: 7px;
}
.selecMenu {
color: rgb(103, 200, 149);
}
.loading {
position: absolute;
text-align: center;
z-index: 1070;
left:0px;
top:0px;
background-color: #000000;
opacity: 0.4;/*é€æ˜Ž#CCCCCC*/
display: none;
}
.loading img {
z-index: 1080;
}
.tbody td {
white-space:nowrap;
overflow:hidden;
word-break:keep-all;
}
/* top */
.datacenter-top {
padding-left: 30px;
padding-bottom: 10px;
}
.datacenter-top .notice {
color: red;
font-size: 15px;
}
.datacenter-top .title {
font-size: 25px;
color: #a48d66;
}
.datacenter-top .title-r {
float: right;
}
.datacenter-top .title-r a {
color: #1E90FF;
float: right;
}
.datacenter-top hr {
border: 0.5px solid #000000;
margin: 5px;
}
.datacenter-top .tab {
height: 50px;
}
.datacenter-top .tabstyle {
font-size: 12px;
font-weight: bold;
border: 1px solid #bbb;
color: #999;
position: relative;
text-transform: uppercase;
background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(237, 237, 237, 1) 0%, rgba(222, 222, 222, 1) 100%) repeat scroll 0 0;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
width: 11%;
float: left;
text-align: center;
line-height: 26px;
overflow: hidden;
cursor: pointer;
}
.datacenter-top .pitchon {
color: #fff;
background: #428bca;
}
.datacenter-top .search {
}
.datacenter-top .search2 {
margin-top: 20px;
}
.datacenter-top .search2 p {
margin-bottom: 10px;
}
.datacenter-top .search2 p span {
font-size: 20px;
text-align: center;
}
.datacenter-top .search2 p input,select {
height: 34px;
}
.datacenter-top .search2 p input {
width: 300px;
margin-left: 3px;
}
.datacenter-top .search2 .but {
border: 1px solid #4DBADA;
background-color: #4DBADA;
border-radius: 6px;
padding: 3px 20px;
cursor: pointer;
color: #ffffff;
margin-left: 20px;
font-size: 18px;
}
.datacenter-top .but {
border: 1px solid #cccccc;
background-color: #cccccc;
border-radius: 3px;
padding: 1px 6px;
cursor: pointer;
}
.datacenter-top .customtime {
margin-left: 30%;
display: none;
}
.datacenter-top .time {
width: 100px;
}
.datacenter-top .stores {
float: right;
}
.datacenter-top .storesnum {
color: red;
}
.datacenter-top .shop {
margin-right: 10%;
}
/* score */
.datacenter-score {
border: 0.5px solid #000000;
margin: 50px 0px 10px 5%;
padding: 10px 10px;
min-height: 480px;
}
.datacenter-score .title {
font-size: 20px;
}
.datacenter-score .title-r {
font-size: 20px;
color: red;
float: right;
}
.datacenter-score .masonry {
width: 40px;
height: 30px;
}
.datacenter-score .creditScore {
min-height: 380px;
}
.datacenter-score .evaluation {
font-size: 20px;
float: right;
}
.datacenter-score .evaluationShop {
font-size: 20px;
margin-left: 16%;
float: left;
}
/* indicators */
.datacenter-indicators {
border: 0.5px solid #000000;
margin: 30px 0px 0px 5%;
padding: 10px 10px;
min-height: 300px;
}
.datacenter-indicators .title {
font-size: 20px;
}
.datacenter-indicators .title-note {
color: #A9A9A9;
}
.datacenter-indicators .character {
font-size: 15px;
margin: 15px 2% 10px;
}
.datacenter-indicators .character .td-1 {
width: 22%;
}
.datacenter-indicators .character .td-2 {
width: 15%;
}
.datacenter-indicators .character .td-3 {
width: 5%;
}
.datacenter-indicators .character .td-4 {
width: 29%;
padding-left: 20px;
}
.datacenter-indicators .character .td-5 {
width: 29%;
padding-left: 20px;
}
.datacenter-indicators .optimal{
width: 72%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline;
float: left;
}
.datacenter-indicators .worst{
width: 72%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline;
float: left;
}
.datacenter-indicators .points-blue{
color: #00BFFF;
border: 0.5px solid #00BFFF;
margin-left: 10px;
}
.datacenter-indicators .points-red{
color: red;
border: 0.5px solid red;
margin-left: 10px;
}
.datacenter-indicators .indicatorsPie {
min-width: 50px;
min-height: 50px;
}
/* indicatorsOther */
.datacenter-indicatorsOther {
margin: 10px 0px 0px 5%;
min-height: 220px;
}
.datacenter-indicatorsOther .box {
width: 24%;
min-height: 200px;
padding: 10px;
margin: 0px 0.5%;
display: inline;
float: left;
border: 0.5px solid #000000;
}
.datacenter-indicatorsOther .character {
font-size: 15px;
color: #000;
width: 100%;
}
.datacenter-indicatorsOther .character li {
height: 30px;
}
.datacenter-indicatorsOther .character .content {
height: 100px;
line-height: 100px;
font-size: 50px;
text-align: center;
}
.datacenter-indicatorsOther .optimal{
width: 95%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline;
float: left;
}
.datacenter-indicatorsOther .worst{
width: 95%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline;
float: left;
}
/* indicatorsShop */
.datacenter-indicatorsShop {
margin: 10px 0px 0px 5%;
min-height: 430px;
}
.datacenter-indicatorsShop .box {
width: 25%;
min-height: 180px;
padding: 10px;
margin: 10px 4%;
display: inline;
float: left;
border: 0.5px solid #000000;
}
.datacenter-indicatorsShop .character {
font-size: 15px;
width: 100%;
}
.datacenter-indicatorsShop .character .tr-1 {
height: 30px;
line-height: 30px;
font-size: 20px;
}
.datacenter-indicatorsShop .character .tr-2 {
height: 120px;
line-height: 120px;
font-size: 40px;
text-align: center;
}
.datacenter-indicatorsShop .character .tr-3 {
height: 30px;
line-height: 30px;
text-align: right;
color: #A9A9A9;
}
/* businessData */
.datacenter-businessData {
border: 0.5px solid #000000;
margin: 30px 0px 0px 5%;
padding: 10px 10px;
min-height: 600px;
}
.datacenter-businessData .title {
font-size: 20px;
}
.datacenter-businessData .title-note {
color: #A9A9A9;
margin: 10px 0px 30px;
}
/* businessDataShop */
.datacenter-businessDataShop {
border: 0.5px solid #000000;
margin: 30px 0px 100px 5%;
padding: 10px 10px;
min-height: 300px;
}
.datacenter-businessDataShop .title {
font-size: 20px;
}
.datacenter-businessDataShop .title-note {
color: #A9A9A9;
margin: 10px 0px 30px;
}
.datacenter-businessDataShop .dataTable {
border: 0.5px solid #000000;
text-align: center;
}
.datacenter-businessDataShop .dataTable th {
border: 0.5px solid #000000;
text-align: center;
}
.datacenter-businessDataShop .dataTable td {
border: 0.5px solid #000000;
}
/* scoreRule */
.datacenter-scoreRule {
margin: 0px 0px 10px 5%;
padding: 10px 10px;
min-height: 700px;
}
.datacenter-scoreRule .title {
font-size: 20px;
}
.datacenter-scoreRule .content {
margin: 10px 20px;
}
/* scoreImprovePlan */
.datacenter-scoreImprovePlan {
border: 0.5px solid #000000;
margin: 15px 0px 15px 5%;
padding: 10px 10px;
min-height: 160px;
}
.datacenter-scoreImprovePlan .title {
font-size: 20px;
}
.datacenter-scoreImprovePlan .content {
font-size: 20px;
margin: 10px 0px 0px 100px;
}
.datacenter-scoreImprovePlan .content a {
text-decoration: underline;
color: #1E90FF;
}
/* afterSales */
.datacenter-afterSales {
margin-left: 20%;
display: none;
}
.datacenter-afterSales span {
margin: 0px 5px;
}
.datacenter-afterSales p {
margin-left: 50px;
}
.datacenter-afterSales a {
color: #0066cc;
}
.datacenter-afterSales .but {
border: 1px solid #999999;
background-color: #999999;
border-radius: 3px;
padding: 1px 6px;
float: left;
color: #eeeeee;
margin-right: 10px;
font-weight: bold;
cursor: pointer;
}
/* monitoringProcess */
.datacenter-monitoringProcess {
position: relative;
margin: 2em 0;
}
.datacenter-monitoringProcess::before {
content: '';
position: absolute;
top: 0;
left: 40%;
height: 100%;
width: 8px;
margin-left: -4px;
background: #E4E4E4;
}
.datacenter-monitoringProcess .node {
position: relative;
padding: 20px 0;
}
.datacenter-monitoringProcess .clear {
clear: both;
}
.datacenter-monitoringProcess .node .left {
float: left;
position: relative;
left: 40%;
margin-left: -325px;
}
.datacenter-monitoringProcess .node .left .blue {
text-align: center;
width: 200px;
height: 120px;
padding: 20px 10px;
font-size: 16px;
border: 1px solid #E1F4F7;
background-color: #E1F4F7;
word-break : break-all;
}
.datacenter-monitoringProcess .node .left .green {
text-align: center;
width: 200px;
height: 120px;
padding: 20px 10px;
font-size: 16px;
border: 1px solid #C5F8B8;
background-color: #C5F8B8;
word-break : break-all;
}
.datacenter-monitoringProcess .node .middle {
float: left;
position: absolute;
top: 50%;
margin-top: -25px;
left: 40%;
margin-left: -125px;
}
.datacenter-monitoringProcess .node .middle-right {
margin-left: -100px;
}
.datacenter-monitoringProcess .node .arrow-left {
float: left;
font-size: 0;
border-width: 25px;
border-color: #FFECF1;
border-left-width: 0;
border-style: dashed;
border-right-style: solid;
border-top-color: transparent;
border-bottom-color: transparent;
}
.datacenter-monitoringProcess .node .rectangular {
float: left;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 14px;
border: 1px solid #FFECF1;
background-color: #FFECF1;
}
.datacenter-monitoringProcess .node .arrow-right {
float: left;
font-size: 0;
border-width: 25px;
border-color: #FFECF1;
border-right-width: 0;
border-style: dashed;
border-left-style: solid;
border-top-color: transparent;
border-bottom-color: transparent;
}
.datacenter-monitoringProcess .node .right {
float: left;
position: relative;
left: 40%;
margin-left: 125px;
}
.datacenter-monitoringProcess .node .right .blue {
float: left;
text-align: left;
width: 260px;
height: 120px;
padding: 10px 5px;
font-size: 16px;
border: 1px solid #E1F4F7;
background-color: #E1F4F7;
word-break : break-all;
}
.datacenter-monitoringProcess .node .right .green {
float: left;
text-align: left;
width: 260px;
height: 120px;
padding: 10px 5px;
font-size: 16px;
border: 1px solid #C5F8B8;
background-color: #C5F8B8;
word-break : break-all;
}
.datacenter-monitoringProcess .node .right .but {
font-size: 14px;
border: 1px solid #ffffff;
background-color: #ffffff;
border-radius: 3px;
padding: 1px 6px;
float: right;
color: #000000;
margin-top: 10px;
cursor: pointer;
}
.datacenter-monitoringProcess .node .right .log {
float: left;
width: 180px;
height: 120px;
font-size: 14px;
resize: none;
display: none;
}
.choose-label {
box-shadow: #ccc 0px 0px 0px 1px;
width: 40px;
height: 20px;
display: inline-block;
border-radius: 20px;
position: relative;
background-color: #bdbdbd;
overflow: hidden;
margin-bottom: -4px;
}