body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:background-color .2s,color .2s}body.dark{color:#fff;background-color:#0f1116}:where(.dark) body{color:#fff;background-color:#0f1116}body:not(.dark){color:#09090b;background-color:#fff}#hero{flex-direction:column;justify-content:center;align-items:center;margin:0;display:flex}#links{text-align:left;color:#fff;flex-direction:column;width:400px;font-size:x-large;display:flex}#links a{color:#fff;border:1px solid #fff;border-radius:5px;margin:10px 0;padding:10px;text-decoration:none}#links a:hover{cursor:pointer;background-color:#1f1f1f}#header{max-width:1200px}#navbar{flex-direction:row;display:flex}#navbar a{color:#fff;margin-right:20px;text-decoration:none;transition:color .2s}body:not(.dark) #navbar a{color:#09090b}#navbar a:hover{cursor:pointer;color:#3b82f6}#blog{margin-top:50px}#blog a{color:#fff;margin-top:50px}#echo{background-color:#1e222d;border-radius:10px;width:360px;margin-top:50px;margin-left:auto;margin-right:auto;padding:20px}body:not(.dark) #echo{color:#09090b;background-color:#f4f4f5}#echo>h4{margin:0 0 15px}#echo>input{color:#fff;background-color:transparent;border:none;border-bottom:1px solid #fff;outline:none;width:100%;padding:0 0 5px;transition:border-bottom-color .2s;display:block}body:not(.dark) #echo>input{color:#09090b;border-bottom-color:#09090b}#echo>input:focus{border-bottom-color:#3b82f6}#echo>p{margin:20px 0 0 auto}