Better CSS

static/css/main.css

@@ -2538,31 +2538,38 @@ button:disabled,
   margin-top: 20px;
 }
 .modal-content .modal-buttons button {
-  margin: -10px; /* Gør overlap muligt */
+  position: relative; /* Tillader z-index at tage effekt */
+  margin: -20px; /* Øger negativ margin for mere overlap */
   padding: 12px 18px;
   font-size: 16px;
   cursor: pointer;
-  transition: transform 0.3s ease;
+  transition: transform 0.3s ease, z-index 0.3s ease;
 }
 .modal-content .modal-buttons button:hover {
   transform: scale(1.05);
+  z-index: 3; /* Hæver knappen øverst ved hover */
 }
 .modal-content .modal-buttons button:nth-child(odd) {
-  transform: rotate(10deg); /* Med uret */
+  transform: rotate(10deg); /* Roterer med uret */
+  z-index: 1; /* Start-lag for ulige knapper */
 }
 .modal-content .modal-buttons button:nth-child(even) {
-  transform: rotate(-10deg); /* Mod uret */
+  transform: rotate(-10deg); /* Roterer mod uret */
+  z-index: 2; /* Lidt højere lag for lige knapper */
 }
 .modal-content .close-btn {
   position: absolute;
-  bottom: 10px;
-  left: 50%;
   transform: translateX(-50%);
-  padding: 10px 15px;
-  font-size: 16px;
   cursor: pointer;
 }
 
+.next-btn {
+  cursor: pointer;
+  position: absolute;
+  right: 20px;
+  transition: background-color 0.3s ease;
+}
+
 .thumbnail {
   width: 150px;
   height: 100px;