:root{--black-color: #080808;--white-color: #ffffff;--grey-color: #777777;--lightgrey-color: #bebebe;--font-size-small-mobile: 10px;--font-size-mobile: 11px;--font-size-tablet: 12px;--font-size-laptop: 14px;--font-size-desktop: 16px;--font-size-large-desktop: 18px;--font-size-huge-desktop: 26px}*{margin:0;padding:0;box-sizing:border-box;font-family:Comfortaa,sans-serif;letter-spacing:.1rem;scroll-behavior:smooth;text-align:center}html,body{height:100%;width:100%;background-color:var(--white-color)}::-webkit-scrollbar{display:none}h2{font-size:2.4rem}p,li{font-size:1.2rem}a{text-decoration:none}h1,h2,h3{font-family:"Exo 2",sans-serif}html{font-size:var(--font-size-small-mobile)}@media (min-width: 425px){html{font-size:var(--font-size-mobile)}}@media (min-width: 600px){html{font-size:var(--font-size-tablet)}}@media (min-width: 1240px){html{font-size:var(--font-size-laptop)}}@media (min-width: 1400px){html{font-size:var(--font-size-desktop)}}@media (min-width: 1900px){html{font-size:var(--font-size-large-desktop)}}@media (min-width: 2500px){html{font-size:var(--font-size-huge-desktop)}}.px5p{padding:0 5%}header{position:fixed;top:0;left:0;background-color:var(--black-color);width:100%;padding:0 5%;display:flex;align-items:center;justify-content:space-between;z-index:100}header .wave-nav{position:absolute;top:80%;width:100%;left:0;transform:rotate(-180deg)}header .left-nav{display:flex;align-items:center}header .left-nav:before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--black-color);z-index:-1}header .left-nav nav a{font-size:1rem;color:var(--white-color);margin-left:3.5rem}header .left-nav .home{font-size:2.3rem;color:var(--white-color);display:flex;align-items:center;padding:.1rem;margin:.7rem;position:relative;transition:.3s ease;border-radius:50%}header .left-nav .home:hover{outline:1px solid var(--white-color);animation:outline-animation .6s ease forwards}@keyframes outline-animation{0%{padding:.1rem;margin:.7rem}50%{padding:.5rem;margin:.3rem}to{padding:.3rem;margin:.5rem}}header .icons{position:absolute;right:5%;font-size:2.5rem;color:var(--white-color);cursor:pointer;display:none}header .icons .bars path,header .icons .close path{color:var(--white-color)}header #check{display:none}header .left-nav nav a,header .modes button{position:relative}header .left-nav nav a:after,header .modes button:after{content:"";position:absolute;bottom:-.2rem;left:0;width:0;height:2px;background-color:var(--white-color);transition:width .3s ease-in-out}header .left-nav nav a:hover:after,header .modes button:hover:after{width:100%}@media (max-width: 768px){header .icons{display:inline-flex}header .left-nav nav{position:absolute;top:100%;left:0;width:100%;height:0;background-color:var(--black-color);transition:.3s ease;overflow:hidden;display:flex;flex-direction:column;justify-content:center;row-gap:2.5rem}header .left-nav nav a{display:block;align-self:center;width:fit-content;margin:2rem 0;transform:translateY(-50px);transition:.3s ease;opacity:0}header .left-nav nav a:after{bottom:-.5rem}header #close-icon{display:none}header #check:checked~.icons #menu-icon{display:none}header #check:checked~.icons #close-icon{display:block}header #check:checked~.left-nav nav{height:100vh}header #check:checked~.left-nav nav a{transform:translateY(0);opacity:1;transition-delay:calc(.15s * var(--i))}}@media (min-width: 1000px){header .wave-nav{top:40%}}@media (min-width: 1200px){header .wave-nav{top:35%}}.section-about-me{margin-top:3.9rem;width:100%}.section-about-me .container-intro{display:grid;justify-content:center;grid-template-areas:"profile title";width:100%;height:calc(100vh - 3.9rem);column-gap:2rem;padding:0 5%}.section-about-me .container-intro .container-arrow{position:absolute;top:calc(100vh - 3.9rem);font-size:2rem;width:calc(100vw - 10%);display:flex;justify-content:center}.section-about-me .container-intro .container-arrow .arrow path{color:var(--grey-color)}.section-about-me .container-intro .info{display:flex;flex-direction:column;align-items:center;row-gap:1.5rem;height:calc(100vh - 3.9rem);justify-content:center;grid-area:title}.section-about-me .container-intro .info h1{font-size:1.8rem}.section-about-me .container-intro .info h2{font-size:2.5rem}.section-about-me .container-intro .info .cv-download{width:fit-content;display:flex;justify-content:center;align-items:flex-end;color:var(--black-color);column-gap:1rem;position:relative}.section-about-me .container-intro .info .cv-download:after{content:"";position:absolute;bottom:-.4rem;left:0;width:0;height:2px;background-color:var(--black-color);transition:width .3s ease-in-out}.section-about-me .container-intro .info .cv-download:hover:after{width:100%}.section-about-me .container-intro .info .cv-download .cv-icon{font-size:1.5rem}.section-about-me .container-intro .container-profile-photo{height:calc(100vh - 3.9rem);display:flex;align-items:center;grid-area:profile}.section-about-me .container-about{display:grid;margin-top:-20%;grid-template-areas:"nothing hands" "about computer"}.section-about-me .container-about .container-hands{grid-area:hands}.section-about-me .container-about .container-hands .hands{height:60rem}.section-about-me .container-about .container-computer{grid-area:computer}.section-about-me .container-about .container-computer .computer{height:25rem}.section-about-me .container-about .about{grid-area:about;width:90%;display:flex;flex-direction:column;justify-content:center;padding-left:20%;position:relative;line-height:1.7}.section-about-me .container-about .about h2{padding-bottom:2rem}.section-about-me .container-about .about p{font-size:1rem}.section-about-me .container-about .about .position{height:1rem;width:1rem;position:absolute;top:-15vh;left:0}@media (max-width: 700px){.section-about-me{overflow:hidden;padding-bottom:5rem}.section-about-me .container-intro{grid-template-areas:"profile " "title ";width:100%;justify-items:center;align-content:center;row-gap:2rem;padding:0 5%}.section-about-me .container-intro .container-arrow{top:calc(100vh - 8%)}.section-about-me .container-intro .info{height:fit-content;justify-content:center;grid-area:title}.section-about-me .container-intro .info h2{font-size:2.3rem}.section-about-me .container-intro .container-profile-photo{height:fit-content;display:flex;align-items:center;align-self:center;grid-area:profile}.section-about-me .container-about{display:grid;grid-template-areas:"hands" "computer" "about";margin-top:0%;width:100%}.section-about-me .container-about .container-hands .container-reveal{display:flex;justify-content:flex-end}.section-about-me .container-about .container-hands .container-reveal .hands{width:90%;height:auto}.section-about-me .container-about .computer{margin:2rem 0;justify-self:center}.section-about-me .container-about .about{padding-left:0;justify-self:center}.section-about-me .container-about .about p{font-size:1.2rem}.section-about-me .container-about .about .position{top:-50vh;left:0}}@media (min-width: 1000px){.container-computer{display:flex;align-items:start}}.profile-flip{display:flex;justify-content:center;align-items:center;height:18rem;position:relative;width:18rem;transform-style:preserve-3d;perspective:1000px}.profile-flip:hover{cursor:pointer}.profile-flip img{height:17.5rem;position:absolute;backface-visibility:hidden;transition:1s}.profile-flip img:nth-child(2){transform:rotateY(180deg)}.profile-flip:hover img:nth-child(2){transform:rotateY(0)}.profile-flip:hover img:nth-child(1){transform:rotateY(-180deg)}.rotate img:nth-child(2){transform:rotateY(180deg)}.rotate img:nth-child(2){transform:rotateY(0)}.rotate img:nth-child(1){transform:rotateY(-180deg)}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.animate-bounce{animation:bounce 1.5s ease-in-out infinite}.section-all-projects{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - 3.9rem);margin-top:3.9rem}.section-all-projects h2{margin-top:4rem;padding-bottom:4rem}.section-all-projects .container{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.container-project-card{width:100%;height:22rem;width:18rem;display:flex;justify-content:center;align-items:center}.container-project-card:hover .project-card{height:100%;width:100%;transition:.5s;box-shadow:0 1.5rem 2rem -1rem var(--grey-color)}.container-project-card .project-card{height:95%;width:95%;box-shadow:0 1rem 1rem -.6rem var(--grey-color);display:flex;justify-content:center;align-items:center;border-radius:.3rem;animation:bounce 1.5s ease-in-out infinite}.container-project-card .project-card .project-inside{height:95%;width:95%;display:flex;flex-direction:column;align-items:center}.container-project-card .project-card .project-inside:hover .show-button{transition:.4s;background-color:var(--black-color);color:var(--white-color);border:1px solid var(--white-color);cursor:pointer}.container-project-card .project-card .project-inside .project-photo{height:45%;width:100%;background-repeat:no-repeat;background-size:cover;border-radius:.4rem;background-position:center}.container-project-card .project-card .project-inside .project-info{display:flex;flex-direction:column;justify-content:center;align-items:center;height:55%;row-gap:.8rem}.container-project-card .project-card .project-inside .project-info h3{font-size:1rem;padding-top:2rem}.container-project-card .project-card .project-inside .project-info p{font-size:.8rem}.container-project-card .project-card .project-inside .project-info .project-icons{display:flex;column-gap:1rem;font-size:1.5rem}.container-project-card .project-card .project-inside .project-info .project-icons path{color:var(--black-color)}.container-project-card .project-card .project-inside .project-info .project-icons .project-icon:hover path{color:var(--grey-color)}.container-project-card .project-card .project-inside .show-button{outline:none;background-color:var(--white-color);color:var(--black-color);border:1px solid var(--black-color);border-radius:.2rem;padding:.5rem .8rem;font-size:.8rem}footer{background-color:var(--black-color);color:var(--white-color);padding:2rem 0;display:flex;justify-content:center;align-items:center;column-gap:1.5rem}footer .quote{font-family:Rajdhani,sans-serif}.section-technologies{display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden;padding-bottom:15rem}.section-technologies .tech-wave-ilustration{width:100vw;height:auto}.section-technologies h2{padding-bottom:4rem}.section-technologies .container{position:relative;width:80%;display:flex;flex-wrap:wrap;justify-content:center;gap:2.5rem;padding-bottom:7%}.section-technologies .container .position{height:1rem;width:1rem;position:absolute;top:-35vh;left:50}.section-technologies .container .hands-ilustration{position:absolute;top:110%;left:50%;transform:translate(-50%,-50%);width:100vw;height:auto}.section-technologies .container .container-techs{display:flex;flex-wrap:wrap;justify-content:center;gap:2.5rem;padding:1.5rem 0 3rem}.section-technologies .container .container-techs p{font-size:.9rem}@media (max-width: 768px){.section-technologies .tech-wave-ilustration{width:auto;height:22rem;padding-bottom:0rem}.section-technologies .container{width:90%}.section-technologies .container .hands-ilustration{position:absolute;top:110%;left:50%;transform:translate(-50%,-50%);width:auto;height:30%}}.technology-icon{font-size:4rem;animation:bounce 1.5s ease-in-out infinite;position:relative;cursor:pointer}.technology-icon:hover .technology-name{opacity:1}.technology-icon .icon-container{font-size:4rem;cursor:pointer;position:relative;display:flex;align-items:center}.technology-icon .icon-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;opacity:0;transition:opacity .3s ease}.technology-icon .icon-container:hover:before{opacity:1}.technology-icon .technology-name{position:absolute;top:100%;left:50%;transform:translate(-50%);z-index:1;opacity:0;transition:opacity .3s ease}.projects{padding-top:2rem;display:flex;flex-direction:column;justify-content:center;position:relative;padding-bottom:15%}.projects h2{padding-bottom:4rem}.projects .wave-projects{position:absolute;bottom:0;left:0;z-index:-40}.projects .container-projects{gap:.5rem;padding-bottom:2rem;display:flex;flex-wrap:wrap;justify-content:space-evenly;align-items:center}.projects .more-projects{outline:none;border:1px solid var(--white-color);background-color:var(--black-color);color:var(--white-color);padding:.6rem 1rem;border-radius:.2rem;font-size:1rem;width:fit-content;align-self:center;margin-top:2rem;z-index:1}.projects .more-projects:hover{border:1px solid var(--black-color);background-color:var(--white-color);color:var(--black-color);transition:.4s;cursor:pointer}@media (max-width: 425px){.projects .container-projects{flex-direction:column;flex-wrap:nowrap;align-items:center}}@media (max-width: 600px){.projects{padding-bottom:10rem}}.section-education{padding:15% 5% 5rem;width:100%;position:relative}.section-education .position{height:1rem;width:1rem;position:absolute;top:-5vh;left:50}.section-education .wave-education{position:absolute;top:0;left:0;transform:rotate(-180deg);margin-top:-1rem}.section-education h2{padding-bottom:4rem}.section-education .container-cards{max-width:100%}.section-education .container-cards .card{padding:1rem 0;text-align:start;border-radius:.5rem;width:100%}.section-education .container-cards .card .text-box{-webkit-box-shadow:inset 5px 5px 25px -1px rgba(0,0,0,.27);-moz-box-shadow:inset 5px 5px 25px -1px rgba(0,0,0,.27);box-shadow:inset 5px 5px 25px -1px #00000045;width:100%;padding:2rem 1rem;border-radius:.5rem}.section-education .container-cards .card .text-box:hover{-webkit-box-shadow:inset 5px 5px 25px 4px rgba(0,0,0,.27);-moz-box-shadow:inset 5px 5px 25px 4px rgba(0,0,0,.27);box-shadow:inset 5px 5px 25px 4px #00000045;cursor:pointer}.section-education .container-cards .card .text-box ul{display:flex;flex-direction:column;row-gap:1.1rem}.section-education .container-cards .card .text-box ul li{list-style:none;font-size:.85rem}.section-education .container-cards .card .text-box .education-title{display:flex;align-items:center;justify-content:center;column-gap:1rem;padding-bottom:1.5rem}@media (min-width: 700px){.section-education .position{top:5vh;left:50}.section-education .container-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}.section-education .container-cards .card{width:25rem}.section-education .container-cards .card .text-box{min-height:15rem}}.section-contact .wave-contact{margin-bottom:-1rem}.section-contact .contact{min-height:45vh;background-color:var(--black-color);color:var(--white-color);display:flex;flex-direction:column;justify-content:center}.section-contact .contact h2{padding-bottom:4rem}.section-contact .contact .content{width:50%;align-self:center}.section-contact .contact .content p{padding-bottom:1.5rem}.section-contact .contact .content .contact-icons{display:flex;align-items:center;justify-content:center;column-gap:1rem}.section-contact .contact .content .contact-icons .contact-icon{cursor:pointer;position:relative;color:var(--white-color);font-size:2rem}.section-contact .contact .content .contact-icons .contact-icon:after{content:"";position:absolute;bottom:-.2rem;left:0;width:0;height:2px;background-color:var(--white-color);transition:width .3s ease-in-out}.section-contact .contact .content .contact-icons .contact-icon:hover:after{width:100%}.section-project{margin-top:3.9rem;width:100%;min-height:calc(100vh - 3.9rem);padding:0 5% 5rem}.section-project h2{padding:4rem 0}.section-project .container{display:flex;flex-direction:column;row-gap:4rem}.section-project .container .principal-view,.section-project .container .secondary-view{width:100%;height:auto;border-radius:1rem;box-shadow:#26394d 0 1rem 3rem -1rem}.section-project .container .secondary-description h3{padding-bottom:2rem;font-size:1.8rem}.section-project .container .secondary-description ul{display:flex;flex-direction:column;row-gap:1rem;list-style-type:circle}.section-project .container .container-img{padding:2.5rem}.section-project .container .container-mobile .mobile-view{width:50%;max-height:70vh;box-shadow:#26394d 0 1rem 3rem -1rem;border-radius:1rem}.section-project .container .container-rol .text{display:flex;flex-direction:column;justify-content:space-evenly;padding:0 1rem}.section-project .container .container-rol .text .date{font-size:3rem;text-transform:uppercase;font-family:Rajdhani,sans-serif;padding-bottom:1rem}.section-project .container .container-rol .links h3{font-size:1.5rem;padding:1.5rem 0}.section-project .container .container-rol .links .icons{display:flex;justify-content:center;column-gap:2rem;padding:1rem}.section-project .container .container-rol .links .icons .links-icon{font-size:2rem;color:var(--black-color);cursor:pointer;position:relative}.section-project .container .container-rol .links .icons .links-icon:after{content:"";position:absolute;bottom:-.2rem;left:0;width:0;height:2px;background-color:var(--black-color);transition:width .3s ease-in-out}.section-project .container .container-rol .links .icons .links-icon:hover:after{width:100%}.section-project .container .technologies-used h3{padding-bottom:3rem;font-size:1.8rem}.section-project .container .technologies-used .container-technologies{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2rem;padding:1rem 0}.section-project .container .technologies-used .container-technologies .icon-container{font-size:3rem}@media (min-width: 700px){.section-project h2{padding:4rem 0}.section-project .container{display:grid;grid-template-areas:"principal_view description" "secondary_description secondary_view " "mobile_rol mobile_rol" "technologies technologies";align-items:center;justify-content:center;column-gap:2rem;row-gap:7rem}.section-project .container .principal-view{grid-area:principal_view}.section-project .container .description{grid-area:description}.section-project .container .secondary-view{grid-area:secondary_description}.section-project .container .secondary-view{grid-area:secondary_view}.section-project .container .container-mobile-rol{grid-area:mobile_rol}.section-project .container .technologies-used{grid-area:technologies}.section-project .container .description{width:80%}.section-project .container .container-mobile-rol{display:flex;justify-content:center;align-items:center;justify-self:center;column-gap:2rem;width:70%}.section-project .container .container-mobile-rol .container-mobile .mobile-view{width:auto;height:85vh}.section-project .container .container-mobile-rol .container-rol{column-width:2fr;grid-row:2fr}.section-project .container .container-mobile-rol .container-rol .text{height:85vh;display:flex;flex-direction:column;justify-content:space-evenly;padding:0}.section-project .container .technologies-used .container-technologies{padding:1.5rem 0}}
