@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*
Pequenas telas: até 576 px
Celular: de 576px ate 768px
Tablet: de 768px até 992px;
Descktop: de 992px até 1200px
Telas grandes: acima de 1200px
*/
/* Menor que 576px*/
/* Maior ou igual a 576px*/
/* Maior ou igual a 768px*/
/* Maior ou igual a 992px*/
/* Maior ou igual a 1200px*/
/* Maior ou igual a 1400px*/
body {
  /* imagem tela até 576px*/
  background-image: url(../img/figures/600_160.png);
  background-repeat: no-repeat;
  background-color: #8CB5DC;
  font-family: Arial, Helvetica;
  /* imagem tela acima de  576px*/ }
  @media screen and (min-width: 576px) {
    body {
      background-image: url(../img/figures/1440_160.png); } }

.contPagina {
  display: grid;
  grid-template-rows: auto 1fr auto;
  /* Três linhas com altura automática para header e footer, e uma linha principal que ocupa o restante do espaço */
  grid-template-columns: 1fr;
  /* Três colunas com largura igual */
  height: 100vh;
  /* Define a altura do container para ocupar toda a altura da viewport */ }

.contHeader, .contMain, .contFooter {
  border: none; }

.contHeader {
  grid-row: 1;
  /* A div do header ocupa a primeira linha */
  min-height: 130px;
  display: flex;
  align-items: flex-start;
  /* Ajuste para alinhar no início do container */ }

.contMain {
  grid-row: 2;
  /* A div do main ocupa a segunda linha */
  margin-top: 40px;
  width: 100%; }

.contFooter {
  grid-row: 3;
  /* A div do footer ocupa a terceira linha */
  bottom: 0; }

.logomarca {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 0;
  height: 130px;
  width: 60%; }
  @media screen and (min-width: 768px) {
    .logomarca {
      width: 55%; } }
  @media screen and (min-width: 992px) {
    .logomarca {
      width: 45%; } }

.logomarca > img {
  height: 65px; }
  @media screen and (min-width: 768px) {
    .logomarca > img {
      height: 100px; } }

.contato {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 0;
  width: 40%;
  height: 130px;
  line-height: 130px;
  /* Define a altura da linha igual à altura da div */ }
  @media screen and (min-width: 768px) {
    .contato {
      width: 40%; } }

.contato a {
  display: inline-block;
  vertical-align: middle;
  /* Alinha verticalmente */
  text-decoration: none;
  color: white;
  font-size: 0.8em; }
  @media screen and (min-width: 576px) {
    .contato a {
      font-size: 1em; } }
  @media screen and (min-width: 768px) {
    .contato a {
      font-size: 1.4em; } }

.contato img {
  height: 30px;
  vertical-align: middle;
  /* Alinha verticalmente */ }
  @media screen and (min-width: 576px) {
    .contato img {
      height: 40px; } }

.nav {
  height: 40px;
  width: 100%;
  position: absolute;
  margin-top: 130px; }

