diff --git a/css/alerte/a5.css b/css/alerte/a5.css
new file mode 100644
index 0000000..b10f078
--- /dev/null
+++ b/css/alerte/a5.css
@@ -0,0 +1,37 @@
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.modal-content {
+  margin: 15% auto;
+  padding: 10px;
+  width: 40vw;
+  text-align: left; /* Alignement à gauche */
+  background-color: white;
+  border: 2px solid #4caf50; /* Vert plat */
+  box-shadow: none;
+}
+
+.close-btn {
+  color: black;
+  font-size: 18px;
+}
+
+.modal.button {
+  background-color: #4caf50;
+  color: white;
+  border-radius: 3px;
+  border: none;
+}
+
+.close-btn:hover,
+.close-btn:focus {
+  color: red; /* Rouge pour attirer l’attention */
+}
+  
\ No newline at end of file
diff --git a/css/alerte/a6.css b/css/alerte/a6.css
new file mode 100644
index 0000000..7407641
--- /dev/null
+++ b/css/alerte/a6.css
@@ -0,0 +1,41 @@
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.modal-content {
+  margin: 15% auto;
+  padding: 10px;
+  width: 40vw;
+  background-color: white;
+  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Ombres douces */
+  border-radius: 4px;
+}
+
+.close-btn {
+  color: black;
+  font-size: 18px;
+}
+
+.modal.button {
+  background-color: #4caf50;
+  color: white;
+  border-radius: 3px;
+  border: none;
+  transition: background-color 0.3s ease;
+}
+
+.modal.button:hover {
+  background-color: #45a049; /* Vert plus sombre au survol */
+}
+
+.close-btn:hover,
+.close-btn:focus {
+  color: red; /* Rouge pour attirer l’attention */
+}
+  
\ No newline at end of file
diff --git a/css/alerte/a7.css b/css/alerte/a7.css
new file mode 100644
index 0000000..66af3b7
--- /dev/null
+++ b/css/alerte/a7.css
@@ -0,0 +1,41 @@
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.8); /* Fond plus sombre */
+}
+
+.modal-content {
+  margin: 15% auto;
+  padding: 10px;
+  width: 40vw;
+  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Ombres douces */
+  background-color: #1e1e1e; /* Fond sombre */
+  color: #ffffff;
+  border: 1px solid #444444;
+  border-radius: 4px;
+}
+
+
+.close-btn {
+  color: black;
+  font-size: 18px;
+}
+
+.modal.button {
+  border-radius: 3px;
+  border: none;
+  background-color: #bb86fc; /* Couleur violet pastel */
+  color: #000;
+}
+
+
+.close-btn:hover,
+.close-btn:focus {
+  color: red; /* Rouge pour attirer l’attention */
+}
+  
\ No newline at end of file
diff --git a/css/alerte/a8.css b/css/alerte/a8.css
new file mode 100644
index 0000000..82a18b5
--- /dev/null
+++ b/css/alerte/a8.css
@@ -0,0 +1,40 @@
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.8); /* Fond plus sombre */
+}
+
+.modal-content {
+  margin: 15% auto;
+  padding: 10px;
+  width: 40vw;
+  background-color: #ffdb00; /* Jaune vif */
+  color: #000;
+  border: 4px solid #000; /* Bordures audacieuses */
+  font-family: "Arial Black", sans-serif;
+}
+
+
+.close-btn {
+  color: black;
+  font-size: 18px;
+}
+
+.modal.button {
+  border-radius: 3px;
+  border: none;
+  background-color: #e63946; /* Rouge frappant */
+  font-size: 18px;
+}
+
+
+.close-btn:hover,
+.close-btn:focus {
+  color: red; /* Rouge pour attirer l’attention */
+}
+  
\ No newline at end of file
diff --git a/css/alerte/a9.css b/css/alerte/a9.css
new file mode 100644
index 0000000..ff2ac24
--- /dev/null
+++ b/css/alerte/a9.css
@@ -0,0 +1,33 @@
+.modal {
+  background: linear-gradient(135deg, #1f1c2c, #928dab); /* Dégradé futuriste */
+  backdrop-filter: blur(10px); /* Flou pour un effet sophistiqué */
+}
+
+.modal-content {
+  background: radial-gradient(circle, #222, #000);
+  color: #fff;
+  border-radius: 20px;
+  border: none;
+  width: 40vw;
+  box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.5); /* Ombres intenses */
+  transform: perspective(1000px) rotateX(5deg); /* Effet 3D */
+}
+
+.modal.button {
+  background: linear-gradient(45deg, #ff6f91, #ffc371); /* Dégradé dynamique */
+  font-size: 20px;
+  border-radius: 50px;
+  animation: pulse 1.5s infinite; /* Animation d’impulsion */
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.05);
+  }
+  100% {
+    transform: scale(1);
+  }
+}