/*------------------------------------------------------------------------------------------- # AMP WP Admin Switch -------------------------------------------------------------------------------------------*/ .amp-wp-switch-new { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } input[type=checkbox].tgl { display: none; -webkit-box-sizing: border-box; box-sizing: border-box; } input[type=checkbox].tgl:after, input[type=checkbox].tgl:before, input[type=checkbox].tgl *, input[type=checkbox].tgl *:after, input[type=checkbox].tgl *:before, input[type=checkbox].tgl + .tgl-btn { -webkit-box-sizing: border-box; box-sizing: border-box; } input[type=checkbox].tgl::-moz-selection, input[type=checkbox].tgl:after::-moz-selection, input[type=checkbox].tgl:before::-moz-selection, input[type=checkbox].tgl *::-moz-selection, input[type=checkbox].tgl *:after::-moz-selection, input[type=checkbox].tgl *:before::-moz-selection, input[type=checkbox].tgl + .tgl-btn::-moz-selection { background: none; } input[type=checkbox].tgl::selection, input[type=checkbox].tgl:after::selection, input[type=checkbox].tgl:before::selection, input[type=checkbox].tgl *::selection, input[type=checkbox].tgl *:after::selection, input[type=checkbox].tgl *:before::selection, input[type=checkbox].tgl + .tgl-btn::selection { background: none; } input[type=checkbox].tgl + .tgl-btn { border: 1px solid #dddddd; width: 60px; height: 30px; outline: 0; display: block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } input[type=checkbox].tgl + .tgl-btn:after, input[type=checkbox].tgl + .tgl-btn:before { position: relative; display: block; content: ""; width: 50%; height: 100%; } input[type=checkbox].tgl + .tgl-btn:after { left: 0; } input[type=checkbox].tgl + .tgl-btn:before { display: none; } input[type=checkbox].tgl:checked + .tgl-btn:after { left: 50%; } input[type=checkbox].tgl-light + .tgl-btn { background: #FF9090; padding: 2px; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } input[type=checkbox].tgl-light + .tgl-btn:after { background: #f2f2f2; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } input[type=checkbox].tgl-light + .tgl-btn:checked + .tgl-btn { background: #5cb85c; }