*{
    width: 100%;
    height: 100%;
    margin: 0%;
    background-color:rgb(185, 185, 185);
}
#canvs{
    position: relative;
    width: 100%;
    height: 100%;
    margin: auto;
    background-color:rgb(185, 185, 185);
}

#shape{
    
    position: relative;
    /* border: solid 3px rgb(46, 46, 46); */
    background-color: white;
    border-radius: 5px;
    box-shadow:5px 5px 6px  rgba(49, 49, 49, 0.171);
    width: 600px;
    height: 200px;
    

    /*水平垂直居中*/
    /* top: 50%;
    left: 50%;
    transform:translate(-50%,-50%) */
    margin: auto;
    top: 30%;
    
}

#shadow{
    position: relative;
    background-color: whitesmoke;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    width: 100%;
    height: 30%;

    top:70%;
}

#tabel{
    position: relative;
    background-color:rgb(93, 176, 211);
    border-radius: 2px;
    width: 10%;
    height: 40%;

    top: 0%;
    left: 91%;
    transform:translate(-50%,-50%)
}

#tabel_01{
    position: relative;
    background-color:whitesmoke;
    border-radius: 2px;
    width: 85%;
    height: 40%;

    top: 30%;
    left: 50%;
    transform:translate(-50%,-50%)
}

#tabel_02{
    position: relative;
    background-color:whitesmoke;
    border-radius: 2px;
    width: 85%;
    height: 35%;

    top: 32%;
    left: 50%;
    transform:translate(-50%,-50%)
}

#bar_01{
    position: relative;
    background-color:green;
    border-radius: 10px;
    width: 30%;
    height: 15%;

    top: 15%;
    left: 10%;
}

#bar_02{
    position: relative;
    background-color:rgb(64, 182, 64);
    border-radius: 10px;
    width: 45%;
    height: 15%;

    top: 25%;
    left: 10%;
}

#bar_03{
    position: relative;
    background-color:rgb(182, 64, 64);
    border-radius: 10px;
    width: 60%;
    height: 15%;

    top: 35%;
    left: 10%;
}

#bottom_in{
    position: relative;
    background-color: rgb(95, 95, 95);
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    width: 80%;
    height: 20%;

    top:10%;
    left: 10%;
}

#bottom_out{
    position: relative;
    background-color: whitesmoke;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    width: 79%;
    height: 19%;

    top:-9%;
    left: 10.5%;
}

#info{
    font-family: "Digital-7 Mono";
    position: relative;
    background-color:rgba(250, 250, 250, 0.2);
    border-radius: 4px;
    width: 10%;
    height: 20%;

    top: -85%;
    left: 5%;
}

#open{
    display: none;
    position: relative;
    width: 25%;
    height: 35%;

    top: 30%;
    left: 5%;
}

#control{
    position: absolute;
    background-color: whitesmoke;
    border-radius: 10px;
    box-shadow:5px 5px 6px  rgba(49, 49, 49, 0.171);
    width: 150px;
    height: 300px;

    bottom: 10%; 
    right: 10%;
}
