diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_buttons.scss b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_buttons.scss
index 3362624f..17e7b6f8 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_buttons.scss
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_buttons.scss
@@ -26,6 +26,13 @@
     @apply suz:hover:bg-suz-primary-dark;
     @apply uch:hover:bg-uch-primary-dark;
     @apply ser:hover:bg-ser-primary;
+    @apply peer-hover:bg-ep-secondary;
+    @apply peer-hover:text-gray-900;
+    @apply sbw:peer-hover:bg-sbw-primary-dark;
+    @apply snz:peer-hover:bg-snz-primary-dark;
+    @apply suz:peer-hover:bg-suz-primary-dark;
+    @apply uch:peer-hover:bg-uch-primary-dark;
+    @apply ser:peer-hover:bg-ser-primary;
 
     &--active,
     &--secondary {
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
index 9cd64247..e993f9eb 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
@@ -4,7 +4,7 @@
       xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
 
     <f:section name="Teaser">
-        <a href="{f:uri.typolink(parameter: city.detailPage)}" class="flex flex-col">
+        <div class="relative flex flex-col">
             <div class="relative">
                 {ep:icon(icon: 'flag-{city.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
                 <f:alias map="{teaserImage: city.teaserImage, defaultImage: city.images.0}">
@@ -34,17 +34,19 @@
                     </f:if>
                 </f:alias>
             </div>
-            <div class="flex-1 py-4 px-2 bg-white border-l border-r border-zinc-200">
-                <span class="headline--3 mb-4">
+            <div class="flex-1 flex flex-col pt-4 bg-white border border-t-0 border-zinc-200">
+                <a href="{f:uri.typolink(parameter: city.detailPage)}" class="px-2 peer headline--3 mb-4 no-underline">
                     {city.name}
-                </span>
-                {city.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
+                    <span class="absolute inset-0"></span>
+                </a>
+                <div class="flex-1 px-2 text-zinc-800" data-rte-content>
+                    {city.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
+                </div>
+                <div class="button bg-button w-full">
+                    {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
+                </div>
             </div>
-            <button type="button"
-                    class="button bg-button w-full">
-                {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
-            </button>
-        </a>
+        </div>
     </f:section>
 
 </html>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Hotel/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Hotel/Teaser.html
index a6db2b72..b218ac06 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Hotel/Teaser.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Hotel/Teaser.html
@@ -4,7 +4,7 @@
       xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
 
     <f:section name="Teaser">
-        <a href="{f:uri.typolink(parameter: hotel.detailPage)}" class="flex flex-col">
+        <div class="relative flex flex-col">
             <div class="relative">
                 {ep:icon(icon: 'flag-{hotel.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
                 <f:if condition="{hotel.images.original.0}">
@@ -25,27 +25,29 @@
                     </f:else>
                 </f:if>
             </div>
-            <div class="flex-1 py-4 px-2 bg-white border-l border-r border-zinc-200">
-                <span class="headline--3 mb-4">
+            <div class="flex-1 flex flex-col pt-4 bg-white border border-t-0 border-zinc-200">
+                <a href="{f:uri.typolink(parameter: hotel.detailPage)}" class="px-2 peer headline--3 mb-4 no-underline">
                     {hotel.name -> f:format.nl2br()}
-                </span>
+                    <span class="absolute inset-0"></span>
+                </a>
                 <f:if condition="{hotel.category}">
                     <span class="searchresult-item__category">
                         <strong>Kategorie</strong> {hotel.category}
                     </span>
                 </f:if>
-                {hotel.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
-                <f:if condition="{hotel.available} != -1">
-                    <span class="teaserbox__price">
-                        <strong>{f:if(condition: '{hotel.available} > 0', then: 'ab {hotel.minPrice} €', else: 'aktuell nicht buchbar')}</strong>
-                    </span>
-                </f:if>
+                <div class="flex-1 px-2 text-zinc-800" data-rte-content>
+                    {hotel.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
+                    <f:if condition="{hotel.available} != -1">
+                        <span class="teaserbox__price">
+                            <strong>{f:if(condition: '{hotel.available} > 0', then: 'ab {hotel.minPrice} €', else: 'aktuell nicht buchbar')}</strong>
+                        </span>
+                    </f:if>
+                </div>
+                <div class="button bg-button w-full">
+                    {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
+                </div>
             </div>
-            <button type="button"
-                    class="button bg-button w-full">
-                {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
-            </button>
-        </a>
+        </div>
     </f:section>
 
 </html>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/News/List/Item.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/News/List/Item.html
index d58a5b9f..a526320a 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/News/List/Item.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/News/List/Item.html
@@ -4,8 +4,8 @@
 
     <div class="mb-8">
         <n:excludeDisplayedNews newsItem="{newsItem}"/>
-        <div class="flex flex-col md:flex-row md:space-x-8">
-            <n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}" class="mb-4 md:w-1/2">
+        <div class="relative flex flex-col md:flex-row md:space-x-8">
+            <div class="mb-4 md:w-1/2">
                 <f:if condition="{newsItem.mediaPreviews}">
                     <f:then>
                         <f:if condition="{newsItem.mediaPreviews.0}">
@@ -26,13 +26,14 @@
                         </f:if>
                     </f:else>
                 </f:if>
-            </n:link>
+            </div>
             <div class="md:flex-1">
-                <h3 class="blog-entry__headline">
-                    <n:link newsItem="{newsItem}" settings="{settings}">
+                <a href="{f:uri.typolink(parameter: newsItem.newsLink)}" class="peer">
+                    <h3 class="blog-entry__headline">
                         {newsItem.title}
-                    </n:link>
-                </h3>
+                    </h3>
+                    <span class="absolute inset-0"></span>
+                </a>
                 <p class="text-sm italic mb-4">
                     <f:if condition="{newsItem.author}">{newsItem.author} am </f:if>
                     <time datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}"><f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date></time>
@@ -57,9 +58,9 @@
                         </f:if>
                     </div>
                 </n:removeMediaTags>
-                <n:link newsItem="{newsItem}" settings="{settings}" class="button bg-button button--small">
+                <div class="button bg-button button--small">
                     <f:translate key="more-link"/>
-                </n:link>
+                </div>
             </div>
         </div>
     </div>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Teaser.html
index 35870f27..e76982f9 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Teaser.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Teaser.html
@@ -4,7 +4,7 @@
       xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
 
     <f:section name="Teaser">
-        <a href="{f:uri.typolink(parameter: region.detailPage)}" title="{region.name}" class="flex flex-col">
+        <div class="relative flex flex-col">
             <div class="relative">
                 {ep:icon(icon: 'flag-{region.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
                 <f:alias map="{teaserImage: region.teaserImage, defaultImage: region.images.0}">
@@ -34,17 +34,19 @@
                     </f:if>
                 </f:alias>
             </div>
-            <div class="flex-1 py-4 px-2 bg-white border-l border-r border-zinc-200" data-rte-content>
-                <span class="headline--3 mb-4">
+            <div class="flex-1 flex flex-col pt-4 bg-white border border-t-0 border-zinc-200">
+                <a href="{f:uri.typolink(parameter: region.detailPage)}" class="px-2 peer headline--3 mb-4 no-underline">
                     {region.name}
-                </span>
-                {region.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
+                    <span class="absolute inset-0"></span>
+                </a>
+                <div class="flex-1 px-2 text-zinc-800" data-rte-content>
+                    {region.teaser -> f:format.crop(maxCharacters: settings.teaserTextMaxChars) -> f:format.html()}
+                </div>
+                <div class="button bg-button w-full">
+                    {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
+                </div>
             </div>
-            <button type="button"
-                    class="button bg-button w-full">
-                {f:translate(key: 'tx_eptheme.label.teaserbutton.default', extensionName: 'ep_theme')}
-            </button>
-        </a>
+        </div>
     </f:section>
 
 </html>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/OneColumn.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/OneColumn.html
index 8a491f44..5c8e237b 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/OneColumn.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/OneColumn.html
@@ -4,31 +4,31 @@
       xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
 
     <f:section name="Teaser">
-        <a href="{f:uri.typolink(parameter: data.header_link)}" class="flex flex-col group">
+        <div class="relative flex flex-col">
             <div class="relative">
                 <f:if condition="{context.country}">
                     {ep:icon(icon: 'flag-{context.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
                 </f:if>
                 <ep:lazyLoadImage image="{teaserImage}"
-                                  loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
-                                  class="block w-full h-full object-cover"
-                                  width="400c"
-                                  height="300c"
-                                  alt="{teaserImage.alternative}" />
+                                    loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
+                                    class="block w-full h-full object-cover"
+                                    width="400c"
+                                    height="300c"
+                                    alt="{teaserImage.alternative}" />
             </div>
-            <div class="flex-1 py-4 px-2 bg-white border-l border-r border-zinc-200" data-rte-content>
-                <span class="headline--3 mb-4">
+            <div class="flex-1 flex flex-col pt-4 bg-white border border-t-0 border-zinc-200">
+                <a href="{f:uri.typolink(parameter: data.header_link)}" class="px-2 peer headline--3 mb-4 no-underline">
                     {data.header -> f:format.nl2br()}{f:if(condition: data.subheader, then: '<br>{data.subheader}')}
-                </span>
-                <div class="text-zinc-800">
+                    <span class="absolute inset-0"></span>
+                </a>
+                <div class="flex-1 px-2 text-zinc-800" data-rte-content>
                     {data.bodytext -> f:format.html()}
                 </div>
+                <div class="button bg-button w-full">
+                    {data.button -> v:or(alternative: 'Details')}
+                </div>
             </div>
-            <button type="button"
-                    class="button bg-button w-full">
-                {data.button -> v:or(alternative: 'Details')}
-            </button>
-        </a>
+        </div>
     </f:section>
 
 </html>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/TwoColumn.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/TwoColumn.html
index bcfc90a7..0bf16d1b 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/TwoColumn.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Teaser/TwoColumn.html
@@ -4,22 +4,24 @@
       xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
 
     <f:section name="Teaser">
-        <a href="{f:uri.typolink(parameter: data.header_link)}" class="teaserbox teaserbox--default group">
+        <div class="relative teaserbox teaserbox--default">
             <div class="teasebox__image">
                 <f:render partial="TeaserImage" arguments="{image: teaserImage}"/>
             </div>
-            <div class="teaserbox__main" data-rte-content>
-                <span class="headline headline--3 headline--teaser">
+            <div class="teaserbox__main">
+                <a href="{f:uri.typolink(parameter: data.header_link)}" class="headline headline--3 headline--teaser no-underline">
                     {data.header -> f:format.nl2br()}{f:if(condition: data.subheader, then: '<br>{data.subheader}')}
-                </span>
+                    <span class="absolute inset-0"></span>
+                </a>
                 <hr>
-                {data.bodytext -> f:format.html()}
+                <div class="text-zinc-800" data-rte-content>
+                    {data.bodytext -> f:format.html()}
+                </div>
             </div>
-            <button type="button"
-                    class="button bg-button button--full">
+            <div class="button bg-button button--full">
                 {data.button -> v:or(alternative: 'Details')}
-            </button>
-        </a>
+            </div>
+        </div>
     </f:section>
 
 </html>