page home modul central + page static (insertion motif)

web/themes/custom/popsu/css/styles.css

@@ -1244,7 +1244,8 @@ iframe {
   display: grid;
   grid-template-columns: 20% minmax(0, 1fr) 20%;
   column-gap: 3rem;
-  row-gap: 1rem; }
+  row-gap: 1rem;
+  position: relative; }
 
 .layout__region--bottom {
   grid-column: 1 /span 3; }
@@ -1468,6 +1469,7 @@ footer {
     text-decoration: none; }
 
 .main_logo {
+  z-index: 10;
   height: 7rem;
   background: center/contain no-repeat url(../images/popsu-home-logo.png);
   margin: -5rem 0 3rem 0; }
@@ -1559,7 +1561,59 @@ footer {
 
 #home_prog_container {
   display: grid;
-  grid-template-columns: repeat(3, 1fr); }
+  grid-template-columns: repeat(3, 1fr);
+  align-items: center;
+  justify-items: center;
+  margin-top: 1rem; }
+  #home_prog_container .views-row {
+    background-clip: content-box;
+    height: 8rem;
+    width: 100%;
+    display: grid;
+    align-items: center;
+    padding: 1rem; }
+    #home_prog_container .views-row:hover .views-field-title {
+      display: none; }
+  #home_prog_container .views-field-field-diaporama {
+    display: none; }
+  #home_prog_container .views-field-title {
+    margin: 3rem; }
+  #home_prog_container .programme-2 {
+    background: center/contain no-repeat url(../images/POPSU_1.svg); }
+    #home_prog_container .programme-2 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-2:hover {
+      background: #4dabc1; }
+  #home_prog_container .programme-2 {
+    background: center/contain no-repeat url(../images/POPSU_2.svg); }
+    #home_prog_container .programme-2 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-2:hover {
+      background: #61ab32; }
+  #home_prog_container .programme-3 {
+    background: center/contain no-repeat url(../images/POPSU_Europe.svg); }
+    #home_prog_container .programme-3 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-3:hover {
+      background: #646578; }
+  #home_prog_container .programme-5 {
+    background: center/contain no-repeat url(../images/POPSU_monde.svg); }
+    #home_prog_container .programme-5 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-5:hover {
+      background: #ab9569; }
+  #home_prog_container .programme-6 {
+    background: center/contain no-repeat url(../images/POPSU_territoires.svg); }
+    #home_prog_container .programme-6 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-6:hover {
+      background: #e01a35; }
+  #home_prog_container .programme-7 {
+    background: center/contain no-repeat url(../images/POPSU_metropoles.svg); }
+    #home_prog_container .programme-7 .views-field-title {
+      font-size: 0; }
+    #home_prog_container .programme-7:hover {
+      background: #28429f; }
 
 #home_theme_container .slick-arrow {
   position: absolute;
@@ -1615,10 +1669,11 @@ footer {
 #villes-block_1 header, #home_themes-block_1 header, #programmes-block_4 header {
   text-align: center;
   font-family: 'duke';
-  font-size: 2.3rem;
+  font-size: 3.5rem;
   line-height: 1;
   opacity: .3;
-  cursor: pointer; }
+  cursor: pointer;
+  padding: .8rem; }
   #villes-block_1 header .arrow, #home_themes-block_1 header .arrow, #programmes-block_4 header .arrow {
     font-size: 1.6rem;
     display: block;
@@ -1760,6 +1815,16 @@ article p, .paragraph p {
     font-size: 1rem;
     padding: .3rem .5rem; }
 
+.page-node-type-static .layout__region--top {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 40vh;
+  background: url(../images/motif_croix.svg);
+  box-shadow: inset 0 -5rem 8rem white;
+  z-index: -1; }
+
 .page-node-type-programme .layout-content {
   position: relative; }