.containerFooter {
  height: 100px;
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #1D78A7; }

.navRodape1 {
  height: 100px;
  width: 120px;
  margin-top: 15px;
  margin-left: 15px; }
  @media screen and (min-width: 576px) {
    .navRodape1 {
      width: 160px;
      margin: 15px 15px 0 15px; } }
  @media screen and (min-width: 768px) {
    .navRodape1 {
      width: 180px; } }

.navRodape2 {
  height: 100px;
  width: 120px;
  margin-top: 15px;
  margin-left: 15px; }
  @media screen and (min-width: 576px) {
    .navRodape2 {
      width: 160px;
      margin: 15px 15px 0 15px; } }
  @media screen and (min-width: 768px) {
    .navRodape2 {
      width: 180px; } }

.navRodape3 {
  height: 100px;
  width: 70px;
  margin: 15px 15px 0 15px; }

.navRodape3 > a {
  text-decoration: none; }

.navRodape1 > ul {
  list-style-image: url(../img/figures/avanço1.png);
  padding: 0;
  margin: 0 15px; }

.navRodape2 > ul {
  list-style-image: url(../img/figures/avanço1.png);
  padding: 0;
  margin: 0 15px; }

.navRodape1 > li {
  margin-top: 10px;
  margin-left: 10px; }

.navRodape2 > li {
  margin-top: 10px;
  margin-left: 10px; }

.navRodape1 > ul > li > a {
  text-decoration: none;
  color: #8CB5DC;
  display: block;
  font-size: 0.8em; }

.navRodape2 > ul > li > a {
  text-decoration: none;
  color: #8CB5DC;
  display: block;
  font-size: 0.8em; }

.navRodape1 > ul > li > a:hover {
  color: white; }

.navRodape2 > ul > li > a:hover {
  color: white; }

.navRodape1 > h1 {
  color: white;
  font-size: 0.8em;
  margin-bottom: 10px;
  text-align: left; }
  @media screen and (min-width: 576px) {
    .navRodape1 > h1 {
      font-size: 0.9em; } }
  @media screen and (min-width: 768px) {
    .navRodape1 > h1 {
      font-size: 1em; } }

.navRodape2 > h1 {
  color: white;
  font-size: 0.8em;
  margin-bottom: 10px; }
  @media screen and (min-width: 576px) {
    .navRodape2 > h1 {
      font-size: 0.9em; } }
  @media screen and (min-width: 768px) {
    .navRodape2 > h1 {
      font-size: 1em; } }

.navRodape3 > h1 {
  color: white;
  font-size: 0.8em;
  margin-bottom: 10px; }
  @media screen and (min-width: 576px) {
    .navRodape3 > h1 {
      font-size: 0.9em; } }
  @media screen and (min-width: 768px) {
    .navRodape3 > h1 {
      font-size: 1em; } }

.menuBurguer {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  position: relative; }

.menuMobile {
  display: none;
  width: 100%; }
  @media screen and (min-width: 576px) {
    .menuMobile {
      display: block; } }

.menuMobile > ul {
  list-style-type: none;
  width: 100%;
  text-align: center;
  z-index: 1000;
  position: absolute; }

@media screen and (min-width: 576px) {
  .menuMobile > ul > li {
    display: inline-block; } }

.menuMobile > Ul > li > a {
  display: block;
  padding: 10px 25px;
  text-decoration: none;
  text-align: left;
  background-color: #1D78A7;
  color: white;
  border-top: 2px solid #8CB5DC; }
  @media screen and (min-width: 576px) {
    .menuMobile > Ul > li > a {
      border-top: none;
      padding: 10px 6px;
      font-size: 0.9em; } }
  @media screen and (min-width: 768px) {
    .menuMobile > Ul > li > a {
      padding: 10px 15px;
      font-size: 1em; } }
  @media screen and (min-width: 1200px) {
    .menuMobile > Ul > li > a {
      padding: 10px 25px; } }
  @media screen and (min-width: 1400px) {
    .menuMobile > Ul > li > a {
      padding: 10px 25px; } }

.menuMobile > Ul > li > a:hover {
  color: #1D78A7; }

i#burguer {
  background-color: none;
  display: block;
  text-align: center;
  cursor: pointer;
  padding: 10px;
  background-color: #1D78A7; }
  @media screen and (min-width: 576px) {
    i#burguer {
      display: none; } }

i#burguer:hover {
  color: black; }

menu > Ul > li > a:hover {
  background-color: #8CB5DC; }

.material-icons {
  font-size: 45px;
  color: white;
  text-align: right; }

.pesquisa {
  margin-top: 10px;
  width: 100%;
  text-align: center; }
  @media screen and (min-width: 576px) {
    .pesquisa {
      width: 90% px; } }
  @media screen and (min-width: 992px) {
    .pesquisa {
      width: 100%; } }
  @media screen and (min-width: 1200px) {
    .pesquisa {
      width: 100%; } }
  @media screen and (min-width: 1400px) {
    .pesquisa {
      width: 100%; } }

.pesquisa > h1 {
  font-size: 1.5em !important;
  color: white;
  padding-top: 10px !important;
  padding-bottom: 10px !important; }
  @media screen and (min-width: 768px) {
    .pesquisa > h1 {
      font-size: 1.8em !important; } }

/* Estlilos do ELEMENTO TAB da DIV PESQUISA */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #1D78A7;
  font-size: 1em; }

/* Estilos do ELEMENTO BUTTON DA TAB */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 0.8em; }
  @media screen and (min-width: 576px) {
    .tab button {
      font-size: 1em; } }

