@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&display=swap";@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&family=Press+Start+2P&display=swap";.fira-code-regular{font-family:Fira Code,monospace;font-optical-sizing:auto;font-weight:400;font-style:normal}.press-start-2p-regular{font-family:"Press Start 2P",system-ui;font-weight:400;font-style:normal}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--colour-orange: #df7126;--colour-orange-dark: #8f563b;--colour-dark: #222034;--colour-orange-light: #d9a066;--font-mono: "Fira Code", monospace;--font-pixel: "Press Start 2P", system-ui}*,*:before,*:after{box-sizing:border-box}a{font-weight:500;color:var(--colour-orange-light);text-decoration:inherit}a:hover{color:var(--colour-orange-light)}body{margin:0;display:flex;min-width:320px;min-height:100vh;background-color:var(--colour-dark)}h1,h2,h3,h4,h5{font-family:var(--font-pixel);color:var(--colour-orange);margin:20px}h1{font-size:2rem}h2{font-size:1.5em}h3{font-size:1.125rem}p,small{font-family:var(--font-mono);color:var(--colour-orange);margin:20px}button{padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;cursor:pointer;transition:border-color .25s}button:hover{border-color:var(--colour-orange)}main{width:75vw}#root{flex-grow:1;display:flex;flex-direction:column;align-items:center;padding:20px}@media(prefers-color-scheme:light){:root{color:var(--colour-dark);background-color:#fff}a:hover{color:var(--colour-orange-light)}button{background-color:#f9f9f9}}@media(max-width:767px){#root{padding:0}h1{font-size:1.25rem}h2{font-size:.875rem}h3{font-size:.75rem}main{width:100vw}}.hover-image-container{position:relative;width:45vw;height:45vw;overflow:hidden}.hover-image__links-container{position:absolute;bottom:0;left:10px;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center}.hover-image__title{color:var(--colour-dark);font-family:var(--font-pixel);padding:2px 4px;background-color:var(--colour-orange);z-index:20;transition:all .1s ease-in-out}.hover-image__title:hover{text-decoration:underline;color:var(--colour-orange-light)}.hover-image__logo{color:var(--colour-orange);font-family:var(--font-pixel);font-size:medium;padding:5px 10px;background-color:var(--colour-dark);z-index:20;height:40px;margin:0 10px}.hover-image{position:absolute;width:45vw;height:45vw;object-fit:cover}.hover-image--hover{position:absolute;opacity:0;transition:opacity .1s ease-in-out;z-index:10}.hover-image--hover:hover{opacity:1}.hover-image--hover:target{opacity:1}@media(min-width:768px){.hover-image-container,.hover-image,.hover-image--hover{width:300px;height:300px}.hover-image__title{color:var(--colour-orange);font-family:var(--font-pixel);padding:5px 10px;background-color:var(--colour-dark);z-index:20}}.tech-label{display:flex;background-color:var(--colour-orange);color:var(--colour-dark);padding:4px 8px;font-size:.875rem;font-weight:500;margin:2px;box-shadow:7px 7px 0 0 var(--colour-orange-dark)}.topic-container{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;margin:20px}.home__techstack{display:flex;flex-wrap:wrap;justify-content:center;margin:20px;font-family:var(--font-mono)}.home__title{font-family:var(--font-pixel);color:var(--colour-orange);font-size:2.5rem;margin:20px}.home__bio{font-family:var(--font-mono);color:var(--colour-orange);font-size:1.125rem;margin:20px}@media(min-width:767px){.topic-container{gap:20px}}.project-card{display:flex;flex-direction:column;padding:10px;border:dashed 8px var(--colour-orange)}.project-card .hover-image{width:100%;height:100%;object-fit:contain}.project-card .hover-image-container{display:flex;flex:1 1 50%;width:100%;max-width:300px;aspect-ratio:1 / 1;overflow:hidden}.project-card__text-container{display:flex;flex-direction:column;height:fit-content}.project-card__description{font-size:smaller}.project-card__image{width:100%;height:auto;object-fit:cover}@media(min-width:786px){.project-card{display:flex;flex-direction:row}.project-card .hover-image{width:100%;height:auto;object-fit:cover}.project-card .hover-image-container{width:50%;height:fit-content;aspect-ratio:1 / 1}.project-card__text-container{width:50%}.project-card__description{font-size:initial}}.projects-section{display:flex;align-items:center;gap:10px}.projects-arrow{display:none;background:none;border:none;color:var(--colour-orange);font-size:2rem;cursor:pointer;padding:5px;flex-shrink:0;line-height:1}.projects-arrow:hover{color:var(--colour-orange-light)}.projects-wrapper{display:flex;gap:20px;width:clamp(300px,70vw,800px);overflow-x:scroll;scroll-snap-type:x mandatory;margin-bottom:20px}.project-card{scroll-snap-align:center;min-width:90%}@media(min-width:768px){.projects-arrow{display:flex}}li{border:2px solid var(--colour-orange)}ul{padding-left:0}article{width:clamp(300px,75vw,800px)}p,h2,h3,h4,h5,small{margin:10px}.header{display:flex;flex-direction:column;width:100vw;background-color:var(--colour-orange);padding:20px;margin-bottom:20px}.header__title-container{margin:0 auto;display:flex;flex-direction:column}.header__title{font-family:var(--font-pixel);color:var(--colour-dark);margin:0;font-size:3.2em}.header__subtitle{font-family:var(--font-mono);color:var(--colour-orange-light);margin:5px 0 0}.header__nav{display:flex;flex-direction:row;gap:15px}.nav__link{font-family:var(--font-mono);color:var(--colour-dark);text-decoration:none}@media(min-width:768px){.header{flex-direction:row;align-items:center;width:75vw;box-shadow:10px 10px 0 0 var(--colour-orange-dark)}.header__nav{margin-left:auto;margin-right:15%;display:flex;flex-direction:column;gap:15px;border-left:var(--colour-orange-dark) 2px solid}.nav__link{margin:0 15px;font-weight:600;transition:all .3s ease}.nav__link:hover{translate:10px 0}}.footer{padding:20px;display:flex;background-color:var(--colour-orange);width:100vw;margin-top:auto}.footer__logo{height:40px;margin:0 10px}.footer__text{margin:0 auto;font-family:var(--font-mono);color:var(--colour-dark)}@media(min-width:768px){.footer{flex-direction:row;align-items:center;width:75vw;box-shadow:10px 10px 0 0 var(--colour-orange-dark)}}