53 lines
1.6 KiB
CSS
53 lines
1.6 KiB
CSS
:root {
|
|
--color-background: #000;
|
|
--color-primary: #ffffff;
|
|
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
|
--color-secondary: rgb(120, 171, 150, 0.86);
|
|
--color-secondary--light: rgb(119, 177, 157, 0.2);
|
|
--color-secondary--x-light: rgb(119, 177, 157, 0.1);
|
|
|
|
--unit--horizontal: 5vw;
|
|
--unit--vertical: 1.7rem;
|
|
--unit--vertical-relative: calc(
|
|
var(--unit--vertical) * var(--window-height-factor)
|
|
);
|
|
|
|
--font-size-s: 0.8rem;
|
|
--font-size-sm: calc(var(--font-size-s) * 1);
|
|
--font-size-m: calc(var(--font-size-s) * 1.5);
|
|
--font-size-l: calc(var(--font-size-m) * 1.5);
|
|
--font-size-xl: calc(var(--font-size-l) * 1.5);
|
|
--font-size-xxl: calc(var(--font-size-xl) * 1.5);
|
|
|
|
--font-weight-light: 200;
|
|
--font-weight-bold: 400;
|
|
--font-weight-extra-bold: 550;
|
|
|
|
--opacity-light: 0.6;
|
|
|
|
--curve-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
|
|
}
|
|
|
|
@media screen and (min-width: 640px) {
|
|
:root {
|
|
--color-background: #000;
|
|
--color-primary: #ffffff;
|
|
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
|
--color-secondary: rgb(120, 171, 150, 0.86);
|
|
--color-secondary--light: rgb(119, 177, 157, 0.25);
|
|
--color-secondary--x-light: rgb(119, 177, 157, 0.15);
|
|
|
|
--unit--horizontal: 5vw;
|
|
--unit--vertical: 1.7rem;
|
|
|
|
--font-size-s: 0.9rem;
|
|
--font-size-m: calc(var(--font-size-s) * 1.5);
|
|
--font-size-l: calc(var(--font-size-m) * 1.5);
|
|
--font-size-xl: calc(var(--font-size-l) * 1.5);
|
|
--font-size-xxl: calc(var(--font-size-xl) * 1.5);
|
|
|
|
--font-weight-light: 200;
|
|
--font-weight-bold: 400;
|
|
--font-weight-extra-bold: 550;
|
|
}
|
|
}
|