
		@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
		:root{
	--main-color: #0089d1;
	--icon-color: #0089d1;
	--cor-barra-superior: #0089d1;
	--cor-botoes-barra-superior: #ffffff;
	--cor-botoes-barra-inferior: #4d5156;
	--cor-detalhes: #0089d1;
	--cor-linhas-barra-superior: #ffffff;
	--cor-campo-busca-contorno: #f7f5f5;
	--cor-barra-superior-linha-inferior: #0089d1;
	--cor-barra-superior-linha-inferior-secundaria: #0089d1;
	--cor-barra-superior-linha-inferior-terceira: #0089d1;
	--cor-barra-superior-texto: #ffffff;
	--cor-footer: #0089d1;
	--cor-footer-texto: #ffffff;
	--cor-footer-linha-superior: #0089d1;
	--cor-barra-inferior: #ffffff;

		
}
	/*CSS Base*/
:root{
	--text-color: #4d5156;
  --mobile-limit: 380px;
}
*{
	padding: 0;
	margin: 0;
	list-style-type: none;
	text-decoration: none;
	box-sizing: border-box;
	border: none;
}
#load-overlay{
  display: none;
}
html, body{
  min-height: 100vh;
	font-size: 10px;
}
i{
	font-style: normal;
}
button{
	cursor: pointer;
}
body{
  height: 100%;
  background: white;
	font-family: Roboto, Open Sans;
	font-size: 1.6rem;
	color: var(--text-color);
}
body a,
body .arrow{
	color: var(--text-color);
}
#top .install{
  display: none;
  height: 40px;
	width: 40px;
  background: none;
}
#top .install i{
  font-size: 28px; 
  line-height: 28px;
  vertical-align: middle;
  max-width: none;
}
.clear-fix::after{
	content: " ";
	clear: both;
	display: block;
}
address{
	font-style: normal;
}
img, source{
	vertical-align: middle;
	text-align: center;
}
select{
  background: none;
}
i{
  overflow: hidden;
}
.button, .btn{
	background: none;
	cursor: pointer;
	border: none;
}
.map *{
	box-sizing: initial; 
}
input,
textarea,
button,
select,
a{
	-webkit-tap-highlight-color: rgb(0, 0, 0, 0);
}
.facebook{
  color: #1877f2;
}
.instagran{
	color: #d92b70;
}
.copy-link{
  background-color: gray;
	color: white;
	border-radius: 4px;
}
.linkedin{
  color: #0077b5;
}
.whatsapp{
  color: #00bfa5;
}
.x{
  color: black;
}
.telegram{
  color: #3390ec;
}
.facebook :is(:hover, :focus, :visited){
  outline-color: #1877f2;
}
.linkedin :is(:hover, :focus, :visited){
  outline-color: #0077b5;
}
.whatsapp :is(:hover, :focus, :visited){
  outline-color: #00bfa5;
}
.twitter :is(:hover, :focus, :visited){
  outline-color: black;
}
.telegram :is(:hover, :focus, :visited){
  outline-color: #3390ec;
}
.lista{
	min-height: 200px;
}
#filtros{
  padding: 8px 0;
  display: flex;
	gap: 8px;
  flex-wrap: wrap;
}
#filtros .box.ordem{
  margin: 0 0 0 auto;
}
#filtros > span{
  width: 100%;
  display: block;
}
#filtros .box{
  overflow: hidden;
	padding: 4px 8px;
	border: 1px solid lightgray;
	border-radius: 16px;
	background: white;
}
#filtros :is(.box:hover, .box:focus-within){
	border-color: gray;
}
#filtros .box:first-child{
  margin-right: 0;
}
#filtros .box.categoria{
  width: 100%;
  display: flex;
}
#filtros .box.categoria select{
  flex: 1;
  margin-left: 4px;
}
#filtros label{
  font-size: 1.28rem;
  font-weight: bolder;
}
#filtros select{
  border: none;
  cursor: pointer;
  padding: 0;
	font-size: 1.28rem;
}
.data-skeleton{
  height: 40px;
	margin: 0;
}
.lista .capa-skeleton{
	max-width: 200px;
	max-height: 200px;
  width: 25%;
	padding-top: 25%;
  display: block;
}
.lista .info-skeleton .line-skeleton:first-child{
  margin-top: 0;
}
.lista .info.info-skeleton{
  padding: 8px;
}
.capa-skeleton{
  width: 100%;
  display: block;
  padding-top: 56.25%;
}
.line-skeleton{
  display: block;
	margin: 0;
  margin: 1.28rem;
  height: 2.26rem;
}
.center-bar .line-skeleton{
	margin: 1.28rem 0 0 0;
}
#right-bar .line-skeleton{
	margin: 1.28rem 0 0 0;
}
#right-bar .line-skeleton:first-child{
	margin: 0;
}
.line-skeleton:first-child{
	margin-top: 4px;
}
.line-skeleton:last-child{
  width: 90%;
	margin-bottom: 1.28rem;
}
.n-skeleton{
  height: 18px;
  width: 80px;
  margin: 0 auto;
  cursor: pointer;
}
.n-total-skeleton{
  height: 16px;
  width: 180px;
  margin: 4px 2px 4px auto;
  cursor: pointer;
}
.h2-line-skeleton{
  height: 2.24rem;
  margin-bottom: 8px;
	width: 100%;
}
.postagem .h2-line-skeleton{
	margin: 12px 0 0 0;
}
.offline{
	min-height: 400px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.offline div{
	max-width: 400px;
	text-align: center;
}
.offline button{
	display: inline-block;
	background: var(--main-color);
	padding: 8px;
	border-radius: 8px;
	color: var(--cor-botoes-barra-superior);
	margin: 0 auto;
	line-height: 24px;
	vertical-align: middle;
	margin-top: 16px;
}
.offline button :is(i,span){
	line-height: 24px;
	vertical-align: middle;
	display: inline-block;
	max-width: none;
	font-style: normal;
}
.offline button span{
	margin-left: 8px;
}
.offline p{
	padding: 2px;
}
#top .notification .box * {
	color: var(--text-color);
}
.notification .loader{
	margin: 0 auto;
}
#top .notification .sem-notificacao a{
	color: blue;
}
#top .notification .sem-notificacao a:hover{
	text-decoration: underline;
}
.notification .box{
  width: 280px;
	max-height: calc(100vh - 100px);
  position: absolute;
  background: white;
	color: var(--text-color);
	padding: 8px;
	border-radius: 8px;
  display: none;
  right: 0;
	top: calc(var(--top-bar-compact-height) - 4px);
	box-shadow: 0 0 4px gray;
	scrollbar-width: thin;
	overflow: auto;
	max-width: calc(100vw - 60px);
}
.notification .box h2{
	padding: 0 0 8px 0;
	font-size: 16px;
	border-bottom: 1px solid gray;
	width: 100%;
	background-color: white;
}
.notification .box .content{
	display: block;
}
.notification .box .item{
	padding: 8px 0;
	border: 1px solid lightgray;
	border-radius: 8px;
	padding: 4px;
	margin-top: 8px;
	align-items: flex-start;
	display: flex;
	flex-wrap: wrap;
}
.notification .box .date-time{
	display: block;
	width: 100%;
}
.notification .box .imagem{
	width: 100%;
	max-width: 100px;
	height: auto;
}
.notification .box .info{
	flex: 1;
	margin-left: 8px;
	padding-right: 10px;
	font-size: 12px;
	position: relative;
}
.notification .box .info .circle{
	background: red;
	width: 10px;
	height: 10px;
	position: absolute;
	border-radius: 50%;
	top: 0;
	right: 0;
}
.notification .box .circle.red{
	background: red;
}
.notification .box .circle.blue{
	background: blue;
}
.notification .box p{
	width: 100%;
	font-size: 12px;
	margin-top: 8px;
}
.notification .box .date-time{
	margin-top: 8px;
	text-align: right;
	font-size: 10px;
}
.notification,
.cart{
	position: relative;
}
.sem-notificacao{
	text-align: center;
	padding: 8px;
	font-size: 14px;
}
#btn-notification-switch:checked
~ #top .notification :is(.triangulo, .box){
	display: block;
}
#top .triangulo{
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid white;
	position: absolute;
	margin-top: -2px;
	z-index: 2;
	top: calc(var(--top-bar-compact-height) - 12px);
	right: 10px;
	display: none;
}
#top .ligacao{
	width: 28px;
	height: 20px;
	position: absolute;
	z-index: 2;
	top: calc(var(--top-bar-compact-height) - 28px);
	right: 8px;
	display:none;
}
.anunciante-msg{
	padding: 4px;
	border: 2px solid lightgray;
	border-radius: 8px;
	font-size: 1.28rem !important;
	text-align: center;
	background: white;
	max-width: 996px;
	margin: 0 0 8px 0;
}
.anunciante-msg a{
	color: blue;
}
.anunciante-msg :is(p){
	padding: 0 !important;
	line-height: 2rem !important;
	font-size: 1.28rem !important;
	margin: 0 auto;
	max-width: none !important;
}
.anunciante-msg :is(a:hover, a:focus){
	text-decoration: underline;
}
#offline-msg-content > div{
  width: 100%;
	border: 1px solid orange;
	background: white;
  padding: 4px;
  font-size: 1.28rem;
	margin: 0 0 8px 0;
	border-radius: 8px;
  text-align: center;
}
.reload{
	background: var(--main-color);
	color: white;
	padding: 4px;
	display: inline-block;
	border-radius: 4px;
}
.install{
	position: relative;
}
.install .box{
  position: absolute;
  background: white;
	min-width: 160px;
	color: var(--text-color) !important;
	padding: 8px;
	font-size: 14px;
	border-radius: 8px;
	justify-content: center;
	align-items: center;
	gap: 8px;
  right: 0;
	top: 48px;
	box-shadow: 0 0 4px gray;
	scrollbar-width: thin;
	display: flex;
}
:is(.install:hover, .install:focus-within) .box{
	display: flex !important;
}
:is(.install:hover, .install:focus-within) :is(.triangulo, .ligacao){
	display: block !important;
}
#top .install .box i{
	display: inline-block;
	width: 40px;
	height: 40px;
	font-size: 32px;
	line-height: 32px;
	border-radius: 20px;
	flex-shrink: 0;
	animation: install-animation 1s linear infinite alternate;
	border-width: 4px;
	border-style: solid;
}
@keyframes install-animation{
	0%{
		color: rgb(150, 255, 140);
		border-color: rgb(45, 211, 3);
	}
	100%{		
		color: rgb(45, 211, 3);
		border-color: rgb(150, 255, 140);
	}
}
#top .install .triangulo{
	display: block;
}
#top .install .box span{
	color: var(--text-color);
	text-align: left;
	flex-grow: 0;
	display: block;
}
#top .install .box span strong{
	color: inherit;
}
.loader{
	border: 8px solid #f3f3f3;
	border-radius: 50%;
	border-top: 8px solid gray;
	width: 40px;
	height: 40px;
	z-index: 0;
	animation: spin 2s linear infinite;
}
.icon-svg svg,
.icon-svg svg *{
	display: inline-block;
	width: 2.4rem;
	height: 2.4rem;
	stroke-width: 0;
	stroke: currentColor;
	fill: currentColor;
}
.add-to-cart.added :is(.add-text, .loading-text){
	display: none;
}
#top-bar .badge{
	display: flex;
	top: -2px;
	right: 0 ;
	font-size: 12px;
	width: 16px;
	height: 16px;
	font-weight: 400;
	justify-content: center;
	align-items: center;
	position: absolute;
	background: red;
	border-radius: 50%;
}
#top-bar .badge:empty{
	display: none;
}
.mensager .box{
  border: 1px solid lightgray;
	border-radius: 8px;
	min-height: 80px;
  padding: 8px;
  max-height: 280px;
  overflow: auto;
	margin-right: 48px;
	box-shadow: inset 0 0 4px gray;
	background-image: url('https://storage.googleapis.com/jifcom/asset/image/background_of_chat.png');
}
.mensager .box li{
	margin-top: 12px;
}
.mensager .box li:first-child{
  margin-top: 0;
}
.mensager .msg-bubble{
  padding: 8px;
	padding-bottom: 12px;
  border-radius: 8px;
  display: inline-block;
  color: black;
	min-width: 120px;
	box-shadow: 0 0 4px gray;
}
.mensager .sended-msg{
  text-align: right;
}
.mensager .box .sended-msg + .sended-msg,
.mensager .box .received-msg + .received-msg{
  margin-top: 4px;
}
.mensager .sended-msg .msg-bubble{
  background: rgb(157, 230, 157);
}
.mensager .received-msg{
  text-align: left;
}
.mensager .received-msg .msg-bubble{
  background: white;
}
.mensager .text{
	text-align: left;
}
.mensager .visualized-icon{
	margin-bottom: -12px;
	gap: 8px;
	font-size: 10px;
	display: flex;
	align-items: center;
	justify-content: right;
}
.mensager .visualized-icon i{
	font-size: 16px;
}
.mensager .done_all{
	color: blue
}
.enviar{
	background: rgb(72, 160, 189);
}
.mensager > ul > li:last-child{
	display: flex;
	gap: 8px;
	margin: 0;
}
.mensager .msg-input{
	flex: 1;
	padding: 8px;
	border-radius: 8px;
	border: 1px solid gray;
	text-align: left;
}
.mensager .msg-wrapper{
	display: flex;
	gap: 8px;
}
.mensager .imagem{
	width: 40px;
	height: 40px;
	position: relative;
	flex-shrink: 0;
}
.mensager .imagem img{
	width: 40px;
	height: 40px;
	border-radius: 50%;
}
.mensager .imagem .green-dot{
	width: 10px;
	height: 10px;
	position: absolute;
	right: 0;
	bottom: 0;
	background: rgb(37, 211, 102);
	border-radius: 50%;
}
.mensager .imagem img{
	width: 100%;
	height: 100%;
}
.mensager .usuario-data{
	margin-bottom: 8px;
}
.mensager .usuario-conectado{
	display: flex;
	gap: 10px;
}
.mensager .frm-bt{
	width: 40px;
	border-radius: 50%;
	min-width: unset;
}
:is(.cart-total, .request-total) > div{
	line-height: 2.88rem;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
:is(.cart-total, .request-total){
	display: flex;
	justify-content: space-between;
	gap: 8px;
	padding: 4px;
	border: 1px solid var(--main-color);
	border-radius: 4px;
}
:is(.cart-total, .request-total) :is(.itens-price, .itens-count){
	font-weight: bolder;
	font-size: 2.88rem;
	color: var(--main-color);
}
#srvmsg{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px;
	background: white;
	justify-content: center;
}
#srvmsg-code{
	text-align: center;
	font-size: 200px;
	display: block;

}
#srvmsg-msg{
	text-align: center;
	font-size: 20px;
	display: block;
}
.go-home{
	display: flex;
	align-items: center;
	padding: 8px;
	border-radius: 8px;
	background-color: var(--cor-detalhes);
	color: white;
	margin-top: 28px;
}
@media only screen and (max-width: 680px){
	.postagem .h2-line-skeleton{
		margin: 12px 8px 0 8px;
		width: calc(100% - 16px);
	}
	.anunciante-msg{
		margin: 8px 0;
	}
	#offline-msg-content > div{
		width: calc(100% - 16px);
		margin: 8px 8px 8px 8px !important;
	}
}
/*CSS fonts*/
.icon{
	font-family: 'icomoon';

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/roboto/v29/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.poppins-light {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: normal;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/roboto/v29/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* fallback */
@font-face {
  font-family: 'Material Icons Outlined';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialiconsoutlined/v103/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUce.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

:root{
	--top-bar-height: 108px;
	--top-bar-compact-height: 56px;
	--bottom-bar-height: 48px;
	--page-msg-height: 36px;
	--footer-height: 200px;
	--body-color: white;
	--bold-border-color: #f6f6f6;
	color-scheme: only light;
}
html{
	font-size: 10px;
	scroll-behavior: smooth;
	scroll-padding-top: 54px;
}
body{
	background: var(--body-color);
}
font{
	all: unset;
	font-size: inherit !important;
	color: inherit !important;
}
/*input fields*/
.hidden{
	display: none;
}
.skiptranslate{
	display: none !important;
	max-width: 100vw !important;
}
.skeleton{
	animation: skeleton-loading 1s linear infinite alternate;
}
.time-box{
	align-self: flex-end;
	margin-top: auto;
	padding-top: 8px;
	width: 100%;
}
.time-box span{
	font-weight: bolder;
}
.time-box .status i{
	margin-bottom: -4px;
	font-size: 20px;
}
.close-screens{
	position: absolute;
	top: 8px;
	right: 8px;
	color: gray;
	width: 40px;
	height: 40px;
	
}
.close-screens i{
	display: block;
	text-align: center;
	width: 40px;
	height: 40px;
	font-size: 32px;
	max-width: 40px;
}
@keyframes skeleton-loading{
	0%{
		background-color: rgb(243, 243, 243);
	}
	100%{		
		background-color: rgb(211, 211, 211);
	}
}
h3{
	color: #030303;
}

@keyframes spin{
	0%{transform: rotate(0deg);}
	100%{transform: rotate(360deg);}
}
.skiptranslate{
	display: none;
}
#shadow{
	position: fixed;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	background: gray;
	z-index: 4;
}
#imagem-editor{
	position: fixed;
	display: none;
	flex-direction: column;
	top: 0;
	left: 0;
	padding: 8px;
	margin: 8px;
	width: calc(100% - 16px);
	height: calc(100% - 16px);
	background: white;
	z-index: 12;
}
#imagem-editor #area-de-edicao{
	width: 100%;
	flex-grow: 1;
	background: lightgray;
	overflow: hidden;	
}
#imagem-editor #img-upload-button{
	display: none;
}
#imagem-editor #imagem-editor-editar{
	flex-grow: 1;
}
#imagem-editor .frm-bts{
	margin-top: 4px;
}
#msg{
	display: none;
	position: absolute;
	left: calc(50% - 210px);
	top: calc(50% - 80px);
	border: 2px solid gray;
	vertical-align: middle;
	background: gray;
	z-index: 5;
}
#msg ul{
	margin: 0 auto;
	max-width: 400px;
	padding: 10px 10px 0 10px;
	background: white;
}
#msg #msg-content div{
	padding: 8px;
	border: solid 2px;
	border-radius: 4px;
}
#msg #msg-content .success{
	background-color: mediumseagreen;
	border-color: green;
	color: green;
}
#msg li{
	width: 100%;
	padding: 0 0 10px 0;
}
#msg-pop-up-shadown{
	position: fixed;
	z-index: 101;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(0, 0, 0, .3);
}
#msg-pop-up{
	min-width: 100px;
	min-height: 100px;
	background: white;
	border-radius: 8px;
	margin: 8px;
	margin-top: -20px;
	padding: 8px;
	border: 1px solid gray;
}
#msg-pop-up .close{
	margin: 0 0 4px auto;
	color: var(--text-color);
	font-size: 2.24rem;
	display: block;
}
#msg-pop-up .body{
	max-width: 680px;
}
#msg-pop-up .body .texto{
	padding: 8px 0;
	margin-top: 8px;
}
#msg-pop-up .body a{
	border: 1px solid lightgray;
	padding: 4px;
	display: block;
	margin-top: 8px;
}
#msg-pop-up .body .titulo{
	padding: 8px 0;
	text-align: center;
	font-weight: bolder;
	font-size: 1.92rem;
}
#msg-pop-up img{
	width: 100%;
	height: auto;
}
/*left menu*/
.switch{
	display: none;
}
#wrapper .fullscreen{
	display: none !important;
}
#fullscree-switch:checked ~ #wrapper .fullscreen{
	display: block;
}
#fullscree-switch:checked ~ #wrapper .screen{
	display: none;
}
/*editor imagem switch */
#image-editor-switch:checked ~ #imagem-editor{
	display: flex;
}
#image-editor-switch:checked ~ #shadow{
	display: block;
}
/*left menu switch*/
#menu-switch:checked ~ #wrapper #left-bar{
	display: block;
	width: 200px;
}
#menu-switch:checked ~ :is(#top, #bottom-bar) .left-bar-menu-button .horizontal {
	transition: all 0.3s;
	opacity: 0;
}
#menu-switch:checked ~ :is(#top, #bottom-bar) .left-bar-menu-button .diagonal.part-1 {
	transition: all 0.3s;
	transform: rotate(135deg);
	margin-top: 7px;
}
#menu-switch:checked ~ :is(#top, #bottom-bar) .left-bar-menu-button .diagonal.part-2 {
	transition: all 0.3s;
	transform: rotate(-135deg);
	margin-top: -11px;
}
/* left menu banckground switch */
#shadow-switch:checked ~ #shadow{
	display: block;
}
#container{
	display: flex;
}
.imagem img{
	max-width: 100%;
	height: auto;
}
.v-list .perfil .imagem img{
	max-width: 200px;
	border-radius: 8px;
}
#page-msg{
	text-align: center;
	position: fixed;
	padding: 0.8rem;
	height: 36px;
	width: 100%;
	z-index: 12;
	overflow-y: auto;
	background: white;
}
#page-msg :is(span, i) {
	display: inline-block;
	vertical-align: middle;
	line-height: 1.6rem;
	font-size: 1.28rem;
	color: orangered;
	font-weight: bolder;
}
#page-msg i{
	font-size: 1.92rem;
	color: orange;
}
#page-msg ~ #top{
	top: 36px;
}
#page-msg ~ #wrapper{
	padding-top: calc(var(--top-bar-height) + 12px + var(--page-msg-height));

}
.botoes-redes-sociais > span{
	width: 100%;
	display: inline-block;
}
.botoes-redes-sociais div{
	display: flex;
	justify-content: center;
	padding: 4px 0;
	gap: 10px;
}
.data-skeleton{
	margin-bottom: 10px;
	display: block;
	width: 100%;
	height: 40px;
}
#filtros .data-skeleton{
	margin: 0;
}
:is(#publicacao, #pagina) .capa-skeleton{
	margin-top: 8px;
}
#perfil .capa-skeleton{
  width: 255px;
  height: 320px;
  padding-top: 0;
	border-radius: 8px;
}
#anuncio .capa-skeleton{
  width: 332px;
  height: 332px;
  padding-top: 0;
}
.line-skeleton.path{
	margin: 0;
	height: 22px;
}
.h2-line-skeleton{
	margin: 12px 0 0 0;
}
#dados .h2-line-skeleton{
	height: 2.4rem;
}
@media only screen and (max-width: 480px){
	.line-skeleton.path{
		margin: 0 8px;
	}
	#wrapper #left-bar{
		display: flex !important;
		width: 100vw !important;
		left: calc(-100vw - 4px);
		transition: left .5s;
		padding: 16px 8px;
	}
	#menu-switch:checked ~ #wrapper #left-bar{		
		left: 0;
	}
	#perfil .capa-skeleton{
		margin: 0 auto;
	}
	#anuncio .capa-skeleton{
		width: 100%;
		padding: 100%;
		padding-top: 0;
	}
}
/*Top css*/
#top{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 4px 0 3px 0;
	max-height: var(--top-bar-height);
	display: flex;
	background: var(--cor-barra-superior);
	border-bottom: 1px solid var(--cor-barra-superior-linha-inferior);
	z-index: 10;
	overflow: visible;
}
#top * {
	color: var(--cor-botoes-barra-superior);
}
#top .arrow i{
	display: block;
	margin-left: -4px;
}
.gtranslate_wrapper{
	display: flex;
	width: 22px;
	height: 40px;
	margin-left: 4px;
	overflow: hidden;
	flex-wrap: wrap;
	align-items: center;
}
.gtranslate_wrapper a {
	width: 22px;
	height: 20px;
}
.gtranslate_wrapper a.glink img{
	width: 20px;
	height: 20px;
	margin: -4px 0;
}
#top-bar-container{
	margin: 0 auto;
	padding: 0 8px;
	display: flex;
	width: 100%;
	max-width: 1232px;
}
#top-box{
	flex: 1;
	margin-left: 20px;
}
#top-bar{
	border-bottom: 1px solid var(--cor-linhas-barra-superior);
	padding: 4px 0 8px 0;
	display: flex;
	position: relative;
}
/*Left bar button*/
.left-bar-menu-button{
	display: none;
	height: 40px;
	width: 24px;
	min-width: 24px;
	margin-right: 8px;
	cursor: pointer;
	padding: 10px 0px 10px 0px;
	transition: 0.3s;
	background: none;
}
.left-bar-menu-button .spinner {
	display: block;
	transition: all 0.3s;
	height: 4px;
	width: 100%;
	background-color: var(--cor-botoes-barra-superior);
	border-radius: 2px;
}
.left-bar-menu-button .horizontal {
	transition: all 0.3s;
	float: left;
	margin-top: 3px;
}
.left-bar-menu-button .diagonal.part-1 {
	transition: all 0.3s;
	float: left;
}
.left-bar-menu-button .diagonal.part-2 {
	transition: all 0.3s;
	position: relative;
	float: left;
	margin-top: 3px;
}
.notification button,
.cart .btn{
	display: flex;
	justify-content: center;
	align-items: center;
	background: none;	
	position: relative;
	width: 40px;
	height: 40px;
}
/*boxs*/
#logo-container{
	width: 200px;
	height: 100px;
	display: block;
	min-width: 40px;
	overflow: hidden;	
}
.logo-container img{
	max-width: 100%;
	max-height: 100%;
}
#search-box{
	display: flex;
	flex: 1;
	max-width: 1024px;
	min-width: 38px;
	justify-content: flex-end;
	overflow: hidden;
}
#search-box label{
	display: none;
}
#search-box form{
	padding: 7px 8px 7px 16px;	
	overflow: hidden;
	flex: 1;
	max-width: 680px;
	background: white;
	border-radius: 20px;
	display: flex;
	margin: 0 auto 0 0;
	border: 1px solid var(--cor-campo-busca-contorno);
}
#search-box .texto{
	display: block;
	height: 24px;
	min-width: 38px;
	color: var(--text-color);
	font-size: 16px;
	outline: none;
	width: 100%;
}
#search-box .pesquisar{
	width: 24px;
	height: 24px;
	border-radius: 20px;
	background: white;
	color: var(--text-color);
}
#search-box .pesquisar:focus{
	outline: 1px dotted var(--main-color);
}
#top-buttons{
	height: 40px;
	width: 40px;
	position: absolute;
	right: 0;
	top: 10px;
	float: right;
	cursor: pointer;
	text-align: right;
}
#top-buttons a{
	display: inline-block;
}
#top-buttons i{
	color: white;
	font-size: 28px;
	line-height: 40px;
	vertical-align: middle;
}
#top nav{
	display: block;
	padding-top: 15px;
	align-self: center;
	width: 100%;
	max-width: 996px;
	overflow: visible;
	
}
#top #top-menu ul {
	padding: 2px 2px 8px 2px;
	background: var(--cor-barra-superior);
	height: 0;
	display: none;
}
#top #top-menu .selected ul {
	background: white;
}
#top #top-menu .selected ul :is(i, svg, svg *) {
	color: var(--text-color);
	fill: var(--text-color);
}
#top nav a{
	display: flex;
	align-items: center;
}
#top nav a:first-child{
	padding-left: 0
}
#top nav :is(span, .arrow){
	line-height: 1.6rem;
	vertical-align: middle;
	margin-left: 2px;
	padding-top: 2px;
	padding-bottom: 2px;
	color: var(--cor-barra-superior-texto);
	font-size: 1.28rem;
}
#top nav a *{
	color: var(--cor-barra-superior-texto);
	fill: var(--cor-barra-superior-texto);
}
#top nav a :is(.material-icons, .icon-svg){
	font-size: 22px;
	line-height: 22px;
	vertical-align: middle;
	height: 22px;
	min-width: 25px;
}
#top nav #top-menu > :is(.active){
	border-color: var(--cor-barra-superior-linha-inferior);
	border-bottom: 0;
	background-color:  var(--body-color);
	text-decoration: none;
	border-radius: 8px 8px 0 0;
}
#top #top-menu :is(.active, .selected > .line){
	border-color: var(--cor-barra-superior-linha-inferior);
	border-bottom: white;
	background-color: white;
}
#top #top-menu .opened{
	background: var(--cor-barra-superior);
}
#top #top-menu ul :is(.active, .selected) :is(i, svg, svg *){
	color: var(--icon-color);
	fill: var(--icon-color);
}
#top #top-menu ul :is(.active, .selected) span{
	color: black;
}
#top nav :is(.active) :is(i, svg),
#top nav :is(.active) :is(i, svg) * {
	color: var(--icon-color);
	fill: var(--icon-color);
}
#top nav :is(.active, .selected) span{
	color: black;
}
#top #top-menu a:hover span{
	text-decoration: underline;
}
#top nav :is(.active, .selected > .line) :is(button, i, svg, svg *){
	color: var(--icon-color);
	fill: var(--icon-color);
}
#top nav li:first-child{
	margin-left: 0;
}
#logo-fino{
	display: none;
}
#logo{
	width: 200px;
}
#logo-pequeno{
	display: none;
	height: 40px;
}
#top.sticky{
	position: fixed;
	top: 0;
	height: 57px;
	padding: 8px 0;
	box-shadow: 0 1px 4px 0 rgb(32 33 36 / 28%);
	border-color: var(--cor-barra-superior-linha-inferior-secundaria);
}
#top.sticky #logo-fino{
	display: block;
}
#top.sticky #logo{
	display: none;
}
#top.sticky nav{
	display: none;
}
#top.sticky #line{
	display: none;
}
#top.sticky #top-bar{
	padding: 0;
	border: 0;
}
#top.sticky #logo-container{
	height: 40px;
}
#logo-border.sticky{
	border-radius: 0 0 8px 0;
}
#search-box .switch-button{
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: var(--cor-botoes-barra-superior);
	margin: 0 0 0 0;
	display: none;
}
.login{
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.login a{
	width: 30px;
	height: 30px;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}
.login a img{
	width: 100%;
	height: 100%;
}
.login a i{
	display: block;
	width: 30px;
	height: 30px;
	font-size: 30px;
	max-width: unset;
}
#top-menu{
	max-width: 100%;
	display: flex;
	align-items: flex-start;
	height: 32px;
}
#top-menu ul{
	overflow: hidden;
	display: none;
	height: 0px;
	width: 100%;
	background-color: white;
	border-radius: 0 0 8px 8px;
	border: 1px solid var(--cor-barra-superior-linha-inferior);
	border-top: 0;
}
#top nav li .option:last-child .line{
	border-bottom: 0;
}
#top-menu ul li .line{
	border-bottom: 0;
	display: flex;
	gap: 4px;
	align-items: center;
	border-radius: 4px;
}
#top-menu ul li{
	padding: 0;
}
#top-menu .switch .btn{
	padding-right: 4px;
}
#top #top-menu > .sub-menu{
	display: inline;
	width: 150px;
}
#top #top-menu > .option{
	display: inline-block;
	width: fit-content;
}
#top #top-menu *{
	transition: none !important;
}
#top-menu > li > .line{
	border: 1px solid transparent;
	border-bottom: none;
	border-radius: 8px 8px 0 0;
	padding: 0 6px 0 6px;
	overflow: hidden;
	width: unset;
	display: flex;
	height: 36px
}
#top-menu a{
	color: gray;
	display: block;
	width: 100%;
	float: left;
}
#top-menu .short{
	width: calc(100% - 34px);
}
#top-menu .shortcut{
	padding: 0px !important;
	display: block;
	margin-top: 4px;
	width: 26px;
	height: 26px;
	float: left;
}
#top-menu .material-icons{
	display: inline-block;
	vertical-align: middle;
}
#top-menu .titulo{
	vertical-align: middle;
	display: inline-block;
	margin-left: 4px;
}
.menu-compacto .option .titulo{
	width: 72px
}
.menu-compacto  .switch .titulo{
	width: 80px
}
#top-menu .option a,
#top-menu .sub-menu a{
	padding: 4px 0 4px 0px;
}
#top-menu a .arrow{
	display: block;
	float: right;
	margin: 0px 14px 0px 0px;
	background: none;
	cursor: pointer;
}
#top-menu a .arrow:hover{
	color: black;
}
#top-menu a:hover, .active a:first-child *{
	color: black;
}
/*When under 600px*/
@media only screen and (max-width: 1240px){
	#top-bar-container{
		max-width: 916px;
	}
	#logo-container{
		width: auto;
	}
	#box{
		margin-left: 8px;
		flex: 1;
	}
	#top-box{
		flex: 1;
		padding: 0;
		margin-left: 8px;
	}
	#top-bar{
		padding: 0;
		border: 0;
	}
	#logo-container{
		height: 40px;
	}
	#top-box form{
		margin: 0;
	}
	#top nav,
	#line{
		display: none;
	}
	#top{
		padding: 8px 0;
		border-bottom: 1px solid var(--cor-barra-superior-linha-inferior-terceira);
	}
	#logo-border{
		display: none;
	}
	#logo{
		display: none;
	}
  #logo-fino{
		display: block;
	}
}
@media only screen and (max-width: 1156px){
	#top-bar-container{
		max-width: 916px;
	}
	.left-bar-menu-button{
		display: block;
	}
}
@media only screen and (max-width: 1009px){
	#top-buttons{
		margin-left: 8px;
		position: unset;
	}
}
@media only screen and (max-width: 580px){
	#search-box form{
		display: none;
	}
	#search-box .switch-button{
		display: block;
	}
	#search-bar-switch:checked ~ #top #search-box form{
		display: flex;
	}
	#search-bar-switch:checked ~ #top #search-box .switch-button{
		display: none;
	}
	#search-bar-switch:checked ~ #top :is(.cart, .notification, .install){
		display: none !important;
	}
	#search-bar-switch:checked ~ #top #logo-pequeno{
		display: block;
	}
	#search-bar-switch:checked ~ #top #logo-fino{
		display: none;
	}
}
@media only screen and (max-width: 480px){
	#logo-pequeno{
		display: block;
	}
	#logo-fino{
		display: none;
	}
	.has-space #logo-fino{
		display: block;
	}
	.has-space #logo-pequeno{
		display: none;
	}
	#top .left-bar-menu-button{
		display: none;
	}
	#logo-container{
		margin-left: 0;
		width: 200px;
	}
	#search-bar-switch:checked ~ #top #logo-container{
		width: auto;
	}
}
@media only screen and (max-width: 440px){
	#logo-container{
		margin-left: 0;
	}
}
/*CSS Left*/
#left-bar{
	max-height: calc(100vh - var(--top-bar-height) - 22px);
	width: 206px;
	min-width: 206px;
	overflow-x: hidden;
	overflow-y: hidden;
	font-size: 16px;
	scrollbar-width: thin;
	z-index: 8;
	transition: width 0.3s;
}
#left-bar .close-screens{
	display: none;
}
#left-bar:hover, #left-bar:focus{
	overflow-y: auto;
}
#left-bar{
  scrollbar-width: thin;
  scrollbar-color: gray lightgray;
}
#left-bar::-webkit-scrollbar {
  width: 5px;
	border-radius: 4px;
}

