:root{--black: #16152a;--dkblue: #0d314b;--plum: #1b2941;--hover-green: #60ffd7;--green: #00ffbb;--aqua: #86fbfb;--white: #f7f8fa;--font-size: 1.3rem;--mono: "Oxygen mono", monospace;--sans: "Oxygen", sans-serif}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{padding:0;margin:0;font-family:var(--sans);background-color:var(--black);color:var(--white);font-size:var(--font-size)}h1,h2,h3{margin:0}a{color:var(--green)}a:hover{color:var(--hover-green);text-decoration:none}img{width:100%}.main-page{height:100vh}nav{font-family:var(--mono);font-size:80%;padding:1rem}nav h1 a{font-family:var(--sans)}nav ul{list-style-type:none;padding:10px 0 0;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;max-width:1100px;margin:0 auto}nav li:first-child{flex-basis:100%;text-align:center}nav h1 [class*=fa-]{font-size:100%;padding-right:10px}nav [class*=fa-]{font-size:150%;color:var(--green)}nav [class*=fa-]:hover{color:var(--hover-green)}nav a{color:var(--white);text-decoration:none;display:block;padding:10px;gap:10px}nav a:hover{color:var(--green)}nav a span:hover{color:var(--green)}h1{margin-top:3px}.button{border-radius:5px;background-color:var(--green);color:var(--black)}nav .button:hover{color:var(--black);background-color:var(--hover-green)}#intro{padding:7rem 1rem;max-width:1100px;margin:0 auto}#intro p{font-size:1rem;line-height:1.5}#intro .name{font-family:var(--mono)}.name span{font-family:var(--sans);font-size:4rem;font-weight:600;color:var(--white);display:block}.green-text{color:var(--green)}#intro h2{font-size:18px;font-weight:600;color:var(--green);text-transform:uppercase}#projects{padding:4rem 1rem;max-width:1100px;margin:0 auto}#projects h2{font-size:2.5rem;padding-bottom:3.75rem}#projects h3{color:var(--aqua)}#projects h4{font-family:var(--mono);font-size:1rem;margin:0}.blackbox{background-color:var(--black);padding:1rem;border-radius:10px;font-size:1rem;line-height:1.5;color:var(--white)}#projects ul{list-style-type:none;font-size:1rem;padding:0;margin:0;display:flex;flex-flow:row wrap;gap:1rem}#projects img{border-top:1px solid var(--aqua);border-left:1px solid var(--aqua);border-radius:20px;padding:1rem;margin:2rem 0 4rem}#contact{width:400px;text-align:center;margin:0 auto;padding:3rem 0}.contact-background,.projects-background{background-color:var(--dkblue)}.other-projects-background{background-color:var(--plum)}.gradient{background:linear-gradient(90deg,#00ffbb 25%,rgba(134,251,251,1) 75%);height:2px}#contact p{font-size:1.5rem;display:block;padding-bottom:30px}#contact a{color:var(--black);font-family:var(--mono);text-decoration:none;padding:10px;border-radius:5px;background-color:var(--green)}#contact a:hover{background-color:var(--hover-green)}footer{padding:4rem 0}footer h2{text-align:center}footer ul{padding:0;margin:2rem 0;list-style-type:none;display:flex;justify-content:center;flex-flow:row wrap;gap:3rem;font-size:250%}footer p{font-family:var(--mono);text-align:center}@media (min-width: 550px){article{display:grid;grid-template-columns:repeat(10,1fr);gap:1rem}#projects img{grid-column:1/6;grid-row:1/2}#projects .reverse img{grid-column:6/11}#projects .text{order:2;text-align:right;grid-column:5/11;grid-row:1/2}#projects .reverse .text{grid-column:1/7;order:2;text-align:left}#projects ul{justify-content:flex-end}#projects .reverse ul{justify-content:flex-start}}@media (min-width: 850px){nav{max-width:1200px;margin:0 auto}nav li:first-child{flex-basis:auto;text-align:left;margin-right:auto}#contact{width:700px}}