@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{scroll-behavior:smooth;text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.header{align-items:center;background-color:var(--header-background);border-bottom:2px solid var(--primary-colour);display:flex;height:8vh;justify-content:space-between;padding:20px}.logo{font-size:1.5em;font-weight:700}.nav-links{display:flex;gap:20px;list-style:none}.nav-links a{color:var(--header-text-colour);font-size:1em;text-decoration:none}.nav-links a:hover{text-decoration:underline}.header .link{color:var(--header-text-colour);font-size:36px;text-decoration-line:none}.introduction{align-items:center;background-color:initial;box-sizing:border-box;color:#fff;display:flex;flex-direction:column;height:80vh;justify-content:center;min-height:600px;padding:20px;text-align:center;width:100%}.fade-in{animation:fadeIn 2s forwards;opacity:0}@keyframes fadeIn{to{opacity:1}}.introduction img{border-radius:50%;height:auto 200px;max-height:30%;width:auto}.introduction img:hover{transform:scale(1.2);transition:transform .2s ease}.text-container{box-sizing:border-box;margin:0 auto;max-width:1100px;text-align:left;width:auto 100%}.introduction h1{color:#fff;font-size:3rem}.typewriter-line{animation:typing 3s steps(30) forwards,blink .75s infinite;border-right:.15em solid var(--text-primary);display:block;width:0}.introduction p,.typewriter-line{word-wrap:break-word;white-space:normal}.typewriter-line:nth-child(3){animation-delay:3.5s}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink{50%{border-color:#0000}}.introduction h4{font-size:30px;margin:0 auto;text-align:left}.introduction body{align-items:center;display:flex;justify-content:center;margin:0}.skills-body{align-items:center;background-color:initial;background-color:var(--background-primary);border:1px solid var(--primary-colour);box-shadow:0 8px 16px 0 #0003;color:var(--text-primary);margin:40px;max-width:1400px;padding:0;width:95%}.skills-body h1{background-color:var(--primary-colour);margin:0;padding:20px;text-align:center}.skills-body p{color:var(--text-primary)}.skills-container{align-items:center;column-gap:15px;display:flex;flex-wrap:wrap;grid-template-columns:350px 350px 350px;justify-content:center;padding:50px;row-gap:15px}.skill{background:#2a2a2a;border:1px double var(--primary-colour);border-image:linear-gradient(0deg,var(--background-container),var(--border-colour)) 1;display:block;height:500px;width:300px}.skill:hover{background:linear-gradient(to top,var(--background-tertiary),#2a2a2a)}.skill h1{background-color:initial;color:var(--text-primary);font-size:24px;margin-bottom:30px;padding:20px}.skill p{color:#fff;margin:.4em;text-align:center}.skill img{filter:hue-rotate(270deg) saturate(300%);height:80px;padding:15px;width:80px}.portfolio{align-items:center;background-color:initial;background-color:var(--background-primary);background-position:50%;background-repeat:no-repeat;background-size:cover;border:1px solid var(--primary-colour);box-shadow:0 8px 16px 0 #0003;color:var(--text-primary);margin:48px;max-width:1400px;padding:0;width:95%}.portfolio h1{background-color:var(--primary-colour);margin:0;padding:20px;text-align:center}.project-grid{align-items:center;background:var(--background-primary);border-image:linear-gradient(0deg,#212425,#4a5a64) 1;column-gap:15px;display:flex;flex-wrap:wrap;grid-template-columns:350px 350px 350px;justify-content:space-around;padding:50px;row-gap:15px}.thumb{--text-color:var(--text-primary);--transition-time:0.5s;background-color:var(--background-tertiary);border-radius:12px;display:block;flex-shrink:0;height:225px;overflow:hidden;position:relative;transition:.5s;width:300px}.thumb:hover img{opacity:.05}.thumb img{opacity:1;position:a}.thumb h1{background-color:initial;border:none;color:var(--text-primary);font-size:24px;font-weight:180;left:50%;opacity:0;position:absolute;text-align:center;top:20%;transform:translate(-50%,-50%);transition:var(--transition-time);width:85%}.thumb:hover h1{opacity:1}.thumb a{border:solid var(--button-hover);border-radius:50px;border-width:2px;color:var(--text-primary);cursor:pointer;left:50%;opacity:0;padding:10px;position:absolute;top:80%;transform:translate(-50%,-40%);transition:var(--transition-time)}.thumb:hover a{background-color:initial;opacity:1}.thumb:hover a:hover{background-color:var(--button-hover)}.project-tag-container{align-items:center;background-color:initial;column-gap:15px;display:flex;flex-wrap:wrap;height:60px;justify-content:center;opacity:0;overflow:hidden;transform:translateY(-200%);transition:var(--transition-time);width:100%}.thumb:hover .project-tag-container{opacity:1}.tag{color:#fff;display:block;flex-shrink:0;padding:auto;position:relative;transition:var(--transition-time)}.flip-card{background-color:initial;border:1px solid #0000;border-radius:10px;height:200px;perspective:1000px;width:600px}.flip-card-front{background-color:var(--pale-purple);border:5px solid var(--gold);border-radius:10px;color:#000}.flip-card-back{background-color:#000;border-radius:10px;color:#fff}.flip-card-back,.flip-card:hover .flip-card-inner{transform:rotateY(180deg)}.flip-card-inner{height:100%;position:relative;text-align:center;transform-style:preserve-3d;transition:transform .8s;width:100%}.flip-card-back,.flip-card-front{backface-visibility:hidden;height:100%;position:absolute;width:100%}.dropdown-content{background-color:var(--background-secondary);border-radius:8px;box-shadow:0 8px 16px 0 #0003;display:flex;flex-direction:column;line-height:3em;margin-right:auto;max-width:600px;min-height:auto;min-width:300px;padding:20px;position:absolute;transform:translate(-80%);transition:opacity .2s linear;width:100%;z-index:1}.dropdown-content ul{list-style:none}.dropdown-content li{color:#fff;display:inline-block;font-size:clamp(9px,4vw,24px);max-height:60px;white-space:nowrap}body{font-family:Arial,sans-serif;margin:0}.footer{background-color:var(--header-background);border-top:2px solid var(--primary-colour);color:var(--header-text-colour);padding:20px 0;text-align:center}.footer-content{align-items:center;display:flex;flex-direction:column;margin:0 auto;max-width:1000px}.footer nav ul{display:flex;gap:15px;list-style:none;margin:10px 0;padding:0}.footer nav a{color:#fff;font-size:16px;text-decoration:none}.footer nav a:hover{text-decoration:underline}.social-links a{color:#fff;font-size:20px;margin:0 10px}.social-links a:hover{color:#ff4081}.return-to-top-button{background-color:var(--primary-colour);border:2px solid #000;border-radius:10px;cursor:pointer;display:flex;height:100px;justify-items:center;text-decoration:none;transition:background-color .5s;-webkit-user-select:none;user-select:none;width:60px}.return-to-top-button:hover{animation:hop 1s ease infinite;background-color:#000}a:visited{text-decoration:none}.return-to-top-button .text-container{align-self:center;justify-self:center}@keyframes hop{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}.return-to-top-button h3{color:#000;font-size:30px;line-height:.8;text-align:center}.return-to-top-button:hover h3{color:#fff;font-size:30px;line-height:.8;text-align:center}:root{--primary-colour:#397dcc;--secondary-colour:#3a6d7e;--background-primary:#212425;--background-secondary:#35393b;--background-tertiary:#283a4c;--background-container:#4a5a64;--container-colour:#397dcc;--text-primary:#d0d8df;--text-secondary:#a0aab4;--border-colour:#b0b8c2;--button-background:#ff5722;--button-hover:#bc6d3b;--link-colour:#4a90e2;--link-hover:#ff5722;--header-background:#15191d;--header-text-colour:#d0d8df}*{font-family:Montserrat,sans-serif}body{overflow-x:hidden}.background{background-image:url(/static/media/backgroundV2.f658af8e3042ed143874.png);background-repeat:repeat;margin-top:"40px"}.page-centered{background-color:var(--background-tertiary)}.content-container{background-color:var(--background-primary);border-radius:8px;box-shadow:0 0 10px #0000001a;color:var(--text-primary);display:flex;flex-direction:column;margin-bottom:48px;margin-top:auto 48px;max-width:800px;padding:20px;width:80%}.content-container img{height:auto;max-height:1000px;object-fit:contain;overflow:clip;width:100%}.content-container h2{margin-top:70px}.table-of-contents{position:sticky;top:50px}.toc-toggle{align-items:center;background-color:var(--background-secondary);border:1px inset var(--border-colour);border-radius:40px;cursor:pointer;display:flex;justify-content:center;margin:6px;padding:10px;position:sticky;top:40px;transition:background-color .3s ease,border-color .3s ease}.toc-toggle:hover{background-color:#fff}.toc-toggle svg{stroke:#fff;height:36px;transition:stroke .3s ease;width:36px}.toc-toggle:hover svg{stroke:var(--primary-colour)}.toc-container{background-color:var(--background-primary);border:2px solid var(--primary-colour);border-radius:4px;color:var(--text-primary);height:auto;margin-left:70px;position:fixed;scroll-behavior:smooth;text-decoration:none;top:20px;width:300px;z-index:1000}.toc-header{align-items:center;background-color:var(--primary-colour);border-bottom:1px solid var(--background-secondary);display:flex;justify-content:space-between;line-height:1;padding:10px}.toc-header p{cursor:pointer;margin-left:50px;padding:0}.toc-header p:hover{color:#fff}.toc-list ul{margin-left:0;margin-right:0;padding:0}.toc-list li,.toc-list ul{list-style-type:none}.table-of-contents-container a:visited{color:#fff}.toc-index{border-radius:5px;padding:.3em}.toc-index:hover{background-color:var(--background-tertiary);cursor:pointer;padding:.3em}.toc-index a:before{color:var(--text-primary);content:attr(data-index) " - ";font-weight:700;margin-right:5px}
/*# sourceMappingURL=main.4eb64734.css.map*/