RTG/webroot/css/color_bank.css

input[type="radio"] {
    display: none;
}

input[type="radio"]:checked+label span {
    transform: scale(1.25);
}

input[type="radio"]:checked+label .red {
    border: 2px solid #711313;
}

input[type="radio"]:checked+label .orange {
    border: 2px solid #873a08;
}

input[type="radio"]:checked+label .yellow {
    border: 2px solid #816102;
}

input[type="radio"]:checked+label .olive {
    border: 2px solid #505a0b;
}

input[type="radio"]:checked+label .green {
    border: 2px solid #0e4e1d;
}

input[type="radio"]:checked+label .teal {
    border: 2px solid #003633;
}

input[type="radio"]:checked+label .blue {
    border: 2px solid #103f62;
}

input[type="radio"]:checked+label .violet {
    border: 2px solid #321a64;
}

input[type="radio"]:checked+label .purple {
    border: 2px solid #501962;
}

input[type="radio"]:checked+label .pink {
    border: 2px solid #851554;
}

.border-add {
    border: 2px solid #321a64;
}

#createEventForm .form-group {
    margin: 0px;
}

#createEventForm label {
    margin-top: -20px;
}

#color-box label {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    cursor: pointer;
}

#color-box label:hover span {
    transform: scale(1.25);
}

#color-box label span {
    display: block;
    width: 100%;
    height: 100%;
    transition: transform .2s ease-in-out;
}

#color-box label span.red {
    background: red;
}

#color-box label span.orange {
    background: orange;
}

#color-box label span.yellow {
    background: yellow;
}

#color-box label span.olive {
    background: olive;
}

#color-box label span.green {
    background: green;
}

#color-box label span.teal {
    background: teal;
}

#color-box label span.blue {
    background: blue;
}

#color-box label span.violet {
    background: violet;
}

#color-box label span.purple {
    background: purple;
}

#color-box label span.pink {
    background: pink;
}