Files
town/home/style.css
T
2026-07-22 13:21:38 +01:00

85 lines
1.5 KiB
CSS

:root {
font-family: Inter, sans-serif;
font-feature-settings: 'liga' 1, 'calt' 1;
@supports (font-variation-settings: normal) {
font-family: InterVariable, sans-serif;
}
}
body {
height: 100vh;
background: url("assets/clouds.png"), linear-gradient(180deg, hwb(230 20% 0%) 0%, hwb(230 90% 0%) 110%);
background-repeat: no-repeat;
background-size: cover, cover;
padding: 20px;
}
* {
font-style: italic;
color: white;
font-weight: 300;
}
.heavy {
font-weight: 400;
}
.heavier {
font-weight: 500;
}
p, a, li, ul {
font-size: 20px;
@media (max-width: 1024px) {
font-size: 30px;
}
}
.big {
font-size: 24px;
@media (max-width: 1024px) {
font-size: 36px;
}
}
/* tailwind lite */
:root { --space: 4px; }
.flex { display: flex; width: fit-content; }
.flex-col { flex-direction: column; }
.gap-2 { gap: calc(var(--space) * 2); }
.gap-4 { gap: calc(var(--space) * 4); }
.gap-8 { gap: calc(var(--space) * 8); }
.mt-4 { margin-top: calc(var(--space) * 4); }
.max-w-160 { max-width: calc(var(--space) * 160) }
.self-start { align-self: flex-start; }
/* tailwind lite */
.pop {
display: inline-block;
transform-origin: left center;
transition: transform 0.1s ease;
}
.pop:hover {
transform: scale(1.25);
}
.img {
object-fit: contain;
align-self: flex-start;
max-height: 64px;
@media (max-width: 1024px) {
max-height: 96px;
}
}
ul {
list-style-type: "» ";
padding-left: 1.2em;
}