#buttons{display:flex;list-style:none;justify-content:space-around;gap:1rem;margin-top:4rem;margin-bottom:2rem}#buttons>li{border-bottom:2px solid var(--border);flex-grow:1;padding-bottom:.5rem;transition:all .2s}#skill-tab{position:relative}#skill-tab>ul>li>button{background-color:transparent;border:none;cursor:pointer;font-size:1rem;letter-spacing:.08em;font-weight:600;width:100%}.skill-detail{list-style:none;width:100%;display:none}.skill-detail>li{padding:2rem;background-color:var(--block);margin:.5rem;border-radius:6px}.skill-detail>li>p{padding-bottom:.5rem;line-height:1.8em}#landing{height:80dvh;min-height:500px;position:relative}#landing>div{display:grid;height:100%;grid-gap:2rem;gap:2rem;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);grid-template-areas:"context context context context" "context context context context" "title title title ..." "... ... ... skills"}@media (max-width:768px){#landing>div{grid-template-areas:"context context context context" "context context context context" "title title title title" "... ... skills skills"}}#site-title-wrap{grid-area:title}#site-tech{grid-area:skills}#site-title-wrap>div{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:1.5rem;img{max-height:2.5rem;width:max-content;object-fit:contain;object-position:left}span{font-size:3rem;padding:0;font-weight:300}}#site-tech{margin-left:auto;max-width:500px;bottom:25%;background-color:var(--block);padding:2rem;border-radius:6px;height:max-content;span{color:var(--text-dim);width:100%;display:block;text-align:center}}#skills-wrap{display:flex;align-items:center;justify-content:space-evenly;gap:1rem;margin-bottom:1rem;img{width:40%;min-width:50px;max-width:100px;opacity:.7}}#username-input{font-style:italic}#context-wrap{position:relative;grid-area:context}#lab-text,#username{opacity:.7;position:absolute;right:0;text-align:right;padding:0;transition:top .5s,opacity .5s;background:-webkit-linear-gradient(var(--text),var(--background));-webkit-background-clip:text;-webkit-text-fill-color:transparent}#username{font-size:8rem;margin:0;padding:0}#lab-text{font-weight:300;font-size:4rem;transform:translateY(8rem)}@media (max-width:996px){#username{font-size:6rem}#lab-text{font-weight:300;font-size:3rem;transform:translateY(6rem)}}@media (max-width:768px){#username{font-size:4rem}#lab-text{font-weight:300;font-size:2rem;transform:translateY(4rem)}}.swap-out{opacity:0!important}