@import"https://fonts.googleapis.com/css2?family=Fustat:wght@200..800&display=swap";@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap";@import"https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap";@import"https://fonts.googleapis.com/css2?family=Homenaje&display=swap";:root{--fadding-white-text: #ffffff4d;--dust-blue: #6A6F7E;--white: #ffffff;--white-60-opacity: #ffffff99;--black: #3A3A3A;--white-17-opacity: #ffffff2b;--global-padding: 5%;--dark-gray: #3A3A3A}html{scroll-behavior:smooth}body{background-image:url(/portfolio/assets/bgy-CrluKfU9.png);font-family:Fustat,sans-serif;overflow:hidden}*{margin:0;padding:0;box-sizing:border-box}.title{color:var(--white);text-align:center;font-family:Homenaje,sans-serif;font-weight:400;font-style:normal;font-size:60px;margin-bottom:50px}.main-container{position:relative;height:100vh;overflow-y:scroll}.section-container{scroll-snap-align:start;width:100%}.shadow-text{margin:2% 15%;width:fit-content;color:var(--lilac-text);font-size:80px;font-weight:700;text-shadow:-8px 3px 1px #00000066}a,a.visited{color:var(--white)}footer{text-align:center;padding:40px;color:var(--white)}.header-container{display:flex;justify-content:space-between;align-items:center;padding:30px 0;font-size:20px;color:var(--white);position:absolute;top:0;width:100%;background:transparent;z-index:10}.header-sub-container{padding-left:40px}.header-sub-container a{display:inline-flex;margin-right:40px;cursor:pointer}.header-sub-container a{position:relative;text-decoration:none;display:inline-block}.header-sub-container a:not(.github-link):after{content:"";position:absolute;width:0;height:1px;bottom:-4px;left:0;background-color:var(--white);transition:width .3s ease-in-out}.header-sub-container a:not(:has(.github-icon)):hover:after{width:100%}.github-icon{height:3.5rem;width:auto;vertical-align:middle;color:var(--white-60-opacity);transition:color .25s ease,transform .25s ease}.github-icon:hover{color:var(--white)}.mobile-header{position:fixed;top:0;width:100%;display:flex;justify-content:space-between;align-items:center;background-color:var(--white-17-opacity);color:var(--white);padding:5px;z-index:100}.mobile-header svg{height:2.5rem;width:auto;color:var(--white)}.overlay-bttn{background-color:transparent;border:none;cursor:pointer}.overlay-bttn img{height:40px;object-fit:contain}.overlay{position:fixed;inset:0;background:#0000008c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:999;display:flex;justify-content:center;align-items:center}.overlay-nav{position:relative;background:#a6adbf;border-radius:20px;padding:72px 48px 48px;width:80%;max-width:340px;display:flex;flex-direction:column;align-items:center;gap:28px}.overlay-nav a{font-size:28px;color:var(--white);text-decoration:none;opacity:.85;transition:opacity .2s ease,transform .2s ease,border-bottom .2s ease;border-bottom:1px solid transparent}.overlay-nav a:hover{opacity:1;transform:translateY(-2px);border-bottom:1px solid var(--white)}.close-overlay-nav{position:absolute;top:16px;right:16px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--white);background:var(--white-60-opacity);border:1px solid var(--white);border-radius:10px;cursor:pointer;transition:background .2s ease}.close-overlay-nav:hover{background:var(--white-17-opacity)}.main-page-background{position:relative;height:100vh;width:100%}.elipse{position:absolute;top:0;left:50%;transform:translate(-50%);height:100vh;object-fit:cover;z-index:-2}.portfolio-text-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;transform:translatey(30%);z-index:-1}.portfolio-text{color:var( --fadding-white-text);font-size:17vw;font-weight:700;z-index:-1}.development-text-container{position:absolute;top:78%;width:100%;display:flex;flex-direction:column;align-items:flex-end}.development-text{color:var(--dust-blue);font-size:4.8vw;font-weight:700;margin:-25px 30px;white-space:pre}#dev-text{margin-right:99px}.star{position:absolute;height:50px;color:var(--white)}#star-1{top:14%;left:17.5%;transform:rotate(80deg)}#star-2{top:68%;left:82.2%;transform:rotate(40deg)}#star-3{top:80%;left:17.5%;transform:rotate(80deg)}#star-4{top:27%;left:82.3%}.unicorn-girl{position:absolute;top:0;left:50%;transform:translate(-50%);height:100vh;object-fit:cover;z-index:-1;animation:unicorn-cycle 8s infinite}.unicorn-girl-glitch-1{animation:glitch1 8s infinite}.unicorn-girl-glitch-2{animation:glitch2 8s infinite}.unicorn-girl-glitch-3{animation:glitch3 8s infinite}@keyframes unicorn-cycle{0%,3.75%{opacity:1}3.76%,6.25%{opacity:1}6.26%,to{opacity:1}}@keyframes glitch1{0%,3.7%,to{opacity:0}0.1%,2%{opacity:1}}@keyframes glitch2{0%,3.7%,to{opacity:0}2%,3%{opacity:1}}@keyframes glitch3{0%,3.7%,to{opacity:0}20%,21%{opacity:1}20%,21.01%{opacity:0}}.mobile-elements-container{padding:20% 14% 10% 6%}.code-text{font-family:IBM pixel mono,Courier,monospace;color:var(--dust-blue);font-size:17px}.medium-text{font-size:21px}.big-title{font-size:41px;font-weight:700;color:var(--white)}.mobile-elements-container h1:nth-of-type(1){margin-bottom:-15px}.small-title{font-size:21px;font-weight:700;color:var(--dust-blue);text-align:end}@media(min-width:480px)and (max-width:700px){.mobile-elements-container{padding:13% 25%}.main-page-background{height:auto;width:100%}.desktop-only{display:none;visibility:hidden}}@media(max-width:480px){.main-page-background{height:auto;width:100%}.desktop-only{display:none;visibility:hidden}.language-container{position:static;display:block;padding:10px 30px 30px}}@media(min-width:1500px){.mobile-only{display:none;visibility:hidden}.desktop-only{visibility:visible}}@media(min-width:1025px)and (max-width:1500px){.mobile-elements-container{padding:13% 30%}.code-text{font-size:25px}.medium-text{font-size:29px}.big-title{font-size:70px}.small-title{font-size:29px}.main-page-background{height:auto;width:100%}.desktop-only{display:none;visibility:hidden}}@media(min-width:700px)and (max-width:1025px){.mobile-elements-container{padding:13% 23%}.code-text{font-size:25px}.medium-text{font-size:29px}.big-title{font-size:70px}.small-title{font-size:29px}.main-page-background{height:auto;width:100%}.desktop-only{display:none;visibility:hidden}}.language-container{font-family:IBM Plex Mono,monospace;position:absolute;top:85%;left:5%;z-index:11}.border-bottom-text{text-align:end;width:20rem;color:var(--white);border-bottom:1px solid var(--white)}.white-bg-text{background-color:var(--white);color:var(--black);width:fit-content;padding:0 10px;margin-bottom:5px}.language-options-container{display:flex;color:var(--black);gap:19px;cursor:pointer}.language-bttn{background-color:transparent;border:none;padding:10px;color:var(--white);font-size:16px;cursor:pointer;transition:all .2s ease}.activeLanguage{color:var(--dust-blue);background-color:var(--white-17-opacity)}.language-bttn:active{transform:scale(.96);transition:transform .1s;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:480px){.language-container{position:static;display:block;padding:10px 30px 30px}}@media(min-width:480px)and (max-width:700px){.language-container{position:static;display:block;padding:2% 22%}}@media(min-width:1500px){.language-container{position:absolute;top:87%;left:3%;min-height:100%}}@media(min-width:1025px)and (max-width:1500px){.language-container{position:static;display:block;padding:0 30%}}@media(min-width:700px)and (max-width:1025px){.language-container{position:static;display:block;padding:0 23%}}.vertical-github-container{display:flex;flex-direction:column;position:absolute;top:60%;left:5%;transform:rotate(90deg);-webkit-mask-image:linear-gradient(to right,transparent 0%,black 40%,black 60%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,black 40%,black 60%,transparent 100%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:reveal-loop 3s linear infinite}.github-link-text{font-family:Kosugi Maru,sans-serif;text-decoration:none;color:var(--white);margin-bottom:5px}@keyframes reveal-loop{0%{-webkit-mask-position:150% 0;mask-position:150% 0}to{-webkit-mask-position:-50% 0;mask-position:-50% 0}}.about-container{position:relative;display:flex;justify-content:center;font-size:17px;color:var(--white);gap:20px;padding:5% 1%}.about-text{width:90%}.dark-text{color:var(--dark-gray);margin-top:40px}.about-desc{font-size:21px}@media(min-width:1100px){.about-text{width:50%}}.projects-container{display:flex;justify-content:center;flex-wrap:wrap;gap:50px;padding:0% 10%;color:var(--white)}.projects-container>h1{width:100%}.project-icon{width:50px;height:auto}.project{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;gap:20px;min-width:200px;background-color:var(--white-17-opacity);border:1px solid var(--white);padding:2%;max-width:350px;min-height:500px;text-align:center;border-radius:5px;position:relative;transition:transform .2s ease,box-shadow .2s ease}.project:hover{transform:translateY(-10px);box-shadow:0 8px 20px #0000001a}.project-title{font-size:1.5rem}.project-tags-container{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.project-tag{border:1px solid var(--white);border-radius:5px;padding:1px 10px}.fade-line{border:none;height:2px;background:linear-gradient(to right,transparent,#ffffff,transparent);width:100%}.open-project-button{font-size:16px;background-color:transparent;border:none;color:var(--dust-blue);cursor:pointer}.open-project-button:hover{text-decoration:underline}.project-deco-card{position:absolute;width:100%;top:-3%;left:4.3%;pointer-events:none}.tech-carousel{margin-bottom:40px;border-top:2px solid var(--white);border-bottom:2px solid var(--white);color:var(--white);padding:20px 0;width:100%;overflow:hidden;display:flex}.tech-carousel::-webkit-scrollbar{display:none}.track{display:flex;flex-wrap:nowrap;white-space:nowrap;width:max-content;animation:spin 50s linear infinite}.track p{flex:0 0 10rem}@keyframes spin{0%{transform:translate(0)}to{transform:translate(-100%)}}.project-modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;z-index:1000;color:var(--white);font-size:18px}.modal-content-container{position:relative;display:flex;flex-wrap:wrap;gap:35px;background:#cbd0df;border:1px solid var(--white);border-radius:8px;width:95%;height:87%;padding:2% 1% 2% 2%}.modal-info-container{padding:5% 2%;display:flex;flex-direction:column;flex:1 1 400px;height:auto;gap:20px;min-height:100%;font-size:20px}#close-modal{position:fixed;top:8%;right:4%;background:var(--white-17-opacity);border:1px solid var(--white);border-radius:5px;padding:5px 15px;font-size:30px;color:var(--white);cursor:pointer}.project-icon-modal{height:55px}.modal-title{display:flex;align-items:center;gap:20px}.modal-media{display:flex;align-items:center;justify-content:center;height:80%;min-width:0;max-width:100%;object-fit:contain}.modal-media img,.modal-media video{width:100%;height:100%;object-fit:contain;cursor:pointer}.modal-tags-contianer{display:flex;flex-wrap:wrap;max-width:100%;gap:10px}.modal-bttns-container{display:flex;flex-wrap:wrap;gap:5%}.modal-bttn{background-color:transparent;border:none;background-image:url(/portfolio/assets/modalBttn-BNtifYeL.svg);background-size:contain;background-repeat:no-repeat;background-position:center;width:250px;height:auto;font-family:Fustat,sans-serif;font-size:17px;display:flex;align-items:center;padding:10px;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.modal-bttn-content{display:inline-flex;align-items:center;justify-content:space-between;gap:10px;width:100%;white-space:nowrap}.modal-bttn-arrow{height:17px;transform:rotate(-35deg)}.arrow{font-size:30px;color:var(--dust-blue);background-color:transparent;border:none;cursor:pointer;padding:2%}.slides-container{position:relative;height:100%;width:650px}.slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(.9);transition:all .4s ease}.slide.active{opacity:1;transform:scale(1);z-index:2}@media(min-width:1150px){.modal-content-container{overflow:hidden}.modal-info-container{overflow-y:auto;max-height:100%}.slides-container{width:650px;height:300px}}@media(max-width:1216px){.modal-title{flex-direction:column;justify-content:center;gap:0px}.modal-media{height:100%}.slides-container{height:300px;width:650px}.modal-content-container{justify-content:center;overflow:auto}.modal-info-container{overflow-y:hidden;max-width:100%;margin-top:30px}}@media(max-width:600px){.slides-container{width:300px;height:150px}.modal-bttns-container{justify-content:center}}.overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;cursor:pointer}.overlay img,.overlay video{max-width:90%;max-height:90%;border-radius:8px;box-shadow:0 0 20px #000}#skills{padding:5% 10%;color:var(--white)}.skills-container{display:flex;gap:50px;flex-wrap:wrap;justify-content:center}.skill-hidden{opacity:0;display:flex;flex-direction:column;align-items:center;gap:10px}.show{animation:popUp 1.5s forwards}.skill-icon{width:50px;height:50px}@keyframes popUp{0%{opacity:0;transform:translateY(30px) scale(.9)}80%{opacity:.5;transform:translateY(-4px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.show:nth-child(1){animation-delay:.2s}.show:nth-child(2){animation-delay:.4s}.show:nth-child(3){animation-delay:.8s}.show:nth-child(4){animation-delay:1s}.show:nth-child(5){animation-delay:1.2s}.show:nth-child(6){animation-delay:1.4s}.show:nth-child(7){animation-delay:1.8s}.show:nth-child(8){animation-delay:1.9s}.show:nth-child(9){animation-delay:2s}.show:nth-child(10){animation-delay:2.2s}.show:nth-child(11){animation-delay:2.4s}.show:nth-child(12){animation-delay:2.6s}.show:nth-child(13){animation-delay:2.8s}.show:nth-child(14){animation-delay:3s}@media(max-width:600px){.skills-container{justify-content:space-around}}#contact{padding:5% 10%}.contact-info-contianer{display:flex;align-items:center;justify-content:space-between;gap:10%;padding:2%;border-top:1px solid var(--white)}.contact-text{font-size:20px;color:var(--white);padding:2%;max-width:60%}#end-text{color:var(--white);text-align:end}.contact-icon{height:40px;margin-right:20px;transition:transform .2s ease,box-shadow .2s ease}.contact-icon:hover{transform:translateY(-10px);cursor:pointer}@media(max-width:900px){.contact-info-contianer{flex-direction:column;gap:20px}.contact-text{max-width:100%}}