1 line
No EOL
8.7 KiB
CSS
1 line
No EOL
8.7 KiB
CSS
body,h1,h2,h3,h4,h5,html,p,ul{margin:0;padding:0}button{background:none;border:none;padding:0;font:inherit;cursor:pointer;outline:inherit}a,button{color:inherit}a{text-decoration:none}li{list-style-type:none}:root{--color-background:#000;--color-primary:#fff;--color-primary--transparent:hsla(0,0%,100%,.86);--color-secondary:rgba(120,171,150,.86);--color-secondary--light:rgba(119,177,157,.2);--color-secondary--x-light:rgba(119,177,157,.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}@media screen and (min-width:640px){:root{--color-background:#000;--color-primary:#fff;--color-primary--transparent:hsla(0,0%,100%,.86);--color-secondary:rgba(120,171,150,.86);--color-secondary--light:rgba(119,177,157,.25);--color-secondary--x-light:rgba(119,177,157,.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}}body{box-sizing:border-box;padding:0 var(--unit--horizontal);background-color:var(--color-background);color:var(--color-primary)}body,main{position:relative}hr{height:calc(var(--unit--vertical) / 2);border:none;background-color:var(--color-primary);width:calc(var(--unit--horizontal) * 4);margin:calc(var(--unit--vertical) * 2) calc(var(--unit--horizontal))}nav hr{background-color:var(--color-background);margin-left:0}body,html{scroll-behavior:smooth}*{scrollbar-width:thin;scrollbar-color:transparent transparent}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:transparent;border-radius:0;border:none}@media screen and (min-width:640px){body{padding:0 calc(6 * var(--unit--horizontal))}}.hidden{display:none}.grid{background-size:var(--unit--horizontal) var(--unit--vertical);background-image:linear-gradient(90deg,var(--color-secondary--x-light) 1px,transparent 0),linear-gradient(180deg,var(--color-secondary--light) 1px,transparent 0),linear-gradient(180deg,var(--color-secondary--x-light) 1px,transparent 0);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}.color{color:var(--color)}.opacity{opacity:var(--opacity)}@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:400}*{font-family:Switzer-Variable,sans-serif}#logo *{font-size:25vw;line-height:4rem;transform:translate(-2px,-13px);font-weight:var(--font-weight-extra-bold)}h1,h2,h3,h4,h5,p{font-weight:var(--font-weight-light);line-height:1}h2{font-size:var(--font-size-xl)}article h2{margin-bottom:calc(var(--unit--vertical) / 2)}.title-center{--margin-left:calc(4 * var(--unit--horizontal));width:calc(100% - var(--margin-left));margin-left:var(--margin-left);font-size:var(--font-size-l);line-height:var(--unit--vertical)}.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)}.texts__title{font-size:var(--font-size-l)}.fs-m,button,li,p{transform:translateY(calc(var(--unit--vertical) * .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}.fs-xl{font-size:var(--font-size-xl)!important;line-height:calc(var(--unit--vertical) * 1.5)!important}.fs-xxl{font-size:var(--font-size-xxl)!important;line-height:calc(var(--unit--vertical) * 2.5)!important}.fw-light,button,li,p{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)}button{display:flex;align-items:center}a *{transition:font .2s ease-in-out}a.no-line:hover *{font-weight:250}a:not(.no-line):hover{text-decoration:none}a:not(.no-line){text-decoration:underline;text-decoration-color:inherit;text-decoration-line:underline;text-underline-offset:.2rem;text-decoration-thickness:.5px}article p:not(:last-child){margin-bottom:var(--unit--vertical)}@media screen and (min-width:640px){.title-center{margin-left:calc(2 * var(--unit--horizontal))}}#main-header{position:fixed;z-index:1;top:0;left:0;box-sizing:border-box;width:100vw;height:calc(var(--unit--vertical) * 5);padding:var(--unit--vertical) var(--unit--horizontal);transition:height .2s ease-in-out}#logo{position:relative}#main-header.open #actuel{color:var(--color-background)}#logo #actuel{color:var(--color-primary--transparent);position:relative;z-index:1}#logo #inactuel{position:absolute;z-index:0;color:var(--color-secondary);bottom:-48%;transition:bottom .2s ease-in-out}#main-header.minimized #logo #inactuel{bottom:0}.page-cover{position:relative;box-sizing:border-box;height:100svh;display:flex;flex-direction:column;justify-content:space-between;padding-top:calc(var(--unit--vertical-relative) * 5);padding-bottom:calc(5 * var(--unit--vertical))}.page-cover.open+*{margin-top:calc(var(--unit--vertical-relative) * 19)}#home .page-cover{padding-top:calc(var(--unit--vertical-relative) * 6)}#category .page-cover{height:auto;padding-bottom:0;margin-bottom:calc(2 * var(--unit--vertical))}#category .active-tab{max-height:none}@media screen and (min-width:640px){#main-header{display:flex;justify-content:center}#logo{width:37vw}#logo *{font-size:11vw}#main-header.minimized{height:calc(var(--unit--vertical) * 4.3)}.page-cover{padding:calc(10 * var(--unit--vertical)) 0}}.toggle-btns{position:sticky}button.toggle.open:not(.see-more){font-weight:700}button.toggle.left:after{margin-left:var(--unit--horizontal)}button.toggle.left.close:after{content:"+"}button.toggle.left.open:after{content:"-"}button.toggle.right:before{margin-right:var(--unit--horizontal)}button.toggle.right.close:before{content:"+"}button.toggle.right.open:before{content:"-"}#tabs{position:absolute;width:100%;z-index:1;bottom:calc(var(--unit--vertical-relative) * 4)}.active-tab{position:absolute;max-height:calc(var(--unit--vertical-relative) * 17);overflow:auto;transition:max-height .5s ease-in-out;padding:var(--unit--vertical) 0;scrollbar-width:thin;scrollbar-color:#fff transparent}.active-tab::-webkit-scrollbar{width:3px;height:auto}.active-tab::-webkit-scrollbar-track{background:transparent}.active-tab::-webkit-scrollbar-thumb{background-color:#fff;border-radius:1px;border:none}.texts__year.short .year__edito{display:-webkit-box;-webkit-line-clamp:5;overflow:hidden}.texts__year .see-more{width:100%;margin-top:calc(var(--unit--vertical) / 2)}@media screen and (min-width:640px){#home #tabs{margin-top:calc(0px - (10 * var(--unit--vertical)))}button.toggle.left:after{margin-left:calc(var(--unit--horizontal) / 2)}button.toggle.right:before{margin-right:calc(var(--unit--horizontal) / 2)}}.article-header .title-wrapper{--margin-left:2;width:calc(100% - (var(--margin-left) * var(--unit--horizontal)));padding-left:calc(var(--margin-left) * var(--unit--horizontal))}#main-footer{position:fixed;left:0;bottom:0;width:calc(18 * var(--unit--horizontal));padding:var(--unit--horizontal)}#main-footer a{text-shadow:0 0 2px #000;-moz-text-shadow:0 0 2px #000;-webkit-text-shadow:0 0 2px #000}@media screen and (min-width:640px){#main-footer{padding:calc(var(--unit--horizontal) / 2) var(--unit--horizontal)}} |