.switch input {
    display: none;
}
.switch i {
    border-radius: 25px;
    box-shadow: inset 0 0 1px rgba(0,0,0,.5);
    cursor: pointer;
    display: inline-block;
    padding-right: 25px;
    transition: all ease 0.1s;
    -webkit-transition: all ease 0.1s;
}
.switch i:before {
    background: white;
    border-radius: 25px;
    box-shadow: 0 1px 2px rgba(0,0,0,.5);
    content: '';
    display: block;
    height: 25px;
    width: 25px;
}
.switch :checked + i {
    box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 60px #1AB394;
    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 60px #1AB394;
    padding-right: 0;
    padding-left: 25px;
}

.switch input[type=checkbox][disabled] + i {
	box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 60px #EEEEEE;
    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 60px #EEEEEE;
}

.switch2x input {
    display: none;
}
.switch2x i {
    border-radius: 43px;
    box-shadow: inset 0 0 1px rgba(0,0,0,.5);
    cursor: pointer;
    display: inline-block;
    padding-right: 43px;
    transition: all ease 0.1s;
    -webkit-transition: all ease 0.1s;
}
.switch2x i:before {
    background: white;
    border-radius: 43px;
    box-shadow: 0 1px 2px rgba(0,0,0,.5);
    content: '';
    display: block;
    height: 43px;
    width: 43px;
}
.switch2x :checked + i {
    box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 100px #1AB394;
    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 100px #1AB394;
    padding-right: 0;
    padding-left: 43px;
}

.switch2x input[type=checkbox][disabled] + i {
	box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 100px #5CCCB7;
    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 100px #5CCCB7;
}