$fave: #aa71fa; $off-dark: #1b181e; $body-bg: #d5bbf9; $link: #551a8b; $link-hover: #32594f; $header-link-bg: #2a2333; body { background-color: $off-dark; font-family: lato; } .block { background-color: $body-bg; width: 60%; margin: auto; border-radius: 1em; color: $off-dark; padding-left: 3em; padding-right: 3em; padding-top: 1em; padding-bottom: 1em; margin-top: 1em; } #footer { text-align: center; } #header { text-align: center; line-height: 2; & > a { border-radius: 1em; background-color: $header-link-bg; padding-top: 0.3em; padding-bottom: 0.3em; padding-left: 0.4em; padding-right: 0.4em; color: $fave; text-decoration: none; font-weight: bold; white-space: nowrap; &:hover { color: $link-hover; } } } .title { margin-top: 0em; } .toki-pona { font-family: lipamanka; } a { color: $link; transition: color 0.3s; &:hover { color: $link-hover; } &:active { color: $fave; } } @font-face { font-family: lipamanka; src: url(/linjamanka.woff); } @font-face { font-family: lato; src: url(/lato.woff2); }