body{
    margin:0px;
    position:fixed;
    top:0;
    left:0;
}

#xxx{
    display:block;
    position:fixed;
    top:0;
    left:0;
}

.actions{
    position:fixed;
    top:5px;
    left:20px;
    padding:20px;
}

.icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}

.actions svg{
    width:1.5em;
    height:1.5em;
    margin:0px 8px;
    transition:all 0.3s;
}

.actions svg.active{
    fill:red;
    transform:scale(1.2);
}

ol,li{
    list-style: none;
    margin:0;
}

.colors{
    position:fixed;
    top:60px;
    left:28px;
}

.colors > li{
    width:20px;
    height:20px;
    border-radius:50%;
    box-shadow:0 0 3px rgba(0,0,0,0.25);
    margin:10px 0;
}

.colors> li.red{
    background:red;
}

.colors> li.green{
    background:green;
}

.colors>li.blue{
    background:blue;
}

.colors> li.active{
    box-shadow:0 0 3px rgba(0,0,0,0.95);
}

.sizes{
    position:fixed;
    right:20px;
    top:10px;
}

.sizes > li{
    margin:10px 0;
}
.sizes> .thin{
    height:2px;
    width:20px;
    border-top:3px solid black;
}

.sizes> .thick{
    height:4px;
    width:20px;
    border-top:6px solid black;
}