:root{font-family:Figtree,sans-serif;color:#fffff3;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#00bf9f;background:linear-gradient(163deg,#128b77,#00bfa3,#006175 30%,#070707 52%,#800a0a 81%,#dda006);background-repeat:no-repeat;background-size:cover;background-attachment:fixed;height:100vh;scroll-behavior:smooth}:root:before{content:"";background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");background-size:180px;opacity:.12;top:0;left:0;position:fixed;width:100%;height:100%;z-index:-1}body{margin:0;min-width:320px;min-height:100vh;align-content:center}footer{width:100%;box-sizing:border-box;background-color:#161616;padding:1rem;color:#6d6d6d}#footer-links{display:flex}#footer-links small{align-self:center;font-size:12px}#footer-links a{text-decoration:none;color:#949494}@media (width <= 480px){#footer-links{flex-direction:column}}@media (min-width: 480px){#footer-links{justify-content:space-between}}#navbar{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);padding:1rem;justify-content:space-between;color:#fffff3;z-index:5;position:fixed;top:0;width:100%;box-sizing:border-box}#navbar a{text-decoration:none;color:#fffff3}#nav-links{display:flex;column-gap:1rem}.nav-link{border:2px solid #FFFFF3;border-radius:1rem;padding:.15rem 2rem}#navbar .nav-link:hover{cursor:pointer;text-shadow:0 0 4px #FFFFF3;box-shadow:0 0 4px #fffff3}#logo{display:flex;column-gap:.25rem;justify-content:center;font-family:Figtree,sans-serif;font-weight:400}#logo p{margin:0;font-size:1.25rem}#mobile-nav #hamburger-nav{position:absolute;top:1rem;right:1rem;display:flex;flex-direction:column;row-gap:.25rem}#mobile-nav #hamburger-nav:hover{cursor:pointer}#mobile-nav #hamburger-nav:hover #bar-one,#mobile-nav #hamburger-nav:hover #bar-two{box-shadow:0 0 4px #fff}#mobile-nav #bar-one,#mobile-nav #bar-two{width:1.5rem;height:2px;background-color:#fff;box-shadow:1px 1px 4px #464646}#mobileNav-menu{display:flex;flex-direction:column;align-items:center;row-gap:1rem;list-style:none;background-color:#80808040;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-top:2rem;padding:1rem 0;position:absolute;width:100%}#mobileNav-menu a{color:#fffff3;text-decoration:none}#mobileNav-menu li{font-size:1.5rem}#mobileNav-menu li:hover{cursor:pointer;text-shadow:0 0 4px #FFFFF3}.menu-open #bar-one{rotate:45deg;position:absolute;top:0;right:0}.menu-open #bar-two{rotate:-45deg;position:absolute;top:0;right:0}#navbar,#mobile-nav{display:none}@media (max-width: 620px){#mobile-nav{display:block}}@media (min-width: 621px){#navbar{display:flex}}.project-card{display:flex;column-gap:1.5rem;background-color:#3b3b3b40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:1rem;padding:1.5rem;box-shadow:4px 4px 4px #00000040}.project-card img{min-width:12rem;height:8rem;border-radius:.75rem;object-fit:contain}.project-card img:hover{cursor:pointer;box-shadow:0 0 4px #fffff3}.project-card h3{margin-top:0;font-weight:600}.project-card .tech-stack{display:flex;flex-wrap:wrap;column-gap:.75rem;row-gap:.75rem}.project-card .tech-stack small{font-weight:100;color:#d1d1d1;background-color:#131212;border:solid 1px #131212;border-radius:1rem;padding:.25rem .5rem}#hero-section{display:flex;flex-direction:column;row-gap:.5rem;width:75%;height:100vh;justify-content:center;margin:0 auto}#hero-section h1{font-weight:600;margin:0;font-size:4rem}#hero-section p{margin:0;font-weight:400;font-size:1.5rem;color:#969696}#hero-section #linkedin-btn,#hero-section #github-btn{color:#fffff3}#hero-section #linkedin-btn:hover{color:#235fe2}#hero-section #github-btn:hover{color:#4ca85c}#hero-section #arrow-btn{position:absolute;bottom:2rem;right:2rem}#hero-section #arrow-btn #arrow-icon{font-size:3rem;color:#fffff3}#about,#projects,#resume{scroll-margin-top:5rem;animation:scroll-animation linear;animation-timeline:view();animation-range:entry 0% cover 50%}#resume{animation-range:entry 0% cover 25%}@keyframes scroll-animation{0%{opacity:0}to{opacity:1}}main{display:flex;flex-direction:column;row-gap:10rem;width:75%;margin:0 auto}main h2{font-weight:600;margin:0;font-size:1.5rem}main p{font-size:1.125rem;color:#d1d1d1}main #about h2{margin-bottom:2rem}main #about #about-content{display:flex;column-gap:1rem;row-gap:1rem;border-radius:1rem;background-color:#3b3b3b40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.5rem;box-shadow:4px 4px 4px #00000040}main #about #about-content h4{font-weight:600;margin-bottom:1rem}main #about #about-content #skills{display:flex;flex-wrap:wrap;column-gap:.75rem;row-gap:.75rem}main #about #about-content #skills small{font-weight:100;color:#d1d1d1;background-color:#131212;border:solid 1px #131212;border-radius:1rem;padding:.25rem .5rem}main #projects #project-container{display:flex;flex-direction:column;row-gap:2rem}main #projects h2{margin-bottom:2rem}main #resume{margin-bottom:10rem}main #resume h2{margin-bottom:2rem}main #resume ul{padding:0;display:flex;flex-direction:column;row-gap:2rem}main #resume li{list-style:none;margin:0;background-color:#3b3b3b40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:1rem;padding:1.5rem;box-shadow:4px 4px 4px #00000040;display:flex;flex-direction:column;row-gap:.75rem}main #resume li #resume-preview{border:none;object-fit:contain}main #resume li #download-resume-btn{align-self:center;font-size:1rem;color:#d1d1d1;background-color:#487ff7}main #resume li #download-resume-btn:hover{background-color:#1b315c}.char{transition:all .15s}.char:hover{cursor:default;text-shadow:0 0 4px #FFFFF3}@media (max-width: 520px){#hero-section,main{width:95%}#hero-section h1{font-size:3rem}#hero-section p{font-size:1rem}#hero-section #arrow-btn{display:none}main .project-card{flex-direction:column;row-gap:1rem}main .project-card h3{margin-bottom:.5rem}main .project-card p{margin-top:0}}@media (min-width: 521px) and (max-width: 800px){#hero-section,main{width:90%}#hero-section h1{font-size:3.75rem}#hero-section p{font-size:1.25rem}#hero-section #arrow-btn{display:none}}@media (min-width: 1000px){#hero-section,main{width:60%}}