:root{--grid-column:5/12}.off-screen-menu{background-color:var(--background);height:100vh;max-height:100%;width:100%;position:fixed;top:-100%;left:0;opacity:.5;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-size:2rem;transition:.3s ease}.off-screen-menu span{opacity:.2;transition:.3s ease}.off-screen-menu.active span{opacity:1}.off-screen-menu.active{top:0;opacity:1}nav{padding:.5rem;display:flex;position:fixed;right:0}.ham-menu{height:30px;width:30px;margin-left:auto;position:relative}.ham-menu span{height:3px;width:100%;background-color:#fff;border-radius:25px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:.3s ease}.ham-menu span:first-child{top:25%}.ham-menu span:nth-child(3){top:75%}.ham-menu.active span:first-child{top:50%;transform:translate(-50%,-50%) rotate(45deg)}.ham-menu.active span:nth-child(3){top:50%;transform:translate(-50%,-50%) rotate(-45deg)}.ham-menu.active span:nth-child(2){opacity:0}.intro{grid-column:var(--grid-column);grid-row:2/6}.title{font-size:var(--font--size-huge)}.nav-container{top:30%;transform:translateY(-70%)}.projects{grid-column:var(--grid-column);grid-row:1/6;padding-top:5dvh}.project-card{transition:.5s ease}.project-card:hover{filter:brightness(.9);transition:.5s ease}.about{grid-column:var(--grid-column);grid-row:2/6}.about p{font-size:clamp(25px,4vw,3vw)}.contact{grid-column:var(--grid-column);grid-row:2/7}.contact-button{border-bottom:2px solid #aaa;color:#fff;font-size:1.875rem;line-height:2.25rem;background:none;text-decoration:none;cursor:pointer;transition:opacity .2s ease}.contact-button:hover{opacity:.8;color:#fff}.arrow-img{position:absolute;animation:float 2s ease infinite;transform:rotate(80deg)}.clickable{animation:glow 5s ease infinite}.underline-text{padding:0;border-bottom:1px solid #aaa}@keyframes glow{25%{filter:brightness(1)}50%{filter:brightness(1.5)}75%{filter:brightness(1)}}@media (max-width:600px){.hamburger{display:block}.nav-container{display:none}:root{--grid-column:2/12}}@media (min-width:600px){.hamburger{display:none}}