#left-bar::-webkit-scrollbar-track {
  background: lightgray;
	border-radius: 8px;
}

#left-bar::-webkit-scrollbar-thumb {
  background-color: gray;
  border-radius: 20px;
}
#page-msg ~ #wrapper #left-bar{
	max-height: calc(100vh - var(--top-bar-height) - var(--page-msg-height));
}
#page-msg ~ #wrapper #left-bar.sticky{
	max-height: calc(100vh - var(--top-bar-compact-height) - var(--page-msg-height));
}
#left-menu{
	width: 200px;
	min-width: 200px;
	margin-top: -4px;
	padding: 0;
}
#left-menu * {
	outline: none;
}
#left-menu > :is(.option, .sub-menu){
	padding: 2px 0px;
}
#left-menu span{
	display: inline-block;
	display: flex;
	align-items: center;
	white-space: normal;
	vertical-align: middle;
}
#left-menu .trace{
	height: 1px;
	margin: 8px 4px;
	background-color: lightgray;
}
#left-menu ul{
	overflow: hidden;
	display: none;
	height: 0px;
	width: 100%;
	padding-left: 8px;
}
#left-menu .line{
	display: flex;
	width: 100%;
	align-items: stretch;
	margin: 2px 0;
}
#left-menu .hidden{
	display: none;
}
#left-menu a{
	display: flex;
	width: 100%;
	height: 100%;
	padding: 2px 2px 2px 4px;
	align-items: center;
}
#left-menu a::before{
	content: "";
	background-color: white;
	height: 28px;
	width: 4px;
	margin-right: 4px;
}
#left-menu .line.active a::before{
	background-color: var(--cor-detalhes);
}
#left-menu i{
	width: 2.4rem;
	height: 2.4rem;
	line-height: 2.4rem;
	margin-right: 4px;
}

