*{box-sizing:border-box}body{margin:0;font-family:Inter}@keyframes intro-fade{0%{opacity:0}to{opacity:1}}#root{display:flex;flex-direction:column}nav,nav+div,footer{margin:auto;width:100%;max-width:1200px}#lightbox{display:block;position:fixed;overflow:hidden;width:100%;height:100%;background:#000;z-index:-1}#lightbox>.circle{width:600vw;height:600vw;left:-300vw;top:-300vw;position:absolute;transition:all 5s ease}nav{display:flex;background-color:#0006;color:#ccc;height:4em;box-shadow:0 0 20px #000;align-items:center;justify-content:space-between}nav>.logo{color:#fff;font-size:1.6em;padding:0 1em;cursor:pointer}nav>ul{display:flex;align-items:center}nav>ul>li{display:inline;padding:.8em;margin:0 .2em;color:#ccc;cursor:pointer}nav+div{padding:2em;background-color:#0004;box-shadow:0 0 20px #000;color:#ccc}nav+div.transitioning>.header>*{opacity:0}nav+div.transitioning>.header>h2{animation:intro-fade .5s normal 0s forwards}nav+div.transitioning>.header>h3{animation:intro-fade .5s normal .5s forwards}nav+div.transitioning>.header>ul.blog-tag{opacity:0}nav+div.transitioning>.header>ul.blog-tag>li{animation:intro-fade .5s normal 1s forwards;opacity:0}nav+div.transitioning>.body{opacity:0;overflow:hidden}nav+div>.header{margin:4em 0;padding-bottom:2em;display:flex;flex-direction:column;align-items:center}nav+div>.header>h1{font-size:3em;margin:0;color:#fff;text-align:center}nav+div>.header>h2{font-size:1.1em;max-width:70%;margin:20px;color:#68b3bb;font-family:Open Sans;white-space:pre-wrap;text-align:center}nav+div>.header>h3{font-size:.8em;color:#ccc}nav+div>.header>span.homepage{width:60%;padding-top:2em}@media screen and (max-width: 700px){nav+div>.header>span.homepage{width:90%}}nav+div ul.blog-tag{display:flex;align-items:center;margin:0;padding:0}nav+div ul.blog-tag>li{display:inline;padding:.2em .8em;margin:0 .3em;font-weight:700;font-family:Open Sans;font-size:.8em;color:#dcedef;background:#bb6868;border-radius:2em;cursor:pointer}nav+div ul.blog-tag>li.lang{color:#ebdcef;text-shadow:0 0 20px black,0 0 20px black;background:#6886bb}nav+div>.body{display:flex;flex-direction:column;color:#fff;max-width:80%;margin:auto}@media screen and (max-width: 700px){nav+div>.body{max-width:99%}nav+div>.body>h1{text-align:center}}nav+div>.body a{color:#acf;text-decoration:none}nav+div>.body>hr{width:100%}nav+div>.body>p{line-height:2em;text-align:justify}nav+div>.body>p.back-homepage{text-align:center;cursor:pointer}nav+div>.body>ul{padding:0 3em}nav+div>.body>ul>li{padding:5px 0}nav+div>.body>a>img{padding-bottom:2em;width:100%}nav+div>.body>pre{background:#111;margin:1em;padding:1em;border:solid 1px #2ff;overflow-x:auto}nav+div>.body>.blog-posts{display:flex;flex-wrap:wrap;justify-content:center}@media screen and (max-width: 700px){nav+div>.body>.blog-posts{flex-direction:column;align-items:center}}nav+div>.body>.blog-posts>div{position:relative;display:flex;flex-direction:column;background:#6666;border-radius:4px;margin:1em;padding-top:1em;min-width:15em;max-width:15em;text-align:center;cursor:pointer;transition:.2s ease all}nav+div>.body>.blog-posts>div:after{position:absolute;top:0;left:0;display:block;width:100%;height:100%;pointer-events:none;content:"";border-radius:inherit;box-shadow:inset 0 1px 1px #ffffff1a}nav+div>.body>.blog-posts>div:hover{box-shadow:0 0 1rem #000a;transform:scale(1.05)}nav+div>.body>.blog-posts>div>span{padding:1em;font-size:.8em}nav+div>.body>.blog-posts>div:hover h1{background-color:#8b61ff66;box-shadow:0 0 1rem #000a;transform:scale(1.05)}nav+div>.body>.blog-posts>div>h1{display:flex;position:relative;padding:.5em 0;margin:auto 1em;align-items:center;justify-content:center;border-radius:6px;background-color:#8b61ff66;box-shadow:0 0 1rem #0003;font-size:1em;font-weight:400;transition:.2s ease all}nav+div>.body>.blog-posts>div>h1:after{position:absolute;top:0;left:0;display:block;width:100%;height:100%;pointer-events:none;content:"";border-radius:inherit;box-shadow:inset 0 1px 1px #ffffff1a}nav+div>.body>.blog-posts>div:hover>ul.blog-tag>li{box-shadow:0 0 1rem #0006}nav+div>.body>.blog-posts>div>ul.blog-tag{width:100%;background:#0003;flex-wrap:wrap;row-gap:.4em;justify-content:center;padding:1em}nav+div>.body>.blog-posts>div>div{display:table;background:#0006;padding:1em;font-size:.8em;text-align:left}nav+div>.body>.blog-posts>div>div>div{display:table-row}nav+div>.body>.blog-posts>div>div>div>b{display:table-cell;padding-right:1em}nav+div>.body>.blog-posts>div>div>div>b:after{content:":"}nav+div>.body>.blog-posts>div>div>div>span{display:table-cell;width:100%}footer{display:flex;background-color:#0006;color:#ccc;height:4em;align-items:center;justify-content:center}