@charset "utf-8";
/* CSS Document */

* {
	margin: 0;
	border: 0;
	padding: 0;
	box-sizing: border-box;

}

body {

	line-height: 1.6;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

}

@font-face {

	font-family: "Neonderthaw-Regular";
	src: url(../fontes/Neonderthaw-Regular.ttf);

}

@font-face {

	font-family: "TimelessMemoriesRegular-2vvwo";
	src: url(../fontes/TimelessMemoriesRegular-2vvwo.otf);

}

.principal-geral {

	width: 99%;
	height: auto;
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 0px;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 5px;

}

.menu-total {

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: left;
	width: 100%;

}

.aberto {

	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	background-color: rgba(183, 203, 253, 0.5);
	border-radius: 0px 0px 40px 40px;
	width: 100%;
	height: 70px;
	padding: 10px;
	gap: 10px;

}

.button-menu {

	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 30px 0px 30px 0px;
	list-style-type: none;
	width: 150px;
	height: 30px;
	border: #000 5px inset;
	cursor: pointer;

}

.button-menu:hover {


	height: 40px;
	border: #5188f0 5px inset;

}

.button-menu:active {


	height: 40px;
	border: #4365a5 6px inset;

}

.botao-menu {

	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba(183, 203, 253, 0.5);
	width: 100%;
	height: 8vh;
	gap: 90%;

}

.img-menu {

	width: 45px;
	height: 45px;
	border: #000 2px solid;

}

.span-menu {

	font-size: 30px;

}

.span-menu:hover {

	cursor: pointer;
	border: #000 2px solid;

}

.span-menu:active {

	cursor: pointer;
	border: #632424 4px solid;

}

.hr-menu {

	width: 30px;
	border: #000 3px solid;
	margin: 5px;

}

.cabecalho {

	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;

}

.imagem_cabecalho {

	width: 100%;
	border-radius: 10px;

}

.div-botoes {

	display: flex;
	width: 99%;
	gap: 75%;
	margin-bottom: 10px;
	margin-top: 10px;
	justify-content: center;

}

#btnn1 {

	display: flex;
	width: 150px;
	height: 50px;
	justify-content: center;
	align-items: center;
	border-radius: 100px;
	cursor: pointer;

}

#btnn2 {

	display: flex;
	width: 150px;
	height: 50px;
	justify-content: center;
	align-items: center;
	border-radius: 100px;
	cursor: pointer;

}

#btnn1,
#btnn2:hover {

	cursor: pointer;

}


.conteudo-slides {

	display: block;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 99%;
	height: 300px;

}

.div2 {

	display: grid;
	grid-template-columns: 30% 70%;
	grid-template-rows: repeat(3, 1fr);
	position: absolute;
	top: 0;
	left: 0;
	border: #2a467c 1px solid;
	border-radius: 10px 10px 10px 10px;
	opacity: 0;
	width: 100%;
	height: 100%;
	transition: width 4s, height 4s, opacity 4s ease-out;

}

.visivel {

	display: grid;
	grid-template-columns: 30% 70%;
	grid-template-rows: repeat(3, 1fr);
	border: #2a467c 1px solid;
	border-radius: 10px 10px 10px 10px;
	width: 100%;
	height: 100%;
	opacity: 1;
	z-index: 1;

}

.anuncio-imagem {

	grid-column: 1 / 2;
	grid-row: 1 / 4;
	height: 100%;
	border-radius: 10px;

}

.anuncio-cabecalho {

	grid-column: 2 / 3;
	grid-row: 1 / 2;
	height: 70px;
	font-size: 40px;
	align-content: center;
	font-family: Neonderthaw-Regular;
	color: #24096c;
	text-shadow: 0 0 5px #9c0863, 0 0 10px #9c0863, 0 0 20px #9c0863;

}

.anuncio-descricao {

	grid-column: 2 / 3;
	grid-row: 2 / 3;
	height: 150px;
	font-size: 20px;
	font-family: TimelessMemoriesRegular-2vvwo;
	align-content: center;
	text-align: center;
	padding: 10px;
	color: #3c7b97;
	text-shadow: 0 0 15px #3c7b97, 0 0 15px #3c7b97;

}

.anuncio-contato {

	grid-column: 2 / 3;
	grid-row: 3 / 4;
	height: 60px;
	font-size: 35px;
	color: #5fa724;
	text-shadow: 0 0 15px #5fa724, 0 0 15px #5fa724;

}

.conteudos {

	width: 100%;
	display: flex;
	justify-content: center;
	padding-top: 15px;
	gap: 10px;

}

.conteudo1 {

	width: 60%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

}