#left-menu i.compact{
	margin: 0 2px 0 2px;
}
#left-menu .line.active i{
	border-left-color: var(--icon-color);
}
#left-menu :is(.line:hover, .line:focus-within, .line.active) .titulo{
	color: black;
}
#left-menu .line:hover .dot{
	color: black;
}
#left-menu :is(.line:hover, .line:focus-within, .line.active) :is(.icon-svg i,.icon-svg svg, .icon-svg path, .material-icons, .icon){
	color: var(--icon-color);
	fill: var(--icon-color);;
}
#left-menu .short{
	width: calc(100% - 34px);
}
#left-menu .shortcut{
	padding: 0px !important;
	display: block;
	margin-top: 4px;
	width: 26px;
	height: 26px;
}
#left-menu .material-icons{
	display: inline-block;
	vertical-align: middle;
}
#left-menu .titulo{
	vertical-align: middle;
	list-style: none;
	flex: 1;
	font-size: 1.4rem;
}
#left-menu .subnivel-space{
	width: 8px;
}
#left-menu .arrow{
	margin: auto 0 auto 2px;
	display: block;
	line-height: 1.28rem;
	width: 2.4rem;
	height: 2.4rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
#left-menu .dot{
	width: 8px;
	color: lightgrey;
}
#left-menu .arrow i{
	display: block;
	margin: 0;
}
#left-menu .page .arrow{
	border-width: 0;
	margin-left: 1px;
}
#left-menu :is(.arrow:focus, .arrow:hover) i{
	color: var(--icon-color);
}
#left-bar.sticky{
	position: -webkit-sticky;
	position: sticky;
	top: calc(var(--top-bar-compact-height) + 12px);
}
#page-msg ~ #wrapper #left-bar.sticky{
	top: calc(var(--top-bar-compact-height) + 8px + var(--page-msg-height));
}
#left-bar.sticky .hidden{
	display: block;
}
/*When under 600px*/
@media only screen and (max-width: 1156px){
	#left-menu{
		padding: 0 8px 8px 8px;
	}
	#page-msg ~ #wrapper #left-bar.sticky{
		top: calc(var(--top-bar-compact-height) + var(--page-msg-height));
	}
	#left-bar, #left-bar.sticky{
		position: fixed;
		box-shadow: 0 0 4px gray;
		background: white;
		left: 0;
		width: 0;
		min-width: 0;
		top: var(--top-bar-compact-height);
		bottom: 0;
		padding-top: 8px;
		padding-bottom: 8px;
		max-height: calc(100vh - var(--top-bar-compact-height));
	}
	#page-msg ~ #wrapper #left-bar {
    top: calc(var(--top-bar-compact-height) + var(--page-msg-height));
		max-height: calc(100vh - var(--top-bar-compact-height) - var(--page-msg-height))
	}
	#left-bar .hidden{	
		display: block;
	}
}
@media only screen and (max-width: 480px){
	#left-bar .close-screens{
		display: block;
	}
	#left-menu{
		width: 280px;
		min-width: 280px;
		overflow-y: auto;
	}
	#left-menu .arrow{
		margin-left: 4px;
	}
	#menu-switch:checked ~ #bottom-bar .left-bar-menu-button .spinner{
		background-color: var(--icon-color);
	}
	.lista .total-resultados{
		margin-right: 6px;
	}
	#left-menu .titulo{
		font-size: 1.8rem;
	}
	#left-bar, #left-bar.sticky{
		max-height: calc(100vh - var(--top-bar-compact-height) - var(--bottom-bar-height));
		display: flex;
		justify-content: center;
		background-color: white;
	}
	#page-msg ~ #wrapper #left-bar{
		max-height: calc(100vh - var(--top-bar-compact-height) - var(--bottom-bar-height) - var(--page-msg-height));
	}
	#left-menu a::before{
		height: 3.2rem;
	}
	#left-menu a > i{
		width: 2.8rem;
		height: 2.8rem;
		line-height: 2.8rem;
		font-size: 2.8rem;
		min-width: 2.8rem;
		margin-right: 8px;
	}
	#left-menu a{
		padding: 5px 2px 5px 4px;
	}
	#left-menu > :is(.option, .sub-menu){
		padding: 0;
	}
	#left-bar .icon-svg svg, #left-bar .icon-svg svg *, #left-bar .icon-svg{
		width: 2.8rem;
		height: 2.8rem;
	}
}
/*CSS Container*/
#wrapper{
	margin: 0 auto;
	max-width: 1232px;
	display: flex;
	align-items: flex-start;
	min-height: calc(100vh - var(--footer-height));
	padding: calc(var(--top-bar-height) + 12px) 8px 8px 8px;
}
#content{
	max-width: 1024px;
	min-height: 400px;
	width: 100%;
	margin-left: 12px;
}
#content .post-body{
	background-color: white;
}
#content .post-body > :is(h1, h2, h3){
	padding-left: 0px;
	padding-right: 4px;
}
#restricao{
	padding: 8px;
	border: 2px solid orange;
	border-radius: 8px;
  font-weight: bolder;
	margin: 10px 0;
	text-align: center;
}
#restricao .warning{
	color: orange;
	font-size: 2.88rem;
	line-height: 3.2rem;
	display: inline;
	border-radius: .32rem;
}
#restricao > *{
	line-height: 1.92rem;
	font-size: 1.28rem;
	vertical-align: middle;
}
#path{
	line-height: 1.6rem;
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	margin: 0 0 8px 0;
}
#path * {
	line-height: 1.6rem;
	display: inline-block;
	vertical-align: middle;
}
#path .caminho{
	display: inline-block;
	vertical-align: middle;
	font-size: 1.28rem;
	padding: 2px 4px;
	border: 1px solid lightgray;
	background: white;
	border-radius: 10px;
}
#path .caminho:last-child{
	display: flex;
	overflow: hidden;
	flex: 1;
	min-width: 80px;
	max-width: fit-content;
}
#path .caminho:last-child i{
	flex-shrink: 0;	
}
#path .caminho:last-child span{
	white-space: nowrap;
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
}
#path .home{
	font-size: 1.92rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
