@charset "utf-8";
/* 你自己的样式 */

/*顶端菜单*/
.Bmenu{
    padding:5px 5px;
    background-color:#01AAED;
    border-bottom:solid 1px skyblue;
    z-index:99;
    position:sticky;
    top:0;
    line-height:25px;
    display:flex;
}
.data-title{
    font-size:16px;
    color:white;
    text-align:center;
    flex:1;
}
/*logo显示*/
.add-img-btn{
    width:98px;
    height:98px;
    position:absolute;
    opacity: 0;
    z-index:99;
}
.add-img{
    width:98px;
    height:98px;
    border:1px dashed #dddddd;
    background: #f8f8f8;
    padding-left:15px;
    overflow:hidden;
    line-height:1;
    border-radius: 3px;
}
.add-img-content{
    width: 80px;
    height: 65px;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    left: 50%;
    top: 30%;
    margin-top: -25px;
    margin-left: -40px;
    color: #999;
    z-index: 0;
    cursor: pointer;
}
.add-img-content-icon {
    font-size: 50px;
}
.img-content-container {
    width: 98px;
    height: 98px;
    left:0;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}
/*页头用户信息*/
.user-info{
    display:inline-flex;
    position:absolute;
    height:100%;
    margin-left:20px;
    flex-direction:column;
    justify-content:space-between;
}
.user-info div span{
    display:inline-block;
    width:60px;
    text-align:justify;
    text-align-last:justify;
}
.data-cata{
    margin:10px 0 0 0;
    border-top:solid 1px #01AAED;
    position:relative;
    background-color:#f6f6f6;
}
.data-cata li{
    display:inline-flex;
    /*width:70px;*/
    padding:0 3.5%;
    text-align:center;
    /*border-left:solid 1px #01AAED;*/
    background-color:white;
}
.data-cata li:hover{
    border-bottom:solid 3px #01AAED;
    background-color:white;
}
.data-cata-focus{
    border-bottom:solid 3px #01AAED;
    background-color:white;
}
.data-cata li a{
    width:100%;
    text-decoration: none;
}
/*设置*/
.set-container{
    max-width:520px;
    padding:10px;
}
.set-title{
    font-size:18px;
    font-weight: bold;
    text-align:center;
    margin:10px 0;
}
/*预警设置*/
.set-para{
    margin:10px 0;
}
.set-para fieldset{
    height:50px;
    border-width:2px;
    margin:10px 0;
    border-style: groove;
    border-color: rgb(192, 192, 192);
    min-width:inherit;
}
.set-para fieldset legend{
    font-size:16px;
    font-weight:bold;
    width:auto;
    margin-bottom:auto;
    line-height:normal;
    border:none;

}
.set-para fieldset div{
    display:flex;
}
.set-para fieldset div div{
    margin-left:5%;
    min-width:50%;
    flex:1;
}
.set-para fieldset div label{
    margin-right:5%;
    margin-left:5px;
}
.set-para fieldset div label input{
    margin-right:5px;
}
.set-para fieldset div div input{
    height:20px;
    -webkit-appearance:auto;
    margin:0 4%;
    min-width:20%;
    flex:1;
}
/*密码设置*/
.set-pw div{
    margin:10px 0;
}
.set-pw div input{
    height: 20px;
    -webkit-appearance: auto;
    margin: 5px 10px;
    min-width: 20%;
}
/*历史查询*/
.data-his{

}
.data-his input{
    max-width:20%;
    min-width:150px;
    margin:10px 5px;
}
/*远程控制*/
.equip-state{
    font-size: 50px;
    vertical-align: bottom;
}
.equip-state-auto{
    color:green;
}
.state-info{
    width:33.3%;
    display:block;
    box-sizing: border-box;
    border:1px dotted gray;
    margin:0 -1px -1px 0;
    height:110px;
}
.state-info p{
    margin:10px 0;
    font-size:16px;
}
.state-icon{
    font-size: 50px;
    text-align:center;
    display:block;
    height:60px;
}
.state-icon-auto{
    color:dimgray;
}
.state-icon-open{
    color:limegreen;
}
.state-para-input{
    border: 1px solid dimgray;
    width: 70%;
    height: 20px;
    text-align: center;
    border-radius: 2px;
    margin-top:-5px;
    margin-bottom:10px;
}
.state-para-btn{
    height:25px;
    font-size:14px;
}
/*滑动按钮*/
.state-toggle{
    position:relative;
    opacity: 0;
    width:70%;
    height:40px;
    z-index:3;
    cursor: pointer;
    margin:-60px 0;
}
.toggle-inner{
    position: relative;
    width:70%;
    height:40px;
    background:linear-gradient(dimgray,silver);
    border-radius:50px;
    /*box-shadow:0 0 0 15px rgba(255,255,255,0.7);*/
}
.toggle-inner::before{
    content:"OFF";
    font-size:18px;
    color:#808080;
    line-height:40px;
    text-align:center;
    position:absolute;
    left:0px;
    width:50%;
    height:40px;
    background:radial-gradient(whitesmoke,silver);
    border-radius:50px;
    transition:left 0.5s ease-in-out;
}
.state-toggle:checked ~ .toggle-inner::before{
    content:"ON";
    color:limegreen;
    left:50%;
}
.state-toggle:checked ~ .toggle-inner{
    background: linear-gradient(green,limegreen);
}
/*设备选择*/
.equip-select{
    display:flex;
    max-width:100%;
    margin:10px 0;
}
.equip-select label{
    line-height:30px;
    width:80px;
    word-wrap:normal;
}
.equip-select select{
    min-width:80%;
    flex:1;
}
/*远程调度*/
.dispatch-info{
    border:1px solid #ddd;
    border-radius:2px;
    margin:10px 0;
    display:block;
    padding:0 10px 10px 10px;
}
.dispatch-info span{
    background-color:#01AAED;
    color:white;
    height:30px;
    padding:2px 10px;
    vertical-align:top;
}
.dispatch-info div{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.dispatch-info label{
    min-width:70px;
    margin:5px 0;
}
.dispatch-info label input{
    margin-right:5px;
}
.dispatch-ts-check{
    margin-bottom:8px;
    margin-right:5px;
}
.dispatch-ts table{
    height:60px;
    width:50%;
    margin:10px 0 0 0;
    border-collapse:separate;
    padding:0 10px 0 5px;
}
.dispatch-ts table td div{
    height:50%;
}
.dispatch-ts table td div p{
    width:60px;
    text-align: center;
    margin-bottom:0;
    line-height:20px;
}
.dispatch-ts table td div input{
    border:1px solid dimgray;
    width:18%;
    height:60%;
    text-align:center;
    border-radius:2px;
}

