.row-color-picker{
    display:flex;
    background-color:;
    width:100%;
}
.palette-color-picker-button{
    float:left;
    width:100%;
    height:40px;
    margin-right:8px;
    background-size:cover;
    cursor:pointer;
    box-shadow:0 0 0 1px #bbb;
    border:3px solid #fff;
    border-radius:50%;
}
#sample-id-1 textarea{
    float:right;
    background-color:;
    border:none;
    top:0;
    cursor:default;
    width:calc(100% - (40px + 8px));
    font-size:15px;
    font-family: 'Cutive Mono', monospace;
	font-weight: 400;
    overflow-wrap: break-word;
}
textarea.color-selection{
    background-color:;
    resize:none;
    border:none;
}
textarea:focus{
    outline: 0;
}
.palette-color-picker-button{
    position:relative;
    display:inline-block;
    width:40px;
    height:40px;
    margin-right:8px;
    background-size:cover;
    cursor:pointer;
    box-shadow:0 0 0 1px #bbb;
    border:3px solid #fff;
    border-radius:50%;
}
.palette-color-picker-bubble{
    display:none;
    margin:12px 0;
    position:absolute;
    bottom:100%;
    width:220px;
    padding:10px 8px 8px 8px;
    border:1px solid #bbb;
    border-radius:3px;
    background-color:#fff;
}

.palette-color-picker-bubble:after,
.palette-color-picker-bubble:before{
    top:100%;
    left:15px;
    border:solid transparent;
    content:' ';
    height:0;
    width:0;
    position:absolute;
    pointer-events:none;
}

.palette-color-picker-bubble:after{
    border-color:transparent;
    border-top-color:#fff;
    border-width:8px;
    margin-left:-8px;
}
.palette-color-picker-bubble:before{
    border-color:transparent;
    border-top-color:#bbb;
    border-width:9px;
    margin-left:-9px
}
.palette-color-picker-bubble.downside{
    bottom:auto;
    top:100%;
}
.palette-color-picker-bubble.downside:after,
.palette-color-picker-bubble.downside:before{
    top:auto;
    bottom:100%;
}
.palette-color-picker-bubble.downside:after{
    border-top-color:transparent;
    border-bottom-color:#fff;
}
.palette-color-picker-bubble.downside:before{
    border-top-color:transparent;
    border-bottom-color:#bbb;
}
.palette-color-picker-bubble .swatch{
    position:relative;
    display:inline-block;
    font:0/0 a;
    width:15.2%;
    padding-top:13.5%;
    margin:1% 2%;
    outline:1px solid #bbb;
    border:2px solid #fff;
    border-radius:50%;
    cursor:pointer;
    overflow:hidden;
}
.palette-color-picker-bubble .swatch.active{
    outline-color:#000;
    outline-width:3px;
    -webkit-box-shadow:0px 0px 8px 0px rgba(0,0,0,0.75);
    -moz-box-shadow:0px 0px 8px 0px rgba(0,0,0,0.75);
    box-shadow:0px 0px 8px 0px rgba(0,0,0,0.75);
}
.palette-color-picker-bubble .swatch.clear{
    background-color:#fff;
}.palette-color-picker-bubble .swatch.clear:before{
    position:absolute;
    content:'';
    display:block;
    top:-1px;
    left:0;
    width:100px;
    height:2px;
    background-color:#e00;
    transform-origin:0 0;
    transform:rotate(45deg);
}.palette-color-picker-bubble.double .swatch{
    width:29.30%;
    padding-top:11.00%;
    margin:1% 2%;
}
.palette-color-picker-bubble.double .swatch.clear:before{
    transform:rotate(22.5deg);
}
.palette-color-picker-bubble.wide .swatch{
    width:96.2%;
    padding-top:11.00%;
    margin:1% 2%;
}
.palette-color-picker-bubble.wide .swatch.clear{
    width:12.66%;
}
.palette-color-picker-bubble.force-left{
    left:-178px;
}
.palette-color-picker-bubble.force-left:after,
.palette-color-picker-bubble.force-left:before{
    left:188px;
}