#path .caminho span{
	margin-top: 2px;
}
#path .caminho i{
	margin: 0 2px;
}
#path .caminho :is(.material-icons, .icon-svg){
	font-size: 1.6rem;
	align-items: center;
}
#path .caminho i svg{
	width: 1.6rem;
	height: 1.6rem;
}
#path .seta{
	padding: 0 2px;
	display: flex;
	align-items: center;
}
#path :is(.caminho:hover, .caminho:focus){
	color: black;
	border: solid 1px gray;
	
}
#path :is(.caminho:hover, .caminho:focus) :is(svg, i){
	fill: var(--icon-color);
	color: var(--icon-color);
}
#path :is(.home:hover, .home:focus){
	color: var(--icon-color);
	text-decoration: none;
}
#path .caminho:focus{
	outline: 1px dotted var(--main-color);
}
.center-bar{
	float: left;
	max-width: 680px;
	width: 100%;
	padding: 0 0 8px 0;
}
#content .v-list li{
	padding: 8px 0;
}
#content .comments{
	margin: 10px 0 0 0;
	border-top: 1px solid lightgray;
  padding-top: 20px;
}
.status-opened{
	color: green;
	font-weight: bolder;
}
.status-closed{
	color: rgb(225, 16, 16);
	font-weight: bolder;
}
.tag-list .emoticon{
	vertical-align: middle;
}
.tag-list li{
	display: flex;
	gap: 8px;
}
.tag-list li{
	border-left: 4px solid var(--cor-detalhes);
	margin: 2px 0;
}
.tag-list *{
	align-items: center;
}
.tag-list .tags{
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}
.tag-list .tag-wrapper{
	display: flex;
	justify-content: space-between;
	border: 1px solid lightgray;
	border-radius: 100px;
	vertical-align: center;
	padding-left: 8px;
	gap: 4px;
}
.tag-list .group-wrapper{
	padding: 4px;
	display: flex;
	align-items: center;
}
.tag-list .tag-wrapper .search-btn{
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background-color: #f2f2f2;
	padding: 4px;
	color: black;
	width: 24px;
	height: 24px;
}
.tag-list .tag-wrapper i{
	font-size: 1.6rem;
}
/*When under 600px*/
@media only screen and (max-width: 1240px){
	#content{
		max-width: 680px;
		margin: 0 auto;
	}
	#content, .anunciante-msg{
		max-width: 680px;
		margin: 0 auto 8px auto;
	}
	#wrapper{
		max-width: 916px;
		padding-top: calc(var(--top-bar-compact-height) + 8px);
	}
	#right-bar{
		width: 100%;
		margin: 40px 0 0 0;
		max-width: 100%;
    float: left;
	}
	.center-bar{
		width: 100%;
		margin: 0 auto;
	}
	#page-msg ~ #wrapper{
		padding-top: calc(var(--top-bar-compact-height) + 12px + var(--page-msg-height));
	}
}
@media only screen and (max-width: 900px){
	#content, .anunciante-msg{
		max-width: none;
	}
	#content{
		margin: 0;
	}
	.center-bar{
		max-width: none;
	}
}
@media only screen and (max-width: 480px){
	#content{
		background: var(--bold-border-color);
	}
	#content{
		overflow-x: hidden;
	}
	#content .post-body > :is(p, h1, h2, h3){
		padding-left: 8px;
	}
	#content .comments{
		margin: 10px 8px 0 8px;
		border-top: 1px solid lightgray;
		padding-top: 20px;
	}
	.anunciante-msg{
		margin: 0 8px 8px 8px;
	}
	.center-bar{
		padding-bottom: 0;
		margin-bottom: 8px;
	}
	#wrapper{
		max-width: 680px;
		padding: calc(var(--top-bar-compact-height) + 8px) 0 0 0;
		background: var(--bold-border-color);
	}
	#page-msg ~ #wrapper{
		padding-top: calc(var(--top-bar-compact-height) + var(--page-msg-height) + 12px);
	}
	#path{
		margin: 0 8px;
	}
	.dados{
		margin: 0 8px;
	}
	.dados-wrapper > *{
		padding: 0 !important;
	}
	#right-bar{
		padding: 8px;
	}
	#content{
		margin: 0;
	}
	.proprietario-nome{
		justify-content: left !important;
	}
}
#right-bar{
  width: 320px;
  float: right;
  max-width: calc(100% - 696px - 8px);
  padding: 8px 8px 8px 8px;
  border: 1px solid lightgray;
  margin: 0px 0px 0px 8px;
}
.contacts-wrapper .close-screens{
	display: none;
}
#right-bar .v-list{
	margin-top: 20px;
}
#right-bar .v-list:first-child{
	margin-top: 0px;
}
#right-bar :is(a, .a-skeleton){
  max-width: 100%;
  width: 328px;
}
#right-bar :is(h2, .h2-skeleton):first-child{
  padding-top: 0;
}
#right-bar a:hover .descricao{
  color: black;
}
.fixed.bt-show-contacts{
	position: fixed;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	bottom: 20px;
	right: 20px;
	z-index: 9;
	background: white;
	align-items: center;
	padding: 4px;
	gap: 8px;
	width: 48px;
	height: 48px;
	border-radius: 28px;
	box-shadow: 1px 1px 4px gray;
	border-top-left-radius: 28px;
	transition: border-top-left-radius 0s ease .2s;
	color: var(--icon-color);
	fill: var(--icon-color);
}
.fixed.bt-show-contacts *{
	color: var(--icon-color);
}
#contact-switch:checked ~ #wrapper .fixed.bt-show-contacts{
	border-top-left-radius: 0;
	transition: border-top-left-radius 0s ease 0s;
}
.fixed.bt-show-contacts:hover{
	border-color: var(--icon-color);
}
.contacts-wrapper{
	position: fixed;
	bottom: 62px;
	right: 62px;
	background: white;
	z-index: 8;
	box-shadow: 0 0 4px gray;
	border-radius: 24px 24px 0 24px;
	overflow: hidden;
	transition: max-width .2s, max-height .2s;
	overflow-y: auto;
	overscroll-behavior: none;
	scrollbar-width: thin;
	max-width: 0;
	max-height: 0;
	animation: hide-scroll .2s backwards;
}
#contact-switch:checked ~ #wrapper .contacts-wrapper{
	max-width: 100vw;
	max-height: calc(100vh - var(--top-bar-compact-height) - 76px);
	animation: hide-scroll2 .2s backwards;
}
@keyframes hide-scroll {
	from, to {overflow: hidden}
}
@keyframes hide-scroll2 {
	from, to {overflow: hidden}
}
.contacts-wrapper address{
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 16px 8px;
	gap: 18px;
	max-width: 380px;
}
.contacts-wrapper address > div{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.contacts-wrapper .title{
	text-align: left;
	font-weight: bolder;
}
.contacts-wrapper .descricao{
	font-size: 1.4rem;
	display: inline-block;
	overflow: hidden;
}

.bt-show-contacts{
	display: flex;
	align-items: center;
	justify-content: center;
}
.bt-show-contacts .icon-svg{
	line-height: 34px;
	max-width: 34px;
	width: 34px;
	height: 34px;
	display: block;
}
.bt-show-contacts .icon-svg :is(svg, svg *){
	width: 34px;
	height: 34px;
	line-height: 34px;
}
.bt-show-contacts .btn.open{
	display: block !important;
	align-self: center;
}
.bt-show-contacts .btn.close{
	display: none !important;
}
#contact-switch:checked ~ :is(#bottom-bar, #wrapper) .bt-show-contacts .btn.close{
	display: inline-block !important;
}
#contact-switch:checked ~ :is(#bottom-bar, #wrapper) .bt-show-contacts .btn.open{
	display: none !important; 
}
.contacts-wrapper .btn{
	height: 40px;
	background: none;
}
.contacts-wrapper .icon-svg svg{
	color: var(--icon-color);
	width: 30px;
	height:30px;
	max-width: 30px;
	display: block;
}
.contacts-wrapper i{
	color: gray;
	text-align: center;
	width: 40px;
	height: 40px;
	font-size: 32px;
	max-width: 40px;
	font-style: normal;
	font-weight: lighter;
	line-height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.contacts-wrapper a{
	border-radius: 20px;
	overflow: hidden;
	display: flex;
	border: 1px solid lightgray;
	padding: 2px;
}
.contacts-wrapper :is(a:hover, a:focus){
	color: var(--cor-detalhes);
}
.contacts-wrapper a .info{
	padding: 0 8px;
	display: flex;
	align-items: center;
}
.contacts-wrapper img{
	width: 32px;
	height: 32px;
	border-radius: 16px;
}
@media only screen and (max-width: 1240px){
  #right-bar{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px 0 0 0;
    max-width: 680px;
    width: 100%;
  }
  #right-bar :is(a, .a-skeleton){
    width: 320px;
  }
  #right-bar a.anuncio{
    width: 208px;
  }
  #right-bar h2{
    width: 100%;
  }
}
@media only screen and (max-width: 900px){
  #right-bar{
    max-width: none;
  }
  #right-bar a.anuncio{
    width: 216px;
  }
}
@media only screen and (max-width: 480px){
	.contacts-wrapper .close-screens{
		display: block;
	}
  #right-bar .v-list:first-child{
    margin-bottom: 0;
  }
  #right-bar{
    border: 0;
    padding: 0;
    margin: 12px 0 8px 0;
    background-color: var(--bold-border-color);
  }
  #right-bar a{
    width: 100%;
  }
  .contacts-wrapper{
	position: fixed;
	display: flex;
	padding: 0;
	bottom: var(--bottom-bar-height);
	top: var(--top-bar-compact-height);
	right: calc(-100vw - 4px);
	width: 100vw;
	background: white;
	align-items: center;
	transition: right .5s;
	justify-content: center;
	overflow: hidden;
	border-radius: 0;
	max-height: unset;
	max-width: unset;
	}
 	#contact-switch:checked ~ #wrapper .contacts-wrapper{
		right: 0;
		max-width: unset;
    	max-height: unset;
  	}
	.fixed.bt-show-contacts{
		display: none;
	}
	.contacts-wrapper .title{
		font-size: 1.6rem;
	}
	.contacts-wrapper address{
		min-width: 100vw;
		height: 100%;
	}
	.contacts-wrapper .contato-titulo{
		font-size: 1.4rem;
		width: 100%;
	}
	.bt-show-contacts .btn{
		width: 24px;
		height: 24px;
	}
	.bt-show-contacts  .btn.open{
		display: inline-block !important;
	}
	.bt-show-contacts  button .icon-svg svg{
		width: 24px;
		height: 24px;
		max-width: 24px;
	}
	.bt-show-contacts button i{
		color: gray;
		text-align: center;
		width: 24px;
		height: 24px;
		font-size: 24px;
		max-width: 24px;
		font-style: normal;
		font-weight: lighter;
		line-height: 24px;
		font-weight: bolder;
		display: block;
		color: var(--cor-botoes-barra-inferior);
	}
	.bt-show-contacts{
		display: block;
	}
	.bt-show-contacts .icon-svg{
		width: 24px;
		height: 24px;
		margin: 0 auto;
	}
}
/*CSS Bottom*/
#menu-switch:checked ~ #bottom-bar .wrapper-menu,
#contact-switch:checked ~ #bottom-bar .wrapper-contato,
#search-bar-switch:checked ~ #bottom-bar .wrapper-pesquisa,
#ai-chat-switch:checked ~ #bottom-bar .wrapper-ai-chat{
	border-bottom: 4px solid var(--cor-detalhes);
	border-bottom-color: var(--cor-detalhes);
}
:is(#menu-switch:checked, #contact-switch:checked, #search-bar-switch:checked, #ai-chat-switch:checked) ~ #bottom-bar .wrapper-home{
	border-bottom-color: transparent;
}
#bottom-bar{
	position: fixed;
	bottom: 0;
	width: 100%;
	height: var(--bottom-bar-height);
	z-index: 10;
	display: none;
	justify-content: space-between;
	background: var(--cor-barra-inferior);
	border-top: 1px solid gray;
	padding: 0 10px 0 10px;
	align-items: center;
}
#bottom-bar *{
	color: var(--cor-botoes-barra-inferior);
}
#bottom-bar .btn-wrapper{
	font-size: 8px;
	width: 40px;
	text-align: center;
	padding: 6px 0 4px 0;
	border-bottom: 4px solid transparent;
	height: 100%
}
#bottom-bar .btn-wrapper.active{
	border-bottom: 4px solid var(--cor-detalhes);
}
#bottom-bar .btn{
	display: inline-block;
	text-align: center;
	width: 100%;
}
#bottom-bar .switch-button{
	background: transparent;
	border: none;
}
.left-bar-menu-button.bottom{
	height: 24px;
	display: inline-block;
	padding: 0px;
	margin: 0;
}
.left-bar-menu-button.bottom .spinner {
	background-color: var(--cor-botoes-barra-inferior);
}
#cookies-btn{
	padding: 10px;
	display: none;
	position: fixed;
	bottom: 8px;
	border-radius: 8px;
	background: var(--cor-barra-superior);
	color: var(--cor-barra-superior-texto);
	width: calc(100% - 16px);
	max-width: 480px;
	justify-content: center;
	gap: 16px;
	align-items: center;
	border: 1px solid white;
	z-index: 5;
	left: 50%;
	transform: translateX(-50%);
	box-shadow: 1px 1px 4px gray;
}
#cookies-btn span{
	display: block;
}
#cookies-btn a{
	color: var(--cor-barra-superior-texto);
	text-decoration: underline;
}
#cookies-btn button{
	background: white;
	padding: 8px;
	border-radius: 8px;
	color: black;
	font-weight: bolder;
	border: 1px solid var(--cor-barra-superior-linha-inferior-secundaria);
}
body > footer{
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 200px;
	transition: 0.3s;
	border-top: 1px solid var(--cor-footer-linha-superior);
	padding: 8px 8px 4px 8px;
	background-color: var(--cor-footer);
	color: var(--cor-footer-texto)
}
body > footer a{
	color: var(--cor-footer-texto)
}
body > footer .icon{
	font-size: 3.0rem;
}
body > footer .header{
	font-weight: bolder;
}
body > footer :is(.botoes-contatos, .botoes-localizacoes){
	display: flex;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
	color: var(--cor-footer-texto);
}
body > footer :is(.botoes-contatos, .botoes-localizacoes) .contato-titulo{
	display: none;
}
body > footer .botoes-localizacoes{
	align-items: center;
	gap: 8px;
	flex-direction: column;
}
body > footer .botoes-localizacoes .localização{
	margin: 0 8px;
}
body > footer .botoes-localizacoes .descricao{
	margin-top: 8px;
}
body > footer :is(.botoes-contatos, .botoes-localizacoes) .title{
	width: 100%;
	font-weight: bolder;
	margin-top: 10px;
}
body > footer .main :is(.botoes-contatos, .botoes-localizacoes) .contato{
	display: inline-flex;
	padding: 1px;
	background: white;
	padding-right: 8px;
	font-weight: normal;
	gap: 8px;
	align-items: center;
	border: 1px solid white;
	border-radius: 16px;
	color: var(--text-color);
}
body > footer .main :is(.botoes-contatos, .botoes-localizacoes) :is(.contato:hover, .contato:focus){
	color: var(--cor-detalhes);
}
body > footer :is(.botoes-contatos, .botoes-localizacoes) img{
	width: 30px;
	height: 30px;
	border-radius: 15px;
}
body > footer :is(.header, .main){
	text-align: center;
}
body > footer .main{
	font-size: 1.44rem;
	margin-top: 4px;
	margin-bottom: 24px;
	flex: 1;
}
body > footer .version{
	margin-left: auto;
	text-align: right;
	margin-left: 20px;
}
body > footer .footer{
	display: flex;
	justify-content: space-between;
	font-size: 1.28rem;
	max-width: 100%;
	width: 100%;
}
@media only screen and (max-width: 480px){
	footer .ai-chat-wrapper{
		position: fixed;
		display: flex;
		padding: 0;
		left: 0;
		bottom: var(--bottom-bar-height);
		top: calc(100vh - var(--bottom-bar-height));
		width: 100vw;
		background: white;
		align-items: center;
		transition: right .5s;
		justify-content: center;
		overflow: hidden;
		border-radius: 0;
		transition: top .2s linear;
		z-index: 10;
	}
	#bottom-bar .btn-wrapper.wrapper-ai-chat{
		width: 48px;
		height: 60px;
		margin-top: -12px;
	}
	.ai-chat-button-wrapper{
		display: block;
		width: 40x;
		height: 40px;
		margin: 0 auto;  
	}
	#ai-chat-switch:checked ~ footer .ai-chat-wrapper {
		top: var(--top-bar-compact-height);
	}

	body > footer :is(.botoes-contatos, .botoes-localizacoes){
		flex-direction: column;
	}
	#bottom-bar .active a *,
	#bottom-bar .focused button{
		color: var(--icon-color);
	}
	
	#contact-switch:checked ~ #bottom-bar .active * ,
	#menu-switch:checked ~ #bottom-bar .active *,
	#bottom-bar .active .not-focused * {
		color: var(--cor-botoes-barra-inferior);
	}
	#contact-switch:checked ~ #bottom-bar .btn.close *{
		color: var(--icon-color);
	}
	body > footer :is(.botoes-contatos, .botoes-localizacoes) .contato{
		margin: 0 auto;
		justify-content: center;		
	}
	#bottom-bar{
		display: flex;
	}
	#cookies-btn{
		bottom: calc(var(--bottom-bar-height) + 8px);
	}
	body > footer{
		padding-bottom: var(--bottom-bar-height);
	}
}
/*botoes*/
.frm-bts{
	overflow: hidden;
	display: flex;
	justify-content: right;
	flex-flow: row wrap;
	align-items: flex-start;
}
.frm-bt{
	cursor: pointer;
	text-align: center;
	color: white;
	overflow: hidden;
	display: block;
	width: 40px;
	height: 40px;
	padding: 8px;
	border-radius: 20px;
	margin: 0 0 0 16px;
}
.sub-menu .frm-bt{
	margin: 0 16px 0 0 !important;
	border: 1px solid lightgray;
}
.sub-menu{
	display: flex;
	width: 100%;
	justify-content: space-between;
	flex-flow: row wrap;
	align-items: flex-start;
}

