diff --git a/src/components/cards/Cards.svelte b/src/components/cards/Cards.svelte
index 9d6eeaa4..84f9378f 100644
--- a/src/components/cards/Cards.svelte
+++ b/src/components/cards/Cards.svelte
@@ -20,7 +20,7 @@
         modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("add-card")}
     </button>
@@ -29,7 +29,7 @@
         bulk_modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("create-bulk-cards")}
     </button>
diff --git a/src/components/cards/CardsEmptyState.svelte b/src/components/cards/CardsEmptyState.svelte
index 4787c066..ec0d03ae 100644
--- a/src/components/cards/CardsEmptyState.svelte
+++ b/src/components/cards/CardsEmptyState.svelte
@@ -5,7 +5,7 @@
 
 <div class="text-center items-center justify-center">
   <p class="mb-16 text-lg text-gray-500">
-    <img class="m-auto" style="height:15rem" src={cards_empty} alt="" />
+    <img class="m-auto mt-2" style="height:15rem" src={cards_empty} alt="" />
     <span class="font-bold">{$_("there-are-no-cards-yet")}</span><br />
     <span>{$_("add-your-first-card")}</span>
   </p>
diff --git a/src/components/contacts/ContactsOverview.svelte b/src/components/contacts/ContactsOverview.svelte
index af88e02a..23088c87 100644
--- a/src/components/contacts/ContactsOverview.svelte
+++ b/src/components/contacts/ContactsOverview.svelte
@@ -32,7 +32,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/dashboard/MainDashContent.svelte b/src/components/dashboard/MainDashContent.svelte
index 936e044a..4e9007a2 100644
--- a/src/components/dashboard/MainDashContent.svelte
+++ b/src/components/dashboard/MainDashContent.svelte
@@ -23,7 +23,7 @@
     </div>
   {:then stats}
     <div
-      class="grid gap-2 grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-6 sm:gap-4"
+      class="grid gap-1 grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-6 sm:gap-4"
     >
       <StatCard
         title={$_("runners")}
diff --git a/src/components/dashboard/StatCard.svelte b/src/components/dashboard/StatCard.svelte
index 9e18e3fe..68f985df 100644
--- a/src/components/dashboard/StatCard.svelte
+++ b/src/components/dashboard/StatCard.svelte
@@ -7,13 +7,13 @@
 </script>
 
 <a {href}>
-  <div class="p-4 rounded-lg bg-white border border-grey-100">
+  <div class="p-3 py-4 sm:p-4 rounded-lg bg-white border border-grey-100">
     <div class="flex flex-row items-center justify-between">
       <div class="flex flex-col">
-        <div class="text-xs uppercase font-normal text-grey-500">
+        <div class="text-md sm:text-xs uppercase font-normal text-grey-500">
           {title}
         </div>
-        <div class="text-xl font-bold font-mono">{value}</div>
+        <div class="text-2xl sm:text-xl font-bold font-mono">{value}</div>
       </div>
       <slot />
     </div>
diff --git a/src/components/donations/DonationsEmptyState.svelte b/src/components/donations/DonationsEmptyState.svelte
index 2118bf39..16cbf554 100644
--- a/src/components/donations/DonationsEmptyState.svelte
+++ b/src/components/donations/DonationsEmptyState.svelte
@@ -5,7 +5,7 @@
 
 <div class="text-center items-center justify-center">
   <p class="mb-16 text-lg text-gray-500">
-    <img class="m-auto" style="height:15rem" src={donations_empty} alt="" />
+    <img class="m-auto mt-2" style="height:15rem" src={donations_empty} alt="" />
     <span class="font-bold">{$_("there-are-no-donations-yet")}</span><br />
     <span>{$_("add-your-fist-donation")}</span>
   </p>
diff --git a/src/components/donations/DonationsOverview.svelte b/src/components/donations/DonationsOverview.svelte
index 7baa4cc5..6089bd4a 100644
--- a/src/components/donations/DonationsOverview.svelte
+++ b/src/components/donations/DonationsOverview.svelte
@@ -231,7 +231,7 @@
       bind:value={searchvalue}
       placeholder={$_("datatable.search")}
       aria-label={$_("datatable.search")}
-      class="mb-4"
+      class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
     />
     <div
       class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/donors/Donors.svelte b/src/components/donors/Donors.svelte
index b969e1c8..42958373 100644
--- a/src/components/donors/Donors.svelte
+++ b/src/components/donors/Donors.svelte
@@ -18,7 +18,7 @@
         modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("add-donor")}
     </button>
@@ -59,7 +59,7 @@
         hiddenElement.remove();
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("sponsoring-quittungs-liste_herunterladen")}
     </button>
