:root{--color-accent:#00AAAA;--color-text:#F5F5F5;--color-neutral:#242424;--color-background-body:#0A0A0A;--color-background-content:#161616;--font-family-logo:"Orbitron", monospace;--font-family-title:"Hack", monospace;--font-family-content:"Roboto Slab", "Roboto", sans-serif;--font-family-code:"Hack", "Source Code Variable", "JetBrains Mono", monospace;--content-width:900px}body{padding:0;margin:0;font-family:var(--font-family-content);color:var(--color-text);background-color:var(--color-background-body)}*{scrollbar-color:var(--color-accent)var(--color-background-body);margin:0;padding:0}*::-webkit-scrollbar-thumb{background-color:var(--color-accent)}*::-webkit-scrollbar-track{background-color:var(--color-background-body)}code{text-wrap:wrap}a{color:var(--color-text)}a:hover{color:var(--color-accent);transition:color ease .25s}p{padding:0;margin:0}.header{background-color:var(--color-background-content);border-bottom:3px solid var(--color-neutral);height:45px}.navelement{height:100%;max-width:var(--content-width);margin:0 auto}.navlogo{font-family:var(--font-family-logo);font-weight:700;color:var(--color-accent);font-size:30px;text-transform:uppercase;text-decoration:none;float:left;margin-left:.3em;line-height:45px}.navbar{float:right;margin-right:.5em;height:45px;line-height:45px}.navbar a{color:var(--color-text);text-decoration:none}.navbar a:hover{color:var(--color-accent);transition:ease .25s}.navseperator{color:var(--color-neutral);font-family:var(--font-family-title);font-weight:700}@media(max-width:900px){.bloglisticon{display:none!important}}@media(max-width:650px){.navlogo{display:none}.navbar{float:none;text-align:center}.bloglisttitle{font-size:.8em;color:red}}@media(max-width:500px){.navseperator{display:none}.navbar a{font-size:.85em;font-weight:700;margin:0 .3em}.logotext{font-size:2.5em!important}.blogpostdate{display:none}.blogheader{padding:6em 2em 4em!important}.blogheader h1{font-size:2em!important}}.herobackground{background-color:teal;background:rgba(0,0,0,.5)url(/img/background.png);background-blend-mode:darken;background-repeat:no-repeat;background-size:cover;background-position:50%;box-shadow:inset 0 0 8px #000;width:100%;height:75vh}.herocontainer{max-width:var(--content-width);margin:0 auto;overflow-x:hidden;height:100%;display:flex;align-items:center;justify-content:center;text-align:center}.logotext{font-family:var(--font-family-logo);font-weight:700;font-size:4rem;display:inline-block}.phonetic{font-family:var(--font-family-title);font-size:1rem;text-transform:uppercase}.splashlink{background-color:var(--color-background-content);border:2px solid var(--color-background-body);box-shadow:4px 4px 4px rgba(0,0,0,.5);border-radius:2px;text-decoration:none;margin:0 .5em;padding:.4em .8em}.contentpreview{max-width:var(--content-width);background-color:var(--color-background-content);margin:1em auto;padding:2em;border-radius:2px;box-shadow:0 0 4px rgba(0,0,0,.5);text-align:justify}.contentpreviewtr{max-width:var(--content-width);margin:1em auto;padding:2em;text-align:justify}.contentpreview h2{font-family:var(--font-family-logo);font-size:2em;font-weight:700;text-align:center;margin-left:.2em;margin-bottom:.5em}.contentpreview a{text-decoration:none}.gradientbg{width:100%;height:100%;position:fixed;top:0;z-index:-1;background:radial-gradient(circle at 100% 80%,#00808040 0%,transparent 100%)}.previewcontainer{background-color:var(--color-background-body);height:320px;margin-top:1em;padding:1em;border-radius:2px;box-shadow:inset 0 0 4px rgba(0,0,0,.5);display:flex;gap:1em;overflow-x:auto}.previewcontainer a{text-decoration:none;transition:transform .3s ease-in-out}.previewcontainer a:hover{transform:scale(1.02)}.projectpreview{background-color:var(--color-accent);background-repeat:no-repeat;background-size:cover;background-position:50%;height:100%;width:240px;border-radius:2px;box-shadow:0 0 4px rgba(0,0,0,.5);display:flex;align-items:flex-end;flex-shrink:0}.previewcontainerblog{background-color:var(--color-background-body);margin-top:1em;padding:1em;border-radius:2px;box-shadow:inset 0 0 4px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:.5em}.previewcontainerblog a{text-decoration:none}.blogpostpreview{padding:.4em .6em;background-color:var(--color-neutral);border-radius:2px;font-size:1.25em;display:flex;flex-direction:row}.blogposttitle{flex-grow:1}.blogpostdate{color:var(--color-accent);padding-left:inherit}.previewtext{background-color:rgba(0,0,0,.7);width:100%;padding:.5em}.youtubepreview{display:flex;gap:1em}.youtubecontainer{flex:1;overflow:hidden;position:relative;padding-bottom:30%;height:0}.youtubecontainer iframe{position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%}.videotext{flex:1;text-align:center}@media(max-width:700px){.youtubecontainer{display:none}}.youtube-player{position:relative;aspect-ratio:16/10;overflow:hidden;max-width:100%;background:#000;margin:5px;border-radius:2px}.youtube-player iframe{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;background:0 0}.youtube-player img{object-fit:cover;display:block;left:0;bottom:0;margin:auto;max-width:100%;width:100%;position:absolute;right:0;top:0;border:none;height:auto;cursor:pointer}.youtube-player .play{cursor:pointer;position:absolute;height:48px;width:68px;left:50%;top:50%;margin:100px auto;margin-left:-34px;margin-top:-24px;background:red;border-radius:50%/10%}.youtube-player .play::before{content:"";position:absolute;top:10%;bottom:10%;left:-5%;right:-5%;background:red;border-radius:5%/50%}.youtube-player .play::after{content:"";position:absolute;height:2px;width:2px;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:15px solid #fff;top:28%;right:34%}.contactme{background-color:var(--color-accent);padding:.3em 1em;margin:0 auto;margin-top:1em;font-size:30px;font-weight:700;text-decoration:none;display:block;width:fit-content;border-radius:2px;box-shadow:4px 4px 4px rgba(0,0,0,.5)}.contactme:hover{color:var(--color-background-body)}.postlisting{margin:1em 0;padding:1.5em;display:flex;align-content:space-between;gap:1.5em;border-radius:2px;box-shadow:0 0 4px rgba(0,0,0,.5);background-color:var(--color-background-body)}.postlisting h2{margin:0 0 .5em;text-align:start}.postlisting p{text-align:justify}.pageimg{padding:5em;border-radius:2px;background:var(--color-neutral);background-size:cover;background-position:50% 33%}.blogpost{max-width:var(--content-width);margin:0 auto;background-color:var(--color-background-content);padding:0;border-radius:2px;box-shadow:0 0 4px #000;overflow:hidden}.blogheader{background:var(--color-neutral);background-size:cover;background-position:50% 33%;padding:8em 6em 4em;text-align:center;text-shadow:0 0 4px #000}.blogheader h1{font-size:3em;margin:.3em}.taxonomyLink{margin:.6em .1em;padding:.2em .4em;text-decoration:none;border-radius:2px;text-decoration:none;margin:0 .2em;padding:.2em .5em}.taxonomyLink:hover{color:var(--color-text);text-decoration:underline}.postcontent{padding:2em}.postcontent p{margin:1em 0;width:100%}.postcontent h1{text-align:center}.postcontent img{display:block;margin:1.5em auto;height:auto;max-width:100%;max-height:18em;border-radius:2px}.postcontent ul{margin:1em 1.5em}.postcontent .highlight{margin:.5em}.postcontent table,th,td{margin:1em auto;border:1px solid;border-collapse:collapse}.postcontent table{display:block;max-width:-moz-fit-content;max-width:fit-content;margin:0 auto;overflow-x:auto;white-space:nowrap}.postcontent th{background-color:#ffffff20}.postcontent th,td{padding:.2em .4em}.bloglistcontainer{overflow:visible;max-width:var(--content-width);margin:1em auto;padding:1em;text-shadow:0 0 3px #000}.bloglistlink{text-decoration:none;color:var(--color-accent)}.bloglistlisting{display:grid;grid-template-columns:40% 60%;grid-auto-rows:minmax(min-content,max-content);margin-bottom:1em;position:relative;grid-template-areas:"bloglistimg bloglistimg" "bloglisttitle bloglisttext" "bloglistextra bloglistextra"}.bloglisttitle{grid-area:bloglisttitle;z-index:1;text-align:right;padding:0 .5em;font-family:var(--font-family-logo);text-shadow:-2px 0 #000,0 2px #000,2px 0 #000,0 -2px #000}.bloglisttext{grid-area:bloglisttext;z-index:1;padding:0 .5em;text-shadow:-2px 0 #000,0 2px #000,2px 0 #000,0 -2px #000}.tagelement{display:inline;color:var(--color-background-body);background-color:var(--color-accent);text-decoration:none;text-shadow:none;box-shadow:0 0 3px black;padding:2px 6px;border-radius:2px;line-height:2em;margin-top:.5em}.tagelement:hover{color:var(--color-text)}.bloglistimg{grid-area:bloglistimg;margin:1em 0;text-align:center}.bloglistimgel{width:100%;aspect-ratio:3/1;object-fit:cover;object-position:0% 25%}.bloglisticon{background-position:50%;background-repeat:no-repeat;background-size:contain;filter:brightness(80%);filter:drop-shadow(0 0 2px #000);z-index:0;pointer-events:none;display:inline-block;position:absolute;bottom:0%;left:-20%;width:60%;height:80%}.projectlistcontainer{overflow:visible;max-width:var(--content-width);margin:1em auto;padding:1em}.projectgrid{display:flex;gap:3em;flex-wrap:wrap;align-content:center;justify-content:center}.projectcard{position:relative;flex-grow:0;flex-shrink:1;flex-basis:16em}.projectlistlink{text-decoration:none;color:#0bb}.projectlistimg{grid-area:bloglistimg;margin:1em 0;text-align:center}.projectlistimgel{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:0% 25%;border-radius:2px;filter:brightness(90%)}.projectlisttext{position:absolute;display:flex;top:0;left:0;width:100%;height:100%;text-align:center;align-items:center;justify-content:center;font-family:var(--font-family-logo);font-size:2em;font-weight:900;text-shadow:-2px 0 #000,0 2px #000,2px 0 #000,0 -2px #000}.footer{text-align:center;height:1.6em;margin:.8em 0}.footer *{display:inline-block;color:var(--color-text);margin:0 .2em}.errorno{padding:2em;text-align:center}.errorno p{font-size:2em}.animcontainer{display:flex;align-items:center;justify-content:center;height:512px}.cube{position:relative;transform-style:preserve-3d;width:256px;height:256px;transform:rotateX(-30deg)rotateY(30deg);animation:rotate 5s infinite linear}.face{position:absolute;display:flex;align-items:center;justify-content:center;width:256px;height:256px;font-size:4em;color:var(--color-accent);border:2px solid var(--color-text)}.north{transform:translateZ(128px)}.south{transform:rotateY(180deg)translateZ(128px)}.west{transform:rotateY(-90deg)translateZ(128px)}.east{transform:rotateY(90deg)translateZ(128px)}@keyframes rotate{from{transform:rotateX(-20deg)rotateY(0)}to{transform:rotateX(-20deg)rotateY(360deg)}}