@import"https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap";:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}html,body{margin:0;padding:0;background-color:#000;width:100%;height:100dvh}svg{width:1.5rem;height:1.5rem;color:inherit}#root{width:100%;height:100%;min-height:100dvh;font-family:Roboto Mono,monospace;line-height:1.5;font-weight:400;color:#ffffffde}.home-page{position:relative;z-index:1;width:100%;height:100dvh;display:flex;justify-content:center;align-items:center;gap:1rem}.home-page>span{position:fixed;top:0;left:0;z-index:-1;width:100vw;height:100dvh;background:linear-gradient(to right,rgba(0,0,0,1),transparent,transparent)}nav{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1rem;margin:0 auto 0 0;width:20rem;height:fit-content;padding:4rem 2rem;overflow:hidden}nav>button{position:relative;padding:0;margin:0;border-radius:.5rem;background-color:transparent;outline:unset;border:unset;color:#fff;font-size:2em;text-transform:uppercase;cursor:pointer}nav>button:hover,nav>button:active{background-color:transparent}nav>button:before{position:absolute;content:"";display:block;width:0;height:2px;bottom:-2px;left:0;background-color:#0f0;transition:.4s}nav>button:hover:before{width:100%}nav>img{position:fixed;top:50%;left:0;transform:translateY(-50%);z-index:-2;width:100vw;height:100dvh;transition:.4s;object-fit:cover;filter:sepia(100%) hue-rotate(50deg);-webkit-filter:sepia(100%) hue-rotate(50deg)}nav>img.inactive{opacity:0}nav>img.active{opacity:.2}@media (max-width: 615px){.home-page{flex-direction:column}nav{width:calc(100% - 4rem);padding:2rem;justify-content:start;flex-direction:row;overflow-x:auto}nav>button{font-size:1rem}nav>img{height:100%}.home-page>span{background:linear-gradient(to bottom,rgba(0,0,0,1),transparent,transparent)}}.content-container{position:relative;width:calc(100% - 8rem);height:calc(100% - 8rem);padding:4rem 4rem 4rem 0}.content-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:1rem;justify-content:center;align-items:flex-start;pointer-events:none;width:calc(100% - 8rem);max-height:60vh;height:100%;opacity:0;transition:.4s}.content-wrapper.active{opacity:1;pointer-events:all}.pagepartbtn-wrapper{display:flex;gap:1rem;width:100%;overflow-x:auto;padding-bottom:1rem}.card-container{position:relative;width:100%;height:100%}.card-container>.card-wrapper{position:absolute;top:0;left:0;width:100%}.card-wrapper{display:flex;flex-direction:column;gap:1rem;overflow-y:auto;overflow-x:hidden;opacity:0;pointer-events:none;transition:.4s}.card-wrapper.cactive{opacity:1;pointer-events:all}.scrollbar::-webkit-scrollbar{width:.5rem}.scrollbar::-webkit-scrollbar-track{background:rgba(0,255,0,.4);border-radius:1rem}.scrollbar::-webkit-scrollbar-thumb{background:rgba(0,255,0,.8);border-radius:1rem}.scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,255,0,.6)}.card-wrapper>div{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:calc(100% - 2rem);background-color:#00ff001a;border-radius:1rem;padding:1rem}.card-wrapper>div h1,.card-wrapper>div h2,.card-wrapper>div p{margin:0}button{display:flex;justify-content:center;align-items:center;background-color:#0f03;color:#0f09;border-radius:1rem;outline:unset;border:.2rem solid transparent;padding:.5rem;font-size:2rem;font-weight:700;transition:.2s}button:hover{background-color:#0f06;border-color:#0f0c;color:#0f0c}button>svg{width:2.5rem;height:2.5rem}.skill-meter{position:relative;padding:.5rem 1rem;width:100%;max-width:5rem;background-color:#0f06;border:.2rem solid rgba(0,255,0,.8);border-radius:1rem;overflow:hidden;text-align:center}.skill-meter-txt{position:relative;z-index:2;color:#000;font-weight:700}.skill-meter>.skill-meter-fg{position:absolute;top:0;left:0;height:100%;background-color:#0f0c}.auto-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));grid-template-rows:repeat(auto-fit,minmax(auto-fit,1fr));gap:1rem;padding-right:1rem;overflow-y:auto}.auto-grid>div{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:calc(100% - 2rem);height:calc(100% - 2rem);background-color:#00ff001a;border-radius:1rem;padding:1rem;transition:.25s}.auto-grid>div:hover{background-color:#00ff004d}.auto-grid>div>img{width:100%;border-radius:1rem;opacity:.6;transition:.25s}.auto-grid>div:hover>img{opacity:1}.home-content{display:flex;flex-direction:column;gap:1rem;width:calc(100% - 2rem);background-color:#00ff001a;border-radius:1rem;padding:1rem}.home-content h1{font-size:2rem}.home-content h1,.home-content h2,.home-content p{margin:0}.home-content button{width:fit-content;font-size:1.5rem}.video-modal{position:fixed;top:0;left:0;z-index:100;display:flex;justify-content:center;align-items:center;width:calc(100vw - 10rem);height:calc(100dvh - 10rem);padding:5rem;opacity:0;pointer-events:none;transition:.25s}.video-modal.active{opacity:1;pointer-events:auto}.video-modal span{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000c}.github-btn{display:flex;justify-content:center;align-items:center;background-color:#00ff001a;border-radius:1rem;width:100%;height:100%;color:#fff;text-decoration:none;font-size:2rem;transition:.25s}.github-btn:hover{background-color:#00ff004d}.info-modal{position:fixed;top:0;left:0;z-index:100;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:1rem;width:calc(100vw - 10rem);height:calc(100dvh - 10rem);padding:5rem;opacity:0;pointer-events:none;transition:.25s}@media (max-width: 1300px){.info-modal{flex-direction:column}}.info-modal.active{opacity:1;pointer-events:auto}.info-modal .image-wrapper{position:relative;z-index:101;min-width:10rem;width:100%;max-width:50rem;aspect-ratio:16/9;overflow:hidden;background-color:#000}.info-modal .image-wrapper img{position:absolute;top:0;left:50%;transform:translate(-50%);width:fit-content;height:fit-content;max-width:100%;max-height:100%;object-fit:contain;border-radius:1rem;opacity:0;transition:.25s}.info-modal .image-wrapper button{position:absolute;top:50%;transform:translateY(-50%);z-index:102;opacity:0;transition:.25s}.info-modal .image-wrapper button.left{left:1rem}.info-modal .image-wrapper button.right{right:1rem}.info-modal .image-wrapper:hover button.visible,.info-modal .image-wrapper img.visible{opacity:1}.info-modal .content{position:relative;z-index:101;display:flex;flex-direction:column;gap:1rem;color:#fff;background-color:#00ff001a;padding:1rem;border-radius:1rem}.content h1,.content p{margin:0}@media (max-width: 400px){.info-modal .content h1{font-size:1.5em}.info-modal .content p,.info-modal .content a{font-size:.8em}}.info-modal .content .tags-wrapper{display:flex;gap:1rem;width:100%}.info-modal .content a{width:fit-content;padding:.5rem 1rem;border-radius:1rem;color:#fff;text-decoration:none;background-color:#0009;transition:.25s}.info-modal .content a:hover{background-color:#000c}.info-modal span{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000c}@media (max-width: 620px){.content-container{width:100%;padding:0}.content-wrapper{padding:0;width:100%}.info-modal,.video-modal{left:0;width:100vw;padding:0}.auto-grid{width:95%}.auto-grid>div{width:calc(100% - 4rem);height:calc(100% - 2rem);margin:0 auto}.auto-grid>a{width:calc(100% - 2rem);height:100%;margin:0 auto}.auto-grid.scrollbar::-webkit-scrollbar{display:none}}.contacts-wrapper{display:flex;align-items:center;width:100%;height:100%}.contacts-wrapper .auto-grid{width:100%}.contacts-wrapper a{text-align:center}