diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css
index 6090ba1f536cb9b9b9e27641698a0c0a4daf2fad..f892bed1aef034ac4c6918064053d795c999d3cf 100644
--- a/app/assets/stylesheets/application.tailwind.css
+++ b/app/assets/stylesheets/application.tailwind.css
@@ -70,5 +70,5 @@ select {
   }
 }
 .past {
-  @apply opacity-50;
+  @apply opacity-50 hover:opacity-100;
 }
diff --git a/app/views/sessions/_session.html.erb b/app/views/sessions/_session.html.erb
index e3fb6f6b46a0ea8646facfd817d1631d551cb956..daf066371c0746b6a518f028a441884f5823a4f6 100644
--- a/app/views/sessions/_session.html.erb
+++ b/app/views/sessions/_session.html.erb
@@ -1,6 +1,6 @@
 <% unassigned_users = User.all - session.assignments.collect(&:user) %>
 <%= turbo_frame_tag dom_id(session) do %>
-  <div class="session shadow hover:shadow-lg overflow-scroll text-sm w-full !h-full min-h-full hover:!min-h-max <%= session.translators_needed? ? "translators-needed" : "no-translators-needed" %> <%= session.backup_needed? ? "backup-needed" : "no-backup-needed" %> <%= session.assignees? ? "has-assignees" : "no-assignees" %>">
+  <div class="session shadow hover:shadow-lg overflow-scroll text-sm w-full !h-full min-h-full hover:!min-h-max <%= session.translators_needed? ? "translators-needed" : "no-translators-needed" %> <%= session.backup_needed? ? "backup-needed" : "no-backup-needed" %> <%= session.assignees? ? "has-assignees" : "no-assignees" %> <%= (session.starts_at < Time.now ? "past" : "") %>">
     <h4>
       <small class="text-2xs uppercase font-light bg-black/10 rounded-sm p-1 mr-1 lang-<%= session.language %>"><%= session.language %></small>
       <%= link_to session.title, session.url, target: "_top" %>