Create style.css

images/css/style.css

@@ -0,0 +1,106 @@
+/* Import de polices et autres styles spécifiques ici */
+
+body {
+	margin: 0;
+	padding: 0;
+	padding: 5%;
+	font-family: "Lato", sans-serif;
+	background: #000000;
+  }
+  
+  .err_page {
+	width: 100%;
+	height: 80%;
+	margin: 4% auto;
+	background: #000000;
+	text-align: center;
+	display: flex;
+	align-items: center;
+  }
+  
+  .err_page_right {
+	width: 100%;
+  }
+  
+  .err_page_left {
+	width: 100%;
+  }
+  
+  .err_page h1 {
+	font-family: "Noto Sans", sans-serif;
+	font-size: 70pt;
+	margin: 0;
+	color: #fff;
+  }
+  
+  .err_page h4 {
+	color: #fff;
+	font-size: 14pt;
+  }
+  
+  .err_page p {
+	font-size: 14pt;
+	color: #ffffffcc;
+  }
+  
+  .err_btn {
+	background: #fff;
+	border: 2px solid #fff;
+	padding: 20px;
+	border-radius: 5px;
+	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
+	cursor: pointer;
+	font-size: 13pt;
+	transition: background 0.5s;
+  }
+  
+  .err_btn:hover {
+	background: #fff;
+	box-shadow: 0px 8px 10px rgba(0, 0, 0, 0.2);
+	color: #000000;
+  }
+  
+  .credit {
+	position: absolute;
+	bottom: 0;
+	right: 0;
+  }
+  
+  /* Styles spécifiques pour l'image */
+  .presentation-image {
+	max-width: 300px;
+	display: block;
+	margin: 0 auto;
+  }
+  
+  /* Définir les styles pour l'affichage en colonne lorsque l'écran est réduit */
+  @media screen and (max-width: 800px) {
+	.err_page {
+	  flex-direction: column;
+	  align-items: center;
+	}
+	.err_page_left img {
+	  max-width: 250px;
+	  height: auto;
+	}
+	.err_page_right {
+	  margin-top: 20px;
+	}
+  }
+  
+  /* Styles supplémentaires pour les appareils mobiles (facultatif) */
+  @media screen and (max-width: 480px) {
+	.err_page h1 {
+	  font-size: 50pt;
+	}
+	.err_page h4 {
+	  font-size: 12pt;
+	}
+	.err_page p {
+	  font-size: 12pt;
+	}
+	.err_btn {
+	  font-size: 11pt;
+	  padding: 15px;
+	}
+  }