.container{text-align:center}.container>.switch{display:block;margin:22px auto}.switch{position:relative;display:inline-block;vertical-align:top;width:130px;height:36px;padding:1px;border-radius:3px;cursor:pointer}.switch-input{position:absolute;top:0;left:0;opacity:0}.switch-label{position:relative;display:block;height:inherit;font-size:12px;text-transform:uppercase;background:#fafafa;border-radius:inherit;box-shadow:inset 0 1px 2px #0000001f,inset 0 0 2px #00000026;-webkit-transition:.15s ease-out;-moz-transition:.15s ease-out;-o-transition:.15s ease-out;transition:.15s ease-out;-webkit-transition-property:opacity background;-moz-transition-property:opacity background;-o-transition-property:opacity background;transition-property:opacity background}.switch-label:before,.switch-label:after{position:absolute;top:50%;margin-top:-.5em;line-height:1;-webkit-transition:inherit;-moz-transition:inherit;-o-transition:inherit;transition:inherit}.switch-label:before{content:attr(data-off);right:9px;color:#464854}.switch-label:after{content:attr(data-on);left:11px;color:#fcfcfc;opacity:0}.switch-input:checked~.switch-label{background:#10ac84;box-shadow:inset 0 1px 2px #00000026,inset 0 0 3px #0003}.switch-input:checked~.switch-label:before{opacity:0}.switch-input:checked~.switch-label:after{opacity:1}.switch-handle{position:absolute;top:1px;left:-5px;width:36px;height:36px;background:white;border-radius:3px;box-shadow:1px 1px 5px #0003;background-image:-webkit-linear-gradient(top,white 40%,#f0f0f0);background-image:-moz-linear-gradient(top,white 40%,#f0f0f0);background-image:-o-linear-gradient(top,white 40%,#f0f0f0);background-image:linear-gradient(to bottom,white 40%,#f0f0f0);-webkit-transition:left .15s ease-out;-moz-transition:left .15s ease-out;-o-transition:left .15s ease-out;transition:left .15s ease-out}.switch-handle:before{content:"";position:absolute;top:50%;left:50%;margin:-6px 0 0 -6px;width:12px;height:12px;background:#f9f9f9;border-radius:6px;box-shadow:inset 0 1px #00000005;background-image:-webkit-linear-gradient(top,#eeeeee,white);background-image:-moz-linear-gradient(top,#eeeeee,white);background-image:-o-linear-gradient(top,#eeeeee,white);background-image:linear-gradient(to bottom,#eeeeee,white)}.switch-input:checked~.switch-handle{left:93px;box-shadow:-1px 1px 5px #0003}.switch-green>.switch-input:checked~.switch-label{background:#4fb845}