diff --git a/src/components/donors/DonorsOverview.svelte b/src/components/donors/DonorsOverview.svelte
index 610be47f..8ac50b75 100644
--- a/src/components/donors/DonorsOverview.svelte
+++ b/src/components/donors/DonorsOverview.svelte
@@ -202,7 +202,7 @@
       bind:value={searchvalue}
       placeholder={$_("datatable.search")}
       aria-label={$_("datatable.search")}
-      class="mb-4"
+      class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
     />
     <div
       class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/groups/UserGroupsOverview.svelte b/src/components/groups/UserGroupsOverview.svelte
index b8462796..86248d97 100644
--- a/src/components/groups/UserGroupsOverview.svelte
+++ b/src/components/groups/UserGroupsOverview.svelte
@@ -31,7 +31,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/orgs/OrgOverview.svelte b/src/components/orgs/OrgOverview.svelte
index 71d52dc3..50693890 100644
--- a/src/components/orgs/OrgOverview.svelte
+++ b/src/components/orgs/OrgOverview.svelte
@@ -58,7 +58,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <div class="h-12">
         <GenerateSponsoringContracts
diff --git a/src/components/orgs/Orgs.svelte b/src/components/orgs/Orgs.svelte
index 1a01f919..359c7b0d 100644
--- a/src/components/orgs/Orgs.svelte
+++ b/src/components/orgs/Orgs.svelte
@@ -19,7 +19,7 @@
         modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("create-organization")}
     </button>
@@ -30,7 +30,7 @@
         import_modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("import-runners")}
     </button>
diff --git a/src/components/runners/Runners.svelte b/src/components/runners/Runners.svelte
index 0eadb11f..b66f02d5 100644
--- a/src/components/runners/Runners.svelte
+++ b/src/components/runners/Runners.svelte
@@ -20,7 +20,7 @@
         modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("laeufer-hinzufuegen")}
     </button>
@@ -29,7 +29,7 @@
         import_modal_open = true;
       }}
       type="button"
-      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm"
+      class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:w-auto sm:text-sm mt-1 sm:mt-0"
     >
       {$_("import-runners")}
     </button>
diff --git a/src/components/scans/ScansEmptyState.svelte b/src/components/scans/ScansEmptyState.svelte
index 8cf42fb9..5fe0af70 100644
--- a/src/components/scans/ScansEmptyState.svelte
+++ b/src/components/scans/ScansEmptyState.svelte
@@ -5,7 +5,7 @@
 
 <div class="text-center items-center justify-center">
   <p class="mb-16 text-lg text-gray-500">
-    <img class="m-auto" style="height:15rem" src={scans_empty} alt="" />
+    <img class="m-auto mt-2" style="height:15rem" src={scans_empty} alt="" />
     <span class="font-bold">{$_("there-are-no-scans-yet")}</span><br />
     <span>{$_("add-your-fist-scan")}</span>
   </p>
diff --git a/src/components/scanstations/ScanStations.svelte b/src/components/scanstations/ScanStations.svelte
index 12e6b5c1..fc233786 100644
--- a/src/components/scanstations/ScanStations.svelte
+++ b/src/components/scanstations/ScanStations.svelte
@@ -64,7 +64,7 @@
 					bind:value={searchvalue}
 					placeholder={$_("datatable.search")}
 					aria-label={$_("datatable.search")}
-					class="mb-4"
+					class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
 				/>
 				<div
 					class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/statsclients/StatsClientsOverview.svelte b/src/components/statsclients/StatsClientsOverview.svelte
index 6bc62558..cbe88ab7 100644
--- a/src/components/statsclients/StatsClientsOverview.svelte
+++ b/src/components/statsclients/StatsClientsOverview.svelte
@@ -43,7 +43,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
diff --git a/src/components/teams/TeamsOverview.svelte b/src/components/teams/TeamsOverview.svelte
index 7cbec0e7..d14ae26d 100644
--- a/src/components/teams/TeamsOverview.svelte
+++ b/src/components/teams/TeamsOverview.svelte
@@ -54,7 +54,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <div class="h-12">
         <GenerateSponsoringContracts
diff --git a/src/components/users/UsersOverview.svelte b/src/components/users/UsersOverview.svelte
index 26a9d19c..bd869756 100644
--- a/src/components/users/UsersOverview.svelte
+++ b/src/components/users/UsersOverview.svelte
@@ -37,7 +37,7 @@
         bind:value={searchvalue}
         placeholder={$_("datatable.search")}
         aria-label={$_("datatable.search")}
-        class="mb-4"
+        class="mb-2 w-full sm:w-auto mt-1 sm:mt-0 p-2 rounded-md border"
       />
       <!-- {/if} -->
       <!-- <button