Cadastre-se - Portal Skate Vale Brasil

WOODI LIGHT DECKS

<div id="popup-newsletter" class="popup-overlay">
<div class="popup-box">
<button class="popup-close" onclick="fecharPopup()">×</button>

<div class="popup-header">
<h2>INSCREVA-SE E GANHE</h2>
<h1>5% OFF</h1>
</div>

<div class="popup-content">
<h3>Ofertas e Novidades</h3>
<p>Salveee, inscreva-se e receba descontos exclusivos!</p>

<input type="hidden" name="_subject" value="Novo cadastro - Popup Woodlight">
<input type="hidden" name="_captcha" value="false">

<button type="submit">Inscreva-se</button>
</form>

<span class="popup-note">
Receberá um email para confirmar sua inscrição
</span>
</div>
</div>
</div>

<style>
.popup-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.7);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
}

.popup-box {
width: 400px;
max-width: 90%;
background: #000;
color: #fff;
font-family: Arial, sans-serif;
border-radius: 5px;
overflow: hidden;
position: relative;
}

.popup-close {
position: absolute;
top: 10px;
right: 10px;
background: #fff;
border: none;
border-radius: 50%;
width: 25px;
height: 25px;
cursor: pointer;
font-size: 16px;
}

.popup-header {
background: #f5a623;
text-align: center;
padding: 20px;
}

.popup-header h2 {
margin: 0;
font-size: 18px;
letter-spacing: 1px;
}

.popup-header h1 {
margin: 5px 0 0;
font-size: 40px;
font-weight: bold;
}

.popup-content {
padding: 20px;
text-align: center;
}

.popup-content h3 {
color: #f5a623;
margin-bottom: 5px;
}

.popup-content p {
tamanho da fonte: 14px;
margem inferior: 15px;
}

.popup-content input {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border-radius: 4px;
border: none;
}

.popup-content button {
width: 100%;
padding: 12px;
background: #f5a623;
border: none;
color: #fff;
font-weight: bold;
cursor: pointer;
border-radius: 4px;
}

.popup-note {
display: block;
margin-top: 10px;
font-size: 12px;
color: #ccc;
}
</style>

<script>
function fecharPopup() {
document.getElementById("popup-newsletter").style.display = "none";
}

// Exibir automaticamente após 2 segundos
setTimeout(function() {
document.getElementById("popup-newsletter").style.display = "flex";
}, 2000);
</script>

Isso vai fechar em 20 segundos