First version

assets/css/actu.sass

@@ -0,0 +1,105 @@
+// ACTUALITES
+$space: 1rem
+.actualites
+  margin: 0 -$space
+  padding: 0
+
+  > .cell
+    height: 300px
+    padding: $space
+    position: relative
+
+    &.empty
+      width: 100%
+
+    a
+      display: flex
+      width: 100%
+      height: 100%
+      text-decoration-color: rgba($color-primary, 0)
+      box-sizing: border-box
+      padding: $space
+
+      &:hover
+        background: rgba($color-primary, 0.5)
+
+      &::after
+        content: inherit
+
+    .info
+      padding: 2rem
+      background: rgba($color-primary, 0.25)
+      border: $space 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
+  img
+    margin: 0 auto
+    max-width: 100%
+
+$imageBorder: 2px
+.actu-image
+  text-align: center
+  padding: 1rem 0 0
+  max-width: 100%
+
+@media screen and (min-width: 840px)
+  .actu-image
+    padding: 2rem 0
+
+@media screen and (max-width: 839px)
+  $space: .5rem
+  .actualites
+    margin: 0 -$space
+
+    > .cell
+      padding: $space
+      a
+        padding: $space
+
+      .info
+        padding: $space * 2
+        border: $space solid rgba(255,255,255,.25)
+      .image
+        top: $space
+        bottom: $space
+        left: $space
+        right: $space
+
+@media screen and (max-width: 599px)
+    .actualites
+
+      > .cell
+          max-width: 460px