.colors{padding:0;margin:0;list-style:none;display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:10px}.colors__btn{border:1px solid #fff;box-shadow:1px 1.1px 0 .5px rgba(85,87,90,.2);width:15px;height:15px;cursor:pointer;position:relative}.colors__btn,.colors__btn:before{display:block;border-radius:50%;transition:all .3s ease}.colors__btn:before{position:absolute;top:0;left:0;width:100%;height:100%;box-shadow:0 0 0 1px #55575a;border:1px solid #55575a;content:"";opacity:0}.colors__btn:hover{border-color:rgba(0,0,0,0);box-shadow:1px 1.1px 0 .5px rgba(85,87,90,0)}.colors__btn:hover:before{opacity:1}