#root{margin:0}:root{--background-color: #f4f6ef;--text-color: #1f1f1f;--border-bottom: 1px solid #1f1f1f;--blue: #b7cece;--features-background: #ebebeb;--invert: invert(0)}:root[data-theme=dark]{--background-color: #1f1f1f;--features-background: #3e3e3e;--text-color: #ffffff;--border-bottom: 1px solid white;--invert: invert(1)}header{min-width:100svw;display:flex;box-sizing:border-box;padding:20px;height:10svh}.onav{display:flex;flex-direction:column;justify-content:center;height:100vh;background-color:#1f1f1f;color:#fff;position:fixed;z-index:101;right:0;width:0%;transition:all 1s;font-size:3rem}.onav img{display:none}.onav.open{width:100%}.onav.open a{color:#fff}.onav.open a:hover,a:active{color:#b7cece}.onav.open img{display:block;position:absolute;top:0;right:10px;padding:20px;filter:invert(1)}.menu.open{z-index:1000;filter:invert(1)}.menu,.md-tgl{filter:var(--invert);order:3;z-index:104}.fullstack-developer-name{font-size:1rem;align-self:center;min-width:20%}.navbar{width:100%;display:flex;justify-content:flex-end;padding:20px;height:10svh;transition:all 4s;align-self:center}.nav-items.mobile{display:none;transition:all 2s}.tgl-drk-btn{font-size:1.3rem;display:flex;justify-items:center}.nav-items.mobile.open{display:block;transition:all 1.5s}.heade{transition:all 1.5s}.heade.open{height:13svh;transition:all 1.5s}.menu,.md-tgl,.tgl-frk-btn{align-self:center;transition:all 1s}.md-tgl{height:30px;width:30px;align-self:center}.md-tgl{transform:scale(.9);scale:.9}.nav-items{display:flex;align-self:center;gap:2rem;padding-left:10px;list-style:none}.nav-items li{cursor:pointer;padding:4px;transition:all 1s;word-spacing:3px}.nav-items a{color:var(--text-color);font-weight:500}.nav-items li:hover a{color:var(--background-color)}.nav-items li:hover{background-color:#b7cece}.emphasis{background-color:var(--blue);transition:all 1s}.hero-section{padding:3rem}.introduction{font-size:4rem}.skills{display:flex;padding:0 3rem;justify-content:flex-end;font-size:2.5rem;gap:.5rem}.hero-text{padding:3rem;box-sizing:border-box}.hero-projects-link{padding:0 3rem;text-decoration:underline 8px solid var(--blue);font-size:2rem}@media screen and (max-width: 768px){.hero-section{padding:0rem}.introduction{font-size:3.5rem}.hero-projects-link{padding:1rem}.hero-text{padding:0rem}.skills{margin-top:1rem;margin-bottom:1rem}}.projects{position:relative;padding:1rem;padding-bottom:0}.projects-links{display:flex;gap:1rem;align-items:center}.project-link.github{font-size:1.2rem}.up{position:fixed;bottom:10px;right:10px;cursor:pointer;padding:10px;background-color:#b7cece;z-index:100}.up a{color:#f1f1f1;transition:all .1s}.up a:hover{font-size:1.3rem;color:#f1f1f1}.contact-title{color:var(--background-color);padding:1rem}.key-features li{font-family:general sans;background-color:var(--features-background);border-radius:22px;padding:1rem}.key-features{display:flex;flex-direction:column;gap:1rem;list-style:none;padding-left:0}.features,.key h2{opacity:0}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}.see-more{background-color:#1f1f1f;color:#f1f1f1;padding:2px;height:30px}.project-number{font-size:1rem}.stack{display:flex;list-style:none;gap:10px;padding-left:0;flex-direction:row}.site-link{background-color:var(--background-color);padding:4px;color:#b7cece}@keyframes slide-up{0%{transform:translateY(30%)}to{transform:translateY(0)}}@keyframes slide-left{0%{transform:translate(-3%)}to{transform:translate(0)}}@keyframes text-up{0%{height:20px}to{height:55px}}.project-link{animation-play-state:paused;animation:slide-left 2s linear;opacity:0;transition:opacity 1s ease-in;filter:blur(100%)}.stack{opacity:0}.stack li{border:var(--border-bottom);padding:4px}.sticky-header{position:sticky;top:10px}.project-description{color:var(--text-color);flex:1;padding:2rem;border-right:var(--border-bottom);animation:3s linear slide-left;animation-timing-function:ease-in-out;animation-play-state:paused;opacity:0;transition:opacity 1s ease-in}#project-2 .project-description,#project-5 .project-description{border-left:var(--border-bottom);border-right:0px}.project-explaination{font-size:1.1rem;color:var(--text-color);font-family:general sans;transition:opacity 1s ease-in;animation:slide-left 1.5s linear;animation-play-state:paused;opacity:0}.project{display:flex;padding:1rem;min-height:100svh;align-items:center;border-bottom:var(--border-bottom)}.project-title{text-decoration:underline 6px #ca212a;animation:slide-left 1s;animation-fill-mode:forwards;overflow-y:hidden;animation-play-state:paused;opacity:0;transition:opacity 1s ease-in}#project-2 .project-title{text-decoration:underline 6px #388ad2}#project-3 .project-title{text-decoration:underline 6px var(--text-color)}#project-4 .project-title{text-decoration:underline 6px #8dc572}#project-5 .project-title{text-decoration:underline 6px #4c7766}#project-4 .project-title:hover{height:100%}#project-2 .project-img-cnt,#project-5 .project-img-cnt{padding-right:2rem;padding-left:0}.project-img-cnt{flex:1;max-width:100%;height:100%;position:sticky;top:50px;align-self:center;padding-left:2rem;transition:all 2s;z-index:1000}.project-img{max-width:100%;transition:all 1s;border:var(--border-bottom);min-height:100%;transform:scale(1.6);transition:transform 2s ease-in-out}#project-img-4{border:none}.project-imgs-cnt{max-height:100%;display:grid;grid-template-areas:"main";grid-template-columns:1fr;grid-template-rows:1fr;align-items:center;justify-content:center;justify-items:center;flex:1}.project-imgs-cnt .project-img{max-width:unset}.proj-img-1{z-index:2}.project-imgs-cnt:hover .proj-img-2{margin-left:55%}.proj-img-2{margin-left:20%}.proj-img-3{margin-right:20%}.wrap{height:100svh;position:relative;display:flex;justify-content:space-between;transition:all 1s ease;padding:1rem;max-width:100svw}.zoom{position:sticky;top:4rem;object-fit:cover;height:50%}.zoom img{object-fit:cover}.zoom-text{position:sticky;top:0;color:#fff;display:flex;flex-direction:column}.zoom-text h1 span{font-family:Zodiak;font-weight:900;font-style:italic;background-color:#b7cece}.zoom-text p{color:#fffc}.project-imgs-cnt:hover .proj-img-3{margin-right:55%}.project-imgs-cnt:hover .proj-img-1{margin-bottom:5%}.project-imgs-cnt .project-img{border:none}.proj-img-1,.proj-img-3,.proj-img-2{height:500px;grid-area:main;transition:all 1.5s ease-in-out;border:none}.proj-img-1 .project-img,.proj-img-2 .project-img,.proj-img-3 .project-img{height:100%}@keyframes colorchange{0%{color:#388ad2}to{color:var(--background-color)}}.ime{animation:colorchange 2s infinite;transition:ease}.project-img-cnt{display:grid;grid-template-areas:"main";grid-template-columns:1fr;grid-template-rows:1fr;align-items:center;justify-content:center;justify-items:center}.project-img-cnt:hover .proj-img2{margin-bottom:70%}.project-img-cnt:hover .proj-img3{margin-top:70%}.project-img-cnt:hover .proj-img1{width:96%}.proj-img1 img{box-shadow:0 0 5px 2px #0003;object-fit:cover}.proj-img1,.proj-img2,.proj-img3{transition:transform .3s ease-in-out}.proj-img1{grid-area:main;z-index:2;width:100%}.proj-img2{grid-area:main;transition:all 2s ease;width:95%;margin-bottom:10%}.proj-img3{grid-area:main;width:95%;margin-top:10%;transition:all 2s ease}#project-4 .project-img-cnt:hover .proj-img2{margin-bottom:50%}#project-4 .project-img-cnt:hover .proj-img3{margin-top:50%}.stack li{border-radius:6px;border:0px;text-decoration:underline 6px #b7cece}@media screen and (max-width: 992px){body{overflow-x:hidden}.key-features{font-size:1.1rem}.proj-img-2{margin-left:40%}.proj-img-3{margin-right:40%}.introduction{flex:auto;flex-direction:column;max-width:100svw;align-items:baseline;height:auto;padding:1rem}.md-tgl{height:30px;width:30px}.Skills{max-width:100%;font-size:3rem}.scroll-hint{position:relative;align-self:baseline;border-bottom:var(--border-bottom)}.nav-items{padding-left:0}.wrap{flex-direction:column;height:auto;box-sizing:border-box}.zoom{transform:rotate(90deg) scale(1)!important;position:unset;align-self:center;width:50%}.zoom-text{border-bottom:1px solid white}.zoom h1{font-size:2em}.project-description{border:0px!important;padding:.5rem;animation:none!important;height:10svh;order:2}.project-explaination,.project-title,.project-link{animation:none!important}.stack{flex-wrap:wrap}.navbar{padding:0}.nav-items{text-wrap:nowrap;text-align:center;align-items:center}.techstack{padding:1.5rem;height:unset;align-items:baseline;gap:1rem}.techstack ul{display:flex;flex-direction:row;gap:6px;flex-wrap:wrap;width:auto;padding:.8rem}.projects{display:flex;flex-direction:column;width:100svw;padding-left:0}.tag{padding:1.5rem}.project{display:flex;max-width:100svw;flex-direction:column}.project-img-cnt{position:relative;top:0;padding-right:0!important;padding-left:0!important;order:1;margin-bottom:2rem}#project-4 .project-img-cnt{top:60px;margin-bottom:8rem}#project-4 .project-img-cnt:hover{margin-top:0rem;margin-bottom:2rem;top:30px}.project-img{position:relative;top:0}.contact-details{flex-direction:column;gap:4px;padding-left:0}.contact-detail{margin:0;text-align:center}.contact-detail a{font-size:1.2rem}.about-title{text-align:center!important;padding-bottom:0!important;line-height:.9em}.about-text{padding-top:0!important;padding:1rem!important}.nav-items li{word-spacing:.3px}.Skills li{word-spacing:1px}#work-title{text-align:center!important;margin-bottom:1rem}.skill-text{display:none}}.contact{height:auto;background-color:var(--text-color);color:var(--background-color);max-width:100svw}.contact-details{display:flex;padding:1rem;gap:4px;align-items:center}.contact-detail{border:var(--border-bottom);color:var(--text-color);background-color:var(--background-color);text-align:center;padding:1px}.contact-detail a{color:var(--text-color)}.about{width:100svw;border-bottom:var(--border-bottom)}#work-title{text-align:right}footer{margin:0}.emph{background-color:#8dc572;color:var(--text-color);padding:4px}footer p{margin:0;padding:.3rem;font-size:.7rem;margin-left:.2rem;font-family:general sans}.linked{background-color:var(--background-color);padding:2px 2px 0;border-radius:6px;align-items:center}.about-title{padding:2rem}.about-text{padding:2rem;font-family:general sans}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;overflow-x:hidden;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{scroll-behavior:smooth}a{font-weight:500;color:var(--text-color);text-decoration:inherit}a:hover{color:#b7cece}body{margin:0;display:flex;font-family:clash display;color:var(--text-color);background-color:var(--background-color);transition:background-color .9s;scroll-behavior:smooth;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;color:var(--text-color);margin:0}button{border:1px solid transparent;font-size:1em;font-weight:500;font-family:inherit;align-self:center;background-color:var(--background-color);cursor:pointer;transition:border-color .25s}h5{font-size:1rem}:root{color:#213547;background-color:#fafaf9}button{background-color:var(--background-color);color:var(--text-color);text-align:center}ul{list-style:none}