body {

--bg-1: hsl(0, 0%, 100%);

--bg-2: hsl(206, 20%, 90%);

--bg-3: hsl(206, 20%, 80%);

--fg-1: hsl(0, 0%, 13%);

--fg-2: hsl(0, 0%, 20%);

--fg-2: hsl(0, 0%, 30%);

--link: hsl(208, 77%, 47%);

--link-hover: hsl(208, 77%, 55%);

--link-active: hsl(208, 77%, 40%);

--border-radius: 4px;

--font: Ubuntu, sans-serif;

--font-mono: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas,

'DejaVu Sans Mono', monospace;

background: var(--bg-1);

color: var(--fg-1);

font-family: var(--font);

line-height: 1.5;

margin: 1rem;

height: calc(100vh - 2rem);

}

body > div {

height:100%;

}

nav {

position: relative;

display: flex;

gap: 1em;

padding: 1em;

background: var(--bg-2);

z-index: 2;

margin: 0 0 1em 0;

border-radius: var(--border-radius);

}

h1 {

font-weight: lighter;

font-size:40px;

}