vm css
This commit is contained in:
		
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							@@ -385,7 +385,8 @@ header .header_nav_container #block-quartiers-de-demain-entete ul {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  header .header_nav_container #block-quartiers-de-demain-entete ul {
 | 
			
		||||
    top: 27.5px;
 | 
			
		||||
    padding-left: 15%;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
    margin: 1rem;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
@@ -407,8 +408,8 @@ header .header_nav_container #block-quartiers-de-demain-entete ul li a {
 | 
			
		||||
  header .header_nav_container #block-quartiers-de-demain-entete ul li a {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    align-items: flex-start;
 | 
			
		||||
    font-size: 0.6rem;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
    font-size: 0.9rem;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
header .header_nav_container #block-quartiers-de-demain-entete ul li:not(:last-of-type) ::after {
 | 
			
		||||
@@ -1139,6 +1140,11 @@ footer {
 | 
			
		||||
  border-radius: 50%;
 | 
			
		||||
  background: black;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home .timeline .__timeline-content .__paragraphs {
 | 
			
		||||
    width: 100vw;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  left: 65%;
 | 
			
		||||
@@ -1467,9 +1473,9 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  pointer-events: none; /* Permet de cliquer à travers l'élément */
 | 
			
		||||
  z-index: 5; /* S'assure que l'élément soit au-dessus */
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
@media (max-width: 1400px) {
 | 
			
		||||
  #home #background-animated {
 | 
			
		||||
    top: 1820px;
 | 
			
		||||
    display: none;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home #background-animated svg {
 | 
			
		||||
@@ -1505,7 +1511,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static {
 | 
			
		||||
    padding-top: 4rem;
 | 
			
		||||
    padding-top: 2rem;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static .field_title {
 | 
			
		||||
@@ -1522,6 +1528,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
  #home article.node-type-static .field_body {
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    width: 90%;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static .field_body > p:nth-child(1) {
 | 
			
		||||
@@ -1634,9 +1641,8 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--1 .field_field_texte .colone-picto p:nth-of-type(1)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
    height: 50px;
 | 
			
		||||
    background-size: 50px 50px;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1651,9 +1657,8 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--1 .field_field_texte .colone-picto p:nth-of-type(2)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
    height: 50px;
 | 
			
		||||
    background-size: 50px 50px;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1668,9 +1673,8 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--1 .field_field_texte .colone-picto p:nth-of-type(3)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
    height: 50px;
 | 
			
		||||
    background-size: 50px 50px;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1685,9 +1689,8 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--1 .field_field_texte .colone-picto p:nth-of-type(4)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
    height: 50px;
 | 
			
		||||
    background-size: 50px 50px;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1702,9 +1705,8 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--1 .field_field_texte .colone-picto p:nth-of-type(5)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
    height: 50px;
 | 
			
		||||
    background-size: 50px 50px;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1791,7 +1793,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--21 .field_field_texte .colone-picto p:nth-of-type(1)::before,
 | 
			
		||||
  #home article.node-type-static #paragraph-id--28 .field_field_texte .colone-picto p:nth-of-type(1)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
@@ -1810,7 +1812,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--21 .field_field_texte .colone-picto p:nth-of-type(2)::before,
 | 
			
		||||
  #home article.node-type-static #paragraph-id--28 .field_field_texte .colone-picto p:nth-of-type(2)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
@@ -1829,7 +1831,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--21 .field_field_texte .colone-picto p:nth-of-type(3)::before,
 | 
			
		||||
  #home article.node-type-static #paragraph-id--28 .field_field_texte .colone-picto p:nth-of-type(3)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
@@ -1848,7 +1850,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--21 .field_field_texte .colone-picto p:nth-of-type(4)::before,
 | 
			
		||||
  #home article.node-type-static #paragraph-id--28 .field_field_texte .colone-picto p:nth-of-type(4)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
@@ -1867,7 +1869,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  content: "";
 | 
			
		||||
  padding-bottom: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--21 .field_field_texte .colone-picto p:nth-of-type(5)::before,
 | 
			
		||||
  #home article.node-type-static #paragraph-id--28 .field_field_texte .colone-picto p:nth-of-type(5)::before {
 | 
			
		||||
    width: 50px;
 | 
			
		||||
@@ -1883,7 +1885,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  padding-bottom: 2rem;
 | 
			
		||||
  position: relative;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--6 {
 | 
			
		||||
    width: 90%;
 | 
			
		||||
    text-align: center;
 | 
			
		||||
@@ -1893,7 +1895,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  padding-top: 3rem;
 | 
			
		||||
  padding-bottom: 2rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--6 .field_field_title {
 | 
			
		||||
    padding-top: 0;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1902,7 +1904,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  width: 50%;
 | 
			
		||||
  margin: auto;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--6 .field_field_texte {
 | 
			
		||||
    width: 90%;
 | 
			
		||||
  }
 | 
			
		||||
@@ -1922,7 +1924,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  align-self: center;
 | 
			
		||||
  padding-top: 1.5rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 500px) {
 | 
			
		||||
@media (max-width: 810px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--6 .field_field_texte .colone-picto > p:nth-of-type(2) {
 | 
			
		||||
    width: 80%;
 | 
			
		||||
    padding-top: 0;
 | 
			
		||||
@@ -1956,12 +1958,13 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
@media (max-width: 550px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_title {
 | 
			
		||||
    width: 90%;
 | 
			
		||||
    padding-top: 2rem;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte {
 | 
			
		||||
  width: 80%;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte {
 | 
			
		||||
    position: relative;
 | 
			
		||||
    top: -80px;
 | 
			
		||||
@@ -1974,13 +1977,18 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  grid-template-columns: repeat(6 auto);
 | 
			
		||||
  grid-template-rows: repeat(3 auto);
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto {
 | 
			
		||||
    grid-template-rows: repeat(10 auto);
 | 
			
		||||
    grid-template-columns: repeat(2 1fr);
 | 
			
		||||
    padding-left: 0;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto {
 | 
			
		||||
    padding-left: 0;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto h5 {
 | 
			
		||||
  font-size: 5rem;
 | 
			
		||||
  font-weight: 800;
 | 
			
		||||
@@ -1998,7 +2006,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  position: relative;
 | 
			
		||||
  top: -70px;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto h5:nth-of-type(2) {
 | 
			
		||||
    grid-row: 4;
 | 
			
		||||
    grid-column: 2;
 | 
			
		||||
@@ -2011,7 +2019,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  grid-row: 1;
 | 
			
		||||
  grid-column: 5;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto h5:nth-of-type(3) {
 | 
			
		||||
    grid-row: 8;
 | 
			
		||||
    grid-column: 1;
 | 
			
		||||
@@ -2026,7 +2034,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:not(:last-of-type) {
 | 
			
		||||
  padding-right: 2rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p {
 | 
			
		||||
    font-size: 1.2rem;
 | 
			
		||||
  }
 | 
			
		||||
@@ -2036,13 +2044,18 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  grid-column: 1/span 2;
 | 
			
		||||
  padding: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(1) {
 | 
			
		||||
    width: 230px;
 | 
			
		||||
    top: 50px;
 | 
			
		||||
    position: relative;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(1) {
 | 
			
		||||
    width: 270px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(2) {
 | 
			
		||||
  grid-row: 3;
 | 
			
		||||
  grid-column: inherit;
 | 
			
		||||
@@ -2051,7 +2064,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  position: relative;
 | 
			
		||||
  top: -70px;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(2) {
 | 
			
		||||
    grid-row: 4;
 | 
			
		||||
    grid-column: 1/span 2;
 | 
			
		||||
@@ -2060,6 +2073,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
    top: -10px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(2) {
 | 
			
		||||
    width: 270px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(3) {
 | 
			
		||||
  grid-row: 1/span 2;
 | 
			
		||||
  grid-column: 5/span 6;
 | 
			
		||||
@@ -2068,7 +2086,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
  position: relative;
 | 
			
		||||
  left: -0.5rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(3) {
 | 
			
		||||
    grid-row: 8;
 | 
			
		||||
    grid-column: 1/span 2;
 | 
			
		||||
@@ -2079,18 +2097,28 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
    position: relative;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 1090px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto svg:nth-of-type(3) {
 | 
			
		||||
    width: 270px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(1) {
 | 
			
		||||
  grid-row: 3;
 | 
			
		||||
  grid-column: 1/span 2;
 | 
			
		||||
  padding-left: 1rem;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(1) {
 | 
			
		||||
    padding: 1rem;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(2) {
 | 
			
		||||
  display: block;
 | 
			
		||||
  grid-row: 1;
 | 
			
		||||
  height: fit-content;
 | 
			
		||||
  padding-top: 0%;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(2) {
 | 
			
		||||
    grid-row: 7;
 | 
			
		||||
    grid-column: 1/span 2;
 | 
			
		||||
@@ -2101,9 +2129,9 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 | 
			
		||||
}
 | 
			
		||||
#home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(3) {
 | 
			
		||||
  grid-row: 3;
 | 
			
		||||
  grid-column: 5;
 | 
			
		||||
  grid-column: 5/span 6;
 | 
			
		||||
}
 | 
			
		||||
@media (max-width: 700px) {
 | 
			
		||||
@media (max-width: 820px) {
 | 
			
		||||
  #home article.node-type-static #paragraph-id--7 .field_field_texte .colone-picto p:nth-of-type(3) {
 | 
			
		||||
    grid-row: 9;
 | 
			
		||||
    grid-column: 1/span 2;
 | 
			
		||||
 
 | 
			
		||||
@@ -7,7 +7,10 @@ document.addEventListener('scroll', function() {
 | 
			
		||||
    background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)';
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
  // Sélectionnez l'élément SVG
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
  //ANimation Pilliers 
 | 
			
		||||
const svg = document.querySelector('#paragraph-id--7 .pilliers-animes');
 | 
			
		||||
 | 
			
		||||
// Configuration de l'observateur d'intersection
 | 
			
		||||
 
 | 
			
		||||
@@ -312,7 +312,7 @@
 | 
			
		||||
 | 
			
		||||
      // Calculate the offset for the transform
 | 
			
		||||
      const offset = currentSlide * -70 / visibleSlides;
 | 
			
		||||
      const offsetmobile = currentSlide * -130 / visibleSlides;
 | 
			
		||||
      const offsetmobile = currentSlide * -100 / visibleSlides;
 | 
			
		||||
      if (window.innerWidth <= 600){
 | 
			
		||||
      document.querySelector('.__timeline-content').style.transform = `translateX(${offsetmobile}%)`;
 | 
			
		||||
      } else {
 | 
			
		||||
 
 | 
			
		||||
@@ -22,7 +22,7 @@
 | 
			
		||||
    article.node-type-static{
 | 
			
		||||
        padding-top: 6rem;
 | 
			
		||||
        @media(max-width: 810px){
 | 
			
		||||
            padding-top: 4rem;
 | 
			
		||||
            padding-top: 2rem;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .field_title{
 | 
			
		||||
@@ -37,6 +37,7 @@
 | 
			
		||||
            position: relative;
 | 
			
		||||
            @media(max-width: 1090px){
 | 
			
		||||
                flex-direction: column;
 | 
			
		||||
                width: 90%;
 | 
			
		||||
            }
 | 
			
		||||
            > p:nth-child(1){
 | 
			
		||||
                margin-bottom: 0;
 | 
			
		||||
@@ -131,8 +132,8 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                // width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
                            }
 | 
			
		||||
@@ -146,8 +147,8 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                // width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
                            }
 | 
			
		||||
@@ -161,8 +162,8 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                // width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
                            }
 | 
			
		||||
@@ -177,8 +178,8 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                // width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
                            }
 | 
			
		||||
@@ -192,8 +193,8 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                // width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
                            }
 | 
			
		||||
@@ -265,7 +266,7 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
@@ -280,7 +281,7 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
@@ -295,7 +296,7 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
@@ -310,7 +311,7 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
@@ -325,7 +326,7 @@
 | 
			
		||||
                            height: 100px;
 | 
			
		||||
                            content: "";
 | 
			
		||||
                            padding-bottom: 1rem;
 | 
			
		||||
                            @media(max-width: 500px){
 | 
			
		||||
                            @media(max-width: 810px){
 | 
			
		||||
                                width: 50px;
 | 
			
		||||
                                height: 50px;
 | 
			
		||||
                                background-size: 50px 50px;
 | 
			
		||||
@@ -344,37 +345,14 @@
 | 
			
		||||
            align-items: center;
 | 
			
		||||
            padding-bottom: 2rem;
 | 
			
		||||
            position: relative;
 | 
			
		||||
            // &::before{
 | 
			
		||||
            //     content: url('../img/formes-animees-4.svg');
 | 
			
		||||
            //     display: block;
 | 
			
		||||
            //     position: absolute;
 | 
			
		||||
            //     z-index: 5;
 | 
			
		||||
            //     left: 10%;
 | 
			
		||||
            //     top: -6rem;
 | 
			
		||||
            //     @media(max-width: 810px){
 | 
			
		||||
            //         display: none;
 | 
			
		||||
                    
 | 
			
		||||
            //     }
 | 
			
		||||
            // }
 | 
			
		||||
            // &::after{
 | 
			
		||||
            //     content: url('../img/formes-animees-5.svg');
 | 
			
		||||
            //     display: block;
 | 
			
		||||
            //     position: absolute;
 | 
			
		||||
            //     z-index: 5;
 | 
			
		||||
            //     right: 15%;
 | 
			
		||||
            //     top: 3rem;
 | 
			
		||||
            //     @media(max-width: 810px){
 | 
			
		||||
            //         display: none;
 | 
			
		||||
            //     }
 | 
			
		||||
            // }
 | 
			
		||||
            @media(max-width: 500px){
 | 
			
		||||
            @media(max-width: 810px){
 | 
			
		||||
                width: 90%;
 | 
			
		||||
                text-align: center;
 | 
			
		||||
            }
 | 
			
		||||
            .field_field_title{
 | 
			
		||||
                padding-top: 3rem;
 | 
			
		||||
                padding-bottom: 2rem;
 | 
			
		||||
                @media(max-width: 500px){
 | 
			
		||||
                @media(max-width: 810px){
 | 
			
		||||
                 padding-top: 0;
 | 
			
		||||
                }
 | 
			
		||||
 | 
			
		||||
@@ -382,7 +360,7 @@
 | 
			
		||||
            .field_field_texte{
 | 
			
		||||
                width: 50%;
 | 
			
		||||
                margin: auto;
 | 
			
		||||
                @media(max-width: 500px){
 | 
			
		||||
                @media(max-width: 810px){
 | 
			
		||||
                    width: 90%;
 | 
			
		||||
                   }
 | 
			
		||||
                .colone-picto{
 | 
			
		||||
@@ -398,7 +376,7 @@
 | 
			
		||||
                        font-size: 0.8rem;
 | 
			
		||||
                        align-self: center;
 | 
			
		||||
                        padding-top: 1.5rem;
 | 
			
		||||
                        @media(max-width: 500px){
 | 
			
		||||
                        @media(max-width: 810px){
 | 
			
		||||
                            width: 80%;
 | 
			
		||||
                            padding-top: 0;
 | 
			
		||||
                        }
 | 
			
		||||
@@ -432,11 +410,12 @@
 | 
			
		||||
                font-size: 1.8rem;
 | 
			
		||||
                @media(max-width: 550px){
 | 
			
		||||
                    width: 90%;
 | 
			
		||||
                    padding-top: 2rem;
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
            .field_field_texte{
 | 
			
		||||
                width: 80%;
 | 
			
		||||
                @media(max-width: 700px){
 | 
			
		||||
                @media(max-width: 820px){
 | 
			
		||||
                position: relative;
 | 
			
		||||
                top: -80px;
 | 
			
		||||
                }
 | 
			
		||||
@@ -446,11 +425,14 @@
 | 
			
		||||
                    display: grid;
 | 
			
		||||
                    grid-template-columns: repeat(6 auto);
 | 
			
		||||
                    grid-template-rows: repeat(3 auto);
 | 
			
		||||
                    @media(max-width: 700px){
 | 
			
		||||
                    @media(max-width: 820px){
 | 
			
		||||
                        grid-template-rows: repeat(10 auto);
 | 
			
		||||
                        grid-template-columns: repeat(2 1fr);
 | 
			
		||||
                        padding-left: 0;
 | 
			
		||||
                    }
 | 
			
		||||
                    @media(max-width: 1090px){
 | 
			
		||||
                        padding-left: 0;
 | 
			
		||||
                    }
 | 
			
		||||
                    
 | 
			
		||||
                    h5{
 | 
			
		||||
                        font-size: 5rem;
 | 
			
		||||
@@ -469,7 +451,7 @@
 | 
			
		||||
                        grid-column: 3;
 | 
			
		||||
                        position: relative;
 | 
			
		||||
                        top: -70px;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 4;
 | 
			
		||||
                            grid-column: 2;
 | 
			
		||||
                            margin: auto;
 | 
			
		||||
@@ -480,7 +462,7 @@
 | 
			
		||||
                    h5:nth-of-type(3){
 | 
			
		||||
                        grid-row: 1;
 | 
			
		||||
                        grid-column: 5;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 8;
 | 
			
		||||
                            grid-column: 1;
 | 
			
		||||
                            padding-left: 1rem;
 | 
			
		||||
@@ -493,7 +475,7 @@
 | 
			
		||||
                        &:not(:last-of-type){
 | 
			
		||||
                            padding-right: 2rem;
 | 
			
		||||
                        }
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                        font-size: 1.2rem;
 | 
			
		||||
                        }
 | 
			
		||||
                    }
 | 
			
		||||
@@ -501,11 +483,14 @@
 | 
			
		||||
                        grid-row: 1 /span 2;
 | 
			
		||||
                        grid-column: 1 /span 2;
 | 
			
		||||
                        padding: 1rem;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                           width: 230px;
 | 
			
		||||
                           top: 50px;
 | 
			
		||||
                            position: relative;
 | 
			
		||||
                        }
 | 
			
		||||
                        @media(max-width: 1090px){
 | 
			
		||||
                            width: 270px;
 | 
			
		||||
                        }
 | 
			
		||||
                        
 | 
			
		||||
                    }
 | 
			
		||||
                    svg:nth-of-type(2){
 | 
			
		||||
@@ -515,7 +500,7 @@
 | 
			
		||||
                        padding-left: 0;
 | 
			
		||||
                        position: relative;
 | 
			
		||||
                        top: -70px;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 4;
 | 
			
		||||
                            grid-column: 1 /span 2 ;
 | 
			
		||||
                            width: 230px;
 | 
			
		||||
@@ -523,8 +508,9 @@
 | 
			
		||||
                            top: -10px;
 | 
			
		||||
                            
 | 
			
		||||
                        }
 | 
			
		||||
                 
 | 
			
		||||
                 
 | 
			
		||||
                        @media(max-width: 1090px){
 | 
			
		||||
                            width: 270px;
 | 
			
		||||
                        }
 | 
			
		||||
                    }
 | 
			
		||||
                    svg:nth-of-type(3){
 | 
			
		||||
                        grid-row: 1 /span 2;
 | 
			
		||||
@@ -533,7 +519,7 @@
 | 
			
		||||
                        padding-left: 0;
 | 
			
		||||
                        position: relative;
 | 
			
		||||
                        left: -0.5rem;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 8 ;
 | 
			
		||||
                            grid-column: 1 /span 2;
 | 
			
		||||
                            width: 230px;
 | 
			
		||||
@@ -542,19 +528,25 @@
 | 
			
		||||
                            padding-left: 1rem;
 | 
			
		||||
                            position: relative;
 | 
			
		||||
                        }
 | 
			
		||||
                        @media(max-width: 1090px){
 | 
			
		||||
                            width: 270px;
 | 
			
		||||
                        }
 | 
			
		||||
            
 | 
			
		||||
                    }
 | 
			
		||||
                    p:nth-of-type(1){
 | 
			
		||||
                        grid-row: 3;
 | 
			
		||||
                        grid-column: 1 /span 2;
 | 
			
		||||
                        padding-left: 1rem;
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            padding: 1rem;
 | 
			
		||||
                        }
 | 
			
		||||
                    }
 | 
			
		||||
                    p:nth-of-type(2){
 | 
			
		||||
                        display: block;
 | 
			
		||||
                        grid-row: 1;
 | 
			
		||||
                        height: fit-content;
 | 
			
		||||
                        padding-top: 0%;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 7;
 | 
			
		||||
                            grid-column:  1 /span 2;
 | 
			
		||||
                            padding: 1rem;
 | 
			
		||||
@@ -564,18 +556,24 @@
 | 
			
		||||
                    }
 | 
			
		||||
                    p:nth-of-type(3){
 | 
			
		||||
                        grid-row: 3;
 | 
			
		||||
                        grid-column: 5;
 | 
			
		||||
                        @media(max-width: 700px){
 | 
			
		||||
                        grid-column: 5 /span 6;
 | 
			
		||||
                        @media(max-width: 820px){
 | 
			
		||||
                            grid-row: 9;
 | 
			
		||||
                            grid-column:  1 /span 2;
 | 
			
		||||
                            padding-left: 1rem;
 | 
			
		||||
                            top: -80px;
 | 
			
		||||
                            position: relative;
 | 
			
		||||
                        }
 | 
			
		||||
                        @media(max-width: 1090px){
 | 
			
		||||
                        }
 | 
			
		||||
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        /////////////////animation pilliers //////////////
 | 
			
		||||
        #paragraph-id--7 .colone-picto svg #pillier-1-path365{
 | 
			
		||||
            stroke-dasharray: 1000; /* Longueur totale du chemin */
 | 
			
		||||
            stroke-dashoffset: 1000; /* Décalage initial pour cacher le chemin */
 | 
			
		||||
 
 | 
			
		||||
@@ -1,4 +1,5 @@
 | 
			
		||||
#home{
 | 
			
		||||
 | 
			
		||||
  #background-animated {
 | 
			
		||||
      position: absolute;
 | 
			
		||||
      top: 1000px;
 | 
			
		||||
@@ -7,16 +8,20 @@
 | 
			
		||||
      height: 100%;
 | 
			
		||||
      pointer-events: none; /* Permet de cliquer à travers l'élément */
 | 
			
		||||
      z-index: 5; /* S'assure que l'élément soit au-dessus */
 | 
			
		||||
      @media(max-width: 810px){
 | 
			
		||||
        top: 1820px;
 | 
			
		||||
      @media(max-width: 1400px){
 | 
			
		||||
       display: none;
 | 
			
		||||
      }
 | 
			
		||||
    svg{
 | 
			
		||||
      max-width: 100%;
 | 
			
		||||
      position: relative;
 | 
			
		||||
      top: -1500px;
 | 
			
		||||
    }
 | 
			
		||||
  
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  // .not-visible{
 | 
			
		||||
  //   @media (max-width:1100px) {
 | 
			
		||||
  //     display: none;
 | 
			
		||||
  //   }
 | 
			
		||||
  // }
 | 
			
		||||
  
 | 
			
		||||
  .layout-content {
 | 
			
		||||
    position: relative;
 | 
			
		||||
 
 | 
			
		||||
@@ -128,7 +128,8 @@ header{
 | 
			
		||||
                margin: 0;
 | 
			
		||||
                @media(max-width: 810px){
 | 
			
		||||
                    top: calc($header-height-pad / 4 );
 | 
			
		||||
                    padding-left: 15%;
 | 
			
		||||
                    align-items: center;
 | 
			
		||||
                    margin: 1rem;
 | 
			
		||||
                }
 | 
			
		||||
                li{
 | 
			
		||||
                    @media(max-width: 1090px){
 | 
			
		||||
@@ -145,8 +146,8 @@ header{
 | 
			
		||||
                        @media(max-width: 500px){
 | 
			
		||||
                            display: flex;
 | 
			
		||||
                            flex-direction: column;
 | 
			
		||||
                            align-items: flex-start;
 | 
			
		||||
                            font-size: 0.6rem;
 | 
			
		||||
                            align-items: center;
 | 
			
		||||
                            font-size: 0.9rem;
 | 
			
		||||
                        }
 | 
			
		||||
                       
 | 
			
		||||
                    }
 | 
			
		||||
 
 | 
			
		||||
@@ -89,6 +89,9 @@
 | 
			
		||||
                    border-radius: 50%;
 | 
			
		||||
                    background: black;
 | 
			
		||||
                }
 | 
			
		||||
                @media(max-width:810px){
 | 
			
		||||
                    width: 100vw;
 | 
			
		||||
                }
 | 
			
		||||
 | 
			
		||||
                .paragraph--type--phase-deroulement{
 | 
			
		||||
                    position: absolute;
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user