Busfahrer
Kann ich dir gerne geben
HTML:
<div class="bottom-banner"><a href="https://smart-button-community.de/d/50-fruehjahrssale-bis-zu-50-rabatt-im-flic-shop">
<img src="https://smart-button-community.de/assets/files/2026-05-08/1778233090-926789-top-message-spring-sale-bg.jpg" alt="Frühjahrssale: Bis zu 50 % Rabatt im Flic-Shop!" width="1000" height="126" title="Frühjahrssale: Bis zu 50 % Rabatt im Flic-Shop!" loading="lazy">
</a>
</div>
CSS:
.bottom-banner {
width:100%;
display:inline-flex;
justify-content:center;
margin:0 auto 20px auto;
padding:0 10px
}
.bottom-banner img {
border-radius:10px;
width:100%;
max-width:728px;
height:auto;
display:flex;
box-shadow:rgba(0,0,0,0.1) 0 1px 3px 0,rgba(0,0,0,0.02) 0 -1px 2px 0;
padding:2px;
background:linear-gradient(45deg, var(--body-bg-light) 33%, #fbcb01, #27f2f5, #fd6002 60%, var(--body-bg-light) 66%) var(--body-bg-light);
background-size:400% 100%;
border:1px solid rgba(153,153,153,0.3);
animation:flic-banner-shine 2.5s infinite alternate-reverse;
transition:transform .32s ease
}
.bottom-banner img:hover {
box-shadow:0 4px 20px rgba(0,0,0,0.08);
transform:translateY(-1px) scale(1.01)
}
@keyframes flic-banner-shine {
0% {
background-position:right
}
}
wenn die Animation nicht verwendet werden soll, einfach diese 2 Codeteile entfernen
background:linear-gradient(45deg, var(--body-bg-light) 33%, #fbcb01, #27f2f5, #fd6002 60%, var(--body-bg-light) 66%) var(--body-bg-light);
background-size:400% 100%;
border:1px solid rgba(153,153,153,0.3);
animation:flic-banner-shine 2.5s infinite alternate-reverse;
und
@keyframes flic-banner-shine {
0% {
background-position:right
}
}
und viele weitere Smart Home Marken- oder Integrationspartner
