diff --git a/templates/index.html.tera b/templates/index.html.tera
index d312a28..78882f1 100644
--- a/templates/index.html.tera
+++ b/templates/index.html.tera
@@ -22,14 +22,15 @@
       {% endif %}
    {% endfor %}
   {% endif %}
+
   <div class="bg-white rounded-md flex justify-between flex-col shadow reset-js" style="min-height: 10rem;" data-trips="{{ amount_trips }}" data-month="{{ day.day| date(format='%m') }}" data-coxneeded="{{ day_cox_needed }}">
     <div>
-      <h2 class="font-bold uppercase tracking-wide text-center text-primary-950 text-lg px-3 pt-3">{{ day.day| date(format="%d.%m.%Y") }}
-        <small class="inline-block ml-1 text-xs text-gray-400">{{ day.day | date(format="%A", locale="de_AT") }}</small>  
+      <h2 class="font-bold uppercase tracking-wide text-center rounded-t-md  {% if day.is_pinned %} text-white bg-primary-950 {% else %} text-primary-950 bg-gray-200 bg-opacity-80 {% endif %} text-lg px-3 py-3 ">{{ day.day| date(format="%d.%m.%Y") }}
+        <small class="inline-block ml-1 text-xs {% if day.is_pinned %} text-gray-200 {% else %} text-gray-500 {% endif %}">{{ day.day | date(format="%A", locale="de_AT") }}</small>  
       </h2>
 
       {% if day.planned_events | length > 0 or  day.trips | length > 0 %}
-      <div class="grid grid-cols-1 gap-3 my-3">
+      <div class="grid grid-cols-1 gap-3 mb-3">
 
       {# --- START Events --- #}
       {% if day.planned_events | length > 0 %}