@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

body .oswald { font-family: "Oswald", sans-serif;}

#app { float: left; width: 100%; min-height: 520px;}

#main .titulo { text-align: center; font-size: 1.2em;}

#main .pwa span { padding: 20px 0 20px 35px; background-image: url('../../imagens/app/app.png?v1'); background-position: 0 50%; background-repeat: no-repeat;}

#main .mmob { display: none; left: 0; bottom: 0; font-size: 0.9em; color: rgb(150 150 150);}
#main .mmob .ico { padding: 50px 0 20px; background: url('../../imagens/app/mmob-home.png?v5') 50% 12px no-repeat;}
#main .mmob .ico.home { background: url('../../imagens/app/mmob-home.png?v5') 50% 12px no-repeat;}
#main .mmob .ico.checkout { background: url('../../imagens/app/mmob-checkout.png?v3') 50% 12px no-repeat;}
#main .mmob .ico.pedidos { background: url('../../imagens/app/mmob-pedidos.png?v5') 50% 12px no-repeat;}
#main .mmob .ico:hover { background-color: rgb(90 90 90 / 10%);}

#main .produto .imagem { height: 1px;}
#main .produto .nome h2 { height: 38px; font-size: 1em; line-height: 1.1; overflow: hidden;}
#main .produto .codigo h2 { font-size: 1em;}
#main .produto .botop { padding: 5px 0 0; border-top: 1px solid rgb(90 90 90 / 30%);}
#main .produto .estoque { width: 50%;}
#main .produto .estoque h2 { font-size: 1em; color: rgb(31 59 114);}
#main .produto .estoque h3 { font-size: 1em;}
#main .produto .preco { width: 50%;}
#main .produto .preco h2 { font-size: 1em; color: rgb(31 59 114);}
#main .produto .preco h3 { font-size: 1em; color: rgb(237 28 36);}

#main .erro404 { float: left; width: 100%; padding: 41px 0 61px; position: relative;}
#main .erro404 .nome { float: left; width: 100%; text-align: center; font-weight: bold; font-size: 5em; line-height: 1;}
#main .erro404 .numero { float: left; width: 100%; margin: 20px 0; text-align: center; font-size: 12em;}
#main .erro404 .numero b { padding: 0 20px; outline: 2px solid rgb(150 150 150);}
#main .erro404 .infor { float: left; width: 100%; text-transform: uppercase; text-align: center; font-weight: bold; font-size: 2em; line-height: 1;}

#main .wfixo { width: 70px; height: 70px; right: 20px; bottom: 20px; z-index: 20; background: rgb(8 131 73) url('../../imagens/site/wfixo.png?v2') 50% no-repeat;}

@media only screen and (min-width: 1000px){
  #main .pwa { display: none !important;}
}
@media only screen and (max-width: 1000px){
  #main .mmob { display: flex;}
}
@media only screen and (max-width: 700px){
  #main .wfixo { width: 50px; height: 50px; right: 5px; bottom: 55px;}
}
@media only screen and (max-width: 500px){
  #main .produto .estoque h2 { font-size: 0.9em;}
  #main .produto .estoque h3 { font-size: 0.9em;}
  #main .produto .preco h2 { font-size: 0.9em;}
  #main .produto .preco h3 { font-size: 0.9em;}

  #main .erro404 .nome { font-size: 4em;}
  #main .erro404 .numero { font-size: 6em;}
  #main .erro404 .infor { font-size: 1em;}
}