@charset "utf-8";

#rodapemobile { float: left; width: 100%; position: relative; display: none; z-index: 1000;}
#rodapemobile .cima { float: left; width: 100%; background-color: rgb(220, 222, 233);}
#rodapemobile .cima .logo { float: left; width: 220px; margin: 10px 0 12px; text-align: center; font-size: 0;}
#rodapemobile .cima .logo img { height: 40px;}

#rodapemobile .cima .chave { position: absolute; width: 35px; height: 35px; top: 15px; left: 5px;}
#rodapemobile .cima .chave .ico { position: absolute; width: 100%; height: 100%; background-position: 50%; background-repeat: no-repeat;}
#rodapemobile .cima .chave .ico.abrir { background-image: url('../imagens/abrir3.png?v3');}
#rodapemobile .cima .chave .ico.fechar { display: none; background-image: url('../imagens/fechar3.png?v3');}

#rodapemobile .cima .whatsapp { position: absolute; top: 5px; right: 5px; padding: 28px 0 0;}
#rodapemobile .cima .whatsapp .ico { position: absolute; width: 25px; height: 25px; top: 0; left: 50%; margin: 0 0 0 -12.5px; background-image: url('../imagens/icoTop5.png'); background-position: 50%; background-repeat: no-repeat;}
#rodapemobile .cima .whatsapp .nun { float: left; font-size: 0.8em; text-align: center; font-weight: bold; line-height: 0.9;}

#rodapemobile .cima .categorias { position: absolute; top: 17px; right: 80px; padding: 6px 5px 5px; background-color: rgb(255 255 255 / 5%); outline: 1px solid rgb(5 5 5); outline-offset: -1px; border-radius: 3px; cursor: pointer;}

#rodapemobile .catexi { display: none; float: left; width: 100%;}
#rodapemobile .catexi div { float: left; width: 100%; padding: 10px; border-bottom: 1px solid rgb(5 5 5 / 10%); box-sizing: border-box;}

#rodapemobile .menu { display: none; float: left; width: 100%; background-color: #FFFFFF;}
#rodapemobile .menu .tab { float: left; width: 18%; padding: 9px 1% 5px;}
#rodapemobile .menu .tab .ico { float: left; width: 100%; text-align: center; font-size: 0;}
#rodapemobile .menu .tab .ico img { height: 20px;}
#rodapemobile .menu .tab .nome { float: left; width: 100%; text-align: center; font-size: 0.8em; color: #555555;}
#rodapemobile .links { display: none; float: left; width: 100%;}
#rodapemobile .links .link { float: left; width: 100%; padding: 13px 0; border-top: 1px solid #CCCCCC; text-align: center;}

@media only screen and (max-width: 1000px){
	#rodapemobile { display: block;}
}
@media only screen and (max-width: 350px){
	#rodapemobile .menu .tab .nome { font-size: 0.7em;}
}
@media only screen and (max-width: 300px){
	#rodapemobile .menu .tab .nome { font-size: 0.6em;}
}