/* Estilos do ELEMENTO BUTTON:HOVER DA TAB */
.tab button:hover {
  background-color: #ddd; }

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc; }

/*Estilos do CONTEUDO DA TAB*/
.tabcontent {
  padding: 6px 6px;
  border: 1px solid #ccc;
  border-top: none;
  background-color: #1D78A7;
  align-items: center; }

.tabcontent > h2 {
  font-size: 1em;
  color: white;
  text-align: center;
  margin: 10px;
  line-height: 1em; }
  @media screen and (min-width: 576px) {
    .tabcontent > h2 {
      margin: 10px;
      font-size: 1.1em;
      font-weight: bold; } }
  @media screen and (min-width: 768px) {
    .tabcontent > h2 {
      font-size: 1.2em; } }

/* Estilos da tabela do formulario de pesquisa  da página inicial*/
.tabPesquisa {
  border-collapse: colapso;
  padding: 3px;
  margin: 5px auto;
  text-align: center; }

.tabPesquisa input, select {
  width: 29%;
  height: 25px;
  font-size: 0.9em;
  margin: 5px 0px; }
  @media screen and (min-width: 576px) {
    .tabPesquisa input, select {
      width: 14.9%;
      height: 27px;
      font-size: 0.8em;
      margin: 5px 0.5%; } }
  @media screen and (min-width: 768px) {
    .tabPesquisa input, select {
      width: 15%;
      height: 35px;
      font-size: 1em;
      margin: 5px 0.5; } }
  @media screen and (min-width: 1200px) {
    .tabPesquisa input, select {
      width: 15%;
      margin: 5px 0.5%; } }

#submitPesquisa {
  background-color: #1D78A7;
  color: white;
  border: 1px solid white; }

.tabPesquisa form {
  background-color: #1D78A7;
  text-align: center; }

* {
  box-sizing: border-box; }

/* Slideshow container */
.slideshow-container {
  max-width: 700px;
  position: relative;
  margin: auto; }

/* Hide the images by default */
.mySlides {
  display: none; }

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none; }

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px; }

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0, 0, 0, 0.8); }

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center; }

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0; }

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease; }

.active, .dot:hover {
  background-color: #717171; }

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s; }

@keyframes fade {
  from {
    opacity: .4; }
  to {
    opacity: 1; } }
div.scroll-container {
  background-color: #1D78A7;
  overflow: auto;
  white-space: nowrap; }

div.scroll-container img {
  height: 220px;
  padding: 0px; }

.destaques {
  width: 100%;
  margin-bottom: 15px; }

.destaques > h1 {
  font-size: 1.1em;
  margin: 15px;
  color: white; }

.DivListaImoveis {
  width: 98%;
  display: inline-block;
  position: relative;
  background-color: white;
  margin-left: 1%;
  margin-top: 10px; }
  @media screen and (min-width: 576px) {
    .DivListaImoveis {
      width: 48%;
      align-items: left; } }
  @media screen and (min-width: 1200px) {
    .DivListaImoveis {
      width: 32%; } }

.listaImoveis > h2 {
  font-size: 1.2em;
  margin: 32px; }

.DivListaImoveis img {
  width: 100%;
  height: 365px;
  object-fit: cover; }
  @media screen and (min-width: 576px) {
    .DivListaImoveis img {
      height: 210px;
      object-fit: cover; } }
  @media screen and (min-width: 768px) {
    .DivListaImoveis img {
      height: 280px;
      object-fit: cover; } }
  @media screen and (min-width: 992px) {
    .DivListaImoveis img {
      height: 300px;
      object-fit: cover; } }
  @media screen and (min-width: 1200px) {
    .DivListaImoveis img {
      height: 242px;
      object-fit: cover; } }
  @media screen and (min-width: 1400px) {
    .DivListaImoveis img {
      height: 280px;
      object-fit: cover; } }

