@charset "utf-8";

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

header .site { float: left; width: 100%; top: 0; left: 0; z-index: 100; position: relative;}
header .site .chave { display: none; position: absolute; top: 42px; left: 2%;}
header .site .chave .ico { float: left; width: 40px; height: 40px;}
header .site .chave .ico.abrir { background-image: url('../../imagens/site/header-chave-abrir.png');}
header .site .chave .ico.fechar { background-image: url('../../imagens/site/header-chave-fechar.png');}
header .site .logo { float: left; margin: 50px 0 10px 5%; text-align: center; font-size: 0;}
header .site .barra { position: absolute; width: 90%; top: 0; left: 0; padding: 10px 5%; background-color: rgb(105 154 75);}
header .site .barra .idiomas { float: left;}
header .site .barra .idiomas .opcao { float: left; margin: 0 20px 0 0;}
header .site .barra .idiomas .opcao b { float: left; margin: 1px 0 0 5px; font-weight: normal; color: rgb(255 255 255);}
header .site .barra .idiomas .opcao em { float: left; width: 25px; height: 25px; background-position: 50%; background-repeat: no-repeat;}
header .site .barra .idiomas .opcao em.pt { background-image: url('../../imagens/site/header-barra-idiomas-pt.png');}
header .site .barra .idiomas .opcao em.in { background-image: url('../../imagens/site/header-barra-idiomas-in.png');}
header .site .barra .sociais { float: left; margin: 0 0 0 100px;}
header .site .barra .sociais b { float: left; margin: 1px 0 0; font-weight: normal; color: rgb(255 255 255);}
header .site .barra .sociais a { float: left; width: 25px; height: 25px; margin: 0 0 0 5px; background-color: rgb(255 255 255); background-position: 50%; background-repeat: no-repeat;}
header .site .barra .sociais a.instagram { background-image: url('../../imagens/site/header-barra-sociais-instagram.png');}
header .site .barra .sociais a.facebook { background-image: url('../../imagens/site/header-barra-sociais-facebook.png');}
header .site .barra .aba { float: right; padding: 13px 10px 12px; margin: 0 10px 0 0; background-color: rgb(255 255 255); color: rgb(105 154 75); line-height: 0;}
header .site .barra .telefone { float: right;}
header .site .barra .telefone b { float: left; margin: 1px 0 0 5px; font-weight: normal; color: rgb(255 255 255);}
header .site .barra .telefone em { float: left; width: 25px; height: 25px; background-color: rgb(255 255 255); background-image: url('../../imagens/site/header-barra-telefone.png'); background-position: 50%; background-repeat: no-repeat;}
header .site .links { float: right; margin: 83px 5% 0 0;}
header .site .links .um { float: left; margin: 0 0 0 30px; position: relative;}
header .site .links .um .nome { float: left; padding: 20px 0; color: rgb(80 80 80); line-height: 0;}
header .site .links .um .nome:hover { color: rgb(105 154 75);}
header .site .links .um .nome.seta { padding: 20px 20px 20px 0; background-image: url('../../imagens/site/header-links-seta.png'); background-position: 100% 50%; background-repeat: no-repeat;}
header .site .links .um .dois { position: absolute; width: 200px; top: 40px; left: 0; background-color: rgb(105 154 75); -webkit-box-shadow: 0 0 15px 0 rgb(0 0 0 / 25%); -moz-box-shadow: 0 0 15px 0 rgb(0 0 0 / 25%); box-shadow: 0 0 15px 0 rgb(0 0 0 / 25%);}
header .site .links .um .dois .sub { float: left; width: 90%; padding: 10px 5%; border-bottom: 1px solid rgb(255 255 255); color: rgb(255 255 255);}
header .site .links .um .dois .sub:hover { background-color: rgb(0 0 0 / 10%);}
header .site .links .um .dois .sub.ultimo { border-bottom: 0;}
header .site .links .um.ultimo { border-bottom: 0;}


header .auth { float: left; width: 100%; background-color: rgb(4 11 16);}
header .auth .logo { float: left; width: 100%; text-align: center; font-size: 0;}


header .painel { position: fixed; width: 100%; top: 0; left: 0; background-color: rgb(4 11 16);}
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 10px 11px; line-height: 0; color: rgb(200 200 200);}
header .painel .sair:hover { color: rgb(55 171 200);}
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;}

@media only screen and (min-width: 1101px){
  header .site .links .um:hover .dois { display: block;}
}
@media only screen and (max-width: 1100px){
  header .site .chave { display: block;}
  header .site .barra { display: none;}
  header .site .links { display: none;}

  header .site .logo { width: 100%; padding: 10px 0; margin: 0; border-top: 5px solid rgb(105 154 75);}
  header .site .barra { float: left; width: 96%; padding: 10px 2%; position: relative;}
  header .site .barra .idiomas { width: 100%;}
  header .site .barra .idiomas .opcao { width: 46%; padding: 10px 2%; margin: 0; outline: 1px solid rgb(0 0 0 / 25%); outline-offset: -2px;}
  header .site .barra .sociais { margin: 20px 0 15px;}
  header .site .barra .telefone { margin: 20px 0 15px;}
  header .site .barra .aba { float: left; width: 100%; padding: 20px 0; margin: 5px 0 0; text-transform: uppercase; text-align: center; font-size: 1.2em;}
  header .site .barra .aba.circulo { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
  header .site .links { float: left; width: 100%; margin: 10px 0;}
  header .site .links .um { width: 96%; padding: 10px 2%; margin: 0; border-bottom: 1px solid rgb(100 100 100 / 30%);}
  header .site .links .um .nome { width: 100%;}
  header .site .links .um .nome.seta { padding: 20px 0;}
  header .site .links .um .dois { float: left; width: 100%; top: 0; position: relative; -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%);}
}
@media only screen and (max-width: 400px){
  header .site .chave { top: 35px;}
  header .site .logo img { width: 213px;}
}