.sub-menu .frm-bt:hover{
	color: black;
}
.inserir, .acessar, .editar, .salvar{
	background-color: #006600;
	border-color: #006600;
}
.cortar{
	background-color: orange;
	border-color: orange;
}
.novo{
	background-color: #0044AA;
	border-color: #0044AA;
}
.excluir{
	background-color: #950B02;
	border-color: #950B02;
}
.fechar{
	background-color: #00cccc;
	border-color: #00cccc;
}
.fechar:hover{
	color: #00cccc;
}
#listagem-de-categorias .button{
	text-align: center;
	width: 28px;
	height: 28px;
	font-size: 18px;
	padding: 4px;
	margin: 0 0 0 4px;
	border-radius: 20px;
	color: white;
	display: block;
}
#listagem-de-categorias .switch{
	background-color: gray;
	border-color: gray;
}
.complement-add{
	background: gray;
	margin: 0 0 0 auto;
	padding: 8px;
	display: block;
	height: 40px;
	width: 40px;
	color: white;
	text-decoration: none;
}
.search-header{
  background: white;
}
/*paginacao.*/
.lista .pagination:first-child{
	padding-bottom: 24px;
}
.lista .pagination:last-child{
	padding-top: 8px;
}
.pagination{
	text-align: center;
	background: white;
	overflow: hidden;
}
.pagination .button{
	display: inline-block;
	vertical-align: bottom;
	font-size: 16px;
	line-height: 18px;
	padding: 2px 8px;
	border-radius: 20px;
}
.pagination :is(.button:hover, .button.ativo){
	color: black;
	border-color: gray;
	text-decoration: underline;
}
.lista .proprietario .imagem{
	border-radius: 8px;
	overflow: hidden;
}
/*general*/
.lista > ul{
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 8px 0;
	background: white;
}
.lista .item{
	display: flex;
	overflow: hidden;
	background-color: white;
	margin: 0 2px;
	padding-bottom: 12px;
	border-bottom: 1px solid lightgray;
}
.lista .item:last-child{
	border-bottom: none;
}
.lista .perfil .img{
	border-radius: 8px;
	overflow: hidden;
	max-width: 128px;
}
.lista .no-results{
	margin: 20px 0;
	text-align: center;
}
.lista .item .imagem{
	max-width: 200px;
}
.lista .item.perfil .imagem{
	max-width: 150px;
}
.lista .item.perfil .descricao{
	font-size: 1.52rem;
	line-height: 2.048rem;
}
.lista .item > a{
	width: 100%;
	float: left;
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
}
.lista :is(.item:hover, .item:focus-within) .titulo{
	color: var(--icon-color);
}
.lista :is(.item:hover, .item:focus-within) .info .descricao{
	color: black;
}
.lista li:last-child{
	margin-bottom: 0;
}
.lista .titulo{
	font-weight: bolder;
	font-size: 1.8rem;
	line-height: 1.8rem;
	color: black;
}
.lista .img{
	max-width: 100%;
	height: auto;
}
.lista .imagem-media{
	margin-top: 8px;
	overflow: hidden;
	max-width: 680px;
	margin: 8px 1px 1px 1px;
}
.lista .subtitle{
	background: gray;
	color: white;
	padding: 8px;
	font-size: 14px;
}
.lista .info{
	display: flex;
	flex-direction: column;
	flex: 1;
	font-size: 14px;
	padding: 0 8px 4px 8px;
}
.lista .time-box{
	padding-top: 8px;
	margin-top: auto;
} 
.lista .preco-box{
	align-items: flex-end;
}
.lista .info .descricao{
	margin-top: 8px;
	white-space: pre-line;
	font-size: 1.6rem;
}
.lista .item.perfil .info{
	min-width: 150px;
}
.blocos img{
	margin: 0;
	flex: 1;
	max-width: 100%;
	max-height: 100%;
}
.blocos .item > a{
	width: 100%;
}
.blocos .texto{
	width: 100%;
}
.blocos .texto *{
	padding: initial;
	margin: initial;
	list-style-type: initial;
	text-decoration: initial;
	border: initial; 
}
.complementos .info{
	margin: 0 0 0 8px;
	flex: 1;
	font-size: 14px;
}
.complementos li{
	margin-top: 8px;
}
.lista .texto{
	margin-top: 8px;
}
:is(.lista, .v-list, .referencias) .preco-box{
	padding-top: 8px;
	margin-top: auto;
	font-family: Arial, Helvetica, sans-serif;
}
:is(.lista, .v-list, .slide, .referencias) .preco{
	color: var(--icon-color);
	font-weight: bolder;
	font-size: 2.8rem;
}
:is(.lista, .v-list, .slide, .referencias) .preco-antigo{
	text-decoration: line-through;
}
.lista .options{
	float: right;
	overflow: hidden;
}
.lista .frm-bt{
	background: gray;
}
.lista .frm-bt:hover{
	background: black;
}
.lista .frm-bt{
	width: 30px;
	height: 30px;
	padding: 5px;
	margin: 4px 0 0 4px;
	float: left;
	background: gray;
}
#sub-lista :is(.item-up, .item-down, .item-remove, .item-first){
	display: none;
}
.lista .options .material-icons{
	width: 20px;
	height: 20px;
	font-size: 20px;
}
.lista .total-resultados{
	display: block;
	padding: 2px;
	border-radius: 8px;
	font-size: 1.28rem;
	margin-top: 2px;
	margin-bottom: 4px;
	text-align: right;
	font-weight: lighter;
}
.lista .total-resultados span{
	font-size: 1.28rem;
	font-weight: bold;
}
@media only screen and (max-width: 680px){
	.search-header{
		margin-top: 8px;
	}
	#pesquisa .data-wrapper{
		background-color: white;
	}
	#filtros{
		padding: 8px;
		display: flex;
		gap: 8px;
		flex-wrap: wrap;
	}
	.lista :is(.item.publicacao, .item.pagina){
		width: fit-content;
		margin: 0 auto;
	}
	.lista :is(.item.perfil, .item.anuncio){
		width: calc(100% - 16px);
		margin: 0 8px;
	}
	.lista .item .imagem{
		max-width: 380px;
	}
	.lista :is(.anuncio, .perfil) a{
		display: flex;
		flex-wrap: nowrap;
	}
	.lista :is(.anuncio, .perfil) .imagem{
		max-width: 30%;
		min-width: 80px;
		margin: 0;
	}
	.lista :is(.anuncio, .perfil) .info{
		flex: 1;
	}
	.lista :is(.publicacao, .pagina, .proprietario) .info{
		max-width: 100%;
	}
	.lista :is(.anuncio, .perfil) :is(h3, p){
		text-align: left;
	}
	.lista :is(.anuncio){
		flex-direction: row;
	}
	.lista .img{
		width: 100%;
		max-width: 100%;
		max-height: 280px;
	}
	.lista :is(.publicacao, .pagina, .proprietario) > a{
		max-width: 380px;
		margin: 0 auto;
	}
	.lista :is(.publicacao, .pagina, .proprietario) .descricao{
		margin-top: 8px;
	}
}
@media only screen and (max-width: 480px){
	:is(.lista, .v-list, .slide, .referencias) .preco{
		font-size: 2.4rem;
	}
	.search-header{
		padding-top: 8px;
		margin-top: 0px;
	}
	.lista{
		padding: 8px 0;
		margin-top: 0;
		background: white;
	}
	.lista .info{
		padding: 8px 0 8px 8px;
	}
	.lista :is(.item.publicacao, .item.pagina){
		width: calc(100% - 16px);
		margin: 0 8px;
	}
	#filtros{
		justify-content: space-between;
	}
	.lista .item.anuncio .info{
		margin: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	.lista .item .info.info-skeleton{
		margin: 0;
	}
	.lista .capa-skeleton{
		width: 100px;
		height: 100px;
	}
	.lista .a-skeleton{
		width: calc(100% - 16px);
		margin: 0 auto;
	}
}
#home .galery{
  padding-top: calc(56.4% + 20px);
  position: relative;
  width: 100%;
  margin-top: 12px;
} 
#home .dados{
  margin-top: 0;
  padding-top: 0;
  border: none;
}
#home .capa{
  position: relative;
  overflow: hidden;
  display: block;
  width: 100%;
}
#home .capa .img{
  width: 100%;
  max-width: 100%;
  height: auto;
}
#home .animation{
  margin-top: 10px;
  margin-bottom: 8px;
}
#home .animation .frames{
  width: 100%;
  padding-top: 56.25%;
  background-image: var(--animacao-mask);
  background-size: cover;
  background-position: 0% 0%;
  transition: background-position;
  animation: addAnimate var(--animacao-time) steps(var(--animacao-frames)) forwards;
  animation-delay: .5s;
}
#home .capa .img-color{
  position: absolute;
  width: 100%;
  max-width: 100%;
  height: auto;

  -webkit-mask-image: var(--animacao-mask);;
  -webkit-mask-size: cover;
  -webkit-mask-position: 0% 0%;

  mask-image: var(--animacao-mask);
  mask-size: cover;
  mask-position: 0% 0%;
}
.capa-animation{
  transition: -webkit-mask-position;
  animation: addColor var(--animacao-time) steps(var(--animacao-frames)) forwards;
  animation-delay: .5s;
}
@keyframes addColor {
  0% {
    -webkit-mask-position: 0% 0%;
    mask-position: 0% 0%;
  }
  100%{
    -webkit-mask-position: 100% 0%;
    mask-position: 100% 0%;
  }
}
@keyframes addAnimate {
  0% {
    background-position: 0% 0%;
  }
  100%{
    background-position: 100% 0%;
  }
}
#home .slogan{
  margin: 2rem 0 3.2rem 0;
  text-align: center;
  opacity: 0;
}
#home .slogan span{
  display: inline-block;
}
.v-list .time-box{
  font-size: 1.4rem;
  display: flex;
  justify-content: right;
}
.slogan-animation{
  animation: showSlogan 1s forwards;
  animation-delay: calc(var(--animacao-time) + .5s);
}
@keyframes showSlogan {
  0%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}
