pied de page et fond

CSS/styles.css

@@ -1,7 +1,6 @@
 body{
 	margin: 0;
-	background: linear-gradient(180deg,rgba(83, 0, 0, 0.7),#ff0000 50%);
-	
+	background: white;
 }
 
 
@@ -16,8 +15,8 @@ header{
 
 p {
 	margin: 0;
-	font-size: 25px ;
 }
+
 nav{
 	font-size: 20px ;
 	top: 0;
@@ -52,10 +51,7 @@ main{
 }
 
 #background-video{
-
-	filter: opacity(50%);
-	mix-blend-mode: screen;
-
+	filter: blur(2px);
 	height: 100vh;
 	width: 100vw;
 	object-fit: cover;
@@ -63,30 +59,59 @@ main{
 	left: 0;
 	right: 0;
 	top: 0;
-	bottom: 0;
-	z-index: -1;
+	z-index: -5;
 }
 
-#cas{
-	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
-	height: 25%;
-	width: 25%;
 
 
-}
 
 #btn_up{
+	background-color: white;
+	border-radius: 50px;
 	position: fixed;
 	right: 2vw;
 	bottom: 2vh;
 	height: 4vh;
 	width: 4vh;
+
+	transition: transform ease 1s;
 }
 
+#btn_up:hover{
+	transition: transform ease 0.4s;
+	transform: scale(1.5);
+}
 nav li{
 	display: inline-block;
 }
 
+.page{
+	list-style-type: none;
+	text-decoration: none;
+	color: black;
+
+}
+.page p{margin-right: 10vh;
+	transition: transform linear 0.2s;
+}
+
+.page p:hover{
+	color: gold;
+	transform: scale(1.2,1.2);
+}
+
+
+
+
+
+
+
+
+
+
+main p{
+	font-size: 25px;
+}
 
 
 .img_gauche_txt_droite{
@@ -110,7 +135,13 @@ nav li{
 	box-shadow:  -10px -15px rgba(0,0,0,0.5);
 }
 
-.img_gauche_txt_droite img{border-radius: 10px;}
+.img_gauche_txt_droite img{
+	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
+	height: 25%;
+	width: 25%;
+	border-radius: 10px;
+}
+
 .img_gauche_txt_droite img:not(:hover){
 	filter: saturate(0.2);
 	transform: scale(0.8,0.8);
@@ -135,36 +166,73 @@ nav li{
 	width: 50%;
 	box-shadow: 15px 10px rgba(0,0,0,0.5);
 }
-
+.img_droite_txt_gauche p:hover + img{
+	padding: 10%;
+	width: 10%
+}
 .img_droite_txt_gauche p:hover{
 	box-shadow:  -15px -10px rgba(0,0,0,0.5);
 }
-.img_droite_txt_gauche img{border-radius: 10px;transform: transform linear 1s;}
+.img_droite_txt_gauche img{
+	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
+	height: 25%;
+	width: 25%;
+	border-radius: 10px;
+}
 .img_droite_txt_gauche img:not(:hover) {
-	transform: transform linear 1s;
 	filter: saturate(0.2);
 	transform: scale(0.9,0.9);
 }
 
-
-
-
-
-.page{
-	list-style-type: none;
-	text-decoration: none;
-	color: black;
-
-}
-.page p{margin-right: 10vh;
-	transition: transform linear 0.2s;
+.img_bas_txt_haut{
+	display: inline-flex;
+	flex-direction: column-reverse;
+	justify-content: space-around;
+	align-items: center;
+	margin-bottom: 10vh;
 }
 
-.page p:hover{
-	color: gold;
-	transform: scale(1.2,1.2);
+
+.img_bas_txt_haut p{
+	background-color: rgba(250,250,250,0.2);
+	border-radius: 15px;
+	padding: 1%;
+	width: 80%;
+	box-shadow: 15px 10px rgba(0,0,0,0.5);
 }
 
+.img_bas_txt_haut p:hover{
+	box-shadow:  -15px -10px rgba(0,0,0,0.5);
+}
+.img_bas_txt_haut img{
+	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
+	height: 35%;
+	width: 35%;
+	border-radius: 10px;
+}
+.img_bas_txt_haut img:not(:hover) {
+	filter: saturate(0.2);
+	transform: scale(0.9,0.9);
+}
+
+.vide{
+	margin-top: 10vh;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -175,20 +243,18 @@ footer{
 	align-items: center;
 	flex-direction: row-reverse;
 	justify-content: space-around;
-	background-color: #581845;
-
-
+	background-color: #00010c;
+	color: white;
 }
 
 
-
 footer #reseaux li{
 	list-style-type: none;
 	text-decoration: none;
 	display: inline-block;
 }
 footer #reseaux p{
-	color: black;
+	
 	padding-left: 15px;
 	font-size: 25px;
 }
@@ -211,7 +277,13 @@ footer #autres{
 	margin-top: 2%;
 }
 
-footer #autres p{
-	color: black;
-	font-size: 30px;
+footer #autres a{
+	color:white ;
+	list-style-type: none;
+	text-decoration: none;
+}
+
+
+footer #coordonne p{
+	margin-bottom: 1rem;
 }