:root { --header-height: 60px; }

html, body { font-family: 'Capriola', sans-serif; margin: 0; padding: 0; font-size: 16px; }

nav { font-family: 'Capriola', sans-serif; font-size: 16px; }

/* Pour les ancres */
:target { scroll-margin-top: var(--header-height); }

.bg-spirale { background: url('img/fond_spirale.svg') no-repeat center fixed; background-size: cover; }
.bg-noir { background-color: #111; }
.bg-gris { background-color: #292f35; }

.text-sang { color: #a00; }

.border-sang { border-color: #a00; }

hr.interpages { height: 20px; margin: 100px 0; }
hr.interparagraphes { height: 20px; margin: 20px 0; }

div.fullscreen { height: 100vh; }

.img-xl, .img-lg, .img-md, .img-sm, .img-xs { width: 100%; height: auto; }
.img-xl { max-width: 1024px; }
.img-lg { max-width: 512px; }
.img-md { max-width: 384px; }
.img-sm { max-width: 256px; }
.img-xs { max-width: 128px; }
.img-bw { transition: all .2s ease-in; filter: grayscale(100%); }
.img-bw:hover { filter: grayscale(0%); }

.fs-7 { font-size: .8em; }

.text-justify { text-align: justify; }

main { padding-top: var(--header-height); }

@media all and (max-width: 992px) { /* version mobile */

html, body { font-size: 14px; }

hr.interpages, hr.interparagraphes { margin: 0; }

div.fullscreen { height: auto; margin-top: 100px !important; }

}