
/* Gravity field - slider */
.ginput_container_slide {
    display:flex;
}
.ginput_container_slide input{
    flex-grow: 1
}
    .ginput_container_slide span {
        margin-left: 20px;
        font-weight: 500;
    }

/* Gravity field - emoji ( star rating ) */
.emoji-container {
    display: inline-block;
}

.stg-emoji {
    cursor: pointer;
    text-decoration: none;
    font-size: 32px;
}

.lw-star-medium .stg-emoji {
    font-size: 24px;
}


/* Gravity field - 3 option switcher */
.stg-state-toggle {
    background: #ccc !important;
    border-radius: 24px !important;
    display: inline-block !important;
    overflow: hidden !important;
    display: inline-flex !important;
    flex-direction: row !important;
    transition: all 500ms ease;
    padding-bottom: 0 !important;
}

.stg-switch-button {
    border-radius: 22px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 64px !important;
    background-color: transparent !important;
    border: 0px solid transparent !important;
    margin: 2px !important;
    color: #000 !important;
    cursor: pointer !important;
    transition: all 0.5s ease;
}

    .stg-switch-button.active {
        background-color: #2196F3 !important;
        border: 0px solid rgba(207,207,207,0.6) !important;
        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.1) !important;
        color: #000 !important;
        font-weight: 500 !important;
        transition: all .5s ease-in;
    }

    .stg-switch-button:focus {
        outline: none !important;
    }




/* Gravity field - toggle switch */
.switchHide { display:none;}
.ginput_container_switch {
    display: flex !important;
    align-items: center !important;
}
.stg-switch-left {
    margin-right: 10px !important
}
.stg-switch-right {
    margin-left: 10px !important
}
.stg-switch-left, .stg-switch-right {
    align-items: center !important;
}
.stg-switch {
    position: relative !important;
    display: inline-block !important;
    width: 60px !important;
    height: 34px !important;
}


    .stg-switch input {
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
    }

.stg-slider {
    position: absolute !important;
    cursor: pointer !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: #ccc !important;
    -webkit-transition: .4s !important;
    transition: .4s !important;
}

    .stg-slider:before {
        position: absolute !important;
        content: "" !important;
        height: 26px !important;
        width: 26px !important;
        left: 4px !important;
        bottom: 4px !important;
        background-color: #fff !important;
        -webkit-transition: .4s !important;
        transition: .4s !important;
    }

.stg-switch input:checked + .stg-slider {
    background-color: #2196F3 !important;
}

.stg-switch input:focus + .stg-slider {
    box-shadow: 0 0 1px #2196F3 !important;
}

.stg-switch input:checked + .stg-slider:before {
    -webkit-transform: translateX(26px) !important;
    -ms-transform: translateX(26px) !important;
    transform: translateX(26px) !important;
}


.stg-slider.round {
    border-radius: 34px !important;
}

    .stg-slider.round:before {
        border-radius: 50% !important;
    }
