.split,
.gutter.gutter-horizontal {
    background-color: #eee;
    background-repeat: no-repeat;
    background-position: 50%;
}

.gutter.gutter-horizontal {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
    cursor: col-resize;
}

.gutter.gutter-vertical {
    cursor: row-resize;
}

#one {

    width: 290px;
    min-width: 290px;
}

.dropzone {

    border-radius: 15px;
}

.dz-image {
    border-radius: 10px !important;
    width: 180px !important;

}

.dz-success .dz-success-mark {
    opacity: 1 !important;
}

.dz-complete .dz-success-mark {
    opacity: 1 !important;
}

.dz-error .dz-success-mark {
    opacity: 0 !important;
}

.dz-success-mark {

    top: 0 !important;
    left: 105% !important;

}

.dz-success-mark svg {

    width: 25px !important;

}

.dz-remove {
    position: absolute;
    top: 98 !important;
    left: 88% !important;
    z-index: 500;

}

.dz-remove svg {
    position: absolute;
    width: 18px !important;

}

.dz-edit {
    position: absolute;
    top: 166 !important;
    left: 89% !important;
    z-index: 500;

}

.dz-edit svg {
    position: absolute;
    width: 18px !important;

}

.dz-pending {

    font-size: xx-small;
    white-space: nowrap;
    display: flex;
    justify-content: center;
}

#hotspot-tbody {

    cursor: pointer;
}

.selected {
    color: white;
    background-color: #38c172;
}

.queued {
    color: #ffa500;

}

.hotspotPos {

    display: flex;
}

.hotspotPos>div {
    margin: 6px;
}

.pulsate {
    -webkit-animation: pulsate 1.5s ease-out;
    animation: pulsate 1.5s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    opacity: 0.2;
}

@keyframes pulsate {
    0% {
        opacity: 0.2;
    }

    50% {
        opacity: 1.0;
    }

    100% {
        opacity: 0.2;
    }
}

@-webkit-keyframes pulsate {
    0% {
        opacity: 0.2;
    }

    50% {
        opacity: 1.0;
    }

    100% {
        opacity: 0.2;
    }
}


/* Jquery UI sortable*/

#setMenu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-bottom: 10px;
   

}

#setMenu ul .draggable {
    width: calc(100% - 11px) !important
}

#setMenu li {
    margin: 5px;
    margin-left: 5px;
    padding: 5px;
    padding-left: 25px;
    width: calc(100% - 10px);
    border-radius: 5px;
}

#setMenu li input::placeholder {
    font-weight: lighter;
}

#setMenu li select option:disabled {

    font-weight: lighter;
}

#menu {

    height: calc(100vh - 380px);
    overflow: auto;
    padding-left: 5px;
}

#menuSave {

    width: 270px;
}

.sortable {

    padding-left: 15px;
}

.sortable>.ui-state-default {

    margin-left: 20px;
    width: calc(100% - 15px);
    ;

}

.sortable>.unsortable {

    background: #e6e5c4;

}

/* Jquery UI accordian*/

#accordion>.group>h3,
.sortable>.card>.group>h3 {

    display: flex;
    background-color: rgb(255, 239, 239);
}
.sortable>.card>.group>h3 {

    background-color: rgb(227, 255, 224);
}

#accordion>.group>h3>input,
.sortable>.card>.group>h3>input {

    margin-left: 18px
}

#accordion>.group>h3>input::placeholder,
.sortable>.card>.group>h3>input::placeholder {

    color: rgb(182, 181, 181);
    font-weight: lighter;

}

.sortable h6{

   color: firebrick;
}
.sub-menu-handle + div h6{

    color: limegreen;
}
.sortable .card-header{

   background-color: #ffded8;
}

.sub-menu-handle + div .card-header{

    background-color: #dbffdb;
}

.sortable2 > li{

    background-color: #3490dc !important;
}


#accordion>.group>h3.ui-state-active {

    background:crimson;
    border:crimson;
}

.sortable h3.ui-state-active {

    background:mediumseagreen !important;
    border:mediumseagreen !important;
}



.ui-state-highlight {

    background: #fffca3;
}

.close {
    background-color: #38c172;
    height: 15px;
    margin-top: -5px;
    margin-left: 5px;
    line-height: 0;
}


.draggable {
    cursor: grab;
}



.ui-sortable-handle {

    cursor: grab;
}

.btn-close {

    width: 30px;
    height: 5px;
    font-size: 25px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.btn.save {

    width: 255px;

}