.LoadSwitch {
    position: relative; width: 70px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
    }
    .LoadSwitch-checkbox {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }
.LoadSwitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #999999;
    border-radius: 5px;
}

    .LoadSwitch-inner {
        display: block; width: 200%; margin-left: -100%;
        transition: margin 0.3s ease-in 0s;
    }
        .LoadSwitch-inner:before, .LoadSwitch-inner:after {
            display: block;
            float: left;
            width: 50%;
            height: 20px;
            padding: 0;
            line-height: 20px;
            font-size: 12px;
            color: white;
            font-family: Trebuchet, Arial, sans-serif;
            box-sizing: border-box;
            box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.12), inset 0 0 5px rgba(0, 0, 0, 0.15);
        }
    .LoadSwitch-inner:before {
        content: "ON";
        padding-top: 1px;
        padding-left: 10px;
        background-color: #3AD647;
        color: #030000;
    }
    .LoadSwitch-inner:after {
        content: "OFF";
        padding-top: 1px;
        padding-right: 10px;
        background-color: #E0DDDD;
        color: #000000;
        text-align: right;
    }
.LoadSwitch-switch {
    display: block;
    width: 18px;
    margin: 1px;
    background: #FFFFFF;
    position: absolute;
    top: 1px;
    bottom: 1px;
    right: 47px;
    border: 1px solid #999999;
    border-radius: 5px;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.12), inset 0 0 5px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in 0s;
}
    .LoadSwitch-checkbox:checked + .LoadSwitch-label .LoadSwitch-inner {
        margin-left: 0;
    }
    .LoadSwitch-checkbox:checked + .LoadSwitch-label .LoadSwitch-switch {
        right: 1px; 
    }