body{margin:0}#root{min-height:100vh;width:100%;display:flex;flex-direction:column;margin:0 auto}.contact-wrapper{margin:0 auto;text-align:center}.form{text-align:center;margin-bottom:.2rem;font-size:1rem;font-style:italic;font-weight:700}.contact-form{display:flex;align-items:center;justify-content:center;border-radius:2px;color:#11151b;font-size:1rem;border-radius:.5rem;letter-spacing:.5px;cursor:pointer;text-decoration:none;font-style:italic;transition:.4s ease;padding:.5rem}.contact-form:hover{transform:scale(.9)}.contact-form .contact-spec{margin-left:8px}@media screen and (min-width:720px){.contact-footer{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;padding:.5rem}.contact-form{font-size:1.1rem}}.nav{margin:0;padding:1rem;display:flex;gap:2rem;justify-content:flex-end;list-style:none}.nav-icons a{color:#000;text-decoration:none;font-size:1rem}.nav-icons a.active{border-bottom:2px solid black}.icon{color:#4b5d52;transition:.3s ease;font-size:1rem}.icon:hover{transform:scale(1.3)}.image{position:absolute;margin-left:1.5rem;top:0;margin-top:4rem;width:200px;height:200px;overflow:hidden}.profile{height:85%;width:80%;border-radius:50%;object-fit:cover;object-position:top}h1{color:#11151b;margin-left:13rem;font-size:1.2rem;margin-bottom:0;margin-top:2.5rem;font-weight:100;font-style:italic}h2{color:#11151b;margin-left:13rem;font-size:1.5rem;margin-top:.5rem;font-style:italic;font-weight:100}.text{margin-top:4rem;padding:2rem;font-size:1rem;max-width:500px;color:#11151b}.resume-wrap,.contact-wrap{display:none}@media screen and (min-width:720px){.nav{width:90vw;gap:3rem}.icon{font-size:1.5rem}.resume-wrap,.contact-wrap{display:none}h1{margin-left:19rem;font-size:1.5rem}h2{margin-left:19rem;font-size:1.8rem}.text{margin-top:1rem;padding:1rem;font-size:1rem;max-width:430px;color:#11151b;margin-left:18rem}.image{margin-left:3rem;margin-top:6rem;width:280px;height:280px}}@media screen and (min-width:1024px){.resume-wrap{background:linear-gradient(135deg,#d5dec1,#c6d3ab 10%,#e0e9cc 50%);box-shadow:0 4px 12px #0003;display:flex;align-items:center;border-radius:2px;color:#11151b;padding:.4rem .9rem;font-size:1.1rem;font-weight:500;border-radius:.5rem;letter-spacing:.5px;cursor:pointer;text-decoration:none;font-style:italic;transition:.4s ease;position:absolute;margin-left:850px;top:0;margin-top:13rem}.resume-wrap:hover{transform:scale(1.2)}.contact-wrap{background:linear-gradient(135deg,#d5dec1,#c6d3ab 10%,#e0e9cc 50%);box-shadow:0 4px 12px #0003;display:flex;align-items:center;border-radius:2px;color:#11151b;padding:.4rem .9rem;font-size:1.1rem;font-weight:500;border-radius:.5rem;letter-spacing:.5px;cursor:pointer;text-decoration:none;font-style:italic;transition:.4s ease;position:absolute;margin-left:850px;top:0;margin-top:18rem}.contact-wrap:hover{transform:scale(1.2)}.text{max-width:420px;margin-left:20rem}h1,h2{margin-left:21rem;font-size:1.5rem}.image{margin-left:3rem}}@media screen and (min-width:1280px){.text{margin-left:26rem;max-width:500px}h1,h2{margin-left:27rem}.resume-wrap{margin-left:1040px;margin-top:13rem}.contact-wrap{margin-left:1040px;margin-top:18rem}.image{margin-left:6rem;margin-top:7rem;width:290px;height:290px}}@media screen and (min-width:1400px){.text{max-width:500px;margin-left:30rem}h1,h2{margin-left:31rem}.resume-wrap,.contact-wrap{margin-left:1180px}.image{margin-left:6rem;margin-top:6rem;width:300px;height:300px}}.arrow{margin:0;position:fixed;right:0;bottom:0;background-color:transparent;font-size:1.2rem;border:none;color:#000;cursor:pointer}.view-live-button{display:none}.undernav{margin:0;display:flex;gap:10rem;margin-bottom:1rem;margin-top:1rem;justify-content:center}.resume{background:linear-gradient(135deg,#d5dec1,#c6d3ab 10%,#e0e9cc 50%);box-shadow:0 4px 12px #0003;display:flex;align-items:center;border-radius:2px;color:#11151b;padding:.4rem .9rem;font-size:1rem;font-weight:500;border-radius:.5rem;letter-spacing:.5px;cursor:pointer;text-decoration:none;font-style:italic;transition:.4s ease}.resume:hover{transform:scale(1.2)}.contact{background:linear-gradient(135deg,#d5dec1,#c6d3ab 10%,#e0e9cc 50%);box-shadow:0 4px 12px #0003;display:flex;align-items:center;border-radius:2px;color:#11151b;padding:.4rem .9rem;font-size:1rem;font-weight:500;border-radius:.5rem;letter-spacing:.5px;cursor:pointer;text-decoration:none;font-style:italic;transition:.4s ease}.contact:hover{transform:scale(1.2)}h3{text-align:center;font-weight:100;font-size:1.5rem;color:#191e25}section{padding:.5rem}.projects{border-bottom:1px solid #1f2937;padding:.5rem}.image-wrapper{justify-content:center;align-items:center;display:flex}.image-projects{max-width:100%;height:auto}h4{text-align:center}.aboutp{padding:.5rem;font-size:1rem}.button{display:flex;justify-content:center;align-items:center}.tech-stack{font-size:1rem;text-align:center}.tech{display:flex;flex-wrap:wrap;margin-top:1rem;justify-content:center;gap:1rem;align-items:center}.tech span{background:linear-gradient(135deg,#d5dec1,#c6d3ab,#e0e9cc 0%);box-shadow:inset 0 2px 4px #fff9,0 2px 6px #00000026;color:#11151b;padding:.4rem .9rem;font-size:.8rem;font-weight:500;border-radius:.5rem;box-shadow:0 4px 12px #0003;letter-spacing:.5px}.tech-skills,.tech-skills .tech-skill{margin:0;padding:0}.tech-skills .tech-wrap{display:flex;justify-content:center;margin-bottom:1rem}.tech-skills .skills{grid-template-columns:repeat(2,1fr);display:grid;gap:1rem;padding:0;margin:0;list-style:none}.tech-skills .skill{background:linear-gradient(135deg,#d5dec1 65%,#c6d3ab 50%,#e0e9cc 50%);box-shadow:inset 0 2px 4px #fff9,0 2px 6px #00000026;color:#11151b;padding:.5rem .8rem;font-size:1rem;font-weight:500;border-radius:.5rem;box-shadow:0 4px 12px #0003;letter-spacing:.5px;border:1px solid #ccc}.tech-skills .skill:before{content:"";margin-right:.3rem;width:.3rem;height:.3rem;margin-bottom:2px;background-color:#2f3531;border-radius:50%;display:inline-block}.btn{background:linear-gradient(145deg,#acce62);border-radius:1rem;border:1px solid #11151b;padding:.5rem;font-size:1rem;transition:.3s ease;color:#11151b;letter-spacing:.5px}.btn:hover{transform:scale(1.1);box-shadow:0 4px 12px #000c;color:#fff}@media screen and (min-width:720px){.undernav{margin:0;display:flex;gap:30rem;margin-bottom:1rem;margin-top:1rem;justify-content:center}.resume,.contact{font-size:1.1rem}h3{font-size:2rem}.image-projects{max-width:80%;height:auto}.projects-wrapper{width:80%;max-width:650px;margin:0 auto;padding:1rem}.aboutp{font-size:1rem}.tech-skill .skills{grid-template-columns:repeat(4,1fr)}.view-live-button{display:none}}@media screen and (min-width:1024px){.resume,.contact{display:none}.projects{display:flex;align-items:flex-start;gap:1rem;justify-content:center;align-items:center}.projects-wrapper{max-width:500px;align-self:flex-start}.image-wrapper{overflow:hidden;position:relative;max-width:30%}.image-wrapper:hover .image-projects{filter:blur(4px)}.image-wrapper:hover .view-live-button{opacity:1}.image-projects{width:100%;max-width:500px;height:auto;object-fit:cover;transition:filter .5s ease;border-radius:2px}.view-live-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:1rem .5rem;border-radius:.5rem;color:#11151b;font-weight:700;text-decoration:none;box-shadow:0 4px 12px #0003;opacity:0;transition:opacity .5s ease;display:block}.aboutp{font-size:1rem;padding:1rem;max-width:500px;align-self:flex-start}.btn{display:none}.tech-wrap{margin-left:auto;align-self:flex-start}.tech{display:grid;grid-template-columns:repeat(2,1fr);margin-top:2rem;justify-content:center;gap:1rem;align-items:center}.headline{text-align:left;margin-top:0;margin-left:1rem;margin-bottom:0}.skill-headline{text-align:center}}@media screen and (min-width:1200px){.tech{grid-template-columns:repeat(3,1fr)}}Body{font-family:Arial,Helvetica,sans-serif;padding:.5rem}header{background:linear-gradient(135deg,#d5dec1,#c6d3ab 30%,#e0e9cc 50%);box-shadow:inset 0 2px 4px #fff9,0 2px 6px #00000026;display:flex;align-items:center;border-radius:2px}main{flex:1}footer{height:150px;background:linear-gradient(135deg,#d5dec1,#c6d3ab 0%,#e0e9cc 50%,#beca9d 140%);box-shadow:inset 0 2px 4px #fff9,0 2px 6px #00000026;display:flex;align-items:center;border-radius:2px}