/* ============================================================
   Topo do portal no guia (desktop) — IGUAL ao da home.
   O header do guia inclui o MESMO home/includes/topo_busca_menu.php (logo,
   busca, clima) + menu_superior.php da home; aqui vai o CSS que a home usa
   para eles, COPIADO de css/estilo_topo_novo.css (#nav, .linha*, .container-nav)
   e css/estilo.css (#bloco-menu, .menu) da raiz dos portais, com tudo preso
   ao #nav para não vazar no resto do guia.
   O menu da home tem 1095px: abaixo de 1200px vale o topo do próprio guia
   (versão celular, menu.css) e este some.
   ============================================================ */

@media (max-width: 1199px) {
  #nav { display: none !important; }
}
@media (min-width: 1200px) {
  .search-header-wrapper { display: none !important; }   /* topo do guia (celular) */
  /* faixa do banner como o #topo-banner da home: branca, 15px acima e abaixo */
  .super-banner-wrap { background: #fff; padding: 15px 24px; }
  .super-banner { border-radius: 0; transition: none; }
  .super-banner:hover { transform: none; box-shadow: none; }
}

/* ---- "chão" da home dentro do #nav: o reset do guia (styles.css) zera margens,
   troca o box-sizing, muda a fonte e põe img em bloco ---- */
#nav { font: 11px Arial, Helvetica, sans-serif; text-align: center; color: #000; line-height: normal;
       -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }
#nav, #nav *, #nav *::before, #nav *::after { box-sizing: content-box; }
#nav p { margin: 1em 0; }
#nav a { color: #0000ee; }
#nav img { display: inline; max-width: none; }
/* A home é XHTML 1.0 Transitional ("almost standards"): linha só com imagem não
   ganha o espaço da descendente. Com <!DOCTYPE html> ganha — o botão da busca e a
   caixa do logo ficavam 2-3px mais altos. */
#nav .container-nav > a > img,
#nav .box-busca button img { vertical-align: top; }
#nav button { box-sizing: border-box; padding: 1px 6px; font: 400 13.3333px Arial; }   /* padrão do navegador */
#nav ul { list-style: none; }
/* Ícones do menu: a home desenha com a Font Awesome 5 Pro (/cadastro/fa5) */
#nav .fa, #nav .fas { font-family: "Font Awesome 5 Pro"; font-weight: 900; }
#nav .far { font-family: "Font Awesome 5 Pro"; font-weight: 400; }
#nav .fab { font-family: "Font Awesome 5 Brands"; font-weight: 400; }

/* ---- css/estilo_topo_novo.css ---- */
#nav {
  width: 100%;
  background: #000;
  height: 175px;
  margin-bottom: 10px;
}
#nav .linha1 {
  width: 1190px;
  margin: 0 auto;
  padding: 15px 0 0 0;
}
#nav .linha2 {
  width: 1200px;
  margin: 0 auto;
  padding: 115px 0 0 0;
}
#nav .container-nav { float: left; }
#nav .container-nav a { text-decoration: none; }
#nav .container-nav.busca {
  margin: 0 auto;
  width: 780px;
}
#nav .container-nav .box-busca {
  padding: 10px;
  background: #fff;
  border-radius: 6px;
  width: 600px;
  height: 35px;
  margin: 23px auto;
}
#nav .container-nav .input-busca {
  border: none;
  background: #fff;
  width: 530px;
  height: 29px;
  padding: 4px 5px;
  color: #000;
  font-size: 20px;
  font-weight: bold;
  float: left;
  outline: none;
  box-sizing: content-box;
}
#nav .container-nav button {
  background: #fff;
  border: none;
  margin-top: -4px;
  margin-left: 0 !important;
  cursor: pointer;
  float: right;
  outline: none;
}
#nav .container-nav .box-busca img { width: 40px; }
#nav .container-nav.temperatura {
  width: 200px;
  margin-top: 30px;
}
#nav .container-nav a.tempo .cidade {
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  padding-left: 17px;
}
#nav .container-nav .temp-minimo { color: #6dc7df; font-size: 16px; }
#nav .container-nav .temp-maximo { color: #e87648; font-size: 16px; }
#nav .container-nav .box-valores img,
#nav .container-nav .box-valores p { float: left; }
#nav .box-valores img { margin-top: -16px; }
#nav .container-nav .box-valores p {
  margin-left: 7px;
  color: #fff;
}
#nav span.encontrado {
  color: #fff;
  font-size: 13px;
  line-height: 50px;
}

