.area-container{
    position: relative;
    color: #fff;
    background-color: #62ddbd; /* #f39c12;*/
    width: calc(50% - 30px); /* 30 è la somma del margin e del padding*/
    height: 120px;
    margin: 5px;
    border-radius: 7px;
    padding: 10px;
}
#areas-container{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    
}
/*.area-heating{
    float: right;   
    position: relative;
}
.area-heating-status{   
    position: absolute;
    top: calc(50% - 9px);
    width: 100%;
    text-align: center;
    font-size: 20px;
}
.area-heating-icon{
    fill:#f2c422;
    width: 50px;
}
.area-heating-icon.on{
    fill: #f22222;
}
.area-container.heating-on{
    background-color: #e74c3c;
}

*/
.area-status{
    font-size: 35px;
    text-align: right;
}
.area-name{
    text-transform: uppercase;
}
.area-heat{
    float: right;
}
.area-lastupdated{
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.area-humidity,.area-lastupdated{
    float: right;
}
.area-battery{
    color: red;
    position: absolute;
    bottom: 0px;
    left: 3px;
}