.switch{
    margin-top:0.25em;
    position:relative;
    display:inline-block;
    vertical-align:top;
    width:68px;
    height:26px;
    padding:3px;
    background-color:transparent;
    border-radius:15px;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent
}

.switch-input{
    position:absolute;
    top:0;
    left:0;
    opacity:0
}

.switch-input:focus ~ .switch-handle{

}

.switch-group{
    display:inline-block;
    width:100%
}

.switch.no-label{
    width:40px
}

.switch.no-label>.switch-input:checked ~ .switch-handle{
    left:20px
}

.switch.no-label>.switch-trough-label{
    font-size:0
}

.switch-trough{
    font-family: 'Glyphicons Halflings';
    font-weight:bold;
    position:relative;
    display:block;
    height:inherit;
    font-size:14px;
    text-transform:uppercase;
    background:#3A4246;
    border-radius:inherit;
    -webkit-transition:0.15s ease-out;
    -moz-transition:0.15s ease-out;
    -o-transition:0.15s ease-out;
    transition:0.15s ease-out;
    -webkit-transition-property:opacity background;
    -moz-transition-property:opacity background;
    -o-transition-property:opacity background;
    transition-property:opacity background
}

.switch-trough:before,.switch-trough:after{
    position:absolute;
    top:53%;
    margin-top:-0.5em;
    line-height:1;
    -webkit-transition:inherit;
    -moz-transition:inherit;
    -o-transition:inherit;
    transition:inherit
}

.switch-trough:before{
    content:"\e014";
    right:8px;
    color:#fff;
}

.switch-trough:after{
    content:"\e013";
    left:8px;
    color:white;
    opacity:0
}

.switch-handle{
    position:absolute;
    top:6px;
    left:6px;
    width:20px;
    height:20px;
    background:white;
    border-radius:50%;
    -webkit-transition:left 0.15s ease-out;
    -moz-transition:left 0.15s ease-out;
    -o-transition:left 0.15s ease-out;
    transition:left 0.15s ease-out
}

.switch-handle:before{
    content:'';
    position:absolute;
    top:50%;
    left:50%;
    margin:-6px 0 0 -6px;
    width:12px;
    height:12px;
    border-radius:6px
}

.switch-input:checked ~ .switch-trough{
    background:#76B63A
}

.switch-input:checked ~ .switch-trough:before{
    opacity:0
}

.switch-input:checked ~ .switch-trough:after{
    opacity:1
}

.switch-input:checked ~ .switch-handle{
    left:42px
}

//////


.switch.no-label > .switch-trough-label {
    font-size: 0;
}

/*----- Switch Trough -----*/

.switch-trough-label {
    font-family: "Pt Sans", sans-serif;
    font-weight: 700;
    position: relative;
    display: block;
    height: inherit;
    font-size: 11px;
    background: #3A4246;
    border-radius: inherit;
    -webkit-transition: 0.15s ease-out;
    -moz-transition: 0.15s ease-out;
    -o-transition: 0.15s ease-out;
    transition: 0.15s ease-out;
    -webkit-transition-property: opacity background;
    -moz-transition-property: opacity background;
    -o-transition-property: opacity background;
    transition-property: opacity background;
}


.switch-trough-label:before, .switch-trough-label:after {
    position: absolute;
    top: 50%;
    margin-top: -0.5em;
    line-height: 1;
    -webkit-transition: inherit;
    -moz-transition: inherit;
    -o-transition: inherit;
    transition: inherit;
}

.switch-trough-label:before {
    content: attr(data-off);
    right: 11px;
    color: white;
    text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.switch-trough-label:after {
    content: attr(data-on);
    left: 11px;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.2);
    opacity: 0;
}
.switch-label {
	padding-top: 7px;
}


/*----- Checked Switch -----*/

.switch-input:checked ~ .switch-trough-label {
    background: #76B63A;
}

.switch-input:checked ~ .switch-trough-label:before {
    opacity: 0;
}

.switch-input:checked ~ .switch-trough-label:after {
    opacity: 1;
}