.pen-color {
    width: 25px;
    height: 25px;
    border-radius: 50%;
}

canvas
{
    background-color: white;
    border: 6px ridge royalblue;
}

.hide {
    display: none;
}

.pen-color.black
{
    background-color: black;
}
.pen-color.blue
{
    background-color: #0378A6;
}
.pen-color.green
{
    background-color: #13B813;
}
.pen-color.maroon
{
    background-color: #5C2121;
}
.pen-color.red
{
    background-color: #B9121B;
}
.pen-color.seagreen
{
    background-color: #029E9A;
}
.pen-color.yellow
{
    background-color: #FFBD07;
}

.pen-color + .pen-color
{
    margin-left: 1em;
}