.switch{display:inline-block;height:30px;position:relative;width:55px}.switch input{height:0;opacity:0;width:0}.slider{background-color:#f5f5f533;bottom:0;cursor:pointer;left:0;right:0;top:0}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{background-color:#fff;bottom:4px;content:"";height:22px;left:4px;width:22px}input:checked+.slider{background-color:#6c0bbb}input:focus+.slider{box-shadow:0 0 1px #6c0bbb}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}