/* @import url(./path/to/sheet.css); */ /*/////////////////////////////////////////////*/ /*RESET*/ body *:not(script) { display: block; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; text-decoration: none; } :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } * { cursor: default; } /*RESET*/ /*/////////////////////////////////////////////*/ /*////////////////////////////////////////////////////*/ /*FONTS*/ @font-face { font-family: 'cabrion'; src: url('../fonts/cabrion/cabrion-light.woff2') format('woff2'), url('../fonts/cabrion/cabrion-light.woff') format('woff'); url('../fonts/cabrion/cabrion-light.otf') format('opentype'); } @font-face { font-family: 'paradroid'; src: url('../fonts/paradroid/paradroidmono-light.woff2') format('woff2'), url('../fonts/paradroid/paradroidmono-light.woff') format('woff'); url('../fonts/paradroid/paradroidmono-light.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge'; src: url('../fonts/louisgeorge/louis_george_cafe.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge_bold'; src: url('../fonts/louisgeorge/louis_george_cafe_bold.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe_bold.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe_bold.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge_bolditalic'; src: url('../fonts/louisgeorge/louis_george_cafe_bold_italic.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe_bold_italic.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe_bold_italic.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge_italic'; src: url('../fonts/louisgeorge/louis_george_cafe_italic.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe_italic.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe_italic.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge_light'; src: url('../fonts/louisgeorge/louis_george_cafe_light.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe_light.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe_light.ttf') format('truetype'); } @font-face { font-family: 'louisgeorge_lightitalic'; src: url('../fonts/louisgeorge/louis_george_cafe_light_italic.woff2') format('woff2'), url('../fonts/louisgeorge/louis_george_cafe_light_italic.woff') format('woff'); url('../fonts/louisgeorge/louis_george_cafe_light_italic.ttf') format('truetype'); } /*FONTS*/ /*////////////////////////////////////////////////////*/ /*/////////////////////////////////////////////*/ /*GLOBAL VARIABLE*/ :root { /* colors */ --color-texts: rgb(1, 1, 1); --color-links: rgb(1, 1, 1); --color-purple: #ee1998; --color-pink: #ff7bca; --color-green: #8fce3c; --color-yellow: #e3e00a; --color-blue: #51cee4; --color-water: #0c9cb5; /* fonts */ --font-titles: 'paradroid'; --font-texts: 'louisgeorge'; --font-fallback: 'cabrion'; } /*GLOBAL VARIABLE*/ /*/////////////////////////////////////////////*/ /*/////////////////////////////////////////////*/ /*GENERAL SETTINGS*/ html { scroll-behavior: smooth; } main { min-height: calc(100vh - 70px); } h1, h2, h3, h4, h5, h6 { font-family: var(--font-titles), var(--font-fallback), sans-serif; } a, p, li { font-family: var(--font-texts), var(--font-fallback), sans-serif; } a, a > * { cursor: pointer; } article a { color: var(--color-links); } li *, li p, article b, article em, article i, article a, article var { display: inline; } p, var { color: var(--color-texts); } i { font-style: italic; } b { font-weight: 600; color: var(--article-medium); } em { font-weight: 600; color: var(--article-em); } /*GENERAL SETTINGS*/ /*/////////////////////////////////////////////*/