#home .galery-wrapper.first{
  margin-top: 4px;
}
#home .galery-wrapper.no-subtitle .slide.publicacao .info{
  display: none;
}
#home .galery-wrapper.first .galery{
  margin: 0;
  border: none;
  border-top: none;
}
#home .galery-wrapper.first h2{
  display: none;
}
#home .galery-wrapper h2{
  display: flex;
}
#home > h1 {
  display: none;
}
#home > div:first-child{
  margin-top: 0;
}
#home .galery.single{
  padding-top: 56.25%;
}
#home .galery .display{
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}
#home .galery .slides{
  text-align: center;
  overflow: hidden;
  position: relative;
  background: white;
  height: calc(100% - 20px);
  border: 1px solid lightgray;
  border-radius: 8px;
}
#home .galery.single .slides{
  padding-top: 56.25%;
}
#home .galery .slide{
  transition: opacity 0.5s ease-in-out;
  position: absolute;
  display: flex;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  z-index: 0;
}
#home .galery .slide .img{
  width: auto;
  height: 100%;
}
#home .galery .slide picture{
  display: block;
}
#home .galery .slide.perfil .info,
#home .galery .slide.anuncio .info{
  flex: 1;
  text-align: left;
  margin-left: 8px;
}
#home .galery .slide.anuncio .info h3,
#home .galery .slide.perfil .info h3{
  font-size: 32rem;
}
#home .galery .slide.anuncio .info p,
#home .galery .slide.perfil .info p{
  margin-top: 1.6rem;
  font-size: 2.4rem;

}
#home .galery .slide .preco-box{
  margin-top: 20px;
}
#home .galery .slide .preco{
  font-size: 2.88rem;
}
#home .galery .slide.publicacao .info{
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  color: white;
  background: rgba(0, 0, 0, 0.4);
  text-align: left;
  padding: 0 4px 4px 4px;
}
#home .galery .slide.publicacao .info h3{
  margin-top: 4px;
  font-size: 1.6rem;
  color: white;
}
#home .galery .slide.publicacao .info p{
  margin-top: 4px;
  font-size: 2.048rem;
  font-weight: normal;
}
#home .galery .slide.active{
  opacity: 1;
  z-index: 1;
}
#home .galery .buttons{
  margin-top: 0px;
  height: 20px;
  text-align: center;
  position: relative;
  border: none;
}
#home .galery .buttons > div{
  transition: left 0.5s ease-in-out;
  position: absolute;
  display: inline-block;
  width: auto;
  white-space: nowrap;
  top: 0;
  left: 0;
  height: 100%;
  min-width: 100%;
}
#home .galery .bt-sl{
  display: inline-block;
  overflow: hidden;
  height: 20px;
  width: 20px;
  background: none;
  color: var(--text-color);
}
#home .galery .bt-sl.active{
  color: red;
}
#home .galery .bt-nav{
  display: none;
  position: absolute;
  background: none;
  top: 0;
  width: 6.4rem;
  height: 100%;
  z-index: 2;
  align-items: center;   
}
#home .galery .bt-nav span{
  font-weight: 900;
  color: white;
  display: flex;
  align-items: center;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.28);
  border-radius: 50px;
  width: 2.8rem;
  height: 2.8rem;
}
#home .galery .bt-nav span i{
  font-size: 2.4rem;
  margin-left: 2px;
}
#home .galery .bt-previus{
  left: 0;
  padding-left: 2px;
}
#home .galery .bt-next{
  justify-content: flex-end;
  right: 0;
  padding-right: 2px;
}
.v-list, .galery-wrapper{
  width: 100%;
  margin-top: 20px;
}
.v-list a{
  transition: .2s;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.v-list a:hover .titulo{
  color: var(--icon-color);
}
.v-list a:hover .descricao{
  color: black;
}
.v-list > div{
  margin-top: 8px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: stretch;
  gap: 12px;
}
div .time-box{
  padding-top: 2px;
  text-align: right;
}
.time-box > span{
  padding: 0 4px;
  flex-wrap: nowrap;
  flex-basis: fit-content;
}
.lista .time-box > span{
  padding: 0;
}
.time-box .proprietario-titulo{
  padding: 4px;
}
.v-list :is(h2, .h2-skeleton),
.galery-wrapper h2{
  display: flex;
  width: 100%;
  border-bottom: 1px solid lightgray;
  font-size: 1.92rem;
}
.v-list h2::before,
#home .galery-wrapper h2::before{
  content: "";
  display: block;
  float: left;
  width: 4px;
  background-color: var(--cor-detalhes);
  margin-right: 4px;
  height: 23px;
}
.v-list h3{
  font-size: 1.76rem;
  line-height: 1.76rem;
  margin-bottom: 4px;
}
.v-list :is(a, .a-skeleton){
  width: 328px;
  max-width: 100%;
  background-color: white;
  border: 1px solid lightgray;
  overflow: hidden;
}
.v-list :is(.a-skeleton){
  border: none;
}
.v-list .info{
  padding: 8px;
  width: 100%;
  margin-bottom: auto;
}
.publication-date{
  display: flex;
  margin-top: auto;
  font-size: 1.4rem;
  text-align: right;
  align-items: center;
  justify-content: flex-end;
  padding-top: 8px;
}
.publication-date i,
.proprietario-titulo i{
  font-size: 2rem;
  margin-bottom: -4px;
  margin-right: 2px;
}
.publication-date i{
  font-size: 1.8rem;
  margin-bottom: 0px;
}
.v-list a.anuncio{
  width: 216px;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
}
.v-list a.link{
  width: 160px;
  margin-bottom: 8px;
}
.v-list a.anuncio .info{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.v-list :is(a.publicacao, a.pagina) .info{
  padding: 8px 2px;
}
.v-list .perfil{
  text-align: center;
  padding-top: 8px;
  border: none;
  width: 210px
}
.v-list a.perfil p{
  white-space: pre-line;
}
.v-list a.proprietario{
  border-radius: unset;
  border: none;
}
.v-list :is(a.publicacao, a.pagina){
  border-radius: unset;
  border: none;
}
.v-list :is(a.publicacao, a.pagina, a.proprietario) .imagem{
  border: 1px solid lightgray;
}
.v-list .imagem{
  text-align: center;
  display: block;
}
.imagem{
  position : relative;
}
.imagem .video-icon{
  position: absolute;
  display: block;
  padding: 4px 12px;
  bottom: 2px;
  left: 2px;
  border-radius: 8px;
  background: #ff0000;
  color: white;
}
.slide .video-icon{
  position: absolute;
  display: block;
  padding: 4px 12px;
  top: 2px;
  right: 2px;
  border-radius: 8px;
  background: #ff0000;
  color: white;
}
#home .galery :is(.slide.perfil, .slide.publicacao,.slide.anuncio) .info h3{
  font-size: 2.048rem;
  margin-bottom: 0px;
}
#home .line-skeleton.path{
  margin: 0 0 12px 0;
}
@media only screen and (max-width: 900px){
  .v-list > div{
    gap: 12px 40px;
  }
  .v-list a.link{
    width: 200px;
  }
}
@media only screen and (max-width: 680px){
  .v-list h3{
    margin-bottom: 0;
  }
  .v-list .info{
    border-bottom: 0;
  }
  .v-list > div{
    margin-top: 8px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .v-list :is(a, .a-skeleton){
    margin: 0 auto 0 auto;
    width: 380px;
  }
  .v-list a.anuncio .imagem{
    width: 36%;
    float: left;
  }
  .v-list a.anuncio .info{
    margin-top: 0;
  }
  #home .galery .slide.publicacao .info h3{
    margin-top: 0;
  }
  #home .galery :is(.slide.perfil, .slide.anuncio) .info p{
    margin-top: 0.32rem;
    font-size: 1.6rem;
    font-weight: normal;
    line-height: 1.6rem;
  }
  .v-list :is(a.anuncio){
    width: 100% !important;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .v-list a.anuncio .info{
    flex: 1;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 480px){
  #home .galery .slides{
    border: none;
    border-radius: 0;
  }
  #home .galery .slide .preco{
    font-size: 2rem;
  }
  .v-list{
    margin-bottom: 8px;
  }
  .v-list:last-child,
  #right-bar .v-list:last-child{
    margin-bottom: 0;
  }
  .v-list :is(a.publicacao, a.pagina) .info{
    padding: 8px 2px 0 2px;
  }
  #home .capa-skeleton:first-child{
    margin-top: 8px !important;
  }
  #home .galery{
    margin-top: 8px;
  }
  #home .galery .display{
    background: var(--bold-border-color);
  }
  .galery-wrapper h2{
    padding-top: 0; 
  }
  .galery-wrapper :is(h2, .h2-skeleton){
    border: none;
    background: var(--bold-border-color);
  }
  .v-list :is(h2, .h2-skeleton){
    padding: 0;
    margin-bottom: 8px;
    border-bottom: 0;
  }
  #home .line-skeleton.path{
    margin: 0 0 12px 0;
  }
  #home .galery .slides{
    box-shadow: none;
  }
  #home .galery .slides.publicacao h3{
    font-size: 1.6rem;
  }
  .v-list{
    gap: 0;
  }
  .v-list :is(a, .a-skeleton){
    border-radius: unset;
    border: none;
    padding: 8px;
    width: 100%;
  }
  .v-list :is(h2, .h2-skeleton){
    padding-top: 0; 
  }
  #right-bar .v-list :is(a, .a-skeleton){
    margin: 0 0 8px 0;
    width: 100%;
  }
  .v-list ul{
    margin: 0 8px 0 8px;
    width: calc(100% - 16px);
  }
  .v-list a.link{
    max-width: calc(50% - 4px);
  }
}

