[class|=switch]{position:relative;display:inline-block;width:40px;height:20px;border-radius:16px;line-height:32px;-webkit-tap-highlight-color:transparent}
.switch-on{border:1px solid #fff;box-shadow:#03a9f4 0 0 0 16px inset;transition:border .4s,box-shadow .2s,background-color 1.2s;background-color:#03a9f4;cursor:pointer}
.slider{position:absolute;display:inline-block;width:20px;height:20px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4);border-radius:50%;left:0;top:0;pointer-events: none}
.switch-on .slider{left:20px;transition:background-color .4s,left .2s}
.switch-off{border:1px solid #ccc;transition:border .4s,box-shadow .4s;background-color:#9e9e9e;box-shadow:#9e9e9e 0 0 0 0 inset;background-color:#9e9e9e;cursor:pointer}.switch-off .slider{left:0;transition:background-color .4s,left .2s}.switch-on.switch-disabled{opacity:.5;cursor:auto}
.switch-off.switch-disabled{background-color:#f0f0f0!important;cursor:auto}