.color{
    display: block;
    width: 25px;
    height: 25px;
    background: black;
}
.color-select{
    display: inline-block;
    margin-top: 4px;
    margin-right: 4px;
    vertical-align: top;
}
.container{
    display: inline-block;
    vertical-align: top;
}
#color, #addcolor{
    display: block;
    width: 80px;
    margin-top: 4px;
}
#list{
    width: 450px;
    max-width: 95vw;
}
.right{
    float: right;
}
#addpattern, #clearAll{
    display: block;
    width: 85px;
    margin-top: 4px;
}
canvas{
    border:solid;
    display:block;
    max-width: 95vw;
}
#toolbar{
    margin-bottom: 5px;
}
.center{
    margin: 0 auto;
    width: 625px;
    max-width: 95vw;
}
label{
    display:block;
}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
#trash {
    display: none;
    padding-top: 8px;
}
#trash > .color-select {
    display: none;
}