.cell,.wrapper{position:relative}.row-name,.selected{top:0;left:0}@font-face{font-family:Roboto;font-style:normal;font-weight:400;src:local('Roboto'),local('Roboto-Regular'),url(https://fonts.gstatic.com/s/roboto/v15/zN7GBFwfMP4uA6AR0HCoLQ.ttf) format('truetype')}*{font-family:Roboto;box-sizing:border-box;margin:0;padding:0}.wrapper{width:26%;min-width:500px;margin:25vh auto 0}.set{margin-top:36px;float:right}.controlls button{width:100px;height:20px;margin:5px}.clearfix:after{content:'';display:block;clear:both}.row{display:-webkit-box;display:flex}.cell{height:40px;width:40px;background-color:#f0d9b5}.figure,.selected{width:100%}.cell:first-child{border-left:1px solid #000}.cell:last-child{border-right:1px solid #000}.row:first-child>.cell{border-top:1px solid #000}.row:last-child>.cell{border-bottom:1px solid #000}.black-cell{background-color:#b58863}.selected{position:absolute;height:100%;background-color:rgba(255,203,0,.4)}.coll-name,.row-name{position:absolute;font-size:.8em}.coll-name{bottom:0;right:0}.figure-select{position:absolute;top:120px;left:40px;width:240px;height:80px;background-color:#d2d2d2}.figure-select--ctrl{position:absolute;top:0;right:0}.figure-select__btn{width:50px;height:50px}