/** 初始化 **/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;/*???啥意思*/
}
html,
body {
    width: 100%;
    height: 100%;
}

body {
    -webkit-font-feature-settings: 'kern' 1;
    -moz-font-feature-settings: 'kern' 1;
    -o-font-feature-settings: 'kern' 1;
    text-rendering: geometricPrecision;
    /*font-family: "Microsoft YaHei";*/
    /*background-repeat: no-repeat;*/
    /*!*background-position: left top no-repeat;*!*/
    background-size: 100% 100%;
    display: flex;/*不会出现滚动条*/
    flex-direction: column;
    /*flex-flow: row nowrap;*/
    justify-content: center;
    outline: none;
    background: url(../img/pageBg.png);
    overflow: hidden;
}

.head{
    width: 100%;
    height: 10%;
    position: relative;
    top: 0;
    left: 0;
    background: url(../img/head_bg.png) bottom center no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}
.head h1{
    color:#fff;
    text-align: center;
    font-size:0.5rem;
    line-height: 0.8rem;
}
/*显示日期*/
.weather{ position:absolute; right:0.3125rem; top:0.2rem; line-height: 0.6875rem;}
.weather span{color:rgba(255,255,255,.9)!important; font-size: 0.25rem;}

/*主体*/
.mainbox{padding:0.125rem 0.125rem 0px 0.125rem;width:100%;height:90%;}/*上右下左*/
.mainbox>ul{ display: inline-flex;width:100%;list-style:none}
.mainbox>ul>li{margin-right: 3px;height: 100%;list-style:none}
.mainbox>ul>li:nth-child(2){ width: 52%}
.boxall{ padding:0.125rem;  background: rgba(0,0,0,.2); position: relative; margin-bottom:3px; z-index: 10;}
.boxall1{ padding:0.125rem;  background: rgba(0,0,0,.2); position: relative; margin-bottom:3px; z-index: 10;}
.alltitle{ font-size:0.25rem; color:#fff; position: relative; padding-left: 0.18rem;margin-bottom: 0.125rem;}
.alltitle:before{ width: 5px; height: 20px; top:2px; position: absolute; content: ""; background: #49bcf7; border-radius:20px; left: 0; }
.alltitle1{ font-size:10px; color:#fff; position: relative; padding-left: 12px;margin-bottom: 10px;}
.alltitle1:before{ width: 5px; height: 12px; top:2px; position: absolute; content: ""; background: #49bcf7; border-radius:20px; left: 0; }
.navboxall{height: calc(100% - 25px);}
.navboxall1{height: calc(100% - 25px);}

/*Plugin CSS*/
.wrap{ height:75%; overflow: hidden;}
.wrap li{  line-height:20px; height:30px; }
.wrap li p,.wraptit{ font-size: 0; color: rgba(255,255,255,.6);}
.wrap li p span,.wraptit{ font-size: 1px;}
.wrap li span,.wraptit span{ display: inline-block; font-size: 5px;text-align: center;}
.wraptit { border-bottom: 1px dotted rgba(255,255,255,.15); padding:0 0 10px 0; margin-bottom: 5px;}
.wraptit span{font-size: x-small;color: rgba(255,255,255,.8); }
.wrap li span:nth-child(1),.wraptit span:nth-child(1){ width: 16%}
.wrap li span:nth-child(2),.wraptit span:nth-child(2){ width: 11%}
.wrap li span:nth-child(3),.wraptit span:nth-child(3){ width: 18%}
.wrap li span:nth-child(4),.wraptit span:nth-child(4){ width: 20%}
.wrap li span:nth-child(5),.wraptit span:nth-child(5){ width: 20%}
.wrap li span:nth-child(6),.wraptit span:nth-child(6){ width: 15%}

/*Plugin CSS*/
.wrap1{
    height:90%;
    overflow: hidden;
}
.wrap1 li{  line-height:20px; height:30px; }
.wrap1 li p,.wraptit1{ font-size: 0; color: rgba(255,255,255,.6);}
.wrap1 li p span,.wraptit1{ font-size: 1px;}
.wrap1 li span,.wraptit1 span{ display: inline-block; font-size: 5px;text-align: center;}
.wraptit1 { border-bottom: 1px dotted rgba(255,255,255,.15); padding:0 0 10px 0; margin-bottom: 5px;}
.wraptit1 span{font-size: x-small;color: rgba(255,255,255,.8); }
.wrap1 li span:nth-child(1),.wraptit1 span:nth-child(1){ width: 20%}
.wrap1 li span:nth-child(2),.wraptit1 span:nth-child(2){ width: 26%}
.wrap1 li span:nth-child(3),.wraptit1 span:nth-child(3){ width: 27%}
.wrap1 li span:nth-child(4),.wraptit1 span:nth-child(4){ width: 27%}

/*下拉框*/
#parent,#parent1 {
    /*background: url("../img/arrow.png") no-repeat scroll right;*/
    width: 2.07rem;
    height: 0.375rem;
    border: 2px #cdddf7 solid;
    border-radius: 6px;
    overflow: hidden;
    cursor: default;
}

#parent select,#parent1 select {
    background: transparent;
    padding-left: 10px;
    width: 2rem;
    height: 100%;
    color: #cdddf7;
    cursor: pointer;
}

#parent option,#parent1 option{
    color: black;
    line-height: 20px;
}

/*#parent option,#parent1 option:hover{*/
/*    background: #EBCCD1;*/
/*}*/

.boxall h2 {
    height: 0.1rem;
    color: rgba(255,255,255,.6);
    line-height: 0.1rem;
    text-align: center;
    font-size: 0.15rem;
    font-weight: 400;
}
.boxall h2 a{
    color: rgba(255,255,255,.6);
    text-decoration: none;
    margin: 0 0.125rem;
}
.boxall h2 a:hover{
    color: #4c9bfd;
    text-decoration: none;
    margin: 0 0.125rem;
}

.boxall .title {
    height:70%;
    width:44%;
    border: 1px solid rgba(25,186,139,.17);
    /*letter-spacing: 2px;*/
    margin:3% 28%;
    padding: 3% 5%;
    background: rgba(255,255,255,.05);
    font-size: 0.25rem;
    color: #49bcf7;
}

.boxall .title:before {
    position:absolute;
    width:26%;
    height: 1px;
    background: #00fff5;
    content: "";
    top: 38%;
    left:5px;
}

.boxall .title:after {
    position:absolute;
    width:26%;
    height: 1px;
    background: #00fff5;
    content: "";
    top: 38%;
    right:5px;
}

/*设备信息表格*/
.boxall .info_table{
    width: 100%;
    height:87%;
    padding-left: 2%;
    font-size: 0.2rem;
    color: #fff;
    text-align: left;
    /*border: 2px solid #a2a9b1;*/
    /*border-collapse: collapse;*/
    /*background-color: #f8f9fa;*/
    display: table;
    /*border: 1px solid black;*/
}

.boxall .info_table .attri{
    height: 0.4rem;
    /*border: 2px solid #a2a9b1;*/
    width: 45%;
}

.boxall .info_table .value{
    height: 0.4rem;
    /*border: 2px solid #a2a9b1;*/
    width: 55%;
}

/*设备信息表格1*/
.boxall .info_table1{
    width: 100%;
    height:87%;
    padding-left: 2%;
    font-size: 0.1rem;
    color: #fff;
    text-align: left;
    /*border: 2px solid #a2a9b1;*/
    /*border-collapse: collapse;*/
    /*background-color: #f8f9fa;*/
    display: table;
    /*border: 1px solid black;*/
}

.boxall .info_table1 .attri{
    height: 0.2rem;
    /*border: 2px solid #a2a9b1;*/
    width: 45%;
}

.boxall .info_table1 .value{
    height: 0.2rem;
    /*border: 2px solid #a2a9b1;*/
    width: 55%;
}