: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:#2d2d2d;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:#fcfcfc;text-decoration:inherit}a:hover{color:#88c5ff}body{margin:0;display:flex;place-items:center}h1{font-size:3.2em;line-height:1.1}@media (prefers-color-scheme: light){:root{color:#fcfcfc;background-color:#2d2d2d}a:hover{color:#88c5ff}button{background-color:#fcfcfc}}.navbar{position:sticky;display:flex;justify-content:space-between;align-items:center;position:relative;padding:0 0 2rem;z-index:999}.navbar .logo{height:2rem;display:block}.navbar .nav-menu{display:flex;-moz-column-gap:3rem;column-gap:3rem;list-style:none}.navbar .nav-menu li .nav-link{font-weight:400;font-size:16px;color:#fcfcfc;text-decoration:none;position:relative;transition:color .3s,font-weight .3s}.navbar .nav-menu li .nav-link:hover{color:#88c5ff}.navbar .nav-menu li .nav-link:hover:after{width:100%}.navbar .nav-menu li .nav-link:after{content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;background-color:#88c5ff;transition:width .3s ease-in-out}.navbar .nav-menu li .nav-link.active{color:#88c5ff;font-weight:600}.navbar .nav-menu li .nav-link.active:after{width:100%}.navbar .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer}.navbar .hamburger span{height:3px;width:25px;background-color:#fcfcfc;border-radius:2px;transition:all .3s ease}.navbar .hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}.navbar .hamburger.open span:nth-child(2){opacity:0}.navbar .hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-6px)}@media screen and (max-width: 850px){.navbar .nav-menu{position:absolute;top:50px;right:0;flex-direction:column;background-color:#111;width:-moz-max-content;width:max-content;border-radius:10px;box-shadow:0 4px 6px #0000004d;overflow:hidden;max-height:0;transition:.3s ease-in-out;row-gap:1rem;padding:0 1rem}.navbar .nav-menu.open{max-height:500px;padding:1rem}.navbar .hamburger{display:flex}}.pictextbuttons{width:100%;display:flex;flex-flow:row wrap;-moz-column-gap:8%;column-gap:8%;justify-content:center;align-items:center;text-align:start;padding:4rem 0}.pictextbuttons .homepage-img{width:35%;min-width:300px}.pictextbuttons .contents-textbuttons{width:47%}.pictextbuttons h1{color:#88c5ff;font-size:63px}.pictextbuttons p{font-size:20px}.pictextbuttons .button-stack{display:flex;flex-flow:row wrap;gap:2rem;padding:1rem 0}.pictextbuttons .button-stack a{font-weight:700;text-decoration:none}.pictextbuttons .button-stack button{border-radius:50px;font-size:16px;font-weight:700;padding:.8rem 2rem;cursor:pointer;transition:all .3s ease;width:13rem}.pictextbuttons .button-stack button.outline{background-color:transparent;border:3px solid #fcfcfc;color:#fcfcfc}.pictextbuttons .button-stack button.outline:hover{background-color:#ffffff1a}.pictextbuttons .button-stack button.filled{background-color:#fcfcfc;border:none;color:#3692e8}.pictextbuttons .button-stack button.filled:hover{color:#ffb067}@media screen and (max-width: 850px){.pictextbuttons .homepage-img{width:80%}.pictextbuttons .contents-textbuttons,.pictextbuttons .contents-textbuttons.right{width:100%;text-align:center}.pictextbuttons h1{font-size:40px}.pictextbuttons .button-stack,.pictextbuttons .button-stack.right{justify-content:center}}.back-to-top-button{position:fixed;display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;bottom:2rem;right:0;color:#fcfcfc;font-weight:600;background-color:transparent;border:none;font-size:20px;-moz-column-gap:5px;column-gap:5px;cursor:pointer;transition:.3s ease-in-out;opacity:0;transition:opacity .2s ease-in-out}.back-to-top-wrapper{position:fixed;bottom:0;left:0;width:100%;height:7rem;pointer-events:none;background:linear-gradient(to top,#88c5ff80,#88c5ff66 10%,#88c5ff33 30%,#88c5ff0d 60%,#88c5ff00 80%);display:flex;justify-content:center;align-items:flex-end;opacity:0;transition:opacity .2s ease-in-out}.visible{opacity:1}.bounce-icon{animation:bounceUpDown 1s infinite}@keyframes bounceUpDown{0%,to{transform:translateY(1px)}50%{transform:translateY(-3px)}}.projects-list{display:flex;flex-direction:column;row-gap:3rem;padding:3rem 0}.screenshot{width:40%}.contents-textbuttons.right{text-align:end}.button-stack.right{justify-content:end}@media screen and (max-width: 850px){.screenshot{width:90%}.pictextbuttons{padding:1rem 0}.pictextbuttons .screenshot.right{order:2}.pictextbuttons .contents-textbuttons.right{order:1}}.experiences-page{display:flex;position:relative;width:100%;padding:4rem 0;align-items:center;justify-content:center}.experiences-page .subtitle{font-weight:600;color:#ffb067}.experiences-page .timeline{position:relative;width:100%;justify-content:center}.experiences-page .timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;background:#88c5ff}.experiences-page .timeline-entry{width:45%;position:relative}.experiences-page .timeline-entry p{padding:0 1rem}.experiences-page .timeline-entry h1{padding:1rem;color:#88c5ff;font-size:40px}.experiences-page .timeline-entry p{font-size:18px}.experiences-page .timeline-entry.left{text-align:right}.experiences-page .timeline-entry.right{text-align:left;margin-left:55%}@media screen and (max-width: 850px){.experiences-page{padding:0 0 2rem}.experiences-page .timeline:before{width:0}.experiences-page .timeline-entry{width:100%}.experiences-page .timeline-entry.left,.experiences-page .timeline-entry.right{text-align:center;margin:0}}.contact-page{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5rem 0}.contact-page .contact-content{width:70%}.contact-page h1{font-size:65px;color:#88c5ff}.contact-page p{font-size:20px}.contact-page .contact-buttons{padding:2rem;display:flex;flex-flow:row wrap;align-items:center;justify-content:center;max-width:55rem;gap:2.5rem}.contact-page img{width:25px}.contact-page button{border-radius:50px;font-size:18px;font-weight:600;width:15rem;padding:1rem 2rem;cursor:pointer;transition:all .3s ease;background-color:transparent;color:#fcfcfc;display:flex;flex-direction:row;align-items:center;justify-content:center;-moz-column-gap:5px;column-gap:5px}.contact-page button:hover{background-color:#ffffff1a}.contact-page .blue{border:2px solid #88c5ff}.contact-page .orange{border:2px solid #ffb067}@media screen and (max-width: 850px){.contact-page h1{font-size:55px}.contact-page .contact-content{width:90%}}#root{width:100vw;padding:6rem 8rem;text-align:center}@media screen and (max-width: 850px){#root{padding:4rem 10%}}