diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
index 3dd5f280..d7abc1b9 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
@@ -51,7 +51,7 @@
                     </form-group>
                 </div>
                 <div class="col-span-1 md:col-span2">
-                    <button type="submit" class="button" :disabled="loading">
+                    <button type="submit" class="button bg-button" :disabled="loading">
                         Speichern
                     </button>
                 </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
index 486b5c46..64b84dd3 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
@@ -48,10 +48,10 @@
             </div>
         </div>
         <div class="py-4 lg:flex lg:justify-between space-y-1 lg:space-y-0" v-show="!loading">
-            <button class="button" :disabled="!dirty" @click.prevent="storeBookingData()" v-if="initialized">
+            <button class="button bg-button" :disabled="!dirty" @click.prevent="storeBookingData()" v-if="initialized">
                 Buchung aktualisieren
             </button>
-            <router-link :to="{ name: 'events' }" class="button">
+            <router-link :to="{ name: 'events' }" class="button bg-button">
                 zur Übersicht
             </router-link>
         </div>
@@ -141,10 +141,10 @@
             </collapsible-panel>
         </div>
         <div class="py-4 lg:flex lg:justify-between space-y-1 lg:space-y-0" v-show="!loading">
-            <button class="button" :disabled="!dirty" @click.prevent="storeBookingData()" v-if="initialized">
+            <button class="button bg-button" :disabled="!dirty" @click.prevent="storeBookingData()" v-if="initialized">
                 Buchung aktualisieren
             </button>
-            <router-link :to="{ name: 'events' }" class="button">
+            <router-link :to="{ name: 'events' }" class="button bg-button">
                 zur Übersicht
             </router-link>
         </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
index 4b0baa2d..7030c64e 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
@@ -42,7 +42,7 @@
                     </div>
                 </div>
             </div>
-            <button type="submit" class="button" :disabled="loading">
+            <button type="submit" class="button bg-button" :disabled="loading">
                 Speichern
             </button>
         </form>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
index e7d72122..816c3e78 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
@@ -56,13 +56,13 @@
                         </td>
                         <td class="px-2 py-1 border border-gray-200">
                             <div class="grid grid-cols-1 xl:grid-cols-3 gap-2 w-32 xl:w-auto">
-                                <a :href="getDownloadUrl(event, 'confirmation')" target="_blank" class="button button--action button--small">
+                                <a :href="getDownloadUrl(event, 'confirmation')" target="_blank" class="button bg-button button--small">
                                     Bestätigung
                                 </a>
-                                <router-link :to="{ name: 'bookingEdit', params: { id: event.id } }" v-if="event.editable" class="button button--small">
+                                <router-link :to="{ name: 'bookingEdit', params: { id: event.id } }" v-if="event.editable" class="button bg-button button--small">
                                     bearbeiten
                                 </router-link>
-                                <a :href="getDownloadUrl(event, 'documents')" target="_blank" class="button button--secondary button--small" v-if="event.documents">
+                                <a :href="getDownloadUrl(event, 'documents')" target="_blank" class="button bg-button--secondary button--small" v-if="event.documents">
                                     Reiseinfos
                                 </a>
                             </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
index ec5ea19b..87c9e450 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
@@ -13,13 +13,13 @@
                         <input type="password" v-model="password" class="border-gray-400 focus:border-gray-800 ring-0 focus:ring-0 mt-1 w-full">
                     </form-group>
                     <div class="flex flex-col lg:flex-row space-y-2 lg:space-y-0 lg:space-x-2 mt-4">
-                        <button type="submit" class="button" :disabled="loading">
+                        <button type="submit" class="button bg-button" :disabled="loading">
                             {{ loginMode ? 'Login' : 'Passwort erneuern' }}
                         </button>
-                        <button class="button button--secondary" @click.prevent="toggleMode()">
+                        <button class="button bg-button--secondary" @click.prevent="toggleMode()">
                             {{ loginMode ? 'Passwort vergessen?' : 'Zum Login' }}
                         </button>
-                        <router-link to="register" class="button button--secondary">Registrieren</router-link>
+                        <router-link to="register" class="button bg-button--secondary">Registrieren</router-link>
                     </div>
                 </div>
                 <div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
index 863eb1ea..6d108845 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
@@ -4,7 +4,7 @@
             Newsletter
         </h1>
         <p class="mb-8" v-html="statusMessage"></p>
-        <button type="submit" class="button" :disabled="loading" @click.prevent="toggleReqistration()">
+        <button type="submit" class="button bg-button" :disabled="loading" @click.prevent="toggleReqistration()">
             {{ userData.newsletter ? 'Abmelden' : 'Anmelden' }}
         </button>
     </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Registration.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Registration.vue
index 0314e847..98856224 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Registration.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Registration.vue
@@ -23,10 +23,10 @@
                 </form-group>
             </div>
             <div class="flex flex-col lg:flex-row space-y-2 lg:space-y-0 lg:space-x-2">
-                <button type="submit" class="button" :disabled="loading">
+                <button type="submit" class="button bg-button" :disabled="loading">
                     Registrieren
                 </button>
-                <router-link to="login" class="button button--secondary">
+                <router-link to="login" class="button bg-button--secondary">
                     Zum Login
                 </router-link>
             </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Teamer.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Teamer.vue
index fbe5e810..b53eed34 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Teamer.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Teamer.vue
@@ -72,7 +72,7 @@
             <div class="row">
                 <div class="col-xs-12">
                     <div class="form-group">
-                        <button type="submit" class="button" :disabled="loading">
+                        <button type="submit" class="button bg-button" :disabled="loading">
                             Speichern
                         </button>
                     </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/AccommodationSelect.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/AccommodationSelect.vue
index 8a4dc3fb..086dd0de 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/AccommodationSelect.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/AccommodationSelect.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="relative" v-if="mutable && selectableAccommodations.length > 0">
-        <button class="button button--primary button--small w-full"
+        <button class="button bg-button button--small w-full"
                 type="button"
                 @click.prevent="visible = !visible">
             <span>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantAddressForm.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantAddressForm.vue
index 24da2b58..cade8ece 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantAddressForm.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantAddressForm.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="relative">
-        <button class="button button--primary button--small w-full"
+        <button class="button bg-button button--small w-full"
                 type="button"
                 @click.prevent="visible = !visible">
             <span>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantSizesForm.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantSizesForm.vue
index fba05248..1f6d0de7 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantSizesForm.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ParticipantSizesForm.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="relative" v-if="hasSelectedRentals">
-        <button class="button button--primary button--small" @click.prevent="visible = !visible">
+        <button class="button bg-button button--small" @click.prevent="visible = !visible">
             <span>
                 Größen
             </span>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/PickupSelect.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/PickupSelect.vue
index 0a4cc2ad..82f4078f 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/PickupSelect.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/PickupSelect.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="relative">
-        <button class="button button--primary button--small" @click.prevent="visible = !visible">
+        <button class="button bg-button button--small" @click.prevent="visible = !visible">
             <span>
                 Zustieg
             </span>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ServiceSelect.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ServiceSelect.vue
index 65f5de99..0c8b4857 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ServiceSelect.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/ServiceSelect.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="relative" v-if="hasServices">
-        <button class="button button--primary button--small" type="button" @click.prevent="visible = !visible">
+        <button class="button bg-button button--small" type="button" @click.prevent="visible = !visible">
             <span>
                 {{ subType.label }}
             </span>