.hy-switch{margin:0;display:inline-block;position:relative;border:1px solid #dcdfe6;outline:none;border-radius:30px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#dcdfe6;cursor:pointer;-webkit-transition:border-color .3s,background-color .3s;transition:border-color .3s,background-color .3s;vertical-align:middle;cursor:default}.hy-switch:after{content:"";position:absolute;top:1px;left:1px;border-radius:100%;-webkit-transition:all .3s;transition:all .3s;background-color:#fff}.hy-switch-atvice:after{left:100%;margin-left:-17px}