@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&icon_names=mail&display=swap";@import"https://fonts.googleapis.com/css2?family=Knewave&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap";body{font-family:"Noto Serif",serif;line-height:1.7}h1,h2,h3,h4,h5{font-family:Knewave,system-ui;font-style:normal;font-weight:400;color:#324d67;font-size:2.4rem}p,span{font-family:Ubuntu,Open Sans,Helvetica Neue,sans-serif;color:#243a52;font-size:1.6rem}.contact-container{background-color:#fafad2b0;border-radius:8px;display:flex;grid-column:1/-1;grid-row:8;margin:1.5rem}.contact-container h3{font-family:Knewave,system-ui;font-style:normal;font-weight:400;color:#f08080;font-size:2.4rem}.contact-container form{align-items:center;color:#f08080;display:flex;flex-direction:column;font-weight:600;margin:0 auto;padding:1rem}.contact-container input{margin:1rem;padding:.5rem}.contact-container textarea{width:100%;max-width:100%;height:150px;box-sizing:border-box}.contact-container label{margin-top:2rem;margin-bottom:-12px;display:block}.contact-container .text-area-label{margin-top:2rem;margin-bottom:0;display:block}.contact-container input,.contact-container textarea{border:2px solid #f08080;border-radius:8px;box-shadow:0 2px 4px #f08080}.contact-container input:focus,.contact-container input:active,.contact-container textarea:focus,.contact-container textarea:active{border:2px solid hsl(185,57%,50%);outline:2px solid hsl(185,57%,50%);border-radius:8px;box-shadow:0 2px 4px #f08080}.contact-container input[type=submit]{background-color:#f08080;border-radius:8px;color:#fffff4;font-size:1.8rem;padding:1rem 3rem;transition:.4s ease-in-out}.contact-container input[type=submit]:hover{transform:scale(1.1)}.contact-container input[type=submit]:active{transform:scale(.95)}.footer-container{align-items:center;display:flex;flex-direction:column;grid-column:1/-1;grid-row:9;justify-content:center;margin:2rem 1.5rem;text-align:center}.icon-container a{padding:1rem}.hero-container{align-items:end;background:linear-gradient(#ffffff1a,#ffffff80),url(/img/hero.webp) no-repeat center center;background-color:none;background-size:cover;border-radius:15px 15px 0 0;display:flex;height:30rem;justify-content:start;padding:2rem}.hero-container h1{font-family:Knewave,system-ui;font-style:normal;font-weight:400;color:#fffff4;font-size:3.6rem}.hero-content-container{text-align:center;text-shadow:0 4px 12px rgba(0,0,0,.8)}nav{font-size:1.8rem;margin-right:1rem;padding-top:1rem}.nav-container ul{display:flex;flex-direction:row;gap:2rem;justify-content:end;align-items:center;list-style:none}.nav-container a{font-weight:600;color:#324d67;margin-bottom:0;text-decoration:none;transition:color .2s ease-in-out}.nav-container a:hover{text-decoration:underline}.nav-container .bi-linkedin{color:#0a66c2}.nav-container .bi-linkedin:hover{filter:brightness(1.4)}.nav-container .bi-arrow-right{color:#324d67}.contact-button{display:flex;align-items:center;margin:auto 0;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;transition:.4s ease-in-out;transition:font-variation-settings .3s ease-in-out}.contact-button:hover{font-variation-settings:"FILL" 1,"wght" 700,"GRAD" 0,"opsz" 24}.contact-button:active{color:#fff;transform:scale(.95);text-decoration:none}.intro-text-container{background-color:#fafad2b0;font-size:1.8rem;grid-column:1/-1;grid-row:2;line-height:1.8;margin:1.5rem 0;padding:2rem}.intro-text{max-width:35rem;margin:0 auto}.projects-container{background-color:#80dff099;display:grid;font-size:1.8rem;grid-column:1/-1;grid-row:3;grid-template:auto 1fr/repeat(3,1fr);grid-template-areas:"project-container-header project-container-header project-container-header" "project3 project3 project3" "project2 project2 project2" "project1 project1 project1"}.projects-container .bi{font-size:2.5rem}.projects-container-header{grid-area:project-container-header;margin:0 auto;text-align:center;background-color:#fafad2b0;border-radius:8px;margin-top:3rem;margin-bottom:1rem;padding:1.5rem;padding-bottom:0}.project{background-color:#fafad2b0;border-radius:8px;margin-bottom:2rem;padding:1.5rem;padding-bottom:0;display:grid;gap:1rem;grid-template-areas:"header header" "thumbnail thumbnail" "description description" "link-container link-container"}.project-data-container{display:grid;grid-template-columns:min-content 1fr;gap:1rem;margin-top:4rem}.project-data-container .data-item{display:contents}.project-data-container .data-item-category{font-weight:700;color:#324d67}.project-description{grid-area:description}.project-description-text{max-width:30em;-webkit-hyphens:auto;hyphens:auto}.project-header{font-size:2rem;grid-area:header;text-align:center}.project-links-container{border-top:1px solid hsl(220,50%,50%);display:flex;font-size:2.4rem;grid-area:link-container;justify-content:space-around;margin-top:2rem;width:100%}.project-thumbnail{grid-area:thumbnail;margin:auto}.project1{grid-area:project1}.project2{grid-area:project2}.project3{grid-area:project3}.project-links-container .project-url{transition:all .2s ease-in-out}.project-links-container .project-url:hover{transform:scale(1.3) rotate(220deg)}.project-github{transition:all .2s ease-in-out}.project-github:hover{transform:scale(1.3) translateY(-8px) rotate(30deg)}i:hover{color:#0077b5}@media(min-width:800px){.project{margin:4rem;padding:4rem;grid-template-areas:"header header" "thumbnail description" "link-container link-container"}.project-thumbnail{margin-top:0;margin-right:2rem}.projects-container-header{margin-bottom:-3rem}}*{box-sizing:border-box;margin:0;padding:0}html{font-size:62.5%}body{font-family:Ubuntu,Open Sans,Helvetica Neue,sans-serif;font-size:1.6rem;min-height:100vh}body a,body a:visited{color:#324d67}.site-container{margin:0 auto;width:min(100%,800px)}main{background-color:#80dff099;border-radius:15px;box-shadow:20px 20px 100px 20px #0006;padding-bottom:1rem}.skills-container{display:grid;grid-template-areas:"skill1 skill2" "skill3 skill4"}.skill1{grid-area:skill1}.skill2{grid-area:skill2}.skill3{grid-area:skill3}.skill4{grid-area:skill4}.hero-bottom img{width:100%;height:auto;filter:saturate(.7)}