:root{font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Helvetica,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol;scroll-padding-top:var(--head-height,5rem);@media(max-width:424px){--header-margin: 2%; } @media (min-width: 425px) { --header-margin: 5%; } --text-color: #272726; --main-bg: ghostwhite; --header-bg: #75a7b8; --header-fg: white; --work-bg: aliceblue; --work-fg: black; } html { scroll-behavior: smooth; } body { line-height: 1.5rem; background-color: var(--main-bg); padding: 0; margin: 0; } header { position: sticky; top: 0; padding: 1rem var(--header-margin) 0.5rem var(--header-margin); z-index: 2; } footer { display: flex; justify-content: space-between; margin-top: 2rem; padding: 0.5rem var(--header-margin); @media (max-width: 840px) { flex-direction: column-reverse; align-items: center; gap: 0.75rem; } } header,footer { background-color: var(--header-bg); color: var(--header-fg); font-size: 1.1rem; width: calc(100% - 2 * var(--header-margin)); } .head { display: flex; flex-wrap: wrap; justify-content: space-between; } h1 { font-size: clamp(1.8rem,4vw,1.9rem); font-weight: 500; letter-spacing: 0.5rem; margin-block: 2px 4px; } h2 { color: var(--text-color); text-transform: uppercase; letter-spacing: 0.5rem; padding-top: 2rem; padding-bottom: 0.5rem; } .container { width: min(100% - 2rem,70rem); margin-inline: auto; } .hlist { list-style-type: none; margin: 0; padding: 0; } .hlist li { display: inline-block; &:not(:last-child) { padding-inline-end: 0.9rem; } } .roles { padding-top: 0.5rem; } .roles li { font-weight: 600; font-style: italic; &:not(:last-child) { padding-inline-end: 0.1rem; &::after{content:","}}}.tagline{font-size:1rem;font-weight:300;letter-spacing:.1em;padding-block:.5rem}.tagline li{padding-inline-end:.5rem}nav{padding-top:.5rem;a { padding-bottom: 5px; &:hover { border-bottom: 2px solid white; } }}:is(nav,.socials) a{text-decoration:none;color:#fff}.copyright{font-style:italic}img{font-style:italic;width:100%;object-fit:cover;vertical-align:middle;opacity:.95}.hero img{height:calc(100svh - var(--head-height))}.work{padding:.4rem 1.2rem;color:var(--work-fg);background-color:var(--work-bg);border:1px solid var(--header-bg);border-radius:7px}.work a{font-weight:700;color:var(--work-fg)}.work-list{display:grid;gap:1.8rem 2.5rem;grid-template-columns:repeat(auto-fit,minmax(min(43ch,100%),1fr))}.year-div{display:flex;gap:1rem;justify-content:space-between}.year{font-weight:400;font-style:italic}.award{font-style:italic;font-weight:500;line-height:1rem;color:#ba746e;ul { width: max-content; } li { display: block; padding-inline-end: 0; }}.artist{display:block;font-weight:700}.publisher{font-weight:300}.about p{letter-spacing:.06rem;margin-top:2rem}.about-img{float:right;max-width:40%;padding-left:1rem;border-radius:80px}.email{font-size:1rem}.fab{font-family:var(--fa-style-family-brands);color:#fff}.notfound{height:84dvh}.err-txt{padding:5rem}.err-txt p{font-size:1.4rem}