Fixed:

- menus
- invitation banners
- invitation structure

static/css/main.css

@@ -43,19 +43,6 @@ h1, h2, h3, h4, h5{
 .custom-toggler.navbar-toggler-icon {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(245,135,5,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1.5' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
 }
-.btn-link, .text-link{
-  color: var(--bs-link-color);
-  text-decoration: none;
-}
-.btn-link{
-  padding: .725rem 1rem;
-}
-.btn-link:hover, .btn-link:focus-visible, .text-link:hover, .text-link:focus-visible{
-  text-decoration: underline;
-  color: var(--bs-link-color);
-  background-color: transparent;
-  text-underline-offset: 0.375em;
-}
 .top-bar{
   height: var(--top-bar);
   border-bottom: 1px solid var(--accent-normal);
@@ -301,19 +288,18 @@ article li:not(:first-of-type){
   padding-left: 0;
 }
 .invitation{
-  background: white;
-  padding: calc(var(--div-padding) / 4);
-  border-radius: 0.25rem;
-  position: relative;
   display: flex;
   align-items: center;
   gap: 2rem;
+  border-top: 1px solid var(--bs-gray-300);
+  padding-top: .75rem;
 }
 .invitation .userPseudo{
   margin-bottom: 0.125rem;
 }
 .invitation:not(:first-of-type){
   margin-top: .75rem;
+
 }
 .invitation .userAvatar img{
   width: 3rem;
@@ -326,7 +312,7 @@ article li:not(:first-of-type){
   font-size: 0.8em;
   color: var(--bs-gray-600);
 }
-.invitationOptions{
+.invitation-options{
   margin-left: auto;
   align-self: center;
 }
@@ -370,6 +356,19 @@ article li:not(:first-of-type){
 .btn-cta, .btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary{
   font-size: 1em;
 }
+.btn-link, .text-link{
+  color: var(--bs-link-color);
+  text-decoration: none;
+}
+.btn-link{
+  padding: .725rem 1rem;
+}
+.btn-link:focus-visible, .text-link:focus-visible{
+  text-decoration: underline;
+  color: var(--bs-link-color);
+  background-color: transparent;
+  text-underline-offset: 0.375em;
+}
 .btn:disabled, .btn.disabled{
   background: var(--bs-gray-400);
   color: var(--bs-gray-600);
@@ -446,6 +445,9 @@ sup.emphasis{
 }
 
 /* modals */
+.modal{
+  backdrop-filter: blur(5px);
+}
 .modal-header{
   border-bottom: none;
 }
@@ -559,12 +561,15 @@ nav .icon-ui{
   #avatarContainer{
     text-align: center;
   }
-  .profileOptions, .invitationOptions{
+  .profileOptions, .invitation-options{
     display: grid;
     gap: 0 .5rem;
 	  width: fit-content;
 	  margin: calc(var(--div-padding) / 3) auto 0;
   }
+  .invitation-options{
+	  margin: 0;
+  }
   .offcanvas .userAvatar{
     margin: 0 auto;
     text-align: center
@@ -646,6 +651,16 @@ nav .icon-ui{
     color: white;
     border: 1px solid white;
   }
+  .btn-hero-primary:hover{
+    background-color: var(--primary);
+    color: white;
+  }
+  .btn-link:hover, .text-link:hover{
+    text-decoration: underline;
+    color: var(--bs-link-color);
+    background-color: transparent;
+    text-underline-offset: 0.375em;
+  }
   #tandem-meet .col:hover{
     background-color: var(--accent-light);
     border-radius: 0.5rem;
@@ -654,10 +669,7 @@ nav .icon-ui{
   #tandem-meet .col:hover .form-check-input{
     --bs-border-color: var(--primary);
   }
-  .btn-hero-primary:hover{
-    background-color: var(--primary);
-    color: white;
-  }
+
   .side-menu .nav-link:not(.active):hover{
     color: black;
     background: #fdc314;