@import"https://fonts.googleapis.com/css2?family=Fuzzy+Bubbles:wght@400;700&family=Roboto+Slab:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";:root{--color-background: #f2f2f2;--color-navigation-background: #cdcecfc2;--color-text: #0f0f0f;--color-text-invert: #f2f2f2;--color-text-muted: #757575;--color-text-deep-muted: #939393;--color-text-muted-subtitle: #9e8d8a;--color-accent: rgba(19, 81, 221, 1);--color-accent-muted: rgba(25, 86, 229, .725);--color-accent-hover: rgb(19, 55, 140);--color-radial-gradient-1: rgba(19, 81, 221, .5);--color-radial-gradient-2: rgba(0, 255, 0, .5);--color-radial-gradient-3: rgba(255, 0, 0, .5);--color-picture-blob-1: rgba(19, 81, 221, 1);--color-picture-blob-2: rgba(21, 228, 146, 1);--color-background-blur: rgba(110, 113, 114, .096);--color-background-skill: rgba(171, 172, 178, .192)}[data-theme=dark]{--color-background: #03121f;--color-navigation-background: #303f4cae;--color-text: #f2f2f2;--color-text-invert: #0f0f0f;--color-text-muted: #8f8e8e;--color-text-deep-muted: #4f5153;--color-text-muted-subtitle: #7a7474;--color-accent: rgba(19, 81, 221, 1);--color-accent-muted: rgba(25, 86, 229, .725);--color-accent-hover: rgb(19, 55, 140);--color-radial-gradient-1: rgba(19, 81, 221, .25);--color-radial-gradient-2: rgba(21, 228, 146, .35);--color-radial-gradient-3: rgba(204, 22, 22, .45);--color-picture-blob-1: rgba(19, 81, 221, 1);--color-picture-blob-2: rgba(21, 228, 146, 1);--color-background-blur: rgba(185, 190, 193, .08);--color-background-skill: rgba(185, 190, 193, .143)}html{scroll-behavior:smooth}body{margin:0;font-family:Roboto Slab,sans-serif;font-weight:400;font-style:normal;scroll-behavior:smooth;transition:background-color .1s ease;color:var(--color-text);background:radial-gradient(circle at -20% 10%,var(--color-radial-gradient-1),transparent 50%),radial-gradient(circle at 130% 30%,var(--color-radial-gradient-2),transparent 40%),radial-gradient(circle at -10% 80%,var(--color-radial-gradient-3),transparent 40%);background-color:var(--color-background);transition:background-color .2s ease-in-out}footer{box-sizing:border-box;width:100%;padding:1rem 2rem;margin-top:5rem}footer .footer-title{text-align:center;margin-bottom:.5rem}footer .footer-title .footer-logo{font-family:Courier New,Courier,monospace;font-size:2.5rem;text-decoration:none}footer .footer-title .footer-logo .footer-logo-center{color:var(--color-text-muted)}footer .footer-title .footer-logo .footer-logo-around{color:var(--color-accent-muted)}footer .footer-copyright{text-align:center;color:var(--color-text-muted)}.header-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:fixed;top:0;box-sizing:border-box;width:100%;padding:.25rem 1rem;z-index:12;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);transition:top .15s ease-in-out}.header-container.header-hide{top:-72px}.header-container .header-logo{font-family:Courier New,Courier,monospace;font-size:3.5rem;text-decoration:none;color:var(--color-text)}.header-container .header-logo .header-logo-around{color:var(--color-accent)}.theme-switch-container .theme-switch{cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .2s ease}.theme-switch-container .theme-switch:hover{transform:scale(1.1)}.theme-switch-container .theme-switch:hover svg{color:var(--color-accent)}.theme-switch-container .theme-switch:active{transform:scale(.9)}.home-container{display:flex;flex-direction:column}.home-container #home-content{height:calc(100vh - 72px);margin-top:10rem}.home-container #home-content .home-top-container{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%}.home-container #home-content .home-top-container .home-picture-container{width:500px}.home-container #home-content .home-top-container .home-picture-container .home-picture-blob{position:relative}.home-container #home-content .home-top-container .home-picture-container .home-picture-blob .home-picture-text{font-family:Fuzzy Bubbles,sans-serif;position:absolute;top:25%;left:50%;rotate:20deg;color:var(--color-text-invert);font-weight:700;font-size:1.2rem}.home-container #home-content .home-top-container .home-picture-container .home-picture-blob .home-picture-text-arrow{rotate:120deg;width:60px}.home-container #home-content .home-top-container .home-welcome{display:flex;flex-direction:column;justify-content:center}.home-container #home-content .home-top-container .home-welcome .home-welcome-1{font-family:Fuzzy Bubbles,sans-serif;font-weight:400;font-style:italic;font-size:3.5rem}.home-container #home-content .home-top-container .home-welcome .home-welcome-name{margin-left:1ch;font-size:4.5rem}.home-container #home-content .home-top-container .home-welcome .home-welcome-sub{margin-left:4ch;font-size:1.9rem}.home-container #home-content .home-top-container .home-welcome .home-welcome-sub u{text-decoration-color:var(--color-accent)}@media screen and (max-width: 1100px){.home-container #home-content .home-top-container .home-welcome .home-welcome-1{font-size:2.5rem}.home-container #home-content .home-top-container .home-welcome .home-welcome-name{font-size:3.25rem}}@media screen and (max-width: 900px){.home-container #home-content .home-top-container .home-picture-container{width:400px}.home-container #home-content .home-top-container .home-welcome-1{font-size:2rem}.home-container #home-content .home-top-container .home-welcome-name{font-size:2.5rem}}@media screen and (max-width: 800px){.home-container #home-content .home-top-container .home-picture-container{width:300px}.home-container #home-content .home-top-container .home-welcome-1{font-size:1.5rem}.home-container #home-content .home-top-container .home-welcome-name{font-size:2.5rem}}@media screen and (max-width: 400px){.home-container #home-content .home-top-container .home-picture-container{width:250px}.home-container #home-content .home-top-container .home-welcome .home-welcome-name{font-size:2.5rem}}.home-container #home-content #links{display:flex;justify-content:center;margin-top:2rem}.home-container #home-content #links ul{display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;list-style:none;gap:3rem;padding:0}.home-container #home-content #links ul li{display:flex;flex-direction:column;justify-content:center;width:110px;height:100px;list-style:none}.home-container #home-content #links ul li a{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--color-text);background-color:var(--color-background-blur);-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);padding:.5rem;border:2px solid transparent;border-radius:10px;transition:all .1s ease;text-decoration:none;white-space:nowrap}.home-container #home-content #links ul li a .clicked-link{background-color:red!important}.home-container #home-content #links ul li a:hover{border:2px solid var(--color-accent);color:var(--color-accent)}.home-container #home-content #links ul li a:hover svg{fill:var(--color-accent);color:var(--color-accent)}.home-container #home-content #links ul li a svg{transition:all .1s ease;width:60px;height:60px;fill:var(--color-text);color:var(--color-text)}@media (max-width: 299px) and (max-height: 769px),(max-width: 339px) and (max-height: 679px),(max-width: 439px) and (max-height: 739px),(max-width: 814px) and (max-height: 799px),(max-width: 959px) and (max-height: 799px){.home-container #scroll-down-container{display:none}}.home-container #scroll-down-container{position:absolute;bottom:10px;left:50%;translate:-50%}.home-container #scroll-down-container:hover a{color:var(--color-text-muted)}.home-container #scroll-down-container a{display:flex;flex-direction:column;align-items:center;gap:.75rem;text-decoration:none;color:var(--color-text-deep-muted);font-weight:700;transition:color .1s ease}.home-container #scroll-down-container a svg{width:40px;height:40px;animation:moveUpDown 1.2s infinite ease-out}@keyframes moveUpDown{0%{transform:translateY(0)}50%{transform:translateY(7px)}to{transform:translateY(0)}}@media screen and (max-width: 310px){.home-container .home-welcome-sub{font-size:1.5rem!important}}@media screen and (max-width: 280px){.home-container .home-welcome-name{font-size:2rem!important}.home-container .home-welcome-sub{font-size:1.3rem!important}}@media screen and (max-width: 700px){.home-container #home-content{margin-top:5rem}.home-container #home-content .home-top-container{flex-direction:column!important}.home-container .home-welcome{align-items:center}.home-container .home-welcome .home-welcome-name{margin-left:0ch!important}.home-container .home-welcome .home-welcome-sub{margin:0ch!important}.home-container #links ul{gap:1rem!important;row-gap:1.5rem!important}.home-container #links ul li{width:70px!important;height:70px!important}.home-container #links ul li a{font-size:.8rem}.home-container #links ul li a svg{width:35px!important;height:40px!important}}.home-container #about{margin:1rem;margin-top:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.home-container #about h2,.home-container #about h3{text-align:center}.home-container #about h2{margin-bottom:2rem;font-size:3rem}.home-container #about h3{margin-bottom:3rem;font-size:2rem}.home-container #about .about-container{border-radius:10px;padding:1rem 0;max-width:800px}.home-container #about .about-container.blur-container{background-color:var(--color-background-blur);-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px)}.home-container #about .about-container.skills-container h3{margin-bottom:1rem;font-size:2.5rem}.home-container #about .about-container.skills-container .skill-subtitle-container{display:flex;justify-content:center}.home-container #about .about-container.skills-container .skill-subtitle-container .skill-subtitle-text{margin-bottom:2rem;color:var(--color-text-muted-subtitle)}.home-container #about .about-container.skills-container ul{display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;list-style:none;gap:2rem;padding:0}.home-container #about .about-container.skills-container ul li{width:110px;height:110px;-webkit-user-select:none;user-select:none;position:relative}.home-container #about .about-container.skills-container ul li .skill-inner-container{cursor:pointer;box-sizing:border-box;padding:1rem;border-radius:8px;background-color:var(--color-background-skill);-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;width:110px;height:110px;z-index:990;transition:transform .4s ease,top .4s ease,left .4s ease,width .4s ease,height .4s ease,border .2s ease-in-out;position:relative;transform-style:preserve-3d;border:2px solid transparent}.home-container #about .about-container.skills-container ul li .skill-inner-container:hover{border:2px solid var(--color-accent)}.home-container #about .about-container.skills-container ul li .skill-inner-container img{width:60px;height:60px}.home-container #about .about-container.skills-container ul li .skill-inner-container .card-face{box-sizing:border-box;position:absolute;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;backface-visibility:hidden}.home-container #about .about-container.skills-container ul li .skill-inner-container .card-face .card-thumbnail{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.25rem}.home-container #about .about-container.skills-container ul li .skill-inner-container .card-face .card-description{display:none}.home-container #about .about-container.skills-container ul li .skill-inner-container.active .card-face{justify-content:start;align-items:center;padding:.7rem}.home-container #about .about-container.skills-container ul li .skill-inner-container.active .card-face .card-description{display:flex;text-align:justify;padding-block:1rem;line-height:2rem;width:80%;overflow-y:auto}.home-container #about .about-container.skills-container ul li .skill-inner-container.active .card-face .card-description.skill-clicked-out{animation:fade-out .2s ease forwards}.home-container #about .about-container.skills-container ul li .skill-inner-container.active .card-face .card-description.skill-clicked-in{animation:fade-in .8s ease forwards}.home-container #about p{font-size:1.15rem;text-align:center;margin-block:1rem;padding-inline:10%;line-height:3.5ch}.home-container #about p a{color:var(--color-text);text-decoration-color:var(--color-text);transition:all .1s ease}.home-container #about p a:hover{color:var(--color-accent);text-decoration-color:var(--color-accent)}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-in{0%{opacity:0}to{opacity:1;display:flex}}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;opacity:0;transition:opacity .4s ease}.popup-overlay{opacity:1}
