@charset "UTF-8"; html, body, h1, h2, h3, h4, h5, p, ul, figure { margin: 0; padding: 0; } button { all: unset; cursor: pointer; } a { text-decoration: none; color: inherit; } a:focus-visible { outline: none; } li { list-style-type: none; } body { position: relative; margin: 0; background-color: var(--color-background); color: var(--color-primary); overflow-x: clip; /* clip is the only value that works on Safari mobile */ } main { padding: 0 var(--unit--horizontal); padding-bottom: calc(2 * var(--unit--vertical)) !important; } /* [data-template="info"] main { margin-top: calc(var(--unit--vertical) * 2); } */ hr { height: 1px; border: none; background-color: var(--color-primary); } nav hr { background-color: var(--color-background); margin-left: 0; } input[type=text]:focus-visible { outline: none; } /* ================= SCROLLBAR ================= */ body, html { scroll-behavior: smooth; } /* Works on Firefox */ * { scrollbar-width: thin; scrollbar-color: var(--color-primary) transparent; } /* Works on Chrome, Edge, and Safari */ *::-webkit-scrollbar { width: 6px; height: 6px; } *::-webkit-scrollbar-track { background: transparent; } *::-webkit-scrollbar-thumb { background-color: var(--color-primary); border-radius: 0px; border: none; } @media screen and (min-width: 640px) { body.full-width { --padding-body: calc(var(--unit--horizontal) * 10); } body { padding-left: var(--padding-body) !important; box-sizing: content-box; } main { width: min(60vw, 45rem); padding-left: var(--body-padding); } } .hidden { display: none; } .no-scroll { overflow: hidden !important; } body { background-size: var(--unit--horizontal) var(--unit--vertical); background-image: linear-gradient(to right, var(--color-secondary--x-light) 1px, transparent 1px), linear-gradient(to bottom, var(--color-secondary--light) 1px, transparent 1px), linear-gradient(to bottom, var(--color-secondary--x-light) 1px, transparent 1px); background-position: 0 0, 0 0, 0 calc(var(--unit--vertical) / 2); background-attachment: fixed; } .left:not(.padding) { margin-left: calc(var(--unit--horizontal) * var(--left)); } .padding.left { padding-left: calc(var(--unit--horizontal) * var(--left)); } .top:not(.padding) { margin-top: calc(var(--unit--vertical) * var(--top)); } .padding.top { padding-top: calc(var(--unit--vertical) * var(--top)); } .right:not(.padding) { margin-right: calc(var(--unit--horizontal) * var(--right)); } .padding.right { padding-right: calc(var(--unit--horizontal) * var(--right)); } .bottom:not(.padding) { margin-bottom: calc(var(--unit--vertical) * var(--bottom)); } .padding.bottom { padding-bottom: calc(var(--unit--vertical) * var(--bottom)); } .full-width { width: 100%; } .width { width: calc(var(--unit--horizontal) * var(--width)); } .flex { display: flex; justify-content: var(--content); align-items: var(--align); gap: calc(var(--gap) * var(--unit--horizontal)); } .flex.column { flex-direction: column; } .light { opacity: var(--opacity-light); } .footnote::before { content: "["; } .footnote::after { content: "]"; } /* ================= COLORS ================= */ .texts .text { margin-bottom: var(--unit--vertical); } /* ================= COLORS ================= */ .color { color: var(--color); } .opacity { opacity: var(--opacity); } /* ================= BUTTONS ================= */ .toggle-btn--left::after, button.plus::after, button.less::after { margin-left: var(--unit--horizontal); } .toggle-btn--left::after, button.plus::after { content: "+"; } .toggle-btn--left.open::after, button.less::after { content: "-"; } .toggle-btn--right::before { margin-right: var(--unit--horizontal); } .toggle-btn--right::before { content: "+"; } .toggle-btn--right.open::before { content: "-"; } .transition { transition: all 0.5s var(--curve-sine); } .short { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; /* Do not remove : required not to crop letters descenders */ padding-bottom: 0.16rem; height: 8.5rem; } .see-more { width: 100%; margin-top: calc(var(--unit--vertical) / 2); } @font-face { font-family: "Switzer-Variable"; src: url("/assets/fonts/Switzer-Variable.woff2") format("woff2"), url("/assets/fonts/Switzer-Variable.woff") format("woff"), url("/assets/fonts/Switzer-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; font-style: normal; } .accent { color: var(--color-secondary); font-weight: normal; } * { font-family: "Switzer-Variable", sans-serif; } h1, h1 *, h2, h2 *, h3, h3 *, h4, h4 *, h5, h5 *, p, p *:not(strong), figcaption, .toc { font-weight: var(--font-weight-light); line-height: 1; } h1 { font-size: var(--font-size-xl); } h3, .h3 { font-size: var(--font-size-xl); color: var(--color-primary); } article h2 { margin-bottom: calc(var(--unit--vertical) / 2); } .title-center { --margin-left: calc(3 * var(--unit--horizontal)); width: calc(100% - var(--margin-left)); margin-left: var(--margin-left); line-height: var(--unit--vertical); font-size: var(--font-size-l); } .title-center h2 { font-size: var(--font-size-l); } .main-title { line-height: calc(var(--unit--vertical) * 2); text-align: left; box-sizing: border-box; font-weight: var(--font-weight-light); margin-bottom: var(--unit--vertical); } .text__title { font-size: var(--font-size-l); } p, li, button, .fs-m { transform: translateY(calc(var(--unit--vertical) * 0.12)); font-size: var(--font-size-m); line-height: calc(var(--unit--vertical)); } .fs-s { font-size: var(--font-size-s) !important; } .fs-m { font-size: var(--font-size-m) !important; } .fs-l { font-size: var(--font-size-l) !important; line-height: calc(var(--unit--vertical) * 1.3); } .fs-xl { font-size: var(--font-size-xl) !important; line-height: calc(var(--unit--vertical) * 2) !important; } .fs-xxl { font-size: var(--font-size-xxl) !important; line-height: calc(var(--unit--vertical) * 2.5) !important; } p, li, button, .fw-light { font-weight: var(--font-weight-light); } .fw-bold { font-weight: var(--font-weight-bold); } .fw-extra-bold { font-weight: var(--font-weight-extra-bold); } .f-inherit { font-size: inherit; line-height: inherit; font-weight: inherit; } .ta-center { text-align: center; } p { transform: translateY(3px); } input { font-size: var(--font-size-s); font-weight: var(--font-weight-light); } button { display: flex; align-items: center; } a { word-break: break-word; } a > * { word-break: normal; } a * { transition: font 0.2s ease-in-out; } a.no-underline.text__title:hover * { text-decoration: underline; text-decoration-color: inherit; text-decoration-line: underline; text-underline-offset: 0.2rem; text-decoration-thickness: 0.5px; } a:not(.no-underline):hover { text-decoration: none; } a:not(.no-underline) { text-decoration: underline; text-decoration-color: inherit; text-decoration-line: underline; text-underline-offset: 0.2rem; text-decoration-thickness: 0.5px; } article p:not(:last-child), article ul:not(:last-child), article figure:not(:last-child) { margin-bottom: var(--unit--vertical); } .footnote, .footnote * { font-style: normal !important; scroll-margin-block-start: calc(var(--unit--vertical) * 6); color: var(--color-primary); text-decoration: none !important; font-weight: var(--font-weight-bold) !important; } .footnote sup { all: unset; } .footnote:focus-visible, .footnote:target { text-decoration: underline !important; text-underline-offset: 0.5rem; } @media screen and (min-width: 640px) { .title-center { margin-left: calc(2 * var(--unit--horizontal)); } .fs-l { line-height: calc(var(--unit--vertical) * 1.5); } } main { pointer-events: none; } main article > div { pointer-events: all; } .page-cover > * { pointer-events: all; } #main-header { position: fixed; z-index: 2; box-sizing: border-box; width: 100vw; padding-top: calc(var(--unit--vertical) / 2); } [data-template=home] #main-header { pointer-events: none; } #logo * { font-size: 25.3vw; font-weight: var(--font-weight-extra-bold); } #logo span { height: 20vw; width: 100%; box-sizing: border-box; padding-right: 3vw; display: flex; justify-content: flex-end; align-items: center; } #logo { text-align: right; } #logo #actuel { font-weight: 550; } [data-theme=light] #logo #actuel { font-weight: 550; color: white; text-shadow: -1px 0 var(--color-primary), 1px 0 var(--color-primary), 0 -1px var(--color-primary), 0 1px var(--color-primary); } #logo #actuel, #logo #inactuel { mix-blend-mode: difference; } #logo #inactuel { transition: margin-top 0.3s ease-in-out, transform 0.3s ease-in-out; } [data-theme=light] #logo #inactuel { mix-blend-mode: difference; } #main-header.minimized #inactuel { margin-top: -20vw; transform: translateX(-1px) translateY(-1px); } #main-header.minimized #inactuel:not([data-template=home] *) { transform: translateX(-1px) translateY(-1px) !important; } .page-cover, article > h1 { padding-top: 50vw; } .page-cover { position: relative; height: 100svh; box-sizing: border-box; display: flex; flex-direction: column; gap: var(--unit--vertical); } [data-template=home] .page-cover { padding-top: 42.5vw; } .page-cover .title-wrapper h1 { margin-bottom: calc(0.255 * var(--unit--vertical)); } .page-cover .text-wrapper { height: 100%; overflow: auto; } button.toggle.left::after, button.toggle.right::before { transition: all 0.5s var(--curve-sine); content: "+"; } .page-cover .links { position: absolute; bottom: calc(var(--unit--vertical) / 2); width: 100%; box-sizing: border-box; } .page-cover .links li { display: inline-block; margin-right: var(--unit--horizontal); } [data-template=author] .page-cover, [data-template=category] .page-cover, [data-template=year] .page-cover, [data-template=email] .page-cover, [data-template=error] .page-cover, [data-template=info] .page-cover { height: initial !important; } [data-template=author] .page-cover .links, [data-template=category] .page-cover .links, [data-template=year] .page-cover .links, [data-template=email] .page-cover .links, [data-template=error] .page-cover .links, [data-template=info] .page-cover .links { display: none; } @media screen and (min-width: 640px) { body:not([data-template=home]) #main-header { width: var(--body-padding); } #logo * { font-size: 26.65vw; } #logo span { padding-right: 1vw; } body:not([data-template=home]) #logo * { font-size: 5.6vw; } body:not([data-template=home]) #logo span { height: 5vw; padding-right: calc(var(--unit--horizontal) - 0.3vw); } body:not([data-template=home]) #main-header.minimized #inactuel { margin-top: -4.9vw; transform: translateX(-2px) translateY(-2px); } .page-cover:not([data-template=author] .page-cover, [data-template=year] .page-cover, [data-template=category] .page-cover) { height: 100vh; } .page-cover, article > h1 { padding-top: 15vw; } .page-cover { min-height: calc(22 * var(--unit--vertical)); } [data-template=home] .page-cover { padding-top: 42.5vw !important; } .page-cover .links { display: none; } } #nav-overlay { position: fixed; inset: 0; background-color: var(--color-background); opacity: 0.7; z-index: 2; cursor: w-resize; } #nav-overlay:not(.nav-overlay--visible) { display: none; } .panel { display: none; position: fixed; overflow: auto; width: 100vw; height: 100dvh; top: 0; background-color: var(--color-background); outline: 1px solid var(--color-primary); transition: all 0.5s var(--curve-sine); z-index: 3; box-sizing: border-box; flex-direction: column; } .panel.panel--visible { display: flex; } .panel header { position: sticky; top: 0; z-index: 1; background-color: var(--color-background); padding: var(--unit--vertical) var(--unit--horizontal); padding-bottom: 0; } .sort-btns { box-sizing: border-box; } .sort-btns button { all: unset; cursor: pointer; display: inline-block; margin-right: 2vw; } .sort-btns button:hover { text-decoration: underline; text-underline-offset: 4px; } .sort-btns button.active { text-decoration: underline; text-underline-offset: 4px; } .search { position: relative; width: 100%; margin-top: var(--unit--vertical); background-color: var(--color-background); z-index: 1; top: 0; box-sizing: border-box; border-bottom: 1px solid var(--color-primary); display: flex; align-items: center; } .search__input { all: unset; width: 100%; background-color: transparent; padding: calc(var(--unit--vertical) / 4) 0; border: none; border-bottom: 1px solid var(--color-background); color: var(--color-primary); font-size: var(--font-size-m); font-weight: var(--font-weight-light); caret-color: var(--color-primary); } .search__input::-moz-placeholder { color: var(--color-primary); font-size: var(--font-size-sm); letter-spacing: 1px; opacity: 0.55; } .search__input::placeholder { color: var(--color-primary); font-size: var(--font-size-sm); letter-spacing: 1px; opacity: 0.55; } .search__icon { all: unset; position: absolute; width: 0.2rem; height: 0.2rem; padding: 0.5rem; right: 0; /* transform: translateY(0.2rem); */ background-color: var(--color-primary); -webkit-mask: var(--icon-search) no-repeat center; mask: var(--icon-search) no-repeat center; mask-size: contain; -webkit-mask: var(--icon-search) no-repeat center; -webkit-mask-size: contain; } button.search__icon { cursor: pointer; } .panel__collection { scroll-behavior: smooth; height: 100%; overflow: auto; padding: var(--unit--vertical) var(--unit--horizontal); } footer { width: 100%; } .panel-close { position: fixed; box-sizing: border-box; bottom: 0; justify-content: center; width: 100%; outline: none; border-top: 1px solid var(--color-primary); font-size: var(--font-size-m); background-color: var(--color-background); padding: calc(var(--unit--vertical) / 2) var(--unit--horizontal); margin-bottom: env(safe-area-inset-bottom); color: var(--color-primary); line-height: 1; } /* ================= LISTS ================= */ .panel__toggle-btn { width: 100%; display: flex; justify-content: space-between; margin-bottom: var(--unit--vertical); } .panel__toggle-icon { color: var(--color-secondary); font-size: var(--font-size-xl); } /* ================= YEARS ================= */ .panel__collection .panel__item:last-child { margin-bottom: 6rem; } .panel-item-content__edito { margin-bottom: calc(var(--unit--vertical) / 2); } .panel-item-content__edito p:not(:last-child) { margin-bottom: var(--unit--vertical); } button.see-more { margin-bottom: var(--unit--vertical); } .panel-item-content__texts:not(.panel__collection .panel-item-content__texts) { padding: var(--unit--vertical) var(--unit--horizontal); } /* ================= TEXT ITEM ================= */ .panel .text:first-child, .panel .text:last-child { margin-bottom: calc(var(--unit--vertical) * 2); } .panel__collection--years .text:first-child .text__title { display: inline-block; padding-left: var(--unit--horizontal); } .panel .text__subtitle { margin-bottom: calc(var(--unit--vertical) / 4); } .panel__collection--years .text:first-child .text__infos { padding-left: var(--unit--horizontal); } .panel__collection--years .text:first-child .text__infos::before { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 1px; background-color: var(--color-primary); } @media screen and (min-width: 640px) { nav.panel { width: 40rem; } .panel { z-index: 4; width: var(--padding-body); } .panel-close { display: none; } .panel--right { right: auto; left: calc(-100vw - 1px); } .panel--right.open { left: 0; } } article #main-content { scroll-margin-block-start: calc(var(--unit--vertical) * 6); padding-bottom: calc(var(--unit--vertical) * 2); margin-top: calc(2 * var(--unit--vertical)); } #main-content .texts { margin-top: calc(2 * var(--unit--vertical)); } #main-content .see-more { margin-top: calc(var(--unit--vertical) * 0.5); } [data-template=year] article > h1 { margin-bottom: 0; } article #main-content #chapo::after { content: ""; display: block; margin-top: calc(2 * var(--unit--vertical)); margin-bottom: calc(4 * var(--unit--vertical)); width: 100%; height: 1px; background-color: var(--color-background); } article #main-content li:not(.text) { list-style-type: inherit; } article h3 { scroll-margin-top: calc(var(--unit--vertical) * 1); margin-top: calc(3 * var(--unit--vertical)); margin-bottom: calc(1 * var(--unit--vertical)); } @media screen and (max-width: 640px) { article h3 { scroll-margin-top: calc(var(--unit--vertical) * 5); } } article li, article ol { margin-left: var(--unit--horizontal); } article figure { margin: 4rem 0; } article figure img { max-width: 100%; } @media screen and (min-width: 640px) { article #main-content { max-width: auto; } } /* ================= SPECIFIC TO VIRTUAL PAGES ================= */ [data-template=year] .edito { margin-bottom: var(--unit--vertical); } .main-edito-btn { display: inline-block; margin-right: calc(2 * var(--unit--horizontal)); } #main-edito { margin-top: calc(var(--unit--vertical) * 4); scroll-margin-block-start: 25vw; } body.full-width #desktop-nav { height: auto; } body.full-width #desktop-nav .empty { height: calc(var(--unit--vertical) / 2); } body.full-width #main-content { position: absolute; left: 0; width: 100vw; padding: 0 var(--unit--horizontal) var(--unit--vertical) var(--unit--horizontal); box-sizing: border-box; } .grid .column { grid-column: span var(--span); } .grid[data-columns="1"] .column { grid-column: 11/span 20; } [data-template=grid] main #main-content { margin-left: inherit; } @media screen and (max-width: 640px) { .grid .column:not(:last-child) { margin-bottom: calc(2 * var(--unit--vertical)); } } @media screen and (min-width: 640px) { [data-template=grid] main #main-content { margin-left: calc(0px - 4 * var(--unit--horizontal)); } [data-template=grid] .grid { display: grid; grid-template-columns: repeat(39, 1fr); -moz-column-gap: var(--unit--horizontal); column-gap: var(--unit--horizontal); margin-bottom: calc(var(--unit--vertical) * 2); } } #subscribe-btn-wrapper { height: 2.5rem; margin-bottom: 0.2rem; } #subscribe-form { position: relative; width: -moz-fit-content; width: fit-content; } #subscribe-form input { background-color: transparent; border: none; box-sizing: border-box; padding-bottom: 0.3rem; padding-right: 2rem; width: 15rem; border-bottom: 1px solid var(--color-primary); color: var(--color-primary); caret-color: var(--color-primary); } #subscribe-form input::-moz-placeholder { color: var(--color-primary); opacity: 0.55; } #subscribe-form input::placeholder { color: var(--color-primary); opacity: 0.55; } #subscribe-form input:focus-visible { outline: none; } #subscribe-form button[type=submit] { color: var(--color-primary); position: absolute; top: 0; right: 0; } #main-footer { position: fixed; bottom: 0; box-sizing: border-box; border-bottom: 0; } [data-template=home] #main-footer { position: fixed; left: 0; bottom: 0; } @media screen and (max-width: 640px) { #main-footer ul { bottom: 0; display: flex; justify-content: space-around; border-top: 1px solid var(--color-primary); background-color: var(--color-background); } #main-footer .open-nav-wrapper:has([data-open-panel=toc]) { margin-right: 50px; } } @media screen and (min-width: 1100px) { /* On mobile > 1100px, le bouton table des matières n'est pas nécessaire car la TOC est visible */ #main-footer .open-nav-wrapper:has([data-open-panel=toc]) { display: none !important; } } #main-footer li:not(.open-nav-wrapper) { display: none; } #main-footer li { flex: 1; } #main-footer li > * { width: calc(100% - var(--unit--vertical) * 2); } #main-footer button.open-nav { transform: translateY(-2px); } [data-template=home] .title-wrapper button.open-nav { display: inline-block !important; } @media screen and (max-width: 640px) { #main-footer .open-nav { display: flex; justify-content: center; outline: none; font-size: var(--font-size-m); background-color: var(--color-background); color: var(--color-primary); line-height: 1; padding: calc(var(--unit--vertical) / 2) var(--unit--horizontal); } } @media screen and (min-width: 640px) { #main-footer li { display: block !important; } #main-footer { position: fixed; left: 0; bottom: 0; width: var(--body-padding); background-color: transparent; padding: var(--unit--vertical) var(--unit--horizontal); } #main-footer ul { display: block; } #main-footer button.open-nav { margin-bottom: var(--unit--vertical); } [data-template=home] #main-footer .open-nav-wrapper { display: none !important; } .open-nav-wrapper { padding: 0; border: none; background-color: transparent; } } .theme-toggler { position: fixed; right: 0; bottom: 0; padding: calc(var(--unit--vertical) / 2 / 2) calc(var(--unit--horizontal) / 2); margin: calc(var(--unit--vertical) / 2 / 2) calc(var(--unit--horizontal) / 2); margin-bottom: calc(var(--unit--vertical) - var(--unit--vertical) / 2 / 2); z-index: 100; } .theme-toggler-icon { width: 1.2rem; height: 1.2rem; background-color: var(--color-primary); mask-size: cover; -webkit-mask-size: cover; mask: var(--icon-theme-toggler) no-repeat center; -webkit-mask: var(--icon-theme-toggler) no-repeat center; } @media screen and (max-width: 640px) { .theme-toggler { margin-bottom: calc(var(--unit--vertical) / 2 / 2); } .theme-toggler-icon { width: 1.1rem; height: 1.1rem; } } @media print { /* Hide header / footer infos. */ @page { margin: 0; size: auto; @top-left { content: none; } @top-right { content: none; } @top-center { content: none; } @bottom-left { content: none; } @bottom-right { content: none; } @bottom-center { content: none; } } .panel, nav { display: none; } /* regle du light mode dupliqué*/ :root { --color-background: #ffffff; --color-primary: #000; --color-secondary-rgb: 140, 140, 140; --font-weight-light: 240; } body { padding-top: 4rem; background-image: none; background-color: var(--color-background) !important; } .minimized #inactuel { transform: none !important; margin: 0 !important; } #logo h1 { display: grid; grid-template-columns: 100%; grid-template-rows: auto; } #logo #actuel, #logo #inactuel { grid-column: 1; grid-row: 1; } #logo #actuel { font-weight: 550; color: rgb(254, 250, 254) !important; text-shadow: -1px 0 var(--color-primary), 1px 0 var(--color-primary), 0 -1px var(--color-primary), 0 1px var(--color-primary); z-index: 100; } #logo #inactuel { z-index: 0; } .main-title.fs-xxl { font-size: 7rem !important; line-height: 1 !important; } #main-header { position: relative; } #entry-btns { display: none; } a { text-decoration: none !important; } article #main-content { width: 60%; margin: auto; } } .toc { display: flex; flex-direction: column; justify-content: center; } .page-cover .toc { flex: 1; } @media (min-width: 1100px) { .page-cover .toc { position: fixed; width: calc(var(--body-padding) - var(--unit--horizontal) * 2); left: 0; top: 15vw; padding-inline: var(--unit--horizontal); padding-top: calc(var(--unit--vertical) / 2); } } .panel-toc .toc { padding: var(--unit--vertical) var(--unit--horizontal); } .toc_label { font-size: var(--font-size-m); margin-bottom: calc(var(--unit--vertical) / 4); } .toc ul { display: flex; flex-direction: column; gap: calc(var(--unit--vertical) / 4); } .toc li { margin-left: 0; } :root { --color-primary--transparent: rgba(255, 255, 255, 0.86); /* --color-secondary-rgb: 120, 171, 150; --color-secondary: rgba(var(--color-secondary-rgb), 0.86); --color-secondary--light: rgba(var(--color-secondary-rgb), 0.2); --color-secondary--x-light: rgb(var(--color-secondary-rgb), 0.1); --color-tertiary-rgb: 253, 68, 26; --color-tertiary: rgba(var(--color-tertiary-rgb), 0.86); --color-tertiary--light: rgba(var(--color-tertiary-rgb), 0.2); --color-tertiary--x-light: rgb(var(--color-tertiary-rgb), 0.1); */ --color-secondary-rgb: 200, 200, 200; --color-secondary: rgba(var(--color-secondary-rgb), 0.86); --color-secondary--light: rgba(var(--color-secondary-rgb), 0.2); --color-secondary--x-light: rgb(var(--color-secondary-rgb), 0.1); --color-tertiary-rgb: 200, 200, 200; --color-tertiary: rgba(var(--color-tertiary-rgb), 0.86); --color-tertiary--light: rgba(var(--color-tertiary-rgb), 0.2); --color-tertiary--x-light: rgb(var(--color-tertiary-rgb), 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-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); } [data-theme=dark] { --color-background: #000; --color-primary: #ffffff; --font-weight-light: 200; } [data-theme=light] { --color-background: #ffffff; --color-primary: #000; --color-secondary-rgb: 140, 140, 140; --font-weight-light: 240; } @media screen and (min-width: 640px) { :root { --unit--horizontal: 2.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; */ --body-padding: calc(10 * var(--unit--horizontal)); } }/*# sourceMappingURL=style.css.map */