@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@600&family=Noto+Sans&family=VT323&display=swap');:root{--foreground:#3a4055;--background:#f9f7f3;--black:#2b2b2b;--gray:#5a647e;--red:#da4939;--light-red:#e05b41;--green:#a5c261;--light-green:#c7d671;--yellow:#ffc66d;--light-yellow:#ffeb6d;--blue:#6d9cbe;--light-blue:#86c0ce;--magenta:#b6b3eb;--light-magenta:#c2baf4;--cyan:#519f50;--light-cyan:#b4ddea;--white:#e6e1dc;--light-white:#f9f7f3}body{font-family:'Noto Sans', sans-serif;margin:0;padding:0;opacity:0;transition:opacity 0.5s ease;color:var(--foreground);background-color:var(--background)}section a{color:var(--blue);font-weight:bold}a{text-decoration:none}section{margin-block:3em}.desktop{display:none}header{position:sticky;top:0;background-color:var(--foreground);padding:10px 0;box-shadow:0 0 1em var(--foreground);z-index:100}nav ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center}nav ul li{margin:0 10px}nav.phone{position:relative;height:2em}nav.desktop ul{max-width:50%;margin:auto}nav ul li a,nav.phone p{color:var(--light-white);font-family:'Fira Sans', sans-serif;font-size:150%;margin:0 auto;text-align:center;z-index:1}#hamburger{width:1em;height:1em;cursor:pointer;position:absolute;right:0.5em;top:-10px;color:var(--light-white);font-size:200%;z-index:2}.terminal,.terminal *{background-color:var(--black);color:var(--green);font-family:'VT323', monospace}.terminal a{transition:text-shadow 0.2s linear;text-shadow:none}.terminal a:hover{text-shadow:var(--green) 0 0 15px}.phone .menu{display:block;position:fixed;top:0;right:0;width:275px;height:100vh;padding:20px;z-index:999;transition:transform 0.3s ease;overflow-y:auto;font-size:200%}.phone .menu li{list-style:none}.phone .menu a{color:var(--foreground);font-size:20px;display:block;padding:10px 0;color:inherit;font-family:inherit;font-size:inherit}@keyframes blink{0%{opacity:1}33%{opacity:1}100%{opacity:0}}.blink{animation-name:blink;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite;animation-delay:0.5s}@keyframes typing{from{width:0}to{width:100%}}.type{overflow:hidden;white-space:nowrap;animation-name:typing;animation-duration:2s;animation-timing-function:steps(20);animation-fill-mode:forwards}.blur{filter: blur(2px);opacity:0.3}.phone .menu{transform:translateX(100%)}.phone .menu.open{transform:translateX(0)}.phone .menu.closed{transform:translateX(100%)}main{padding:20px;transition:filter 0.3s ease, opacity 0.2s ease;overflow:hidden}#top{max-width:20em;margin:2em auto}#profile-pic{display:flex;justify-content:center;align-items:center}#profile-pic img{height:7em;width:7em;object-fit:contain;transition:opacity 0.5s ease, transform 0.5s ease;border-radius:50%;background-color:var(--light-white);border:1px solid var(--black)}.img-1em{max-height:1em;max-width:1em}#spacer{height:1em}#intro-msg{text-align:center;line-height:0.8em}#intro-content h1,#intro-content p{margin:0 auto 5px}#about,#contact,#resume,#skills,#testimonials{opacity:0;transform:translateY(20%);transition:opacity 0.5s ease, transform 0.5s ease;margin-bottom:3em}.skill-list{display:grid;gap:10px}.skill-item{display:flex;align-items:center;position:relative}.skill-icon{font-size:1.25em;margin-right:10px;width:1.3em;text-align:center}.skill-progress{flex-grow:1;height:0.8em;background-color:var(--white);border-radius:0.8em;position:relative;overflow:hidden}.skill-progress-bar{position:absolute;top:0;left:0;height:100%;background-color:var(--red);color:var(--light-white);width:0}.skill-progress-bar.animated{animation:skillBarAnimation 1s ease-out forwards}@keyframes skillBarAnimation{from{width:0}to{width:100%}}.skill-name{color:var(--light-white);font-size:0.9rem;font-family:'VT323', monospace;text-shadow:0 0 3px var(--black);position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;white-space:nowrap;z-index:2;pointer-events:none}.announcement{display:none}#about.opacity-1,#contact.opacity-1,#intro.opacity-1,#resume.opacity-1,#skills.opacity-1,#testimonials.opacity-1,body.opacity-1{opacity:1;transform:translateY(0)}#testimonials{opacity:0;transform:translateY(20%);transition:opacity 0.5s ease, transform 0.5s ease}footer{background-color:var(--background);text-align:center}footer p{margin:3px}#about.opacity-1,#contact.opacity-1,#intro.opacity-1,#resume.opacity-1,#skills.opacity-1,#testimonials.opacity-1,body.opacity-1{opacity:1;transform:translateY(0)}.foreground{color:var(--foreground)}.background{background-color:var(--background)}.black{color:var(--black)}.gray{color:var(--gray)}.red{color:var(--red)}.light-red{color:var(--light-red)}.green{color:var(--green)}.light-green{color:var(--light-green)}.yellow{color:var(--yellow)}.light-yellow{color:var(--light-yellow)}.blue{color:var(--blue)}.light-blue{color:var(--light-blue)}.magenta{color:var(--magenta)}.light-magenta{color:var(--light-magenta)}.cyan{color:var(--cyan)}.light-cyan{color:var(--light-cyan)}.white{color:var(--white)}.light-white{color:var(--light-white)}@media screen and (min-width: 560px){#top{display:inline-flex;max-width:30em;width:90%;margin:0 5%}#intro-msg{text-align:left}#spacer{width:8%}}@media screen and (min-width: 800px){main{margin:0 15%}}@media screen and (min-width: 1200px){.phone{display:none}.desktop{display:unset}header{background-color:var(--black);color:var(--green)}#desktop-links{font-size:200%;display:block;width:100%;text-align:center}#top{width:100%;padding:5em;margin:auto}#profile-pic img{height:9em;width:9em}}@media (prefers-color-scheme: dark){:root{--gray:var(--yellow)}body,footer{background-color:var(--foreground);color:var(--white)}header{box-shadow:none;background-color:var(--black)}#profile-pic img{border:none}.skill-progress{background-color:var(--black)}body a{color:var(--cyan)}}.little-letters{font-size:75%}
