.ColorPicker {margin:0 0 0 2rem;position: relative;display: inline-block;width: 4rem;height: 1.7rem;--crown: white;--deactive: #929292;--deactive-crown: #ff0000;}.ColorPicker Input {display: none;}.roundbutton {position: absolute;top: 0;Left: -33px;bottom: 0;Right: 0;width: 100%;background-Color: #33455e;display: block;transition: all 0.3s;border-radius: 1.7rem;cursor: pointer;}.roundbutton:before {position: absolute;content: '';height: 1.15rem;width: 1.15rem;border-radius: 100%;display: block;Left: 0.45rem;bottom: 0.3rem;background-Color: var(--crown) !important;transition: all 0.3s;}Input:checked + .roundbutton {background-Color: var(--deactive) !important;}Input:checked + .roundbutton:before  {background-Color: var(--deactive-crown) !important;transition: background-Color;transform: translate(1.9Rem, 0);transition: all 0.3s;}