:root{--black: #020202;--blue: #6b9ac4;--mint: #97d8c4;--purple: #782ab6;--pink: #cf30ac;--white: #fcf6f6}html{box-sizing:border-box;font-size:16px}*,*:before,*:after{box-sizing:inherit}body,h1,h2,h3,h4,h5,h6,p,ol,ul,input,textarea{margin:0;padding:0;font-weight:400;font-family:Inder,Tahoma,sans-serif;color:var(--white)}ol,ul{list-style:none}a{text-decoration:none;color:var(--white)}a:hover{color:var(--pink)}a:active{color:var(--blue)}.projectlink{color:var(--purple);font-weight:800}body{width:auto;height:auto}.circleimage{margin-top:1rem;width:50%;border-radius:50%}header{display:grid;grid-template-areas:".       top .      " ".       mid .      " "bottoml .   bottomr";grid-template-columns:.5fr 1fr .5fr;grid-template-rows:.5fr 1fr .5fr;background-color:var(--black);min-height:10vh;width:100%;text-align:center;border-bottom:2px solid #fff;justify-content:space-around;align-items:center}h1{color:#fff}#headingname{grid-area:top;color:#000}#logo{width:30%;justify-self:center;grid-area:mid}#linkedin{grid-area:bottoml;justify-self:start}#github{grid-area:bottomr;justify-self:end}#github,#linkedin{max-width:40px;padding:6px}@media all and (min-width: 1280px){header{display:grid;grid-template-areas:". . top ." ". . mid ." "bottomll bottomlr . bottomr";grid-template-columns:.25fr .25fr 1fr .5fr;grid-template-rows:.5fr 1fr .5fr}#linkedin{grid-area:bottomll;justify-self:start}#github{grid-area:bottomll;justify-self:center}#logo{width:20%}}@media all and (min-width: 1024px) and (max-width: 1280px){#logo{width:30%}}@media all and (max-width: 480px){#logo{width:35%}}nav{background-color:var(--black);align-self:flex-start}.container{min-width:180px;width:90%;grid-area:nav}.contact-section h2{text-align:center}.contact-section{background-color:var(--black);padding:0 10%;margin:auto}.navbar{width:100%;justify-content:flex-start;align-items:flex-start}.nav-container{justify-content:space-between;align-items:center;height:62px}.navbar .menu-items{display:flex}.navbar .nav-container li{list-style:none}.navbar .nav-container a{text-decoration:none;color:--white;font-weight:500;font-size:1.2rem;padding:.7rem}.nav-container{display:block;position:relative;height:60px}.nav-container .checkbox{position:absolute;display:block;height:32px;width:32px;top:20px;left:20px;z-index:5;opacity:0;cursor:pointer}.nav-container .hamburger-lines{display:block;height:26px;width:32px;position:absolute;top:17px;left:20px;z-index:2;display:flex;flex-direction:column;justify-content:space-between}.nav-container .hamburger-lines .line{display:block;height:4px;width:100%;border-radius:10px;background:var(--white)}.nav-container .hamburger-lines .line1{transform-origin:0% 0%;transition:transform .4s ease-in-out}.nav-container .hamburger-lines .line2{transition:transform .2s ease-in-out}.nav-container .hamburger-lines .line3{transform-origin:0% 100%;transition:transform .4s ease-in-out}.navbar .menu-items{padding-top:60px;box-shadow:inset 0 2000px #000000e6;height:auto;width:50vw;transform:translate(-150%);display:flex;flex-direction:column;margin-left:-40px;padding-left:50px;transition:transform .5s ease-in-out;text-align:center}.navbar .menu-items li{margin-bottom:1.2rem;font-size:1.5rem;font-weight:500}.logo{position:absolute;top:5px;right:15px;font-size:1.2rem;color:#0e2431}.nav-container input[type=checkbox]:checked~.menu-items{transform:translate(0)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line1{transform:rotate(45deg)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line2{transform:scaleY(0)}.nav-container input[type=checkbox]:checked~.hamburger-lines .line3{transform:rotate(-45deg)}.nav-container input[type=checkbox]:checked~.logo{display:none}@media (min-width: 769px){nav{height:auto;align-self:flex-end;text-align:end}.container{width:auto}div .navbar{align-self:flex-end;text-align:end}.navbar .menu-items{flex-direction:row;justify-content:center;text-align:center;transform:none;height:40px;transition:none;box-shadow:none;padding:5px;width:auto;border:0}.container .nav-container{width:auto}.nav-container input.checkbox,.nav-container .hamburger-lines{display:none}}footer{width:100%;height:6vh;background-color:var(--black);display:flex;justify-content:center;align-items:center}img{max-width:100%;height:auto}body{width:auto;height:auto;background-color:#000}#bioheading{display:flex;justify-content:center;padding-bottom:1rem;color:--pink}#bioheadshot.circleimage{max-width:300px;display:flex}#biotext{padding:3rem;text-align:left;align-self:center}section{display:flex}div.backgroundcircle{display:flex;flex-direction:column;justify-content:center;align-self:center}.circleimage{align-self:center}@media all and (min-width: 1080px){#biotext{margin-left:300px;margin-right:300px}}@media all and (min-width: 1024px) and (max-width: 1280px){#biotext{margin-left:200px;margin-right:200px}}@media all and (min-width: 768px) and (max-width: 1024px){#biotext{margin-left:100px;margin-right:100px}}h2:hover{color:var(--blue)}.notfound{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:2rem}.projectsection,.pagetext,a{display:flex;flex-direction:column;align-items:center;margin-left:30px;margin-right:30px;margin-bottom:15px}.projectsection{margin-top:35px}.circleimage{max-width:350px}@media all and (min-width: 1450px){.pagetext{margin-left:20%;margin-right:20%}}@media all and (min-width: 1281px) and (max-width: 1449px){.pagetext{margin-left:300px;margin-right:300px}}@media all and (min-width: 1024px) and (max-width: 1280px){.pagetext{margin-left:200px;margin-right:200px}}#fs-frm{justify-content:center;align-items:center;min-height:600px;width:100%}#fs-frm button,fieldset{border:0;font-size:16px;color:var(--white)}#fs-frm button{display:block;margin:auto;background-color:var(--white);color:var(--black);padding:5px;border-radius:5px;transition:.5s ease-in-out}#fs-frm button:hover{color:var(--white);background-color:var(--pink)}#fs-frm-inputs label{margin-bottom:5px}#fs-frm-inputs input{margin-bottom:20px;padding:10px;font-size:16px}#fs-frm-inputs label,#fs-frm-inputs input{display:block}#fs-frm-inputs input::placeholder,#fs-frm-inputs textarea::placeholder{color:var(--white)}#full-name{background-color:var(--black);border:1px solid var(--blue)}#email-address{background-color:var(--black);border:1px solid var(--pink)}#message{background-color:var(--black);border:1px solid var(--mint)}#fs-frm-inputs input,#fs-frm-inputs textarea{width:100%;padding:10px}@media all and (min-width: 1300px){.contact-section{padding:0 35%}}@media all and (min-width: 1024px){.contact-section{padding:0 30%}}