:root{--white:#fcfcfc;--black:#1c1c1c;--newwhite:#1c1c1c;--newblack:#fcfcfc}body{margin:0;padding:0}.color,body{height:100vh;width:100%}.color{display:flex;justify-content:center;align-items:center;background:var(--white);transition:all .35s cubic-bezier(.17,.67,.83,.67) .5s}input[type=checkbox]{display:none}label{position:relative;margin:0 auto;font-size:1.5em;color:var(--white);background:var(--black);padding:.5em .5em;display:flex;justify-content:space-between;align-items:center;width:3em;height:auto;box-shadow:0 12px 24px rgba(0,0,0,.14);transition:all .5s ease-in .2s}.pointer,label{border-radius:50px}.pointer{position:absolute;z-index:1;height:.25em;width:.25em;top:.18em;left:.2em;padding:.7em;background:var(--white);transition:all .3s ease-in-out}input[type=checkbox]:checked+.color label .pointer{transform:translateX(2em)}input[type=checkbox]:checked+.color{--white:var(--newwhite);--black:var(--newblack)}*,:after,:before{margin:0;padding:0}.app-title{font-family:Playfair Display,serif;position:absolute;bottom:2em;right:1em}.github{text-decoration:none;color:#088}