@font-face
  font-family: 'League Spartan Variable'
  src: url('/fonts/LeagueSpartan-VF.woff2') format('woff2-variations')
  font-weight: 200 900
  font-display: swap

html
  font-size: 18px

body
  font-weight: 400
  line-height: 1.2
  font-family: 'League Spartan Variable'

.viemunicipale #content, #content .viemunicipale
  --color-title: var(--color-green)
.cadredevie #content, #content .cadredevie
  --color-title: var(--color-blue)
.economie #content, #content .economie
  --color-title: var(--color-orange)
.associations #content, #content .associations
  --color-title: var(--color-purple)

h1, h2, h3, h4, h5
  font-weight: 600
  text-transform: uppercase

h1
  text-align: center
  text-transform: uppercase
  color: var(--color-green)
  margin: 0 1rem 1rem
  padding: 1rem
  font-size: 2.5rem
  word-wrap: anywhere
  @media screen and (max-width: $size-sm)
    font-size: 1.2rem
    margin: 0

  strong
    font-size: 3.5rem
    @media screen and (max-width: $size-sm)
      font-size: 1.8rem

h2
  font-size: 1.4rem
  margin: 1rem 0
  text-transform: uppercase
  @media screen and (max-width: $size-sm)
    font-size: 1.1rem

h3
  font-size: 1.1rem
  text-transform: uppercase
  @media screen and (max-width: $size-sm)
    font-size: 1rem

h1, h2, h3
  color: var(--color-title)

h4
  font-size: 1rem
  @media screen and (max-width: $size-sm)
    font-size: .9rem

p
  margin-top: 1rem
  margin-bottom: 1rem

small,
.text_small
  font-size: 0.8rem