.switch{position:fixed;bottom:1em;right:1em;z-index:1000}.toggle{position:absolute;margin-left:-9999px;visibility:hidden}.toggle+label{display:block;position:relative;cursor:pointer;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}input.toggle+label{padding:2px;width:50px;height:25px;background-color:rgba(153,153,153,0.5);border-radius:25px;-webkit-transition:background 0.2s;transition:background 0.2s}input.toggle+label:before,input.toggle+label:after{display:block;position:absolute;content:""}input.toggle+label:before{top:2px;left:2px;bottom:2px;right:2px;background-color:#f9f9f9;border-radius:25px;-webkit-transition:background 0.2s;transition:background 0.2s}input.toggle:checked+label:before{background-color:#f45b5d}input.toggle+label:after{top:4px;left:4px;bottom:4px;width:21px;background-color:rgba(153,153,153,0.5);border-radius:21px;-webkit-transition:-webkit-transform 0.2s,background 0.2s;transition:transform 0.2s,background 0.2s}input.toggle:checked+label{background-color:#f45b5d;box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2)}input.toggle:checked+label:after{-webkit-transform:translateX(25px);-ms-transform:translateX(25px);transform:translateX(25px);background-color:#f9f9f9;box-shadow:0 10px 20px rgba(0,0,0,0.19),0 6px 6px rgba(0,0,0,0.23);-webkit-transition:-webkit-transform 0.2s,background 0.2s;transition:transform 0.2s,background 0.2s}p span.readable{background:rgba(244,91,93,0.2);position:relative}p span.readable:before,p span.readable:after{content:"";position:relative;padding:0.25em 0;top:0}p span.readable:before{left:0;border-left:2px solid #f45b5d}p span.readable:after{right:0;border-right:2px solid #f45b5d}
