CSS
.toggle-lbl {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%); }
.toggle-lbl .toggle-input {
display: none; }
.toggle-lbl .toggle-input:checked + .toggle-btn {
background: #1DA362; }
.toggle-lbl .toggle-input:checked + .toggle-btn:before {
left: 10px; }
.toggle-lbl .toggle-input:checked + .toggle-btn:after {
left: 130px;
content: 'on'; }
.toggle-lbl .toggle-btn {
display: inline-block;
height: 100px;
width: 250px;
background: #DD5044;
text-align: center;
line-height: 80px;
color: #DD5044;
font-size: 3rem;
text-transform: uppercase;
border-radius: 50px; }
.toggle-lbl .toggle-btn:before {
border-radius: 50px;
-webkit-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
content: '';
background: #fff;
display: inline-block;
height: 80px;
width: 110px;
position: absolute;
top: 10px;
left: 130px; }
.toggle-lbl .toggle-btn:after {
content: 'off';
display: inline-block;
height: 80px;
width: 110px;
position: absolute;
top: 10px;
left: 10px;
color: #fff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease; }
/*# sourceMappingURL=style.css.map */