:root{font-family:Inter,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}body{margin:0}#app-container{display:flex;justify-content:center;align-items:center;flex-direction:column}input:focus,label:focus,a:focus,select:focus,button:focus,textarea:focus{outline:2px dashed rgb(224,223,223)}.project-title-anchor:focus{outline-offset:2px}.show-hide-button:focus{outline-offset:3px;opacity:1;z-index:900}.hamburger:focus{outline-offset:12px}#menu-toggle{display:none}.hamburger{display:flex;flex-direction:column;gap:5px;cursor:pointer;position:fixed;top:30px;right:20px;z-index:1000}.hamburger span{display:block;width:30px;height:4px;background:#fff;border-radius:5px;transition:.4s}#menu-toggle:checked~.hamburger span:nth-child(1){transform:rotate(47deg) translate(4px,4px)}#menu-toggle:checked~.hamburger span:nth-child(2){opacity:0}#menu-toggle:checked~.hamburger span:nth-child(3){transform:rotate(-45deg) translate(8px,-9px)}#menu-toggle:checked~#navbar{right:0;visibility:visible}#navbar{position:fixed;display:flex;flex-direction:row;justify-content:left;gap:25px;margin:0;top:0;right:-100%;visibility:hidden;z-index:999;background-color:#000;width:100%;transition:.4s}.nav-link{display:block;color:#fff;text-decoration:none;font-size:1.3rem;padding:25px;transition:.3s}.nav-link:hover{background-color:#fff;color:#000}html{scroll-behavior:smooth;scroll-padding-top:6.25rem}@media screen and (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}#header{display:flex;flex-direction:column;padding-block-start:5rem;padding-inline:1.25rem}#intro{display:flex;flex-direction:column}#intro-title{font-size:6rem;margin:0}#intro-text{font-size:2rem}#intro-link{background-color:#f0f8ff;text-decoration:none;color:#000;border-radius:5px;padding:10px 20px;font-size:1rem;width:13rem}.arrow-icon{padding-left:8px}hr.rounded{width:100%;border-top:8px solid rgb(224,223,223);border-radius:5px;margin-block:3rem}#skills-title{font-size:4rem;margin-block:0 1rem}.skills-list{display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;column-gap:288px;row-gap:20px}.skill-item{display:flex;flex-direction:column;align-items:center;text-align:center}.skill-item img{width:12.5rem;height:12.5rem}.skill-item p{font-size:3rem;margin:0;color:#fff}#project-grid-heading{width:70vw}#project-section-title{font-size:4rem;margin-block:1rem}#project-heading-text{margin-block-start:0}#select-menu-container{font-size:1.25rem;margin-bottom:3rem}#order-select{background-color:#000;color:#fff;font-size:1rem}#project-grid{display:grid;justify-content:center;grid-template-columns:70vw;grid-auto-rows:43.75rem;row-gap:100px}.project-grid-reversed{animation:fadein 1s linear}.project-tile,.project-tile-hidden{display:flex;flex-direction:column;justify-content:center;width:100%;gap:0;margin:0;border:3px solid gray}.project-tile{height:43.75rem}.project-tile-hidden{height:30.625rem}.image-and-list-container{display:flex;flex-direction:row;height:24.0625rem}.project-image{display:flex;width:50%;height:100%}.list-container{display:flex;align-items:center;justify-content:center;height:100%;font-size:1rem;padding-inline-end:1%;background-color:#383041;color:#d3d3d3;box-sizing:border-box;overflow:auto}.list-item{margin-block-end:.5rem}.show-hide-button{width:100%}.hover-underline-animation{display:inline-block;position:relative}.hover-underline-animation:after{content:"";position:absolute;width:100%;transform:scaleX(0);height:2px;bottom:0;left:0;background-color:#fff;transition:transform .5s ease-out;transform-origin:bottom right}.project-title-anchor:hover .hover-underline-animation:after{transform:scaleX(1);transform-origin:bottom left}.project-title{display:flex;justify-content:center;align-items:center;margin-top:0;margin-bottom:0;margin-left:2px;width:calc(100% - 4px);outline:2px solid white;font-size:1.75rem;background-color:#000;color:#fff;height:4.375rem}a{text-decoration:none}.show-hide-button{text-align:left;color:#fff;background-color:#343a46;border:2px solid white;opacity:.5;cursor:pointer;height:2.1875rem}@keyframes fadein{0%{opacity:0}to{opacity:1}}.project-description{height:13.125rem;margin:0;border:2px solid white;font-size:.875rem;white-space:pre-line;overflow:auto;box-sizing:border-box;padding:3%;text-align:justify;background-color:#000;animation:fadein 1s linear}.project-description-hidden{height:0;visibility:hidden;overflow:hidden}#footer{display:flex;flex-direction:column;width:70vw}#footer-title{font-size:4rem;margin-block:25px}#footer-text{font-size:2rem;margin-block:0 25px}#contact-form{display:flex;flex-direction:column;padding-block-end:50px}.form-elements{background-color:#3c3c3c;color:#fff;border:2px solid rgb(133,133,133)}#email-error-container{margin-block:5px}.arrow-up{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #ee4540;margin-inline-start:5px}#email-error{background:#ee4540;margin-block:0;padding-inline-start:5px}input:focus:invalid,textarea:focus:invalid,.invalid-input:focus{outline:2px dashed rgb(192,17,17)}#submit-button{font-size:1rem;cursor:pointer;margin-block-start:10px}@media screen and (max-width: 80.938rem){.skills-list{column-gap:200px}}@media screen and (max-width: 65.625rem){#skills-title{text-align:center}.skill-item p{font-size:2rem}#project-grid-heading{width:90vw}#project-grid{grid-template-columns:90vw;grid-auto-rows:56.25rem}.project-tile{height:56.25rem}.project-tile-hidden{height:43.125rem}.image-and-list-container{flex-direction:column;height:36.5625rem}.project-image{width:100%;height:50%}.list-container{height:50%}#footer{width:90vw}}@media screen and (max-width: 56.25rem){#intro-title{font-size:4rem}#intro-text{font-size:1.5rem}#footer-title{font-size:3rem;margin-block:0 25px}#footer-text{font-size:1.5rem}}@media screen and (max-width: 50rem){#navbar{justify-content:center}.list-container{padding-inline-end:2%}#footer-title{font-size:2.5rem}}@media screen and (max-width: 37.5rem){html{scroll-padding-top:9.375rem}.hamburger{top:20px}.hamburger span{outline:1px solid black}#navbar{flex-direction:column;gap:5%}.nav-link{text-align:center;font-size:1rem;padding:10px 0;border:1px solid white}#header{padding-block-start:8rem}#intro{align-items:center;text-align:center}#skills-title{font-size:3rem}.skills-list{flex-direction:column;align-items:center}#project-section-title{font-size:3rem}.list-container{align-items:flex-start}.project-title{font-size:1.25rem}#footer-title{font-size:2rem}#footer-text{font-size:1rem}}