@charset "utf-8";

header .fundo { float: left; width: 90%; padding: 0 5%; background-color: rgb(31 59 114); position: relative;}

header .chave { display: none; top: 25px; left: 2%;}
header .chave.abrir { background: url('../../imagens/site/header-chave-abrir.png?v12') 50% no-repeat;}
header .chave.fechar { background: url('../../imagens/site/header-chave-fechar.png?v12') 50% no-repeat;}

header .logo { float: left; margin: 11px 0;}

header .links { float: left; margin: 0 0 0 5%;}
header .links .um { float: left; padding: 46px 15px; border-left: 1px solid rgb(5 5 5 / 30%); font-weight: bold; color: rgb(255 255 255) !important; line-height: 0;}
header .links .um:hover { background-color: rgb(5 5 5 / 30%);}
header .links .um.ativo { background-color: rgb(5 5 5 / 30%);}
header .links .um.contato { border-right: 1px solid rgb(5 5 5 / 30%);}

header .buscar { float: left; width: 270px; margin: 24px 0 0 2%;}
header .buscar .like { padding: 10px 40px 10px 10px; z-index: 2;}
header .buscar .lupa { top: 0; right: 0; z-index: 3; background: url('../../imagens/site/header-buscar.png?v4') 50% no-repeat;}
header .buscar .resul { top: 45px; left: 0; padding: 20px 10px; z-index: 4;}
header .buscar .resul .tab .imagem { width: 70px; height: 70px; top: 0; left: 0;}
header .buscar .resul .tab .detalhes { min-height: 70px; padding: 0 0 0 80px;}
header .buscar .resul .tab .detalhes h2 { font-size: 1em;}
header .buscar .resul .tab .detalhes h3 { font-size: 1em;}
header .buscar .resul .fechar { top: 5px; right: 5px;}
header .buscar .desfoque { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; background-color:rgb(0 0 0 / 30%);}

header .carrinho { float: left; padding: 20px 12px 20px 35px; margin: 24px 0 0 2%; outline: 2px solid rgb(250 250 250); outline-offset: -2px; background: url('../../imagens/site/header-carrinho.png?v3') 7px 50% no-repeat; color: rgb(255 255 255) !important;;}
header .carrinho:hover { background-color: rgb(5 5 5 / 30%);}

header .sociais { float: right; margin: 27px 0 0;}
header .sociais a { float: left; width: 35px; height: 35px; margin: 0 2px;}
header .sociais a.instagram { background: rgb(255 255 255) url('../../imagens/site/header-sociais-instagram.png?v4') 50% no-repeat;}
header .sociais a.whatsapp { background: rgb(255 255 255) url('../../imagens/site/header-sociais-whatsapp.png?v4') 50% no-repeat;}
header .sociais a:hover { background-color: rgb(229 236 244);}

header .login { float: right; margin: 27px 0 0 2%;}
header .login .icon { float: left; width: 35px; height: 35px; background: rgb(255 255 255) url('../../imagens/site/header-login-icon.png?v14') 50% no-repeat;}
header .login .um { float: left; margin: 7px 0 0 5px; font-weight: bold; color: rgb(255 255 255) !important;}
header .login:hover .icon { background-color: rgb(229 236 244);}

@media only screen and (max-width: 1200px){
  header .links .um { padding: 46px 10px;}
  header .carrinho { padding: 17.5px; font-size: 0;}
}
@media only screen and (max-width: 1100px){
  header .fundo { width: 96%; padding: 0 2%;}
}
@media only screen and (max-width: 1000px){
  header .fundo { width: 100%; padding: 0;}

  header .chave { display: block;}
  header .links { display: none;}
  header .carrinho { display: none;}
  header .sociais { display: none;}

  header .logo { width: 100%;}

  header .links { width: 100%; margin: 0 0 11px;}
  header .links .um { width: 100%; padding: 25px 0; margin: 0; border-top: 1px solid rgb(5 5 5 / 30%); border-left: 0; text-align: center;}
  header .links .um.contato { border-bottom: 1px solid rgb(5 5 5 / 30%); border-right: 0;}

  header .buscar { width: 96%; margin: 0 2% 8px;}
  header .buscar .like { width: 100%;}

  header .carrinho { width: 96%; padding: 21px 0; margin: 0 2% 8px; text-align: center; font-size: 1em;}

  header .sociais { float: left; width: 100%; margin: 0 0 8px;}
  header .sociais .icons { display: flex; justify-content: center; width: 100%;}
  
  header .login { position: absolute; top: 27px; right: 2%; margin: 0;}
  header .login .um { display: none;}
}