.links a{text-decoration:none;color:var(--color-words-primary);font-size:16px}.links{background-color:var(--color-backdrop);list-style:none}.navigation{display:none}@media (min-width: 768px){.navigation{display:flex;flex-direction:column;justify-content:space-around;gap:10px;width:min(100%,270px);margin-left:auto;min-height:100vh;position:sticky;left:0;top:0;padding:20px}.navigation h3{font-size:30px;text-align:center;margin:0;text-transform:uppercase}.button-dark{cursor:pointer;border-radius:50%;aspect-ratio:1/1;width:fit-content;align-self:center;display:flex;align-items:center;justify-content:center;padding:5px;transition:background-color .25s ease-in-out}.button-dark:hover{background-color:var(--color-hover-backdrop)}.button-dark svg{fill:var(--color-words-primary);width:25px}.navigation ul{display:flex;align-items:stretch;justify-content:center;flex-direction:column;gap:10px;width:100%}.navigation li{border-radius:10px;padding:8px 20px;width:100%;transition:background-color .25s ease-in-out;text-align:center}.selected li{background-color:var(--color-hover-backdrop)}.navigation ul a:after{content:"";display:block;margin:auto;width:90%;height:2px;opacity:1;background:var(--color-hover-backdrop);transition:opacity .25s ease-in-out}.navigation ul a:hover:after{opacity:0}.link.selected:after{opacity:0}.navigation li:hover{background-color:var(--color-hover-backdrop)}}.container-presentation{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px}.container-presentation h1{font-size:2.5rem;font-weight:800;margin-bottom:1rem;line-height:100%;margin:0;font-family:var(--font-secondary);text-transform:uppercase}.container-presentation h2{font-size:18px;font-family:var(--font-secondary);font-weight:400}.container-presentation h2 span{font-weight:500;font-family:var(--font-secondary);color:var(--font-color-primary)}.container-presentation p{font-size:16px;font-family:var(--font-secondary);font-weight:400;margin:0}.container-presentation .button-download{font-size:16px;font-family:var(--font-secondary);font-weight:500;text-decoration:none;border:2px solid var(--font-color-primary);color:var(--font-color-primary);background-color:#ffff0017;padding:10px 20px;border-radius:10px}.container-presentation .button-download:hover{background-color:#ffff0025}.container-presentation img{width:100%;max-width:500px;transition:filter .4s ease ease-in-out;-webkit-transition:-webkit-filter .4s ease-in-out}.container-presentation img:hover{filter:drop-shadow(0px 0px 30px rgba(255,255,0,.178))}.texts-presentation{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}@media (min-width: 1200px){.container-presentation{flex-direction:row;justify-content:space-between;align-items:center;gap:50px}.container-presentation h1{font-size:3.5rem}.container-presentation img{width:50%}}.image{border-radius:9999px;aspect-ratio:1 / 1;object-fit:cover;object-position:center;-webkit-mask-image:radial-gradient(circle,black 0%,transparent 100%);mask-image:radial-gradient(circle 250px at 50% 40%,black 80%,transparent 100%)}.social-icons{display:flex;align-items:center;justify-content:center;gap:10px}.social-icons a{padding:3px}.social-icons a svg{width:45px;aspect-ratio:1/1;scale:1;transition:filter .2s ease ease-in-out;-webkit-transition:-webkit-filter .2s ease-in-out}.social-icons a svg:hover{filter:drop-shadow(0px 0px 10px rgba(0,195,255,.466))}.button-next{margin:auto;max-width:max-content;color:var(--scroll-color);text-decoration:none;font-weight:500;opacity:1;transition:color .3s ease-in-out,opacity .3s ease-in-out}.button-next span{padding:5px;aspect-ratio:1/1;border-radius:50%;border:2px solid;display:flex;align-items:center;justify-content:center}.rotate{transform:rotate(180deg)!important}.button-next span svg{width:25px;fill:var(--scroll-color);transition:fill .3s ease-in-out}.button-next:hover{color:var(--color-words-primary);opacity:.5}.button-next:hover span svg{fill:var(--color-words-primary)}.home{min-height:100vh;display:grid;place-content:center;padding:40px}.container-about-me{display:flex;flex-direction:column;align-items:stretch;justify-content:center;width:100%;max-width:1200px;margin:auto;font-family:var(--font-secondary)}.container-about-me p{text-align:justify;font-family:var(--font-secondary)}.container-about-me h2{font-family:var(--font-secondary);font-size:32px}.container-about-me h3{font-family:var(--font-secondary);margin:20px 0;font-size:24px}.redirect{font-family:var(--font-secondary);text-decoration:none;color:#009238}.container-about-me h4{font-family:var(--font-secondary);font-size:22px;margin-bottom:15px}.container-about-me h4 span{font-weight:300;font-size:20px}.time-line{margin:20px 0;display:flex;align-items:center;justify-content:space-between}.time-line p{font-size:14px}.time-line .circle{display:block;width:10px;height:10px;border-radius:50%;background-color:#00ff62}.group-line{display:flex;align-items:start;width:100%}.group-circle{display:flex;flex-direction:column;align-items:center;width:100%;position:relative}.group-line .line{margin-top:2.5px;width:100%;height:3px;background-color:#00ff62}.circle:after{content:"";display:block;position:absolute;left:0;top:2.5px;width:50%;height:3px;background-color:#00ff62}.circle1:after{left:auto;right:0}.content-buttons{display:flex;width:100%;gap:3px;justify-content:center;margin:15px 0}.about{min-height:100vh;padding:20px;display:grid;place-items:center}.card-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-gap:5px;width:100%;place-items:stretch}.title-project{font-size:32px;font-weight:700}.container-list-title{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;width:100%}.description-project,.description-project strong{font-size:16px;font-family:var(--font-secondary)}@media (min-width: 768px){.card-list{grid-template-columns:repeat(auto-fit,minmax(350px,1fr));grid-gap:20px}}.card{cursor:pointer;padding:20px;border-radius:10px;height:100%;border:1px solid var(--border-color);backdrop-filter:blur(1px);overflow:hidden;transition:.3s ease-in-out;display:flex;flex-direction:column;gap:15px}.tags-container{display:flex;justify-content:end;width:50%;flex-wrap:wrap;gap:8px;z-index:-1}.container-card{transition:transform 50ms ease-in-out;position:relative;overflow:hidden;border-radius:10px}.circle-ligth{position:absolute;top:-60px;left:-60px;width:140px;height:140px;user-select:none;filter:blur(90px);background-color:var(--color-circle-light);border-radius:50%}.card:hover{backdrop-filter:blur(20px);box-shadow:0 0 40px 0 var(--hover-card);z-index:5}.card:before{content:"";position:absolute;top:0;left:0;width:50px;height:100%;background-color:var(--light-color);animation-iteration-count:10s;animation:ligthTransition 5s ease-in-out infinite}@keyframes ligthTransition{0%{transform:skew(45deg) translate(650px)}20%{transform:skew(45deg) translate(-550px)}to{transform:skew(45deg) translate(-550px)}}.card h2{font-family:var(--font-secondary)}.card img{object-fit:cover;width:100%;aspect-ratio:16/9;border-radius:10px}.card-urls{display:flex;justify-content:space-between;width:100%;align-items:center}.card-urls a{z-index:1}.date-card{font-size:12px;font-family:var(--font-primary)!important;opacity:.5;z-index:-1;padding:5px;background-color:var(--hover-card);border-radius:5px}.description-card svg{fill:var(--color-words-primary);width:14px;z-index:-1}.description-card>svg{z-index:-1}.description-card{font-family:var(--font-secondary);font-size:14px;text-align:justify}@media (min-width: 768px){.description-card{font-size:16px}}.links-project:before{content:"";position:absolute;bottom:-5px;left:0;width:0%;height:2px;background:var(--color-words-primary);transition:width .3s}.links-project:hover:before{width:100%}.links-project{display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--color-words-primary);gap:4px;position:relative;font-family:var(--font-secondary)!important;font-size:14px}.links-project svg{fill:var(--color-words-primary);width:14px}.tags-card{display:flex;align-items:center;justify-content:center;font-size:12px;font-family:var(--font-primary)!important;gap:4px}.content-card-time{display:flex;align-items:start;justify-content:space-between;gap:5px}.circle-tags{width:10px;aspect-ratio:1/1;border-radius:50%;opacity:60%}.php{background:var(--php)}.javascript,.js{background:var(--javascript)}.springboot{background:var(--springboot)}.nodejs,.node{background:var(--nodejs)}.mysql{background:var(--mysql)}.mongodb{background:var(--mongodb)}.react{background:var(--react)}.html{background:var(--html)}.css{background:var(--css)}.bootstrap{background:var(--bootstrap)}.tailwind{background:var(--tailwind)}.zustand{background:var(--zustand)}.cloudinary{background:var(--cloudinary)}.python{background:var(--python)}.expand-card{padding:20px;backdrop-filter:blur(5px);background-color:var(--color-backdrop);border-radius:20px;width:100%;max-width:600px;max-height:90vh;position:fixed;left:50%;top:50%;translate:-50% -50%;overflow-y:auto;overflow-x:hidden;z-index:99}.expand-card::-webkit-scrollbar{background-color:var(--color-backdrop);border-radius:0 20px 20px 0}.expand-card h5{font-size:32px;font-weight:600;margin-bottom:10px;font-family:var(--font-secondary)}.content-main-info>p{font-size:16px;font-weight:400;font-family:var(--font-secondary);margin:0;text-align:justify}.expand-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px}.backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:95;opacity:1}.header-expand{display:flex;align-items:start;justify-content:space-between}.button-close{background-color:var(--hover-card);cursor:pointer;width:fit-content;display:flex;align-items:center;justify-content:center;padding:5px 10px;font-size:14px;font-weight:600;border-radius:50%;opacity:.6;border:none;transition:opacity .3s ease}.button-close:hover{opacity:1}.image-content-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.content-main-info{display:flex;flex-direction:column;align-items:start;justify-content:space-between;gap:20px}.url-links-expand{display:flex;flex-direction:row;align-items:start;justify-content:center;gap:40px}.tags-expand{display:flex;flex-direction:row;align-items:center;justify-content:start;gap:5px;font-size:14px;flex-wrap:wrap}.tags-expand p{margin:0;font-size:14px;padding:3px 9px;background-color:var(--hover-card);border-radius:.2rem}.date-expand{font-size:12px!important}.indications-list{display:flex;flex-direction:column;gap:3px;font-family:var(--font-secondary);font-weight:500}@media (min-width: 768px){.image-content-container{flex-direction:column;align-items:center}.expand-card img{width:100%}.expand-card{width:93%}}@media (min-width: 1024px){.content-main-info>p{font-size:18px}.expand-card img{width:100%}}.indication{font-size:14px!important;font-family:var(--font-secondary);font-weight:400}.porject-container{max-width:1200px;margin:auto;display:grid;place-items:center;width:100%;padding:40px 20px;min-height:100vh}.container-skills{display:grid;place-items:center;max-width:1200px;margin:auto;min-height:90vh}.content-skills{width:100%}.container-main-skills{padding:20px}.content-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;width:100%}.container-skills h2{font-size:32px;font-weight:700;margin-bottom:20px;width:100%}.list-skills{display:flex;flex-direction:column;gap:6px}.list-skills svg{width:80px}.list-skills-content{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.list-skills-content .list-skills-item{display:flex;align-items:center;flex-direction:column;gap:2px;position:relative;font-weight:500;padding:5px}.list-skills-content .list-skills-item:before,.list-skills-content .list-skills-item:after{content:"";width:100%;left:0;top:0;position:absolute;height:100%;border-top:2px solid}.list-skills-content .list-skills-item:after{opacity:.3;transition:opacity .3s ease-in-out}.list-skills-content .list-skills-item:hover:after{opacity:.6}.HTML{color:var(--html)}.HTML:after,.HTML:before{border-color:var(--html)}.HTML:after{background:linear-gradient(to bottom,var(--html) 0%,transparent)}.NODEJS{color:var(--nodejs)}.NODEJS:after,.NODEJS:before{border-color:var(--nodejs)}.NODEJS:after{background:linear-gradient(to bottom,var(--nodejs) 0%,transparent)}.JAVASCRIPT{color:var(--javascript)}.JAVASCRIPT:after,.JAVASCRIPT:before{border-color:var(--javascript)}.JAVASCRIPT:after{background:linear-gradient(to bottom,var(--javascript) 0%,transparent)}.CSS{color:var(--css)}.CSS:after,.CSS:before{border-color:var(--css)}.CSS:after{background:linear-gradient(to bottom,var(--css) 0%,transparent)}.TAILWIND{color:var(--tailwind)}.TAILWIND:after,.TAILWIND:before{border-color:var(--tailwind)}.TAILWIND:after{background:linear-gradient(to bottom,var(--tailwind) 0%,transparent)}.REACT{color:var(--react)}.REACT:after,.REACT:before{border-color:var(--react)}.REACT:after{background:linear-gradient(to bottom,var(--react) 0%,transparent)}.GIT{color:var(--git)}.GIT:after,.GIT:before{border-color:var(--git)}.GIT:after{background:linear-gradient(to bottom,var(--git) 0%,transparent)}.GITHUB{color:var(--github);fill:var(--github)}.GITHUB:after,.GITHUB:before{border-color:var(--github)}.GITHUB:after{background:linear-gradient(to bottom,var(--github) 0%,transparent)}.MYSQL{color:var(--mysql)}.MYSQL:after,.MYSQL:before{border-color:var(--mysql)}.MYSQL:after{background:linear-gradient(to bottom,var(--mysql) 0%,transparent)}.MARIADB{color:var(--mariadb)}.MARIADB:after,.MARIADB:before{border-color:var(--mariadb)}.MARIADB:after{background:linear-gradient(to bottom,var(--mariadb) 0%,transparent)}.MONGODB{color:var(--mongodb)}.MONGODB:after,.MONGODB:before{border-color:var(--mongodb)}.MONGODB:after{background:linear-gradient(to bottom,var(--mongodb) 0%,transparent)}.FIREBASE{color:var(--firebase)}.FIREBASE:after,.FIREBASE:before{border-color:var(--firebase)}.FIREBASE:after{background:linear-gradient(to bottom,var(--firebase) 0%,transparent)}.SPRINGBOOT{color:var(--springboot)}.SPRINGBOOT:after,.SPRINGBOOT:before{border-color:var(--springboot)}.SPRINGBOOT:after{background:linear-gradient(to bottom,var(--springboot) 0%,transparent)}.PYTHON{color:var(--python)}.PYTHON:after,.PYTHON:before{border-color:var(--python)}.PYTHON:after{background:linear-gradient(to bottom,var(--python) 0%,transparent)}.NEXTJS{color:var(--nextjs)}.NEXTJS:after,.NEXTJS:before{border-color:var(--nextjs)}.NEXTJS:after{background:linear-gradient(to bottom,var(--nextjs) 0%,transparent)}body{background:var(--background-color);color:var(--color-words-primary);min-height:100vh;position:relative;overflow-x:hidden}body::-webkit-scrollbar{width:5px;background:var(--background-color)}body::-webkit-scrollbar-thumb{background:var(--scroll-color);border-radius:10px}.bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-position:left;opacity:.09;object-fit:cover}.icon{position:fixed;left:15px;bottom:15px;padding:6px;border-radius:50%;aspect-ratio:1/1;background-color:var(--color-backdrop);display:flex;align-items:center;justify-content:center;box-shadow:0 0 8px 0 var(--color-backdrop-invert);cursor:pointer;z-index:4}.navegation{background-color:var(--color-backdrop);padding:20px}.icon>svg{fill:var(--color-words-primary);width:33px}@media (min-width: 768px){.icon,.navegation{display:none}main{display:flex;align-items:stretch}header{background:var(--color-backdrop);width:fit-content;position:relative;width:min(100%,270px)}.route-style{width:100%}}.icon-menu{display:flex;align-items:center;flex-direction:column;justify-content:center;padding:8px;aspect-ratio:1/1;gap:5px;background-color:var(--color-backdrop);border-radius:50%;box-shadow:0 0 10px var(--color-backdrop-invert);cursor:pointer;position:fixed;bottom:15px;right:15px;z-index:90}.icon-menu div{width:28px;height:2px;background-color:var(--color-words-primary);border-radius:2px;transition:.3s ease-in-out}.icon-menu.open div:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.icon-menu.open div:nth-child(2){opacity:0}.icon-menu.open div:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}@media (min-width: 768px){.icon-menu{display:none}}.navigation-mobile{display:flex;position:fixed;right:15px;bottom:70px;z-index:4}.navigation-mobile ul{padding:5px;border-radius:10px;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:5px}.navigation-mobile ul li{padding:5px 10px;border-radius:5px;background-color:var(--color-hover-backdrop)}@media (min-width: 768px){.navigation-mobile{display:none}}:root{--background-color: radial-gradient(circle, rgba(193, 193, 193, .575) 0%, rgba(224, 224, 255, .582) 100%);--color-backdrop-invert: #2727274b;--color-backdrop: rgb(255, 255, 255);--color-hover-backdrop: rgba(207, 205, 205, .342);--font-color-primary: #cfa006;--extra-large: 1200px;--large: 1024px;--medium: 768px;--small: 480px;--color-words-primary: #1a1a1a;--font-primary: "Chillax", sans-serif;--font-secondary: "General Sans", sans-serif;--gradient: linear-gradient(150deg, #272727 0%, #474747 10%, #c2c2c2 100%);--border-color: rgb(207, 205, 205);--hover-card: rgba(66, 66, 66, .185);--color-circle-light: rgb(44, 44, 44);--light-color: rgba(255, 255, 255, .39);--scroll-color: rgba(0, 0, 0, .301);--php: #8993be;--javascript: #f7df1e;--springboot: #6db33f;--nodejs: #83cd29;--mysql: #4479a1;--mongodb: #47a248;--react: #61dafb;--html: #e34c26;--css: #264de4;--bootstrap: #563d7c;--tailwind: #38b2ac;--git: #f34f29;--github: #181717;--mariadb: #004d64;--firebase: #ffae00;--cloudinary: #f7f7f7;--zustand: #ffae00;--python: #3776ab;--python: #237455;--nextjs: #245663}*{box-sizing:border-box;margin:0;padding:0;font-family:var(--font-primary)}.dark-mode{--background-color: radial-gradient(circle, rgba(42,42,42,1) 0%, rgba(18,18,18,1) 100%);--color-words-primary: rgb(244, 253, 255);--font-color-primary: #eeb702;--color-backdrop-invert: rgba(255, 255, 255, .103);--color-hover-backdrop: rgba(94, 92, 92, .342);--color-backdrop: #333333;--gradient: linear-gradient(90deg, #3838383a 0%, #50505023 100%);--border-color: rgba(51, 51, 51, .993);--hover-card: rgba(199, 199, 199, .116);--color-circle-light: rgba(255, 255, 255, .404);--light-color: rgba(255, 255, 255, .034);--scroll-color: rgba(255, 255, 255, .301);--github: #dddddd}
