*{box-sizing:border-box;font-family:Titillium Web,sans-serif;margin:0;padding:0}#app{display:flex;flex-direction:column;min-height:100vh;overflow:hidden;overflow-y:auto;position:relative;-webkit-user-select:none;user-select:none;width:100%;z-index:0}#app .flex1{flex:1 1}#app.dark{background-color:#0c0c0c}.container{align-items:center;display:flex;justify-content:space-between;margin:8vh auto;padding-inline:5vw;width:100%}#container{height:91%;margin:0 auto;position:relative;width:80%}#background-text{display:flex;flex-direction:column;gap:1rem;height:80%;justify-content:center;position:absolute;-webkit-transform:translateX(10%);transform:translateX(10%);width:100%;z-index:-1}#background-text h1,#background-text p{color:rgba(0,0,0,.05);font-size:6rem;font-weight:700;text-transform:uppercase;-webkit-transform:translateX(-1%) translateY(-10%);transform:translateX(-1%) translateY(-10%);width:100%}#background-text p{-webkit-transform:translateY(-60%) translateX(-1%);transform:translateY(-60%) translateX(-1%)}#home{align-items:center;display:flex;height:80vh;justify-content:space-between;margin:auto;width:90%}#home #home-content{display:flex;flex-direction:column;gap:1rem;width:100%}#home #home-content .heading .heading-text{font-family:Josefin Sans,sans-serif;font-size:3rem;font-weight:700}#home #home-content .heading .background-text{font-size:5.3rem;left:-1.5%;top:-25%}#home #home-content .buttons-container .link{border-radius:0;border-radius:initial;font-size:1rem;margin-top:2rem;text-transform:uppercase}#home #home-content .buttons-container .link.dark{color:#171717}#home #home-content .buttons-container .link.dark:hover{-webkit-animation:outlineAnimation .7s forwards;animation:outlineAnimation .7s forwards}#home #home-content .buttons-container .link:hover{-webkit-animation:outlineAnimation .5s forwards;animation:outlineAnimation .5s forwards;-webkit-transform:none;-webkit-transform:initial;transform:none}#home .img-container{align-items:center;display:flex;justify-content:center;width:40%}#home .img-container img{width:100%}#home img{border-radius:5px;width:20%}.buttons-container{align-items:center;display:flex;gap:2rem}.buttons-container .link{background-color:#fff;border:2px solid #000;color:#000;font-size:1.05rem;font-weight:600;padding:.3em 1em;text-align:center;text-decoration:none;transition:-webkit-transform .1s;transition:transform .1s;transition:transform .1s,-webkit-transform .1s}.buttons-container .link.dark{background-color:#fff;color:#fafafa}.buttons-container .link:active{color:#000}.buttons-container .link:hover{color:rgba(0,0,0,.5);-webkit-transform:translateY(-5%);transform:translateY(-5%)}@-webkit-keyframes outlineAnimation{0%{outline:none}50%{background-color:rgba(0,0,0,.8);color:#fff;outline:15px solid rgba(0,0,0,.05)}to{background-color:rgba(0,0,0,.8);color:#fff;outline:20px solid transparent}}@keyframes outlineAnimation{0%{outline:none}50%{background-color:rgba(0,0,0,.8);color:#fff;outline:15px solid rgba(0,0,0,.05)}to{background-color:rgba(0,0,0,.8);color:#fff;outline:20px solid transparent}}@media screen and (min-width:1025px)and (max-width:1440px){#container{overflow:hidden}#home{height:100vh;overflow:visible;width:95%}}@media screen and (min-width:851px)and (max-width:1024px){#container{overflow:hidden;width:90%}#home{flex-direction:column;height:100vh;justify-content:center;overflow:visible;overflow:hidden;width:90%}#home #home-content{order:2}#home img{bottom:52%;order:1;position:absolute;right:10%}}@media screen and (max-width:850px){#container{width:98%}#home{flex-direction:column;height:80vh;justify-content:center;margin-top:20vh;overflow:visible;overflow:hidden;width:90%}#home #home-content .heading{align-items:center;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;justify-content:center;margin-bottom:1.5rem}#home #home-content .heading .background-text{font-size:15vw;text-align:center;top:-130%}#home #home-content .heading .heading-text{font-size:7vw;white-space:normal}#home #home-content .buttons-container{margin:0 auto}#home img{bottom:50vh;order:1;position:absolute;top:15%;width:200px}}.heading{align-items:center;display:flex;height:6rem;overflow:visible;position:relative;text-align:left;width:100%}.heading .heading-text{color:#000;font-size:2.5rem;font-weight:700;white-space:nowrap}.heading .heading-text.dark{color:#fafafa}.heading .background-text{color:rgba(0,0,0,.05);font-size:5rem;font-weight:700;left:-3%;position:absolute;text-transform:uppercase;white-space:nowrap;width:100%;z-index:-1}.heading .background-text.dark{color:hsla(0,0%,100%,.05)}#about{align-items:center;display:flex;flex-direction:column;justify-content:space-between;width:100%}#about.container{align-items:flex-start;padding:0 3vw}#about .heading{left:3%;margin-bottom:2rem}#about #aboutContent{display:flex;justify-content:space-between;width:100%}#about #aboutText{display:flex;flex-direction:column;gap:1em;margin-bottom:2rem;position:relative;width:40%}#about #aboutText.dark{color:hsla(0,0%,100%,.5)}#about #aboutText h1{font-size:2rem}#about #aboutText p{width:100%}#about #aboutText p span{font-weight:700}#about #aboutText .buttons-container{margin-top:1rem}#about #aboutText .buttons-container a{background-color:rgba(0,0,0,.05)}#about #aboutText .buttons-container a.dark{background-color:#fff;border-color:#fafafa;color:#171717}#about #aboutText .buttons-container #resume{align-items:center;background-color:rgba(0,0,0,.8);border:2px solid #135fec;color:#fff;cursor:pointer;display:flex;font-family:Titillium Web,sans-serif;font-size:1.1rem;font-weight:700;gap:.8em;justify-content:center;padding:.1em .5em;text-align:center;transition:background-color .1s;width:70%}#about #aboutText .buttons-container #resume .icon{font-size:1.3rem}#about #aboutText .buttons-container #resume:hover{background-color:rgba(19,95,236,.85)}#about #images-techStack{align-items:center;display:flex;flex-direction:column;justify-content:space-between;-webkit-transform:translateY(-10%);transform:translateY(-10%);width:50%}#about #images-techStack #tech-stack{display:flex;flex-direction:column;justify-content:center;width:100%}#about #images-techStack #tech-stack .stack{display:flex;flex-wrap:wrap;gap:1em;grid-template-columns:repeat(4,1fr);justify-content:center;width:100%}#about #images-techStack #tech-stack .stack .tech{align-items:center;background-color:rgba(0,0,0,.03);border-radius:5px;display:flex;flex-direction:column;justify-content:space-between;padding:.5em .3em;text-align:center;transition:-webkit-transform .1s;transition:transform .1s;transition:transform .1s,-webkit-transform .1s;width:15%}#about #images-techStack #tech-stack .stack .tech.dark{background-color:hsla(0,0%,100%,.95)}#about #images-techStack #tech-stack .stack .tech img{width:40px}#about #images-techStack #tech-stack .stack .tech span{color:rgba(0,0,0,.7);font-weight:600}#about .images-container{aspect-ratio:1/1;display:flex;justify-content:center;position:relative;width:50%}#about .img-container{align-items:center;border-radius:5px;box-shadow:0 0 20px rgba(0,0,0,.3);display:flex;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;justify-content:center;overflow:hidden;position:absolute;width:70%}#about .img-container.animate{-webkit-animation:scaleImg .3s forwards;animation:scaleImg .3s forwards}#about .img-container img{width:100%}#about .img-container:nth-child(2){box-shadow:none;scale:.9;-webkit-transform:rotate(20deg);transform:rotate(20deg);z-index:-1}#about .img-container:nth-child(3){box-shadow:none;scale:.9;-webkit-transform:rotate(30deg);transform:rotate(30deg);z-index:-2}@-webkit-keyframes scaleImg{0%{opacity:0;scale:.9}to{opacity:1;scale:1;z-index:0}}@keyframes scaleImg{0%{opacity:0;scale:.9}to{opacity:1;scale:1;z-index:0}}@media screen and (min-width:1281px){#app{overflow-y:auto}#container{width:75%}#aboutContainer{width:100%}#about{flex-direction:column;gap:2rem}#about.container{gap:0;margin-bottom:2rem;padding-inline:0;width:100%}#about #aboutContent{flex-direction:row;justify-content:space-between}#about #aboutText{max-width:600px;width:45%}#about #aboutText p{font-size:1.05rem;text-align:left}#about #aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:space-between;margin:1.5rem 0}#about #aboutText .buttons-container a{font-size:1.05rem;width:48%}#about #aboutText .buttons-container #resume{flex-grow:1}#about #images-techStack{gap:3rem;justify-content:center;margin-bottom:0;-webkit-transform:translateY(-15%);transform:translateY(-15%);width:45%}#about #images-techStack .images-container{align-items:center;justify-content:center;margin:2rem auto;max-width:350px;width:70%}#about #images-techStack .images-container .img-container{width:80%}#about #images-techStack #tech-stack{width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{max-width:100px;width:22%}}@media screen and (min-width:1025px)and (max-width:1280px){#app{overflow-y:auto}#container{width:85%}#aboutContainer{width:100%}#about{flex-direction:column;gap:2rem}#about.container{margin-bottom:2rem;padding-inline:0;width:100%}#about #aboutContent{flex-direction:row;justify-content:space-between}#about #aboutText{width:50%}#about #aboutText p{font-size:1.05rem;text-align:left}#about #aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:space-between;margin:1.5rem 0}#about #aboutText .buttons-container a{font-size:1.05rem;width:48%}#about #aboutText .buttons-container #resume{flex-grow:1}#about #images-techStack{gap:3rem;justify-content:normal;margin-bottom:0;-webkit-transform:translateY(0);transform:translateY(0);width:45%}#about #images-techStack .images-container{align-items:normal;justify-content:flex-end;margin:2rem auto;max-width:350px;width:75%}#about #images-techStack .images-container .img-container{width:80%}#about #images-techStack #tech-stack{width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:30%}}@media screen and (min-width:851px)and (max-width:1024px){#app{overflow-y:auto}#about{gap:2rem}#about,#about #aboutContent{flex-direction:column}#about #aboutText{width:100%}#about #aboutText p{font-size:1.1rem;text-align:center}#about #aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:space-between;margin:1.5rem 0}#about #aboutText .buttons-container a{font-size:1.05rem;width:48%}#about #aboutText .buttons-container #resume{flex-grow:1}#about #images-techStack{gap:5rem;margin-bottom:0;-webkit-transform:translateY(0);transform:translateY(0);width:100%}#about #images-techStack .images-container{align-items:center;margin:2rem auto;max-width:350px;width:90%}#about #images-techStack .images-container .img-container{width:80%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:20%}}@media screen and (min-width:370px)and (max-width:510px){#aboutText{width:100%}#aboutText p{font-size:1.1rem;text-align:center}#aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:center;margin:3rem auto 1rem;width:100%}#aboutText .buttons-container a{font-size:1.05rem;width:49%}#aboutText .buttons-container #resume{flex-grow:1}}@media screen and (min-width:581px)and (max-width:850px){#about{gap:2rem}#about,#about #aboutContent{flex-direction:column}#about .heading{margin:2rem auto 0}#about .heading .heading-text{text-align:center;width:100%}#about .heading .background-text{text-align:center}#about #aboutText{width:100%}#about #aboutText p{font-size:1.1rem;text-align:center}#about #aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:space-between;justify-content:center;margin:1.5rem 0;width:100%}#about #aboutText .buttons-container a{font-size:1.05rem;width:48.5%}#about #aboutText .buttons-container #resume{flex-grow:1}#about .images-container{align-items:center;margin:2rem auto;max-width:350px;width:90%}#about .images-container .img-container{width:80%}#about #images-techStack{gap:1rem;margin-bottom:3rem;-webkit-transform:translateY(0);transform:translateY(0);width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:30%}}@media screen and (min-width:461px)and (max-width:580px){#about{gap:2rem}#about,#about #aboutContent{flex-direction:column}#about .heading{margin:2rem auto 0}#about .heading .heading-text{text-align:center;width:100%}#about .heading .background-text{text-align:center}#about #aboutText{width:100%}#about #aboutText p{font-size:1.1rem;text-align:center}#about #aboutText .buttons-container{flex-wrap:wrap;gap:1rem;justify-content:space-between;justify-content:center;margin:1.5rem 0;width:100%}#about #aboutText .buttons-container a{flex:1 1;font-size:1.05rem}#about #aboutText .buttons-container #resume{flex-grow:1}#about .images-container{align-items:center;margin:2rem auto;max-width:350px;width:90%}#about .images-container .img-container{width:80%}#about #images-techStack{gap:1rem;margin-bottom:3rem;-webkit-transform:translateY(0);transform:translateY(0);width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:30%}}@media screen and (min-width:371px)and (max-width:460px){#about{gap:2rem}#about,#about #aboutContent{flex-direction:column}#about .heading{margin:2rem auto 0}#about .heading .heading-text{text-align:center;width:100%}#about .heading .background-text{text-align:center}#about #aboutText{width:100%}#about #aboutText p{font-size:1.1rem;text-align:center}#about #aboutText .buttons-container{flex-direction:column;flex-wrap:wrap;gap:1rem;justify-content:space-between;justify-content:center;margin:1.5rem 0;width:100%}#about #aboutText .buttons-container a{font-size:1.05rem;width:100%}#about #aboutText .buttons-container #resume{flex-grow:1;width:100%}#about .images-container{align-items:center;margin:2rem auto;max-width:350px;width:90%}#about .images-container .img-container{width:80%}#about #images-techStack{gap:1rem;margin-bottom:3rem;-webkit-transform:translateY(0);transform:translateY(0);width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:30%}}@media screen and (max-width:370px){#about{gap:0;overflow-x:hidden}#about,#about #aboutContent{flex-direction:column}#about .heading{left:0;margin:2rem auto 0;overflow:hidden;width:100%}#about .heading .heading-text{text-align:center;width:100%}#about .heading .background-text{text-align:center}#about #aboutText{width:100%}#about #aboutText p{font-size:1.1rem;text-align:center}#about #aboutText .buttons-container{flex-direction:column;margin:3rem auto 1rem;padding:0 3%;width:100%}#about #aboutText .buttons-container a{font-size:1.2rem;width:100%}#about #aboutText .buttons-container #resume{width:100%}#about .images-container{align-items:center;margin:2rem auto;max-width:350px;width:90%}#about .images-container .img-container{width:80%}#about #images-techStack{gap:1rem;margin-bottom:3rem;-webkit-transform:translateY(0);transform:translateY(0);width:100%}#about #images-techStack #tech-stack .stack{margin-bottom:2rem}#about #images-techStack #tech-stack .stack .tech{width:45%}}#projects{flex-direction:column}#projects.container{margin:10vh 0}#projects .heading .background-text{left:-1.5%}#projects #projects-list{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:2rem;padding:2em;width:100%}#projects #projects-list .project{align-items:center;background-color:rgba(0,0,0,.05);border:2px solid #000;display:flex;flex-direction:column;width:45%}#projects #projects-list .project.dark{background-color:rgba(50,50,50,.95)}#projects #projects-list .project.dark .project-name h2{color:#fafafa}#projects #projects-list .project.dark .project-description,#projects #projects-list .project.dark .project-name span{color:hsla(0,0%,100%,.5)}#projects #projects-list .project.dark .project-tech .tech{background-color:hsla(0,0%,100%,.8)}#projects #projects-list .project .buttons-container{align-items:center;display:flex;justify-content:center;margin:0 auto 1rem;padding-inline:1em;width:100%}#projects #projects-list .project .buttons-container a{align-items:center;display:flex;gap:1em;justify-content:center;max-width:250px;white-space:nowrap;width:45%}#projects #projects-list .project .buttons-container a .icon{font-size:1.3rem}#projects #projects-list .project .project-name{align-items:center;display:flex;flex-direction:column;padding:.1em .5em;width:100%}#projects #projects-list .project .project-name h2{font-size:1.4rem}#projects #projects-list .project .project-name span{color:rgba(0,0,0,.3);font-size:1.2rem;font-style:italic;font-weight:600;margin:0 auto 1em}#projects #projects-list .project .project-description{margin:0 auto 2rem;text-align:center;width:90%}#projects #projects-list .project hr{border:1px solid rgba(0,0,0,.4);margin:0 auto 1rem;width:90%}#projects #projects-list .project .project-tech{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:.5rem;padding:.3rem 1rem;width:100%}#projects #projects-list .project .project-tech .tech{align-items:center;background-color:rgba(0,0,0,.05);border-radius:5px;display:flex;flex-direction:column;height:5rem;justify-content:space-between;min-width:15%;padding:.5em .8em}#projects #projects-list .project .project-tech .tech span{color:rgba(0,0,0,.7);font-size:.85rem;font-weight:600;text-align:center}#projects #projects-list .project .project-tech img{width:30px}#projects #moreProjects{align-items:center;background-color:rgba(0,0,0,.9);border:2px solid rgba(0,0,0,.9);color:#fff;display:flex;font-size:1.2rem;gap:1em;justify-content:center;margin-bottom:2rem;padding:.5em 1em;text-decoration:none;width:70%}#projects #moreProjects:active,#projects #moreProjects:hover{background-color:rgba(0,0,0,.8)}#projects #moreProjects .icon{font-size:1.5rem}#projects #moreProjects.dark{border:2px solid #fafafa}@media screen and (min-width:851px)and (max-width:1024px){#projects-list .project .buttons-container{gap:.5em}#projects-list .project .buttons-container .link{flex:1 1}}@media screen and (min-width:851px){#projects.container{margin:0 auto;padding:4vh 0}#projects .heading{margin:2rem auto 4rem;width:95%}#projects .heading .background-text,#projects .heading .heading-text{text-align:left;width:100%}#projects #projects-list{justify-content:center;padding:.5em}#projects #projects-list .project{flex-grow:1;justify-content:space-around;max-width:700px;width:45%}#projects #projects-list .project .project-tech{margin:0;padding:1em}#projects #projects-list .project .project-tech .tech{width:80px}}@media screen and (min-width:451px)and (max-width:850px){#projects.container{padding:0}#projects .heading{margin:0 auto;width:95%}#projects .heading .background-text,#projects .heading .heading-text{text-align:center;width:100%}#projects #projects-list{padding:.5em}#projects #projects-list .project{width:100%}#projects #projects-list .project .project-tech{margin:0;padding:1em}#projects #projects-list .project .project-tech .tech{width:80px}#projects #moreProjects{width:95%}}@media screen and (max-width:450px){#projects.container{padding:0}#projects .heading{margin:0 auto;width:95%}#projects .heading .background-text,#projects .heading .heading-text{text-align:center;width:100%}#projects #projects-list{flex-direction:column;gap:2rem;padding:.5em}#projects #projects-list .project{width:100%}#projects #projects-list .project .buttons-container{flex-direction:column;gap:1em}#projects #projects-list .project .buttons-container .link{max-width:100%;width:80%}#projects #projects-list .project .project-tech{margin:0;padding:1em}#projects #projects-list .project .project-tech .tech{width:80px}#projects #moreProjects{font-size:1.1rem;width:95%}}#navbar{align-items:center;background-color:#fafafa;border-bottom:2px solid rgba(0,0,0,.7);display:flex;height:4rem;justify-content:center;position:fixed;top:0;width:100%;z-index:999}#navbar.dark{background-color:#171717}#navbar #hamburger,#navbar>#logo{display:none}#navbar #navDesktop{padding-inline:4em}#navbar #navDesktop,nav{align-items:center;display:flex}nav{gap:4rem;padding:0 15%;width:100%}nav,nav .flex1{flex:1 1}nav ul{align-items:center;display:flex;gap:.5rem;justify-content:flex-end}nav ul .nav-link{color:#000;font-size:1.2rem;font-weight:600;padding:.3em 1em;text-decoration:none}nav ul .nav-link.dark{color:hsla(0,0%,100%,.7)}nav ul .nav-link:hover{color:rgba(0,0,0,.7)}nav ul .nav-link:hover.dark{color:#fafafa}nav #resume{align-items:center;background-color:rgba(0,0,0,.8);border:2px solid #135fec;color:#fff;cursor:pointer;display:flex;font-family:Titillium Web,sans-serif;font-size:1.1rem;font-weight:700;gap:.8em;padding:.1em .5em;text-align:center;transition:background-color .1s;width:-webkit-max-content;width:max-content}nav #resume .icon{font-size:1.3rem}nav #resume:hover{background-color:rgba(19,95,236,.85)}#navMobile{display:none}@media screen and (min-width:1281px){#navbar #theme-button{position:static}}@media screen and (min-width:851px)and (max-width:1280px){#navbar nav{justify-content:space-between}#navbar #resume,#navbar .flex1{display:none}}@media screen and (max-width:850px){#navbar>#logo{display:flex}#navbar>#theme-button{position:absolute;right:1rem}#navbar #hamburger{display:flex}#navbar #navDesktop{display:none}#navbar #navDesktop #resume{display:none;position:absolute;right:2%}#navbar #navDesktop .flex1{display:none}#navMobile{background-color:#f5f5f5;display:flex;flex-direction:column;gap:10vh;height:100vh;justify-content:center;overflow-y:hidden;padding-inline:5vw;padding-inline:0;position:fixed;top:0;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;z-index:900}#navMobile.open{pointer-events:all;-webkit-transform:translateY(0);transform:translateY(0)}#navMobile.closed{pointer-events:none;-webkit-transform:translateY(-100%);transform:translateY(-100%)}#navMobile.dark{background-color:#171717}#navMobile ul{flex-direction:column;transition:top .3s;width:100%}#navMobile ul .nav-link{font-size:1.7rem;padding:.5em 1em;text-align:center;width:100%}#navMobile ul .nav-link:active{background-color:rgba(0,0,0,.05)}#navMobile ul .nav-link.dark{color:#fafafa}#navMobile #github-linkedin-buttons{align-items:center;background-color:rgba(0,0,0,.05);display:flex;flex-direction:column;gap:2rem;justify-content:center;margin:0 auto;padding:2em .5em;width:100%}#navMobile #github-linkedin-buttons.dark{background-color:rgba(0,0,0,.5);color:#fafafa}#navMobile #github-linkedin-buttons h2{font-size:1.5rem;font-weight:600}#navMobile #github-linkedin-buttons #sidebar{max-width:300px}#navMobile #github-linkedin-buttons #sidebar .sidebar-icon.dark{color:#fafafa}#navMobile #github-linkedin-buttons #sidebar .sidebar-icon#linkedin{color:#135fec}}@media screen and (min-width:900px)and (max-width:1110px){#navbar #navDesktop{padding-inline:2em}}@media screen and (min-width:851px){#navbar{padding-inline:5vw}#navbar>.flex1{flex:none}#navbar>#theme-button{display:none}}@media screen and (max-width:380px){#navbar{padding-inline:5vw}}#hamburger{height:3rem;left:2%;padding:.5em;position:absolute;width:3rem;z-index:999}#hamburger.closed{align-items:center;display:flex;flex-direction:column;justify-content:space-around}#hamburger.open{justify-content:center}#hamburger.open .line:first-child,#hamburger.open .line:last-child{position:absolute}#hamburger.open .line:first-child{top:47%;-webkit-transform:rotate(-43deg);transform:rotate(-43deg)}#hamburger.open .line:last-child{bottom:47%;-webkit-transform:rotate(43deg);transform:rotate(43deg)}#hamburger.open .line:nth-child(2){top:47%;-webkit-transform:rotate(-43deg);transform:rotate(-43deg)}#hamburger:active{background-color:rgba(0,0,0,.05)}#hamburger .line{background-color:#000;height:3px;position:absolute;transition:-webkit-transform .1s;transition:transform .1s;transition:transform .1s,-webkit-transform .1s;width:2rem}#hamburger .line.dark{background-color:#fafafa}#hamburger .line:first-child{top:25%}#hamburger .line:last-child{bottom:25%}#logo{align-items:center;color:rgba(0,0,0,.8);cursor:pointer;display:flex;font-size:2rem;font-weight:700;gap:.5rem;justify-content:center}#logo img{width:50px}#logo span{color:rgba(0,0,0,.8);font-family:Josefin Sans,sans-serif;padding-top:.3em}#logo span.dark{color:#fafafa}@media screen and (min-width:901px){#logo span{font-size:1.9rem;width:-webkit-max-content;width:max-content}}@media screen and (max-width:900px){#logo span{display:none}}#theme-button{background-color:#fff;border:2px solid #000;cursor:pointer;overflow-y:hidden;padding:.3em;position:absolute;right:2rem}#theme-button,#theme-button .icon.theme{align-items:center;display:flex;justify-content:center}#theme-button .icon.theme{color:#000;font-size:1.4rem;text-align:center;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s}#theme-button .icon.theme.dark{color:#171717}#theme-button .icon.theme.animate-in{-webkit-animation:animateIn .3s forwards;animation:animateIn .3s forwards}#theme-button .icon.theme.animate-out{-webkit-animation:animateOut .2s forwards;animation:animateOut .2s forwards}@-webkit-keyframes animateIn{0%{opacity:0;-webkit-transform:translateY(-130%);transform:translateY(-130%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes animateIn{0%{opacity:0;-webkit-transform:translateY(-130%);transform:translateY(-130%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes animateOut{0%{opacity:.4;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(130%);transform:translateY(130%)}}@keyframes animateOut{0%{opacity:.4;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(130%);transform:translateY(130%)}}#contact{flex-direction:column;gap:3rem}#contact.container{margin:8vh auto 10vh}#contact .heading .background-text{left:-1.5%}#contact #contactContent{display:flex;justify-content:space-between}#contact #contactContent #contactForm{display:flex;flex:1 1;flex-direction:column;justify-content:center}#contact #contactContent #contactForm h2{color:gray;font-weight:500;margin-bottom:3rem;-webkit-user-select:text;user-select:text;width:80%}#contact #contactContent #contactForm h2 span{color:#000;font-weight:600}#contact #contactContent #contactForm h2 span.dark{color:#fafafa}#contact #contactContent #contactForm form{display:flex;flex-direction:column;gap:2rem;width:70%}#contact #contactContent #contactForm form .form-input{align-items:flex-start;display:flex;flex-direction:column;justify-content:flex-start;width:100%}#contact #contactContent #contactForm form .form-input label{font-weight:600}#contact #contactContent #contactForm form .form-input label.dark{color:#fafafa}#contact #contactContent #contactForm form .form-input input{background-color:rgba(0,0,0,.05);border:1px solid gray;border-radius:0;font-size:1.1rem;outline:none;padding:.2em .5em;width:40%}#contact #contactContent #contactForm form .form-input input.dark{background-color:#fafafa}#contact #contactContent #contactForm form .form-input textarea{background-color:rgba(0,0,0,.05);font-size:1.1rem;height:25vh;outline:none;padding:.4em .5em;resize:none;width:100%}#contact #contactContent #contactForm form .form-input textarea.dark{background-color:#fafafa}#contact #contactContent #contactForm form .inputs-container{align-items:center;display:flex;justify-content:space-between;width:100%}#contact #contactContent #contactForm form .inputs-container .form-input{width:45%}#contact #contactContent #contactForm form .inputs-container .form-input input{width:100%}#contact #contactContent #contactForm form .inputs-container .form-input input:read-only{border:none;color:gray;font-style:italic;font-weight:500}#contact #contactContent #contactForm form .inputs-container .form-input input.dark{background-color:#fafafa}#contact #contactContent #contactForm form button{align-items:center;background-color:#fff;border:2px solid #000;cursor:pointer;display:flex;font-size:1.2rem;font-weight:600;height:3rem;justify-content:center;padding:.3em;position:relative;transition:color .1s,background-color .1s;width:40%}#contact #contactContent #contactForm form button:active,#contact #contactContent #contactForm form button:hover{background-color:rgba(0,0,0,.8);color:#fff}#contact #contactContent #contactForm form button:disabled{background-color:rgba(0,0,0,.2);border:2px solid gray;cursor:not-allowed}#contact #contactContent #contactForm form button:disabled:active,#contact #contactContent #contactForm form button:disabled:hover{background-color:rgba(0,0,0,.2);color:rgba(0,0,0,.3)}#contact #contactContent #contactForm form button #spinner{width:40px}#contact #contactContent #contactForm form .buttons-container{gap:1em}#contact #contactContent #contactForm form .buttons-container button{width:35%}#contact #contactContent #contactForm form .buttons-container p{-webkit-animation:fadeIn .2s forwards;animation:fadeIn .2s forwards;flex:1 1}#contact #contactContent #contactForm form #emailResponse{align-items:center;color:hsla(0,0%,100%,.85);display:flex;font-size:1.1rem;font-weight:600;justify-content:center;overflow:hidden;position:relative;text-align:center;text-shadow:0 0 10px rgba(0,0,0,.4);width:100%}#contact #contactContent #contactForm form #emailResponse.green{background-color:#54e467;padding:.5em 1em}#contact #contactContent #contactForm form #emailResponse.red{background-color:#f36565;padding:.5em 1em}#contact #contactContent #contactForm form #emailResponse .icon-container{align-items:center;background-color:hsla(0,0%,100%,.1);display:flex;justify-content:center;padding:.3em;position:absolute;right:.5rem;transition:background-color .1s}#contact #contactContent #contactForm form #emailResponse .icon-container .icon{font-size:1.2rem}#contact #contactContent #contactForm form #emailResponse .icon-container:hover{background-color:hsla(0,0%,100%,.3)}#contact #contactContent #personalInfo{background-color:rgba(0,0,0,.05);border-radius:5px;display:flex;flex-direction:column;gap:2rem;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:1em;width:30%}#contact #contactContent #personalInfo.dark{background-color:#fafafa}#contact #contactContent #personalInfo h3{font-size:1.7rem}#contact #contactContent #personalInfo #phone-email{display:flex;flex-direction:column;gap:.5rem;width:100%}#contact #contactContent #personalInfo #phone-email p{align-items:center;color:gray;display:flex;font-weight:600;gap:1em;width:100%}#contact #contactContent #personalInfo #phone-email p .icon{color:#000;font-size:1.4rem}#contact #contactContent #personalInfo #phone-email p>button{border:1px solid #c5c5c5;border-radius:5px;color:#929292;cursor:pointer;justify-self:end;padding-inline:.3rem;padding-top:.2rem;text-align:center}#contact #contactContent #personalInfo #phone-email p>button:hover{border:1px solid #000;color:#000}#contact #contactContent #personalInfo #phone-email p>button.copied{border-color:#11b411;color:#11b411}#contact #contactContent #personalInfo #phone-email .email{align-items:center;display:flex;flex-grow:1;gap:1rem}#contact #contactContent #personalInfo .buttons-container{gap:.5em;width:100%}#contact #contactContent #personalInfo .buttons-container a{align-items:center;background-color:#fff;border:2px solid rgba(0,0,0,.9);color:rgba(0,0,0,.7);cursor:pointer;display:flex;flex:1 1;font-size:1.2rem;font-weight:600;gap:.5em;justify-content:center;padding:.3em 1em;text-decoration:none;transition:color .1s,background-color .1s}#contact #contactContent #personalInfo .buttons-container a .icon{border-radius:3px;font-size:1.4rem}#contact #contactContent #personalInfo .buttons-container a .icon#github{color:#000}#contact #contactContent #personalInfo .buttons-container a .icon#linkedin{color:#135fec}#contact #contactContent #personalInfo .buttons-container a:hover{background-color:rgba(0,0,0,.8);color:#fff}#contact #contactContent #personalInfo .buttons-container a:hover .icon#github{color:#fff}#contact #contactContent #personalInfo .buttons-container a:hover .icon#linkedin{background-color:#fff}@-webkit-keyframes fadeIn{0%{opacity:0;scale:.95}to{opacity:1;scale:1}}@keyframes fadeIn{0%{opacity:0;scale:.95}to{opacity:1;scale:1}}@media screen and (min-width:1281px){#contact #contactContent{gap:2rem}#contact #contactContent #contactForm{flex:1 1;margin-bottom:0}#contact #contactContent #contactForm h2{font-size:1.2rem}#contact #contactContent #contactForm form{width:80%}#contact #contactContent #contactForm form .buttons-container{flex-direction:column;gap:1rem}#contact #contactContent #contactForm form .buttons-container button{width:100%}#contact #contactContent #personalInfo{margin:0 auto;width:40%}}@media screen and (min-width:1025px)and (max-width:1280px){#contact #contactContent{gap:2rem}#contact #contactContent #contactForm{flex:1 1;margin-bottom:0}#contact #contactContent #contactForm h2{font-size:1.2rem}#contact #contactContent #contactForm form{width:80%}#contact #contactContent #contactForm form .inputs-container{gap:1rem;justify-content:normal}#contact #contactContent #contactForm form .inputs-container .form-input{flex:1 1}#contact #contactContent #contactForm form .inputs-container .form-input input{width:100%}#contact #contactContent #contactForm form .buttons-container{flex-direction:column;gap:1rem}#contact #contactContent #contactForm form .buttons-container button{width:100%}#contact #contactContent #personalInfo{margin:0 auto;width:35%}#contact #contactContent #personalInfo .buttons-container{flex-direction:column}#contact #contactContent #personalInfo .buttons-container a{width:100%}}@media screen and (min-width:851px)and (max-width:1024px){#contact #contactContent{flex-direction:column-reverse;gap:5rem}#contact #contactContent #contactForm{align-items:center;margin-bottom:3rem}#contact #contactContent #contactForm h2{text-align:center;width:85%}#contact #contactContent #contactForm form{width:85%}#contact #contactContent #personalInfo{margin:0 auto;width:50%}}@media screen and (min-width:461px)and (max-width:850px){#contact{align-items:center;padding-inline:1vw}#contact .background-text{overflow-x:hidden}#contact .heading{width:90%}#contact .heading .background-text{text-align:center}#contact .heading .heading-text{text-align:center;width:100%}#contact #contactContent{flex-direction:column-reverse;gap:5rem}#contact #contactContent #contactForm{align-items:center;margin-bottom:3rem}#contact #contactContent #contactForm h2{text-align:center;width:85%}#contact #contactContent #contactForm form{width:85%}#contact #contactContent #personalInfo{margin:0 auto;max-width:500px;width:70%}}@media screen and (min-width:461px)and (max-width:650px){#contact{align-items:center;padding-inline:1vw}#contact .background-text{overflow-x:hidden}#contact .heading{width:90%}#contact .heading .background-text{text-align:center}#contact .heading .heading-text{text-align:center;width:100%}#contact #contactContent{flex-direction:column-reverse;gap:5rem}#contact #contactContent #contactForm{align-items:center;margin-bottom:3rem}#contact #contactContent #contactForm h2{font-size:1.2rem;text-align:center;width:85%}#contact #contactContent #contactForm form{width:85%}#contact #contactContent #contactForm form .inputs-container{gap:1rem;justify-content:normal}#contact #contactContent #contactForm form .inputs-container .form-input{flex:1 1}#contact #contactContent #contactForm form .buttons-container{flex-direction:column;gap:1rem}#contact #contactContent #contactForm form .buttons-container button{width:100%}#contact #contactContent #personalInfo{margin:0 auto;max-width:500px;width:90%}#contact #contactContent #personalInfo .buttons-container{flex-direction:column}#contact #contactContent #personalInfo .buttons-container a{width:100%}}@media screen and (max-width:460px){#contact{align-items:center;padding-inline:1vw}#contact .background-text{overflow-x:hidden}#contact .heading{width:90%}#contact .heading .background-text{text-align:center}#contact .heading .heading-text{text-align:center;width:100%}#contact #contactContent{flex-direction:column-reverse;gap:5rem}#contact #contactContent #contactForm{align-items:center;margin-bottom:3rem}#contact #contactContent #contactForm h2{font-size:1.2rem;text-align:center;width:85%}#contact #contactContent #contactForm form{width:85%}#contact #contactContent #contactForm form .inputs-container{flex-direction:column;gap:1rem;justify-content:normal}#contact #contactContent #contactForm form .inputs-container .form-input{flex:1 1;width:100%}#contact #contactContent #contactForm form .inputs-container .form-input input{width:100%}#contact #contactContent #contactForm form .buttons-container{flex-direction:column;gap:1rem}#contact #contactContent #contactForm form .buttons-container button{width:100%}#contact #contactContent #personalInfo{margin:0 auto;max-width:500px;width:90%}#contact #contactContent #personalInfo .buttons-container{flex-direction:column}#contact #contactContent #personalInfo .buttons-container a{width:100%}}footer{align-items:center;background-color:#fafafa;border-top:2px solid rgba(0,0,0,.7);bottom:0;display:flex;position:fixed;width:100%}footer.dark{background-color:#171717}footer.dark p{color:#fafafa}footer p{margin:0 auto;text-align:center;width:80%}@media screen and (max-width:850px){footer p{width:95%}}.dark{transition:color .2s,background-color .2s,border-color .2s}#sidebar{align-items:center;background-color:rgba(0,0,0,.9);display:flex;flex-direction:column;height:120px;justify-content:center;left:0;min-width:3vw;position:fixed;top:40%}#sidebar.dark{background-color:#fafafa}#sidebar .sidebar-icon{align-items:center;color:#fff;display:flex;font-size:2rem;height:50%;justify-content:center;text-align:center;text-decoration:none;width:100%}#sidebar .sidebar-icon.dark{color:#171717}#sidebar .sidebar-icon.dark:hover{background-color:rgba(0,0,0,.1)}#sidebar .sidebar-icon#linkedin{color:#135fec}#sidebar .sidebar-icon#linkedin .icon{background-color:#fff;border-radius:5px}#sidebar .sidebar-icon:hover{background-color:hsla(0,0%,100%,.1)}@media screen and (min-width:1025px)and (max-width:1440px){#sidebar{min-width:auto}#sidebar .sidebar-icon{padding:.5em .35em}}@media screen and (min-width:851px)and (max-width:1024px){#sidebar{display:none;min-width:auto}#sidebar .sidebar-icon{padding:.5em .35em}}@media screen and (max-width:850px){#sidebar{display:none;min-width:auto}#sidebar .sidebar-icon{padding:.5em .35em}#navMobile #sidebar{background-color:transparent;display:flex;flex-direction:row;height:auto;justify-content:space-between;position:static;width:90%}#navMobile #sidebar .sidebar-icon{background-color:rgba(0,0,0,.8);border:2px solid rgba(0,0,0,.9);height:100%;padding:.3em;width:45%}}
/*# sourceMappingURL=main.4fa89f02.css.map*/