/* Color Picker */
.is-color-picker {
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid rgba(53, 53, 53, 0.28);
    display: inline-block;
    margin: 3px 0;
    cursor: pointer;
}

.color-swatch {
    width: 100%;
    height: 315px;
    display: flex;
    flex-direction: column;
    outline: 1px solid rgba(0, 0, 0, 0.08);
    overflow: hidden;
    position: relative;
}

.color-swatch > * {
    display: flex;
    height: 100%;
}

.color-swatch > * > * {
    width: 100%;
    height: 100%;
    border: transparent 1px solid;
    cursor: pointer;
    transition: all ease 0.3s;
}

/* 27 or 32 */

.color-gradient {
    width: 100%;
    height: 157px;
    display: flex;
    flex-direction: column;
    outline: 1px solid rgba(0, 0, 0, 0.08);
    overflow: hidden;
    position: relative;
}

.color-gradient > * {
    display: flex;
    height: 100%;
}

.color-gradient > * > * {
    width: 100%;
    height: 100%;
    border: transparent 1px solid;
    cursor: pointer;
    transition: all ease 0.3s;
}

/* 27 or 32 */

#_cbhtml .is-modal.pickcolor button,
#_cbhtml .pickcolor button,
.pickcolor button {
    float: left;
    width: 45px;
    height: 45px;
    cursor: pointer;
}

#_cbhtml .is-modal.pickcolor .color-default button,
#_cbhtml .pickcolor .color-default button,
.pickcolor .color-default button {
    width: 35px;
    height: 35px;
    border: transparent 1px solid;
}

#_cbhtml .is-modal.pickcolor button.clear,
#_cbhtml .pickcolor button.clear,
.pickcolor button.clear {
    font-size: 10px;
}