/* ---- css/estilo.css (menu e clima) ---- */
#nav p.cidade {
  margin: 0;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #666;
}
#nav i.fa.fa-angle-down {
  font-size: 20px;
  vertical-align: middle;
}
#nav li .principal i { color: #fff; }
#nav .margem-top { margin-top: 7px; }
#nav .menu ul li.ver-todas a { font-weight: bold; }
#nav .menu li.ver-todas {
  clear: both;
  width: 390px;
}
#nav .sub-emprego {
  position: relative;
  left: 20px;
  top: 12px;
  font-weight: 700;
  font-size: 14px;
}
#nav .sub-emprego-li-sub {
  clear: both;
  width: 390px;
}
#nav .sub-emprego-li-sub a { width: 390px !important; }
#nav .menu {
  height: 42px;
  width: 1188px;
  background: #000;
  z-index: 1000;
  position: relative;
}
#nav #bloco-menu {
  width: 1190px;
  height: 50px;
  margin-left: 7%;
}
#nav .menu li a.principal img { border: 0; }
#nav .menu li a.principal2:hover { border-top: 2px solid #fff; }
#nav .menu li a.principal2 {
  color: #fff;
  border-top: 2px solid #000;
  border-right: 1px solid #666;
  background: #000;
}
#nav .menu li a.principal3:hover {
  border-top: 2px solid #fff;
  border-right: 1px solid #fff;
}
#nav .menu li a.principal3 {
  color: #fff;
  border-top: 2px solid #000;
  background: #000;
}
#nav .menu li a.principal:hover { border-right: 1px solid #000; }
#nav .menu li a.principal {
  color: #fff;
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  border-right: 1px solid #666;
  border-bottom: 0;
  background: #000;
}
#nav .menu li a {
  display: block;
  padding: 0 22px;
  margin: 0;
  line-height: 40px;
  text-decoration: none;
  font-family: Arial, sans-serif;
  font-weight: bold;
  font-size: 15px;
  color: #444;
  transition: color .2s ease-in-out;
  background: none;
  text-align: left;
}
#nav .menu li:hover > a {
  color: #000;
  background: #fff;
}
#nav .menu li:hover > ul li {
  height: 25px;
  overflow: visible;
  padding: 0;
}
#nav .menu li:hover > ul { opacity: 1; }
#nav .menu li {
  position: relative;
  list-style: none;
  float: left;
  display: block;
  height: 40px;
}
#nav .menu ul li a:hover {
  font: bold 12px arial;
  background: none;
}
#nav .menu ul li a {
  width: 150px;
  padding: 6px 0 6px 20px;
  margin: 2px 0;
  font: 12px arial;
  border: 0;
}
#nav .menu ul li:last-child a { border: 0; }
#nav .menu ul li {
  height: 0;
  overflow: hidden;
  padding: 0;
  transition: height .25s ease .1s;
}
#nav .menu,
#nav .menu ul,
#nav .menu li,
#nav .menu a {
  margin: 0;
  padding: 0;
  outline: 0;
}
#nav .menu ul {
  width: 400px;
  padding: 5px 0;
  position: absolute;
  top: 40px;
  left: 0;
  opacity: 0;
  background: #fff;
  border-left: 2px solid #000;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  border-radius: 0 0 5px 5px;
  transition: opacity .25s ease .1s;
}