S'abonner
Rester à l'affût
<!-- Designed by AI & Sorcière Corbeau -->
<style>
.silver-flex-center {
display: flex;
justify-content: center;
width: 100%;
padding: 20px 0;
}
.silver-mauve-card {
width: 300px;
height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: linear-gradient(135deg, rgba(20, 20, 30, 0.95), rgba(42, 21, 73, 0.8)),
url("URL DE L'IMAGE");
background-size: cover;
background-position: center;
border: 8px double #707070;
border-radius: 50%;
padding: 20px;
text-align: center;
box-shadow: 0 15px 45px rgba(0,0,0,0.9), inset 0 0 30px rgba(75, 0, 130, 0.6);
/* Font */
font-family: Verdana, Geneva, sans-serif;
overflow: hidden;
}
.jumping-text {
display: flex;
justify-content: center;
margin: 0 0 10px 0;
/* Font*/
font-family: 'Comic Sans MS', cursive, sans-serif;
font-size: 30px;
color: #E6E6FA !important;
font-weight: bold;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}
.jumping-text span { display: inline-block; animation: jump-crow 1.4s infinite ease-in-out; }
@keyframes jump-crow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.jumping-text span:nth-child(odd) { animation-delay: 0.1s; }
.jumping-text span:nth-child(even) { animation-delay: 0.4s; }
.silver-mauve-card p {
font-size: 14px;
color: #C0C0C0 !important;
margin: 0 0 15px 0;
max-width: 80%;
font-weight: bold;
}
.silver-mauve-card input[type='text'] {
width: 180px;
padding: 10px;
border: 1.5px solid #4B0082;
border-radius: 12px;
background: rgba(0, 0, 0, 0.5) !important;
color: #E6E6FA !important;
margin-bottom: 12px;
box-sizing: border-box;
text-align: center;
font-family: Arial, sans-serif;
}
.magic-btn {
width: 180px;
padding: 12px;
background: linear-gradient(45deg, #2a1549, #4B0082) !important;
color: #FFFFFF !important;
border: 1.5px solid #707070;
border-radius: 50px;
font-family: Arial, sans-serif;
font-size: 16px;
font-weight: bold;
cursor: pointer;
position: relative;
overflow: hidden;
transition: 0.4s;
}
.magic-btn::before {
content: '';
position: absolute;
top: 0;
left: -150%;
width: 50%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7), transparent);
transform: skewX(-25deg);
animation: neon-slide 3.5s infinite ease-in-out;
}
@keyframes neon-slide {
0% { left: -150%; }
30%, 100% { left: 150%; }
}
.magic-btn:hover {
background: #E6E6FA !important;
color: #2a1549 !important;
box-shadow: 0 0 25px #E6E6FA;
transform: scale(1.05);
}
</style>
<div class="silver-flex-center">
<div class="silver-mauve-card">
<h3 class="jumping-text">
<span>S</span><span>'</span><span>a</span><span>b</span><span>o</span><span>n</span><span>n</span><span>e</span><span>r</span>
</h3>
<p>Rester à l'affût</p>
<form action="https://blogtrottr.com" method="post" style="align-items: center; display: flex; flex-direction: column;">
<input name="btr_email" placeholder="votre@email.com" required="" type="text" />
<input name="btr_url" type="hidden" value="URL_DE_VOTRE_BLOG" />
<button class="magic-btn" type="submit">Suivez-Moi</button>
</form>
</div>
</div>