.customize-control-businesswp-toggle { position: relative; } .customize-control-businesswp-toggle label { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .customize-control-businesswp-toggle label .customize-control-title { width: calc(100% - 55px); } .customize-control-businesswp-toggle label .description { -webkit-box-ordinal-group: 100; -ms-flex-order: 99; order: 99; } .customize-control-businesswp-toggle .switch { border: 1px solid #b4b9be; display: inline-block; width: 35px; height: 12px; border-radius: 8px; background: #b4b9be; vertical-align: middle; position: relative; top: 4px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: background 350ms ease; transition: background 350ms ease; } .customize-control-businesswp-toggle .switch::after { content: ""; display: block; width: 20px; height: 20px; border-radius: 50%; position: absolute; top: 50%; left: -3px; -webkit-transition: all 350ms cubic-bezier(0, 0.95, 0.38, 0.98), background 150ms ease; transition: all 350ms cubic-bezier(0, 0.95, 0.38, 0.98), background 150ms ease; background: #999; border: 1px solid rgba(0, 0, 0, 0.1); -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); } .customize-control-businesswp-toggle .switch::before { content: ""; display: block; width: 20px; height: 20px; border-radius: 50%; position: absolute; top: 50%; left: -3px; -webkit-transition: all 350ms cubic-bezier(0, 0.95, 0.38, 0.98), background 150ms ease; transition: all 350ms cubic-bezier(0, 0.95, 0.38, 0.98), background 150ms ease; background: rgba(0, 0, 0, 0.2); -webkit-transform: translate3d(0, -50%, 0) scale(0); transform: translate3d(0, -50%, 0) scale(0); } .customize-control-businesswp-toggle .switch:active::before { -webkit-transform: translate3d(0, -50%, 0) scale(3); transform: translate3d(0, -50%, 0) scale(3); } .customize-control-businesswp-toggle input:checked + .switch::before { background: rgba(0, 115, 170, 0.075); -webkit-transform: translate3d(100%, -50%, 0) scale(1); transform: translate3d(100%, -50%, 0) scale(1); } .customize-control-businesswp-toggle input:checked + .switch::after { background: #13a1dc; -webkit-transform: translate3d(100%, -50%, 0); transform: translate3d(100%, -50%, 0); } .customize-control-businesswp-toggle input:checked + .switch:active::before { background: rgba(0, 115, 170, 0.075); -webkit-transform: translate3d(100%, -50%, 0) scale(3); transform: translate3d(100%, -50%, 0) scale(3); }