:root{--primary-color: #030C26;--secondary-color: #077F8C;--tertiary-color: #26A6A6;--tertiary-hot: #61bac4;--button-color: #04BF68;--button-hot: #0DF205;--text-primary-color: #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(--primary-color);color:var(--text-primary-color);font-size:var(--font-size)}h1,h2,h3,h4{margin:0}a{color:var(--button-color)}a:hover{color:var(--tertiary-hot);text-decoration:none}img{width:100%}.section-tertiary-color{background-color:var(--tertiary-color)}.section-secondary-color{background-color:var(--secondary-color)}.gradient{background:#0df205;background:linear-gradient(90deg,#0df205 22%,#27418c 74%);height:2px}nav{max-width:1200px;margin:0 auto;padding:4rem 1rem;font-family:var(--mono);font-size:80%}nav h1{font-family:var(--sans)}#nav-list{padding:0;margin:0;list-style-type:none;display:flex;flex-flow:row wrap;justify-content:center;align-items:center;gap:2rem}nav li{display:inline-block}nav li:first-child{flex-basis:100%;text-align:center}nav [class*=fa-]{font-size:150%;color:var(--button-hot)}nav h1 [class*=fa-]{font-size:100%}nav a{color:var(--text-primary-color);text-decoration:none;display:block}nav a:hover,nav [class*=fa-]:hover{color:var(--button-color)}#intro{padding:4rem 1rem 10rem;max-width:1200px;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;color:var(--button-hot);display:block}#intro h2{font-size:4rem}#projects{padding:4rem 1rem 2rem;max-width:1200px;margin:0 auto}#projects h2{font-size:2.5rem;margin-bottom:3.75rem}#projects h3{color:var(--button-hot)}#projects h4{margin:0;font-size:1rem;font-family:var(--mono)}.blackbox{padding:1rem;background-color:var(--primary-color);color:var(--text-primary-color);font-size:1rem;line-height:1.5;border-radius:10px;text-align:left}#projects ul{padding:0;margin:0;list-style-type:none;display:flex;flex-flow:row wrap;justify-content:flex-start;gap:1rem;font-size:1rem}#projects img{margin:2rem 0 4rem;padding:1rem;border-left:1px solid var(--button-hot);border-top:1px solid var(--button-hot);border-radius:25px}#contact{width:400px;text-align:center;margin:0 auto;padding:3rem 0}#contact h2{font-size:2rem}#contact form{display:flex;flex-direction:column}#contact label{margin-top:1rem;text-align:left}#contact textarea{height:100px;border-radius:5px}#contact input[type=text]{border-radius:5px}#contact input[type=submit]{margin-top:1rem;border:none;width:25%;text-align:center;font-size:1.5rem}#contact .submit{margin-top:1rem;align-text:center}#contact p:last-child{margin-top:3rem}.button{background-color:var(--button-color);padding:.5rem;border-radius:5px;border:var(--secondary-color) solid 1px;color:#000;font-family:var(--mono);text-decoration:none}.button:hover{color:var(--text-primary-color);background-color:var(--tertiary-hot)}footer{margin:0 auto;padding:4rem 0;text-align:center}footer ul{margin:2rem 0;display:flex;flex-flow:row wrap;justify-content:center;gap:3rem;font-size:3rem;list-style-type:none}@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;grid-row:1/2}.text{order:2;text-align:right;grid-column:5/11;grid-row:1/2}.reverse .text{order:1;text-align:left;grid-column:1/7;grid-row:1/2}#projects ul{justify-content:flex-end}#projects .reverse ul{justify-content:flex-start}}@media (min-width: 850px){nav{mad-width:1200px;margin:0 auto}nav li:first-child{flex-basis:auto;text-align:left;margin-right:auto}}