@charset "utf-8";

header { float: left; width: 100%; position: relative; z-index: 100;}

header .site { float: left; width: 100%; background-color: rgb(250 250 250); position: fixed;  top: 0 !important; left: 0;}
header .site .logo { float: left; margin: 15px 0 10px 5%; font-size: 0;}
header .site .topo { float: right; width: 64%; margin: 0 5% 0 0;}
header .site .menu { float: left; width: 90%; padding: 0 5%; background-color: rgb(179 43 43);}
header .site .chave { display: none; position: absolute; top: 23px; left: 2%;}
header .site .chave .ico { float: left; width: 40px; height: 40px; background-repeat: no-repeat;}
header .site .chave .ico.abrir { background-image: url('../../imagens/site/chave-abrir.png');}
header .site .chave .ico.fechar { display: none; background-image: url('../../imagens/site/chave-fechar.png');}
header .site .buscar { float: left; width: 45%; margin: 24px 0 0; position: relative; z-index: 5;}
header .site .buscar .c1 { float: left; width: 100%; outline: 1px solid rgb(0 0 0 / 15%); background-color: rgb(250 250 250); position: relative;}
header .site .buscar .c1 .digite { float: left; width: 70%; height: 40px; padding: 0 5%;}
header .site .buscar .c1 .ico { position: absolute; width: 40px; height: 40px; top: 0; right: 0; background-image: url('../../imagens/site/buscar-1.png'); background-position: 50%; background-repeat: no-repeat;}
header .site .buscar .ajax { position: absolute; width: 90%; top: 55px; left: 0; padding: 0 5%; outline: 1px solid rgb(0 0 0 / 15%); background-color: rgb(250 250 250); z-index: 5;}
header .site .buscar .ajax .porfrase { float: left; width: 100%; margin: 20px 0 15px;}
header .site .buscar .ajax .porfrase a { float: left; width: 100%; padding: 10px 0; font-size: 1.2em; line-height: 1.2;}
header .site .buscar .ajax .porfrase a i { float: left; padding: 0 0 0 35px; background-image: url('../../imagens/site/buscar-2.png'); background-position: 0 50%; background-repeat: no-repeat; font-style: normal;}
header .site .buscar .ajax .porfrase a:hover { color: rgb(179 43 43);}
header .site .buscar .ajax .produtos { float: left; width: 100%;}
header .site .buscar .ajax .produtos .tab { width: 48%; margin: 10px 1%;}
header .site .buscar .ajax .produtos .tab .imagem { height: 250px;}
header .site .buscar .ajax .nenhum { float: left; width: 100%; padding: 20px 0; font-size: 1.1em; color: rgb(90 90 90);}
header .site .lojista { float: left; margin: 32px 0 0 9%;}
header .site .lojista b { padding: 5px 0 5px 18px; background-image: url('../../imagens/site/lojista.png'); background-position: 0 50%; background-repeat: no-repeat; font-weight: normal; font-size: 1.1em; color: rgb(90 90 90);}
header .site .lojista:hover b { color: rgb(179 43 43);}
header .site .minhaconta { float: right; margin: 20px 0 0; position: relative;}
header .site .minhaconta .opcao { float: left; padding: 13px 8px 10px; margin: 0 0 0 5px; background-color: rgb(255 255 255); font-weight: bold; color: rgb(90 90 90);}
header .site .minhaconta .opcao:hover { color: rgb(179 43 43);}
header .site .minhaconta .ico { position: absolute; width: 40px; height: 40px; top: 50%; left: 0; margin: -19px 0 0;}
header .site .minhaconta .nome { float: left; padding: 5px 0 3px 45px; font-weight: bold; line-height: 1.2;}
header .site .minhaconta .nome b { font-size: 0.9em;}
header .site .minhaconta .nome strong { font-weight: normal; font-size: 0.9em; color: rgb(90 90 90);}
header .site .minhaconta:hover .nome b { color: rgb(179 43 43);}
header .site .categorias { float: left; margin: 0 0 0 5%; border-left: 1px solid rgb(92 12 12); border-right: 1px solid rgb(92 12 12); position: relative;}
header .site .categorias .nome { float: left; padding: 20px 20px 17px 43px; background-image: url('../../imagens/site/categorias.png'); background-repeat: no-repeat; text-transform: uppercase; font-weight: bold; font-size: 0.9em; color: rgb(255 255 255); line-height: 1;}
header .site .categorias .nome.abrir { background-position: 20px 0;}
header .site .categorias .nome.fechar { background-position: 20px 100%;}
header .site .categorias .acao { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
header .site .categorias:hover { background-color: rgb(143 43 38);}

header .site .links { float: left; margin: 0 0 0 8px; line-height: 1;}
header .site .links .um { float: left; padding: 20px 15px 17px; position: relative; text-transform: uppercase; font-weight: bold; font-size: 0.9em; color: rgb(255 255 255);}
header .site .links .um.ativo { color: rgb(255 196 161);}
header .site .links .um:hover { color: rgb(255 196 161);}
header .site .links .des.ativo { color: rgb(255 196 161);}
header .site .links .mob.ativo { color: rgb(255 196 161);}
header .site .links .um .balao { display: none;}
header .site .links .um .balao .branco { float: left; width: 100%; background-color: rgb(250 250 250);}
header .site .links .um .balao .dois { float: left; width: 100%; padding: 15px; box-sizing: border-box; border-bottom: 1px solid rgb(90 90 90 / 20%); text-transform: none; font-weight: normal;}
header .site .links .um .balao .dois:hover { background-color: rgb(90 90 90 / 10%);}
header .site .links .um .balao .dois.ativo { background-color: rgb(90 90 90 / 10%);}

header .site .checkout { float: right; padding: 16px 0 11px 40px; background-image: url('../../imagens/site/checkout-topo.png'); background-position: 0 0; background-repeat: no-repeat; font-weight: bold; color: rgb(255 255 255);}


header .auth { float: left; width: 100%; background-color: rgb(15 15 15);}
header .auth .logo { float: left; width: 100%; text-align: center; font-size: 0;}
header .auth .logo img { height: 50px;}
header .auth .voltar { position: absolute; width: 30px; height: 30px; top: 50%; left: 2%; margin: -15px 0 0; background-image: url('../../imagens/geral/voltar-a.png'); background-position: 50%; background-repeat: no-repeat;}
header .auth .suporte { position: absolute; width: 30px; height: 30px; top: 50%; right: 2%; margin: -15px 0 0; background-image: url('../../imagens/geral/suporte.png'); background-position: 50%; background-repeat: no-repeat;}

header .painel { position: fixed; width: 100%; height: 50px; top: 0; left: 0; background-color: rgb(15 15 15);}
header .painel .logo { float: left; width: 100%; text-align: center; font-size: 0;}
header .painel .logo img { height: 50px;}
header .painel .chave { position: absolute; top: 5px; left: 1%; z-index: 1;}
header .painel .chave .ico { float: left; width: 40px; height: 40px; background-position: 50%; background-repeat: no-repeat;}
header .painel .chave .ico.abrir { background-image: url('../../imagens/painel/chave-abrir.png');}
header .painel .chave .ico.fechar { background-image: url('../../imagens/painel/chave-fechar.png');}
header .painel .sair { position: absolute; top: 15px; right: 70px; z-index: 1; padding: 10px; background-color: rgb(90 90 90); color: rgb(255 255 255 / 80%); line-height: 0;}
header .painel .sair:hover { background-color: rgb(120 120 120);}
header .painel .tema { position: absolute; top: 5px; right: 1%; z-index: 1;}
header .painel .tema .ico { float: left; width: 40px; height: 40px; background-image: url('../../imagens/painel/tema.png'); background-position: 50%; background-repeat: no-repeat;}

/* categorias */
@media only screen and (min-width: 1001px){
	header .site .links .um .des { display: block; color: rgb(255 255 255);}
	header .site .links .um .mob { display: none;}
	header .site .links .um .balao { position: absolute; width: 280px; padding: 20px 0 0; top: 40px; left: 0;}
	header .site .links .um:hover .balao { display: block;}
}
@media only screen and (max-width: 1000px){
	header .site .links .um .des { display: none;}
	header .site .links .um .mob { display: block; padding: 20px 0 17px;}
	header .site .links .um .balao { float: left; width: 100%;}
}

/* normais */
@media only screen and (max-width: 1200px){
	header .site .topo { width: 60%;}
	header .site .buscar { width: 40%;}
	header .site .lojista { margin: 32px 0 0 6%;}
}
@media only screen and (max-width: 1000px){
	header .site .logo { width: 100%; text-align: center; margin: 10px 0;}
	header .site .topo { float: left; width: 100%; margin: 0;}
	header .site .chave { display: block;}
	header .site .buscar { width: 100%; margin: 0; border-left: 0; border-right: 0;}
	header .site .buscar .c1.border { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
	header .site .buscar .c1 .digite { padding: 0 2%;}
	header .site .lojista { width: 100%; padding: 17px 0 15px; margin: 0; background-color: rgb(0 0 0 / 5%); text-align: center;}
	header .site .minhaconta { width: 100%; margin: 0;}
	header .site .minhaconta .opcao { width: 50%; padding: 17px 0 15px; margin: 0; outline: 1px solid rgb(90 90 90 / 20%); text-align: center;}
	header .site .minhaconta .opcao.cadastrar { float: right;}
	header .site .minhaconta .opcao.border { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
	header .site .minhaconta .opcao.sombra { -webkit-box-shadow: 0 0 0 0 rgb(0 0 0 / 0); -moz-box-shadow: 0 0 0 0 rgb(0 0 0 / 0); box-shadow: 0 0 0 0 rgb(0 0 0 / 0);}
	header .site .minhaconta .ico { left: 2%;}
	header .site .minhaconta .nome { width: 100%; padding: 17px 0 15px; text-align: center;}
	
	header .site .categorias { width: 100%; margin: 0; border-top: 1px solid rgb(146 22 22); border-bottom: 1px solid rgb(146 22 22); border-left: 0; border-right: 0;}
	header .site .categorias .nome { width: 100%; padding: 20px 0 17px; text-align: center;}
	
	header .site .links { width: 100%; padding: 10px 0; margin: 0;}
	header .site .links .um { width: 100%; padding: 0; text-align: center; border-top: 1px solid rgb(146 22 22);}
	header .site .links .um.pad { padding: 20px 0 17px;}
	header .site .links .um.home { border-top: 0;}
	
	header .site .checkout { position: absolute; top: 16px; right: 2%; background-position: 0 100%; color: rgb(90 90 90);}
	header .site .lojista { display: none;}
	header .site .minhaconta { display: none;}
	header .site .categorias { display: none;}
	header .site .links { display: none;}

	header .painel .sair { right: 50px;}
}
@media only screen and (max-width: 600px){
	header .site .buscar .ajax .produtos .tab .imagem { height: 220px;}
}
@media only screen and (max-width: 500px){
	header .site .logo { margin: 10px 0 8px;}
	header .site .logo img { width: 180px;}
	header .site .chave { top: 11px;}
	header .site .checkout { top: 5px;}

	header .auth .voltar { left: 3%;}
	header .auth .voltar .nome { display: none;}
	header .auth .links { right: 3%;}
	header .auth .links a { width: 20px; height: 56px; padding: 0; border: 0; font-size: 0; background-position: 50%;}
	header .auth .links a.ajuda { border: 0;}
}
@media only screen and (max-width: 400px){
	header .site .buscar .ajax .produtos .tab .imagem { height: 175px;}
}