Boa tarde, tudo bem?
 
Tenho uma section na minha página inicial e o código é esse:
 
<section class="topo" id="bannerinicial" data-header="blue" data-aos="fade-up" data-aos-delay="300" data-aos-duration="1000" style="margin-top:50px;"> <div class="container containerinicial"> <div class="row"> <div class="text-left col-sm-12 col-md-7 top text-white topoinicial"> <h1 class="titulointroducaoazul display-4 text-white mb-3">SUA EMPRESA</h1> <p style="font-style: italic; font-weight:bold; color:white;" class="pintroducao text-white my-3">Teste</p> </div> </div> <div class="row"> <div class="col-12 text-center marcacao"> <div class="dica"> <span></span> </div> </div> </div> </div> </section> Na parte do <div class="dica"> eu tenho um webkit keyframe no css:
 
.topo .dica{border:2px solid #fff;border-radius:15px;bottom:2rem;height:3rem;left:calc(50% - 0.875rem);position:absolute;width:1.75rem;z-index:2} .topo .dica span{-webkit-animation:2s ease 0s normal forwards infinite running dica;animation:2s ease 0s normal forwards infinite running dica;background-color:#fff;border-radius:50%;display:inline-block;height:0.25rem;left:calc(50% - 0.125rem);position:absolute;top:0.5rem;width:0.25rem} @-webkit-keyframes dica{30%,50%,70%{-webkit-transform:translateY(0rem);transform:translateY(0rem)}40%,60%{-webkit-transform:translateY(0.25rem);transform:translateY(0.25rem)}}@keyframes dica{30%,50%,70%{-webkit-transform:translateY(0rem);transform:translateY(0rem)}40%,60%{-webkit-transform:translateY(0.25rem);transform:translateY(0.25rem)}}@keyframes dica{30%,50%,70%{-webkit-transform:translateY(0rem);transform:translateY(0rem)}40%,60%{-webkit-transform:translateY(0.25rem);transform:translateY(0.25rem)}} Esse css funciona no chorme, mas não funciona no Safari nem no desktop nem no mobile. Quando entro no site usando o Safari de 100 vezes que entro 1 vez funciona, o resto não funciona.
 
Alguem pode me ajudar como corrijo isso?
 

Fiz uma janelinha bem simples que vai ficar só até sexta-feira no ar, na tela principal de um site, avisando sobre os números de contato que estão diferentes e tal.
A coisa é bem simples, fiz a janela no css e um js pra abrir logo que carrega e pra fechar no botão e se clicar fora da janela também. Até aí tudo normal.
Mas no Safari, quando você clica pra fechar a janela, demora alguns segundos pra ela ser fechada, e isso apenas no Safari e eu não faço ideia do porquê.
Já tive um problema no Safari, porque a ideia era que essa janela fosse um pop-upzinho daqueles que escurece o resto da página e tal, e justamente no Safari ficou zoado, e como precisava ser imediato e ia ficar só uma semana, tirei todo o efeito kk
Enfim, a janela está assim:

 
.popup { margin: 0 auto; padding: 20px; background: #fff; border-radius: 5px; width: 30%; position: relative; transition: all 5s ease-in-out; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .popup .close { position: absolute; top: 20px; right: 30px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #DC0C22; } .popup .close:hover { color: #cc3000; } .popup .content { max-height: 30%; overflow: auto; } @media screen and (max-width: 700px){ .box{ width: 70%; } .popup{ width: 70%; } } E o js:
 
// Pop-Up Temporario $(document).ready(function() { $('.popup').css('zIndex', '10'); $('.popup-close').click(function(e) { e.preventDefault(); $('.popup').css('zIndex', '0'); }); $(document).click(function(e) { $('.popup').css('zIndex', '0'); }); }); Se alguém quiser ver: abimad.com.br

Pessoal, boa tarde.
 
Como resetar os inputs para iPhones e Macs, IOS, para pegar as configurações que quero?  
 
Obrigado desde já. 

Bom, trabalhei nesse layout responsivo para o www.blog.shantihi.com.br e ele está com a barra lateral totalmente desorganizada apenas no navegador Safari em computador Mac. No Internet Explorer, ele aparecia quebrado, mas consegui arrumar e está adaptado a todos navegadores, menos no Safari no Mac.

Será que alguém poderia me ajudar?

Boa noite,
 
Estou finalizando o site:
 
http://mineracaogalvao.com.br
 
Só que surgiu um problema...
Identifiquei que para acesso via Mobile especificamente Android's
A visualização da pagina não esta obedecendo os dimensionamentos
pre-definidos. Acaba que so consigo acessar no menu a aba "História".
Vale a observação que para iOs - Safari a visualização acontece normal
utilizando:
<meta name="viewport" content="width=device-width, initial-scale=1.0"> Sou novo nessa área, alguém poderia me ajudar ?
 
Visualização problemática no Android:
 

 
Att,
Matheus Gurgel.