i{
  max-width: 24px;
}
.postagem{
  overflow-x: hidden;
  width: 100%;
  padding: 0 0 8px 0;
  float: left;
  background: white;
  min-height: 580px;
}
.postagem .autor a{
  display: inline-block;
  background: white;
  padding: 4px;
}
.postagem .autor a .info span:first-child{
  font-weight: bolder;
  font-size: 1.28rem;
}
.postagem .autor a .info span:last-child{
  font-style: italic;
  font-size: 1.28rem;
}
.postagem .img-conteiner{
  width: 40px;
  height: 40px;
  float: left;
  overflow: hidden;
  border-radius: 20px;
}
.postagem .autor img{
  max-width: 40px;
  margin-top: -5px;
}
.postagem .autor .info{
  margin: 0 2px 0 8px;
  display: block;
  text-align: left;
  float: left;
}
.postagem h1{
  color: #3f3f42;
  font-size: 2.4rem;
  padding: 16px 0;
}
.postagem h2{
  font-weight: lighter;
  font-style: normal;
  font-size: 1.92rem;
  line-height: 2.88rem;
  padding: 12px 0 8px 0;
  margin-bottom: 8px;
  white-space: pre-line;
}
.postagem > h3{
  margin: 20px 0 20px 0;
}
.postagem p{
  font-size: 1.6rem;
  line-height: 3rem;
  padding: 12px 8px 0 4px;
  max-width: 600px;
}
.postagem table{
  margin: 12px 0 0 0;
  padding-bottom: 10px;
  display: block;
  height: unset !important;
  overflow-x: auto;
  overflow-y: hidden;
  border-spacing: 0;
  border-collapse: collapse;
}
.postagem table.time-table{
  margin-top: 0;
}
.postagem table p{
  padding: 2px 0;
}
.postagem .time-table-title{
  margin-top: 20px;
  display: block;
  font-weight: bold;
  border: 1px solid gray;
  border-width: 1px 1px 0 1px;
  padding: 4px;
  text-align: center;
}
.postagem tbody{
  display: table;
  width: 100%;
}
.postagem table :is(td, th){
  padding: 4px;
  text-align: center;
  border: 1px solid gray;
  min-height: 28px;
}
.postagem table :is(td, th):first-child{
  text-align: left;
}
.postagem .proprietario{
  border: 1px solid lightgray;
  padding: 4px;
  margin-top: 8px;
}
.postagem .proprietario a{
  display: flex;
  gap: 8px;
}
.post-body .ilustracao{
  padding-top: 12px;
}
:is(#publicacao, #pagina) .post-body h2:first-of-type{
  margin-top: 28px;
  margin-bottom: 28px;
  padding: 0 8px 0px 4px;
  border-left: 4px solid var(--cor-detalhes);
  font-size: 1.92rem;
  line-height: 2.56rem;
}
.postagem .proprietario a .info{
  flex: 1;
  display:flex;
  flex-direction: column;
}
.dados{
  padding: 8px 0 4px 0;
  overflow: hidden;
  min-height: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-end;
  border-bottom: 1px solid lightgray;
  justify-content: space-between;
  text-align: right;
}
.dados-wrapper{
  display: flex;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
}
.dados .data-e-hora{
  display: flex;
  flex-wrap: wrap;
  padding: 4px;
}
.dados .data-e-hora .clock{
  font-size: 1.92rem;
  vertical-align: middle;
}
.data-e-hora *{
  display: inline-block;
  vertical-align: middle;
  text-align: left;
  width: initial !important;
}
.data-e-hora div{
  display: inline-block;
}
.data-e-hora span{
  display: inline-block;
  cursor: pointer;
  white-space: nowrap;
  font-size: 1.28rem;
  line-height: 1.92rem;
  vertical-align: middle;
}
.data-e-hora i{
  font-size: 1.92rem;
}
.dados .label{
  font-size: 1.44rem;
}
.autor{
  width: 100%;
  text-align: right;
}
.compartilhamento .label{
  margin-right: 8px;
}
.compartilhamento{
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
  padding: 4px;
}
.compartilhamento *{
  font-size: 1.92rem;
  vertical-align: middle;
}
.compartilhamento span{
  font-size: 1.92rem;
}
.compartilhamento-bts{
  display: flex;
  flex: 1;
  justify-content: space-between;
  gap: 10px;
}
.postagem .img{
  width: 100%;
  height: auto;
}
.postagem > p a{
  color: #1a0dab;  
}
.postagem > p :is(a:hover, a:focus){
  text-decoration: underline;
}
.postagem > p a:focus{  
  outline: 2px dashed var(--main-color);
}
.postagem .referencias{
  background: #f2f2f2;  
  overflow: hidden;
  padding: 4px;
  font-style: normal;
}
.referencias .imagem .video-icon{
  position: absolute;
  display: block;
  padding: 2px 8px;
  bottom: 2px;
  left: 2px;
  border-radius: 4px;
  background: #ff0000;
  color: white;
}
.postagem .referencias .imagem{
  background: white;
  width: 25%;
  max-width: 200px;
  min-width: 100px;
  height: auto;
}
.postagem .referencias .perfil{
  border-radius: 9px;
}
.postagem .referencias .perfil .imagem{
  background: white;
  width: 32%;
  max-width: 120px;
  min-width: 100px;
  height: auto;
  border-radius: 8px;
  overflow: hidden;
}
.postagem .referencias .perfil p{
  font-size: 1.44rem;
  line-height: 1.92rem;
}
.postagem .referencias article{
  display: block;
  margin: 8px 0;
  font-size: 1.28rem;
  min-height: 40px;
}
.postagem .referencias :is(article:hover, article:focus-within) p{
  color: black;
}
.postagem .referencias a{
  display: flex;
  position: relative;
  background: white;
  border: 1px solid white;
  flex-wrap: wrap;
}
.postagem .referencias .info{
  display: flex;
  flex-direction: column;
  margin-left: 8px;
  padding-right: 4px;
  flex: 1;
}
.postagem .referencias .perfil .info{
  margin-top: 2px;
}
.postagem ul{
  padding: 12px 8px 0 0;
}
.postagem ul li{
  list-style-type: square;
  padding-top: 8px;
  margin-left: 22px;
}
.postagem .referencias > .titulo{ 
  padding-top: 0;
  color: black;
  font-weight: bold;
  margin: 4px 0;
  padding-left: 4px;
  border-left: 4px solid var(--cor-detalhes);
  font-size: 1.6rem;
}
.postagem .referencias p{
  font-size: 1.4rem;
  line-height: 1.6rem;
  padding: 4px 0;
}
.postagem .referencias.contatos p{
  font-size: 1.4rem;
  line-height: 2rem;
}
.postagem .referencias article h3{
  color: var(--text-color);
  margin-right: 90px;
  min-height: 28px;
  font-size: 1.6rem;
  display: flex;
  align-items: center;
}
.postagem .referencias.contatos .mail{
  word-break: break-all;
}
.postagem .referencias article p{
  color: var(--text-color);  
}
.postagem .referencias .perfil p{
  white-space: pre-line;
}
.postagem .referencias .ref-icon{
  position: absolute;
  right: 2px;
  top: 2px;
  padding: 4px 8px;
  color: white;
  fill: white;
}
.postagem .referencias .ref-icon > *{
  display: inline-block;
  line-height: 2rem;
  vertical-align: middle;
}
.postagem .referencias .ref-icon > span{
  font-size: 1.28rem;
  font-weight: bold;
}
.postagem .referencias :is(a:hover, a:active, a:focus){
  box-shadow: 0 0 4px gray;
}
.postagem .referencias.postagens .ref-icon{
  color: var(--icon-color);
}
.postagem .referencias.postagens :is(a:hover, a:active, a:focus){
  border-color: var(--icon-color);
}

.postagem .referencias.links .ref-icon{
  color: var(--icon-color);
  padding: 2px 0;
}
.postagem .referencias.links :is(a:hover, a:active, a:focus){
  border-color: var(--icon-color);
}
.postagem .referencias.arquivos .ref-icon{
  color: white;
  background: #007732;
  border-radius: 8px;
}
.postagem .referencias.arquivos :is(a:hover, a:active, a:focus){
  border-color: #007732;
}
.postagem .referencias.localizacoes article{
  border: 1px solid white;
  position: relative;
}
.postagem .referencias.localizacoes article > a{
  border: 1px solid white;
  flex-direction: column;
  justify-content: space-between;
}
.postagem .referencias.localizacoes .google-maps-msg{
  text-align: center;
}
.postagem .referencias.localizacoes :is(article:hover, article:focus-within, :active){
  color: black;
}
.postagem .referencias.localizacoes .ref-icon{
  background: #1a73e8;
  border-radius: 8px;
}
.postagem .referencias.contatos .ref-icon{
  background: var(--icon-color);
  border-radius: 8px;
}
.postagem .referencias.contatos a{
  border-radius: 10px;
}
.postagem .referencias.contatos img{
  border-radius: 8px;
}
.postagem .referencias.contatos :is(a:hover, a:active, a:focus){
  border-color: var(--icon-color);
}
.postagem .referencias.localizacoes :is(a:hover, a:active, a:focus){
  border-color: var(--icon-color);
}
.postagem .localizacoes article{
  margin-top: 16px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.postagem .localizacoes article .title{
  position: relative;
  margin-bottom: 12px;
  margin-right: 0;
  padding-right: 90px;
  font-size: 1.92rem;
  font-weight: bolder;
  width: 100%;
  display: block;
}
.postagem .localizacoes article p{
  padding: 0;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.postagem .localizacoes .mapa{
  float: right;
  width: 240px;
  height: 220px;
}
.postagem .localizacoes article > a{
  flex: 1;
  margin-left: 4px;
  padding-left: 4px;
}
.postagem .arquivos img{
  height: 80px;
  width: 80px;
}
.postagem :is(.ilustration, .video-conteiner, .referencias){
  display: block;
  margin: 12px 0;  
}
.postagem figcaption{
  padding: 8px;
  color: white;
  background: black;
  font-size: 1.28rem;
}
.postagem .video-conteiner{
  width: 100%;
  padding-bottom: 56.25%;
  position: relative;
}
.postagem .video-conteiner iframe{
  width: 100%;
  height: 100%;
  position: absolute;
}
.postagem > p{
  max-width: 580px;
}
.postagem tr:nth-child(odd) {
  background-color: rgb(247, 247, 247);
}
.postagem tr:first-child {
  font-weight: bold;
}
.postagem .fonte{
  text-align: right;
  margin: 0 0 0 auto;
}
.postagem .fonte a{
  color: white;
  text-decoration: underline;
}
.postagem figcaption > div{
  display: flex;
  justify-content: space-between;
}
.postagem figcaption p{
  padding: 0;
  font-size: 1.44rem;
  line-height: 1.4rem;
}
:is(#publicacao, #pagina) .capa{
  width: 100%;
  height: auto;
}
:is(#publicacao, #perfil, #pagina) .galery{
  padding-top: calc(56.25% + 80px);
  position: relative;
  width: 100%;
  margin-top: 12px;
  background: black;
}
:is(#publicacao, #perfil, #pagina) .galery .display{
  position: absolute;
  left: 10px;
  top: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
}
:is(#publicacao, #perfil, #pagina) .galery .slides{
  text-align: center;
  overflow: hidden;
  position: relative;
  height: calc(100% - 70px);
  width: 100%;
}
:is(#publicacao, #perfil, #pagina) .galery .slide{
  transition: opacity 0.5s ease-in-out;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0;
  z-index: 0;
}
:is(#publicacao, #perfil, #pagina).galery .slide figure{
  position: relative;
  display: block;
  max-height: 100%;
  max-width: 100%;
  margin: 0;
}
:is(.postagem) .galery .slide figcaption{
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 8px 4px 4px 4px;
  background: none;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.6));
  text-align: left;
  color: white;
  z-index: 2;
}
:is(.postagem) .galery .slide figcaption h3{
  color: white;
}
:is(#publicacao, #perfil, #pagina) .galery .slide.active{
  opacity: 1;
  z-index: 1;
}
:is(.postagem) .galery .buttons{
  height: 60px;
  text-align: center;
  overflow: hidden;
  margin-top: 10px;
  position: relative;
}
:is(.postagem) .galery .buttons > div{
  transition: left 0.5s ease-in-out;
  position: absolute;
  display: inline-block;
  width: auto;
  white-space: nowrap;
  top: 0;
  left: 0;
  height: 100%;
  min-width: 100%;
}
:is(#publicacao, #perfil, #pagina) .galery .slide .img{
  display: block;
  max-height: 100%;
  max-width: 100%;
  margin: 0 auto;
  height: auto;
  width: auto;
}
.postagem .galery .slide .img-full{
  display: none;
}
.postagem .galery .bt-sl{
  display: inline-block;
  overflow: hidden;
  height: 100%;
  border: 1px solid black;
  outline: none;
  margin: 0 2px;
}
.postagem .galery .bt-fs{
  position: absolute;
  border-radius: 8px;
  top: 10px;
  right: 10px;
  font-size: 3.2rem;
  width: 3.52rem;
  height: 3.52rem;
  color: white;
  background: none;
  z-index: 4;
  text-shadow: 0 0 2px black;
}
.postagem .galery :is(.bt-fs.open:hover, .bt-fs.open:focus){
  font-size: 3.52rem;
}
.postagem .bt-fs.open{
  display: block;
}
.postagem .galery .bt-fs.close{
  font-size: 3.52rem;
  display: none;
}
.postagem .galery :is(.bt-fs.close:hover, .bt-fs.close:focus){
  font-size: 3.4rem;
}
.postagem .galery .bt-sl.active {
  border-color: red;
}
:is(#publicacao, #perfil, #pagina) .galery .bt-sl img{
  height: 100%;
  width: auto;
}
:is(#publicacao, #perfil, #pagina) .galery .bt-nav{
  cursor: pointer;
  position: absolute;
  background: none;
  top: 0;
  width: 50%;
  text-shadow: 0 0 2px black;
  height: calc(100% - 20px);
  z-index: 2;
  font-size: 6.4rem;
  display: none;
  align-items: center;
  color: white;
  font-weight: bolder;
  opacity: 0.5;
  outline: none;
}
:is(#publicacao, #perfil, #pagina) .galery :is(.bt-nav:hover, .bt-nav:focus){
  opacity: 1;
}
:is(#publicacao, #perfil, #pagina) .galery .bt-previus{
  justify-content: left;
  left: 0;  
}
:is(#publicacao, #perfil, #pagina) .galery .bt-next{
  justify-content: flex-end;
  right: 0; 
}
:is(#publicacao, #perfil, #pagina) .galery .slide figure{
  height: 100%;
  display: flex;
  align-items: center;
}
:is(#publicacao, #perfil, #pagina) .galery .slide picture{
  height: 100%;
}
/**Full screen*/
:is(#publicacao, #perfil, #pagina) .galery.full-screen{
  padding-top: 0;
  width: 100%;
  height: 100%;
}
#wrapper .postagem .galery.full-screen .img-compact{
  display: none;
}
.postagem .galery.full-screen .img-full{
  display: flex;
  align-items: center;
}
:is(#publicacao, #perfil, #pagina) .galery.full-screen .slides{
  height: calc(90vh - 25px);
}
:is(#publicacao, #perfil, #pagina) .galery.full-screen .slides img{
  max-height: calc(90vh - 25px);
  max-width: calc(100vw - 20px);
}
:is(#publicacao, #perfil, #pagina) .galery.full-screen .buttons{
  max-height: 100px;
  height: 10vh
}
:is(#publicacao, #perfil, #pagina) .galery.full-screen .bt-fs.close{
  display: block;
}
:is(#publicacao, #perfil, #pagina) .galery.full-screen .bt-fs.open{
  display: none;
}
@media only screen and (max-width: 1240px){
  .postagem table{
    margin: 12px 0 0 0;
  }
}
@media only screen and (max-width: 680px){
  .proprietario .imagem{
    min-width: 120px;
  }
  .postagem{
    padding-top: 0;
  }
  .postagem .caixa-de-referencias a{
    padding: 4px;
  }
  .postagem .localizacoes .mapa{
    width: 100%;
  }
  .postagem .localizacoes article > a{
    margin: 8px 0 0 0;
  }
}
@media only screen and (max-width: 480px){
  .postagem .referencias .info{
    margin-left: 4px;
  }
  .postagem .proprietario{
    margin: 8px 0 0 0;
    padding: 0;
    border-width: 1px 0 1px 0;
  }
  .postagem .proprietario a{
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
  }
  .proprietario .time-box{
    text-align: left;
  }
  .postagem .proprietario .time-box > span{
    padding: 0;
  }
  .postagem .proprietario .imagem{
    border-radius: 0;
    max-width: 50%;
  }
  .postagem .referencias article p{
    margin-top: 0;
    padding-top: 0;
  }
  .postagem{
    padding-top: 8px;
  }
  .postagem table{
    margin: 12px 4px 0 4px;
    width: calc(100% - 8px) !important;
  }
  .postagem .referencias{
    margin-left: 4px;
    margin-right: 4px;
  }
  .postagem .referencias h3{
    font-size: 1.28rem;
  }
  .postagem .referencias p{
    font-size: 1.28rem;
  }
  .postagem .referencias :is(.publicacao, .pagina) p{
    display: none;
  }
  .postagem figcaption{
    font-size: 9.6rem;
    line-height: 1.28rem;
  }
}
@media (orientation: portrait){
  :is(#publicacao, #perfil, #pagina) .galery.full-screen .slides img{
    width: 100vw;
    object-fit: cover;
  }
}
.search-header details{
  width: 100%;
  padding: 4px 0 0 0;
}
details summary{
  cursor: pointer;
  text-align: right;
  padding: 0 4px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: right;
  color: gray;
  font-size: 1.2rem;
}
details summary i{
  display: inline-block;
  transition: transform .2s linear;
}
details[open] summary i{
  transform: rotate(-180deg);
}
#lista .dados{
  border-bottom: none;
}
.search-header details > div{
  margin-top: 10px;
  display: flex;
  gap: 8px;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
}
.proprietario-autor{
  margin-top: auto;
  text-align: right;
  color: black;
  font-weight: bold;
  border-top: 1px solid lightgray;
  font-size: 1.4rem;
  padding-top: 2px;
}
.proprietario-nome{
  display: flex;
  align-items: center;
  font-weight: bolder;
  font-size: 1.6rem;
  margin-top: auto;
  gap: 4px;
  justify-content: right;
}
#publicacao .capa{
  width: 100%;
  height: auto;
}
#publicacao .time-box{
  border: none;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}