.destaque {

	width: 100%;
	height: 305px;
	position: relative;
	font-weight: bold;
	color: #ffffff;
	margin: auto;
	border-radius: 10px;
	background-size: cover;

}

.destaque_chapeu {

	position: absolute;
	top: 5px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.8);
	padding: 12px;
	height: auto;
	width: auto;
	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px
}

.destaque_titulo {

	position: absolute;
	bottom: 5px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.8);
	padding: 12px;
	height: auto;
	width: 98%;

	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px;

}

.conteudo2 {

	width: 40%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

}

.cardoso {

	width: 100%;
	height: 150px;
	position: relative;
	font-weight: bold;
	color: #fff;
	margin: auto;
	background-size: cover;
	border-radius: 10px;

}

.cardoso_chapeu {

	position: absolute;
	top: 5px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.8);
	padding: 12px;
	height: auto;
	width: auto;
	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px
}

.cardoso_titulo {

	position: absolute;
	bottom: 5px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.5);
	padding: 5px;
	height: auto;
	width: 98%;
	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px;


}

.hr1 {

	width: 100%;
	border: 2px solid #7e726c;
	margin-top: 10px;

}

.conteudos2 {

	width: 100%;
	display: flex;
	justify-content: center;
	gap: 10px;

}

.cabecalho_noticia {

	width: 100%;
	height: 50px;
	display: flex;
	flex-wrap: wrap;
	background: linear-gradient(45deg, #a9c0d5, #fff);
	justify-content: center;
	text-align: center;
	align-items: center;
	font-size: 30px;
	color: #000;
	border-radius: 10px;
	margin-top: 10px;
	border-bottom: 5px solid black;


}

.conteudo3 {

	width: 60%;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	text-align: center;

}

.noticia_antigas {

	width: 100%;
	height: 305px;
	position: relative;
	color: #fff;
	margin-top: 10px;
	border-radius: 10px;
	background-size: cover;

}

.noticia_antigas_img {

	width: 100%;
	height: 305px;
	position: relative;
	color: #fff;
	border-radius: 10px;
	background-size: cover;


}

.noticia_antigas_chapeu {

	position: absolute;
	top: 10px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.5);
	padding: 12px;
	height: auto;
	width: auto;
	font-weight: bold;
	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px
}


.noticia_antigas_titulo {

	position: absolute;
	bottom: 10px;
	left: 5px;
	text-align: left;
	background: rgba(0, 0, 0, 0.5);
	padding: 12px;
	height: auto;
	width: 98%;
	font-weight: bold;
	display: flex;
	text-align: left;
	align-items: center;
	border-bottom: 2px #0905f7 solid;
	border-radius: 10px;

}

.conteudo4 {

	width: 40%;
	height: auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;


}

