.syncopate-regular { font-family: "Syncopate", sans-serif; font-weight: 400; font-style: normal; } .syncopate-bold { font-family: "Syncopate", sans-serif; font-weight: 700; font-style: normal; } #id_1{ font-family: 'Syncopate', sans-serif; margin: 0; padding: 0; overflow-x: hidden; display: flex; flex-direction:column; background-color: black; } #id_1_1{ display: flex; justify-content: flex-end; overflow: hidden; height: 100vh; } #id_1_1_1{ width: 0vw; display: flex; justify-content: flex-end; align-items: center; padding-right: 30vw; background-color: rgb(73, 73, 73); } #id_1_1_1_1{ position: relative; rotate: 320deg; transform: scaleX(-1); height: 100%; width: auto; z-index: -1; top: 8vh; left: 10vh; } #id_1_1_1_2{ color: white; position: relative; margin: 0; padding: 0; width: 100%; } #id_1_2{ display:flex; flex-direction: column; align-items: flex-start; } .conteneur_des_images_de_fond_pour_galeries_et_liens{ width: 100%; /* Chaque div prend tt la largeur de l'écra */ height: 90vh; /* Chaque div prend tt la hauteur de l'écran */ display:flex; align-items:center; text-align: center; } .liens_sur_images_de_fond_pour_galeries{ display: flex; height: 100%; width: 100%; align-self: flex-start; justify-self: center; object-fit: cover; z-index: 1; } .images_de_fond_pour_galeries:hover{ filter: blur(2px); } .images_de_fond_pour_galeries{ height: 100%; width: 100%; align-self: flex-start; justify-self: center; object-fit: cover; z-index: -1; transition: filter 0.5s ease 0.3s; } #id_1_2_4_2{ position: absolute; align-self: flex-end; height: 50%; width: 100vw; background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0,0,0,1)); z-index:1; } #id_1_6{ position: relative; top: 30vh; display: flex; flex-direction: column; } #id_1_6_1{ display: flex; align-items: center; justify-content: flex-start; } #id_1_6_1_1{ float: left; height: 40vh; width: auto; } .illustrations_pour_pages_de_vie{ position: relative; height: 100%; padding-right: 2vw; padding-left: 2vw; border-radius: 60px; } .illustrations_pour_pages_de_vie:hover{ filter: brightness(60%); } .paragraphes_pour_pages_de_vie{ color: white; } #id_1_6_2{ display: flex; align-items: center; justify-content: flex-end; } #id_1_6_2_1{ float: right; height: 40vh; width: auto; } .logos_réseaux_sociaux{ height: 10vh; width: auto; } #id_1_6_3{ display: flex; flex-direction: column; align-items: flex-start; margin-left:2vw; } #id_1_6_3_1{ color: white; } #id_1_6_3_2{ height: 60vh; } #id_1_6_3_2_1{ display: flex; height: 100%; flex-direction: column; justify-content: space-around; }