.banner{
	width: 100%;
	background-color: #000;
}
.banner img{
	width: 100%;
	object-fit: contain;
}
.bn-d{
	display: flex;
}
.bn-m{
	display: none;
}


.blog{
	width: 100%;
	background-image: url('../imagens/blog/bg.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	padding: 5% 0;
}
/* ----- COLUNA ----- */
.coluna{
	width: 24%;
	height: fit-content;
	border-radius: 20px;
	background-color: var(--verde);
	flex-direction: column;
	padding: 2%;
}
.coluna h2{
	color: #fff;
	font-size: 1.7vw;
	font-weight: 900;
	margin-bottom: 6%;
}
.coluna ul{
	width: 100%;
}
.coluna ul li{
	margin-bottom: 8%;
	display: flex;
	width: 100%;
    justify-content: space-between;
}
.coluna a{
	color: #fff;
	font-size: 0.85vw;
	font-weight: 500;
}
.coluna a span{
	color: #fff;
	font-size: 0.85vw;
	font-weight: 500;
}

.pesq{
	position: relative;
	width: 100%;
	margin-bottom: 7%;
	align-items: center;
}
.pesq input{
	width: 100%;
	height: 46px;
	border-radius: 10px;
	border: 1px solid #fff;
	background-color: transparent;
	color: #fff;
	font-size: 0.90vw;
	padding-left: 15%;
	font-weight: 500;
}
.pesq input::placeholder{
	color: #fff;
	font-size: 0.90vw;
	font-weight: 500;
}
.pesq input:-webkit-autofill,
.pesq input:-webkit-autofill:hover,
.pesq input:-webkit-autofill:focus,
.pesq input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #fff !important;
    font-size: 0.90vw;
}
.pesq button{
	position: absolute;
	left: 5%;
	display: flex;
	background-color: transparent;
	border: none;
	cursor: pointer;
	width: 6%;
    height: 100%;
    align-items: center;
}
.pesq button img{
	width: 100%;
}
.categ, .tag{
	margin-bottom: 10%;
}
.categ, .tag, .arqui{
	padding: 8%;
	border: 1px solid #fff;
	border-radius: 10px;
}
.tag ul{
	justify-content: space-between;
}
.tag ul li{
	width: unset;
	margin-right: 5%;
}

/* ----- CONTEUDO ----- */
.conteudo{
	width: 72%;
	margin-left: auto;
	align-content: baseline;
}
.conteudo-topo{
	position: relative;
	width: 100%;
	margin-bottom: 5%;
}
.conteudo-topo img{
	width: 100%;
	object-fit: contain;
}
.topo-text{
	display: flex;
	width: 92%;
	margin: 0 4%;
	position: absolute;
	bottom: 7%;
}
.topo-text h2{
	display: flex;
	width: 75%;
	font-size: 1.7vw;
	color: #fff;
	font-weight: 800;
}
.topo-text span{
	display: flex;
	width: 23%;
	color: #fff;
	font-size: 0.90vw;
	font-weight: 500;
	align-items: center;
	place-content: end;
}
.topo-text span img{
	width: 9%;
	margin-right: 0.5vw;
}
.conteudo-text1 p{
	color: #fff;
	font-weight: 400;
	line-height: 1.6;
}
.conteudo-text1 p span{
	font-size: 18px;
	color: #fff;
}
.conteudo-text1 p strong{
	color: #fff;
	font-size: 18px !important;
	font-weight: 700!important;
}
.conteudo-text1 p img{
	width: 100%;
}
.conteudo-text1 ol{
	list-style-position: inside;
}
.conteudo-text1 ol li{
	color: #fff;
	font-weight: 600;
	padding-bottom: 15px;
    padding-top: 15px;
    padding-left: 15px;
}
.conteudo-text1 ol li strong{
	color: #fff;
	font-size: 18px !important;
	font-weight: 700!important;
}
.conteudo-text1 ol li span{
	color: #fff;
	line-height: 1.6;
}

.conteudo-text2{
	width: 100%;
	margin-bottom: 2%;
	background-color: var(--verde);
	padding: 2% 4%;
	border-radius: 10px;
}
.conteudo-text2 p{
	color: #fff;
	font-size: 0.9vw;
	font-weight: 600;
	line-height: 1.5;
}
.conteudo-text2 p span{
	color: #fff;
	font-size: 0.9vw;
	font-weight: 700;
}
.conteudo-img{
	width: 100%;
	margin: 3% 0 2%;
}
.conteudo-img .img1{
	width: 60%;
	margin-right: auto;
}
.conteudo-img .img2{
	width: 37%;
}
.conteudo-text3{
	width: 100%;
	margin-bottom: 2%;
}
.conteudo-text3 p{
	color: #fff;
	font-size: 0.83vw;
	font-weight: 500;
	line-height: 2;
}

