/*
Row Tool
*/
.is-tool.is-row-tool {
    flex-direction: column;
    width: auto;
    left: auto;
    top: 30%;
    right: 0;
}

.row-outline .is-row-tool, .row-active .is-row-tool {
    display: flex
}

/* Color */
.is-tool.is-row-tool button {
    width: 25px;
    height: 25px;
}

.is-tool.is-row-tool .row-handle {
    line-height: 25px;
}

.is-tool.is-row-tool .row-handle {
    background: #b2bec3
}

/* rgba(68, 68, 68, 0.9) */
.is-tool.is-row-tool .row-grideditor {
    background: #6c5ce7
}

.is-tool.is-row-tool .row-more {
    background: #6c5ce7
}

.is-tool.is-row-tool .row-remove {
    background: #e84393
}

.is-tool.is-row-tool .row-handle svg {
    fill: #fff;
    width: 13px;
    height: 13px;
    margin-top: -2px
}

.is-tool.is-row-tool .row-grideditor svg {
    fill: #fff;
    width: 14px;
    height: 14px;
    margin-top: -1px
}

.is-tool.is-row-tool .row-more svg {
    fill: #fff;
    width: 14px;
    height: 14px;
}

.is-tool.is-row-tool .row-remove svg {
    fill: #fff;
    width: 23px;
    height: 23px;
}

/* Gray */
.is-builder[gray] .is-tool.is-row-tool button {
    width: 27px;
    height: 27px;
}

.is-builder[gray] .is-tool.is-row-tool .row-handle {
    line-height: 27px;
}

.is-builder[gray] .is-tool.is-row-tool .row-handle {
    background: transparent
}

.is-builder[gray] .is-tool.is-row-tool .row-grideditor {
    background: transparent
}

.is-builder[gray] .is-tool.is-row-tool .row-more {
    background: transparent
}

.is-builder[gray] .is-tool.is-row-tool .row-remove {
    background: transparent
}

.is-builder[gray] .is-tool.is-row-tool .row-handle svg {
    fill: #000;
    width: 11px;
    height: 11px;
    margin-top: -3px
}

.is-builder[gray] .is-tool.is-row-tool .row-grideditor svg {
    fill: #000;
    width: 13px;
    height: 13px;
}

.is-builder[gray] .is-tool.is-row-tool .row-more svg {
    fill: #4c4c4c;
    width: 12px;
    height: 12px;
}

.is-builder[gray] .is-tool.is-row-tool .row-remove svg {
    fill: #000;
    width: 18px;
    height: 18px;
}

/* More */
#_cbhtml .is-pop.rowmore {
    flex-direction: column;
}

#_cbhtml .is-pop.rowmore > div {
    width: 190px;
    margin: 10px 15px;
}

#_cbhtml .is-pop.rowmore button {
    width: 95px;
    height: 60px;
    text-align: center;
    font-size: 9px;
    font-weight: 400;
    text-transform: uppercase;
    color: #333;
    margin-bottom: 5px;
    flex-direction: column;
    box-shadow: none;
}
#_cbhtml .is-pop.rowmore button:hover {
    background: #f2f2f2;
}

#_cbhtml .is-pop.rowmore button span {
    display: inline-block;
    width: 95px;
    height: 24px;
}

#_cbhtml .is-pop.rowmore button svg {
    fill: #000;
}

/*
Row Add Tool
*/
.is-rowadd-tool {
    display: none;
    position: absolute;
    bottom: -1px;
    left: -60px;
    width: calc(100%);
    height: 1px;
    border: none;
    border-bottom: 1px solid rgb(255, 183, 132);
    z-index: 1;
    background: transparent;
    transition: none;
}

.is-rowadd-tool button {
    position: absolute;
    top: -9px;
    left: calc(50% - 10px);
    border: 1px solid rgb(255, 142, 62);
    border-radius: 500px;
    height: auto;
}

.row-outline .is-rowadd-tool,
.row-active .is-rowadd-tool {
    display: block
}

/*
Empt Info
*/
.row-add-initial {
    width: 100%;
    height: 70px;
    font-family: sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    justify-content: center;
    align-items: center;
    color: #555;
    border: 1px dashed #a9a9a9;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all ease 0.3s;
}

.row-add-initial:hover {
    background: rgba(0, 0, 0, 0.01)
}

.row-add-initial:focus {
    outline: none
}

.row-add-initial span {
    text-transform: none;
    display: block;
    margin-top: 5px;
    color: #acacac;
    font-size: 13px;
}

.is-builder .row-active.row-add-initial {
    outline: none
}