/* Estilo referente a DESCRIÇÃO DETALAHADA do imovel */
.DivListaImoveis > p {
  font-size: 0.9em;
  padding: 5px;
  left: 10px;
  max-width: 30ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

/* Estilo referente ao palavra chave*/
.DivListaImoveis h1 {
  position: absolute;
  font-weight: bold;
  top: 10px;
  left: 10px;
  font-size: 1.1em;
  color: white;
  background-color: #983410;
  padding: 5px; }

/* Estilo referente ao TIPO DE IMÓVEL e FINALIDADE */
.DivListaImoveis > h2 {
  float: left;
  display: inline;
  font-size: 1em;
  font-weight: bold;
  margin-left: 10px;
  margin-top: 10px; }

/* Estilo referente ao VALOR do imovel*/
.DivListaImoveis > h3 {
  display: inline;
  float: right;
  font-size: 1em;
  font-weight: bold;
  margin-right: 10px;
  margin-top: 10px;
  color: red; }

/* Estilo referente a CIDADE E BAIRRO do imovel */
.DivListaImoveis > h4 {
  clear: both;
  font-size: 0.9em;
  margin-top: 35px;
  margin-left: 10px; }

.TdListaImoveis {
  font-size: 0.9em;
  text-align: center;
  border: 1px solid #1D78A7;
  width: 96%;
  margin: 2%;
  color: #1D78A7; }

.TdListaImoveis img {
  width: 25px;
  height: 25px;
  margin-top: 5px; }

.TdListaImoveis > td {
  min-width: 16%;
  margin: 0; }

.TdListaImoveis > p {
  text-align: center; }

.DivListaImoveis > table {
  margin-bottom: 10px; }

/* Página detalhes imóvel*/
.TdListaImoveis1 {
  font-size: 0.9em;
  text-align: center;
  border: 1px solid #1D78A7;
  width: 96% !important;
  margin: 2%;
  color: #1D78A7; }

.TdListaImoveis1 img {
  width: 25px;
  height: 25px;
  margin-top: 5px; }

.TdListaImoveis1 > td {
  min-width: 16%;
  margin: 0; }

.TdListaImoveis1 > p {
  text-align: center; }

.DivListaImoveis1 > table {
  margin-bottom: 10px; }

.DetalheTabela2 {
  margin-top: 10px;
  margin-bottom: 10px;
  width: 100%; }

.DetalheTabela2 a {
  text-decoration: none;
  color: #1D78A7;
  font-size: 0.8em;
  margin-left: 15px;
  text-align: center; }

.empreendimento {
  margin-bottom: 20px;
  display: inline-block; }
  @media screen and (min-width: 768px) {
    .empreendimento {
      width: 48%;
      align-items: left; } }

.empreendimento > h1 {
  font-size: 1.1em;
  margin: 15px;
  color: white; }

.DivListaEmpreend {
  width: 98%;
  display: inline-block;
  position: relative;
  margin-left: 1%;
  margin-top: 10px; }

.DivListaEmpreend img {
  width: 96%;
  margin: 2%;
  height: 340px;
  object-fit: cover; }
  @media screen and (min-width: 576px) {
    .DivListaEmpreend img {
      height: 340px;
      object-fit: cover; } }
  @media screen and (min-width: 768px) {
    .DivListaEmpreend img {
      height: 300px;
      object-fit: cover; } }
  @media screen and (min-width: 992px) {
    .DivListaEmpreend img {
      height: 320px;
      object-fit: cover; } }
  @media screen and (min-width: 1200px) {
    .DivListaEmpreend img {
      width: 94%;
      margin: 3%;
      height: 350px;
      object-fit: cover; } }
  @media screen and (min-width: 1400px) {
    .DivListaEmpreend img {
      height: 370x;
      object-fit: cover; } }

/* Estilo referente ao palavra chave*/
.DivListaEmpreend h1 {
  position: absolute;
  top: 15px;
  left: 15px;
  font-size: 1.1em;
  color: white;
  background-color: #983410;
  padding: 5px; }
  @media screen and (min-width: 1200px) {
    .DivListaEmpreend h1 {
      top: 25px;
      left: 25px; } }

.DivDetEmpreend {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap; }

.detEmpreend1 {
  width: 60%; }

/* Estilo referente ao TIPO DE IMÓVEL e FINALIDADE */
.detEmpreend1 > h2 {
  font-size: 1.1;
  font-weight: bold;
  margin-left: 10px;
  margin-top: 15px;
  display: inline-block; }
  @media screen and (min-width: 576px) {
    .detEmpreend1 > h2 {
      font-size: 1.2em; } }
  @media screen and (min-width: 768px) {
    .detEmpreend1 > h2 {
      font-size: 1.1em; } }
  @media screen and (min-width: 1200px) {
    .detEmpreend1 > h2 {
      font-size: 1.3em; } }

/* Estilo referente a CIDADE E BAIRRO do imovel */
.detEmpreend1 > h3 {
  font-size: 0.9em;
  margin-top: 10px;
  margin-left: 10px;
  display: inline-block; }
  @media screen and (min-width: 576px) {
    .detEmpreend1 > h3 {
      font-size: 1em; } }
  @media screen and (min-width: 768px) {
    .detEmpreend1 > h3 {
      font-size: 0.9em; } }
  @media screen and (min-width: 992px) {
    .detEmpreend1 > h3 {
      font-size: 1em; } }

.detEmpreend2 {
  width: 40%;
  display: flex;
  justify-content: center;
  /* Centraliza horizontalmente */
  align-items: start;
  /* Centraliza verticalmente */ }

.detEmpreend2 > a {
  font-size: 0.8em;
  color: white;
  background-color: #1D78A7;
  padding: 10px 3px;
  display: block;
  text-decoration: none;
  margin-top: 15px; }
  @media screen and (min-width: 576px) {
    .detEmpreend2 > a {
      font-size: 0.9em;
      padding: 8px 2px; } }
  @media screen and (min-width: 768px) {
    .detEmpreend2 > a {
      font-size: 0.8em;
      padding: 10px 6px; } }
  @media screen and (min-width: 1200px) {
    .detEmpreend2 > a {
      font-size: 1.2em;
      padding: 20x 10px; } }

.mainDetImoveis {
  width: 98%;
  margin: auto; }

.containerDetImoveis {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 0.7r 1fr 0.7fr 1.6fr 1fr;
  gap: 10px 10px;
  grid-template-areas: "fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel" "Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1" "Corretor Corretor Corretor Corretor Corretor Corretor Corretor Corretor Corretor" "Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2" "Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco";
  padding: 0px; }
  @media screen and (min-width: 576px) {
    .containerDetImoveis {
      grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
      grid-template-rows: 0.4fr 0.5fr 1fr;
      gap: 10px 10px;
      grid-template-areas: "fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel" "Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Corretor Corretor Corretor" "Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Fale-conosco Fale-conosco Fale-conosco" "Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Fale-conosco Fale-conosco Fale-conosco"; } }
  @media screen and (min-width: 768px) {
    .containerDetImoveis {
      grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
      grid-template-rows: 0.4fr 0.5fr 1fr;
      gap: 10px 10px;
      grid-template-areas: "fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel fotoImovel" "Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Detalhe1 Corretor Corretor" "Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Fale-conosco Fale-conosco" "Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Detalhe2 Fale-conosco Fale-conosco"; } }

.fotoImovel {
  grid-area: fotoImovel;
  display: block;
  width: 100%;
  margin-top: 10px; }

.Detalhe1 {
  grid-area: Detalhe1;
  display: block;
  border: solid 1px white;
  width: 100%;
  background-color: white; }

.Detalhe1 > h1 {
  color: black;
  font-size: 1.4em;
  font-weight: bold;
  margin: 30px 10px 20px 30px; }

.Detalhe1 > h2 {
  background-image: url(../img/figures/seta.png);
  background-repeat: no-repeat;
  background-size: 90%;
  height: 70px;
  color: white;
  font-size: 1.6em;
  line-height: 60px;
  width: 330px;
  padding-left: 20px;
  font-weight: bold; }

.Detalhe1 > p {
  color: black;
  margin: 30px 10px 10px 30px;
  line-height: 1.3em; }

.Detalhe1 > span {
  font-weight: bold; }

.DivDetalhe1 {
  width: 100%;
  text-align: center; }

.tbIcon {
  font-size: 1em;
  text-align: center;
  width: 95% !important;
  margin: auto;
  color: #1D78A7; }
  @media screen and (min-width: 576px) {
    .tbIcon {
      width: 80%; } }
  @media screen and (min-width: 768px) {
    .tbIcon {
      width: 60%; } }

.tbIcon img {
  width: 30px;
  height: 30px;
  margin-top: 5px; }
  @media screen and (min-width: 576px) {
    .tbIcon img {
      width: 35px;
      height: 35px;
      margin-top: 5px; } }

.tbIcon > td {
  min-width: 16%;
  margin: 0; }

.tbIcon > p {
  text-align: center; }

.Detalhe2 {
  grid-area: Detalhe2;
  display: block;
  margin-bottom: 10px;
  border: solid 1px white;
  width: 100%;
  background-color: white; }

.Detalhe2 h1 {
  color: black;
  font-size: 1.2em;
  font-weight: bold;
  margin: 30px 10px 20px 30px; }

.Detalhe2 > hr {
  width: 95%;
  align-items: center;
  color: gray; }

.Detalhe2 > p {
  color: black;
  margin: 5px 10px 5px 30px;
  line-height: 1.4; }

.DadoCorretor {
  grid-area: Corretor;
  display: block;
  width: 100%;
  background-color: #FDD786;
  border-radius: 20px; }

.DadoCorretor > h1 {
  font-size: 1em;
  text-align: center;
  margin: 10px;
  font-weight: bold; }

.containerCorretor {
  display: flex;
  justify-content: space-between;
  align-items: flex-start; }
  @media screen and (min-width: 576px) {
    .containerCorretor {
      flex-direction: column; } }

.paragCorretor {
  flex: 1;
  margin-right: 10px;
  margin-left: 15px;
  width: 70%; }
  @media screen and (min-width: 576px) {
    .paragCorretor {
      width: 100%; } }

.paragCorretor p {
  margin-bottom: 10px;
  font-size: 1em; }

.imgCorretor {
  width: 30%;
  flex: 1;
  margin-left: 10px;
  text-align: center; }
  @media screen and (min-width: 576px) {
    .imgCorretor {
      width: 100%; } }

.imgCorretor img {
  width: 80px; }

.Fale-conosco {
  grid-area: Fale-conosco;
  display: block;
  width: 100%; }
  @media screen and (min-width: 576px) {
    .Fale-conosco {
      margin-bottom: 10px; } }

.Fale-conosco > form {
  background-color: #FDD786;
  min-height: 250px;
  border-radius: 20px;
  padding-top: 15px; }

.Fale-conosco > form > input {
  font-size: 1em;
  height: 35px;
  width: 90%;
  border: solid 1px white;
  margin: 5px 5px 5px 15px; }
  @media screen and (min-width: 576px) {
    .Fale-conosco > form > input {
      margin: 10px; } }

.Fale-conosco > form > textarea {
  height: 100px;
  width: 90%;
  border: solid 1px white;
  margin: 5px 5px 5px 15px; }
  @media screen and (min-width: 576px) {
    .Fale-conosco > form > textarea {
      margin: 10px; } }

.Fale-conosco > form > h1 {
  font-weight: bold;
  text-align: center; }

.mainDetEmpreend {
  width: 98%;
  margin: auto; }

.contDetEmpreend {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 0.7r 1fr 0.7fr 1.6fr 1fr;
  gap: 10px 10px;
  grid-template-areas: "fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend" "DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1" "Planta Planta Planta Planta Planta Planta Planta Planta Planta" "Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco Fale-conosco";
  padding: 0px; }
  @media screen and (min-width: 768px) {
    .contDetEmpreend {
      grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
      grid-template-rows: 0.4fr 0.5fr 1fr;
      gap: 10px 10px;
      grid-template-areas: "fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend fotoEmpreend" "DetEmpreend1 DetEmpreend1 DetEmpreend1 DetEmpreend1 Planta Planta Planta Planta Planta" "Fale-conosco Fale-conosco Fale-conosco Fale-conosco Planta Planta Planta Planta Planta"; } }

.fotoEmpreend {
  grid-area: fotoEmpreend;
  display: block;
  width: 100%;
  margin-top: 10px; }

.DetEmpreend1 {
  grid-area: DetEmpreend1;
  display: block;
  border: solid 1px white;
  width: 100%;
  background-color: white; }

.DetEmpreend1 > h1 {
  color: black;
  font-size: 1.4em;
  font-weight: bold;
  margin: 30px 10px 10px 20px; }

.DetEmpreend1 > h2 {
  background-image: url(../img/figures/seta.png);
  background-repeat: no-repeat;
  background-size: 90%;
  height: 70px;
  color: white;
  font-size: 1.6em;
  line-height: 60px;
  padding-left: 20px;
  margin-left: 20px;
  font-weight: bold;
  width: 330px; }

.DetEmpreend1 > p {
  color: black;
  margin: 20px 10px 10px 20px;
  line-height: 1.3em; }

.DetEmpreend1 > span {
  font-weight: bold; }

.DivDetEmpreend1 {
  width: 100%;
  text-align: center; }

.ProjetoEmpreend {
  grid-area: Planta;
  display: block;
  width: 100%;
  border: 1px solid #1D78A7;
  border-radius: 10px;
  padding: 10px; }

.ImgProjetoEmpreend {
  width: 95%; }

.ContainerPlantas {
  display: flex;
  align-items: center;
  /* Centraliza verticalmente */ }

.detailsPlantas {
  flex: 1;
  /* Ocupa o restante do espaço disponível */ }

.detailsPlantas > h1 {
  font-weight: bold;
  font-size: 1.1em; }

.detailsPlantas > h2 {
  font-size: 1.1em;
  color: #1D78A7; }

.ImgPlantaEmpreend {
  width: 100px !important;
  margin: 10px;
  /* Espaçamento entre a imagem e os detalhes */ }

.Fale-conosco {
  grid-area: Fale-conosco;
  display: block;
  width: 100%; }
  @media screen and (min-width: 576px) {
    .Fale-conosco {
      margin-bottom: 10px; } }

.Fale-conosco > form {
  background-color: #FDD786;
  min-height: 250px;
  border-radius: 20px;
  padding-top: 15px; }

.Fale-conosco > form > input {
  font-size: 1em;
  height: 35px;
  width: 90%;
  border: solid 1px white;
  margin: 5px 5px 5px 15px; }
  @media screen and (min-width: 576px) {
    .Fale-conosco > form > input {
      margin: 10px; } }

.Fale-conosco > form > textarea {
  height: 100px;
  width: 90%;
  border: solid 1px white;
  margin: 5px 5px 5px 15px; }
  @media screen and (min-width: 576px) {
    .Fale-conosco > form > textarea {
      margin: 10px; } }

.Fale-conosco > form > h1 {
  font-weight: bold;
  text-align: center; }

.detContato {
  width: 100%;
  margin: auto;
  padding: 15px;
  display: flex;
  flex-wrap: wrap; }
  @media screen and (min-width: 768px) {
    .detContato {
      width: 70%; } }
  @media screen and (min-width: 1200px) {
    .detContato {
      width: 40%; } }

.detFale {
  width: 100%; }

.detFale h1 {
  font-size: 1.4em;
  margin: 25px 0;
  font-weight: bold;
  text-align: center; }

.cont1 {
  width: 50%; }

.cont1 > h2 {
  font-size: 1em;
  font-weight: bold;
  display: inline;
  margin-top: 15px; }
  @media screen and (min-width: 576px) {
    .cont1 > h2 {
      font-size: 1.2em; } }

.cont1 > p {
  font-size: 1em;
  margin: 5px 0; }
  @media screen and (min-width: 576px) {
    .cont1 > p {
      font-size: 1.2em; } }

.cont2 {
  width: 50%;
  display: flex;
  justify-content: left; }

.cont2 img {
  width: 80px;
  text-align: left; }

.cont3 {
  width: 50%;
  display: block; }

.cont3 > h2 {
  font-size: 1em;
  font-weight: bold;
  display: inline;
  margin-top: 10px; }
  @media screen and (min-width: 576px) {
    .cont3 > h2 {
      font-size: 1.2em; } }

.cont3 > p {
  font-size: 1em;
  margin: 5px 0; }
  @media screen and (min-width: 576px) {
    .cont3 > p {
      font-size: 1.2em; } }