.customize-control-kirki-palette { position: relative; input[type="radio"] { display: none; &:checked { + label { border: 3px solid rgba(0,0,0,.4); } } } label { background: none; padding: 0; border-top: 3px solid transparent; border-bottom: 3px solid transparent; margin-bottom: 5px; display: flex; span { padding: 10px 0; flex-grow: 1; font-size: 0; line-height: 10px; color: rgba(0,0,0,0); -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; border-top: 1px solid rgba(0,0,0,.1); border-bottom: 1px solid rgba(0,0,0,.1); &:first-child { border-left: 1px solid rgba(0,0,0,.1); } &:last-child { border-right: 1px solid rgba(0,0,0,.1); } &:hover { padding: 10px; flex-grow: 3; min-width: 60px; font-size: 10px; line-height: 10px; color: #000; } } } }