@import"https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&display=swap";.h0{background-color:#0d174c}.h1{background-color:#0e2e5e}.h2{background-color:#0d3a64}.h3{background-color:#0d4d71}.h4{background-color:#286a87}.h5{background-color:#3f8ba4}.h6{background-color:#43adb4}.h7{background-color:#70cbc0}.h8{background-color:#cbdb8d}.h9{background-color:#e6e882}.h10{background-color:#f8e968}.h11{background-color:#f5de62}.h12{background-color:#fbcd59}.h13{background-color:#fcbd42}.h14{background-color:#f48f57}.h15{background-color:#f17373}.h16{background-color:#d94ea2}.h17{background-color:#bc46b0}.h18{background-color:#a623c6}.h19{background-color:#8926c6}.h20{background-color:#6e1dbf}.h21{background-color:#5020a0}.h22{background-color:#331686}.h23{background-color:#090d65}.loading-container{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;z-index:9999}.loading-name-logo{font-size:clamp(36px,6vw,72px);background-clip:text!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;animation:changeNameLogo .5s 2s forwards ease;-webkit-user-select:none;user-select:none;height:80px;margin:0}@keyframes changeNameLogo{to{height:0}}.loading-img-logo-container{position:fixed;display:inline;overflow:hidden;width:clamp(150px,20vw,200px);animation:changeImgLogo .5s 2.5s forwards;height:0}@keyframes changeImgLogo{to{height:clamp(150px,20vw,200px)}}.loading-img-logo{width:clamp(150px,20vw,200px)}.loading-percent-container{position:fixed;bottom:50px;text-align:center}.loading-percent{color:var(--color)}.percent-range-background{display:flex;justify-content:left;align-items:center;height:6px;border-radius:4px;width:clamp(200px,20vw,300px);background-color:var(--glass-background);outline:2px solid var(--glass-background);outline-offset:5px}.percent-range{width:0%;height:6px;border-radius:3px;background-color:var(--color)}#progress{font-family:inherit;font-weight:300;height:50px;width:50px;background:var(--glass-background);border-radius:50%;position:fixed;bottom:25px;right:25px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;justify-content:center;align-items:center;color:var(--color);padding:0;border:none;z-index:99;cursor:pointer;transition:background-color .2s}#progress-value{background-color:transparent;opacity:0}#arrow-up{position:absolute;opacity:1}@keyframes opacUp{0%{opacity:0}to{opacity:1}}@keyframes opacDown{0%{opacity:1}to{opacity:0}}@keyframes toTopButton{0%{bottom:-60px}to{bottom:25px}}@keyframes toDownButton{0%{bottom:25px}to{bottom:-60px}}.burger-button{width:40px;height:0;cursor:pointer;padding:20px 0;display:none}.burger-button:before{content:"";position:absolute;width:40px;height:3px;border-radius:1px;background-color:var(--color);transform:translateY(-5px);transition:all .3s}.burger-button:after{content:"";position:absolute;width:40px;height:3px;border-radius:1px;background-color:var(--color);transform:translateY(5px);transition:all .3s}.active-burger-button:before{transform:translateY(0) rotate(-45deg)}.active-burger-button:after{transform:translateY(0) rotate(45deg)}.active-header{min-height:75vh!important;background:var(--glass-background)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important}.active-header-nav{display:flex!important;flex-direction:column!important;gap:5px!important}.active-header-nav a{font-size:30px!important}.active-header-socials{display:flex!important}@media screen and (max-width: 900px){.burger-button{display:block}}.header{position:fixed;top:0;left:0;right:0;min-height:100px;display:flex;justify-content:space-between;align-items:center;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;z-index:100;transition:all .3s}.logo-btn-container{position:absolute;top:10px;width:100%;height:80px;display:flex;justify-content:space-between;align-items:center;padding:0 25px;left:0;box-sizing:border-box}.header-logo{font-size:clamp(24px,3vw,30px);color:var(--color);font-weight:700}.header-nav{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;justify-content:space-between;align-items:center;width:50%;padding:0;margin:0}.header-nav a{font-size:18px;color:var(--semi-transparent-color);transition:all .2s;opacity:0;font-weight:300}.header-link-home{animation:revealLink 1s .1s forwards}.header-link-skills{animation:revealLink 1s .15s forwards}.header-link-projects{animation:revealLink 1s .2s forwards}.header-link-contact-me{animation:revealLink 1s .25s forwards}.header-link-resume,.header-link-resume-download{animation:revealLink 1s .3s forwards}@keyframes revealLink{to{opacity:1}}.header-nav a:hover{color:var(--color)}.resume-container{display:flex;gap:10px}.active-link{color:var(--color)!important}.header-socials{position:absolute;left:50%;transform:translate(-50%);bottom:10px;width:50%;display:none;justify-content:space-between;align-items:center;font-size:24px}.header-socials a{color:var(--semi-transparent-color);transition:all .2s;height:0px;overflow:hidden}.social-github{animation:revealSocial .5s .5s forwards}.social-instagram{animation:revealSocial .5s .6s forwards}.social-twitter{animation:revealSocial .5s .7s forwards}.social-twitch{animation:revealSocial .5s .8s forwards}.social-linkedin{animation:revealSocial .5s .9s forwards}@keyframes revealSocial{to{height:26.4px}}.header-socials a:hover{color:var(--color)}.header-scroll{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:var(--glass-background);left:10px;right:10px;top:10px;border-radius:50px}@media screen and (max-width: 900px){.header-nav{display:none}}.about-me-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:25px;min-height:100vh;text-align:center;color:var(--color)}.main-info-about-me{font-size:clamp(30px,6vw,70px);font-weight:700;margin:0;padding:0 25px}.main-info-about-me span{opacity:0}.active-lol{opacity:0;animation:charReveal .5s forwards}@keyframes charReveal{0%{opacity:0}to{opacity:1}}.info-about-me{font-size:clamp(10px,1.5vw,18px);opacity:0;margin:0;padding:0 25px;width:80%;transform:translateY(50px);animation:translateEffect .6s 8.1s forwards}@keyframes translateEffect{to{transform:translateY(0);opacity:1}}.about-btn-container{opacity:0;transform:translateY(25px);animation:revealBtn .3s 8.4s forwards}@keyframes revealBtn{to{opacity:1;transform:translateY(0)}}.about-btn{display:flex;justify-content:center;align-items:center;width:140px;height:40px;color:var(--color);background:var(--glass-background);border-radius:20px;box-shadow:0 5px #0003;font-size:16px;font-weight:300;text-decoration:none}.about-btn:active{transform:translateY(5px);box-shadow:none}.skills-container{width:100%;min-height:100vh;padding-top:100px;text-align:center;color:var(--color);box-sizing:border-box}.skills-info{display:inline-block;font-size:clamp(30px,5vw,50px);font-weight:500;margin:25px 0;transform:translateY(30px);opacity:0}.reveal-info0{opacity:1;transform:translateY(0);transition:all .75s}.skills-grid-container{display:grid;justify-content:center;align-items:center;gap:25px;grid-template-columns:repeat(4,200px);transition:all .3s}.current-info{font-size:clamp(16px,2vw,24px);font-weight:300;margin:25px 0}.current-grid{display:grid;justify-content:center;align-items:center;gap:25px;grid-template-columns:200px;transition:all .3s}.skills-container i{font-size:clamp(24px,5vw,60px);transition:transform .5s}.skills-container i:hover{transform:scale(1.5)}.icon-container,.icon-container-current{display:flex;justify-content:center;align-items:center;position:relative;width:200px;height:200px;background:var(--glass-background);border-radius:10px;overflow:hidden}.skill1,.skill2,.skill3,.skill4,.skill5,.skill6,.skill7,.skill8,.skill9{opacity:0;transform:translateY(30px)}.reveal-info1{opacity:1;transform:translateY(0);transition:opacity 1s .4s ease,transform 1s .4s ease}.reveal-info2{opacity:1;transform:translateY(0);transition:opacity 1s .5s ease,transform 1s .5s ease}.reveal-info3{opacity:1;transform:translateY(0);transition:opacity 1s .6s ease,transform 1s .6s ease}.reveal-info4{opacity:1;transform:translateY(0);transition:opacity 1s .7s ease,transform 1s .7s ease}.reveal-info5{opacity:1;transform:translateY(0);transition:opacity 1s .8s ease,transform 1s .8s ease}.reveal-info6{opacity:1;transform:translateY(0);transition:opacity 1s .9s ease,transform 1s .9s ease}.reveal-info7{opacity:1;transform:translateY(0);transition:opacity 1s 1s ease,transform 1s 1s ease}.reveal-info8{opacity:1;transform:translateY(0);transition:opacity 1s 1.1s ease,transform 1s 1.1s ease}.reveal-info9{opacity:1;transform:translateY(0);transition:opacity 1s 1.2s ease,transform 1s 1.2s ease}.skills-progress-container{position:absolute;left:0;width:0;height:100%;z-index:2}.skills-icon{z-index:3;cursor:pointer}.skills-progress-percent{position:absolute;bottom:0;font-weight:300;display:none;font-size:clamp(12px,2vw,24px);z-index:2;margin:0}.skills-progress-info{font-size:12px;font-weight:300;margin:25px 0}@media screen and (max-width: 1100px){.skills-grid-container{gap:20px;grid-template-columns:repeat(4,150px)}.current-grid{gap:20px;grid-template-columns:150px}.icon-container,.icon-container-current{width:150px;height:150px}}@media screen and (max-width: 800px){.skills-grid-container{gap:15px;grid-template-columns:repeat(4,100px)}.current-grid{gap:15px;grid-template-columns:100px}.icon-container,.icon-container-current{width:100px;height:100px}}@media screen and (max-width: 600px){.skills-grid-container{gap:10px;grid-template-columns:repeat(4,75px)}.current-grid{gap:10px;grid-template-columns:75px}.icon-container,.icon-container-current{width:75px;height:75px}}.project1-container,.project2-container,.project3-container,.project4-container,.project5-container{position:relative;width:400px;height:340px;background:var(--glass-background);border-radius:10px;display:flex;justify-content:center;align-items:center}.img-title{width:350px;height:290px;border-radius:10px;overflow:hidden;object-fit:cover;object-position:top}.img-title-full{width:350px;border-radius:10px}.project-content-container{position:absolute;top:0;right:0;bottom:0;left:0;padding:25px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;background:var(--glass-background);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;border-radius:inherit;transition:all .5s}.project1-container:hover .project-content-container,.project2-container:hover .project-content-container,.project3-container:hover .project-content-container,.project4-container:hover .project-content-container,.project5-container:hover .project-content-container{opacity:1}.project-name{margin:0;font-size:30px;font-weight:400}.project-info{margin:0;font-weight:300}.link-project-container{width:100%;display:flex;justify-content:space-between;align-items:center}.link-project-container a{color:var(--semi-transparent-color);text-decoration:none;transition:color .2s;font-size:24px}.link-project-container a:hover{color:var(--color)}.project-skills{display:flex;gap:10px;font-size:24px}@media screen and (max-width: 900px){.project1-container{position:sticky;top:125px;margin-bottom:125px;z-index:10}.project2-container{position:sticky;top:150px;margin-bottom:100px;z-index:11}.project3-container{position:sticky;top:175px;margin-bottom:75px;z-index:12}.project4-container{position:sticky;top:200px;margin-bottom:50px;z-index:13}.project5-container{position:sticky;top:225px;margin-bottom:25px;z-index:14}}.portfolio-container{width:100%;min-height:100vh;padding-top:100px;text-align:center;color:var(--color)}.portfolio-info{font-size:clamp(30px,5vw,50px);font-weight:500;margin:25px 0;opacity:0;transform:translateY(30px)}.portfolio-grid-container{display:grid;justify-content:center;align-items:center;grid-template-columns:repeat(3,400px);gap:25px}@media screen and (max-width: 1300px){.portfolio-grid-container{grid-template-columns:repeat(2,400px)}}@media screen and (max-width: 900px){.portfolio-grid-container{grid-template-columns:400px}}.form-container{font-family:inherit;text-align:center;padding:100px 0;min-height:100vh;width:100%;color:var(--color);box-sizing:border-box}.contact-info{text-align:center;font-size:clamp(30px,5vw,50px);font-weight:500;margin:25px 0;opacity:0;transform:translateY(30px)}.reveal-info{opacity:1;transform:translateY(0);transition:all .75s}.form-choice-container{display:flex;justify-content:center;align-items:center}.form{display:flex;flex-direction:column;justify-content:center;gap:10px;width:50%;box-sizing:border-box;transition:width .3s;margin:0 auto;padding:0 25px}.or{margin:0;font-size:36px}.extra-form{width:50%;padding:0 25px;box-sizing:border-box}#extra-mail{font-size:clamp(24px,3vw,36px);padding:0;color:var(--semi-transparent-color);transition:color .2s}#extra-mail:hover{color:var(--color)}.extra-input{background-color:transparent;border:none;cursor:pointer}input,textarea{font-family:inherit;font-weight:300;color:var(--color)}.input-info{width:100%;padding:12px 20px;background:var(--glass-background);border:none;border-radius:10px;outline:none;font-size:16px;box-sizing:border-box;transition:background-color .3s}.input-subject-info{width:100%;padding:12px 20px;border:none;background:var(--glass-background);border-radius:10px;outline:none;font-size:16px;box-sizing:border-box}.input-message-info{font-family:inherit;resize:none;background:var(--glass-background);border:none;padding:12px 20px;width:100%;border-radius:10px;outline:none;font-size:16px;box-sizing:border-box}input::-moz-placeholder,textarea::-moz-placeholder{color:var(--semi-transparent-color)}input::placeholder,textarea::placeholder{color:var(--semi-transparent-color)}.input-btn-container{display:flex;justify-content:space-between;align-items:center}.form-submit-btn,.form-reset-btn{font-size:16px;font-weight:300;border:none;padding:0;width:140px;height:40px;cursor:pointer;border-radius:20px;box-shadow:0 5px #0003;background:var(--glass-background)}.form-reset-btn:active,.form-submit-btn:active{transform:translateY(5px);box-shadow:none}@media screen and (max-width: 750px){.form,.extra-form{width:100%}.form-choice-container{flex-direction:column;gap:50px}}.footer{margin-top:auto;min-height:75vh;width:100%;background:var(--glass-background);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;padding:25px;border-radius:50px 50px 0 0;text-align:center;color:var(--color);box-sizing:border-box}.logo-footer{width:90px}.main-quote{margin-top:auto;margin-bottom:auto}.only-word{display:inline-block;width:90px;animation:revealWord 2s infinite ease-in-out}@keyframes revealWord{0%{opacity:0}50%{opacity:1}to{opacity:0}}.info-icon{display:flex;justify-content:center;align-items:center;gap:25px;font-size:clamp(24px,3vw,30px)}.info-icon a{color:var(--semi-transparent-color);transition:all .2s}.info-icon a:hover{color:var(--color)}.copyright{font-size:clamp(12px,1vw,16px);font-weight:300}.scroll-pick{display:flex;justify-content:center;align-items:center;gap:25px;margin-top:auto;margin-bottom:auto}.container,.container2{position:relative;width:100px;height:200px;background-color:#00000080;border-radius:50px;z-index:4}.picker-glass{position:absolute;top:50%;transform:translateY(-50%);width:100%;height:40px;background:var(--glass-background);z-index:5}.input-section,.input-section-color{width:100%;height:100%;padding:80px 0;box-sizing:border-box;overflow-y:scroll;scroll-snap-type:y mandatory;border-radius:50px}.picker-btn{font-family:Comfortaa,sans-serif;background:none;border:none;color:var(--semi-transparent-color);cursor:pointer;font-size:16px;width:100px;height:40px;scroll-snap-align:center;position:relative;z-index:6;outline:none;padding:0;font-weight:300;transition:all .2s}.active-picker-btn{color:#fff;font-size:24px;font-weight:700}.active-picker-btn-auto,.active-picker-btn-text-auto{color:#fff;font-size:20px;font-weight:700}.container2 input{font-family:Comfortaa,sans-serif;display:flex;justify-content:center;align-items:center;font-size:16px;font-weight:300;scroll-snap-align:center;background:none;border:none;text-align:center;margin:0;padding:0;cursor:pointer;outline:none;color:var(--semi-transparent-color);transition:color .2s}.container2 input:hover{color:var(--color)}.container2 .empty-input{font-family:Comfortaa,sans-serif;width:70px;display:flex;justify-content:center;align-items:center;font-size:16px;font-weight:300;scroll-snap-align:center;background:none;border:none;text-align:center;margin:0;padding:0;cursor:pointer;outline:none;color:var(--semi-transparent-color);transition:color .2s}.creator{color:var(--color);text-decoration:underline}:root{--glass-background: rgba(255, 255, 255, .5);--color: #000;--semi-transparent-color: rgba(0, 0, 0, .5);--project-background: rgba(255, 255, 255, .5)}html{scroll-behavior:smooth}body{font-family:Comfortaa,sans-serif;margin:0;padding:0;width:100%;min-height:100vh;position:fixed;overflow-y:hidden}#root{width:100%;min-height:100vh;margin:0;padding:0;display:flex;flex-direction:column;align-items:center}::-webkit-scrollbar{display:none}a{text-decoration:none}ul{list-style-type:none}