.switch-button-label {
    float: left;

    font-size: 10pt;
    cursor: pointer;
}

.switch-button-label.off {
    color: #FF0000;
}

.switch-button-label.on {
    color: #327b17;
}

.switch-button-background {
    float: left;
    position: relative;

    background: #808080;
    border: 2px solid #808080;

    margin: 1px 10px;

    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;

    cursor: pointer;
}

.switch-button-background.checked {
    float: left;
    position: relative;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8fc800+0,8fc800+100;Green+Flat+%232 */
    background: #8fc800; /* Old browsers */
    background: -moz-linear-gradient(top, #8fc800 0%, #8fc800 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #8fc800 0%,#8fc800 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #8fc800 0%,#8fc800 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc800', endColorstr='#8fc800',GradientType=0 ); /* IE6-9 */
    border: 2px solid #8fc800;
    margin: 1px 10px;
    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;
    cursor: pointer;
}

.switch-button-button {
    position: absolute;
    left: -1px;
    top: 0px;
    background: #FAFAFA;
    /*border: 2px solid #a6a6a6;*/
    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    border-radius: 33px;
}