header{display:flex;padding:16rem 0 12rem;flex-direction:column;align-items:center;gap:10rem}header article.me{display:flex;justify-content:center;align-items:center;gap:42px}header article.me img{width:414px;border-radius:15px}header article.me .desc{display:flex;flex-direction:column;align-items:flex-start;gap:22px}header article.me p{text-align:left;width:439px;height:46px}header article.me .buttons{display:flex;align-items:flex-start;gap:2rem}header article.tech{display:flex;justify-content:center;align-items:center;gap:80px;width:70%}header article.tech .techText{display:flex;align-items:center;gap:30px}header article.tech span{color:var(--Heading);font-size:14px;font-weight:600}header article.tech .verticalLine{width:1px;height:30px;background:var(--Heading)}header article.tech .techs{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:80px}header article.tech .techs img{transition:.4s}header article.tech .techs img:hover{transform:scale(1.25)}button a:hover{text-decoration:none;color:var(--Light)}@media (max-width: 1000px){header{padding:100px 0;gap:42px}header article.me{text-align:center;flex-direction:column-reverse;gap:42px}header article.me img{width:60%}header article.me p{margin-bottom:3rem;width:80%;text-align:center}header article.me .desc{align-items:center;gap:22px}header article.me .buttons{flex-direction:column;align-items:center;gap:1rem}header article.tech{flex-direction:column;gap:42px}header article.tech .techText{flex-direction:column;gap:15px}header article.tech .verticalLine{display:none}header article.tech .techs{justify-content:center;width:80%;flex-wrap:wrap;gap:42px}}button{display:flex;justify-content:center;align-items:center;padding:14px 35px;border-radius:8px;border:1px solid var(--Heading);font-size:1em;font-family:inherit;box-shadow:0 1px 2px #0000000d;cursor:pointer;transition:all .2s ease-in-out;color:var(--Light)}button.primary{border-color:var(--Accent);background-color:var(--Accent);color:var(--Light);font-weight:700}button.primary:hover{background-color:transparent;color:var(--Heading)}button.visit.primary{padding:0;width:150px;height:45px;display:flex;gap:8px}button.secondary{color:var(--Heading);border-color:var(--Heading);background-color:transparent;font-weight:400;box-shadow:0 0 2px 2px var(--Shadow)}button.visit.secondary{padding:0;width:150px;height:45px;box-shadow:0 0 2px 2px var(--Shadow)}button.secondary:hover{border-color:transparent}button.tertiary{color:var(--Heading);border-color:var(--Heading);background-color:transparent;font-weight:400;padding:8px 30px;box-shadow:0 0 2px 2px var(--Shadow)}button.tertiary:hover{border-color:transparent}button svg{stroke:var(--Light);width:1.2rem;transition:all .2s ease-in-out}button:hover svg{stroke:var(--Heading);transition:all .2s ease-in-out}.experience{width:calc(100% - 8rem);padding:16rem 4rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12rem;text-align:left;border-radius:1rem;background:var(--BGlight);box-shadow:0 0 .5rem #00000026}@media (max-width: 62.5rem){.experience{width:calc(100% - 3rem);flex-direction:column;gap:2.5rem;padding:6rem 1.5rem}}.experienceCard{display:flex;justify-content:center;align-items:center;gap:50px;transition:all .5s;border-radius:20px;width:fit-content;cursor:default}.experienceCard:hover{transform:scale(1.015);box-shadow:0 0 6px 2px var(--Shadow);background:#7f7f7f1a}.experienceCard img{width:40svw;transition:all .5s}.experienceCard img.leftImg{border-radius:20px 0 0 20px}.experienceCard img.rightImg{border-radius:0 20px 20px 0}.experienceCard .desc{width:490px;display:flex;flex-direction:column;justify-content:center;gap:10px;align-self:stretch;padding:1rem .5rem}.experienceCard p{align-self:stretch;text-wrap:balance}.experienceCard .buttons{display:flex;align-items:center;gap:20px}@media (max-width: 1000px){.experienceCard{flex-direction:column;gap:20px}.experienceCard.rightDesc{flex-direction:column-reverse}.experienceCard img{width:100%}.experienceCard img.leftImg,.experienceCard img.rightImg{border-radius:20px}.experienceCard .desc{width:100%}.experienceCard .desc .buttons{align-self:center}}.techStackContainer{margin-bottom:.5rem}.techStackContainer span{box-shadow:0 0 6px 2px var(--Shadow);margin:.2rem .5rem;padding:.2rem .6rem;border-radius:20px;transition:all .4s}.techStackContainer span:hover{transform:scale(1.015);background:#8080801a}.backtotop{position:fixed;bottom:20px;right:20px;z-index:1;cursor:pointer;width:50px;height:50px;background-color:var(--BGlight);box-shadow:0 0 5px 5px var(--Shadow);border-radius:20px;text-align:center;font-size:30px;line-height:50px;transition:all .5s;padding:0}.backtotop:hover{transform:translateY(-5px);box-shadow:0 1px 5px 5px var(--Shadow)}.backtotop svg{fill:var(--Heading)}.project{width:calc(100% - 120px);padding:150px 60px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7.5rem;text-align:left;background:var(--BGdark);box-shadow:0 0 5px #00000026}.projectContainer{display:flex;flex-wrap:wrap;justify-content:center;gap:4rem}.projectCard{overflow:hidden;border-radius:20px;width:400px;transition:all .4s;position:relative;cursor:default}.projectCard:hover{transform:scale(1.015);background-color:var(--BGlight);box-shadow:0 0 6px 2px var(--Shadow)}.projectCard:hover svg{transform:scale(1.2)}.projectCard img{width:400px;-webkit-mask-image:linear-gradient(to bottom,#000,#0000);mask-image:linear-gradient(to bottom,#000,#0000)}.projectCard svg{stroke:var(--Heading);fill:var(--Heading);width:1.5rem}.projectCard h3{display:flex;align-items:center;gap:.5rem;text-decoration:underline}.projectCard p{text-wrap:balance}.projectCard .desc{padding:1rem;display:flex;flex-direction:column;justify-content:center;gap:10px}.projectCard .techStackContainer{width:100%;display:flex;flex-wrap:wrap;column-gap:1rem;row-gap:.5rem}.projectCard .githubCode{display:flex;align-items:center;gap:.5rem;position:absolute;bottom:0;right:0;padding:1rem;transition:all .4s}nav{position:fixed;display:flex;align-items:center;justify-content:space-between;width:calc(100% - 24rem);padding:1rem 12rem;border-radius:0 0 20px 20px;background:var(--BGlight);box-shadow:0 0 5px #00000026;z-index:999}nav .logo{color:var(--Heading);font-size:1.5rem;font-weight:600;display:flex;align-items:center}nav .logo:hover,nav .logo:hover svg{color:var(--Accent);fill:var(--Accent)}nav .logo svg{height:2rem;margin-right:.5rem}nav .navigation{display:flex;justify-content:center;align-items:center;gap:1.5rem;font-size:15px;font-weight:400}nav .navigation a:hover{border-bottom:2px solid var(--Accent)}nav .social{display:flex;width:6.5rem;height:1.5rem;justify-content:space-between;gap:1rem}nav svg{fill:var(--Heading);transition:all .2 ease-in-out}nav svg:hover{fill:var(--Accent)}@media (max-width: 1000px){nav{width:calc(100% - 5rem);padding:1rem 2.5rem;justify-content:space-between}nav .navigation{display:none}nav .social{display:none}}.hamburger{display:none}.hamburger .bar1,.hamburger .bar2,.hamburger .bar3{width:28px;height:4px;border-radius:10px;background-color:var(--Heading);transition:.4s;z-index:2}.hamburger.change .bar1{transform:translateY(9px) rotate(-45deg)}.hamburger.change .bar2{opacity:0}.hamburger.change .bar3{transform:translateY(-9px) rotate(45deg)}@media (max-width: 1000px){.hamburger{display:flex;flex-direction:column;gap:5px;cursor:pointer}}.menu{position:fixed;top:3.5rem;right:0;width:100%;height:100%;background-color:var(--BGlight);transform:translate(100%);transition:transform .3s ease-in-out;display:flex;flex-direction:column;font-size:1.5rem}.menu a{margin-top:3rem;margin-left:3rem}.menu.active{transform:translate(0)}.menu a:hover svg{fill:var(--Accent)}.footer{width:calc(100% - 24rem);height:10rem;display:flex;justify-content:space-between;align-items:center;padding:0 12rem;background-color:var(--BGlight);border-radius:20px 20px 0 0}.footer a{display:flex;align-items:center;gap:.5rem}.footer a.githubCode:hover{border-bottom:2px solid var(--Accent)}.footer a:hover svg{fill:var(--Accent)}.footer .socialLinks{display:flex;justify-content:space-around;align-items:center;gap:1rem}.footer svg{fill:var(--Heading)}.footer svg:hover{fill:var(--Accent)}@media screen and (max-width: 768px){.footer{width:calc(100% - 4rem);padding:0 2rem;height:14rem}}dialog{position:fixed;top:5%;left:5%;z-index:1;width:calc(90% - 60px);height:calc(90% - 60px);overflow:scroll;margin:0;padding:20px 30px;border-radius:20px;background-color:var(--BGdark);border:none;box-shadow:0 0 10px var(--Shadow);transition:all .5s}dialog::backdrop{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}dialog button.closeButton{position:fixed;top:5%;right:5%;margin:0;border-radius:0 20px;background-color:var(--BGlight);color:var(--Heading);border:0px;box-shadow:-1px 1px 5px var(--Shadow)}dialog::-webkit-scrollbar{width:0}dialog svg{fill:var(--Heading)}.dialogContact{width:fit-content;height:fit-content;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.dialogContact .closeButton{color:gray;position:absolute;top:0;right:0;margin:0}.dialogContact .closeButton:hover{color:#fff;box-shadow:0 0 4px 4px var(--Shadow)}.contact{padding:5rem 0;display:flex;flex-direction:column;align-items:center;gap:3rem;transition:all .1s ease-in}.contact .contactMethods{display:flex;gap:2rem}.contact .contactMethod{display:flex;justify-content:flex-start;gap:1rem;align-items:center;box-shadow:0 0 2px 2px var(--Shadow);border-radius:20px;transition:all .1s ease-in;padding:10px 20px;min-width:275px;cursor:pointer}.contact .contactMethod:hover{box-shadow:0 0 5px 5px var(--Shadow)}.contact .contactMethod h4,.contact .contactMethod span{transition:all .1s ease-in}.contact .contactMethod svg,.contact .contactMethod h4,.contact .contactMethod span{color:gray;fill:gray}.contact .contactMethod:hover svg,.contact .contactMethod:hover h4,.contact .contactMethod:hover span{color:#fff;fill:#fff}.contact .contactMethod svg{width:2rem}.contact .divisor{display:flex;gap:2rem;justify-content:space-around;align-items:center;width:90%}.contact .line{width:100%;height:4px;border-radius:20px;background-color:var(--Light)}@media (max-width: 768px){.contact .contactMethods{flex-direction:column;justify-content:center;align-items:center}.contact .contactMethod{width:fit-content}.contact span{font-size:.8rem}}.experiencePage{padding:5rem 0;display:flex;flex-direction:column;align-items:center;gap:3rem}:root{--Heading: #0e0e0e;--Text: #333333;--BGdark: #e6e6e6;--BGlight: #f2f2f2;--Accent: #2ec2c2;--Light: hsl(0, 0%, 90%);--Dark: #0e0e0e;--Shadow: rgba(14, 14, 14, .15);font-family:Onest;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--Text);background-color:var(--BGdark);scroll-behavior:smooth;margin:0;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}a{color:var(--Heading);text-decoration:none;transition:.2s ease-in-out}a:hover{color:var(--Accent)}h1{margin:0;font-size:2.5rem;font-weight:700;color:var(--Heading)}h2{margin:0;font-size:2rem;font-weight:600;color:var(--Heading)}h3{margin:0;font-size:1.5rem;font-weight:500;color:var(--Text)}h4{margin:0;font-size:1.25rem;font-weight:500;color:var(--Text)}p{margin:0;color:var(--Text);font-size:1rem;font-weight:400}span{color:var(--Text)}b{font-weight:600}svg{transition:all .2s}@media (prefers-color-scheme: dark){:root{--Heading: #f2f2f2;--Text: #dcdcdc;--BGlight: #181818;--BGdark: #0e0e0e;--Accent: #00aaaa;--Shadow: rgba(242, 242, 242, .15);color:var(--Text);background-color:var(--BGdark)}}.force-light-mode{--Heading: #0e0e0e;--Text: #333333;--BGdark: #e6e6e6;--BGlight: #f2f2f2;--Accent: #2ec2c2;--Shadow: rgba(14, 14, 14, .15);background-color:var(--BGdark)}.force-dark-mode{--Heading: #f2f2f2;--Text: #dcdcdc;--BGlight: #181818;--BGdark: #0e0e0e;--Accent: #00aaaa;--Shadow: rgba(242, 242, 242, .15);background-color:var(--BGdark)}
