.synkit--widget-builder .synkit--container {
    display: flex;
    position: relative;
    column-gap: 10px;
    
    flex-direction: column;
    flex-wrap: wrap;
}

.synkit--widget-builder .synkit--column {
    position: relative;
    min-height: 1px;
    display: flex;
    align-items: center;
}

.synkit--widget-builder .synkit--column-title label {
    font-weight: bold;
}

.synkit--widget-builder LABEL {
    padding: 0 5px;
}

.synkit--widget-builder INPUT,
.synkit--widget-builder SELECT {
    padding: 5px;
}

.synkit--widget-builder BUTTON {
    padding: 5px 10px;
}

/** COLORS **/
.synkit--widget-builder BUTTON {
    color: #fff;
    background: #002856;
    border: none;
}

.synkit--widget-builder BUTTON:hover {
    background: #004F9F;
}

.synkit--widget-builder .synkit--submit {
    color: #fff;
    background: #000;
    border: none;
}

.synkit--widget-builder .synkit--submit:hover {
    background: #333;
}

/*** WRAPPER ***/
.synkit--widget-builder .synkit--child-wrapper {
    display: none;
}
    
.synkit--widget-builder .synkit--child-wrapper.synkit--show {
    display: block;
}

/** RESPONSIVE :: MOBILE ***/
@media screen and (max-width: 1059px) {
    /*** MAIN ***/
    .synkit--widget-builder {
        max-width: 700px;
        margin: 0 auto;
    }
    
    .synkit--widget-builder .synkit--container {
        row-gap: 20px;
        column-gap: 20px;
    }
    
    .synkit--widget-builder .synkit--container,
    .synkit--widget-builder .synkit--column-submit {
        width: 100%;
    }
    
    .synkit--widget-builder .synkit--column-title,
    .synkit--widget-builder .synkit--column-submit {
        justify-content: center;
    }
    
    .synkit--widget-builder .synkit--container.synkit--mobile-column > .synkit--column {
        width: 50%;
    }
    
    .synkit--widget-builder .synkit--container.synkit--mobile-column {
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .synkit--widget-builder .synkit--container LABEL {
        margin-bottom: 10px;
    }
    
    /*** QUANTITY **/
    .synkit--widget-builder .synkit--mobile-column .synkit--column-date,
    .synkit--widget-builder .synkit--mobile-column .synkit--column-qty {
        flex-direction: column;
        flex-wrap: wrap;
    }
    
    
    .synkit--widget-builder .synkit--column-date INPUT {
        display: block;
        appearance: none; /** ios safari **/
        height: 30px;
        -moz-box-sizing:    border-box;
        -webkit-box-sizing: border-box;
        box-sizing:        border-box;
    }
    
    .synkit--widget-builder .synkit--column-qty SECTION {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }
    
    .synkit--widget-builder .synkit--column-qty SECTION BUTTON {
        width: 25%;
    }
    
    .synkit--widget-builder .synkit--column-qty SECTION INPUT {
        width: 50%;
    }
    
    /** SUBMIT **/
    .synkit--widget-builder .synkit--column-submit INPUT {
        min-width: 160px;
    }
    
    /*** WRAPPER ***/
    .synkit--widget-builder .synkit--child-wrapper {
        width: 100%;
        padding-top: 10px;
    }
    
    .synkit--widget-builder .synkit--child-wrapper SELECT {
        margin-bottom: 5px;
    }
}

/** RESPONSIVE :: MOBILE ***/
@media screen and (min-width: 1060px) {
    /** MAIN **/
    .synkit--widget-builder .synkit--container {
        flex-direction: row;
        flex-wrap: nowrap;
    }
        
    /** CHILDREN **/
    .synkit--widget-builder .synkit--child-wrapper {
        position: absolute;
        right: 0;
        bottom: 45px;
        padding: 20px;
        width: 180px;
        box-sizing: border-box;
        background: #fff;
        -webkit-box-shadow: 0 0 30px 4px rgba(0,0,0,0.25); 
        -moz-box-shadow: 0 0 30px 4px rgba(0,0,0,0.25); 
        box-shadow: 0 0 30px 4px rgba(0,0,0,0.25);
        border-radius: 10px;
    }
    
    .synkit--widget-builder .synkit--child-wrapper LABEL,
    .synkit--widget-builder .synkit--child-wrapper SELECT {
        margin-bottom: 10px;
    }
    
    /** STYLE--1 **/
    .synkit--widget-builder .synkit--column-date INPUT {
        width: 130px;
    }
    
    .synkit--widget-builder .synkit--column-qty INPUT {
        width: 40px;
    }
}