#publicacao .proprietario .time-box{
  justify-content: left;
}
#publicacao .proprietario .time-box > span{
  padding: 0;
}
.referencias .publication-date{
  justify-content: left;
  font-size: 1.4rem;
}
.time-box1{
  border-left: 4px solid var(--cor-detalhes);
  padding-left: 4px;
}
details.time-details summary{
  margin-top: 12px;
  font-size: 1.6rem;
  justify-content: center;
  flex: 1;
}
#perfil .capa{
  margin-top: 16px;
  overflow: hidden;
  display: flex;
  max-width: 100%;
  flex-wrap: wrap;
  padding: 0 4px 8px 4px;
}
#perfil .capa picture{
  margin: 0 auto;
}
#perfil .capa img{
  border-radius: 8px;
  max-height: 340px;
  width: auto;
}
#perfil .capa .info{
  margin-left: 10px;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 218px;
}
#perfil .capa h1{
  padding-top: 0px;
  font-size: 2.88rem;
}
#perfil .capa h2{
  text-decoration: none;
  font-size: 2.24rem;
  line-height: 2.88rem;
  font-style: normal;
  flex:1;
}
#perfil .botoes-redes-sociais div{
  display: flex;
  justify-content: left;
  gap: 12px;
}
#perfil .botoes-redes-sociais a{
  font-size: 3.2rem;
}
@media only screen and (max-width: 515px){
  #perfil .capa .info{
    margin: 20px 0 0 0;
  }
  #perfil .capa h1{
    text-align: center;
    padding: 0;
  }
  #perfil .capa h2{  
    text-align: center;
  }
}
@media only screen and (max-width: 480px){
  #perfil .capa .info{
    margin: 20px 8px 0 8px;
  }
  #perfil .capa-skeleton{
    margin-top: 0;
  }
}
#pagina{
  
}

.chat-container {
  height:500px;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  padding: 8px;
  border-radius: 20px;
  font-size: 16px;
}
.btn-home-ai-chat{
  border: 1px solid #ccc;
  background-color: white;
  margin: 8px 0;
  border-radius: 50px;
  display: flex;
  align-items: center;
  padding: 4px;
  gap: 8px;
  height: 72px;
}
.btn-contacts-ai-chat{
  border: 1px solid #ccc;
  margin: 8px 0;
  border-radius: 50px;
  padding: 4px;
  align-items: center !important;
  gap: 8px;
  padding-right: 8px !important;
}
.btn-contacts-ai-chat-wrapper{
  align-items: flex-start;
  width: 40px;
  height: 40px;
}
.btn-home-ai-icon-wrapper{
  align-self: flex-start;
}
.ai-chat-wrapper.mobile{
  padding: 16px 8px;
  overflow-y: auto;
}
.mobile .chat-container{
  height: 100%;
  width: 100%;
  padding: 0; 
  border: 0;
}

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 10px;
  border: 1px solid #CCC;
  margin: 0 0 10px 0;
  border-radius: 12px;
}
.mobile .chat-messages{
  border: none;
  margin: none;
  border-radius: 0;
}
.chat-input-area {
  display: flex;
  align-items: center;
  padding: 8px;
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 50px;
}

.user-input {
  flex: 1;
  height: 40px;
  resize: none;
  padding: 5px;
  margin-right: 10px;
  margin-left: 10px;
  font-family: 'roboto';
  outline: none !important ;
  background: transparent;
  border: none;
}
.user-input:focus{
  border: 0;
}
.send-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  border-radius: 50%;
}

.send-btn:hover {
  background: #0056b3;
}

.chat-container .message {
  margin: 10px 0;
  padding: 12px 20px;
  border-radius: 22px;
  max-width: 80%;
  min-height: 20px;
  width: fit-content;
}

.chat-container .message p{
  padding: 0;
}

.chat-container .user-message {
  background: #007bff;
  color: white;
  margin-left: auto;
}

.chat-container .ai-message {
  background: #e9ecef;
  color: #333;
  margin-right: auto;
}
.chat-container .typing-indicator {
  display: flex;
  gap: 5px;
  padding: 6px;
}
.chat-container .dot {
  width: 10px;
  height: 10px;
  background-color: gray;
  border-radius: 50%;
  animation: blink 1.5s infinite;
}
.chat-container .dot:nth-child(2) {
  animation-delay: 0.2s;
}
.chat-container .dot:nth-child(3) {
  animation-delay: 0.4s;
}
.ai-chat-button-wrapper .ai-icon-action{
  animation: rotate 8s linear normal;
  transform-origin: 50% 50%;
}
.ai-icon-action{
  animation: rotate 8s linear infinite;
  transform-origin: 50% 50%;
  transition: 1s ease-out;
  animation-play-state: paused;
}
.ai-icon-action.rotating{ 
  animation-play-state: running;
}
.ai-icon-wrapper{
  display: flex;
  justify-content: center;
  padding: 8px;
}
.ai-disclaimer{
  font-size: 12px;
  text-align: center;
  color: gray;
  margin-top: 4px;
}
.mobile{
  display: none;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%; /* Expande até o tamanho total do texto */
  }
}
@keyframes blink {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}
@media only screen and (max-width: 480px){
  .mobile{
    display: flex;
  }
  .btn-home-ai-chat{
    margin: 8px 8px;
  }
}
#anuncio h1{
  padding-top: 0;
}
#anuncio .capa{
  margin: 8px 0 20px 0;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
#anuncio .publication-date{
  justify-content: flex-start;
  padding-top: 0;
  font-size: 1.4rem;
}
.bt-orcamento{
  margin-top: 8px;
  padding: 16px 8px;
  display: flex;
  align-items: center;
  background: #03c554;
  color: white;
  justify-content: center;
  border-radius: 8px;
  font-weight: bolder;
}
#anuncio .capa .info{
  margin-left: 8px;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 200px;
}
#anuncio .galery{
  padding-top: calc(50% + 70px);
  position: relative;
  display: block;
  width: 50%;
  background: white;
}
#anuncio .galery.single{
  padding-top: 50%;
}
#anuncio .galery .display{
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}
#anuncio .galery .slides{
  text-align: center;
  overflow: hidden;
  position: relative;
  height: calc(100% - 70px);
}
#anuncio .galery.single .slides{
  height: 100%;
}
#anuncio .galery .slide{
  transition: opacity 0.5s ease-in-out;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 0;
}
#anuncio .galery .slide figure{
  position: relative;
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
}
#anuncio .galery .slide.active{
  opacity: 1;
  z-index: 1;
}
#anuncio .galery .bt-sl{
  border-color: white;
}
#anuncio .galery :is(.bt-sl:focus, .bt-sl.active){
  border-color: red;
}
#anuncio .img-compact{
  display: inline-block;
  max-height: 100%;
  width: 100%;
  height: auto;
}
#anuncio .btn-quantidade{
  display: flex;
  border-radius: 8px;
  padding:4px;
}
#anuncio .btn-quantidade button{
  background-color: none;
  width: 40px;
  display:flex;
  justify-content: center;
  align-items: center;
}
#anuncio .btn-quantidade input::-webkit-outer-spin-button,
#anuncio .btn-quantidade input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#anuncio .btn-quantidade input{
  width: 40px;
  text-align: center;
  border: 1px solid lightgray;
  padding: 4px;
  margin: 0 4px;
}
#anuncio .galery .bt-sl img{
  height: 100%;
}
#anuncio .galery .bt-nav{
  cursor: pointer;
  display: none;
  position: absolute;
  background: none;
  top: 0;
  width: 50%;
  height: 100%;
  z-index: 2;
  align-items: center;
  color: white;
}
#anuncio .galery .bt-nav:hover{
  opacity: 1;
}
#anuncio .galery .bt-previus{
  justify-content: flex-start;
  left: 0;  
}
#anuncio .galery .bt-next{
  justify-content: flex-end;
  right: 0; 
}
#anuncio .galery .bt-nav div{
  display: flex;
  text-shadow: 0 0 2px black;
}
#anuncio .preco-box{
  margin-top: auto;
  width: 100%;
  padding-top: 8px;
  font-family: Arial, Helvetica, sans-serif;
}
#anuncio .preco-antigo{
  font-size: 1.6rem;
  color: gray;
  text-decoration: line-through;
}
#anuncio .preco{
  font-size: 3.2rem;
  color: var(--icon-color);
  font-weight: bolder;
  margin-top: 8px;
}
/**Full screen*/
#anuncio .galery.full-screen{
  padding-top: 0;
  width: 100%;
  height: 100%;
}
#anuncio .galery.full-screen .slides img{
  max-height: 88vh;
  max-width: 90vw;
  width: auto;
  height: auto;
}
#anuncio .galery.full-screen .slides{
  height: 90vh
}
#anuncio .galery.full-screen .buttons{
  height: 9vh;
  margin-top: 1vh
}
#anuncio .capa .galery .bt-fs{
  top: 5px;
  right: 5px;
}
#anuncio .galery.full-screen .bt-fs.close{
  display: block;
}
#anuncio .galery.full-screen .bt-fs.open{
  display: none;
}
#anuncio .galery.single.full-screen .slides img{
  max-height: 100vh;
  max-width: 100vw;
}
#anuncio .galery.single.full-screen .slides{
  height: 100vh
}
.postagens-referencidas a:hover p{
  text-decoration: underline;
}
.add-to-cart{
	padding: 8px;
	background: var(--icon-color);
	text-align: center;
	border-radius: 8px;
	color: white;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
  margin-top: 20px;
  border: 2px solid var(--icon-color);
}
.add-to-cart span{
  font-size: 1.6rem;
  text-align: center;
  font-weight: bolder;
  flex: 1;
}
.add-to-cart .btn-wrapper{
  display: block;
}
.add-to-cart .btn-wrapper :is(.loading-text, .added-text){
	display: none;
}
.add-to-cart.loading .loading-text{
	display: flex;
}
.add-to-cart.loading .btn-wrapper :is(.add-text, .added-text){
	display: none;
}
.add-to-cart.added{
  background: white;
  pointer-events: none;
}
.add-to-cart.added .added-text{
	display: flex;
  color: var(--icon-color);
}
.add-to-cart .btn-wrapper > *{
  width: 220px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}
.preco-apartir-de{
  font-weight: bold;
  font-size: 1.4rem;
  margin-bottom: 8px;
}
.anuncio-opcoes fieldset{
  display: flex;
  gap: 4px;
  margin: 16px 0;
  flex-wrap: wrap;
}
.anuncio-opcoes label{
  border-radius: 4px;
  padding: 4px;
  border: 1px solid gray;
  cursor: pointer;
}
.anuncio-opcoes input{
  display: none;
}
.anuncio-opcoes input:checked + label{
  border-color: var(--icon-color);
  color: white;
  background-color: var(--icon-color);
}
.display .slides picture{ 
  position: relative;
}
.anuncio-selo{
  position: absolute;
  padding: 4px 6px;
  right: 0;
  top: 0;
  color: white;
  font-size: 1.6rem;
  border-bottom-left-radius: 8px;
  background-color: #2196f3;
}
.galery .anuncio-selo{
  right: auto;
  left: 0;
  z-index: 4;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 0;

}
@media only screen and (max-width: 600px){
  #anuncio .capa .galery{
    width: 582px;
    padding-top: calc(100% + 70px);
    margin: 0 auto;
  }
  #anuncio .capa .info{
    margin: 20px 0 0 0;
  }
  #anuncio .capa h1{
    padding: 0;
  }
  #anuncio .capa .galery.single{
    padding-top: 100%;
  }
}
@media only screen and (max-width: 600px){
  #anuncio .capa .info{
    margin: 20px 8px 0 8px;
  }
  #anuncio .galery .bt-nav div i{
    font-size: 2.8rem;
    margin-right: 2px;
  }
}
@media only screen and (max-width: 480px){
  #anuncio .preco-box{
    margin-top: auto;
  }
  #anuncio .publication-date{
    padding-top: 4px;
  }
}