.cabecalho_previsao_tempo {

	width: 100%;
	height: 50px;
	display: flex;
	flex-wrap: wrap;
	background: linear-gradient(45deg, #a9c0d5, #fff);
	justify-content: center;
	text-align: center;
	align-items: center;
	font-size: 30px;
	color: #000;
	border-radius: 10px;
	margin-top: 10px;
	border-bottom: 5px solid black;


}

.previsao_tempo {

	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
	text-align: center;

}

.iframe_previsao {

	width: 100%;
	height: 318px;

}

.cabecalho_economia {

	width: 100%;
	height: 50px;
	display: flex;
	flex-wrap: wrap;
	background: linear-gradient(45deg, #a9c0d5, #fff);
	justify-content: center;
	text-align: center;
	align-items: center;
	font-size: 30px;
	color: #000;
	border-radius: 10px;
	margin-bottom: 100px;
	border-bottom: 5px solid black;


}

.scene {
	width: 200px;
	height: 200px;
	perspective: 600px;
	/* Controla a profundidade da visão */
}

.cube {
	width: 100%;
	height: 100%;
	position: relative;
	transform-style: preserve-3d;
	transform: rotateX(20deg) rotateY(20deg);
	animation: spin 10s infinite linear;
}

.face {
	position: absolute;
	width: 200px;
	height: 200px;
	background: rgb(100 121 141 / 70%);
	border: 2px solid #fff;
	box-sizing: border-box;
}

.front {
	transform: rotateY(0deg) translateZ(100px);
}

.back {
	transform: rotateY(180deg) translateZ(100px);
}

.right {
	transform: rotateY(90deg) translateZ(100px);
}

.left {
	transform: rotateY(-90deg) translateZ(100px);
}

.top {
	transform: rotateX(90deg) translateZ(100px);
}

.bottom {
	transform: rotateX(-90deg) translateZ(100px);
}

@keyframes spin {
	from {
		transform: rotateX(360deg) rotateY(0deg);
	}

	to {
		transform: rotateX(360deg) rotateY(360deg);
	}
}

.propaganda_baixa {

	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 100px;
	margin-bottom: 5px;

}

.propagando_baixa_img {

	width: 250px;
	height: 250px;
	padding: 5px;
	border-radius: 35px;

}

.cabecalho_videos {

	width: 100%;
	height: 50px;
	display: flex;
	background: linear-gradient(45deg, #a9c0d5, #fff);
	border-bottom: #000 solid 5px;
	justify-content: center;
	text-align: center;
	align-items: center;
	font-size: 30px;
	color: #000;
	border-radius: 10px;
	margin-top: 15px;

}


.video {

	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

}

.video_video {

	width: 305px;
	height: 180px;
	padding: 5px;
	border-radius: 10px;

}

.editor {

	width: 100%;
	display: flex;
	justify-content: center;
	border-radius: 15px;
	border-bottom: #000 5px solid;
	margin-top: 10px;
	padding: 15px;
	background: linear-gradient(45deg, #a9c0a8, #fff);
}

.imagem_editor {

	width: 20vw;
	border-radius: 15px;
	border: #000 8px inset;

}

.paragrafo1 {

	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

}

.paragrafo2 {

	width: 100%;
	font-size: 25px;
	padding: 5px;
	text-shadow: #458194 0.3em 0.3em 0.2em;

}

.paragrafo3 {

	width: 100%;
	font-size: 20px;
	padding: 10px;
	text-shadow: #458194 0.3em 0.3em 0.4em;
}

.paragrafo4 {

	width: 100%;
	font-size: 40px;
	padding: 15px;
	text-shadow: #458194 0.3em 0.3em 0.4em;
}

.paragrafo5 {

	width: 100%;
	text-align: justify;
	padding: 10px;
	text-shadow: #458194 0.3em 0.3em 0.4em
}

.rodape {

	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 25px;
	padding-bottom: 25px;

}

.imagem_rodape {

	width: 100%;
	border-radius: 10px;

}

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

	.imagem_editor {

		width: 40%;

	}

}

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

	.aberto {

		height: 300px;
		border-radius: 5px;

	}

	.button-menu {

		width: 250px;
		height: 40px;

	}

	.botao-menu {

		gap: 75%;

	}

	.div-botoes {

		width: 100%;
		gap: 35%;
	}

	.conteudo-slides {

		display: block;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 99%;
		height: 300px;

	}

	.div2 {

		display: flex;
		flex-direction: column;


	}

	.anuncio-imagem {

		position: relative;
		top: 0;
		left: 5px;
		width: 120px;
		height: 120px;
		border-radius: 10px;

	}

	.anuncio-cabecalho {

		position: relative;
		top: 10px;
		align-content: center;
		font-size: 25px;


	}

	.anuncio-descricao {

		position: relative;
		top: 30px;
		font-size: 12px;
		
	}

	.anuncio-contato {

		position: relative;
		top: -220px;
		left: 60px;
		font-size: 25px;
		color: #5fa724;
		text-shadow: 0 0 15px #5fa724, 0 0 15px #5fa724;

	}

	.conteudos {

		flex-wrap: wrap;

	}

	.conteudo1 {

		width: 100%;

	}

	.destaque {

		height: 300px;
		
	}

	.destaque_chapeu {

		font-size: 15px
	}

	.destaque_titulo {

		font-size: 15px;

	}

	.conteudo2 {

		width: 100%;
		gap: 10px;

	}

	.cardoso {

		height: 300px;
	}

	.cardoso_chapeu {

		font-size: 15px;
	}

	.cardoso_titulo {

		font-size: 15px;
	}

	.conteudos2 {

		flex-wrap: wrap;

	}

	.conteudo3 {

		width: 100%;

	}

	.noticia_antigas {

		height: 300px;
	}

	.noticia_antigas_chapeu {

		font-size: 15px;

	}

	.noticia_antigas_titulo {

		font-size: 15px;

	}

	.conteudo4 {

		width: 100%;
	}

	.propagando_baixa_img {

		width: 250px;
		height: 250px;

	}

	.video_video {

		width: 350px;
		height: 160px;

	}

	.editor {

		flex-wrap: wrap;

	}

	.imagem_editor {

		width: 100%;
		height: 500px;

	}

	.paragrafo1 {

		flex-wrap: wrap;

	}

	.paragrafo2 {

		font-size: 20px;

	}

	.paragrafo3 {

		font-size: 20px
	}

	.paragrafo4 {

		font-size: 35px;

	}

	.paragrafo5 {

		font-size: 15px
	}

}