*{margin:0;padding:0;box-sizing:inherit}html{font-size:62.5%;box-sizing:border-box;font-family:Open Sans}body{transition:all .3s}body.dark{background:linear-gradient(135deg,#0e0e0e 0%,#0e0e0e 5%,transparent 5%,transparent 10%,#0e0e0e 10%,#0e0e0e 15%,transparent 15%,transparent 20%,#0e0e0e 20%,#0e0e0e 25%,transparent 25%,transparent 30%,#0e0e0e 30%,#0e0e0e 35%,transparent 35%,transparent 40%,#0e0e0e 40%,#0e0e0e 45%,transparent 45%,transparent 50%,#0e0e0e 50%,#0e0e0e 55%,transparent 55%,transparent 60%,#0e0e0e 60%,#0e0e0e 65%,transparent 65%,transparent 70%,#0e0e0e 70%,#0e0e0e 75%,transparent 70%,transparent 80%,#0e0e0e 80%,#0e0e0e 85%,transparent 85%,transparent 90%,#0e0e0e 90%,#0e0e0e 95%,transparent 95%);background-size:6em 6em;background-color:#1c1c1c;opacity:1;display:flex;flex-direction:column;justify-content:center;text-align:center;align-items:center;height:100dvh;padding:2rem;color:#fff}body.light{background:linear-gradient(135deg,#e3e3e3 0%,#e3e3e3 5%,transparent 5%,transparent 10%,#e3e3e3 10%,#e3e3e3 15%,transparent 15%,transparent 20%,#e3e3e3 20%,#e3e3e3 25%,transparent 25%,transparent 30%,#e3e3e3 30%,#e3e3e3 35%,transparent 35%,transparent 40%,#e3e3e3 40%,#e3e3e3 45%,transparent 45%,transparent 50%,#e3e3e3 50%,#e3e3e3 55%,transparent 55%,transparent 60%,#e3e3e3 60%,#e3e3e3 65%,transparent 65%,transparent 70%,#e3e3e3 70%,#e3e3e3 75%,transparent 70%,transparent 80%,#e3e3e3 80%,#e3e3e3 85%,transparent 85%,transparent 90%,#e3e3e3 90%,#e3e3e3 95%,transparent 95%);background-color:#ececec;background-size:6em 6em;background-color:#eee;opacity:1;display:flex;flex-direction:column;justify-content:center;text-align:center;align-items:center;height:100dvh;padding:2rem;color:#0e0e0e}h1{font-size:3.4rem;font-weight:300}h1 span.thick{font-weight:700}.dark h1::selection{background-color:#fff;color:#1c1c1c}.light h1::selection{background-color:#1c1c1c;color:#fff}h2{font-size:1.6rem;font-weight:400;line-height:1.6;min-height:12rem}.dark h2::selection{background-color:#fff;color:#1c1c1c}.light h2::selection{background-color:#1c1c1c;color:#fff}section{max-width:100rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4rem}button.new-fact{position:relative;font-size:1.4rem;background:#fff;color:#0e0e0e;padding:1rem 3rem;border-radius:3rem;overflow:hidden;z-index:1;transition:all .5s ease;border:none;cursor:pointer;outline:none}button.new-fact:hover:before{animation:ripple 1.5s infinite;animation-delay:0s}button.new-fact:hover:after{animation:ripple 1.5s infinite;animation-delay:.3s}button.new-fact:hover span:before{animation:ripple 1.5s infinite;animation-delay:.6s}button.new-fact:hover span:after{animation:ripple 1.5s infinite;animation-delay:.9s}button.new-fact:focus:before{animation:ripple 1.5s infinite;animation-delay:0s}button.new-fact:focus:after{animation:ripple 1.5s infinite;animation-delay:.3s}button.new-fact:focus span:before{animation:ripple 1.5s infinite;animation-delay:.6s}button.new-fact:focus span:after{animation:ripple 1.5s infinite;animation-delay:.9s}button.new-fact:before,button.new-fact:after,button.new-factspan:before,button.new-factspan:after{content:"";position:absolute;top:50%;left:50%;width:2rem;height:2rem;border-radius:50%;background:#fff0;transform:translate(-50%,-50%) scale(0);z-index:-1;transition:all .5s ease;border:2px solid rgb(0,0,0);opacity:0}.dark button.new-fact:hover{color:#1c1c1c;background:#fff;box-shadow:0 .5rem 1.5rem #0f172a4d}.dark button.new-fact:focus{background-color:#fff;color:#1c1c1c}.light button.new-fact{background:#0e0e0e;color:#fff}.light button.new-fact:hover{box-shadow:0 .5rem 1.5rem #0f172a4d}.light button.new-fact:focus{background-color:#1c1c1c;color:#fff}.light button.new-fact:before,.light button.new-fact:after,.light button.new-factspan:before,.light button.new-factspan:after{background:#ffffff80}@keyframes ripple{0%{transform:translate(-50%,-50%) scale(0);opacity:1;border-width:2px}to{transform:translate(-50%,-50%) scale(6);opacity:0;border-width:0}}.dark button.new-fact:active,.light button.new-fact:active{transform:scale(.95)}button.toggle{display:flex;justify-content:center;align-items:center;position:absolute;top:2rem;right:2rem;width:3rem;height:3rem;border-radius:50%;cursor:pointer;outline:none;border:none;transition:all .5s;z-index:20}button.toggle svg{height:1.6rem;width:1.6rem;transition:all .5s}.dark button.toggle{background-color:transparent;border:1px solid #fff}.dark button.toggle:hover{background-color:#fff}.dark button.toggle:focus{background-color:#fff}.dark button.toggle:hover svg{color:#0e0e0e}.dark button.toggle:focus svg{color:#0e0e0e}.light button.toggle{background-color:transparent;border:1px solid #0e0e0e}.light button.toggle:hover{background-color:#0e0e0e}.light button.toggle:focus{background-color:#1c1c1c}.light button.toggle:hover svg{color:#fff}.light button.toggle:focus svg{color:#fff}.dark button.toggle svg{color:#fff}.light button.toggle svg{color:#0e0e0e}.footer-icons{position:absolute;bottom:2rem;left:2rem;display:flex;justify-content:center;align-items:center;gap:1.1rem}.footer-icons a{display:flex;justify-content:center;align-items:center;padding:.3rem;transition:all .6s}.footer-icons a:hover{opacity:.5;outline:none}.footer-icons a:focus{opacity:.5;outline:none}.footer-icons a svg{width:2.2rem;height:2.2rem;transition:all .5s}.dark .footer-icons a svg{color:#fff}.light .footer-icons a svg{color:#1c1c1c}
