From 7fbda296e93561aa6e9753335cad4af254174845 Mon Sep 17 00:00:00 2001
From: izanic <izanic@localhost>
Date: Wed, 3 Jan 2024 20:41:13 +0100
Subject: [PATCH] =?UTF-8?q?diff=C3=A9rente=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CSS/styles.css | 16 +++++++++++++++-
 index.html     |  6 +++---
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/CSS/styles.css b/CSS/styles.css
index fe65c07..6b8f433 100644
--- a/CSS/styles.css
+++ b/CSS/styles.css
@@ -98,6 +98,7 @@ nav li{
 .page p{
 	margin-right: 10vh;
 	color: white;
+	transition: color linear 0.7s;
 
 }
 
@@ -106,6 +107,7 @@ nav li{
 	transform: scale(1.3,1.3);
 	transition: transform cubic-bezier(0,0.6,0.4,1.03) 1s;
 
+
 }
 .page p:not(:hover){transition: color linear 0.7s;transition: transform ease 0.4s ;}
 
@@ -189,7 +191,7 @@ main p{
 	filter: saturate(0.2);
 }
 
-#img_gauche_txt_droite p:hover + .img_main,#img_droite_txt_gauche p:hover + .img_main,.img_main:hover{
+#hover_img_1:hover + .img_main,#hover_img_2:hover + .img_main,.img_main:hover{
 	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
 	transform: scale(1.3,1.3);
 	transition: transform ease 0.8s;
@@ -197,8 +199,20 @@ main p{
 
 }
 
+#hover_img_1{
+	top: 15vh;
+	position: absolute;
+	height: 35vh;
+	width: 100vw;
+}
 
 
+#hover_img_2{
+	top: 50vh;
+	position: absolute;
+	height: 35vh;
+	width: 100vw;
+}
 
 
 
diff --git a/index.html b/index.html
index 128c20e..fdd19bd 100644
--- a/index.html
+++ b/index.html
@@ -40,16 +40,16 @@
 			<a href="#"><img id="btn_up" src="img/icone/arrow-up.svg" alt="icone de fleche"></a>
 
 			<div id="img_gauche_txt_droite">
-				
 
-		
 				<p>
 					ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
 					tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
 					quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
 				</p>
+				<div id="hover_img_1"> </div>
 				<img class="img_main" src="img/casion_background.jpeg">
 			</div>
+
 			<div id="img_droite_txt_gauche">
 
 								<p>
@@ -58,7 +58,7 @@
 					quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
 
 				</p>
-
+				<div id="hover_img_2"> </div>
 				<img class="img_main" src="img/casion_background.jpeg">