:root{--font: "Merriweather Sans", sans-serif;--dark-blue: #0f172a;--med-blue: #1e3a8a;--light-blue: #38bdf8;--accent: #38bdf8;--light: #f1f5f9;--medium: #64748b;--form-font: "IBM Plex Mono", monospace}*,*:before,*:after{box-sizing:border-box}.wrapper,section{scroll-behavior:smooth}body{margin:0;background:linear-gradient(290deg,var(--med-blue),var(--dark-blue));font-family:var(--font)}h1,h2,h3{margin:0;padding:0}img{width:100%}a{text-decoration:none}.btn{border-radius:1rem;background:transparent;border:2px solid var(--accent);color:var(--accent);font-size:1.5rem;margin:4rem auto;text-align:center}.btn:hover{cursor:pointer}.btn a{color:inherit;padding:.25rem .5rem}.site{background:var(--accent);color:var(--dark-blue);font-weight:bolder;border-color:var(--accent)}nav{height:60px;margin:0;padding:.5rem;position:fixed;width:100%;z-index:5;display:flex;justify-content:space-between;align-items:center;background:var(--dark-blue);color:var(--accent);z-index:10;transition:.3s;box-shadow:0 8px 8px #00083980}#navbar{top:0}nav ul{display:flex;list-style:none}.menu{background:transparent;max-width:500px;width:80%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:60px 0 0 2rem;position:absolute;z-index:6;right:0;top:-100%;transition:ease-in-out .75s;box-shadow:-5px 5px 8px 1px #00083980,-15px 20px 3px #0008391a}.invisible{right:0;top:0;background:var(--accent)}.menu-list{list-style:none;padding-left:0;width:100%}.menu-link{color:var(--dark-blue);font-family:var(--font);font-size:1.5rem;display:block;padding:.5rem;margin:.5rem auto;transition:ease-in .28s}.menu-link:hover,.menu-link:active,.menu-link:focus{box-shadow:inset -80rem 0 0 0 var(--med-blue),-5px 9px 3px #00083980;border-color:var(--med-blue);color:#fff;transform:translateY(-3px)}.logo{color:inherit;font-size:1.5rem;letter-spacing:3px;margin-left:1rem;transition:ease-in-out .35s}.logo:hover,.logo:focus,.logo:active{transform:scale(1.2);color:#fff}.logo:visited{color:var(--accent);opacity:.9}#hamburger{color:inherit;font-size:1.5rem;margin-right:1rem;position:static;padding:.25rem .5rem;border:3px solid transparent;transition:ease-in-out .25s}#hamburger:hover{border-radius:4px;cursor:pointer;border-color:var(--accent);color:#fff}#sun{width:8rem;height:8rem;background:#fff;border-radius:100%;box-shadow:0 0 8rem #fafafae6,0 0 12rem 1rem #fafafa80,0 0 16rem 2rem #fafafa33;transform:translateZ(-30px) scale(2);z-index:-3;margin-bottom:90rem;margin-right:-40rem}.hero__title_container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;top:30%;left:auto;width:100%;transform-style:preserve-3d;transform:translateZ(-10px) scale(2);z-index:-1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00083999;text-align:center;color:var(--accent);text-shadow:0 0 10px black;max-width:460px}.title{font-size:3rem;z-index:1;margin:0;padding:2rem 2rem 0;line-height:1.1;text-transform:uppercase}hr{width:70%;height:3px;background:var(--accent);border:none;max-width:1250px}.subtitle{font-size:1.25rem;margin:0 auto;padding:1rem;word-spacing:10px;text-transform:uppercase}header{padding-top:60px;position:relative;display:flex;justify-content:center;align-items:center;height:100%;transform-style:preserve-3d;z-index:-1;font-family:var(--font)}.background,.foreground{position:absolute;height:100%;width:100%;object-fit:cover;z-index:-1}.background{padding-top:5rem;transform:translateZ(-16px) scale(2.7)}.foreground{transform:translateY(12rem) translateZ(-5px) scale(2);margin-bottom:2rem}.wrapper{height:100vh;overflow-y:auto;overflow-x:hidden;perspective:10px}#about{display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:2rem;padding:2rem 2rem 4rem;background:linear-gradient(#000,#000,var(--dark-blue),var(--med-blue));color:var(--accent);margin-top:6rem;font-size:1.5rem}#about hr{margin:2rem auto}#about p{max-width:600px}#profile-img{border-radius:100%;border:8px solid var(--light-blue);width:75%;max-width:250px;margin:2rem auto}#resume-btn{transition:ease-in-out .35s;padding:1rem 1.5rem;margin-bottom:4rem;color:var(--accent)}#resume-btn:hover,#resume-btn:active,#resume-btn:focus{background:var(--accent);color:var(--dark-blue);font-weight:bolder;transition:ease-in-out .35s}.heading{margin:0 auto 1rem;line-height:1;color:var(--light-blue);font-size:2.5rem;text-align:center;max-width:600px}section p{line-height:1.6;font-size:1.25rem;transform:translate(-5rem);opacity:0;transition:ease-in-out .8s}.single-project p{transform:translate(0);opacity:1}.fade-in{transform:translate(0);opacity:1;transition:ease-in-out .5s}#skills{position:relative;background:var(--accent);padding:4rem 2rem}.fab{font-size:4.5rem;color:var(--accent)}.skills-heading{color:var(--dark-blue);margin-top:0}.skill-icon{width:70%}.skill-container{display:grid;justify-content:center;align-items:center;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1.5rem;margin:3rem auto}.icon-container{display:flex;flex-direction:column;justify-content:center;align-items:center;justify-self:center;padding:.75rem 1rem;text-align:center;border-radius:0;background:var(--dark-blue);color:transparent;transition:ease-out .3s;z-index:5;width:100%;aspect-ratio:1 / 1;max-width:165px;transform:translateY(.35rem) translate(-.35rem)}.icon-change{background:var(--dark-blue);color:var(--light-blue);border-radius:40px;transition:ease-in-out 1s;transform:translateY(0) translate(0);box-shadow:-8px 8px 3px #00083966}.icon-container p{margin:0;margin-top:.5rem;font-weight:bolder;padding:0;font-size:.85rem;line-height:1;color:inherit;opacity:1;transform:translate(0);transition:.1s}.projects{background:var(--med-blue);color:var(--accent);padding:4rem 1rem}.tools-used{display:flex;list-style:none;flex-wrap:wrap;align-items:center;justify-content:flex-start;padding:0}.tools-used li{border:1px solid white;margin:0 .5rem .5rem 0;padding:.25rem .5rem;border-radius:6px;color:#fff;font-size:.6rem}.tools-used :first-child{margin-left:0}.my-projects{color:var(--accent);margin-bottom:3rem}.projects-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:900px;margin:0 auto;justify-content:center}@keyframes flash{0%{background:var(--accent);color:var(--med-blue)}50%{color:var(--accent);background:var(--med-blue);border-color:var(--accent)}to{background:var(--accent);color:var(--med-blue)}}#new{animation-name:flash;animation-duration:2s;animation-iteration-count:infinite;font-family:Pacifico,cursive;margin-top:0;background:var(--accent);color:var(--dark-blue);font-size:1.5rem;padding:0 .5rem;display:inline-block;border-radius:6px;border:2px solid transparent}.single-project{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000839cc;padding:1rem 2rem 2rem;border-radius:10px;max-width:450px;justify-self:center;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between}.single-project h3{font-weight:400;color:var(--light-blue);font-size:1rem;margin-top:1rem}.single-project em{font-size:1.25rem;font-weight:bolder;color:var(--accent);margin-right:.5rem}.single-project img{background:var(--accent);margin:1rem auto}.single-project p{font-size:1rem}.right{height:100%;display:flex;flex-direction:column;justify-content:space-between}.links{margin:2rem auto 0;display:grid;grid-template-columns:1fr 1fr;align-items:center;justify-content:space-between;width:100%}.links .btn{margin:0 .5rem;font-size:.8rem;padding:.5rem 1rem;width:90%}.links .btn:hover,.links .btn:focus,.links .btn:active{background:var(--med-blue);color:var(--accent);font-weight:bolder}.links .site:hover,.links .site:focus,.links .site:active{background:var(--med-blue);font-weight:bolder}.links .btn:first-child{margin-left:0}.contact-me-section{padding:4rem 2rem;background:var(--accent);color:var(--dark-blue);position:relative}.accent-bg{color:var(--dark-blue)}.contact-me-section p{font-size:1.25rem;margin:0 auto 3rem;opacity:1;transform:translate(0);max-width:600px;text-align:left}.contact-heading{margin:0 auto 2rem;color:var(--dark-blue);padding-bottom:1rem;border-bottom:4px solid var(--dark-blue);max-width:400px}form{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;max-width:600px;margin:0 auto;margin-bottom:6rem}.contact-form{font-family:var(--form-font);font-size:1.5rem;padding:.25rem;margin:.5rem auto;width:100%;text-align:left;border:3px solid var(--dark-blue)}.form-submit{position:absolute;bottom:2rem;padding:.75rem 1.5rem;margin:1rem 0;max-width:300px;border-width:4px;width:70%;background:var(--dark-blue);color:#fff;align-self:center;transition:ease-in-out .3s;font-weight:400}.form-submit:hover,.form-submit:active,.form-submit:focus{color:var(--dark-blue);border-color:var(--dark-blue);transform:scale(1.1);font-size:1.75rem;font-weight:bolder;letter-spacing:2px;box-shadow:inset -20rem 0 0 0 var(--accent),-5px 9px 3px #00083980;transform:translateY(-3px)}.contacts-container{background:var(--dark-blue);display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;padding:2rem;justify-items:flex-start}.contact-link{display:flex;justify-content:center;align-items:center;color:var(--accent);font-size:.8rem}.contact-icon{font-size:2rem;padding:1rem;color:var(--accent)}.attribution{text-align:right;background:var(--dark-blue);padding:2.5rem 1rem;font-size:.5rem;color:var(--accent)}@media (min-width: 500px){.hero__title_container{border-radius:12px}#about p{font-size:1.25rem}.skill-container{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));padding:2rem;row-gap:2.5rem}.icon-container{transform:translateY(1rem) translate(-1rem)}.icon-change{transform:scale(1.1)}.heading{font-size:3rem}.btn,.projects-container{padding:1rem}.contact-me-section p{text-align:center}.contact-link{font-size:1rem}.contacts-container{grid-template-columns:repeat(auto-fit,minmax(350px,1fr));justify-items:center}.attribution{font-size:.9rem}}@media (min-width: 1000px){.hero__title_container{left:23vw;top:-15vh;padding:2rem;position:relative}.wrapper{scrollbar-width:15px}.invisible{right:25px}::-webkit-scrollbar{width:15px;z-index:11}::-webkit-scrollbar-track{background:var(--accent);z-index:11}::-webkit-scrollbar-thumb{background:var(--dark-blue);border-color:var(--accent)}::-webkit-scrollbar-thumb:hover{background:var(--accent);border:3px solid var(--dark-blue)}#navbar{width:calc(100% - 15px)}.menu{right:15px}.foreground{margin-bottom:11rem}.background{transform:translateZ(-16px) scale(2.7) translateY(15vh)}#profile-img{margin-top:4rem}#about .heading{margin:1rem auto 2rem;max-width:100%}#about p{margin:0 auto 1.25rem}.title,.subtitle{margin:0;padding:0}#sun{margin-bottom:0;position:relative;bottom:90vh;left:100vw;width:12rem;height:12rem}#about hr{margin-bottom:4rem}.heading{font-size:4rem;margin:4rem auto 6rem}.skill-container{row-gap:4rem;column-gap:0;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.my-projects{margin:2rem auto 5rem}.links .btn{width:80%}.projects-container{gap:5rem;padding:4rem}.contact-heading{margin:2rem auto 4rem}}@media (min-width: 1200px){.wrapper{scrollbar-width:25px}::-webkit-scrollbar{width:25px}.btn a{padding:0}#navbar{width:calc(100% - 25px);height:6rem}.menu{right:25px}.invisible{top:2rem}#profile-img{margin:8rem auto 4rem;max-width:375px}#about .heading{max-width:100%;margin-bottom:6rem}.foreground{padding-top:4rem;transform:translateZ(-5px) scale(1.8) translateY(5rem)}#about hr{margin:0 auto 6rem}#about p{font-size:1.5rem}.hero__title_container{left:13vw;top:-15vh;max-width:750px;padding:6rem}.skill-container{grid-template-columns:repeat(auto-fit,minmax(350px,1fr));max-width:1440px;margin:2rem auto 6rem}.icon-container{max-width:250px}.fab{font-size:7rem}.contact-icon{font-size:2.5rem}.icon-container p{font-size:1.25rem}.projects-container{grid-template-columns:repeat(auto-fit,minmax(575px,1fr));max-width:1900px;margin-bottom:8rem}.single-project{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;max-width:1100px}.left{display:flex;flex-direction:column;align-items:flex-start;padding-right:2rem}.left em,.left h3{font-size:1.5rem}.tools-used li{font-size:.8rem;margin:0 1rem .5rem 0}.right{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:100%}.right p{font-size:1.15rem}.links{justify-content:flex-start}.links .btn{margin-left:2rem;width:90%}#contact p{font-size:2rem;max-width:900px}form{max-width:700px}}@media (min-width: 2000px){.hero__title_container{padding:4rem}#about p{font-size:2rem;max-width:1000px;margin:1rem auto 2rem}#resume-btn{font-size:2rem;margin-bottom:4rem}.left em,.left h3{font-size:1.75}.tools-used li{font-size:1.1rem}#contact p{font-size:2rem}.contact-link{font-size:1.25rem}}