.menu{
    /* float: left; */
    margin: 20px;
}

.box{
    overflow: auto;
    margin: 20px;
}

.line{
    display: flex;
}

.item{
    flex-shrink: 0;
    position: relative;
    width: 72px;
    height: 72px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:100% 100%;
    border: solid 3px #70c8a0;
    background-color: #70c8a0;
}

.item_0{
    background-image: url('../images/BG_0.gif');
}

.item_1{
    background-image: url('../images/BG_1.gif');
}

.item_2{
    background-image: url('../images/BG_2.gif');
}

.item_3{
    background-image: url('../images/BG_3.gif');
}

.item_yellow{
    border: solid 3px yellow;
}

.item_green{
    border: solid 3px rgb(0, 255, 0);
}

.item_red{
    border: solid 3px rgb(209, 0, 0);
}

.item_blue{
    border: solid 3px blue;
}

.item_chocolate{
    border: solid 3px rgb(255, 85, 241);
}

.F{
    font-size: 16px;
    color: black;
    position:absolute;
    left: 1px;
    top: 1px;
}

.G{
    font-size: 16px;
    color: black;
    position: absolute;
    left: 1px;
    bottom: 1px;
}

.H{
    font-size: 16px;
    color: black;
    position: absolute;
    right: 1px;
    bottom: 1px;
}

.Top{
    display: block;
    height: 25px;
    width: 18px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:100% 100%;
    background-image: url('../images/Top.png');
    position: absolute;
    left: 26px;
    top: -3px;
}

.Left{
    display: block;
    height: 18px;
    width: 25px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:100% 100%;
    background-image: url('../images/Left.png');
    position: absolute;
    left: -3px;
    top: 26px;
}

.Bottom{
    display: block;
    height: 25px;
    width: 18px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:100% 100%;
    background-image: url('../images/Bottom.png');
    position: absolute;
    left: 26px;
    bottom: -3px;
}

.Right{
    display: block;
    height: 18px;
    width: 25px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:100% 100%;
    background-image: url('../images/Right.png');
    position: absolute;
    right: -3px;
    top: 26px;
}

#metrics>div{
    width: 100%;
    border: solid 1px rgb(163, 163, 163);
}


#metrics>div>div{
    font-size: 18px;
    color: #535353;
    display: inline-block;
    margin: 5px;
    margin-right: 30px;
}

#metrics>div>div>div{
    display: inline-block;
    width: 160px;
}

#metrics>div>div>span{
    color: black;
    display: inline-block;
}