.Header{background:#1e2326;width:100%;height:20vh}.Header-container{max-width:1100px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:25px 20px}.Header section .Header-logo a{font-family:Righteous;font-size:36px;color:#1cb698;text-decoration:none}.Header-nav-desktop ul{display:flex;list-style:none}.Header section nav ul li a{text-align:none;color:#fff;margin:0 15px;padding:3px;transition:.5s;text-decoration:none}.Header section nav ul li a:hover{color:#1cb698}.Header-nav-mobile{opacity:0;height:0px}.Header-nav-mobile ul{list-style:none}.Header-nav-responsive{background-color:#1cb698;color:#fff;padding:5px 10px;border-radius:5px;cursor:pointer;display:none}@media screen and (max-width:980px){.Header-nav-desktop{display:none}.Header-nav-mobile{opacity:1;width:100%;height:auto;position:absolute;padding:0;right:0;top:0;transform:translate(100%,-100%);transition:all ease-out .5s}.Header-nav-mobile.show{transform:translate(0)}.Header-nav-mobile ul{display:flex;flex-direction:column}.Header-nav-responsive{display:flex}.Header-nav.responsive .Header-nav-mobile{display:block;position:absolute;right:0;top:75px;background-color:#252a2e;width:180px;border-radius:10px;z-index:99;transform:translate(0)}.Header-nav-mobile ul li{background-color:#252a2e;border-bottom:1px solid #fff;padding:10px 0}}.Projects-project{display:grid;align-content:center;gap:10px;max-width:340px;margin:10px;border:solid 1px #fff;border-radius:10px;padding:15px;transition:border-color .5s ease;opacity:0;position:relative;left:-30px}.Projects-project:hover{border-color:#1cb698}.Projects-project h3{transition:color .5s ease}.Projects-project:hover h3{color:#1cb698}.Projects-project h3{height:60px}.Projects-project figure{height:150px;margin:0;border-radius:10px}.Projects-project img{width:100%;height:100%;display:block;border-radius:10px}.Projects-project p{height:150px;background-color:#1e2326;border-radius:10px;padding:15px;text-align:left;overflow-x:hidden;overflow-y:scroll;scrollbar-width:thin;scrollbar-color:#1CB698 #1e2326}.Projects-project p::-webkit-scrollbar{width:4px}.Projects-project p::-webkit-scrollbar-track{background:#1e2326;border-radius:10px}.Projects-project p::-webkit-scrollbar-thumb{background-color:#1cb698;border-radius:10px;border:1px solid #1e2326}.Projects-links{display:flex;justify-content:space-between;gap:10px}.Projects-links a{width:100%;background-color:transparent;border:2px solid #fff;border-radius:7px;display:block;padding:10px 22px;font-size:16px;color:#fff;position:relative;z-index:10}.Projects-container a .overlay{position:absolute;top:0;left:0;width:0;height:100%;color:#fff;background-color:#1cb698;z-index:-1;transition:1s}.Projects-links a:hover{color:#fff}.Projects-links a:hover .overlay{width:100%;border-radius:4px}@media screen and (max-width:700px){.Projects-project{max-width:100%}.Projects-project img{width:100%}}@media screen and (max-width:430px){.Projects-links{flex-direction:column}.Projects-links a{width:auto}}.Projects .Projects-container{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.Portfolio-technology{max-width:340px;height:fit-content;margin:10px;opacity:0;position:relative;left:-30px}.Portfolio-technology a{color:#fff;text-decoration:none;transition:color .5s ease}.Portfolio-technology a:hover{color:#1cb698}.Portfolio-technology-logo{margin:0 auto;display:flex;justify-content:center;max-width:340px}@media screen and (max-width:700px){.Portfolio-technology{max-width:100%}.Portfolio-technology img{width:100%}}.Portfolio .Portfolio-container{width:100%;display:grid;justify-items:center;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.App-layout{width:100%;height:100vh;text-align:center}@media screen and (min-width: 1024px){.App-layout{max-width:1024px;margin:0 auto}}.About{background-color:#1e2326;color:#fff;height:80vh}.About-container{margin:auto;padding:0 30px;opacity:0;position:relative;left:-30px}.About h2{text-align:center;margin:0}.About-container p{font:18px;line-height:22px;margin-bottom:20px;text-align:left}.About .fila{width:calc(100% - 60px);display:flex;gap:20px}.About .fila .Abount-col-left,.About .fila .Abount-col-right{width:calc(50% - 10px)}.About .fila .Abount-col-left h3,.About .fila .Abount-col-right h3{font-size:28px;font-family:Righteous;margin-bottom:25px}.About .fila .Abount-col-left ul,.About .fila .Abount-col-right ul{list-style:none;padding:0}.About .fila .Abount-col-left ul li,.About .fila .Abount-col-right ul li{margin:12px 0;display:flex;align-items:center}.About .fila .Abount-col-left li{justify-content:end}.About .fila .Abount-col-right li{justify-content:start}.About .fila .Abount-col-right li p{margin:0}.About .fila .Abount-col-left ul li strong,.About .fila .Abount-col-right ul li strong{display:inline-block;color:#1cb698;width:260px;text-align:end}.About .fila .Abount-col-left ul li span,.About .fila .Abount-col-right ul li span{background-color:#1cb698;padding:3px;font-weight:700;border-radius:5px}.About a{background-color:transparent;border:2px solid #fff;border-radius:7px;width:fit-content;display:block;margin:20px auto;padding:10px 22px;font-size:16px;color:#fff;position:relative;z-index:10}.About a .overlay{position:absolute;top:0;left:0;width:0;height:100%;color:#fff;background-color:#1cb698;z-index:-1;transition:1s}.About a:hover{color:#fff}.About a:hover .overlay{width:100%;border-radius:4px}@media screen and (max-width:700px){.About .fila{justify-content:center}.About .fila .Abount-col-left,.About .fila .Abount-col-right{width:fit-content}.About .fila .Abount-col-left ul li strong,.About .fila .Abount-col-right ul li p{max-width:150px;height:50px}}@media screen and (max-width:430px){.About-container p,.About .fila .Abount-col-left ul li strong,.About .fila .Abount-col-right ul li p{font-size:12px}}.Home{background:linear-gradient(to top,rgba(30,35,38,.8),rgba(30,35,38,1));background-size:cover;height:80vh;color:#fff;display:flex;align-items:center}.Home-container{padding:20px;background-color:#1e2326;max-width:350px;margin:auto;text-align:center;border-radius:40px;opacity:0;position:relative;top:-30px}.Home-container h1{margin-top:40px;font-size:42px;font-family:Righteous}.Home-container h2{font-size:15px;font-weight:400}.Home-redes{display:flex;justify-content:center}.Home-container .Home-redes a{color:#fff;display:flex;justify-content:center;align-items:center;text-decoration:none;border:1px solid #fff;border-radius:100%;width:42px;height:42px;line-height:42px;margin:40px 5px;font-size:20px;transition:background-color .5s ease}.Home-redes-item:hover{background-color:#1cb698}.Portfolio,.Projects{background-color:#252a2e;color:#fff;padding:50px 20px;border-radius:20px}@media screen and (max-width:430px){.Projects{padding:50px 10px}}.Skills-skill{display:flex;align-items:center;gap:20px}.Skills-skill h3{color:#1cb698;text-align:start}.Skills-skill{text-align:left}@media screen and (max-width:430px){.Skills-skill{display:flex;flex-direction:column}}.Skills{display:flex;flex-direction:column;gap:50px;background-color:#252a2e;color:#fff;padding:50px 20px}.Skills-container{width:100%;display:flex;flex-direction:column;opacity:0;position:relative;left:-30px}@media screen and (max-width:768px){.Skills-container{padding:0}.skills .fila{display:block}.skills .fila .col,.skills .fila .col .barra-skill{width:100%}}#root{width:100vw;height:100vh;text-align:center}.effect{opacity:1;left:0;transition:1s linear}.effect2{opacity:1;top:0;transition:1s linear}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#1e2326;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;background-color:#1e2326;box-sizing:border-box}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}