diff --git a/src/public/css/artikel.css b/src/public/css/artikel.css
index 42e9ebe50fe2c511b58ee8b7ecb621d6518a62b4..56e525c99ddf98d57edc2f9f3fd1438ee8a5b397 100644
--- a/src/public/css/artikel.css
+++ b/src/public/css/artikel.css
@@ -249,14 +249,60 @@ section{
     color: #fff; 
 }
 
-.pagination {
-
-    position: relative;
+#pagination {
+    display: flex;
+    width: 300px;
     justify-content: center;
-    margin-top: 400px;
-    padding-top: 200px;
+    margin-top: 50px;
+    margin-bottom: 50px;
+    padding: 10px;
+    border-radius: 15px;
+    color: #fff;
+    background-color: #4560A6;
+    font-size: 16px;
+    position: relative;
+    left: 50%;
+    transform: translateX(-50%); 
 }
 
+.pagination-nav button {
+    margin: 0 5px; 
+    padding: 5px 10px; 
+    text-decoration: none;
+    cursor: pointer;
+    background-color: transparent;
+    border: none;
+    cursor: pointer;
+    size: 10px;
+}
+.pagination-nav button img {
+    width: 20px;
+    height: 20px; 
+}
+.pagination-nav a{
+    margin: 0 10px;
+    cursor: pointer;
+    color: #fff;
+    font-size: 16px;
+    font-weight: bold;
+}
+.pagination-nav button:hover,
+.pagination-nav a:hover {
+    background-color: #eee; 
+
+}
+
+.pagination-nav button:first-child,
+.pagination-nav a:first-child {
+    margin-left: 0; 
+}
+
+.pagination-nav button:last-child,
+.pagination-nav a:last-child {
+    margin-right: 0; 
+}
+
+
 .add-article-button {
     position: fixed;
     bottom: 20px;
@@ -270,7 +316,6 @@ section{
     cursor: pointer;
 }
 
-/* Style for the overlay */
 .overlay {
     display: none;
     position: fixed;