Avançado: Espaçamento em monitores maiores
<div class="d-none d-md-block" style="height: 150px;"></div>
Dica: Ocultar cor da caixa de texto
<style>.destaquetexto {background-color: transparent!important;}</style>
Dica: Gatilho de escassez
<h2 data-countdown="2021/01/1"></h2>
Dica: CTA Ligação somente em mobile
<div class="d-block d-sm-none"><a class="btn btn-success my-1 rounded-0 shadow-sm py-2 m-1" href="tel:11955555555">Ligue Agora</a></div>
Dica: CTA Whatsapp
<a target="_blank" rel="noopener noreferrer" class="whatsapp-plug-icon" href="https://api.whatsapp.com/send?phone=5511955555555"></a>
ou
<a target="_blank" rel="noopener noreferrer" class="whatsapp-plug-icon" href="https://wa.me/5511955555555"></a>
Avançado: Imagem via link
<img alt="..." title="..." width="100%" class="img-fluid" src="...">
Avançado: Exemplo de slider (carousel)
<div id="sliders2" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#sliders2" data-slide-to="0" class="active"></li>
<li data-target="#sliders2" data-slide-to="1"></li>
<li data-target="#sliders2" data-slide-to="2"></li>
<li data-target="#sliders2" data-slide-to="3"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="assets/img/repositorio/webp/thumbs/thema01.webp" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="assets/img/repositorio/webp/thumbs/thema02.webp" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="assets/img/repositorio/webp/thumbs/thema03.webp" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="assets/img/repositorio/webp/thumbs/thema04.webp" class="d-block w-100">
</div>
</div>
</div>
FORM1: e-mail
<form id="form01" class="p-2">
<div class="py-2">
<label>E-mail Válido</label>
<input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required>
</div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">CADASTRAR
<span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span>
</button>
</form>
FORM2: nome e e-mail
<form id="form02" class="p-2">
<div class="py-2">
<label>Nome Completo</label>
<input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required>
</div>
<div class="py-2">
<label>E-mail Válido</label>
<input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required>
</div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">CADASTRAR
<span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span>
</button>
</form>
FORM3: nome, e-mail e mensagem
<form id="form03" class="p-2">
<div class="py-2"> <label>Nome Completo:</label> <input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required> </div>
<div class="py-2"> <label>E-mail Válido:</label> <input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required> </div>
<div class="py-2"> <label>Breve Mensagem:</label> <textarea type="text" id="inputMensagem" class="form-control estilo-input rounded-0" placeholder="Mensagem" required></textarea> </div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">ENVIAR MENSAGEM <span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span> </button>
</form>
FORM4: nome, e-mail e telefone
<form id="form04" class="p-2">
<div class="py-2">
<label>Nome Completo</label>
<input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required>
</div>
<div class="py-2">
<label>E-mail Válido</label>
<input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required>
</div>
<div class="py-2">
<label>Telefone com DDD</label>
<input type="tel" id="inputTelefone" class="form-control estilo-input rounded-0" placeholder="(00) 00000-0000" required>
</div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">CADASTRAR
<span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span>
</button>
</form>
FORM5: nome, e-mail, telefone e mensagem
<form id="form05" class="p-2">
<div class="py-2"> <label>Nome Completo:</label> <input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required> </div>
<div class="py-2"> <label>E-mail Válido:</label> <input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required> </div>
<div class="py-2"> <label>Telefone com DDD:</label> <input type="tel" id="inputTelefone" class="form-control estilo-input rounded-0" placeholder="(00) 00000-0000" required> </div>
<div class="py-2"> <label>Breve Mensagem:</label> <textarea type="text" id="inputMensagem" class="form-control estilo-input rounded-0" placeholder="Mensagem" required></textarea> </div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">ENVIAR MENSAGEM <span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span> </button>
</form>
FORM6: nome, e-mail, telefone, mensagem e pesquisa
<form id="form06" class="p-2">
<div class="py-2"> <label>Nome Completo:</label> <input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required> </div>
<div class="py-2"> <label>E-mail Válido:</label> <input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required> </div>
<div class="py-2"> <label>Telefone com DDD:</label> <input type="tel" id="inputTelefone" class="form-control estilo-input rounded-0" placeholder="(00) 00000-0000" required> </div>
<div class="py-2"> <label>Breve Mensagem:</label> <textarea type="text" id="inputMensagem" class="form-control estilo-input rounded-0" placeholder="Mensagem" required></textarea> </div>
<div class="py-2"> <label>Como nos conheceu?</label><br> <input type="radio" name="radio" id="radioGoogle" value="google"><span class="checkmark"></span>Google <input type="radio" name="radio" id="radioFacebook" value="facebook"><span class="checkmark"></span>Facebook <input type="radio" name="radio" id="radioIndicacao" value="indicacao"><span class="checkmark"></span>Indicação </div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">ENVIAR MENSAGEM <span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span> </button>
</form>
FORM7: nome, e-mail, telefone, data, mensagem e pesquisa
<form id="form07" class="p-2">
<div class="py-2"> <label>Nome Completo:</label> <input type="text" id="inputNome" class="form-control estilo-input rounded-0" placeholder="Nome completo" required> </div>
<div class="py-2"> <label>E-mail Válido:</label> <input type="email" id="inputEmail" class="form-control estilo-input rounded-0" placeholder="E-mail" required> </div>
<div class="py-2"> <label>Telefone com DDD:</label> <input type="tel" id="inputTelefone" class="form-control estilo-input rounded-0" placeholder="(00) 00000-0000" required> </div>
<div class="py-2"> <label>Agende uma reunião:</label> <input type="date" id="inputData" class="form-control estilo-input rounded-0" max="2030-12-31" required> </div>
<div class="py-2"> <label>Breve Mensagem</label> <textarea type="text" id="inputMensagem" class="form-control estilo-input rounded-0" placeholder="Mensagem" required></textarea> </div>
<div class="py-2"> <label>Como nos conheceu?:</label><br> <input type="radio" name="radio" id="radioGoogle" value="google"><span class="checkmark"></span>Google <input type="radio" name="radio" id="radioFacebook" value="facebook"><span class="checkmark"></span>Facebook <input type="radio" name="radio" id="radioIndicacao" value="indicacao"><span class="checkmark"></span>Indicação </div>
<button id="btnEnviar" class="btn btn-info rounded-0 my-3" type="submit">ENVIAR MENSAGEM <span id="spinner" class="spinner-border spinner-border-sm" role="status" hidden="true"></span> </button>
</form>
