/*/////////////////////////////////////////////*/ /*IMPORT CSS*/ @import url(./reset.css); @import url(./fonts.css); @import url(./header.css); @import url(./footer.css); /*/////////////////////////////////////////////*/ /*GLOBAL VARIABLE*/ :root { /* color range */ --color-purple: #ee1998; --color-pink: #ff7bca; --color-green: #8fce3c; --color-yellow: #e3e00a; --color-blue: #51cee4; --color-water: #0c9cb5; /* colors texts */ --color-texts: rgb(1, 1, 1); --color-texts-special: rgb(1, 1, 1); /* colors links */ --color-links: rgb(120, 1, 1); --color-links-hover: rgb(120, 1, 1); --color-links-visited: rgb(120, 1, 1); --color-links-active: rgb(120, 1, 1); /* colors titles */ --color-title-1: rgb(120, 1, 1); --color-title-2: rgb(120, 1, 1); --color-title-3: rgb(120, 1, 1); --color-title-4: rgb(120, 1, 1); --color-title-5: rgb(120, 1, 1); --color-title-6: rgb(120, 1, 1); /* colors buttons */ --primary-hue: 12; --color-button: hsl(var(primary-hue), 1%, 1%); /* fonts */ --font-titles: 'paradroid'; --font-texts: 'louisgeorge'; --font-fallback: 'cabrion'; } /*/////////////////////////////////////////////*/ /*GENERAL SETTINGS*/ html { scroll-behavior: smooth; } body { display: flex; flex-direction: column; } main { min-height: calc(100vh - 70px); } /*/////////////////////////////////////////////*/ /*TEXTS*/ 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; } a, a:link { color: var(--color-links); } a:visited { color: var(--color-links-visited); } a:hover { color: var(--color-links-hover); } a:active { color: var(--color-links-active); } 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); }