imagefond

CSS/styles.css

@@ -1,8 +1,11 @@
 body{
 	margin: 0;
-	background:white ;
+	background-image:url("../img/background.svg");
+
 }
 
+
+
 .txt_rouge{color: red;font-weight: bold;}
 .txt_jaune{color: gold;font-weight: bold;}
 
@@ -13,15 +16,14 @@ ul{
 
 
 
-header{
-}
+
 
 #presentation{
 	position: relative;
 	height: 100vh;
-	top: 0;
 
 }
+
 h1{
 	text-align: center;
 	margin-bottom: 10vh;
@@ -49,7 +51,7 @@ nav{
 	font-size: 20px ;
 	top: 0;
 	left: 0;
-	z-index: 1;
+	z-index: 100;
 	position: fixed;
 	display: flex;
 	align-items: center;
@@ -65,7 +67,7 @@ nav{
 	height: 2.3em;
 	margin: 0.5em;
 	background: rgb(255, 0, 0);
-	color: rgb(0, 0, 0);
+	color: white;
 	border: none;
 	border-radius: 1.625em;
 	font-size: 20px;
@@ -73,7 +75,6 @@ nav{
 	cursor: pointer;
 	position: relative;
 	z-index: 1;
-	overflow: hidden;
 }
    
 .button:hover {
@@ -85,8 +86,8 @@ nav{
 	background: rgb(0, 0, 0);
 	position: absolute;
 	z-index: -1;
-	left: -20%;
-	right: -20%;
+	left: -6%;
+	right: -6%;
 	top: 0;
 	bottom: 0;
 	transform: skewX(-45deg) scale(0, 1);
@@ -168,9 +169,9 @@ nav li{
 }
 .page p:not(:hover){transition: color linear 0.7s;transition: transform ease 0.4s ;}
 
-#page_courante p{
-	font-size: 1.4em;
-	color: rgb(0,255,25);
+#page_courante{
+	color: gold;
+	background-color: rgba(255,0,0,0.2);
 }
 
 
@@ -180,6 +181,7 @@ nav li{
 
 
 
+
 main p{
 	font-size: 25px;
 }
@@ -252,20 +254,21 @@ main p{
 
 
 #fond_2{
-	z-index: -1;
+	z-index: 10;
 	backdrop-filter: blur(10px);
 	text-align: center;
-	display: block;
+	display: flex;
 	flex-direction: column;
+	align-items: center;
 	background-color: rgba(0, 0, 0, 0.5);
 	color: white;
 	padding-bottom:20%;
 }
 
 
-
-
-
+#fond_2 video{
+	margin: 1%;
+}
 
 
 
@@ -331,3 +334,32 @@ footer #coordonne p{
 	margin-bottom: 1rem;
 }
 
+footer #autres a:hover{
+	text-decoration: underline;
+}
+
+#menu-mobile{
+	background-color: blue;
+	z-index: 10;
+	height: 10vh;
+	width: 10vw;
+	display: none;
+}
+@media only screen and (max-width: 800px){
+
+	body{
+		width: 100vw;
+	}
+	#img_droite_txt_gauche{
+		width: 100vw;
+	}
+
+	#menu-ordi{
+		display: none;
+	}
+
+	#menu-mobile{
+		position: fixed;
+		display: block;
+	}
+}