.color-pick {
    font-family: "Suits";
    font-size: min(20vh, 70pt);
    padding: min(4vh, 20px);
    margin:auto;
    line-height: 1;
    opacity: 0.5;
}

.color-pick:before {
    content: "p";
}

.color-pick.mine,
.color-pick.selectable:hover {
    opacity: 1;
}

.color-pick.mine:before,
.color-pick.selected:before,
.color-pick.selectable:hover:before {
    content: "P";
}

.color-pick.red {
    color: #ff1d1d;
}

.color-pick.blue {
    color: #2b46e5;
}

.color-pick.yellow {
    color: #ffff00;
}


.color-pick.green {
    color: #0ce20a;
}

.color-pick-name {
    font-size: min(5vh, 20pt);
    text-align: center;
    height: calc(1.5em + 0.75rem + 2px);
}

.color-pick-name input {
    font-size: min(5vh, 20pt);
    text-align: center;
    border: none;
    border-bottom: lightgray solid;
    border-radius: 0;
}

.color-pick-name input:focus {
    box-shadow: none;
}