First version

assets/css/main.sass

@@ -8,6 +8,11 @@ $color-tertiary: #f4f5f6
 $color-quaternary: #d1d1d1
 $color-quinary: #e1e1e1
 
+@import "./header"
+@import "./nav"
+@import "./footer"
+@import "./actu"
+
 body
   margin: 0
   font-family: $font-family-serif2
@@ -19,11 +24,24 @@ h1
 
 h2
   font-size: 2rem
+  margin-top: 4rem
 
 h2, h3
   font-family: $font-family-sans-serif7
   color: $color-primary
 
+hr
+    border: 0
+    height: 2px
+    margin: 2rem 0
+    background-color: rgba($color-primary, 0.25)
+
+.txt-center
+  text-align: center
+
+img
+  display: block
+
 blockquote
   border-left: 4px solid $color-primary
   font-style: italic
@@ -37,190 +55,48 @@ a
 @mixin container
   max-width: $size-lg
   margin: 0 auto
-  padding: 0 20px
+  padding: 0 1rem
 
-.container, #content
+.container
   @include container
 
+  img
+    max-width: 100%
 
-// HEADER
+  &.small
+    max-width: 680px
+    line-height: 1.50
 
-.header
-  margin-top: 52px
-  background-color: $color-primary
-  color: white
+    h2
+      line-height: 1.1
+
+.cfa
+  text-align: center
+  padding: 2rem
 
   a
+    padding: 1rem
+    background-color: $color-primary
     color: white
+    text-decoration: none
 
-  .container
-    padding: 0 0 2rem
-    display: flex
-    align-items: center
-
-  .titleContainer
-    flex: 1
-    text-align: center
-    margin: 2rem 0 0 2rem
-
-  .logo
-    border-bottom-left-radius: 10px
-    border-bottom-right-radius: 10px
-    padding: 10px
-    background-color: white
-
-  h1
-    font-size: 3rem
-    line-height: 1.1
-    margin: 0
-    padding: 0
-
-  cite
-    font-size: 1.4rem
-
+    &:hover
+      background: $color-secondary
 
 // NAV
 
-.nav
-  position: fixed
-  z-index: 10
-  top: 0
-  background-color: white
-  width: 100%
-
-  nav
-    left: 0
-    right: 0
-
-  ul
-    list-style: none
-    margin: 0
-    padding: 0
-
-    li
-      display: inline
-      border-right: 1px solid $color-primary
-
-      &:last-child
-        border-right: none
-
-      a
-        display: inline-block
-        padding: 1rem
-        font-size: 1rem
-        font-weight: bold
-
-#content
+// #content
   // https://freefrontend.com/css-link-styles/
   // https://codepen.io/markmead/pen/drORWG
-  a
-    position: relative
+  // a
+    // position: relative
 
-    &::after
-      content: ""
-      background: rgba($color-primary, 0.25)
-      position: absolute
-      left: 6px
-      bottom: -6px
-      width: calc(100% - 8px)
-      height: calc(100% - 8px)
-      z-index: -1
-
-// FOOTER
-
-.footer
-  border: 1px dotted $color-primary
-  border-top: 0.2rem solid $color-primary
-  margin: 2rem auto
-  padding: 2rem
-
-// ACTUALITES
-$space: 20px
-#content .actualites
-  margin: 0 -$space
-  padding: 0
-
-  > .cell
-    height: 300px
-    padding: $space
-    position: relative
-
-    a
-      display: flex
-      width: 100%
-      height: 100%
-      text-decoration-color: rgba($color-primary, 0)
-      box-sizing: border-box
-      padding: 1rem
-
-      &:hover
-        background: rgba($color-primary, 0.5)
-
-      &::after
-        content: inherit
-
-    .info
-      padding: 2rem
-      background: rgba($color-primary, 0.25)
-      border: 1rem solid rgba(255,255,255,.25)
-      box-sizing: border-box
-      width: 100%
-      height: 100%
-      align-content: center
-      text-align: center
-
-      h3
-        color: white
-        font-size: 2rem
-        text-align: center
-        margin: 0
-        padding: 0
-        flex: 0
-
-      time
-        color: white
-        font-size: 1rem
-        flex: 0
-
-
-    .image
-      position: absolute
-      top: $space
-      bottom: $space
-      left: $space
-      right: $space
-      z-index: -2
-      overflow: hidden
-
-      img
-        height: 100%
-        object-fit: cover
-
-figure.center
-  text-align: center
-
-$imageBorder: 2px
-.actu-image
-  text-align: center
-  padding: 2rem
-
-  div
-    position: relative
-    display: inline-block
-
-    &:before
-      content: ""
-      position: absolute
-      top: -$imageBorder
-      bottom: -$imageBorder
-      left: -$imageBorder
-      right: -$imageBorder
-      width: 100%
-      height: 100%
-      z-index: -1
-      border: $imageBorder solid rgba($color-primary, 0.25)
-
-  img
-    padding: 10px
-    margin: 10px 10px 6px // Pourquoi ?
-    border: $imageBorder solid rgba($color-primary, 0.25)
+    // &::after
+    //   content: ""
+    //   background: rgba($color-primary, 0.25)
+    //   position: absolute
+    //   left: 6px
+    //   bottom: -6px
+    //   width: calc(100% - 8px)
+    //   height: calc(100% - 8px)
+    //   z-index: -1