.tags-share{
	width: 100%;
	background-color: #fff;
	padding: 4%;
	border-radius: 10px;
	margin-top: 50px;
}
.tags{
	width: 60%;
	display: flex;
	margin-right: auto;
	align-items: center;
}
.tags h3{
	color: #383838;
	font-size: 1vw;
	font-weight: 700;
	width: fit-content;
	margin-right: 0.5vw;
}
.tags ul{
	width: 100%;
}
.tags ul li{
	display: flex;
	margin-right: 0.4vw;
}
.tags ul li a{
	color: #383838;
	font-size: 0.90vw;
	font-weight: 500;
}
.share{
	width: 28%;
	display: flex;
	place-content: flex-end;
	align-items: center;
}
.share h3{
	color: var(--verde);
	font-size: 1vw;
	font-weight: 800;
	width: unset;
	margin-right: 0.5vw;
}
.share ul{
	width: 100%;
	place-content: end;
}
.share ul li{
	display: flex;
	margin-left: 1vw;
}




/* MEDIA DESKTOP */
@media screen and (max-width: 1600px){
	.pesq input{
		height: 40px;
	}
	.share{
		width: 29%;
	}
}

@media screen and (max-width: 1440px){
	.pesq input{
		height: 35px;
	}
	.share{
		width: 30%;
	}
	.conteudo-text1 p span, .conteudo-text1 p strong, .conteudo-text1 ol li, .conteudo-text1 ol li span{
		font-size: 18px;
	}
}

@media screen and (max-width: 1366px){
	.share{
		width: 31%;
	}
	.conteudo-text1 p span, .conteudo-text1 p strong, .conteudo-text1 ol li, .conteudo-text1 ol li span{
		font-size: 18px;
	}
}

@media screen and (max-width: 1280px){
	.pesq input{
		height: 30px;
	}
	.conteudo-text1 p span, .conteudo-text1 p strong, .conteudo-text1 ol li, .conteudo-text1 ol li span{
		font-size: 18px;
	}
}

@media screen and (max-width: 1024px){
	.pesq input{
		height: 25px;
	}
}

/* MOBILE */
@media screen and (max-width: 768px){

}

@media screen and (max-width: 480px){
	.bn-d{
		display: none;
	}
	.bn-m{
		display: flex;
	}

	.blog{
		padding: 10% 0;
	}
	.conteudo{
		width: 100%;
		margin-bottom: 10%;
	}
	.topo-text{
		flex-wrap: wrap;
	}
	.topo-text h2{
		font-size: 4.5vw;
		width: 100%;
		margin-bottom: 5%;
	}
	.topo-text span{
		font-size: 3vw;
		width: 100%;
	}
	.topo-text span img {
    	width: 5%;
    	margin-right: 1.5vw;
	}
	.conteudo-text1 p span, .conteudo-text1 p strong, .conteudo-text1 ol li, .conteudo-text1 ol li span{
		font-size: 16px;
		line-height: 1.5;
	}
	.tags-share{
		margin: 10% 0;
	}
	.tags{
		width: 100%;
		flex-wrap: wrap;
		margin-bottom: 5%;
	}
	.tags h3{
		font-size: 5vw;
		width: 100%;
		margin-bottom: 3%;
	}
	.tags ul li a{
		font-size: 4vw;
	}
	.share{
		width: 100%;
		place-content: flex-start;
	}
	.share h3{
		font-size: 5vw;
	}
	.share ul{
		width: 60%;
		place-content: flex-start;
	}
	.share ul li{
		margin-left: 8vw;
	}

	.coluna{
		width: 85%;
		margin: 0 auto;
		order: 1;
		padding: 5%;
	}
	.pesq input, .pesq input::placeholder {
    	height: 45px;
    	font-size: 3.5vw;
	}
	.coluna h2{
		font-size: 6vw;
	}
	.coluna a, .coluna a span{
		font-size: 3.5vw;
	}
}

@media screen and (max-width: 400px){

}

@media screen and (max-width: 375px){

}